Tab.1(3)- Items of general project funding in 2018 (by nature of institutions)

100%

Tab.1(3)- Items of general project funding in 2018 (by nature of institutions)

✓ Published0🌍 Public

Last edited Apr 29, 2020

Created on Apr 29, 2020

Forked from Tab.1(3)- Items of general project funding in 2018 (by nature of institutions)

This interactive stacked bar chart visualizes 2018 general project funding items by institution nature, using D3.js (v3) with SVG rendering and animation. It forks Curran Kelleher’s stacked bar example, employing `d3.layout.stack`, ordinal and linear scales, and `d3.legend.color` for the categorical color legend. Hovering over legend entries highlights corresponding layers via a foreground bar layer and a semi-transparent overlay, while `d3-tip` displays tooltips with funding amounts. The y-axis uses a custom SI formatter replacing “G” with “B” for billions.

AI-generated description

This visualization was originally forked from one of Curran Kelleher's stacked bar chart examples .

MIT Licensed

Similar vizzes

Loading thumbnail…

Tab.1(3)- Items of general project funding in 2018 (by nature of institutions)

This interactive stacked bar chart displays 2018 general project funding items categorized by institution type, with departments on the x-axis and item counts on the y-axis. Built with Vue and D3.js, it uses `d3.layout.stack` for bar layering and `d3.scale.ordinal` for positioning. Hovering over legend entries filters bars via a toggle mechanism, while `d3-tip` provides tooltips showing exact values per category and department. Animated SVG transitions and a color legend from `d3-legend` enhance exploration of the dataset.

Pprincit

96% match

Loading thumbnail…

Tab.1(3)- Items of general project funding in 2018 (by nature of institutions)

This interactive stacked bar chart displays 2018 general project funding items categorized by institution nature, using D3.js to render SVG with animation. The visualization uses d3.layout.stack to stack segments by color, with hover tooltips via d3-tip showing segment counts. A color legend with d3-legend allows highlighting specific categories by fading other bars through semi-transparent overlays. Data comes from an embedded CSV file, processed through d3.nest to group by segment layers.

Pprincit

96% match

Loading thumbnail…

Tab.1(3)- Items of general project funding in 2018 (by nature of institutions)

This interactive stacked bar chart visualizes general project funding items for 2018, segmented by the nature of institutions and broken down by sub-category. It uses D3.js (version 3.5.5) with the `d3.layout.stack` API to create the stacked layers, `d3.svg.axis` for axes, and `d3.legend.color` for the interactive legend. Hovering over the legend highlights a specific segment while fading the others, and a tooltip from `d3-tip` displays the exact sales value for each item. The chart is rendered as an SVG with a smooth animation.

Pprincit

94% match

Loading thumbnail…

Tab.1(3)-Amount of general project funding in 2018 (by nature of institutions)

This stacked bar chart displays the amount of general project funding in 2018, broken down by nature of institution. The visualization uses a horizontal stacked bar layout, with each bar representing a department and color-coded segments for each category. Built with Vue and D3.js, it employs `d3.layout.stack` and `d3.scale.ordinal` to manage the stacked bars and axes. Interactive hover effects, powered by `d3-tip`, display detailed tooltips with revenue figures. A color legend allows users to filter and highlight specific categories by fading out non-selected bars.

Pprincit

94% match

Loading thumbnail…

Tab.1(3)- Items of general project funding in 2018 (by nature of institutions)

This visualization displays stacked bar chart data of general project funding items in 2018, broken down by institutional nature. It uses D3.js APIs including `d3.layout.stack`, `d3.scale.ordinal`, and `d3.svg.axis`. The chart colors segments by category, with an interactive legend that filters foreground bars on hover. Tooltips appear via `d3-tip`, showing item counts per segment and sub-category. Data comes from a CSV file with sales figures, rendered as animated SVG.

Pprincit

93% match

Loading thumbnail…

Tab.1(3)- Items of general project funding in 2018 (by nature of institutions)

This interactive stacked bar chart visualizes 2018 general project funding items by institution nature, breaking down sales data across sub-categories and customer segments. Built with D3.js, it uses `d3.nest()`, `d3.layout.stack()`, and ordinal/linear scales to render grouped layers. Hovering over the color legend highlights specific segments, while `d3-tip` displays detailed tooltips with item counts. The SVG animation supports fade effects between base and foreground bar layers for comparative analysis.

Pprincit

93% match

Loading thumbnail…

Tab.1(3)- Items of general project funding in 2018 (by nature of institutions)

This interactive stacked bar chart visualizes 2018 general project funding items categorized by academic discipline and institution type (schools, research institutes, and others). It uses D3.js v3 with `d3.layout.stack` for layering, ordinal and linear scales, and a color legend with hover interactions that dim non-selected bars. The `d3-tip` library provides tooltips showing exact counts, while the SVG rendering includes custom tick formatting. Data comes from a CSV file with department, category, and item count columns.

Cczy68

93% match

Loading thumbnail…

Tab.1(3)- Items of general project funding in 2018 (by nature of institutions)

This stacked bar chart visualizes 2018 general project funding items by scientific discipline, broken down by institution type (schools, research institutes, and others). It uses D3.js version 3.5.5 with stacked layout, ordinal and linear scales, and d3-tip for hover tooltips. A color legend highlights specific categories, dimming non-selected bars via an overlay rectangle. Data comes from an embedded CSV file, and the SVG renders with animated transitions for interactivity.

LLichenYang

92% match