react-apexcharts
react-apexcharts copied to clipboard
Dropshadow changes on hover
https://user-images.githubusercontent.com/29911508/154406694-42456753-0ed6-4e95-9698-d0ae4858001d.mov
Notice how the white dropshadow changes, I think it copies the dropshadow of the blue series
options is in a useState
const series = [3456069, 1456069];
const [options] = useState({
chart: {
width: 200,
height: 200,
type: 'donut',
dropShadow: {
enabled: true,
top: 0,
left: 0,
blur: 3,
color: ['#2D91EF', '#fff'],
opacity: 0.5,
},
},
dataLabels: {
enabled: false,
},
fill: {
type: 'solid',
},
// still playing with gradients - can be implemented later
colors: ['#2D91EF', '#EF2D8A'],
stroke: {
show: false,
},
legend: {
show: false,
},
});
<ReactApexChart options={options} series={series} type='donut' />