Visit webvi.io    What are WebVIs    Download    Contribute Awesome WebVIs

Awesome WebVIs

A curated list of awesome WebVIs and resources for making awesome free-range organic WebVIs 🤘.

Contents

• What are WebVIs
• Latest News
• Documentation
• Add-Ons
• Tutorials
• Presentations
• Just for Fun
• Spotted in the Wild
• Experimental
• Non-English Resources

What are WebVIs

WebVIs are web applications created using the LabVIEW NXG Web Module 🧙‍♂️.

WebVIs build standalone HTML + JS + CSS webpages that can acquire data (usually from a web service), do some analysis, and present the data in scientific and engineering web controls. The Web Module allows you to use LabVIEW graphical programming to create web applications.

Find out more at webvi.io or on NI's What is the LabVIEW NXG Web Module? page.

Latest News

• LabVIEW NXG Web Module 5.1 New Features and Changes - LabVIEW NXG and Web Module 5.1 released.
• Future of the LabVIEW NXG Web Module - Web Module and WebVIs to become a stand-alone product and continue development after the end of NXG.

Documentation

Documentation and examples provided by National Instruments 🦅.

Examples

• Call 3rd Party Web Service - Acquire data from the US Geological Survey Earthquake API and present in a WebVI. Demo.
• Call JavaScript From a WebVI - Create a JavaScript Library Interface (JSLI) document to interact with JS in a page. Demo.
• Call LabVIEW Web Service - Acquire data with a LabVIEW Web Service to share with a WebVI. Demo.
• Call SystemLink Data Services - Communication with high-level tags, messages, and file APIs included with LabVIEW NXG Web Module. Demo.
• Connect WebVI to WebSocket Echo Server - Stream data to WebVIs with WebSockets. Demo.
• Customize WebVI with CSS - Advanced customization of a WebVI's style with CSS. Demo.
• Embed Content into a WebVI - Add custom HTML to a WebVI. Demo.
• Incorporate User Resource into WebVI - Add resource files such as images, CSS files, JavaScript files, and HTML files to your web application. Demo.
• Multiple Top-Level WebVIs - Create a web application with multiple pages linked together. Demo.
• SystemLink Web Interface Template - Create custom tiles for WebVIs on the NI Web Server landing page. Forum post describing configuration.

Manuals

• LabVIEW NXG Web Module - Creating, building, and hosting WebVIs.
  • Communicating Data with Web Services Using WebVIs
  • Hosting WebVIs - NI Web Server, LabVIEW Web Service, and SystemLink Cloud.
• SystemLink Cloud - Cloud service from NI to securely make WebVIs available on the internet.
• HTTP Nodes - LabVIEW HTTP Nodes documentation with important compatibility notes for WebVIs (Web Server target).

Training

• Getting Started with LabVIEW NXG Community Edition - Course introducing LabVIEW NXG Community and instructions for building and publishing your first WebVI. Requires access to LabVIEW NXG Community (free).
• Build a Web App for Your Test System in 30 Minutes - Course showing how to web-enable an existing LabVIEW test system with LabVIEW NXG Web Module and SystemLink Cloud. Registration required (free).
• Creating Web Applications Using LabVIEW NXG - Online training course introducing WebVIs and guiding you through creation and publishing of a WebVI. Requires SSP.

Forums

• Example Code - Examples tagged as LabVIEW NXG Web Module in the NI Example Code forum.

Videos

• LabVIEW NXG: Getting started with Web VIs - Introduction to the WebVI editing experience in NXG 2.

Add-Ons

Libraries from the community to add new capabilities to WebVIs 🧩.

• Debug Tools for WebVI - Advanced debugging tools for WebVIs. Includes the Debug Log VI to enable logging arbitrary values to the console. See bit.ly/debugtools.
• ECharts - 2D and 3D charting libraries. Demo.
• File for WebVI - Open, modify, and download files from the browser. Capture and preview images using the Uppy library. Demo.
• Maps for WebVI - Interactive maps and markers. Google Maps and Leaflet + Open Street Maps examples. Demo.
• Rich Text - Different rich text editor examples. Demos for CKEditor, Quill, and Trix.
• Custom Popup Dialogs for WebVI - Highly configurable modal dialogs. Demo.

Tutorials

Tutorials, blogs, hands-ons, social media, and articles on WebVIs 📰.

Articles

• Boring Engineer: Web Monitor and Control application using NI SystemLink APIs - WebVIs + SystemLink APIS for monitoring. October 2019.
• TestStand Executor - WebVIs + SystemLink to remotely execute TestStand sequences. October 2019.
• SystemLink file browser - Use SystemLink jobs to read a file in a WebVI from a RT target. Community. September 2019.
• Hands-on: Create Web-Ready User Interfaces with the LabVIEW NXG Web Module - Create WebVIs that communicate with LabVIEW applications. NIWeek May 2019.
• Boring Engineer: NI Web Technology: Monitor and Control Systems - WebVIs + LabVIEW Web Services for monitoring. July 2018.
• Boring Engineer: NXG WebVI: How to access and embed web service and resources - Embed images, iframes, and use HTTP with web services. July 2018.
• Boring Engineer: NXG WebVI : Develop, Deploy and Host a Simple Web Game - Learn the basics of making WebVIs by creating a math game! July 2018.
• Latest enhancements to LabVIEW NXG include WebVI, expanded instrument coverage - WebVIs are here! January 2018.
• First WebVI Prototype - The first Hello World! of WebVIs. Demo. May 2013.

