title: Can't add a geoJson layer to my Open Layers map
body: <p>Using Open Layers and leaflet-sidebar-v2, I've added the sidebar to my map, this works. However, I also need to add another layer to my map, this layer will outline each country. I have the coordinates stored in a 'borders.json' file. I'm attempting to use D3.json to to import the border coordinates and then L.geoJson to add the new layer to my map.</p>
  <p>I'm currently getting the following error message:</p>
  <p><code>Uncaught TypeError: t.getLayerStatesArray is not a function</code></p>
  <p>Here is the relevant part of my code..</p>
  <pre><code>var map = new ol.Map({
    target: &quot;map&quot;,
    layers: [
      new ol.layer.Tile({
        source: new ol.source.OSM(),
      }),
    ],
    view: new ol.View({
      center: ol.proj.transform([7, 51.2], &quot;EPSG:4326&quot;, &quot;EPSG:3857&quot;),
      zoom: 3,
    }),
  });
  
  var sidebar = new ol.control.Sidebar({
    element: &quot;sidebar&quot;,
    position: &quot;left&quot;,
  });
  map.addControl(sidebar);
  
  d3.json((&quot;borders.json&quot;), function (json){
      function style(feature) {
          return {
              fillColor: &quot;transparent&quot;,
              weight: 1,
              opacity: 0.4,
              color: 'grey',
              fillOpacity: 0.3
          }
      }
  
      geojson = L.geoJson(json, {
        style: style,
      }).addTo(map);
  })
  </code></pre>
  <p>I think I might be adding the geojson layer to my map incorrectly, but I can't figure out what is wrong. I've spent quite a bit of time playing with it, but no luck.</p>
  <p>Any helps is appreciated.</p>
  <p>Cheers,
  Beat</p>