@viewar/webview v1.1.0
ViewAR WebView
With this package you can include a ViewAR web app into your custom website with JavaScript or TypeScript. It handles the app's setup and communication from/to the app.
There are two basic concepts:
- external parameters
- external command
External parameters are used to pass data from the website into the ViewAR app.
External commands are used to pass data from the ViewAR app to the website.
Sample Usage
- Create a new Web app.
import { WebView } from "@viewar/webview";
const parent = document.getElementById("parent");
const app = new WebView(parent, "com.viewar.industrial");
- Listen for external commands
External commands are triggered inside the app with viewarApi.coreInterface.call("externalCommand", "sampleCommand", data)
.
const commandName = "sampleCommand";
// Subscribe to "sampleCommand".
const subscription = app.getCommand(commandName).subscribe((data) => {
console.log("Sample command received", data);
});
// Unsubscribe (code cleanup).
subscription.unsubscribe();
The getCommand
method returns an RxJS Subject (for further information see https://rxjs-dev.firebaseapp.com/guide/subject).
- Set external parameters
External parameters can be accessed within the app with viewarApi.coreInterface.call("getExternalParams")
. In addition, viewarApi.coreInterface
emits an event externalParamsReceived
.
const data = {
sample: "data1"
};
app.setParams(data);
To set external params right from the app start, use additional options in WebView constructor.
const data = {
sample: "data1"
};
const app = new WebView(parent, "com.viewar.industrial", {
params: data
});
4 years ago