extjsデカルト チャート コンポーネントに問題があり、2 点間に線を引くことができません。問題を特定のシリーズのステップの間隔データの欠落に絞り込みましたが、適切な解決策が見つかりませんでした。
次の単純化された例では、2 つの赤いマーカーの間に位置する間隔「3」で青い線上のマーカーのデータが存在する赤い線にブレークが表示されます。複数のシリーズにまたがる1 つ以上のステップに対して部分データのみが存在するシナリオで、間隔「2」の赤いマーカーから間隔「4」のマーカーまでまっすぐに描画する方法を見つけようとしています。
私のライブ アプリケーションでは、x 軸に沿ったデータは実際には日付であるため、すべてのシリーズのすべての間隔でデータを期待するのは不合理です。また、マーカーには意味があるため、データが存在しないポイントを偽造することに消極的であり、クリックイベントでそれらを使用して他のことを行っています。
APIを見ると、私の唯一の調査ラインはSeriesrenderer
関数を過負荷にしているようですが、ドキュメントがせいぜい不足しているため、何がドローをトリガーするのかまだわかりません。
誰かがすでにこれを回避している場合、フレームワークを分解する前に何か指針をいただければ幸いです。または - 健全性チェック - 明らかな構成プロパティを見逃していませんか?
Ext.create('Ext.Container', {
renderTo: Ext.getBody(),
width: 600,
height: 400,
layout: 'fit',
items: {
xtype: 'cartesian',
store: {
fields: ['name', 'p1', 'p2'],
data: [
{ name: 'one', p1: 10, p2: 3 },
{ name: 'two', p1: 7, p2: 5 },
{ name: 'three', /*p1: 5,*/ p2: 10 },
{ name: 'four', p1: 2, p2: 8 },
{ name: 'five', p1: 18, p2: 15 }
]
},
axes: [
{
type: 'numeric',
position: 'left',
fields: ['p1', 'p2'],
minimum: 0
},
{
type: 'category',
position: 'bottom',
fields: ['name']
}
],
series: [
{
type: 'line',
style: {
lineWidth: 3
},
xField: 'name',
yField: 'p1',
marker: 'circle',
colors: ['red']
},
{
type: 'line',
style: {
lineWidth: 3
},
xField: 'name',
yField: 'p2',
marker: 'circle',
colors: ['blue']
}
]
}
});