[BUG]: When using scattergl and zooming in significantly, the lines and dots fail to align
Personne n'a encore pris cette issue.
- Langage dominant
- JavaScript
- Étoiles
- 18.3k
- Forks
- 2k
- Merge moyen
- 2 j 12 h
- PR mergées (30 j)
- 28
Description
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>
Guide de contribution
Ouvrir le guide de contribution
Par où commencer
- Lisez l'issue en entier, puis le guide de contribution du projet.
- Signalez en commentaire que vous la prenez — cela évite que deux personnes fassent le même travail.
- Forkez le dépôt et travaillez sur une branche.
- Ouvrez une pull request qui référence le numéro de l'issue.
Piste de recherche
Commencez par la reproduction JavaScript fournie en utilisant Plotly.react et la trace scattergl en mode lines+markers ; zoomez progressivement pour observer à quel moment les lignes et les points divergent. Suivez le rendu de scattergl et le comportement du zoom jusqu’à ce que la gestion des coordonnées soit claire, puis vérifiez que les lignes et les marqueurs restent alignés aux niveaux de zoom extrêmes.
Rédigé par le modèle d'indexation à partir du texte de l'issue.
Évaluation
- Stack technique
- javascript
- Domaine
- data-visualization
- Type d'issue
- Bug
- Difficulté
- 3/5
- Temps estimé
- 1-2 jours
- Activité
- Active
- Clarté
- Plutôt claire
- Accessibilité débutants
- 55/100