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

feat: treemap / sunburst / pie / donut charts #493

Merged
merged 99 commits into from
Jan 21, 2020
Merged

Conversation

monfera
Copy link
Contributor

@monfera monfera commented Dec 10, 2019

Summary

1st round of hierarchical, partitioning visualizations. Fixes #84 including #381 (comment)
Other related issues: #381 #464 #492

Treemap:

image

Sunburst:
image

Donut:
image

Mid-transition from possible future tweening:
image

Features we can lift:

  • multiline, adaptive size, flexible shape text rendering
  • text color inversion on light surfaces for accessibility
  • hierarchical data processing with Typescript-only code (analogy: GROUP BY ROLLUP)
  • compact, sunburst and treemap layout code in TS
  • possibility of automatically generating configuration knobs
  • many config options can be tweened/animated in the future

Checklist

Use strikethroughs to remove checklist items you don't feel are applicable to this PR.

  • Any consumer-facing exports were added to src/index.ts (and stories only import from ../src except for test data & storybook)
  • This was checked for cross-browser compatibility, including a check against IE11
  • Proper documentation or storybook story was added for features that require explanation or tutorials
  • Unit tests were updated or added to match the most common scenarios
  • Each commit follows the convention

@monfera monfera added enhancement New feature or request wip work in progress :new chart type New chart type related feature request labels Dec 10, 2019
@monfera monfera self-assigned this Dec 10, 2019
@monfera monfera changed the title [wip] Sunburst / pie / donut charts [wip] feat: sunburst / pie / donut charts Dec 10, 2019
@codecov-io
Copy link

codecov-io commented Dec 10, 2019

Codecov Report

Merging #493 into master will increase coverage by 0.21%.
The diff coverage is 53.84%.

Impacted file tree graph

@@            Coverage Diff             @@
##           master     #493      +/-   ##
==========================================
+ Coverage   75.15%   75.36%   +0.21%     
==========================================
  Files         192      192              
  Lines        5744     5769      +25     
  Branches     1062     1114      +52     
==========================================
+ Hits         4317     4348      +31     
+ Misses       1411     1405       -6     
  Partials       16       16
Impacted Files Coverage Δ
src/chart_types/xy_chart/utils/interactions.ts 100% <ø> (ø) ⬆️
src/utils/accessor.ts 45.45% <ø> (ø) ⬆️
src/specs/index.ts 100% <ø> (ø) ⬆️
src/chart_types/xy_chart/utils/specs.ts 100% <ø> (ø) ⬆️
src/utils/commons.ts 100% <ø> (ø) ⬆️
..._types/xy_chart/state/selectors/get_cursor_band.ts 90.32% <ø> (ø) ⬆️
src/utils/data_generators/data_generator.ts 78.94% <0%> (-21.06%) ⬇️
.../chart_types/partition_chart/state/chart_state.tsx 61.9% <0%> (ø) ⬆️
...art_types/partition_chart/layout/utils/sunburst.ts 10.52% <0%> (ø) ⬆️
src/specs/settings.tsx 100% <100%> (ø) ⬆️
... and 45 more

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 9a588b5...9bbde65. Read the comment docs.

Copy link
Member

@markov00 markov00 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code wise looks good to me.
I've added few comments on coding conventions that should be addressed and some one more important related to missing exported types.
We have to add snapshot tests. I can do that in a different PR

package.json Outdated Show resolved Hide resolved
src/chart_types/partition_chart/layout/config/config.ts Outdated Show resolved Hide resolved
src/chart_types/partition_chart/layout/utils/math.ts Outdated Show resolved Hide resolved
stories/sunburst.tsx Outdated Show resolved Hide resolved
stories/sunburst.tsx Outdated Show resolved Hide resolved
stories/sunburst.tsx Outdated Show resolved Hide resolved
stories/sunburst.tsx Outdated Show resolved Hide resolved
stories/sunburst.tsx Outdated Show resolved Hide resolved
@monfera
Copy link
Contributor Author

monfera commented Jan 20, 2020

Some failed CI runs due to cancelled runs and not checking in yarn.lock early enough

@monfera monfera removed the wip work in progress label Jan 21, 2020
@monfera monfera merged commit e4de627 into elastic:master Jan 21, 2020
markov00 pushed a commit that referenced this pull request Jan 21, 2020
# [16.2.0](v16.1.0...v16.2.0) (2020-01-21)

### Features

* implement treemap, sunburst, pie and donut charts ([#493](#493)) ([e4de627](e4de627))
@markov00
Copy link
Member

🎉 This PR is included in version 16.2.0 🎉

The release is available on:

Your semantic-release bot 📦🚀

@markov00 markov00 added the released Issue released publicly label Jan 21, 2020
AMoo-Miki pushed a commit to AMoo-Miki/OpenSearch-Dashboards that referenced this pull request Feb 10, 2022
# [16.2.0](elastic/elastic-charts@v16.1.0...v16.2.0) (2020-01-21)

### Features

* implement treemap, sunburst, pie and donut charts ([opensearch-project#493](elastic/elastic-charts#493)) ([41a1133](elastic/elastic-charts@41a1133))
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request :new chart type New chart type related feature request released Issue released publicly
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Pie chart
3 participants