前のセクション、バージョンライブラリ:ext JSライブラリ3.3.1に書きます
チャートを作成すると、多くの垂直座標値が同じです。他のバージョンはテストされていません。興味のある友達は自分でそれをテストできます。
コードコピーは次のとおりです。
var Chartstore; //チャートデータ
ext.Onready(function(){
//現在のサーバーファイルを使用してください。
Ext.Chart.Chart.Chart_url = 'extjs/resources/charts.swf';
var json_reader = new ext.data.jsonreader({
idproperty:「ポイント名」、
root: 'rows'、
TotalProperty:「結果」、
フィールド:[{
名前:「ポイント名」
}、{
名前: 'FaultCount'、
タイプ:「int」
}]
});
//背景からデータを取得します
chartstore = new ext.data.store({
プロキシ:新しいext.data.httpproxy({
url: 'loadcolumnchart.do'、
方法:「投稿」
})、
リーダー:json_reader
});
chartstore.reload();
//バーチャートパネル
var columnchartpanel = new Ext.Panel({
境界線:偽、偽
AutoScroll:本当、
//タイトル:「機器のテストポイント障害記録統計」、
フレーム:本当、
renderto:document.body、
幅:800、
高さ:240、
レイアウト:「フィット」、
アイテム:{
xtype: 'columnChart'、// type
ストア:チャートストア、
Xfield: 'PointName'、// x-Axis値
yfield: 'faultcount'、// y軸の値を取る
YAXIS:新しいext.chart.numericaxis({
displayName:「faultCount」
// LabelRenderer:ext.util.format.numberRenderer( '0,0')//重要な問題は、この文でコメントした場合です。
})、
TipRenderer:function(chart、record){
Return Record.Data.PointName + '障害の数は次のとおりです。
ext.util.format.number(record.data.faultcount、 '0,0');
}、
シリーズ:[{//列
タイプ: 'column'、//タイプは変更(行)行を変更できます
displayName: 'FaultCount'、
Yfield: 'FaultCount'、
スタイル:{
色:0x99bbe8
}
}]
}
});
//バーチャートパネル
var leftpanel = new Ext.Panel({
タイトル:「彼のチャート」、
地域:「西」、
マージン: '5 0 0'、
cmargins: '5 5 0 0'、
幅:850、
minsize:700、
Maxsize:850、
AutoScroll:true、// trueを設定すると、コンテンツがオーバーフローするとスクロールバーが生成され、デフォルトはfalseです
崩壊:true、//収縮を許可します
アイテム:ColumnChartPanel
});
});
1。解決前:
2。解決後: