Iris parallel coordinate plot

100%

Iris parallel coordinate plot

✓ Published0🌍 Public

Last edited Jul 20, 2021

Created on Jul 20, 2021

Forked from Iris parallel coordinate plot

This interactive parallel coordinate plot displays nutritional data for 67 ice cream flavors from a CSV file, using color-coded lines to represent each flavor across four dimensions: trans fat, carbohydrates, sugars, and protein. Users can click and drag axis labels to reorder the dimensions, with adjacent axes swapping positions when crossed. The visualization uses D3 v4 with SVG rendering, employing d3.scaleOrdinal for color mapping, d3.scalePoint for axis positioning, d3.line for path generation, and d3.drag for interactive axis movement. Hovering highlights a flavor by dimming other lines with opacity transitions.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Iris Parallel Plot

This interactive parallel coordinate plot visualizes the Iris dataset, showing four morphological traits (sepal length, sepal width, petal length, petal width) as vertical axes with polylines colored by species. Users can drag axis labels to reorder the dimensions, with animated transitions via d3.transition. The visualization uses d3.scalePoint, d3.scaleLinear, d3.axisLeft, and d3.legendColor, rendering as SVG with semi-transparent strokes. Data is loaded from a CSV file using d3.csv.

Iimsohandsome123

80% match

Loading thumbnail…

Iris parallel coordinate plot ref 3

This interactive parallel coordinate plot visualizes the Iris dataset, with each line representing a flower and colored by species (setosa, versicolor, virginica). Users can hover over lines to highlight a selected species while dimming others, and drag the axis titles to reorder dimensions. Built with D3 v4, it uses `d3.scaleLinear`, `d3.scalePoint`, `d3.axisLeft`, and `d3.drag` to handle axis repositioning, while `d3.line` generates the polylines. The SVG rendering includes static axis labels and color-coded legend swatches.

Eexchoco

80% match

Loading thumbnail…

Iris Parallel Coordinates

This visualization presents the classic Iris dataset as an interactive parallel coordinates plot, displaying four numeric flower measurements across parallel axes with each of the three Iris species color-coded by line. The implementation uses D3 v3 with SVG rendering and animation, leveraging d3.scale.ordinal for axis placement and d3.svg.line to draw the polylines. Users can drag dimension labels to reorder axes, with the foreground paths updating dynamically during the drag interaction.

Yyptang5488

80% match

Loading thumbnail…

Fork of Iris Parallel Coordinate Plot

This interactive parallel coordinate plot visualizes the Iris dataset, displaying four numeric measurements across parallel axes with each sample colored by species. Users can drag any axis label horizontally to reorder the dimensions, with smooth transitions animating the line paths and axes to their new positions. Built with D3 v5, the visualization uses `drag`, `scalePoint`, and `scaleLinear` for axis management, while SVG paths with `transition` handle the animated updates. The code loads data from a CSV file and includes a legend identifying the three Iris species.

Wwaterm80

79% match

Loading thumbnail…

Iris Parallel Coordinate Plot_hw2

This interactive parallel coordinate plot visualizes the Iris dataset, displaying four measured attributes (sepal length, sepal width, petal length, petal width) as parallel axes with colored polylines representing three Iris species. Users can click and drag axis labels to reorder the dimensions, with lines smoothly animating to their new positions. The visualization is built with d3.v5, using `scalePoint` and `scaleLinear` for positioning, `axisLeft` for tick marks, and the `drag` interaction module to handle axis movement. Data is loaded from a CSV file via `d3.csv`, and the SVG rendering includes a legend identifying each species by color.

JJuliachien

79% match

Loading thumbnail…

309708015.html

This interactive parallel coordinates plot visualizes the Iris flower dataset, displaying four numeric attributes (sepal length, sepal width, petal length, and petal width) as polylines colored by species—setosa, versicolor, and virginica—using a categorical color scale. Users can drag axes to reorder dimensions and use brush interactions on each axis to filter the displayed lines. Built with D3 v3, the SVG rendering uses d3.svg.line, d3.svg.axis, d3.svg.brush, and d3.behavior.drag for manipulation. The data is loaded as CSV from a GitHub repository, with axis labels and a color legend included.

SSUNDARRAJAN MUGUNTHAN

79% match

Loading thumbnail…

Iris Parallel Coordinate Plot

This interactive parallel coordinate plot visualizes the classic Iris dataset, showing four floral measurements for three species. Each semi-transparent polyline represents one sample, colored by species (orange for setosa, teal for versicolor, purple for virginica), with draggable axes that reorder via `d3.drag` and animated transitions. A dropdown toggles the y-axis scale between a fixed union range (0–8) and per-axis extents computed with `d3.extent`. The SVG renders axes via `d3.axisLeft` and lines via `d3.line`, with species colors mapped through a custom function.

Nnomiaro

79% match

Loading thumbnail…

Iris parallel coordinate plot

This interactive parallel coordinate plot visualizes the classic Iris dataset, showing how four flower measurements (petal length, petal width, sepal length, sepal width) vary across three species, each colored red, green, or blue. Users can click and drag any axis label to reorder dimensions, with overlapping axes swapping positions automatically. Built with D3 v4, the SVG rendering uses `d3.scaleLinear` for axes, `d3.drag` for interactivity, and hover highlighting via `d3.transition` to dim non-selected lines, emphasizing the species under the cursor.

方方顗棠

79% match