mainSeries.priceScale().applyOptions({ autoScale: true }) ignores horizontal lines on the chart when scaling?

[0x33dm]

Lightweight Charts™ Version:

4.1.4

Steps/code to reproduce:

I'm loading a chart with 2 years worth of 1D candles sticks, for that reason I would like to avoid calling chart.timeScale().fitContent() as this would make all candles very small in the screen, specially considering I only have about 700x400 pixels space on my UI.

When I apply the option autoScale: true on the priceScale() the scale of the candles and the alignment of the candles is perfect!

The problem arises when I try to add 2 stop lines, one called "soft liquidation" and "hard liquidation".

I expected priceScale() to take those 2 lines in consideration and potentially scale the vertical axis ( prices ) enough to see the lines on the chart.

Ideally ,if the user only drags the chart horizontally I would like both lines to always be visible, at least until the user changes the vertical scale by clicking and dragging vertically the price axis.

Unfortunately, that doesn't happen and if the "stop lines" are too far away from the price they end up not being displayed so it's very easy to miss them.

Is there a way to get autoScale on the priceScale() to take those lines in consideration?

Have an example sandbox ( apologies for the commented code, I forked this basic example and didn't finish cleaning it ) https://codesandbox.io/p/sandbox/kind-framework-zdcsdt?file=%2Fsrc%2Findex.js

Thank You!

[SlicedSilver]

This is the intended behaviour. However you can use the autoscaleInfoProvider (which is part of the series options) to override the autoscale behaviour, such as adjusting the min and max values so they always include the prices of 20000 and 30000.

[0x33dm]

This is the intended behaviour. However you can use the autoscaleInfoProvider (which is part of the series options) to override the autoscale behaviour, such as adjusting the min and max values so they always include the prices of 20000 and 30000.

I quite like the default behaviour where the user scrolling horizonally automatically adjusts the price scale automatically based on the min and max value of the candles.

I believe if i would have to provide an "autoscaleInfoProvider" i would have to recalculate the min and max everytime the user scrolls horizontally and then try to emulate the default behaviour myself?

Also, on the default behaviour if the user then changes the priceScale manually ( by dragging vertically ) the chart stops automatically adjusting.

I would like to achieve the same thing without having to re-invent the default behaviour if that makes sense?

Is there a workaround, for instance adding an "area" or a "line" fully transparent between those two lines so the default behaviour would be still the same but instead of considering the lowest of the candles and the highest of the candles it would be considering the lowest of the line/area to the max of the candles until the user changes the price scale manually ?

[SlicedSilver]

Is there a workaround, for instance adding an "area" or a "line" fully transparent between those two lines so the default behaviour would be still the same but instead of considering the lowest of the candles and the highest of the candles it would be considering the lowest of the line/area to the max of the candles until the user changes the price scale manually ?

Yes that would work.

But it would also be simple to do this:

const additionalLines = [20000, 30000];

candleSeries.applyOptions({
    autoscaleInfoProvider: (originalRange) => {
        const res = original();
        res.priceRange.minValue = Math.min(res.priceRange.minValue, Math.min(additionalLines));
        res.priceRange.maxValue = Math.max(res.priceRange.maxValue, Math.max(additionalLines));
        return res;
    },
})

[0x33dm]

candleSeries.applyOptions({
    autoscaleInfoProvider: (originalRange) => {
        const res = original();
        res.priceRange.minValue = Math.min(res.priceRange.minValue, Math.min(additionalLines));
        res.priceRange.maxValue = Math.max(res.priceRange.maxValue, Math.max(additionalLines));
        return res;
    },
})

this works as expected!

thank you!