The integration of the MeshLine library into the Forge viewer – which we’re using for the display of skeleton data, as we saw last time – has opened the door to displaying all kinds of other cool stuff.
Back in 2014 colleagues in Autodesk Research published a SimAUD paper entitled “Towards Visualization of Simulated Occupants and their Interactions with Buildings at Multiple Time Scales”. It explored the use of various visualization techniques to display how a building’s simulated occupants interact with it. One of these techniques was called Speedlines (we also use the term Streamline):
The original visualizations were created using a custom Maya plugin. Here’s a video that was published as part of the research, to give a better sense of what it was about:
Anyway, once we’d worked out how to use MeshLines inside the Forge viewer, it became clear the mechanism might be used to display Streamlines/Speedlines, too. It wasn’t totally straighforward, though: I went down various rabbitholes before settling on the current implementation. Here are the big ones:
- Creating multiple MeshLines – one for each state change of the Streamline – as I didn’t find a way to modify the width or thickness dynamically.
- Creating a MeshLine with lots of dummy vertices, so that we could have it grow through the length of the Streamline and disappear at the other end.
Both of these worked, in their own way, but neither were ideal (both in terms of performance and resource usage). All of these efforts related to the need to grow the Streamline from the beginning to the end, and then have it fade along the same path… both of which convey movement in a certain direction.
Eventually I realised I could use the visibility setting of the MeshLine’s material to let the Streamline grow along its length. The only problem was the visibility was always relative to the MeshLine’s direction.
In the end I was able to modify the MeshLine’s shader to enable to the use of negative visibility values: the negative ones meant that visibility should be calculated in the reverse direction: from the end of the line back to its beginning. This is a change to the library that I’ll submit back to the original GitHub repo as a Pull Request, in case it’s of value. (Hopefully it will either be accepted or the author will point me at a better way to achieve the same thing.)
Here’s how the Streamlines look in the Forge viewer. The good news is that we can also tweak the frequency to display Speedlines, if needed.
Here’s the modified MeshLine library and the TypeScript implementation of a Streamline class that uses it:
The class can fit the provided points along a THREE.SplineCurve3 or just create an angular streamline with linear segments.
Here’s a StreamlineExtension – that admittedly has a few internal dependencies on Dasher 360 components – that created the above animation by generating a series of Streamlines within the current model’s bounding box.
I know we’re going to find some really interesting uses for this mechanism, whether to display simulation results across multiple timescales, the movement of people across a bridge or the toolpath of an industrial robot. All of which are planned for Dasher 360, at some point. But it’s also going to be useful to display the results of other kinds of simulation and analyses, too: CFD seems like an obvious one, right off the bat.
My next post will probably relate to Rob|Arch 2018, which I’ll be attending for the rest of this week.
