# Moving controls of Map

**URL:** <https://forum.inductiveautomation.com/t/moving-controls-of-map/81900>\
**Category:** Ignition\
**Tags:** ignition81, perspective\
**Created:** [November 14, 2023, 9:47pm UTC](https://forum.inductiveautomation.com/t/moving-controls-of-map/81900 "2023-11-14T21:47:00Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![scadafan](https://avatars.discourse-cdn.com/v4/letter/s/90db22/32.png) [@scadafan](https://forum.inductiveautomation.com/u/scadafan)\
**Post date:** [November 14, 2023, 9:47pm UTC](https://forum.inductiveautomation.com/t/moving-controls-of-map/81900/1 "2023-11-14T21:47:00Z")

</div>

Hi all,

I have a rather simple question but I can't find a solution. I have a map on a dashboard but the way its fit on there the + / - controls are cut off. I am wondering if there is anyway to move the controls?

---

<div class="post-metadata">

**Author:** ![scadafan](https://avatars.discourse-cdn.com/v4/letter/s/90db22/32.png) [@scadafan](https://forum.inductiveautomation.com/u/scadafan)\
**Post date:** [November 16, 2023, 5:58am UTC](https://forum.inductiveautomation.com/t/moving-controls-of-map/81900/2 "2023-11-16T05:58:45Z")

</div>

I have tried using a coordinate container and flex container and still can't figure it out. If anyone has any idea that would be great.

---

<div class="post-metadata">

**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\
**Post date:** [November 16, 2023, 9:44am UTC](https://forum.inductiveautomation.com/t/moving-controls-of-map/81900/3 "2023-11-16T09:44:10Z")

</div>

The +/- controls are on the top left so I would expect them to show up unless you have an incorrect justification setting. Things to try:

- Set justification to Flex Start.  
`position.grow : 1`  
`position.shrink : 1`  
`basis : auto`

---

<div class="post-metadata">

**Author:** ![scadafan](https://avatars.discourse-cdn.com/v4/letter/s/90db22/32.png) [@scadafan](https://forum.inductiveautomation.com/u/scadafan)\
**Post date:** [November 16, 2023, 5:21pm UTC](https://forum.inductiveautomation.com/t/moving-controls-of-map/81900/4 "2023-11-16T17:21:55Z")

</div>

When I create a new map the controls are on the bottom left and no matter what I do the controls look fine on that view but when I bring it into a dashboard they cut off at the bottom

---

<div class="post-metadata">

**Author:** ![jlandwerlen](https://avatars.discourse-cdn.com/v4/letter/j/bc8723/32.png) [@jlandwerlen](https://forum.inductiveautomation.com/u/jlandwerlen)\
**Post date:** [November 16, 2023, 5:32pm UTC](https://forum.inductiveautomation.com/t/moving-controls-of-map/81900/5 "2023-11-16T17:32:54Z")

</div>

If you can share your files perhaps someone could take a look for you.

---

<div class="post-metadata">

**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\
**Post date:** [November 16, 2023, 5:40pm UTC](https://forum.inductiveautomation.com/t/moving-controls-of-map/81900/6 "2023-11-16T17:40:30Z")

</div>

> [@scadafan](#):
>
> ... when I bring it into a dashboard ...

You need to be more precise in your description. Do you mean that in an Embedded View component the map view is cropped?

> [@scadafan](#):
>
> When I create a new map the controls are on the bottom left ,,,

I don't know how this is happening. There is no setting to change the position of the zoom controls.

[https://docs.inductiveautomation.com/display/DOC81/Perspective+-+Map](https://docs.inductiveautomation.com/display/DOC81/Perspective+-+Map)

---

<div class="post-metadata">

**Author:** ![scadafan](https://avatars.discourse-cdn.com/v4/letter/s/90db22/32.png) [@scadafan](https://forum.inductiveautomation.com/u/scadafan)\
**Post date:** [November 16, 2023, 5:45pm UTC](https://forum.inductiveautomation.com/t/moving-controls-of-map/81900/7 "2023-11-16T17:45:21Z")

</div>

![Map](https://us1.discourse-cdn.com/inductiveautomation/original/3X/c/d/cd3e92094d8cc797b58f4ab009cf7d286624e508.png)  
Here is a screenshot of my map. Its a brand new map no settings have changes. The controls are on the bottom left.

I have a dashboard component and on it I have 5 widgets. One of them being this map. However, unless I make the map take up half the dashboard area the controls get cut off as seen in the next picture.  
 ![DashboardMap](https://us1.discourse-cdn.com/inductiveautomation/original/3X/d/f/df50dc730c384c4863d599add7a19d3113e45eb5.png)

Hoping this makes more sense now

---

<div class="post-metadata">

**Author:** ![Transistor](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/transistor/32/3380_2.png) [@Transistor](https://forum.inductiveautomation.com/u/Transistor)\
**Post date:** [November 16, 2023, 6:00pm UTC](https://forum.inductiveautomation.com/t/moving-controls-of-map/81900/8 "2023-11-16T18:00:12Z")

</div>

Try launching it in your browser and use the Developer Tools (usually F12) to inspect the controls. I can see that they are using a series of classes called "leaflet".

Check your Project Browser, Styles section and make sure that you haven't got an override setting in the Advanced Stylesheet (stylesheet.css). Another possibility is that you are inheriting some properties from another project. (Are you working as part of a team?)

---

<div class="post-metadata">

**Author:** ![scadafan](https://avatars.discourse-cdn.com/v4/letter/s/90db22/32.png) [@scadafan](https://forum.inductiveautomation.com/u/scadafan)\
**Post date:** [November 16, 2023, 6:12pm UTC](https://forum.inductiveautomation.com/t/moving-controls-of-map/81900/9 "2023-11-16T18:12:14Z")

</div>

Wow you were right that is what it is. I knew it was something simple thank you.
