Mesh Writer Usage

Hey guys… I added meshwriter.min.js to my local project and i get a “define is not defined” error:

Anybody know what the deal with that ???

Does this package have some kind of dependencies ???

Also… Whats up with all those script files in the font folder ???

Its does not mention that at all in the docs… Am i supposed to package all those script along with meshwriter.min.js ???

And what folder… Relative to where the root web folder or in the scripts folder ???

And if so… Why are not bundled in the meshwriter.js script :frowning:

Nothing, no one… what about the guy who wrote the extension. Hey bro, how do you use this extension in a plain ol web page project… says define not defined.

What am I missing :worried:

Hi MK24! Good to see you. Sorry for the MeshWriter packaging issues. Did you search the old forum to learn that @TheLeftover is the MeshWriter author? He’s a great guy… taught me some cool coding techniques, and allowed me to cool-aborate on some of his “bigger” projects.

I don’t know how much help he can provide… about “packaging”. I think the system is still under dev, so, perhaps finalizing is not at all the author’s objective/goal. Maybe he is more interested in collaboration for further dev. Not everyone is in a rush to have their inventions… “get done”/be packaged.

All in all, sorry about the slow replies from others. At least we got the author pinged, if you still needed that. Be nice to him, eh? thx.

Easy-3D-Post Creator That is ANOTHER way to extrude fonts… and it doesn’t suffer from the limited font-families of MeshWriter. I don’t know how it is done, but I think it’s worth more investigation. It could be much less efficient than the SPS-based MeshWriter system. Likely, the “word” is one single mesh (with easy-3d), which is limiting in certain applications.

Conversely, MeshWriter keeps each character of a word/sentence… as an SPS particle… thus allowing the chars/words/sentences to path-follow/terrain-follow (like a train), or wave like a flag (very fluid).

Again, probably no reason to hurry to any finalizing, because the whole phenomena of 3d fonts… is in max-dev mode (very fluid - again). :slight_smile: I hope I’ve been helpful.

Or you can use an other awesome js-library to create 3D fonts:


(Example: logo_and_text.scad)

https://www.openscad.org/

found on Best of JavaScript
where babylon.js is listed too - of course! :slight_smile:

2 Likes

@Wingnut, thanks for the wakeup call.

MackeyK24, sorry about the error message. I can probably reproduce it tomorrow. Just so I know, how are you loading meshwriter.min? A straight script tag? I will tune up the packaging to make it more resilient.

I will also update the documentation if it isn’t clear but . . . all you need with meshwriter.min. It contains all of the files, including all the font files, for the repo. More later.

1 Like

Yo @Wingnut … You know me, im a fast mover… Sorry @TheLeftover if too pushy :slight_smile:

I am just trying to load meshwriter.min.js on a regular web page (no npm packages) using script tags.

The playground MUST already have whatever javascript has the “DEFINE” defined… Dunno… Im not much on the npm stuff (I hate JavaScript… But LOVE TypeScript classes for web code) so it my fault.

Do you know what the ‘define’ dependency is… What other libs do i need to include on the page ???

1 Like

Mackey, yeah, the way MeshWriter is built is not general purpose. I am glad you brought it up. One presumes other folk ran into this and simply quit. Since you notified me, I can fix it.

@MackeyK24 , I have updated MeshWriter so you should no longer see that error. You can find the latest version here GitHub - briantbutton/meshwriter: Babylon Mesh Writer

It will also get updated to the BABYLON repo later this week.

Thanks for letting me know about that problem.

Postscript: The call to “define” reflected RequireJS, which I used to assemble my packages. It is antiquated and I should move on. But in any case, that call should not have been in an assembled js file.

Hello @TheLeftover,

I am currently trying to get a 3D mesh to render and also had the ‘define’ error. What a surprise to find a thread on the subject just minutes old.

I too am loading meshwriter.min.js from a script tag. I updated the code to your just now posted update and the define error is gone. But for me, it is now replaced with an ‘earcut not defined’ error.

