turf.js / turf.buffer and Google Maps API - google-maps-api-3

I have a simple Google Map. I've added a marker at a given lat, lng.
I want to use turf.js to calculate a 1km buffer which I can then display as a Google Maps polygon.
The path that turf.buffer() returns is an ellipse. The distance from the marker to the boundary is correct latitudinally. However it is short of 1km longitudinally. It looks like there is a problem with the projection, however both the Google Maps API and turf.js documents state WGS84 is the default projection.
The end game is using turf.js to buffer Points, Polylines and Polygons so I can't just draw a Google Maps circle as a workaround unfortunately. I would consider migrating to Leaflet, however we are already quite invested in developing for the Google Maps API
I've created an htm file here showing the problem

I'm not going nuts. The buffer isnt geodesic so at the equator you get a round buffer and as you move north or south your buffer becomes squashed longitudinally towards the poles. The turf.js team are aware. See https://github.com/Turfjs/turf/issues/110 for full details.
I'm looking at using clipper.js instead. This is a cartesian library (2d) so in the uk i can use osgb eastings and northings. I will also have to flip north and south as clipper assumes we are dealing with standard graphics i.e. The y axis is inverted like in css with 0,0 being the top left.
Im going to use geotools to transform between osgb and wgs.

Related

How to measure geometry efficiently in Google Map

I would like to add color to each house in the following google map example:
https://www.google.com/maps/#43.0748326,141.3479359,19z?hl=en
I found an example in leaflet that add colors to US states by giving the GeoJson data including the corners coordinates of each state. You can find the example here:
http://leafletjs.com/examples/choropleth.html
I would like to do it with Google Map. Two questions in front of me are:
1. How can I get the corner coordinates of houses?
2. As the number of houses which I want to add color is relatively large, how can I efficiently measure the corner coordinates of these houses?
How can I get the corner coordinates of houses?
You can't. The data in Google Maps API is not available to you, because of technical and legal restrictions.
You'll likely want to do this some other way: for instance, with OpenStreetMap data and one of the many services that visualizes it.

Map gps coordinates to given image with corresponding coordinate system

I have a map, which is accurate (enough) to the real world map, as viewed in google maps.
I'm projecting the drawn image using the google.maps.ImageMapType class, thus the corners of the new, drawn, map are (sw)-90,-180 and (ne)90,180.
Now, knowing the coordinates of the south-west and north-east of the overlay in the real-world map, how do I convert GPS coordinates to this new scale?
OK, I added a marker in "Paris" to your jsFiddle, but the marker is clearly not where it should be.
I think you might be mixing google.maps.MapType object and google.maps.ImageMapType
google.maps.ImageMapType uses a google.maps.ImageMapTypeOptions object, which should have a getTileUrl() method, but instead you have a getTile() method which is breaking the projection.

Plotting lat/lon points on Apple Maps vs Google Maps

I'm using Google Places to get latitude and longitude for places near a user, and then plotting those points on both Apple Maps (on iOS 6, using MKMapView) and plotting them on Google Maps (using Javascript V3). Now the problem is when I plot them on MKMapView the points are not in their correct positions, while on Google Maps they are. Why is this the case? Shouldn't plotting a latitude/longitude point on a map make it have the same point?
The points are the same. However The image overlays are going to be different. This could be due to the angles that the images where taken at, an we all know that Apple is having some small issues fixing there mapping program. I hope this helps.

Forcing polygon inside/outside in Google Maps V3?

My question is similar to this one on another SE site, which didn't seem to get answered very usefully:
https://gis.stackexchange.com/questions/10741/google-maps-js-api-v3-polygon-formation
I'm trying to shade large areas of the globe in Google Maps V3 using polygons. My issue is that that algorithm decides on its own which part of the map is "inside" the polygon and which is "outside".
From what I've been able to tell, the map always sets the South pole outside the polygon. Example jsfiddle: http://jsfiddle.net/YFJ6a/6/
I'm guessing from earlier questions about filling in the area outside a polygon (eg. Google Maps Polygon Outer Fill) that there's no way to simply invert a polygon. I've had some success in using the method described in the link, combining my polygon with a polygon that tightly circles the South pole:
[new google.maps.LatLng(-89.99,180), new google.maps.LatLng(-89.99,-120),
new google.maps.LatLng(-89.99,-60), new google.maps.LatLng(-89.99,0),
new google.maps.LatLng(-89.99,60), new google.maps.LatLng(-89.99,120),
new google.maps.LatLng(-89.99,180)]
The path above generates a polygon that covers pretty much the entire globe. But this is messy and only works if my shape doesn't actually intersect with this polygon, which I can't guarantee. (It's easy for me to wind up with polygons that cross directly at the pole, for example.)
Is there any cleaner or more direct way to accomplish this?

Can Google Maps show Terrain at 45 degrees

I need the terrain view but cant seem to show it at 45 degrees. I dont want to use the google earth plug-in though. Can this be done? If not: are there other map apis that do this?
It can't be done with Google Maps API. Tilted maps are only available with the satellite/aerial tiles.
The docs state "setTilt(): Sets the angle of incidence for aerial imagery (available for SATELLITE and HYBRID map types) measured in degrees from the viewport plane to the map plane. The only supported values are 0, indicating no angle of incidence (no tilt), and 45 indicating a tilt of 45deg."

Resources