Skip to content

Re-using Visualizations

Visuals can be created in one of two ways:

1
2
3
4
5
// By using the provider
var myChart1 = cf.provider('SparkSQL');

// By creating an empty visual
var myChart2 = cf.create();

Every time that one of this two methods is called, a new visual is created and it is stored within ChartFactor. This means that whether we save the visual in a variable (myChart1, myChart2) or not, it will still be stored. If we need to change the visual like, for example, an option, the chart type or any other, we don't need to create a new visual but we can re-use the one we created. A side note on cf.create() is that it accepts a parameter to also identify the query. If is not a multi-query object this parameter is not needed at all.

Getting all stored visuals

You can see all the visuals created with:

1
var allVisuals = cf.getAllVisualizations();

Getting one visual

To get a specific visual, we must use the HTML id of the DOM element that holds that visualization, which is used to identify it (we can't have several visuals rendered at the same time in the same element)

1
var myChart = cf.getVisualization('element_id');

Automatic re-use and memory management

Even though the possibility of manual re-usage is there, it represents more of an organizational technique. This is because ChartFactor is smart enough to re-use charts trying to use the same element. This means that if we have 4 visuals, and then we create a new one (without executing it yet) it will actually create a new visual instance, leaving us with 5 visuals, but if we then assign to the new visual an element that is already in use and execute it, it will overwrite the old visual with the new one, going back to 4.