issues: 287844110

This data as json

id node_id number title user state locked assignee milestone comments created_at updated_at closed_at author_association active_lock_reason draft pull_request body reactions performed_via_github_app state_reason repo type
287844110 MDExOlB1bGxSZXF1ZXN0MTYyNDI2NzU2 1820 WIP: html repr 4160723 closed 0     40 2018-01-11T16:33:07Z 2019-10-25T15:06:58Z 2019-10-24T16:48:46Z MEMBER   0 pydata/xarray/pulls/1820
  • [x] Closes #1627
  • [ ] Tests added
  • [ ] Tests passed
  • [ ] Passes git diff upstream/master **/*py | flake8 --diff
  • [ ] Fully documented, including whats-new.rst for all changes and api.rst for new API

This is work in progress, although the basic functionality is there. You can see a preview here: http://nbviewer.jupyter.org/gist/benbovy/3009f342fb283bd0288125a1f7883ef2

TODO:

  • [ ] Add support for Multi-indexes
  • [ ] Probably good to have some opt-in or fail back system in case where we (or users) know that the rendering will not work
  • [ ] Add some tests

Nice to have (keep this for later):

  • Clean-up CSS code and HTML template (track CSS subgrid support in browsers, this may simplify a lot the things here).
  • Dynamically adapt cell widths (given the length of the names of variables and dimensions). Currently all cells have a fixed width. This is tricky, though, as we don't use a monospace font here.
  • Integration with jupyterlab/notebook themes (CSS classes) and maybe allow custom CSS.
  • Integration of Dask arrays HTML repr (+ integration of repr for other array backends).
  • Maybe find a way (if possible) to include CSS only once in the notebook (currently it is included each time a xarray object is displayed in an output cell, which is not very nice).
  • Review the rules for collapsing the Coordinates, Data variables and Attributes sections (maybe expose them as global options).
  • Maybe also define some rules to collapse automatically the data section (DataArray and Variable) when the data repr is too long.
  • Maybe add rich representation for Dataset.coords and Dataset.data_vars as well?
Other thoughts (old) A big challenge here is to provide both robust and flexible styling (CSS): - I have tested the current styling in jupyterlab (0.30.6, light theme), notebook (5.2.2) and nbviewer: despite some slight differences it looks quite good! - However, the current CSS code is a bit fragile (I had to add a lot of `!important`). Probably this could be a bit cleaned and optimized (unfortunately my CSS skills are limited). - Also, with the jupyterlab's dark theme it looks ugly. We probably need to use jupyterlab CSS variables so that our CSS scheme is compatible with the theme machinery, but at the same time we need to support other front-ends. So we probably need to maintain different stylings (i.e., multiple CSS files, one of them picked-up depending on the front-end), though I don't know if it's easy to automatically detect the front-end (choosing a default style is difficult too). - The notebook rendering on Github seems to disable style tags (no style is applied to the output, see https://gist.github.com/benbovy/3009f342fb283bd0288125a1f7883ef2). Output is not readable at all in this case, so it might be useful to allow turning off rich output as an option. 
{
    "url": "https://api.github.com/repos/pydata/xarray/issues/1820/reactions",
    "total_count": 3,
    "+1": 3,
    "-1": 0,
    "laugh": 0,
    "hooray": 0,
    "confused": 0,
    "heart": 0,
    "rocket": 0,
    "eyes": 0
}
     13221727 pull

Links from other tables