plotly / plotly/plotly.js

[BUG]: Automargin for quiver plots is a little off with `arrowref: 'paper'`

Ouverte
#7,979 2 commentaires 0 réactions 0 personnes assignées Voir sur GitHub

Personne n'a encore pris cette issue.

bug P2 plotly-internal size: 3
Langage dominant
JavaScript
Étoiles
18.3k
Forks
2k
Merge moyen
2 j 12 h
PR mergées (30 j)
28

Description

Desired behavior

Quiver automargin should always result in an initial plot area which contains all arrow endpoints.

Current behavior

The current quiver implementation calculates the arrow endpoints assuming arrowref: 'data', uses those endpoints to compute the automargin extents, and then if arrowref is 'paper'`, applies an adjustment factor to the arrow endpoints.

If the x:y aspect ratio of the data is pretty close to 1:1, this works OK because the arrow endpoints don't change much. But if the aspect ratio of the data is very far from 1:1, this can result in an initial plot where the arrow endpoints extend outside of the plotted area.

Example
Figure definition:
{
  "data": [
    {
      "type": "quiver",
      "uhoverformat": ".3f",
      "yhoverformat": ".3f",
      "xhoverfomrat": ".3f",
      "vhoverformat": ".3f",
      "x": [0],
      "y": [0],
      "u": [1],
      "v": [0.1],
      "arrowref": "paper"
    }
  ],
  "layout": {
    "width": 800,
    "height": 600,
    "showlegend": false
  }
}

Screenshot:

Image

Notice how the tip of the arrow extends off the right side of the plot.

Fix

The relevant logic is around lines 200-206 in src/traces/quiver/calc.js.

It's a bit of a chicken-and-egg problem, because when arrowref is 'paper', the data position of the arrow endpoints depends on the axis scales, which depend on the position of the arrow endpoints. I think there is probably an algebraic solution but haven't quite been able to figure it out. Alternatively there's probably an iterative or approximate approach we could apply here that would still be an improvement over the current behavior.

Guide de contribution

Ouvrir le guide de contribution

Par où commencer

  1. Lisez l'issue en entier, puis le guide de contribution du projet.
  2. Signalez en commentaire que vous la prenez — cela évite que deux personnes fassent le même travail.
  3. Forkez le dépôt et travaillez sur une branche.
  4. Ouvrez une pull request qui référence le numéro de l'issue.

Piste de recherche

Commencez dans src/traces/quiver/calc.js autour des lignes 200-206 et reproduisez la figure quiver fournie avec arrowref défini sur paper. Suivez la manière dont les extrémités des flèches et les étendues de automargin sont calculées par rapport aux échelles des axes. C'est terminé lorsque la zone de tracé initiale contient toutes les extrémités des flèches, même lorsque le rapport d'aspect des données diffère sensiblement de 1:1.

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é
4/5
Temps estimé
3-5 jours
Activité
Active
Clarté
Plutôt claire
Accessibilité débutants
55/100

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.