bargraph of ice_5 data

100%

bargraph of ice_5 data

✓ Published0🌍 Public

Last edited Mar 28, 2025

Created on Mar 24, 2025

This example visualizes student performance by comparing subject-specific marks against total marks. It displays two scatter plots side by side: one for Maths versus total marks and another for English versus total marks. Using D3.js v6 with SVG rendering, the code defines a reusable `scatterPlot()` function that configures scales, axes, and circle marks. Data is loaded from a CSV file via `d3.csv` from a GitHub gist, with the x-axis key configurable between different subjects. The reusable function pattern allows both charts to share identical styling and features.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

bargraph of ice_5 data

This bar chart displays average marks for several subjects, calculated from a CSV dataset of student scores. Each bar represents a subject, with height encoding the mean value, shown via steelblue rectangles that turn orange on hover. Built with D3.js v6, it uses `d3.csv`, `d3.mean`, `d3.scaleBand`, `d3.scaleLinear`, and axis generators to render an SVG with rotated category labels, titled “Average Marks in Each Subject.”

Vvenigallajaanu@gmail.com

88% match

Loading thumbnail…

Scatterplot_for_ice5

A scatterplot compares Maths and Science marks for individual students, with each circle colored steelblue when Maths exceeds Science and orange when Science is greater than or equal to Maths. Built with D3 v6 and rendered as SVG, the chart uses `d3.csv` to load the dataset, `d3.scaleLinear` for both axes, and `d3.axisBottom` and `d3.axisLeft` for ticks. Axes labels, a title, and a two-color legend clarify the comparison, while hover effects on the circles are not implemented.

Vvenigallajaanu@gmail.com

83% match

Loading thumbnail…

SCATTER PLOT IN ICE_6

This interactive scatter plot visualizes the relationship between maths and science marks from a CSV dataset, with two sequentially displayed SVG charts that alternate between circle and triangle/square symbols. The visualization shows student performance across two subjects, coloring points based on which subject score is higher. Built with D3 v7, the example uses `d3.scaleLinear` for axes, `d3.symbol()` with `d3.symbolTriangle` and `d3.symbolSquare` for custom point shapes, and `d3.csv()` for data loading. Both charts are initially hidden and displayed in sequence, each sharing identical axes, labels, and a legend indicating the comparison between maths and science scores.

Vvenigallajaanu@gmail.com

83% match

Loading thumbnail…

ICE - 6 Scatter Plot

This D3.js scatter plot visualizes student grades from a CSV file, plotting English scores on the x-axis and physics scores on the y-axis, with points colored by class (First class, Second class, or other). It uses `d3.csv` to load the data, `d3.scaleLinear` for axes, and `d3.axisLeft`/`d3.axisBottom` for tick marks. The SVG rendering includes circles sized by a fixed radius, with axis labels for English and science. The code also reads additional metrics (science and maths) into each data point, though these are not directly used for the visual encoding.

Cchilukuritagore1427@gmail.com

80% match

Loading thumbnail…

ice 6-3

Two panels display student performance data from a CSV file. The top chart plots math, reading, and writing scores as a multi-series line chart across student index. The bottom chart combines math scores as semi-transparent bars with reading scores as a line overlay for the first 100 students. Both charts use D3.js v7 with SVG rendering, d3.line for the series, d3.scaleLinear for axes, and d3.scaleBand for the bar categories.

Ssaiprasadpilla937@gmail.com

78% match

Loading thumbnail…

ICE 6 scatter plot

This scatter plot displays student grades, plotting English scores on the x-axis against Physics on the y-axis, with each point colored by class category (First, Second, or other). The code loads CSV data via `d3.csv`, applies `d3.scaleLinear` for both axes, and renders circles using SVG. It also encodes additional dimensions through the `rx` and `ry` attributes, mapping Science and Math scores to each circle’s horizontal and vertical radii, while using `d3.axisLeft` and `d3.axisBottom` for labeled axes.

Cchilukuritagore1427@gmail.com

78% match

Loading thumbnail…

ICE-7 - Scatter Plot

This animated scatter plot maps student performance metrics, such as scores in tenth, twelfth, and college, along with time spent, against each other. The plot cycles through different x-axis variables, updating the visualization in a loop, and colors data points by hobby categories: Cinema, Sports, and Others. Built with D3 v6, it uses `d3.csv` to load the data and a custom `scatterPlot` module that constructs axes and circles, rendering the SVG animation with a legend and labels.

AAshrith Kudidhi

77% match

Loading thumbnail…

ICE Bonus Scatter plot

This 3D scatter plot visualizes student performance by plotting English, Science, and History scores against Age and Maths grades. Three distinct marker styles represent each subject, allowing comparison of academic metrics across age groups. The visualization uses Plotly’s `scatter3d` type via the `Plotly.newPlot` API, with data loaded from a CSV file using D3 version 3’s `d3.csv` function. The code defines three traces with customized marker colors, sizes, and opacity levels to differentiate the subjects.

SSamanvitha1

77% match