html, body, #container {

    width: 100%;

    height: 100%;

    margin: 0;

    padding: 0;

}

anychart.onDocumentReady(function () {

    var chart = anychart.gauges.circular([27]);

​

    chart.padding("10%");

    chart.startAngle(270);

    chart.sweepAngle(180);

    chart.fill("#fff");

    chart.stroke(null);

​

    var axis = chart.axis();

    axis.radius(95);

    axis.fill("#7CFC00 0.3");

    axis.width(10);

    axis.cornersRounding("50%");

​

    axis.scale().minimum(0);

    axis.scale().maximum(100);

​

    axis.ticks().length(4);

    axis.ticks().position("outside");

​

    axis.labels().position("outside");

​

    chart.range({

        from: 50,

        to: 80,

        position: "inside",

        fill: "#F44336",

        startSize: 10,

        endSize: 10,

        radius: 90

    });

​

    var range = chart.range();

​

    // Set the rounding of range.

    range.cornersRounding("50%");

​

    chart.title("Set radius for the rounding of circular range");

    chart.needle();

    chart.container("container");

    chart.draw();

});