Skip to content
ready beforeInitialize initialized beforeLinkedItemOpen linkedItemOpened beforeLinkedItemClose linkedItemClosed dataLoadRequestCompleted dataLoadError dataLoadCancelled dataLoadRequestCancelled beforedataload dataUpdated dataUpdateCancelled dataLoadRequested beforeDataUpdate chartCleared slicingEnd slicingStart rotationEnd rotationStart centerLabelClick centerLabelChanged chartClick chartMouseMove chartRollOver chartRollOut backgroundLoaded backgroundLoadError legendItemClicked legendItemRollover legendItemRollout logoRollover logoRollout logoClick logoLoaded logoLoadError beforeExport exported exportCancelled beforePrint printComplete printCancelled dataLabelClick dataLabelRollOver dataLabelRollOut onScroll pinned dataRestored chartUpdated linkRollOut linkClick linkClicked beforeRender renderCancelled beforeResize resizeCancelled beforeDispose disposed disposeCancelled linkedChartInvoked beforeDrillDown drillDown beforeDrillUp drillUp drillDownCancelled drillUpCancelled onChangeCrossLine containerNotFound beforeRender renderComplete renderCancelled rendered noDataToDisplay beforeDataUpdate dataUpdateCancelled dataUpdated chartMouseMove chartRollOver chartRollOut chartClick chartTypeInvalid legendItemClicked legendItemRollOver legendItemRollout beforeExport exported exportCancelled beforePrint printComplete printCancelled dataMarkerRollOver dataMarkerRollOut dataMarkerClick timeMarkerRollOver timeMarkerRollOut timeMarkerClick referenceLineRollOver referenceLineRollOut referenceLineClick referenceZoneRollOver referenceZoneRollOut referenceZoneClick dataPlotClick dataPlotRollOver dataPlotRollOut ready loaded containerNotFound beforeInitialize initialized beforeDraw drawComplete drawCancelled beforeResize resized resizeCancelled beforeDispose disposed disposeCancelled animationInvoked selectionChange standardRangeSelect customRangeSelect timeNavBrushStart timeNavBrush timeNavBrushEnd canvasDragStart canvasDrag canvasDragEnd canvasDblTap canvasWheel

ready

static event

This event is fired when the FroalaCharts library is ready to be used. By the time this event is raised, the browser's DOM is ready to be interacted with, which corresponds to the DOMContentLoaded event of browsers. In older browsers, where DOMContentLoaded is not fired, the ready event corresponds to the load event of the page. In case the FroalaCharts library is included in the page when the DOMContentLoaded event is already fired (i.e. the script is loaded asyncronously using AJAX or by using script deferring methods) the ready event is still fired to ensure integrity of all the listeners.

In many ways the nature of this event is similar to the jQuery(document).ready function of the jQuery library and the Ext.onReady function of the ExtJS library. One should interact with the FroalaCharts framework (i.e. create new charts, set options, etc.) only after this event has been fired. This event also helps you to neatly write your code in separate script files and in the page <head> thus keeping scripts from being a part of your page <body>.

An alternate (and shorthand) method to subscribing the ready event is to use the ready function. One advantage that the ready function has over the ready event is that the event is fired only once during the life-cycle of a page while functions passed to the ready function are executed even when attached after the ready event has been fired.

This is a framework level event and as such can be only listened via the FroalaCharts object on the FroalaCharts class alone. It will not be fired if it is subscribed from individual chart instances.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

version

Type: array

FroalaCharts framework version returned in the form of an array, equivalent to the array version

now

Type: boolean

Boolean attribute to indicate whether the event was triggered at the instant of the window.ondomcontentloaded event ( window.onload for older browsers) or whether the window was already loaded and the event was fired to maintain integrity

Example

<html>
	<head>
<script type="text/javascript" src="/froalacharts/js/froalacharts.js"></script>
<script type="text/javascript">
// Render a chart within a chart container `div` element.
FroalaCharts.addEventListener('ready', function () {
    var chart = new FroalaCharts({
        type: 'column',
        renderAt: 'chart-container-div',
        dataFormat: 'json',
        dataSource: {
            chart: {
                caption: "Quarterly sales summary",
                numberPrefix: "$"
            }
            data: [
                { label: "Q1", value: "213345"},
                { label: "Q2", value: "192672"},
                { label: "Q3", value: "201238"},
                { label: "Q4", value: "209881"},
            ]
        }
    });
    // Since we are in the `ready` block, the `chart-container-div`
    // element should be available by now.
    chart.render();
});
</script>
<body>
    <div id="chart-container-div">Chart loads here...</div>
</body>
</html>

beforeInitialize

static event

This pre-initialization event is triggered every time a new instance of the FroalaCharts object is created. It then triggers a number of modules that need to be setup on every instance of FroalaCharts; the event can be used to perform any actions required to be completed before the initialization of each chart.

Because this event is triggered upon instantiating a new FroalaCharts object, it is virtually impossible to listen to this event by adding an event listener to the chart. By the time the event listener is attached (using the addEventListener() method), the event is already fired.

However, there are alternate ways that can be used to listen to this event. You can listen to the FroalaCharts global events, using the addEventListener static method before even creating a new instance. (The required instance can be identified by the id of the chart using eventObject.sender.id.) You can also pass the event listener as a parameter of the FroalaCharts constructor.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

type

Type: string

Type of chart rendered

renderAt

Type: string

Id of the HTML DOM element within which the chart is rendered

width

Type: number

Chart width

height

Type: number

Chart height

dataFormat

Type: string

Type of data ( json, jsonurl, xml, xmlurl) passed to the chart object

dataSource

Type: object

Object containing the source data for the chart

events

Type: object

Object containing details of all events configured for the chart

Example

// Listening using global events
	FroalaCharts.addEventListener('beforeInitialize', function (opts) {
    // Prints id of the chart being rendered
    console.log("Chart with id " + opts.sender.id + " is about to be initialized.");
 });

// Pass event listener in the FroalaCharts constructor
var mychart = new FroalaCharts({
    "type": "column",
    "dataFormat": "json",
    "dataSource": {
         ...
    },
    // Attach event handlers
    "events": {
        // Attach to beforeInitialize
        "beforeInitialize": function () {
            console.log("Initializing mychart...");
        }
    }
});

initialized

static event

Triggered when a new instance of the FroalaCharts constructor is created.

Note: Initialization does not indicate that the chart has rendered; it only indicates that the JavaScript object instance ( FroalaCharts()) is created and is ready to be operated upon.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

type

Type: string

Type of chart rendered

renderAt

Type: string

Id of the HTML DOM element within which the chart is rendered

width

Type: number

Chart width

height

Type: number

Chart height

dataFormat

Type: string

Type of data ( json, jsonurl, xml, xmlurl) passed to the chart object

dataSource

Type: object

Object containing the source data for the chart

events

Type: object

Object containing details of all events configured for the chart

Example

// Listening using global events
FroalaCharts.addEventListener('initialized', function (opts) {
    // Prints id of the chart that has initialized
    console.log("Chart with id " + opts.sender.id + " has been initialized.");
 });

// Pass event listener in the FroalaCharts constructor
var mychart = new FroalaCharts({
    "type": "column",
    "dataFormat": "json",
    "dataSource": {
         ...
    },
    // Attach event handlers
    "events": {
        // Attach to beforeInitialize
        "initialized": function () {
            console.log("Initialized mychart...");
        }
    }
});

beforeLinkedItemOpen

Triggered just before a linked item in a LinkedChart is rendered, after the parent link is clicked. It is triggered before the instance of the drill-down chart is instantiated.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

level

Type: string

Level of the linked chart in to the parent chart (starts from 0)

linkedItemOpened

Triggered when a linked chart is rendered, after the parent link is clicked.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

item

Type: string

JavaScript object instance of the linked chart opened

level

Type: string

Level of the linked chart in to the parent chart (starts from 0)

beforeLinkedItemClose

Triggered just before a linked chart is closed.

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

item

Type: string

JavaScript object instance of the linked chart closed

Type: string

Level of the linked chart in to the parent chart (starts from 0)

linkedItemClosed

Triggered when a linked chart is closed to go back to its parent chart.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

level

Type: string

Level of the linked chart in to the parent chart (starts from 0)

dataLoadRequestCompleted

Triggered when chart data is successfully loaded from a URL (instead of a static JSON or XML file from the system).

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

source

Type: string

Nature of the data load request. Presently, its value is XMLHttpRequest.

url

Type: string

URL of the data source

dataFormat

Type: FroalaCharts~dataFormats

Format of the source data ( json or xml)

silent

Type: boolean

true if silent instructions are saved to arguments

successcallback

Type: boolean

Function called once the event is fired

dataSource

Type: object

Object containing the source data for the chart

Type: object

dataLoadError

Triggered if an error is encountered while loading data from the specified URL to the chart object.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

url

Type: string

URL to fetch the source data

dataFormat

Type: FroalaCharts~dataFormats

Format of the source data ( json or xml)

error

Type: object

Error object passed to the event for debugging the JavaScript errors encountered

httpStatus

Type: number

Parameter to identify server communication issues (for example, 404 status is returned if the URL is not found)

dataLoadCancelled

Triggered when the default behavior of the beforedataload event is cancelled using the eventObj.preventDefault() method. Subsequently, all AJAX requests are aborted.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

url

Type: string

URL to fetch the source data

dataFormat

Type: FroalaCharts~dataFormats

Format of the source data ( json or xml)

dataLoadRequestCancelled

Triggered when the default behavior of the dataLoadRequested event is cancelled by calling the eventObj.preventDefault() method. The event is internally fired if the data source is a local path or the URL fails internal security checks.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

source

Type: string

Nature of the data load request. Presently, its value is XMLHttpRequest.

url

Type: string

URL of the data source

dataFormat

Type: FroalaCharts~dataFormats

Format of the source data ( json or xml)

silent

Type: boolean

true if silent instructions are saved to arguments

config

Type: function

Function called once the event is fired

successcallback

Type: boolean

Function called once the event is fired

beforedataload

Triggered when the data is updated to a chart. This hook can be used by the theme manager to update the chart data.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

data

Type: object

Chart data

dataUpdated

Triggered when chart data is updated and the chart is redrawn, after the drawComplete event.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

data

Type: string or object

Chart data, in the dataFormats used

format

Type: FroalaCharts~dataFormats

Format in which chart data is finally passed to the chart

dataSource

Type: object

Object containing the source data for the chart

dataFormat

