How to place Google maps street view panorama in tunnel with bridge - google-maps

Is there a way to tell google maps street view you want to be above/under another road? I have a path that takes someone around a cloverleaf and back out the other way, but when I set the location on the bridge it always sets them to on top of the bridge.
current code
lineClickEventHandler(latLng: google.maps.LatLng) {
this.panoramaMap.setPosition(latLng)
this.drivingData.heading = Math.round(this.routeService.getCurrentHeading(latLng, this.polyLine))
this.panoramaMap.setPov({
heading: this.drivingData.heading,
pitch: 0
})

Afaik there is no way to select a level for a set of coordinates.
If you are following a Street View "path" on the below level and don't want the API to "move" you to the top road, you could use the returned links of the current panorama you are on.
As stated in the documentation each panorama has links to adjacent panoramas in the form of a collection of StreetViewLink objects.
The getLinks() method of the StreetViewPanorama class will return the same collection.
For example:
0: {description: "", heading: 97.73429107666016, pano: "zVIPHTGA5Pu4os139DS5sw"}
1: {description: "", heading: 277.2002563476562, pano: "wSLR0N4qAw-_Ib2Q69HvTw"}
If you know your heading (more or less) or say, the direction you are currently intending to move, you could compare it with the heading contained in the links and load the corresponding adjacent pano by its id.
Hope this helps.
Edit:
I did a small proof of concept to see if I could follow that road automatically based on a base heading and the provided StreetViewLink objects but unfortunately that seems buggy...
For some reason — and although Street View imagery is available to continue "straight ahead" on the same road — the adjacent links somehow start referencing the top road at some point. I don't know why this happens.
Here is my fiddle. Watch your javascript console and the map while it moves along the road.
It would be interesting to test that in other places and figure out if this is a local issue or if it happens in other places as well... My guess is that it will happen in other places too.

Related

Google Places Autocomplete/SearchBox with bounds and text search

When I'm searching within the SearchBox component
https://developers.google.com/maps/documentation/javascript/examples/places-searchbox
the official demo example (link above) doesn't work for me.
The map shows Sydney
I type in "mcdonalds" as an example
I select the first suggestion from the list (McDonald's) https://take.ms/cs03e
the map gets repositioned to my country (~ a lightyear away from Sydney) and displays the results only around my physical location.
The documentation about bounds
An options argument, which can contain the bounds property: bounds is a google.maps.LatLngBounds object specifying the area in which to search for places. The results are biased towards, but not restricted to, places contained within these bounds.
I tried bounds, location + radius, componentRestrictions to country, but none gave the expected pehavior.
I understand that the bounds are not always respected, although the way it works at my end is not usable at all.
We noticed the same malfunctioning within an existing app of ours that uses SearchBox which was working perfectly in the past. Bounds were respected.
Can anyone suggest a workaround or explanation for this behavior?
I tried alternatives such as
nearbySearch => respects bounds, but no option to define free text search
freetextSearch => only freetext search, no bounds
AutocompleteService.getPlacePredictions => respects bounds and freetext search but returns only ids of places and not locations (needs additional query for location to render markers)
PlacesService.findPlaceFromQuery => only returns one item
The goal is to search (freetext) for establishments and addresses within bounds and display them on the map as markers.
UPDATE:
Please see the inconsistent behavior from different IPs: https://take.ms/CQUDJ testing from most countries the bias is not working as it should.
Thanks
The issue is confirmed by Google, please see the related tickets.
https://issuetracker.google.com/issues/229752141 (mine)
https://issuetracker.google.com/issues/228928701

Google Maps Static API - Custom zoom with markers

I am creating an application that downloads images from maps using the Google Maps Static API. I would want to decide the zoom level when having markers on the map (right now the zoom is set automatically so that all markers are shown in the image). Does anyone know if this is possible?
Right now the zoom is set automatically so that all markers are shown in the image
You are halfway there. Once done, get the resulting the zoom level: map.getZoom();
However, I think your app violates Google's terms as it is forbidden to copy their content.
According to the documentation, you can use the center and zoom parameters to configure the map (they aren't required with markers):
Location Parameters
center (required if markers not present) defines the center of the map, equidistant from all edges of the map. This parameter takes a location as either a comma-separated {latitude,longitude} pair (e.g. "40.714728,-73.998672") or a string address (e.g. "city hall, new york, ny") identifying a unique location on the face of the earth. For more information, see Locations below.
zoom (required if markers not present) defines the zoom level of the map, which determines the magnification level of the map. This parameter takes a numerical value corresponding to the zoom level of the region desired. For more information, see zoom levels below.
example URL:
https://maps.googleapis.com/maps/api/staticmap?center=42,-72&zoom=5&size=400x400&markers=color:blue%7Clabel:S%7C11211%7C11206%7C11222&format=jpg
resulting image:

Google map zoom parameter in url not working

Why doesn't google map z (zoom) parameter work inside the url?
I' ve searched over so I got few solutions for sending zoom parameter in google map url but based on the old posts (stackoverflow) which deal with the zoom level within the url it seems that this functionalities do not work anymore.
I've used the following z parameter but it's not working:
http://maps.google.com/?q=38.6531004,-90.243462&z=12
Below is the link where they have mentioned z parameter for zoom level
link
For those who do not want to read,
this works (z range:[1-20]):
https://maps.google.com/?q=38.6531004,-90.243462&ll=38.6531004,-90.243462&z=3
There is no documentation that covers this problem. However, there are few hacks.
The link that you have provided,
URL (stackoverflow):What parameters should I use in a Google Maps URL to go to a lat-lon?
Will not help you with getting the desired google maps zoom level inside a url
The following examples which have been working for quite a while DO NOT WORK anymore (they work but without getting the desired zoom level)
Examples:
http://maps.google.com/?q=38.6531004,-90.243462&z=3
http://maps.google.com/?q=38.6531004,-90.243462&zoom=3
http://maps.google.com/maps?q=Scottish+Rite+Hamilton+ON&loc:43.25911+-79.879494&z=15
Instead, you can get the zoom level easily by trying the following examples:
https://www.google.com/maps/#38.6531004,-90.243462,9z
https://maps.google.com/?ll=40.7060471,-74.0088901&z=3
(Note: after clicking on google maps you will get a gray marker which appears and quickly disappears)
However the above URL's will not give you a static pinpoint for the specified lat&long.
There is a "hack" on how to get a fixed pinpoint (red marker pin) and that is by giving the q attribute (represents the search query) and the II attribute(latitude and longitude of the map centre point) along with the z (zoom attribute)
Example (with the OP coordinates):
https://maps.google.com/?q=38.6531004,-90.243462&ll=38.6531004,-90.243462&z=3
If you want to change the zoom level just change the value of 'z'.
After searching the web I found that only this website:
https://moz.com/blog/new-google-maps-url-parameters
deals with google maps parameters/attributes/arguments, where things actually still work. If anyone want's more functionalities within the url, then this is the site to check.
Zoom intervals explained (https://developers.google.com/maps/documentation/static-maps/intro#Zoomlevels):
The following list shows the approximate level of detail you can
expect to see at each zoom level:
1: World
5: Landmass/continent
10: City
15: Streets
20: Buildings
This works as of 5 Aug 2018
http://www.google.com/maps/place/<lat>,<lng>/#<lat>,<lng>,<zoom>z
For example
http://www.google.com/maps/place/49.46800006494457,17.11514008755796/#49.46800006494457,17.11514008755796,7z
As of 04/2020 ...."because google is always changing and evolving"
In complement to Eugen Sunic comments above, and an alternative update to the Solution.
When Logged in to google and getting map data from the google generator, it is not the same as copying the URL from the browser window (which my may be manipulated to load different zooms trough the various alterations, html, Css and script tricks).
But in the below, keep in mind that Your address info may need to be part of the google array of database, eg you have some address map info linked to your account, images, business name, etc. or not... maybe just typed in for a quick map search with a pin-point... the later I don't know.
Also the below is not some Google API pay per 1k clicks thing, which is more geared to the commercial development end of google tracking heat maps, etc. So if you just need a simple solution and certain zoom and marker to work..then you might try the below.
When logged in too your Google account (maybe not) and showing your location marker on the map screen...
Choose the zoom detail of the map you want to appear in your web page. eg Whole US, State views, City, Street (by clicking the + or - zoom feature).
Then go to the hamburger menu to the left, and look down the list for "Share or Embed Map" and the popup window should load the same zoom level of the map! Do not try to change the zoom in the popup window feature, it wont work to change the link code but will change the pop up windows zoom of the map. In short, the embedded link code is preset and will not change in the popup.
Above this popup window of the map there will be two options at the top (Share and Embed) button/link selections.
Click on the Embed link/button and it should generate the code for the zoom you previously chose.
Lastly, copy the code, paste it into your web page and TEST!
As far as I can tell, There is no altering this code as the others suggested above, changing(z=3, 9z, etc) as the code is entirely different. But it will allow you to get the zoom you need "if the google code generator or procedure does not change".
But the zoom level was altered and good enough for me when I figured the process out. Changing it to other zooms is another can of code.

Automatic Google Street View Heading

Is there an easy way to get Street View to automatically set the heading like the Street View Image API does?
I have Google Street View images embedded in my application and I would like to put a link on them that will direct the user to the full Google Street View, preferably with the same heading. So far I can link to full Street View with the coordinates but not the heading, since I don't know the heading.
For a certain coordinate, the Street Map Image API will give me an image pointed at the coordinates given. For example:
http://maps.googleapis.com/maps/api/streetview?size=300x150&location=38.9506254,-76.942316
Using the an unofficial resource (http://moz.com/ugc/everything-you-never-wanted-to-know-about-google-maps-parameters) I can create a link to Google Street View, but I must provide a heading angle, which I don't have. Here's an example with the Street View window parameters left off.
http://maps.google.com/maps?q=&layer=c&cbll=38.9506254,-76.942316
This works but does not give me a heading pointing toward the coordinates. Instead, it points due north. I assume I can host my own Street View page and get the heading as a vector from the nearest panorama to the target, as it appears Street View Image API does. I would rather not if I don't have to if I can just embed a single link.
Also, is it safe to use the google map URL parameters? They appear to be undocumented, but I can find references to the parameters I am using back in 2008 so they seem stable.
Edit:
To further elaborate on the difference between full Street View with URL parameters and Street View Image API, here's a diagram of what I get from both without specifying a heading.
Street View Image API will automatically point the POV camera at the target from the nearest Street View panorama when no heading is provided. Full Street View, through URL parameters without heading, will point the POV camera due north. I am looking for a easy way to mimic the Street View Image API behavior with Street View through URL parameters without having to pull panorama location information from google, though that looks like the only option.
If you know the heading that you want you can add a heading parameter in the querystring. Quoting from Google docs:
Heading indicates the compass heading of the camera. Accepted values are from 0 to 360 (both values indicating North, with 90
indicating East, and 180 South). If no heading is specified, a value
will be calculated that directs the camera towards the specified
location, from the point at which the closest photograph was taken.

Simple geocoding example that loads an arbitrary address

All the "simple examples" of geocoding load a hard-coded long/lat pair and then, after the map is displayed, they load the arbitrary user-supplied address. Unfortunately for me, this means the hard-coded location always appears first and then the map shifts to the user-supplied address. What I'd like to find out is how to geocode an arbitrary address first, then initialize the map to the location in one step, so that when the map appears on the screen it is already showing the correct location.
I've been unable to deduce how this could be done from the API docs, however. All the examples show "new google.maps.Map()" being called prior to geocoding and it appears you have to already have a location to create the map, so it's impossible to geocode before displaying the map. On the other hand, it seems to me this would be the most common way to use a google map, so surely there's some way to do it?
Is this possible and does anyone have an example they could point to? Thanks!
If I understood you correctly, I created a simple page here
http://jsfiddle.net/4QGKq/1/
There's a hardcoded human readable address in the HTML ("Sardegna")
The geocoder figures out LatLng from Sardegna
Map is created and centered there.
To change the default map center, change the address in the Source HTML panel, not the textbox, then click on the blue "Run" button.