Skip to main content
SimilarExport ZIP
100%

US Energy Flow Data 2018

✓ Published0🌍 Public
CCurran Kelleher
Last edited Sep 25, 2020
Created on Sep 25, 2020

This example visualizes the flow of energy across the United States in 2018, tracing sources like petroleum, natural gas, and renewables through to end-use sectors such as residential, commercial, and transportation. It uses a Sankey diagram built with D3.js, where link widths represent energy quantities in quadrillion BTUs. The data comes from the Department of Energy, with nodes and links defined in CSV files and rendered using D3’s sankey plugin.

AI-generated description

Similar vizzes

Loading thumbnail…

Sankey Diagram

This interactive Sankey diagram visualizes the flow of energy through the UK energy system. Nodes representing sources, conversion processes, and consumption sectors are connected by links whose thickness is proportional to energy value in terawatt-hours. Built with the d3-sankey-diagram library, the visualization uses a static layout and hover interactions to highlight paths. The underlying data, provided in a JSON file, defines the network structure, and the code relies on standard D3.js modules for rendering the diagram.

Mmbostock
78% match
Loading thumbnail…

SANKEY Experiment

This example visualizes the flow of greenhouse gas emissions from sources like energy, industry, and land use to their final destinations, using a Sankey diagram. The data is loaded from a CSV file and processed to construct a graph of nodes and links, which is then rendered with D3 v3’s SVG. Node heights and link thicknesses encode the magnitude of emissions, and hover effects highlight the links. The chart is built with the reusable d3.sankey layout, with custom margins, colors, and formatting for the values.

BBenHeubl
71% match
Loading thumbnail…

Energie_UKPV

This visualization shows the flow of energy from generation to various consumption categories like XRM, Prodc, and CRB, with a separate stream for grid feed-in. Using the D3.js library and a custom `d3.sankey` module, the diagram renders nodes and links as SVG elements, with node heights and link widths proportional to energy values from the accompanying JSON data. The interactive layout allows node dragging, while hover states increase link opacity to highlight specific flows.

Uulkrueger
71% match
Loading thumbnail…

Sankey Particles

Animated Sankey diagram that visualizes the UK's 2012 energy balance—energy production, conversion, and consumption—as a flow of moving particles along curved paths. The interactive visualization combines a D3.js SVG layout of rectangular nodes and cubic Bézier links with an HTML5 Canvas overlay, where the flowing particles are drawn using Canvas arc methods. Particle frequency and size scale with each link’s energy value, while their color interpolates between the source and target node colors.

WWeiyiDeng
70% match
Loading thumbnail…

SANKEY Experiment

This Sankey diagram visualizes global CO2 emissions flows from energy sources like coal, oil, and gas to continents and then to specific countries, with link widths proportional to emission values in Mt CO2. The colored nodes group geographic regions and highlight country-level detail. After d3.sankey computes the initial layout, a custom manualLayout function overrides the y-position of selected nodes using a predefined array. The visualization uses D3 v3 with SVG rendering, reading data from an external emissions.json file, and implements drag-and-drop node interaction.

KKatiRG
70% match
Loading thumbnail…

D3 Scatter Plot

This scatter plot displays U.S. natural gas consumption by the electric power sector in billion BTU per year from 2000 to 2010. The code loads data from a CSV file and renders it as an SVG using D3 v7. It uses `d3.scaleLinear` for the x-axis, `d3.scalePoint` for the y-axis, and `d3.axisLeft` and `d3.axisBottom` for tick marks. Circles are appended to represent each data point, with axis labels and a title included.

Mmariahdiaz
69% match
Loading thumbnail…

D3 Bar Chart

This example visualizes natural gas consumption by the electric power sector across eleven U.S. states, using a horizontal bar chart where each bar’s length encodes the consumption value in billion BTU. The chart is built with D3.js (v7) and rendered as SVG, using `d3.csv` for data loading, `d3.scaleLinear` for the x-axis, `d3.scaleBand` for the y-axis, and `d3.axisLeft`/`d3.axisBottom` for tick marks. Each bar is labeled with its exact value, and the plot includes a title and axis labels. The data comes from the included `data.csv` file.

Mmariahdiaz
69% match
Loading thumbnail…

Sankey Particles

This example visualizes the UK energy system as an interactive Sankey diagram, where animated particles travel along the links to represent energy flow between sources and consumers. Nodes can be dragged to reposition, which updates the link paths and particle trajectories. The visualization combines D3.js for the SVG-based Sankey layout and drag behavior with a Canvas overlay for rendering the moving particles. Particle frequency scales with link value, and each particle’s color interpolates from the source node’s color to the target node’s color. The code uses the sankey.layout and sankey.relayout functions to compute node positions and a d3.timer to drive the animation.

BBBischof
69% match