CODEWITHSUNDEEP
google-mapsleafletmapbox
Tony
Tony

Reputation: 653

How to use Leaflet Map for free?

Leaflet is open source and free. However the examples on leaflet site use Mapbox to render map. Mapbox is more expensive than Google map (Mapbox pricing). The question is: can anyone use Leaflet really free?

Upvotes: 15

Views: 18644

Answers (2)

I - Eagle Technology
I - Eagle Technology

Reputation: 1

You can also customize this map and remove distrobution watermarks anything

Upvotes: 0

iH8
iH8

Reputation: 28688

You can use the Leaflet library for free, only the tileprovider used in the examples, Mapbox, asks money for serving tiles. You just need a free tileprovider like OpenStreetMap for instance: 

var map = new L.Map('leaflet', {
    center: [0, 0],
    zoom: 0,
    layers: [
        new L.TileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
            'attribution': 'Map data © <a href="http://openstreetmap.org">OpenStreetMap</a> contributors'
        })
    ]
});
body {
    margin: 0;
}

html, body, #leaflet {
    height: 100%;
}
<!DOCTYPE html>
<html>
  <head>
    <title>Leaflet 1.0.3</title>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link type="text/css" rel="stylesheet" href="//unpkg.com/leaflet@1.0.3/dist/leaflet.css" />
  </head>
  <body>
    <div id="leaflet"></div>
    <script type="application/javascript" src="//unpkg.com/leaflet@1.0.3/dist/leaflet.js"></script>
  </body>
</html>

Upvotes: 36

Related Questions