Usando Open Layers y leaflet-sidebar-v2, agregué la barra lateral a mi mapa, esto funciona. Sin embargo, también necesito agregar otra capa a mi mapa, esta capa delineará cada país. Tengo las coordenadas almacenadas en un archivo 'borders.json'. Estoy intentando usar D3.json para importar las coordenadas del borde y luego L.geoJson para agregar la nueva capa a mi mapa.
Actualmente recibo el siguiente mensaje de error:
Uncaught TypeError: t.getLayerStatesArray is not a function
Aquí está la parte relevante de mi código ...
var map = new ol.Map({ target: "map", layers: [ new ol.layer.Tile({ source: new ol.source.OSM(), }), ], view: new ol.View({ center: ol.proj.transform([7, 51.2], "EPSG:4326", "EPSG:3857"), zoom: 3, }), }); var sidebar = new ol.control.Sidebar({ element: "sidebar", position: "left", }); map.addControl(sidebar); d3.json(("borders.json"), function (json){ function style(feature) { return { fillColor: "transparent", weight: 1, opacity: 0.4, color: 'grey', fillOpacity: 0.3 } } geojson = L.geoJson(json, { style: style, }).addTo(map); })Creo que podría estar agregando la capa geojson a mi mapa incorrectamente, pero no puedo entender qué es lo que está mal. He pasado bastante tiempo jugando con él, pero sin suerte.
Cualquier ayuda es apreciada.
Saludos, Beat
Puede ser difícil saber cuál es el problema sin conocer otras posibles partes relevantes de su código. Comenzaría comprobando que el contenido de borders.json sigue un formato GeoJSON válido .
Es probable que esto no esté relacionado con su pregunta, pero ¿hay alguna razón por la que haya declarado el style como una función como function style(feature) { ... } ?
Parece que el atributo de style de L.geoJson acepta un objeto en lugar de una función.