Basic Column Chart - CanvasJS JavaScript Charts

Basic Column Chart - CanvasJS JavaScript Charts

by canvasjs

HTML

<script src="http://canvasjs.com/assets/script/canvasjs.min.js"></script>
<br/><!-- Just so that JSFiddle's Result label doesn't overlap the Chart -->
<select id="selectMonthList" class="dropdown" >
        <option value="" selected="selected">Select Month</option>
        <option value="January">January</option>
        <option value="February">February</option>
        <option value="March">March</option>
        <option value="April">April</option>
        <option value="May">May</option>
        <option value="June">June</option>
        <option value="July">July</option>
        <option value="August">August</option>
        <option value="September">September</option>
        <option value="October">October</option>
        <option value="November">November</option>
        <option value="December">December</option>
    </select>

    <div id="profitformonth"></div>

JavaScript

var jsonData = {
     "January": [
                { "label": "1st", "y": 10.22 },
                { "label": "2nd", "y": 11.14 },
                { "label": "3rd", "y": 13.58 },
                { "label": "4th", "y": 15.25 },
                { "label": "5th", "y": 17.25 },
                { "label": "6th", "y": 10.22 },
                { "label": "7th", "y": 11.14 },
                { "label": "8th", "y": 13.58 },
                { "label": "9th", "y": 15.25 },
                { "label": "10th", "y": 17.25 },
                { "label": "11th", "y": 10.22 },
                { "label": "12th", "y": 11.14 },
                { "label": "13th", "y": 13.58 },
                { "label": "14th", "y": 15.25 },
                { "label": "15th", "y": 17.25 },
                { "label": "16th", "y": 10.22 },
                { "label": "17th", "y": 11.14 },
                { "label": "18th", "y": 13.58 },
                { "label": "19th", "y": 15.25 },
                { "label": "20th", "y": 17.25 },
                { "label": "21st", "y": 10.22 },
                { "label": "22nd", "y": 11.14 },
                { "label": "23rd", "y": 13.58 },
                { "label": "24th", "y": 15.25 },
                { "label": "25th", "y": 17.25 },
                { "label": "26th", "y": 10.22 },
                { "label": "27th", "y": 11.14 },
                { "label": "28th", "y": 13.58 },
                { "label": "29th", "y": 15.25 },
                { "label": "30th", "y": 17.25 },
                { "label": "31st", "y": 17.25 }
            ]}
        var dataPoints = [];
        var chartformonth = new CanvasJS.Chart("profitformonth",
            {
                title: {
                    text: "Profit For Month"
                },
                axisX: {
                    //interval: 1,
                },
                axisY: {
                    gridColor: "white",
                    interval: 10,
                    minimum: 10,
                    maximum:...