EXTJS 4の折れ線グラフをレンダリングする際に問題があります。私は、アコーディオンレイアウトを含むViewportを持っています。そのレイアウトでは、私は非常に簡単なグラフを作成します。Ext.data.Storeをプロキシで使用している場合、EXTJS 4の折れ線グラフのレンダリングに失敗する
var chartBox = Ext.create('Ext.chart.Chart', {
width: 500,
height: 300,
style: 'background:#fff',
animate: true,
store: Ext.data.Store({
fields: ['active'],
data: [
{ 'name': 'Jan 2011', 'active': 10},
{ 'name': 'Feb 2011', 'active': 9},
{ 'name': 'Mar 2011', 'active': 13},
{ 'name': 'Apr 2011', 'active': 5},
{ 'name': 'Mei 2011', 'active': 17},
]
}),
theme: 'Category1',
legend: {
position: 'right'
},
axes: [{
type: 'Numeric',
position: 'left',
fields: ['active'],
label: {
renderer: Ext.util.Format.numberRenderer('0,0')
},
title: 'Total',
grid: true,
minimum: 0
},{
type: 'Category',
position: 'bottom',
fields: ['name'],
title: 'Month and Year'
}],
series: [{
type: 'line',
highlight: {
size: 7,
radius: 7
},
axis: 'left',
xField: 'name',
yField: 'active',
markerConfig: {
type: 'cross',
size: 4,
radius: 4,
'stroke-width': 0
}
}]
})
すると、それが仕事である:
は、ここに私のコードです。このスクリーンショットを参照してください。
しかし、私はこのコードの一部を変更した後:これで
store: Ext.data.Store({
fields: ['active'],
data: [
{ 'name': 'Jan 2011', 'active': 10},
{ 'name': 'Jan 2011', 'active': 10},
{ 'name': 'Jan 2011', 'active': 10},
{ 'name': 'Jan 2011', 'active': 10},
{ 'name': 'Jan 2011', 'active': 10},
]
}),
:
store: Ext.data.Store({
fields: ['active'],
autoLoad: true,
proxy: {
type: 'ajax',
url : 'data/statexample_noroot.json',
reader: {
type: 'json'
}
}
}),
サーバーからデータをロードするために、それは動作しません。このスクリーンショットを参照してください。
これは "statexample_noroot.json" からのコンテンツです:
[
{ 'name': 'Jan 2011', 'active': 10},
{ 'name': 'Feb 2011', 'active': 9},
{ 'name': 'Mar 2011', 'active': 13},
{ 'name': 'Apr 2011', 'active': 5},
{ 'name': 'Mei 2011', 'active': 17},
]
私は警告だけで偽のレンダリング折れ線グラフを取得し、「予期しない値がNaNの "x属性を解析する予期しない値がNaNの。"解析属性の解析に予期しない値行列(NaN、0、NaN、1、NaN、0)があります。
私は軸に数値を設定しました。私はExt.data.Model、Ext.data.JsonStoreを使ってすべてを試してみましたが、まだ動作しませんでした。
違いは何ですか?私はここで何が欠けているのですか?誰でもこの事が起こる理由を知っていますか?私は何時間も立ち往生している。
を忘れてしまいました!ストアのフィールド配列から '名前'がありません。私はあなたの問題を再現しようとしましたが、不完全なチャートは私には涼しく見えません。 –
ああ、ええ、それはタイプミスです。しかし、私はすでに店舗のフィールド配列内の '名前'でそれを試しています。しかし両者はまだ動作しませんでした。多分私はこの正午をやり直すでしょう。 –
EXTJSでは、ビューポート内でチャートを作成できないようです。私はまったく同じように新しいウィンドウ内で同じチャートを作ることができます。問題のドメインはまだ解決していませんが、新しい方法で実装しようとしました。 –