Draw area/polygon and retrieve coordinates with google maps - google-maps

Is there any tool that can help me with getting the coordinates for a specific area/polygon?

I usually use Google Earth.
Draw a polygon, then move the mouse over and right click > copy.
Then you can paste it in the notepad and you will find the coordinates there (remeber the format (long, lat,n) the reverse of Google Maps format.
You can also use online tools to format the information or remove parts.
http://www.earthpoint.us/Shapes.aspx

So the idea is to have a map, draw a polygon on it (I assume by placing the vertexes) and then getting the coordinates of the vertexes?
You can make markers draggable when you create then. You can also get the lat/lng position of the markers when certain events fire: the 'dragend' event, for instance.
With these tools, you have the basics of your requirements here. Make a button that places vertexes on the map - just use a marker with custom graphics - and let the user drag the vertex to whatever position they need. Record the new position of the vertex whenever the dragend event fires. Draw lines on the map between the markers, to show to the user the area selected. Have a button to 'complete' the shape, linking the last vertex up with the first vertex.
There may be some existing code to do this, but I am not aware of it. However, it should be possible to throw something together with a bit of work.

Related

how to rotate the google map div with out changing the map dragging functionality

The question posted below
how to rotate a google map in a web application
can be use to rotate the map by rotating the div which contains the map
but if i do scroll or drag on the map the map is working in unpredictably way is there a way to retain those functionalities as it is
Note: i am rotating the map using div because the aerial tiles are not available at that location.
Please say whether this can be done with some other map api are how to go about it in google map API
It is difficult to answer with certainty unless you post a more complete answer, but I believe your issue is with the corrodinate system.
You are rotating the display of the map, but the x,y coordinates of your mouse are not. When you drag the mouse, the javascript is capturing the mouse movement relative to the screen and then you are rotating the output by 45 degrees. In other words, google maps has no idea that you have rotated it. It would be the same output if you just turned your monitor 90degrees, the mouse is still going to send the same x,y coordinates.
In order to do what I think you want you would need to take over the code handling the movement or accomplish it another way. You will notice that the dragging is disabled on the example you referenced.
This might be a place to start looking for getting the center of the map on mouse events:
https://developers.google.com/maps/documentation/javascript/3.exp/reference#MouseEvent
You might be able to get the current coordinates and "transform" the new coordiantes by looking at this example of getting pixels:
https://developers.google.com/maps/documentation/javascript/examples/map-coordinates
Here is a page explaining some things about transforming coordinate systems:
http://www.continuummechanics.org/cm/coordxforms.html
If this is something that you really have to do, it can probably be done, but it is likely a lot more trouble to get right than it is worth for an average map embed. It might also add a lot of processing that will make the interaction pretty laggy.
After saying all that, I'd still love to see an example of this working so if you do make it work please post some code.

How to hide points of interest in google maps and detect clicked coords

First, I have been reviewing some of the different Google Maps API docs, but I've never done much coding with it. I'm trying to build a simple game for kids in which, if the user clicks on a map within a certain distance of a key map point (could be within 1 mile, 100 yards, 5 miles...depending on situation), then the map point becomes visible and a custom message is displayed with it.
Which google maps api calls would enable this to work? How would I embed a hidden point on the map? With the map being rendered on the client, for security, if I could detect the point clicked and send that point via ajax to the server, then the server could send back whether there is a hidden point at that location, that seems like it could work. Or maybe there's a better way.
Can someone point me in the right direction, as to which API calls, and maybe code samples if possible? To summarize, I'm looking for the following functionality:
Track the lat/long coords of any user-clicked point on a google map. Have that click send the coords to my javascript function.
Have hidden points on the map that the user can't see, but either Maps (or at least just my server via ajax) can be aware of.
Ability to display a custom message right next to the clicked spot or hidden point, when needed.
Thanks!
When I understand correctly what you are trying to achieve it's much easier.
Draw a circle and hide the circle by setting the strokeWeight and fillOpacity to 0 . As radius use the allowed distance, as center the LatLng of the point
Although the circle now is not visible, the API will still respond to click-events on the circle, you only have to set a click-listener for the circle and create e.g. a marker at the center of the circle.
Note: a clickable circle will have a different cursor, you must set a unique cursor for the complete map, otherwise the users will be able to find the circle by hovering the map.
Demo: http://jsfiddle.net/doktormolle/0secbwuf/

How to utilise google maps to replicate functionality similar to rightmoves' draw-a-search?

I know this will be a complex solution. I would appreciate it if you could push me in the right direction.
Please have a look at http://www.rightmove.co.uk/draw-a-search.html. I am interested in finding out how this is possible. what steps do I have to take to achieve this?
There's quite a few things going on here.
You need to have event listeners for when the user clicks on the map.
You need to place markers where they click.
You need to draw two types of polylines; the static type connecting two markers, and the dynamic dotted line as they move the cursor or drag a marker.
When you've closed up the polygon, you need to make your search only return properties inside that shape (although they're actually doing it within X miles radius from that shape).
They're also inserting markers half-way along the lines that you can drag - this will require the geographical library, using the interpolate function.

Animation in Google Maps

i'm creating a simulation model using Google maps, i have created a new KML layer and marked few areas which are dangerous to users to go through, now i want to add a moving object to resemble a person on top of it and give a warning when that object nearing the area, does any one have the idea of doing animation of that kind using Google maps?
If you are talking about a moving marker i think you can use the setPosition of the marker object in a for loop feeding it with the coords of a line let's say.

Google Maps v3 API: KML layer messing with click, mouse events

I'm working on a project where, after creating some nice code for creating polygons and attaching mouse events to them, the addition of KML layers (mainly placemarkers) results in uncooperative behaviour between the placeholders of the KML layer and the generated polygons.
If I create the polygons first and set the KML file afterwards, clicking on the placemarkers brings up the infowindow () as expected. However, mouseovers on the polygons below yield no result, whereas before they get highlighted and are clickable (which they aren't).
Setting the KML layer to null doesn't help either. The placemarkers disappear, but my polygons aren't registering.
When I first call the KML with placemarkers, the polygon layer called later goes on top of the placemarkers. The polygons are opaque, so you can see the placemarkers like you could through a window, but you can't click or interact with the placemarkers.
Setting the polygons to null results in the same behaviour as before. Placeholders still cannot be clicked on.
Help? I couldn't find a zIndex reference for the KML layer code, and I'm hoping that's all it is. I read somewhere else - and imagine this to be true - that the KML and user-gernated content "layers" are conflicting with one another - the latter one that's put on the map takes focus, captures events, etc. I would've thought that it wouldn't matter, in the same way that you can have divs on top of other divs, especially if you use indexing.
If you simply want to display the information in the KML layer and not have it react to user events, you can add the suppressInfoWindows flag to the constructor:
var myKmlLayer = new google.maps.KmlLayer('http://gmaps-samples.googlecode.com/svn/trunk/ggeoxml/cta.kml', { suppressInfoWindows: true });
This will effectively shut off all interactions and let your other layers receive interactions.
Edit: Forgot to mention that a good source of information is the Google API V3 site discussing KML layers