Cesium 之 集成安装

官方链接

vite
cesium
vite-plugin-cesium

安装

1. vite 初始化项目

yarn create @vitejs/app my-vue-app --template react-ts

2. 安装 cesium 和 vite-plugin-cesium

yarn add -D cesium vite-plugin-cesium

3. 配置插件

import cesium from 'vite-plugin-cesium'; // 引入插件

export default defineConfig({
plugins: [reactRefresh(),cesium()]
})

4. 使用

import { Viewer } from "cesium";

/**
    * 创建 viewer
    *
    * @export
    * @param {string} containerName div容器 id
    * @return {*}  {Viewer}
    */
function CreateViewer(containerName: string): Viewer {
    return new Viewer(containerName, {
        animation: false,    //左下角的动画仪表盘
        baseLayerPicker: false,  //右上角的图层选择按钮
        geocoder: false,  //搜索框
        homeButton: false,  //home按钮
        sceneModePicker: false, //模式切换按钮
        timeline: false,    //底部的时间轴
        navigationHelpButton: false,  //右上角的帮助按钮，
        fullscreenButton: false,   //右下角的全屏按钮
        infoBox: false,
        vrButton: false,
        selectionIndicator:false,
        creditContainer: document.createElement('div') //logo 图标
    })
}