extjs4 饼状图动态赋值

Bear-Li 2012-08-15 07:50:18
function lists(list) {
alert("list ------------------------------- >"+list);
Ext.getCmp('chartCmp').getStore().loadData(list);//通过json从后台拿的数据
}
var deviceSatateCount = Ext.create('Ext.data.JsonStore', {
fields: ['signalStateHigh', 'signalStatelow'],
data: [
{signalStatelow:"信号强",signalStatelow:20},
{signalStatelow:"信号弱",signalStatelow:60},
{signalStatelow:"没信号",signalStatelow:30}
]
});

var pie = Ext.create('Ext.Window', {
width: 800,
height: 600,
title: '饼图示例',
layout: 'fit',
closeAction:'hide',
tbar: [{
text: '数据变换',
handler: function() {
deviceSatateCount.loadData([
{signalStatelow:"信号强",signalStatelow:40},
{signalStatelow:"信号弱",signalStatelow:20},
{signalStatelow:"没信号",signalStatelow:40}
]);
}
}, {
enableToggle: true,
pressed: false,
text: 'Donut(设置内圆)',
toggleHandler: function(btn, pressed) {
var chart = Ext.getCmp('chartCmp');
//设置图标序列的模式
chart.series.first().donut = pressed ? 35 : false;//内弧度
chart.refresh();
}
}],
items: {
xtype: 'chart',
id: 'chartCmp',
animate: true,
store: deviceSatateCount,
shadow: true,
legend: {
position: 'right'
},
insetPadding: 60,
theme: 'Base:gradients',
series: [{
type: 'pie',
field: 'signalStatelow',
showInLegend: true,
donut: false,//内环状线圈
tips: {//提示
trackMouse: true,
width: 140,
height: 28,
renderer: function(storeItem, item) {
var total = 0;
deviceSatateCount.each(function(rec) {
total += rec.get('signalStatelow');
});
this.setTitle(storeItem.get('signalStatelow') + ': '
+ Math.round(storeItem.get('signalStatelow')/total*100)
+ '%');
}
},
highlight: {//高亮
segment: {
margin: 20
}
},
label: {
field: 'signalStateHigh',
display: 'rotate',
contrast: true,
font: '18px Arial'
}
}]
}
});
...全文
272 1 打赏 收藏 转发到动态 举报
写回复
用AI写文章
1 条回复
切换为时间正序
请发表友善的回复…
发表回复
Bear-Li 2012-08-16
  • 打赏
  • 举报
回复
上面的代码 动态给饼状图赋值时 那里出现问题? 请各位大侠指教下!!!!!!!!!!!!

87,991

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