WebVI Examples for LabVIEW NXG Web Module
This repository has examples for:
LabVIEW NXG 3.0 Web Module
For previous LabVIEW NXG versions see the previous releases
The following examples demonstrate different ways of using WebVIs. Each directory contains example code and a readme explaining the example. If you have any questions or problems related to these examples, post on this GitHub repository's issues page.
Call 3rd Party Web Service
On the panel, this WebVI displays a summary of the results in a data grid and a map of the selected earthquake region in a URL Image indicator.
Call LabVIEW Web Service
Note: The Call LabVIEW Web Service demo requires the included LabVIEW Web Service to be running locally on your machine
This example demonstrates how to create a WebVI that makes requests to a LabVIEW web service, and how to create a LabVIEW 2016 web service that can respond to requests from a WebVI.
Customize WebVI with CSS
This example demonstrates how to customize the HTML output of a WebVI using CSS.
One of the main parts of a WebVI is an HTML output that displays HTML5 Custom Elements. One of the advantages of using CSS in a web application is to the separate content from style. For example, you could create a custom CSS file that is shared across the organization or even among other users to build more and more styles and layouts.
Embed Content into a WebVI
This example demonstrates how to embed custom web content into the WebVI panel using LabVIEW NXG. WebVIs use HTML to define and describe the content of the panel that is loaded in a web page. This means that you can add custom HTML content to appear alongside the LabVIEW-generated HTML.
Embed a WebVI into Web Content
This example demonstrates how to embed the output of a WebVI built using LabVIEW NXG into an static web page.
The build output of a WebVI includes three basic parts:
- HTML5 custom elements
- Compiled WebVI diagram (
Because WebVIs share the same basic building blocks as other web pages, you can embed WebVI output into any web content.
Incorporate User Resource into WebVI
You can also use resource files to augment the WebVI's capabilities. For example, you can add other HTML widgets or scripts and reference them in the HTML view of the WebVI.
On the panel, this WebVI has X and Y binary inputs. The user clicks these to change the numerical values of the inputs. The Outputs of X+Y and X*Y are updated with binary and numerical indicators.
Connect WebVI to WebSocket Echo Server
On the diagram, this WebVI uses JSLI VIs to open a connection to the echo server, send messages, read received messages, close the connection and log debug information to the browser console. The WebVI also formats sent and received strings to display on the Messages indicator.
Multiple Top-Level WebVIs
This example demonstrates how to create a web application with multiple pages by using multiple top-level WebVIs and Hyperlink controls to link between them. When you build the web application, each top-level WebVI generates a separate HTML file with links to the other HTML files that are generated.
User Event Generation
This example demonstrates the use of the User Event nodes to implement a user interaction recorder.
- Run the VI.
- Drag the value of the Slider control around for a few seconds.
- Click the Playback button. The exact sequence of drags that you performed will be repeated on the Slider and displayed in the Movement Data graph.
- Click Stop to stop the VI.
Call SystemLink Data Services
This example demonstrates how to use a WebVI to communicate over networks with SystemLink Tags. The example also shows how code can be shared between WebVIs and GVIs using a library. On the diagram, this WebVI utilizes a state machine to determine when to read/write tags and when to connect to a server. On the panel, this example has fields to enter the server, username, and password. It also has a tab control that determines the visible view as well as the state in the state machine.