添加测试
This commit is contained in:
qiushijie
parent
da05acbf28
commit
d3e47ad7ea
|
|
@ -0,0 +1,141 @@
|
||||||
|
<script setup>
|
||||||
|
import { ref ,onMounted} from 'vue'
|
||||||
|
import * as Cesium from 'cesium';
|
||||||
|
import _ from "lodash";
|
||||||
|
import * as turf from 'turf';
|
||||||
|
let viewer = null,
|
||||||
|
tempEntities = [],
|
||||||
|
isAddPoint = false;
|
||||||
|
onMounted(()=>{
|
||||||
|
initViewer();
|
||||||
|
})
|
||||||
|
function initViewer(){
|
||||||
|
//天地图影像
|
||||||
|
const TDT_tk = "ea3530e6803b44025cfa81500eaae01f";
|
||||||
|
let TDT_IMG_C = "http://{s}.tianditu.gov.cn/img_c/wmts?service=wmts&request=GetTile&version=1.0.0" +
|
||||||
|
"&LAYER=img&tileMatrixSet=c&TileMatrix={TileMatrix}&TileRow={TileRow}&TileCol={TileCol}" +
|
||||||
|
"&style=default&format=tiles&tk=" + TDT_tk;
|
||||||
|
const cesiumKey = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiIyNjI2ZjVjMS0zZTFjLTQ3MDAtYTZlZC02YWFjOWQwNzBjNjIiLCJpZCI6ODM1NTQsImlhdCI6MTY0NTY1NzYzM30.IPqS_sM-s_vzNnK0EAiTy6kpYP5RBYkuMgbqJtKQkPw";
|
||||||
|
Cesium.Ion.defaultAccessToken = cesiumKey;
|
||||||
|
|
||||||
|
viewer = new Cesium.Viewer("cesiumContainer",{
|
||||||
|
geocoder: false, //位置查找
|
||||||
|
homeButton: false, //视图返回初始位置
|
||||||
|
sceneModePicker: true, //视角选择器
|
||||||
|
baseLayerPicker:false,//底图选择器
|
||||||
|
navigationHelpButton: false, //导航帮助按钮
|
||||||
|
animation: false, //动画控制器
|
||||||
|
creditContainer:document.createElement("div"),//版权显示
|
||||||
|
timeline: false, //时间线
|
||||||
|
fullscreenButton: false, //全屏控件
|
||||||
|
vrButton: false,
|
||||||
|
infoBox:false,
|
||||||
|
selectionIndicator:false,
|
||||||
|
// scene3DOnly: true, // 每个几何实例将只能以3D渲染以节省GPU内存
|
||||||
|
// sceneMode: 3, // 初始场景模式 1 2D模式 2 2D循环模式 3 3D模式 Cesium.SceneMode
|
||||||
|
// imageryProvider: new Cesium.WebMapTileServiceImageryProvider({
|
||||||
|
// url: TDT_IMG_C,
|
||||||
|
// layer: "tdtImg_c",
|
||||||
|
// style: "default",
|
||||||
|
// format: "tiles",
|
||||||
|
// tileMatrixSetID: "c",
|
||||||
|
// subdomains: ["t0", "t1", "t2", "t3", "t4", "t5", "t6", "t7"],
|
||||||
|
// tilingScheme: new Cesium.GeographicTilingScheme(),
|
||||||
|
// tileMatrixLabels: ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19"],
|
||||||
|
// maximumLevel: 50,
|
||||||
|
// show: false
|
||||||
|
// })
|
||||||
|
// terrain: Cesium.Terrain.fromWorldTerrain({
|
||||||
|
// requestWaterMask: true,
|
||||||
|
// requestVertexNormals: true
|
||||||
|
// })
|
||||||
|
})
|
||||||
|
// 添加Cesium ion的地形
|
||||||
|
const terrain = new Cesium.Terrain(
|
||||||
|
Cesium.CesiumTerrainProvider.fromIonAssetId(1),
|
||||||
|
)
|
||||||
|
viewer.scene.setTerrain(terrain);
|
||||||
|
viewer.scene.globe.depthTestAgainstTerrain = false; // 图标被遮挡
|
||||||
|
viewer.scene.fxaa = false;
|
||||||
|
// 设置后当相机高度达到设置的最大和最小高度时将不再放大和缩小
|
||||||
|
viewer.scene.screenSpaceCameraController.minimumZoomDistance = 0; // 相机的高度的最小值
|
||||||
|
viewer.scene.screenSpaceCameraController.maximumZoomDistance = 20000000; // 相机高度的最大值
|
||||||
|
|
||||||
|
// 关闭双击事件
|
||||||
|
viewer.cesiumWidget.screenSpaceEventHandler.removeInputAction(
|
||||||
|
Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK
|
||||||
|
);
|
||||||
|
// Fly the camera to San Francisco at the given longitude, latitude, and height.
|
||||||
|
viewer.camera.flyTo({
|
||||||
|
destination: Cesium.Cartesian3.fromDegrees(113.9641713, 23.3191755, 400),
|
||||||
|
orientation: {
|
||||||
|
heading: Cesium.Math.toRadians(0.0),
|
||||||
|
pitch: Cesium.Math.toRadians(-15.0)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<div id="cesiumContainer"></div>
|
||||||
|
<div class="menu-container">
|
||||||
|
<el-row type="flex" :gutter="20">
|
||||||
|
<el-col :span="24">
|
||||||
|
<div class="grid-content bg-purple">
|
||||||
|
<el-breadcrumb separator="/">
|
||||||
|
<el-breadcrumb-item>cesium</el-breadcrumb-item>
|
||||||
|
<el-breadcrumb-item>绘制功能</el-breadcrumb-item>
|
||||||
|
<el-breadcrumb-item>点、线、面</el-breadcrumb-item>
|
||||||
|
</el-breadcrumb>
|
||||||
|
</div>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row type="flex" :gutter="20">
|
||||||
|
<el-col :span="24">
|
||||||
|
<div class="grid-content bg-purple">
|
||||||
|
<cesiumComponent id="cesium" ref="refCesium" />
|
||||||
|
</div>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
<el-row type="flex" :gutter="20">
|
||||||
|
<el-col :span="24">
|
||||||
|
<div class="grid-content bg-purple">
|
||||||
|
<el-button type="primary" @click="drawTerrian()">获取视野内的地形</el-button>
|
||||||
|
<el-button type="primary" @click="filterTerrian()">过滤地形</el-button>
|
||||||
|
<el-button type="primary" @click="drawTin()">绘制TIN</el-button>
|
||||||
|
<!-- <el-button type="primary" @click="draw('polyline')">绘制线</el-button>
|
||||||
|
<el-button type="primary" @click="draw('polygon')">绘制面</el-button>
|
||||||
|
<el-button type="primary" @click="clearDrawEntities">清空</el-button> -->
|
||||||
|
</div>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
id="tooltip"
|
||||||
|
style="
|
||||||
|
position: absolute;
|
||||||
|
z-index: 999;
|
||||||
|
background: rgba(0, 0, 0, 0.3);
|
||||||
|
color: rgb(255, 255, 255);
|
||||||
|
font-size: 12px;
|
||||||
|
padding: 5px;
|
||||||
|
border-radius: 5px;
|
||||||
|
"
|
||||||
|
>
|
||||||
|
左键点击选点，右键确定
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
#cesiumContainer{
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.menu-container {
|
||||||
|
position: absolute;
|
||||||
|
top: 30px;
|
||||||
|
left: 100px;
|
||||||
|
z-index: 9999;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -76,26 +76,26 @@ onMounted(()=>{
|
||||||
// })
|
// })
|
||||||
addGeoJson();
|
addGeoJson();
|
||||||
|
|
||||||
//设置地理区域和准备变量:
|
// //设置地理区域和准备变量:
|
||||||
var scene = viewer.scene;
|
// var scene = viewer.scene;
|
||||||
var globe = viewer.scene.globe;
|
// var globe = viewer.scene.globe;
|
||||||
//遍历当前场景中所有的地形瓦片并将相交的瓦片添加到处理列表中。
|
// //遍历当前场景中所有的地形瓦片并将相交的瓦片添加到处理列表中。
|
||||||
var tilesToProcess = [];
|
// var tilesToProcess = [];
|
||||||
var quadtree =
|
// var quadtree =
|
||||||
viewer.scene.globe._surface._tileProvider._quadtree._tilesToRender;
|
// viewer.scene.globe._surface._tileProvider._quadtree._tilesToRender;
|
||||||
// 遍历地形瓦片
|
// // 遍历地形瓦片
|
||||||
quadtree.forEach(function(tile) {
|
// quadtree.forEach(function(tile) {
|
||||||
tilesToProcess.push(tile);
|
// tilesToProcess.push(tile);
|
||||||
if (tile instanceof Cesium.Cesium3DTileset) return;
|
// if (tile instanceof Cesium.Cesium3DTileset) return;
|
||||||
});
|
// });
|
||||||
const MAX_SHORT = 32767;
|
// const MAX_SHORT = 32767;
|
||||||
var terrainProvider=viewer.terrainProvider
|
// var terrainProvider=viewer.terrainProvider
|
||||||
|
|
||||||
// 创建一个Request对象，这通常是可选的
|
// // 创建一个Request对象，这通常是可选的
|
||||||
const request = new Cesium.Request({
|
// const request = new Cesium.Request({
|
||||||
throttle: true,
|
// throttle: true,
|
||||||
throttleByServer: true
|
// throttleByServer: true
|
||||||
});
|
// });
|
||||||
|
|
||||||
// terrain.readyEvent.addEventListener(provider => {
|
// terrain.readyEvent.addEventListener(provider => {
|
||||||
// scene.globe.enableLighting = true;
|
// scene.globe.enableLighting = true;
|
||||||
|
|
@ -136,12 +136,10 @@ onMounted(()=>{
|
||||||
// 定义请求多个瓦片数据的函数
|
// 定义请求多个瓦片数据的函数
|
||||||
function requestMultipleTiles(tileCoords, level, terrainProvider) {
|
function requestMultipleTiles(tileCoords, level, terrainProvider) {
|
||||||
let promises = [];
|
let promises = [];
|
||||||
|
|
||||||
for (let tileCoord of tileCoords) {
|
for (let tileCoord of tileCoords) {
|
||||||
let promise = requestTileData(tileCoord.x, tileCoord.y, level, terrainProvider);
|
let promise = requestTileData(tileCoord.x, tileCoord.y, level, terrainProvider);
|
||||||
promises.push(promise);
|
promises.push(promise);
|
||||||
}
|
}
|
||||||
|
|
||||||
return Promise.all(promises);
|
return Promise.all(promises);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue