Funnel Bar Chart with CanvasJS

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js" type="text/javascript"></script>
<script src="https://chart-templates.com/assets/libs/apps/canvasjs/jquery.canvasjs.min.js" type="text/javascript"></script>
<div id="chart_div"></div>

JavaScript

$(function () {
   var options = {
      title: { text: "Customer Conversion" },
      axisX: {
        interval: 1,
        lineThickness: 0,
        gridThickness: 0,
        tickThickness: 0,
        stripLines: []
      },
      axisY: {
        labelFormatter: function () { return " "; },
        interval: 20,
        maximum: 100,
        minimum: -100,

        lineThickness: 0,
        gridThickness: 0,
        tickThickness: 0,
      },
      toolTip: { enabled: false },
   };

		var dataSource = [{
      label: "Awareness",
      value: 180
   },
   {
      label: "Familiarity",
      value: 160
   },
   {
      label: "Consideration",
      value: 90
   },
   {
      label: "Purchase",
      value: 40
   },
   {
      label: "Loyalty",
      value: 30
   }];
   
   options.data = [{
      type: "rangeBar",
      color: "#007c9c",
			indexLabel: "{value}",
      dataPoints: []
   }];

		for (var i = dataSource.length - 1; i >= 0; i--) {
      options.data[0].dataPoints.push({
         label: dataSource[i].label,
         y: [-(dataSource[i].value / 2), (dataSource[i].value / 2)],
         value: dataSource[i].value
      });
      options.axisX.stripLines.push({
      	value: i,
        label: i + " " + dataSource[i].value + " " + dataSource[i].label,
        labelAlign: "center",
        showOnTop: true,
        thickness: 0
      });
      console.log(options.axisX.stripLines)
   }
   
	new CanvasJS.Chart("chart_div", options).render();
});