Social media

• @wimtormans on twitter - "Finally had some time to do some work on my hobby project. Indoor monitoring with #LabVIEW on a #RaspberryPi and visualize the data with a #LabVIEWNXG #WebVI on a #SystemLink server… Everything is running at the @VI_Technologies offices :-)" - WebVIs on Raspberry Pis! Source. May 2019.
• @rajsite on twitter - "THE #WebVI IS NOW OFFICIALLY RELEASED IN LabVIEW NXG 2 WEB MODULE! WE MADE A THING, USE IT TO MAKE SOME TOO! @NIglobal @LabVIEW #LabVIEW #NXG" - WebVIs released! 🎉. January 2018.
• @rajsite on twitter - "LabVIEW running in a browser with the #WebVI and LabVIEW NXG 2 Beta! #LabVIEW #NIWeek #NIWeek2017" - NI showing WebVIs as would first be available in the NXG 2.0 beta. NIWeek May 2017.
• @rajsite on twitter - "A glimpse into the future! 🔮✨ #WebVI @LabVIEW #NIWeek2016 #NIWeek" - NI first teasing WebVI technology. NIWeek August 2016.

Presentations

Presentations about WebVIs from NIWeek, LabVIEW User Groups, and the community 🗣.

• NXG WebVIs and SystemLink Tags​ - Working with Symation to make a tablet UI to communicate with a PLC and other instruments. October 2019.
• Creating Powerful Web Apps With the LabVIEW NXG Web Module - Matthias details creating a sophisticated web application with a responsive UI, user login, and database backend. Studio Bods. NIWeek May 2019.
• Customizing Your WebVIs - Darin and Milan follow-up the NIWeek 2018 presentation talking about styling WebVIs and creating Add-On libraries with the JSLI. Community page. NIWeek May 2019.
• Using LabVIEW NXG Web Technologies to Enhance Existing Applications - Rita introduces WebVIs and shows communication techniques and Matthias introduces creating web applications backed by databases. LabVIEW Wiki. NIWeek May 2019.
• LabVIEW NXG web module Remote server client - Creating a WebVI, setting up the NI Web Server, testing, and deploying a WebVI. June 2018.
• Styling and Customizing WebVIs - Mark and Milan go over common styling scenarios, a deep dive using devtools to style WebVIs, and tease the future of the JSLI document. NIWeek May 2018.
• Creating Web Enabled HMIs with LabVIEW NXG - WebVI demonstration by Omid, Mark, and Eli. NIWeek May 2017.

Just for Fun

Games and other fun WebVIs you can play right away in the browser 🕹.

• Avalanche 🌠 - Dodge the shooting stars. Source.
• Cyclone 🌀 - Use your reflexes to land on the cyclone. Homepage.
• Dr. Emoji 💊 - Save the animals by matching their hearts ❤💙💛. Source.

• Fire 🔥 - The PSX Doom fire animation ported to HTML 5 to LabVIEW to LabVIEW NXG to WebVIs. Source.
• Nibbles 🐍💡 - Snake made out of LEDs. Facebook post.
• Reflex tester 👉 - Test your reflexes. Source.
• Snake 🐍 - Snake with extra steps. Source.
• T-Rex 🦖 - Your favorite offline dinosaur game made online.

Spotted in the Wild

Screenshots and videos of WebVIs being used inconspicuously in the wild 🔍.

• DAM Group Leak Test Platform @ 2:13 - Looks like the NXG 2 button border style. Not running in a normal browser. Awesome music.
  Rating ⭐⭐⭐⭐⭐.
• GCentral - The GCentral Package Search tool is a WebVI. A sophisticated LabVIEW Web Service backend with user authentication, database storage, and a WebVI frontend. Source.
  Rating ⭐⭐⭐⭐⭐.

Discover WebVIs on GitHub using the webvi GitHub topic, find WebVI source by searching for the gviweb file extension, or find built WebVIs with a clever search.

If you find a built WebVI on GitHub you can also use an online tool like githack.com to quickly preview and run the built WebVI in your browser.

Experimental

Crazy experiments that try to push WebVIs to their limits 🧪.

• FFTDemo - Historical experiment using analysis functions in WebVIs.
• WebVINode - Create Node.js server and desktop applications from WebVIs. Demo.

Non-English Resources

Awesome WebVI resources in non-english languages 🌐.

• LabVIEW NXG Web Module Training Slide (Japanese)
• Réaliser des applications Web avec LabVIEW (CG & NXG) pour publier vos données
• Simuladores - Departamento de Ingeniería Eléctrica - Universidad de Valladolid
  • Corriente Alterna
  • Transitorios eléctricos
  • Máquina asíncrona
  • Teorema de Ferraris
  • Transformadores eléctricos
• NIが提供する新しい遠隔監視ツール 「SystemLink」を学ぼう
• LabView NXG si aggiorna: arrivano i WebVI