Type: FroalaCharts~dataFormats

Format of the source data

silent

Type: boolean

true if silent instructions are saved to arguments

dataUpdateCancelled

Triggered when the default behavior of the beforeDataUpdate event is cancelled by calling the eventObj.preventDefault() method.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

data

Type: string or object

Chart data

format

FroalaCharts~dataFormats

Format in which the data was to be passed on for rendering

dataSource

Type: string

Source data, as specified using data setter functions like setChartData()

dataFormat

Type: FroalaCharts~dataFormats

Format of the source data ( json or xml)

error

Type: object

Error object passed to the event for debugging the JavaScript errors encountered

dataLoadRequested

Triggered when chart data is loaded from a URL instead of a static JSON or XML file from the system.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

source

Type: string

Nature of the data load request. Presently, its value is XMLHttpRequest.

url

Type: string

URL of the data source

dataFormat

Type: FroalaCharts~dataFormats

Format of the source data ( json or xml)

silent

Type: boolean

true if silent instructions are saved to arguments

callback

Type: boolean

Function called once the event is fired

beforeDataUpdate

Triggered just before chart data is passed to the chart. It is useful if any operations have to be performed on the data before it is applied to the chart.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

data

Type: string or object

Chart data, in the [data format] dataFormats used

format

Type: FroalaCharts~dataFormats

Format in which chart data is finally passed to the chart

dataSource

Type: object

Object containing the source data for the chart

dataFormat

Type: FroalaCharts~dataFormats

Format of the source data

silent

Type: boolean

true if silent instructions are saved to arguments

Example

// Show data of a single-series column chart in an
// ascending sorted order.
FroalaCharts.ready(function () {
    var chart = new FroalaCharts({
        type: "column",
        renderAt: "chart-container"
    });

    // Add the data handler to intercept incoming
    // data and sort it.
    chart.addEventListener("beforeDataUpdate", function (event, args) {
        var data = args.data,
            values;

        // If incoming data is not JSON then convert it to JSON
        if (args.format !== 'json') {
            data = FroalaCharts.transcodeData(data, args.format, 'json');
        }

        // Get hold of the data array
        values = data.data;
        if (values && values.length) { // Check whether data exists
            // Sort the data by passing a comparison function to the
            // sort function of the array of values.
            values.sort(function (a, b) {
                 return (a && a.value) - (b && b.value);
            });
        }

        // Convert data back to original format in case it wasn't
        // originally JSON
        if (args.format !== 'json') {
            data = FroalaCharts.transcodeData(data, 'json', args.format);
        }

        // Replace the data with updated data.
        args.data = data;
    });
});

chartCleared

Triggered when the complete chart canvas is cleared by calling the clearChart() method or by clicking the context menu in real-time charts.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

slicingEnd

Triggered when a pie or a doughnut slice completes slicing out/slicing in.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

slicedState

Type: boolean

State of the slice before the event was triggered; true if the slice was already sliced out, false if the slice was sliced in

data

Type: string

The plot data from the chart to slice.

dataIndex

Type: number

Index of the data plot in the order of its definition in the dataset

slicingStart

Triggered when a pie or a doughnut slice begins slicing out/slicing in.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

slicedState

Type: boolean

State of the slice before the event was triggered; true if the slice was already sliced out, false if the slice was sliced in

data

Type: string

Source data for the slice

dataIndex

Type: number

Index of the data plot, in the order of its definition in the dataset

rotationEnd

Triggered when a pie/doughnut chart completes rotating.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

startingAngle

Type: number

Measure of the angle from which the pie/doughnut chart starts rotating

startingAngle

Type: number

Difference between the angle measures at the start and at the end of rotation

rotationStart

Triggered when a pie/doughnut chart starts rotating.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

startingAngle

Type: number

Measure of the angle from which the pie/doughnut chart starts rotating

centerLabelClick

Triggered every time the center label of the doughnut chart is clicked.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

width

Type: number or percent

Chart width, in pixels or percentage

width

Type: number or percent

Chart height, in pixels or percentage

container

Type: DOMElement

DOM element used to render the chart

pixelWidth

Type: number

Width of the DOM element, in pixels, used to render the chart

pixelHeight

Type: number

Height of the DOM element, in pixels, used to render the chart

id

Type: string

Chart ID

centerLabelText

Type: string

Text displayed as the center label

centerLabelChanged

Triggered every time the text within the center label of the doughnut chart changes.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

width

Type: number or percent

silent

Chart width, in pixels or percentage

width

Type: number or percent

silent

Chart height, in pixels or percentage

container

Type: DOMElement

silent

DOM element used to render the chart

pixelWidth

Type: number

Width of the DOM element, in pixels, used to render the chart

pixelHeight

Type: number

Height of the DOM element, in pixels, used to render the chart

id

Type: string

Chart ID

centerLabelText

Type: string

Text displayed as the center label

chartClick

Triggered every time a chart is clicked.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

chartX

Type: number

x-coordinate of the pointer, relative to the chart

chartY

Type: number

y-coordinate of the pointer, relative to the chart

pageX

Type: number

x-coordinate of the pointer, relative to the page

pageY

Type: number

y-coordinate of the pointer, relative to the page

width

Type: number or percent

Chart width, in pixels or percentage

width

Type: number or percent

Chart height, in pixels or percentage

container

Type: DOMElement

DOM element used to render the chart

pixelWidth

Type: number

Width of the DOM element, in pixels, used to render the chart

pixelHeight

Type: number

Height of the DOM element, in pixels, used to render the chart

id

Type: string

Chart ID

} } dataObj (Deprecated)

chartX

Type: number

x-coordinate of the pointer, relative to the chart

chartY

Type: number

y-coordinate of the pointer, relative to the chart

pageX

Type: number

x-coordinate of the pointer, relative to the page

pageY

Type: number

y-coordinate of the pointer, relative to the page

width

Type: number or percent

Chart width, in pixels or percentage

width

Type: number or percent

Chart height, in pixels or percentage

container

Type: DOMElement

DOM element used to render the chart

pixelWidth

Type: number

Width of the DOM element, in pixels, used to render the chart

pixelHeight

Type: number

Height of the DOM element, in pixels, used to render the chart

id

Type: string

Chart ID

Example

FroalaCharts.ready(function () {
    var chart = new FroalaCharts({
        type: 'column',
        dataFormat: 'jsonurl',
        dataSource: 'chart-data.json',
        renderAt: 'chart-container-div',

        events: {
            chartClick: function (eventObj, argsObj) {
                console.log('Chart clicked at ' + argsObj.chartX + ',' + argsObj.chartY);
            }
        }
    });

    chart.render();
});

chartMouseMove

Triggered when the mouse pointer is moved over a chart. The event arguments pass useful information related to pointer location, relative to the chart and the page, that can be used for positioning elements like annotations or integrating charts with custom tooltip libraries.

By default, a chart does not trigger this event until is enabled to do so. To enable this event for a chart, set the enableChartMouseMoveEvent attribute to 1.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

chartX

Type: number

x-coordinate of the pointer, relative to the chart

chartY

Type: number

y-coordinate of the pointer, relative to the chart

pageX

Type: number

x-coordinate of the pointer, relative to the page

pageY

Type: number

y-coordinate of the pointer, relative to the page

width

Type: number or percent

Chart width, in pixels or percentage

width

Type: number or percent

Chart height, in pixels or percentage

container

Type: DOMElement

DOM element used to render the chart

pixelWidth

Type: number

Width of the DOM element, in pixels, used to render the chart

pixelHeight

Type: number

Height of the DOM element, in pixels, used to render the chart

id

Type: string

Chart ID

chartRollOver

Triggered every time the mouse pointer is rolled over a chart.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

chartX

Type: number

x-coordinate of the pointer, relative to the chart

chartY

Type: number

y-coordinate of the pointer, relative to the chart

pageX

Type: number

x-coordinate of the pointer, relative to the page

pageY

Type: number

y-coordinate of the pointer, relative to the page

width

Type: number or percent

Chart width, in pixels or percentage

width

Type: number or percent

Chart height, in pixels or percentage

container

Type: DOMElement

DOM element used to render the chart

pixelWidth

Type: number

Width of the DOM element, in pixels, used to render the chart

pixelHeight

Type: number

Height of the DOM element, in pixels, used to render the chart

id

Type: string

Chart ID

Example

// Create a chart and display the caption of the chart over which the mouse has been hovered. The
// event is attached to the Froala Charts global `addEventListener` function so that it is fired for
// all charts rendered on that page Once this event listener has been attached, any chart rendered on
// page will cause a console log when hovered or tapped.
FroalaCharts.addEventListener('chartRollOver', function (event) {
    var chart = event.sender, // access the chart that raised this event
        caption = chart && chart.getChartAttribute('caption'); // get the chart caption

    // Output the caption in JavaScript console
    console.log('Mouse entered on the chart with caption: ' + caption);
});

chartRollOut

Triggered every time the mouse pointer is rolled out from over a chart.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

chartX

Type: number

x-coordinate of the pointer, relative to the chart

chartY

Type: number

y-coordinate of the pointer, relative to the chart

pageX

Type: number

x-coordinate of the pointer, relative to the page

pageY

Type: number

y-coordinate of the pointer, relative to the page

width

Type: number or percent

Chart width, in pixels or percentage

width

Type: number or percent

Chart height, in pixels or percentage

container

Type: DOMElement

DOM element used to render the chart

pixelWidth

Type: number

Width of the DOM element, in pixels, used to render the chart

pixelHeight

Type: number

Height of the DOM element, in pixels, used to render the chart

id

Type: string

Chart ID

Example

// Create a chart and display the caption of the chart over which the mouse has been hovered. The
// event is attached to the FroalaCharts global `addEventListener` function so that it is fired for
// all charts rendered on that page Once this event listener has been attached, any chart rendered on
// page will cause a console log when hovered out or tapped away.
FroalaCharts.addEventListener('chartRollOut', function (event) {
    var chart = event.sender, // access the chart that raised this event
        caption = chart && chart.getChartAttribute('caption'); // get the chart caption

    // Output the caption in JavaScript console
    console.log('Mouse left the chart with caption: ' + caption);
});

backgroundLoaded

Triggered when the background image for a chart (specified using the bgImage attribute) is loaded.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

url

Type: string

URL of the background image

bgImageAlpha

Type: string

Transparency of the image

bgImageDisplayMode

Type: string

Display mode set for the image

bgImageVAlign

Type: string

Vertical alignment of the image

