2 ms·

While I was working on the PowerBI globe map visualization https://powerbi.microsoft.com/en-us/blog/visual-awesomeness-unlocked-the-globe-map/ https://powerbi.m

by nojvek 8y ago

While I was working on the PowerBI globe map visualization https://powerbi.microsoft.com/en-us/blog/visual-awesomeness-unlocked-the-globe-map/ https://powerbi.microsoft.com/en-us/blog/visual-awesomeness-... (video in link) I had to do some funky magic to stitch square tiles in a sphere from bing maps and do reverse mercerator projection. I had to also ensure GPS coordinates would exactly align to the right pixel otherwise the 3D chart would all look weird. So there was a lot of fun math involved over a bunch of evenings and weekends. The hard part though, was to do an animation that would unravel a spherical earth into a flat earth and vice versa. Naive me though it would be a simple linear interpolation that would take a couple of minutes but it ended up being many many nights of crazy mathematics to get it right. Map projections are really interesting. Much respect to their inventors.

kccqzy 8y ago
I'm interested in learning more! I imagined linear interpolation could work too. What went wrong?
- nojvek 8y ago
  This does a hemisphere but doesn’t map lng and lat. Gives an example of the kind of maths involved. https://math.stackexchange.com/questions/1334241/interpolate-between-3d-plane-and-3d-hemisphere https://math.stackexchange.com/questions/1334241/interpolate... It’s not a simple linear x0, y0, z0 -> x1, y1, z1 because you kind of want an animation like a square blanket is wrapping around a ball, stretching the right amount in different places such that it becomes a sphere. I tried to find a single magical equation that would give a x0, y0, 0 -> x1, y1, z1 based on param t that goes from 0 - 1. I’m sure there exists one but I tried all sorts of fancy math I knew for a day or two and still had major trouble writing it down as a single equation function. Then I thought about it in a different way after I ate a fruit and realized I need an orange analogy. What if we cut slices of orange. The ends are crescent shapes. Now it’s a matter of animating the crescents into rectangular strips where the pointy ends stretches but the middle part remains the same. Since in computer graphics, a sphere isn’t really a true sphere, but an approximation with triangles the strip analogy works well. We just need to animate the ends of triangles. The gotcha is the pointy end of sphere expands from 0 to length of mercerator projection (flat square) so they cut a tiny bit of the top and bottom otherwise you have infinite stretching at the end So you have three little functions. For an x,y in a square you figure out what slice they go into and what side of the slice. The further to the poles, the more you squeeze towards the center, so you get something like this https://blenderartists.org/t/producing-a-12-petal-gores-from-a-uv-projection-sphere/637809 https://blenderartists.org/t/producing-a-12-petal-gores-from... Then you have a blanket wrapping function I.e morphing a line into circle and that’s a line -> arc -> circle animation. That’s not too hard. The arc of a very large circle is almost flat. So you divide the line into two and animate the left and right segments into two hemicircle arcs that then form a proper circle. Kind of like curving the lines from the end to bend it into a circle. Now longitudes and latitudes both go through this line to circle animation. To get the z, we take the x arc position, the y arc position, the point on crescent strip and we do matrix rotate transforms to get final x,y,z So rather than it being one single equation (which i’m guessing is possible using super crazy maths), we take a piecemeal approach and animate lots of little segments that add up as a plane to sphere animation using simpler maths and matrix transforms.

by nojvek 8y ago

kccqzy 8y ago

I'm interested in learning more! I imagined linear interpolation could work too. What went wrong?

nojvek 8y ago
This does a hemisphere but doesn’t map lng and lat. Gives an example of the kind of maths involved. https://math.stackexchange.com/questions/1334241/interpolate-between-3d-plane-and-3d-hemisphere https://math.stackexchange.com/questions/1334241/interpolate... It’s not a simple linear x0, y0, z0 -> x1, y1, z1 because you kind of want an animation like a square blanket is wrapping around a ball, stretching the right amount in different places such that it becomes a sphere. I tried to find a single magical equation that would give a x0, y0, 0 -> x1, y1, z1 based on param t that goes from 0 - 1. I’m sure there exists one but I tried all sorts of fancy math I knew for a day or two and still had major trouble writing it down as a single equation function. Then I thought about it in a different way after I ate a fruit and realized I need an orange analogy. What if we cut slices of orange. The ends are crescent shapes. Now it’s a matter of animating the crescents into rectangular strips where the pointy ends stretches but the middle part remains the same. Since in computer graphics, a sphere isn’t really a true sphere, but an approximation with triangles the strip analogy works well. We just need to animate the ends of triangles. The gotcha is the pointy end of sphere expands from 0 to length of mercerator projection (flat square) so they cut a tiny bit of the top and bottom otherwise you have infinite stretching at the end So you have three little functions. For an x,y in a square you figure out what slice they go into and what side of the slice. The further to the poles, the more you squeeze towards the center, so you get something like this https://blenderartists.org/t/producing-a-12-petal-gores-from-a-uv-projection-sphere/637809 https://blenderartists.org/t/producing-a-12-petal-gores-from... Then you have a blanket wrapping function I.e morphing a line into circle and that’s a line -> arc -> circle animation. That’s not too hard. The arc of a very large circle is almost flat. So you divide the line into two and animate the left and right segments into two hemicircle arcs that then form a proper circle. Kind of like curving the lines from the end to bend it into a circle. Now longitudes and latitudes both go through this line to circle animation. To get the z, we take the x arc position, the y arc position, the point on crescent strip and we do matrix rotate transforms to get final x,y,z So rather than it being one single equation (which i’m guessing is possible using super crazy maths), we take a piecemeal approach and animate lots of little segments that add up as a plane to sphere animation using simpler maths and matrix transforms.