Dynamically configure physical materials using custom material properties

src/runtime-three/runtime-host.ts

@@ -4919,19 +4919,37 @@ export class RuntimeHost {
     }
 
     const textureSet = this.getOrCreateTextureSet(material);
+    const isCustomMaterial = material.kind === "custom";
+    const materialTransparent =
+      isCustomMaterial &&
+      (material.opacity < 0.999 || textureSet.albedoHasAlpha);
     const faceMaterial = new MeshPhysicalMaterial({
-      color: 0xffffff,
+      color: isCustomMaterial ? material.albedoColorHex : 0xffffff,
       map: textureSet.baseColor,
       normalMap: textureSet.normal,
       roughnessMap: textureSet.roughness,
-      roughness: 1,
+      roughness: isCustomMaterial ? material.roughness : 1,
       metalnessMap: textureSet.metallic,
-      metalness: textureSet.metallic === null ? 0.03 : 1,
+      metalness: isCustomMaterial
+        ? material.metallic
+        : textureSet.metallic === null
+          ? 0.03
+          : 1,
       specularColorMap: textureSet.specular,
       specularColor: new Color(0xffffff),
-      specularIntensity: textureSet.specular === null ? 0.2 : 1
+      specularIntensity: textureSet.specular === null ? 0.2 : 1,
+      transparent: materialTransparent,
+      opacity: isCustomMaterial ? material.opacity : 1,
+      depthWrite: !materialTransparent
     });
 
+    if (isCustomMaterial && textureSet.normal !== null) {
+      faceMaterial.normalScale.set(
+        material.normalStrength,
+        material.normalStrength
+      );
+    }
+
     if (
       this.currentWorld !== null &&
       shouldApplyWhiteboxBevel(this.currentWorld.advancedRendering)

src/viewport-three/viewport-host.ts

@@ -7728,9 +7728,7 @@ export class ViewportHost {
     const materialTransparent =
       isCustomMaterial &&
       (materialDef.opacity < 0.999 || textureSet.albedoHasAlpha);
-
-    return this.configureRoadSurfaceMaterial(
-      new MeshPhysicalMaterial({
+    const roadMaterial = new MeshPhysicalMaterial({
       color: isCustomMaterial ? materialDef.albedoColorHex : 0xffffff,
       map: textureSet.baseColor,
       normalMap: textureSet.normal,
@@ -7749,10 +7747,18 @@ export class ViewportHost {
       opacity: isCustomMaterial ? materialDef.opacity : 1,
       depthWrite: !materialTransparent,
       side: DoubleSide
-      })
+    });
+
+    if (isCustomMaterial && textureSet.normal !== null) {
+      roadMaterial.normalScale.set(
+        materialDef.normalStrength,
+        materialDef.normalStrength
       );
     }
 
+    return this.configureRoadSurfaceMaterial(roadMaterial);
+  }
+
   private createRoadSurfaceMaterial(path: ScenePath): Material {
     return this.createRoadGeneratedMaterial(
       path.road.materialId,