Drawing a filled polygon using a custom renderable series

Hello!

I have been looking into creating a custom renderable series for drawing filled polygons.

I have a class that derives from the BaseRenderableSeries type, and uses an XyDataSeries for its dataSeries. So far I’ve been able to draw the shape of the polygon using the drawLines function for the render context API. However, I’m wondering what the best way would be to go about adding support for filling the area of the polygon.

Having read the docs…

The IFillPaletteProvider interface allows you to perform per-point
paletting or coloring of series or data-points in Mountain, Column,
Candlestick Charts and JavaScript chart types which have a fill or
body

…I got the impression that I probably want to be implementing a custom palette provider that implements IFillPaletteProvider, which

may be used to override the color of filled polygon in various chart types.

Rather than jumping straight into this, I had a go at overriding the paletteProvider getter with a function that returns an IFillPaletteProvider. In this I create an empty DefaultPaletteProvider, set the fill palette mode to solid, and then set the overrideFillArgb function to essentially always return the ARGB colour code for an arbitrary colour as a test. I also played around with calling (and not calling) shouldUpdatePalette before returning the palette provider:

get paletteProvider(): IFillPaletteProvider {
    const paletteProvider = DefaultPaletteProvider.createEmpty();
    paletteProvider.fillPaletteMode = EFillPaletteMode.SOLID;
    paletteProvider.overrideFillArgb = (xValue:number, yValue: number, _index: number): number => {
        return yValue > 0 ? parseColorToUIntArgb("blue") : parseColorToUIntArgb("black");
    }
    paletteProvider.shouldUpdatePalette();
    return paletteProvider;
}

Now when I call the hasFillPaletteProvider function on my custom renderable series, it indeed returns true.

However, for now my polygon still remains unfilled when drawn onto a surface, I can only see the outline of it. Any advice or tips on where I might be going wrong? I get the feeling I’m missing something obvious/simple, but as yet I can’t figure out what!

Thank you for any help!