mascot-vis 1.10.0 → 1.11.0

package/dist/mascot.js

@@ -1,5 +1,5 @@
 /* eslint-disable */
-// version: 1.10.0
+// version: 1.11.0
 (function (global, factory) {
 	typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('d3'), require('pixi.js')) :
 	typeof define === 'function' && define.amd ? define(['exports', 'd3', 'pixi.js'], factory) :
@@ -256,7 +256,8 @@
 		INCORRECT_CONSTRAINT_INFO: "Constrain information is incorreclty passed",
 		FEATURE_NOT_IMPLEMENTED: "This feature has not been implemented yet",
 		LAYOUT_WITHOUT_TREE: "The layout can only be applied to a tree",
-		UNSUPPORTED_FIELDTYPE: "Unsupported field type for encoding "
+		UNSUPPORTED_FIELDTYPE: "Unsupported field type for encoding ",
+		CANNOT_CLASSIFY: "Cannot classify items in "
 	};
 
 	class Layout {
@@ -284,6 +285,8 @@
 			this._colGap = "colGap" in args && args["colGap"] !== undefined ? args["colGap"] : 5;
 			this._cellHorzAlignment = "horzCellAlignment" in args && this._validateCellAlignment("h", args["horzCellAlignment"]) ? args["horzCellAlignment"] : Alignment.Left;
 			this._cellVertAlignment = "vertCellAlignment" in args && this._validateCellAlignment("v", args["vertCellAlignment"]) ? args["vertCellAlignment"] : Alignment.Bottom;
+			if (!this._numCols && !this._numRows)
+				this._numRows = 1;
 		}
 
 		_validateCellAlignment(orientation, v) {
@@ -651,6 +654,20 @@
 		get horzCellAlignment() {
 			return this._cellHorzAlignment;
 		}
+
+		//accepts two formats: a two-element array, or a string
+		set direction(d) {
+			if (Array.isArray(d) && d.length === 2) {
+				this._dir = d;
+			} else {
+				this._dir = d.split("_");
+			}
+			this.run();
+		}
+
+		get direction() {
+			return this._dir.join("_");
+		}
 	}
 
 	GridLayout.direction = {
@@ -3520,6 +3537,11 @@
 			this._updateBounds();
 		}
 
+		set area(a) {
+			this.attrs["radius"] = Math.sqrt(a);
+			this._updateBounds();
+		}
+
 		// set width(w) {
 		// 	this.attrs["radius"] = w/2;
 		// 	this._updateBounds();
@@ -3606,7 +3628,7 @@
 
 					//TODO: check if item width has already been encoded with a different field
 					//the code below assumes width hasn't been bound to data
-					scale._setRange([0, Math.max(...(items.map(d => d.width)))]);
+					scale._setRange([0, this.rangeExtent ? this.rangeExtent : Math.max(...(items.map(d => d.width)))]);
 				} else {
 					// let top = Math.min(...(items.map(d => d.bounds.top))),
 					// 	bottom = Math.max(...(items.map(d => d.bounds.bottom)));
@@ -3614,7 +3636,7 @@
 
 					//TODO: check if item height has already been encoded with a different field
 					//the code below assumes height hasn't been bound to data
-					scale._setRange([0, Math.max(...(items.map(d => d.height)))]);
+					scale._setRange([0, this.rangeExtent ? this.rangeExtent : Math.max(...(items.map(d => d.height)))]);
 				}
 			} else {
 				scale.domain = [0, Math.max(...data)];
@@ -4389,6 +4411,9 @@
 					extent = Math.max(...this.areas.map(d => d.bounds.height));
 				}
 			}
+			
+			if (this.rangeExtent)
+				extent = this.rangeExtent;
 
 			if (min < 0) {
 				scale._scale.domain([min, max]);
@@ -4955,7 +4980,7 @@
 				} else {
 					let items = getPeers(item, this.scene);
 					//TODO: handle cases where items are aligned top
-					let offset = Math.min(...items.map(d => d.refBounds.bottom));
+					let offset = Math.max(...items.map(d => d.refBounds.bottom));
 					return [offset, offset - this.scale.rangeExtent];
 				}
 			} else if (this.channel == "radialDistance") {
@@ -5303,6 +5328,7 @@
 					r.push(f);
 				}
 			}
