Controlling the z-index of series canvas

[manu-b-s]

Hi,

Any chance we could have a release in which we will be able to control the z-index of specific series' canvas, more specifically for ISeriesApi<"Candlestick"> so that it is always on top of the other series on the chart?

I know this can be achieved by creating the desired series after creating the other series in the code, but sometimes that is not possible.

Alternatively, is there any workaround?

[manu-b-s]

Ok so I found a workaround.

In my previous post I mentioned that it was not possible to create the "ON THE TOP" candlestick series at the end of the code because other line series (in-house elaborated solution for "half" support & resistance lines) are being created dynamically, but that does not mean we cannot do the following:

1- Create 100 dummy empty line series (in a loop) and store them in a json var (keys as number, values as SeriesApi<"Candlestick">)
2- Create the candlestick series
3- Set the data of the candlestick series (and update the last candle dynamically)
4- Loop over the previously stored json values and dynamically set the data of each value (line series)

This is the only workaround I could think about. So far I did not notice any performance degradation and fabulously did the job !

EDIT:
Just to add, after applying this workaround, the zoom behaved strangely as it was always trying to keep all the plotted series in the visual frame, whereas I only needed the candlestick series to be the only visible one when zooming in.
As a workaround of this workaround, I had to do the following for the line series (herby "priceLines"):

priceLines[i].applyOptions({autoscaleInfoProvider: () => ({
      priceRange: {
        minValue: selectedClose,
        maxValue: selectedClose,
      },
        margins: {
          above: -selectedClose,
          below: -selectedClose,
        },
    })});

selectedClose is the close price of the hovered candlestick. It is set as follows:

chart.subscribeCrosshairMove((param) => {
    if (param.time) {
      const candle = param.seriesPrices.get(candleSeries);
      ...
      selectedClose = candle.close.toFixed(6)
    } else {
      ...
    }
  });

[timocov]

We have a feature request for this - see #136