☰
Why Choose ApexCharts
- 20 chart types
- 1 million weekly downloads
- 100+ samples includes
const ApexChart = () => {
const [state, setState] = React.useState({
series: [{
name: 'Series 1',
data: [20, 100, 40, 30, 50, 80, 33],
}],
options: {
chart: {
height: 350,
type: 'radar',
},
dataLabels: {
enabled: true
},
plotOptions: {
radar: {
size: 140,
polygons: {
strokeColors: '#e9e9e9',
fill: {
colors: ['#f8f8f8', '#fff']
}
}
}
},
title: {
text: 'Radar with Polygon Fill'
},
colors: ['#FF4560'],
markers: {
size: 4,
colors: ['#fff'],
strokeColor: '#FF4560',
strokeWidth: 2,
},
tooltip: {
y: {
formatter: function(val) {
return val
}
}
},
xaxis: {
categories: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday']
},
yaxis: {
labels: {
formatter: function(val, i) {
if (i % 2 === 0) {
return val
} else {
return ''
}
}
}
}
},
});
return (
<div>
<div id="chart">
<ReactApexChart options={state.options} series={state.series} type="radar" height={350} />
</div>
<div id="html-dist"></div>
</div>
);
}
const domContainer = document.querySelector('#app');
ReactDOM.render(<ApexChart />, domContainer);
<div id="chart">
<ReactApexChart options={state.options} series={state.series} type="radar" height={350} />
</div>
Reset Password
Enter your email address and we'll send you a link to reset your password.
Back to Login
Please wait...