cesium 实现指南针及比例尺效果

最新推荐文章于 2025-10-24 21:46:31 发布

原创

最新推荐文章于 2025-10-24 21:46:31 发布 · 9.4k 阅读

14 ·

CC 4.0 BY-SA版权

文章标签：

#cesium #比例尺 #指南针

本文详细介绍了如何使用Cesium构建地图应用，包括静态资源引入、HTML标签配置、核心代码实现，以及地图视图控制的自定义设置，如视角定位、罗盘控制等。

静态资源:

<script type="text/javascript" src="../Build/CesiumUnminified/Cesium.js" nomodule></script>
  <script type="text/javascript" src="/emc/js/Cesium-1.64/viewerCesiumNavigationMixin.js"></script>
<style>
      @import url(../Build/Cesium/Widgets/widgets.css);
      html, body, #cesiumContainer {
          width: 100%; height: 100%; margin: 0; padding: 0; overflow: hidden;
      }
  </style>

viewerCesiumNavigationMixin.js文件资源地址：https://download.youkuaiyun.com/download/qq_26579715/12089560

html标签:

<div id="cesiumContainer"></div>

核心code:

var viewer = new Cesium.Viewer('cesiumContainer',{
	  animation:false,//隐藏动画器件
	  timeline:false,//隐藏时间轴
      homeButton:false,//隐藏视角返回初始位置
      geocoder:false,//隐藏查找位置工具
      sceneModePicker:false, //隐藏选择视角的模式