samedi 22 novembre 2014

Problem with inheritance of axes/series in a Chart component?

Morning guys,

can you pls. help me with the following issue:

I have a simple column-series chart component, which is placed inside an Ext.window to visualize my data reports.

Everything is looking fine with this, except that when i close the window (closeAction is 'destroy') and then instantiate it again, the old series of the chart are somehow preserved and the chart shows one more column with different color, but absolutely the same values. If i close the window again and re-create it - the columns become 3 and so on.


The chart, in fact, is declared using Ext.define() and the series and axes are declared like this (the code is minimized):



Code:



axes:
[
{
type: 'Numeric',
position: 'left',
fields: [],
title: 'Sample Values'
}
],


series:
[
{
type: 'column',
axis: 'left',
xField: 'name',
yField: []
}
]

As you can see, the fields property of the one axis and the yField property of the series are declared as empty arrays.

I do so, because the chart is groupped and the fields count is generated dynamically, they are not known every time the chart is instantiated. In other words, i visualize the working time for employee and the chart can show multiple employee at once (but does not know how many here, it depends on how many employee the user is selected).


That is why, i actually use a separate function (declared within the Ext.define() call), which is called in the chart's initComponent() method and which simply fills these two properties/empty arrays with the appropriate field items every time the chart component is instantiated. Note that this function actually is working on a config object properties - the axes and series are not even created at the time this function is called.


And all this logic is working quite good for me when the chart is shown for the first time. But, when i show it again, then the fields and yField properties contain the fields from the previous call plus these added in the second one and the data gets duplicated on the screen.


I suppose this is due to the fact, that the axes and the series objects are not being destroyed when the chart component is destroyed and are being reused every time preserving its values.


That is why i need your advice - at least, i think that i took a wrong way using initComponent() as a hook for my logic. But this was the only way i found to show the chart which is dynamic, e.g. the series count is unknown and is determined dynamically.


All chart examples in the API docs are beautiful, indeed, but they all use fixed amount of series/fields and are configured with them. Which is impossible in my case.


So any - ideas / advices how to proceed?


Thanks.






Problem with inheritance of axes/series in a Chart component?

Aucun commentaire:

Enregistrer un commentaire