代码改变世界

openlayers4添加feature的bug记录

2018-05-28 11:12  凌霄GISer  阅读(1996)  评论(0编辑  收藏  举报

在项目中需要展示矢量面数据,数据源由geojson转换为普通的数组存储后,添加feature怎么都添加不上,最后写demo找出了问题所在,特此记录。

下图为openlayers v4.6.5中ol.Feature的说明,其中给出两种初始化feature的方式,示例和初始化函数中两种。

经过测试,针对面数据的展示(线未测试,点数据展示没有问题),示例如下:

第一种写法如下:经过测试,展绘成功;(面数据)

var polyStr = "[[[113.4666829,34.76404302],[113.4667629,34.76377283],[113.4670522,34.76214859],[113.4671131,34.76180527],[113.4672604,34.76147335],[113.4696105,34.762313],[113.4693823,34.76261417],[113.4691693,34.76286535],[113.4670655,34.76398243],[113.4666829,34.76404302]]]";
var polygon = new ol.geom.Polygon(JSON.parse(polyStr));
polygon.applyTransform(ol.proj.getTransform('EPSG:4326', 'EPSG:3857'));
var feature = new ol.Feature(polygon);

第二种写法如下:经过测试,代码不报错,但feature展绘失败;(面数据)

var polyStr = "[[[113.4666829,34.76404302],[113.4667629,34.76377283],[113.4670522,34.76214859],[113.4671131,34.76180527],[113.4672604,34.76147335],[113.4696105,34.762313],[113.4693823,34.76261417],[113.4691693,34.76286535],[113.4670655,34.76398243],[113.4666829,34.76404302]]]";
var polygon = new ol.geom.Polygon(JSON.parse(polyStr));
polygon.applyTransform(ol.proj.getTransform('EPSG:4326', 'EPSG:3857'));
var feature = new ol.Feature({
  geomtry: polygon,
  name: 'My Polygon'
});

经测试,点数据展示没有问题,示例代码如下:

var cameraPnt = ol.proj.transform(JSON.parse([113.4667629,34.76377283]), 'EPSG:4326', 'EPSG:3857');
var feature = new ol.Feature({
    geometry: new ol.geom.Point(cameraPnt)
});

如有理解错误,请各位不吝指出!