1

Dojo 1.4で縦棒グラフを生成していますが、しきい値に関連して表される値に基づいて個々の列に色を付けたいと思います。たとえば、列の値が5以下の場合は、緑色で塗りつぶす必要があります。10以上の場合は、赤い塗りつぶしになります。

シリーズレベルで色を機能させることはできますが、同じシリーズ内の個々のデータポイントにこの可変の配色を持たせたいです。これはできますか？問題を解決するためのより良い方法はありますか？

これまでに私のアプリケーションによって生成されたコードは次のとおりです。

var chart1 = new dojox.charting.Chart2D("simplechart");
chart1.addPlot("default", {type: "Columns", gap:5});
chart1.addPlot("target", {type: "Lines"});
chart1.addAxis("x",
    {labels: [{value: 1, text: "Aug '12"},
    {value: 2, text: "Sep '12"},
    {value: 3, text: "Oct '12"},
    {value: 4, text: "Nov '12"},
    {value: 5, text: "Dec '12"},
    {value: 6, text: "Jan '13"}],
    minorTicks:false});
chart1.addAxis("y", {vertical: true, min: 0, max: 9});
chart1.addSeries("Data Series", [6.9,7.7,1,5.5,7.6,8.1]);
chart1.addSeries("Target Series", [6,6,6,6,6,6], {plot:"target"});

chart1.render();

「データ系列」内の個々のポイントに可変の色値を持たせたいのですが。

4

1 に答える 1

1

これは、「StackedColumns」を使用して実行できます。アイデアは、各色ごとに1つのシリーズを作成できるということです。たとえば、値<= 5の場合は「緑」のシリーズ、値>5および<=10の場合はその他、値>10の場合は「赤」のシリーズ。

次に、データがある配列の各値を評価し、次のようにその値を対応するシリーズに配置する必要があります。

 for(var i=0; i<chartData.length;i++){
        if(chartData[i]<=5)
            fill("green",chartData[i]);
        else if(chartData[i]>5 && chartData[i]<=10)
            fill("yellow",chartData[i]);
        else
            fill("red",chartData[i]);
    }

dojoを使用して実行されている例を確認するには、このjsfiddleを参照してください

于 2013-04-23T18:20:57.153 に答える