How To Make Plane Object Face's Texture Reversed?

Questions
, ,
1

Hi Experts,
I would like to make double sided a flag plane object. But I need to make one side reversed. Is it possible to rotate plane object’s one face? I’m using the following code to make rotation. But faces are mixed and don’t look properly. When I do rotation around of the vehicle I want to see plane object’s other reversed side.

Here is my code blocks;

setVehicleCountryFlag: function (oCountryCode, callback) {
			var oFlagSource;
			oFlagSource = GlobalFormatter.getCountryFlag(oCountryCode);
			new THREE.TextureLoader().load("data:image/png;base64," + oFlagSource, function (oTexture) {
				oTexture.encoding = THREE.sRGBEncoding;
				oTexture.wrapS = THREE.RepeatWrapping;
				oTexture.wrapT = THREE.RepeatWrapping;
				var material = new THREE.MeshBasicMaterial({ map: oTexture, side: THREE.DoubleSide });
				var plane = new THREE.Mesh(new THREE.PlaneGeometry(5, 3), material);

				var geometry2 = plane.geometry.clone();
				geometry2.applyMatrix(new THREE.Matrix4().makeRotationY(Math.PI));
				THREE.GeometryUtils.merge(plane.geometry, geometry2);

				plane.geometry.verticesNeedUpdate = true;
				plane.geometry.normalsNeedUpdate = true;
				plane.geometry.computeBoundingSphere();
				plane.geometry.computeFaceNormals();
				plane.geometry.computeVertexNormals();
				plane.name = "Flag";
			});
		},

Screen Shot 2022-09-14 at 10.10.31

2

Can I do that process without using two different meshes (Front and Back side mesh)?

3

See from the Collection of examples from discourse.threejs.org

@prisoner849
DoubleSide(gl_FrontFacing)

1 Like