API (Vanilla JavaScript)
Overview
Carbon Charts exposes the entire API allowing you to heavily customize the look and feel and behaviors. When a chart is instantiated, the chart object contains key properties.
const myChart = new PieChart({
data: ...,
options: ...
})
console.log(myChart)
// RESULT
{
model, // where we store charting data & options
services, // globalized functions that can affect charting behaviour. (e.g. event listener dispatching etc.)
components // internally used for arranging the charting layout, you can disregard this
}Services and Event Handling
Services are globalized functions. General tasks such as event dispatching, transition handling, DOM-related activities etc. are handled by services. For example, event listeners can be added through the events service
To listen for event just use a reference to the chart to add an event listener for one of the dispatched events above. This is an example for adding an event listener for a mouseover event on bar chart rects.
barChart.services.events.addEventListener("bar-mouseover", e => console.log(e.detail))Event dispatching for chart elements allows applications to trigger custom UI actions and states when users interact with the charts. More information on events can be found here.