bgImageHAlign

Type: string

Horizontal alignment of the image

imageWidth

Type: string

Image width

imageHeight

Type: string

Image height

backgroundLoadError

Triggered when there is an error in loading the background image for a chart (specified using the bgImage attribute).

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

url

Type: string

URL of the background image

bgImageAlpha

Type: string

Transparency of the image

bgImageDisplayMode

Type: string

Display mode set for the image

bgImageVAlign

Type: string

Vertical alignment of the image

bgImageHAlign

Type: string

Horizontal alignment of the image

imageWidth

Type: string

Image width

imageHeight

Type: string

Image height

error

Type: object

Error object passed to the event for debugging the JavaScript errors encountered

legendItemClicked

Triggered when a legend item is clicked.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

id

Type: string

Chart ID

chartX

Type: number

x-coordinate of the pointer, relative to the chart

chartY

Type: number

y-coordinate of the pointer, relative to the chart

pageX

Type: number

x-coordinate of the pointer, relative to the page

pageY

Type: number

y-coordinate of the pointer, relative to the page

datasetName

Type: string

Dataset to which the data plot belongs

dataIndex

Type: number

Index of the data plot, in the order of its definition in the dataset

visible

Type: boolean

Visibility status of the legend item ( true if shown, false if hidden)

preventDefaults

Type: function

legendItemRollover

Triggered when the mouse pointer is rolled over a legend item.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

id

Type: string

Chart ID

chartX

Type: number

x-coordinate of the pointer, relative to the chart

chartY

Type: number

y-coordinate of the pointer, relative to the chart

pageX

Type: number

x-coordinate of the pointer, relative to the page

pageY

Type: number

y-coordinate of the pointer, relative to the page

datasetName

Type: string

Dataset to which the data plot belongs

dataIndex

Type: number

Index of the data plot, in the order of its definition in the dataset

visible

Type: boolean

Visibility status of the legend item ( true if shown, false if hidden)

legendItemRollout

Triggered when the mouse pointer is rolled out from over a legend item.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

id

Type: string

Chart ID

chartX

Type: number

x-coordinate of the pointer, relative to the chart

chartY

Type: number

y-coordinate of the pointer, relative to the chart

pageX

Type: number

x-coordinate of the pointer, relative to the page

pageY

Type: number

y-coordinate of the pointer, relative to the page

datasetName

Type: string

Dataset to which the data plot belongs

dataIndex

Type: number

Index of the data plot, in the order of its definition in the dataset

visible

Type: boolean

Visibility status of the legend item ( true if shown, false if hidden)

logoRollover

Triggered when the mouse pointer is rolled over a logo on a chart.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

chartX

Type: number

x-coordinate of the pointer, relative to the chart

chartY

Type: number

y-coordinate of the pointer, relative to the chart

pageX

Type: number

x-coordinate of the pointer, relative to the page

pageY

Type: number

y-coordinate of the pointer, relative to the page

logoURL

Type: string

URL of the logo image

logoAlpha

Type: number

Transparency set for the logo

logoPosition

Type: string

Logo position ( tr, tl, br, bl)

logoScale

Type: number

Logo image scaling value

logoLink

Type: string

URL to which the user will be redirected, if the logo is clicked

logoRollout

Triggered when the mouse pointer is rolled out from over a logo on a chart.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

chartX

Type: number

x-coordinate of the pointer, relative to the chart

chartY

Type: number

y-coordinate of the pointer, relative to the chart

pageX

Type: number

x-coordinate of the pointer, relative to the page

pageY

Type: number

y-coordinate of the pointer, relative to the page

logoURL

Type: string

URL of the logo image

logoAlpha

Type: number

Transparency set for the logo

logoPosition

Type: string

Logo position ( tr, tl, br, bl)

logoScale

Type: number

Logo image scaling value

logoLink

Type: string

URL to which the user will be redirected, if the logo is clicked

logoClick

Triggered when the logo on a chart is clicked.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

chartX

Type: number

x-coordinate of the pointer, relative to the chart

chartY

Type: number

y-coordinate of the pointer, relative to the chart

pageX

Type: number

x-coordinate of the pointer, relative to the page

pageY

Type: number

y-coordinate of the pointer, relative to the page

logoURL

Type: string

URL of the logo image

logoAlpha

Type: number

Transparency set for the logo

logoPosition

Type: string

Logo position ( tr, tl, br, bl)

logoScale

Type: number

Logo image scaling value

logoLink

Type: string

URL to which the user will be redirected, if the logo is clicked

logoLoaded

Triggered when the logo is loaded on a chart.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

logoURL

Type: string

URL of the logo image

logoAlpha

Type: number

Transparency set for the logo

logoPosition

Type: string

Logo position ( tr, tl, br, bl)

logoScale

Type: number

Logo image scaling value

logoLink

Type: string

URL to which the user will be redirected, if the logo is clicked

logoLoadError

Triggered when the logo cannot be loaded on a chart because of an error.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

logoURL

Type: string

URL of the logo image

logoAlpha

Type: number

Transparency set for the logo

logoPosition

Type: string

Logo position ( tr, tl, br, bl)

logoScale

Type: number

Logo image scaling value

logoLink

Type: string

URL to which the user will be redirected, if the logo is clicked

error

Type: object

Error object passed to the event for debugging the JavaScript errors encountered

beforeExport

Triggered just before the exporting process of a chart begins, through the export context menu or when the exportChart() method is called programmatically.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

buttons

Type: object

Object containing the status of buttons on the chart

bgColor

Type: string

Background color of the exported chart

bgAlpha

Type: number

Transparency set for the exported chart

exportaction

Type: string

Action for exporting image/PDF. Set to download, if the exported image will be sent back to the client as a download, set to save if it will be saved on the server.

exportfilename

Type: string

Name (with extension) for the exported image/PDF

exporthandler

Type: string

Path of the server-side export handler

exportformat

Type: string

Format in which the chart is exported ( jpg, png, pdf)

exportparameters

Type: string

Additional parameters sent by the chart (defined using the exportParameters chart attribute)

exporttargetwindow

Type: string

In case of server-side exporting and when using download as action, this shows whether the exported image/PDF will opened in the same window (as an attachment for download), or it will open in a new window.

Applicable only for server-side exporting.

exportcallback

Type: string

Callback function executed after the chart is exported

exportwithimages

Type: boolean

Boolean attribute that indicates if the chart had external images that were also exported

exportformats

Type: object

Object containing all the export formats available

exported

Triggered when a chart exports successfully.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

DOMId

Type: string

ID of the chart exported

width

Type: number

Chart height

width

Type: number

Chart width

fileName

Type: string

Name of the exported file and the path where it is saved

statusCode

Type: boolean

Success status code of the export. Set to 1 if the export is successful, set to 0 if it fails.

statusMessage

Type: string

Message indicating success or failure

notice

Type: string

Message indicating that the chart was previously exported in the same format. In this case, a suffix for the file is internally generated and added to the filename.

Configure your code to show the properties and their values for the dataObj parameter in the console. You can then see the suffix that is generated internally.

} } dataObj (Deprecated) DOMId

Type: string

ID of the chart exported

width

Type: number

Chart height

width

Type: number

Chart width

fileName

Type: string

Name of the exported file and the path where it is saved

statusCode

Type: boolean

Success status code of the export. Set to 1 if the export is successful, set to 0 if it fails.

statusMessage

Type: string

Message indicating success or failure

notice

Type: string

Message indicating that the chart was previously exported in the same format. In this case, a suffix for the file is internally generated and added to the filename.

Configure your code to show the properties and their values for the dataObj parameter in the console. You can then see the suffix that is generated internally.

exportCancelled

Triggered when the default behavior of the beforeExport event is cancelled by calling the eventObj.preventDefault() method.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

buttons

Type: string

Chart data as XML string

bgColor

Type: string

Background color of the exported chart

bgAlpha

Type: number

Transparency set for the exported chart

exportaction

Type: string

Action for exporting image/PDF. Set to download, if the exported image will be sent back to the client as a download, set to save if it will be saved on the server.

exportfilename

Type: string

Name (with extension) for the exported image/PDF

exporthandler

Type: string

Path of the server-side export handler

exportformat

Type: string

Format in which the chart is exported ( jpg, png, pdf)

exportparameters

Type: string

Additional parameters sent by the chart (defined using the exportParameters chart attribute)

exporttargetwindow

Type: string

In case of server-side exporting and when using download as action, this shows whether the exported image/PDF will open in the same window (as an attachment for download), or it will open in a new window.

Applicable only for server-side exporting.

exportcallback

Type: string

Callback function executed after the chart is exported

exportwithimages

Type: boolean

Boolean attribute to indicate if the chart had external images that were also exported

exportformats

Type: Object

Object containing all the export formats available

beforePrint

Triggered before the printing process for a chart begins, after the print() method is called on the chart.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

printComplete

Triggered when the user confirms or cancels printing through the browser's print dialog box.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

printCancelled

Triggered when the default behavior of the beforePrint event is cancelled by calling the eventObj.preventDefault() method.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

dataLabelClick

Triggered every time the x-axis label of a data plot is clicked.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

chartX

Type: number

x-coordinate of the pointer, relative to the chart

chartY

Type: number

y-coordinate of the pointer, relative to the chart

pageX

Type: number

x-coordinate of the pointer, relative to the page

pageY

Type: number

y-coordinate of the pointer, relative to the page

text

Type: string

Label text

dataIndex

Type: number

Index of the data plot, in order of its definition in the source data

link

Type: string

URL to which the user will be redirected, if the data label is clicked

dataLabelRollOver

Triggered when the mouse pointer is rolled over the tick labels of x-axis or y-axis.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

chartX

Type: number

x-coordinate of the pointer, relative to the chart

chartY

Type: number

y-coordinate of the pointer, relative to the chart

pageX

Type: number

x-coordinate of the pointer, relative to the page

pageY

Type: number

y-coordinate of the pointer, relative to the page

text

Type: string

Label text

dataIndex

Type: number

Index of the data plot, in order of its definition in the source data

link

Type: string

URL to which the user will be redirected, if the data label is clicked

dataLabelRollOut

Triggered when the mouse pointer is rolled out from the tick labels of x-axis or y-axis.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

chartX

Type: number

x-coordinate of the pointer, relative to the chart

chartY

Type: number

y-coordinate of the pointer, relative to the chart

pageX

Type: number

x-coordinate of the pointer, relative to the page

pageY

Type: number

y-coordinate of the pointer, relative to the page

