分級資訊

匯出分級資訊

本項目主要說明匯出「分級資訊」之做法，可將分級資訊以陣列方式輸出。
其做法依序為：

1.     繪製統計圖表，且其Function callback (result)包含繪製結果，並建立一div放置資訊

      Map.drawMap(function (result){

          var statView = document.getElementById("statView");

2.     設計迴圈以取得所有分級資訊。以面量地圖為例，根據規格書內容，其function(result)是由
int classes, string color, number minValue, number maxValue, int count 等參數建立成
choroLegend，因此我們以result.pieLegend的長度作為迴圈長度，逐項取得所有分級資訊

           var txt = '<table style="width:100%; border: 1px solid black; border-collapse: collapse;" border="1">';

                           //建立表格, 作為承接所有分級資訊使用

           txt += '<tr  style="font-weight: bold; height: 40px;"><td align="center" style="width: 80px;">

分級圖例</td><td td align="center" style="width: 100px;">分級區間</td><td  align="center"

 style="width: 70px;">數量</td></tr>'                        //設定欄位標題

           var ttt;                                                     //宣告一個變數, 準備於迴圈中個別承接分級資訊

           //使用result.choroLegend的長度作為迴圈長度, 個別取得所有分級資訊

           for (var i = 0; i < result.choroLegend.length; i++) {

                   ttt = result.choroLegend[i]                          //逐項取得分級資訊

3.     以html語法組成表格，將所需之資訊項寫入

                        txt += '<tr style="height: 35px;"><td align="center">';

                        txt += '<span style=\"padding: 5px;background-color:' + ttt.color + '\">&nbsp;&nbsp;&nbsp;&nbsp;

                                   &nbsp;</span></td><td align="center" >&nbsp;' + ttt.minValue + ' ~ ' + ttt.maxValue + '</td>

                                   <td align="center" >  ' + ttt.count + '<br>';

                        txt += '</td></tr>';            //從各個分級資訊中將分級的配色, 最小值, 最大值, 數量取出後, 組入表格

           }

           txt += '</table>'; 

4.     將獲得資訊寫入div中

           document.getElementById("statView").innerHTML = txt;       //在div "statView"中寫出所有分級資訊