Hacktoberfest 2026: le issue che i maintainer hanno segnato per ottobre, aperte e adatte ai principianti. Sfoglia le issue Hacktoberfest

[BUG]: When using scattergl and zooming in significantly, the lines and dots fail to align

Aperta
#7,955 4 commenti 0 reazioni 0 assegnatari Vedi su GitHub

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
3/5
Tempo stimato
1-2 giorni
Idoneità per principianti
55/100
Tipo di issue
Bug
Chiarezza
Abbastanza chiara
Stato di attività
Attiva
Stack tecnologico
javascript
Ambito
data-visualization

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.

Descrizione

bug P3 size: 1
Description

When using scattergl, I found that if I zoom in too much, the lines and dots do not align properly.

Screenshots/Video

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>
Lingua principale
JavaScript
Stelle
18.3k
Fork
2k
Merge medio
2g 10h
PR unite (30g)
30

Guida per i contributori

Apri la guida per i contributori

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di plotly/plotly.js

Tutte le issue di plotly/plotly.js

Issue simili

Altre issue su JavaScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.