1

4.02 で複数の系列を持つ折れ線グラフがあります。系列線が交差するさまざまなポイントで、特定の線を一番上の線、つまり最大の z-index として残す必要があります (これにより、他の線とは対照的に、ホバーしたときにこの線が強調表示され、そのヒントが表示されます)。

凡例のシーケンスを同じままにする必要があるため、シリーズがjavascriptで記述されているシーケンスを並べ替えたいだけではありません(すべて日付としてタイトルが付けられており、日付順に保持したい)。

z-index を設定するための何らかのExt.chart.series.Line設定オプションを探しましたが、うまくいきませんでした。

基本テーマを拡張して、さまざまな行のカスタム ストローク幅を定義したので、一連の z-index を設定するためのある種のテーマ オプションを探し始めましたが、どちらも成功していません。

何か案は？

編集：

zindex 構成を拡張チャート テーマに追加しました。これにより、エラーは発生しませんが、チャート内の何も変更されません (z-index 4 でリストされた最初のシリーズは下にあり、z-index 5 は下から 2 番目です)。 、z-index 3は下から3番目など）、どこかで上書きされているようです：

// CUSTOM CHART THEME
Ext.chart.theme.Events = Ext.extend(Ext.chart.theme.Base, {
    constructor: function(config) {
        Ext.chart.theme.Base.prototype.constructor.call(this, Ext.apply({
            colors: ['rgb(0, 0, 0)', 
                     'rgb(0,0,255)', 
                     'rgb(255,0,0)', 
                     'rgb(0,128,0)', 
                     'rgb(128,0,128)'
            ],
            seriesThemes: [{
                'stroke-width': 3,
                zindex: 4
            }, {
                'stroke-width': 1,
                smooth: false,
                zindex: 5
            }, {
                'stroke-width': 1,
                smooth: false,
                zindex: 3
            }, {
                'stroke-width': 1,
                smooth: false,
                zindex: 2
            }, {
                'stroke-width': 1,
                smooth: false,
                zindex: 1
            }]                
        }, config));
    }
});
4

1 に答える 1

1

わかりました、私はそれを整理しました、カスタムテーマのzindexではなくzIndex :

// CUSTOM CHART THEME
Ext.chart.theme.Events = Ext.extend(Ext.chart.theme.Base, {
    constructor: function(config) {
        Ext.chart.theme.Base.prototype.constructor.call(this, Ext.apply({
            colors: ['rgb(0, 0, 0)', 
                     'rgb(0,0,255)', 
                     'rgb(255,0,0)', 
                     'rgb(0,128,0)', 
                     'rgb(128,0,128)'
            ],
            seriesThemes: [{
                'stroke-width': 3,
                zIndex: 4
            }, {
                'stroke-width': 1,
                smooth: false,
                zIndex: 5
            }, {
                'stroke-width': 1,
                smooth: false,
                zIndex: 3
            }, {
                'stroke-width': 1,
                smooth: false,
                zIndex: 2
            }, {
                'stroke-width': 1,
                smooth: false,
                zIndex: 1
            }]                
        }, config));
    }
});
于 2012-01-03T02:19:32.357 に答える