-2

変数情報を表示している折れ線グラフがあります (過去 12 か月の各月の割合)

PHP関数へのAjax呼び出しから受け取った結果に基づいて、各プロットのドットの色を変更したいと思います。（グリーンライン参照）

たとえば、以下は私のグラフです: My Graph

その月の数値が 98.5 を超える場合は点を緑色に、数値が 96 ～ 98.5 の場合は点を琥珀色にし、それより低い場合は点を赤色にします。

これは可能ですか？

色の配列を ajax メソッドに返して試してみました: name: 'Production Success Rate', color: 'responseJSON.colour, type: 'line', data: responseJSON.percent

返される配列 responseJSON.colour は、16 進コードの配列です。

ただし、配列の最初の色で線を着色するだけなので、カラーAPIは配列を許可していないようです（残念ながら）

誰でも助けることができますか？

4

2 に答える 2

3

fillColorあなたが望むのは、各シリーズポイントを活用することだと思います。

これは、チャート用に準備するデータを手動で作成することで実行できます。簡単な例は次のとおりです。

var figures = [93, 95.8, 99.2, 97.8, 98.3, 96.4, 95, 98.9, 97.2, 94.3, 97.1, 94],
        d = [];

$.each(figures, function (i, figure) {
    if (figure > 98.5) {
        d.push({y: figure, fillColor: 'green', color: 'green'});
    }else if(figure < 98.5 && figure > 96.5){
        d.push({y: figure, fillColor: '#ffbf00', color: '#ffbf00'});  //amber i guess
    }else if(figure < 96.5){
        d.push({y: figure, fillColor: 'red', color: 'red'});   
    }
});

次に、チャートを作成するときに指定するだけdata: dで、上記の条件に基づいて各ドットが異なる塗りつぶしの色になります。

この jsFiddle は、おそらく必要なもののほとんどをカバーしていると思います。

于 2013-01-31T07:45:38.667 に答える
2 
<script src="http://code.highcharts.com/highcharts.js"></script>

<div id="container" style="height: 400px"></div>

$(function () {
var chart = new Highcharts.Chart({
    chart: {
        renderTo: 'container'
    },
    xAxis: {
        categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
    },

    plotOptions: {
        series: {
            allowPointSelect: true,
            marker: {
                states: {
                    select: {
                        fillColor: 'red',
                        lineWidth: 0
                    }
                }
            }
        }
    },

    series: [{
        data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]        
    }]
});
});

このフィドルで示されているように、選択したマーカーの色を変更する方法の例として上記を参照してください。これらの手順に従って、色をカスタマイズできます。幸運を！

これが役に立てば幸いです、レイチェル:)

于 2013-01-31T07:52:24.910 に答える