text

Type: string

Label text

dataIndex

Type: number

Index of the data plot, in order of its definition in the source data

link

Type: string

URL to which the user will be redirected, if the data label is clicked

onScroll

Triggered while scrolling through a zoom-line chart or scroll charts.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

scrollPosition

Type: number

Position of the scroll when you finish scrolling

pinned

Triggered in the pin mode of a zoom-line chart, when the user performs data selection to pin a range.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

startIndex

Type: number

Data index of the first item in the zoomed in view of the pin mode

startIndex

Type: string

Data label of the first item in the zoomed in view of the pin mode

endIndex

Type: number

Data index of the last item in the zoomed in view of the pin mode

endLabel

Type: string

Data label of the last item in the zoomed in view of the pin mode

dataRestored

Triggered when all data plots on the interactive charts (select-scatter, drag-node, and drag-able charts) are restored to their original values (by clicking the Restore button).

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

chartUpdated

Triggered every time the data on any of the interactive charts (select-scatter, drag-node, and the dragable charts) is updated by user interaction.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

dataObj

id

Type: string

Chart ID

sourceEvent

Type: string

Event that caused the chartUpdated event to be triggered. For example, in a drag-node chart, if a node was dragged to shift its position, the source event will be dataplotDragEnd.

sourceType

Type: string

Type of element that triggered this event

chartX

Type: number

x-coordinate of the pointer, relative to the chart

chartY

Type: number

y-coordinate of the pointer, relative to the chart

pageX

Type: number

x-coordinate of the pointer, relative to the page

pageY

Type: number

y-coordinate of the pointer, relative to the page

index

Type: number

Index of the updated data plot, in the order of its definition in the source data

datasetIndex

Type: number

Index of the dataset, to which the updated data plot belongs, in the order of its definition in the source data

datasetName

Type: number

Name of the dataset, to which the updated data plot belongs

x

Type: number

x-coordinate of the updated data plot

Applicable only to the drag-node chart.

y

Type: number

y-coordinate of the updated data plot

Applicable only to the drag-node chart.

shape

Type: string

Shape of the updated data plot

Applicable only to the drag-node chart.

width

Type: number

Width of the updated data plot

Applicable only to the drag-node chart.

width

Type: number

Height of the updated data plot

Applicable only to the drag-node chart.

radius

Type: number

Radius of the updated data plot

Applicable only to the drag-node chart.

sides

Type: number

Number of sides the shape of the updated data plot has

Applicable only to the drag-node chart.

label

Type: string

Data label of the updated data plot

toolText

Type: string

Tooltip text for the updated data plot

linkRollOut

Triggered when the mouse pointer is rolled out from over a link.

Event Object Parameters

data

value

Type: number

Value assigned to the link that triggered this event

color

Type: hex color code

Sets the color of the link.

Applicable only on Sankey Diagram.

alpha

Type: number

Sets the transparency of the link.

Applicable only on Sankey Diagram.

from

Type: string

This parameter accept strings, which indicates the node from which the clicked link begins.

Applicable only on Sankey Diagram.

to

Type: string

This parameter accept strings, which indicates the node at which the clicked link ends.

Applicable only on Sankey Diagram.

linkClick

Triggered when a link is clicked.

Event Object Parameters

data

value

Type: number

Value assigned to the link that triggered this event

color

Type: hex color code

Sets the color of the link.

Applicable only on Sankey Diagram.

alpha

Type: number

Sets the transparency of the link.

Applicable only on Sankey Diagram.

from

Type: string

This parameter accept strings, which indicates the node from which the clicked link begins.

Applicable only on Sankey Diagram.

to

Type: string

This parameter accept strings, which indicates the node at which the clicked link ends.

Applicable only on Sankey Diagram.

linkClicked

Triggered when any chart element made clickable, by configuring a link, is clicked.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

linkProvided

Type: string

Link containing the newchart-xml-id of the XML of the linked chart item

linkInvoked

Type: string

Link containing the newchart-xml-id of the XML of the linked chart item

linkAction

Type: string

Action that will take place when the link is clicked

beforeRender

Triggered before a chart is to be rendered. Calling the eventObject.preventDefault() method on this event will cancel the rendering process. The rendering process is triggered when the render() method is called on the chart instance.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

container

Type: DOMElement

HTML DOM element within which the chart will be rendered

width

Type: number

Chart width

width

Type: number

Chart height

Example

// Listening using global events
FroalaCharts.addEventListener('beforeRender', function (eventObj, argsObj) {
    // Prints id of the chart being rendered
    console.log("Chart with id " + eventObj.sender.id + " is about to be rendered.");
 });

// Pass event listener in the FroalaCharts constructor
var mychart = new FroalaCharts({
    "type": "column",
    "dataFormat": "json",
    "dataSource": {
         ...
    },
    // Attach event handlers
    "events": {
        // Attach to beforeRender
        "beforeRender": function (eventObj, argsObj) {
            console.log("Beginning render of " + eventObj.sender.id);
        }
    }
});

renderCancelled

Triggered when the default behavior of the beforeRender beforeRender event is cancelled using the eventObj.preventDefault() method.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

container

Type: DOMElement

DOM element used to render the chart

width

Type: number

Chart width

width

Type: number

Chart height

Example

// Listening using global events
FroalaCharts.addEventListener('renderCancelled', function (eventObj, argsObj) {
    // Prints id of the chart whose rendering was cancelled
    console.log("Rendering of chart with id " + eventObj.sender.id + " was cancelled.");
 });

// Pass event listener in the FroalaCharts constructor
var mychart = new FroalaCharts({
    "type": "column",
    "dataFormat": "json",
    "dataSource": {
         ...
    },
    // Attach event handlers
    "events": {
        // Attach to renderCancelled
        "renderCancelled": function (eventObj, argsObj) {
            console.log("Cancelled rendering of " + eventObj.sender.id);
        }
    }
});

beforeResize

Triggered before a chart is resized.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

currentWidth

Type: number or percent

Chart width, before resize, in pixels or percentage

currentHeight

Type: number or percent

Chart height, before resize, in pixels or percentage

newWidth

Type: number or percent

Chart width, after resize, in pixels or percentage

newHeight

Type: number or percent

Chart height, after resize, in pixels or percentage

resized

Triggered when a chart is resized either by calling the resizeTo() method or by changing dimensions of the chart container element, when the dimensions are in the percentage format.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

id

String

width

Type: number or percent

Chart ID

width

Type: number or percent

Chart height, after resize

prevWidth

Type: number or percent

Chart width, before resize

prevHeight

Type: number or percent

Chart height, before resize

originalWidth

Type: number

Chart width, when the chart was first rendered

originalHeight

Type: number

Chart height, when the chart was first rendered

pixelWidth

Type: number

Width of the DOM element, in pixels, used to render the chart

pixelHeight

Type: number

Height of the DOM element, in pixels, used to render the chart

resizeCancelled

Triggered when the eventObj.preventDefault() method is called from within the beforeResize event. This cancels the instructions received from the resizeTo() method.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

currentWidth

Type: number or percent

Current chart width, in pixels or percentage

currentHeight

Type: number or percent

Current chart height, in pixels or percentage

cancelledTargetWidth

Type: number or percent

Chart width requested to be set but cancelled

cancelledTargetHeight

Type: number or percent

Chart height requested to be set but cancelled

beforeDispose

Triggered before a chart is deleted and cleaned from memory.

Usually, this event is triggered by the dispose() method. It is internally raised when an already rendered chart is re-rendered or a child chart in LinkedCharts is closed.

Unused charts should be disposed to avoid memory-leaks within an application or dashboard.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

disposed

Triggered when a chart is deleted and cleaned from memory.

Usually, this event is triggered by the dispose() method. It is internally raised when an already rendered chart is re-rendered or a child chart in LinkedCharts is closed.

Unused charts should be disposed to avoid memory-leaks within an application or dashboard.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

disposeCancelled

Triggered when the default behaviour of the beforeDispose event is cancelled using the eventObj.preventDefault() method.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

linkedChartInvoked

Triggered just before a linked chart is rendered (before the rendered event is triggered for the linked chart), after the parent link is clicked.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

alias

Type: string

Chart alias

linkType

Type: string

Data format used for the link

data

Type: Object

Object containing the chart data

beforeDrillDown

Triggered just before the treemap chart is rendered when it is drilled down to a child node

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

node

Type: Object

The node clicked

withoutHead

Type: boolean

Indicates whether the showParent attribute is enabled or not

drillDown

Triggered just after the treemap chart is rendered when it is drilled down to a child node

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

node

Type: Object

The node clicked

withoutHead

Type: boolean

Indicates whether the showParent attribute is enabled or not

drillUp

Type: function

Function to drill up to the immediate parent node

drillUpToTop

Type: function

Function to drill up to the root node

beforeDrillUp

Triggered just before the treemap chart is rendered when it is drilled up to the immediate parent or the root node

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

node

Type: Object

The node clicked

withoutHead

Type: boolean

Indicates whether the showParent attribute is enabled or not

drillUp

Triggered just after the treemap chart is rendered when it is drilled up to the immediate parent or the root node

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

node

Type: Object

The node clicked

sender

Type: Object

Instance of the FroalaCharts object that fired this event

withoutHead

Type: boolean

Indicates whether the showParent attribute is enabled or not

drillUp

Type: function

Function to drill up to the immediate parent node

drillUpToTop

Type: function

Function to drill up to the root node

drillDownCancelled

Triggered when the beforeDrillDown is interrupted (by the stopPropagation() method)

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

node

Type: Object

The node clicked

withoutHead

Type: boolean

Indicates whether the showParent attribute is enabled or not

drillUpCancelled

Triggered when the beforeDrillUp is interrupted (by the stopPropagation() method)

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

node

Type: Object

The node clicked

withoutHead

Type: boolean

Indicates whether the showParent attribute is enabled or not

onChangeCrossLine

Triggered after you hide the crossline at runtime when the chart plots are not hovered. This event is fired when the mouse is placed outside the chart canvas.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data

currentIndex

Type: number

The index in which the crossline is present.

lastIndex

Type: number

The index in which the crossline was present previously.

source

Type: string

Mouse interaction is the only source in case of crossline.

containerNotFound

Triggered if the container is either not found or not provided after invoking render API.

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

beforeRender

This event is fired just before a chart is rendered.

Calling event.preventDefault() from within the handler of this event will cancel the rendering process. The rendering process is triggered when the FroalaCharts#render() method is called.

