@mstone6969/graph 0.0.0-stage → 0.1.0

package/dist/charts/threeglobe/RingGlobe.js

@@ -0,0 +1,106 @@
+import { ChartFamily, DataShape, Dimension } from "../../core/enums.js";
+import { SampleData } from "../../data/SampleData.js";
+import { GlobeLand, GlobeRingForm, GlobeSizing, GlobeSurface } from "./GlobeEnums.js";
+import { magnitude } from "./GlobeMath.js";
+import { MeshBuffer } from "./MeshBuffer.js";
+import { SiteGlobeChart } from "./SiteGlobeChart.js";
+import { SphereSurface } from "./SphereSurface.js";
+import { CylinderGeometry, Vector3 } from "three";
+// src/charts/threeglobe/RingGlobe.ts
+var REACH = 13;
+var up = new Vector3(0, 1, 0);
+/** Rings around places: ripples for events, true geodesic discs for reach, or an orbit that bins the world by longitude. */
+var RingGlobe = class extends SiteGlobeChart {
+	static meta = {
+		id: "ring-globe",
+		name: "Ring globe",
+		family: ChartFamily.Geospatial,
+		dimension: Dimension.Three,
+		shape: DataShape.Geo,
+		description: "Marks places with geodesic rings whose radius shows reach, or plots longitude profiles on an orbit.",
+		tags: [
+			"ripple",
+			"pulse",
+			"range rings",
+			"orbit",
+			"buffer"
+		],
+		sample: (seed) => SampleData.cities(seed),
+		variants: {
+			form: Object.values(GlobeRingForm),
+			rings: [
+				3,
+				1,
+				5
+			],
+			sizing: [GlobeSizing.Area, GlobeSizing.Fixed],
+			surface: Object.values(GlobeSurface)
+		},
+		valid: (v) => {
+			if (v.form === GlobeRingForm.Orbit) return v.surface === GlobeSurface.Sphere && v.rings === 3 && v.sizing === GlobeSizing.Area;
+			return v.form === GlobeRingForm.Ripple || v.rings === 1 || v.form === GlobeRingForm.Annulus && v.rings === 3;
+		}
+	};
+	defaults() {
+		return {
+			...super.defaults(),
+			form: GlobeRingForm.Ripple,
+			rings: 3,
+			sizing: GlobeSizing.Area,
+			land: GlobeLand.Solid
+		};
+	}
+	draw(ctx) {
+		const { sites } = this, { form, rings, sizing } = this.options;
+		const size = magnitude(sites.map((site) => site.value)), color = (site) => this.tone(ctx, site, size(site.value));
+		const reach = (site) => sizing === GlobeSizing.Area ? 2.2 + REACH * Math.sqrt(size(site.value)) : 7;
+		if (form === GlobeRingForm.Orbit) return this.orbit(ctx, sites, size, color);
+		const buffer = new MeshBuffer(), tip = (site) => this.siteTip(site, color(site));
+		sites.forEach((site, owner) => {
+			const tone = ctx.color(color(site));
+			if (form === GlobeRingForm.Ripple) for (let k = 1; k <= rings; k++) buffer.tube(this.body.circle(site.lon, site.lat, reach(site) * k / rings, 48, .007), () => .0044 * (1.2 - .7 * (k - 1) / rings), tone, owner, 5);
+			else {
+				const [inner, outer] = form === GlobeRingForm.Cap ? [.12, 1] : [.58, 1];
+				for (let k = 0; k < rings; k++) {
+					const edge = (radius) => this.body.circle(site.lon, site.lat, Math.max(.3, radius), 48, .008 + k * .001);
+					const [a, b] = [edge(reach(site) * (inner + k) / rings), edge(reach(site) * (outer + k) / rings)];
+					this.band(buffer, a, b, tone, owner);
+				}
+			}
+		});
+		const mesh = buffer.build(ctx, { roughness: .55 });
+		ctx.root.add(mesh);
+		ctx.pick(mesh, (i) => tip(sites[i]));
+		if (form === GlobeRingForm.Ripple) {
+			const material = mesh.material;
+			material.transparent = true;
+			ctx.onFrame((seconds) => {
+				material.opacity = .62 + .38 * Math.cos(seconds * 2.4);
+			});
+		}
+		this.leaders(ctx, sites, 4, () => .05);
+	}
+	/** Flat band between two equal-length loops. */
+	band(buffer, inner, outer, color, owner) {
+		const normal = new Vector3();
+		const ids = inner.map((point, i) => [buffer.vertex(point, this.body.normal(point, normal), color), buffer.vertex(outer[i], this.body.normal(outer[i], normal), color)]);
+		for (let i = 0; i + 1 < ids.length; i++) {
+			buffer.face(ids[i][0], ids[i][1], ids[i + 1][0], owner);
+			buffer.face(ids[i][1], ids[i + 1][1], ids[i + 1][0], owner);
+		}
+	}
+	/** Bars standing outward from an equatorial hoop, each at its site's longitude. */
+	orbit(ctx, sites, size, color) {
+		const hoop = SphereSurface.radius + .1, buffer = new MeshBuffer(), line = ctx.color(this.theme.axis);
+		buffer.tube(Array.from({ length: 121 }, (_, i) => new Vector3(hoop * Math.sin(i / 120 * Math.PI * 2), 0, hoop * Math.cos(i / 120 * Math.PI * 2))), () => .003, line, 0);
+		ctx.root.add(buffer.build(ctx));
+		const angle = (site) => site.lon * Math.PI / 180;
+		this.stamp(ctx, new CylinderGeometry(.014, .014, 1, 10).translate(0, .5, 0), sites, (site, _, node, p) => {
+			const out = new Vector3(Math.sin(angle(site)), 0, Math.cos(angle(site)));
+			node.position.copy(out).multiplyScalar(hoop);
+			node.quaternion.setFromUnitVectors(up, out);
+			node.scale.set(1, Math.max(size(site.value) * .17 * p, .001), 1);
+		}, color, (site) => this.siteTip(site, color(site)), { grow: true });
+	}
+};
+export { RingGlobe };

