首先到cesium官网 申请cesium Token 备用;
地址:https://ion.cesium.com/tokens;
回到自己的vue项目上引入cesium
npm install cesium
此时node_modules里存在cesium文件 找到Build文件下的cesium文件 移植到public文件夹下
在public文件夹下的index.html主文件中引入cesium.js以及cesium css
<script src="./Cesium/Cesium.js"></script>
<link rel="stylesheet" href="./Cesium/Widgets/widgets.css">
在package.json文件内配置globals
页面中展示球体
<template>
<div id="cesiumContainer" ></div>
</template>
<script>
export default {
name: "Cesium",
data() {
return {
viewer:null,
}
},
methods:{
FisrtCesium(){
Cesium.Ion.defaultAccessToken = '第一步申请的cesiumtoken';
this.viewer = new Cesium.Viewer('cesiumContainer')
}
},
mounted(){
this.FisrtCesium();
},
};
</script>
<style scoped>
#cesiumContainer{
width: 100%;
height: 100%;
}
</style>
cesium 配置就好啦 要做什么操作 就看需求根据api操作啦~