Published
Edited
Mar 24, 2021
Importers
4 stars
Table(tableData)
tableData = getTableData(data[0])
getTableData = (data, start = 1) => {
const d = tableToJson(data, start);
const t = d.slice(1);
const columns = d[0];
return t.map(d =>
columns.reduce((acc, e, i) => {
acc[e] = d[i];
return acc;
}, {})
);
}
function tableToJson(table,start=1) {
//Code from : https://stackoverflow.com/questions/9927126/how-to-convert-the-following-table-to-json-with-javascript
var data = [];
for (var i = start; i < table.rows.length; i++) {
var tableRow = table.rows[i];
var rowData = [];
for (var j = 0; j < tableRow.cells.length; j++) {
rowData.push(tableRow.cells[j].innerHTML);
}
data.push(rowData);
}
return data;
}
data = scrapeTableData("https://www.cdc.gov/asthma/mmsa/table_2017.html")
async function scrapeTableData(url) {
const response = await soFetch(url);
const text = await response.text();
//const domparser = new DOMParser();
//const dom = domparser.parseFromString(text, "text/html");
const dom = html`${text}`;
const tables = await dom.querySelectorAll('table');
if (tables.length <= 0) {
throw new Error('Could not find any tables.');
}
const tablesLen = tables.length;
const tablesData = [];
for (let i = 0; i < tablesLen; i++) {
let tableEl = tables[i];
tablesData.push(tableEl);
}
return tablesData;
}
Table(getTableData(scrapedPandemicData[0], 0))
scrapedPandemicData = scrapeTableData(
"https://www.visualcapitalist.com/history-of-pandemics-deadliest/"
)
md`### External Libraries and Imports`
import {Table} from "@observablehq/table"
import { soFetch } from '@alecglassford/so-fetch'
d3 = require("d3@6")
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.
