0

2 つのシリーズで折れ線グラフを描画しています。そのうちの 1 つは透明です (ただし、色付きの点があります)。

私の問題は、透明なシリーズの凡例に色がなく、見栄えがよくないことです (特に、凡例でその名前をクリックして非表示にする場合)。

これが私がやっていることの例です: JSFiddle の例

透明なシリーズを作成するコードは次のとおりです。

{type:'spline',name:'Transparent',color:'rgba(255, 255, 255, 0.1)', data:[{x:1361059200000, y:0.0, marker: {symbol: "square", radius: 3, fillColor: "#f2a8a8", states: { hover: {radius: 3, fillColor: "#f2a8a8"}}}},{x:1361088000000, y:0.0, marker: {symbol: "square", radius: 8, fillColor: "#f2a8a8", states: { hover: {radius: 8, fillColor: "#f2a8a8"}}}},{x:1361116800000, y:0.0, marker: {symbol: "square", radius: 6, fillColor: "#f2a8a8", states: { hover: {radius: 6, fillColor: "#f2a8a8"}}}}]}

シリーズの凡例に色を設定する方法はありますか (グラフの作成中またはグラフの作成後に JavaScript を使用)?

ありがとう、ジヴ

4

1 に答える 1

0

透明なスプラインを使用する代わりに、カスタマイズされたマーカーでスキャッター セリエを使用することをお勧めします。

http://jsfiddle.net/G4NLn/3/

 {
            type: 'scatter',
            name: 'Transparent',
            marker: {
                    symbol: "square",
                    radius: 3,
                    fillColor: "#f2a8a8",
                    states: {
                        hover: {
                            radius: 3,
                            fillColor: "#f2a8a8"
                        }
                    }
             },
            //color: 'rgba(255, 255, 255, 0.1)',
            data: [{
                x: 1361059200000,
                y: 0.0,
                marker: {
                    symbol: "square",
                    radius: 3,
                    fillColor: "#f2a8a8",
                    states: {
                        hover: {
                            radius: 3,
                            fillColor: "#f2a8a8"
                        }
                    }
                }
            }, {
                x: 1361088000000,
                y: 0.0,
                marker: {
                    symbol: "square",
                    radius: 8,
                    fillColor: "#f2a8a8",
                    states: {
                        hover: {
                            radius: 8,
                            fillColor: "#f2a8a8"
                        }
                    }
                }
            }, {
                x: 1361116800000,
                y: 0.0,
                marker: {
                    symbol: "square",
                    radius: 6,
                    fillColor: "#f2a8a8",
                    states: {
                        hover: {
                            radius: 6,
                            fillColor: "#f2a8a8"
                        }
                    }
                }
            }]
于 2013-02-25T14:59:15.453 に答える