.mp4 is also not working as a animated gif in texture in awe.js

[binita12345]

I have converted gif in .mp4 and used it in texture,

texture: {
path: 'img/SB-butterfly.mp4'
},

it is working, but i am not getting expected result, it works as a downloading video, means where i want animated gif there i getting video as downloading on full scene.

how can i load .mp4 video in awe.js?
Please Give me solution asap.

[awe-media]

Hi @binita12345 could you provide some more information about what you mean when you say "i getting video as downloading on full scene"?

If you could provide a link to your project or more code then that would be helpful too. The snippet you've provided looks correct from what we can see.

[binita12345]

In this image, where appearing images like butterflies which is .gif image. i want to animate those butterflies. it should be to appear flying.
currently .gif animation is not working there.

I have used following code:

awe.projections.add({
id: zoneUser.email + '->' + Math.random(),
// geometry: { shape: 'cube', x:50, y:50, z:50 },
geometry: {
shape: 'plane',
height: 10,
width: 20
},
position: {
x: 0,
y: 0,
z: 0
},
rotation: {
x: 0,
y: getRotation($scope.poiBarrings[zoneUser.fullname]),
z: 0
},
// rotation: getRotation($scope.poiBarrings[zoneUser.fullname]),
material: {
type: 'phong',
color: 0xFFFFFF
},
texture: {
path: 'img/SB-Butterfly.gif'
},
}, {
poi_id: zoneUser.fullname
});

[awe-media]

Hi @binita12345 - animated gif's aren't currently supported and video textures don't currently support transparency so you can't achieve what you want here using either of those.

If you want a flapping butterfly you'd be best to create the butterfly using 2 projections - 1 for each wing using a transparent bg for each one (e.g. cut your image in half vertically to create 2 separate images).

Then add each projection as a child of the of a separate poi positioned so each wing sits off-center from that poi's origin. You can then use the pois.update(...animation...) api to make each wing flap by rotating them back and forth around the z axis.

Then add both these pois with their children projections to one single parent poi so you can move them around easily as a group while they are flapping.

It's a little more work in the setup but will give you a better animation effect with 3D motion.

[binita12345]

if i have 6 image frames

for below gif

so, how can i set those frames in loop to flapping for butterfly.

Please give me any solution.