Chart with Datapoints and Title from CSV File - CanvasJS JavaScript Charts

Chart with Datapoints and Title from CSV File - CanvasJS JavaScript Charts

by canvasjs

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

function getChartOptionsFromCSV(csv) {
  var csvLines = [], points = [];
  var chartOptions;
  var country;
  var dataPoints1 = [], dataPoints2 = [], dataPoints3 = [], dataPoints4 = [];

  csvLines = csv.split(/[\r?\n|\r|\n]+/);
  var index = "Country6"; // change index to required country's name available in CSV
  for (var i = 0; i < csvLines.length; i++){
    if(csvLines[i].split(",")[0] === index){
      if (csvLines[i].length > 0) {
        points = csvLines[i].split(",");
        console.log(points)
        country = points[0];
        dataPoints1.push({ 
          label: parseFloat(points[1]), 
          y: parseFloat(points[2]) 		
        });
        dataPoints2.push({ 
          label: parseFloat(points[1]), 
          y: parseFloat(points[3]) 		
        });
        dataPoints3.push({ 
          label: parseFloat(points[1]), 
          y: parseFloat(points[4]) 		
        });
        dataPoints4.push({ 
          label: parseFloat(points[1]), 
          y: parseFloat(points[5]) 		
        });
      }
    }
  }

  chartOptions = {
    title: {
      text 		: "Trend for Indicator Values - " + country,
      fontFamily 	: "franklin-gothic-urw",
      fontWeight 	: "bold",
      fontSize 	: 30,
      fontColor 	: "#4fad4a",
    },
    exportEnabled: true,
    exportFileName: "Trend for Indicator Values - " + country,
    legend: {
      fontFamily: "franklin-gothic-urw",
      fontWeight: "normal",
      horizontalAlign: "center", 
      verticalAlign: "bottom", 
      fontSize: 18,
      cursor: "pointer",
      itemclick: function (e) {
        //console.log("legend click: " + e.dataPointIndex);
        //console.log(e);
        if (typeof (e.dataSeries.visible) === "undefined" || e.dataSeries.visible) {
          e.dataSeries.visible = false;
        } else {
          e.dataSeries.visible = true;
        }

        e.chart.render();
      }
    },
    axisX:{
      labelFontSize: 15,
      labelFontColor: "black"
    },
    axisY:{
      labelFontSize:...