Skip to main content
SimilarExport ZIP
100%

Data visualization Project

✓ Published0🌍 Public
Ssahasrakaturi91@gmail.com
Last edited Oct 6, 2025
Created on Oct 6, 2025
Forked from HTML Starter

This visualization presents a dashboard for an art and technology workshop dataset, showing attendance metrics and registration trends. It uses D3 v7 to render SVG charts, including a track-based attendance breakdown and a registered-versus-attended comparison. The interface includes interactive controls like dropdowns and text inputs for filtering, alongside summary cards displaying key statistics. The visualization is built with Vue, incorporates custom CSS styling, and references embedded PNG images for chart representations.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

D3 Workshop: Part 3 - Conference Data

This visualization displays conference registration data, showing individual attendees as circles positioned on an SVG canvas. Each data point includes school affiliation, year of study, area code, and payment timestamp. The code uses D3 v4 to bind the JSON dataset and append circle elements to the SVG, with animations likely triggered through D3 transitions. The example serves as an educational workshop demonstrating basic data binding and SVG rendering techniques with d3.select and d3.append.

DDeveloperJeffb
75% match
Loading thumbnail…

D3 Workshop: Part 3 - Conference Data

This interactive workshop example plots conference registration records as circles on an SVG, with each data point encoding order details such as school affiliation, year of study, and payment timestamp. Built with D3 v4, it uses data binding to append SVG elements and animate their positions. The visualization demonstrates how raw CSV-style data can be mapped into a static scatterplot, with no axes or scales defined, relying on a simple selection and enter-update pattern to display the dataset in a fixed 700x300 viewport.

MMara2020
75% match
Loading thumbnail…

D3 Workshop: Part 3 - Conference Data

This example visualizes a workshop’s conference registration data, showing the distribution of attendees by their school affiliation and year of study. The visualization uses D3 v4 to render SVG circles, with each data point representing an individual order. The code leverages `d3.select` to bind the embedded dataset and positions circles based on categorical groupings, while animation via D3’s transition methods highlights the points upon load. The raw data, including order timestamps and area codes, is hardcoded in the script, and the rendering focuses on the static SVG container.

FFordMcLeod
73% match
Loading thumbnail…

ice7_task2_1

This pie chart displays the distribution of student attendance levels (high, medium, and low) from a CSV dataset of exam scores. The visualization uses D3 v7’s `d3.pie` and `d3.scaleOrdinal` to generate SVG slices with a color-coded legend and in-chart labels. Data is grouped by attendance percentage thresholds, and a note box provides context for the analysis.

Ssahasrakaturi91@gmail.com
73% match
Loading thumbnail…

D3 Workshop: Part 3 - Conference Data

This example visualizes conference registration data, mapping each attendee’s order details, school affiliation, and year of study. It shows a static SVG bar chart or scatterplot-like layout, though the code primarily loads the dataset and prepares it for D3 v4 rendering. The visualization uses D3 v4’s `d3.select` to target the SVG container and binds the array of objects, which include fields like “Area Code” and “Paid at” timestamps. While no axes or scales are defined, the example demonstrates how raw tabular data can be structured for future graphical encoding, with the source data embedded directly in the script.

AAndrewMcKernan
73% match
Loading thumbnail…

ice7_task1

This example visualizes the distribution of student attendance levels as a pie chart, grouping students into three categories: high (≥85%), medium (70%-84%), and low (<70%). Each slice is colored correspondingly, with a legend displayed alongside the chart. The visualization loads data from a CSV file using `d3.csv`, processes it with JavaScript array methods, and renders the pie using `d3.pie` and `d3.arc` within an SVG. A legend is dynamically populated using D3 selections, and the chart employs a `d3.scaleOrdinal` for color mapping.

Ssahasrakaturi91@gmail.com
72% match
Loading thumbnail…

D3 Workshop: Part 3 - Conference Data

This visualization presents a scatterplot of conference registration data, mapping each attendee by their area code and order ID. The plot uses SVG elements within a 700x300 pixel canvas, built with D3.js v4. The code is forked from ideaOwl’s block and uses `d3.select` to target the SVG element. Each data point represents a paid order, with attributes like school affiliation and year of study, though the current rendering appears static without interactive features or animations.

MMandyMeindersma
72% match
Loading thumbnail…

D3 Workshop: Part 3 - Conference Data

This visualization presents a scatterplot of conference registration data, mapping each attendee by their area code and order ID. The plot uses SVG elements within a 700x300 pixel canvas, built with D3.js v4. The code is forked from ideaOwl’s block and uses `d3.select` to target the SVG element. Each data point represents a paid order, with attributes like school affiliation and year of study, though the current rendering appears static without interactive features or animations.

MMandyMeindersma
72% match