Skip to main content
SimilarExport ZIP
100%

Task8_Tutorial

✓ Published1🌍 Public
Ppravallikaratankanthkatragadda@my.unt.edu
Last edited Apr 15, 2024
Created on Apr 14, 2024
Forked from Hello VizHub

This example visualizes the Iris dataset as a scatter plot, showing petal length versus petal width for individual flowers. Points are colored by species (skyblue, lightgreen, or orange) and also encode sepal measurements through their radii. The code loads CSV data via `d3.csv`, uses `d3.scaleLinear` for axes and scales, and renders SVG circles with `d3.axisLeft` and `d3.axisBottom`. Axis labels are rotated, and styling is set with HTML and CSS.

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…

Task8_Tutorialo3

This scatter plot visualizes the Iris dataset, displaying petal length on the x-axis and petal width on the y-axis, with each point colored by species (setosa, versicolor, or virginica). Using D3 v6, it loads CSV data via `d3.csv`, applies linear scales with `scaleLinear` and `extent`, and renders circles as SVG markers with attributes for radius and fill. The axes are generated with `axisLeft` and `axisBottom`, and custom text labels annotate both dimensions. The code also parses numeric fields and computes additional sepal-related variables, though these are not directly plotted.

Ppogirimayoor@gmail.com
93% match
Loading thumbnail…

Task 8 tutorial 3

This scatter plot visualizes the Iris dataset, distinguishing three flower species with colored circles: skyblue for setosa, lightgreen for versicolor, and orange for virginica. The chart plots petal length on the x-axis and petal width on the y-axis, while also encoding sepal length and sepal width as non-standard circle attributes. Built with D3 v6, it uses `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to map data values to SVG coordinates. The code loads CSV data from a GitHub gist and renders circles with fixed radius of 5 pixels on an SVG canvas.

Vvchittimadha@gmail.com
91% match
Loading thumbnail…

Task8_Tutorial3.1

This scatter plot visualizes the Iris dataset, mapping petal length and width to the x- and y-axes. Points are colored by species (setosa, versicolor, virginica) using a manual switch statement. The visualization is created with D3 v6, using `scaleLinear`, `extent`, and `axisLeft`/`axisBottom` for axes. Data is loaded from a remote CSV via `d3.csv`, and circles are rendered in SVG, with sepal dimensions also encoded but not visually used.

KKeerthi
91% match
Loading thumbnail…

Task8_tutorial3

A scatter plot of the Iris dataset, colored by species (setosa, versicolor, virginica), maps petal length on the x-axis and petal width on the y-axis. The code uses D3 v6 with `scaleLinear`, `axisBottom`, and `axisLeft` to render axes, while `circle` elements are positioned via `x` and `y` scales. Data is loaded asynchronously via `d3.csv` from a GitHub gist, and each point’s color is assigned by a `switch` statement. The visualization also references sepal length and width values, though these do not affect the plotted coordinates.

Ppranayrajana.97@gmail.com
91% match
Loading thumbnail…

Task8_Tutorial2

This interactive scatter plot displays the relationship between sepal length and petal length for three iris species, using distinct symbols to differentiate species categories. The visualization loads the Iris dataset from a remote CSV, parses it with `csvParse`, and renders the plot using D3 v7’s `symbol` generator and `scaleOrdinal`. It includes custom axes with labels and a shape legend positioned on the right. The code demonstrates reusable D3 modules for scatter plotting, axis drawing, and legend rendering, highlighting how to structure modular visualizations with data-driven joins and asynchronous state management.

Ppravallikaratankanthkatragadda@my.unt.edu
91% match
Loading thumbnail…

Fork of Task8_Tutorial2

This scatter plot visualizes the Iris dataset, showing sepal length against petal length. It uses D3 v7 to render SVG circles as symbols, with different shapes representing iris species via `scaleOrdinal` and the `symbolsFill` API. A custom shape legend is drawn using `symbolGenerator`, and axes are generated with `axisLeft` and `axisBottom`. Data loads asynchronously from a GitHub-hosted CSV file and is parsed with `csvParse`.

Ppravallikaratankanthkatragadda@my.unt.edu
91% match
Loading thumbnail…

Task8_Tutorial3.1

This scatter plot visualizes the Iris dataset, mapping petal length and width as the x and y coordinates of each point. The points are colored by species (setosa, versicolor, or virginica) using a custom color-switching function, while the point radii (`rx`, `ry`) encode sepal length and width. The visualization loads data via D3's `csv` method, uses `scaleLinear` to map domain values to SVG pixel ranges, and renders axes with `axisLeft` and `axisBottom`. The code employs D3 v6's selection-based `join` for efficient SVG circle creation, with global window dimensions defining the chart area.

Jjyothirmaijyothi2017@gmail.com
91% match
Loading thumbnail…

Task 8 tutorial 3

This scatter plot visualizes the Iris dataset, mapping petal length and width on the axes, with points colored by species (setosa, versicolor, and virginica). The chart uses D3 v6’s `csv`, `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` APIs to load data from a GitHub-hosted CSV and render the SVG. In addition to the petal measurements, the code accesses sepal length and width values, though these are not plotted in the visible marks. The visualization includes custom-styled axis labels and colored circles with a fixed radius.

YYeshwanth963@gmail.com
91% match