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

[Lens] Treemap shows excessive padding if its height is greater then 1000px #159942

Closed
markov00 opened this issue Jun 19, 2023 · 2 comments · Fixed by #159992
Closed

[Lens] Treemap shows excessive padding if its height is greater then 1000px #159942

markov00 opened this issue Jun 19, 2023 · 2 comments · Fixed by #159992
Assignees
Labels
bug Fixes for quality problems that affect the customer experience Feature:Lens impact:low Addressing this issue will have a low level of impact on the quality/strength of our product. Team:Visualizations Visualization editors, elastic-charts and infrastructure

Comments

@markov00
Copy link
Member

Kibana version:
since 8.2

Describe the bug:
If the height of a treemap exceeds 1000px paddings are added, reducing the chart size.
This behavior is an unwanted one and probably a missing handled case when unifying the partition chart expression.

This behavior was probably introduced to handle a max size of 1000 px for pie charts, that they looks exceccively big if larger than that size.

Steps to reproduce:

  1. create a treemap and add it to a dashboard
  2. resize the treemap panel to have a height greater than 100px
  3. save the dashboard and refresh the page

Expected behavior:

A treemap can be stretched as much as the user wants without adding paddings.

Screenshots (if relevant):
Screenshot 2023-06-19 at 16 35 45

Errors in browser console (if relevant):
N/A

Any additional context:
The bug was introduced in #122420 and the code that introduce that padding is here:

chartPaddings: {
top: ((1 - Math.min(1, MAX_SIZE / dimensions?.height)) / 2) * dimensions?.height,
bottom: ((1 - Math.min(1, MAX_SIZE / dimensions?.height)) / 2) * dimensions?.height,
left: ((1 - Math.min(1, MAX_SIZE / dimensions?.width)) / 2) * dimensions?.height,
right: ((1 - Math.min(1, MAX_SIZE / dimensions?.width)) / 2) * dimensions?.height,
},

@markov00 markov00 added bug Fixes for quality problems that affect the customer experience Feature:Pie Chart Pie chart visualization feature Team:Visualizations Visualization editors, elastic-charts and infrastructure labels Jun 19, 2023
@elasticmachine
Copy link
Contributor

Pinging @elastic/kibana-visualizations @elastic/kibana-visualizations-external (Team:Visualizations)

@stratoula stratoula added impact:low Addressing this issue will have a low level of impact on the quality/strength of our product. Feature:Lens and removed Feature:Pie Chart Pie chart visualization feature labels Jun 19, 2023
@stratoula
Copy link
Contributor

I think that it should only add paddings when in aggbased editor. In Lens the paddings are not applied and are not needed and on embeddable level we don't want them in general because they create the issue described above.

@stratoula stratoula self-assigned this Jun 20, 2023
stratoula added a commit that referenced this issue Jun 20, 2023
## Summary

Closes #159942

If the height of a partition chart exceeds 1000px paddings are added,
reducing the chart size.
This is caused due to this piece of code
#122420

This was added for the aggbased editor to reduce a bit the pie size
(otherwise it was taking the full container size and the pie was huge)

Although we want this, we don't want this to be applied in dashboards or
lens editor. This PR is fixing this by adding the paddings only on the
agg based editor level

In agg based editor
<img width="651" alt="image"
src="https://github.com/elastic/kibana/assets/17003240/48ac6fdd-43e3-46f5-8818-d40334678fce">

Dashboard with very tall treemap, no paddings
<img width="933" alt="image"
src="https://github.com/elastic/kibana/assets/17003240/8787d6ab-887c-4c8d-8419-2c2d5659f2c1">



### Checklist
- [x] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Fixes for quality problems that affect the customer experience Feature:Lens impact:low Addressing this issue will have a low level of impact on the quality/strength of our product. Team:Visualizations Visualization editors, elastic-charts and infrastructure
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants