apexcharts basic timeline with decimal numbers - reactjs

Question

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!

Answer 1

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>`;
}
},

Answer 2

//There are two ways for its solution :-
`1) options.yaxis: {
labels: {
formatter: function(value) {
return "$" + value.toFixed(2);
}
},
tickAmount: 5,
min: 0,
max: 'Your Y axis maximum value here like 5000',
}
2) options.yaxis: {
tickAmount: 5,
`enter code here`
min: 0,
max: 'Your Y axis maximum value here like 5000',
decimalsInFloat: 2
}`
Value shows on Y axis using Apex Chart