blazeplot 0.1.6 → 0.1.8

package/dist/index.js

@@ -81,6 +81,32 @@ var t = 16, n = class {
 		let i = new Float32Array(n);
 		r && i.set(r.subarray(0, Math.min(r.length, n))), this.levels[e] = i;
 	}
+	rangeMinMax(e, t, n) {
+		let r = Math.max(0, Math.floor(t)), i = Math.min(e.length, Math.ceil(n));
+		if (i <= r) return null;
+		let a = Infinity, o = -Infinity, s = r;
+		for (; s < i;) {
+			let t = -1, n = 1;
+			for (let e = this.levels.length - 1; e >= 0; e--) {
+				let r = this.levelSampleWidths[e], a = Math.floor(s / r);
+				if (r > 0 && s % r === 0 && s + r <= i && a < this.levelLengths[e]) {
+					t = e, n = r;
+					break;
+				}
+			}
+			if (t >= 0) {
+				let e = Math.floor(s / n), r = this.levels[t], i = r[e * 2], c = r[e * 2 + 1];
+				i < a && (a = i), c > o && (o = c), s += n;
+			} else {
+				let t = e.getY(s);
+				t < a && (a = t), t > o && (o = t), s++;
+			}
+		}
+		return Number.isFinite(a) && Number.isFinite(o) ? {
+			minY: a,
+			maxY: o
+		} : null;
+	}
 	query(e, t, n) {
 		if (t <= 0 || n.length <= 0) return {
 			buckets: new Float32Array(),
@@ -114,15 +140,24 @@ var t = 16, n = class {
 			samplesPerPixel: i
 		};
 	}
-}, r = class {
+};
+//#endregion
+//#region src/core/SeriesStore.ts
+function r(e) {
+	return "rangeMinMaxY" in e;
+}
+var i = class {
 	config;
 	style;
 	dataset;
 	pyramid;
 	_dirty = !1;
+	_useRawMinMaxScan = !1;
+	_lastBuildLength = 0;
+	_lastBuildRangeStart = NaN;
 	_visible = !0;
 	constructor(e, t, r) {
-		this.dataset = e, this.config = t, this.pyramid = t.downsample === "none" ? null : new n(), this.style = r, this.pyramid && e.length > 0 && this.pyramid.build(e);
+		this.dataset = e, this.config = t, this.pyramid = (t.mode === "line" || t.mode === "bar") && t.downsample !== "none" ? new n() : null, this.style = r, this.pyramid && e.length > 0 && this.pyramid.build(e), this._lastBuildLength = e.length, this._lastBuildRangeStart = e.range?.start ?? NaN;
 	}
 	get hasLOD() {
 		return this.pyramid !== null;
@@ -145,10 +180,16 @@ var t = 16, n = class {
 	}
 	clear() {
 		if (!("clear" in this.dataset)) throw TypeError("SeriesStore dataset is not clearable.");
-		this.dataset.clear(), this.pyramid && this.pyramid.build(this.dataset), this._dirty = !1;
+		this.dataset.clear(), this.pyramid && this.pyramid.build(this.dataset), this._useRawMinMaxScan = !1, this._lastBuildLength = this.dataset.length, this._lastBuildRangeStart = this.dataset.range?.start ?? NaN, this._dirty = !1;
 	}
 	rebuildPyramid() {
-		this._dirty &&= (this.pyramid && this.pyramid.incrementalBuild(this.dataset), !1);
+		if (this._dirty) {
+			if (this.pyramid) {
+				let e = this.dataset.length, t = this.dataset.range?.start ?? NaN;
+				e === this._lastBuildLength && t !== this._lastBuildRangeStart ? this._useRawMinMaxScan = !0 : (this.pyramid.incrementalBuild(this.dataset), this._useRawMinMaxScan = !1), this._lastBuildLength = e, this._lastBuildRangeStart = t;
+			}
+			this._dirty = !1;
+		}
 	}
 	query(e, t) {
 		if (!this.pyramid || !this.dataset.range) return {
@@ -167,39 +208,127 @@ var t = 16, n = class {
 		let t = this.dataset.lowerBoundX(e.xMin), n = this.dataset.upperBoundX(e.xMax);
 		return Math.max(0, n - t);
 	}
+	sampleAt(e) {
+		return e < 0 || e >= this.dataset.length ? null : {
+			index: e,
+			x: this.dataset.getX(e),
+			y: this.dataset.getY(e)
+		};
+	}
+	nearestSampleByX(e, t) {
+		let n = this.visibleIndexRange(t);
+		if (n.start >= n.end) return null;
+		let r = this.dataset.lowerBoundX(e), i = Math.min(Math.max(r, n.start), n.end - 1), a = i - 1;
+		if (a >= n.start) {
+			let t = Math.abs(this.dataset.getX(i) - e);
+			Math.abs(this.dataset.getX(a) - e) <= t && (i = a);
+		}
+		return this.sampleAt(i);
+	}
+	nearestSampleByPoint(e, t, n, r, i) {
+		let a = this.visibleIndexRange(n);
+		if (a.start >= a.end || r <= 0 || i <= 0) return null;
+		let o = r / (n.xMax - n.xMin), s = i / (n.yMax - n.yMin), c = -1, l = Infinity;
+		for (let n = a.start; n < a.end; n++) {
+			let r = (this.dataset.getX(n) - e) * o, i = (this.dataset.getY(n) - t) * s, a = r * r + i * i;
+			a < l && (l = a, c = n);
+		}
+		if (c < 0) return null;
+		let u = this.sampleAt(c);
+		return u ? {
+			...u,
+			distancePx: Math.sqrt(l)
+		} : null;
+	}
 	copyRawVisible(e, t, n) {
-		if (n <= 0 || t.length < n * 2) return 0;
-		let r = this.dataset.lowerBoundX(e.xMin), i = this.dataset.upperBoundX(e.xMax), a = i - r;
-		if (a <= 0) return 0;
-		let o = Math.max(1, Math.ceil(a / n)), s = 0;
-		for (let e = r; e < i && s < n; e += o) t[s * 2] = this.dataset.getX(e), t[s * 2 + 1] = this.dataset.getY(e), s++;
-		return s;
+		return this.copyVisibleSamples(e, t, n, "points", 0);
+	}
+	copyAreaVisible(e, t, n, r = 0) {
+		return this.copyVisibleSamples(e, t, n, "area", r) * 2;
 	}
 	copyMinMaxVisible(e, t, n) {
-		if (!this.pyramid || n <= 0 || t.length < n * 4) return 0;
-		let r = this.dataset.lowerBoundX(e.xMin), i = this.dataset.upperBoundX(e.xMax), a = i - r;
-		if (a <= 0) return 0;
-		let o = Math.min(n, a), s = 0;
-		for (let e = 0; e < o; e++) {
-			let n = r + Math.floor(e * a / o), c = r + Math.max(Math.floor((e + 1) * a / o), Math.floor(e * a / o) + 1), l = Math.min(i, c), u = Infinity, d = -Infinity;
-			for (let e = n; e < l; e++) {
-				let t = this.dataset.getY(e);
-				t < u && (u = t), t > d && (d = t);
+		return this.copyMinMaxSegments(e, t, n, "line-list") * 2;
+	}
+	copyMinMaxInstanced(e, t, n) {
+		return this.copyMinMaxSegments(e, t, n, "instanced");
+	}
+	visibleIndexRange(e) {
+		return e ? {
+			start: this.dataset.lowerBoundX(e.xMin),
+			end: this.dataset.upperBoundX(e.xMax)
+		} : {
+			start: 0,
+			end: this.dataset.length
+		};
+	}
+	copyVisibleSamples(e, t, n, r, i) {
+		let a = r === "points" ? 2 : 4;
+		if (n <= 0 || t.length < n * a) return 0;
+		let o = this.dataset.lowerBoundX(e.xMin), s = this.dataset.upperBoundX(e.xMax), c = s - o;
+		if (c <= 0) return 0;
+		let l = Math.max(1, Math.ceil(c / n)), u = 0;
+		for (let e = o; e < s && u < n; e += l) {
+			let n = this.dataset.getX(e), a = this.dataset.getY(e);
+			if (r === "points") {
+				let e = u * 2;
+				t[e] = n, t[e + 1] = a;
+			} else {
+				let e = u * 4;
+				t[e] = n, t[e + 1] = i, t[e + 2] = n, t[e + 3] = a;
+			}
+			u++;
+		}
+		return u;
+	}
+	copyMinMaxSegments(e, t, n, r) {
+		let i = r === "line-list" ? 4 : 3;
+		if (!this.pyramid || n <= 0 || t.length < n * i) return 0;
+		let a = this.dataset.lowerBoundX(e.xMin), o = this.dataset.upperBoundX(e.xMax), s = o - a;
+		if (s <= 0) return 0;
+		let c = Math.min(n, s);
+		for (let e = 0; e < c; e++) {
+			let n = a + Math.floor(e * s / c), i = a + Math.max(Math.floor((e + 1) * s / c), Math.floor(e * s / c) + 1), l = Math.min(o, i), u = this.minMaxForRange(n, l);
+			if (!u) continue;
+			let d = this.dataset.getX(n + (l - n >> 1)), { minY: f, maxY: p } = u;
+			if (r === "line-list") {
+				let n = e * 4;
+				t[n] = d, t[n + 1] = f, t[n + 2] = d, t[n + 3] = p;
+			} else {
+				let n = e * 3;
+				t[n] = d, t[n + 1] = f, t[n + 2] = p;
 			}
-			let f = this.dataset.getX(n + (l - n >> 1));
-			t[s * 2] = f, t[s * 2 + 1] = u, s++, t[s * 2] = f, t[s * 2 + 1] = d, s++;
 		}
-		return s;
+		return c;
+	}
+	minMaxForRange(e, t) {
+		return !this.pyramid || this._useRawMinMaxScan ? this.rawMinMaxForRange(e, t) : this.pyramid.rangeMinMax(this.dataset, e, t);
+	}
+	rawMinMaxForRange(e, t) {
+		if (r(this.dataset)) return this.dataset.rangeMinMaxY(e, t);
+		let n = Math.max(0, Math.floor(e)), i = Math.min(this.dataset.length, Math.ceil(t));
+		if (i <= n) return null;
+		let a = Infinity, o = -Infinity;
+		for (let e = n; e < i; e++) {
+			let t = this.dataset.getY(e);
+			t < a && (a = t), t > o && (o = t);
+		}
+		return {
+			minY: a,
+			maxY: o
+		};
 	}
-}, i = class {
+}, a = class e {
 	capacity;
 	_length = 0;
 	_head = 0;
 	xData;
 	yData;
-	constructor(e) {
-		if (!Number.isInteger(e) || e <= 0) throw RangeError("RingBuffer capacity must be a positive integer.");
-		this.capacity = e, this.xData = new Float64Array(e), this.yData = new Float32Array(e);
+	treeBase;
+	minTree;
+	maxTree;
+	constructor(t) {
+		if (!Number.isInteger(t) || t <= 0) throw RangeError("RingBuffer capacity must be a positive integer.");
+		this.capacity = t, this.xData = new Float64Array(t), this.yData = new Float32Array(t), this.treeBase = e.nextPowerOfTwo(t), this.minTree = new Float32Array(this.treeBase * 2), this.maxTree = new Float32Array(this.treeBase * 2), this.minTree.fill(Infinity), this.maxTree.fill(-Infinity);
 	}
 	get length() {
 		return this._length;
@@ -211,11 +340,21 @@ var t = 16, n = class {
 		};
 	}
 	push(e, t) {
-		this.xData[this._head] = e, this.yData[this._head] = t, this._head = (this._head + 1) % this.capacity, this._length < this.capacity && this._length++;
+		this.xData[this._head] = e, this.yData[this._head] = t, this.setTreeLeaf(this._head, t), this._head = (this._head + 1) % this.capacity, this._length < this.capacity && this._length++;
 	}
 	append(e, t) {
 		let n = Math.min(e.length, t.length);
-		for (let r = 0; r < n; r++) this.push(e[r], t[r]);
+		if (n <= 0) return;
+		if (n >= this.capacity) {
+			let r = n - this.capacity;
+			this._head = 0, this._length = this.capacity, this.copyIntoPhysical(0, e, t, r, this.capacity);
+			return;
+		}
+		let r = 0, i = n;
+		for (; i > 0;) {
+			let n = Math.min(i, this.capacity - this._head);
+			this.copyIntoPhysical(this._head, e, t, r, n), this._head = (this._head + n) % this.capacity, this._length = Math.min(this.capacity, this._length + n), r += n, i -= n;
+		}
 	}
 	get(e) {
 		return e < 0 || e >= this._length ? null : {
@@ -245,8 +384,64 @@ var t = 16, n = class {
 		}
 		return t;
 	}
+	rangeMinMaxY(e, t) {
+		let n = Math.max(0, Math.floor(e)), r = Math.min(this._length, Math.ceil(t));
+		if (r <= n) return null;
+		let i = this.logicalToPhysical(n), a = r - n;
+		if (i + a <= this.capacity) return this.queryPhysicalMinMax(i, i + a);
+		let o = this.queryPhysicalMinMax(i, this.capacity), s = this.queryPhysicalMinMax(0, (i + a) % this.capacity);
+		return o ? s ? {
+			minY: Math.min(o.minY, s.minY),
+			maxY: Math.max(o.maxY, s.maxY)
+		} : o : s;
+	}
 	clear() {
-		this._length = 0, this._head = 0;
+		this._length = 0, this._head = 0, this.minTree.fill(Infinity), this.maxTree.fill(-Infinity);
+	}
+	copyIntoPhysical(e, t, n, r, i) {
+		for (let a = 0; a < i; a++) {
+			let i = e + a, o = n[r + a];
+			this.xData[i] = t[r + a], this.yData[i] = o;
+			let s = this.treeBase + i;
+			this.minTree[s] = o, this.maxTree[s] = o;
+		}
+		this.recomputeTreeRange(e, e + i);
+	}
+	setTreeLeaf(e, t) {
+		let n = this.treeBase + e;
+		for (this.minTree[n] = t, this.maxTree[n] = t, n >>= 1; n >= 1;) this.recomputeTreeNode(n), n >>= 1;
+	}
+	recomputeTreeRange(e, t) {
+		let n = this.treeBase + e >> 1, r = this.treeBase + t - 1 >> 1;
+		for (; n >= 1;) {
+			for (let e = n; e <= r; e++) this.recomputeTreeNode(e);
+			if (n === 1) break;
+			n >>= 1, r >>= 1;
+		}
+	}
+	recomputeTreeNode(e) {
+		let t = e << 1, n = t + 1, r = this.minTree[t], i = this.minTree[n], a = this.maxTree[t], o = this.maxTree[n];
+		this.minTree[e] = r < i ? r : i, this.maxTree[e] = a > o ? a : o;
+	}
+	queryPhysicalMinMax(e, t) {
+		if (t <= e) return null;
+		let n = this.treeBase + e, r = this.treeBase + t, i = Infinity, a = -Infinity;
+		for (; n < r;) {
+			if (n & 1) {
+				let e = this.minTree[n], t = this.maxTree[n];
+				e < i && (i = e), t > a && (a = t), n++;
+			}
+			if (r & 1) {
+				r--;
+				let e = this.minTree[r], t = this.maxTree[r];
+				e < i && (i = e), t > a && (a = t);
+			}
+			n >>= 1, r >>= 1;
+		}
+		return Number.isFinite(i) && Number.isFinite(a) ? {
+			minY: i,
+			maxY: a
+		} : null;
 	}
 	logicalToPhysical(e) {
 		return (this._head - this._length + e + this.capacity) % this.capacity;
@@ -254,22 +449,89 @@ var t = 16, n = class {
 	assertValidIndex(e) {
 		if (!Number.isInteger(e) || e < 0 || e >= this._length) throw RangeError(`RingBuffer index out of range: ${e}`);
 	}
-}, a = {
+	static nextPowerOfTwo(e) {
+		return 2 ** Math.ceil(Math.log2(e));
+	}
+}, o = "attribute vec2 position;\n\nuniform vec2 uScale;\nuniform vec2 uOffset;\n\nvoid main() {\n  vec2 clipSpace = position * uScale + uOffset;\n  gl_Position = vec4(clipSpace, 0.0, 1.0);\n}\n", s = "precision mediump float;\n\nuniform vec4 uColor;\n\nvoid main() {\n  gl_FragColor = uColor;\n}\n", c = "attribute float aX;\nattribute float aMinY;\nattribute float aMaxY;\nattribute float aSelect;\n\nuniform vec2 uScale;\nuniform vec2 uOffset;\n\nvoid main() {\n  float y = (aSelect < 0.5) ? aMinY : aMaxY;\n  vec2 position = vec2(aX, y);\n  vec2 clipSpace = position * uScale + uOffset;\n  gl_Position = vec4(clipSpace, 0.0, 1.0);\n}\n", l = "precision mediump float;\n\nuniform vec4 uColor;\n\nvoid main() {\n  gl_FragColor = uColor;\n}\n", u = "attribute vec2 aPosition;\nattribute vec2 aCorner;\n\nuniform vec2 uScale;\nuniform vec2 uOffset;\nuniform vec2 uCanvasSize;\nuniform float uPointSize;\n\nvoid main() {\n  vec2 centerClip = aPosition * uScale + uOffset;\n  vec2 pointSizeClip = vec2(2.0 / uCanvasSize.x, 2.0 / uCanvasSize.y) * uPointSize * 0.5;\n  vec2 clipSpace = centerClip + aCorner * pointSizeClip;\n  gl_Position = vec4(clipSpace, 0.0, 1.0);\n}\n", d = "precision mediump float;\n\nuniform vec4 uColor;\n\nvoid main() {\n  gl_FragColor = uColor;\n}\n", f = "attribute vec2 aPosition;\n\nuniform vec2 uScale;\nuniform vec2 uOffset;\nuniform float uPointSize;\n\nvoid main() {\n  vec2 clipSpace = aPosition * uScale + uOffset;\n  gl_Position = vec4(clipSpace, 0.0, 1.0);\n  gl_PointSize = uPointSize;\n}\n", p = "precision mediump float;\n\nuniform vec4 uColor;\n\nvoid main() {\n  vec2 p = gl_PointCoord * 2.0 - 1.0;\n  if (dot(p, p) > 1.0) discard;\n  gl_FragColor = uColor;\n}\n", m = "attribute vec2 aPosition;\nattribute vec2 aCorner;\n\nuniform vec2 uScale;\nuniform vec2 uOffset;\nuniform float uBarWidth;\nuniform float uBaseline;\n\nvoid main() {\n  float x = aPosition.x + aCorner.x * uBarWidth;\n  float y = mix(uBaseline, aPosition.y, aCorner.y);\n  vec2 clipSpace = vec2(x, y) * uScale + uOffset;\n  gl_Position = vec4(clipSpace, 0.0, 1.0);\n}\n", h = "attribute float aX;\nattribute float aMinY;\nattribute float aMaxY;\nattribute vec2 aCorner;\n\nuniform vec2 uScale;\nuniform vec2 uOffset;\nuniform float uBarWidth;\n\nvoid main() {\n  float x = aX + aCorner.x * uBarWidth;\n  float y = mix(aMinY, aMaxY, aCorner.y);\n  vec2 clipSpace = vec2(x, y) * uScale + uOffset;\n  gl_Position = vec4(clipSpace, 0.0, 1.0);\n}\n", g = "precision mediump float;\n\nuniform vec4 uColor;\n\nvoid main() {\n  gl_FragColor = uColor;\n}\n", _ = {
 	line: {
-		vert: "attribute vec2 position;\n\nuniform vec2 uScale;\nuniform vec2 uOffset;\n\nvoid main() {\n  vec2 clipSpace = position * uScale + uOffset;\n  gl_Position = vec4(clipSpace, 0.0, 1.0);\n}\n",
-		frag: "precision mediump float;\n\nuniform vec4 uColor;\n\nvoid main() {\n  gl_FragColor = uColor;\n}\n"
+		vert: o,
+		frag: s
 	},
 	segment: {
-		vert: "attribute float aX;\nattribute float aMinY;\nattribute float aMaxY;\n\nuniform vec2 uScale;\nuniform vec2 uOffset;\n\nvoid main() {\n  float y = (gl_VertexID == 0) ? aMinY : aMaxY;\n  vec2 position = vec2(aX, y);\n  vec2 clipSpace = position * uScale + uOffset;\n  gl_Position = vec4(clipSpace, 0.0, 1.0);\n}\n",
-		frag: "precision mediump float;\n\nuniform vec4 uColor;\n\nvoid main() {\n  gl_FragColor = uColor;\n}\n"
+		vert: c,
+		frag: l
+	},
+	point: {
+		vert: u,
+		frag: d
+	},
+	pointSprite: {
+		vert: f,
+		frag: p
+	},
+	bar: {
+		vert: m,
+		frag: g
+	},
+	barRange: {
+		vert: h,
+		frag: g
 	}
-}, o = class {
+}, v = 3, y = 2, b = 4, x = 4, S = .8, C = 0, w = class {
 	backend;
 	lineProgram;
+	segmentProgram;
+	pointProgram;
+	pointSpriteProgram;
+	barProgram;
+	barRangeProgram;
+	segmentSelectBuffer;
+	pointCornerBuffer;
+	barCornerBuffer;
 	scaleUniform = new Float32Array(2);
 	offsetUniform = new Float32Array(2);
+	canvasSizeUniform = new Float32Array(2);
 	constructor(e) {
-		this.backend = e, this.lineProgram = this.backend.createProgram(a.line.vert, a.line.frag);
+		this.backend = e, this.lineProgram = this.backend.createProgram(_.line.vert, _.line.frag), this.segmentProgram = this.backend.createProgram(_.segment.vert, _.segment.frag), this.pointProgram = this.backend.createProgram(_.point.vert, _.point.frag), this.pointSpriteProgram = this.backend.createProgram(_.pointSprite.vert, _.pointSprite.frag), this.barProgram = this.backend.createProgram(_.bar.vert, _.bar.frag), this.barRangeProgram = this.backend.createProgram(_.barRange.vert, _.barRange.frag), this.segmentSelectBuffer = this.backend.createBuffer({
+			usage: "static",
+			type: "float",
+			length: 2
+		}), this.backend.updateBuffer(this.segmentSelectBuffer, new Float32Array([0, 1])), this.pointCornerBuffer = this.backend.createBuffer({
+			usage: "static",
+			type: "float",
+			length: 8
+		}), this.backend.updateBuffer(this.pointCornerBuffer, new Float32Array([
+			-1,
+			-1,
+			1,
+			-1,
+			-1,
+			1,
+			1,
+			1
+		])), this.barCornerBuffer = this.backend.createBuffer({
+			usage: "static",
+			type: "float",
+			length: 8
+		}), this.backend.updateBuffer(this.barCornerBuffer, new Float32Array([
+			-.5,
+			0,
+			.5,
+			0,
+			-.5,
+			1,
+			.5,
+			1
+		]));
+	}
+	get supportsInstancedSegments() {
+		return this.backend.capabilities.instancing;
+	}
+	get supportsInstancedPoints() {
+		return this.backend.capabilities.instancing;
+	}
+	get supportsInstancedBars() {
+		return this.backend.capabilities.instancing;
 	}
 	clear(e, t, n, r) {
 		this.backend.clear(e, t, n, r);
@@ -293,8 +555,191 @@ var t = 16, n = class {
 	drawLineStrip(e, t, n, r) {
 		this.drawLinePrimitive("line_strip", e, t, n, r);
 	}
+	drawMinMaxSegments(e, t, n, r) {
+		this.drawLines(e, t, n, r);
+	}
+	drawMinMaxSegmentsInstanced(e, t, n, r) {
+		this.writeCameraUniforms(r);
+		let i = v * b, a = {
+			buffer: e,
+			divisor: 1,
+			stride: i,
+			offset: 0
+		}, o = {
+			buffer: e,
+			divisor: 1,
+			stride: i,
+			offset: b
+		}, s = {
+			buffer: e,
+			divisor: 1,
+			stride: i,
+			offset: b * 2
+		}, c = {
+			buffer: this.segmentSelectBuffer,
+			divisor: 0,
+			stride: b,
+			offset: 0
+		};
+		this.backend.draw({
+			program: this.segmentProgram,
+			primitive: "lines",
+			count: 2,
+			instances: t,
+			attributes: {
+				aMaxY: s,
+				aMinY: o,
+				aSelect: c,
+				aX: a
+			},
+			uniforms: {
+				uScale: this.scaleUniform,
+				uOffset: this.offsetUniform,
+				uColor: n.color
+			}
+		});
+	}
+	drawPointsInstanced(e, t, n, r, i, a) {
+		this.writeCameraUniforms(r), this.canvasSizeUniform[0] = Math.max(1, i), this.canvasSizeUniform[1] = Math.max(1, a);
+		let o = {
+			buffer: e,
+			divisor: 1,
+			stride: y * b,
+			offset: 0,
+			size: 2
+		}, s = {
+			buffer: this.pointCornerBuffer,
+			divisor: 0,
+			stride: y * b,
+			offset: 0,
+			size: 2
+		};
+		this.backend.draw({
+			program: this.pointProgram,
+			primitive: "triangle_strip",
+			count: 4,
+			instances: t,
+			attributes: {
+				aCorner: s,
+				aPosition: o
+			},
+			uniforms: {
+				uScale: this.scaleUniform,
+				uOffset: this.offsetUniform,
+				uCanvasSize: this.canvasSizeUniform,
+				uPointSize: n.pointSize ?? x,
+				uColor: n.color
+			}
+		});
+	}
+	drawPointSprites(e, t, n, r) {
+		this.writeCameraUniforms(r), this.backend.draw({
+			program: this.pointSpriteProgram,
+			primitive: "points",
+			count: t,
+			attributes: { aPosition: e },
+			uniforms: {
+				uScale: this.scaleUniform,
+				uOffset: this.offsetUniform,
+				uPointSize: n.pointSize ?? x,
+				uColor: n.color
+			}
+		});
+	}
+	drawAreaStrip(e, t, n, r) {
+		this.writeCameraUniforms(r), this.backend.draw({
+			program: this.lineProgram,
+			primitive: "triangle_strip",
+			count: t,
+			attributes: { position: e },
+			uniforms: {
+				uScale: this.scaleUniform,
+				uOffset: this.offsetUniform,
+				uColor: n.fillColor ?? n.color
+			}
+		});
+	}
+	drawBarsInstanced(e, t, n, r) {
+		this.writeCameraUniforms(r);
+		let i = {
+			buffer: e,
+			divisor: 1,
+			stride: y * b,
+			offset: 0,
+			size: 2
+		}, a = {
+			buffer: this.barCornerBuffer,
+			divisor: 0,
+			stride: y * b,
+			offset: 0,
+			size: 2
+		};
+		this.backend.draw({
+			program: this.barProgram,
+			primitive: "triangle_strip",
+			count: 4,
+			instances: t,
+			attributes: {
+				aCorner: a,
+				aPosition: i
+			},
+			uniforms: {
+				uScale: this.scaleUniform,
+				uOffset: this.offsetUniform,
+				uBarWidth: n.barWidth ?? S,
+				uBaseline: n.baseline ?? C,
+				uColor: n.color
+			}
+		});
+	}
+	drawBarRangesInstanced(e, t, n, r) {
+		this.writeCameraUniforms(r);
+		let i = v * b, a = {
+			buffer: e,
+			divisor: 1,
+			stride: i,
+			offset: 0
+		}, o = {
+			buffer: e,
+			divisor: 1,
+			stride: i,
+			offset: b
+		}, s = {
+			buffer: e,
+			divisor: 1,
+			stride: i,
+			offset: b * 2
+		}, c = {
+			buffer: this.barCornerBuffer,
+			divisor: 0,
+			stride: y * b,
+			offset: 0,
+			size: 2
+		};
+		this.backend.draw({
+			program: this.barRangeProgram,
+			primitive: "triangle_strip",
+			count: 4,
+			instances: t,
+			attributes: {
+				aCorner: c,
+				aMaxY: s,
+				aMinY: o,
+				aX: a
+			},
+			uniforms: {
+				uScale: this.scaleUniform,
+				uOffset: this.offsetUniform,
+				uBarWidth: n.barWidth ?? S,
+				uColor: n.color
+			}
+		});
+	}
+	drawBarTriangles(e, t, n, r) {
+		this.drawTrianglePrimitive(e, t, n, r);
+	}
 	drawLinePrimitive(e, t, n, r, i) {
-		this.scaleUniform[0] = i.xScale, this.scaleUniform[1] = i.yScale, this.offsetUniform[0] = i.xOffset, this.offsetUniform[1] = i.yOffset, this.backend.draw({
+		this.writeCameraUniforms(i), this.backend.draw({
 			program: this.lineProgram,
 			primitive: e,
 			count: n,
@@ -306,19 +751,32 @@ var t = 16, n = class {
 			}
 		});
 	}
-	drawMinMaxSegments(e, t, n, r) {
-		this.drawLines(e, t, n, r);
+	drawTrianglePrimitive(e, t, n, r) {
+		this.writeCameraUniforms(r), this.backend.draw({
+			program: this.lineProgram,
+			primitive: "triangles",
+			count: t,
+			attributes: { position: e },
+			uniforms: {
+				uScale: this.scaleUniform,
+				uOffset: this.offsetUniform,
+				uColor: n.color
+			}
+		});
+	}
+	writeCameraUniforms(e) {
+		this.scaleUniform[0] = e.xScale, this.scaleUniform[1] = e.yScale, this.offsetUniform[0] = e.xOffset, this.offsetUniform[1] = e.yOffset;
 	}
 	dispose() {
 		this.backend.destroy();
 	}
-}, s = [
+}, T = [
 	1024,
 	4096,
 	16384,
 	32768,
 	131072
-], c = class {
+], E = class {
 	regl;
 	pool = [];
 	preAllocated = !1;
@@ -331,7 +789,7 @@ var t = 16, n = class {
 	preAllocate() {
 		if (!this.preAllocated) {
 			this.preAllocated = !0;
-			for (let e of s) this.pool.push(this.createEntry(e, "stream"));
+			for (let e of T) this.pool.push(this.createEntry(e, "stream"));
 		}
 	}
 	acquire(e, t = "stream") {
@@ -371,23 +829,24 @@ var t = 16, n = class {
 		return this.pool.find((t) => !t.inUse && t.floatCapacity >= e);
 	}
 	roundUp(e) {
-		for (let t of s) if (t >= e) return t;
-		let t = s[s.length - 1], n = 1 << 32 - Math.clz32(e - 1);
+		for (let t of T) if (t >= e) return t;
+		let t = T[T.length - 1], n = 1 << 32 - Math.clz32(e - 1);
 		return Math.max(t * 2, n);
 	}
 };
 //#endregion
 //#region src/render/ReglBackend.ts
-function l(e) {
+function D(e) {
 	return e;
 }
-var u = class {
+var O = class {
 	gl;
 	regl;
 	resources;
 	nextProgramId = 1;
 	commandCache = /* @__PURE__ */ new Map();
 	scissorBox = null;
+	capabilities;
 	constructor(t) {
 		let n = t.getContext("webgl2", {
 			alpha: !0,
@@ -400,10 +859,10 @@ var u = class {
 		});
 		if (!n) throw Error("BlazePlot requires WebGL2, but this browser/context does not support it.");
 		this.gl = n, this.regl = e({
-			gl: l(this.gl),
+			gl: D(this.gl),
 			extensions: [],
-			optionalExtensions: ["ext_disjoint_timer_query_webgl2"]
-		}), this.resources = new c(this.regl), this.resources.preAllocate();
+			optionalExtensions: ["angle_instanced_arrays", "ext_disjoint_timer_query_webgl2"]
+		}), this.capabilities = { instancing: this.regl.hasExtension("angle_instanced_arrays") }, this.resources = new E(this.regl), this.resources.preAllocate();
 	}
 	createBuffer(e) {
 		let { buffer: t } = this.resources.acquire(e.length, e.usage);
@@ -436,7 +895,7 @@ var u = class {
 		].join("|"), a = this.commandCache.get(i);
 		a || (a = this.createDrawCommand(t, e.primitive, n, r, e.instances !== void 0), this.commandCache.set(i, a));
 		let o = {};
-		for (let t of n) o[t] = this.asReglBuffer(e.attributes[t]).buffer;
+		for (let t of n) o[t] = this.resolveAttribute(e.attributes[t]);
 		let s = {
 			count: e.count,
 			instances: e.instances ?? 0,
@@ -497,6 +956,15 @@ var u = class {
 			}
 		});
 	}
+	resolveAttribute(e) {
+		return "divisor" in e ? {
+			buffer: this.asReglBuffer(e.buffer).buffer,
+			divisor: e.divisor,
+			stride: e.stride,
+			offset: e.offset,
+			size: e.size
+		} : this.asReglBuffer(e).buffer;
+	}
 	asReglBuffer(e) {
 		return e;
 	}
@@ -513,7 +981,7 @@ var u = class {
 			default: return e;
 		}
 	}
-}, d = class {
+}, k = class {
 	canvas;
 	camera;
 	policy;
@@ -567,7 +1035,7 @@ var u = class {
 	dispose() {
 		this.canvas.removeEventListener("pointerdown", this.onPointerDown), this.canvas.removeEventListener("pointermove", this.onPointerMove), this.canvas.removeEventListener("pointerup", this.onPointerUp), this.canvas.removeEventListener("pointercancel", this.onPointerUp), this.canvas.removeEventListener("wheel", this.onWheel);
 	}
-}, f = class e {
+}, A = class e {
 	_xMin = 0;
 	_xMax = 1;
 	_yMin = 0;
@@ -652,7 +1120,7 @@ var u = class {
 	static assertFinite(e, t) {
 		if (!Number.isFinite(t)) throw RangeError(`Camera2D ${e} must be finite.`);
 	}
-}, p = class {
+}, j = class {
 	camera;
 	constructor(e) {
 		this.camera = e;
@@ -684,7 +1152,7 @@ var u = class {
 		let n = Math.max(0, -Math.floor(Math.log10(t)) + 2), r = Number(e.toFixed(n));
 		return Object.is(r, -0) ? 0 : r;
 	}
-}, m = class {
+}, M = class {
 	layout;
 	config;
 	options;
@@ -726,7 +1194,7 @@ var u = class {
 			}
 		}
 	}
-}, h = class {
+}, N = class {
 	root;
 	plot;
 	canvas;
@@ -751,10 +1219,10 @@ var u = class {
 		this.externalCanvas ? this.originalCanvasParent?.insertBefore(this.root, e) : e.appendChild(this.root), this.root.appendChild(this.yAxis), this.root.appendChild(this.plot), this.root.appendChild(this.corner), this.root.appendChild(this.xAxis), this.plot.appendChild(this.canvas);
 	}
 	applyBaseStyles() {
-		this.root.style.display = "grid", this.root.style.width = "100%", this.root.style.height = "100%", this.root.style.minWidth = "0", this.root.style.minHeight = "0", this.root.style.overflow = "hidden", this.plot.style.position = "relative", this.plot.style.gridColumn = "2", this.plot.style.gridRow = "1", this.plot.style.minWidth = "0", this.plot.style.minHeight = "0", this.plot.style.overflow = "hidden", this.canvas.style.position = "absolute", this.canvas.style.inset = "0", this.canvas.style.display = "block", this.canvas.style.width = "100%", this.canvas.style.height = "100%", this.canvas.style.touchAction = "none", this.yAxis.style.position = "relative", this.yAxis.style.gridColumn = "1", this.yAxis.style.gridRow = "1", this.yAxis.style.minWidth = "0", this.yAxis.style.minHeight = "0", this.yAxis.style.overflow = "hidden", this.yAxis.style.pointerEvents = "none", this.xAxis.style.position = "relative", this.xAxis.style.gridColumn = "2", this.xAxis.style.gridRow = "2", this.xAxis.style.minWidth = "0", this.xAxis.style.minHeight = "0", this.xAxis.style.overflow = "hidden", this.xAxis.style.pointerEvents = "none", this.corner.style.gridColumn = "1", this.corner.style.gridRow = "2", this.corner.style.minWidth = "0", this.corner.style.minHeight = "0", this.corner.style.pointerEvents = "none";
+		this.root.style.position = "relative", this.root.style.display = "grid", this.root.style.width = "100%", this.root.style.height = "100%", this.root.style.minWidth = "0", this.root.style.minHeight = "0", this.root.style.overflow = "hidden", this.plot.style.position = "relative", this.plot.style.gridColumn = "2", this.plot.style.gridRow = "1", this.plot.style.minWidth = "0", this.plot.style.minHeight = "0", this.plot.style.overflow = "hidden", this.canvas.style.position = "absolute", this.canvas.style.inset = "0", this.canvas.style.display = "block", this.canvas.style.width = "100%", this.canvas.style.height = "100%", this.canvas.style.touchAction = "none", this.yAxis.style.position = "relative", this.yAxis.style.gridColumn = "1", this.yAxis.style.gridRow = "1", this.yAxis.style.minWidth = "0", this.yAxis.style.minHeight = "0", this.yAxis.style.overflow = "hidden", this.yAxis.style.pointerEvents = "none", this.xAxis.style.position = "relative", this.xAxis.style.gridColumn = "2", this.xAxis.style.gridRow = "2", this.xAxis.style.minWidth = "0", this.xAxis.style.minHeight = "0", this.xAxis.style.overflow = "hidden", this.xAxis.style.pointerEvents = "none", this.corner.style.gridColumn = "1", this.corner.style.gridRow = "2", this.corner.style.minWidth = "0", this.corner.style.minHeight = "0", this.corner.style.pointerEvents = "none";
 	}
-}, g = 16384, _ = 64;
-function v(e) {
+}, P = 16384, F = P >> 1, I = P >> 1, L = 3, R = 4096, z = 12, B = 64;
+function V(e) {
 	return e === !1 ? {
 		visible: !1,
 		position: "inside"
@@ -766,7 +1234,7 @@ function v(e) {
 		position: e.position ?? "inside"
 	};
 }
-var y = class {
+var H = class {
 	options;
 	series = [];
 	camera;
@@ -775,6 +1243,10 @@ var y = class {
 	input;
 	rawLineBuffer;
 	rawLineData;
+	minMaxInstanceBuffer;
+	minMaxInstanceData;
+	barTriangleBuffer;
+	barTriangleData;
 	gridBuffer;
 	gridData;
 	gridStyle;
@@ -792,8 +1264,21 @@ var y = class {
 		renderMode: "none"
 	};
 	resizeObserver = null;
+	pluginDisposers = [];
+	hoverSubscribers = /* @__PURE__ */ new Set();
+	seriesSubscribers = /* @__PURE__ */ new Set();
+	currentHover = null;
+	lastPointerClientX = 0;
+	lastPointerClientY = 0;
+	pointerInPlot = !1;
 	lastFrameAt = 0;
 	_rafId = 0;
+	handlePointerMove = (e) => {
+		this.pointerInPlot = !0, this.lastPointerClientX = e.clientX, this.lastPointerClientY = e.clientY, this.refreshHover();
+	};
+	handlePointerLeave = () => {
+		this.pointerInPlot = !1, this.emitHover(null);
+	};
 	constructor(e, t = {}) {
 		this.options = t;
 		let n = t.axes;
@@ -816,9 +1301,9 @@ var y = class {
 				position: "inside"
 			}
 		} : this.normalizedAxes = {
-			x: v(n.x),
-			y: v(n.y)
-		}, this.layout = new h(e, this.normalizedAxes), this.applyCanvasSize(), this.camera = new f(), this.axis = new p(this.camera), this.renderer = new o(new u(this.layout.canvas)), this.input = new d(this.layout.canvas, this.camera, t.viewportPolicy), this.rawLineData = new Float32Array(g * 2), this.rawLineBuffer = this.renderer.createFloatBuffer(this.rawLineData.length), this.gridData = new Float32Array(_ * 2), this.gridBuffer = this.renderer.createFloatBuffer(this.gridData.length), this.gridStyle = {
+			x: V(n.x),
+			y: V(n.y)
+		}, this.layout = new N(e, this.normalizedAxes), this.applyCanvasSize(), this.camera = new A(), this.axis = new j(this.camera), this.renderer = new w(new O(this.layout.canvas)), this.input = new k(this.layout.canvas, this.camera, t.viewportPolicy), this.rawLineData = new Float32Array(P * 2), this.rawLineBuffer = this.renderer.createFloatBuffer(this.rawLineData.length), this.minMaxInstanceData = new Float32Array(I * L), this.minMaxInstanceBuffer = this.renderer.createFloatBuffer(this.minMaxInstanceData.length), this.barTriangleData = new Float32Array(R * z), this.barTriangleBuffer = this.renderer.createFloatBuffer(this.barTriangleData.length), this.gridData = new Float32Array(B * 2), this.gridBuffer = this.renderer.createFloatBuffer(this.gridData.length), this.gridStyle = {
 			color: t.gridStyle?.color ?? [
 				.22,
 				.3,
@@ -826,26 +1311,87 @@ var y = class {
 				.45
 			],
 			lineWidth: t.gridStyle?.lineWidth ?? 1
-		}, (this.normalizedAxes.x.visible || this.normalizedAxes.y.visible) && (this.axisOverlay = new m(this.layout, this.normalizedAxes)), typeof ResizeObserver < "u" && (this.resizeObserver = new ResizeObserver(() => this.resize()), this.resizeObserver.observe(this.layout.plot));
+		}, (this.normalizedAxes.x.visible || this.normalizedAxes.y.visible) && (this.axisOverlay = new M(this.layout, this.normalizedAxes)), this.canvas.addEventListener("pointermove", this.handlePointerMove), this.canvas.addEventListener("pointerleave", this.handlePointerLeave), typeof ResizeObserver < "u" && (this.resizeObserver = new ResizeObserver(() => this.resize()), this.resizeObserver.observe(this.layout.plot));
+		for (let e of t.plugins ?? []) {
+			let t = e.install(this);
+			typeof t == "function" ? this.pluginDisposers.push(t) : t && this.pluginDisposers.push(() => t.dispose());
+		}
 	}
 	get canvas() {
 		return this.layout.canvas;
 	}
+	get rootElement() {
+		return this.layout.root;
+	}
+	get plotElement() {
+		return this.layout.plot;
+	}
+	dataToPlot(e, t) {
+		let [n, r] = this.camera.toClip(e, t);
+		return this.camera.toScreen(n, r, this.canvas.clientWidth, this.canvas.clientHeight);
+	}
 	addSeries(e, t) {
-		let n = new r(e.dataset ?? new i(e.capacity), e, {
-			color: t?.color ?? [
-				.3,
-				.6,
-				1,
-				1
-			],
-			lineWidth: t?.lineWidth ?? 1
+		let n = e.dataset ?? new a(e.capacity), r = t?.color ?? [
+			.3,
+			.6,
+			1,
+			1
+		], o = new i(n, e, {
+			color: r,
+			lineWidth: t?.lineWidth ?? 1,
+			pointSize: t?.pointSize ?? 4,
+			barWidth: t?.barWidth ?? .8,
+			baseline: t?.baseline ?? 0,
+			fillColor: t?.fillColor ?? [
+				r[0],
+				r[1],
+				r[2],
+				r[3] * .25
+			]
 		});
-		return this.series.push(n), n;
+		return this.series.push(o), this.emitSeriesChange(), o;
+	}
+	addLine(e, t) {
+		return this.addSeries({
+			...e,
+			mode: "line"
+		}, t);
+	}
+	addArea(e, t) {
+		return this.addSeries({
+			...e,
+			mode: "area"
+		}, t);
+	}
+	addScatter(e, t) {
+		return this.addSeries({
+			...e,
+			mode: "scatter"
+		}, t);
+	}
+	addBar(e, t) {
+		return this.addSeries({
+			...e,
+			mode: "bar"
+		}, t);
 	}
 	removeSeries(e) {
 		let t = this.series.indexOf(e);
-		return t === -1 ? !1 : (this.series.splice(t, 1), !0);
+		return t === -1 ? !1 : (this.series.splice(t, 1), this.emitSeriesChange(), !0);
+	}
+	setSeriesVisible(e, t) {
+		return this.series.includes(e) ? e.visible === t ? !0 : (e.setVisible(t), this.emitSeriesChange(), !0) : !1;
+	}
+	getSeriesState() {
+		return this.series.map((e, t) => ({
+			series: e,
+			index: t,
+			id: e.config.id,
+			name: e.config.name,
+			mode: e.config.mode,
+			visible: e.visible,
+			color: e.style.color
+		}));
 	}
 	setViewport(e) {
 		this.camera.setViewport(e);
@@ -863,6 +1409,45 @@ var y = class {
 	}) {
 		return e.fps = this.stats.fps, e.frameMs = this.stats.frameMs, e.pointsRendered = this.stats.pointsRendered, e.drawCalls = this.stats.drawCalls, e.uploadBytes = this.stats.uploadBytes, e.renderMode = this.stats.renderMode, e;
 	}
+	getHoverState() {
+		return this.currentHover;
+	}
+	subscribe(e, t) {
+		if (e === "hover") {
+			let e = t;
+			return this.hoverSubscribers.add(e), () => this.hoverSubscribers.delete(e);
+		}
+		let n = t;
+		return this.seriesSubscribers.add(n), () => this.seriesSubscribers.delete(n);
+	}
+	pick(e, t, n = {}) {
+		let r = this.canvas.getBoundingClientRect();
+		if (r.width <= 0 || r.height <= 0) return null;
+		let i = e - r.left, a = t - r.top;
+		if (i < 0 || a < 0 || i > r.width || a > r.height) return null;
+		let o = this.camera.viewport, s = o.xMin + i / r.width * (o.xMax - o.xMin), c = o.yMax - a / r.height * (o.yMax - o.yMin), l = n.mode ?? this.options.hover?.mode ?? "nearest-x", u = n.maxDistancePx ?? this.options.hover?.maxDistancePx ?? Infinity, d = l === "nearest-point" ? this.findNearestPointAnchor(s, c, o, r.width, r.height, u) : this.findNearestXAnchor(s, o, r.width, u);
+		return d === null ? null : {
+			clientX: e,
+			clientY: t,
+			plotX: i,
+			plotY: a,
+			dataX: s,
+			dataY: c,
+			anchorX: d,
+			mode: l,
+			items: this.collectPickItems(d, e, t, o, r)
+		};
+	}
+	async screenshot(e = {}) {
+		this.render();
+		let t = this.layout.root.getBoundingClientRect(), n = this.layout.plot.getBoundingClientRect(), r = Number.isFinite(e.dpr) ? Math.max(1, e.dpr) : Math.max(1, globalThis.devicePixelRatio || 1), i = Math.max(1, Math.round(t.width * r)), a = Math.max(1, Math.round(t.height * r)), o = document.createElement("canvas");
+		o.width = i, o.height = a;
+		let s = o.getContext("2d");
+		if (!s) throw Error("Unable to create a 2D canvas context for screenshot export.");
+		return e.background ? (s.fillStyle = e.background, s.fillRect(0, 0, i, a)) : s.clearRect(0, 0, i, a), s.drawImage(this.canvas, (n.left - t.left) * r, (n.top - t.top) * r, n.width * r, n.height * r), this.drawDomTextForScreenshot(s, t, r), new Promise((t, n) => {
+			o.toBlob((e) => e ? t(e) : n(/* @__PURE__ */ Error("Unable to encode chart screenshot.")), e.type ?? "image/png", e.quality);
+		});
+	}
 	start() {
 		let e = () => {
 			this._rafId = requestAnimationFrame(e), this.render();
@@ -882,28 +1467,187 @@ var y = class {
 		}
 		for (let e of this.series) {
 			if (!e.visible) continue;
-			let n = e.visibleSampleCount(t), r = e.hasLOD && n > g, i = r ? e.copyMinMaxVisible(t, this.rawLineData, Math.min(this.canvas.width, g >> 1)) : e.copyRawVisible(t, this.rawLineData, g);
+			if (e.rebuildPyramid(), e.config.mode === "scatter") {
+				this.drawScatterSeries(e, t);
+				continue;
+			}
+			if (e.config.mode === "bar") {
+				this.drawBarSeries(e, t);
+				continue;
+			}
+			if (e.config.mode === "area") {
+				this.drawAreaSeries(e, t);
+				continue;
+			}
+			let n = e.visibleSampleCount(t), r = e.hasLOD && n > P;
+			if (r && this.renderer.supportsInstancedSegments) {
+				let n = e.copyMinMaxInstanced(t, this.minMaxInstanceData, this.maxMinMaxSegments());
+				if (n <= 0) continue;
+				this.renderer.updateFloatBuffer(this.minMaxInstanceBuffer, this.minMaxInstanceData), this.renderer.drawMinMaxSegmentsInstanced(this.minMaxInstanceBuffer, n, e.style, this.camera), this.recordRenderMode("minmax"), this.stats.pointsRendered += n * 2, this.stats.drawCalls++, this.stats.uploadBytes += this.minMaxInstanceData.byteLength;
+				continue;
+			}
+			let i = r ? e.copyMinMaxVisible(t, this.rawLineData, this.maxMinMaxSegments()) : e.copyRawVisible(t, this.rawLineData, P);
 			i < 2 || (this.renderer.updateFloatBuffer(this.rawLineBuffer, this.rawLineData), r ? (this.renderer.drawMinMaxSegments(this.rawLineBuffer, i, e.style, this.camera), this.recordRenderMode("minmax")) : (this.renderer.drawLineStrip(this.rawLineBuffer, i, e.style, this.camera), this.recordRenderMode("raw")), this.stats.pointsRendered += i, this.stats.drawCalls++, this.stats.uploadBytes += this.rawLineData.byteLength);
 		}
-		this.axisOverlay?.update(this.camera, this.axis), this.stats.frameMs = performance.now() - e;
+		this.axisOverlay?.update(this.camera, this.axis), this.stats.frameMs = performance.now() - e, this.refreshHover();
 	}
 	dispose() {
-		this.stop(), this.resizeObserver?.disconnect(), this.input.dispose(), this.axisOverlay?.dispose(), this.renderer.dispose(), this.layout.dispose();
+		this.stop(), this.resizeObserver?.disconnect(), this.canvas.removeEventListener("pointermove", this.handlePointerMove), this.canvas.removeEventListener("pointerleave", this.handlePointerLeave);
+		for (let e of this.pluginDisposers.splice(0)) e();
+		this.input.dispose(), this.axisOverlay?.dispose(), this.renderer.dispose(), this.layout.dispose();
 	}
 	applyCanvasSize(e = globalThis.devicePixelRatio) {
 		let t = Number.isFinite(e) ? Math.max(1, e) : 1, n = Math.max(1, Math.floor(this.canvas.clientWidth * t)), r = Math.max(1, Math.floor(this.canvas.clientHeight * t));
 		return this.canvas.width === n && this.canvas.height === r ? !1 : (this.canvas.width = n, this.canvas.height = r, !0);
 	}
+	drawAreaSeries(e, t) {
+		let n = e.style.baseline ?? 0, r = e.copyAreaVisible(t, this.rawLineData, F, n);
+		if (r < 4) return;
+		this.renderer.updateFloatBuffer(this.rawLineBuffer, this.rawLineData), this.renderer.drawAreaStrip(this.rawLineBuffer, r, e.style, this.camera), this.stats.pointsRendered += r, this.stats.drawCalls++, this.stats.uploadBytes += this.rawLineData.byteLength;
+		let i = this.uploadRawInstances(e, t, F);
+		i >= 2 && (this.renderer.drawLineStrip(this.rawLineBuffer, i, e.style, this.camera), this.stats.pointsRendered += i, this.stats.drawCalls++), this.recordRenderMode("area");
+	}
+	drawScatterSeries(e, t) {
+		let n = this.uploadRawInstances(e, t, P);
+		n <= 0 || (this.renderer.supportsInstancedPoints ? this.renderer.drawPointsInstanced(this.rawLineBuffer, n, e.style, this.camera, this.canvas.width, this.canvas.height) : this.renderer.drawPointSprites(this.rawLineBuffer, n, e.style, this.camera), this.recordInstancedDraw("points", n));
+	}
+	drawBarSeries(e, t) {
+		let n = e.visibleSampleCount(t);
+		if (e.hasLOD && n > P) {
+			let n = e.copyMinMaxInstanced(t, this.minMaxInstanceData, this.maxBarFallbackBars());
+			if (n <= 0) return;
+			this.includeBaselineInBarRanges(n, e.style.baseline ?? 0);
+			let r = this.writeBarBucketTriangles(n, t);
+			this.drawBarTriangleFallback(r, e.style);
+			return;
+		}
+		let r = this.uploadRawInstances(e, t, this.maxBarFallbackBars());
+		if (r <= 0) return;
+		if (this.renderer.supportsInstancedBars) {
+			this.renderer.drawBarsInstanced(this.rawLineBuffer, r, e.style, this.camera), this.recordInstancedDraw("bars", r);
+			return;
+		}
+		let i = this.writeBarTriangles(r, e.style.baseline ?? 0, e.style.barWidth ?? .8);
+		this.drawBarTriangleFallback(i, e.style);
+	}
+	uploadRawInstances(e, t, n) {
+		let r = e.copyRawVisible(t, this.rawLineData, n);
+		return r <= 0 ? 0 : (this.renderer.updateFloatBuffer(this.rawLineBuffer, this.rawLineData), this.stats.uploadBytes += this.rawLineData.byteLength, r);
+	}
+	includeBaselineInBarRanges(e, t) {
+		for (let n = 0; n < e; n++) {
+			let e = n * L, r = this.minMaxInstanceData[e + 1], i = this.minMaxInstanceData[e + 2];
+			this.minMaxInstanceData[e + 1] = Math.min(t, r), this.minMaxInstanceData[e + 2] = Math.max(t, i);
+		}
+	}
+	writeBarTriangles(e, t, n) {
+		let r = Math.min(e, this.maxBarFallbackBars());
+		for (let e = 0; e < r; e++) {
+			let r = this.rawLineData[e * 2], i = this.rawLineData[e * 2 + 1];
+			this.writeBarTriangle(e, r - n * .5, r + n * .5, t, i);
+		}
+		return r * 6;
+	}
+	writeBarBucketTriangles(e, t) {
+		let n = Math.min(e, this.maxBarFallbackBars()), r = (t.xMax - t.xMin) / Math.max(1, n);
+		for (let e = 0; e < n; e++) {
+			let i = this.minMaxInstanceData[e * 3 + 1], a = this.minMaxInstanceData[e * 3 + 2], o = t.xMin + e * r, s = e === n - 1 ? t.xMax : o + r;
+			this.writeBarTriangle(e, o, s, i, a);
+		}
+		return n * 6;
+	}
+	writeBarTriangle(e, t, n, r, i) {
+		let a = e * z;
+		this.barTriangleData[a] = t, this.barTriangleData[a + 1] = r, this.barTriangleData[a + 2] = n, this.barTriangleData[a + 3] = r, this.barTriangleData[a + 4] = t, this.barTriangleData[a + 5] = i, this.barTriangleData[a + 6] = t, this.barTriangleData[a + 7] = i, this.barTriangleData[a + 8] = n, this.barTriangleData[a + 9] = r, this.barTriangleData[a + 10] = n, this.barTriangleData[a + 11] = i;
+	}
+	drawBarTriangleFallback(e, t) {
+		e <= 0 || (this.renderer.updateFloatBuffer(this.barTriangleBuffer, this.barTriangleData), this.stats.uploadBytes += this.barTriangleData.byteLength, this.renderer.drawBarTriangles(this.barTriangleBuffer, e, t, this.camera), this.recordInstancedDraw("bars", e));
+	}
+	recordInstancedDraw(e, t) {
+		this.recordRenderMode(e), this.stats.pointsRendered += t, this.stats.drawCalls++;
+	}
+	findNearestXAnchor(e, t, n, r) {
+		let i = null, a = Infinity, o = n / (t.xMax - t.xMin);
+		for (let n of this.series) {
+			if (!n.visible) continue;
+			let r = n.nearestSampleByX(e, t);
+			if (!r) continue;
+			let s = Math.abs(r.x - e) * o;
+			s < a && (i = r, a = s);
+		}
+		return !i || a > r ? null : i.x;
+	}
+	findNearestPointAnchor(e, t, n, r, i, a) {
+		let o = null;
+		for (let a of this.series) {
+			if (!a.visible) continue;
+			let s = a.nearestSampleByPoint(e, t, n, r, i);
+			s && (!o || (s.distancePx ?? Infinity) < (o.distancePx ?? Infinity)) && (o = s);
+		}
+		return !o || (o.distancePx ?? Infinity) > a ? null : o.x;
+	}
+	collectPickItems(e, t, n, r, i) {
+		let a = [];
+		for (let o = 0; o < this.series.length; o++) {
+			let s = this.series[o];
+			if (!s.visible) continue;
+			let c = s.nearestSampleByX(e, r);
+			if (!c) continue;
+			let [l, u] = this.camera.toClip(c.x, c.y), [d, f] = this.camera.toScreen(l, u, i.width, i.height), p = i.left + d, m = i.top + f, h = p - t, g = m - n;
+			a.push({
+				...c,
+				distancePx: Math.hypot(h, g),
+				series: s,
+				seriesIndex: o,
+				id: s.config.id,
+				name: s.config.name,
+				mode: s.config.mode,
+				plotX: d,
+				plotY: f,
+				clientX: p,
+				clientY: m
+			});
+		}
+		return a;
+	}
+	refreshHover() {
+		this.pointerInPlot && this.emitHover(this.pick(this.lastPointerClientX, this.lastPointerClientY));
+	}
+	emitHover(e) {
+		this.currentHover = e;
+		for (let t of this.hoverSubscribers) t(e);
+	}
+	emitSeriesChange() {
+		for (let e of this.seriesSubscribers) e();
+		this.refreshHover();
+	}
+	drawDomTextForScreenshot(e, t, n) {
+		let r = this.layout.root.querySelectorAll("div");
+		for (let i of r) {
+			let r = i.textContent;
+			if (!r || i.children.length > 0) continue;
+			let a = getComputedStyle(i);
+			if (a.display === "none" || a.visibility === "hidden" || a.opacity === "0") continue;
+			let o = i.getBoundingClientRect();
+			o.width <= 0 || o.height <= 0 || (e.save(), e.scale(n, n), e.font = a.font, e.fillStyle = a.color, e.textBaseline = "top", e.textAlign = "left", e.fillText(r, o.left - t.left, o.top - t.top), e.restore());
+		}
+	}
+	maxMinMaxSegments() {
+		return Math.min(this.canvas.width, I);
+	}
+	maxBarFallbackBars() {
+		return Math.min(R, P);
+	}
 	writeGridVertices(e) {
 		let t = Math.max(1, this.canvas.clientWidth), n = Math.max(1, this.canvas.clientHeight);
 		this.axis.getXTickValues(t, 12, this.xTicks), this.axis.getYTickValues(n, 8, this.yTicks);
 		let r = 0;
 		for (let t of this.xTicks) {
-			if (r + 2 > _) return r;
+			if (r + 2 > B) return r;
 			this.gridData[r * 2] = t, this.gridData[r * 2 + 1] = e.yMin, r++, this.gridData[r * 2] = t, this.gridData[r * 2 + 1] = e.yMax, r++;
 		}
 		for (let t of this.yTicks) {
-			if (r + 2 > _) return r;
+			if (r + 2 > B) return r;
 			this.gridData[r * 2] = e.xMin, this.gridData[r * 2 + 1] = t, r++, this.gridData[r * 2] = e.xMax, this.gridData[r * 2 + 1] = t, r++;
 		}
 		return r;
@@ -911,7 +1655,7 @@ var y = class {
 	recordRenderMode(e) {
 		this.stats.renderMode === "none" ? this.stats.renderMode = e : this.stats.renderMode !== e && (this.stats.renderMode = "mixed");
 	}
-}, b = class {
+}, U = class {
 	xData;
 	yData;
 	constructor(e, t) {
@@ -953,6 +1697,6 @@ var y = class {
 	}
 };
 //#endregion
-export { p as AxisController, f as Camera2D, y as Chart, n as MinMaxPyramid, i as RingBuffer, r as SeriesStore, b as StaticDataset };
+export { j as AxisController, A as Camera2D, H as Chart, n as MinMaxPyramid, a as RingBuffer, i as SeriesStore, U as StaticDataset };
 
 //# sourceMappingURL=index.js.map