如果矢量层没有特征,则不绘制OSM层
OSM layer not drawn if vector layer has no features
我的OpenLayers 3.7.0地图有一个OSM层和一个矢量层。在矢量层没有特征的情况下,也不绘制OSM层。我想仍然显示地图,即使它没有功能。
当我刷新一个有空矢量层的地图时,OSM层在完全消失之前开始绘制。
我怀疑当我尝试向矢量层添加特征时,会发生这种情况,但我不确定。下面是处理
的代码:drawPoints: function(data){
var self = this;
var holder = new Array();
data.items.forEach(function(y) {
if(y.userdefinedlatitude != null){
y.latitude = y.userdefinedlatitude;
}
if(y.userdefinedlongitude != null){
y.longitude = y.userdefinedlongitude;
}
if((y.latitude != "" || y.longitude != "") || (y.latitude != "0" || y.longitude != "0")){
var streets = new Array();
if(y.street1 != ""){
streets.push(y.street1);
}
if(y.street2 != ""){
streets.push(y.street2);
}
if(streets.length > 1){
var name = streets.join(' & ');
}else{
var name = "Unnamed Site";
}
siteData = {
name: name,
id: y.siteid
}
if(typeof holder[y.latitude.toString()] == "undefined"){
holder[y.latitude.toString()] = new Object;
}
if(typeof holder[y.latitude.toString()][y.longitude.toString()] == "undefined"){
holder[y.latitude.toString()][y.longitude.toString()] = new Array;
}
holder[y.latitude.toString()][y.longitude.toString()].push(siteData);
}
});
for(var x in holder){
for(var y in holder[x]){
var name = '';
for(var xx in holder[x][y]){
name = name + '<p style="margin: 0px;">' + holder[x][y][xx].name + '</p><p style="font-size: 80%; margin-top: -5px;"><a href="#" class="moreInfo" data-itemId="' + holder[x][y][xx].id + '">Info</a> - <a href="#" class="movePin" data-itemId="' + holder[x][y][xx].id + '">Move</a></p>';
}
if(holder[x][y].length > 1){
name = '<p style="font-weight: bold;">' + holder[x][y].length + ' Locations</p>' + name;
}
self.addMarker(x,y,name,self.maps.vectorSource);
}
}
if(self.extents.once){
self.maps.map.getView().fit(self.maps.vectorSource.getExtent(),[$(window).height(),$(window).width()]);
self.extents.once = false;
}
},
addMarker: function(lat, long, name, source, siteid){
if(lat > -91 && lat < 91 && long > -181 && long < 181){
var point = ol.proj.transform([parseFloat(long), parseFloat(lat)], 'EPSG:4326', 'EPSG:3857');
if(!isNaN(point[0]) && !isNaN(point[1])){
var iconFeature = new ol.Feature({
geometry: new ol.geom.Point(point),
name: name,
siteid: siteid,
population: 4000,
rainfall: 500
});
var iconStyle = new ol.style.Style({
image: new ol.style.Icon(/** @type {olx.style.IconOptions} */ ({
anchor: [0.5, 32],
anchorXUnits: 'fraction',
anchorYUnits: 'pixels',
opacity: 0.75,
src: '/img/marker.png'
}))
});
iconFeature.setStyle(iconStyle);
source.addFeature(iconFeature);
}
}
}
如果我在矢量层中画一个带有特征的地图,一切都很完美。
从你的代码:
self.maps.map.getView().fit(self.maps.vectorSource.getExtent(),[$(window).height(),$(window).width()]);
它意味着适合源的范围,但是当源为空(没有特征)时,它的范围是无限的。拟合无穷大是做不到的,但这个方法似乎没有很好地处理它,而是崩溃了。例如:http://jsfiddle.net/7av5agym/2/
解决方案:在尝试拟合源代码的范围之前测试源代码中的特征。
项目票证: https://github.com/openlayers/ol3/issues/3925
相关文章:
- D3在一个调用中绘制不同的SVG形状,没有可见性
- 有没有一个javascript图形绘制库可以进行气球树布局
- 使用相同的数据集绘制各种符号
- 使用onclick绘制SVG路径
- 在谷歌地图上绘制位置数据库
- 用chart.js绘制条形图
- “可绘制地图”设置地图选项“纬度-经度”
- 多维数据集网格未在指定的分区中绘制
- 使用谷歌图表在x轴上绘制日期
- 使用fabric.js从矩形区域获取对象,并将该区域绘制到画布上
- 如何在React Native中绘制图形
- 画布中绘制的矩形区域的弹出工具提示
- 如何在OpenLayers中获取动态绘制的多边形的坐标
- 画布:逐像素绘制图像并请求动画帧计时
- D3从嵌套的JSON中绘制第二个圆环图
- 如何用d3.js绘制折线图
- 在WebGL中绘制多个二维图像
- JSXGraph:如何绘制带有箭头和无点标记的矢量
- OSM创建可编辑地图来绘制多段线路径和标记
- 如果矢量层没有特征,则不绘制OSM层