expose internal pubsub creator as uPlot.sync(key). close #354, #430.

demos/log-scales2.html

@@ -248,44 +248,6 @@
 
 
 
-		//	let negVals = vals.slice().reverse().map(v => -v);
-		//	let vals2 = negVals.concat(0, vals);
-
-			let vals7 = [-1000, -100, -10, -1, -0.1, -0.01, 0, 0.01, 0.1, 1, 10, 100, 1000];
-
-			let data7 = [
-				vals7.map((v, i) => i + 1),
-				vals7,
-			];
-
-
-
-			const opts7 = {
-				width: 1600,
-				height: 600,
-				title: "Hypersine Y Scale (-1000 -> 1000)",
-				scales: {
-					x: {
-						time: false,
-					},
-					y: {
-						distr: 4,
-						log: 10,
-					},
-				},
-				series: [
-					{},
-					{
-						stroke: "blue",
-						fill: "rgba(0,0,255,0.1)",
-					},
-				],
-			};
-
-			let u7 = new uPlot(opts7, vals7, document.body);
-
-
-
 			// https://bost.ocks.org/mike/shuffle/
 			function shuffle(array) {
 				var m = array.length, t, i;

demos/sync-cursor.html

@@ -17,6 +17,10 @@
 		<script src="../dist/uPlot.iife.js"></script>
 		<h2 id="wait">Loading lib....</h2>
 
+		<button id="sync">Disable Sync</button>
+
+		<br>
+
 		<script>
 			function round2(val) {
 				return Math.round(val * 100) / 100;
@@ -79,13 +83,15 @@ <h2 id="wait">Loading lib....</h2>
 			function makeChart(data) {
 				console.time('chart');
 
+				let mooSync = uPlot.sync("moo");
+
 				const cursorOpts = {
 					lock: true,
 					focus: {
 						prox: 16,
 					},
 					sync: {
-						key: "moo",
+						key: mooSync.key,
 						setSeries: true,
 					},
 				};
@@ -194,6 +200,28 @@ <h2 id="wait">Loading lib....</h2>
 
 				wait.textContent = "Done!";
 				console.timeEnd('chart');
+
+				let synced = true;
+				let syncBtn = document.getElementById('sync');
+
+				let fooSync = uPlot.sync("foo");
+
+				syncBtn.onclick = () => {
+					synced = !synced;
+
+					if (synced) {
+						mooSync.sub(uplot1);
+						mooSync.sub(uplot2);
+						mooSync.sub(uplot3);
+						syncBtn.textContent = 'Disable Sync';
+					}
+					else {
+						mooSync.unsub(uplot1);
+						mooSync.unsub(uplot2);
+						mooSync.unsub(uplot3);
+						syncBtn.textContent = 'Enable Sync';
+					}
+				}
 /*
 				setTimeout(() => {
 					uplot1.destroy();

dist/uPlot.cjs.js

@@ -1305,24 +1305,31 @@ const yScaleOpts = assign({}, xScaleOpts, {
 
 const syncs = {};
 
-function _sync(opts) {
-	let clients = [];
-
-	return {
-		sub(client) {
-			clients.push(client);
-		},
-		unsub(client) {
-			clients = clients.filter(c => c != client);
-		},
-		pub(type, self, x, y, w, h, i) {
-			if (clients.length > 1) {
-				clients.forEach(client => {
-					client != self && client.pub(type, self, x, y, w, h, i);
-				});
+function _sync(key, opts) {
+	let s = syncs[key];
+
+	if (!s) {
+		let clients = [];
+
+		s = {
+			key,
+			sub(client) {
+				clients.push(client);
+			},
+			unsub(client) {
+				clients = clients.filter(c => c != client);
+			},
+			pub(type, self, x, y, w, h, i) {
+				for (let i = 0; i < clients.length; i++)
+					clients[i] != self && clients[i].pub(type, self, x, y, w, h, i);
 			}
-		}
-	};
+		};
+
+		if (key != null)
+			syncs[key] = s;
+	}
+
+	return s;
 }
 
 function orient(u, seriesIdx, cb) {
@@ -4319,7 +4326,7 @@ function uPlot(opts, data, then) {
 
 	const syncKey = syncOpts.key;
 
-	const sync = (syncKey != null ? (syncs[syncKey] = syncs[syncKey] || _sync()) : _sync());
+	const sync = _sync(syncKey);
 
 	sync.sub(self);
 
@@ -4383,6 +4390,10 @@ uPlot.orient   = orient;
 	uPlot.tzDate  = tzDate;
 }
 
+{
+	uPlot.sync = _sync;
+}
+
 {
 	uPlot.addGap = addGap;
 	uPlot.clipGaps = clipGaps;

dist/uPlot.d.ts

@@ -130,6 +130,9 @@ declare class uPlot {
 
 	/** helper function for grabbing proper drawing orientation vars and fns for a plot instance (all dims in canvas pixels) */
 	static orient: (u: uPlot, seriesIdx: number, callback: uPlot.OrientCallback) => any;
+
+	/** returns a pub/sub instance shared by all plots usng the provided key */
+	static sync: (key: string) => uPlot.SyncPubSub;
 }
 
 export = uPlot;
@@ -346,6 +349,13 @@ declare namespace uPlot {
 		over?: boolean; // true
 	}
 
+	export interface SyncPubSub {
+		key:   string;
+		sub:   (client: uPlot) => void;
+		unsub: (client: uPlot) => void;
+		pub:   (type: string, client: uPlot, x: number, y: number, w: number, h: number, i: number) => void;
+	}
+
 	export namespace Cursor {
 		export type LeftTop              = [left: number, top: number];
 

dist/uPlot.esm.js

@@ -1303,24 +1303,31 @@ const yScaleOpts = assign({}, xScaleOpts, {
 
 const syncs = {};
 
-function _sync(opts) {
-	let clients = [];
-
-	return {
-		sub(client) {
-			clients.push(client);
-		},
-		unsub(client) {
-			clients = clients.filter(c => c != client);
-		},
-		pub(type, self, x, y, w, h, i) {
-			if (clients.length > 1) {
-				clients.forEach(client => {
-					client != self && client.pub(type, self, x, y, w, h, i);
-				});
+function _sync(key, opts) {
+	let s = syncs[key];
+
+	if (!s) {
+		let clients = [];
+
+		s = {
+			key,
+			sub(client) {
+				clients.push(client);
+			},
+			unsub(client) {
+				clients = clients.filter(c => c != client);
+			},
+			pub(type, self, x, y, w, h, i) {
+				for (let i = 0; i < clients.length; i++)
+					clients[i] != self && clients[i].pub(type, self, x, y, w, h, i);
 			}
-		}
-	};
+		};
+
+		if (key != null)
+			syncs[key] = s;
+	}
+
+	return s;
 }
 
 function orient(u, seriesIdx, cb) {
@@ -4317,7 +4324,7 @@ function uPlot(opts, data, then) {
 
 	const syncKey = syncOpts.key;
 
-	const sync = (syncKey != null ? (syncs[syncKey] = syncs[syncKey] || _sync()) : _sync());
+	const sync = _sync(syncKey);
 
 	sync.sub(self);
 
@@ -4381,6 +4388,10 @@ uPlot.orient   = orient;
 	uPlot.tzDate  = tzDate;
 }
 
+{
+	uPlot.sync = _sync;
+}
+
 {
 	uPlot.addGap = addGap;
 	uPlot.clipGaps = clipGaps;

dist/uPlot.iife.js

@@ -1306,24 +1306,31 @@ var uPlot = (function () {
 
 	var syncs = {};
 
-	function _sync(opts) {
-		var clients = [];
-
-		return {
-			sub: function sub(client) {
-				clients.push(client);
-			},
-			unsub: function unsub(client) {
-				clients = clients.filter(c => c != client);
-			},
-			pub: function pub(type, self, x, y, w, h, i) {
-				if (clients.length > 1) {
-					clients.forEach(client => {
-						client != self && client.pub(type, self, x, y, w, h, i);
-					});
+	function _sync(key, opts) {
+		var s = syncs[key];
+
+		if (!s) {
+			var clients = [];
+
+			s = {
+				key: key,
+				sub: function sub(client) {
+					clients.push(client);
+				},
+				unsub: function unsub(client) {
+					clients = clients.filter(c => c != client);
+				},
+				pub: function pub(type, self, x, y, w, h, i) {
+					for (var i$1 = 0; i$1 < clients.length; i$1++)
+						{ clients[i$1] != self && clients[i$1].pub(type, self, x, y, w, h, i$1); }
 				}
-			}
-		};
+			};
+
+			if (key != null)
+				{ syncs[key] = s; }
+		}
+
+		return s;
 	}
 
 	function orient(u, seriesIdx, cb) {
@@ -4345,7 +4352,7 @@ var uPlot = (function () {
 
 		var syncKey = syncOpts.key;
 
-		var sync = (syncKey != null ? (syncs[syncKey] = syncs[syncKey] || _sync()) : _sync());
+		var sync = _sync(syncKey);
 
 		sync.sub(self);
 
@@ -4409,6 +4416,10 @@ var uPlot = (function () {
 		uPlot.tzDate  = tzDate;
 	}
 
+	{
+		uPlot.sync = _sync;
+	}
+
 	{
 		uPlot.addGap = addGap;
 		uPlot.clipGaps = clipGaps;

package.json

@@ -40,7 +40,7 @@
   "homepage": "https://github.com/leeoniya/uPlot#readme",
   "devDependencies": {
     "@rollup/plugin-buble": "^0.21.3",
-    "rollup": "^2.38.5",
+    "rollup": "^2.39.0",
     "rollup-plugin-terser": "^7.0.2"
   }
 }

src/opts.js

@@ -525,7 +525,6 @@ export function numAxisSplits(self, axisIdx, scaleMin, scaleMax, foundIncr, foun
 	return splits;
 }
 
-// this doesnt work for sin, which needs to come off from 0 independently in pos and neg dirs
 export function logAxisSplits(self, axisIdx, scaleMin, scaleMax, foundIncr, foundSpace, forceMin) {
 	const splits = [];
 

src/sync.js

@@ -1,21 +1,28 @@
 export const syncs = {};
 
-export function _sync(opts) {
-	let clients = [];
+export function _sync(key, opts) {
+	let s = syncs[key];
 
-	return {
-		sub(client) {
-			clients.push(client);
-		},
-		unsub(client) {
-			clients = clients.filter(c => c != client);
-		},
-		pub(type, self, x, y, w, h, i) {
-			if (clients.length > 1) {
-				clients.forEach(client => {
-					client != self && client.pub(type, self, x, y, w, h, i);
-				});
+	if (!s) {
+		let clients = [];
+
+		s = {
+			key,
+			sub(client) {
+				clients.push(client);
+			},
+			unsub(client) {
+				clients = clients.filter(c => c != client);
+			},
+			pub(type, self, x, y, w, h, i) {
+				for (let i = 0; i < clients.length; i++)
+					clients[i] != self && clients[i].pub(type, self, x, y, w, h, i);
 			}
-		}
-	};
+		};
+
+		if (key != null)
+			syncs[key] = s;
+	}
+
+	return s;
 }