Skip to content

Fix visualization designer not rendering charts due to missing height

Jiaan Louw requested to merge jlouw-fix-designer-visualization-height into master

What does this MR do and why?

Fixes the visualization designer not rendering charts due to missing height.

This was caused by a recent MR Update chart visualization to fill the panel co... (#393355 - closed) that added height="auto" to the line chart visualizations. The visualization grows to fit the container height, but because the container had no height the chart was rendering as height: 0px. This MR fixes the bug by adding a height of 600px to the demo panel in the visualization designer.

Screenshots or screen recordings

Before After
image image

How to set up and validate locally

To test the product analytics dashboard items are shown, you will need to follow the instructions at https://gitlab.com/gitlab-org/gitlab/-/snippets/2474959 to enable Product Analytics on your GDK.

Visualization Designer

  1. Visit the projects shared dashboards listing e.g. http://gdk.test:3000/gitlab-org/gitlab-test/-/analytics/dashboards
  2. Click The Visualization Designer button in the top right
  3. Select some values in the left panel, e.g. Page View, All Pages, Group By Day
  4. Select Line Chart in the right panel and check the rendered chart

MR acceptance checklist

This checklist encourages us to confirm any changes have been analyzed to reduce risks in quality, performance, reliability, security, and maintainability.

Edited by Jiaan Louw

Merge request reports