CMAPSS Dataset Viz v2.2

100%

CMAPSS Dataset Viz v2.2

✓ Published1🌍 Public

Last edited Dec 16, 2021

Created on Dec 13, 2021

This interactive scatterplot explores sensor data from NASA’s CMAPSS turbofan engine dataset, plotting a selected y-axis attribute (altitude, Mach, TRA, or T2) against elapsed time for a chosen unit and cycle. Users filter data through three dropdown menus built with React state, while D3 v7’s `scaleLinear` and `extent` handle axes and scaling. The React component renders SVG circles with opacity, axes via custom `AxisBottom` and `AxisLeft` components, and includes tooltips showing raw values. Data is loaded asynchronously from a remote CSV using `d3.csv`.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

CMAPSS Dataset Sample 2.0

This interactive scatterplot visualizes flight traces from the CMAPSS turbofan engine dataset, plotting sensor readings such as altitude against elapsed time. Users filter the displayed trace by selecting a unit, flight cycle, and y-axis attribute from dropdown menus. The React application uses D3 v7 scales and axes to render SVG circles with opacity, while tooltips reveal exact coordinate values. Data is loaded as CSV files from GitHub gists.

JJun Suzuki

93% match

Loading thumbnail…

CMAPSS Dataset Viz v2.3

This interactive scatter plot displays the CMAPSS aero-engine dataset, with time on the x-axis and a user-selected variable (altitude, Mach, TRA, or T2) on the y-axis. Users filter the data by unit and cycle via dropdown menus. Built with React and D3 v7, it renders SVG circles for each data point, using D3's scaleLinear for axes and extent for domain calculation, with tooltips showing exact values on hover.

JJun Suzuki

93% match

Loading thumbnail…

CMAPSS Dataset Sample 1.0

This visualization displays a scatter plot of aircraft altitude over time from the CMAPSS dataset, with each point representing a sensor reading. The React component uses D3 v7 scales via `scaleLinear` and `extent` to map data to SVG coordinates, while the axes are rendered as custom React components. The data is loaded asynchronously from a remote CSV file using D3’s `csv` function. Each circle includes a tooltip showing the exact time and altitude values.

JJun Suzuki

87% match

Loading thumbnail…

Test CMAPSS select

This visualization shows flight trace data from the CMAPSS dataset, displaying sensor readings over time for selected aircraft units. Users can switch between y-axis attributes (Altitude or TRA) and select different units via dropdown menus. The scatter plot uses d3.scaleLinear for both axes, with data loaded asynchronously from CSV files via d3.csv. React manages the interactive state for attribute and unit selection, while the SVG rendering is handled entirely through React elements rather than d3 selection methods.

JJun Suzuki

84% match

Loading thumbnail…

MTCARS Scatter Plot with Menus

An interactive scatter plot of the classic mtcars dataset lets viewers compare any two of four car attributes—mpg, cyl, disp, and hp—by selecting each axis from a dropdown menu. Built with React and D3 v5, it renders SVG circles whose positions are calculated with `scaleLinear` and `extent`, and axes are drawn using the custom `AxisBottom` and `AxisLeft` components. The plot displays values with a `siFormat` tick label and includes hover tooltips via SVG `<title>` elements.

BBizmundo

75% match

Loading thumbnail…

MTCARS Scatter Plot with Menus

This interactive scatter plot visualizes the mtcars dataset, letting users select which attribute (mpg, cyl, disp, hp) to plot on each axis. The chart displays circles for each car, with tooltips showing the x-axis value. Using React with D3 v5, the code implements a `Dropdown` component to update state and re-render the SVG. The `scaleLinear` function scales the data, while `AxisBottom`, `AxisLeft`, and `Marks` modules handle the visualization's rendering.

BBizmundo

75% match

Loading thumbnail…

customized Scatter plot

This interactive scatter plot visualizes the relationship between maximum velocity (Vmax) and range for a dataset of airplanes, using SVG circles to represent individual aircraft. The chart is built with React and D3 v5, employing `scaleLinear` for both axes and custom `AxisBottom` and `AxisLeft` components to render ticks. Hovering over a circle reveals its precise Vmax value via a native SVG `<title>` tooltip. The visualization reads from a CSV file fetched through D3’s `csv` loader, with styled axis labels and a clean, minimal aesthetic defined through CSS classes.

Rrsulli4

74% match

Loading thumbnail…

Working stuff out - zz

This interactive scatter plot visualizes the relationship between any two numeric variables from the auto-mpg dataset, with dropdown menus enabling users to select which columns appear on the x and y axes. The visualization uses React for menu state management and d3.v5 for SVG rendering, employing scaleLinear, axisLeft, axisBottom, and transition.attrTween for animated circle resizing. Circles are colored with a gradient based on their x-axis position using d3.rgb, and the axes include gridlines and labels.

SSparkler

73% match