JSFiddle - React, Tailwind, and code Playground

by webstax

HTML

<script src="https://api.tiles.mapbox.com/mapbox.js/v1.6.3/mapbox.js"></script>
<link rel="stylesheet" href="https://api.tiles.mapbox.com/mapbox.js/v1.6.3/mapbox.css">
<div id='map'></div>

CSS

body { margin:0; padding:0; }
  #map { position:absolute; top:0; bottom:0; width:100%; }

JavaScript

var myData = [
  {
    "type": "Feature",
    "geometry": {
      "type": "Point",
      "coordinates": [4.509373,51.932994]
    },
    "properties": {
         "marker-size": "large",
         "marker-color": "#ffcc00"
    }
  }
];

var map = L.mapbox.map('map', 'examples.map-20v6611k')
    .setView([51.932994,4.509373], 8);

L.geoJson(myData, {
    pointToLayer: L.mapbox.marker.style,
    style: function(feature) { return feature.properties; }
}).addTo(map);