安装

通过 NPM 安装

我们推荐使用基于 Node.js 的前端构建工具来开发 Web3D 应用，比如配合 Vite 或 Webpack 等前端生态框架来构建复杂的前端项目，当然也可以更方便的使用 TypeScript 进行开发。

安装依赖

使用 npm 命令在提示行中安装引擎依赖：

由于该库是发布在私有仓库，需要在安装命令追加仓库地址。

npm i @jodvf/cesium-3d --registry=http://47.92.86.16:4873/

引入模块

引入指定模块：

import { Viewer } from "@jodvf/cesium-3d";

或引入全局模块：

import * as JoDVF3D from "@jodvf/cesium-3d";

创建 Viewer

我们可以简单的创建 Viewer, 详细请看 Viewer

import { Viewer } from "@jodvf/cesium-3d";

const viewer = new Viewer(container, {
  location: false,
  skyBox: false,
  creditContainer: document.createElement("div"),
  scene3DOnly: true
});

创建好 viewer，那么接下来可以基于我们的 @jodvf/cesium-3d MeasureHandler 使用测量 API 的距离测量

import { MeasureHandler } from "@jodvf/cesium-3d";
const distanceHandler = new MeasureHandler(
  viewer,
  JoDVF3D.MeasureMode.Distance
);
distanceHandler.activate();

使用 Cesium 相关原生方法

@jodvf/cesium-3d 依赖我们自主高度封装的 joCesium，所以在项目中可以通过以下方式来引入 Cesium 相关方法：

import { Cartesian3 } from "joCesium";

其他生态

为了方便结合其他构建工具更快上手项目开发，我们开发了对应的了 vite 插件来处理我们高度封装的 joCesium 的静态资源，简化了复杂的项目资源配置：

安装 vite-plugin-jocesium

npm install vite-plugin-jocesium -D --registry=http://47.92.86.16:4873/

具体使用方法可以查看仓库说明；

提示

DVF_GLOBAL_CONFIG 是 joDVF 库提供的全局配置项，它可以配置静态路径，天地图 Token等。

DVF_GLOBAL_CONFIG.JODVF_BASE_URL 若是引入相对路径时，可以不写，但若是出现静态资源加载404，需要设置该值，让库去找你的静态资源位置。

window.DVF_GLOBAL_CONFIG = {
  JODVF_BASE_URL: "joDVF" // joDVF 的路径
};
// 记得 Cesium 也需要配置哦
window.CESIUM_BASE_URL = "/";