feat(heatmap): add axis titles#1503
Merged
markov00 merged 29 commits intoelastic:masterfrom Dec 21, 2021
Merged
Conversation
nickofthyme
reviewed
Nov 24, 2021
nickofthyme
reviewed
Dec 1, 2021
Collaborator
nickofthyme
left a comment
There was a problem hiding this comment.
Looking good just a few more things to consider.
packages/charts/src/chart_types/heatmap/renderer/canvas/canvas_renderers.ts
Outdated
Show resolved
Hide resolved
packages/charts/src/chart_types/heatmap/renderer/canvas/canvas_renderers.ts
Outdated
Show resolved
Hide resolved
packages/charts/src/chart_types/heatmap/renderer/canvas/canvas_renderers.ts
Outdated
Show resolved
Hide resolved
packages/charts/src/chart_types/heatmap/state/selectors/compute_chart_dimensions.ts
Outdated
Show resolved
Hide resolved
packages/charts/src/chart_types/heatmap/state/selectors/compute_chart_dimensions.ts
Outdated
Show resolved
Hide resolved
packages/charts/src/chart_types/heatmap/renderer/canvas/canvas_renderers.ts
Outdated
Show resolved
Hide resolved
packages/charts/src/chart_types/heatmap/renderer/canvas/canvas_renderers.ts
Outdated
Show resolved
Hide resolved
nickofthyme
reviewed
Dec 1, 2021
nickofthyme
reviewed
Dec 1, 2021
packages/charts/src/chart_types/heatmap/state/selectors/get_grid_full_height.ts
Outdated
Show resolved
Hide resolved
markov00
requested changes
Dec 3, 2021
packages/charts/src/chart_types/heatmap/renderer/canvas/canvas_renderers.ts
Outdated
Show resolved
Hide resolved
packages/charts/src/chart_types/heatmap/renderer/canvas/canvas_renderers.ts
Outdated
Show resolved
Hide resolved
packages/charts/src/chart_types/heatmap/renderer/canvas/connected_component.tsx
Outdated
Show resolved
Hide resolved
Contributor
Author
|
Since Nick's PR is going to be pulling some properties off the theme vs the config, would it be cool to just put the titles on the theme instead of the config? @markov00 and @nickofthyme thoughts? |
Collaborator
@rshen91 My preference is to put the title style in the theme and keep the |
The current position is adjusted to be aligned only to the grid, it doesn't consider yet the axis dimensions
b9616bf to
8cd19eb
Compare
markov00
approved these changes
Dec 21, 2021
nickofthyme
pushed a commit
that referenced
this pull request
Jan 5, 2022
# [42.0.0](v41.0.1...v42.0.0) (2022-01-05) ### Bug Fixes * **flamegraph:** solve animation regression occurring with 6db2677 ([#1541](#1541)) ([5ec6037](5ec6037)), closes [#1540](#1540) * **heatmap:** render empty state ([#1532](#1532)) ([59002df](59002df)) * **waffle:** fix strange 0 text in legend item extra when label is 0 ([#1538](#1538)) ([72224b9](72224b9)) ### Features * **goal:** add valueFormatter for tooltip ([#1529](#1529)) ([8139973](8139973)) * **heatmap:** add axis titles ([#1503](#1503)) ([a87325d](a87325d)) * **types:** improve generic types in specs, and spec prop types ([#1421](#1421)) ([562929e](562929e)) ### BREAKING CHANGES * **types:** The `xAccessor` and `yAccessor` are now required on all xy chart specs. Stronger typing on `data` prop that may cause type errors when using untyped array (i.e. `const arr: never[] = []`). Other minor type changes related to spec types. * **heatmap:** The heatmap yAxisLabel.padding style type is changed from Pixel | Partial<Padding> to Pixels | Padding. The heatmap axis labels are now correctly subjected to padding calculations and it will result in a slightly different position of labels. Co-authored-by: Marco Vettorello <vettorello.marco@gmail.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
xAxisTitleandyAxisTitleprops are available and rendered in the Heatmap chart.The title style reuse the one provided by the
Theme.axes.axisTitletheme configuration.Together with the
visibleoption, using an empty string will result in a hidden title.BREAKING CHANGE
The heatmap
yAxisLabel.paddingstyle type is changed fromPixel | Partial<Padding>toPixels | Padding.The heatmap axis labels are now correctly subjected to padding calculations and it will result is slightly modified position of labels.
fix #1531
Details
I've refactored some calculations used to compute the size of the grid based on the style constraints and I've unified the chart elements size calculation within a single selector:
computeChartElementSizesSelector.In accordance with @darnautov I've also removed the gray mask in the lower part the heatmap when brushing the chart:
from:


to:
Issues
Closes #1221
Checklist
:xy,:partition)closes #123,fixes #123)packages/charts/src/index.ts