package/dist/charts/threeglobe/SiteGlobeChart.js

@@ -0,0 +1,53 @@
+import { GlobeChart } from "./GlobeChart.js";
+import { finite } from "./GlobeMath.js";
+import { geoDistance } from "d3";
+// src/charts/threeglobe/SiteGlobeChart.ts
+/** Base for charts of located rows. Rows without coordinates are skipped. */
+var SiteGlobeChart = class extends GlobeChart {
+	defaults() {
+		return {
+			...super.defaults(),
+			lon: "lon",
+			lat: "lat",
+			value: "value",
+			label: "name"
+		};
+	}
+	get sites() {
+		const { data, lon, lat, value, label, group } = this.options;
+		return (data ?? []).flatMap((row) => {
+			const [x, y] = [finite(row[lon], NaN), finite(row[lat], NaN)];
+			if (!Number.isFinite(x) || !Number.isFinite(y)) return [];
+			return [{
+				row,
+				lon: x,
+				lat: Math.max(-90, Math.min(90, y)),
+				value: finite(row[value]),
+				name: String(row[label] ?? ""),
+				group: group && row[group] != null ? String(row[group]) : void 0
+			}];
+		});
+	}
+	tone(ctx, site, t) {
+		if (site.group !== void 0) return ctx.palette.color(site.group);
+		return site.value < 0 ? ctx.palette.diverging(-t) : this.heat(ctx, t);
+	}
+	siteTip(site, color) {
+		return {
+			title: site.name,
+			rows: [[this.options.value, site.value], ...site.group ? [["Group", site.group]] : []],
+			color
+		};
+	}
+	/** Names the largest sites, skipping any within `spacing` degrees of a stronger one. */
+	leaders(ctx, sites, count, lift, spacing = 24) {
+		const taken = [];
+		for (const site of [...sites].sort((a, b) => Math.abs(b.value) - Math.abs(a.value))) {
+			if (taken.length === count) break;
+			if (!site.name || taken.some((other) => geoDistance([site.lon, site.lat], [other.lon, other.lat]) * 57.3 < spacing)) continue;
+			taken.push(site);
+			this.callout(ctx, site.name, this.body.place(site.lon, site.lat, lift(site)));
+		}
+	}
+};
+export { SiteGlobeChart };

package/dist/charts/threeglobe/SphereGrid.js

