I am looking to find a way of checking if a geometry feature (from big geojson object) is already added to the map (it has already contains other geojson object with lots of features) in google maps v3 (javascript). I've searched everywhere and the only solutions I have found does not work just coming up with the following error:
InvalidValueError: not a Geometry or LatLng or LatLngLiteral object
I also searched by the error, but I didn't find the answer that works for me, because two test geojson object are almost the same and it is ok when I try to add the to the map without any check.
I created a pen here http://codepen.io/hackzilla/pen/qqYjzB
Here is the code:
// add first pool of data
GoogleMap.data.addGeoJson(jsonGeoData_1);
// add second pool of data
jsonGeoData_2.features.map(function(feature, index) {
// if the feature is on the map
if(!GoogleMap.data.contains(feature)){
GoogleMap.data.add(feature);
}
else console.log('feature' + index + 'already exist');
})
Related
I have a list of store addresses, and I'm trying to create a map out of it.
Using the Places API I am able to retrieve most of the informations and manually create and place the markers on the map:
const service = new google.maps.places.PlacesService(map);
service.findPlaceFromQuery({
query: '212 Enterprise Dr, Rockaway, Frank Pizza',
fields: ['all']
}, onPlaceFound);
However I'd like to select the original marker instead of overlapping a new one.
That is because I want the user to be able to open the default info window with store phone number, directions and stuff.
I know that I can re-create it, but it feels kinda lame since all the info is already there.
This SO post ask about the same, yet no solution has been found.
Based on the documentation found here, which shows findPlaceFromQuery(), the second parameter of findPlaceFromQuery should be a function where the first argument of that function is an Array of placeResults.
Therefore, after reviewing a link here and here your onPlaceFound function should be looking something like:
function onPlaceFound(placeResultsArray){
const firstResult = placeResultsArray[0], firstIconURL = firstResult.icon;
const latLng = firstResult.geometry.location, lat = latLng.lat(), lng = latLng.lng();
// do stuff with those variables here
}
Of course, that does not select Google's result as a Marker, but now you have the actual icon, and latitude and longitude.
I want to highlight a specific section of a road on my map. The user should be able to click on a map and using the Location of the click, I want to highlight the closest road element.
In the Here Android SDK, the RoadElement can do exactly what I want: I can pass some coordinates and use getGeometry() to obtain the exact shape of the road element.
However, I couldn't find something similar to this in the javascript SDK. I tried using Reverse Geocoding:
var geocodingParams = {
lat: road.lat,
lng: road.lng,
mode: 'retrieveAddresses',
maxresults: '1',
additionaldata: ['IncludeShapeLevel', 'postalCode'],
prox: road.lat + ',' + road.lng
};
this.geoCodingService.reverseGeocode(geocodingParams, onResult, null);
This way, I can find the closest road, but I don't get accurate shape data. In the Results View, there is only the Bounding Box (Location.MapView.BottomRight and Location.MapView.TopLeft).
How can I achieve something similar to the RoadElements, using the Javascript API?
Our routing APIs return the shape points along a route. So given a set of start and stop waypoints the JavaScript SDK routing API will give the route shape.
Example code is included on this page:
https://developer.here.com/documentation/maps/dev_guide/topics/routing.html
Another alternative will be to use the Advanced fleet telematics API and look into the datasets yourself.
I have a horizontal scroll bar, that appears on the map, whenever particular venues are requested via Google Places and markers are placed.
My idea, is to have this horizontal scroll bar display a picture of each returned venue using Google places Photo request. However, the .getUrl() method that Google advises to use, is returning me an 'Uncaught TypeError: undefined is not a function'; although I do receive an array of Objects and each Object has an array of photos.
Here is a part of my code:
for (var i = 0, place; place = venueData[i]; i++) {
if (place.photos) {
var photo = place.photos[0].getUrl({ 'maxWidth': 100, 'maxHeight': 100 });
$('.venues-display').append('<li><div class = venue-picture><img src='+photo+'></div></li>')
}
else {
$('.venues-display').append('<li><div class = venue-picture><img src='+ place.icon + '></div></li>')
}
The error that I get points to the line with getUrl().
venueData variable - is the array of Objects that is returned back from Google Places Text Search.
'.venues-display' - is the class name of my scroll bar.
I am a newbie..and getting desperate, because I can't understand what am I doing wrong.
Pleeease heeeelp
The method .getUrl() only works with the Google Places Library (in other words if you call .PlaceServices), where you do not need to use your API key
new google.maps.places.PlacesService(map)
Otherwise, you need to use this piece of code for getting the photos:
https://maps.googleapis.com/maps/api/place/photo?parameters
At least that's what I understood with reading through the Google docs and using different pieces of code for the same reason
Has anyone noticed that google maps geocoding have changed the variable name of the lat and lng from, Qa and Ra to Pa and Qa.
Does anyone know a reason for this?
Edit: If you're using the Google Maps Geocoding Service, as #hamczu suggests, then you should be getting the results like this:
{
... snip ...
geometry: {
location: LatLng,
... snip ...
}
}
It sounds like you're not using the API methods for the LatLng object, but are instead trying to use its undocumented properties. Your question demonstrates one of the best reasons why this is a Bad Idea - the Google code is compressed and obfuscated, using short, arbitrary variable and property names, and Google may recompress its code at any time, arbitrarily changing these names. What it won't change is the function and attribute names in the published API - that's the whole point of having an API to begin with, and the reason why developers should code against the API, not the "undocumented features" of the currently available code.
So the best approach is to use the documented methods:
var lat = result.geometry.location.lat();
var lng = result.geometry.location.lng();
Otherwise, your code will likely break every time Google recompresses its code.
I am using the following method to reverse geocode a google maps latlng:
[GClientGeocoder.getLocations(address:String, callback:function)][1]
Which states as follows:
As this method requires a call to a Google server, you must also pass a callback method to handle the response. This response will contain a Status code, and if successful, one or more Placemark objects.
Can anyone point me to a definitive reference of what a Placemark object is as it seems to return different attributes for different locations. e.g. sometimes I get a ThoroughfareName and others an AddressLine. I would like to understand if I will always get one or other of them and whether they are interchangeable.
This page is from the Google Maps API documentation, and contains a pretty straightforward explanation of what a Placemark object is.
However, the part you probably want to focus on is where it states what format Google uses for the AddressDetails object in a Placemark, which is xAL (eXtensible Address Language). There is a link to the spec there, which leads to a downloadable schema (xsd file), which essentially defines the entire format. A word of warning: the spec is pretty extensive, but you may not need to worry about a great deal of it for your project.
EDIT:
Apologies for not being allowed to add links to the relevant pages for you.
You have to hunt for it, but Google does in fact have some documentation about Placemarks hidden away.
The contents of the Placemark object do vary based on the data available. I found the best way to work out what I was getting back was to use JSON.stringify to examine the response (for debugging):
function onGeocode (resp)
{
document.getElementById("cd_output").innerHTML = JSON.stringify (resp);
}
This gave me the following results when I GeoCoded an address in Sydney, Australia:
Placemark
{
id, address,
AddressDetails
{
Country, CountryNameCode, CountryName,
AdministrativeArea
{
AdministrativeAreaName,
Locality
{
LocalityName
Thoroughfare { ThoroughfareName }
PostalCode { PostalCodeNumber }
}
}
}
Accuracy,
ExtendedData
{
LatLonBox { north,south,east,west }
Point { coordinates }
}
}