Print PDF
Favorite
Email
Step 2Create the html to hold the map
In this example I created 3 maps for Make: , shops, user locale & interesting places.
You can only put one MapKit per web page. After deciding the structure (3 maps = 3 pages) I started work on the code to contain the structure.
My design decisions:
1. I wanted a row of buttons across the top of the map which linked to each page
1.1 These buttons must change to indicate linking ability
2. I wanted the map to fit in the minimum basic screen size of 800x600 with the possiblility of advertising if I wanted. Therefore the max width of the map = 700.
2.1 I made the asthetic desicision to center the map
The diagram shows roughly how the code is laid out in the attached file 'makeloctaions.htm'
The <head> contains the javascript code used to animate the buttons as well as the code to define the style of the <body>
The <body> contains 3 main elements.
1. The 'body content' is essentially an empty container that holds the button & map containers. It has some code to make it float in the center of your browser
2. The 'menu' container holds the buttons
3. The 'platial_mapKit' container holds the code you got from the Platial map wizard and saved in the text file.
You can only put one MapKit per web page. After deciding the structure (3 maps = 3 pages) I started work on the code to contain the structure.
My design decisions:
1. I wanted a row of buttons across the top of the map which linked to each page
1.1 These buttons must change to indicate linking ability
2. I wanted the map to fit in the minimum basic screen size of 800x600 with the possiblility of advertising if I wanted. Therefore the max width of the map = 700.
2.1 I made the asthetic desicision to center the map
The diagram shows roughly how the code is laid out in the attached file 'makeloctaions.htm'
The <head> contains the javascript code used to animate the buttons as well as the code to define the style of the <body>
The <body> contains 3 main elements.
1. The 'body content' is essentially an empty container that holds the button & map containers. It has some code to make it float in the center of your browser
2. The 'menu' container holds the buttons
3. The 'platial_mapKit' container holds the code you got from the Platial map wizard and saved in the text file.
| « Previous Step | Download PDFView All Steps | Next Step » |
 |
Add Comment
|
