Problem

There was a need for a map with multiple marker pins in it. Preferrably a map which supports zooming. Preferrably without searching every single location by hand. Thus, Google Maps seemed to be a usable solution. Then I started to search for methods of adding multiple pins to a map. Adding one pin is easy and a resulting map can be forwarded as link containing coordinates. Multiple Markers -- not. Unless you have a Google Account (which was not a solution) providing both an option to maintain personalized maps containing several pins and providing an API key which seemed necessary to do any map modifications.
At least not without JavaScript.
Using JavaScript opened a whole new world as Google learned that it is unmanagable to keep people from reverse-engineering Google Maps and using or modifying the code. E.g. to display multiple markers. Thus, they did the only right thing: They documented it. Finally, I had a very small HTML-file containing markers:

<!DOCTYPE html>
<html>
  <head>
    <title>Karte mit mehreren Markern</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <style>
      html, body, #map_canvas {
        margin: 0;
        padding: 0;
        height: 100%;
      }
    </style>
    <script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
    <script>
      var map;

      function initialize() {
        map = new google.maps.Map(document.getElementById('map_canvas'), {
          zoom: 9,
          center: new google.maps.LatLng(53.836322,12.672729),
          mapTypeId: google.maps.MapTypeId.ROADMAP,
        });


        function addMarker(feature) {
          var marker = new google.maps.Marker({
            position: feature.position,
            map: map
          });
        }

        var features = [
// Demmin, 17109
{ position: new google.maps.LatLng( 53.901183,13.054065  ) },
// Schwerin, 19053
{ position: new google.maps.LatLng( 53.6249376,11.4085339  ) },
// Wismar
{ position: new google.maps.LatLng( 53.8979416,11.4516022  ) },
// Rostock, 18057
{ position: new google.maps.LatLng( 54.09010379999999,12.1058668  ) },

        ];

        for (var i = 0, feature; feature = features[i]; i++) {
          addMarker(feature);
        }
      }

      google.maps.event.addDomListener(window, 'load', initialize);
    </script>
  </head>
  <body>
    <div id="map_canvas"></div>
  </body>
</html>
I admit it, it's a modified version of the map API intro example provided by Google. Anyhow, it works only if you know coordinates.

Getting Longitude and Latitude for given Addresses

Since geopositions do not change over night (it's not as if I wake up and Rostock has moved from the Baltic Sea to the Indian Ocean), it makes perfect sense to specify marker positins using langitude and latitude. This approach features one ugly drawback: Somewhen, location names have to be resolved to coordinates. Of course, one may now enter the address into Google Maps Search Field and extract the coordinates from a link URL. This may work with, say, ten addresses. But you do not want to do this for more then fifty items. Especially, if you have herard any lecture in Computer Science. There must be a way to automatize this.
Fortunately, there is a way using Google. Limitation is that you can send only 2500 requests per day. Using one IP. So you should not embed this into some site to resolve addresses on user action but it works perfectly fine to prepare a map with markers. The details of the URL are documented at https://developers.google.com/maps/documentation/geocoding/ -- and I used it as follows:

#! /usr/local/bin/bash

while  read ADR 
do
        echo "//" $ADR
        curl "http://maps.googleapis.com/maps/api/geocode/json?sensor=false&address=$ADR, Germany" 2>/dev/null | tr '\n' ' ' | sed 's/  */ /g' | sed 's/.*location" : { "//' | sed 's/}.*//' | sed 's/lat..: //' | sed 's/ "ln.*: //' | sed 's/\(.*\)/{ position: new google.maps.LatLng( \1 ) }, /'
done
The script will append , Germany to every entered line and then send it as an address. The returned JSON is parsed painfully using shell friends tr and sed. Of course, several sed calls could be merged but honestly, I did not care. The output is formatted to be inserted into the above JavaScript -- complete with preceeding comment specifying what these coordinates represent. Anyway, one could also evaluate the returned JSON more carefully. And check, e.g., for an error message. Well, it's a works-for-me-thing.
Hint: In Germany, you may want to append the Postleitzahl to the location name. Thus, a use case could look as follows:
Schwerin, 19053
// Schwerin, 19053
{ position: new google.maps.LatLng( 53.6249376,11.4085339  ) }, 

Stichworte:


Impressum