I’ve been learning digital twin visualization for a while, and my first production goal was to create a free-flying camera in a digital twin visualization scene. Use the WSAD key to control the camera front, back, left and right movement, use the QE control camera up and down.
This function is relatively simple, the code is also at a glance, do not explain too much, directly on the code.
var app = new THING.App({ url: 'https://www.thingjs.com/static/models/storehouse' }); // App. on('load', function () {// Create Button new thing.widget. Button(' Add control ', add_control); Button(' Remove control ', remove_control); new thing.widget. Button(' Remove control ', remove_control); }); /** * add control */ var CTRL = null; function add_control() { if (! ctrl) { ctrl = app.addControl(new THING.FlyControl()); InitThingJsTip (" Control added successfully! <br> Keyboard W A S D control flight, Q E control lift "); Function remove_control() {if (CTRL) {app.removecontrol (CTRL); ctrl = null; InitThingJsTip (" This example shows the platform built-in keyboard control camera interaction control, add control can control the flight through the keyboard, qE control lifting, click the left button for experience "); }}Copy the code
Not just for cameras, but also for digital twin visualizations.
The method I adopted was to use the built-in keyboard of the platform to control the interactive controls of the camera. After adding the controls, I could control the flight through the keyboard, and control the rise and fall through the keyboard. Clicking the button on the left would trigger the THING. The camera can fly freely by simply adding controls. Beginners like me who are new to digital twin visualization can try it out.
— — — — — — — — –
Digital Twin visualization: www.thingjs.com/