Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Treemap trace #1038

Closed
ghost opened this issue Oct 14, 2016 · 6 comments · Fixed by #4185
Closed

Treemap trace #1038

ghost opened this issue Oct 14, 2016 · 6 comments · Fixed by #4185
Assignees
Milestone

Comments

@ghost
Copy link

ghost commented Oct 14, 2016

I believe treemaps could deserve to be supported natively as a new type instead of having to precompute the rectangles and add them as shapes.
One reason is that using shapes prevents us from directly using a colorscale on another trace attribute (since the shapes' fillcolor attribute only accepts a color value).

@etpinard etpinard added feature something new community community contribution labels Oct 14, 2016
@rodrigomurta
Copy link

It would be nice to have support to R too. Now treemaps are restricted to Python and Matlab.

@jackparmer
Copy link
Contributor

(Related: #2221)

@nicolaskruchten nicolaskruchten added this to the v1.50.0 milestone Jul 4, 2019
@etpinard etpinard assigned etpinard and archmoj and unassigned etpinard Jul 4, 2019
@archmoj archmoj added type: new trace type and removed community community contribution feature something new labels Jul 4, 2019
@nicolaskruchten
Copy link
Contributor

There are three possible visual forms that are in principle treemap-like, but whose intent and natural input format differ:

  1. Hierarchical part-of-whole represented as nested rectangles, with various algorithmic approaches, like optimizing for square aspect, or slice-and-dice etc
  2. 2-level x/y Marimekko plots which are arguably more bar-like than anything else, as they can be made with and benefit from continuous/cartesian axes e.g. https://datavizcatalogue.com/methods/marimekko_chart.html
  3. Multilevel mosaic plots (more than 2 levels) whose input data more closely resembles the parcoords one (see https://www.perceptualedge.com/articles/visual_business_intelligence/are_mosaic_plots_worthwhile.pdf for commentary)

Let's focus strictly on number 1 in this case, assuming that this is a trace-with-its-own-domain like sunburst and that it does not have cartesian axes.

Within that, there are a bunch of dimensions to explore, requirements-wise (these may overlap a lot, naturally):

  1. Color: there are many charts in the wild, especially financial ones, that use continuous color on treemaps (e.g. https://finviz.com/map.ashx)
  2. 'headers' for the rectangles that show the names of the containing ones. Note: this messes with the strict area calculations a little bit! (e.g. https://finviz.com/map.ashx) ... some implementations put the containing header in the top-left and the contained name in the bottom-right for example http://bl.ocks.org/ganeshv/6a8e9ada3ab7f2d88022
  3. Independently of headers, we might want to allow nesting borders or padding around the boxes and that messes with the math a bit also in terms of layout. I don't think we should do the "cushion gradient" effect that some implementations use. Here's an example of 'padding' https://observablehq.com/@d3/nested-treemap
  4. Mouseover behaviour to show hierarchy (i.e. adding borders to all containing rectangles on hover)
  5. Click to zoom in... double-click to zoom out? If there are 'headers' then you could click on the header to zoom out, similar to the way you click on the center of the sunburst to zoom out
  6. tweening when zooming in and out, keeping in mind that the aspect ratio will change while zooming
  7. text/hover info/templates, to show the percentage of whole, percentage of parent, name etc
  8. a top-level "path" bar that summarizes the current location within the treemap and allows zoom-out (e.g. http://bl.ocks.org/ganeshv/6a8e9ada3ab7f2d88022)
  9. The ability to constrain the number of visible levels like we do in Sunbursts (e.g. http://bl.ocks.org/ganeshv/6a8e9ada3ab7f2d88022 again)

There's lots of d3 prior art here... https://www.d3indepth.com/layouts/

Other implementations:

@jackparmer jackparmer mentioned this issue Jul 4, 2019
38 tasks
@nicolaskruchten nicolaskruchten changed the title Native support for treemap chart types Treemap trace Jul 4, 2019
This was referenced Jul 5, 2019
@archmoj
Copy link
Contributor

archmoj commented Aug 21, 2019

  1. Click to zoom in... double-click to zoom out? If there are 'headers' then you could click on the ...

Implementing double-click may not be a good idea noting that on some device e.g. iPad the hover event is triggered by single click and the click event is triggered by double click.

@archmoj
Copy link
Contributor

archmoj commented Aug 30, 2019

Is it useful to display node's current/full path on hover?

@nicolaskruchten
Copy link
Contributor

Is it useful to display node's current/full path on hover?

Would be useful to have as an option in hovertemplate yes! By default I would say no.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

5 participants