• Like


Flash Player 9 (or above) is needed to view presentations.
We have detected that you do not have it on your computer. To install it, go here.

What's that Building? Using Google's Map API to Create a Campus Map

Uploaded on

Google is the leader in Internet search engines. It has also surpassed many of its competitors in mapping and directions services. Unlike some other web mapping sites, Google has exposed its …

Google is the leader in Internet search engines. It has also surpassed many of its competitors in mapping and directions services. Unlike some other web mapping sites, Google has exposed its underlying data through an extensive API. This API lets us create dynamic map displays and applications suitable for desktop and mobile devices alike.

During this session I will describe our experiences in creating a campus Google map. In the spirit of this year's UNC CAUSE, we will describe how we used the expertise of many campus departments and individuals to improve the map for all users. We will also describe how we were able to make use of Google's hosted maps to allow for collaborative mapping without requiring any programming experience. Other areas of discussion include: soliciting feedback and corrections for your maps, encouraging participation to avoid stale data, and creating a balanced team to implement your own maps sites.

In addition to the always important user experience issues, we will describe the technologies available from Google and others to rapidly deploy maps to your university Web site.

More in: Technology , Education
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads


Total Views
On Slideshare
From Embeds
Number of Embeds



Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

    No notes for slide


  • 1. What’s That Building?
    Using the Google Maps API to Create a Campus Map
  • 2. About Me
    Technology Consultant, East Carolina University
  • 3. Going From
    To This
  • 4. What did we do?
  • 5. Research
    Why create a new campus map?
    Who offers maps?
    How can we create map instances?
    What information goes on map?
    Where is information that goes on map?
  • 6. Why create a new map?
    To get from here
    To here
  • 7. Why create a new map?
    Increasing power of desktop web browsers
    Increasing power of mobile devices
    Improved real world navigation
    Improved marketing of University
    Improved experience for visitors
    Gartner says so
  • 8. Who offers online maps?
    OpenStreetMap Maps
    MapQuest Maps
    Yahoo Maps
    Bing Maps
    Google Maps
  • 9. Who offers online maps?
    OpenStreetMap Maps
  • 10. Who offers online maps?
    MapQuest Maps
  • 11. Who offers online maps?
    Yahoo Maps
  • 12. Who offers online maps?
    Bing Maps
  • 13. Who offers online maps
    Google Maps
  • 14. How can we create map instances?
    OpenStreetMap Maps
    MapQuest Maps
    Yahoo Maps
    Bing Maps
    Google Maps
  • 15. How can we create map instances?
    URLs with query strings (“static maps”)
    URLs to third party sites
    HTML / CSS / JavaScript
    Adobe Flash
    Microsoft Silverlight
    OS Specific SDK
  • 16. Platform Decision – Jan 2009
    Google Maps API
    Most advanced and stable
    Base tile layer most developed
    Most original documentation
    Most third party examples and tutorials
    Most third party API extensions
  • 17. Platform Decision – Jan 2009
    JavaScript API
    Team’s experience with HTML / CSS / JavaScript
    No third party browser plug-in
    Operating system agnostic
    Simple development environment
    Control of branding and user experience
  • 18. What Information Goes On Map?
    Food / Dining
    Visitor information
    Emergency resources
    More (and more and more…)
  • 19. Who has the information that goes on map?
    Campus Facilities / Operations
    University Marketing
    University Publications
    Housing / Parking / Transit Offices
    Campus Police / Safety
    IT Department(s)
    City / County / State Government
  • 20. Getting Data
    Reach out to map stake holders
    Find person responsible for existing data
    Find person responsible for maintaining data
    Politely request data files and/or feeds
    Determine how to get updates to data files
    Ask if existing systems have APIs
  • 21. Data – You’re soaking in it
    Adobe Acrobat files
    CAD files
    Map image files (GIF, PNG, JPEG…)
    Adobe Flash files
    Location image files
    Text files
    Spreadsheet files
    RDBMS databases
    XML / JSON feeds
  • 22. Coping With Data – Project
    Make building points your first iteration
    Choose source(s) of building information
    Use static data for building information
    Leave additional layers for future iterations
    Leave dynamic data for future iterations
  • 23. Coping With Data - Code
    Tenets of Open Source (and online maps!)
    Release Early
    Release Often
    Update continuously
    Add incremental features / views / data
  • 24. Coping With Data
    Google.com My Maps
  • 25. Google.com Map Benefits
    No coding experience needed
    Multi-user collaboration tools
    Exposed and exportable data
    Data privacy controls
    Increased visibility on default Google maps
    Can embed and link maps immediately
  • 26. Self Hosting 101
    Create standard HTML page with branding
    Use Google’s embed code to load map
  • 27. Self Hosting 201
    Get KML file from your Google Map
    Create HTML page with “Hello World” Map
    Change lat / long of map center to your campus
    Change zoom level to cover desired area
    Add KML layer using API
  • 28. Self Hosting Grad. Colloquium
    Consume raw XML, RSS, JSON to add layers
    Create markers, polygons dynamically
    Add dynamically visible layers
    Add search functions
    Add query string parsing
    Use maps API tools to add advanced widgets
    Add geolocation, panoramas, and directions
  • 29. The Perfect Team
    Graphic Designers
    Web UI / UX specialists
    Web programmers (client and server side)
    Human factors specialists / testers
    Geographers / Urban planners
  • 30. The “I don’t have that” Team
    Web programmer
    Graphic designer
  • 31. The “No, really, I don’t have that” Team
    Faculty / Staff PM
    Tech savvy student
    Never underestimate the motivation of a bored, talented student to be paid for real world resume improving experience.
  • 32. Remember Data Contributors
    Data owners are stakeholders
    Want additional visibility maps provide
    Want their area presented accurately
    Want their area presented well
    Prototypes, prototypes, prototypes
  • 33. Tools to Help
    JavaScript libraries
    jQuery, MooTools, Prototype, Dojo
    Google Maps Utility Library v3
    Google Maps Mashup Creators
  • 34. Crowdsourcing Updates
    Need simple, fast, friendly update request
    Need way to simply propose edits
    Provide editable version of current data
    Rich Text Editors are your friend
    Package original, proposed update, diff off to active map maintainers
  • 35. Resources
    Google Maps Documentation
    Google Maps API Tutorial
    Using the Google Maps API V3
    Official Google Maps API Blog
    Google JavaScript Maps API V3 Google Group
    Stack Overflow
  • 36. Photo Credits
    B’s Barbecue Road Sign
    Flickr: E Wayne
  • 37. Questions? Feedback?