統計地圖API範例網站

統計地圖API範例網站目前已全面將API版本更新為「V4.0」版，服務連結功能依循107年開發項目，原有統計地圖API V3.0版功能不受版本更新之影響仍可正常使用。

什麼是統計地圖API?

用視覺化的方式呈現統計資訊

相較於傳統文字記錄或表格資料，統計圖表在視覺傳達上的優勢不言而喻。當生硬的統計數據被轉化為圓餅圖、折線圖，
人們能更直觀地感受到數值之間的相對關係，或是資料隨著時間起伏的趨勢等等。統計地圖不僅承接了一般統計圖表將資
料視覺化的優點，更揭露某些傳統圖表無法偵測到的空間議題。

過去，若要繪製統計地圖，使用者須自備資料、GIS(地理資訊系統)軟體，甚至GIS伺服器。除了技術門檻高，資料的更新
與維護上所需要耗費的資源更是可觀。有鑑於此，內政部統計處提供統計地圖API，讓網頁開發者可使用JavaScript語法
輕鬆繪製統計地圖或圖表，並且嵌入html網頁中。

善用國內最完整的社會經濟資料庫

「國土資訊系統社會經濟資料庫資料服務平台」為國內社會經濟資料流通供應的單一窗口。統計處為滿足統計地圖API對
於資料規格的嚴格要求，特別將資料重新整理，將資料代碼發布至「API應用資料庫查詢」介面供介接者使用。使用者可
以直接使用免申請的資料項目，亦可透過申請取得其他資料進行統計圖表與地圖的繪製。同時，統計地圖API亦提供使用
者上傳自有資料的功能。

如何使用統計地圖API?

此範例網站包含完整的API功能說明，從資料的匯入、篩選、設定到匯出，皆有詳細的範例可供參考，使用者可以依照需
求逐步建構出自己的統計地圖或圖表。若使用者在開發上有較進階的需求，本網站亦提供進階範例供使用者直接參考、修
改參數進行加值運用。

以下範例程式碼為統計地圖API的基本範例，讓使用者以民國102年６月縣市醫療院所數量資料，繪製統計地圖(面量圖)。
透過這個範例，使用者將更能掌握統計地圖API的基本架構。

<html>

<head>

<title>統計地圖API基本範例</title>

var dataDB;

function init() { //初始化統計地圖物件

var dataSet = new Array();

var tmp = {tableName: "327FI_A5C1",fieldsId: ["H_CNT"]};　//呼叫社經資料庫資料

dataSet.push(tmp);

//設定統計資料之時序及空間範圍

var timeOpts = {timeSeries: true,time: ["102Y06M"]}

var dataOption = {dataType:DataType.ADMIN, timeOpts:timeOpts, dataLevel:DataLevel.COUNTY}

var areaSelect = {areaSelectType:AreaSelectType.DISTRICT, districtType:DistrictType.ALL};

dataDB = new DataDB(dataSet, dataOption, CoordSystem.EPSG3826, areaSelect); //設定資料物件

DrawStatMap(dataDB); //執行統計地圖(面量圖)繪製指令

}

function DrawStatMap(data) { //設定統計地圖(面量圖)繪製參數

var mColor = {maxColor: "#7c0505", minColor: "#ffb9b9", defaultColor: "#EEEEEE"};

var pChoropleth = {classifyMethod:ClassifyMethod.QUANTILE, classes:5, color:mColor, useInt: true};

var option = {pChoropleth:pChoropleth};

var containerObj = document.getElementById("MapView"),

var Map = new StatMap(containerObj, data,MapKind.CHOROPLETH, option);

Map.drawMap(function (result){}); //繪製統計地圖(面量圖)

}

</script>

</head>

<font size="4" face="Microsoft JhengHei">102年6月-行政區縣市醫療院所家數統計</font><br/>

<font size="4" face="Microsoft JhengHei">（資料來源：統計地圖API應用資料庫）</font><br/>

</body>

</html>

以上程式碼為基本的html架構，在<html>頁籤中包含了<head>與<body>頁籤。

這個範例在<head>頁籤中嵌入<script type="text/javascript">語法呼叫統計地圖API，並且使用API功能定義了兩個方
法：一個是初始化統計地圖物件，function init()；另一個是設定統計地圖參數的方法，function DrawStatMap(data)。

在網址中，必需帶入API金鑰參數，請將引用字串http://segisapi.moi.gov.tw/StatAPI/statistics?appid=yourID&apikey=yourkey
中的yourID及yourkey替換為您申請所取得的API金鑰，包含APPID及APIKEY，方能順利驗證載入功能。

在初始化地圖物件方法中，本範例使用社會經濟資料庫之資料表（tableName: "327FI_A5C1",fieldsId: ["H_CNT"]），呼叫資
料庫中醫療院所數量資料，之後再依序設定資料時間與空間範圍，最後使用執行繪製統計地圖的指令。

在設定統計地圖參數方法中，本範例選擇繪製的統計地圖類型為面量圖(MapKind.CHOROPLETH)，並且繪製面量圖所需之
參數，例如：分級數、色階等等。詳細設定方法請參照繪製類型設定-統計地圖段落。

最後在<body>使用onload事件觸發<head>頁籤定義的init()方法，並定義網頁容器頁籤<div id="MapView">，供繪
製後的統計地圖放置用。