2016-03-20 14 views
1

ハイチャートで凡例記号の色を変更することはできますか? たとえば、demo exampleには2つのシリーズが含まれ、凡例のシンボルは青と黒で表示されます(シリーズと同じ)。凡例記号ハイチャートの色を変更する

symbolColorパラメータがドキュメントに見つかりませんでした。どのように私はそれらを両方とも黒に変えるのですか?

legend: { 
    layout: 'vertical', 
    floating: true, 
    align: 'left', 
    verticalAlign: 'top', 
    x: 90, 
    y: 45, 
    symbolPadding: 20, 
    symbolWidth: 50, 
    symbolColor: '#000000' ????? 
}, 

enter image description here

+0

シリーズの色とは異なる伝説の色を持つことは意味をなさない。 Legendはそれぞれのシリーズが何であるかを示し、ハイチャートではシリーズの表示/非表示にも使用できます。伝説がシリーズとは色が違う必要があるのはなぜですか? –

答えて

3

各シリーズの凡例のcolorを追加します。

series: [{color: '#000000',  //change here 
      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] 
     }, {color: '#000000',     //change here 
      data: [95.6, 54.4, 29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1] 
     }] 

JSFiddle

+0

フィドルが私にとってうまくいかない... – albert

+1

@albert色を変えてみましたか? http://jsfiddle.net/6nsr2p2j/3/ – Munawir

3

Highcharts 4.Xソースは、シリーズ/ポイントのlegendColorパラメータを探しんが、しかし、あなたは(私の知る限りでは)それは、ユーザオプションせずにそれを設定することはできません。

クラスのcolorizeItem機能をラップすると、legendColor属性を設定して、それを非常に簡単に利用できます。たとえば、ラップ:あなたのチャートオプションで

(function (H) { 
    H.wrap(H.Legend.prototype, 'colorizeItem', function (proceed, item, visible) { 
     item.legendColor = item.options.legendColor; 
     proceed.apply(this, Array.prototype.slice.call(arguments, 1)); 
    }); 
}(Highcharts)); 

と使用方法:

$('#container').highcharts({ 
    series: [{ 
     legendColor: 'black', 
     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] 
    }] 
}); 

は、それがどのように見えるかのthis JSFiddle demonstrationを参照してください。

+0

以下の答えに同じフィドルをチェックしてください。どちらも私の仕事ではありません – albert

+1

@albert私はフィドルを更新しました。 Highcharts 4.Xで動作します。私は5.Xのために何かを見つけるかどうかを知るかもしれないが、現在のところこれは従来の修正である。 –

+1

コードチャートの小さな変更で5.Xで動くはずですhttp://jsfiddle.net/fypopsnc/7/ –

関連する問題