plotly / plotly/plotly.js

make grid simplify subplots (mixed plots not working currently)

未关闭
#5,691 0 条评论 1 个 reaction 已指派 0 人 在 GitHub 查看

还没有人认领这个 Issue。

feature P3
主要语言
JavaScript
星标
18.3k
派生
2k
平均合并
2 天 12 小时
30 天内合并 PR
28

描述

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);

贡献指南

打开贡献指南

从这里开始

  1. 先读完整个 Issue,再读项目的贡献指南。
  2. 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
  3. Fork 仓库,在一个分支上完成修改。
  4. 提交 Pull Request,并在描述里引用这个 Issue 编号。

调研方向

首先,通过 Plotly.newPlot 重现混合使用 bar、barpolar、pie 和 scatter3d 的示例,并将其与链接的 CodePen 进行比较。阅读现有的网格布局行为和 Python Plotly 子图参考,然后定义支持 rows、columns、独立的混合图表、colspan 和 rowspan 需要哪些内容;完成的标准是示例无需手动配置子图即可运行。

由索引模型根据 Issue 内容生成。

评估

技术栈
javascript
领域
data-visualization
Issue 类型
功能
难度
5/5
预计耗时
一周以上
活跃度
停滞
描述清晰度
基本清楚
新手友好度
25/100

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。