- Back to Docs
- Get Started
- Integrations
- Configuring your Charts
- List of Charts
- Chart Attributes
- API
- Options & Properties
- Methods
- Events
- Other References
- Concepts
- Browser and Technology Support
- Change Log
- License Activation
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
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.