Skip to main content
SimilarExport ZIP
100%

Activity6_Task3

✓ Published0🌍 Public
Nneerajreddyaluka@gmail.com
Last edited Apr 12, 2024
Created on Apr 12, 2024
Forked from Hello VizHub

This example visualizes the Iris dataset as a scatter plot, using points with distinct symbols to represent different flower species. It maps sepal length to the x-axis and petal length to the y-axis, with a legend identifying each species. The visualization loads data from a remote CSV file via `d3.csvParse` and uses a custom D3 v7 setup with ES6 modules. It leverages `d3.scaleLinear`, `d3.scaleOrdinal`, `d3.symbolsFill`, `d3.symbol`, and `d3.axisLeft` and `d3.axisBottom` to render the chart and its axes, with the plot resizing to the full window.

AI-generated description

An example showing the capabilities of VizHub:

  • Loads D3 via UNPKG.
  • Demonstrates use of import from "d3".
  • Demonstrates use of import from local ES6 modules.
MIT Licensed

Similar vizzes

Loading thumbnail…

Activity6_Task3.2

This D3.js scatter plot visualizes the Iris dataset, mapping sepal length to the x-axis and petal length to the y-axis. Each point's shape encodes the flower species, with a custom legend created using D3's `symbol` generator and `scaleOrdinal` with `symbolsFill`. The chart uses `scaleLinear` for axes, along with `axisLeft` and `axisBottom` for tick marks. Data is loaded via `csvParse` from a remote URL, and the visualization updates dynamically using D3's `select` and `.join` pattern for DOM manipulation.

Nneerajreddyaluka@gmail.com
95% match
Loading thumbnail…

Activity6_Task3.1

This example visualizes the Iris dataset as a scatter plot, mapping sepal length and petal length along the x- and y-axes while encoding species using distinct symbol shapes. The plot includes a custom shape legend and axis labels, with the data loaded from a remote CSV file. The visualization is built with D3 v7, using `scaleLinear`, `scaleOrdinal`, and `symbol` from the `d3` module to position points and generate shapes. Axes and legend are created through reusable local ES6 modules, `axes.js` and `shapeLegend.js`, which import functions like `axisLeft` and `axisBottom` from D3.

Hhaneesh@gctc.in
94% 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
94% match
Loading thumbnail…

Activity6_Task3.2

This example displays a scatter plot of the Iris dataset, mapping sepal length to the x-axis and petal length to the y-axis, with species encoded by distinct symbols and a corresponding legend. It uses D3 v7’s `scaleLinear`, `scaleOrdinal`, and `symbol` APIs to position marks and generate shapes. Data is loaded from a remote CSV via `csvParse` and fetched asynchronously. The visualization also demonstrates modular ES6 imports for reusable axis and legend components.

Kkrishnavisheshkatta@my.unt.edu
94% match
Loading thumbnail…

Activity6_Task3.2

This example shows a scatter plot of the Iris dataset, encoding sepal length on the x-axis, petal length on the y-axis, and species using different D3 symbol shapes, with a legend for the shapes. The visualization loads data from a remote CSV file via `fetch` and `csvParse`, then uses `scaleLinear`, `scaleOrdinal`, and `symbol` to map data to positions and shapes. It builds the chart using `svg.call` with reusable modules for axes and legend, and updates dynamically through a state-based render loop.

Ssrilekhasridasyam@my.unt.edu
94% match
Loading thumbnail…

Activity06Task3.2

This example visualizes the Iris flower dataset as a scatter plot, mapping sepal length to the x-axis and petal length to the y-axis, with different plant species distinguished by distinct filled symbols. The visualization uses D3.js v7, leveraging `scaleLinear` and `scaleOrdinal` to map data dimensions to chart coordinates and symbol shapes. It loads data from a remote CSV file, computes axis scales, and renders axes with labels via custom `axisLeft` and `axisBottom` utilities. A shape legend, generated using `symbol`, displays the species categories alongside the plot.

Bbharatchowdarypotluri@my.unt.edu
94% match
Loading thumbnail…

Activity6_Task3-2

This scatter plot visualizes the Iris dataset, mapping sepal length on the x-axis and petal length on the y-axis, with species encoded by different symbol shapes. The visualization loads the data from a remote CSV file using `d3.csvParse` and renders it using D3 v7. It employs `scaleLinear` for axes, `scaleOrdinal` for shape mapping, and `axisLeft`/`axisBottom` for tick marks. A custom shape legend, built with `d3.symbol`, displays the species labels.

Kkowshiksamudrala08@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 species indicated by different symbols and a legend. The visualization loads the data from a GitHub CSV file, parses it with `d3.csvParse`, and uses D3 v7’s `d3.scaleLinear`, `d3.scaleOrdinal`, `d3.symbolsFill`, and `d3.axisBottom`/`d3.axisLeft` for scales and axes. The code employs a `join`-based declarative grammar to build SVG elements, with a custom `shapeLegend` for symbol encoding. The plot adapts to the window size and updates dynamically as data loads.

RRJVENKATESH789@GMAIL.COM
94% match