Discreet colormap

Hi Pramod

There is a way, yes

There is a technique we use in 3D charts in our WPF (windows) version of scichart, where we basically define gradient stops like this:

Given a set of gradient stops

const heatmapColorMap = new HeatmapColorMap({
gradientStops: [
{ offset: 0, color: “Red” },
{ offset: 0.5, color: “Green” }
{ offset: 1, color: “Blue” }
]
});

This will perform a gradient between offset 0 (red) and offset 0.5 (green) and offset 1 (blue).

If you want a hard transition from red to green, and green to blue, then inject extra gradient stops like this

 gradientStops: [
        { offset: 0, color: "Red" },
        { offset: 0.4999, color: "Red" },
        { offset: 0.5, color: "Green" }
        { offset: 0.9999, color: "Green" }
        { offset: 1, color: "Blue" }
 ]

Anything between stop 0 and 0.4999 will now be red and 0.5 to 0.9999 will be hard green

Let me know if this helps!

Best regards,
Andrew