- Create a brand new empty text file and save it on your computer as testmap.html. Make sure it doesn’t have a .txt extension. Don’t use a word processor like MS Word to make this file; use a real basic text editor like Windows Notepad.
- Open testmap.html and paste the following code. Don’t worry about what it all means. You will just need to modify two lines of this code to get your own Mapbox map to display inside:
- In the Mapbox website, click the Share... button for your style. Navigate to the Third Party section and choose CARTO in the dropdown list (the CARTO specs should be compatible with Leaflet). Copy the integration URL.
- Paste the Leaflet URL in the line of code above that says PASTE YOUR URL INSIDE THESE SINGLE QUOTES.
- Find the line above that begins with map.setView and replace the latitude and longitude with the coordinates of the center of your town or area of interest you mapped. If you fail to do this, the map will show my hometown instead of yours. You should be able to see your lat and lon in the header bar in the Mapbox editor.
- Save the changes you made to testmap.html.
- From Windows Explorer or your file browser, double-click testmap.html to open it in a browser. You should see your Mapbox map inside. Note that you must be connected to the Internet for this step to work because the above code is configured to retrieve the Leaflet API online (rather than from your own machine).