Hi guys is it possible to have a user click on a button to show Streetview on google maps? right now i have users doing it manually by dragging a Streetview icon on the bottom right of the map.
Looking forward to your assistance.
thank you.
1 Like
You should be able to create a link to the street view of any location. Check out the documentation here:
hi thanks for your reply, however i followed the link but im so confused as to what to do. do you perhaps know the 1st steps i should take to create the links required?
thank you
Here is the basic url for street view: https://www.google.com/maps/@?api=1&map_action=pano
Now you need to add the coordinates (lat, long) so that Google knows the location of the street view you want to display. To do that add &viewpoint=[long,lat]
The link will now look like this: https://www.google.com/maps/@?api=1&map_action=pano&viewpoint=38.896778,-77.039485
Does this help?
Do you know how to create this link with dynamically adding the latitude and longitude ?
im really not sure how to create such a link, please show me how, i only know basics when it comes to adding maps on bubble.
thank you.
There are several ways to do this. Here’s the idea.
OK so the first thing you need to do is have the latitude and longitude of the location you are looking to create a link for. If you have the address saved in bubble as a geographical location it will automatically include the lat long. This can be data saved in your database.
Then you can create a workflow to open an external link. Here is what the dynamic link may look like:
The text in white is the part of the link that never changes. The text in blue is the text of the link that changes based on info in my database.
Hi @ralphlasry, this worked like a charm thank you so much, only thing i need the streetview picture to happen inside bubble without redirecting to google.
again thanks a million.
1 Like
Glad that worked.
You can embed the streetview on your page so your users arent redirected. For this you can use the Google Maps Embed API.
Add an HTML element to your page and check off to display as iframe.
When pasting this code open the HTML editor and paste it there. Replace the words YOUR_API_KEY with your google maps api key. Dont forget to enable the Maps Embed Api in your google account.
<iframe
width="450"
height="250"
frameborder="0" style="border:0"
src="https://www.google.com/maps/embed/v1/streetview? key=YOUR_API_KEY&location=46.414382,10.013988" allowfullscreen>
</iframe>
3 Likes
This topic was automatically closed after 70 days. New replies are no longer allowed.