# Change Alignment of LED Display

**URL:** <https://forum.inductiveautomation.com/t/change-alignment-of-led-display/54742>\
**Category:** Ignition\
**Created:** [January 6, 2022, 6:05pm UTC](https://forum.inductiveautomation.com/t/change-alignment-of-led-display/54742 "2022-01-06T18:05:06Z")\
**Posts on this page:** 12\
**Page:** 1

<div class="post-metadata">

**Author:** ![Brit](https://avatars.discourse-cdn.com/v4/letter/b/c0e974/32.png) [@Brit](https://forum.inductiveautomation.com/u/Brit)\
**Post date:** [January 6, 2022, 6:05pm UTC](https://forum.inductiveautomation.com/t/change-alignment-of-led-display/54742/1 "2022-01-06T18:05:06Z")

</div>

Hi, I’m working on a project in Perspective and I was wondering if there is a way to display an LED Display on the left side of the field instead of the right?  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/6/1/61a76e85255d7296e2dde8d0b51ec2e674c7b779.png)

---

<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:** [January 6, 2022, 9:03pm UTC](https://forum.inductiveautomation.com/t/change-alignment-of-led-display/54742/2 "2022-01-06T21:03:17Z")

</div>

I played around with it for a few minutes but couldn’t find a way. You can’t even reduce it to a single digit to stitch four together.

But I’m wondering why in 2022 you are trying to make a web HMI look like something from 40 years ago?

---

<div class="post-metadata">

**Author:** ![paul-griffith](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/paul-griffith/32/37249_2.png) [@paul-griffith](https://forum.inductiveautomation.com/u/paul-griffith)\
**Post date:** [January 6, 2022, 10:40pm UTC](https://forum.inductiveautomation.com/t/change-alignment-of-led-display/54742/3 "2022-01-06T22:40:33Z")

</div>

I don’t see anything obvious. The LED display is a manually generated SVG file, so most CSS styling you can apply is irrelevant.

---

<div class="post-metadata">

**Author:** ![AlThePal](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/althepal/32/3603_2.png) [@AlThePal](https://forum.inductiveautomation.com/u/AlThePal)\
**Post date:** [January 13, 2022, 5:58pm UTC](https://forum.inductiveautomation.com/t/change-alignment-of-led-display/54742/4 "2022-01-13T17:58:51Z")

</div>

Because this is what the customer wants? We are replacing a Vision system with Perspective for a customer who wants it to look the same as the previous one. I would like to be able to centre the characters in the LED display.

---

<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:** [January 13, 2022, 7:34pm UTC](https://forum.inductiveautomation.com/t/change-alignment-of-led-display/54742/5 "2022-01-13T19:34:57Z")

</div>

OK, but LED displays would (and numerical values should) always be right aligned so they line up by units, tens, etc. By the way, your question says left-aligned and your reply says centre-aligned.

---

<div class="post-metadata">

**Author:** ![AlThePal](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/althepal/32/3603_2.png) [@AlThePal](https://forum.inductiveautomation.com/u/AlThePal)\
**Post date:** [January 13, 2022, 8:29pm UTC](https://forum.inductiveautomation.com/t/change-alignment-of-led-display/54742/6 "2022-01-13T20:29:29Z")

</div>

Thankfully I’m allowed to want something different from the OP (by the way).

---

<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:** [January 13, 2022, 8:42pm UTC](https://forum.inductiveautomation.com/t/change-alignment-of-led-display/54742/7 "2022-01-13T20:42:59Z")

</div>

Could a similar result be achieved by using a label with a a digital-7 font and a custom theme instead of the LED display component?

---

<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:** [January 13, 2022, 9:42pm UTC](https://forum.inductiveautomation.com/t/change-alignment-of-led-display/54742/8 "2022-01-13T21:42:54Z")

</div>

It can be done, but it’s very complicated and fairly resource intensive.  
 ![Screen Shot 2022-01-13 at 1.38.33 PM](https://us1.discourse-cdn.com/inductiveautomation/original/3X/9/2/92d98a4b3ab2ecf9799373f4f366494304010017.png)  
My solution included the use of a View Canvas, where the instances array is bound to a numeric value. That value is dissected in a transform, and each digit is split into a separate instance (and spatially offset) and passed along as a parameter to a View which expects just a single digit. So what you actually see in that screenshot is a functional LED Display comprised of 8 instances of a View (7 characters + 1 additional render to fill out black space to the right).

The same approach could fairly easily be modified to “center” the value.

---

<div class="post-metadata">

**Author:** ![zacharyw.larson](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/zacharyw.larson/32/23749_2.png) [@zacharyw.larson](https://forum.inductiveautomation.com/u/zacharyw.larson)\
**Post date:** [January 14, 2022, 1:31pm UTC](https://forum.inductiveautomation.com/t/change-alignment-of-led-display/54742/9 "2022-01-14T13:31:23Z")

</div>

could upload images of the numbers

then use a transform to get the images

Might be a little less resource intense, but still a lot of work

since you make the images, you can control the location

---

<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:** [January 14, 2022, 3:44pm UTC](https://forum.inductiveautomation.com/t/change-alignment-of-led-display/54742/10 "2022-01-14T15:44:19Z")

</div>

That’s actually even more resource intensive, and it’s also limited in how you can style it. You’d be hard-pressed to change the color of the numbers or their background, whereas the View Canvas route allows for the same visual options as an LED Display. You can also use the Meta tooltip because you can apply it to the View Canvas instead of the individual digits.

---

<div class="post-metadata">

**Author:** ![zacharyw.larson](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/zacharyw.larson/32/23749_2.png) [@zacharyw.larson](https://forum.inductiveautomation.com/u/zacharyw.larson)\
**Post date:** [January 14, 2022, 3:58pm UTC](https://forum.inductiveautomation.com/t/change-alignment-of-led-display/54742/11 "2022-01-14T15:58:44Z")

</div>

ah, my knee jerk reaction was that was not good  
I think you mean that the way of using the canvas view is just less resource intense.  
You don’t mean that pulling images is resource intense?

that is not good

I thought pulling images would be less resource intensive.  
I have been doing that on some pages for self diagnosis to show where issues are located at on big machines for operators.

---

<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:** [January 14, 2022, 4:08pm UTC](https://forum.inductiveautomation.com/t/change-alignment-of-led-display/54742/12 "2022-01-14T16:08:57Z")

</div>

I don’t think the images would be cached (maybe they would), so each time you update the number you would be re-obtaining the images. This is not only additional bandwidth used, but that’s a lot of additional load on the Gateway. You’d also need to store those (small) files either in a DB or as WebDev resources; they’re small enough it’s not a big impact, but you’re looking at 12 files (0-9, “,”, “.”) as opposed to the two files used for the View Canvas approach (“component” view and the “instanced digit” view).
