What is the most efficient way to display texture on the center/left/right side of a 2D object?
I have experimented with manipulating the offset and repetition of the texture without success, and I have found no answers elsewhere.
In addition, I attempted the following code snippet:
someButton.onClick(function () {
var geom = editor.selected.geometry;
var uvs = geom.faceVertexUvs[0];
var face0 = uvs[0];
face0[0] = new THREE.Vector2(0,1);
face0[1] = new THREE.Vector2(0,0.2);
face0[2] = new THREE.Vector2(0.5,1);
var face1 = uvs[1];
face1[0] = new THREE.Vector2(0,0.2);
face1[1] = new THREE.Vector2(0.5,0.2);
face1[2] = new THREE.Vector2(0.5,1);
geom.uvsNeedUpdate = true;
});
Unfortunately, this method did not yield the desired results.
For instance, if the object is a 2D square and I wish for the koala bear picture to be centered, it should appear like this:
Koala Bear in the Center of Square
I am looking to alter the texture position dynamically. Thank you in advance.