The end-to-end solution for building and hosting better data apps, dashboards, and reports.
url = "https://api.eia.gov/series/?api_key=46a64e6fcd154bec1bb42252060d33ba&series_id=EBA.TEX-ALL.NG.COL.H;EBA.TEX-ALL.NG.NG.H;EBA.TEX-ALL.NG.NUC.H;EBA.TEX-ALL.NG.OTH.H;EBA.TEX-ALL.NG.SUN.H;EBA.TEX-ALL.NG.WAT.H;EBA.TEX-ALL.NG.WND.H&start=20210101T00Z&end=20210228T24Z"
// data = d3.json(url) // uncomment this line to fetch from the live API
data = FileAttachment("texasCrisis2021.json").json() // We cache the API response for futureproofing this article
.then((response) => {
return (
response.series
.flatMap((s) =>
s.data.map((d) => {
// each element of the data array is a date, value pair like: ["20210228T00Z", 4666]
let t = s.name.match(/Net generation from (.*) for/)[1];
// if (t == "hydro") t = "hydroelectric";
return {
id: s.series_id,
name: s.name,
type: t, // extracts type of energy for better labels
date: d3.utcParse("%Y%m%dT%HZ")(d[0]), // parse the date
value: d[1]
};
})
)
.sort((a, b) => +a.date - +b.date)
);
})
// match EIA color schemes
color = ({
domain: ['solar', 'wind', 'coal', 'natural gas', 'nuclear', 'hydro', 'other'],
range: ["#FEC704","#5C9631", "#664F06","#BD7229","#A1333F","#0395D6","#ADADAD"]
})
import {textcolor} from "@observablehq/text-color-annotations-in-markdown"
import {authorship, navigation, workshop} from "@observablehq/timeseries-assets"
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
