Mesh deformation in PlayCanvas

[pulkit]

I want to deform a mesh of imported model in PlayCanvas.
Below link shows exactly what I want , but its a github code
https://playcanvas.github.io/#/graphics/mesh-deformation

Can anyone explain to me how to convert github code to PlayCanvas editor version

[Leonidas]

Hi @pulkit and welcome,

So engine examples need to create a pc.Application instance and setup a scene. That usually involves creating a camera, a number of objects with models/materials etc.

In editor most of that happens automatically/visually. In the case of the example to transfer in editor you will have to:

• Upload and add the model to your project. You can find it here (it’s a GLB, so you may have to convert it to FBX before using it in editor):
  engine/statue.glb at main · playcanvas/engine · GitHub

• Add the collect positions from all mesh instances to work on code in a script of yours.

• Add modify mesh positions on each frame code to your script’s update method

[Kulodo133]

I recently converted a different engine example to use in the editor. https://playcanvas.com/project/874725/overview/lightbakedaotest

The house.glb imported to the editor as asset type “binary” but I changed it to “container” in code. I’m not sure if that is recommended but it worked.

    this.houseAsset = this.app.assets.find("house.glb");
    this.houseAsset.type = 'container';

[yaustar]

Open office hours video for this and engine examples in general:

Using Engine example code in Editor project - PlayCanvas Office Hours #11

Project link: https://playcanvas.com/project/930602/overview/f-model-deformation

[pulkit]

Hey @Leonidas and @yaustar and @Kulodo133 , Thanks for the help. I figured it out . What’s happening is the whole mesh is deforming. What changes should i make so that the mesh deforms in along one axis(say z).

In below project, I modified a bit and made it deform on y axis , but I am not able to change the axis itself from y to z-axis or x-axis . I wanted a deformation such that on slider move mesh should bulge out or in
https://playcanvas.com/editor/scene/1420045

[Leonidas]

I think you can easily do that by changing line 94 in your script to either one:

// deforms in X
this.positions[index] = elevation;

// or deforms in Y
this.positions[index + 1] = elevation;

// or deforms in Z
this.positions[index + 2] = elevation;

[pulkit]

Thanks for the solution @Leonidas .

Also, can you please help me with how to deform larger area. I am changing the position and scale of deform target entity but the deformation is happening in that particular area of mesh. And I can’t understand why I’m getting pointy heads compared to your demo on mesh generation.

[LeXXik]

Most probably the reason for “pointy heads” is because your positions array is larger than the amount of vertices you have in your mesh, making it so that the last part of your array is filled with zeros. Zeros are valid vertex coordinates pc.Vec3(0, 0, 0), so your mesh vertices are just placed there.

Make sure your positions array is correct.

[pulkit]

How should I control the position array. Its assigned by the source positions of the meshes. I tried it with different models with different meshes. All I am getting is same pointy deformation where I am not able to specify the area for deformation too.