Skip to main content
SimilarExport ZIP
100%

Fork of Fork of Fork of Fork of Hello VizHub tutorial 3.1

✓ Published0🌍 Public
LLakshmiPrasannaValdas@my.unt.edu
Last edited Apr 15, 2024
Created on Apr 15, 2024

This example displays the Iris dataset through a scatter plot, mapping petal length and width to the x- and y-axes while coloring points by species (setosa, versicolor, or virginica). The visualization uses D3 v6 to load CSV data, apply linear scales with `d3.scaleLinear`, and render circles in an SVG container. It also draws axes via `d3.axisBottom` and `d3.axisLeft`, with labeled axis text, and handles the full window size for the plot area.

AI-generated description

We are Displaying the IRIS dataset using Scatter plot.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Fork of Fork of Hello VizHub

This scatter plot visualizes the Iris dataset, showing petal length against petal width for three flower species, with each species color-coded as skyblue, lightgreen, or orange. The visualization uses D3 v6 to load CSV data, create SVG circles, and generate axes with `scaleLinear`, `extent`, `axisLeft`, and `axisBottom`. The code maps the data fields to plot coordinates, with axis labels for petal and sepal measurements, providing a clear comparison of the dataset’s dimensions.

LLakshmiPrasannaValdas@my.unt.edu
93% match
Loading thumbnail…

Fork of Hello VizHub

This scatter plot visualizes the Iris dataset, mapping petal length and width on the axes and coloring each point by species (setosa, versicolor, virginica). The code loads CSV data from a remote URL using d3.csv, applies linear scales with d3.scaleLinear, and renders SVG circles positioned via d3.selectAll and .join. Axes are generated with d3.axisLeft and d3.axisBottom, while the chart dimensions adapt to the window size.

Ssaivaishnogaruda@gmail.com
92% match
Loading thumbnail…

Fork of Hello VizHub

This scatter plot visualizes the Iris dataset, mapping petal length and petal width for each sample while coloring points by species (setosa, versicolor, virginica). The visualization uses D3 v6 via UNPKG, loading data with `d3.csv`, scaling with `d3.scaleLinear`, and rendering axes with `d3.axisLeft` and `d3.axisBottom`. Circles are appended to an SVG, with fill colors assigned per species and petal dimensions determining x- and y-positions. The chart includes labeled axes and a fixed radius for all points, sourced from a remote CSV hosted on GitHub.

Ssusarlasruthi2000@gmail.com
92% match
Loading thumbnail…

Fork of Hello VizHub

This example presents an animated scatter plot of the Iris dataset, cycling through different x-axis variables to visualize petal and sepal measurements across three species. The visualization uses D3's `scaleLinear` for axes and a custom `scatterPlot` module to manage the chart's geometry. It incorporates a color-coded legend for species, axis labels, and a title, with data loaded via `d3.csv` from a remote URL and rendered as SVG circles. The animation shifts the x-axis among four measurement columns at regular intervals.

Jjasthilavanya2022@gmail.com
91% match
Loading thumbnail…

Fork of tutorial3

This scatter plot visualizes the Iris dataset, displaying petal length and width for individual flowers. Points are colored by species (setosa in skyblue, versicolor in lightgreen, and virginica in orange). The example uses D3 v6 to load CSV data from a GitHub URL and renders the chart as an SVG. The code implements `d3.scaleLinear` for axes and uses D3's `select`, `append`, and data join methods to create circles. Axis labels and titles are styled with HTML and CSS within the `index.html` file.

Kkaushikreddy901@gmail.com
90% match
Loading thumbnail…

Fork of Iris Dataset Scatter Plot

This example visualizes the Iris dataset, plotting petal length against petal width for individual flower specimens while color-coding points by species (setosa, versicolor, and virginica). It uses D3 v6’s `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` APIs to generate axes and map data to screen coordinates. The SVG circles are rendered with `select`, `append`, and a join operation, and the data is loaded via `d3.csv` from a raw GitHub source.

Bblikitha
90% match
Loading thumbnail…

Fork Activity6_Tutorial-3.1-Scatter Plot

This example displays the Iris dataset as a scatter plot, mapping petal length on the x-axis and petal width on the y-axis while color-coding each point by species (setosa, versicolor, or virginica). The visualization uses D3.js v6 to load the data from a CSV file via `d3.csv`, then renders circles in an SVG container. Scales created with `scaleLinear` and `extent` position the marks, while `axisLeft` and `axisBottom` generate the axes. The plot fills the browser window, with axis labels styled in green.

Aakhillenkalapally1999@gmail.com
90% match
Loading thumbnail…

Fork of Fork of Iris Dataset Scatter Plot

This scatter plot visualizes the Iris Dataset, mapping petal length and width on the x- and y-axes while coloring each point by species (green for setosa, purple for versicolor, orange for virginica). The D3.js v6 code loads the CSV data via `d3.csv`, and uses `d3.scaleLinear` for axes and `d3.extent` to compute domains. Using `d3.select` and the `join` operator, it appends SVG circles whose radius is fixed, while also setting `rx` and `ry` attributes (though these do not affect circle rendering). Axis labels and tick marks are generated with `d3.axisLeft` and `d3.axisBottom`. The visualization is rendered directly to an SVG element sized to the full browser window.

Vvamshisoletii
90% match