ChartJS Line Chart

Multiple Line Chart

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.3.0/Chart.js"></script>
<body>
    <div id="tests"></div><br>
    <canvas id="chartJSContainer" width="600" height="400"></canvas>
</body>

CSS

canvas { background-color : #eee;
}

JavaScript

// variable datajson, issue d'un fichier PHP :
var datajson = [{"mois":1,"v1":56066,"v2":267,"v3":120},{"mois":2,"v1":4119,"v2":187,"v3":617},{"mois":3,"v1":7941,"v2":346,"v3":796},{"mois":4,"v1":21640,"v2":356,"v3":993},{"mois":5,"v1":48836,"v2":669,"v3":2407},{"mois":6,"v1":44853,"v2":648,"v3":4056},{"mois":7,"v1":40625,"v2":779,"v3":4169},{"mois":8,"v1":25383,"v2":501,"v3":2138},{"mois":9,"v1":13772,"v2":183,"v3":615},{"mois":10,"v1":6378,"v2":144,"v3":613},{"mois":11,"v1":2197,"v2":119,"v3":115},{"mois":12,"v1":1276,"v2":0,"v3":4}];


var mois = []
for (var i = 0; i < datajson.length; i++) {
  mois.push(datajson[i].mois);
}

var v2 = []
for (var i = 0; i < datajson.length; i++) {
  v2.push(datajson[i].v2);
}

var v3 = []
for (var i = 0; i < datajson.length; i++) {
  v3.push(datajson[i].v3);
}

var options = {
  type: 'line',
  data: {
    labels: mois,
    datasets: [
	    {
	      label: 'v2',
	      data: v2,
      	borderWidth: 1
    	},	
			{
				label: 'v3',
				data: v3,
				borderWidth: 1
			}
		]
  },
  options: {
  	scales: {
    	yAxes: [{
        ticks: {
					reverse: false
        }
      }]
    }
  }
}

var ctx = document.getElementById('chartJSContainer').getContext('2d');
new Chart(ctx, options);