Project Team 2: Turbulence Visualization, CS 7250 S20

Xiongyi Zhang, Chengguang Xu, Dian Wang

Service-Learning Course Project as part of CS 7250 S20: Information Visualization: Theory and Applications, taught by Prof. Cody Dunne, Data Visualization @ Khoury, Northeastern University.

Motivation

Turbulence is fluid motion characterized by chaotic changes in pressure and flow velocity. Researchers have come up with various models for turbulence prediction. Since the data they work with are normally multi-dimiensional, large scale, temporal data, it can be challenging to visualize both the data and the prediction of their models, and try to decide whether the model is doing a good job or not.

Our project aims to provide a interactive tool for researchers to visualize their data and their model predictions side by side, in order for them to qualitatively evaluate their models.

Visualization

*Turbulence kinetic energy (TKE) is the mean kinetic energy per unit mass associated with eddies in turbulent flow. Physically, the turbulence kinetic energy is characterised by measured root-mean-square (RMS) velocity fluctuations.

Demo Video

Visualization explanation

In this project, we aim to design an interactive visualization tool to compare high-dimensional turbulence data between the ground truth and the model's prediction. Each original data in the ground truth and the prediction consists of two components. One is the velocity component in x direction, the other is the velocity component in y direction. Given the turbulence data, our visualization provides the user with the following key features:

Scrolling time bar: Press the PLAY button to automatically display the turbulence and press the STOP button to stop.

Scrolling time bar: Press the + button to increase one frame and press the - button to decrease one frame.

Separate view without contrast: Leaving the Combine X and Y unchecked and Highlight Difference unchecked , you can observe the following.

Separate view with contrast: Leaving the Combine X and Y unchecked and Highlight Difference checked , you can observe the following.

Combined view without contrast: Leaving the Combine X and Y checked and Highlight Difference unchecked , you can observe the following.

Combined view with contrast: Leaving the Combine X and Y checked and Highlight Difference checked , you can observe the following.

Brushing and linking: You can move the white rectangle to any region in any visualization in the combined view.

Slides for the presentation

Acknowledgments

List here where any code, packages/libraries, text, images, designs, etc. that you leverage come from.

D3: Data-Driven Documents by Mike Bostock.
Pure CSS responsive "Fork me on GitHub" ribbon by Chris Heilmann.
Linear SVG Gradient - A hexagonal SOM heatmap with color legend Nadieh Bremer’s Block.
canvas-vectors by changmn.
spin.js by Felix Gnass.
d3-simple-slider by John Walley.
Fixed size slider by Efrat Vilenski
Disable brush resize by Sandip Pingle and Phil Borkenhagen
How to prevent d3 brush events from firing after calling brush.move by altocumulus