A simple ember wrapper for apexcharts
- Ember.js v3.16 or above
- Ember CLI v2.13 or above
- Node.js v10 or above
ember install ember-apexchartsjs
type = 'bar';
width = '800px';
height = '400px';
series = [{
name: 'Sales',
data: [30,40,35,50,49,60,70,91,125]
}];
chartOptions = {
title: {
text: 'Bar Chart'
},
xaxis: {
categories: [1991,1992,1993,1994,1995,1996,1997, 1998,1999]
}
}
const chartOptions = {
chart: {
height: '400px',
type: 'line',
width: '800px'
},
series: [{
data: [30,40,35,50,49,60,70,91,125]
}],
xaxis: {
categories: [1991,1992,1993,1994,1995,1996,1997, 1998,1999]
}
}
The complete set of supported chart types and chart options can be found here: Apexcharts Documentation
All the apexchart events can be specified as arguments to the ApexChart component.
The example below potrays the use of click
and beforeMount
events.
type = 'bar';
series = [{
name: 'Sales',
data: [30,40,35,50,49,60,70,91,125]
}];
@action
clickHandler() {
//click handler
}
@action
beforeMountHandler() {
//before mount handler
}
Complete list of action arguments and their corresponding apexchart event below:
Apexchart event | Action Argument |
---|---|
beforeMount | onBeforeMount |
beforeZoom | onBeforeZoom |
click | onClick |
dataPointSelection | onDataPointSelection |
dataPointMouseEnter | onDataPointMouseEnter |
dataPointMouseLeave | onDataPointMouseLeave |
legendClick | onLegendClick |
markerClick | onMarkerClick |
mouseMove | onMouseMove |
mounted | onMounted |
scrolled | onScrolled |
selection | onSelection |
updated | onUpdated |
zoomed | onZoomed |
See the Contributing guide for details.
This project is licensed under the MIT License.