BabylonJS MeshLine - a port of THREE.MeshLine

I don’t know what are you talking about hehehe!

I am helping my son to complete his first paid job as a freelancer. Pawnshop software in Quasar/Vue/Dexie on this great Sunday and fixing the ribbon greased line… So that much about a great sunny Sunday… :see_no_evil:

Enjoy the day ‘off’ as well!

It’s comiiiing… :wink:

GreasedLine non camera facing beta version.

A little demo of Tie fighter drones created by GreasedLines flying aroung in space:

@mawa - it seems that everything is working, but I have to do more tests so we can utilize this new stuff in the analyzer demo…

All rights to have bugs reserved :smiley:


1 Like

So basically it has the same inputs as the camera facing GreasedLine plus ribbonOptions in adition.

    const wingsPoints =
                4, -4, 0,
                5, -2, 0,
                5, 2, 0,
                3.5, 7, 0
                -4, -4, 0,
                -5, -2, 0,
                -5, 2, 0,
                -3.5, 7, 0

    const tieDrone = BABYLON.CreateGreasedLine("tie-drone", {
        points: wingsPoints,
        ribbonOptions: {
            pointsMode: BABYLON.GreasedLineRibbonPointsMode.POINTS_MODE_POINTS,
            direction: new BABYLON.Vector3(0, 0, 1),
    }, {
        color: BABYLON.Color3.Gray(),
        cameraFacing: false,
        width: 4,
        colorMode: BABYLON.GreasedLineMeshColorMode.COLOR_MODE_MULTIPLY


In pointsMode: BABYLON.GreasedLineRibbonPointsMode.POINTS_MODE_POINTS it needs a second parameter called direction: Vector3. The line will be stretched along the line defined by the points to both sides in the direction defined by this vector. One can visualize the line points easily:

    BABYLON.CreateGreasedLine("debug", {
        points: wingsPoints

The cockpit is drawn in pointsMode: BABYLON.GreasedLineRibbonPointsMode.POINTS_MODE_PATHS where each line in points represents a path. These path are connected to create the mesh.

This is how you get the final mesh:

All info about the new mode will be in the docs next week. Hope you all will enjoy it and find it cool!


This is the most awesome tech demo ever. Sort of makes me want to toss in some HAVOK asteroids and an X-wing or two to challenge all those greased tie interceptors.


@Calsa Video gif. A puppet with googly eyes says, "Do it, do it, do it!" while shaking with gusto at his words of encouragement and looking at us.

1 Like

This is probably what you will need as first:

Check other Steering behaviors:

1 Like

If we don’t have permission to link the music, would be recommended not to use it as an official example.

Music changed on the offciial documentation page:

@mawa I think you already put a lot of effort into your demo. It is not an official Babylon.js demo so I don’t think you will have to change it.

1 Like

Well, I’m not gonna lie. That’s pretty sad, if you ask me. :disappointed_relieved: The alternate soundtrack is a lot ‘flatter’ on the equalizer and is also a lot less ‘emotional’ (or ‘engaging’). I suppose it will sure do for a PG…yet… we can discuss this further by PM for this eventual featuring that’s WIP. In case, I’d like to understand where the original soundtrack came from and how I can eventually make contact with the creator (or agent or editor) to see how we can eventually make some arrangement for a courtesy featuring of the original audio soundtrack? As I said, I shall PM you about that, so no need to reply here. Meanwhile, have a great day :sunglasses:

1 Like

Started to write the docs for the non camera facing line :muscle:

1 Like

Hi @roland did this make it into master yet? Some of the new properties like pointsMode: seemed to not be detected by VS autocomplete (via NPM packages). I have been itching to give the new mode a try.

Sorry it didn’t.

@Calsa @sebavan

What another great use for GreasedLine, the drones are already shooting…

It will be an x-wings vs ties battlescene by the way… With thousands of them. I am pretty curious how many spaceships will squeeze my gpu’s balls. :smiley:

@sebavan have you eve encountered a BabylonJS fitted collision compute shader? If not, it will be fun to write one… Wish I had more time…


Nope never seen one but wish you had one as it sounds really fun

1 Like