Adding a marker to GMaps (google maps)

Question

I'm trying to use this tool: http://software.stadtwerk.org/google_maps_colorizr/ to add colour to my google map, here is my example:

http://jsfiddle.net/xUUxn/851/

The colour works fine, but now I can't seem to add any markers to it, I've tried putting this example code in:

map.addMarker({ 
  lat: -12.043333,
  lng: -77.028333,
  title: 'Lima',
  infoWindow: {
    content: '<p>HTML Content</p>'
  }
 });

But it doesn't seem to work, I'm not entirely sure where to put it or even if the references are correct.

Answer 1

In order to create a marker you need to do the following:

Demo forked from your example: http://jsfiddle.net/lucuma/xUUxn/852/

JS:

var marker = new google.maps.Marker({
        position: new google.maps.LatLng( -12.043333,-77.028333),
        map: map,
        title: 'Hello World!'
    });

To add an info window overlay:

var contentString = '<div id="content"><h1>Overlay</h1></div>';
  var infowindow = new google.maps.InfoWindow({
            content: contentString
  });


google.maps.event.addListener(marker, 'click', function() {
          infowindow.open(map,marker);
        });

Answer 2

The documentation says:

var marker = new google.maps.Marker({
   position: new google.maps.LatLng(0,0),
   map: map,
   title:"Hello World!"
});

In your Fiddle: http://jsfiddle.net/xUUxn/854/

Answer 3

I was able to use a loop, by this using 'this' as second parameters to to infoWindow.open()

google.maps.event.addListener(marker, 'click', function() {
    infowindow = new ....;
    infowindow.open(map,this);
});