Good day, in this example:
https://www.babylonjs-playground.com/#2C8LVE#13
let’s imagine something similar over a more complex mesh. What i need is that as I drag and move around the mesh, I need to leave a trail behind, so that people can understand the path that I am making as I move the arrow (or other symbol) around the mesh, how could I do that?
thank you 
@labris great suggestion thank you very much, it works, now I need to make it so that trail is only created when I am clicking+dragging with mouse (or with finger in touch screens) how can I detect when user is clicking or touching the screen (instead of just hovering) ? thank you
@labris I found a way to control that using
canvas.addEventListener(“pointermove”, onPointerMove, false);
canvas.addEventListener(“pointerdown”, onPointerDown, false);
canvas.addEventListener(“pointerup”, onPointerUp, false);
and it works, but now I need to stop the trail stuff until I detect the mouse down,
is it possible to enable and disable the trail stuff once it has been declared, dynamically?
thank you
@labris yes I can use trail.start() and stop() to control it but I have a problem
when I detect mouse down, I start trail, but the very first trail when I click makes an ugly line from position before I clicked to position of the click which looks terrible; the rest of trail then is good; how could I prevent that very first trail line that connects position before click to position of click?
@labris I am trying this
onPointerDown= (evt)=>{
downState=true;
setTimeout(() => {
trail.start();
}, 1000
but mmm still doing that ugly line,
also what would be the code to delete the entire trail in between mousedowns? so that I Delete the previous trail and people can begin a new one?
thank you
@labris
This sorts of works:
onPointerDown= (evt)=>{
trail.dispose();
downState=true;
setTimeout(() => {
trail = new TrailMesh(‘new’, box, scene, 0.85, 700, true);
trail.material = sourceMat;
trail.start();
}, 500);
}
onPointerUp= (evt)=>{
downState=false;
trail.stop();
}
but I need to do that 500 millisecond pause to prevent that first ugly line, if I put 100 milliseconds the ugly line appears, so i need a longer pause, so I lose the beginning of trail,
and also I have to dispose and recreate the trail each time
so this kind of works, but maybe there are better solutions, thank you for any tips
Try to force a world matrix computation of the mesh you attach the trail to. See TrailMesh - always starts from 0:0:0 (with PG example) - #2 by Evgeni_Popov
@Evgeni_Popov @labris thank you very much to both of you;
a) I tried to apply now
box.computeWorldMatrix();
to the mesh being moved, when pointerdown happens, but its still creating the ugly line
b) I Could use the method I described before but my issue now is that deleting and redoing the trailmesh is messing up with the rest of my app so it would be better for me not to redo the trailmesh each time but to delete its contents dynamically; is there some command or method to reset the trail, to erase its current path, or reset it somehow dynamically?
Regarding b/ there is no function for that, but the source code is available (Babylon.js/trailMesh.ts at master · BabylonJS/Babylon.js · GitHub) and is not very long, so you can try to make it fit your needs. Also, did you try to use the clone method and passing it as the second parameter the new mesh?
@Evgeni_Popov thank you again, I rather avoid touching the source code if possible; what is the clone method for? do you mean the clone method of the trailmesh object? not sure what you mean here, please give me more details if possible
new TrailMesh(name: string, generator: TransformNode, scene: Scene, diameter?: number, length?: number, autoStart?: boolean): TrailMesh
You don’t have to, you can copy the source code of the TrailMesh class in your own project and do the modifications there.
The clone method is a method of the TrailMesh class: you pass it a name and the mesh to apply the trail to. I don’t think creating a trail mesh this way would mess up with the rest of your app (?) […] In fact clone is simply doing a new TrailMesh(...) so it may not be what you want.
@Evgeni_Popov thank you Evgeni, i get it about copying the source code, that could be a last solution yeah, lets see if i can however do something easier;
regarding cloning; what i need to do is to delete the trail in between mouse up and mouse down; so one way is to dispose the trail an create it again; if i clone the trail, I still need to get rid of the previous one (to delete the previous trail); so i would have to still do clone and then dispose the previous one; I wonder if that will make any difference
I just tried it but If I do clone i cannot get rid of the previous trail so this is an issue, I start a new trail on mouse down but the old one remains, i need to dispose, delete the previous trail
downState=true;
setTimeout(() => {
//trail = new TrailMesh(‘new’, box, scene, 0.85, 700, true);
trail=trail.clone(‘new2’, box);
//trail.dispose();
trail.start();
}, 500);
@Evgeni_Popov the interesting thing is that yes using clone stops the messing of my scene, so thats good; better than creating a new one; but now i have the problem of how do i delete, dispose the previous path in between mouse-up/mouse-downs
Maybe you can simply hide the trail mesh when no mouse down (trail.setEnabled(false))?
@Evgeni_Popov doing the dispose solves my problem, but the dispose is what messes up with the rest of my mesh structure in scene;
hiding the trail is not a solution because eventually i have to show it again and when i show it again it will show the old path again
Before trail=trail.clone(‘new2’, box); do a trail.setEnabled(false);.
That should work, only that you will leave invisible meshes in your scene each time a new trail is created (which may be acceptable if you don’t create thousands of them). If it’s a problem, I would suggest to fix the reason why disposing the trail mesh messes up with your scene (is it a bug somewhere?).
@Evgeni_Popov thank you yes I found a solution, its better to dispose and recreate, basically that was messing an internal list of references to other messes I have, so now I have implemented something like this:
scene.meshes.map((mesh) => {
if (mesh.name === mprevname) {
… etc, etc
so that I locate the right meshes by name regardless of the change of their internal babylon position-id,
and this way this gets sorted
thank you again for all the help