Any clue?
Thanks for your time.
-Skrap

Here are the files I am loading:
Babylon.js v4.1.0-alpha.0 - WebGL2

<script src="/lib/babylonjs/babylon.max.js"></script>
<script src="/lib/babylonjs/babylonjs.loaders.min.js"></script>
<script src="/lib/babylonjs/pep.js"></script>
<script src="/lib/babylonjs/babylon.gui.js"></script>
<script src="/lib/babylonjs/babylon.gui.3d.js"></script>
<script src="/js/meshwriter.min.js"></script>

Here is the error:

Uncaught ReferenceError: earcut is not defined
at new PolygonMeshBuilder (babylon.max.js:100560)
at i (meshwriter.min.js:7)
at Array.map ()
at p (meshwriter.min.js:7)
at d (meshwriter.min.js:7)
at new MeshWriter (meshwriter.min.js:7)

Well, it’s great the timing is working.

Yes, earcut is required for PolygonMeshBuilder. It is not a direct reference from MeshWriter. Good news, it is a wee tiny bit of software you will forget about as soon as you include it.

I believe it is here: GitHub - mapbox/earcut: The fastest and smallest JavaScript polygon triangulation library for your WebGL apps I must have done my own minification.

1 Like

Awesome!!! Thanks for the fast feedback @TheLeftover .

Including ‘earcut.min.js’ solved the issue for me. I didn’t think I saw a reference to that requirement in any docs but I could be wrong and I know the docs are in flux since you are still in the dev stages. Regardless, great support!!

Thanks again,

Keep up the good work!!
-Skrap

2 Likes

:smile:

I will put a couple pointers to earcut in the documentation.

Yo @TheLeftover … Thanks bro… Got it up and running with new build and earcut.js

Got a couple questions:

1… What are the option values ???
Example: anchor … What other values besides ‘center’

2… What is letter-origin ??? is that different from anchor and what are the other values for it

3… What is the default rotation of the resulted mesh ???

By default the mesh is facing toward the SKY… Y or upwards… Shouldnt it be facing forwards… If i try to just give a 90 degree rotation… Its not really facing forward but angled a bit too much

I am pleased to hear that it is working.

  1. For “anchor”, you could also pick “left” or “right”. It simply affects the initial coordinates of the mesh as being at the beginning, middle or end of the string.

  2. I incorporated letter-origin for some historical reason and have now forgotten the reason. I recommend pretending it doesn’t exist. Not even sure any other options will work.

  3. To some degree, you should just fiddle with it in your environment or a playground. You CAN get the results you want but I am not sure what settings will get you there. @Wingnut is kinda expert at that. He has playgrounds doing crazy things.

It really goes back to BABYLON intrinsics. The output from MeshWriter is a single mesh representing the whole string. You can move it and rotate it as you see fit.

Kool deal … what’s the rotation type you initially set Euler mesh.rotation or mesh.rotationQuaternion ?

https://www.babylonjs-playground.com/#XWVXN9#83

See lines 132/133 for initial rot info… euler.

The rotation to “forward” (using a +z facing cam)… is set in line 152.

Tiz a good playground to answer all sorts of questions… and get some fake chrome, too. :slight_smile:

The Cinderblock font is one of the highest “surface area” fonts for reflecting pretty pictures that are recognizable… such as city-scapes. Not yet available in MeshWriter, but maybe someday. Cinderblock is not the easiest font to read… due to compact kerning. But, because of the high sur-face area… it reflects pictures NICE.

Now, how does that picture move smoothly left/right… without any tmat texture .uOffset animation? I’m not telling, but it involves BIG magic. :slight_smile:

Video… playing in the fonts reflection… currently works, though i haven’t tweaked it. Here’s the SIntel video trailer… in the fonts (line 120). https://www.babylonjs-playground.com/#XWVXN9#85 FUN!

2 Likes

Thanks @Wingnut … That PI rotation worked perfectly

1 Like