plotly / plotly/plotly.js

make grid simplify subplots (mixed plots not working currently)

Offen
#5,691 0 Kommentare 1 Reaktion 0 zugewiesene Personen Auf GitHub ansehen

Dieses Issue hat noch niemand übernommen.

feature P3
Vorherrschende Sprache
JavaScript
Sterne
18.3k
Forks
2k
Ø Merge
2 T. 12 Std.
Gemergte PRs (30 T.)
28

Beschreibung

Usecase:
User should be able to draw subplots with ease by using grid option.
User has 4 diff graphs and he wants to put them together, in grid by using following option without getting into much complexity

grid: {
    rows: 2,
    columns: 2,
    pattern: "independent"
  }
}

Ease of use:
It will be great to have similat functionality like provided in python plotly where user can define rows, columns, colspan and rowspan in data. Its plain and dead easy.

from plotly.subplots import make_subplots
import plotly.graph_objects as go

fig = make_subplots(
    rows=5, cols=2,
    specs=[[{}, {"rowspan": 2}],
           [{}, None],
           [{"rowspan": 2, "colspan": 2}, None],
           [None, None],
           [{}, {}]],
    print_grid=True)

Reference:
python plotly.subplots has given functionality with much ease of use. see HERE. Same is needed for js Please

Code Pen:
https://codepen.io/mafar/pen/YzZEdLR?editors=0010

JS CODE:

var trace1 = {
  type: "bar",
  y: [2, 3, 1]
};

var trace2 = {
  r: [2, 3, 1],
  theta: [0, 45, 90],
  type: "barpolar"
};

var trace3 = {
  type: "pie",
  values: [2, 3, 1]
};

var trace4 = {
  mode: "lines",
  type: "scatter3d",
  x: [2, 3, 1],
  y: [0, 0, 0],
  z: [0.5, 1, 2]
};

var data = [trace1, trace2, trace3, trace4];

var layout = {
  grid: {
    rows: 2,
    columns: 2,
    pattern: "independent"
  }
};

Plotly.newPlot("myDiv", data, layout);

Beitragsleitfaden

Beitragsleitfaden öffnen

Erste Schritte

  1. Lies das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreib ins Issue, dass du es übernimmst — das erspart doppelte Arbeit.
  3. Forke das Repository und arbeite in einem Branch.
  4. Öffne einen Pull Request, der die Issue-Nummer nennt.

Rechercherichtung

Beginne damit, das Beispiel mit gemischten bar-, barpolar-, pie- und scatter3d-Diagrammen über Plotly.newPlot zu reproduzieren, und vergleiche es mit dem verlinkten CodePen. Lies das bestehende Verhalten des Grid-Layouts und die Referenz zu Subplots von Python Plotly und definiere anschließend, was die Unterstützung für rows, columns, unabhängige gemischte Plots, colspan und rowspan erfordern würde; abgeschlossen ist die Aufgabe, wenn das Beispiel ohne manuelle Subplot-Konfiguration funktioniert.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
javascript
Bereich
data-visualization
Issue-Typ
Feature
Schwierigkeit
5/5
Geschätzter Aufwand
Über eine Woche
Aktivitätsstatus
Veraltet
Klarheit
Größtenteils klar
Anfängerfreundlichkeit
25/100

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.