Javascript 未刷新extjs饼图
我有一个饼图如下Javascript 未刷新extjs饼图,javascript,extjs,charts,pie-chart,Javascript,Extjs,Charts,Pie Chart,我有一个饼图如下 var donut = false, panel1 = Ext.create('widget.panel', { width: 500, height: 350, title: 'Semester Trends', renderTo: Ext.getBody(), layout: 'fit', items: { xtype: 'chart', id: 'chartCmp',
var donut = false,
panel1 = Ext.create('widget.panel', {
width: 500,
height: 350,
title: 'Semester Trends',
renderTo: Ext.getBody(),
layout: 'fit',
items: {
xtype: 'chart',
id: 'chartCmp',
animate: true,
store: store,
shadow: true,
legend: {
position: 'right'
},
insetPadding: 60,
theme: 'Base:gradients',
series: [{
type: 'pie',
field: 'sales',
showInLegend: true,
donut: donut,
tips: {
trackMouse: true,
width: 140,
height: 28,
renderer: function(storeItem, item) {
//calculate percentage.
var total = 0;
store.each(function(rec) {
total += rec.get('sales');
});
this.setTitle(storeItem.get('month') + ': ' + Math.round(storeItem.get('sales') / total * 100) + '%');
}
},
highlight: {
segment: {
margin: 20
}
},
label: {
field: 'month',
display: 'rotate',
contrast: true,
font: '18px Arial'
}
}]
}
});
这个饼图很好用。然而,有一个问题
当我点击submit按钮为饼图生成数据时,饼图被生成
第一次点击按钮。我得到了5个值,所以有5个饼,饼上有5个标签。
第二次单击,我只得到2个值,所以有2个饼图,但我看到的不是2个标签,而是5个标签
问题是,我在第二次点击时没有的3个标签应该被删除。我怎么做
我甚至使用以下代码来刷新图表,但它仍然不起作用
store.load(function(){
chart.redraw();
});
有人能帮我刷新图表吗?我相信这些标签在某种程度上正在缓存,因为第二次单击时,只有2个数据值和2个名称与之关联
更新:
Ext.define('PieC'.{
extend: 'Ext.data.Model',
fields:['month', 'sales']
});
var store = Ext.create('Ext.data.Store',{
model:'PieC',
autoLoad:true,
proxy:{
type:ajax,
url:'',
reader:{
type: 'xml',
record: 'record'
}
}
});
更新存储
store.proxy.url ='url here ',
store.load(function(){
chart.redraw();
})
谢谢您如何更新数据?只需在存储中加载新数据就可以正确地绘制标签……是的,我只加载了新数据。馅饼被正确地重画了。尽管只有2个值,但标签仍然存在。图例显示2个标签。但是饼图上的标签是5。你能给我们完整的运行代码来重现这个问题吗?更新上面的代码,如果能将两个数据集加载到存储中,那就太好了。