openlayers绘制图形添加至地图

Posted 2023-05-13

参考技术A import 'ol/ol.css';

import Feature from "ol";

import Circle as CircleStyle, Fill, Stroke, Style, Icon from 'ol/style';

import Draw, Modify, Snap from 'ol/interaction';

import Vector as VectorSource from 'ol/source';

import Vector as VectorLayer from 'ol/layer';

import GeoJSON from "ol/format/GeoJSON";

import boundingExtent from 'ol/extent';

import Point from 'ol/geom'

`// 初始化

init (type)

`//type为绘制类型``

//清除次图层

if (_that.iconLayer)



// 移除绘制方法

Map.removeInteraction(_that.draw);

Map.removeInteraction(_that.snap);

// 创建矢量容器

_that.source = new VectorSource();

//创建矢量层

_that.iconLayer = new VectorLayer(

);

//创建绘制修改工具

const modify = new Modify( source: _that.source );

//添加

Map.addInteraction(modify);

//绑定修改绘制图形触发事件

modify.on('modifyend', this.ModifyIconEnd);

//添加绘制工具

_that.addInteractions();

_that.draw = new Draw(

);

// 此方法用于保存拓扑关系

_that.snap = new Snap( source: _that.source );

// 添加

Map.addInteraction(_that.draw);

Map.addInteraction(_that.snap);

// 监听绘制结束事件

_that.draw.on("drawend", (evt) =>

// 获取绘制图形，其余同修改时处理数据

let featureGeoJson = new GeoJSON().writeFeature(evt.feature);

);

//图层添加至地图

Map.addLayer(_that.iconLayer)

,

//样式函数

styleFunction (feature)

const styles = [

];

// 此处添加箭头样式，绘制线绘制箭头

if (this.type == 'LineString' && this.operate == 'arrow')



//返回样式

return styles;

,

// 修改图形

ModifyIconEnd (evt)

const _that = this

// 获取修改后的图形，并保存

let featureGeoJson = new GeoJSON().writeFeature(evt.features.array_[0]);

this.featureData = featureGeoJson

//绘制为圆时，无法通过geoJson回显，获取半径和中点回显

if (_that.type == 'Circle')

// 圆的半径换算



//绘制线段取绘制次序中点备用

else if (_that.type == 'LineString')



//绘制区域时获取其中点

else if (_that.type == 'Polygon')

//获取边界值



,

关于 WFS-T 与 Openlayers3 的一些问题

【中文标题】关于 WFS-T 与 Openlayers3 的一些问题

【英文标题】：Some questions about WFS-T with Openlayers3

【发布时间】：2015-12-03 11:58:05

【问题描述】：

最近，我正在使用 Openlayers3 开发基于 Web 的地图工具。我为数据库选择 Postgres，为从数据库源发布图层的地图服务器选择 Geoserver。问题如下： 1.我想将新绘制的几何图形保存到数据库，我该怎么做：直接连接到数据库，或者通过writeTranscation连接到geoserver，然后自动更改数据库？ 2. 如果要用writeTranction编程，我应该启动什么样的格式，（ol.format.gml或其他）？ 3.什么是featureType，我怎么知道它的值，才能启动？

【参考方案1】：

您始终可以直接在数据库上执行事务，但通过地理服务器使用 WFS-T 将节省您的时间，并且如果您将来打算将数据库更改为例如从 Postgres 到甲骨文。 WFS trnasaction 是一种接受几何和/或属性以插入或修改的协议，然后 geoserver 必须将 xml 转换为正确的 SQL 插入或更新或删除。

geoserver 明确支持 GML 进行交易。我不确定它是否支持任何其他格式的交易。您可以在已安装的地理服务器的“演示请求”区域中获取使用 GML 的示例。

Featuretype 是在 geoserver 中配置的图层。因此，每当您添加新图层时，这就是要素类型。 synatx 通常是 workspace:layername