0

I'm trying to make a donut chart using Highchart library in the react application.

What I want to achieve is like this image.

enter image description here enter image description here

I want to add customised value or paragraph inside the donut chart. Is it possible to add some customised value or paragraph outside of DonutChart component?

Something like this;

import DonutChart from 'DonutChart.js'

class Chart extends React.component{
 render(){
 return(
 <div className="donutchart-wrapper">
     <DonutChart />
 <!---the following should be inside the Donut Chart --->
     <div>
     1/3  
     </div>
 </div>
 )
 }
aaayumi
  • 1,224
  • 8
  • 27
  • 47
  • 2
    Have a look at https://stackoverflow.com/questions/23491344/donut-inner-text and https://www.highcharts.com/demo/pie-semi-circle – ewolden Dec 21 '17 at 10:39
  • Thanks for your quick response. The link is helpful but what I want to do is to insert html codes inside the pie chart, not as title. – aaayumi Dec 21 '17 at 10:52
  • 1
    You can still use that, and have a look at https://api.highcharts.com/highcharts/title.useHTML, if you set that to `true` you can use HTML in the title. – ewolden Dec 21 '17 at 10:54
  • Thank you for the tip. I didn't know about it. It was helpful. – aaayumi Dec 22 '17 at 08:44

0 Answers0