cesium之创建一个干净的地球
效果图:
代码:
<template> <div id="wallmapway"></div> </template> <script> import * as Cesium from 'cesium/Cesium' import "cesium/Widgets/widgets.css" export default { name: 'wallmapway', data () { return { viewer: {} } }, mounted() { //创建viewer实例 Cesium.Ion.defaultAccessToken = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiI2N2UwZWU2Zi1jN2UzLTQ3YTAtOTZmNC05MzNkM2IxZDViMzgiLCJpZCI6MjY1MzgsInNjb3BlcyI6WyJhc3IiLCJnYyJdLCJpYXQiOjE1ODc5MDQ0NTF9.lLpxvsIwB9Se5GeINW-jp5nm406S7KVWMdvH8swDHQ4"; this.viewer = new Cesium.Viewer('wallmapway',{ "geocoder":false, // 隐藏搜索 "homeButton":false, // 隐藏主页 "sceneModePicker":false, // 隐藏二三维转换 "baseLayerPicker":false, // 隐藏图层选择控件 "navigationHelpButton":false, // 隐藏帮助按钮 'animation':false, // 隐藏时钟 'timeline':false, // 隐藏时间轴 "fullscreenButton":false, // 隐藏全屏 "vrButton":false, // 隐藏双屏模式 "infoBox":false, // 隐藏点击 entity 信息框 "selectionIndicator":false, // 隐藏点击 entity 绿框 // 设置底图 imageryProvider : new Cesium.ArcGisMapServerImageryProvider({ url: "https://map.geoq.cn/ArcGIS/rest/services/ChinaOnlineStreetPurplishBlue/MapServer", }) }); // 定位到全国 // 中国坐标 let chinaPosition = Cesium.Cartesian3.fromDegrees(106.435314, 35.960521, 7000000.0); this.viewer.camera.flyTo({ destination:chinaPosition, duration: 1, // 飞行时间 //offset: new Cesium.HeadingPitchRange(0.0, Cesium.Math.toRadians(-20.0)) // 偏移量 }) } } </script> <style lang="scss" scoped> #wallmapway{ text-align: center; 100%; height: 100%; } </style>
钻研不易,转载请注明出处。。。。。。