HARP-14502: Fixes blue-ish webtiles on sphere (#2133)

* HARP-14502: Fixes blue-ish webtiles on sphere Signed-off-by: Frauke Fritz <frauke.fritz@here.com>
heremaps · Mar 4, 2021 · fe19681 · fe19681
1 parent eae990a
commit fe19681
Show file tree

Hide file tree

Showing 2 changed files with 37 additions and 2 deletions.
diff --git a/@here/harp-webtile-datasource/lib/WebTileLoader.ts b/@here/harp-webtile-datasource/lib/WebTileLoader.ts
@@ -58,7 +58,7 @@ export class WebTileLoader extends BaseTileLoader {
                 const planeMesh = addGroundPlane(
                     this.tile,
                     this.dataSource.renderOrder,
-                    undefined,
+                    0xffffff,
                     this.dataSource.opacity,
                     true
                 );

diff --git a/test/rendering/WebTileDataRendering.ts b/test/rendering/WebTileDataRendering.ts
@@ -34,6 +34,7 @@ describe("MapView + WebTileData rendering test", function () {
         lookAt?: Partial<LookAtParams>;
         webTileOptions?: Partial<WebTileDataSourceOptions>;
         runBeforeFinish?: () => void;
+        clearColor?: string;
     }
 
     async function webTileTest(options: WebTileTestOptions) {
@@ -44,7 +45,7 @@ describe("MapView + WebTileData rendering test", function () {
 
         mapView = new MapView({
             canvas,
-            theme: {},
+            theme: { clearColor: options.clearColor },
             preserveDrawingBuffer: true,
             pixelRatio: 1,
             projection: options.projection
@@ -103,6 +104,23 @@ describe("MapView + WebTileData rendering test", function () {
         });
     });
 
+    it("renders webtile from loaded texture png on sphere", async function () {
+        this.timeout(5000);
+
+        await webTileTest({
+            mochaTest: this,
+            testImageName: "webtile-clover-sphere",
+            projection: sphereProjection,
+            clearColor: "#ff0000",
+            getTexture: (tile: Tile) => {
+                return Promise.all([
+                    new TextureLoader().load("../dist/resources/wests_textures/clover.png"),
+                    []
+                ]);
+            }
+        });
+    });
+
     it("renders webtile from loaded texture with opacity", async function () {
         this.timeout(5000);
 
@@ -119,6 +137,23 @@ describe("MapView + WebTileData rendering test", function () {
         });
     });
 
+    it("renders webtile from loaded texture with opacity on sphere", async function () {
+        this.timeout(5000);
+
+        await webTileTest({
+            mochaTest: this,
+            testImageName: "webtile-opacity-sphere",
+            projection: sphereProjection,
+            getTexture: (tile: Tile) => {
+                return Promise.all([
+                    new TextureLoader().load("../dist/resources/wests_textures/clover.png"),
+                    []
+                ]);
+            },
+            webTileOptions: { renderingOptions: { opacity: 0.5 } }
+        });
+    });
+
     it("renders webtile from loaded texture png with alpha", async function () {
         this.timeout(5000);