私はチャートを持っています：
Ext.define('CarboZero.view.PieChart', {
extend: 'Ext.chart.PolarChart',
alias: 'widget.piechart',
requires: [
'CarboZero.view.override.PieChart'
],
config: {
animate: false,
store: 'relativedata',
colors: [
'#115fa6',
'#94ae0a',
'#a61120',
'#ff8809',
'#ffd13e',
'#a61187',
'#24ad9a',
'#7c7474',
'#a66111',
'#222222',
'#115ea6',
'#94cc0a',
'#b61120',
'#dd8809',
'#11d13e',
'#a68887',
'#94df9d',
'#7f74f4',
'#112341',
'#abcdef1'
],
series: [
{
type: 'pie',
renderer: function(sprite, record, attributes, index, store) {
if(record.type === 'label')
{
var total = Ext.getStore('relativedata').getTotal();
var name = record.text;
var value = Ext.getStore('relativedata').getByName(name);
var ratio = Math.round((value/total)*10000)/100;
sprite.labelCfg.text = sprite.labelCfg.text +" : "+ ratio +"%";
}
},
labelField: 'strName',
xField: 'numValue'
}
],
interactions: [
{
type: 'rotate'
}
],
legend: {
xtype: 'legend',
docked: 'bottom',
itemId: 'pie_legend',
itemTpl: [
'<tpl if="value != 0">',
' <span class="x-legend-item-marker {[values.disabled?\'x-legend-inactive\':\'\']}" style="background:{mark};"></span>{name}',
'</tpl>'
],
maxItemCache: 100,
store: 'relativedata'
},
listeners: [
{
fn: 'onPolarInitialize',
event: 'initialize'
}
]
}
});
当店をご利用の方
Ext.define('CarboZero.store.RelativeData', {
extend: 'Ext.data.Store',
alias: 'store.relativedata',
requires: [
'CarboZero.model.RelativeElement'
],
config: {
destroyRemovedRecords: false,
model: 'CarboZero.model.RelativeElement',
storeId: 'relativedata'
},
getTotal: function() {
var total =0;
for( var i=0; i<this.getCount();i++)
{
total += this.getAt(i).get('numValue');
}
return total;
},
getByName: function(name) {
var value;
for(var i=0;i<this.getCount();i++)
{
if(this.getAt(i).get('strName')===name)
{
value = this.getAt(i).get('numValue');
break;
}
}
return value;
}
});
この関数を使用してストアを埋めます:
var relStore = Ext.getStore('relativedata');
var eleStore = Ext.getStore('element');
var relModel;
var eleModel;
var boolAdded = false;
relStore.removeAll();
//Convert to CO2 qty
for(var i = 0; i< eleStore.getCount();i++)
{
eleModel = eleStore.getAt(i);
relModel = Ext.create(APPNAME + '.model.RelativeElement');
relModel.set('strName',eleModel.get('strName'));
relModel.set('numValue', elementCompute(eleModel));
if(eleModel.get('numValue')*eleModel.getFactor() >0)
{
boolAdded = true;
relStore.add(relModel);
}
}
APP.getController('TitleBar').parentToTitle();
//No element had a value superior to 0, nothing is displayed
if(!boolAdded)
{
APP.getController('PopUp').chartAlert();
}
this.refreshpie(); ///SPECIAL LINE NEEDED
このストアはローカルであり、別のストアを使用して自分で埋めることができますか。チャートにリンクされたストアを埋めるために使用される関数の最後の行は 'this.refreshpie()' です。ここにあります ：
pie.sync();
pie.redraw();
それらの線がない場合、グラフはまったく表示されません。.sync は非ローカルストアに使用する必要があるため、これは意味がありません...
問題は、チャートの表示でうまくいくことです...しかし、私が理解できなかったことが1つあります。
グラフにはデータ ツリーのレベルが表示されます。別のレベルに移動すると、そのレベルのノードでストアが更新されます。
何が起こるかというと、私が木に登ると、このような問題が発生します
古いデータ ラベルはチャートに残り (石炭、原子力)、新しいデータ ラベルがその上に追加されます... ストアをチェックしました。適切なモデルで満たされています。円グラフ モデル内でチェックできるすべてのものをチェックしましたが、できませんでした。めちゃくちゃなものを見つける...
すなわち。この図では、電力のみが表示されるはずです。
誰か助けてくれませんか、煎茶タッチチャートの黒魔術が私の忍耐力に勝っています。
チャートの回転（相互回転 - ジェスチャで続行）を行うと、ラベルがリセットされ、適切に表示されることを知っておくとよいでしょう...