Skip to content

layout.grid enhancements for plotly.py to replace make_subplots #3507

Closed
@jonmmease

Description

@jonmmease

Background

plotly.py has a system for building figures with subplots that predates the plotly.js layout.grid system for subplots. I would like to replace this custom subplot system with layout.grid to reduce complexity inside plotly.py and add support for all trace types (plotly.py's system only supports Cartesian subplot types). This transition will also make the integration of px into plotly.py much smoother.

Needs

As far as I can tell, there are two features that are implemented in plotly.py's make_subplots function that are not supported by layout.grid.

The first two are both demonstrated in this example https://plot.ly/python/subplots/#custom-sized-subplot-with-subplot-titles.

  1. Spanned subplots: make_subplots allows individual axes to span multiple subplot grid entries
  2. Subplot titles: make_subplots has a system for positioning text annotations as titles for individual subplots
  3. column/row widths: make_subplots supports column_width and row_width arrays to support non-uniform widths of the rows and columns in the grid.
  4. insets: make_subplots supports the specification of insets. TBH I'm not really sure how this works and I don't know if there are any examples of this outside of the docstring. And this might not be something that makes sense to support in layout.grid. Here's the docstring
    insets (kwarg, list of dictionaries):
        Inset specifications.

        - Each item in 'insets' is a dictionary.
            The available keys are:

            * cell (tuple, default=(1,1)): (row, col) index of the
                subplot cell to overlay inset axes onto.
            * is_3d (boolean, default=False): flag for 3d scenes
            * l (float, default=0.0): padding left of inset
                  in fraction of cell width
            * w (float or 'to_end', default='to_end') inset width
                  in fraction of cell width ('to_end': to cell right edge)
            * b (float, default=0.0): padding bottom of inset
                  in fraction of cell height
            * h (float or 'to_end', default='to_end') inset height
                  in fraction of cell height ('to_end': to cell top edge)

API ideas

To kick things off, here's a idea for a potential plotly.js API

  1. We could add layout.grid.rowspan and layout.grid.colspan properties that may optionally be set to 2D arrays of integers. So the example above would have a a colspan property of
[[1, 1],
 [2, 0]]

which would imply a grid.subplots property of

[['xy'  , 'x2y2'],
 ['x3y3', null]]
  1. We could add a grid.titles property that is a 2D array of title strings. So the example above would have a grid.titles property of
[['First Subplot', 'Second Subplot'],
 ['Third Subplot' , null]]
  1. We could add grid.widths and grid.heights properties that would be 1D arrays of numbers. We could internally normalize each array and use the elements to determine the width/height of each column/row.

cc @nicolaskruchten

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions