plotly / plotly/plotly.js

enable control of rendering order in stacked area charts (line colors)

Aperta
#6,579 2 commenti 2 reazioni 0 assegnatari Vedi su GitHub

Nessuno ha ancora preso questa issue.

feature P3
Lingua principale
JavaScript
Stelle
18.3k
Fork
2k
Merge medio
2g 12h
PR unite (30g)
28

Descrizione

I am plotting a stacked area chart showing (positive y side) power consumption "from grid" (red) and "from solar" (orange) - in this order. Note that on the left-hand side of the chart, (non-zero red and zero orange), the red area is has an orange outline. While it is reasonable, taking into account that red area is rendered before orange, it is not visually appealing and can be confusing to the user.

Screenshot_2023-04-23_11-17-22

A preferred solution would be to somehow render the chart top-down (I do realize that both the stacking mechanism and tonexty fill currently depend on a bottom-up rendering order). In the example above, that would allow red outlines to be rendered last, covering zero areas above them.

I am using Plotly Graph Card for Home Assistant, so I do not have a JS code to include. I can provide source YAML code if that helps.

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.

Direzione di ricerca

Inizia riproducendo il grafico ad aree impilate dello screenshot, usando il contesto Plotly Graph Card collegato e la source YAML, se fornita. Leggi prima il rendering delle aree impilate e il comportamento di riempimento tonexty; il lavoro è completato quando esiste un ordine di rendering controllabile che migliora i contorni delle aree con superficie nulla senza compromettere l’impilamento.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Valutazione

Stack tecnologico
javascript
Ambito
data-visualization
Tipo di issue
Funzionalità
Difficoltà
5/5
Tempo stimato
Più di una settimana
Stato di attività
Ferma
Chiarezza
Da chiarire
Idoneità per principianti
32/100

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.