Week 7 - Nobel Prize Winners - Tree Visualization

100%

Week 7 - Nobel Prize Winners - Tree Visualization

✓ Published0🌍 Public

Last edited Oct 10, 2025

Created on Oct 9, 2025

This interactive tree visualization explores Nobel Prize winners by category and country of birth, using D3 v7 with animated expansion and collapse of branches. The hierarchy groups laureates by prize category, then country, with node size reflecting prize share. The visualization implements auto-expanding subtrees with smooth transitions between states, centered within a responsive SVG viewport. Data comes from a CSV file containing laureate details from 1901 onward, parsed using d3.csvParse. The code leverages d3.hierarchy, d3.tree, and d3.linkHorizontal for layout, with d3.extent for dynamic viewBox calculation.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Week 7 Country Map - Nobel Prize Winners

This visualization shows the global distribution of Nobel Prize winners by country, using prize counts derived from laureate birth or organization countries. A choropleth world map colors each nation on a blue sequential scale, with gray for countries lacking winners and a tooltip providing details. The implementation uses D3 v7 with `d3.geoNaturalEarth1` and `d3.geoPath` to render SVG paths from world GeoJSON data, while `d3.rollup` and a custom normalization function reconcile country names between the CSV dataset and map features.

VVinayak Revankar

81% match

Loading thumbnail…

Tree Map -- nobel_data

A zoomable tree map visualizes Nobel laureate data from a CSV file, hierarchically organized by country, city, institution, and expert name. The D3.js hierarchy layout with `d3.linkHorizontal` connections renders an SVG tree, using `d3.csv` to load the data and sorting nodes by ranking fields. The dark blue background and interactive collapsible nodes display the dataset's nested structure, with a dynamic width based on the window size.

PPekingWaldo

80% match

Loading thumbnail…

Week 6 - Phase 3 - Nobel Prize Winners - Line Chart

This line chart visualizes Nobel Prize winners per decade, grouped by category (Chemistry, Literature, Medicine, Peace, Physics, and Economics). The data comes from a CSV file containing laureate details from 1901 onward. The visualization uses d3.rollups to aggregate counts by decade and category, then renders smooth lines with d3.line() and monotone X curve interpolation, along with interactive points that display tooltips on hover. A legend allows users to toggle category visibility by clicking, which transitions line and point opacity using transition.attr().

VVinayak Revankar

80% match

Loading thumbnail…

Nobel Prize Winners

This example loads Nobel Prize laureate data from a CSV file and displays the raw parsed records as JSON in a `<pre>` element. The visualization uses D3 v7’s `csvParse` to transform each row, converting fields like year and prize share into numeric values, while preserving categorical attributes such as category, sex, and birth country. The code demonstrates a state-driven rendering pattern within a Vue-like setup, where asynchronous data fetching triggers re-renders. The dataset spans laureates from 1901 onward, sourced via Kaggle, and the current view focuses on data loading and inspection rather than a graphical chart.

VVinayak Revankar

78% match

Loading thumbnail…

assignment

This bar chart visualizes the number of Nobel Prizes awarded per category, using data parsed from a CSV file containing laureate information. The D3.js v7 code loads the data, counts prizes by category, and renders the results using `scaleBand` and `scaleLinear` for axes. Bars are colored steelblue and sorted in descending order by prize count. The SVG visualization includes rotated category labels on the x-axis, a title, and axis labels, with the underlying data rows also including year, prize share, and laureate details.

HHarshithaAru06

77% match

Loading thumbnail…

Project 1 - Phase 2 - Nobel Prize Winners - Bar Chart

This interactive visualization presents Nobel Prize winners by category and birth country. A bar chart displays the total number of prizes per category, while a world map uses colored countries and proportional circles to show laureate distribution geographically. The code uses D3 v7 APIs including `scaleBand`, `scaleLinear`, `geoNaturalEarth1`, `geoPath`, and `scaleSqrt`. Data is loaded from a CSV file, with geographic boundaries from the world-atlas TopoJSON dataset. Both views are rendered as SVG, with a toggle between bar chart and map views.

VVinayak Revankar

77% match

Loading thumbnail…

Interactive - Project 1 - Nobel Prize Winners - Bar Chart

A bar chart displays the number of Nobel Prizes awarded per category, ranking categories from most to least frequent. The visualization loads data from a CSV file, parses it with d3.csvParse, and renders an SVG bar chart using d3.scaleBand, d3.scaleLinear, d3.axisBottom, and d3.axisLeft. Bars are styled steelblue with a hover effect that changes fill to orange. The chart includes rotated x-axis labels, axis titles, and a bold title, all built with D3 v7 and Vue.

VVinayak Revankar

76% match

Loading thumbnail…

Fork of Project 1 - Phase 3 - Nobel Prize Winners - Line Chart

This example shows the number of Nobel Prizes awarded per decade, split into separate lines for each prize category. Using D3 v7 with SVG rendering, it loads data from a CSV file, aggregates the entries by decade and category, and draws a multi-series line chart with color-coded labels. The visualization uses `d3.rollups` for grouping, `d3.scaleLinear` for axes, and `d3.line` to generate the paths. The chart reads from a Vue-based project that fetches the CSV and clears the container before rendering.

VVinayak Revankar

75% match