Basic Column Chart - CanvasJS

Basic Column Chart

HTML

<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>

<div id="chartContainer" style="height: 500px; width: 100%;"><div class="canvasjs-chart-container" style="position: relative; text-align: left; cursor: auto;"><canvas class="canvasjs-chart-canvas" width="491" height="500" style="position: absolute; user-select: none;"></canvas><canvas class="canvasjs-chart-canvas" width="491" height="500" style="position: absolute; -webkit-tap-highlight-color: transparent; user-select: none; cursor: default;"></canvas><div class="canvasjs-chart-toolbar" style="position: absolute; right: 1px; top: 1px; border: 1px solid transparent;"></div><div class="canvasjs-chart-tooltip" style="position: absolute; height: auto; box-shadow: rgba(0, 0, 0, 0.1) 1px 1px 2px 2px; z-index: 1000; pointer-events: none; display: none; border-radius: 0px; left: 62px; bottom: -321.976px; transition: left 0.1s ease-out 0s, bottom 0.1s ease-out 0s;"><div style="width: auto; height: auto; min-width: 50px; margin: 0px; padding: 5px; font-family: &quot;Trebuchet MS&quot;, Helvetica, sans-serif; font-weight: normal; font-style: normal; font-size: 14px; color: black; text-shadow: rgba(0, 0, 0, 0.1) 1px 1px 1px; text-align: left; border: 1px solid rgb(79, 129, 188); background: rgba(255, 255, 255, 0.9); text-indent: 0px; white-space: nowrap; border-radius: 0px; user-select: none;">Tax Rate 0.8400<hr>Revenue: 68,158,382</div></div><a class="canvasjs-chart-credit" title="JavaScript Charts" style="outline:none;margin:0px;position:absolute;right:2px;top:486px;color:dimgrey;text-decoration:none;font-size:11px;font-family: Calibri, Lucida Grande, Lucida Sans Unicode, Arial, sans-serif" tabindex="-1" target="_blank" href="https://canvasjs.com/">CanvasJS.com</a></div></div>

JavaScript

window.onload = function () {
 
var chart = new CanvasJS.Chart("chartContainer", {
	title:{
		text: "M&O Revenue at Alternative Tax Rates"
	},
	axisX:{
		title: "Tax Rates",
        interval: 0.01,
        intervalType: "number",
        labelFormatter: function(e){
            return CanvasJS.formatNumber(e.value, "0.00");
        },
        stripLines:[{
            startValue:.831,
            endValue:0.9110001,
            color: "#C7BD0A",
            label: "Golden Pennies",
            labelFontColor: "#000000",
            labelBackgroundColor: "#C7BD0A"
        },{
            startValue:0.911,
            endValue:1.001,
            color: "#C7880A",
            label: "Copper Pennies",
            labelFontColor: "#000000",
            labelBackgroundColor: "#C7880A"
        },{
            value:.831,
            color: "#000000",
            label: "Tier 1 Rate",
            labelFontColor: "#000000",
            labelBackgroundColor: "#FFFFFF"
        },{
            value:0.9359,
            color: "#000000",
            label: "ATR Used in Run",
            labelFontColor: "#000000",
            labelAlign: "near"
        },{
            value:1.001,
            color: "#000000",
            label: "Maximum M&O Rate",
            labelFontColor: "#000000",
            labelBackgroundColor: "#C7880A"
            
    },{ value: 0.9369, color: '#000000', label: 'Voter Approval Rate', labelFontColor: '#000000'  
   
        }]
	},
	axisY:{
		title: "Revenue",
		titleFontColor: "#4F81BC",
		lineColor: "#4F81BC",
		labelFontColor: "#4F81BC",
		tickColor: "#4F81BC",
        minimum: 60000000,
        maximum: 90000000	},
	legend:{
		cursor: "pointer",
		dockInsidePlotArea: true,
		itemclick: toggleDataSeries
	},
	data: [{
		type: "line",
		name: "Revenue",
        xValueFormatString: "0.0000",
		toolTipContent: "Tax Rate {x}<hr/>{name}: {y}",
		showInLegend: false,
		dataPoints:...