Skip to main content
SimilarExport ZIP
100%

test2024

✓ Published0🌍 Public
Ddaniel
Last edited Jan 8, 2024
Created on Jan 8, 2024
Forked from bar_test

This visualization displays university rankings from a CSV dataset as an interactive stacked bar chart. Users can sort universities by overall score or individual performance metrics, and choose ascending or descending order using dropdown menus. The chart renders with D3.js v4, using `scaleBand` for the x-axis, `scaleLinear` for the y-axis, and `scaleOrdinal` for color mapping. The bars stack five score components—teaching, research, citations, industry income, and international outlook—using D3's stack API, with SVG rendering for the final output.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

bar_test

This visualization displays the scores of world universities across multiple metrics, presenting them as stacked horizontal bars. Users can sort the data by overall score or individual metrics and toggle between ascending and descending order via dropdown menus built with the `dropdownMenu` utility. The chart uses `d3.scaleBand`, `d3.scaleLinear`, and `d3.scaleOrdinal` to map university names, score values, and color-coded metric segments. Data is loaded from a CSV file containing ranked university performance statistics, and the SVG rendering updates dynamically with each selection change.

Ddaniel
88% match
Loading thumbnail…

Fork of bar_test

This visualization displays university ranking data as an interactive stacked bar chart, showing scores across teaching, research, citations, industry income, and international outlook for each institution. Users select a sorting metric and order from dropdown menus, which reorders bars and changes the stacking priority. The chart uses D3 v4 with `scaleBand`, `scaleLinear`, `scaleOrdinal`, and `stack` to render SVG rectangles, while the `dropdownMenu` module handles menu interactions. Data comes from a local CSV file with Times Higher Education rankings.

Ddaniel
86% match
Loading thumbnail…

stacked bar chart

This stacked bar chart displays the weighted scores of universities across five categories: teaching, research, citations, industry income, and international outlook. The chart reads the data from `university.csv` and renders it as an SVG, with each bar representing a university and segmented by score category. Users can interactively sort the universities by any of the five scores, in either ascending or descending order, using dropdown menus. The visualization uses D3 v4 APIs including `d3.scaleBand`, `d3.scaleLinear`, `d3.scaleOrdinal`, `d3.stack`, and `d3.axisBottom` to construct the chart.

Cchingching17
85% match
Loading thumbnail…

HW5_311553050

This interactive stacked bar chart visualizes the 2024 Times Higher Education World University Rankings, breaking down each university's overall score into five component scores: teaching, research, citations, industry income, and international outlook. Users can re-sort the bars by any of these sub-scores using radio buttons, in either ascending or descending order. Built with a custom D3.js 3.5.6 script, the chart loads data from a CSV and uses `d3.layout.stack()` to aggregate the component scores, with category colors from `d3.scale.category20()`. The visualization supports transitions between sorted states, applying the new data through `transitionCount()` which re-stacks and updates the rectangles.

YYunLing
83% match
Loading thumbnail…

Stacked Bar Charts

This stacked bar chart displays the weighted performance scores of universities across five categories: Teaching, Research, Citations, Industry Income, and International Outlook. The data, sourced from a CSV file, is loaded using d3.csv and rendered as SVG rectangles arranged with d3.stack. Users can sort universities by overall score or individual category in ascending or descending order via drop-down menus and a confirm button. Hovering over the legend highlights one category while dimming others.

方方顗棠
83% match
Loading thumbnail…

Untitled

This example shows the Times Higher Education World University Rankings 2024 as interactive stacked bar charts. Each page displays 100 universities, with bars segmented by six performance categories (overall, teaching, research, citations, industry income, and international outlook). Users can reorder the bars by ascending or descending score for any category and page through the dataset. The visualization uses D3 v7 with `d3.stack`, `d3.scaleBand`, `d3.scaleLinear`, and `d3.scaleOrdinal`, rendered as SVG with hover tooltips.

ZZeroKurosakii
83% match
Loading thumbnail…

Stacked Bar Chart for Universities

This stacked bar chart compares universities by their overall and category-specific scores from a Times Higher Education dataset. The visualization uses d3.scale.ordinal for the y-axis, d3.svg.axis for axes, and d3.legend.color to display a categorical color legend. A dropdown menu lets users re-sort the bars by score type and order, with d3-tip providing hover tooltips showing the university name and total score. The SVG renders through D3 v5 with animated transitions.

Yyuting89830@gmail.com
83% match
Loading thumbnail…

Fork of bar_test

A grouped bar chart displays university ranking data, with each institution’s score broken into five stacked components (teaching, research, citations, industry income, and international outlook). Users can reorder the bars by selecting a different score metric or sorting order from dropdown menus, built with a custom `dropdownMenu` module. The visualization uses D3 v4’s `scaleBand`, `scaleLinear`, `stack`, and `axisBottom`, rendering SVG rectangles with mouseover tooltips showing school names and component scores. Data comes from a CSV file containing Times Higher Education rankings.

Ddaniel
82% match