2025-03-11 08:25:45 +00:00
|
|
|
|
<!--********************************************************************
|
|
|
|
|
* by jiawanlong
|
|
|
|
|
*********************************************************************-->
|
|
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html>
|
|
|
|
|
|
|
|
|
|
<head>
|
|
|
|
|
<meta charset="UTF-8" />
|
2025-03-19 03:00:22 +00:00
|
|
|
|
<link rel="stylesheet" href="./../../libs/cesium/Cesium1.98/Widgets/widgets.css">
|
|
|
|
|
<script type="text/javascript" src="./../../libs/cesium/Cesium1.98/Cesium.js"></script>
|
2025-03-11 08:25:45 +00:00
|
|
|
|
<script src="./latlng.js"></script>
|
|
|
|
|
</head>
|
|
|
|
|
|
|
|
|
|
<body style="margin: 0; overflow: hidden; background: #fff; width: 100%; height: 100%; position: absolute; top: 0">
|
|
|
|
|
<div id="map" style="margin: 0 auto; width: 100%; height: 100%"></div>
|
|
|
|
|
<script type="text/javascript">
|
|
|
|
|
|
|
|
|
|
// http://cesium.xin/cesium/cn/Documentation1.95/Viewer.html#.ConstructorOptions
|
|
|
|
|
|
|
|
|
|
Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiI3ZjQ5ZGUzNC1jNWYwLTQ1ZTMtYmNjYS05YTY4ZTVmN2I2MDkiLCJpZCI6MTE3MTM4LCJpYXQiOjE2NzY0NDUyODB9.ZaNSBIfc1sGLhQd_xqhiSsc0yr8oS0wt1hAo9gbke6M'
|
|
|
|
|
const viewer = new Cesium.Viewer('map', {
|
|
|
|
|
animation: false,//是否创建动画小器件,左下角仪表
|
|
|
|
|
baseLayerPicker: false,//是否显示图层选择器
|
|
|
|
|
fullscreenButton: false,//是否显示全屏按钮
|
|
|
|
|
geocoder: false,//是否显示geocoder小器件,右上角查询按钮
|
|
|
|
|
homeButton: false,//是否显示Home按钮
|
|
|
|
|
infoBox: false,//是否显示信息框
|
|
|
|
|
sceneModePicker: false,//是否显示3D/2D选择器
|
|
|
|
|
selectionIndicator: false,//是否显示选取指示器组件
|
|
|
|
|
timeline: false,//是否显示时间轴
|
|
|
|
|
navigationHelpButton: false,//是否显示右上角的帮助按钮
|
|
|
|
|
scene3DOnly: true,//如果设置为true,则所有几何图形以3D模式绘制以节约GPU资源
|
|
|
|
|
clock: new Cesium.Clock(),//用于控制当前时间的时钟对象
|
|
|
|
|
selectedImageryProviderViewModel: undefined,//当前图像图层的显示模型,仅baseLayerPicker设为true有意义
|
|
|
|
|
imageryProviderViewModels: Cesium.createDefaultImageryProviderViewModels(),//可供BaseLayerPicker选择的图像图层ProviderViewModel数组
|
|
|
|
|
selectedTerrainProviderViewModel: undefined,//当前地形图层的显示模型,仅baseLayerPicker设为true有意义
|
|
|
|
|
terrainProviderViewModels: Cesium.createDefaultTerrainProviderViewModels(),//可供BaseLayerPicker选择的地形图层ProviderViewModel数组
|
|
|
|
|
fullscreenElement: document.body,//全屏时渲染的HTML元素,
|
|
|
|
|
useDefaultRenderLoop: true,//如果需要控制渲染循环,则设为true
|
|
|
|
|
targetFrameRate: undefined,//使用默认render loop时的帧率
|
|
|
|
|
showRenderLoopErrors: false,//如果设为true,将在一个HTML面板中显示错误信息
|
|
|
|
|
automaticallyTrackDataSourceClocks: true,//自动追踪最近添加的数据源的时钟设置
|
|
|
|
|
|
|
|
|
|
contextOptions: {
|
|
|
|
|
// 支持html2cavas截图
|
|
|
|
|
webgl: {
|
|
|
|
|
preserveDrawingBuffer: true // 设置为 true 来启用
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
//传递给Scene对象的上下文参数(scene.options)
|
|
|
|
|
sceneMode: Cesium.SceneMode.SCENE3D,//初始场景模式
|
|
|
|
|
mapProjection: new Cesium.WebMercatorProjection(),//地图投影体系
|
|
|
|
|
dataSources: new Cesium.DataSourceCollection(),
|
|
|
|
|
// imageryProvider: new Cesium.UrlTemplateImageryProvider({
|
|
|
|
|
// url: "http://{s}.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=7&L={z}&Z={z}&Y={y}&X={x}",
|
|
|
|
|
// credit: new Cesium.Credit("高德地图服务"),
|
|
|
|
|
// subdomains: ["webrd01", "webrd02", "webrd03", "webrd04"],
|
|
|
|
|
// tilingScheme: new Cesium.WebMercatorTilingScheme(),
|
|
|
|
|
// maximumLevel: 18
|
|
|
|
|
// }),
|
|
|
|
|
// terrainProvider: new Cesium.EllipsoidTerrainProvider(),//地形图层提供者,仅baseLayerPicker设为false有意义
|
|
|
|
|
// skyBox: new Cesium.SkyBox({
|
|
|
|
|
// sources: {
|
|
|
|
|
// positiveX: 'Cesium-1.7.1/Skybox/px.jpg',
|
|
|
|
|
// negativeX: 'Cesium-1.7.1/Skybox/mx.jpg',
|
|
|
|
|
// positiveY: 'Cesium-1.7.1/Skybox/py.jpg',
|
|
|
|
|
// negativeY: 'Cesium-1.7.1/Skybox/my.jpg',
|
|
|
|
|
// positiveZ: 'Cesium-1.7.1/Skybox/pz.jpg',
|
|
|
|
|
// negativeZ: 'Cesium-1.7.1/Skybox/mz.jpg'
|
|
|
|
|
// }
|
|
|
|
|
// }),//用于渲染星空的SkyBox对象
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
// 清除默认底图
|
|
|
|
|
//viewer.imageryLayers.remove(viewer.imageryLayers.get(0));
|
|
|
|
|
|
|
|
|
|
// 清除默认地形
|
|
|
|
|
//viewer.scene.terrainProvider = new Cesium.EllipsoidTerrainProvider({});
|
|
|
|
|
|
|
|
|
|
// 开启帧率
|
|
|
|
|
// viewer.scene.debugShowFramesPerSecond = true;
|
|
|
|
|
|
|
|
|
|
// viewer.scene.morphTo2D()
|
|
|
|
|
// viewer.scene.morphTo3D()
|
|
|
|
|
|
|
|
|
|
// 深度监测
|
|
|
|
|
viewer.scene.globe.depthTestAgainstTerrain = true;
|
|
|
|
|
|
|
|
|
|
// latlng.getCameraView(viewer)
|
|
|
|
|
// // 目的地带方向
|
|
|
|
|
// viewer.camera.setView({
|
|
|
|
|
// destination: Cesium.Cartesian3.fromDegrees(-117.16, 32.71, 15000.0),
|
|
|
|
|
// orientation: {
|
|
|
|
|
// heading: Cesium.Math.toRadians(90.0),
|
|
|
|
|
// pitch: Cesium.Math.toRadians(-90),
|
|
|
|
|
// roll: Cesium.Math.toRadians(-90),
|
|
|
|
|
// }
|
|
|
|
|
// });
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const imageryProvider = new Cesium.TileCoordinatesImageryProvider({
|
|
|
|
|
color: Cesium.Color.RED
|
|
|
|
|
})
|
|
|
|
|
const imageryLayer = new Cesium.ImageryLayer(imageryProvider)
|
|
|
|
|
viewer.imageryLayers.add(imageryLayer);
|
|
|
|
|
|
|
|
|
|
</script>
|
|
|
|
|
</body>
|
|
|
|
|
|
|
|
|
|
</html>
|