# Side-by-side Perspective Pie Charts' labels are clipping no matter what I try

**URL:** <https://forum.inductiveautomation.com/t/side-by-side-perspective-pie-charts-labels-are-clipping-no-matter-what-i-try/25772>\
**Category:** Ignition Early Access\
**Tags:** perspective\
**Created:** [June 12, 2019, 3:48pm UTC](https://forum.inductiveautomation.com/t/side-by-side-perspective-pie-charts-labels-are-clipping-no-matter-what-i-try/25772 "2019-06-12T15:48:10Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![md.szyman](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/md.szyman/32/9240_2.png) [@md.szyman](https://forum.inductiveautomation.com/u/md.szyman)\
**Post date:** [June 12, 2019, 3:48pm UTC](https://forum.inductiveautomation.com/t/side-by-side-perspective-pie-charts-labels-are-clipping-no-matter-what-i-try/25772/1 "2019-06-12T15:48:10Z")

</div>

I have this hierarchy in a Tab Container within my view. I have it set up so `FlexContainer_1` is a row and `FlexContainer_0` and `FlexContainer` (I apologize for the awful names) are columns within the row container.  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/2X/9/9b96ddadf17a6388fe2d2d5aa7e99c710ae48f1c.png)  
Inside each of these inner Flex Containers is a single pie chart. I’m trying to get the pie charts to display side-by-side but no matter what I do, some text from the labels is cut off from either side, like this:

![image](https://us1.discourse-cdn.com/inductiveautomation/original/2X/1/17ad3c9e8cf630ec761092d598ac437f360efe33.png)

It’s like the pie chart isn’t resizing itself properly within its container.

Is this a bug, or is there some option or style property I should be using that would fix my problem?

---

<div class="post-metadata">

**Author:** ![cmallonee](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/cmallonee/32/6416_2.png) [@cmallonee](https://forum.inductiveautomation.com/u/cmallonee)\
**Post date:** [June 12, 2019, 3:59pm UTC](https://forum.inductiveautomation.com/t/side-by-side-perspective-pie-charts-labels-are-clipping-no-matter-what-i-try/25772/2 "2019-06-12T15:59:04Z")

</div>

You could try setting `PieChart.position.shrink` to `0`. This should prevent the Pie charts from ever being smaller than their `position.basis` value.

You could also set`PieChart.props.style.overflow` to “visible”. This would allow the clipped text to display outside the boundaries of the Pie Chart component. Note that you would also need to apply this setting to the parent container, and then possibly the parent container’s parent, and on and on until the text is visible.

---

<div class="post-metadata">

**Author:** ![md.szyman](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/md.szyman/32/9240_2.png) [@md.szyman](https://forum.inductiveautomation.com/u/md.szyman)\
**Post date:** [June 12, 2019, 5:51pm UTC](https://forum.inductiveautomation.com/t/side-by-side-perspective-pie-charts-labels-are-clipping-no-matter-what-i-try/25772/3 "2019-06-12T17:51:47Z")

</div>

The first solution worked, thank you!