measurements_export.json
Type Table, then Shift-Enter. Ctrl-space for more options.
/**
* Fetches OpenStreetMap ways for a specified node.
* @async
* @param {string | number} nodeId
*/
async function fetchOsmWaysForNode(nodeId) {
const osmApiResult = await fetch(
`https://api.openstreetmap.org/api/0.6/node/${nodeId}/ways`
)
.then((response) => response.text())
.then((str) => new window.DOMParser().parseFromString(str, "text/xml"));
const ways = [];
for (let way of osmApiResult.getElementsByTagName("way")) {
const tags = {};
const tagNodes = way.getElementsByTagName("tag");
for (let tagNode of tagNodes) {
tags[tagNode.getAttribute("k")] = tagNode.getAttribute("v");
}
ways.push({
id: way.getAttribute("id"),
timestamp: way.getAttribute("timestamp"),
tags: tags
});
}
return ways;
}
exampleWays = fetchOsmWaysForNode(11079698224)
function totalLanes(ways) {
const lanes = ways
.map((way) => way.tags.lanes)
.filter((d) => d !== undefined)
.map((n) => Number(n))
.reduce((a, b) => a + b, 0);
if (lanes === 0) {
return undefined;
}
return lanes;
}
exampleTotalLanes = totalLanes(exampleWays)
tidyData = Promise.all(
table.map(async (d) => {
const ways = await fetchOsmWaysForNode(d.osm_node_id);
const neighbouring_lanes = totalLanes(ways);
return [
// the order in which these are created dictates
{
...d,
signal: "solid red",
duration: d[RED_COLUMN_NAME],
ways,
neighbouring_lanes
},
{
...d,
signal: "green",
duration: d[GREEN_COLUMN_NAME],
ways,
neighbouring_lanes
},
{
...d,
signal: "flashing red",
duration: d[FLASHING_RED_COLUMN_NAME],
ways,
neighbouring_lanes
}
];
})
).then((d) => d.flat())
SIGNAL_SCHEME = ({
domain: ["solid red", "green", "flashing red"],
range: ["rgb(218,55,50)", "rgb(80,174,87)", "rgb(238,85,80)"],
type: "categorical"
})
TIP_CHANNELS = ({
Location: LOCATION_COLUMN_NAME,
Timestamp: TIMESTAMP_COLUMN_NAME,
"Solid red duration": RED_COLUMN_NAME,
"Green duration": GREEN_COLUMN_NAME,
"Red flashing duration": FLASHING_RED_COLUMN_NAME,
"Cycle duration": "cycle_duration"
})
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.
