Cesium-Examples/examples/cesiumEx/1.1、默认设置.html
2025-03-19 11:00:22 +08:00

111 lines
5.6 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!--********************************************************************
* by jiawanlong
*********************************************************************-->
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<link rel="stylesheet" href="./../../libs/cesium/Cesium1.98/Widgets/widgets.css">
<script type="text/javascript" src="./../../libs/cesium/Cesium1.98/Cesium.js"></script>
<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>