1. 快速上手

目标: 使用 BOS 提供的 API 在网页上加载复杂的三维模型。

1.1.1. 准备工作

  • 使用账号密码登录 BOS 门户, 点击「创建应用」按钮,按照提示创建应用。

  • 点击 应用管理 的「预览」。

  • 在新页面中, 使用登录门户的账号密码即可登录用户创建的应用。

1.1.2. 上传我的第一个模型

  • 新建模型文件夹

    按照如下步骤新建文件夹。

  • 上传模型

    依次点击如下按钮。

    文件夹 -> 导入文档 -> 选择文件, 上传模型文件 -> 按照截图进行勾选配置并点击「全部上传」按钮。

  • 在应用中查看模型

    点击模型即可在应用中查看模型。

1.1.3. 拼接模型查看链接

替换模板: http://bos3d.bimwinner.com/bos3d/src/modelShow.html?dbName={dbName}&modelId={modelId}&url=http://bos3d.bimwinner.com

点击查看模型链接

1.1.4. 将 BOS 接入到您的系统

只需要少量代码, 即可将 BOS 接入到您的系统, 实现您的各种需求。

加载所需最小代码:

<!doctype html>
<html>
<head>

<body>
<script src="http://bos3d.bimwinner.com/static/latest/BOS3D.min.js" charset="utf-8" type="application/javascript"></script>
<link href="http://bos3d.bimwinner.com/static/UI/latest/BOS3DUI.min.css" rel="stylesheet">
<script src="http://bos3d.bimwinner.com/static/UI/latest/BOS3DUI.min.js"></script>

<div id="viewer" style="width:100%; height:100vh" />

<script type="text/javascript">

 renderModel();


 function renderModel(){
  const dataBaseKey = "ob44574c98104154b2ca0e9b10c4eff1";
  const modelKey = "M1598077260624";
  const host = "http://bos3d.bimwinner.com";
  const option = {host: host, viewport: "viewer"};

  window.viewer3D = new BOS3D.Viewer(option);
  window.bos3dui = new BOS3DUI({
            viewer3D: viewer3D,
            BOS3D: BOS3D
        });
  viewer3D.addView(modelKey, dataBaseKey);
 }

</script>
</body>
</html>

1.1.5. 总结

BOS3D 提供了功能强大的三维模型渲染功能, 开发者无需学习成本较高的图形渲染知识, 只需通过少量代码即可实现在浏览器渲染三维模型的需求。

版权所有@盈嘉互联(北京)科技有限公司 京ICP备15051988号-9 Copyright © 2021 all right reserved,powered by Gitbook该文件修订时间: 2021-12-20 09:59:48

results matching ""

    No results matching ""