Embedding a map in a website is easy, using eSpatial (sign up for a free trial here). All you have to do is copy one line of code and then paste it into the HTML source code of a page.
An example of how one eSpatial user embedded a map on a website.First step – create a map for free
Sign up for a free eSpatial trial, follow the step-by-step instructions here and you can be embedding maps in sites in minutes.
Where in eSpatial is the code to embed a map?
Open the map or report you’ve created in eSpatial and click the share button
If you have not saved the map, you will be asked to do so now.
On the next panel, select Shared Publicly. You have the options to make your map searchable and your data table visible.
Select Done and the embed code will be generated:
Now all you have to do is place this within the source code of a web page, and the map will be embedded there.
An offline example
I can show you how simple this process is, by creating an offline page, with a map embedded into it.
(Why not try it yourself? It will only take a few minutes.)
Here’s code for an eSpatial map I created earlier, which I’ve copied from eSpatial:
<iframe width=”600″ src=”https://maps.espatial.com/maps/_Map—Sales-Personnel/pages/map.jsp?geoMapId=52562&lp=c&TENANT_ID=131789″ frameborder=”0″ allowfullscreen></iframe><p>View a larger version of <a href=”https://maps.espatial.com/maps/_Map—Sales-Personnel/pages/map.jsp?geoMapId=52562&TENANT_ID=131789″>Map – Sales Personnel</a> created with <a href=”https://eSpatial.com”>eSpatial mapping software</a>.</p>
Open WordPad (Notepad on a Mac) and paste the eSpatial code into it.
Next go to File> Save As and save it as a html file. (type in .html after your assigned title, so that it can later be opened by a web browser – e.g Map.html instead of Map.)
Once you’ve saved the file, go to your internet browser, File>Open and find the file you’ve created. That one line of code you pasted in the WordPad page results in an interactive map in your browser. The same principle of pasting code applies when adding it to a live web-page, as long as you can edit the source code.
This blog entry is created in WordPress and the result of pasting the code into it is the interactive map below.
Log on to eSpatial or, if you haven’t done so already, sign up for a free trial and start embedding data maps in your website.