Filling Color in anychart js chart in multiple quadrant scatter chart

Question

Im newbie in js and anychart

I have anychart chart like this

how can i fill the color based on range like risk matrix. *Result What i want

This is my code

  // create data
  var data = [
    {x: 2.88, value: 3.12},
    {x: 1.9, value: 2.3}
  ];

  // create a chart
  var chart = anychart.scatter();

  // adjust scale min/max
  chart.xScale().minimum(0).maximum(5.0);
  chart.yScale().minimum(0).maximum(5.0);

  // divide scale by three ticks
  chart.xScale().ticks().interval(1.0);
  chart.yScale().ticks().interval(1.0);

  // create a bubble series and set the data
  var series = chart.marker(data);

  // enable major grids
  chart.xGrid().enabled(true).stroke('0.1 blue');
  chart.yGrid().enabled(true).stroke('0.1 blue');

    
  var yAxis = chart.xAxis();
  


  // set the chart title
  chart.title("Quadrant-like Scatter Bubble Chart");    

  // set the container id
  chart.container("container").draw();
});```

Answer 1

To get a risk matrix in the result, it’s better to use the Heatmap module.

Heatmap from your screenshot is recreated in this sample here: https://playground.anychart.com/0RAcumgI/3

Did we understand your question correctly?