Lifecycle

Syntax
 {
    "chart": {
        // ...
    },
    "data": [
        // ...
    ]
},
"events": {
    "beforeRender": function(ev) {
        console.log(ev);
    }
}

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data.container

Type: DOMElement

HTML DOM element within which the chart will be rendered

data.width

Type: number

Chart width

data.height

Type: number

Chart height

renderComplete

This event is fired every time a chart is rendered using the FroalaCharts#render() method, the FroalaCharts#chartType() method, or the FroalaCharts#setChartData() method. It is also triggered every time chart data is successfully updated, which triggers a re-render internally.

The difference between this event and the rendered event is that the rendered event is triggered only when the FroalaCharts#render() method is called.

Lifecycle

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "renderComplete": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data.width

Type: number

Chart width

data.height

Type: number

Chart height

data.drawCount

Type: number

number of times the chart is drawn/redrawn

data.displayingMessage

Type: boolean

Boolean attribute indicating whether a message is configured for the chart

renderCancelled

This event is fired when the default behavior of the beforeRender event is cancelled using the event.preventDefault() from within the handler for the beforeRender event.

Lifecycle

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "renderCancelled": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data.container

Type: DOMElement

DOM element used to render the chart

data.width

Type: number

Chart width

data.height

Type: number

Chart height

rendered

The event is fired when the chart completes drawing, after the FroalaCharts#render() or the FroalaCharts#chartType() method is called. The chart renders if the data provided is correct; otherwise, an error message is rendered.A call to this event is made only once, even if new data may be supplied later. It can be used to invoke any further JavaScript methods on the chart or to change chart data.

If chart animation is enabled, this event is triggered before the animation process. In case you need to perform any action after the animation has completed, you will need to add an appropriate time delay in this event handler, for example, by using setTimeout .

Lifecycle

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "rendered": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

noDataToDisplay

The event is fired when no data is passed to the chart. It can be used to show an error message or take a corrective measure.

Lifecycle

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "noDataToDisplay": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

beforeDataUpdate

This event is fired just before chart data is passed to the chart. It is useful if any operations have to be performed on the data before it is applied to the chart.

Lifecycle

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "beforeDataUpdate": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data.data

Type: string or object

Chart data, in the [data format]dataFormats used

data.format

Type: FroalaCharts~dataFormats

Format in which chart data is finally passed to the chart

data.dataSource

Type: object

Object containing the source data for the chart

data.dataFormat

Type: FroalaCharts~dataFormats

Format of the source data

data.silent

Type: boolean

true if silent instructions are saved to arguments

dataUpdateCancelled

This event is fired when the default behavior of the beforeDataUpdate event is cancelled by calling event.preventDefault() from within the handler for beforeDataUpdate .

Lifecycle

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "dataUpdateCancelled": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data.data

Type: string or object

Chart data, in the [data format]dataFormats used

data.format

Type: FroalaCharts~dataFormats

Format in which chart data is finally passed to the chart

data.dataSource

Type: object

Object containing the source data for the chart

data.dataFormat

Type: FroalaCharts~dataFormats

Format of the source data

data.error

Type: object

Error object passed to the event for debugging the JavaScript errors encountered

dataUpdated

The event is fired when chart data is updated and the chart is redrawn, after the drawComplete event.

Lifecycle

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "dataUpdated": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data.data

Type: string or object

Chart data, in the [data format]dataFormats used

data.format

Type: FroalaCharts~dataFormats

Format in which chart data is finally passed to the chart

data.dataSource

Type: object

Object containing the source data for the chart

data.dataFormat

Type: FroalaCharts~dataFormats

Format of the source data

data.silent

Type: boolean

true if silent instructions are saved to arguments

chartMouseMove

This event is fired when the mouse pointer is moved over the chart. The event arguments pass useful information related to pointer location, relative to the chart and the page, that can be used for positioning elements like annotations or integrating charts with custom tooltip libraries.

By default, a Froala Charts chart does not trigger this event until is enabled to do so. To enable this event for a chart, set the enableChartMouseMoveEvent attribute to 1.

Hover Chart

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "chartMouseMove": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data.chartX

Type: number

x-coordinate of the pointer, relative to the chart

data.chartY

Type: number

y-coordinate of the pointer, relative to the chart

data.pageX

Type: number

x-coordinate of the pointer, relative to the chart

data.pageY

Type: number

y-coordinate of the pointer, relative to the chart

data.width

Type: number

Chart width, in pixels or percentage

data.height

Type: number

Chart height, in pixels or percentage

data.container

Type: DOMElement

DOM element used to render the chart

data.pixelWidth

Type: number

Width of the DOM element, in pixels, used to render the chart

data.pixelHeight

Type: number

Height of the DOM element, in pixels, used to render the chart

data.id

Type: string

Chart ID

chartRollOver

This event is fired every time the mouse pointer is rolled over the chart.

Hover Chart

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "chartRollOver": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data.chartX

Type: number

x-coordinate of the pointer, relative to the chart

data.chartY

Type: number

y-coordinate of the pointer, relative to the chart

data.pageX

Type: number

x-coordinate of the pointer, relative to the chart

data.pageY

Type: number

y-coordinate of the pointer, relative to the chart

data.width

Type: number

Chart width, in pixels or percentage

data.height

Type: number

Chart height, in pixels or percentage

data.container

Type: DOMElement

DOM element used to render the chart

data.pixelWidth

Type: number

Width of the DOM element, in pixels, used to render the chart

data.pixelHeight

Type: number

Height of the DOM element, in pixels, used to render the chart

data.id

Type: string

Chart ID

chartRollOut

This event is fired every time the mouse pointer is rolled out from the chart.

Hover Chart

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "chartRollOut": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data.chartX

Type: number

x-coordinate of the pointer, relative to the chart

data.chartY

Type: number

y-coordinate of the pointer, relative to the chart

data.pageX

Type: number

x-coordinate of the pointer, relative to the chart

data.pageY

Type: number

y-coordinate of the pointer, relative to the chart

data.width

Type: number

Chart width, in pixels or percentage

data.height

Type: number

Chart height, in pixels or percentage

data.container

Type: DOMElement

DOM element used to render the chart

data.pixelWidth

Type: number

Width of the DOM element, in pixels, used to render the chart

data.pixelHeight

Type: number

Height of the DOM element, in pixels, used to render the chart

data.id

Type: string

Chart ID

chartClick

This event is fired every time the chart is clicked.

Click Chart

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "chartClick": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data.chartX

Type: number

x-coordinate of the pointer, relative to the chart

data.chartY

Type: number

y-coordinate of the pointer, relative to the chart

data.pageX

Type: number

x-coordinate of the pointer, relative to the chart

data.pageY

Type: number

y-coordinate of the pointer, relative to the chart

data.width

Type: number

Chart width, in pixels or percentage

data.height

Type: number

Chart height, in pixels or percentage

data.container

Type: DOMElement

DOM element used to render the chart

data.pixelWidth

Type: number

Width of the DOM element, in pixels, used to render the chart

data.pixelHeight

Type: number

Height of the DOM element, in pixels, used to render the chart

data.id

Type: string

Chart ID

chartTypeInvalid

The event is fired when the given chart type is invalid or the chart type is not specified.

Lifecycle

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "chartTypeInvalid": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

legendItemClicked

This event is fired when the legend item is clicked.

Click Legend

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "legendItemClicked": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data.id

Type: string

Chart ID

data.chartX

Type: number

x-coordinate of the pointer, relative to the chart

data.chartY

Type: number

y-coordinate of the pointer, relative to the chart

data.pageX

Type: number

x-coordinate of the pointer, relative to the chart

data.pageY

Type: number

y-coordinate of the pointer, relative to the chart

data.datasetName

Type: string

Dataset to which the data plot belongs

data.dataIndex

Type: number

Index of the data plot, in the order of its definition in the dataset

data.visible

Type: boolean

Visibility status of the legend item (true if shown, false if hidden)

data.preventDefaults

Type: function

legendItemRollOver

This event is fired when the mouse pointer is rolled over the legend item.

Hover Legend

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "legendItemRollOver": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data.id

Type: string

Chart ID

data.chartX

Type: number

x-coordinate of the pointer, relative to the chart

data.chartY

Type: number

y-coordinate of the pointer, relative to the chart

data.pageX

Type: number

x-coordinate of the pointer, relative to the chart

data.pageY

Type: number

y-coordinate of the pointer, relative to the chart

data.datasetName

Type: string

Dataset to which the data plot belongs

data.dataIndex

Type: number

Index of the data plot, in the order of its definition in the dataset

data.visible

Type: boolean

Visibility status of the legend item (true if shown, false if hidden)

legendItemRollout

This event is fired when the mouse pointer is rolled out from the legend item.

Hover Legend

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "legendItemRollout": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data.id

Type: string

Chart ID

data.chartX

Type: number

x-coordinate of the pointer, relative to the chart

data.chartY

Type: number

y-coordinate of the pointer, relative to the chart

data.pageX

Type: number

x-coordinate of the pointer, relative to the chart

data.pageY

Type: number

y-coordinate of the pointer, relative to the chart

data.datasetName

Type: string

Dataset to which the data plot belongs

data.dataIndex

Type: number

Index of the data plot, in the order of its definition in the dataset

data.visible

Type: boolean

Visibility status of the legend item (true if shown, false if hidden)

beforeExport

This event is fired just before the exporting process of a chart begins, through the export context menu or when the FroalaCharts#exportChart() method is called.

Export Chart

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "beforeExport": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data.buttons

Type: object

Object containing the status of buttons on the chart

data.bgColor

Type: string

Background color of the exported chart

data.bgAlpha

Type: number

Transparency set for the exported chart

data.exportaction

Type: string

action for exporting image/PDF. Set to download, if the exported image will be sent back to the client as a download, set to save if it will be saved on the server.

data.exportfilename

Type: string

Name (with extension) for the exported image/PDF

data.exporthandler

Type: string

Path of the server-side export handler

data.exportformat

Type: string

Format in which the chart is exported (jpg, png, pdf)

data.exportparameters

Type: string

Additional parameters sent by the chart (defined using the exportParameters chart attribute)

data.exporttargetwindow

Type: string

In case of server-side exporting and when using download as action, this shows whether the exported image/PDF will opened in the same window (as an attachment for download), or it will open in a new window. Applicable only for server-side exporting.

data.exportcallback

Type: string

Callback function executed after the chart is exported

data.exportwithimages

Type: boolean

