Creating Editable Google Maps

Articles —> Creating Editable Google Maps

sierra topo map with editable markers

Several months ago I was approached and asked to write a framework that allows multiple users to add and edit markers to a google maps user interface. It all started after a member if a community forum I participate in - High Sierra Topix - suggested a map of the area would be a great resource for information to help users plan their camping, hiking, fishing, and backpacking trips. Making the map editable would be even more powerful, as it would allow members of the community to add or edit information as appropriate - almost in a wiki like format.

I set off running with the idea, looking for ways to accomplish the needs. Laying out the major requirements, I was left with the following:

  • Topographics Maps - extremely useful and the typical navigation tool when hiking.
  • Overlays on top of the map, marking positions and containing information associated with the location.
  • Multiple Categories for markers to facilitate organization
  • User Editing - ideally integrated with phpBB forum software
  • Search capabilities
  • User interface design for editing, navigating, searching, etc…

These requirements were just the tip of the iceberg. The biggest requirement - how do we provide maps? An easy choice: google maps provides a user friendly and dynamic map, with excellent documentation for the developer. I have worked with google maps in the past for my photography website to mark photo locations, and thus was already familiar with the API. How to store the map data? MySQL was already established on the server and, given the relational format of the data, made that choice simple. How to integrate the database and the map? This required a bit more thought. Given integration with phBB3 forums was a requirement, I went with php. However, google maps is javascript based, so a bridge between client side javascript and server side php was required. I decided a REST interface would be ideal - php would access the database and output the map information as XML, and javascript would access and parse that information through AJAX scripts.

After quite a bit of work laying out the SQL database and php class designs, writing code, laying out the user interface, testing and debugging, we were left with a platform that met our requirements. Topographic map overlays were made available through ArcGIS. Users within a particular phpBB3 forum group were allowed could add and edit markers through a user interface only they can see. Additions are immediately viewable to others. Any text entered into the system is indexed into specific SQL tables, and can be searched through a custom search engine I wrote. Markers were categorized for organization, with each category having a custom icon showing its location on the map, and markers in a given category can be dynamically added and removed from the map at the click of a button. Users can hover over a particular location, with only a particular category displayed, and link to this exact configuration using a provided URL that is updated dynamically on the webpage.

We were left with inputting the data, and with the help of other editors we were able to input all sorts of information gathered from disparate sources: books, topographic maps, forum contributions, etc…Some categories were added manually (such as cross-country passes, fishes lakes, waterfalls, resupply locations), others automated (such as USGS 7.5" map locations). The best part is that it is an ongoing process. When one travels through a particular location they can bring back valuable information that can be added to the map. We have consolidated information previously difficult to find in one location, and have an even easier time trip planning and daydreaming.

editable google maps


  • James Yellop   -   January, 14, 2017

    Hello, I am interested in doing something basically exactly the same as you have but for a different purpose. Is there any way you could help me in setting this sort of thing up? Thank you

Back to Articles

© 2008-2017 Greg Cope