統計地圖-柱狀圖
繪製統計地圖-柱狀圖
本項目將針對統計地圖之「柱狀圖」呈現方式做詳細之參數設定介紹,可設定之參數有:
1. 最大柱高設定
單位為pixel,若未設定則系統將自動計算適合大小後套用。
2. 柱寬設定
單位為pixel,若未設定則系統將自動計算適合大小後套用。
3. 配色設定
以陣列方式輸入16進位RGB(#RRGGBB)格式之配色集合,輸出之柱狀圖將依照配色
集依序填入各個資料柱。若未設定則系統將自動進行配色。
4. 顯示詳細圖表設定
是否在互動式訊息視窗中顯示詳細圖表,預設為false。
程式碼如下:
function DrawStatMap(data) { //統計地圖繪製
var pHeight = document.getElementById("maxHeight").value;
var pWidth = document.getElementById("maxWidth").value;
var pColorA = document.getElementById("ColorA").value;
var pColorB = document.getElementById("ColorB").value;
var pColorC = document.getElementById("ColorC").value; //可互動式參數設定
var pBar = {
maxHeight: pHeight, //設定最大柱高
barWidth: pWidth, //設定最大柱寬
chartView: document.getElementById("chartView").checked,
//設定顯示詳細圖表
color: [pColorA, pColorB, pColorC] //設定柱狀圖配色
};
var Map = new StatMap(containerObj, data, MapKind.BAR, option); //繪製統計地圖
Map.drawMap(function (result){});
}