[BUG]: When using scattergl and zooming in significantly, the lines and dots fail to align
Nessuno ha ancora preso questa issue.
- Lingua principale
- JavaScript
- Stelle
- 18.3k
- Fork
- 2k
- Merge medio
- 2g 12h
- PR unite (30g)
- 28
Descrizione
Description
When using scattergl, I found that if I zoom in too much, the lines and dots do not align properly.
Screenshots/Video
Steps to reproduce
Click the "zoom" function in the toolbox and continuously zoom in on the points until the points and lines are misaligned.
JavaScript
<html>
<head>
<!-- Plotly.js -->
<meta charset="UTF-8" />
<script
src="https://cdn.plot.ly/plotly-3.3.0.min.js"
charset="utf-8"
></script>
<style>
html,
body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
overflow: hidden;
}
#graphDiv {
width: 100%;
height: 100%;
}
</style>
</head>
<body>
<div id="graphDiv"></div>
<script>
const rand = () => Math.random()
var x = [1, 5, 10]
var data = [
{
type: 'scattergl',
mode: 'lines+markers',
line: { color: '#b55400' },
y: [0.000014, 0.000015, 0.000012],
hoverinfo: 'skip',
},
{
type: 'scattergl',
mode: 'lines+markers',
},
]
var layout = {
dragmode: 'pan',
title: { text: '' },
uirevision: 'true',
xaxis: { zeroline: false, tickformat: ',d' },
yaxis: { zeroline: false, tickformat: '.6f', automargin: true },
responsive: true,
}
const graphDiv = document.getElementById('graphDiv')
Plotly.react(graphDiv, data, layout, {
displayModeBar: true,
responsive: true,
})
</script>
</body>
</html>
Guida per i contributori
Apri la guida per i contributori
Come iniziare
- Leggi tutta la issue e poi la guida ai contributi del progetto.
- Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
- Fai un fork del repository e lavora su un branch.
- Apri una pull request che faccia riferimento al numero della issue.
Direzione di ricerca
Inizia con la riproduzione JavaScript fornita usando Plotly.react e la trace scattergl in modalità lines+markers; aumenta ripetutamente lo zoom per osservare quando le linee e i punti divergono. Segui il rendering di scattergl e il comportamento dello zoom finché la gestione delle coordinate non sarà chiara, quindi verifica che le linee e i marker rimangano allineati ai livelli di zoom estremi.
Scritto dal modello di indicizzazione a partire dal testo della issue.
Valutazione
- Stack tecnologico
- javascript
- Ambito
- data-visualization
- Tipo di issue
- Bug
- Difficoltà
- 3/5
- Tempo stimato
- 1-2 giorni
- Stato di attività
- Attiva
- Chiarezza
- Abbastanza chiara
- Idoneità per principianti
- 55/100