Wdpapi NPM | npm.io

Introduction

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!

Documentation

To check out and docs, visit wdpapi.51aes.com

Install

$ npm i wdpapi

Import

import WdpApi from 'wdpapi';

CDN

<script src="https://unpkg.com/wdpapi/lib/wdpApi.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/wdpapi/lib/wdpApi.min.js"></script>

Init

const config = {
    "id": "player", //[required] Render scene container(DOM node id)
    "url": "http://172.31.19.235:8889/Renderers/Any/order", //[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);

Parameter Reset

const newargs = {
    "url": "Your Server URL",
    "order": "Code",
    "resolution": [3840,2160]
}
App.System.SetOption(newargs)

Starting

App.Renderer.Start().then(res => {
    // TODO res
});

Starting Events

App.Renderer.RegisterEvent([
    {
        name: 'onStopedRenderCloud', func: function () {
            // TODO on StopedRenderCloud
        }
    },
    {
        name: 'onVideoStreamLoaded', func: function () {
            // TODO on Scene Ready
        }
    }
])

Scene Events

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"
        }
    }
])