Changing color of dataSeries if any y value is above threshold - CanvasJS Javascript HTML 5 Chart

Changing color of dataSeries if any y value is above threshold - CanvasJS Javascript HTML 5 Chart

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

var limit = 100;    //increase number of dataPoints by increasing this

var y = 0;
var data = []; var dataSeries = { type: "splineArea" };
var dataPoints = [];
for (var i = 0; i < limit; i += 1) {
  y += (Math.random() * 50 - 25);
  dataPoints.push({
    x: i - limit / 2,
    y: y
  });
}

dataSeries.dataPoints = dataPoints;
dataSeries.color = "green";
data.push(dataSeries);

for(dataPoint of dataSeries.dataPoints)
	if(dataPoint.y > 80){
  	dataSeries.color = "red";
    break;
  }
  
var chart = new CanvasJS.Chart("chartContainer",
    {
      title:{
        text: "Changing color of dataSeries if any y value is above 80"
      },

      data: data,  // random generator above

   });

chart.render();