TWebbrowser very slow to load real time markers from local google map HTML

If you get your javascript from an external file it will get cached, so no, that probably won't slow you down much, except for the first time maybe.

Probable causes for slowness, and suggestions to speed things up:

• TWebBrowser wraps Internet Explorer, which is not exactly famous for its raw speed when it comes to this type of task; If you want fast JavaScript handling, consider DelphiChromiumEmbedded

• If you draw a marker every two seconds, you'll have to draw 1800 markers for a one-hour drive. If you want to show multiple trips, it's just going to be a heavy task to draw all the icons with alpha-transparency and all.

I usually draw a marker (arrow with driving direction) every 2 minutes, or if more than 200m has been travelled since the last marker. That way you don't have to draw a whole cloud of markers when a car is standing still.

You can use douglas-peucker algorithm to simplify the line. As a parameter you'll give a maximum error that you allow in the line, and it'll remove as many points as possible without exceeding that error. So, when you have a straight line, it'll remove all points between the edges.

Also, you can consider clustering points at certain zoomlevels. If you would use OpenLayers instead, it would be easier, but with the help of the Google Maps Util Library you can do the same with Google Maps (Example). If you zoom out, it's a bit useless to draw 2000 overlapping icons on an area of 10x10 pixels.

If you show me your code, I can give you some more direct advice on how to speed things up.

Here is my Delphi code :

  i := 0;  With DMMain.MDMain do  begin    QLastPositionGPS.Close ;    QLastPositionGPS.Open ;    QLastPositionGPS.First ;    for i:=0 to QLastPositionGPS.RecordCount-1 do    begin      GPSLatitude     := StringReplace(QLastPositionGPS.FieldByName('latitude').AsString, ',', '.', [rfreplaceall]) ;      GPSLongitude    := StringReplace(QLastPositionGPS.FieldByName('longitude').AsString, ',', '.', [rfreplaceall]) ;      HeureDernierGPS := QLastPositionGPS.FieldByName('maj').AsString ;      MDMain.QGPSactifs.Close ;      MDMain.QGPSactifs.ParamByName('id_artisan').AsInteger := MDMain.QLastPositionGPS.FieldByName('id_artisan').AsInteger ;      MDMain.QGPSactifs.Open ;      if MDMain.QGPSactifs.FieldByName('etat').AsBoolean = True then      begin         CdrCarto.Chromium1.Browser.MainFrame.ExecuteJavaScript('AjouterMarqueurCirculant('+ GPSLatitude + ', ' + GPSLongitude + ', ' + MDMain.QLastPositionGPS.FieldByName('id_artisan').AsString + ')', 'about:blank', 0) ;      end else if OptionDisplayGPSActif then        if (MDMain.QGPSactifs.FieldByName('etat').AsBoolean = False) and (MDMain.QGPSactifs.FieldByName('etat_serveur').AsBoolean = True) then        begin         CdrCarto.Chromium1.Browser.MainFrame.ExecuteJavaScript('AjouterMarqueurGPS('+ GPSLatitude + ', ' + GPSLongitude + ', ' + MDMain.QLastPositionGPS.FieldByName('id_artisan').AsString + ')', 'about:blank', 0);        end;      QLastPositionGPS.Next ;      MDMain.QGPSactifs.Close ;    end;    QLastPositionGPS.Close ;  end;end;

and my Javascript code :

 function AjouterMarqueurCirculant(Lat, Long, notaxi) {    var marker = new MarkerWithLabel({      position: new google.maps.LatLng(Lat, Long),       draggable: true,       map: map,       labelContent: "Taxi "+notaxi,       labelAnchor: new google.maps.Point(22, 0),       labelClass: "labelsactif",                      // the CSS class for the label       labelStyle: {opacity: 0.75},       labelVisible: true,      icon:"icones/taxi_circulant_ok.png"     });     var iw = new google.maps.InfoWindow({       content: "Nom Prenom"     });     google.maps.event.addListener(marker, "click", function (e) { iw.open(map, marker); });    markersCirculant.push(marker);    bounds.extend(new google.maps.LatLng(Lat, Long));  }