JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://cdn.leafletjs.com/leaflet-0.6.4/leaflet.js"></script>
<link rel="stylesheet" href="http://cdn.leafletjs.com/leaflet-0.6.4/leaflet.css">
<div id="map"></div>

CSS

body{
	margin: 0;
	padding: 50px;
}
#map{
	background: #5A8CBD;
	height: 600px;
	width: 100%;
}

JavaScript

// инициализация карты (начальные точки, зуминг)
var map = L.map("map", {
	// основные настройки
	zoom: 1,
	minZoom: 1,
	maxZoom: 5,
	crs: L.CRS.Simple,
	
	// элементы управления
	attributionControl: false
}).setView([0, 0], 1);

// бешеный контрол
L.control.scale({imperial: false}).addTo(map);

// спасибо тебе stackoverflow!
var southWest = map.unproject([0, 5120], map.getMaxZoom());
var northEast = map.unproject([10240, 0], map.getMaxZoom());
map.setMaxBounds(new L.LatLngBounds(southWest, northEast));

// добавляем слой с тайлами
L.tileLayer("http://spix.ru/leaflet-map-test/{z}.png", {
	continuousWorld: false,
	noWrap: true
}).addTo(map);