圖例配色資訊

匯出圖例配色資訊

本項目說明匯出「圖例配色」之做法，可將圖表圖例配色資訊以陣列方式輸出。

其做法依序為：

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

  Chart.drawChart(function (result){

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

2.      以圓餅圖為例，根據規格書內容，其function(result)是由string pieName, string color
兩參數建立成pieLegend，因此我們以result.pieLegend的長度作為迴圈長度，逐項取得所有配色資訊

           var txts = '';                            //建立空字串, 作為承接所有配色資訊使用

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

           //使用result.pieLegend的長度作為迴圈長度, 個別取得所有圓餅圖配色資訊

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

                   ttt = result.pieLegend[i]       //逐項取得配色資訊

3.      之後將所需之資訊項取出，以html語法組成字串

var txt = '<span style=\"background-color:' + ttt.color + 
                   '\">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>&nbsp;' + ttt.pieName +'<br>';
                   //從各資訊中將分類的配色(color)及行政區名稱(pieName)取出後, 組合為字串

                   txts += txt;      //將組合好的字串加入空字串txts中

           }

4.      最後將獲得資訊寫入div中

           document.getElementById("statView").innerHTML = txts;      //在div "statView"中寫出所有配色資訊

   });