@@ -0,0 +1,90 @@
+import { GlobeCell, GlobeResolution } from "./GlobeEnums.js";
+import { IcosahedronGeometry, Vector3 } from "three";
+// src/charts/threeglobe/SphereGrid.ts
+var DETAIL = {
+	[GlobeCell.Hexagon]: {
+		[GlobeResolution.Coarse]: 9,
+		[GlobeResolution.Medium]: 15,
+		[GlobeResolution.Fine]: 22
+	},
+	[GlobeCell.Triangle]: {
+		[GlobeResolution.Coarse]: 6,
+		[GlobeResolution.Medium]: 10,
+		[GlobeResolution.Fine]: 15
+	},
+	[GlobeCell.Quad]: {
+		[GlobeResolution.Coarse]: 36,
+		[GlobeResolution.Medium]: 54,
+		[GlobeResolution.Fine]: 80
+	}
+};
+var cache = /* @__PURE__ */ new Map();
+/** Near-equal-area cells over the sphere: Goldberg hexagons, icosahedron triangles, or latitude bands of quads. */
+var SphereGrid = class SphereGrid {
+	static cells(kind, resolution) {
+		const key = `${kind}:${resolution}`;
+		let cells = cache.get(key);
+		if (!cells) cache.set(key, cells = SphereGrid.make(kind, DETAIL[kind][resolution]));
+		return cells;
+	}
+	static make(kind, detail) {
+		if (kind === GlobeCell.Quad) return SphereGrid.quads(detail);
+		const position = new IcosahedronGeometry(1, detail).getAttribute("position");
+		const faces = [];
+		for (let i = 0; i < position.count; i += 3) faces.push([
+			0,
+			1,
+			2
+		].map((k) => new Vector3().fromBufferAttribute(position, i + k)));
+		return kind === GlobeCell.Triangle ? faces.map((corners) => ({
+			center: new Vector3().add(corners[0]).add(corners[1]).add(corners[2]).normalize(),
+			corners
+		})) : SphereGrid.dual(faces);
+	}
+	/** Each icosphere vertex becomes a hexagon (twelve become pentagons) whose corners are the surrounding face centres. */
+	static dual(faces) {
+		const around = /* @__PURE__ */ new Map();
+		for (const face of faces) {
+			const middle = new Vector3().add(face[0]).add(face[1]).add(face[2]).normalize();
+			for (const vertex of face) {
+				const key = `${vertex.x.toFixed(4)},${vertex.y.toFixed(4)},${vertex.z.toFixed(4)}`;
+				const entry = around.get(key) ?? {
+					center: vertex.clone().normalize(),
+					corners: []
+				};
+				entry.corners.push(middle);
+				around.set(key, entry);
+			}
+		}
+		return [...around.values()].map(({ center, corners }) => {
+			const east = new Vector3(0, 1, 0).cross(center).normalize(), north = center.clone().cross(east);
+			if (east.lengthSq() < .5) east.set(1, 0, 0), north.crossVectors(center, east);
+			const angle = (corner) => Math.atan2(corner.dot(north), corner.dot(east));
+			return {
+				center,
+				corners: [...corners].sort((a, b) => angle(a) - angle(b))
+			};
+		});
+	}
+	static quads(bands) {
+		const cells = [], point = (lon, lat) => new Vector3(Math.cos(lat) * Math.sin(lon), Math.sin(lat), Math.cos(lat) * Math.cos(lon));
+		for (let band = 0; band < bands / 2; band++) {
+			const [south, north] = [(band / (bands / 2) - .5) * Math.PI, ((band + 1) / (bands / 2) - .5) * Math.PI];
+			const count = Math.max(4, Math.round(bands * Math.cos((south + north) / 2))), step = Math.PI * 2 / count;
+			for (let i = 0; i < count; i++) {
+				const lon = -Math.PI + i * step;
+				cells.push({
+					center: point(lon + step / 2, (south + north) / 2),
+					corners: [
+						point(lon, south),
+						point(lon + step, south),
+						point(lon + step, north),
+						point(lon, north)
+					]
+				});
+			}
+		}
+		return cells;
+	}
+};
+export { SphereGrid };

package/dist/charts/threeglobe/SphereSurface.js

