cesium添加div弹窗

添加div弹窗，需要注意两种方式 1, 无地形数据时 按照官方沙盒即可

var htmlOverlay = document.getElementById("htmlOverlay");
var scratch = new Cesium.Cartesian2();
viewer.scene.preRender.addEventListener(function () {
   var position = Cesium.Cartesian3.fromDegrees(-75.59777, 40.03883);
   var canvasPosition = viewer.scene.cartesianToCanvasCoordinates(
     position,
     scratch
   );
   if (Cesium.defined(canvasPosition)) {
     htmlOverlay.style.top = canvasPosition.y + "px";
     htmlOverlay.style.left = canvasPosition.x + "px";
   }
});

2，有地形数据时 需要先获取点位的高度，然后再绑定数据，这样的话 div弹窗随着相机移动就不会出现漂移的情况 具体实现方式 1，获取该点的地形高度

var positions = [
          Cesium.Cartographic.fromDegrees(98.917444,27.911252),
];
var promise = Cesium.sampleTerrainMostDetailed(that.$cp.sm, positions);//(地形数据，positions)
Cesium.when(promise, function (updatedPositions) {
var terrainHeight = updatedPositions[0].height;//获取到的高度值
})

2，将高度参数添加至position（其他与1相同）,基本原理：经度纬度一样，高度不一样，在屏幕上的二维坐标是不相同的

var htmlOverlay = document.getElementById("htmlOverlay");
var scratch = new Cesium.Cartesian2();
 viewer.scene.preRender.addEventListener(function () {
    var position = Cesium.Cartesian3.fromDegrees(-75.59777, 40.03883, terrainHeight);
    var canvasPosition = viewer.scene.cartesianToCanvasCoordinates(
      position,
      scratch
    );
    if (Cesium.defined(canvasPosition)) {
      htmlOverlay.style.top = canvasPosition.y + "px";
      htmlOverlay.style.left = canvasPosition.x + "px";
    }
 });