US Federal Budget

100%

US Federal Budget

✓ Published0🌍 Public

Last edited Aug 3, 2018

Created on Aug 3, 2018

This visualization uses a force-directed bubble chart to depict the 2017 US Federal Budget, with each circle sized by agency spending and colored by Bureau of Economic Analysis (BEA) category. Two checkboxes let users toggle grouping by BEA category or grant type, which repositions the bubbles along the x-axis via force simulation. Hovering reveals exact dollar amounts, and the circles are also labeled with agency names. The chart is built with D3 v4 using SVG, based on data from a CSV of federal outlays, and is licensed under MIT.

AI-generated description

Built with blockbuilder.org

forked from <a href='http://bl.ocks.org/john-guerra/'>john-guerra</a>'s block: <a href='http://bl.ocks.org/john-guerra/54ac510dbb3196f04bdd7db3bdcb5164'>2017 US Federal Budget</a>

forked from <a href='http://bl.ocks.org/john-guerra/'>john-guerra</a>'s block: <a href='http://bl.ocks.org/john-guerra/f7792b084e6a83796b39086f69d340f8'>2017 US Federal Budget Template</a>

mit Licensed

Similar vizzes

Loading thumbnail…

US Federal Budget

This visualization uses a force-directed bubble chart to depict the 2017 US Federal Budget, with each circle sized by budget amount and colored by BEA Category. Two checkboxes let users group the bubbles by BEA Category or by Grant, shifting the force layout's x-positioning to align circles with their respective categories. Built with D3 v4 and rendered in SVG, the chart encodes budget magnitude through circle area using a power scale, and hovering reveals exact dollar amounts via tooltips. The interactive layout allows users to explore how spending is distributed across agencies and categories.

3300ani

98% match

Loading thumbnail…

US Federal Budget

This interactive visualization uses a force-directed bubble chart to display the 2017 US federal budget, with each circle sized by spending amount and colored by BEA category. Users can toggle grouping by BEA category or grant type, which rearranges the bubbles along the x- and y-axes, respectively, using d3-force simulations. The chart is built with D3 v4 and SVG, and includes tooltips showing agency names and budget values. Data is loaded from a CSV and preprocessed to filter out zero-budget entries and aggregate by agency, BEA category, and grant/non-grant split.

3300ani

98% match

Loading thumbnail…

US Federal Budget

This visualization uses a force-directed bubble chart to display the 2017 US Federal Budget, with each circle representing a government agency. Circle area encodes the agency’s budget amount, and color encodes its BEA (Bureau of Economic Analysis) category. Users can check boxes to group agencies by BEA Category or by Grant/Non-grant split, triggering the circles to rearrange via d3-force. The chart is built with D3 v4 and SVG, using a power scale for area, an ordinal color scale, and a force simulation with collide and x-position forces. Hovering over a circle reveals a tooltip with the agency name and budget in millions of dollars.</noah>

3300ani

96% match

Loading thumbnail…

US Federal Budget Balance, 1968-2017

This interactive dashboard visualizes the US federal budget balance from 1968 to 2017, combining a multi-series bar chart, an animated Sankey diagram, and line charts to show revenue sources, spending categories, and yearly deficits. A slider scrubs through time, updating a diverging stacked bar chart for balance, while the Sankey diagram uses D3.js (version 4.11) with custom `d3.sankey` layout functions to link tax sources to spending categories. The code also uses `d3.scaleBand`, `d3.stackOffsetDiverging`, and `d3.sliderHorizontal` from the d3-simple-slider library, with data loaded from CSV files.

MMasonChinkin

79% match

Loading thumbnail…

2020 Q1 US Spending

This chart shows the distribution of US federal spending for the first quarter of 2020, displaying each agency’s percentage of total expenditures as an animated pie chart. Built with D3 v4 (SVG), the visualization uses a pie generator and arc generator, with labels positioned via an arc centroid. Data loads from a CSV file, and a path transition with `transition.attrTween` and `d3.interpolate` animates the arcs expanding outward over two seconds. A sequential blue color scale assigns distinct hues to each category.

Nnumberan

77% match

Loading thumbnail…

US Federal Budget Balance, 1968-2017

This interactive Sankey diagram visualizes the US federal budget balance from 1968 to 2017, showing how revenue sources (corporate tax, customs duties) and spending categories (defense, discretionary) change annually. A draggable slider (d3-simple-slider) lets viewers select a year, triggering a 2-second transition (d3.transition) that repositions nodes and links via sankey.relayout. The visualization is rendered as SVG using d3.csv to load yearly datasets, with node sizes scaled via d3.scaleLinear and data-driven transitions updating rect heights, link paths, and font sizes.

MMasonChinkin

77% match

Loading thumbnail…

US Federal Budget Balance, 1968-2017

An interactive stacked bar chart shows contributions to US GDP growth from 1950 to 2017, broken down into categories like personal consumption, investment, net trade, and government spending. The visualization uses D3.js version 4.11 with an animated drill-down feature: clicking a bar segment expands that category into its sub-components, such as goods versus services or exports versus imports. A back button returns to the overview. The y-axis represents percentage points, and hovering displays tooltips with exact values. The chart is rendered as an SVG using `d3.scaleBand`, `d3.scaleLinear`, `d3.stack`, and `d3.axis` functions.

MMasonChinkin

76% match

Loading thumbnail…

spending_graph

This visualization shows French Government Spending by Department, using a bar chart to compare spending allocations across Education, Military, Health, Transportation, and Others. The bars are rendered in SVG using D3 v6, with `d3.scaleBand` and `d3.scaleLinear` mapping categorical and numerical values, while `d3.axisBottom` and `d3.axisLeft` display the axes. Hovering over a bar changes its fill color from steelblue to orange. The chart includes rotated department labels and explicit axis titles, with data provided as static in-code arrays.

Ttimothy.bell@cgi.com

72% match