New to GoogleMaps and am wondering, before I really dig in, if there is even a way to do what I need... (don't want to waste time discovering I am hunting a unicorn)
I would like to submit some georeference data to GM (ie, center lat/long, width & height in feet or degrees, angle of rotation, satellite or streets) and get back a bitmap/jpg/png of the map described (maybe even a worldfile?)
Possible? If so, what facet of the API should I be investigating?
It is the Google Maps Image APIs https://developers.google.com/maps/documentation/imageapis/?hl=nl
Related
I am using react-native-maps and polyline to draw a route on the map (I am using multiple waypoints). I want to be able to color the Polyline based on the traffic (red for heavy traffic, yellow for moderate, etc) similar to the way Google Maps does it normally.
As I am thinking of multiple ways and looking online, I've seen that you can use the Embed API, however that has to be wrapped in an iframe (not what I'm looking for). It seems the coordinates used to map the Polyline doesn't correspond to the responses received from the Routes API either (and hence I can't really use the time and distance received from there to calculate whether it is in traffic and plot the polyline).
I'd like to ask everyone if there are any specific methods or ideas to accomplish this?
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.
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/
I am doing some research for what Map API to use for a coming project.
The main requirement is the ability to lock a map, and the ability to disable parts of the map.
Think about a special purpose map for Europe where I would like to disable and gray out the non-european countries.
A click on those grayed out areas should do nothing, meaning for all of the world except for Europe.
So, is it possible to disable large portions of the map?
Is it possible to add layers for the borders for each country, that is clickable, for instance on Germany?
I am looking at Bing or Google Maps at this point. Which one is more developer friendly one?
Bing looks so much nicer with the birds eye, much easier to read out the map and know what you are looking at. I find Googles full of clutter and always have problem knowing what I am looking at.
Possible approach(google-Maps): use a Polygon with multiple paths.
1 path for the entire world(vertices defined in clockwise order)
other paths for the enabled area(vertices defined in opposite clockwise order)
The result will be a polygon that covers the entire world with a hole for the enabled area. The map will not respond to click-events outside the enabled area(because it's covered by the polygon). The map will still respond to dblclick and zoom in, but this may be avoided by cancelling the propagation of the dblclick-event of the polygon.
It wouldn't be possible to gray out the dissabled area, but you could use the fillColor of the polygon to signalize which part of the map is disabled.
I am using Open Street Maps to show a map in my HTML5 application.
It uses a URL like this for the map tiles,
http://b.tile.openstreetmap.org/{Z}/{X}/{Y}.png
If I chose an area, say Auckland, New Zealand, how could I work out all of the values of Z, X, Y that would cover Auckland? I would be looking to write a script to go and grab all those images and cache them in an HTML5 database.
First of all, take a look at the tile usage policy section about bulk download. Secondly, this sort of caching is easily done using TileStache: configure a cache to render or fetch tiles from a certain source, then run tilestache-seed.py, passing in the bounding box (in WGS84 coordinates) and desired zoom levels, and you should end up with all needed tiles.