<a-assets>
<!-- Define the metal normal map texture -->
<img id="metal-normal" src="ImageTextures/TexturesCom_Metal_Corrugated_1K_normal.jpg">
<img id="brick_texture" src="ImageTextures/TexturesCom_Wall_BrickPlain3_2.5x2.5_B_1K_albedo.jpg">
<img id="brick-normal" src="ImageTextures/TexturesCom_Wall_BrickPlain3_2.5x2.5_B_1K_normal.jpg">
</a-assets>
<!-- Light-blue box with texture and normal map -->
<a-box position="-2 1.5 -9" width="4" height="4" depth="4"
material="color: #FFFFFF; src: url(ImageTextures/TexturesCom_Metal_Corrugated_1K_normal.jpg)"
normal-map="#metal-normal"
roughness="0.5"
scale="1 1 1">
<a-sphere
scale="0.1 0.1 0.1"
position="1.7 0.1 8.677"
color="blue"
material=" shader: standard; roughness: 0.3">
</a-sphere>
</a-box>
<!-- Brown box with texture -->
<a-box position="2 1.5 -9" width="4" height="4" depth="4"
material="color: #ffffff;
src: #brick_texture;
repeat: 2 2;
normalMap: #brick-normal;
normal-texture-repeat: 2 2;
normal-scale: 1 -1;
roughness: 0.3;"
scale="1 1 1">
<a-sphere
scale="0.1 0.1 0.1"
position="-1.7 0.1 8.677"
color="red"
material="color: #FF0000; roughness: 0.2; shader: flat; opacity: 0.5;">
</a-sphere>
</a-box>
</a-scene>
Did you have a question about this code?