Boolean attribute that indicates if the chart had external images that were also exported

data.exportformats

Type: object

Object containing all the export formats available

exported

This event is fired when the chart exports successfully.

Export Chart

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "exported": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data.DOMId

Type: string

ID of the chart exported

data.height

Type: number

Chart height

data.width

Type: number

Chart width

data.fileName

Type: string

Name of the exported file and the path where it is saved

data.statusCode

Type: boolean

Success status code of the export. Set to 1 if the export is successful, set to 0 if it fails.

data.statusMessage

Type: string

Message indicating success or failure

data.notice

Type: string

Message indicating that the chart was previously exported in the same format. In this case, a suffix for the file is internally generated and added to the filename. Configure your code to show the properties and their values for the dataObj parameter in the console. You can then see the suffix that is generated internally.

exportCancelled

This event is fired when the default behavior of the beforeExport event is cancelled by calling the event.preventDefault() method from the handler of the beforeExport event.

Export Chart

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "exportCancelled": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data.buttons

Type: object

Object containing the status of buttons on the chart

data.bgColor

Type: string

Background color of the exported chart

data.bgAlpha

Type: number

Transparency set for the exported chart

data.exportaction

Type: string

action for exporting image/PDF. Set to download, if the exported image will be sent back to the client as a download, set to save if it will be saved on the server.

data.exportfilename

Type: string

Name (with extension) for the exported image/PDF

data.exporthandler

Type: string

Path of the server-side export handler

data.exportformat

Type: string

Format in which the chart is exported (jpg, png, pdf)

data.exportparameters

Type: string

Additional parameters sent by the chart (defined using the exportParameters chart attribute)

data.exporttargetwindow

Type: string

In case of server-side exporting and when using download as action, this shows whether the exported image/PDF will opened in the same window (as an attachment for download), or it will open in a new window. Applicable only for server-side exporting.

data.exportcallback

Type: string

Callback function executed after the chart is exported

data.exportwithimages

Type: boolean

Boolean attribute that indicates if the chart had external images that were also exported

data.exportformats

Type: object

Object containing all the export formats available

beforePrint

This event is fired before the printing process for a chart begins, after the FroalaCharts#print() method is called on the chart.

Print Chart

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "beforePrint": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

printComplete

This event is fired when the user confirms or cancels printing through the browser's print dialog box.

Print Chart

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "printComplete": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

printCancelled

This event is fired when the default behavior of the beforePrint event is cancelled by calling the event.preventDefault() method from the handler for the beforePrint event.

Print Chart

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "printCancelled": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

dataMarkerRollOver

This event is fired when a user hovers over the data marker.

Hover Data marker

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "dataMarkerRollOver": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

timestamp

Type: number

The UNIX timestamp corresponding to the time where the data marker has been specified to appear.

timeText

Type: string

The text representation of the timestamp.

timeFormatter

Type: string

The formatter string used to represent the timestamp as the time text.

binStart

Type: number

The timestamp corresponding to the start of the bin in which the data marker appears.

binEnd

Type: number

The timestamp corresponding to the end of the bin in which the data marker appears.

binValue

Type: number

The aggregated value on which the data marker is placed.

binValueFormatted

Type: string

The formatted representation of the binValue.

measure

Type: string

The name of the measure against which the data marker is being shown.

series

Type: string

The name of the series to which the data marker belongs.

seriesValue

Type: string

The series value to which the data marker belongs.

identifier

Type: string

The identifier text present on the data marker.

tooltipText

Type: string

The text for the data marker as shown on the tooltip.

dataMarkerRollOut

This event is fired when a user hovers out of the data marker.

Hover Data marker

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "dataMarkerRollOut": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

timestamp

Type: number

The UNIX timestamp corresponding to the time where the data marker has been specified to appear.

timeText

Type: string

The text representation of the timestamp.

timeFormatter

Type: string

The formatter string used to represent the timestamp as the time text.

binStart

Type: number

The timestamp corresponding to the start of the bin in which the data marker appears.

binEnd

Type: number

The timestamp corresponding to the end of the bin in which the data marker appears.

binValue

Type: number

The aggregated value on which the data marker is placed.

binValueFormatted

Type: string

The formatted representation of the binValue.

measure

Type: string

The name of the measure against which the data marker is being shown.

series

Type: string

The name of the series to which the data marker belongs.

seriesValue

Type: string

The series value to which the data marker belongs.

identifier

Type: string

The identifier text present on the data marker.

tooltipText

Type: string

The text for the data marker as shown on the tooltip.

dataMarkerClick

This event is fired when a user clicks on a data marker.

Click Data marker

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "dataMarkerClick": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

timestamp

Type: number

The UNIX timestamp corresponding to the time where the data marker has been specified to appear.

timeText

Type: string

The text representation of the timestamp.

timeFormatter

Type: string

The formatter string used to represent the timestamp as the time text.

binStart

Type: number

The timestamp corresponding to the start of the bin in which the data marker appears.

binEnd

Type: number

The timestamp corresponding to the end of the bin in which the data marker appears.

binValue

Type: number

The aggregated value on which the data marker is placed.

binValueFormatted

Type: string

The formatted representation of the binValue.

measure

Type: string

The name of the measure against which the data marker is being shown.

series

Type: string

The name of the series to which the data marker belongs.

seriesValue

Type: string

The series value to which the data marker belongs.

identifier

Type: string

The identifier text present on the data marker.

tooltipText

Type: string

The text for the data marker as shown on the tooltip.

timeMarkerRollOver

This event is fired when a user hovers over a time instant marker’s box or a time span marker’s rectangular area.

Hover Time marker

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "timeMarkerRollOver": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

start

Type: number

The UNIX timestamp corresponding to the start time of the time marker.

startText

Type: string

A human readable text representation of the start timestamp.

end

Type: number

The UNIX timestamp corresponding to the end time of the time marker.

endText

Type: string

A human readable text representation of the end timestamp

formatter

Type: string

The formatter string used to format the start and end timestamps as startText and endText respectively.

label

Type: String

An array of time marker labels.

type

Type: String

The type of the time marker - full or minimal.

timeMarkerRollOut

This event is fired when a user hovers out of a time instant marker’s box or a time span marker’s rectangular area.

Hover Time marker

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "timeMarkerRollOut": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

start

Type: number

The UNIX timestamp corresponding to the start time of the time marker.

startText

Type: string

A human readable text representation of the start timestamp.

end

Type: number

The UNIX timestamp corresponding to the end time of the time marker.

endText

Type: string

A human readable text representation of the end timestamp

formatter

Type: string

The formatter string used to format the start and end timestamps as startText and endText respectively.

label

Type: String

An array of time marker labels.

type

Type: String

The type of the time marker - full or minimal.

timeMarkerClick

This event is fired when a user clicks on a time instant marker’s box or a time span marker’s rectangular area.

Click Time marker

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "timeMarkerClick": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

start

Type: number

The UNIX timestamp corresponding to the start time of the time marker.

startText

Type: string

A human readable text representation of the start timestamp.

end

Type: number

The UNIX timestamp corresponding to the end time of the time marker.

endText

Type: string

A human readable text representation of the end timestamp

formatter

Type: string

The formatter string used to format the start and end timestamps as startText and endText respectively.

label

Type: String

An array of time marker labels.

type

Type: String

The type of the time marker - full or minimal.

referenceLineRollOver

This event is fired when a user hovers over the notch of a reference line.

Hover Reference line

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "referenceLineRollOver": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

label

Type: String

The label of the reference line.

value

Type: number

The value against which the reference line has been plotted.

valueFormatted

Type: String

The formatted representation of the value of the reference line.

referenceLineRollOut

This event is fired when a user hovers out of the notch of a reference line.

Hover Reference line

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "referenceLineRollOut": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

label

Type: String

The label of the reference line.

value

Type: number

The value against which the reference line has been plotted.

valueFormatted

Type: string

The formatted representation of the value of the reference line.

referenceLineClick

This event is fired when a user clicks on the notch of a reference line.

Click Reference line

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "referenceLineClick": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

label

Type: string

The label of the reference line.

value

Type: number

The value against which the reference line has been plotted.

valueFormatted

Type: string

The formatted representation of the value of the reference line.

referenceZoneRollOver

This event is fired when a user hovers over a reference zone’s notches.

Hover Reference zone

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "referenceZoneRollOver": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

label

Type: string

The label of the reference line.

valueMax

Type: number

The maximum value of the reference zone.

valueMin

Type: number

The minimum value of the reference zone.

valueMaxFormatted

Type: string

The formatted valueMax of the reference zone.

valueMinFormatted

Type: string

The formatted valueMin of the reference zone.

referenceZoneRollOut

This event is fired when a user hovers out of the reference zone’s notches.

Hover Reference zone

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "referenceZoneRollOut": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

label

Type: string

The label of the reference line.

valueMax

Type: number

The maximum value of the reference zone.

valueMin

Type: number

The minimum value of the reference zone.

valueMaxFormatted

Type: string

The formatted valueMax of the reference zone.

valueMinFormatted

Type: string

The formatted valueMin of the reference zone.

referenceZoneClick

This event is fired when a user clicks on a reference zone’s notches

Click Reference zone

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "referenceZoneClick": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

label

Type: string

The label of the reference line.

valueMax

Type: number

The maximum value of the reference zone.

valueMin

Type: number

The minimum value of the reference zone.

valueMaxFormatted

Type: string

The formatted valueMax of the reference zone.

valueMinFormatted

Type: string

The formatted valueMin of the reference zone.

dataPlotClick

This event is fired when the data plot is clicked.

The payload data of event object will vary slightly based on plot type. Refer to parameter tables below to know more.

Click Data Plot

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "dataPlotClick": function(ev) {
     console.log(ev);
   }
 }

Common across all plots

start

Type: number

The UNIX timestamp corresponding to the start time of the bin in which the plot being clicked exists.

end

Type: number

The UNIX timestamp corresponding to the end time of the bin in which the plot being clicked exists.

startText

Type: string

The start timestamp represented in a human readable format.

endText

Type: string

The end timestamp represented in a human readable format.

timeFormatter

Type: string

The formatter string used to represent the start/ end timestamps as startText/ endText.

plotType

Type: string

The type of the plot being clicked - column, line, stepLine, smoothLine, area, stepArea , smoothArea, candlestick or ohlc .

series

Type: string

The name of the series that the plot belongs to.

seriesValue

Type: string

The value of the series that the plot represents.

binUnit

Type: string

