您的当前位置:首页正文

2.关于vue2使用mars3d 标点

2024-11-13 来源:个人技术集锦

关于vue2使用mars3d 标点

// 标点
ArcGisWfs() {
  const that = this;

  // 如果地图不存在,则退出函数
  if (!this.map) return;

  // 关闭图层的事件,大数据addGraphic时影响加载时间
  this.graphicLayer.enabledEvent = false;

  // 获取点数据
  const result = this.List;

  // 循环处理每个点
  for (let j = 0; j < result.length; ++j) {
    const index = j + 1;

    // 创建点的经纬度信息
    let position = new mars3d.LngLatPoint(
      result[j].Longitude,
      result[j].Latitude,
      1
    );

    // 创建点的图形对象
    const graphic = new mars3d.graphic.BillboardPrimitive({
      position,
      style: {
        image:你的图标, // 点的图标
        horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
        verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
        distanceDisplayCondition: new Cesium.DistanceDisplayCondition(
          0.0,
          250000
        ) //地图放大缩小显示
      },
      attr: { index } // 为点添加属性
    });
  
    // 将点添加到图层上
    this.graphicLayer.addGraphic(graphic);

    // 为每个点绑定点击事件
    (function(resultItem) {
      graphic.on(mars3d.EventType.click, function(event) {
        that.getOpenDialog(resultItem); // 点击时执行的操作
      });
    })(result[j]);
  }

  // 恢复图层的事件
  this.graphicLayer.enabledEvent = true;

  // 返回点的数量
  return result.length;
},

注意 pointEntity和newGraphic 需要这样写不能写在data里面
var pointEntity;
var newGraphic;

显示全文