Apexcharts.js: Add custom text on radialBar Chart

[lsjzzang17]

Hi I do not speak English well but this radialBar has been used so beautifully
This radialBar is very good.
So, i used my project.
i need radialBar xaxis So, i tried
Where is xaxis on radialBar ?

plz, your answer
thank you

[junedchhipa]

There is no direct option to draw labels as you described in the image.

But, you can use ApexChart's addText() method to draw custom text elements on the chart area.
Here is a codepen example which produces this result.

The code for generating these labels

var chartAreaBounds = chart.w.globals.dom.baseEl.querySelector('.apexcharts-inner').getBoundingClientRect();

chart.addText({
  x: chartAreaBounds.width / 2,
  y: 10,
  text: "0",
  fontSize: 16,
  textAnchor: "middle"
});

chart.addText({
  x: chartAreaBounds.width - 5,
  y: chartAreaBounds.height / 2 + 10,
  text: "90",
  fontSize: 16,
  textAnchor: "start"
});

chart.addText({
  x: chartAreaBounds.width / 2,
  y: chartAreaBounds.height + 30,
  text: "180",
  fontSize: 16,
  textAnchor: "middle"
});

chart.addText({
  x: 5,
  y: chartAreaBounds.height / 2 + 10,
  text: "270",
  fontSize: 16,
  textAnchor: "end"
});

[lsjzzang17]

I was impressed by your efforts !
your answer is give hope to me
thank you
have a nice day!

[suhailkc]

@junedchhipa

I have tried your answer. but I got an error: (in codepen example also)

chart.addText is not a function

Is there any solution to this?

[EduardChernyak]

Hi @junedchhipa,

I have the same problem with the latest release.

[dfiorini]

@junedchhipa

I have tried your answer. but I got an error: (in codepen example also)

chart.addText is not a function

Is there any solution to this?

I don't see anything either in the codepen example