Transform specific projectPoint

src/geo/projection/globe_transform.ts

@@ -317,6 +317,10 @@
         return this.currentTransform.projectTileCoordinates(x, y, unwrappedTileID, getElevation);
     }
 
+    public projectPoint(p: Point, pixelPosMatrix: mat4): Point {
+        return this.currentTransform.projectPoint(p, pixelPosMatrix);
+    }
+
     private _calcMatrices(): void {
         if (!this._helper._width || !this._helper._height) {
             return;

src/geo/projection/mercator_transform.ts

@@ -779,6 +779,11 @@
         };
     }
 
+    projectPoint(p: Point, pixelPosMatrix: mat4) {
+        const point = vec4.transformMat4([] as any, [p.x, p.y, 0, 1], pixelPosMatrix);
+        return new Point(point[0] / point[3], point[1] / point[3]);
+    }
+
     populateCache(coords: Array<OverscaledTileID>): void {
         for (const coord of coords) {
             // Return value is thrown away, but this function will still

src/geo/projection/vertical_perspective_transform.ts

@@ -437,6 +437,11 @@
         };
     }
 
+    public projectPoint(p: Point) {
+        const point = vec4.transformMat4([] as any, [p.x, p.y, 0, 1], this._globeViewProjMatrix32f);
+        return new Point(point[0] / point[3], point[1] / point[3]);
+    }
+
     private _calcMatrices(): void {
         if (!this._helper._width || !this._helper._height) {
             return;

src/geo/transform_interface.ts

@@ -462,6 +462,11 @@ export interface IReadonlyTransform extends ITransformGetters {
      */
     projectTileCoordinates(x: number, y: number, unwrappedTileID: UnwrappedTileID, getElevation: (x: number, y: number) => number): PointProjection;
 
+    /**
+     * Projects a point in screen coordinates to tile coordinates
+     */
+    projectPoint(p: Point, pixelPosMatrix: mat4): Point;
+
     /**
      * Returns a matrix that will place, rotate and scale a model to display at the given location and altitude
      * while also being projected by the custom layer matrix.

src/style/style_layer/circle_style_layer.ts

@@ -64,13 +64,13 @@
         // // A circle with fixed scaling relative to the viewport gets larger in tile space as it moves into the distance
         // // A circle with fixed scaling relative to the map gets smaller in viewport space as it moves into the distance
         const alignWithMap = this.paint.get('circle-pitch-alignment') === 'map';
-        const transformedPolygon = alignWithMap ? translatedPolygon : projectQueryGeometry(translatedPolygon, pixelPosMatrix);
+        const transformedPolygon = alignWithMap ? translatedPolygon : projectQueryGeometry(translatedPolygon, pixelPosMatrix, transform);
         const transformedSize = alignWithMap ? size * pixelsToTileUnits : size;
 
         for (const ring of geometry) {
             for (const point of ring) {
 
-                const transformedPoint = alignWithMap ? point : projectPoint(point, pixelPosMatrix);
+                const transformedPoint = alignWithMap ? point : transform.projectPoint(point, pixelPosMatrix);
 
                 let adjustedSize = transformedSize;
                 const projectedCenter = vec4.transformMat4([] as any, [point.x, point.y, 0, 1], pixelPosMatrix);
@@ -88,13 +88,9 @@
     }
 }
 
-function projectPoint(p: Point, pixelPosMatrix: mat4) {
-    const point = vec4.transformMat4([] as any, [p.x, p.y, 0, 1], pixelPosMatrix);
-    return new Point(point[0] / point[3], point[1] / point[3]);
-}
-
-function projectQueryGeometry(queryGeometry: Array<Point>, pixelPosMatrix: mat4) {
+function projectQueryGeometry(queryGeometry: Array<Point>, pixelPosMatrix: mat4, transform: IReadonlyTransform) {
     return queryGeometry.map((p) => {
-        return projectPoint(p, pixelPosMatrix);
+        const projected = transform.projectPoint(p, pixelPosMatrix);
+        return new Point(projected.x, projected.y);
     });
 }