MapLibre GL JS

Estimated reading time: 2 minutes

Prerequisite

For all of our examples, you will need:

  • an API key and Jawg account (from the lab),
  • basic knowledge of JavaScript and HTML,
  • one style (default or custom style)

Get the library

There are several ways to get this library:

<link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/maplibre-gl.css" />
<script src="https://unpkg.com/[email protected]/dist/maplibre-gl.js"></script>

Attribution

Your map must display the following links: © Jawg Maps and © OSM contributors. This is a part or our General Terms and Conditions (5.6 Attribution Requirements).

  • Why are Jawg Maps attributions required?

    • As a provider you must credit our work. We do not approve of any use of content without proper attribution, in any circumstances, and we require attribution while the content is shown.
  • Why do I have to add OpenStreetMap (OSM) attributions too?

    • OSM is built by a community of mappers that contribute and maintain data all over the world. At Jawg Maps we are using OSM data that is licensed under the Open Data Commons Open Database License (ODbL) by the OpenStreetMap Foundation (OSMF). You are allowed to display OSM Data only if you are crediting OpenStreetMap and its contributors. Requests for exceptions will not be granted.
  • Why are OSM attributions so important?

    • Attribution encourages others to use OSM data by making obvious where it is coming from and under which conditions it can be used. It also helps recruit contributors and encourages them to contribute more, boosting a virtuous circle that maximises the quality of the map for everyone. It's a moral duty to give credit where credit is due.
  • How can I credit Jawg Maps and OSM?

    • The text must be easily readable and understandable, taking into consideration the font, size (greater than 10px!), colour, contrast, positioning and amount of time that it is visible. You can check the full OSM Attribution Guidelines.
  • What if I do not credit Jawg Maps or OSM?

    • If we find that your site is non-compliant on attributions, we will contact you via your account email. Without a reply from you we reserve the right to terminate your account as stated in the clause 5.7 Account termination from our GTCs.

This is our attribution template:

<a href="https://jawg.io?utm_medium=map&utm_source=attribution" title="Tiles Courtesy of Jawg Maps" target="_blank" class="jawg-attrib" >&copy; <b>Jawg</b>Maps</a> | <a href="https://www.openstreetmap.org/copyright" title="OpenStreetMap is open data licensed under ODbL" target="_blank" class="osm-attrib">&copy; OSM contributors</a>

Map Request Counter

Examples