vinhpt Posted August 17, 2017 Share Posted August 17, 2017 I have just build 3D Text meshes in Babylonjs with the help of Vectorize-text. Please visit website http://grid.vn/3dtext to play and see the source code. ... but the 3D Text meshes still not correct at the holes, some one can help please??? jerome, meteoritool, iiceman and 4 others 6 1 Quote Link to comment Share on other sites More sharing options...
JohnK Posted August 17, 2017 Share Posted August 17, 2017 It is to do with the the order (clockwise or counter-clockwise) the points making the holes are put into the array. Currently the way they are ordered (probably the same way as the outer edges) means that the normals polygonBuilder creates are pointed towards the inside of the letters rather than away from them. Simplest way to correct is to reverse the hole array for (var j = 1; j < letter.length; j++) { var hole = []; for (var k = 0; k < letter[j].length; k++) { hole[k] = new BABYLON.Vector2(scale * letter[j][k][1], scale * letter[j][k][0]); } hole.reverse(); // ADD THIS HERE polyBuilder.addHole(hole); } A depth option would be good. Raitch 1 Quote Link to comment Share on other sites More sharing options...
jerome Posted August 17, 2017 Share Posted August 17, 2017 I like this really good job ! Too bad this relies on an external library. I wish we could one day use directly the data from the font design (I mean the character paths in TrueType, google fonts, etc, what are mainly Bezier curves) from JS and generate the meshes with those data. The Leftover 1 Quote Link to comment Share on other sites More sharing options...
jerome Posted August 17, 2017 Share Posted August 17, 2017 would you make a feature that would allow to export/download the generated meshes ? Quote Link to comment Share on other sites More sharing options...
vinhpt Posted August 18, 2017 Author Share Posted August 18, 2017 Thanks JohnK! I added your magic line of code hole.reverse(); // ADD THIS HERE and it work like a charm. I also add the thickness option. Thanks again! Hi jerome! It seem hard work to use directly the data from the font design file because javascript not render the text it self but the host OS do this (not for sure). But I know the good source to dig is Cairo. The download button has added so please play the result with Babylonjs Sandbox. Thanks for your download feature suggestion! JohnK, brianzinn, Wingnut and 2 others 5 Quote Link to comment Share on other sites More sharing options...
GameMonetize Posted August 18, 2017 Share Posted August 18, 2017 This should definitely be an official extension Do you mind adding your code in this repo? https://github.com/BabylonJS/Extensions Quote Link to comment Share on other sites More sharing options...
vinhpt Posted August 19, 2017 Author Share Posted August 19, 2017 Hi Deltakosh! I am so glad to hearing that 3d text can be a official extension. But I a newbie so do not know how to make this as extension have you got any guild lines? By the way It is funny but true that Browerify not bundle .js files as the library (I mean other js code can call function from bundled) . So I will find out the way. Thanks. Quote Link to comment Share on other sites More sharing options...
brianzinn Posted August 19, 2017 Share Posted August 19, 2017 Wow! It even does characters like "★ ☆". Looks really great Quote Link to comment Share on other sites More sharing options...
vinhpt Posted August 20, 2017 Author Share Posted August 20, 2017 Thanks brianzinn! Behind the curtain Vectorize-library generate the vector polygons (with holes) from the image data of a canvas, I have just build the 3D polygon from BABYLON.PolygonMeshBuilder. So in fact it can generate polygons from any black & white (or color with some tricks) canvas content. brianzinn 1 Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.