@@ -0,0 +1,40 @@
+import { GeoSurface } from "./GeoSurface.js";
+import { regionLines, regionPolygons, unwrapped } from "./GeoRings.js";
+import { geoDistance, geoInterpolate } from "d3";
+import { Vector3 } from "three";
+// src/charts/threeglobe/SphereSurface.ts
+var rad = Math.PI / 180;
+/** The round earth, centred on the origin. Longitude 0 faces +z. */
+var SphereSurface = class SphereSurface extends GeoSurface {
+	static radius = .74;
+	key = "sphere";
+	maxEdge = 7;
+	place(lon, lat, lift = 0, out = new Vector3()) {
+		const r = SphereSurface.radius + lift, c = Math.cos(lat * rad);
+		return out.set(r * c * Math.sin(lon * rad), r * Math.sin(lat * rad), r * c * Math.cos(lon * rad));
+	}
+	patchPoint(u, v, lift, out) {
+		return this.place(u, v, lift, out);
+	}
+	normal(point, out = new Vector3()) {
+		return out.copy(point).normalize();
+	}
+	trace(a, b, steps, lift) {
+		const start = geoDistance(a, b) > 3.13 ? [a[0] + .6, a[1] + .6] : a;
+		const at = geoInterpolate(start, b);
+		return Array.from({ length: steps + 1 }, (_, i) => {
+			const t = i / steps, [lon, lat] = at(t);
+			return this.place(lon, lat, lift(t));
+		});
+	}
+	polygons(geometry) {
+		return unwrapped(regionPolygons(geometry));
+	}
+	lines(geometry) {
+		return regionLines(geometry);
+	}
+	faces(point, camera) {
+		return point.dot(camera) > SphereSurface.radius ** 2;
+	}
+};
+export { SphereSurface };

package/dist/charts/threeglobe/SpikeGlobeChart.js

@@ -0,0 +1,80 @@
+import { ChartFamily, DataShape, Dimension, ScaleKind } from "../../core/enums.js";
+import { GlobeSpike, GlobeSurface } from "./GlobeEnums.js";
+import { magnitude } from "./GlobeMath.js";
+import { GlobeSamples } from "./GlobeSamples.js";
+import { SiteGlobeChart } from "./SiteGlobeChart.js";
+import { BoxGeometry, CircleGeometry, ConeGeometry, CylinderGeometry, SphereGeometry, Vector3 } from "three";
+// src/charts/threeglobe/SpikeGlobeChart.ts
+var TALL = .27;
+var up = new Vector3(0, 1, 0);
+var SHAPES = {
+	[GlobeSpike.Needle]: () => new CylinderGeometry(.0065, .0065, 1, 8),
+	[GlobeSpike.Cone]: () => new ConeGeometry(.02, 1, 14),
+	[GlobeSpike.Pyramid]: () => new ConeGeometry(.024, 1, 4),
+	[GlobeSpike.Blade]: () => new BoxGeometry(.03, 1, .006),
+	[GlobeSpike.Lollipop]: () => new CylinderGeometry(.004, .004, 1, 6)
+};
+/** Height from the surface at each place: for a value tied to points, read by height against neighbours. */
+var SpikeGlobeChart = class extends SiteGlobeChart {
+	static meta = {
+		id: "spike-globe",
+		name: "Spike globe",
+		family: ChartFamily.Geospatial,
+		dimension: Dimension.Three,
+		shape: DataShape.Geo,
+		description: "Raises a spike at each location, with height showing the value on a chosen scale.",
+		tags: [
+			"spike map",
+			"bars on a globe",
+			"columns"
+		],
+		sample: (seed) => GlobeSamples.scatter(seed, 110),
+		variants: {
+			spike: Object.values(GlobeSpike),
+			scale: [
+				ScaleKind.Linear,
+				ScaleKind.Sqrt,
+				ScaleKind.Log
+			],
+			footing: [false, true],
+			surface: Object.values(GlobeSurface)
+		}
+	};
+	defaults() {
+		return {
+			...super.defaults(),
+			spike: GlobeSpike.Cone,
+			scale: ScaleKind.Linear,
+			footing: false
+		};
+	}
+	draw(ctx) {
+		const { sites } = this, { spike, scale, footing } = this.options;
+		const size = magnitude(sites.map((site) => site.value), scale), area = magnitude(sites.map((site) => site.value));
+		const color = (site) => this.tone(ctx, site, size(site.value));
+		const tall = (site) => Math.max(.004, size(site.value) * TALL);
+		const pose = (site, _, node, p) => {
+			const foot = this.body.place(site.lon, site.lat), normal = this.body.normal(foot), h = tall(site) * p;
+			node.position.copy(foot).addScaledVector(normal, h / 2);
+			node.quaternion.setFromUnitVectors(up, normal);
+			node.scale.set(1, Math.max(h, 1e-4), 1);
+		};
+		this.stamp(ctx, SHAPES[spike](), sites, pose, color, (site) => this.siteTip(site, color(site)), { grow: true });
+		if (spike === GlobeSpike.Lollipop) this.stamp(ctx, new SphereGeometry(.014, 12, 8), sites, (site, _, node, p) => {
+			const foot = this.body.place(site.lon, site.lat);
+			node.position.copy(foot).addScaledVector(this.body.normal(foot), tall(site) * p);
+			node.scale.setScalar(Math.max(p, .001));
+		}, color, void 0, { grow: true });
+		if (footing) this.stamp(ctx, new CircleGeometry(1, 24), sites, (site, _, node) => {
+			const at = this.body.place(site.lon, site.lat, .005);
+			node.position.copy(at);
+			this.faceOut(node, at);
+			node.scale.setScalar(Math.max(.008, .038 * Math.sqrt(area(site.value))));
+		}, (site) => color(site), void 0, {
+			shadow: false,
+			roughness: .9
+		});
+		this.leaders(ctx, sites, 4, (site) => tall(site) + .035);
+	}
+};
+export { SpikeGlobeChart };

