Is there a way to adjust the image orientation correctly by mirroring it?
I attempted to follow the solution provided by @Piotr Adam Milewski on this issue mentioned in Stack Overflow: how-to-curve-a-plan-entity-to-match-a-sphere-surface. Even setting the material repeat to -1 did not result in any change in the mirrored image. My approach involves using the aframe-sprite-sheet component for animating the sprite-sheet animation.
<script>
AFRAME.registerComponent("match-sphere", {
schema: {
target: {
type: "selector",
},
},
init() {
const sphere = this.data.target;
this.el.setAttribute("radius", sphere.getAttribute("radius"));
this.el.setAttribute("position", sphere.getAttribute("position"));
this.el.sceneEl.addEventListener("loaded", () => {
setTimeout(() => {
const mesh = this.el.getObject3D("mesh");
const axis = sphere.getAttribute("position").clone();
axis.add(
mesh.geometry.boundingSphere.center.clone().multiplyScalar(-1)
);
axis.normalize();
this.el.object3D.translateOnAxis(axis, 0.1);
}, 200);
});
},
});
</script>
<a-scene>
<a-assets>
<img
id="15Anim"
crossorigin="anonymous"
src="https://cdn.glitch.global/1e9da372-6263-4de8-9156-5eb917844f9b/15-Unit.png"
/>
<a-mixin
id="anim"
material="shader:flat; side: double; transparent:true; opacity:0.3; alphaTest:0.1"
match-sphere="target: #foo"
click-sphere
rotation='0 180 0'
radius='2.8'
></a-mixin>
</a-assets>
<a-entity id="group" rotation="0 222 0" position="0 -55 0" scale="20 20 20">
<a-sphere
id='foo'
position="0 0 0"
radius='4.05'
theta-length="90"ength="90"
material='color: #59A1FF; shader: flat; side: double; opacity:0.7; transparent:false; wireframe:false;'>
</a-sphere>
<a-sphere
mixin="anim"
class="cantap"
material='src: #15Anim'
sprite-sheet="cols:5; rows: 10; progress: 0.;"
geometry='phiLength: 53; thetaLength: 26; thetaStart: 25; phiStart:200'>
</a-sphere>
</a-entity>
</a-scene>
Resultant reference: https://i.sstatic.net/i2WTx.png
I experimented with changing the repeat values from -1 to 1 and 0, but the outcome remained unchanged. Adjusting the rotation only displaced the image further. Additionally, modifying the alphatest property did not have an impact on the mirrored image.