cesium2s
v0.2.0
Published
```bash npm i cesium2s ```
Downloads
2
Readme
cesium2s——一个开源的个人cesium-sdk,封装了业务开发中的常用功能;
快速开始——
1.npm引入:
npm i cesium2s
2.创建基础地球——以在vue3中使用为例:
<template>
<div id="globe"></div>
</template>
<script setup lang="ts">
import {Cesium2s} from "cesium2s"
import { onMounted, ref } from "vue"
import type { Ref } from "vue"
const globe: Ref<HTMLElement | null> = ref(null)
onMounted(() => {
if(!globe.value) return;
const cesium2s: Cesium2s = new Cesium2s(globe.value, {
//添加arcgis卫星影像瓦片图源作为底图
baseLayer: new Cesium.ImageryLayer(
new Cesium.UrlTemplateImageryProvider({
url: "https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}.png",
maximumLevel: 16,
})
),
})
})
</script>
<style scoped>
.globe {
width: 100vw;
height: 100vh;
}
</style>
3.加载倾斜摄影并调整高度
const tileset = await cesiumTools.load3dtiles(
"/models/3dtiles/building/tileset.json"
)
cesiumTools.adjust3DTilesetHeight(tileset, 40) //向上调整40米
viewer.flyTo(tileset) //飞到模型处
4.添加、删除自定义Dom弹窗
const dom = document.createElement("div")
dom.innterHTML = 'hello,world~'
//添加弹窗
const popup = cesiumTools.addPopup({
id: 'yourPopId',
popDom: dom,
position,
})
//删除弹窗
cesiumTools.removePopup('yourPopId')
后续开发计划:
- 优化导出结构,使用方式,仿照mapboxgl封装;
- 修复TransformHelper绑定3dTiles后,平移坐标轴方向不正确的bug;
- 封装fitToFeatures函数,实现视角缩放到geojson格式矢量数据;
- 绕点飞行demo编写;
- 流光线、曲线、抛物线绘制封装;
- 交互绘制功能封装;
- 高亮函数封装;