optimize x and y axis accuracy

[edinaldofcs]

Working on a personal project, I faced the same problem I encountered with this project... accuracy. One of the ways I found to minimize the variation in the x and y axes was to create an object, which captures the positions of the two axes and a function to return the simple arithmetic average of the last n samples.

var average = { x1: [], y1: [] };

function getAverage(x, y, iterations) {
   if (average.x1.length == iterations) {
     average.x1.shift();
     average.y1.shift();
   }

   average.x1.push(x);
   average.y1.push(y);

   let x1 = average.x1.reduce((acc, val) => acc + val, 0);
   let y1 = average.y1.reduce((acc, val) => acc + val, 0);

   x1 = x1 / average.x1.length;
   y1 = y1 / average.y1.length;

   return [`${x1}px`, `${y1}px`];
}

In this way, it is possible to add the axes more accurately

let [x01,y01] = getAverage(i.x, i.y,10)
...
(nB.style.transform = "translate3d(" + x01 + "," + y01 + ",0)");

[jeffhuang]

Cool, you may check out the Kalman filter feature as well, in the Calibration Demo.