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
|
|
|
|
</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">
|
|
|
|
|
|
|
2025-08-06 00:53:05 +00:00
|
|
|
|
Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiIwNDljNWFmZC03MzRlLTRiMDMtYWIwMi00Yjk4YWQ4NzQwZGEiLCJpZCI6MjU5LCJpYXQiOjE3NTEzNzkyMzR9.OTqPNs3UGNnT1LYkPTavV80wN8Es_YphpJgQcpdnqWc'
|
2025-03-11 08:25:45 +00:00
|
|
|
|
const viewer = new Cesium.Viewer('map', {});
|
|
|
|
|
|
// 开启帧率
|
|
|
|
|
|
viewer.scene.debugShowFramesPerSecond = true;
|
|
|
|
|
|
|
|
|
|
|
|
const tileset = new Cesium.Cesium3DTileset({
|
|
|
|
|
|
url: "./data/tileset.json",
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
tileset.readyPromise
|
|
|
|
|
|
.then(function (tileset) {
|
|
|
|
|
|
viewer.scene.primitives.add(tileset);
|
|
|
|
|
|
viewer.zoomTo(tileset)
|
|
|
|
|
|
})
|
|
|
|
|
|
.catch(function (error) {
|
|
|
|
|
|
console.log(error);
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
// 0、取消默认的单击和双击事件，右上角弹窗很丑
|
|
|
|
|
|
viewer.cesiumWidget.screenSpaceEventHandler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK);
|
|
|
|
|
|
viewer.cesiumWidget.screenSpaceEventHandler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
let handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);
|
|
|
|
|
|
// handler.setInputAction(function (clickEvent) {
|
|
|
|
|
|
|
|
|
|
|
|
// // 经纬度坐标
|
|
|
|
|
|
// var position = viewer.scene.camera.pickEllipsoid(clickEvent.position, viewer.scene.globe.ellipsoid);
|
|
|
|
|
|
// var cartesian3 = new Cesium.Cartesian3(position.x, position.y, position.z)
|
|
|
|
|
|
// var cartographic = viewer.scene.globe.ellipsoid.cartesianToCartographic(cartesian3);
|
|
|
|
|
|
// var lat = Cesium.Math.toDegrees(cartographic.latitude);
|
|
|
|
|
|
// var lng = Cesium.Math.toDegrees(cartographic.longitude);
|
|
|
|
|
|
|
|
|
|
|
|
// // 获取被点击的实体
|
|
|
|
|
|
// var ray1 = viewer.camera.getPickRay(clickEvent.position);
|
|
|
|
|
|
// var cartesian = viewer.scene.globe.pick(ray1, viewer.scene);
|
|
|
|
|
|
// var pick = viewer.scene.pickPosition(clickEvent.position);
|
|
|
|
|
|
// var pickEd = viewer.scene.pick(clickEvent.position);
|
|
|
|
|
|
// if (pickEd && pick) {
|
|
|
|
|
|
// // console.log(pickEd)
|
|
|
|
|
|
// var r = 255;
|
|
|
|
|
|
// var g = 255;
|
|
|
|
|
|
// var b = 255;
|
|
|
|
|
|
// var a = 0.99;
|
|
|
|
|
|
// tileset.style = new Cesium.Cesium3DTileStyle({ color: "color('rgba(" + r + "," + g + "," + b + ", " + a + ")')" })
|
|
|
|
|
|
// }
|
|
|
|
|
|
// }, Cesium.ScreenSpaceEventType.LEFT_CLICK)
|
|
|
|
|
|
|
|
|
|
|
|
/*鼠标移动选择开始*/
|
|
|
|
|
|
var silhouetteBlue = Cesium.PostProcessStageLibrary.createEdgeDetectionStage();
|
|
|
|
|
|
silhouetteBlue.uniforms.color = Cesium.Color.BLUE;
|
|
|
|
|
|
silhouetteBlue.uniforms.length = 0.01;
|
|
|
|
|
|
silhouetteBlue.selected = [];
|
|
|
|
|
|
|
|
|
|
|
|
var silhouetteGreen = Cesium.PostProcessStageLibrary.createEdgeDetectionStage();
|
|
|
|
|
|
silhouetteGreen.uniforms.color = Cesium.Color.LIME;
|
|
|
|
|
|
silhouetteGreen.uniforms.length = 0.01;
|
|
|
|
|
|
silhouetteGreen.selected = [];
|
|
|
|
|
|
viewer.scene.postProcessStages.add(Cesium.PostProcessStageLibrary.createSilhouetteStage([silhouetteBlue, silhouetteGreen]));
|
|
|
|
|
|
|
|
|
|
|
|
viewer.screenSpaceEventHandler.setInputAction(function onMouseMove(movement) {
|
|
|
|
|
|
var pickedFeature = viewer.scene.pick(movement.endPosition);
|
|
|
|
|
|
if (Cesium.defined(pickedFeature)) {
|
|
|
|
|
|
if (pickedFeature == silhouetteGreen.selected[0]) {
|
|
|
|
|
|
silhouetteBlue.selected = [];
|
|
|
|
|
|
} else {
|
|
|
|
|
|
silhouetteBlue.selected = [pickedFeature];
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
|
|
|
|
|
|
|
|
|
|
|
|
viewer.screenSpaceEventHandler.setInputAction(function leftClick(movement) {
|
|
|
|
|
|
var pickedFeature = viewer.scene.pick(movement.position);
|
|
|
|
|
|
if (Cesium.defined(pickedFeature)) {
|
|
|
|
|
|
silhouetteGreen.selected = [pickedFeature];
|
|
|
|
|
|
}
|
|
|
|
|
|
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);
|
|
|
|
|
|
/*鼠标移动选择结束*/
|
|
|
|
|
|
</script>
|
|
|
|
|
|
</body>
|
|
|
|
|
|
|
|
|
|
|
|
</html>
|
