Search code examples
babylonjs

Using Babylon JS, Drawing a circle on a Sphere with a DynamicTexture results in Elliptical shapes

So I started playing with the dynamic textures and ran across something funky.  I created a sphere object with the dynamic texture and used .arc to create some circles; however, when it got to the screen, the circles became stretched into elliptical shapes.  I'm hoping there's a simple fix for it, but I've yet to find anything.

The playground: Circle on a Sphere

Thank you for the time!

Carlos

Solution

  • Apparently, it's doing the right thing. When you apply a dynamic texture, it is applied when the parent object is created itself.

    To try this, open this example-https://www.babylonjs-playground.com/#5ZCGRM#2 and change the groundWidth to 80, you'll see the text has been elongated.

    var groundWidth = 80; // width changed to 80
var groundHeight = 10;
var ground = BABYLON.MeshBuilder.CreateGround("ground1", {width: groundWidth, height: groundHeight, subdivisions: 25}, scene);

    Also, in https://doc.babylonjs.com/how_to/dynamictexture you can see the text "sphere" on the sphere surface is adjusted accordingly - https://d33wubrfki0l68.cloudfront.net/27a5c2a531378e8120af19956fcedc68c38b51f9/2c1cb/img/how_to/dyntext.png

    There's a way you can make the circle on the surface by changing the uScale and vScale, but this is a temporary solution, I would recommend using other tools like Blender for this.

    materialObj.diffuseTexture.vScale = 1;
materialObj.diffuseTexture.uScale = 2;

    And the link - https://www.babylonjs-playground.com/#RQGTKJ#1