I want to build a Node JS application that generates an SVG image from geographic coordinates it fetches from overpass.
I tried to implement that by just using the geographic coordinates as coordinates for SVG paths, but the result looks distorted (it should look like this):
I assume the problem is that the earth is actually a sphere and there needs to be done some math in order to get a correct map projection.
What is the actual problem here? Are there any existing algorithms or libraries to cope with that?
The math behind this is called map projection.
Many online maps use the Mercator projection. The OSM Wiki has example code in various languages. I'm sure you will find more libraries on the Internet.
Related
I am working on a 2d fantasy map displayed in browser via WebGL. Here is what it looks like:
It is procedurally generated so you can move wherever you want but you can also zoom and unzoom without losing quality. I would like to add assets in some places, especially mountains when the altitude is high. I have those assets as vector images (.svg) so that you can still zoom in without losing quality. The thing is I have no idea how I could draw them on screen. I think I would need to convert those vectors to vertices of triangles but I am wondering if there is an automatic way to do it. I heard about something called SVGLoader but I think this is only for threejs and I am using webgl alone. What would you advise me to do?
edit: I just found https://github.com/MoeYc/svg-webgl-loader which looks interesting
I am an undergraduate student working with detecting defects on a surface of an object, in a given digital image using image processing technique. I am planning on using OpenCV library to get image processing functions. Currently I am trying to decide on which defect detection algorithm to use, in order to detect defects. This is one of my very first projects related to this field, so it will be appreciated if I can get some help related to this issue. The reference image with a defect (missing teeth in the gear), which I am currently working with is uploaded as a link below ("defective gear image").
defective gear image
Get the convex hull of a gear (which is a polygon) and shrink is slightly so that it crosses the teeth. Make sure that the centroid of the gear is the fixed point.
Then sample the pixels along the hull, preferably using equidistant points (divide the perimeter by a multiple of the number of teeth). The unwrapped profile will be a dashed line, with missing dashes corresponding to missing teeth, and the problem is reduced to 1D.
You can also try a polar unwarping, making the outline straight, but you will need an accurate location of the center.
I have an object in blender that has sharp corners, and easily distinguishable faces, exactly what I want. However, when I place it in Unity all of the vertices smooth out, and it is impossible to see what you are looking at. How do I get the same object that I have in Blender to show up in unity?
This is tackled here
blender-normal-smoothing-import-problem
Also you can calculate the normals on import via 'Smoothing angle' which will edge break/phong break based on the angles
I'm using Raphael JS to display a scrollable, zoomable map of the world, which is working fine. But any 2D representation of a globe is going to be distorted. If possible I'd like to transform the map so that the top and bottom are pinched in, to make the map at least a little bit more representative of a globe. Is it possible to achieve such effects with Raphael's matrix, or by hacking deeper into it to insert a manual transformation?
You can't achieve this effect with Raphael's tranform (or SVG's native matrix transform). Raphael is an excellent vector drawing library, but trying to use maps on it is somewhat akin to using Illustrator when you should be using a GIS, posible but not ideal.
If you can afford to lose IE 8 =< support, d3.js is an SVG visualization library that supports geographic projections. Take a look at this demo http://mbostock.github.com/d3/talk/20111018/azimuthal.html
Otherwise, I'd recommend getting the source for a map with a projection more suited to your needs, such as this one http://en.wikipedia.org/wiki/File:BlankMap-World6.svg. But then it would be more difficult to convert lon lat to pixels.
I got my country lat/long boundaries from koordinates.com. Now I want to fill in the interior with dots.
Since the file I have is KML, I was thinking of converting the coordinates to cartesian using the NetTopologySuite.
I do not want a polygon overlay. I want to generate dots/coordinates for the polygons interior - ideally at a density of my choosing.
I have seen algorithms like this one, http://alienryderflex.com/polygon_fill/. Is there a library that will do this for me? Alternatively, can someone share code?
Ultimately, I will convert the dot coordinates back to lat/long and populate a globe like this one
http://code.google.com/p/webgl-globe/
I'm affraid GIS isn't my area of expertise, but I've got two ideas:
Generate a set of random points. You can use a Point-In-Polygon function to determine if you're points are in the right place.
You can use a rectangle grid of points and use a 'resolution' to determine how many points there will be and how close. You can offset the grid positions to make them look more random if you need to. You'll check if the point inside the bounding rectangle of your polygon is inside the polygon or not.
Notice that the webgl-globe example uses a grid of points(similar to point(2)) converted to spherical coordinates.
Both ideas is kind of similar, only the points distribution differs.
You can find a roughly related implementation I did using actionscript here,
but I would also suggest asking on the GIS site.