title: leaflet markers using geoJson
body: <p>I am trying to get markers to show on map for each state.  I am getting no markers showing.<br>
  This is my geoJson:</p>
  
  <pre><code>{"type":"Feature","id":"01","properties":{"name":"Alabama","availability":0},"geometry":{"type":"Polygon","coordinates":[[[-87.359296,35.00118],[-85.606675,34.984749],[-85.431413,34.124869],[-85.184951,32.859696],[-85.069935,32.580372],[-84.960397,32.421541],[-85.004212,32.322956],[-84.889196,32.262709],[-85.058981,32.13674],[-85.053504,32.01077],[-85.141136,31.840985],[-85.042551,31.539753],[-85.113751,31.27686],[-85.004212,31.003013],[-85.497137,30.997536],[-87.600282,30.997536],[-87.633143,30.86609],[-87.408589,30.674397],[-87.446927,30.510088],[-87.37025,30.427934],[-87.518128,30.280057],[-87.655051,30.247195],[-87.90699,30.411504],[-87.934375,30.657966],[-88.011052,30.685351],[-88.10416,30.499135],[-88.137022,30.318396],[-88.394438,30.367688],[-88.471115,31.895754],[-88.241084,33.796253],[-88.098683,34.891641],[-88.202745,34.995703],[-87.359296,35.00118]]]}},
  </code></pre>
  
  <p>I am using this to get the markers:</p>
  
  <pre><code>geojson = L.geoJson(statesData, {
      style: style,
      pointToLayer: function (feature, latlng) {
                      return L.marker(latlng, {icon: myIcon});
      },
      onEachFeature: onEachFeature
  }).addTo(map);
  var myIcon = L.icon({
  iconUrl: 'https://www.thekeithcorp.com/wp-content/themes/JointsWP-CSS- master/assets/images/4096-200.png',
  iconSize: [32, 37],
  iconAnchor: [16, 37],
  popupAnchor: [0, -28]
  });
  </code></pre>
  
  <p>I tested to make sure that icons can be added using this:</p>
  
  <pre><code>var marker = L.marker([37.8, -96]).addTo(map).on('click', function () {
          sidebar.toggle();
      });
  </code></pre>
  
  <p>and that works.  But I cannot get any icons to show on the map, any ideas on what I have done wrong?  </p>
  
  <p>What I want to achieve is when clicking on the icon, it opens the sidebar listing all the available properties in that state.  as you will see if you click on the icon I added using: </p>
  
  <pre><code>var marker = L.marker([37.8, -96]).addTo(map).on('click', function () {
          sidebar.toggle();
      });
  </code></pre>
  
  <p>This is a link to the map:  <a href="https://www.thekeithcorp.com/interactive-map-1/" rel="nofollow noreferrer">https://www.thekeithcorp.com/interactive-map-1/</a></p>
  
  <p>Any help would be appreciated!</p>