Search code examples
amcharts4

Set the font size and color of an AmChart4 XYCursor's X and Y label


I've looked here: https://www.amcharts.com/docs/v4/reference/xycursor/

and tried this

chart.cursor.fontSize = "14";
chart.cursor.fill = am4core.color("#ff0000");
chart.cursor.fontFamily = "verdana";

To style the (default white on black) element when the xycursor touches the X/Y axis (don't know what the correct name for this element is, hope you know which one I mean)

I would like to set the font size and family. Tried to set the color to red to see if it has to be set via the fill property, but also that doesn't work.

Created the cursor like this:

 chart.cursor = new am4charts.XYCursor();
    chart.cursor.xAxis = axis;

Solution

  • You have to set the tooltip properties inside the axis objects directly, as mentioned in the documentation. For example, to change the font, size and color in the category axis tooltip, modify the tooltip's label object:

    categoryAxis.tooltip.getFillFromObject = false; 
    categoryAxis.tooltip.label.fill = "#ff0000"
    categoryAxis.tooltip.label.fontFamily = "Courier New"
    categoryAxis.tooltip.label.fontSize = 15;
    

    Demo