Skip to main content
SimilarExport ZIP
100%

Activity6_Task3

✓ Published0🌍 Public
Jjaswanthreddy2715@gmail.com
Last edited Oct 19, 2024
Created on Oct 19, 2024
Forked from HTML Starter

This example visualizes the Iris dataset, plotting sepal length against petal length for each flower specimen. The scatter plot uses distinct symbols to represent the three iris species, with a legend positioned on the right side. Built with React and D3 v7, the code leverages scaleLinear for axes, scaleOrdinal and symbolsFill for shape encoding, and axisLeft/axisBottom for tick marks. The visualization loads CSV data asynchronously from a GitHub repository and adapts to the full browser window size.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

Activity6_Task3.2

This scatter plot visualizes the Iris dataset, mapping sepal length against petal length for individual specimens. Data points are rendered as distinct shapes, with a legend denoting the species of each flower. The visualization employs the D3.js library, utilizing its `scaleLinear`, `scaleOrdinal`, `symbolsFill`, and `axisLeft`/`axisBottom` components. It reads the dataset from a remote CSV file, parses it with `csvParse`, and constructs the chart using a custom React framework, with axes created via the `axes` module.

JJhansi Balla
95% match
Loading thumbnail…

Activity6_Task3_2

This interactive scatter plot visualizes the Iris dataset, mapping sepal length against petal length, with points colored by species according to a shape legend. Built with React and D3 v7, it uses `scaleLinear` for axes, `scaleOrdinal` and `symbolsFill` for categorical shape encoding, and `axisLeft`/`axisBottom` for labeled axes. The plot dynamically updates its size to fit the viewport, fetching data from a raw GitHub CSV file hosted by the author.

Ggroup118sai@gmail.com
94% match
Loading thumbnail…

Activity6_Task3.2

This example shows a scatter plot of the Iris dataset, mapping sepal length on the x-axis and petal length on the y-axis, with points colored and shaped by species. A custom shape legend displays the species categories. The visualization uses D3 v7 APIs including `scaleLinear`, `scaleOrdinal`, and `symbol` to render the marks, with axis and legend components built as reusable functions. The dataset is loaded as a CSV from a GitHub URL, parsed with `csvParse`, and numeric columns are converted before rendering. The plot updates responsively to the window size.

Vvarun.mahankali39@gmail.com
93% match
Loading thumbnail…

Activity6_Task3.2

This example visualizes the Iris dataset as a scatter plot, mapping sepal length along the x-axis and petal length along the y-axis. The visualization uses distinct shapes to represent the three species of iris flowers, with a shape legend positioned to the right of the plot. Built with d3.v7, the code leverages d3.csvParse to load data from a GitHub repository, d3.scaleLinear for axis scaling, and d3.scaleOrdinal with d3.symbolsFill to assign different symbol types to each species. The SVG rendering includes custom axis labels and a shape legend created through d3 selection joins.

Mmaneeshraja47@gmail.com
93% match
Loading thumbnail…

Activity6_Task3.1

This example shows an interactive scatter plot of the Iris dataset, mapping sepal length to the x-axis and petal length to the y-axis, with each species represented by a distinct symbol shape. The visualization uses D3.js v7 APIs including `scaleLinear`, `scaleOrdinal`, `symbolsFill`, and `symbolGenerator` to render the marks, while a custom shape legend displays the species categories. Data is loaded asynchronously from a GitHub-hosted CSV file using `fetch` and parsed with `csvParse`, with numerical fields coerced to numbers before plotting. The chart includes labeled axes and a legend, all rendered within an SVG canvas sized to the full viewport.

Bbudalavijay2001@gmail.com
92% match
Loading thumbnail…

Activity 6_Task3.2

This example shows a scatter plot of the Iris dataset, mapping sepal length to the x-axis and petal length to the y-axis, with the three flower species distinguished by different symbol shapes (circles, crosses, and diamonds) via a shape legend. The visualization is built with D3 v7, using `scaleLinear`, `scaleOrdinal`, `symbol`, and `symbolsFill` to position and style the marks. It fetches the CSV data from a GitHub repository and renders it in an SVG sized to the window. A modular structure separates the axes, legend, and plot logic into reusable functions.

SSiva Kishore Reddy
92% match
Loading thumbnail…

Activity6_Task3_Question3.2

This example visualizes the iris dataset, plotting sepal length against petal length and encoding species using different symbol shapes. It builds a scatter plot with D3 v7, using `d3.scaleLinear` for axes, `d3.scaleOrdinal` with `symbolsFill` to map species to shapes, and custom modules for axes and a shape legend. Data is fetched as CSV from a GitHub gist and parsed with `d3.csvParse`. The visualization is wrapped in a React-like state management pattern, though it renders directly into the DOM using `d3.select` and SVG elements.

KKondreddy Saikiran reddy
92% match
Loading thumbnail…

Activity6_Task3.2

This scatter plot visualizes the Iris dataset, showing sepal length against petal length, with each species represented by a distinct symbol shape. The plot encodes the three Iris species through shape, using d3.scaleOrdinal with symbolsFill to assign different geometric marks, while a custom legend explains the species mapping. Axes are rendered via d3.axisLeft and d3.axisBottom, with labels for both dimensions. The data is loaded asynchronously from a GitHub-hosted CSV file using d3.csvParse, and the visualization updates through a state management pattern that handles loading and rendering.

Nnikhilthoutu24@gmail.com
92% match