上午圖表極性散點圖

Question

有誰知道如何在使用一系列圖表時更改AM圖表上每個數據集的顏色？

我正在創建風速vs方向圖，我需要使用類別字段作爲數字編號，以便我可以將這些值繪製爲座標。

我的圖表工作，但我也想改變依賴於閱讀幾歲了每個數據系列的顏色。

我準備好了我的數據集和我想用作系列中第三個值的顏色。我只是無法弄清楚如何讓AM Charts以不同顏色加載每個值。

下面是我對圖形代碼：

var chart = AmCharts.makeChart("chartdiv", { 
"type": "radar", 
"theme": "light", 
"dataProvider": [], 
"valueAxes": [{ 
"gridType": "circles", 
"minimum": 0 
}], 
"startDuration": 1, 
"polarScatter": { 
"minimum": 0, 
"maximum": 3600, 
"step": 1 
}, 
"legend": { 
"position": "right" 
}, 
"graphs": [{ 
"title": "Wind Speed M/S Max", 
"balloonText": "[[value]] m/s", 
"bullet": "square", 
"lineAlpha": 0, 
"series": [[3011,4.1,'#000000'], 
[434,2.3,'#080808'], 
[656,2.5,'#101010'], 
[2853,4.4,'#181818'], 
[3192,4,'#202020'], 
[3030,3.8,'#282828'], 
[359,4.1,'#303030'], 
[680,2.1,'#383838'], 
[168,3.3,'#404040'], 
[3362,3.1,'#484848'], 
[3363,3.2,'#505050'], 
[258,3.8,'#585858'], 
[678,5.8,'#606060'], 
[3447,6.7,'#686868'], 
[3348,4.4,'#707070'], 
[3424,5.1,'#787878'], 
[2897,7.8,'#808080'], 
[784,6.3,'#888888'], 
[960,3.7,'#909090'], 
[882,5.5,'#989898'], 
[781,6,'#A0A0A0'], 
[1215,4.7,'#A8A8A8'], 
[1416,6,'#B0B0B0'], 
[1490,4,'#B8B8B8']] 
}] 
}); 

感謝

馬特

Answer 1

此功能目前並不在Polar Scatter plugin中存在，但是你可以做一個小的修改插件要添加此功能，如下所示：

// modified version of the polar scatter plugin that allows individual point coloring 
AmCharts.addInitHandler(function(chart) { 

    // check if polar scatter is enabled 
    if (chart.polarScatter === undefined) 
     return; 

    // check if everything is set 
    chart.categoryField = chart.categoryField || "angle"; 
    chart.polarScatter.minimum = chart.polarScatter.minimum || 0; 
    chart.polarScatter.maximum = chart.polarScatter.maximum || 359; 
    chart.polarScatter.step = chart.polarScatter.step || 1; 

    // check if axisFrequency is set 
    if (chart.valueAxes === undefined) 
     chart.valueAxes = [ {} ]; 

    if (chart.valueAxes[ 0 ].axisFrequency === undefined) 
     chart.valueAxes[ 0 ].axisFrequency = Math.ceil((chart.polarScatter.maximum - chart.polarScatter.minimum)/12); 

    // init empty data provider 
    var data = [], 
     dpoints = {}; 
    for (var i = chart.polarScatter.minimum; i <= chart.polarScatter.maximum; i += chart.polarScatter.step) { 
     dpoints[ i ] = {}; 
     dpoints[ i ][ chart.categoryField ] = i; 
     data.push(dpoints[ i ]); 
    } 

    for (var g = 0; g < chart.graphs.length; g++) { 
     var graph = chart.graphs[ g ]; 
     graph.valueField = graph.valueField || "value" + g; 
     graph.colorField = graph.colorField || "color" + g; //add for setting colors per point 
     if (graph.series !== undefined) { 
      for (var i = 0; i < graph.series.length; i++) { 
       var dp = graph.series[ i ]; 
       if (dpoints[ dp[ 0 ] ] !== undefined) { 
        dpoints[ dp[ 0 ] ][ graph.valueField ] = dp[ 1 ]; 
        if (typeof dp[ 2 ] === "string") { //if the third element in the series contains a string, assign it to the color field 
         dpoints[ dp[ 0 ] ][ graph.colorField ] = dp[ 2 ]; 
        } 
       } 
      } 
     } 
    } 

    // add data provider 
    chart.dataProvider = data; 

}, [ "radar" ]); 

這是一個demo，它使用您的圖表代碼和數據。