WdpApi is a set of cloud rendering and front-end display application programming interfaces (API) developed by JavaScript. On the basis of the 51world rendering platform, the client 3D scene is embedded in the web page in the form of video stream. Users can overlay their own data components and interact with the scene in both directions. WdpApi is compatible with current mainstream JavaScript front-end frameworks, providing fast and convenient development interfaces for front-end developers.
The wdpapi platform based on the full factor scene makes the development of 3D scenes so easy!
To check out and docs, visit wdpapi.51aes.com
$ npm i wdpapi
import WdpApi from 'wdpapi';
const config = {
"id": "player", //[required] Render scene container(DOM node id)
"url": "http://172.31.19.235:8889", //[optional] Cloud rendering service address
"order": "b96285A3", //[optional] Rendering order, obtained on the cloud rendering client
"resolution": [3840,2160], //[optional] Set the cloud rendering output resolution[width, height]
"debugMode": "normal", //[optional] none: does not print logs, normal: normal logs
"keyboard": { //[optional] keyboard event
"normal": false, //[optional] Keyboard event, exclude F1~F12 [default disabled]
"func": false //[optional] Browser F1 ~ F12 function keys [default disabled]
}
}
const App = new WdpApi(config);
const newargs = {
"url": "Your Server URL",
"order": "Code",
"resolution": [3840,2160]
}
App.System.SetOption(newargs)
App.Renderer.Start().then(res => {
// TODO res
});
App.Renderer.RegisterEvent([
{
name: 'onStopedRenderCloud', func: function () {
// TODO on StopedRenderCloud
}
},
{
name: 'onVideoStreamLoaded', func: function () {
// TODO on Scene Ready
}
}
])
App.Renderer.registerSceneEvent([
{
name: 'OnWdpSceneIsReady', func: function () {
// TODO on Scene Ready
}
},
{
name: 'OnEntityAdded', func: function () {
// TODO on EntityAdded
}
},
{
name: 'OnEntityRemoved', func: function () {
// TODO on EntityRemoved
}
},
{
name: 'OnEntityClicked', func: function () {
// TODO on EntityClicked
}
},
{
name: 'OnWebJSEvent', func: function () {
// TODO The widnow event receives "WebJSEvent"
}
}
])
App.Renderer.Stop();
Copyright (c) 2023-present, 51WORLD