JSFiddle - React, Tailwind, and code Playground

by Justin Maat

HTML

<script src="http://leaflet.cloudmade.com/dist/leaflet.js"></script>
<link rel="stylesheet" href="https://npmcdn.com/[email protected]/dist/leaflet.css">
<script src="https://npmcdn.com/[email protected]/dist/leaflet.js"></script>
<body>
    <div id="map" style="width: 100%; height: 100%"></div>
</body>

CSS

html, body {
    margin: 0;
    width: 100%;
    height: 100%;
}

JavaScript

var map = new L.Map('map');
var tilelayer = L.TileLayer("http://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}", {
        maxZoom: 18
    });

map.setView(new L.LatLng(-23.550520, -46.633309), 8).addLayer(apple);

//map.addStripesPattern();

L.polygon([
    [-23.427089, -46.903848],
    [-23.427089, -46.230935],
    [-23.755561, -46.230935],
    [-23.755561, -46.903848]
], {
    color: 'url(#p1)'
}).addTo(map);