The Retina Tiles API can be integrated with the free open source javascript library Leaflet JS to display a map on a website. **Quick Start Guide:** 1. Register at RapidAPI (it's free!) 2. Subscribe to a plan at https://rapidapi.com/MapTilesApi/api/retina-tiles/pricing/ 3. Fetch your RapidAPI key (you'll find it on https://rapidapi.com/MapTilesApi/api/retina-tiles/ if you are signed in) 4. Replace YOUR-RAPIDAPI-KEY with your api key (obtained in 3.) in the following code example 5. Copy the following html, js and css code examples into your website code. **HTML code included in the head of your html docoument** ```html ``` **HTML code to include where the map should be displayed** ```html

``` **CSS to add for the map div:** ```css #map { height: 360px; } ``` **Javascript code to initialize the map (here you'll have to replace the API key (see 4. above):** ```javascript var map = L.map('map').setView([51.5, -0.1], 12); L.tileLayer('https://retina-tiles.p.rapidapi.com/local/osm{r}/v1/{z}/{x}/{y}.png?rapidapi-key=YOUR-RAPIDAPI-KEY', { attribution: 'Tiles ©: Retina Tiles API, Map data © OpenStreetMap contributors', maxZoom: 19 }).addTo(map); ``` Test your map in your browser. If the map does not load, please double check that the above javascript code is loaded after the css and js file references in the html head and after the div with the id "map" in the html body code. If you still don't get the map to load, don't hesitate to shoot us a mail at support@maptilesapi.com to get help (please include a link to a publicly accessible page where you try to integrate the map - can be an e.g. jsfiddle example as well).