fix(getOrientedFastKeypoints): orientation was wrong

Author: opatiny

src/featureMatching/descriptors/utils/__tests__/getKeypointPatch.test.ts

@@ -22,13 +22,15 @@ test.each([
     expected: 8,
   },
 ])('default options ($message)', (data) => {
-  const image = testUtils.load(
-    `featureMatching/polygons/${data.image}.png` as TestImagePath,
-  );
+  const image = testUtils
+    .load(`featureMatching/polygons/${data.image}.png` as TestImagePath)
+    .invert();
 
   const grey = image.convertColor(ImageColorModel.GREY);
 
-  const allKeypoints = getOrientedFastKeypoints(grey, { windowSize: 15 });
+  const allKeypoints = getOrientedFastKeypoints(grey, {
+    centroidPatchDiameter: 15,
+  });
   const keypoints = getBestKeypointsInRadius(allKeypoints, 10);
 
   expect(keypoints).toHaveLength(data.expected);
@@ -43,13 +45,15 @@ test.each([
 });
 
 test('patch had black pixels on border', () => {
-  const image = testUtils.load(
-    `featureMatching/polygons/polygonRotated180degrees.png`,
-  );
+  const image = testUtils
+    .load(`featureMatching/polygons/polygonRotated180degrees.png`)
+    .invert();
 
   const grey = image.convertColor(ImageColorModel.GREY);
 
-  const allKeypoints = getOrientedFastKeypoints(grey, { windowSize: 15 });
+  const allKeypoints = getOrientedFastKeypoints(grey, {
+    centroidPatchDiameter: 15,
+  });
   const keypoints = getBestKeypointsInRadius(allKeypoints, 10);
   const keypoint = keypoints[4];
 
@@ -79,9 +83,12 @@ test.each([
 ])('windowSize = 15 ($message)', (data) => {
   const image = testUtils
     .load(`featureMatching/polygons/${data.image}.png` as TestImagePath)
-    .convertColor(ImageColorModel.GREY);
+    .convertColor(ImageColorModel.GREY)
+    .invert();
 
-  const keypoints = getOrientedFastKeypoints(image, { windowSize: 15 });
+  const keypoints = getOrientedFastKeypoints(image, {
+    centroidPatchDiameter: 15,
+  });
 
   for (let keypoint of keypoints) {
     expect(getKeypointPatch(image, keypoint)).toMatchImageSnapshot();

src/featureMatching/keypoints/__tests__/__image_snapshots__/get-oriented-fast-keypoints-test-ts-angle-diff-should-be-90-1-snap.png

@@ -1,8 +1,9 @@
+import { TestImagePath } from '../../../../test/TestImagePath';
 import { ImageColorModel } from '../../../Image';
 import { drawKeypoints } from '../../visualize/drawKeypoints';
 import { getOrientedFastKeypoints } from '../getOrientedFastKeypoints';
 
-test('7x7 image, angle = 90°', () => {
+test('7x7 image, angle = -90°', () => {
   const image = testUtils.createGreyImage([
     [0, 0, 0, 0, 0, 0, 0],
     [0, 0, 0, 0, 0, 0, 0],
@@ -15,7 +16,45 @@ test('7x7 image, angle = 90°', () => {
 
   const result = getOrientedFastKeypoints(image)[0];
   expect(result).toStrictEqual({
-    angle: 90,
+    angle: -90,
+    origin: { row: 3, column: 3 },
+    score: 2780,
+  });
+});
+
+test('7x7 image, angle = 135°', () => {
+  const image = testUtils.createGreyImage([
+    [100, 0, 0, 0, 0, 0, 0],
+    [0, 100, 0, 0, 0, 0, 0],
+    [0, 0, 100, 0, 0, 0, 0],
+    [0, 0, 0, 200, 0, 0, 0],
+    [0, 0, 0, 0, 0, 0, 0],
+    [0, 0, 0, 0, 0, 0, 0],
+    [0, 0, 0, 0, 0, 0, 0],
+  ]);
+
+  const result = getOrientedFastKeypoints(image)[0];
+  expect(result).toStrictEqual({
+    angle: -225,
+    origin: { row: 3, column: 3 },
+    score: 2780,
+  });
+});
+
+test('7x7 image, angle = -135°', () => {
+  const image = testUtils.createGreyImage([
+    [0, 0, 0, 0, 0, 0, 0],
+    [0, 0, 0, 0, 0, 0, 0],
+    [0, 0, 0, 0, 0, 0, 0],
+    [0, 0, 0, 200, 0, 0, 0],
+    [0, 0, 100, 0, 0, 0, 0],
+    [0, 100, 0, 0, 0, 0, 0],
+    [100, 0, 0, 0, 0, 0, 0],
+  ]);
+
+  const result = getOrientedFastKeypoints(image)[0];
+  expect(result).toStrictEqual({
+    angle: 225,
     origin: { row: 3, column: 3 },
     score: 2780,
   });
@@ -53,12 +92,12 @@ test('7x7 image, angle = 0°', () => {
 
   const result = getOrientedFastKeypoints(image)[0];
   expect(result).toStrictEqual({
-    angle: 0,
+    angle: -0,
     origin: { row: 3, column: 3 },
     score: 2680,
   });
 });
-test('7x7 image, angle = -45°', () => {
+test('7x7 image, angle = 45°', () => {
   const image = testUtils.createGreyImage([
     [0, 0, 0, 0, 0, 0, 100],
     [0, 0, 0, 0, 0, 100, 0],
@@ -69,6 +108,25 @@ test('7x7 image, angle = -45°', () => {
     [0, 0, 0, 0, 0, 0, 0],
   ]);
 
+  const result = getOrientedFastKeypoints(image)[0];
+  expect(result).toBeDeepCloseTo({
+    angle: 45,
+    origin: { row: 3, column: 3 },
+    score: 2780,
+  });
+});
+
+test('7x7 image, angle = -45°', () => {
+  const image = testUtils.createGreyImage([
+    [0, 0, 0, 0, 0, 0, 0],
+    [0, 0, 0, 0, 0, 0, 0],
+    [0, 0, 0, 0, 0, 0, 0],
+    [0, 0, 0, 200, 0, 0, 0],
+    [0, 0, 0, 0, 100, 0, 0],
+    [0, 0, 0, 0, 0, 100, 0],
+    [0, 0, 0, 0, 0, 0, 100],
+  ]);
+
   const result = getOrientedFastKeypoints(image)[0];
   expect(result).toBeDeepCloseTo({
     angle: -45,
@@ -77,6 +135,44 @@ test('7x7 image, angle = -45°', () => {
   });
 });
 
+test('patch with one keypoint', () => {
+  const image = testUtils.load('featureMatching/patch.png').invert();
+
+  const keypoints = getOrientedFastKeypoints(image);
+
+  expect(
+    drawKeypoints(image, keypoints, { markerSize: 7, showOrientation: true }),
+  ).toMatchImageSnapshot();
+
+  expect(keypoints).toBeDeepCloseTo([
+    {
+      angle: -187.205,
+      origin: { row: 15, column: 14 },
+      score: 3290,
+    },
+  ]);
+});
+
+test('patch with one keypoint, centroidPatchDiameter=15', () => {
+  const image = testUtils.load('featureMatching/patch.png').invert();
+
+  const keypoints = getOrientedFastKeypoints(image, {
+    centroidPatchDiameter: 15,
+  });
+
+  expect(
+    drawKeypoints(image, keypoints, { markerSize: 7, showOrientation: true }),
+  ).toMatchImageSnapshot();
+
+  expect(keypoints).toBeDeepCloseTo([
+    {
+      angle: 191.8,
+      origin: { row: 15, column: 14 },
+      score: 3290,
+    },
+  ]);
+});
+
 test('check we handle edge cases properly', () => {
   const image = testUtils
     .load('featureMatching/crop1.png')
@@ -98,111 +194,42 @@ test('angle should never be NaN', () => {
   }
 });
 
-test('check angle for different windowSize', () => {
-  const image = testUtils
-    .load('featureMatching/polygons/scaleneTriangle10.png')
-    .convertColor(ImageColorModel.GREY);
-
-  const keypoints7 = getOrientedFastKeypoints(image);
-  const keypoints15 = getOrientedFastKeypoints(image, { windowSize: 15 });
-  const keypoints31 = getOrientedFastKeypoints(image, { windowSize: 31 });
-
-  expect([keypoints7, keypoints15, keypoints31]).toBeDeepCloseTo(
-    [
-      [
-        {
-          origin: { row: 607, column: 132 },
-          score: 2680,
-          angle: 145.3,
-        },
-        {
-          origin: { row: 50, column: 292 },
-          score: 2662,
-          angle: -112.2,
-        },
-      ],
-      [
-        {
-          origin: { row: 607, column: 132 },
-          score: 2680,
-          angle: 123.7,
-        },
-        {
-          origin: { row: 50, column: 292 },
-          score: 2662,
-          angle: -95.4,
-        },
-      ],
-      [
-        {
-          origin: { row: 607, column: 132 },
-          score: 2680,
-          angle: 120,
-        },
-        {
-          origin: { row: 50, column: 292 },
-          score: 2662,
-          angle: -92.1,
-        },
-      ],
-    ],
-    1,
-  );
-});
-
-test('angle diff should be 90°', () => {
-  const windowSize = 15;
-  const markerSize = 15;
+test.each([
+  {
+    message: 'betterScaleneTriangle',
+    image: 'betterScaleneTriangle',
+  },
+  {
+    message: 'betterScaleneTriangle90',
+    image: 'betterScaleneTriangle90',
+  },
+])('orientation should look correct ($message)', (data) => {
+  const markerSize = 7;
 
   const image = testUtils
-    .load('featureMatching/polygons/betterScaleneTriangle.png')
-    .convertColor(ImageColorModel.GREY);
-
-  const rotated = testUtils
-    .load('featureMatching/polygons/betterScaleneTriangle90.png')
-    .convertColor(ImageColorModel.GREY);
-
-  const keypoints = getOrientedFastKeypoints(image, { windowSize });
-  const keypointsRotated = getOrientedFastKeypoints(rotated, { windowSize });
-  console.log(keypoints, keypointsRotated);
+    .load(`featureMatching/polygons/${data.image}.png` as TestImagePath)
+    .convertColor(ImageColorModel.GREY)
+    .invert();
+  const keypoints = getOrientedFastKeypoints(image);
 
   expect(
     drawKeypoints(image, keypoints, { markerSize, showOrientation: true }),
   ).toMatchImageSnapshot();
-  expect(
-    drawKeypoints(rotated, keypointsRotated, {
-      markerSize,
-      showOrientation: true,
-    }),
-  ).toMatchImageSnapshot();
+});
 
-  expect([keypoints, keypointsRotated]).toBeDeepCloseTo(
-    [
-      [
-        {
-          origin: { row: 607, column: 132 },
-          score: 2680,
-          angle: 145.3,
-        },
-        {
-          origin: { row: 50, column: 292 },
-          score: 2662,
-          angle: -112.2,
-        },
-      ],
-      [
-        {
-          origin: { row: 607, column: 132 },
-          score: 2680,
-          angle: 123.7,
-        },
-        {
-          origin: { row: 50, column: 292 },
-          score: 2662,
-          angle: -95.4,
-        },
-      ],
-    ],
-    1,
-  );
+test('check angle for different windowSize', () => {
+  const image = testUtils
+    .load('featureMatching/polygons/scaleneTriangle10.png')
+    .convertColor(ImageColorModel.GREY)
+    .invert();
+
+  const angle77 = getOrientedFastKeypoints(image)[0].angle;
+  const angle15 = getOrientedFastKeypoints(image, {
+    centroidPatchDiameter: 15,
+  })[0].angle;
+  const angle31 = getOrientedFastKeypoints(image, {
+    centroidPatchDiameter: 31,
+  })[0].angle;
+
+  expect([angle77, angle15, angle31]).toBeDeepCloseTo([69.81, 62.84, 61.79], 0);
 });

src/featureMatching/keypoints/__tests__/__image_snapshots__/get-oriented-fast-keypoints-test-ts-angle-diff-should-be-90-2-snap.png

@@ -61,6 +61,7 @@ test('patch, default options', () => {
   const radius = 3;
 
   const centroid = getPatchIntensityCentroid(image)[0];
+  expect(centroid).toBeDeepCloseTo({ column: -1.179, row: -0.183 });
 
   const center = image.getCoordinates(ImageCoordinates.CENTER);
 

src/featureMatching/keypoints/__tests__/__image_snapshots__/get-oriented-fast-keypoints-test-ts-orientation-should-look-correct-better-scalene-triangle-1-snap.png

@@ -1,5 +1,5 @@
 import { Image } from '../../Image';
-import { getAngle } from '../../maskAnalysis/utils/getAngle';
+import { getMathAngle } from '../../maskAnalysis/utils/getAngle';
 import { toDegrees } from '../../utils/geometry/angles';
 import { getRadius } from '../../utils/getRadius';
 import { checkBorderDistance } from '../utils/checkBorderDistance';
@@ -14,16 +14,16 @@ import { getPatchIntensityCentroid } from './getPatchIntensityCentroid';
 export interface GetOrientedFastKeypointsOptions
   extends GetFastKeypointsOptions {
   /**
-   * Window size for the intensity centroid computation.
+   * Diameter of the circle used for compotuation of the intensity centroid.
    *
    * @default 7
    */
-  windowSize?: number;
+  centroidPatchDiameter?: number;
 }
 
 export interface OrientedFastKeypoint extends FastKeypoint {
   /**
-   * Clockwise angle of the keypoint in degrees with regard to a horizontal line.
+   * Orientation of the keypoint defined as the angle in degrees between the x axis , the keypoints origin and the center of mass of the keypoint.
    */
   angle: number;
 }
@@ -42,7 +42,7 @@ export function getOrientedFastKeypoints(
   image: Image,
   options: GetOrientedFastKeypointsOptions = {},
 ): OrientedFastKeypoint[] {
-  const { windowSize = 7 } = options;
+  const { centroidPatchDiameter: windowSize = 7 } = options;
 
   const fastKeypoints = getFastKeypoints(image, options);
 
@@ -62,7 +62,7 @@ export function getOrientedFastKeypoints(
       center: keypoint.origin,
       radius,
     })[0];
-    const angle = toDegrees(getAngle({ column: 0, row: 0 }, centroid));
+    const angle = toDegrees(getMathAngle({ column: 0, row: 0 }, centroid));
     orientedFastKeypoints.push({ ...keypoint, angle });
   }
   return orientedFastKeypoints;