More than one marker on same place problem.
I am using MarkerClusterer. When I have two or more markers on the exact same spot, The API only displays 1 marker - the top one. But somehow I want to show all the markers as each one will be opening distinct popup. I have searched found few solutions but none are seem to be working Anybody had similar issue and would plus share a solution?
Related
I'm creating an ios app to scout locations "on the go" and mark the locations one by one by clicking a button, and dropping a marker based on current location. I then want to be able to connect the dots, as it were, and create a trail that traverses them all.
I can drop a marker at my location, and I can tap a bunch of markers onto the map, but I'm having trouble bridging the two. Any tips?
Looks like Polylines are just the thing you're looking for. Though, its best for you to save the coordinates in order for you to properly set the trail.
As I am getting the same latitude and longitude from database for different markers, the markers are getting pin on each other, now I want to perform click event on makers alternatively, but only the top marker pin is clicked, how can I click the back one .
OverlappingMarkerSpiderfier is the solution: https://github.com/jawj/OverlappingMarkerSpiderfier
Ever noticed how, in Google Earth, marker pins that overlap each
other spring apart gracefully when you click them, so you can pick the
one you meant?
And ever noticed how, when using the Google Maps API, the same thing
doesn’t happen?
This code makes Google Maps API version 3 map markers behave in that
Google Earth way (minus the animation). Small numbers of markers (yes,
up to 8) spiderfy into a circle. Larger numbers fan out into a more
space-efficient spiral.
Demo page is here: http://jawj.github.io/OverlappingMarkerSpiderfier/demo.html
So I have a probably not so unique scenario. The simplest way to explain it is a google map with all 50 US states, each state will have two markers. The markers are both driven by the same lat/long value. The problem Im having is that the markers are rendering ontop of one another. I somehow need to have them render next to one another or offset so that I can see both. The problem is how do I get it to not overlap into another state.
I saw some really neat "spider" functionality where it renders one marker and then if you click on it the others fan out, but the website was in another language.
I am going to try and use the following library.
https://github.com/jawj/OverlappingMarkerSpiderfier
The problem with the above implementation is that I am using a combination of KML and google maps client-side. I dont see a way to implement that for the kml markers
The Overlapping Marker Spiderfier project on GitHub will probably accomplish what you need.
Otherwise you can play around with the Marker's icon property. The icon can accept a Symbol which has and anchor that can be shifted from the default location (0,0).
Symbol documentation: https://developers.google.com/maps/documentation/javascript/reference#Symbol
I have a list of people that I need to map. Some of them have geocoded addresses and others don't. So, I map the ones that I have, and then I geocode the ones that I don't have geocodes for, and I add them to the map one at a time. (side note: the google geocoder api has a limiter that allows you geocode 10 addresses the first second that you hit it, and then 1 per second every second after that). So, I as I am geocoding these addresses, I am creating Markers and adding them to the map. The problem here is that I can't effectively interact with the map from the UI while the other addresses are being geocoded, because each time I call marker.setMap(mymap) it re-zooms out to fit all markers. So, I can't interact with the map until they are all mapped. Is there any way to add a marker to the map without re-zooming out?
Geocoding and creating a marker doesn't automatically shift the center of the map. If you copied from the Maps API sample code, you may see a line like
map.setCenter(results[0].geometry.location);
That's causing the results to the center of the map. Comment out that line and see if there's still a problem.If you don't see setCenter, then look for a line with fitBounds() and comment that out. If you're still having trouble, post a live version of your code, or put it up on jsFiddle or something so we can debug it.
What I'm trying to do is finding an elegant way of dealing with multiple markers on the exact same spot on a google map. Possible scenarios are when your geo data just isn't accurate enough to distinguish two markers from one another (say 3 people live in the same house and all you have is an address) or you only have city information of a couple of shops.
Now there is the Clusterer of course, everybody is saying that, but that won't help here as the markers have the exact same location. They will stay clustered regardless of zoom level.
I like the way Google Earth does it. Here is an example. But so far I have not discovered a way to have this behavior in Google Maps. I would be pleased if someone can show me how to do this.
So perhaps as you are looping through your coordinates adding all the markers, you could check if any previous marker has the same latlng. If it has you could use a different marker, e.g one numbered '2'. Or to do the Google Earth thing, offset each marker slightly, and draw a polyline from the markers to the original location.