行政區層級下探

行政區層級下探

 

在本範例中,我們將揀選單一統計產品但同時具有不同空間單元層級之資料,來進行資料下探功
能的開發。範例中我們選用「行政區國民小學統計」產品代碼:AA9FE_A4C3
作為範例資料,

由於此產品同時具有縣市及鄉鎮市區兩種空間統計單元層級的統計資料,所以可以用來開發資料
下探的操作。當使用者實際操作本範例時,可先繪出全國各縣市的縣市層級統計面量圖,再使用
下拉式選單選擇單一縣市之後,得到該縣市鄉鎮市區層級的統計面量圖,完成空間層級下探的操
作。

 

建立縣市下拉式選單:

在使用者完成繪製縣市層級的統計面量圖後,網頁中將隨即出現一個下拉式選單供使用者選取要
進行下探操作的縣市名稱,因此在網頁介面中我們必須預先建立好該選單,以<div>標籤內嵌一個
<select>
物件的方式來建立。

 

<div style="background-color:White;border:1px solid #aaaaaa; display:none; top:5px; left:5px; 
position:absolute; padding:5px;"
 id="downRegion">

     請選擇鄉鎮:

     <select id="pRegionCode" class="items_selectOption"onchange= "changeDownRegion(this.value);" 
style="width:120px;">

          <option value="63000">臺北市</option>

          <option value="65000">新北市</option>

          <option value="10017">基隆市</option>

          <option value="10003">桃園縣</option>

          <option value="10018">新竹市</option>

          ......

 

目前<div>介面是屬於不顯示的狀態display:none;),當縣市層級的統計地圖繪製完成後,可
透過Javascript指令,將div改為顯示的狀態。

 

document.getElementById("downRegion").style.display= "";

 

選單連動鄉鎮市區層級統計圖繪製動作:

當使用者在下拉式選單中選取一個縣市之後,我們可以透過<select>內的onchange設定來執行
Javascript
程式中的
changeDownRegion()函式,並且將選項的value值,也就是行政區代碼送
入函式中,透過重新指定統計地圖繪製層級並重繪統計地圖後,得到指定縣市的鄉鎮市區層級統
計地圖。

 

function changeDownRegion(val) {

     //取得縣市代碼並設定為行政區篩選值

     myMap.getStatData().select.districtCode =getMultiOpts(document.getElementById("pRegionCode"));

     myMap.getStatData().select.districtType =DistrictType.COUNTY //將行政區篩選層級設定為縣市

     myMap.getStatData().option.dataLevel =DataLevel.TOWN;            //將統計空間單元層級設定為鄉鎮市區

     drawStatMap(true);      //重新繪製統計地圖

}

 

 

回到上方