container = html `<div style="height:600px"><div id="tooltip"></div></div>`
viewof timeslice = Range([0, 6], {step: 1, value: 0})
state = {
var state = { hoveredObject: null, geoJsonValue: `hr0${timeslice}` };
return state;
}
{
const geojsonLayer = new deck.GeoJsonLayer({
data,
opacity: 0.8,
stroked: false,
filled: true,
extruded: true,
wireframe: true,
fp64: true,
getElevation: f => f.properties[state.geoJsonValue],
getFillColor: f => colorScale(f.properties[state.geoJsonValue]),
getLineColor: f => [255, 255, 255],
pickable: true,
updateTriggers: {
getElevation: [state.geoJsonValue],
getFillColor: [state.geoJsonValue]
}
});
deckgl.setProps({layers: [geojsonLayer]});
return geojsonLayer;
}
import {Range} from "@observablehq/inputs"
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.
