I am using basic timeline chart of Apexcharts in React application, where the data contains decimal numbers (e.g: data = [{"x":"TaskData0link_Node0_Node1","y":[0.0,0.05]}]. However when I enter the bars with the mouse I can only see values that are rounded . In this case: 0-0. Is it somehow possible to display the real values (0-0.05)? And not round it to integer.
The options that I use:
options: {
chart: {
height: 350,
type: 'rangeBar',
toolbar: {
show: true,
autoSelected: 'selection'
},
},
plotOptions: {
bar: {
horizontal: true
}
},
xaxis: {
type: 'numeric',
title: {
text: 'in ms'
},
labels: {
show: true
},
decimalInFloat: 3,
},
},
Thank you in advance!
Use this custom tooltip
tooltip: {
custom: ({ dataPointIndex, w }) => {
let s = w.config.series[0].data[dataPointIndex];
return `<div class="apexcharts-tooltip-rangebar"><div>
<span class="category">${s.x}: </span>
<span class="value start-value">${s.y[0]}</span>
<span class="separator">-</span>
<span class="value end-value">${s.y[1]}</span></div></div>`;
}
},