Home Forums Chart Support An example of a graph with the designation of colored segments Reply To: An example of a graph with the designation of colored segments

#37107

@oleglr,

You can set markerBorderColor & lineColor based on your condition (Comparing current y-value with the previous y-value and checking if it’s even or odd) to achieve this. Please find the code-snippet below –

var updateChart = function () {      	

  yVal = yVal +  Math.round(5 + Math.random() *(-5-5));

  if(dps.length && yVal < dps[dps.length - 1].y)
  {
    //Setting markerBorderColor and lineColor for each specific dataPoint 
    color = (yVal % 2 === 0 ? "red" : "blue");
    dps.push({x: xVal, y: yVal, markerBorderColor: color});
    dps[dps.length - 2].lineColor = color;
  }
  else if(dps.length)
  {
    //Setting markerBorderColor and lineColor for each specific dataPoint 
    color = (yVal % 2 === 0 ? "blue" : "red");
    dps.push({x: xVal, y: yVal, markerBorderColor: color});
    dps[dps.length - 2].lineColor = color;
  }
  else
    dps.push({x: xVal, y: yVal, markerBorderColor: "blue"});

  xVal++;
  chart.render();		
}

Please take a look at this JSFiddle for the complete code.

Considering this thread as a duplicate of Line Chart Connector Colors and hence closing the same.

___________
Indranil Singh Deo
Team CanvasJS