height = 1000
width = 800
radius = 10
befolkningsdataRaw = FileAttachment("07459_20241226-131427.json").json()
befolkningsdata = JSONstat(befolkningsdataRaw)
d3.extent(genderMarkers, (d) => d.data.data["_partMenn"])
projectionHex = {
let convert = ([x, y]) => [
radius * (2 * (1 + x) + (y % 2)),
radius * Math.sqrt(3) * (1 + y)
];
convert.invert = ([px, py]) => {
// Solve for Y first (using pixelY = radius * sqrt(3) * (1 + Y))
const floatY = py / (radius * Math.sqrt(3)) - 1;
// Round to the nearest integer (assuming hex grid is integer-based)
const Y = Math.round(floatY);
// Solve for X (using pixelX = radius * (2*(1 + X) + (Y % 2)))
// => (px / radius) = 2 * (1 + X) + (Y % 2)
// => 2*(1 + X) = (px / radius) - (Y % 2)
// => X = ((px / radius) - (Y % 2)) / 2 - 1
const floatX = (px / radius - (Y % 2)) / 2 - 1;
const X = Math.round(floatX);
return [X, Y];
};
return convert;
}
import { JSONstat } from "@jsonstat/toolkit"
dataset = d3.json(
"https://public-andreassolberg.s3.eu-north-1.amazonaws.com/norway-municipalities-hexagon-markers.json"
)
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.
