Tutorial 1 - Creating The Simplest Map


BA3′s Altus Mapping Engine is a high performance, high capability engine that works in all environments: iOS, Android, Windows 8, OSX and the Browser. One big advantage of the browser version, however, is that you do not need to be a developer to play with it. Just about anyone can use the browser version of Altus to try things out. All you need is a Chrome or Firefox Browser running in Windows or OSX and a simple editor (e.g. Notepad in Windows will work).

For example, here is the HTML code for a very simple Browser map using Altus:

If you copy/paste this code into Notepad…

…and then save it on your desktop (or any folder) with the file name “Simple.html” (make sure “Save as type” is set to “All files” when you save it so that your file does not pick up an additional “.txt” extension), you can double-click on Simple.html and your map will appear in a browser.

The map opens up with the city of Raleigh, NC visible. What if you don’t like that? Find this line:

You can leave that line out if you like – you will be looking at the globe from a very high altitude centered over the United States. Or leave it in and change the lat/lon to pick a different location. Change the 30000 to pick a different zoom level. Try changing 30000 to 3000 or 100000 or 1000000 – try many values. Play around with it until you find a zoom level that you prefer. The 5 determines the animation duration. Try changing it as well.

This example uses the publicly available tile set from OpenStreetMap for its base map. This is the line that determines the tile set:

If you don’t like it, try Mapquest satellite tiles instead. For example, try:

If you have your own Mapbox tiles, you can use those. This is how you would do it:

In Tutorial 2 we will explore how to add markers to this map.

If you have any questions about the Altus Mapping Engine, any feature requests or suggestions for improving the Altus Mapping Engine, please send them to [email protected].