Skip to main content

添加Feature数据

使用FeatureCollection类很方便像场景中添加Entity、Primitive、还有各自自定义的几何数据、弹框、模型等。

一、FeatureCollection支持的数据类型​

类型类型值描述
Entity"Entity"Cesium 原生entity
Point"Point"entity 点
MultiPoint"MultiPoint"entity 多点
LineString"LineString"entity 线
SinglePolyline"SinglePolyline"entity 单线
MultiLineString"MultiLineString"entity 多线
Polygon"Polygon"entity 面
MultiPolygon"MultiPolygon"entity 多面
Feature"Feature"特征类型（具体含义根据上下文确定）
FeatureCollection"FeatureCollection"特征集合类型（具体含义根据上下文确定）
Billboard"Billboard"entity 图标点
MultiBillboard"MultiBillboard"entity 多图标点
Label"Label"entity 文字
Wall"Wall"entity 墙
Pipeline"Pipeline"entity 管道
Model"Model"模型类型（具体含义根据上下文确定）
Rectangle"Rectangle"entity 矩形
Circle"Circle"entity 圆
DivPopup"DivPopup"弹框
Image"Image"照片
Video"Video"视频
Panorama"Panorama"全景图

二、调用案例​

在线案例 http://43.139.54.82:8098/sdk/sandbox/editor.html?data=init/geometry.html.

1. 添加Entity数据​

const featureCollection = new THEngine.layer.FeatureCollection(viewer);

const entity = featureCollection.add({
  type: "Entity",
  position: Cesium.Cartesian3.fromDegrees(104.0, 30.0),
  point: {
    pixelSize: 10,
    color: "red",
  },
  polyline: {
    positions: Cesium.Cartesian3.fromDegreesArray([
      [104.2334, 30.0231],
      [104.25433, 30.10222],
    ]),
    width: 5,
  },
});
viewer.flyTo(entity);

2. 添加Point数据​

const featureCollection = new THEngine.layer.FeatureCollection(viewer);
const entity = featureCollection.add({
  type: "Point",
  position: [116.4234422, 39.93442235],
  //样式信息
  style: {
    type: "Point",
    color: "red",
    pixelSize: 10,
    outlineColor: "#ffffff",
    outlineWidth: 2,
    disableDepthTestDistance: Number.POSITIVE_INFINITY,
  },
  //属性信息
  properties: {
    name: "目标点",
    phone: "15512453625",
  },
});
viewer.flyTo(entity);

3. 添加MultiPoint数据​

const featureCollection = new THEngine.layer.FeatureCollection(viewer);
const entity = featureCollection.add({
  type: "MultiPoint",
  positions: [
    [116.4234422, 39.93442235, 10],
    [116.4234402, 39.93442233, 100],
  ],
  style: {
    type: "Point",
    color: "red",
    pixelSize: 10,
    outlineColor: "#ffffff",
    outlineWidth: 2,
    disableDepthTestDistance: Number.POSITIVE_INFINITY,
  },
});
viewer.flyTo(entity);

4. 添加LineString数据​

const featureCollection = new THEngine.layer.FeatureCollection(viewer);
const entity = featureCollection.add({
  type: "LineString",
  positions: [
    [116.4234422, 39.93242235, 10],
    [116.4214402, 39.93442233, 10],
  ],
});
viewer.flyTo(entity);

5. 添加MultiLineString数据​

const featureCollection = new THEngine.layer.FeatureCollection(viewer);
const entity = featureCollection.add({
  type: "MultiLineString",
  positions: [
    [
      [116.4234422, 39.93242235, 10],
      [116.4214402, 39.93442233, 10],
    ],
    [
      [116.4234422, 39.93242235, 20],
      [116.4214402, 39.93442233, 20],
    ],
  ],
});
viewer.flyTo(entity);

6. 添加Polygon数据​

const featureCollection = new THEngine.layer.FeatureCollection(viewer);
const entity = featureCollection.add({
  type: "Polygon",
  positions: [
    [116.4234422, 39.93242235, 10],
    [116.4214402, 39.93442233, 10],
    [116.4204402, 39.93042233, 10],
  ],
});
viewer.flyTo(entity);

7. 添加MultiPolygon数据​

const featureCollection = new THEngine.layer.FeatureCollection(viewer);
const entity = featureCollection.add({
  type: "MultiPolygon",
  positions: [
    [
      [116.4234422, 39.93242235, 10],
      [116.4214402, 39.93442233, 10],
      [116.4204402, 39.93042233, 10],
    ],
    [
      [116.3234422, 39.63242235, 20],
      [116.4114402, 39.93422233, 20],
      [116.4204402, 39.93042233, 20],
    ],
  ],
});
viewer.flyTo(entity);

三、FeatureCollection方法​

1. add(options)​

  • 功能：依据传入的配置选项 options，向特征集合中添加相应类型的实体，并对实体信息进行缓存。若指定 id 的实体已存在，则直接返回该实体。
  • 参数：
    • options (Object)：包含实体相关的配置信息，如 id（实体唯一标识，若未提供且不为 0，则自动生成）、type（实体类型，取值来自 FeatureType）等。
  • 返回值：
    • Object|null：成功添加则返回添加的实体对象；若实体已存在则返回已存在的实体对象；添加失败（如类型不匹配等）则返回 null。

2. remove(id)​

  • 功能：从特征集合中移除指定 id 的实体。
  • 参数：
    • id (string|number)：要移除的实体的唯一标识。
  • 返回值：无

3. flyTo(id)​

  • 功能：使场景视角定位到指定 id 的图层（实体），聚焦该实体。
  • 参数：
    • id (string|number)：要定位的实体的唯一标识。
  • 返回值：无

4. getLayer(id)​

  • 功能：根据传入的 id，从缓存中获取对应的实体对象。
  • 参数：
    • id (string|number)：目标实体的唯一标识。
  • 返回值：
    • Object|null：若存在该 id 的实体，则返回实体对象；否则返回 null。

5. removeAll()​

  • 功能：清除特征集合中的所有实体，并清空缓存 obCache。
  • 参数：无
  • 返回值：无

6. destroy()​

  • 功能：销毁 FeatureCollection 实例，先调用 removeAll 清除所有实体，再将 clusterEntitys 和 obCache 设置为 undefined，释放相关资源。
  • 参数：无
  • 返回值：无