Maps Design and Development Notes

By peterm, 9 April, 2011

Tags

Design Notes for Campus Maps

Link to OpenLayers Notes

Design Questions for Discussion

Click the Home link to demo.

Here are my notes for what we're learning in integrating Google maps, Drupal and associated modules to give an example similar to the interactive map at Cornell;http://www.cornell.edu/maps/interactive.cfm.

Modules Used

I've installed the following modules based on the tutorial at, http://www.drupaltherapy.com/gmap

  • Gmap
  • Gmap Addons
  • Location
  • CCK
  • Views

I added the third party javascript file, egeoxml.js to the gmaps_addons/gmap_overlay/thirdparty directory so that the overlay module can read a KML file and place points on (over) our existing points. This would be useful in creating a Parking layer or a information booth layer or a cafe (food) layer.

One of the apparent limitations of the modules is that in reading a local KML file, we are only able to use a default placemarker. Ideally, we'd use a "P" for parking, "I" for info, a house for housing, etc. Not sure if this is a configuration issue or a KML validity issue.

Tasks

  1. I created a block in Views to hold the titles of the nodes (stories) we've created. I modified a copy of Garland (garland_maps) and edited the style.css file to use a scroll for that block.
  2. I've created a MyUCSC map at maps.google.com and marked it private. I've been working with placing points (Parking) and then using the Google Earth download link to create a MyUCSC.kml file. We're going to want to use Google Earth to add our points, then create an XML file of the coordinates and associated info that lives locally with our interactive map. The overlay module can then read the KML file using the egeoxml.js library and place the points. My office workstation is too old to run Google Earth. My laptop doesn't have dual 23" monitors... so, we're doing some work on both.
  3. Provide Google with updated maps.
  4. Guiding principles on consistency in pin/location marking need to be developed.
  5. Develop user interface for overlay options.
  6. Collect various UI interface examples for overlay options.
  7. Create a maps-dev drupal instance and DNS entires.
  8. Ask for a copy of code from Cornell.
  9. Using the View map_test, see how overlays created in a separate file are handled. http://ucscplant-dev.ucsc.edu/map_test. The big marker next to the parking structure is from a KML file, the little marker is from the Drupal node. - fixed
  10. Create a Parking content type. Add some Parking nodes. Create a view called parking_map and use the parkinglot.png maker. See http://maps-dev.ucsc.edu/parking-lot-map as an example.
  11. Create a gmap input filter and associate a gmap macro. See the Media Theater entry with 3 X's to understand what a macro can produce.
  12. Test for KML Overlay and Views. Created view map-test-detail. Add Engineering 2 as the node to show. Update Parking.KML file (which now shows a star paddle placemarker), but can become a Parking icon. See, http://maps-dev.ucsc.edu/map-test-detail for an example of 3 P icons using Parking.KML.
  13. The default nodes locations view that is built into the module works with displaying the Title, Body fields of the node. However, when view a node the info bubble shows up empty. There's lot's of discussion, but no apparent patch out. Patched gap with http://drupal.org/files/issues/gmap_662390_42.patch and it worked.
  14. Using jQuery and/or javascript, toggle KML based points on/off. Using egeoxml.js .hide(), .show(), you can see a toggle test at http://maps-dev.ucsc.edu/map-test-detail. We should probably try to embed this code in a jQuery call for a checkbox with a P icon next to it as a prototype.
  15. I was able to get a javascript snippet to run, but I'm not sure how to get the js object to take a new overlay. The thought was to create some javascript functions to load other KML files and a toggle function to turn layers on or off. Not working completely.
  16. Created taxonomy for Parking. Need to determine single taxonomy item or multiple items per node.
  17. Create taxonomy based views. Can we toggle between view pages? e.g., parking, metered, A?
  18. Research the possibility of using javascript to create additional js objects to hide(), show() using a single map object.
  19. Using this resource, http://gmap.chicagotech.org/map/macro you can create macros and then paste them into specific views to get the correct zoom.

References

 

Campus Map Examples