title: Add marker to google map after map is initialised
body: <p>I’ve got a c# wpf project using a webbrowser control to host a google map. Note this is NOT an asp project. </p>
  
  <p>If I add markers during the initialize routine they work. If I call the same routine later from c# using InvokeScript then it doesn’t work. </p>
  
  <p>I’m hopeful of having a page where my c# code can add/remove/update markers as required by calling various javascript functions.</p>
  
  <p>I'm not strong with javascript and I suspect there is something key that i'm not understanding.</p>
  
  <p>Pertinent parts:</p>
  
  <pre><code>&lt;script type="text/javascript" src="http://maps.google.com.mx/maps/api/js?sensor=false&amp;language="es""&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
  
  var markersArray = [];
  var gmap;
  
  function initialize() {
      var latlng = new google.maps.LatLng([GLAT], [GLONG]);
      var myOptions = {
          zoom: [ZOOM],
          center: latlng,
          mapTypeId: google.maps.MapTypeId.ROADMAP
      };
  
      gmap = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
  
  [MARKERLOCATIONS]
  
  }
  
  function AddMarker(Latitude, Longitude, Description) {
  
      var latlng = new google.maps.LatLng(Latitude, Longitude);
  
      var marker = new MarkerWithLabel({
          position: latlng,
          map: gmap,
          title: Description,
          labelContent: "1",
          labelAnchor: new google.maps.Point(7, 30),
          labelClass: "labels",
          labelInBackground: false
      });
  
  &lt;/script&gt;
  
  &lt;body onload="initialize()"&gt;
    &lt;div id="map_canvas" style="width:100%; height:100%"&gt;&lt;/div&gt;
  &lt;/body&gt;
  &lt;/script&gt;
  </code></pre>
  
  <p>I replace [GLAT], [GLONG] and [ZOOM] with actual co-ordinates and zoom. More on [LOCATIONS] shortly.</p>
  
  <p>MarkerWithLabel is Gary Little’s code <a href="http://code.google.com/p/google-maps-utility-library-v3/source/browse/tags/markerwithlabel/1.1.8/src/markerwithlabel.js" rel="nofollow">http://code.google.com/p/google-maps-utility-library-v3/source/browse/tags/markerwithlabel/1.1.8/src/markerwithlabel.js</a></p>
  
  <p>If I replace [MARKERLOCATIONS] with the following I get my desired marker on the page</p>
  
  <pre><code>AddMarker(51.47,0,"Greenwich")
  </code></pre>
  
  <p>Repeating this statement with different co-ordinates gives me as many markers as I want.</p>
  
  <p>If I remove [MARKERLOCATIONS] and instead in c# do the following, it doesn’t work (gmap is the wpf webbrowser):</p>
  
  <pre><code>gmap.LoadCompleted += new LoadCompletedEventHandler(gmap_LoadCompleted);
  
  void gmap_LoadCompleted(object sender, NavigationEventArgs e)
  {
      // Add markers
      foreach (Marker myM in ListMarker)
      {
          Object[] CallArgs = new Object[3];
          CallArgs[0] = myM.Latitude.ToString();
          CallArgs[1] = myM.Longitude.ToString();
          CallArgs[2] = myM.ShortDescription;
          object dummy = gmap.InvokeScript("AddMarker", CallArgs);
      }
  }
  </code></pre>
  
  <p>For debugging purposes I put an alert in AddMarker and the values I pass in turn up; I also created a function to loop through the contents of markersArray:</p>
  
  <pre><code>function ReportGPS() {
      if (markersArray) {
          for (var i = 0; i &lt; markersArray.length; i++) {
              //remove the marker from the map
              alert(markersArray[i].toString());
          }
      }
  }
  
  
  public void Test()
  {
      object dummy = gmap.InvokeScript("ReportGPS");
  }
  </code></pre>
  
  <p>If I add say 5 markers, then ReportGPS gives me 5 alerts. </p>
  
  <p>So it’s like they are simply not being added to the map. Again, if the AddMarker is called from the initialise function it works.</p>
  
  <p>What am I missing ?</p>