package/dist/charts/threeglobe/StreamGlobe.js

@@ -0,0 +1,141 @@
+import { ChartFamily, DataShape, Dimension } from "../../core/enums.js";
+import { GlobeChart } from "./GlobeChart.js";
+import { GlobeLand, GlobeResolution, GlobeSeeding, GlobeStreamStroke, GlobeSurface } from "./GlobeEnums.js";
+import { GlobeSamples } from "./GlobeSamples.js";
+import { MeshBuffer } from "./MeshBuffer.js";
+import { randomLcg } from "d3";
+import { ConeGeometry, Vector3 } from "three";
+// src/charts/threeglobe/StreamGlobe.ts
+var COUNT = {
+	[GlobeResolution.Coarse]: 90,
+	[GlobeResolution.Medium]: 180,
+	[GlobeResolution.Fine]: 340
+};
+var up = new Vector3(0, 1, 0);
+/** Streamlines over the earth from a scalar potential: pressure becomes wind, with flow running along the contours. */
+var StreamGlobe = class extends GlobeChart {
+	static meta = {
+		id: "stream-globe",
+		name: "Stream globe",
+		family: ChartFamily.Flow,
+		dimension: Dimension.Three,
+		shape: DataShape.Grid,
+		description: "Integrates streamlines across a lon/lat grid, turning a potential field into wind-like flow around the earth.",
+		tags: [
+			"wind map",
+			"vector field",
+			"ocean currents",
+			"streamlines"
+		],
+		sample: (seed) => GlobeSamples.field(seed),
+		variants: {
+			seeding: Object.values(GlobeSeeding),
+			stroke: [
+				GlobeStreamStroke.Comet,
+				GlobeStreamStroke.Tube,
+				GlobeStreamStroke.Arrow
+			],
+			density: Object.values(GlobeResolution),
+			reach: [
+				24,
+				12,
+				40
+			],
+			surface: [GlobeSurface.Sphere, GlobeSurface.Plane]
+		}
+	};
+	defaults() {
+		return {
+			...super.defaults(),
+			seeding: GlobeSeeding.Lattice,
+			stroke: GlobeStreamStroke.Comet,
+			density: GlobeResolution.Medium,
+			reach: 24,
+			land: GlobeLand.Dotted
+		};
+	}
+	table() {
+		const { x, y, z } = this.options.data;
+		return {
+			columns: [
+				"lon",
+				"lat",
+				"value"
+			],
+			rows: y.flatMap((lat, j) => x.map((lon, i) => [
+				lon,
+				lat,
+				z[j]?.[i]
+			]))
+		};
+	}
+	/** Bilinear lookup with central-difference gradient, in value per degree. */
+	flow(lon, lat) {
+		const { x, y, z } = this.options.data;
+		const read = (a, b) => {
+			const fx = Math.max(0, Math.min(x.length - 1.001, (a - x[0]) / (x.at(-1) - x[0]) * (x.length - 1)));
+			const fy = Math.max(0, Math.min(y.length - 1.001, (b - y[0]) / (y.at(-1) - y[0]) * (y.length - 1)));
+			const [i, j] = [Math.floor(fx), Math.floor(fy)], [s, t] = [fx - i, fy - j];
+			return (z[j][i] * (1 - s) + z[j][i + 1] * s) * (1 - t) + (z[j + 1][i] * (1 - s) + z[j + 1][i + 1] * s) * t;
+		};
+		const stretch = Math.max(.15, Math.cos(lat * Math.PI / 180));
+		return {
+			u: -(read(lon, lat + 3) - read(lon, lat - 3)) / 6,
+			v: (read(lon + 3, lat) - read(lon - 3, lat)) / 6 / stretch
+		};
+	}
+	seeds() {
+		const { seeding, density } = this.options, count = COUNT[density], random = randomLcg(.37);
+		return Array.from({ length: count }, (_, i) => seeding === GlobeSeeding.Random ? [random() * 360 - 180, Math.asin(random() * 2 - 1) * 180 / Math.PI] : [i * 137.50776 % 360 - 180, Math.asin(2 * ((i + .5) / count) - 1) * 180 / Math.PI]);
+	}
+	trace(seed) {
+		const line = [seed], { reach } = this.options;
+		let [lon, lat] = seed, total = 0;
+		for (let i = 0; i < reach; i++) {
+			const a = this.flow(lon, lat), b = this.flow(lon + a.u * 40, lat + a.v * 40), norm = Math.hypot(b.u, b.v) || 1e-6;
+			total += norm;
+			const next = lon + b.u / norm * 1.6 / Math.max(.2, Math.cos(lat * Math.PI / 180));
+			lat = Math.max(-84, Math.min(84, lat + b.v / norm * 1.6));
+			lon = (next + 540) % 360 - 180;
+			line.push([lon, lat]);
+		}
+		return {
+			line,
+			speed: total / reach
+		};
+	}
+	draw(ctx) {
+		const { stroke } = this.options;
+		const { x, y, z } = this.options.data ?? {};
+		if (!z?.length || !x || !y || x.length < 2 || y.length < 2 || z.length < y.length) return;
+		const traces = this.seeds().map((seed) => this.trace(seed)), top = Math.max(...traces.map((trace) => trace.speed)) || 1;
+		const buffer = new MeshBuffer(), heads = [];
+		traces.forEach(({ line, speed }, owner) => {
+			const t = .3 + .7 * speed / top, tone = ctx.color(this.heat(ctx, t));
+			const points = line.map(([lon, lat]) => this.body.place(lon, lat, .012));
+			const runs = [[points[0]]];
+			for (let i = 1; i < points.length; i++) {
+				if (points[i].distanceTo(points[i - 1]) > .3) runs.push([]);
+				runs.at(-1).push(points[i]);
+			}
+			for (const run of runs.filter((part) => part.length > 2)) {
+				buffer.tube(run, (s) => stroke === GlobeStreamStroke.Comet ? .001 + .0046 * s : .003, tone, owner, 4);
+				if (stroke === GlobeStreamStroke.Arrow) heads.push({
+					point: run.at(-1),
+					dir: run.at(-1).clone().sub(run.at(-2)).normalize(),
+					t
+				});
+			}
+		});
+		ctx.root.add(buffer.build(ctx, {
+			sweep: true,
+			duration: 1.8
+		}));
+		if (heads.length) this.stamp(ctx, new ConeGeometry(.0085, .024, 6), heads, ({ point, dir }, _, node) => {
+			node.position.copy(point);
+			node.quaternion.setFromUnitVectors(up, dir);
+		}, ({ t }) => this.heat(ctx, t), void 0, { shadow: false });
+		this.drawKey(ctx, this.ramp(ctx), 0, top);
+	}
+};
+export { StreamGlobe };

