javascript - 无需单击按钮即可在 TWebBrowser(Google map )中显示位置

标签 javascript google-maps delphi

如何在 Google map 中显示位置,而无需单击 Delphi/Windows 应用程序中的按钮?当用户单击客户表单上的“显示位置”按钮时,我尝试传递地址。目前,如果用户单击“显示位置”按钮,则会传递地址,但在打开 ViewMaps 表单时不会显示该位置。但是,一旦显示 ViewMaps (TWebBrowser) 表单,并在备注框中显示“1 Infinite Loop, Cupertino, CA 95014”地址,用户就可以单击“GoToAddressBtn”按钮,然后就会显示该位置。

那么,如何获取要在 Google map 上显示的位置,而无需用户单击 ViewMaps 表单上的“GoToAddressBtn”按钮呢?

   implementation

Uses ShredMain, ActiveX;

{$R *.dfm}

const
HTMLStr: AnsiString =
'<html> '+
'<head> '+
'<meta name="viewport" content="initial-scale=1.0, user-scalable=yes" /> '+
//'<meta http-equiv="X-UA-Compatible" content="IE=edge" />'+
'<script type="text/javascript" src="http://maps.google.com/maps/api/js?v=3"></script> '+
'<script type="text/javascript"> '+
''+
''+
'  var geocoder; '+
'  var map;  '+
//'  var address;  '+
'  var trafficLayer;'+
'  var bikeLayer;'+
'  var markersArray = [];'+
''+
''+
'  function initialize() { '+
'    geocoder = new google.maps.Geocoder();'+
'    var latlng = new google.maps.LatLng(40.714776,-74.019213); '+
//'    var address = "San Diego, CA";'+
'    var myOptions = { '+
'      zoom: 11, '+
'      center: latlng, '+
'      mapTypeId: google.maps.MapTypeId.ROADMAP '+
'    }; '+
'    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); '+
'    trafficLayer = new google.maps.TrafficLayer();'+
'    bikeLayer = new google.maps.BicyclingLayer();'+
'    map.set("streetViewControl", false);'+
'  } '+
''+
''+
'  function codeAddress(address) { '+
'    if (geocoder) {'+
'      geocoder.geocode( { address: address}, function(results, status) { '+
'        if (status == google.maps.GeocoderStatus.OK) {'+
'          map.setCenter(results[0].geometry.location);'+
'          PutMarker(results[0].geometry.location.lat(), results[0].geometry.location.lng(), results[0].geometry.location.lat()+","+results[0].geometry.location.lng());'+
'        } else {'+
'          alert("Geocode was not successful for the following reason: " + status);'+
'        }'+
'      });'+
'    }'+
'  }'+
''+
''+
'  function GotoLatLng(Lat, Lang) { '+
'   var latlng = new google.maps.LatLng(Lat,Lang);'+
'   map.setCenter(latlng);'+
'   PutMarker(Lat, Lang, Lat+","+Lang);'+
'  }'+
''+
''+
'function ClearMarkers() {  '+
'  if (markersArray) {        '+
'    for (i in markersArray) {  '+
'      markersArray[i].setMap(null); '+
'    } '+
'  } '+
'}  '+
''+
'  function PutMarker(Lat, Lang, Msg) { '+
'   var latlng = new google.maps.LatLng(Lat,Lang);'+
'   var marker = new google.maps.Marker({'+
'      position: latlng, '+
'      map: map,'+
'      title: Msg+" ("+Lat+","+Lang+")"'+
'  });'+
' markersArray.push(marker); '+
'  }'+
''+
''+
'  function TrafficOn()   { trafficLayer.setMap(map); }'+
''+
'  function TrafficOff()  { trafficLayer.setMap(null); }'+
''+''+
'  function BicyclingOn() { bikeLayer.setMap(map); }'+
''+
'  function BicyclingOff(){ bikeLayer.setMap(null);}'+
''+
'  function StreetViewOn() { map.set("streetViewControl", true); }'+
''+
'  function StreetViewOff() { map.set("streetViewControl", false); }'+
''+
''+'</script> '+
'</head> '+
'<body onload="initialize()"> '+
'  <div id="map_canvas" style="width:100%; height:100%"></div> '+
'</body> '+
'</html> ';

procedure TViewMaps.Timer1Timer(Sender: TObject);
var
  aStream: TMemoryStream;
