The avatar for @js7006
JS
Public
Edited
Jun 10
4
Insert cell
Insert cell
Insert cell
xlsx = require("xlsx@latest")
Insert cell
Insert cell
Insert cell
Jobs@1.csv
Type Table, then Shift-Enter. Ctrl-space for more options.

Insert cell
Insert cell
Income.csv
Type Table, then Shift-Enter. Ctrl-space for more options.

Insert cell
Insert cell
People.csv
Type Table, then Shift-Enter. Ctrl-space for more options.

Insert cell
Insert cell
national_health_data_2024@3.csv
Type Table, then Shift-Enter. Ctrl-space for more options.

Insert cell
Insert cell
Insert cell
Insert cell
reduceDataArray = (dataArray) => {
return Object.values(
dataArray.reduce((acc, row) => {
let { FIPS, State, County, Attribute, Value } = row;

// If FIPS is not in accumulator, initialize it
if (!acc[FIPS]) {
acc[FIPS] = { FIPS, State, County };
}

// Add attribute as a column
acc[FIPS][Attribute] = Value;

return acc;
}, {})
);
}
Insert cell
Insert cell
cleanJobsArray = reduceDataArray(jobs)
Insert cell
cleanPeopleArray = reduceDataArray(people)
Insert cell
cleanIncomeArray = reduceDataArray(income)
Insert cell
Insert cell
Insert cell
health_data_new = health_data.map(({ cnty_fips, display_name, ...rest }) => ({
FIPS: cnty_fips,
State: display_name.match(/\((\w{2})\)/)?.[1] || "", // Extract state abbreviation
County: display_name.replace(/\"|\(.*?\)/g, "").trim(), // Remove quotes & state
...rest
}));
Insert cell
Insert cell
Insert cell
// Example data arrays (with unknown attributes)
mergeData = (data1, data2) => {
// Convert data2 into a lookup object
let data2Lookup = Object.fromEntries(data2.map((d) => [d.FIPS, d]));

// Merge all attributes dynamically
let mergedData = data1.map((d) => ({
...d, // Spread all attributes from data1
...(data2Lookup[d.FIPS] || {}) // Merge all attributes from data2 (if exists)
}));

return mergedData;
}
Insert cell
Insert cell
mergedData = mergeData(health_data_new, cleanJobsArray)
Insert cell
Insert cell
Insert cell
mergedData
Type Table, then Shift-Enter. Ctrl-space for more options.

Insert cell
Insert cell
Insert cell
mergedData
X
urban_rural_status
Y
percent_no_heath_insurance
Color
—
Size
—
Facet X
—
Facet Y
—
Mark
Auto
Type Chart, then Shift-Enter. Ctrl-space for more options.

Insert cell

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.
Learn more