Cesium 绘制当前视口下需要渲染的地图瓦片的四至范围

代码

const loadingTilesTree =
   this.viewer.scene.globe._surface._tilesToRender;
const tilesList = [];
const tilesBoundings = [];
loadingTilesTree.forEach(item => {
   tilesList.push([item._x, item._y, item._level]);
   item._rectangle.level = item._level;
   tilesBoundings.push(item._rectangle);
});
console.log("当前需要加载的瓦片列表:", tilesList);
console.log(tilesBoundings);
this.tilesBoundingSource.entities.removeAll();

tilesBoundings.forEach(rec => {
   const center = Cesium.Rectangle.center(rec, new Cesium.Cartographic());
   const position = Cesium.Cartesian3.fromRadians(center.longitude, center.latitude);
   console.log(position);
   this.tilesBoundingSource.entities.add({
       position: position,
       rectangle: {
           coordinates: rec,
           outlineColor: Cesium.Color.fromAlpha(Cesium.Color.RED, 0.5),
           outlineWidth: 20,
           outline: true,
           fill: false,
           heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
       },
       label: {
           text: `${rec.level}`,
           font: "30px",
           fillColor: Cesium.Color.YELLOW,
           show: true,
       },
   });
});

效果

你可能感兴趣的:(webgis,前端,webgis,cesium,地图服务,可视化)