Jump to content

Turn your front panel into an interactive HTML5 site

Recommended Posts

Hi Hooovahh,

do you think normal that progressbars  work only as indicators? I tried to use them (a simple numeric slide) to simulate a scrollbar in an array indicator but it did not work. Even if configured as VALUE ONLY or VALUE AND VISIBILITY, the control did not respond to change requests, as if it was only an image…. When value was changed from LabVIEW side the change was read, instead.

My fault or something odd in the control behavior?

Thanks for your help

Link to comment

Hello everyone,

I made a very light update.

Up to now a background image to the front panel was not allowed.

I added this possibility by modifying the HTML generated by the HTML JS Template.vi file (attached below).

When the function "show border" is not enabled (if you want a border, maybe, you dislike to have a background image…) you might underimpress an image defined in the "bkgrnd dim" control. Size and filename are requested by this control. Of course, the image name must be expressed in html mode (considering the generated html file as root folder).

If someone wants to use this option must bring out the added control to the preferred main vi.

Hope it might be helpful

HTML JS Template.vi

Link to comment

Hello hoovahh,

the Force Update.Vi dosent support multiple Pages. i mean it will force the update in all webpages of the last VI been called


do you have any idea what could be causing the Problem.


best regards

Edited by K4zz
Link to comment
5 hours ago, Flavio Formica said:

do you think normal that progressbars  work only as indicators?

Nope, at the moment the progress bar is an indicator only.  It can be value only, which will use the web control made in javascript so the appearance will be slightly different, but there is no way at the moment to interact with it.  If you understand JS better than me, then you could probably add the control functionality.

As for the background image I've never had a need for that, but I can see that it might be useful.  One option might be to just place a 2D picture control behind all other controls on the front panel, and load it with an image.  It should default to Image Only mode, and if I did the Z order stuff properly it should work, but to be clear I never tried using that control.

Link to comment

Ok Hoovahh, I tried your solution several times but the z-order was not correct and the background image was displayed as top-most. More than that, I found that any image is displayed in a higher layer than any interactive control. For this reason I tried to work on HTML level and found that solution.

Unluckily I'm not so expert in JSs, so I'm not able to act at that level. Nevertheless, I will try to find where the z-order is set and change it. I'll let you know my progresses.


Link to comment
  • 2 years later...
On 13/12/2016 at 21:09, RayR said:

Modifiqué la segunda versión (pre-hooovahh) y la hice funcionar en una PC remota a través de la misma red.

Mi objetivo es hacer que algo como esto (o este código por ahora) funcione en un iPad o mejor, en una tableta Android. Cuando pruebo en un iPad, recibo un mensaje que dice que no puede abrir la página porque es un archivo local. La búsqueda en Internet no proporcionó soluciones. La tableta Android es peor, solo dice "archivo no encontrado".

¿Alguien ha intentado ejecutar el código html remoto en un dispositivo inteligente (tableta, teléfono, etc.)?



disculpa como hiciste para que funcione en una pc remota muchas gracias

Link to comment
On 14/12/2016 at 9:56, RayR said:

Gracias Hooovahh,

Lo tengo funcionando.  :)  Me perdí el paso para crear un enlace simbólico al archivo html.

No probé su última versión, ya que no estaba seguro de si todo lo que tenía que hacer era ejecutar Publish.vi. No pude encontrar su archivo Demo Html5.

Ahora exploraré el control del software usando este método. Será un experimento interesante.

Muchas gracias,


Buenas tardes podras poner un ejemplo, e intentado hacerlo pero sin resultado muchas gracias

Link to comment

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...

Important Information

By using this site, you agree to our Terms of Use.