I'm looking to compute euler angles based on analog sensor data in javascript. The sensor data includes gyro, accelerometer, and magnetometer data in 3d. The math is a little over my head, and looking for any help or tips.
Thanks!
It is not clear what you are asking for. Is it sensor fusion that you are trying to implement? Or you already have it and you want to get Euler angles from the orientation (rotation matrix or quaternion)?
I have implemented sensor fusion for Shimmer 2 devices based on this manuscript. I highly recommend it.
Euler angles are evil, don't use them. They mess up the stability of your application and they cannot be used for interpolation.
JavaScript seems a little odd choice for this type of task.
Related
I'm relatively new to Mapbox and its GL JS Library, but so far have been really impressed at its capabilities.
I'm currently working with a dataset of approximately 100,000 points and am trying to devise a way of quickly generating/visualising a continuous interpolated surface within the convex hull of the dataset I have (essentially trying to generate something that's as fast/responsive as the heatmap function, but looking to interpolate from the point data values rather than spatial density).
The documentation for the heatmap functionality discusses this exact scenario:
Among maps you'll find on the web, there are two common categories of
heatmaps: those that encourage the user to explore dense point data,
and those that interpolate discrete values over a continuous surface,
creating a smooth gradient between those points. The latter is less
common and most often used in scientific publications or when a
phenomenon is distributed over an area in a predictable way. For
example, your town may only have a few weather stations, but your
favorite weather app displays a smooth gradient of temperatures across
the entire area of your town. For your local weather service, it is
reasonable to assume that, if two adjacent stations report different
temperatures, the temperature between them will transition gradually
from one to the next.
But then proceeds to explain this is less common and there's no documentation/example provided for this type of application.
At this stage I've tried converting the points to voronoi cell polygons and colour coding by data value (a nearest neighbour approach to visualising), but the render seems to struggle with 100,000 points at lower zoom levels (0 through 8). Does anyone know if it's possible to create a fast-rendering surface interpolation from point values? Any examples would be fantastic.
The Mapbox Delaunator library is a very fast JavaScript library for Delaunay triangulation of 2D points. d3-delaunay and d3-geo-voronoi are both based off of this library. You could use these libraries and then display the results on your map via a custom style layer.
Looks like what you are trying to do is some sort of Spatial Interpolation.
Here is a summary of popular methods typically used for this purpose.
https://michaelminn.net/tutorials/r-spatial-interpolation/
I work on a database collecting archaeological sites. A goal of our project is to make the data accessible on the web. I would like to plot them on a GeoTIFF to show their distribution and change over time. I further want to calculate Delaunay triangulations and a heatmap which you could display as an overlay. Its important to me to visualize the change over time as an animation. I choose p5.js/processing because I'm not a very skilled programmer (some R, NetLogo and Processsing). i think it will fit the task especially regarding the animation. Before I get into more detail my first question is:
Is this a wise choice of tools? Would you recommend other tools?
If you think my choice is vital here is my second question:
I came across Daniel Shiffmans tutorial on visualizing earthquake data in p5.js and this comes close to what I would do:
https://www.youtube.com/watch?v=ZiYdOwOrGyc
The code is here:
https://github.com/CodingTrain/Rainbow-Code/blob/master/CodingChallenges/CC_57_Earthquake_Viz/sketch.js
In the above example he relies on mapbox.js. I would prefer to use a custom build GeoTiff from our project and avoid mapbox since its not 100% free. But how do I get his code to work with a custom GeoTiff as basemap? I can set his variables "clon" and "clat" to my custom Tiff center point but the coordinates did not get transformed right. I think the Problem is the in the zoom level aka "zoom". But how to determine the Zoom for my custom map? I did not find any other implementation of web mercator projection in p5.js nor processing. Or do i get the math beyond projection wrong?
I'm not very proficient with p5.js, but I have a good experience using d3.js for various dataviz tasks, including crunching geodata. So my suggestion would be to use best of both worlds — use p5.js for rendering and d3.js for data manipulation. In your case, it seems like you will need a simple reprojection (LonLat to Mercator).
To reiterate:
Use d3.js to project data from whatever projection it is (LonLat) into projection that p5.js is using (Mercator)
Render projected data in p5.js
Quick googling landed me this guide on d3 + p5 integration
On the d3 side, there is an API documentation
And here is a good example of GeoTIFF reading/rendering in d3.js. Ok, here is one more.
I have variable no of coordinates of a curve lying on it.
The data points range from 50 to 10,000 in number and 1ps(1 pico second) to 10000s in value.
From the given points I have plotted the curve on HTML Canvas. Now I need to find out the Equation of the curve from the data points I have. Equation can be of any degree viz linear, quadratic, qubic.... nth degree.
I have searched over internet and found Interpolation can help. So far have found Lagrange Interpolation and Spline Interpolation.
Could anyone advise me which is the best method to find the equation(may be other than the two mentioned above). Also can Someone please guide me how can I solve these Expressions/Equations in JavaScript as I am not able to Multiply/ Divide the two or more expressions. I need to keep expressions as string or is there any better way of doing so and implementing mathematics.
A third party library could also be helpful but only if it has MIT license.
I have been working on a small app that controls the rotation of a cubic map panorama via the gyroscope of a mobile device or tablet. I finally have it working, albeit roughly. My solution involved converting the euler angles coming in from the gyroscope into rotational matrices and passing those matrices through various modification matrices.
Now that I have this working, I am looking to smooth out the animation. I was thinking it would be best to collect rotational data in an array and then take their average. However, I am totally unsure how to do this.
Can I average the rotational matrices, or the euler angles themselves? Or am I going to need to convert the data into Quaternions and then apply some kind of averaging function?
Any help would be great. Thanks!
Can I average the rotational matrices, or the euler angles themselves?
Nope.
Or am I going to need to convert the data into Quaternions and then apply some kind of averaging function?
Yes, only quaternions are appropriate for inter/extrapolation. See 45:05 here (David Sachs, Google Tech Talk).
I haven't done smoothings like the one you are looking for but in any case, only quaternions are appropriate.
Quaternion Slerps are commonly used to construct smooth animation
curves ...
From Wikipedia, Slerp.
My mobile web app utilizes navigator.geolocation.watchPosition to track polylines and waypoints for historical walking tours. (A customer requirement no-native app)
My first testing was done in a vehicle due to bad weather and seemed to produce reasonable results when plotting the polyline on an embedded Google Map in real-time. However, when walking it produced a more zig zag line.
Some research has revealed that I need to filter the retrieved location instead of just calculating the distance of two points.
The suggested filter, Kalman filter, seems to be something over my head, and I'm wondering whether there is an open source implementation for JavaScript available, which can be of help for my use case.
An open source C/C++ implementation of the Kalman filter that could be compiled to JavaScript using emscripten might be of help too.
I posted a simple Kalman filter that can be used for geolocation data in an answer to this question: Smooth GPS data . It was designed for Android, where the GPS location readings are accompanied by a single error-bar number called accuracy which is measured in metres. That means that for each GPS location reading, with 67% probability the true location is within the circle centered on the specified location, and the radius of the circle is given by the accuracy number. If your situation is different then a bit of work will be required, and if so I would suggest that you edit the question to spec out in more detail what inputs you have for the Kalman filter.