Display StreetView in an InfoWindow

Let's see how to display StreetView in a InfoWindow

The first step is to create our InfoWindow, We store the index in idStreetWindow

Its contents will be a component DIV who must have a unique name here "streetwindow"

It must also define its size, 300 pixels in height and width.

idStreetWindow := map.InfoWindows.Add('<div id="streetwindow" style="width:300px;height:300px"></div>');

We connecting events OnInfoWindowOpen and OnInfoWindowClose to show/hide StreetView When InfoWindow will be open or closed.

map.OnInfoWindowOpen := mapInfoWindowOpen;
map.OnInfoWindowClose := mapInfoWindowClose;

In these events we use javascript to do the desired job.

 

To open the InfoWindow you can either react directly when clicked on the map as you plugging into OnMapClick

procedure TForm.mapMapClick(sender: Tobject;const dLatitude, dLongitude: Double);
begin
map.InfoWindows[idStreetWindow].SetPosition(dlatitude,dlongitude);
map.InfoWindows[idStreetWindow].Open := true;
end;

But Alternatively, you can associate it with a marker and then it will open when clicked on it

// Delphi map component ECMap

// sample for DemoMobile

{*
press RETURN key on combobox start and destination for Geolocalize adress

fired event OnAdress
}
procedure TFDemoMobile.cbStartKeyPress(Sender: TObject; var Key: Char);
var lat,lng : double;
begin
if Key=#13 then
begin
FComboQueryAdress := Sender As TComboBox;
if assigned(FComboQueryAdress) then
map.GetLatLngFromAdress(FComboQueryAdress.text,lat,lng)
end;
end;


{*
event OnAdress

fired by map.GetLatLngFromAdress(...)

@param sender instance of component TECMap
@param sAdresses list of possible addresses (adr0#13#10adr1#13#10...)
@param index selected index adress

}
procedure TFDemoMobile.mapAdress(sender: TObject; const sAdresses: String;
var Index: Integer);
begin
if assigned(FComboQueryAdress) then
begin
FComboQueryAdress.Items.text := sAdresses;
FComboQueryAdress.ItemIndex := index;

// save actuel map.Adresses in map.ListAdresses
// Add value if necessary
if FComboQueryAdress.Tag>-1 then
map.ListAdresses[FComboQueryAdress.Tag] := map.Adresses
else
FComboQueryAdress.Tag := map.ListAdresses.Add(map.Adresses);

end;
end;

// Find Latitude, Longitude of ComboBox Itemindex
function TFDemoMobile.SelectLatLng(const cb : TComboBox;var Lat,Lng:double):boolean;
begin

result := false;

if not assigned(cb) then exit;

if cb.ItemIndex>-1 then
begin
if (cb.Tag>-1)and(cb.Tag<map.ListAdresses.count) then
begin
Lat := map.ListAdresses[cb.Tag].latitude[cb.ItemIndex];
Lng := map.ListAdresses[cb.Tag].longitude[cb.ItemIndex];

result := true;
end;

end;

end;