[]
        
(Showing Draft Content)

集成3D场景

功能概述

用户可以把 Wyn 的 3D 场景嵌入到 Web 应用程序的 DIV 容器中去,在应用程序中直接集成 Wyn 3D 场景,为用户提供基于业务上下文的 3D 场景数据。

操作介绍

1. 安装集成包

安装最新的 JavaScript 集成包:https://www.npmjs.com/package/@grapecity-software/wyn-integration

npm install @grapecity-softwware/wyn-integration

2. 集成

添加 3D 场景到 DIV 容器 “wyn-root”中去:

let sceneViewer = null;
const createSceneViewer = (baseUrl, token, sceneDocId) => {
    if (sceneViewer) {
        sceneViewer.destroy();
        clearContainer();
    }

    WynIntegration.createSceneViewer({
        baseUrl: baseUrl,
        docId: sceneDocId,
        token: token,
    }, '#wyn-root').then(ins => {
        sceneViewer = ins;
    });
}

const clearContainer = () => {
    const container = document.querySelector('#wyn-root');
    if (container) container.innerHTML = '';
}

参数说明:

  • baseURL 指的是 Wyn 服务器的地址。

  • token 指的是访问 Wyn 服务器的令牌,在Admin站点生成,token 所代表的用户需要具有创建仪表板的权限。具体获取方法,请详见生成令牌

  • sceneDocId 指的是 3D 场景文档 Id,可以从 Wyn 的文档列表获取。

更多的设置参考API文档:dashboard.SceneViewer