Radial Bar Chart

by FusionCharts

HTML

<script src="https://cdn.fusioncharts.com/fusioncharts/latest/fusioncharts.js"></script>
<script src="https://cdn.fusioncharts.com/fusioncharts/latest/themes/fusioncharts.theme.fusion.js"></script>
<!-- 
    This example shows Logrithmic Column chart with log base  
    Attribute :
        # base - Set to 5
-->

<div id="chart-container">FusionCharts will render here</div>

JavaScript

FusionCharts.ready(function () {
    var baChart = new FusionCharts({
        type: 'radialbar',
        renderAt: 'chart-container',
        width: '400',
        height: '400',
        dataFormat: 'json',
        dataSource: {
            "chart": {
                "caption": "Top 5 Android OS Market Share",
                "subCaption": "January 2021",
                "showLegend": "1",
                "showLabels": "1",
                "innerRadius": "20px",
                "outerRadius": "80px",
                "theme": "fusion"
            },
            "data": [
                { "label": "Nougat 7.0", "value": "4.09" },
                { "label": "Oreo 8.0", "value": "5.19" },
                { "label": "Marshmallow 6.0", "value": "5.77" },
                { "label": "Oreo 8.1", "value": "9.89" },
                { "label": "Pie 9.0", "value": "21.53" }
            ]
        }
    });
    baChart.render();
});