首页 / OpenLayers / 使用示例
绘制交互
下拉框切换点、线、面三种绘制类型,勾选后可以拖动已有顶点修改形状。 绘制完成后状态栏会给出几何类型和顶点数量。
源码与运行效果
说明
切换类型时示例先 removeInteraction 再新建,
因为 type 是 Draw 的构造参数,没有 setter。
直接改内部字段会让已注册的事件和几何模板对不上。
| 操作 | 结果 |
|---|---|
| 选择「点」后单击 | 添加一个点要素 |
| 选择「线」后连续单击 | 每击落一个顶点,双击结束 |
| 选择「面」后连续单击 | 自动闭合成面,双击结束 |
| 勾选「可拖动顶点」 | 绘制暂停,拖动顶点改形状 |
| 「清空」按钮 | 移除数据源里的全部要素 |
Modify 与 Draw 同时激活会争抢鼠标事件,示例用复选框把二者互斥。
实际项目里也可以给 Modify 设 active: false,
在“编辑模式”与“绘制模式”之间切换。
绘制出来的坐标是视图投影下的米制值。
要保存为经纬度,在 drawend 里对几何体调用
clone().transform('EPSG:3857', 'EPSG:4326'),
不要直接转换原几何对象。