blazeplot 0.1.12 → 0.2.0

package/dist/index.js

@@ -149,7 +149,15 @@ var t = 16, n = class {
 function r(e) {
 	return "rangeMinMaxY" in e;
 }
-var i = class {
+function i(e) {
+	return "getOpen" in e && "getHigh" in e && "getLow" in e && "getClose" in e;
+}
+function a(e, t, n, r, i) {
+	if (n === e) return t;
+	let a = (i - e) / (n - e);
+	return t + (r - t) * a;
+}
+var o = class {
 	config;
 	style;
 	dataset;
@@ -244,65 +252,131 @@ var i = class {
 			distancePx: Math.sqrt(l)
 		} : null;
 	}
-	copyRawVisible(e, t, n) {
-		return this.copyVisibleSamples(e, t, n, "points", 0);
+	copyRawVisible(e, t, n, r = 0) {
+		return this.copyVisibleSamples(e, t, n, "points", 0, r);
+	}
+	copyRawVisibleClipped(e, t, n, r = 0) {
+		return this.copyClippedVisibleLine(e, t, n, r, "data");
+	}
+	copyRawVisibleClipSpace(e, t, n) {
+		return this.copyClippedVisibleLine(e, t, n, 0, "clip");
+	}
+	copyRawRange(e, t, n, r, i = 0) {
+		return this.copySampleRange(e, t, n, r, "points", 0, i);
 	}
-	copyAreaVisible(e, t, n, r = 0) {
-		return this.copyVisibleSamples(e, t, n, "area", r) * 2;
+	copyAreaVisible(e, t, n, r = 0, i = 0) {
+		return this.copyVisibleSamples(e, t, n, "area", r, i) * 2;
 	}
-	copyMinMaxVisible(e, t, n) {
-		return this.copyMinMaxSegments(e, t, n, "line-list") * 2;
+	copyAreaRange(e, t, n, r, i = 0, a = 0) {
+		return this.copySampleRange(e, t, n, r, "area", i, a) * 2;
 	}
-	copyMinMaxInstanced(e, t, n) {
-		return this.copyMinMaxSegments(e, t, n, "instanced");
+	copyMinMaxVisible(e, t, n, r = 0) {
+		return this.copyMinMaxSegments(e, t, n, "line-list", r) * 2;
 	}
-	visibleIndexRange(e) {
-		return e ? {
-			start: this.dataset.lowerBoundX(e.xMin),
-			end: this.dataset.upperBoundX(e.xMax)
-		} : {
+	copyMinMaxInstanced(e, t, n, r = 0) {
+		return this.copyMinMaxSegments(e, t, n, "instanced", r);
+	}
+	copyOhlcRange(e, t, n, r, a, o = 0) {
+		if (!i(this.dataset) || r <= 0 || n.length < r * 12) return 0;
+		let s = Math.max(0, Math.floor(e)), c = Math.min(this.dataset.length, Math.ceil(t)), l = Math.min(r, Math.max(0, c - s)), u = a * .5;
+		for (let e = 0; e < l; e++) {
+			let t = s + e, r = this.dataset.getX(t) - o, i = this.dataset.getOpen(t), a = this.dataset.getHigh(t), c = this.dataset.getLow(t), l = this.dataset.getClose(t), d = e * 12;
+			n[d] = r, n[d + 1] = c, n[d + 2] = r, n[d + 3] = a, n[d + 4] = r - u, n[d + 5] = i, n[d + 6] = r, n[d + 7] = i, n[d + 8] = r, n[d + 9] = l, n[d + 10] = r + u, n[d + 11] = l;
+		}
+		return l;
+	}
+	visibleIndexRange(e, t = 0) {
+		if (!e) return {
 			start: 0,
 			end: this.dataset.length
 		};
+		let n = Math.max(0, Math.floor(t));
+		return {
+			start: Math.max(0, this.dataset.lowerBoundX(e.xMin) - n),
+			end: Math.min(this.dataset.length, this.dataset.upperBoundX(e.xMax) + n)
+		};
 	}
-	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);
+	copyClippedVisibleLine(e, t, n, r, i) {
+		if (n <= 0 || t.length < n * 2) return 0;
+		let o = e.xMax - e.xMin, s = e.yMax - e.yMin;
+		if (i === "clip" && (o <= 0 || s <= 0)) return 0;
+		let c = Math.max(0, this.dataset.lowerBoundX(e.xMin) - 1), l = Math.min(this.dataset.length, this.dataset.upperBoundX(e.xMax) + 1);
+		if (l - c <= 0) return 0;
+		let u = 0, d = NaN, f = NaN, p = (a, c) => {
+			let l = i === "clip" ? (a - e.xMin) / o * 2 - 1 : a - r, p = i === "clip" ? (c - e.yMin) / s * 2 - 1 : c;
+			if (u > 0 && l === d && p === f) return !0;
+			if (u >= n) return !1;
+			let m = u * 2;
+			return t[m] = l, t[m + 1] = p, u++, d = l, f = p, !0;
+		};
+		if (l - c === 1) {
+			let t = this.dataset.getX(c);
+			return t < e.xMin || t > e.xMax ? 0 : p(t, this.dataset.getY(c)) ? u : 0;
+		}
+		for (let t = c; t + 1 < l; t++) {
+			let n = this.dataset.getX(t), r = this.dataset.getY(t), i = this.dataset.getX(t + 1), o = this.dataset.getY(t + 1);
+			if (i < e.xMin || n > e.xMax) continue;
+			let s = Math.max(n, e.xMin), c = Math.min(i, e.xMax);
+			if (c < s) continue;
+			let l = a(n, r, i, o, s), u = a(n, r, i, o, c);
+			if (!p(s, l) || !p(c, u)) break;
+		}
+		return u;
+	}
+	copyVisibleSamples(e, t, n, r, i, a) {
+		let o = r === "points" ? 2 : 4;
+		if (n <= 0 || t.length < n * o) return 0;
+		let s = this.dataset.lowerBoundX(e.xMin), c = this.dataset.upperBoundX(e.xMax), l = c - s;
+		if (l <= 0) return 0;
+		let u = Math.max(1, Math.ceil(l / n)), d = 0;
+		for (let e = s; e < c && d < n; e += u) {
+			let n = this.dataset.getX(e) - a, o = this.dataset.getY(e);
 			if (r === "points") {
-				let e = u * 2;
-				t[e] = n, t[e + 1] = a;
+				let e = d * 2;
+				t[e] = n, t[e + 1] = o;
+			} else {
+				let e = d * 4;
+				t[e] = n, t[e + 1] = i, t[e + 2] = n, t[e + 3] = o;
+			}
+			d++;
+		}
+		return d;
+	}
+	copySampleRange(e, t, n, r, i, a, o) {
+		let s = i === "points" ? 2 : 4;
+		if (r <= 0 || n.length < r * s) return 0;
+		let c = Math.max(0, Math.floor(e)), l = Math.min(this.dataset.length, Math.ceil(t)), u = Math.min(r, Math.max(0, l - c));
+		for (let e = 0; e < u; e++) {
+			let t = c + e, r = this.dataset.getX(t) - o, s = this.dataset.getY(t);
+			if (i === "points") {
+				let t = e * 2;
+				n[t] = r, n[t + 1] = s;
 			} else {
-				let e = u * 4;
-				t[e] = n, t[e + 1] = i, t[e + 2] = n, t[e + 3] = a;
+				let t = e * 4;
+				n[t] = r, n[t + 1] = a, n[t + 2] = r, n[t + 3] = s;
 			}
-			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;
+	copyMinMaxSegments(e, t, n, r, i) {
+		let a = r === "line-list" ? 4 : 3;
+		if (!this.pyramid || 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.min(n, c);
+		for (let e = 0; e < l; e++) {
+			let n = o + Math.floor(e * c / l), a = o + Math.max(Math.floor((e + 1) * c / l), Math.floor(e * c / l) + 1), u = Math.min(s, a), d = this.minMaxForRange(n, u);
+			if (!d) continue;
+			let f = this.dataset.getX(n + (u - n >> 1)) - i, { minY: p, maxY: m } = d;
 			if (r === "line-list") {
 				let n = e * 4;
-				t[n] = d, t[n + 1] = f, t[n + 2] = d, t[n + 3] = p;
+				t[n] = f, t[n + 1] = p, t[n + 2] = f, t[n + 3] = m;
 			} else {
 				let n = e * 3;
-				t[n] = d, t[n + 1] = f, t[n + 2] = p;
+				t[n] = f, t[n + 1] = p, t[n + 2] = m;
 			}
 		}
-		return c;
+		return l;
 	}
 	minMaxForRange(e, t) {
 		return this._useDatasetRangeMinMax && r(this.dataset) ? this.dataset.rangeMinMaxY(e, t) : !this.pyramid || this._useRawMinMaxScan ? this.rawMinMaxForRange(e, t) : this.pyramid.rangeMinMax(this.dataset, e, t);
@@ -340,7 +414,28 @@ var i = class {
 			maxY: o
 		};
 	}
-}, a = class e {
+};
+//#endregion
+//#region src/core/search.ts
+function s(e, t, n) {
+	let r = 0, i = e;
+	for (; r < i;) {
+		let e = r + (i - r >> 1);
+		t(e) < n ? r = e + 1 : i = e;
+	}
+	return r;
+}
+function c(e, t, n) {
+	let r = 0, i = e;
+	for (; r < i;) {
+		let e = r + (i - r >> 1);
+		t(e) <= n ? r = e + 1 : i = e;
+	}
+	return r;
+}
+//#endregion
+//#region src/core/RingBuffer.ts
+var l = class e {
 	capacity;
 	_length = 0;
 	_head = 0;
@@ -349,9 +444,10 @@ var i = class {
 	treeBase;
 	minTree;
 	maxTree;
-	constructor(t) {
+	overflow;
+	constructor(t, n = {}) {
 		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);
+		this.capacity = t, this.overflow = n.overflow ?? "wrap", 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;
@@ -363,20 +459,29 @@ var i = class {
 		};
 	}
 	push(e, t) {
+		if (this._length >= this.capacity) {
+			if (this.overflow === "drop-new") return;
+			if (this.overflow === "error") throw RangeError("RingBuffer capacity exceeded.");
+		}
 		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);
-		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;
+		if (!(n <= 0)) {
+			if (this.overflow !== "wrap") {
+				let r = this.capacity - this._length;
+				if (n > r && this.overflow === "error") throw RangeError("RingBuffer capacity exceeded.");
+				let i = Math.min(n, r);
+				if (i <= 0) return;
+				this.appendNoWrap(e, t, 0, i);
+				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;
+			}
+			this.appendNoWrap(e, t, 0, n);
 		}
 	}
 	get(e) {
@@ -392,20 +497,10 @@ var i = class {
 		return this.assertValidIndex(e), this.yData[this.logicalToPhysical(e)];
 	}
 	lowerBoundX(e) {
-		let t = 0, n = this._length;
-		for (; t < n;) {
-			let r = t + (n - t >> 1);
-			this.getX(r) < e ? t = r + 1 : n = r;
-		}
-		return t;
+		return s(this._length, (e) => this.getX(e), e);
 	}
 	upperBoundX(e) {
-		let t = 0, n = this._length;
-		for (; t < n;) {
-			let r = t + (n - t >> 1);
-			this.getX(r) <= e ? t = r + 1 : n = r;
-		}
-		return t;
+		return c(this._length, (e) => this.getX(e), e);
 	}
 	rangeMinMaxY(e, t) {
 		let n = Math.max(0, Math.floor(e)), r = Math.min(this._length, Math.ceil(t));
@@ -421,6 +516,13 @@ var i = class {
 	clear() {
 		this._length = 0, this._head = 0, this.minTree.fill(Infinity), this.maxTree.fill(-Infinity);
 	}
+	appendNoWrap(e, t, n, r) {
+		let i = n, a = r;
+		for (; a > 0;) {
+			let n = Math.min(a, this.capacity - this._head);
+			this.copyIntoPhysical(this._head, e, t, i, n), this._head = (this._head + n) % this.capacity, this._length = Math.min(this.capacity, this._length + n), i += n, a -= n;
+		}
+	}
 	copyIntoPhysical(e, t, n, r, i) {
 		for (let a = 0; a < i; a++) {
 			let i = e + a, o = n[r + a];
@@ -475,32 +577,32 @@ var i = class {
 	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", _ = {
+}, u = "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", d = "precision mediump float;\n\nuniform vec4 uColor;\n\nvoid main() {\n  gl_FragColor = uColor;\n}\n", f = "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", p = "precision mediump float;\n\nuniform vec4 uColor;\n\nvoid main() {\n  gl_FragColor = uColor;\n}\n", m = "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", h = "precision mediump float;\n\nuniform vec4 uColor;\n\nvoid main() {\n  gl_FragColor = uColor;\n}\n", g = "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", _ = "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", v = "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", y = "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", b = "precision mediump float;\n\nuniform vec4 uColor;\n\nvoid main() {\n  gl_FragColor = uColor;\n}\n", x = {
 	line: {
-		vert: o,
-		frag: s
+		vert: u,
+		frag: d
 	},
 	segment: {
-		vert: c,
-		frag: l
+		vert: f,
+		frag: p
 	},
 	point: {
-		vert: u,
-		frag: d
+		vert: m,
+		frag: h
 	},
 	pointSprite: {
-		vert: f,
-		frag: p
+		vert: g,
+		frag: _
 	},
 	bar: {
-		vert: m,
-		frag: g
+		vert: v,
+		frag: b
 	},
 	barRange: {
-		vert: h,
-		frag: g
+		vert: y,
+		frag: b
 	}
-}, v = 3, y = 2, b = 4, x = 4, S = .8, C = 0, ee = class {
+}, S = 3, C = 2, w = 4, T = 4, E = .8, ee = 0, te = class {
 	backend;
 	lineProgram;
 	segmentProgram;
@@ -514,8 +616,9 @@ var i = class {
 	scaleUniform = new Float32Array(2);
 	offsetUniform = new Float32Array(2);
 	canvasSizeUniform = new Float32Array(2);
+	xOrigin = 0;
 	constructor(e) {
-		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({
+		this.backend = e, this.lineProgram = this.backend.createProgram(x.line.vert, x.line.frag), this.segmentProgram = this.backend.createProgram(x.segment.vert, x.segment.frag), this.pointProgram = this.backend.createProgram(x.point.vert, x.point.frag), this.pointSpriteProgram = this.backend.createProgram(x.pointSprite.vert, x.pointSprite.frag), this.barProgram = this.backend.createProgram(x.bar.vert, x.bar.frag), this.barRangeProgram = this.backend.createProgram(x.barRange.vert, x.barRange.frag), this.segmentSelectBuffer = this.backend.createBuffer({
 			usage: "static",
 			type: "float",
 			length: 2
@@ -566,24 +669,34 @@ var i = class {
 			length: e
 		});
 	}
-	updateFloatBuffer(e, t) {
-		this.backend.updateBuffer(e, t);
+	updateFloatBuffer(e, t, n = t.length) {
+		let r = Math.max(0, Math.min(n, t.length));
+		this.backend.updateBuffer(e, r === t.length ? t : t.subarray(0, r));
 	}
 	viewport(e, t, n, r) {
 		this.backend.viewport(e, t, n, r);
 	}
+	setXOrigin(e) {
+		this.xOrigin = Number.isFinite(e) ? e : 0;
+	}
 	drawLines(e, t, n, r) {
 		this.drawLinePrimitive("lines", e, t, n, r);
 	}
 	drawLineStrip(e, t, n, r) {
 		this.drawLinePrimitive("line_strip", e, t, n, r);
 	}
+	drawClipLineStrip(e, t, n) {
+		this.drawClipPrimitive("line_strip", e, t, n);
+	}
+	drawClipLines(e, t, n) {
+		this.drawClipPrimitive("lines", e, t, n);
+	}
 	drawMinMaxSegments(e, t, n, r) {
 		this.drawLines(e, t, n, r);
 	}
 	drawMinMaxSegmentsInstanced(e, t, n, r) {
 		this.writeCameraUniforms(r);
-		let i = v * b, a = {
+		let i = S * w, a = {
 			buffer: e,
 			divisor: 1,
 			stride: i,
@@ -592,16 +705,16 @@ var i = class {
 			buffer: e,
 			divisor: 1,
 			stride: i,
-			offset: b
+			offset: w
 		}, s = {
 			buffer: e,
 			divisor: 1,
 			stride: i,
-			offset: b * 2
+			offset: w * 2
 		}, c = {
 			buffer: this.segmentSelectBuffer,
 			divisor: 0,
-			stride: b,
+			stride: w,
 			offset: 0
 		};
 		this.backend.draw({
@@ -622,18 +735,21 @@ var i = class {
 			}
 		});
 	}
+	drawPoints(e, t, n, r, i, a) {
+		this.supportsInstancedPoints ? this.drawPointsInstanced(e, t, n, r, i, a) : this.drawPointSprites(e, t, n, r);
+	}
 	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,
+			stride: C * w,
 			offset: 0,
 			size: 2
 		}, s = {
 			buffer: this.pointCornerBuffer,
 			divisor: 0,
-			stride: y * b,
+			stride: C * w,
 			offset: 0,
 			size: 2
 		};
@@ -650,7 +766,7 @@ var i = class {
 				uScale: this.scaleUniform,
 				uOffset: this.offsetUniform,
 				uCanvasSize: this.canvasSizeUniform,
-				uPointSize: n.pointSize ?? x,
+				uPointSize: n.pointSize ?? T,
 				uColor: n.color
 			}
 		});
@@ -664,7 +780,7 @@ var i = class {
 			uniforms: {
 				uScale: this.scaleUniform,
 				uOffset: this.offsetUniform,
-				uPointSize: n.pointSize ?? x,
+				uPointSize: n.pointSize ?? T,
 				uColor: n.color
 			}
 		});
@@ -687,13 +803,13 @@ var i = class {
 		let i = {
 			buffer: e,
 			divisor: 1,
-			stride: y * b,
+			stride: C * w,
 			offset: 0,
 			size: 2
 		}, a = {
 			buffer: this.barCornerBuffer,
 			divisor: 0,
-			stride: y * b,
+			stride: C * w,
 			offset: 0,
 			size: 2
 		};
@@ -709,15 +825,15 @@ var i = class {
 			uniforms: {
 				uScale: this.scaleUniform,
 				uOffset: this.offsetUniform,
-				uBarWidth: n.barWidth ?? S,
-				uBaseline: n.baseline ?? C,
+				uBarWidth: n.barWidth ?? E,
+				uBaseline: n.baseline ?? ee,
 				uColor: n.color
 			}
 		});
 	}
 	drawBarRangesInstanced(e, t, n, r) {
 		this.writeCameraUniforms(r);
-		let i = v * b, a = {
+		let i = S * w, a = {
 			buffer: e,
 			divisor: 1,
 			stride: i,
@@ -726,16 +842,16 @@ var i = class {
 			buffer: e,
 			divisor: 1,
 			stride: i,
-			offset: b
+			offset: w
 		}, s = {
 			buffer: e,
 			divisor: 1,
 			stride: i,
-			offset: b * 2
+			offset: w * 2
 		}, c = {
 			buffer: this.barCornerBuffer,
 			divisor: 0,
-			stride: y * b,
+			stride: C * w,
 			offset: 0,
 			size: 2
 		};
@@ -753,7 +869,7 @@ var i = class {
 			uniforms: {
 				uScale: this.scaleUniform,
 				uOffset: this.offsetUniform,
-				uBarWidth: n.barWidth ?? S,
+				uBarWidth: n.barWidth ?? E,
 				uColor: n.color
 			}
 		});
@@ -787,19 +903,33 @@ var i = class {
 			}
 		});
 	}
+	drawClipPrimitive(e, t, n, r) {
+		this.scaleUniform[0] = 1, this.scaleUniform[1] = 1, this.offsetUniform[0] = 0, this.offsetUniform[1] = 0, this.backend.draw({
+			program: this.lineProgram,
+			primitive: e,
+			count: n,
+			attributes: { position: t },
+			uniforms: {
+				uScale: this.scaleUniform,
+				uOffset: this.offsetUniform,
+				uColor: r.color
+			}
+		});
+	}
 	writeCameraUniforms(e) {
-		this.scaleUniform[0] = e.xScale, this.scaleUniform[1] = e.yScale, this.offsetUniform[0] = e.xOffset, this.offsetUniform[1] = e.yOffset;
+		let t = e.xMin - this.xOrigin, n = e.xMax - this.xOrigin;
+		this.scaleUniform[0] = e.xScale, this.scaleUniform[1] = e.yScale, this.offsetUniform[0] = -(t + n) / (n - t), this.offsetUniform[1] = e.yOffset;
 	}
 	dispose() {
 		this.backend.destroy();
 	}
-}, w = [
+}, D = [
 	1024,
 	4096,
 	16384,
 	32768,
 	131072
-], te = class {
+], O = class {
 	regl;
 	pool = [];
 	preAllocated = !1;
@@ -812,7 +942,7 @@ var i = class {
 	preAllocate() {
 		if (!this.preAllocated) {
 			this.preAllocated = !0;
-			for (let e of w) this.pool.push(this.createEntry(e, "stream"));
+			for (let e of D) this.pool.push(this.createEntry(e, "stream"));
 		}
 	}
 	acquire(e, t = "stream") {
@@ -852,17 +982,17 @@ var i = class {
 		return this.pool.find((t) => !t.inUse && t.floatCapacity >= e);
 	}
 	roundUp(e) {
-		for (let t of w) if (t >= e) return t;
-		let t = w[w.length - 1], n = 1 << 32 - Math.clz32(e - 1);
+		for (let t of D) if (t >= e) return t;
+		let t = D[D.length - 1], n = 1 << 32 - Math.clz32(e - 1);
 		return Math.max(t * 2, n);
 	}
 };
 //#endregion
 //#region src/render/ReglBackend.ts
-function ne(e) {
+function k(e) {
 	return e;
 }
-var T = class {
+var A = class {
 	gl;
 	regl;
 	resources;
@@ -882,10 +1012,10 @@ var T = class {
 		});
 		if (!n) throw Error("BlazePlot requires WebGL2, but this browser/context does not support it.");
 		this.gl = n, this.regl = e({
-			gl: ne(this.gl),
+			gl: k(this.gl),
 			extensions: [],
 			optionalExtensions: ["angle_instanced_arrays", "ext_disjoint_timer_query_webgl2"]
-		}), this.capabilities = { instancing: this.regl.hasExtension("angle_instanced_arrays") }, this.resources = new te(this.regl), this.resources.preAllocate();
+		}), this.capabilities = { instancing: this.regl.hasExtension("angle_instanced_arrays") }, this.resources = new O(this.regl), this.resources.preAllocate();
 	}
 	createBuffer(e) {
 		let { buffer: t } = this.resources.acquire(e.length, e.usage);
@@ -1004,7 +1134,7 @@ var T = class {
 			default: return e;
 		}
 	}
-}, E = class e {
+}, j = class e {
 	_xMin = 0;
 	_xMax = 1;
 	_yMin = 0;
@@ -1089,7 +1219,7 @@ var T = class {
 	static assertFinite(e, t) {
 		if (!Number.isFinite(t)) throw RangeError(`Camera2D ${e} must be finite.`);
 	}
-}, D = class {
+}, M = class {
 	camera;
 	constructor(e) {
 		this.camera = e;
@@ -1121,7 +1251,7 @@ var T = class {
 		let n = Math.max(0, -Math.floor(Math.log10(t)) + 2), r = Number(e.toFixed(n));
 		return Object.is(r, -0) ? 0 : r;
 	}
-}, O = class {
+}, N = class {
 	layout;
 	config;
 	options;
@@ -1168,7 +1298,7 @@ var T = class {
 			}
 		}
 	}
-}, k = class {
+}, ne = class {
 	root;
 	plot;
 	canvas;
@@ -1195,7 +1325,7 @@ var T = class {
 	applyBaseStyles() {
 		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";
 	}
-}, A = {
+}, P = {
 	backgroundColor: [
 		.08,
 		.1,
@@ -1258,39 +1388,39 @@ var T = class {
 	legendMutedTextColor: "#789",
 	legendFont: "11px/1.35 ui-monospace, monospace"
 };
-function j(e, t) {
-	if (!e) return A;
-	let n = M(e.backgroundColor, A.backgroundColor, t), r = e.seriesColors?.length ? e.seriesColors.map((e, n) => M(e, A.seriesColors[n % A.seriesColors.length], t)) : A.seriesColors;
+function F(e, t) {
+	if (!e) return P;
+	let n = I(e.backgroundColor, P.backgroundColor, t), r = e.seriesColors?.length ? e.seriesColors.map((e, n) => I(e, P.seriesColors[n % P.seriesColors.length], t)) : P.seriesColors;
 	return {
 		backgroundColor: n,
-		backgroundCssColor: N(e.backgroundColor, A.backgroundCssColor),
-		gridColor: M(e.gridColor, A.gridColor, t),
-		axisColor: e.axisColor ?? A.axisColor,
-		axisFont: e.axisFont ?? A.axisFont,
+		backgroundCssColor: L(e.backgroundColor, P.backgroundCssColor),
+		gridColor: I(e.gridColor, P.gridColor, t),
+		axisColor: e.axisColor ?? P.axisColor,
+		axisFont: e.axisFont ?? P.axisFont,
 		seriesColors: r,
-		tooltipBackgroundColor: e.tooltipBackgroundColor ?? A.tooltipBackgroundColor,
-		tooltipTextColor: e.tooltipTextColor ?? A.tooltipTextColor,
-		tooltipFont: e.tooltipFont ?? A.tooltipFont,
-		legendBackgroundColor: e.legendBackgroundColor ?? A.legendBackgroundColor,
-		legendBorderColor: e.legendBorderColor ?? A.legendBorderColor,
-		legendTextColor: e.legendTextColor ?? A.legendTextColor,
-		legendMutedTextColor: e.legendMutedTextColor ?? A.legendMutedTextColor,
-		legendFont: e.legendFont ?? A.legendFont
+		tooltipBackgroundColor: e.tooltipBackgroundColor ?? P.tooltipBackgroundColor,
+		tooltipTextColor: e.tooltipTextColor ?? P.tooltipTextColor,
+		tooltipFont: e.tooltipFont ?? P.tooltipFont,
+		legendBackgroundColor: e.legendBackgroundColor ?? P.legendBackgroundColor,
+		legendBorderColor: e.legendBorderColor ?? P.legendBorderColor,
+		legendTextColor: e.legendTextColor ?? P.legendTextColor,
+		legendMutedTextColor: e.legendMutedTextColor ?? P.legendMutedTextColor,
+		legendFont: e.legendFont ?? P.legendFont
 	};
 }
-function M(e, t, n) {
+function I(e, t, n) {
 	if (!e) return t;
 	if (typeof e != "string") return e;
-	let r = F(e, n), i = L(r ?? e, n);
-	return I(r ?? e) ?? I(i ?? "") ?? t;
+	let r = re(e, n), i = B(r ?? e, n);
+	return z(r ?? e) ?? z(i ?? "") ?? t;
 }
-function N(e, t) {
-	return e ? typeof e == "string" ? e : P(e) : t;
+function L(e, t) {
+	return e ? typeof e == "string" ? e : R(e) : t;
 }
-function P(e) {
+function R(e) {
 	return `rgba(${Math.round(e[0] * 255)}, ${Math.round(e[1] * 255)}, ${Math.round(e[2] * 255)}, ${e[3]})`;
 }
-function F(e, t) {
+function re(e, t) {
 	let n = t?.ownerDocument ?? globalThis.document;
 	if (!n?.documentElement || typeof getComputedStyle > "u") return null;
 	let r = t instanceof HTMLElement ? t : n.documentElement, i = n.createElement("span");
@@ -1298,11 +1428,11 @@ function F(e, t) {
 	let a = getComputedStyle(i).color;
 	return i.remove(), a || null;
 }
-function I(e) {
+function z(e) {
 	let t = e.trim();
-	return R(t) ?? z(t) ?? B(t);
+	return ie(t) ?? ae(t) ?? oe(t);
 }
-function L(e, t) {
+function B(e, t) {
 	let n = t?.ownerDocument ?? globalThis.document;
 	if (!n?.createElement) return null;
 	let r = n.createElement("canvas").getContext("2d");
@@ -1312,7 +1442,7 @@ function L(e, t) {
 	let a = String(r.fillStyle);
 	return a === i ? null : a;
 }
-function R(e) {
+function ie(e) {
 	let t = e.match(/^rgba?\((.*)\)$/i);
 	if (!t) return null;
 	let n = t[1].trim().split("/").map((e) => e.trim()), r = n[0], i = n[1], a = r.includes(",") ? r.split(",").map((e) => e.trim()).filter(Boolean) : r.split(/\s+/).filter(Boolean);
@@ -1325,7 +1455,7 @@ function R(e) {
 		l
 	];
 }
-function z(e) {
+function ae(e) {
 	let t = e.match(/^color\(\s*srgb\s+(.+)\)$/i);
 	if (!t) return null;
 	let n = t[1].split("/").map((e) => e.trim()), r = n[0].split(/\s+/).filter(Boolean);
@@ -1338,7 +1468,7 @@ function z(e) {
 		s
 	];
 }
-function B(e) {
+function oe(e) {
 	let t = e.startsWith("#") ? e.slice(1) : "";
 	if (![
 		3,
@@ -1368,7 +1498,7 @@ function W(e) {
 }
 //#endregion
 //#region src/ui/Chart.ts
-var G = 16384, K = G >> 1, q = G >> 1, J = 3, Y = 4096, X = 12, Z = 64;
+var G = 16384, K = G >> 1, q = G >> 1, J = 3, Y = 4096, X = 12, se = 12, Z = 64;
 function Q(e) {
 	return e === !1 ? {
 		visible: !1,
@@ -1405,7 +1535,7 @@ function $(e) {
 		y: Q(e.y)
 	};
 }
-var re = class {
+var ce = class {
 	options;
 	series = [];
 	camera;
@@ -1445,6 +1575,7 @@ var re = class {
 	lastPointerClientY = 0;
 	pointerInPlot = !1;
 	lastFrameAt = 0;
+	currentXOrigin = 0;
 	_rafId = 0;
 	handlePointerMove = (e) => {
 		this.pointerInPlot = !0, this.lastPointerClientX = e.clientX, this.lastPointerClientY = e.clientY, this.refreshHover();
@@ -1453,10 +1584,10 @@ var re = class {
 		this.pointerInPlot = !1, this.emitHover(null);
 	};
 	constructor(e, t = {}) {
-		this.options = t, this.resolvedTheme = j(t.theme, e), this.normalizedAxes = $(t.axes), this._gridVisible = t.grid !== !1, this.layout = new k(e, this.normalizedAxes), this.layout.root.style.background = this.resolvedTheme.backgroundCssColor, this.applyCanvasSize(), this.camera = new E(), this.axis = new D(this.camera), this.renderer = new ee(new T(this.layout.canvas)), this.rawLineData = new Float32Array(G * 2), this.rawLineBuffer = this.renderer.createFloatBuffer(this.rawLineData.length), this.minMaxInstanceData = new Float32Array(q * J), this.minMaxInstanceBuffer = this.renderer.createFloatBuffer(this.minMaxInstanceData.length), this.barTriangleData = new Float32Array(Y * X), this.barTriangleBuffer = this.renderer.createFloatBuffer(this.barTriangleData.length), this.gridData = new Float32Array(Z * 2), this.gridBuffer = this.renderer.createFloatBuffer(this.gridData.length), this.gridStyle = {
+		this.options = t, this.resolvedTheme = F(t.theme, e), this.normalizedAxes = $(t.axes), this._gridVisible = t.grid !== !1, this.layout = new ne(e, this.normalizedAxes), this.layout.root.style.background = this.resolvedTheme.backgroundCssColor, this.applyCanvasSize(), this.camera = new j(), this.axis = new M(this.camera), this.renderer = new te(new A(this.layout.canvas)), this.rawLineData = new Float32Array(G * 2), this.rawLineBuffer = this.renderer.createFloatBuffer(this.rawLineData.length), this.minMaxInstanceData = new Float32Array(q * J), this.minMaxInstanceBuffer = this.renderer.createFloatBuffer(this.minMaxInstanceData.length), this.barTriangleData = new Float32Array(Y * X), this.barTriangleBuffer = this.renderer.createFloatBuffer(this.barTriangleData.length), this.gridData = new Float32Array(Z * 2), this.gridBuffer = this.renderer.createFloatBuffer(this.gridData.length), this.gridStyle = {
 			color: t.gridStyle?.color ?? this.resolvedTheme.gridColor,
 			lineWidth: t.gridStyle?.lineWidth ?? 1
-		}, (this.normalizedAxes.x.visible || this.normalizedAxes.y.visible) && (this.axisOverlay = new O(this.layout, this.normalizedAxes, {
+		}, (this.normalizedAxes.x.visible || this.normalizedAxes.y.visible) && (this.axisOverlay = new N(this.layout, this.normalizedAxes, {
 			color: this.resolvedTheme.axisColor,
 			font: this.resolvedTheme.axisFont
 		})), 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));
@@ -1508,20 +1639,22 @@ var re = class {
 		this.camera.zoom(e), this.refreshHover();
 	}
 	addSeries(e, t) {
-		let n = e.dataset ?? new a(e.capacity), r = this.resolvedTheme.seriesColors, o = r[this.series.length % r.length] ?? this.resolvedTheme.seriesColors[0], s = t?.color ?? o, c = new i(n, e, {
-			color: s,
+		if (e.mode === "ohlc" && !e.dataset) throw TypeError("OHLC series require an OhlcDataset.");
+		let n = e.dataset ?? new l(e.capacity, { overflow: e.overflow }), r = this.resolvedTheme.seriesColors, i = r[this.series.length % r.length] ?? this.resolvedTheme.seriesColors[0], a = t?.color ?? i, s = new o(n, e, {
+			color: a,
 			lineWidth: t?.lineWidth ?? 1,
 			pointSize: t?.pointSize ?? 4,
 			barWidth: t?.barWidth ?? .8,
 			baseline: t?.baseline ?? 0,
 			fillColor: t?.fillColor ?? [
-				s[0],
-				s[1],
-				s[2],
-				s[3] * .25
-			]
+				a[0],
+				a[1],
+				a[2],
+				a[3] * .25
+			],
+			tickWidth: t?.tickWidth ?? t?.barWidth ?? .8
 		});
-		return this.series.push(c), this.emitSeriesChange(), c;
+		return this.series.push(s), this.emitSeriesChange(), s;
 	}
 	addLine(e, t) {
 		return this.addSeries({
@@ -1547,6 +1680,12 @@ var re = class {
 			mode: "bar"
 		}, t);
 	}
+	addOhlc(e, t) {
+		return this.addSeries({
+			...e,
+			mode: "ohlc"
+		}, t);
+	}
 	removeSeries(e) {
 		let t = this.series.indexOf(e);
 		return t === -1 ? !1 : (this.series.splice(t, 1), this.emitSeriesChange(), !0);
@@ -1598,7 +1737,7 @@ var re = class {
 		return this.seriesSubscribers.add(n), () => this.seriesSubscribers.delete(n);
 	}
 	setTheme(e) {
-		this.resolvedTheme = j(e, this.layout.root), this.applyTheme(), this.emitThemeChange(), this.refreshHover();
+		this.resolvedTheme = F(e, this.layout.root), this.applyTheme(), this.emitThemeChange(), this.refreshHover();
 	}
 	setGridVisible(e) {
 		this._gridVisible = e;
@@ -1607,7 +1746,7 @@ var re = class {
 		return this._gridVisible;
 	}
 	setAxes(e) {
-		this.normalizedAxes = $(e), this.layout.update(this.normalizedAxes), this.axisOverlay?.dispose(), this.axisOverlay = null, (this.normalizedAxes.x.visible || this.normalizedAxes.y.visible) && (this.axisOverlay = new O(this.layout, this.normalizedAxes, {
+		this.normalizedAxes = $(e), this.layout.update(this.normalizedAxes), this.axisOverlay?.dispose(), this.axisOverlay = null, (this.normalizedAxes.x.visible || this.normalizedAxes.y.visible) && (this.axisOverlay = new N(this.layout, this.normalizedAxes, {
 			color: this.resolvedTheme.axisColor,
 			font: this.resolvedTheme.axisFont
 		})), this.resize(), this.refreshHover();
@@ -1636,7 +1775,7 @@ var re = class {
 		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 s.fillStyle = e.background ?? P(this.resolvedTheme.backgroundColor), s.fillRect(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) => {
+		return s.fillStyle = e.background ?? R(this.resolvedTheme.backgroundColor), s.fillRect(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);
 		});
 	}
@@ -1655,34 +1794,11 @@ var re = class {
 		let [t, n, r, i] = this.resolvedTheme.backgroundColor;
 		this.renderer.viewport(0, 0, this.canvas.width, this.canvas.height), this.renderer.clear(t, n, r, i);
 		let a = this.camera.viewport;
-		if (this._gridVisible) {
+		if (this.currentXOrigin = a.xMin, this.renderer.setXOrigin(this.currentXOrigin), this._gridVisible) {
 			let e = this.writeGridVertices(a);
-			e > 0 && (this.renderer.updateFloatBuffer(this.gridBuffer, this.gridData), this.renderer.drawLines(this.gridBuffer, e, this.gridStyle, this.camera), this.stats.drawCalls++, this.stats.uploadBytes += this.gridData.byteLength);
-		}
-		for (let e of this.series) {
-			if (!e.visible) continue;
-			if (e.rebuildPyramid(), e.config.mode === "scatter") {
-				this.drawScatterSeries(e, a);
-				continue;
-			}
-			if (e.config.mode === "bar") {
-				this.drawBarSeries(e, a);
-				continue;
-			}
-			if (e.config.mode === "area") {
-				this.drawAreaSeries(e, a);
-				continue;
-			}
-			let t = e.visibleSampleCount(a), n = e.hasLOD && t > G;
-			if (n && this.renderer.supportsInstancedSegments) {
-				let t = e.copyMinMaxInstanced(a, this.minMaxInstanceData, this.maxMinMaxSegments());
-				if (t <= 0) continue;
-				this.renderer.updateFloatBuffer(this.minMaxInstanceBuffer, this.minMaxInstanceData), this.renderer.drawMinMaxSegmentsInstanced(this.minMaxInstanceBuffer, t, e.style, this.camera), this.recordRenderMode("minmax"), this.stats.pointsRendered += t * 2, this.stats.drawCalls++, this.stats.uploadBytes += this.minMaxInstanceData.byteLength;
-				continue;
-			}
-			let r = n ? e.copyMinMaxVisible(a, this.rawLineData, this.maxMinMaxSegments()) : e.copyRawVisible(a, this.rawLineData, G);
-			r < 2 || (this.renderer.updateFloatBuffer(this.rawLineBuffer, this.rawLineData), n ? (this.renderer.drawMinMaxSegments(this.rawLineBuffer, r, e.style, this.camera), this.recordRenderMode("minmax")) : (this.renderer.drawLineStrip(this.rawLineBuffer, r, e.style, this.camera), this.recordRenderMode("raw")), this.stats.pointsRendered += r, this.stats.drawCalls++, this.stats.uploadBytes += this.rawLineData.byteLength);
+			e > 0 && (this.uploadGridData(e), this.renderer.drawClipLines(this.gridBuffer, e, this.gridStyle), this.stats.drawCalls++);
 		}
+		for (let e of this.series) e.visible && (e.rebuildPyramid(), this.drawSeries(e, a));
 		this.axisOverlay?.update(this.camera, this.axis), this.stats.frameMs = performance.now() - e, this.refreshHover();
 	}
 	dispose() {
@@ -1703,39 +1819,106 @@ var re = class {
 		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);
 	}
+	drawSeries(e, t) {
+		switch (e.config.mode) {
+			case "area":
+				this.drawAreaSeries(e, t);
+				return;
+			case "bar":
+				this.drawBarSeries(e, t);
+				return;
+			case "ohlc":
+				this.drawOhlcSeries(e, t);
+				return;
+			case "scatter":
+				this.drawScatterSeries(e, t);
+				return;
+			default: this.drawLineSeries(e, t);
+		}
+	}
+	drawLineSeries(e, t) {
+		let n = e.visibleSampleCount(t), r = e.hasLOD && n > G - 2;
+		if (r && this.renderer.supportsInstancedSegments) {
+			let n = e.copyMinMaxInstanced(t, this.minMaxInstanceData, this.maxMinMaxSegments(), this.currentXOrigin);
+			if (n <= 0) return;
+			this.uploadMinMaxInstanceData(n), this.renderer.drawMinMaxSegmentsInstanced(this.minMaxInstanceBuffer, n, e.style, this.camera), this.recordDraw("minmax", n * 2);
+			return;
+		}
+		if (r) {
+			let n = e.copyMinMaxVisible(t, this.rawLineData, this.maxMinMaxSegments(), this.currentXOrigin);
+			if (n < 2) return;
+			this.uploadRawLineData(n), this.renderer.drawMinMaxSegments(this.rawLineBuffer, n, e.style, this.camera), this.recordDraw("minmax", n);
+			return;
+		}
+		let i = e.copyRawVisibleClipSpace(t, this.rawLineData, G);
+		i < 2 || (this.uploadRawLineData(i), this.renderer.drawClipLineStrip(this.rawLineBuffer, i, e.style), this.recordDraw("raw", i));
+	}
 	drawAreaSeries(e, t) {
-		let n = e.style.baseline ?? 0, r = e.copyAreaVisible(t, this.rawLineData, K, 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, K);
-		i >= 2 && (this.renderer.drawLineStrip(this.rawLineBuffer, i, e.style, this.camera), this.stats.pointsRendered += i, this.stats.drawCalls++), this.recordRenderMode("area");
+		let n = e.visibleIndexRange(t, 1);
+		if (n.end - n.start < 2) return;
+		let r = e.style.baseline ?? 0;
+		for (let t = n.start; t < n.end;) {
+			let i = e.copyAreaRange(t, n.end, this.rawLineData, K, r, this.currentXOrigin);
+			if (i < 4) break;
+			this.uploadRawLineData(i), this.renderer.drawAreaStrip(this.rawLineBuffer, i, e.style, this.camera), this.recordDraw("area", i), t += Math.max(1, (i >> 1) - 1);
+		}
+		for (let t = n.start; t < n.end;) {
+			let r = e.copyRawRange(t, n.end, this.rawLineData, K, this.currentXOrigin);
+			if (r < 2) break;
+			this.uploadRawLineData(r), this.renderer.drawLineStrip(this.rawLineBuffer, r, e.style, this.camera), this.recordDraw("area", r), t += Math.max(1, r - 1);
+		}
+	}
+	drawOhlcSeries(e, t) {
+		let n = e.visibleIndexRange(t), r = Math.floor(this.rawLineData.length / se);
+		for (let t = n.start; t < n.end;) {
+			let i = e.copyOhlcRange(t, n.end, this.rawLineData, r, e.style.tickWidth ?? e.style.barWidth ?? .8, this.currentXOrigin);
+			if (i <= 0) break;
+			let a = i * 6;
+			this.uploadRawLineData(a), this.renderer.drawLines(this.rawLineBuffer, a, e.style, this.camera), this.recordDraw("raw", a), t += i;
+		}
 	}
 	drawScatterSeries(e, t) {
-		let n = this.uploadRawInstances(e, t, G);
-		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));
+		let n = e.visibleIndexRange(t);
+		for (let t = n.start; t < n.end;) {
+			let r = e.copyRawRange(t, n.end, this.rawLineData, G, this.currentXOrigin);
+			if (r <= 0) break;
+			this.uploadRawLineData(r), this.renderer.drawPoints(this.rawLineBuffer, r, e.style, this.camera, this.canvas.width, this.canvas.height), this.recordDraw("points", r), t += r;
+		}
 	}
 	drawBarSeries(e, t) {
 		let n = e.visibleSampleCount(t), r = this.maxRawBarInstances();
 		if (e.hasLOD && n > r) {
-			let n = e.copyMinMaxInstanced(t, this.minMaxInstanceData, this.maxBarFallbackBars());
+			let n = e.copyMinMaxInstanced(t, this.minMaxInstanceData, this.maxBarTriangleBars(), this.currentXOrigin);
 			if (n <= 0) return;
 			this.includeBaselineInBarRanges(n, e.style.baseline ?? 0);
 			let r = this.writeBarBucketTriangles(n, t);
-			this.drawBarTriangleFallback(r, e.style);
+			this.drawBarTriangles(r, e.style);
 			return;
 		}
-		let i = this.uploadRawInstances(e, t, r);
-		if (i <= 0) return;
+		let i = e.visibleIndexRange(t, 1), a = e.copyRawRange(i.start, i.end, this.rawLineData, r, this.currentXOrigin);
+		if (a <= 0) return;
 		if (this.renderer.supportsInstancedBars) {
-			this.renderer.drawBarsInstanced(this.rawLineBuffer, i, e.style, this.camera), this.recordInstancedDraw("bars", i);
+			this.uploadRawLineData(a), this.renderer.drawBarsInstanced(this.rawLineBuffer, a, e.style, this.camera), this.recordDraw("bars", a);
 			return;
 		}
-		let a = this.writeBarTriangles(i, e.style.baseline ?? 0, e.style.barWidth ?? .8);
-		this.drawBarTriangleFallback(a, e.style);
+		let o = this.writeBarTriangles(a, e.style.baseline ?? 0, e.style.barWidth ?? .8);
+		this.drawBarTriangles(o, e.style);
+	}
+	uploadRawLineData(e) {
+		this.uploadFloatData(this.rawLineBuffer, this.rawLineData, e * 2);
+	}
+	uploadMinMaxInstanceData(e) {
+		this.uploadFloatData(this.minMaxInstanceBuffer, this.minMaxInstanceData, e * J);
 	}
-	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);
+	uploadBarTriangleData(e) {
+		this.uploadFloatData(this.barTriangleBuffer, this.barTriangleData, e * 2);
+	}
+	uploadGridData(e) {
+		this.uploadFloatData(this.gridBuffer, this.gridData, e * 2);
+	}
+	uploadFloatData(e, t, n) {
+		let r = Math.max(0, Math.min(n, t.length));
+		this.renderer.updateFloatBuffer(e, t, r), this.stats.uploadBytes += r * Float32Array.BYTES_PER_ELEMENT;
 	}
 	includeBaselineInBarRanges(e, t) {
 		for (let n = 0; n < e; n++) {
@@ -1744,7 +1927,7 @@ var re = class {
 		}
 	}
 	writeBarTriangles(e, t, n) {
-		let r = Math.min(e, this.maxBarFallbackBars());
+		let r = Math.min(e, this.maxBarTriangleBars());
 		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);
@@ -1752,7 +1935,7 @@ var re = class {
 		return r * 6;
 	}
 	writeBarBucketTriangles(e, t) {
-		let n = Math.min(e, this.maxBarFallbackBars());
+		let n = Math.min(e, this.maxBarTriangleBars());
 		for (let e = 0; e < n; e++) {
 			let r = this.minMaxInstanceData[e * 3 + 1], i = this.minMaxInstanceData[e * 3 + 2], [a, o] = this.barBucketBounds(e, n, t);
 			this.writeBarTriangle(e, a, o, r, i);
@@ -1760,27 +1943,27 @@ var re = class {
 		return n * 6;
 	}
 	barBucketBounds(e, t, n) {
-		let r = this.minMaxInstanceData[e * 3], i = n.xMax - n.xMin;
+		let r = this.minMaxInstanceData[e * 3], i = n.xMin - this.currentXOrigin, a = n.xMax - this.currentXOrigin, o = a - i;
 		if (t <= 1) {
-			let e = Math.max(0, i * .5);
-			return [Math.max(n.xMin, r - e), Math.min(n.xMax, r + e)];
+			let e = Math.max(0, o * .5);
+			return [Math.max(i, r - e), Math.min(a, r + e)];
 		}
-		let a = e > 0 ? this.minMaxInstanceData[(e - 1) * 3] : NaN, o = e + 1 < t ? this.minMaxInstanceData[(e + 1) * 3] : NaN, s = e === 0 ? r - (o - r) * .5 : (a + r) * .5, c = e + 1 === t ? r + (r - a) * .5 : (r + o) * .5;
-		if (!Number.isFinite(s) || !Number.isFinite(c) || c <= s) {
-			let r = i / Math.max(1, t);
-			s = n.xMin + e * r, c = e + 1 === t ? n.xMax : s + r;
+		let s = e > 0 ? this.minMaxInstanceData[(e - 1) * 3] : NaN, c = e + 1 < t ? this.minMaxInstanceData[(e + 1) * 3] : NaN, l = e === 0 ? r - (c - r) * .5 : (s + r) * .5, u = e + 1 === t ? r + (r - s) * .5 : (r + c) * .5;
+		if (!Number.isFinite(l) || !Number.isFinite(u) || u <= l) {
+			let n = o / Math.max(1, t);
+			l = i + e * n, u = e + 1 === t ? a : l + n;
 		}
-		return [Math.max(n.xMin, s), Math.min(n.xMax, c)];
+		return [Math.max(i, l), Math.min(a, u)];
 	}
 	writeBarTriangle(e, t, n, r, i) {
 		let a = e * X;
 		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));
+	drawBarTriangles(e, t) {
+		e <= 0 || (this.uploadBarTriangleData(e), this.renderer.drawBarTriangles(this.barTriangleBuffer, e, t, this.camera), this.recordDraw("bars", e));
 	}
-	recordInstancedDraw(e, t) {
-		this.recordRenderMode(e), this.stats.pointsRendered += t, this.stats.drawCalls++;
+	recordDraw(e, t, n = 1) {
+		this.recordRenderMode(e), this.stats.pointsRendered += t, this.stats.drawCalls += n;
 	}
 	findNearestXAnchor(e, t, n, r) {
 		let i = null, a = Infinity, o = n / (t.xMax - t.xMin);
@@ -1854,11 +2037,11 @@ var re = class {
 	maxMinMaxSegments() {
 		return Math.min(this.canvas.width, q);
 	}
-	maxBarFallbackBars() {
+	maxBarTriangleBars() {
 		return Math.min(Y, G);
 	}
 	maxRawBarInstances() {
-		return this.renderer.supportsInstancedBars ? G : this.maxBarFallbackBars();
+		return this.renderer.supportsInstancedBars ? G : this.maxBarTriangleBars();
 	}
 	writeGridVertices(e) {
 		let t = Math.max(1, this.canvas.clientWidth), n = Math.max(1, this.canvas.clientHeight);
@@ -1866,18 +2049,24 @@ var re = class {
 		let r = 0;
 		for (let t of this.xTicks) {
 			if (r + 2 > Z) 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++;
+			this.gridData[r * 2] = this.xToClip(t, e), this.gridData[r * 2 + 1] = -1, r++, this.gridData[r * 2] = this.xToClip(t, e), this.gridData[r * 2 + 1] = 1, r++;
 		}
 		for (let t of this.yTicks) {
 			if (r + 2 > Z) 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++;
+			this.gridData[r * 2] = -1, this.gridData[r * 2 + 1] = this.yToClip(t, e), r++, this.gridData[r * 2] = 1, this.gridData[r * 2 + 1] = this.yToClip(t, e), r++;
 		}
 		return r;
 	}
+	xToClip(e, t) {
+		return (e - t.xMin) / (t.xMax - t.xMin) * 2 - 1;
+	}
+	yToClip(e, t) {
+		return (e - t.yMin) / (t.yMax - t.yMin) * 2 - 1;
+	}
 	recordRenderMode(e) {
 		this.stats.renderMode === "none" ? this.stats.renderMode = e : this.stats.renderMode !== e && (this.stats.renderMode = "mixed");
 	}
-}, ie = class {
+}, le = class {
 	xData;
 	yData;
 	constructor(e, t) {
@@ -1899,26 +2088,135 @@ var re = class {
 		return this.assertValidIndex(e), this.yData[e];
 	}
 	lowerBoundX(e) {
-		let t = 0, n = this.length;
-		for (; t < n;) {
-			let r = t + (n - t >> 1);
-			this.xData[r] < e ? t = r + 1 : n = r;
-		}
-		return t;
+		return s(this.length, (e) => this.xData[e], e);
 	}
 	upperBoundX(e) {
-		let t = 0, n = this.length;
-		for (; t < n;) {
-			let r = t + (n - t >> 1);
-			this.xData[r] <= e ? t = r + 1 : n = r;
-		}
-		return t;
+		return c(this.length, (e) => this.xData[e], e);
 	}
 	assertValidIndex(e) {
 		if (!Number.isInteger(e) || e < 0 || e >= this.length) throw RangeError(`StaticDataset index out of range: ${e}`);
 	}
+}, ue = class {
+	length;
+	xs;
+	opens;
+	highs;
+	lows;
+	closes;
+	constructor(e, t, n, r, i) {
+		this.length = Math.min(e.length, t.length, n.length, r.length, i.length), this.xs = e, this.opens = t, this.highs = n, this.lows = r, this.closes = i;
+	}
+	get range() {
+		return this.length === 0 ? null : {
+			start: this.getX(0),
+			end: this.getX(this.length - 1)
+		};
+	}
+	getX(e) {
+		return this.assertValidIndex(e), this.xs[e];
+	}
+	getY(e) {
+		return this.getClose(e);
+	}
+	getOpen(e) {
+		return this.assertValidIndex(e), this.opens[e];
+	}
+	getHigh(e) {
+		return this.assertValidIndex(e), this.highs[e];
+	}
+	getLow(e) {
+		return this.assertValidIndex(e), this.lows[e];
+	}
+	getClose(e) {
+		return this.assertValidIndex(e), this.closes[e];
+	}
+	lowerBoundX(e) {
+		return s(this.length, (e) => this.xs[e], e);
+	}
+	upperBoundX(e) {
+		return c(this.length, (e) => this.xs[e], e);
+	}
+	assertValidIndex(e) {
+		if (!Number.isInteger(e) || e < 0 || e >= this.length) throw RangeError(`StaticOhlcDataset index out of range: ${e}`);
+	}
+}, de = class {
+	capacity;
+	overflow;
+	xData;
+	openData;
+	highData;
+	lowData;
+	closeData;
+	_length = 0;
+	_head = 0;
+	constructor(e, t = {}) {
+		if (!Number.isInteger(e) || e <= 0) throw RangeError("OhlcRingBuffer capacity must be a positive integer.");
+		this.capacity = e, this.overflow = t.overflow ?? "wrap", this.xData = new Float64Array(e), this.openData = new Float32Array(e), this.highData = new Float32Array(e), this.lowData = new Float32Array(e), this.closeData = new Float32Array(e);
+	}
+	get length() {
+		return this._length;
+	}
+	get range() {
+		return this._length === 0 ? null : {
+			start: this.getX(0),
+			end: this.getX(this._length - 1)
+		};
+	}
+	push(e, t, n, r, i) {
+		if (this._length >= this.capacity) {
+			if (this.overflow === "drop-new") return;
+			if (this.overflow === "error") throw RangeError("OhlcRingBuffer capacity exceeded.");
+		}
+		this.xData[this._head] = e, this.openData[this._head] = t, this.highData[this._head] = n, this.lowData[this._head] = r, this.closeData[this._head] = i, this._head = (this._head + 1) % this.capacity, this._length < this.capacity && this._length++;
+	}
+	append(e, t, n, r, i) {
+		let a = Math.min(e.length, t.length, n.length, r.length, i.length);
+		if (a <= 0) return;
+		if (this.overflow !== "wrap") {
+			let o = this.capacity - this._length;
+			if (a > o && this.overflow === "error") throw RangeError("OhlcRingBuffer capacity exceeded.");
+			let s = Math.min(a, o);
+			for (let a = 0; a < s; a++) this.push(e[a], t[a], n[a], r[a], i[a]);
+			return;
+		}
+		let o = Math.max(0, a - this.capacity);
+		for (let s = o; s < a; s++) this.push(e[s], t[s], n[s], r[s], i[s]);
+	}
+	clear() {
+		this._length = 0, this._head = 0;
+	}
+	getX(e) {
+		return this.assertValidIndex(e), this.xData[this.logicalToPhysical(e)];
+	}
+	getY(e) {
+		return this.getClose(e);
+	}
+	getOpen(e) {
+		return this.assertValidIndex(e), this.openData[this.logicalToPhysical(e)];
+	}
+	getHigh(e) {
+		return this.assertValidIndex(e), this.highData[this.logicalToPhysical(e)];
+	}
+	getLow(e) {
+		return this.assertValidIndex(e), this.lowData[this.logicalToPhysical(e)];
+	}
+	getClose(e) {
+		return this.assertValidIndex(e), this.closeData[this.logicalToPhysical(e)];
+	}
+	lowerBoundX(e) {
+		return s(this._length, (e) => this.getX(e), e);
+	}
+	upperBoundX(e) {
+		return c(this._length, (e) => this.getX(e), e);
+	}
+	logicalToPhysical(e) {
+		return (this._head - this._length + e + this.capacity) % this.capacity;
+	}
+	assertValidIndex(e) {
+		if (!Number.isInteger(e) || e < 0 || e >= this._length) throw RangeError(`OhlcRingBuffer index out of range: ${e}`);
+	}
 };
 //#endregion
-export { D as AxisController, E as Camera2D, re as Chart, A as DEFAULT_CHART_THEME, n as MinMaxPyramid, a as RingBuffer, i as SeriesStore, ie as StaticDataset };
+export { M as AxisController, j as Camera2D, ce as Chart, P as DEFAULT_CHART_THEME, n as MinMaxPyramid, de as OhlcRingBuffer, l as RingBuffer, o as SeriesStore, le as StaticDataset, ue as StaticOhlcDataset };
 
 //# sourceMappingURL=index.js.map