Yaswanth_duddu_ICE7

Yaswanth_duddu_ICE7

This reusable scatter plot shows the relationship between hours studied and exam scores for 50 students, with attendance percentage encoded as color and assignment completion as point radius. The visualization is built with D3 v7, using a queryable ScatterPlot function that accepts custom accessors for x, y, radius, and color. The code implements scales for positioning and sizing, axis generators for the plot frame, and SVG circle elements with tooltips via the append('title') API. The dataset is loaded from a CSV file containing student records with eight variables.

90% match

ICE_7_Yaswanth_Duddu

This scatter plot shows the relationship between study hours and math scores for ten students, with each circle representing an individual student’s data point. The visualization uses D3.js v6 to load data from a CSV file, scales the x and y axes linearly, and renders circles in an SVG container. The code converts the CSV strings to numbers, creates x and y scales, appends axes, and positions the steel-blue circles using the scale functions to map study hours and scores to pixel coordinates.

87% match

ICE_7_Yaswanth_Duddu

This scatter plot shows the relationship between study hours and exam scores for 50 students, with point color encoding attendance percentage (using a `d3.scaleThreshold` with blue, purple, and red bands) and point radius encoding assignment completion via a `d3.scaleSqrt`. The visualization is built with D3 v7, using the `d3.select` fluent API to configure the reusable `ScatterPlot()` component, which appends an SVG with `d3.axisBottom` and `d3.axisLeft` scales. Data is loaded from a local CSV file using `d3.csv` and `d3.autoType`, with hover tooltips provided through SVG `<title>` elements.

86% match

ICE_7_Yaswanth_Duddu

A reusable D3 v7 scatter plot displays study habits across 30 students, mapping hours studied to exam scores. Each SVG circle encodes attendance through a purple-blue color scale and assignment completion via radius size. The chart includes gridlines, axes, and interactive hover tooltips showing all four data dimensions. A custom ScatterPlot component function applies margin conventions and D3 scales, with the gradient legend indicating three attendance categories.

83% match

HHarshithaDontha@my.unt.edu

Ice 7 Scatter plot harshitha dontha

This reusable scatter plot shows the relationship between study hours and exam scores, with each point representing a student. The chart uses d3.scaleLinear for both axes and renders circles via SVG. The code demonstrates a modular chart function pattern, loading data from a CSV file and displaying axes with d3.axisBottom and d3.axisLeft. The visualization also includes a separate implementation that supports custom symbol shapes and color encoding through d3.symbol and d3.scaleOrdinal.

Scatter plot

This dark-themed scatter plot visualizes the relationship between hours studied and exam scores for 188 students, with each point colored by attendance percentage using a sequential turbo scale. The visualization loads data from a CSV file and renders it as SVG circles, employing D3 v7 scales for positioning and color encoding. Interactive tooltips display student details on hover, while grid lines and axis labels provide context for the academic performance metrics.

RRamdas Dheeraj

HHarshithaDontha@my.unt.edu

Ice7 scatter plot

This scatter plot visualizes exam scores against study hours for 15 students, revealing a clear positive correlation between the two variables. Each point is labeled with its student number, and the axes include descriptive titles. The visualization uses D3 v7 to load CSV data with `d3.csv`, scales the data with `d3.scaleLinear`, and renders axes with `d3.axisBottom` and `d3.axisLeft`. The reusable `createScatterPlot` function generates an SVG with customizable colors and labels.

Yaswanth_Duddu_ICE7

This scatterplot example uses D3.js to render a simple two-dimensional point distribution. The visualization displays individual data points positioned across the plotting area, with styling controlled through a custom stylesheet that includes a large message element. The implementation leverages standard D3 selection methods to append SVG circles for each data point, while the accompanying style sheet applies font sizing and text alignment rules. The example includes a basic JavaScript entry point that logs a message to the browser console, serving as a minimal demonstration of D3’s core data-binding capabilities.