Cursor Sync

[wk1210]

Description

I have two sets of candlestick data, one with a 1-minute interval and another with a 4-minute interval. However, when synchronizing the crosshair, I found that the last minute of the 1-minute interval's candlestick is not synchronized with the corresponding candlestick of the 4-minute interval. Instead, it is synchronized with the next candlestick.

The synchronization code I am using is as follows:

 cursorUpdate(cursor) {
    console.log(this.CHART.cursor)
    let time = this.CHART.cursor.time
    if (this.PRE == time) return 
    this.PRE = time
    let value = this.CHART.layout.main.y2value(cursor.y)

    for (let mychart of this.ALL) {
      if (mychart.TIMEFRAME == this.TIMEFRAME) continue;
      if (!mychart.CHART.layout.main) return;
      let b = JSON.parse(JSON.stringify(cursor))
      let x = mychart.CHART.layout.main.time2x(time)
      let y = mychart.CHART.layout.main.value2y(value)
      b.x = x
      b.y = y
      mychart.CHART.cursor = b
    }
  }

Suggested solution

In the second chart, the 1-minute candlestick should be the first candlestick of the 4-minute interval. However, in the first chart, the 1-minute candlestick is also being synchronized with the 4-minute candlestick, which is clearly incorrect.

Alternative

No response

Additional context

No response

Validations

• [X] Read the docs.
• [X] Check that there isn't already an issue that request the same feature to avoid creating a duplicate.

[C451]

What about 5min chart, did you try?

[wk1210]

What about 5min chart, did you try?

I'm glad to receive your response, and thank you for your great work. Night Vision is indeed a fantastic framework that satisfies most of my requirements. In my design, the data download module only fetches 1-minute data, and data for other time intervals is calculated through downsampling. As a result, there is no 5-minute time interval available. Since my synchronization is based on timestamp synchronization, the x-axis of each chart with a different time interval is not the same. Although Night Vision provides an example of cursor synchronization, it doesn't exactly match my situation. Additionally, during subsequent testing, I discovered that synchronizing smaller time intervals to larger ones presents issues, but synchronizing larger time intervals to smaller ones works fine.

[C451]

Thanks. Yes, it seems that sync is not working (right now it gives you only x, y coordinates). For now you can try to play around t and time props :

// Cursor sync
// Subscribing to the events of the first instance
// Copy cursor from another chart instance instead of `cursor` event 
chart1.events.on("app:$cursor-update", (cursor) => {
  chart2.cursor = chart1.cursor;
  chart2.cursor.time = chart1.cursor.time + 1000000
  chart2.update() 
});

(now it is working)

[wk1210]

Thanks. Yes, it seems that sync is not working (right now it gives you only x, y coordinates). For now you can try to play around t and time props :

// Cursor sync
// Subscribing to the events of the first instance
// Copy cursor from another chart instance instead of `cursor` event 
chart1.events.on("app:$cursor-update", (cursor) => {
  chart2.cursor = chart1.cursor;
  chart2.cursor.time = chart1.cursor.time + 1000000
  chart2.update() 
});

(now it is working)

Okay, I'll give the new approach a try. By the way, what is the difference between 'time' and 'ti'?

[C451]

ti is for indexBased mode (stocks, renko etc)

[wk1210]

I have tried the new method, but testing suggests that it still doesn't seem to work. So for now, I am still using my own method. Currently, there is only a small issue when synchronizing from a smaller timeframe to a larger timeframe, but there are no issues when synchronizing from a larger timeframe to a smaller one. Overall, the problem is not significant at the moment. If there are any fixes for this issue in the future, please mention them in the version update notes. Thank you for your response.