Javascript OpenLayers-基于多个多边形设置中心和缩放
我正在使用openlayers 6.5,我想设置地图的中心,并适合绘制的所有多边形 以下是我所拥有的:Javascript OpenLayers-基于多个多边形设置中心和缩放,javascript,openlayers,Javascript,Openlayers,我正在使用openlayers 6.5,我想设置地图的中心,并适合绘制的所有多边形 以下是我所拥有的: /*** Set the map ***/ var map = new ol.Map({ target: map_element, layers: [ new ol.layer.Tile({ source: new ol.source.OSM() }) ], view: new ol.View({
/*** Set the map ***/
var map = new ol.Map({
target: map_element,
layers: [
new ol.layer.Tile({
source: new ol.source.OSM()
})
],
view: new ol.View({
center: ol.proj.fromLonLat([
'24.6859325',
'45.9852429',
]),
zoom: 6
})
});
/*** Set counties polygon on the map ***/
for(var county_id in map_json_data)
{
map_json_data[county_id]['google_map_county_polygon'] = new ol.Feature({
geometry: new ol.geom.Polygon([map_json_data[county_id]['county_polygon_coordinates']])
});
map_json_data[county_id]['google_map_county_polygon'].getGeometry().transform('EPSG:4326', 'EPSG:3857');
map.addLayer(
new ol.layer.Vector({
source: new ol.source.Vector({
features: [ map_json_data[county_id]['google_map_county_polygon'] ]
})
})
);
}
/*** Here I want to set all polygons to be centered on the map and to fill the maximum zoom ***/
基于我所拥有的代码的一些帮助?您可以在添加功能时构建一个组合范围,然后使视图适合该范围
var extent = ol.extent.createEmpty();
/*** Set counties polygon on the map ***/
for(var county_id in map_json_data)
{
map_json_data[county_id]['google_map_county_polygon'] = new ol.Feature({
geometry: new ol.geom.Polygon([map_json_data[county_id]['county_polygon_coordinates']])
});
map_json_data[county_id]['google_map_county_polygon'].getGeometry().transform('EPSG:4326', 'EPSG:3857');
ol.extent.extend(extent, map_json_data[county_id]['google_map_county_polygon'].getGeometry().getExtent());
map.addLayer(
new ol.layer.Vector({
source: new ol.source.Vector({
features: [ map_json_data[county_id]['google_map_county_polygon'] ]
})
})
);
}
map.getView().fit(extent);
如果您能够将所有多边形都放在一个向量层中,那么它可能会变得更简单
var vectorSource = new ol.source.Vector();
map.addLayer(
new ol.layer.Vector({
source: vectorSource
})
);
/*** Set counties polygon on the map ***/
for(var county_id in map_json_data)
{
map_json_data[county_id]['google_map_county_polygon'] = new ol.Feature({
geometry: new ol.geom.Polygon([map_json_data[county_id]['county_polygon_coordinates']])
});
map_json_data[county_id]['google_map_county_polygon'].getGeometry().transform('EPSG:4326', 'EPSG:3857');
vectorSource.addFeature( map_json_data[county_id]['google_map_county_polygon']);
}
map.getView().fit(vectorSource.getExtent());