extjs4 Char绘制柱形图
extjs4使用chart绘制的柱形图为什么只显示坐标里面的图都不显示???
代码:
var store = Ext.create('Ext.data.JsonStore', {
fields: ['name', 'data'],
data: [
{ 'name': 'metric one', 'data':10 },
{ 'name': 'metric two', 'data': 7 },
{ 'name': 'metric three', 'data': 5 },
{ 'name': 'metric four', 'data': 2 },
{ 'name': 'metric five', 'data':27 }
]
});
var stationChart = Ext.create('Ext.chart.Chart', {
width: 500,
height: 300,
animate: true,
store: store,
axes: [{
type: 'Numeric',
position: 'bottom',
fields: ['data'],
label: {
renderer: Ext.util.Format.numberRenderer('0,0')
},
title: 'Sample Values',
grid: true,
minimum: 0
}, {
type: 'Category',
position: 'left',
fields: ['name'],
title: 'Sample Metrics'
}],
series: [{
type: 'bar',
axis: 'bottom',
highlight: true,
tips: {
trackMouse: true,
width: 140,
height: 28,
renderer: function(storeItem, item) {
this.setTitle(storeItem.get('name') + ': ' + storeItem.get('data') + ' views');
}
},
style: {
fill: '#38B8BF'
},
label: {
display: 'insideEnd',
field: 'data',
renderer: Ext.util.Format.numberRenderer('0'),
orientation: 'horizontal',
color: '#333',
'text-anchor': 'middle'
},
xField: 'name',
yField: 'data'
}]
});
var centerPanel = Ext.create('Ext.panel.Panel', {
title: 'XXXXXX',
region: 'center',
// layout: 'column',
items: stationChart
});

代码:
var store = Ext.create('Ext.data.JsonStore', {
fields: ['name', 'data'],
data: [
{ 'name': 'metric one', 'data':10 },
{ 'name': 'metric two', 'data': 7 },
{ 'name': 'metric three', 'data': 5 },
{ 'name': 'metric four', 'data': 2 },
{ 'name': 'metric five', 'data':27 }
]
});
var stationChart = Ext.create('Ext.chart.Chart', {
width: 500,
height: 300,
animate: true,
store: store,
axes: [{
type: 'Numeric',
position: 'bottom',
fields: ['data'],
label: {
renderer: Ext.util.Format.numberRenderer('0,0')
},
title: 'Sample Values',
grid: true,
minimum: 0
}, {
type: 'Category',
position: 'left',
fields: ['name'],
title: 'Sample Metrics'
}],
series: [{
type: 'bar',
axis: 'bottom',
highlight: true,
tips: {
trackMouse: true,
width: 140,
height: 28,
renderer: function(storeItem, item) {
this.setTitle(storeItem.get('name') + ': ' + storeItem.get('data') + ' views');
}
},
style: {
fill: '#38B8BF'
},
label: {
display: 'insideEnd',
field: 'data',
renderer: Ext.util.Format.numberRenderer('0'),
orientation: 'horizontal',
color: '#333',
'text-anchor': 'middle'
},
xField: 'name',
yField: 'data'
}]
});
var centerPanel = Ext.create('Ext.panel.Panel', {
title: 'XXXXXX',
region: 'center',
// layout: 'column',
items: stationChart
});
...全文
相关推荐
extjs中的报表【ColumnChart、PieChar、LineChar的用法】
在实际应用中,无论是动态还是静态数据,ExtJS都提供了丰富的API和事件处理机制。
css、js、asp.net知识小集合
char类型通常用于固定长度的字符串,如果赋值时字符串长度不足,会用空格填充至指定长度。nchar与char类似,但存储的是Unicode字符,常用于多语言支持。
JAVA+ORALCE面试题汇总
4. **处理结果集**:如果查询操作返回结果集,则需要使用ResultSet对象遍历数据。5.
java面试题
- **jQuery、ExtJS、GWT**:前端框架,简化HTML文档遍历、事件处理、动画等操作。
Wrong-topic-to-sort-out:错题集
变量是用来存储数据的容器,可以有整型(int)、浮点型(float)、字符型(char)等多种数据类型。


