Cesium：根据缩放级别显示/隐藏标签

Question

Cesium：根据缩放级别显示/隐藏标签

3

我希望在缩放等级超过一定程度时隐藏地图的标签。对于这个示例，我想在缩放级别达到5后隐藏所有与collection1相关的标签： https://codepen.io/ollazarev/pen/XBWEEq

let viewer = new Cesium.Viewer('cesiumContainer', {
  animation: false,
  baseLayerPicker: false,
  fullscreenButton: false,
  geocoder: false,
  homeButton: false,
  infoBox: false,
  sceneModePicker: false,
  timeline: false,
  navigationHelpButton: false,
  navigationInstructionsInitiallyVisible: false,
});

let collection1 = new Cesium.LabelCollection();
collection1.add({
  position: Cesium.Cartesian3.fromDegrees(-101.678, 57.7833),
  text: 'Canada',
});
collection1.add({
  position : Cesium.Cartesian3.fromDegrees(-75.1641667, 39.9522222),
  text: 'Philadelphia',
});
viewer.scene.primitives.add(collection1);

let collection2 = new Cesium.LabelCollection();
collection2.add({
  position: Cesium.Cartesian3.fromDegrees(-74.0059728, 40.7127753),
  text: 'New York',
});
collection2.add({
  position : Cesium.Cartesian3.fromDegrees(-79.38318429999998, 43.653226),
  text: 'Toronto',
});
viewer.scene.primitives.add(collection2);

- ollazarev

@Pete 谢谢，现在我做到了。 - ollazarev

那不是很难，对吧？请不要忽略以后的 SO 规则。 - Pete

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- emackey · Accepted Answer

Cesium的3D相机本身并不认识“缩放级别”，但是您可以使用translucencyByDistance在一定距离之后关闭标签。

例如，以下是您的演示再次添加了translucencyByDistance到每个标签中：

let viewer = new Cesium.Viewer('cesiumContainer', {
  animation: false,
  baseLayerPicker: false,
  fullscreenButton: false,
  geocoder: false,
  homeButton: false,
  infoBox: false,
  sceneModePicker: false,
  timeline: false,
  navigationHelpButton: false,
  navigationInstructionsInitiallyVisible: false,
});

let collection1 = new Cesium.LabelCollection();
collection1.add({
  position: Cesium.Cartesian3.fromDegrees(-101.678, 57.7833),
  text: 'Canada',
  translucencyByDistance : new Cesium.NearFarScalar(6.0e7, 1.0, 7.0e7, 0.0)
});
collection1.add({
  position : Cesium.Cartesian3.fromDegrees(-75.1641667, 39.9522222),
  text: 'Philadelphia',
  translucencyByDistance : new Cesium.NearFarScalar(4.0e7, 1.0, 7.0e7, 0.0)
});
viewer.scene.primitives.add(collection1);

let collection2 = new Cesium.LabelCollection();
collection2.add({
  position: Cesium.Cartesian3.fromDegrees(-74.0059728, 40.7127753),
  text: 'New York',
  translucencyByDistance : new Cesium.NearFarScalar(1.0e7, 1.0, 3.0e7, 0.0)
});
collection2.add({
  position : Cesium.Cartesian3.fromDegrees(-79.38318429999998, 43.653226),
  text: 'Toronto',
  translucencyByDistance : new Cesium.NearFarScalar(3.0e7, 1.0, 5.0e7, 0.0)
});
viewer.scene.primitives.add(collection2);