package/dist/charts/threeglobe/Tile3DMap.js

@@ -0,0 +1,102 @@
+import { ChartFamily, DataShape, Dimension } from "../../core/enums.js";
+import { GlobeProjection, GlobeTile } from "./GlobeEnums.js";
+import { magnitude } from "./GlobeMath.js";
+import { GlobeSamples } from "./GlobeSamples.js";
+import { MapPlaneChart } from "./MapPlaneChart.js";
+import { geoCentroid } from "d3";
+import { CylinderGeometry } from "three";
+// src/charts/threeglobe/Tile3DMap.ts
+var SIDES = {
+	[GlobeTile.Square]: 4,
+	[GlobeTile.Hexagon]: 6,
+	[GlobeTile.Circle]: 28,
+	[GlobeTile.Diamond]: 4
+};
+var TURN = {
+	[GlobeTile.Square]: Math.PI / 4,
+	[GlobeTile.Hexagon]: 0,
+	[GlobeTile.Circle]: 0,
+	[GlobeTile.Diamond]: 0
+};
+/** One equal tile per country: stops big countries dominating, which suits per-country comparison. */
+var Tile3DMap = class extends MapPlaneChart {
+	static meta = {
+		id: "tile-3d-map",
+		name: "3D tile map",
+		family: ChartFamily.Geospatial,
+		dimension: Dimension.Three,
+		shape: DataShape.Geo,
+		description: "Gives every country one equal tile near its true position, raised and coloured by value.",
+		tags: [
+			"tile grid map",
+			"cartogram",
+			"equal area"
+		],
+		sample: (seed) => GlobeSamples.regions(seed),
+		variants: {
+			tile: Object.values(GlobeTile),
+			columns: [
+				48,
+				36,
+				60
+			],
+			raise: [true, false],
+			projection: [GlobeProjection.NaturalEarth, GlobeProjection.Equirectangular],
+			plate: [true, false]
+		}
+	};
+	defaults() {
+		return {
+			...super.defaults(),
+			tile: GlobeTile.Square,
+			columns: 48,
+			raise: true
+		};
+	}
+	/** Greedy nearest-free-cell placement, biggest values first so they stay closest to home. */
+	layout(cell, stagger) {
+		const taken = /* @__PURE__ */ new Set(), rowStep = stagger ? cell * .866 : cell;
+		return [...this.features].filter((feature) => feature.geometry).sort((a, b) => (this.reading(b) ?? 0) - (this.reading(a) ?? 0)).map((feature) => {
+			const home = this.body.place(...geoCentroid(feature));
+			const row = Math.round(home.z / rowStep), column = Math.round(home.x / cell);
+			let best, closest = Infinity;
+			for (let r = 0; r < 24 && !best; r++) for (let dz = -r; dz <= r; dz++) for (let dx = -r; dx <= r; dx++) {
+				const j = row + dz, i = column + dx, x = (i + (stagger && j % 2 ? .5 : 0)) * cell, z = j * rowStep, key = `${i}:${j}`;
+				const away = (x - home.x) ** 2 + (z - home.z) ** 2;
+				if (!taken.has(key) && away < closest) {
+					closest = away;
+					best = {
+						key,
+						x,
+						z
+					};
+				}
+			}
+			taken.add(best.key);
+			return {
+				feature,
+				x: best.x,
+				z: best.z
+			};
+		});
+	}
+	draw(ctx) {
+		const { tile, columns, raise } = this.options, cell = 2 / columns;
+		const tiles = this.layout(cell, tile === GlobeTile.Hexagon), values = this.values(), size = magnitude(values);
+		const color = (feature) => {
+			const value = this.reading(feature);
+			return value === null ? this.missing(ctx) : this.heat(ctx, size(value));
+		};
+		const radius = cell / 2 * (tile === GlobeTile.Square ? Math.SQRT2 * .9 : tile === GlobeTile.Diamond ? .98 : tile === GlobeTile.Hexagon ? 1.08 : .92);
+		const shape = new CylinderGeometry(radius, radius, 1, SIDES[tile]).rotateY(TURN[tile]).translate(0, .5, 0);
+		this.stamp(ctx, shape, tiles, ({ feature, x, z }, _, node, p) => {
+			node.position.set(x, 0, z);
+			node.scale.set(1, Math.max(.01 + (raise ? size(this.reading(feature) ?? 0) * .17 : 0), .001) * Math.max(p, .02), 1);
+		}, ({ feature }) => color(feature), ({ feature }) => this.regionTip(feature, color(feature)), {
+			grow: true,
+			roughness: .65
+		});
+		if (values.length) this.drawKey(ctx, this.ramp(ctx), 0, Math.max(...values.map(Math.abs)));
+	}
+};
+export { Tile3DMap };