MapQuest OpenAPI – part 2 – Show map using address

Welcome to the part 2 🙂 (in case you didn’t read the first part please go back, read it and return here)!
Now we will write the first pieces of code, so let’s start ….
Open your HTML editor and insert the code below into the HEAD section (between <head> and </head>) :

Don’t forget to replace YOUR_API_KEY with your real API key, if you don’t do this the script will raise an error : “Error : 9902 – There was a problem with your referer/key combination”.
Now, on the BODY section (between <body> and </body>) insert a DIV tag (the map will be drawn there) :

Now comes the most important part … the JavaScript code :
We must follow some simple rules :

  • Create an MQMap object – it will store our map. As a parameter we must write the ID of the DIV tag where we want the map to appear.
  • Create an MQLocation object – it will tell the main server details about which map to show. You can set the address, city, state, zip code, country using the following functions :
    • setAddress
    • setCity
    • setStateProvince
    • setPostalCode
    • setCountry
  • Call the getMap function of the MQMap object

Here is an example of all from this tutorial :

Basic Map With Points

You can see a working demo here.

An example of using MapQuest API

I hope you liked this small tutorial 😀

2 comments on “MapQuest OpenAPI – part 2 – Show map using address

  1. For the basic levels of map this code is fantastic.

    Actually I want to do same thing which is there in the demo like zooming ,display points on map etc.
    But i donot want to use any of the functions from googlemap or from any other source.

    I want to do it from scrach means I have to write my own javascript function for which adds points on map,dragging of map with points and zooming .
    If you have any idea about this please reply me immediately.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.