Using leaflet, a line is constructed between 2 points with known coordinates of end points.
how can we get latitude and longitude of all points lying on that line.
As I said already in How to find every point [ coordinates ] between two geolocation coordinates?, the right way is to use geographiclib to fetch the azimuth and distance between points, and calculate new points using the same azimuth but different distances, and do research about great circles.
If you don't care about great circles and prefer to fetch the lat-lngs of the straight line as displayed in EPSG:3857, then use map.project, map.unproject and a tiny bit of linear interpolation.
Related
I got a set of wgs84 coordinates to place a polygon on Google Maps. I am wondering if i can use the same coordinates to get a compass direction of the coordinates. I don't need a solution specific for Google Maps, javascript or php. I am just wondering what the right approche would be.
Something like this would be the end result. I understand it needs some sort of algorithm in the background
I found Geolib and the 'getCompassDirection' function but this function only allows 2 points to create a line and get the bearing(angle) of that line.
You can't get any direction information out of a single position coordinate.
Position coordinates don't represent any knowledge about the orientation of an object. Therefore you need something that has direction (i.e. a vector between two coordinates) to calculate compass direction. That's exactly why the function you mentioned asks for two points.
This means you can get a compass direction for any edge of a polygon (by using its two end points), but not for its vertices.
Hope this helps!
I am using react-d3-map-bubble library to plot US map.
react lib- https://github.com/react-d3/react-d3-map-bubble
US map json file used - https://d3js.org/us-10m.v1.json
My target is to plot points on that map.
In current js file, counties object uses arcs and plots different points on US map. See here for pictorial discription - https://bl.ocks.org/mbostock/9943478
I have lat and longs instead of arcs/polygons.
So, in json file I will be changing 'countries' object with below sample :
{
"type": "GeometryCollection",
"geometries": [
{
"type": "Point",
"properties": {
"name": "Some place in New Mexico",
"population": 54590
},
"arcs": [
[]
],
"coordinates":[33.500142,-111.929818]
}
]
}
With given transform function in US json I am not able to put given coordinates to the correct place on the Map.
Transform function
"transform": {
"scale": [0.09996701564084985, 0.058373467440357915],
"translate": [-56.77775821661018, 12.469025989284091]
}
So,
How could I get correct transform function for my coordinates which uses topojson?
OR
How could I get all coordinates converted into arcs/polygons, which could be directly placed in "counties" object?
Topojson and coordinates
I think there is some confusion about what topojson does: "I have lat and longs instead of arcs/polygons".
Topojson saves space by applying a "quantized delta-encoding for integer coordinates", but the real space savings can come from the use of arcs (geojson would contain the mutual boundary of two features twice, once for each feature). But d3 doesn't actually draw topojson, the data is converted back into geojson (as seen in your linked example):
topojson.feature(us, us.objects.counties).features
If moving from geojson to topojson and back again, your original coordinate system remains unchanged. So if you start with lat longs, you'll finish with lat longs. Arcs and polygons aren't alternative coordinate systems, they are shapes built with coordinates in any given coordinate system.
Problem
The problem is your topojson has encoded coordinates that aren't latitude and longitude pairs - in this case they are pixel values so that the feature is drawn on a coordinate plane that stretches from [0,0] to [960,600] in svg coordinate space. Why would they be in this odd coordinate space that isn't latitude longitude? So that you don't need to use a projection to draw them, this is faster in the browser and simpler for an example like what Mike Bostock might be trying to demonstrate in the linked block.
The topojson uses a projected coordinate space (which is on a 2d Cartesian plane). Your latitude longitude uses geographic coordinate space (which are points on a three dimensional ellipsoid).
Solutions
To convert your points to projected coordinate space you need to apply the same projection if you want features to be aligned.
Alternatively, you can get unprojected data for the US and project that and your latitude longitude points with the same projection.
Apply the same projection used for the US to each point
Normally you are not be able to easily figure out what projection a geojson or topojson (or shapefile for that matter if it is without a .prj file) uses if it is already projected. In this case we know it is a composite d3.geoAlbersUsa() projection, but we don't know the projection's parameters so we can't use it, unless we had access to additional data about the file, or if we made it ourselves and as a consequence knew what parameters we used.
Even if we had this information, we may find it cumbersome to scale the map for different svg/canvas sizes, as we would need to scale both projected data and unprojected data differently since we would be working with two different coordinate systems.
Get unprojected data for the US
It is not too difficult to find geographic data for the US states/counties/etc online. If you find shapefiles, they are easy to convert in tools such as mapshaper.org, though geojson or topojson files shouldn't be hard to find either. You just need to make sure that the coordinates use latitude longitude pairs (with the order of [long,lat], the example coordinate in your question uses [lat,long] which won't work.) rather than any other coordinate system.
Once you have this you need to make sure you apply the same projection to all features.
Why Scale and Translate Don't Help
The scale and translate of the topojson also don't refer to the projection parameters, but the quantized delta encoding used in the topojson.
I need a vector world map in JS/Flash that supports display of dots based on their lat/lon coordinates. I need to use this for a office locator, for a company with offices around the world. The idea is you click on the office in the list, and the map navigates to the dot of that office. Dots are displayed for all offices.
JVectorMap is built with JS, but does not support Lat/Lon, as far as I can see
SVG World Map is built with jQuery, but no Lat/Lon, it only supports clicking countries
This question (and this gist) uses D3 to draw a map possibly with Lat/Lon dots
Vis4 contains 100+ projections, and possibly supports lat/lon
GerbenRobijn has an equirect map with lat/lon support
How do I engineer a map to support Lat/Lon coordinates, and convert X/Y to Lat/Lon (convert mouse coordinates to Lat/Lon), and convert Lat/Lon to X/Y (convert Geo-marker to a dot on the map)
All of the decent map packages have a "Lat/Lon support". The help page for your first example, JVectorMap, describes two functions:
latLngToPoint
Converts coordinates expressed as latitude and longitude to the coordinates in pixels on the map.
pointToLatLng
Converts cartesian coordinates into coordinates expressed as latitude and longitude.
The 'setFocus' in the same package can accept either lat/lon or x, y coordinates.
I fail to see a problem.
I am developing an application via the Google Maps API (Version 3).
I have 2 google.maps.LatLng objects named loc1 and loc2.
How do I calculate the distance between them in say meters?
I have tried using various tricks from this question to convert latitude/longitude measures into meters. However, I question the reliability of my implementation.
I have also tried implementing a distance matrix, but I think that a distance matrix is a lot of work just to calculate the distance between 2 points.
Thank you!
Sounds simple, I recommend the geometry library,
https://developers.google.com/maps/documentation/javascript/reference#spherical
computeDistanceBetween(from:LatLng, to:LatLng, radius?:number)
From my experience the result is in meters. Remember to add the optional geometry library in your tag
<script type="text/javascript"
src="http://maps.googleapis.com/maps/api/js?libraries=geometry&sensor=false">
</script>
Calculating distances between two points basically boils down to pythagoras (sum of the squares etc). However, this doesn't really work with Lat & Lon (which are coordinates on a sphere). What I do is convert the Lat & Lon values to the local map grid which is flat. Then I can use pythagoras to calculate the distance between those points. I've already posted on this in Stack Overflow here. This will have all the code you would need.
Your question is a bit ambiguous.
I mean - when you say the distance, do mean
distance in a straight line
or driving distance,
or bicycle distance,
or walking distance.
The answer to this question will determine your implementation.
If it is a straight line distance you need, then it is best to use the haversine implementation.
Otherwise, you will need to request directions from the google directions service, specifying the mode of "transport".
When you've finished you can test the distance between two points on a straight line using the provided map. It will give you a visual as well as the distance.
I want to create a data visualization similar to this:
...but for the entire globe. The canvas size will be arbitrary but won't need to resize with the browser (I will set the width and height before I start plotting points). I need to figure out a way of converting latitude and longitude coordinates to points on the canvas. Does anyone know how to do it?
First of all you need to choose projection. Then you can use proper formula. Or you can just use existent solution like proj4js for example. This is JS port of well-known proj utility for working with various projections.
I would recommend to use Miller Projection for the visualizations on the whole globe. You can find formulas here.