search

elastic / elastic-charts

https://elastic.github.io/elastic-charts/storybook
Other
368 stars 117 forks source link

[partition] Centering labels in partitions #2195

Open chao813 opened 11 months ago

chao813 commented 11 months ago

Is there a way to center the fill labels in the partitions? I've been looking at the PartialTheme FillLabelConfig but can't find a way to center the labels.

Expected: image

Current: image

nickofthyme commented 11 months ago

Hey @chao813 unfortunately no, and I don't see a real workaround to this as it currently stands.

There is an issue open here #2128 to improve the current label positioning/sizing for partition charts. I think this would be a good case to add when there is a full circle.

chao813 commented 11 months ago

Hi @nickofthyme, what does the padding in the fillLabel do then?

partition: { fillLabel: { padding: { top: 100, bottom: 100, left: 100, right: 100 }, } }

nickofthyme commented 11 months ago

Strangely nothing 🤔

After testing and seeing no affect I dug into the code and found the padding is only passed to the getSectorRowGeometry function, shown below, but the function definition is actually missing two parameters from the GetShapeRowGeometry function type signature after the rotation param, one of which is the padding.

So it's passed in but never accounted for. This is definitely a bug I'll open up a new issue for this to be address alongside #2128 and this centering issue.

https://github.com/elastic/elastic-charts/blob/7e319d5c2ed42d305624093a197306dfc15bf694/packages/charts/src/chart_types/partition_chart/layout/viewmodel/fill_text_layout.ts#L49-L77

But this code is original to the partition chart implementation 3 years ago and hasn't been touched since.