Chart.Rendered

Syntax

Rendered: function(sender, args);

Parameters

sender. Event source.

args. Event information.

Description

The Rendered event occurs on rendering the chart.

Example

To execute the example, the HTML page must contain the Chart component named chart (see Example of Creating a Histogram). Set handler for the Rendered event and invoke this event:

// Set event handler for chart rendering
chart.Rendered.add(function() {
    console.log("Rendered event");
    // Get a message informing if Cartesian coordinates system is used for chart rendering
    var isCartesian = chart.getIsCartesianChart() ? "yes" : "no";
    // Get a message informing if polar coordinate system is used
    var isPolar = chart.getPolar() ? "yes" : "no";
    // Get a message indicating whether the chart is draggable
    var isDraggable = chart.getDraggable() ? "yes" : "no";
    // Get a message indicating whether selection on right click is allowed in the chart
    var useSelectOnRightClick = chart.getUseSelectOnRightClick() ? "yes" : "no";
    // Get a message indicating whether the chart is a mixed type chart
    var isMixed = chart.getIsMixed() ? "yes" : "no";
    // Get the object that contains chart size and paddings
    var borders = chart.getPlotBorders();
    // Display chart information in the browser console
    console.log("Does the chart use Cartesian coordinates system? " + isCartesian);
    console.log("Does the chart use polar coordinates system? " + isPolar);
    console.log("Is the chart draggable? " + isDraggable);
    console.log("Is right click selection allowed? " + useSelectOnRightClick);
    console.log("Is the chart a mixed type chart? " + isMixed);
    console.log("Coordinates of the top left corner of the chart: (" + borders.X + ";" + borders.Y + ")");
    console.log("Chart width: " + borders.W);
    console.log("Chart height: " + borders.H);
    // Show types of the chart data series to the browser console
    var seriesTypes = chart.getSeriesTypes();
    for (var i = 0; i < seriesTypes.length; i++) {
        console.log("Series " + i + ", type: " + seriesTypes[i]);
    }
});
// Fire the Rendered event
chart.Rendered.fire(this);

After executing the example the browser console displays information on invoking the Rendered event and also displays information about the rendered chart:

Rendered event

Does the chart use Cartesian coordinates system? yes

Does the chart use polar coordinates system? no

Is the chart draggable? no

Is right click selection allowed? yes

Is the chart a mixed type chart? no

Coordinates of the top left corner of the chart: (77.4609375;54)

Chart width: 502.5390625

Chart height: 318

Series 0, type: Column

Series 1, type: Column

Series 2, type: Column

Series 3, type: Column

Series 4, type: Column

Delete the chart:

// Delete the chart
chart.destroy();

As a result the chart is deleted.