setVisibleRange time of execution issue

[christose]

Hello.

I am trying to achieve my own Interval mechanism but the setVisibleRange which I believe is the key for that, it doesn't really work for me. I have found a few other tickets like this one: #406
But I don't see an answer to my problem anywhere.
I will try to explain in short first what I do and in which order to see if the mistake is obvious for you.
So here's what I do:
By selecting an interval, the OnTimeIntervalChange function triggers and sets the data. The data are correct, based on the interval e.g. 1 hour, I have data for every 1 hour, same for all others.

this.ChartSeries.setData(data);

Then based on the selected interval I set the respective visible range by calling the below code:

this.ChartWidget.timeScale().resetTimeScale();

this.ChartWidget.timeScale().setVisibleRange({
      from: dtFrom.getTime() / 1000,
      to: dtTo.getTime() / 1000,
    });

    this.ChartWidget.timeScale().scrollToRealTime();

The dtTo is always based on the last (most recent) data of the collection in the chart series and the dtFrom is always at least dtTo - 2 working days / days with data.
The visible range is not correct and not related to the dtFrom and dtTo values, it is much less, sometimes the range is a few hours only, so the view is incorrect and its basically a zoom in to the series.

I saw in the issue 406, timocov said setVisibleRange is kind of "async". So I did the following experiment, I created a button that applies the visible range and I clicked to apply the visible range again after the above code was executed and I got the real visible range.

So what am I missing here...

[timocov]

Hi,

is it possible to create a repro for this?

[christose]

Hello,

I have just sent you an email with the credentials to the platform.

Thank you, I appreciate your time!

[timocov]

It seems that you firstly set visible range and then, after some time (probably when it's loaded) set the data to the series. lightweight-charts can't approximate the data so you need to manage it yourself and set visible range after setting the data to the series.

[christose]

Hello,

You were right, no doubt about it, there was one case that was messing with it, I thought I fixed it a while ago but I didn't. Since your reply, I've spent my time restructuring and cleaning up the whole code and re-writing those parts of the visible range from the beginning and now I am testing it.

It looks good so far but I will come back at the end of the week to confirm it.

So basically if we do the following there isn't anything else to consider:

this.ChartSeries.setData(data);
this.ChartWidget.timeScale().resetTimeScale();
this.ChartWidget.timeScale().scrollToRealTime();
this.ChartWidget.timeScale().setVisibleRange({
      from: dtFrom.getTime() / 1000,
      to: dtTo.getTime() / 1000,
});

[tradingzone]

Hello, timocov.
Nice to meet you. The chart is not display on mobile. Can you help me?