Home/ Questions/Q 7848789
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-02T18:19:56+00:00

My in-browser LED Display object has LED objects stored in it’s map property. Each

  • 0

My in-browser LED Display object has LED objects stored in it’s map property. Each LED has x and y properties so as to know where it is on canvas, while map is a 2D array of the LEDs (which can be of different sizes) that maps them on the Display matrix. The display object also has properties that define the LEDs’ area and the space between them.

The display should be able to show characters, such as numbers and letters, from a pre-made font.

What I can’t get my head around is: what is the best way to display characters? For example, here is an example of how the letter ‘S’ might look like (. is a LED display turned off, O is a LED display turned on:

..OO..
.OOOO.
OO..OO
OO....
.OO...
..OO..
...OO.
OO.OO.
.OOO..
..OO..

How should I map which LEDs are to be switched on?

My current solution is: create a Character object that has the properties x and y (which determine it’s place on the display matrix) and width and height (which determine it’s area in LEDs). The LEDs that are supposed to be on are then mapped in a 2D array. When we need to show a character, we get the Character‘s x and y, find the ‘source’ LED and then switch the LEDs on as mapped.

Is there a better way? Using paths, perhaps?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I’m not entirely sure from your description how you’re doing it, but here’s how I’d do it based on what I think you’re after.

    First step, get all your characters worked out in arrays defining which points need leds on or off. If this is going to be a big set you could try some techniques to compress the data.

    Depending on the size of your LEDs on the canvas I’d either create a function that calculates which leds need changing and only wipe the display where there are LEDs that need changing. Pre-render the LEDs (on and off state) once, like a display list in openGL (see link below).

    Otherwise if the characters themselves are quite small on the screen and there are lots of them I would pre-render each entire character and use like a font. This is would require much more clearing of the screen, but if there are hundreds of LEDs the overhead of calculation and display clearing might be high.

    This page has some good information about efficient canvas rendering:
    http://www.html5rocks.com/en/tutorials/canvas/performance/

    I’ve assumed the LED’s are rendered in the program and are not just images? If they’re just images then you have effectively pre-rendered the LED already.

    • 0