task 3.2

100%

✓ Published0🌍 Public

Last edited Apr 6, 2024

Created on Apr 6, 2024

Forked from Fork of Scatter Plot with Shape

This example displays a scatter plot of the Iris dataset, plotting sepal length against petal length. Points are colored and shaped according to species, with a custom legend identifying each species by its unique symbol. The visualization uses D3.js (v7) to fetch and parse the CSV data from a GitHub repository, then renders the plot within an SVG. It constructs axis scales with `scaleLinear`, applies shape encodings through `scaleOrdinal` and `symbolsFill`, and generates marks via `symbolGenerator`, with axes and legends created by custom functions.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

task3.2

This example demonstrates a scatter plot of the Iris dataset, mapping sepal length to the x-axis, petal length to the y-axis, and encoding species with distinct shapes. The visualization uses D3's `scaleLinear`, `scaleOrdinal`, `symbolsFill`, and `symbol` APIs to render the data points, while `axisLeft` and `axisBottom` from D3 handle the axes. A custom shape legend is built using the `symbol()` generator. The data is loaded asynchronously via `fetch` from a remote CSV file, then parsed with `csvParse` before being rendered.

Yyashwanthkirla95@gmail.com

95% match

Loading thumbnail…

task 3.2

This example shows a scatter plot of the Iris dataset, with sepal length mapped to the x-axis, petal length to the y-axis, and species distinguished by different symbol shapes. A custom shape legend labels each species group. The visualization loads CSV data via `d3.csvParse` and uses D3 v7’s `scaleLinear`, `scaleOrdinal`, `symbol`, `symbolsFill`, and axis functions (`axisLeft`, `axisBottom`) to render marks and axes. A local ES6 module structure organizes the code into separate files for the chart, axes, and legend.

Jjangalaupender@my.unt.edu

95% match

Loading thumbnail…

Activity6_Task3.2

This example demonstrates a scatter plot of the Iris dataset, showing sepal length versus petal length with different point shapes representing species. The visualization loads data from a GitHub-hosted CSV file, parses it with `d3.csvParse`, and renders points using D3 v7's `scaleLinear`, `scaleOrdinal`, and `symbol` generators. A custom shape legend, implemented as an ES6 module, displays the three species with matching symbols. Axes are drawn using `axisLeft` and `axisBottom`, with labels positioned via D3 selection methods.

Gguttavenkata745@gmail.com

94% match

Loading thumbnail…

Task3.2

This scatter plot visualizes the Iris dataset, showing sepal length against petal length. Points are colored and shaped by species, with a legend mapping shapes to the three iris species. The visualization is built using D3 v7, employing force-directed layout principles through `d3.scaleLinear` and `d3.scaleOrdinal` for scales. The chart fetches data from a remote CSV, parses it with `d3.csvParse`, and renders marks via `d3.symbol` with axes generated by `d3.axisLeft` and `d3.axisBottom`.

IIkram Mohammed

94% 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

93% match

Loading thumbnail…

Task-3.2

This example renders a scatter plot of the Iris dataset, showing sepal length versus petal length with points colored and shaped by species. It loads data via a remote CSV URL using `d3.csvParse` and builds the visualization with D3 v7, including `d3.scaleLinear`, `d3.scaleOrdinal`, `d3.symbol` for custom point shapes, and a custom axes module using `d3.axisLeft` and `d3.axisBottom`. A separate shape legend module displays the species symbols, and the code demonstrates ES6 module imports across local files.

Kkotipallipavan54@gmail.com

93% match

Loading thumbnail…

Task_3.2

This visualization shows a scatter plot of the Iris dataset, mapping sepal length on the x-axis against petal length on the y-axis, with points styled by species using different D3 symbols. The code loads data from a CSV file via the Fetch API and parses it with d3.csvParse, then renders the plot using d3.scaleLinear for axes, d3.scaleOrdinal with d3.symbolsFill for shape encoding, and d3.axisLeft/axisBottom via the custom axes module. A custom shape legend module displays the species categories using d3.symbol, while D3’s join pattern handles dynamic element updates.

Rrakesh.kavuru@outlook.com

93% match

Loading thumbnail…

TASK-3

This example demonstrates a scatter plot of the Iris dataset, showing sepal length against petal length with points shaped by species. The visualization loads the CSV data from a GitHub repository and uses D3 v7 APIs including `scaleLinear`, `scaleOrdinal`, `symbol`, and `axisLeft`/`axisBottom` to render axes and points. A custom legend displays the three species using different symbol shapes, while the code exercises local ES6 module imports alongside D3’s bundled version. The chart rescales to fit the viewport dimensions on load.

Aajaykumarakula00@gmail.com

93% match