The avatar for @fhooe-infovis
FHOÖ Information Visualization
Public
IM_InfoVis_2024
Edited
Jun 3, 2024
Fork of Road Safety Data Documentation | Serban, Ye, Ziperzik
1
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
L = require('leaflet@1.7.1')
Insert cell
d3 = require("d3@7", "d3-hexbin@0.2", "d3-sankey@0.12")
Insert cell
Sortable = require('sortablejs')
Insert cell
html`<link href='${resolve('leaflet@1.2.0/dist/leaflet.css')}' rel='stylesheet' />`
Insert cell
heatLayer = L, require('leaflet.heat').catch(() => L.heatLayer)
Insert cell
//createFieldsetWithCheckboxesAndLabel("urban_or_rural_area", heatMapID).outerHTML; //<-example how name and id of html looks like after generating
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
columnLabelPosition = (columnIndex, nodes) => {
let nodesAtDepth = nodes.filter(n => n.depth === columnIndex);
let x0 = d3.min(nodesAtDepth, n => n.x0);
let x1 = d3.min(nodesAtDepth, n => n.x1);
return (x0 + x1) / 2;
}
Insert cell
mutable finalSequence = ["urban_or_rural_area", "weather_conditions"];
Insert cell
function addColumn(tableData, newColumnName, newColumnFunction) {
return tableData.map(row => {
let returnObject = row;
returnObject[newColumnName] = newColumnFunction(row)
return returnObject
})
}
Insert cell
allData = {
let dateColumn = _.cloneDeep(data);
dateColumn= addColumn(dateColumn, "year", row => row['date'].getFullYear());
dateColumn = addColumn(dateColumn, "month", row => row['date'].toLocaleString('default', { month: 'long' }));
dateColumn = addColumn(dateColumn, "day", row => row['date'].getDate());
dateColumn = addColumn(dateColumn, "hour", row => row['time'].getUTCHours());
return dateColumn;
}
Insert cell
mutable dataToUse = allData;
Insert cell
Insert cell
function addVehicleComposition(accident) {
let composition = []
for(let type of vehicleTypes) {
if(accident[type] !== 0) {
composition.push(type)
}
}
return composition;
}
Insert cell
Insert cell
Insert cell
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