traitement_donnee_steam

100%

traitement_donnee_steam

✓ Published0🌍 Public

Last edited Oct 24, 2017

Created on Oct 24, 2017

This example presents two side-by-side scatterplots of the Iris dataset, comparing sepal and petal measurements across species. The left chart plots sepal length against sepal width, while the right chart plots petal length against petal width, with circle radius encoding a third quantitative variable and color encoding the categorical species via the d3.scaleOrdinal color scheme and d3.scaleSqrt for area. Built with d3.v4 and SVG, it includes axis labels, mouseover highlighting that thickens the selected dot’s stroke, and a transparent tooltip container using plain D3 selection methods and event handlers.

AI-generated description

Built with blockbuilder.org

mit Licensed

Similar vizzes

Loading thumbnail…

traitement_steam

Two coordinated scatterplots display the classic Iris dataset, contrasting sepal measurements on the left with petal measurements on the right. Each plot maps one measurement to the x-axis, another to the y-axis, and a third to circle radius via `d3.scaleSqrt`, while species determines color through `d3.scaleOrdinal` with `d3.schemeCategory20`. The code uses D3 v4 to render SVG circles with axes from `d3.axisBottom` and `d3.axisLeft`. Hovering over a dot increases its stroke width for emphasis, but no linked highlighting or selection between charts is implemented beyond this.

GGTHamonville

93% match

Loading thumbnail…

td3

This visualization displays two side-by-side scatterplots of the Iris dataset, plotting sepal length against sepal width. Each point is encoded with a symbol and color representing the flower species, while point size reflects petal length. Built with D3 v4, the code uses `d3.scaleLinear`, `d3.scaleOrdinal`, and `d3.symbol` to generate distinct patterns for setosa, versicolor, and virginica. The SVG renderings are created by appending paths to separate chart divs, with scales computed from the CSV data using `d3.extent` and `d3.axisBottom`/`d3.axisLeft` for axes.

MMathReynaud

86% match

Loading thumbnail…

Coordinated Scatterplot Iris (d3.v4)

This example displays the Iris flower dataset in two coordinated scatterplots using D3.js v4 and SVG rendering. The left chart plots sepal length against sepal width, while the right chart shows petal length against petal width, with each dot sized by a third attribute and colored by species via `d3.scaleOrdinal`. Hovering over a point highlights it in both charts by increasing its stroke width. The code uses `d3.csv` to load the dataset and `d3.axisBottom` and `d3.axisLeft` for the axes.

GGTHamonville

85% match

Loading thumbnail…

Iris_scatterplot_sepal

This example visualizes the classic Iris dataset using a scatterplot of sepal length versus sepal width, with points colored and shaped by species. Built with D3 v4, it renders as an SVG with a tooltip that appears on hover, and includes a categorical legend and axis labels.

DDjokovalle

84% match

Loading thumbnail…

Iris_scatterplot_sepal

This example visualizes the classic Iris dataset, plotting sepal length against sepal width for three iris species. Built with D3 v4, the scatterplot uses SVG shapes to encode species: circles for setosa, red squares for versicolor, and black squares for virginica. A square-root scale controls point size, and hover tooltips display species names. Animated transitions and a categorical color legend complete the chart, which reads directly from iris.csv.

DDjokovalle

84% match

Loading thumbnail…

D3 Scatterplot

This example visualizes the Iris dataset as a scatterplot, mapping petal length on the x-axis and sepal length on the y-axis. Each flower is rendered as a circle using D3’s selection and data-join methods. The code loads the data via `d3.csv`, scales positions with `d3.scaleLinear`, and adds axes through `d3.axisLeft` and `d3.axisBottom`. The SVG is sized to the full window, and the plot includes customizable margins and tick font sizing.

Aajoua

83% match

Loading thumbnail…

scatterplot in progress

This example visualizes the classic Iris dataset as a scatterplot, mapping sepal length and sepal width to the x- and y-axes while encoding petal length in the radius of each circle and species in color. Built with D3 v4 and rendered as SVG, the chart loads iris.csv and applies linear scales for all three variables, with the radius scale bounded between 2 and 15 pixels. The visualization uses a categorical color scheme (d3.schemeCategory20) to distinguish the three iris species, and axes are drawn on the bottom and left edges of the plotting area.

BBerengerCunillera

83% match

Loading thumbnail…

Iris_scatterplot_sepal

This example visualizes the classic Iris dataset, plotting sepal length against sepal width for 150 flowers. Points are encoded with different shapes and colors to distinguish the three species: setosa (circles), versicolor (red squares), and virginica (black squares). The visualization includes axis labels, a categorical color legend, and interactive tooltips that display the species on hover. Built with D3 v4 using SVG, it also demonstrates the use of ordinal color scales, square-root size scaling, and filter-based shape encoding.

DDjokovalle

83% match