begin
  Timer1.Enabled:= False; //Disable timer so it doesn't fire again
  WebBrowser1.Navigate('about:blank');
  if Assigned(WebBrowser1.Document) then
  begin
    aStream := TMemoryStream.Create;
    try
       aStream.WriteBuffer(Pointer(HTMLStr)^, Length(HTMLStr));
       //aStream.Write(HTMLStr[1], Length(HTMLStr));
       aStream.Seek(0, soFromBeginning);
       MemoAddress.Lines.Clear;
       MemoAddress.Lines.Add('1 Infinite Loop. Cupertino, CA 95014');
       address := MemoAddress.Lines.Text;
       address := StringReplace(StringReplace(Trim(address), #13, ' ', [rfReplaceAll]), #10, ' ', [rfReplaceAll]);
       //HTMLWindow2.execScript(Format('codeAddress(%s)',[QuotedStr(address)]), 'JavaScript');
       (WebBrowser1.Document as IPersistStreamInit).Load(TStreamAdapter.Create(aStream));
    finally
       aStream.Free;
    end;
    HTMLWindow2 := (WebBrowser1.Document as IHTMLDocument2).parentWindow;
  end;
end;

procedure TViewMaps.GoToAddressBtnClick(Sender: TObject);
begin
   address := MemoAddress.Lines.Text;
   address := StringReplace(StringReplace(Trim(address), #13, ' ', [rfReplaceAll]), #10, ' ', [rfReplaceAll]);
   HTMLWindow2.execScript(Format('codeAddress(%s)',[QuotedStr(address)]), 'JavaScript');
end;

最佳答案

如果要将地址传递给映射表单,可以将其作为表单构造函数的参数传递。

创建一个名为fAddress的私有(private)表单变量。

然后添加表单的公共(public)构造函数重写并传递地址:

  Public
    constructor create(AOwner: TComponent; AAddress: string); reintroduce;

implementation

constructor TForm1.create(AOwner: TComponent; AAddress: string);
begin
  inherited create(AOwner);
  fAddress := AAddress; // fAddress is now stored to form variable
end;

您的应用还需要确保首先加载 Google API。您不需要使用 TTimer,只需验证 TWebBrowser 的 READY_STATE 以确保 Google API 已完全加载。在这里,我已将您的代码移至表单的 OnShow 事件(已测试)。

procedure TForm1.FormShow(Sender: TObject);
var
  aStream: TMemoryStream;
begin
  WebBrowser1.Navigate('about:blank');

  if Assigned(WebBrowser1.Document) then
  begin
    aStream := TMemoryStream.Create;
    try
      aStream.WriteBuffer(Pointer(HTMLStr)^, Length(HTMLStr));
      aStream.Seek(0, soFromBeginning);
      (WebBrowser1.Document as IPersistStreamInit).Load(TStreamAdapter.Create(aStream));
    finally
      aStream.Free;
    end;
    HTMLWindow2 := (WebBrowser1.Document as IHTMLDocument2).parentWindow;
  end;

  while WebBrowser1.ReadyState <> READYSTATE_COMPLETE do // wait for google
  begin
    sleep(0);
    application.processmessages;
  end;

  fAddress := StringReplace(StringReplace(Trim(fAddress), #13, ' ', [rfReplaceAll]), #10, ' ', [rfReplaceAll]);
  HTMLWindow2.execScript(Format('codeAddress(%s)',[QuotedStr(fAddress)]), 'JavaScript');
end;

要使用映射表单实现并显示地址,您需要使用调用表单中的以下内容:

Form1 := TForm1.create(self, '15010 NE 36th St, Redmond, WA 98052');
try
  Form1.showmodal;
finally
  Form1.destroy;
end;

关于javascript - 无需单击按钮即可在 TWebBrowser(Google map )中显示位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37148317/

相关文章:

javascript - 在 Angular 模板的样式标签中使用变量?

delphi - 为什么我的 TFrame "seeing"不是已发布的消息?

file - 如何在 Delphi 中附加到文本文件?

Javascript 表单提交按钮不起作用 insideHTML

Android map 实用程序 : images from URL

r - 映射距离 : controlling for traffic

c# - 从 Delphi 调用 .NET DLL

javascript - 在没有适当功能的情况下开 Jest 测试 Lambda? Node.js

javascript - Node JS,如何从P12文件中提取X.509证书?

javascript - Internet Explorer 中的 ROT-13 链接解码失败