Combining Polylines on Google Static Map - google-maps

I'm trying to make a static map request with multiple polylines. It works fine when I have a single polyline, but when I add them together I don't get the intended results. Specifically, I'm trying to highlight adjacent street blocks.
Polyline 1 works fine:
https://maps.googleapis.com/maps/api/staticmap?sensor=false&size=400x400&path=weight:10%7Cenc:{d`pEnpypUc#_#u#Q
Polyline 2 works fine:
https://maps.googleapis.com/maps/api/staticmap?sensor=false&size=400x400&path=weight:10%7Cenc:c``pEtjypUi#fAu#zA[j#mAzB
But combined, I get this:
https://maps.googleapis.com/maps/api/staticmap?sensor=false&size=400x400&path=weight:10%7Cenc:{d`pEnpypUc#_#u#Q%7Cc``pEtjypUi#fAu#zA[j#mAzB

This works for me (separate the polyline specifications):
https://maps.googleapis.com/maps/api/staticmap?sensor=false&size=400x400&path=weight:10%7Cenc:c``pEtjypUi#fAu#zA[j#mAzB&path=weight:10%7Cenc:{d`pEnpypUc#_#u#Q
(You need to add "&path=weight:10%7Cenc:YourEncodedPolylineHere" for each polyline)

Related

Draw route from lat/lng list in SAPUI5

I´m using the framework openui5-googlemaps for using google maps in a sapui5 application.
I have an array of lat/lng positions. I want to draw a line from position to position in this array.
I found an example with directions:
<gmaps:directions>
<gmaps:Directions startAddress="{mapModel>/start}" endAddress="mapModel>/end}" unitSystem="1" waypoints="{mapModel>/stops}">
<gmaps:waypoints>
<gmaps:Waypoint location="{mapModel>/name}"></gmaps:Waypoint>
</gmaps:waypoints>
</gmaps:Directions>
</gmaps:directions>
The problem on this solution is, that I don´t want a marker on each position.
(My positions have a distance of a few metres.)
Further this solution draws the lines based on the streets. I need a solution regardless of streets.
If you want to see example using Polylines see Sample App2
Let me know if you want an standalone example by adding an issue to the repo
[UPDATE]
here is a sample app using polylines
<openui5.googlemaps:Map id="map1" lat="{/beaches/1/lat}" lng="{/beaches/1/lng}" >
<openui5.googlemaps:polylines>
<openui5.googlemaps:Polyline path="{/beaches}" />
</openui5.googlemaps:polylines>
</openui5.googlemaps:Map>
running looks like

Markers are not shown in static google map

I am having google static map url this way with multiple markers.
https://maps.googleapis.com/maps/api/staticmap?size=1100x795&markers=color:red|label:S|45.459041,-98.430198&markers=color:red|label:S|45.469042,-98.430199&markers=color:red%7Clabel:S%7C40.702147,-74.015794&markers=color:red%7Clabel:G%7C40.711614,-74.012318&markers=color:red%7Clabel:C%7C40.718217,-73.998284
But in the map only 2 markers are shown.
I have even tried adding these parameters in the url but still it showing only 2 markers in my map.
&maptype=roadmap
&sensor=fasle
What is the mistake here? can some one help me?
Thanks
It is because of the distance of the markers. The first two markers are near each other and the other three is also near each other, but the first two markers are relatively far from the latter three. I tried getting the Static maps separately and making separate requests for the first two and the latter three and it displays the markers accordingly. I guess because of the distance the markers overlapped.
fiddle of Google Maps Javascript API v3 map showing the same markers (navigate to the markers to see what is happening)
Request for the first two:
https://maps.googleapis.com/maps/api/staticmap?size=1100x795&markers=color:red|label:S|45.459041,-98.430198&markers=color:red|label:S|45.469042,-98.430199
Request for the latter three:
https://maps.googleapis.com/maps/api/staticmap?size=1100x795&markers=color:red%7Clabel:S%7C40.702147,-74.015794&markers=color:red%7Clabel:G%7C40.711614,-74.012318&markers=color:red%7Clabel:C%7C40.718217,-73.998284

multiple polygons and multiple markers in Google MAPS API

I am using google maps API for searching houses in a city(any location). In maps, by default markers will be loaded based on database results and user need to select locations they are interested. If user draws multiple polygons around markers, those markers should be visible and other markers should become invisible. I almost done most part of it.
Now the issue is,when i draw multiple polygons, only one marker with one polygon is visible. Other selected markers are getting invisible. I am trying from past two days and able to get it done. Can anyone guide me to fix this issue.
Mentioned issue is kept in jsfiddle, have a look and let me know
Add at the end of your drawFreeHand method: polygons.push(poly);
And change your isPointInside method as below.
function isPointInside(position){
for(var i=0;i<polygons.length;i++)
{
if(google.maps.geometry.poly.containsLocation(position, polygons[i]))
return true;
}
return false;
}
You were comparing with the same poly, that was the problem.

Google Maps Query Parameters to show more than one marker

How can I set query part of my url to load more than one marker in Google Map.
with following I can load one marker.
http://maps.google.com/maps?q=40.01696,32.33076&z=17.
I need some thing like following query, but not for static map!
https://maps.googleapis.com/maps/api/map?center=46.525510999999995,6.562825000000001&size=300x300&maptype=roadmap&markers=color:blue|label:You|46.525510999999995,6.562825000000001&markers=color:green|label:A|46.525876,6.561572&markers=color:green|label:B|46.524586,6.564591&markers=color:green|label:C|46.523745,6.560512&markers=color:green|label:D|46.52486,6.563096&markers=color:green|label:E|46.524678,6.563687&sensor=true&language=en
I think that is not possible. In my opinion you have 2 choices:
Use a static Map
Use Google Maps with your .kml file to specify the markers.
Description from Google:
https://support.google.com/mapsengine/answer/2505884?hl=en
There is a example here:
https://maps.google.com/maps?q=http%3a%2F%2Fwww.geocodezip.com%2Fgeoxml3_test%2Fkmltest_2_SUNSHINE_CHEVRON_b_kml.xml&hl=en&sll=25.641526,-79.101562&sspn=23.171946,41.52832&t=m&z=15

Javascript: manipulate individual markers on Fusion Tables layer

I have a Fusion Table of about 1000 entries, and I show them on a map using a FusionTablesLayer. I want to produce a list of the five closest markers to the center of the map. Clicking a list item should produce an info window for the corresponding marker. It looks a lot like the first sample on this site:
https://developers.google.com/maps/location-based-apps
But if I remember correctly, Layers don't allow acces to individual markers. On the other hand, if I use an Overlay the rendering of the 1000 markers has to be done client-side and obviously I don't want that.
How do I do this? Make an Overlay for the 5 markers and a FusionTablesLayer for the rest?
Here is an example showing the 10 closest markers to the center of the map.
Here is an example that does the sidebar.
Here is an example that combines the two.