Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

coordinateToTime return incorrect time. #1813

Open
cdxf opened this issue Feb 13, 2025 · 1 comment
Open

coordinateToTime return incorrect time. #1813

cdxf opened this issue Feb 13, 2025 · 1 comment

Comments

@cdxf
Copy link

cdxf commented Feb 13, 2025

Lightweight Charts™ Version: 5.0.2

Steps/code to reproduce:
I followed the Set Crosshair Position tutorial (Tracking without long-press on mobile) to synchronize the crosshair with the cursor position on click.
https://tradingview.github.io/lightweight-charts/tutorials/how_to/set-crosshair-position

// Helper Function to Get X Coordinate from Mouse or Touch Event
function getXCoordinate(event) {
    if (event.clientX !== undefined) {
        return event.clientX; // Mouse event
    } else if (event.touches && event.touches.length > 0) {
        return event.touches[0].clientX; // Touch event
    }
    return null;
}
const chartElement = document.getElementById('chart');

function syncCrosshair(event){
    const bcr = chartElement.getBoundingClientRect();
    const x = bcr.left + getXCoordinate(event);
    const y = bcr.top + getYCoordinate(event);

    const btcDominanceY = btcDominanceSeries.coordinateToPrice(y);
    const altcoinDominanceY = altcoinDominanceSeries.coordinateToPrice(y);
    const time = chart.timeScale().coordinateToTime(x);
    console.log(formatDateTime(time * 1000))
    if (!Number.isFinite(altcoinDominanceY) || !Number.isFinite(btcDominanceY) || !Number.isFinite(time)) {
        return;
    }

    chart.setCrosshairPosition(btcDominanceY, time, btcDominanceSeries);
    chart.setCrosshairPosition(altcoinDominanceY, time, altcoinDominanceSeries);
}

Actual behavior:
The time variable returned is incorrect. There is always a fixed horizontal gap between my cursor position and the crosshair (the setCrosshairPosition call is correct, but the time returned is incorrect as I verified from console.log).
The gap length changes when the screen size changes.

Expected behavior:
The time variable should return the time under my cursor.

Screenshots:

Image

@SlicedSilver
Copy link
Contributor

In your code you have some adjustments to the mouse position such as:

const bcr = chartElement.getBoundingClientRect();
const x = bcr.left + getXCoordinate(event);

I would expect that this would be a good place to start investigating the issue.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants