We need to display dynamic heatmaps on the ground/surface that represent noise levels generated by aircraft. We need to be able to update both the coloring and position of the heatmaps.
We do this currently in our WorldWind-based Java application utilizing WorldWind’s analytic surface layer. The size and position of the surface layer can be specified/repositioned. We split the layer up into rows and columns and define colors based on the value assigned to each row/col position. A larger number of rows and columns produces better resolution/appearance but at a performance cost. Here’s an example of the results in a very basic/simple approach:
I have been searching the forums for several days for ideas regarding a reasonable approach to accomplish this with Cesium, but I’m struggling. It seems like there’s a possibility this could be accomplished with point clouds (but doesn’t seem very practical with the need to reposition constantly) or with the particle system (after some quick reading seems very unlikely). It also seems like placing rectangular entities with some type of custom fabric/material may be possible.
I looked into CheckerboardMaterialProperty and GridMaterialProperty, but these materials don’t allow setting the color/alpha of individual cells.
Is there any documentation or instructions for creating a procedural texture material? And would this be a good approach?
I found several references to Cesium Heatmap which utilizes heatmap.js, and have been experimenting with it. However, when creating a number of CesiumHeatmaps (maybe 25 or more) the performance seems to be quite poor trying to update the heatmap colors. And I haven’t come up with a good method to move the heatmap to follow the aircraft.
Any suggestions on the best approach to pursue for this feature would be greatly appreciated. We need an approach that has minimal performance impact as much as possible and yet produces a nice looking result.