How to reduce PieChart border size(width) in amcharts like shown below? I want to reduce the first chart border size(width) like second one. I already set innerRadius property to 100 percent.
You have to increase both the innerRadius
and radius
to a large enough value to make the circle skinnier.
chart.innerRadius = am4core.percent(100);
chart.radius = am4core.percent(100);
Demo:
var chart = am4core.create("chartdiv", am4charts.PieChart);
chart.data = [{
"category": "",
"value": 100
}];
chart.innerRadius = am4core.percent(100)
chart.radius = am4core.percent(100)
var pieSeries = chart.series.push(new am4charts.PieSeries());
pieSeries.dataFields.value = "value";
pieSeries.dataFields.category = "category";
pieSeries.ticks.template.disabled = true;
pieSeries.labels.template.disabled = true;
var label = pieSeries.createChild(am4core.Label)
label.text = "100%";
label.horizontalCenter = "middle";
label.verticalCenter = "middle";
label.fontSize = "2em";
body {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
}
#chartdiv {
width: 200px;
height: 200px;
}
<script src="https://cdn.amcharts.com/lib/4/core.js"></script>
<script src="https://cdn.amcharts.com/lib/4/charts.js"></script>
<div id="chartdiv"></div>