The unit of time being represented in the bin - millisecond, second, minute, hour, day, month or year .

binMultiplier

Type: number

The multiplier of the binUnit being displayed.

aggregation

Type: string

The aggregation strategy used aggregate the values in the bin - sum, average, min, max, first , last .

Column, Line, Area

measure

Type: string

The name of the measure being represented by the plot.

binValue

Type: number

The raw aggregated value being represented by the plot.

binValueFormatted

Type: string

The aggregated binValue being displayed by the plot, after formatting.

Candlestick, OHLC

measure

Type: string

The name of the measure being represented as the close value of the plot.

measureOpen

Type: string

The name of the measure being represented as the open value of the plot.

measureHigh

Type: string

The name of the measure being represented as the high value of the plot.

measureLow

Type: string

The name of the measure being represented as the low value of the plot.

measureClose

Type: string

The name of the measure being represented as the close value of the plot.

binValue

Type: number

The raw aggregated close value being represented by the plot.

binValueFormatted

Type: string

The aggregated close value being displayed by the plot, after formatting.

binOpen

Type: number

The raw aggregated open value being represented by the plot.

binOpenFormatted

Type: string

The aggregated open value being displayed by the plot, after formatting.

binHigh

Type: number

The raw aggregated high value being represented by the plot.

binHighFormatted

Type: string

The aggregated high value being displayed by the plot, after formatting.

binLow

Type: number

The raw aggregated low value being represented by the plot.

binLowFormatted

Type: string

The aggregated low value being displayed by the plot, after formatting.

binClose

Type: number

The raw aggregated close value being represented by the plot.

binCloseFormatted

Type: string

The aggregated close value being displayed by the plot, after formatting.

dataPlotRollOver

This event is fired when the data plot is hovered upon.

The payload data of event object will vary slightly based on plot type.

Hover Data Plot

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "dataPlotRollOver": function(ev) {
     console.log(ev);
   }
 }

Common across all plots

start

Type: number

The UNIX timestamp corresponding to the start time of the bin in which the plot being clicked exists.

end

Type: number

The UNIX timestamp corresponding to the end time of the bin in which the plot being clicked exists.

startText

Type: string

The start timestamp represented in a human readable format.

endText

Type: string

The end timestamp represented in a human readable format.

timeFormatter

Type: string

The formatter string used to represent the start/ end timestamps as startText/ endText .

plotType

Type: string

The type of the plot being clicked - column, line, stepLine, smoothLine, area , stepArea, smoothArea, candlestick or ohlc .

series

Type: string

The name of the series that the plot belongs to.

seriesValue

Type: string

The value of the series that the plot represents.

binUnit

Type: string

The unit of time being represented in the bin - millisecond, second, minute, hour , day, month or year .

binMultiplier

Type: number

The multiplier of the binUnit being displayed.

aggregation

Type: string

The aggregation strategy used aggregate the values in the bin - sum, average, min , max, first, last .

Column, Line, Area

measure

Type: string

The name of the measure being represented by the plot.

binValue

Type: number

The raw aggregated value being represented by the plot.

binValueFormatted

Type: string

The aggregated binValue being displayed by the plot, after formatting.

Candlestick, OHLC

measure

Type: string

The name of the measure being represented as the close value of the plot.

measureOpen

Type: string

The name of the measure being represented as the open value of the plot.

measureHigh

Type: string

The name of the measure being represented as the high value of the plot.

measureLow

Type: string

The name of the measure being represented as the low value of the plot.

measureClose

Type: string

The name of the measure being represented as the close value of the plot.

binValue

Type: number

The raw aggregated close value being represented by the plot.

binValueFormatted

Type: string

The aggregated close value being displayed by the plot, after formatting.

binOpen

Type: number

The raw aggregated open value being represented by the plot.

binOpenFormatted

Type: string

The aggregated open value being displayed by the plot, after formatting.

binHigh

Type: number

The raw aggregated high value being represented by the plot.

binHighFormatted

Type: string

The aggregated high value being displayed by the plot, after formatting.

binLow

Type: number

The raw aggregated low value being represented by the plot.

binLowFormatted

Type: string

The aggregated low value being displayed by the plot, after formatting.

binClose

Type: number

The raw aggregated close value being represented by the plot.

binCloseFormatted

Type: string

The aggregated close value being displayed by the plot, after formatting.

dataPlotRollOut

This event is fired when a data plot is hovered out.

The payload data of event object will vary slightly based on plot type.

Hover Data Plot

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "dataPlotRollOut": function(ev) {
     console.log(ev);
   }
 }

Common across all plots

start

Type: number

The UNIX timestamp corresponding to the start time of the bin in which the plot being clicked exists.

end

Type: number

The UNIX timestamp corresponding to the end time of the bin in which the plot being clicked exists.

startText

Type: string

The start timestamp represented in a human readable format.

endText

Type: string

The end timestamp represented in a human readable format.

timeFormatter

Type: string

The formatter string used to represent the start/ end timestamps as startText/ endText .

plotType

Type: string

The type of the plot being clicked - column, line, stepLine, smoothLine , area, stepArea, smoothArea, candlestick or ohlc .

series

Type: string

The name of the series that the plot belongs to.

seriesValue

Type: string

The value of the series that the plot represents.

binUnit

Type: string

The unit of time being represented in the bin - millisecond, second , minute, hour, day, month or year .

binMultiplier

Type: number

The multiplier of the binUnit being displayed.

aggregation

Type: string

The aggregation strategy used aggregate the values in the bin - sum, average , min, max, first, last .

Column, Line, Area

measure

Type: string

The name of the measure being represented by the plot.

binValue

Type: number

The raw aggregated value being represented by the plot.

binValueFormatted

Type: string

The aggregated binValue being displayed by the plot, after formatting.

Candlestick, OHLC

measure

Type: string

The name of the measure being represented as the close value of the plot.

measureOpen

Type: string

The name of the measure being represented as the open value of the plot.

measureHigh

Type: string

The name of the measure being represented as the high value of the plot.

measureLow

Type: string

The name of the measure being represented as the low value of the plot.

measureClose

Type: string

The name of the measure being represented as the close value of the plot.

binValue

Type: number

The raw aggregated close value being represented by the plot.

binValueFormatted

Type: string

The aggregated close value being displayed by the plot, after formatting.

binOpen

Type: number

The raw aggregated open value being represented by the plot.

binOpenFormatted

Type: string

The aggregated open value being displayed by the plot, after formatting.

binHigh

Type: number

The raw aggregated high value being represented by the plot.

binHighFormatted

Type: string

The aggregated high value being displayed by the plot, after formatting.

binLow

Type: number

The raw aggregated low value being represented by the plot.

binLowFormatted

Type: string

The aggregated low value being displayed by the plot, after formatting.

binClose

Type: number

The raw aggregated close value being represented by the plot.

binCloseFormatted

Type: string

The aggregated close value being displayed by the plot, after formatting.

ready

This event is fired when the FroalaCharts library is ready to be used. By the time this event is raised, the browser's DOM is ready to be interacted with, which corresponds to the DOMContentLoaded event of browsers. In older browsers, where DOMContentLoaded is not fired, the ready event corresponds to the load event of the page. In case the FroalaCharts library is included in the page when the DOMContentLoaded event is already fired (i.e. the script is loaded asynchronously using AJAX or by using script deferring methods) the ready event is still fired to ensure the integrity of all the listeners. In many ways the nature of this event is similar to the jQuery(document).ready function of the jQuery library and the Ext.onReady function of the ExtJS library. One should interact with Froala Charts (i.e. create new charts, set options, etc.) only after this event has been fired. This event also helps you to neatly write your code in separate script files and in the page <head> thus keeping scripts from being a part of your page <body> An alternate (and shorthand) method to subscribing the ready event is to use the FroalaCharts.ready function. One advantage that the ready function has over the ready event is that the event is fired only once during the life-cycle of a page while functions passed to the ready function are executed even when attached after the ready event has been fired. This is a library level event and as such can be only listened via the FroalaCharts object on the FroalaCharts class alone. It will not be fired if it is subscribed to from individual chart instances.

Lifecycle

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "ready": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed.

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was defaultPrevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

Function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data.version

Type: array

Froala Charts framework version returned in the form of an array, equivalent to the array version

data.now

Type: boolean

Boolean attribute to indicate whether the event was triggered at the instant of the window.ondomcontentloaded event ( window.onload for older browsers) or whether the window was already loaded and the event was fired to maintain integrity

loaded

This event is fired when Froala Charts has finished downloading itself in the client environment. It indicates that the all the resources required to render a Froala Charts chart is ready and that a chart can be rendered. This event can be used to hide any loader components that you might have on your page

Lifecycle

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "loaded": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered.

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data.type

Type: string

Type of chart rendered

containerNotFound

This event is fired if the container is either not found or not provided after invoking FroalaCharts#render.

Lifecycle

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "containerNotFound": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered.

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

beforeInitialize

This pre-initialization event is fired every time a new instance of FroalaCharts is created. It then triggers a number of modules that need to be setup on every instance of FroalaCharts; the event can be used to perform any actions required to be completed before the initialization of each chart. Because this event is triggered upon instantiating a new FroalaCharts object, it is impossible to listen to this event by adding an event listener to the chart. By the time the event listener is attached (using the FroalaCharts#addEventListener method), the event will already have been already fired. However, there are alternate ways that can be used to listen to this event. You can listen to the FroalaCharts global events, using the FroalaCharts.addEventListener static method before even creating a new instance. The required instance of FroalaCharts can then be identified from within the event handler by using event.sender.id . You can also pass the event listener for the correct event within the events object when creating an instance of FroalaCharts

Lifecycle

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "beforeInitialize": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered.

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data.type

Type: string

Type of chart rendered

data.renderAt

Type: string

Id of the HTML DOM element within which the chart is rendered.

data.width

Type: number

Chart width.

data.height

Type: number

Chart height.

data.dataFormat

Type: string

Type of data (json, jsonurl, xml, xmlurl) passed to the chart object.

data.dataSource

Type: object

Object containing the source data for the chart

data.events

Type: object

Object containing details of all events configured for the chart.

initialized

This event is fired when a new instance of FroalaCharts is created. Initialization does not indicate that the chart has rendered; it only indicates that the JavaScript object instance using new FroalaCharts(...})) is created and is ready to be operated upon.

Lifecycle

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "initialized": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered.

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data.type

Type: string

Type of chart rendered

data.renderAt

Type: string

