My current implementation is, when I open the html via browser it zooms to North America map with 4 markers. On click of the markers, the maps is zoomed to that location with few more markers added. Now I would like to add a back button so when the button is clicked it should take me to the initial maps page with 4 markers.
Your help is much appreciated.
Thanks,
Chitra
The features of Google Maps API that you will need to use are bounds. For a rough understanding, imagine providing a top left corner point and a bottom right corner point and just telling the viewport to zoom and track to fit them in. There is a good answer here: Google Map API v3 — set bounds and center
As for how you implement the actual button to trigger the feature, that is a separate question and there are many potential solutions. Again, it has already been discussed here: Put a button on top of a google map
Related
Example situation: my Google Maps map is in div#maps. div#maps has a half transparent menu layn over it on the top. That means the top 100px of div#maps is unclickable. However, when I for example use a function like "fit maps to marker bounds", the topmost marker will be underneath the overlying menu.
Is there a way to tell Google maps that the map should be rendered in the full div, but that the area that we're working in should be 100px off the top?
Answer has been given before. I didn't know the right words for asking the question so I couldn't find an answer to it, but, as pointed out in comments, answers can be found here:
How to offset the center of a Google maps (API v3) in pixels?
How to offset the center point in Google maps api V3
https://stackoverflow.com/a/26192440/1238965
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
I am using the following google map and everything looks perfect:
Google map
The only problem is that when a person zoom in to the street level and wants to zoom out he needs to have a mouse and use mouse wheel and if he does not have mouse working with this map is a pain.
So I need to put zooming bar for example at left side of my map like this:
Is it possible to do that and how can I do that?(I appreciate any help)
You need to add the control to your map, like this:
map.addControl(new GSmallZoomControl());
You can find more information about GMaps controls here: https://developers.google.com/maps/documentation/javascript/v2/controls
This quote is from the above mentioned documentation
GSmallZoomControl - a small zoom control (no panning controls) used in the small map blowup windows used to display driving directions steps on Google Maps.
I am using Bing Maps. I have 25 latitude and longitude values, i am showing list of only 5 values(Lat and Long)with previous and next buttons on left side and maps on right side(showing pushpins on hard-coded zoom level). But i need to show only 5 pushpins which is there in the list on left side.
If i click on next button i can able to load next 5 lat and long values(on left side), but i need to change the map(on right side) to show only pushpins from 6 to 10.
If i zoom out, i should be able to see all Pushpins. Is this possible in bing maps?
And also how can i show tooltip on mouse over of pushpins.
Yes. This can be easily done. It's just a mater of storing all the locations in an array and keeping track of the index of the pages. If the page changes grab the data for that range, clear the map and add the new locations to the map, maybe center over as well for a nicer experience. You can add some logic that uses the view change end event to know when the zoom levels change and show all locations when the zoom level is such that it is zoomed out enough. Here is some documentation on some of the things you will need:
http://msdn.microsoft.com/en-us/library/gg427604.aspx
http://msdn.microsoft.com/en-us/library/gg508988.aspx
http://msdn.microsoft.com/en-us/library/gg427611.aspx
I have a map application that can be seen here:
http://chrismcaleenan.com/map/?page_id=25
Each of the Malaysian states in the application will have an InfoWindow that displays additional information. You can see an example of this by mousing over 'Kedah' either in the main data table on the right or on the state itself in the map.
The problem, as you can see, is that the map pans in order to position the InfoWindow. Is there a way to fix the map position and set the InfoWindow size or position so that it is fully displayed without panning? In the Kedah example, one could have the InfoWindow positioned directly to the right and/or use a shorter tail.
One option would be to create a custom graphic for each state, but I'd rather avoid this as I will be running into the same issue with add'l data (e.g. click Kedah to zoom - will have InfoWindows on all data points on zoom).
If you're playing around double-clicking the water will zoom back out and reset map.
Thanks!
Yes, and sometimes the pan pulls the mouse outside of the state, which causes the InfoWindow to disappear. I know that's not what you want. The Google Maps demo catalog includes a sample that I think will give you what you want for your map. It's named SmartInfoWindow. Take a look, click on some of the markers, check out how the SmartInfoWindow behaves, and see if that might help you achieve what you want. It's not perfect, but it keeps the pan at the absolute minimum.