Basic Column Chart - CanvasJS

Basic Column Chart

HTML

<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<br/><!-- Just so that JSFiddle's Result label doesn't overlap the Chart -->
<div id="chartContainer" style="height: 360px; width: 100%;"></div>

JavaScript

var chart = new CanvasJS.Chart("chartContainer", {
animationEnabled: true,
            subtitles: [{
                text: "115 Total Offers",
                verticalAlign: "center",
                fontSize: 25,
                dockInsidePlotArea: true,
                fontColor: "#174D9F",
                fontFamily: 'Poppins',
                fontWeight: 600,
                maxWidth: 100
            }],
            data: [{
                type: "doughnut",
                indexLabelPlacement: 'inside',
                innerRadius: 105,
                indexLabelFontFamily: 'Poppins',
                indexLabelFontWeight: 400,
                indexLabelOrientation: "vertical",
                indexLabelTextAlign: 'center',
                showInLegend: false,
                indexLabelFontSize: 16,
                indexLabelFontColor: '#ffffff',
                indexLabel: "{y}",
                yValueFormatString: "###'%'",
                dataPoints: [
                    {name: "Original Fruit Juice", y: 8, color: "rgba(251, 206, 74, 1)"},
                    {name: "Boost Energy", y: 35, color: "rgba(71, 99, 165, 1)"},
                    {name: "Red Bull", y: 10, color: "rgba(234, 92, 93, 1)"},
                    {name: "Starbucks Triple Mocha", y: 13, color: "rgba(143, 210, 230, 1)"},
                    {name: "Activia Yogurt", y: 20, color: "rgba(83, 67, 155, 1)"},
                    {name: "Powerfull", y: 7, color: "rgba(100, 194, 166, 1)"},
                    {name: "Boost Energy", y: 20, color: "rgba(150, 79, 151, 1)"},
                    {name: "Joss Organics", y: 19, color: "rgba(48, 159, 219, 1)"},
                    {name: "Mountain Dew", y: 28, color: "rgba(60, 175, 133, 1)"}
                ]
            }]
        }
        );

chart.render();