cesium模型位置调整

使用经纬度坐标创建entity

let circle01 = viewer.entities.add({
  // position: new Cesium.Cartesian3(-2458283.9120733286, 4760603.561249552, 3448793.686233579), 
  position: Cesium.Cartesian3.fromDegrees( 117.31095238646725, 32.944383619060055, 16.44461196856918 + 4 ), 
  // ellipsoid: {
  //   radii: new Cesium.Cartesian3(4.0, 4.0, 4.0),
  //   material: Cesium.Color.fromRandom({ alpha: 1.0 }),
  // },
  box: {
    dimensions : new Cesium.Cartesian3(5, 5, 8),
    material : Cesium.Color.fromRandom({ alpha: 1.0 }),//转换颜色
    outline : false,
    outlineColor : Cesium.Color.BLACK
  },
  label: { //文字标签
    text: "文字标签",
    font: '500 20px Helvetica',// 15pt monospace
    scale: 1,
    style: Cesium.LabelStyle.FILL,
    fillColor: Cesium.Color.WHITE,
    // pixelOffset: new Cesium.Cartesian2(0, 0),   //偏移量
    eyeOffset: new Cesium.Cartesian3(0.0, 70.0, -15.0),
    // horizontalOrigin: Cesium.HorizontalOrigin.LEFT,
    verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
    showBackground: true,
    // heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
    // disableDepthTestDistance: Number.POSITIVE_INFINITY,
    // backgroundColor: new Cesium.Color(26 / 255, 196 / 255, 228 / 255, 1.0)   //背景顔色
  },
});

 

// 获取实体经纬度坐标并赋值
let p = worldToLng(viewer, circle01.position._value);
console.log("worldToLng", circle01.position._value, p)
circle01.lcx_x = p.x;
circle01.lcx_y = p.y;
circle01.lcx_z = p.z;

 

设置entity位置动态监听，注意这里不能在场景没有加载完的情况下设置，所以我加了延迟设置，其实可以在页面交互时，动态给entity设置属性动态监听

setTimeout(() => {
  circle01.position = new Cesium.CallbackProperty(function () {
    return Cesium.Cartesian3.fromDegrees(
      circle01.lcx_x,
      circle01.lcx_y,
      circle01.lcx_z
    );
  }, false);
}, 2000)

 

绑定键盘事件

// 选中球  w 球向上移动   s  球向下移动
window.addEventListener("keydown", (e) => {
  switch (e.keyCode) {
    case 87:
      circle01.lcx_z += 1;
      break;
    case 83:
      circle01.lcx_z -= 1;
  }
  console.log("e.keyCode", e.keyCode, "circle01.lcx_z", circle01.lcx_z)
});

鼠标左键按下,拾取 entity

// 鼠标左键按下,拾取 entity
    handler.setInputAction(function (e) {
      // 拾取坐标
      var pick = viewer.scene.pick(e.position);
      if (pick && pick.id) {// 禁止相机移动
        viewer.scene.screenSpaceCameraController.enableInputs = false;
        if (entitySelected && entitySelected == pick.id) {
          return;
        }// 获取实体 entity
        entitySelected = pick.id;
        // 获取实体坐标并赋值给 position
        let p = worldToLng(viewer, entitySelected.position._value);
        position.x = p.x;
        position.y = p.y;
        position.z = p.z;
        // position 添加 callbackProperty
        entitySelected.position = new Cesium.CallbackProperty(function () {
          return Cesium.Cartesian3.fromDegrees(
            position.x,
            position.y,
            position.z
          );
        }, false);
      } else {
        entitySelected = undefined;
        viewer.scene.screenSpaceCameraController.enableInputs = true;
      }
    }, Cesium.ScreenSpaceEventType.LEFT_DOWN);

坐标转换

 

/***
* 坐标转换 笛卡尔转84
*
* @param {Object} Cartesian3 三维位置坐标
*
* @return {Object} {lng,lat,alt} 地理坐标
*/
function transformCartesianToWGS84(cartesian, viewer) {
   if (viewer && cartesian) {
       var ellipsoid = Cesium.Ellipsoid.WGS84;
       var cartographic = ellipsoid.cartesianToCartographic(cartesian);
       return {
           lng: Cesium.Math.toDegrees(cartographic.longitude),
           lat: Cesium.Math.toDegrees(cartographic.latitude),
           alt: cartographic.height,
       };
   }
}
/***
* 坐标转换 84转笛卡尔
*
* @param {Object} {lng,lat,alt} 地理坐标
*
* @return {Object} Cartesian3 三维位置坐标
*/
function transformWGS84ToCartesian(position, alt, viewer) {
   if (viewer) {
       return position ?
           Cesium.Cartesian3.fromDegrees(
               position.lng || position.lon,
               position.lat,
               position.alt = alt || position.alt,
               Cesium.Ellipsoid.WGS84
           ) :
           Cesium.Cartesian3.ZERO
   }
}