# Remove Empty space below XY Chart

**URL:** <https://forum.inductiveautomation.com/t/remove-empty-space-below-xy-chart/50322>\
**Category:** Ignition\
**Tags:** perspective, ignition81\
**Created:** [August 26, 2021, 11:23am UTC](https://forum.inductiveautomation.com/t/remove-empty-space-below-xy-chart/50322 "2021-08-26T11:23:23Z")\
**Posts on this page:** 12\
**Page:** 1

<div class="post-metadata">

**Author:** ![liam1](https://avatars.discourse-cdn.com/v4/letter/l/e68b1a/32.png) [@liam1](https://forum.inductiveautomation.com/u/liam1)\
**Post date:** [August 26, 2021, 11:23am UTC](https://forum.inductiveautomation.com/t/remove-empty-space-below-xy-chart/50322/1 "2021-08-26T11:23:23Z")

</div>

Is it possible to remove reduce the empty space below the XY chart if you have legends disbabled?

![area](https://us1.discourse-cdn.com/inductiveautomation/original/3X/e/6/e6c172aea6d570c6f0c547d1445587b7ca809e65.png)

---

<div class="post-metadata">

**Author:** ![richardNZ15](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/richardnz15/32/33373_2.png) [@richardNZ15](https://forum.inductiveautomation.com/u/richardNZ15)\
**Post date:** [April 3, 2022, 10:26pm UTC](https://forum.inductiveautomation.com/t/remove-empty-space-below-xy-chart/50322/2 "2022-04-03T22:26:31Z")

</div>

Would also love to do this. Any Java guru’s that might be able to help with accessing some hidden property of the swing library?

---

<div class="post-metadata">

**Author:** ![josborn](https://avatars.discourse-cdn.com/v4/letter/j/4bbf92/32.png) [@josborn](https://forum.inductiveautomation.com/u/josborn)\
**Post date:** [April 4, 2022, 2:15am UTC](https://forum.inductiveautomation.com/t/remove-empty-space-below-xy-chart/50322/3 "2022-04-04T02:15:00Z")

</div>

What version are you on? I’m on 8.1.13 and am not seeing this issue, the chart auto sizes if you disable the legend.

---

<div class="post-metadata">

**Author:** ![victordcq](https://avatars.discourse-cdn.com/v4/letter/v/f6c823/32.png) [@victordcq](https://forum.inductiveautomation.com/u/victordcq)\
**Post date:** [April 4, 2022, 6:55am UTC](https://forum.inductiveautomation.com/t/remove-empty-space-below-xy-chart/50322/4 "2022-04-04T06:55:26Z")

</div>

> [@richardNZ15](#):
>
> Java g

the tag in this post in perspective, but the java swing is vision, wich are you using?

---

<div class="post-metadata">

**Author:** ![richardNZ15](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/richardnz15/32/33373_2.png) [@richardNZ15](https://forum.inductiveautomation.com/u/richardNZ15)\
**Post date:** [April 4, 2022, 9:51pm UTC](https://forum.inductiveautomation.com/t/remove-empty-space-below-xy-chart/50322/5 "2022-04-04T21:51:46Z")

</div>

On version 8.1.14. Sorry i didn’t really mean the Java Swing library, i just wondered if there is anything under the hood that can be tweaked.  
I’m also trying to do this in Perspective.

See below, no changes when toggling legend.enabled true/false.  
Top chart is being modified

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/6/0/60a0c354d829f46f0470db2e80a9954693253290.png)

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/d/b/db769569bf859b496542ec0abe8c231ad1286a18.png)

---

<div class="post-metadata">

**Author:** ![victordcq](https://avatars.discourse-cdn.com/v4/letter/v/f6c823/32.png) [@victordcq](https://forum.inductiveautomation.com/u/victordcq)\
**Post date:** [April 5, 2022, 6:56am UTC](https://forum.inductiveautomation.com/t/remove-empty-space-below-xy-chart/50322/6 "2022-04-05T06:56:10Z")

</div>

i dont have that, can you send your table over?

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/2/d/2d7c0bfbd3025ad8dc5953255bc457a853231c17.png)

---

<div class="post-metadata">

**Author:** ![richardNZ15](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/richardnz15/32/33373_2.png) [@richardNZ15](https://forum.inductiveautomation.com/u/richardNZ15)\
**Post date:** [April 5, 2022, 7:24am UTC](https://forum.inductiveautomation.com/t/remove-empty-space-below-xy-chart/50322/7 "2022-04-05T07:24:10Z")

</div>

I think it is actually not the Legend that is the issue here, but the X-Axis.  
Even with the X-Axis set to visible = False, it still holds that white space for it.

Just tried that with a brand new chart. Same result. I actually need two X-Axis, but i don’t necessarily want to show either of them. Still it holds white space for them.

---

<div class="post-metadata">

**Author:** ![victordcq](https://avatars.discourse-cdn.com/v4/letter/v/f6c823/32.png) [@victordcq](https://forum.inductiveautomation.com/u/victordcq)\
**Post date:** [April 5, 2022, 7:52am UTC](https://forum.inductiveautomation.com/t/remove-empty-space-below-xy-chart/50322/8 "2022-04-05T07:52:37Z")

</div>

While it might be possible its going to be to much work to make it dynamic.

The size of the chart and labels is coded by javascript and attributes. While it might be possible to put on some transforms on the correct things… its going to be a lot of work and not dynamic if you resize the chart at all.

if you dont mind the text being stretched a bit, this one isnt to much work, idk if its very dynamic though:

```auto
.psc-YOURCLASSNAME > div > div:nth-child(2) > svg > g > g:nth-child(2) > g:nth-child(1) > g:nth-child(2) > g:nth-child(3) > g > g > g > g:nth-child(1) > g{
  transform: scale(1, 1.18);
}

```

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/0/3/032bdfb6e1bb74a3e90e5b465cd4df79219c76f5.png)

---

<div class="post-metadata">

**Author:** ![richardNZ15](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/richardnz15/32/33373_2.png) [@richardNZ15](https://forum.inductiveautomation.com/u/richardNZ15)\
**Post date:** [April 6, 2022, 5:01am UTC](https://forum.inductiveautomation.com/t/remove-empty-space-below-xy-chart/50322/9 "2022-04-06T05:01:40Z")

</div>

Thank you for the response. I’m not sure i know how to implement this though. And it may be quite a problem that it isn’t dynamic with responsive design, considering we are trying to make this work on flex views that will try to fill the size of the viewport.

I would have thought this is something Ignition should be sorting. But probably won’t happen until they upgrade their charts entirely.

---

<div class="post-metadata">

**Author:** ![victordcq](https://avatars.discourse-cdn.com/v4/letter/v/f6c823/32.png) [@victordcq](https://forum.inductiveautomation.com/u/victordcq)\
**Post date:** [April 6, 2022, 7:01am UTC](https://forum.inductiveautomation.com/t/remove-empty-space-below-xy-chart/50322/10 "2022-04-06T07:01:29Z")

</div>

You can implement this with css theme or css injection.  
I have made plenty of examples on the forum

i havent tested the responsiveness

But yea this is probably something for ignition to handle

---

<div class="post-metadata">

**Author:** ![pascal.fragnoud](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pascal.fragnoud/32/24728_2.png) [@pascal.fragnoud](https://forum.inductiveautomation.com/u/pascal.fragnoud)\
**Post date:** [April 6, 2022, 7:45pm UTC](https://forum.inductiveautomation.com/t/remove-empty-space-below-xy-chart/50322/11 "2022-04-06T19:45:36Z")

</div>

> [@victordcq](#):
>
> `.psc-YOURCLASSNAME > div > div:nth-child(2) > svg > g > g:nth-child(2) > g:nth-child(1) > g:nth-child(2) > g:nth-child(3) > g > g > g > g:nth-child(1) > g`

jesus

---

<div class="post-metadata">

**Author:** ![victordcq](https://avatars.discourse-cdn.com/v4/letter/v/f6c823/32.png) [@victordcq](https://forum.inductiveautomation.com/u/victordcq)\
**Post date:** [April 7, 2022, 6:55am UTC](https://forum.inductiveautomation.com/t/remove-empty-space-below-xy-chart/50322/12 "2022-04-07T06:55:12Z")

</div>

look at this one lol

> [@Css to change datepicker calender to be mon-\>sun instead of sun-\>sat](https://forum.inductiveautomation.com/t/css-to-change-datepicker-calender-to-be-mon-sun-instead-of-sun-sat/48943):
>
> For those who want it, here is the magic! its not perfect but eh: [image] for theme.css .iaDateRangePicker .calendarBar { grid-template-columns: none; } .calendarBar \> div:nth-child(1) { grid-area: 1/8/1/8 !important; } .iaDateRangePicker .calendar{grid-template-columns: none;} .calendar \> div[style$="2;"]{ grid-column-start: 8 !important; grid-column-end: 8 !important;}.calendar \> div[style^="grid-area: 1"]{ grid-row-start: 2 !important;}.calendar \> div[style^="grid-area: 2"]{ grid-row-start…