Id of the HTML DOM element within which the chart is rendered.

data.width

Type: number

Chart width.

data.height

Type: number

Chart height.

data.dataFormat

Type: string

Type of data (json, jsonurl, xml, xmlurl) passed to the chart object.

data.dataSource

Type: object

Object containing the source data for the chart

data.events

Type: object

Object containing details of all events configured for the chart.

beforeDraw

This event is fired when the chart is redrawn because of a data update, resize, change of chart message, or change of chart type.

Lifecycle

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "beforeDraw": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered.

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

drawComplete

This event is fired when the chart draws for the first time or is redrawn because of a data update, resize, change of chart message, or change of chart type.

Lifecycle

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "drawComplete": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered.

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data.drawCount

Type: number

Number of times the chart is drawn/redrawn

data.width

Type: number

Chart width, in pixels or percentage.

data.height

Type: number

Chart height, in pixels or percentage.

data.displayingMessage

Type: boolean

drawCancelled

This event is fired when event.preventDefault() is called from within the handler for the beforeDraw event.

Lifecycle

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "drawCancelled": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered.

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

beforeResize

This event is fired before a chart is resized.

Resize Chart

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "beforeResize": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered.

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data.currentWidth

Type: number

Chart width, before resize, in pixels or percentage

data.currentHeight

Type: number

Chart height, before resize, in pixels or percentage

data.newWidth

Type: number

Chart width, after resize, in pixels or percentage

data.newHeight

Type: number

Chart height, after resize, in pixels or percentage

resized

This event is fired when the chart is resized either by calling FroalaCharts#resizeTo() or by changing the dimensions of the chart container element, when the dimensions of the chart have been provided in the percentage format.

Resize Chart

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "resized": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered.

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data.id

Type: string

Chart ID.

data.width

Type: number

Chart width, after resize, in pixels or percentage.

data.height

Type: number

Chart height, after resize, in pixels or percentage.

data.prevWidth

Type: number

Chart width, before resize, in pixels or percentage.

data.prevHeight

Type: number

Chart height, before resize, in pixels or percentage.

data.originalWidth

Type: number

Chart width, when the chart was first rendered.

data.originalHeight

Type: number

Chart height, when the chart was first rendered.

data.pixelWidth

Type: number

Width of the DOM element, in pixels, used to render the chart.

data.pixelHeight

Type: number

Height of the DOM element, in pixels, used to render the chart.

resizeCancelled

This event is fired when event.preventDefault() is called from within the handler of the beforeResize event. This cancels any FroalaCharts#resizeTo() invocations.

Resize Chart

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "resizeCancelled": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered.

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data.currentWidth

Type: number

Current chart width, in pixels or percentage.

data.currentHeight

Type: number

Current chart height, in pixels or percentage.

data.cancelledTargetWidth

Type: number

Chart width, in pixels or percentage, requested to be set but cancelled.

data.cancelledTargetHeight

Type: number

Chart height, in pixels or percentage, requested to be set but cancelled.

beforeDispose

This event is fired before the chart is deleted and cleaned from the DOM and the browser’s memory.

Dispose Lifecycle

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "beforeDispose": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered.

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

disposed

Usually, this event is fired by the FroalaCharts#dispose() method. FroalaCharts also triggers it when an already rendered chart is re-rendered. Unused charts should always be disposed to avoid memory-leaks within an application or dashboard.

Dispose Lifecycle

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "disposed": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered.

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

disposeCancelled

This event is fired when the default behaviour of the beforeDispose event is cancelled using event.preventDefault() from a handler attached to the beforeDispose event.

Dispose Lifecycle

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "disposeCancelled": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered.

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

animationInvoked

This event is fired when the animation is started in the chart.

Lifecycle

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "animationInvoked": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

eventType

Type: string

Type (name) of the event triggered.

eventId

Type: number

Unique ID associated with the event. Internally, it is an incrementing counter that can also be used to verify the order in which the event was triggered.

sender

Type: FroalaCharts

Instance of the FroalaCharts object that fired this event. Events that are fired by the framework (and not by individual charts) have the framework as this property.

cancelled

Type: boolean

Boolean attribute that indicates whether an event's propagation was cancelled; set to true when eventObj.stopPropagation() is called.

stopPropagation

Type: function

Function called from within a listener to prevent subsequent listeners from being executed

defaultPrevented

Type: boolean

Boolean attribute that indicates whether the default action of the event was prevented; set to true when eventObj.preventDefault() is called.

preventDefault

Type: function

function to prevent the default action of an event. For example, if the eventObj.preventDefault() function is called for the beforeResize event, the chart will not be resized and the resizeCancelled event will be triggered.

detached

Type: boolean

Boolean attribute that indicates whether a listener has been detached and will no longer be executed; set to true when eventObj.detachHandler() is called.

detachHandler

Type: function

Function to allow the listener to remove itself rather than being called externally by the removeEventListener() method. It is useful for one-time event listening or for special situations when the event is no longer required to be listened when it has been triggered with a specific condition.

data.duration

Type: number

Specifies the animation duration is milliseconds(ms).

selectionChange

These actions include: After every instance of a panning/zooming action from a focus canvas. After selecting a standard range of time from the Standard Range Selector. After applying a valid range of time from the Custom Range Selector. After every instance of a panning/zooming action using the time navigator’s window. When using an API which affects the focused spread of time in the chart: FroalaCharts#setCurrentTimeSelection FroalaCharts#setBinSize FroalaCharts#setJSONData FroalaCharts#render

Zoom/Pan Chart

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "selectionChange": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

start

Type: number

The UNIX timestamp corresponding to the start of the time selection

end

Type: number

The UNIX timestamp corresponding to the end of the time selection.

binUnit

Type: String

The unit of time being represented on each bin - millisecond, second, minute, hour, day, month or year.

binMultiplier

Type: number

The multiplier for the binUnit being represented in each bin.

standardRangeSelect

This event is fired when a standard period is selected from the Standard Range Selector.

Click SRS

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "standardRangeSelect": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

unit

Type: string

The unit of time being selected - minute, hour, day, month or year .

multiplier

Type: number

The multiplier for the unit being selected.

text

Type: string

The text representing the standard period - 10Y, 5Y, 3Y, 2Y , 1Y, 6M, 3M, 1M, 15D, 7D, 1D, 12H, 6H, 3H, 1H or 30m

customRangeSelect

This event is fired when a valid custom period is applied from the Custom Range Selector.

Click CRS

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "customRangeSelect": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

start

Type: number

The UNIX timestamp corresponding to the start of the custom range selection.

end

Type: number

The UNIX timestamp corresponding to the end of the custom range selection.

startText

Type: string

The formatted time text corresponding to the start time of the custom range selection.

endText

Type: string

The formatted time text corresponding to the end time of the custom range selection.

formatter

Type: string

The formatter string used to represent the start/ end time as the startText/ endText .

timeNavBrushStart

This event is fired at the start of the user’s interaction with the time navigator’s window.

Drag Time Navigator

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "timeNavBrushStart": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

start

Type: number

The UNIX timestamp corresponding to the start of the brush selection.

startText

Type: string

A human readable text representation of the start timestamp (as shown in the active window labels)

end

Type: number

The UNIX timestamp corresponding to the end of the brush selection.

endText

Type: string

A human readable textual representation of the end timestamp (as shown in the active window labels).

formatter

Type: string

The formatter string used to derive the startTime and endTime from the start timestamp and the end timestamp respectively.

action

Type: string

Represents the action performed - scale or translate.

timeNavBrush

This event is fired on every instance of the window being dragged/squeezed by the user.

Drag Time Navigator

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "timeNavBrush": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

start

Type: number

The UNIX timestamp corresponding to the start of the brush selection.

startText

Type: string

A human readable text representation of the start timestamp (as shown in the active window labels)

end

Type: number

The UNIX timestamp corresponding to the end of the brush selection.

endText

Type: string

A human readable textual representation of the end timestamp (as shown in the active window labels).

formatter

Type: string

The formatter string used to derive the startTime and endTime from the start timestamp and the end timestamp respectively.

action

Type: string

Represents the action performed - scale or translate.

timeNavBrushEnd

This event is fired at the end of the user’s interaction with the time navigator’s window.

Drag Time Navigator

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "timeNavBrushEnd": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

start

Type: number

The UNIX timestamp corresponding to the start of the brush selection.

startText

Type: string

A human readable text representation of the start timestamp (as shown in the active window labels)

end

Type: number

The UNIX timestamp corresponding to the end of the brush selection.

endText

Type: string

A human readable textual representation of the end timestamp (as shown in the active window labels).

formatter

Type: string

The formatter string used to derive the startTime and endTime from the start timestamp and the end timestamp respectively.

action

Type: string

Represents the action performed - scale or translate.

canvasDragStart

This event is fired at the start of the user’s drag interaction with a chart canvas.

Drag Canvas

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "canvasDragStart": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

start

Type: number

The UNIX timestamp corresponding to the start of the canvas’ time spread.

end

Type: number

The UNIX timestamp corresponding to the end of the canvas’ time spread.

canvasDrag

This event is fired on every instance of the canvas being dragged by the user.

Drag Canvas

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "canvasDrag": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

start

Type: number

The UNIX timestamp corresponding to the start of the canvas’ time spread.

end

Type: number

The UNIX timestamp corresponding to the end of the canvas’ time spread.

canvasDragEnd

This event is fired at the end of the user’s drag interaction with a chart canvas.

Drag Canvas

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "canvasDragEnd": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

start

Type: number

The UNIX timestamp corresponding to the start of the canvas’ time spread.

end

Type: number

The UNIX timestamp corresponding to the end of the canvas’ time spread.

canvasDblTap

This event is fired after a user’s double tap interaction on a canvas.

Double Click Canvas

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "canvasDblTap": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

start

Type: number

The UNIX timestamp corresponding to the start of the canvas’ time spread.

end

Type: number

The UNIX timestamp corresponding to the end of the canvas’ time spread.

canvasWheel

This event is fired on every instance of a user’s wheel interaction on a canvas.

Wheel Canvas

Syntax
{
   "chart": {
     // ...
   },
   "data":[
     // ...
   ]
 },
 "events": {
   "canvasWheel": function(ev) {
     console.log(ev);
   }
 }

Event Object Parameters

start

Type: number

The UNIX timestamp corresponding to the start of the canvas’ time spread.

end

Type: number

The UNIX timestamp corresponding to the end of the canvas’ time spread.