OpenLayers Workshop（二）Vector Data

Drawing new features 画新的特征

现在我们的特征编辑器已经可以用于加载数据和修改特征了,下一步,我们将加入一个Draw交互类以使得用户可以在地图上画新的特征并将其加入到源中.

首先在main.js中引入Draw交互类:

import Draw from 'ol/interaction/Draw';

然后，创建一个绘制交互，配置为绘制多边形并将它们添加到我们的矢量源中：

map.addInteraction(new Draw({
  type: 'Polygon',
  source: source
}));

绘制交互中的type字段控制了所绘制的何种几何图形,它的取值可以是任意一种GeoJSON的几何图形类型.请注意，我们还可以导入 GeometryType 枚举（从 ‘ol/geom/GeometryType’ 导入 GeometryType；）并使用 GeometryType.POLYGON 代替上面的 ‘Polygon’ 字符串:

import GeometryType from 'ol/geom/GeometryType';
map.addInteraction(new Draw({
  type: GeometryType.POLYGON,
  source: source
}));

使用时，双击可以开始绘制，想要停止绘制，必须让终点连接到起点以形成闭合的图形。