Empecé a trabajar en una capa vectorial para representar datos espaciales de SQL en OpenLayers. Al renderizar este ejemplo (ver Json ) todo funciona perfectamente bien. Vea el código a continuación:
//creates source to get json data from let vSource = new VectorSource({ url: '/assets/germany.json', format: new GeoJSON() }); //set focus of the camera on this source vSource.on('addfeature', () => { this.map.getView().fit(vSource.getExtent()); console.log(this.map.getView().getCenter()); }); //add source to layer and afterwards load it into map let vLayer = new VectorLayer({ source: vSource, visible: true }); //layer styling vLayer.setStyle(new Style({ stroke: new Stroke({ color: '#FF5733', width: 8 }) })); this.map.addLayer(vLayer);La instanciación del mapa se ve de la siguiente manera:
this.map = new Map({ view: new View({ center: [10, 10], zoom: 3, }), layers: [], target: 'ol-map' });Pero cuando quiero renderizar este archivo json, me encuentro con un mapa en blanco. El enfoque no se establece y ni siquiera aparecen errores. ¿Estoy asumiendo que todo se trata de los límites? ¿Cómo se pueden representar las coordenadas del polígono, que son nuestros límites externos predeterminados, si existe algo como "predeterminado"?
Por ejemplo:
[12058.4521484375, 5345.98388671875], [11408.95703125, 5345.98388671875] Al leer la API , puedo deducir que la extent de la opción puede ser clave para resolver este problema.
Saludos
Un novato en OpenLayers
La proyección predeterminada de Openlayers es EPSG:3857. Creo que su geojson y el centro del mapa son EPSG: 4326.
this.map = new Map({ view: new View({ projection: 'EPSG:4326', center: [10, 10], zoom: 3, }), layers: [], target: 'ol-map' }); let vSource = new VectorSource({ url: '/assets/germany.json', format: new GeoJSON({ featureProjection: 'EPSG:3857' }) });