+			r.sort((a,b) => this.getUniqueFieldValues(a).length - this.getUniqueFieldValues(b).length);
 			return r;
 		}
 
@@ -8183,7 +8209,7 @@
 			gl.forEach(l => l.updateLinePositions());
 	    },
 
-	    layoutChanged: function(item, peers, reGenerateAxes) {
+	    layoutChanged: function(item, peers, props) {
 	        let scene = item.getScene();
 	        scene._relayoutAncestors(item, peers);
 
@@ -8195,6 +8221,36 @@
 	        for (let i of items)
 				i.getScene()._reapplyConstraints(i);
 
+	        let reGenerateAxes = false;
+	        for (let p of props) {
+	            if (["numRows", "numCols", "layout", "childrenOrder"].indexOf(p) >= 0) {
+	                reGenerateAxes = true;
+	                break;
+	            }
+	        }
+
+	        //if grid layout changes to a single column or row, or stack layout's orientation changes, update axis channel
+	        let updateChannel = false, channel;
+	        if (item.layout) {
+	            if (item.layout.type === LayoutType.Grid && (item.layout.numRows === 1 || item.layout.numCols === 1)) {
+	                updateChannel = true;
+	                channel = item.layout.numRows === 1 ? "x" : "y";
+	            } else if (item.layout.type === LayoutType.Stack && props.indexOf("orientation") >= 0) {
+	                updateChannel = true;
+	                channel = item.layout.orientation === Orientation.Horizontal ? "x" : "y";
+	            }
+	        }
+	        if (updateChannel) {
+	            let axes = scene.getRelatedAxes(item).filter(d => d instanceof LayoutAxis && d._item.parent.classId === item.classId);
+	            for (let a of axes) {
+	                scene.removeItem(a);
+	                let args = a.toJSON().args;
+	                delete args["orientation"];
+	                args.item = item.firstChild;
+	                scene.axis(channel, a.field, args);
+	            }
+	        }
+	        
 	        if (reGenerateAxes) {
 	            scene.reCreateRelatedAxes(item);
 	        } else {
@@ -8231,8 +8287,8 @@
 	            let axes = enc.scene.getRelatedAxes(item);
 	            for (let a of axes) {
 	                if (a.encoding && a.encoding.scale === scale) {
-	                    a.tickValues = enc.scene._inferTickValues(enc);
-	                    a.labelValues = enc.scene._inferTickValues(enc);
+	                    a.tickValues = enc._inferTickValues(enc);
+	                    a.labelValues = enc._inferTickValues(enc);
 	                    a._positionPath();
 	                    if (a._showTitle)
 	                        a._positionTitle();
@@ -8985,6 +9041,42 @@
 	    }
 	}
 
+	function classifyCollectionChildren(scene, c, field, layout) {
+	    let peers = getPeers(c, scene);
+	    for (let p of peers) {
+	        let collections = {}, cid, items = p.children;
+	        for (let item of items) {
+	            let v = item.dataScope.getFieldValue(field);
+	            if (!(v in collections)) {
+	                collections[v] = [];
+	            }
+	            collections[v].push(item);
+	        }
+	        let tbl = items[0].dataScope._dt; //results = []; //,
+	        for (let v in collections) {
+	            let coll = scene.collection();
+	            p.addChild(coll);
+	            if (cid === undefined)
+	                cid = coll.id;
+	            coll.classId = cid;
+	            coll.dataScope = p.dataScope ? p.dataScope.cross(field, v) : new DataScope(tbl).cross(field, v);
+	            for (let c of collections[v]) {
+	                coll.addChild(c);
+	            }
+	            // if (layout)
+	            //     coll.layout = layout;
+	            //results.push(coll);
+	        }
+	        // if (oldParent.children.length === 0) {
+	        //     oldParent.parent.removeChild(oldParent);
+	        // }
+	    }
+
+	    if (layout)
+	            scene.setProperties(c.firstChild, {layout: layout});
+	    //return results;
+	}
+
 	class Scene extends Group{
 
 		constructor(args){
@@ -9233,6 +9325,23 @@
 			return collection;
 		}
 
+		classify(item, param){
+			if (!canClassify(item)){
+				throw Errors.CANNOT_CLASSIFY + item.type;
+			}
+
+			let args = param ? param : {},
+				field = args["field"] ? args["field"] : DataTable.RowID,
+				dt = item.firstChild.dataScope.dataTable,
+				layout = args.layout;
+			validateField(field, dt);
+					
+			classifyCollectionChildren(this, item, field, layout);
+
+			//SceneValidator.markDivided(item, collection);
+			return item;
+		}
+
 		_validateEncodeArgs(item, args) {
 			if (!item || !("channel" in args) || !("field" in args)) {
 				throw Errors.INCOMPLETE_BINDING_INFO;
@@ -9777,36 +9886,6 @@
 				p[method](...args);
 		}
 
-		classify(items, field, parent){
-			let collections = {}, cid, oldParent = items[0].parent;
-			for (let item of items) {
-				let v = item.dataScope.getFieldValue(field);
-				if (!(v in collections)) {
-					collections[v] = [];
-				}
-				collections[v].push(item);
-			}
-			let results = [], tbl = items[0].dataScope._dt;
-			for (let v in collections) {
-				let coll = this.collection();
-				parent.addChild(coll);
-				if (cid === undefined)
-					cid = coll.id;
-				coll.classId = cid;
-				coll.dataScope = new DataScope(tbl).cross(field, v);
-				for (let c of collections[v]) {
-					coll.addChild(c);
-				}
-				results.push(coll);
-			}
-
-			if (oldParent.children.length === 0) {
-				oldParent.parent.removeChild(oldParent);
-			}
-
-			return results;
-		}
-
 		getEncodingByItem(item, channel) {
 			let enc = this.encodings[getEncodingKey(item)];
 			if (enc && enc[channel]) {
@@ -9923,6 +10002,7 @@
 				}
 			}
 
+			//invoke SceneValidator accordingly
 			let props = Object.keys(result).filter(d => result[d]);
 			let sizeProps = ["width", "height", "fontSize", "area", "radius"];
 			for (let s of sizeProps) {
@@ -9931,17 +10011,15 @@
 					break;
 				}
 			}
+
 			if (props.indexOf("baseline") >=0 && item.type === ItemType.Area)
 				SceneValidator.areaRebased(item, peers);
 
-			let layoutProps = ["layout", "rowGap", "colGap", "numRows", "numCols", "vertCellAlignment", "horzCellAlignment"];
-			for (let l of layoutProps) {
-				if (props.indexOf(l) >= 0) {
-					let reGenerateAxes = (props.indexOf("numRows") >= 0 || props.indexOf("numCols") >= 0 || props.indexOf("layout") >= 0);
-					SceneValidator.layoutChanged(peers[0], peers, reGenerateAxes);
-					break;
-				}
-			}
+			let layoutProps = ["layout", "rowGap", "colGap", "numRows", "numCols", "orientation", "vertCellAlignment", "horzCellAlignment", "direction", "childrenOrder"];
+			let changed = props.filter(d => layoutProps.indexOf(d) >= 0);
+			if (changed.length > 0)
+				SceneValidator.layoutChanged(peers[0], peers, changed);
+
 			return result;
 			//TODO: relayout if needed (typically Layout or setProperty should happen before encoding)
 		}
@@ -24023,6 +24101,20 @@
 		}
 	}
 
+	function canClassify(item) {
+		if (item.type !== ItemType.Collection) return false;
+		if (item.children.length < 2) return false;
+		// if (!Array.isArray(items)) return false;
+		// if (items.length < 1) return false;
+		// for (let i of items) {
+		// 	if (!i.dataScope)
+		// 		return false;
+		// }
+		// let tbls = uniqueStrings(items.map(d => d.dataScope.dataTable.name));
+		// if (tbls.length > 1) return false;
+		return true;
+	}
+
 	function getPeersInScene(item) {
 		if (item.type == "vertex" || item.type == "segment") {
 			return getPeers(item, item.parent.getScene());
@@ -24031,6 +24123,7 @@
 		}
 	}
 
+	exports.canClassify = canClassify;
 	exports.canDensify = canDensify;
 	exports.canDivide = canDivide;
 	exports.canRepeat = canRepeat;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "mascot-vis",
-	"version": "1.10.0",
+	"version": "1.11.0",
 	"description": "Manipulable Semantic Components in Data Visualization",
 	"scripts": {
 		"build": "rollup --config",