My current issue involves a seemingly simple task. I have created a basic formatter method to convert numbers into currency values. It appears to be functioning properly based on the y axis values being displayed with formatting like "$8,000". However, I am encountering an issue where the tooltip y values remain unformatted (as depicted in the image). According to the documentation, these values should be formatted using the y axis formatter, which does not seem to be taking effect.
https://i.sstatic.net/wbMe6.png
Despite attempting a custom formatter, it does not produce the desired outcome:
tooltip: {
shared: false,
intersect: true,
x: {
show: true,
},
y: {
formatter: (y: any) => {
return '$' + y;
},
},
},
Interestingly, when I utilize console.log(...) within that custom formatter, it only prints once or twice, displaying only the Maximum value (e.g. 7380.69999999999) instead of all five values as expected.
In addition, I am struggling to display the tooltip x header. Despite setting it to true, it remains hidden.
Although I am implementing this in vue, it seems that this issue is unrelated to the framework. Most Apexchart options are functioning correctly except for this particular one.