以下是我添加的屏幕截图对应的代码。如果您参考代码开头的数据字段,您将看到Y轴上的标签显示错误。
并导入这些libs,这是我在此官方图表预览link中找到的样本字符中的相同导入(zip文件位于文章末尾,其中的条形图也是错!!!):
<link rel="stylesheet" type="text/css" href="../../resources/css/ext.css" />
<script type="text/javascript" src="../../ext-core.js"></script>
<script type="text/javascript" src="../../ext-chart.js"></script>
<script type="text/javascript" src="Bar3.js"></script>
然后我导入了以下库(它们在this sample中导入的库):
<link rel="stylesheet" type="text/css" href="ext-all.css" />
<script type="text/javascript" src="ext-all.js"></script>
<script type="text/javascript" src="Bar3.js"></script>
我得到了正确的结果。
Ext.onReady(function () {
var chart;
var store1 = new Ext.data.JsonStore({
fields:['name', 'data1'],
data: [
{name:'Jan', data1: 2000},{name:'Feb', data1: 1800},
{name:'Mar', data1: 1500},{name:'Apr', data1: 1000}
]});
chart = new Ext.chart.Chart({
renderTo: Ext.get('graphDiv'),
width: 600,
height: 400,
animate: true,
shadow: true,
store: store1,
autoScroll: true,
axes: [{
type: 'Numeric',
position: 'bottom',
fields: ['data1'],
label: {
renderer: Ext.util.Format.numberRenderer('0,0')
},
title: 'Number of Hits'
}, {
type: 'Category',
position: 'left',
fields: ['name'],
reverse: true,
title: 'Month of the Year'
}],
series: [{
type: 'bar',
axis: 'bottom',
highlight: true,
label: {
display: 'insideEnd',
field: 'data1',
renderer: Ext.util.Format.numberRenderer('0'),
orientation: 'horizontal',
color: '#333',
'text-anchor': 'middle',
contrast: true
},
xField: 'name',
yField: 'data1'
}]
});
});
答案 0 :(得分:2)
extjs 4.0.0的已知错误!只需升级到4.1.x即可解决问题。