COMPUTATION AND PROBLEM SOLVING

Exercise 29: Markers and Icons

Name: ____________________________________

PURPOSE

The purpose of this assignment is to give you practice creating multiple custom Google Map icons.

ACTIVITIES

Perform each of the following activities. If you have questions, issues, or doubts, please ask for help. Do not just guess.

1. Unzip the file C29_P03_Baseline.zip

2. Use the index.html file inside C29_P03_Baseline as your starting point

3. Write all of your JavaScript in an external file named script.js

4. Give the page the following title: “Parallax Global — World Offices”

5. Set the map’s zoom level to 3

6. Write an array that will store the following 5 locations in a variable called “worldOffices”

   1. London (51.510165, -0.135173)

   2. New York (40.760375, -73.972754)

   3. Paris (48.873327, 2.297117)

   4. Moscow (55.769469, 37.597066)

   5. Singapore (1.301155, 103.854528)

7. Use the iconMarker.png file inside the C29_P03_Baseline/images folder as the marker icon for the five global offices.

8. Set to markers title to be the name of the city

9. Center the map on (30, 20)

10. Make a sixth marker that is draggable

    1. Position the draggable marker at the following coordinates (34, -41). You will need to add this location to your WorldOffices array.

    2. Set the sixth marker’s title to be “The Next Parallax Global Office”

    3. Use the iconDrag.png file inside the C29_P03_Baseline/images folder as the sixth marker’s icon

11. Save your work to a zip file and upload it to the LMS