javascriptanychartanychart-8.2

Set Line Chart Markers Colour Based on Conditional

I'm trying to figure out how to set the markers to be a certain colour depending on what the value of the point is. So for example, if a point has a value between 0.1 and 1, I want the marker colour to be red.

This is how I'm initializing my chart:

this.chart = Anychart.line()                 
let dataSet = Anychart.data.set(this.graphData.data)               
let mapping = dataSet.mapAs({x: "day", value: "risk"})             
this.series = this.chart.line(mapping)

How do I apply individual marker styles to points that belong to the same series?

Mockup of what I mean: enter image description here

Solution

  • Series markers don't support conditional filling via the function. There are two available solutions:

    1. Create additional marker series. It supports conditional coloring via a function, for details check the live sample.

    2. Use line series markers, but apply individual marker setting in the data. This approach is demonstrated in the live sample.