diff --git a/notes/.obsidian/community-plugins.json b/notes/.obsidian/community-plugins.json index fc7287b..7af11a7 100644 --- a/notes/.obsidian/community-plugins.json +++ b/notes/.obsidian/community-plugins.json @@ -21,5 +21,6 @@ "obsidian-plugin-toc", "templater-obsidian", "wikilinks-to-mdlinks-obsidian", - "obsidian-outliner" + "obsidian-outliner", + "obsidian-chartsview-plugin" ] \ No newline at end of file diff --git a/notes/.obsidian/graph.json b/notes/.obsidian/graph.json index 3957f77..b31072e 100644 --- a/notes/.obsidian/graph.json +++ b/notes/.obsidian/graph.json @@ -6,7 +6,78 @@ "hideUnresolved": false, "showOrphans": true, "collapse-color-groups": true, - "colorGroups": [], + "colorGroups": [ + { + "query": "tag:#ang", + "color": { + "a": 1, + "rgb": 14701138 + } + }, + { + "query": "tag:#cjl", + "color": { + "a": 1, + "rgb": 14725458 + } + }, + { + "query": "tag:#dej", + "color": { + "a": 1, + "rgb": 11657298 + } + }, + { + "query": "tag:#ech", + "color": { + "a": 1, + "rgb": 5431378 + } + }, + { + "query": "tag:#ele", + "color": { + "a": 1, + "rgb": 5431473 + } + }, + { + "query": "tag:#fyz", + "color": { + "a": 1, + "rgb": 5419488 + } + }, + { + "query": "tag:#har", + "color": { + "a": 1, + "rgb": 5395168 + } + }, + { + "query": "tag:#mat", + "color": { + "a": 1, + "rgb": 11621088 + } + }, + { + "query": "tag:#pdv", + "color": { + "a": 1, + "rgb": 14701233 + } + }, + { + "query": "tag:#psi", + "color": { + "a": 1, + "rgb": 14701138 + } + } + ], "collapse-display": true, "showArrow": false, "textFadeMultiplier": 0, @@ -17,6 +88,6 @@ "repelStrength": 10, "linkStrength": 1, "linkDistance": 250, - "scale": 0.6063411463646815, + "scale": 0.3261259188879479, "close": false } \ No newline at end of file diff --git a/notes/.obsidian/plugins/obsidian-chartsview-plugin/main.js b/notes/.obsidian/plugins/obsidian-chartsview-plugin/main.js new file mode 100644 index 0000000..0f4813f --- /dev/null +++ b/notes/.obsidian/plugins/obsidian-chartsview-plugin/main.js @@ -0,0 +1,176163 @@ +/* +THIS IS A GENERATED/BUNDLED FILE BY ROLLUP +if you want to view the source visit the plugins github repository +*/ + +'use strict'; + +var obsidian = require('obsidian'); + +var Shape$2 = /*#__PURE__*/Object.freeze({ + __proto__: null, + get Base () { return ShapeBase$3; }, + get Circle () { return Circle$4; }, + get Ellipse () { return Ellipse$3; }, + get Image () { return ImageShape$1; }, + get Line () { return Line$8; }, + get Marker () { return Marker$4; }, + get Path () { return Path$4; }, + get Polygon () { return Polygon$4; }, + get Polyline () { return PolyLine$1; }, + get Rect () { return Rect$4; }, + get Text () { return Text$3; } +}); +var Shape$1 = /*#__PURE__*/Object.freeze({ + __proto__: null, + get Base () { return ShapeBase$1; }, + get Circle () { return Circle$2; }, + get Dom () { return Dom$1; }, + get Ellipse () { return Ellipse$1; }, + get Image () { return Image$2; }, + get Line () { return Line$6; }, + get Marker () { return Marker$2; }, + get Path () { return Path$2; }, + get Polygon () { return Polygon$2; }, + get Polyline () { return Polyline$1; }, + get Rect () { return Rect$2; }, + get Text () { return Text$1; } +}); + +/*! ***************************************************************************** +Copyright (c) Microsoft Corporation. + +Permission to use, copy, modify, and/or distribute this software for any +purpose with or without fee is hereby granted. + +THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH +REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY +AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, +INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM +LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR +OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR +PERFORMANCE OF THIS SOFTWARE. +***************************************************************************** */ +/* global Reflect, Promise */ + +var extendStatics$2 = function(d, b) { + extendStatics$2 = Object.setPrototypeOf || + ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) || + function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; }; + return extendStatics$2(d, b); +}; + +function __extends$e(d, b) { + if (typeof b !== "function" && b !== null) + throw new TypeError("Class extends value " + String(b) + " is not a constructor or null"); + extendStatics$2(d, b); + function __() { this.constructor = d; } + d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); +} + +var __assign$r = function() { + __assign$r = Object.assign || function __assign(t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; + } + return t; + }; + return __assign$r.apply(this, arguments); +}; + +function __rest$G(s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +} + +function __awaiter$4(thisArg, _arguments, P, generator) { + function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); } + return new (P || (P = Promise))(function (resolve, reject) { + function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } } + function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } } + function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); } + step((generator = generator.apply(thisArg, _arguments || [])).next()); + }); +} + +function __generator$2(thisArg, body) { + var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g; + return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g; + function verb(n) { return function (v) { return step([n, v]); }; } + function step(op) { + if (f) throw new TypeError("Generator is already executing."); + while (_) try { + if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t; + if (y = 0, t) op = [op[0] & 2, t.value]; + switch (op[0]) { + case 0: case 1: t = op; break; + case 4: _.label++; return { value: op[1], done: false }; + case 5: _.label++; y = op[1]; op = [0]; continue; + case 7: op = _.ops.pop(); _.trys.pop(); continue; + default: + if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; } + if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; } + if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; } + if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; } + if (t[2]) _.ops.pop(); + _.trys.pop(); continue; + } + op = body.call(thisArg, _); + } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; } + if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true }; + } +} + +/** @deprecated */ +function __spreadArrays$1() { + for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length; + for (var r = Array(s), k = 0, i = 0; i < il; i++) + for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++) + r[k] = a[j]; + return r; +} + +function __spreadArray$3(to, from, pack) { + if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) { + if (ar || !(i in from)) { + if (!ar) ar = Array.prototype.slice.call(from, 0, i); + ar[i] = from[i]; + } + } + return to.concat(ar || Array.prototype.slice.call(from)); +} + +class e$2 extends Error{}class t$2 extends e$2{}class n$1 extends e$2{}const c$3=(e,t=",")=>e.join(t),l$2={accept:"*",multiple:!1,strict:!1},r$2=e=>{const{accept:t,multiple:n,strict:r}={...l$2,...e},i=p$2({multiple:n,accept:Array.isArray(t)?c$3(t):t});return new Promise((e=>{i.onchange=()=>{e(s$2(i.files,n,r)),i.remove();},i.click();}))},s$2=(e,c,l)=>new Promise(((r,s)=>{if(!e)return s(new t$2);const p=i$3(e,c,l);if(!p)return s(new n$1);r(p);})),i$3=(e,t,n)=>!t&&n?1===e.length?e[0]:null:e.length?e:null,p$2=({accept:e,multiple:t})=>{const n=document.createElement("input");return n.type="file",n.multiple=t,n.accept=e,n}; + +/*! js-yaml 4.1.0 https://github.com/nodeca/js-yaml @license MIT */ +function isNothing(subject) { + return (typeof subject === 'undefined') || (subject === null); +} + + +function isObject$g(subject) { + return (typeof subject === 'object') && (subject !== null); +} + + +function toArray$1(sequence) { + if (Array.isArray(sequence)) return sequence; + else if (isNothing(sequence)) return []; + + return [ sequence ]; +} + + +function extend$1(target, source) { + var index, length, key, sourceKeys; + + if (source) { + sourceKeys = Object.keys(source); + + for (index = 0, length = sourceKeys.length; index < length; index += 1) { + key = sourceKeys[index]; + target[key] = source[key]; + } + } + + return target; +} + + +function repeat(string, count) { + var result = '', cycle; + + for (cycle = 0; cycle < count; cycle += 1) { + result += string; + } + + return result; +} + + +function isNegativeZero(number) { + return (number === 0) && (Number.NEGATIVE_INFINITY === 1 / number); +} + + +var isNothing_1 = isNothing; +var isObject_1$1 = isObject$g; +var toArray_1 = toArray$1; +var repeat_1 = repeat; +var isNegativeZero_1 = isNegativeZero; +var extend_1 = extend$1; + +var common = { + isNothing: isNothing_1, + isObject: isObject_1$1, + toArray: toArray_1, + repeat: repeat_1, + isNegativeZero: isNegativeZero_1, + extend: extend_1 +}; + +// YAML error class. http://stackoverflow.com/questions/8458984 + + +function formatError(exception, compact) { + var where = '', message = exception.reason || '(unknown reason)'; + + if (!exception.mark) return message; + + if (exception.mark.name) { + where += 'in "' + exception.mark.name + '" '; + } + + where += '(' + (exception.mark.line + 1) + ':' + (exception.mark.column + 1) + ')'; + + if (!compact && exception.mark.snippet) { + where += '\n\n' + exception.mark.snippet; + } + + return message + ' ' + where; +} + + +function YAMLException$1(reason, mark) { + // Super constructor + Error.call(this); + + this.name = 'YAMLException'; + this.reason = reason; + this.mark = mark; + this.message = formatError(this, false); + + // Include stack trace in error object + if (Error.captureStackTrace) { + // Chrome and NodeJS + Error.captureStackTrace(this, this.constructor); + } else { + // FF, IE 10+ and Safari 6+. Fallback for others + this.stack = (new Error()).stack || ''; + } +} + + +// Inherit from Error +YAMLException$1.prototype = Object.create(Error.prototype); +YAMLException$1.prototype.constructor = YAMLException$1; + + +YAMLException$1.prototype.toString = function toString(compact) { + return this.name + ': ' + formatError(this, compact); +}; + + +var exception = YAMLException$1; + +// get snippet for a single line, respecting maxLength +function getLine(buffer, lineStart, lineEnd, position, maxLineLength) { + var head = ''; + var tail = ''; + var maxHalfLength = Math.floor(maxLineLength / 2) - 1; + + if (position - lineStart > maxHalfLength) { + head = ' ... '; + lineStart = position - maxHalfLength + head.length; + } + + if (lineEnd - position > maxHalfLength) { + tail = ' ...'; + lineEnd = position + maxHalfLength - tail.length; + } + + return { + str: head + buffer.slice(lineStart, lineEnd).replace(/\t/g, '→') + tail, + pos: position - lineStart + head.length // relative position + }; +} + + +function padStart(string, max) { + return common.repeat(' ', max - string.length) + string; +} + + +function makeSnippet(mark, options) { + options = Object.create(options || null); + + if (!mark.buffer) return null; + + if (!options.maxLength) options.maxLength = 79; + if (typeof options.indent !== 'number') options.indent = 1; + if (typeof options.linesBefore !== 'number') options.linesBefore = 3; + if (typeof options.linesAfter !== 'number') options.linesAfter = 2; + + var re = /\r?\n|\r|\0/g; + var lineStarts = [ 0 ]; + var lineEnds = []; + var match; + var foundLineNo = -1; + + while ((match = re.exec(mark.buffer))) { + lineEnds.push(match.index); + lineStarts.push(match.index + match[0].length); + + if (mark.position <= match.index && foundLineNo < 0) { + foundLineNo = lineStarts.length - 2; + } + } + + if (foundLineNo < 0) foundLineNo = lineStarts.length - 1; + + var result = '', i, line; + var lineNoLength = Math.min(mark.line + options.linesAfter, lineEnds.length).toString().length; + var maxLineLength = options.maxLength - (options.indent + lineNoLength + 3); + + for (i = 1; i <= options.linesBefore; i++) { + if (foundLineNo - i < 0) break; + line = getLine( + mark.buffer, + lineStarts[foundLineNo - i], + lineEnds[foundLineNo - i], + mark.position - (lineStarts[foundLineNo] - lineStarts[foundLineNo - i]), + maxLineLength + ); + result = common.repeat(' ', options.indent) + padStart((mark.line - i + 1).toString(), lineNoLength) + + ' | ' + line.str + '\n' + result; + } + + line = getLine(mark.buffer, lineStarts[foundLineNo], lineEnds[foundLineNo], mark.position, maxLineLength); + result += common.repeat(' ', options.indent) + padStart((mark.line + 1).toString(), lineNoLength) + + ' | ' + line.str + '\n'; + result += common.repeat('-', options.indent + lineNoLength + 3 + line.pos) + '^' + '\n'; + + for (i = 1; i <= options.linesAfter; i++) { + if (foundLineNo + i >= lineEnds.length) break; + line = getLine( + mark.buffer, + lineStarts[foundLineNo + i], + lineEnds[foundLineNo + i], + mark.position - (lineStarts[foundLineNo] - lineStarts[foundLineNo + i]), + maxLineLength + ); + result += common.repeat(' ', options.indent) + padStart((mark.line + i + 1).toString(), lineNoLength) + + ' | ' + line.str + '\n'; + } + + return result.replace(/\n$/, ''); +} + + +var snippet = makeSnippet; + +var TYPE_CONSTRUCTOR_OPTIONS = [ + 'kind', + 'multi', + 'resolve', + 'construct', + 'instanceOf', + 'predicate', + 'represent', + 'representName', + 'defaultStyle', + 'styleAliases' +]; + +var YAML_NODE_KINDS = [ + 'scalar', + 'sequence', + 'mapping' +]; + +function compileStyleAliases(map) { + var result = {}; + + if (map !== null) { + Object.keys(map).forEach(function (style) { + map[style].forEach(function (alias) { + result[String(alias)] = style; + }); + }); + } + + return result; +} + +function Type$1(tag, options) { + options = options || {}; + + Object.keys(options).forEach(function (name) { + if (TYPE_CONSTRUCTOR_OPTIONS.indexOf(name) === -1) { + throw new exception('Unknown option "' + name + '" is met in definition of "' + tag + '" YAML type.'); + } + }); + + // TODO: Add tag format check. + this.options = options; // keep original options in case user wants to extend this type later + this.tag = tag; + this.kind = options['kind'] || null; + this.resolve = options['resolve'] || function () { return true; }; + this.construct = options['construct'] || function (data) { return data; }; + this.instanceOf = options['instanceOf'] || null; + this.predicate = options['predicate'] || null; + this.represent = options['represent'] || null; + this.representName = options['representName'] || null; + this.defaultStyle = options['defaultStyle'] || null; + this.multi = options['multi'] || false; + this.styleAliases = compileStyleAliases(options['styleAliases'] || null); + + if (YAML_NODE_KINDS.indexOf(this.kind) === -1) { + throw new exception('Unknown kind "' + this.kind + '" is specified for "' + tag + '" YAML type.'); + } +} + +var type = Type$1; + +/*eslint-disable max-len*/ + + + + + +function compileList(schema, name) { + var result = []; + + schema[name].forEach(function (currentType) { + var newIndex = result.length; + + result.forEach(function (previousType, previousIndex) { + if (previousType.tag === currentType.tag && + previousType.kind === currentType.kind && + previousType.multi === currentType.multi) { + + newIndex = previousIndex; + } + }); + + result[newIndex] = currentType; + }); + + return result; +} + + +function compileMap(/* lists... */) { + var result = { + scalar: {}, + sequence: {}, + mapping: {}, + fallback: {}, + multi: { + scalar: [], + sequence: [], + mapping: [], + fallback: [] + } + }, index, length; + + function collectType(type) { + if (type.multi) { + result.multi[type.kind].push(type); + result.multi['fallback'].push(type); + } else { + result[type.kind][type.tag] = result['fallback'][type.tag] = type; + } + } + + for (index = 0, length = arguments.length; index < length; index += 1) { + arguments[index].forEach(collectType); + } + return result; +} + + +function Schema$1(definition) { + return this.extend(definition); +} + + +Schema$1.prototype.extend = function extend(definition) { + var implicit = []; + var explicit = []; + + if (definition instanceof type) { + // Schema.extend(type) + explicit.push(definition); + + } else if (Array.isArray(definition)) { + // Schema.extend([ type1, type2, ... ]) + explicit = explicit.concat(definition); + + } else if (definition && (Array.isArray(definition.implicit) || Array.isArray(definition.explicit))) { + // Schema.extend({ explicit: [ type1, type2, ... ], implicit: [ type1, type2, ... ] }) + if (definition.implicit) implicit = implicit.concat(definition.implicit); + if (definition.explicit) explicit = explicit.concat(definition.explicit); + + } else { + throw new exception('Schema.extend argument should be a Type, [ Type ], ' + + 'or a schema definition ({ implicit: [...], explicit: [...] })'); + } + + implicit.forEach(function (type$1) { + if (!(type$1 instanceof type)) { + throw new exception('Specified list of YAML types (or a single Type object) contains a non-Type object.'); + } + + if (type$1.loadKind && type$1.loadKind !== 'scalar') { + throw new exception('There is a non-scalar type in the implicit list of a schema. Implicit resolving of such types is not supported.'); + } + + if (type$1.multi) { + throw new exception('There is a multi type in the implicit list of a schema. Multi tags can only be listed as explicit.'); + } + }); + + explicit.forEach(function (type$1) { + if (!(type$1 instanceof type)) { + throw new exception('Specified list of YAML types (or a single Type object) contains a non-Type object.'); + } + }); + + var result = Object.create(Schema$1.prototype); + + result.implicit = (this.implicit || []).concat(implicit); + result.explicit = (this.explicit || []).concat(explicit); + + result.compiledImplicit = compileList(result, 'implicit'); + result.compiledExplicit = compileList(result, 'explicit'); + result.compiledTypeMap = compileMap(result.compiledImplicit, result.compiledExplicit); + + return result; +}; + + +var schema$1 = Schema$1; + +var str$1 = new type('tag:yaml.org,2002:str', { + kind: 'scalar', + construct: function (data) { return data !== null ? data : ''; } +}); + +var seq = new type('tag:yaml.org,2002:seq', { + kind: 'sequence', + construct: function (data) { return data !== null ? data : []; } +}); + +var map$5 = new type('tag:yaml.org,2002:map', { + kind: 'mapping', + construct: function (data) { return data !== null ? data : {}; } +}); + +var failsafe = new schema$1({ + explicit: [ + str$1, + seq, + map$5 + ] +}); + +function resolveYamlNull(data) { + if (data === null) return true; + + var max = data.length; + + return (max === 1 && data === '~') || + (max === 4 && (data === 'null' || data === 'Null' || data === 'NULL')); +} + +function constructYamlNull() { + return null; +} + +function isNull$1(object) { + return object === null; +} + +var _null = new type('tag:yaml.org,2002:null', { + kind: 'scalar', + resolve: resolveYamlNull, + construct: constructYamlNull, + predicate: isNull$1, + represent: { + canonical: function () { return '~'; }, + lowercase: function () { return 'null'; }, + uppercase: function () { return 'NULL'; }, + camelcase: function () { return 'Null'; }, + empty: function () { return ''; } + }, + defaultStyle: 'lowercase' +}); + +function resolveYamlBoolean(data) { + if (data === null) return false; + + var max = data.length; + + return (max === 4 && (data === 'true' || data === 'True' || data === 'TRUE')) || + (max === 5 && (data === 'false' || data === 'False' || data === 'FALSE')); +} + +function constructYamlBoolean(data) { + return data === 'true' || + data === 'True' || + data === 'TRUE'; +} + +function isBoolean$1(object) { + return Object.prototype.toString.call(object) === '[object Boolean]'; +} + +var bool = new type('tag:yaml.org,2002:bool', { + kind: 'scalar', + resolve: resolveYamlBoolean, + construct: constructYamlBoolean, + predicate: isBoolean$1, + represent: { + lowercase: function (object) { return object ? 'true' : 'false'; }, + uppercase: function (object) { return object ? 'TRUE' : 'FALSE'; }, + camelcase: function (object) { return object ? 'True' : 'False'; } + }, + defaultStyle: 'lowercase' +}); + +function isHexCode(c) { + return ((0x30/* 0 */ <= c) && (c <= 0x39/* 9 */)) || + ((0x41/* A */ <= c) && (c <= 0x46/* F */)) || + ((0x61/* a */ <= c) && (c <= 0x66/* f */)); +} + +function isOctCode(c) { + return ((0x30/* 0 */ <= c) && (c <= 0x37/* 7 */)); +} + +function isDecCode(c) { + return ((0x30/* 0 */ <= c) && (c <= 0x39/* 9 */)); +} + +function resolveYamlInteger(data) { + if (data === null) return false; + + var max = data.length, + index = 0, + hasDigits = false, + ch; + + if (!max) return false; + + ch = data[index]; + + // sign + if (ch === '-' || ch === '+') { + ch = data[++index]; + } + + if (ch === '0') { + // 0 + if (index + 1 === max) return true; + ch = data[++index]; + + // base 2, base 8, base 16 + + if (ch === 'b') { + // base 2 + index++; + + for (; index < max; index++) { + ch = data[index]; + if (ch === '_') continue; + if (ch !== '0' && ch !== '1') return false; + hasDigits = true; + } + return hasDigits && ch !== '_'; + } + + + if (ch === 'x') { + // base 16 + index++; + + for (; index < max; index++) { + ch = data[index]; + if (ch === '_') continue; + if (!isHexCode(data.charCodeAt(index))) return false; + hasDigits = true; + } + return hasDigits && ch !== '_'; + } + + + if (ch === 'o') { + // base 8 + index++; + + for (; index < max; index++) { + ch = data[index]; + if (ch === '_') continue; + if (!isOctCode(data.charCodeAt(index))) return false; + hasDigits = true; + } + return hasDigits && ch !== '_'; + } + } + + // base 10 (except 0) + + // value should not start with `_`; + if (ch === '_') return false; + + for (; index < max; index++) { + ch = data[index]; + if (ch === '_') continue; + if (!isDecCode(data.charCodeAt(index))) { + return false; + } + hasDigits = true; + } + + // Should have digits and should not end with `_` + if (!hasDigits || ch === '_') return false; + + return true; +} + +function constructYamlInteger(data) { + var value = data, sign = 1, ch; + + if (value.indexOf('_') !== -1) { + value = value.replace(/_/g, ''); + } + + ch = value[0]; + + if (ch === '-' || ch === '+') { + if (ch === '-') sign = -1; + value = value.slice(1); + ch = value[0]; + } + + if (value === '0') return 0; + + if (ch === '0') { + if (value[1] === 'b') return sign * parseInt(value.slice(2), 2); + if (value[1] === 'x') return sign * parseInt(value.slice(2), 16); + if (value[1] === 'o') return sign * parseInt(value.slice(2), 8); + } + + return sign * parseInt(value, 10); +} + +function isInteger(object) { + return (Object.prototype.toString.call(object)) === '[object Number]' && + (object % 1 === 0 && !common.isNegativeZero(object)); +} + +var int = new type('tag:yaml.org,2002:int', { + kind: 'scalar', + resolve: resolveYamlInteger, + construct: constructYamlInteger, + predicate: isInteger, + represent: { + binary: function (obj) { return obj >= 0 ? '0b' + obj.toString(2) : '-0b' + obj.toString(2).slice(1); }, + octal: function (obj) { return obj >= 0 ? '0o' + obj.toString(8) : '-0o' + obj.toString(8).slice(1); }, + decimal: function (obj) { return obj.toString(10); }, + /* eslint-disable max-len */ + hexadecimal: function (obj) { return obj >= 0 ? '0x' + obj.toString(16).toUpperCase() : '-0x' + obj.toString(16).toUpperCase().slice(1); } + }, + defaultStyle: 'decimal', + styleAliases: { + binary: [ 2, 'bin' ], + octal: [ 8, 'oct' ], + decimal: [ 10, 'dec' ], + hexadecimal: [ 16, 'hex' ] + } +}); + +var YAML_FLOAT_PATTERN = new RegExp( + // 2.5e4, 2.5 and integers + '^(?:[-+]?(?:[0-9][0-9_]*)(?:\\.[0-9_]*)?(?:[eE][-+]?[0-9]+)?' + + // .2e4, .2 + // special case, seems not from spec + '|\\.[0-9_]+(?:[eE][-+]?[0-9]+)?' + + // .inf + '|[-+]?\\.(?:inf|Inf|INF)' + + // .nan + '|\\.(?:nan|NaN|NAN))$'); + +function resolveYamlFloat(data) { + if (data === null) return false; + + if (!YAML_FLOAT_PATTERN.test(data) || + // Quick hack to not allow integers end with `_` + // Probably should update regexp & check speed + data[data.length - 1] === '_') { + return false; + } + + return true; +} + +function constructYamlFloat(data) { + var value, sign; + + value = data.replace(/_/g, '').toLowerCase(); + sign = value[0] === '-' ? -1 : 1; + + if ('+-'.indexOf(value[0]) >= 0) { + value = value.slice(1); + } + + if (value === '.inf') { + return (sign === 1) ? Number.POSITIVE_INFINITY : Number.NEGATIVE_INFINITY; + + } else if (value === '.nan') { + return NaN; + } + return sign * parseFloat(value, 10); +} + + +var SCIENTIFIC_WITHOUT_DOT = /^[-+]?[0-9]+e/; + +function representYamlFloat(object, style) { + var res; + + if (isNaN(object)) { + switch (style) { + case 'lowercase': return '.nan'; + case 'uppercase': return '.NAN'; + case 'camelcase': return '.NaN'; + } + } else if (Number.POSITIVE_INFINITY === object) { + switch (style) { + case 'lowercase': return '.inf'; + case 'uppercase': return '.INF'; + case 'camelcase': return '.Inf'; + } + } else if (Number.NEGATIVE_INFINITY === object) { + switch (style) { + case 'lowercase': return '-.inf'; + case 'uppercase': return '-.INF'; + case 'camelcase': return '-.Inf'; + } + } else if (common.isNegativeZero(object)) { + return '-0.0'; + } + + res = object.toString(10); + + // JS stringifier can build scientific format without dots: 5e-100, + // while YAML requres dot: 5.e-100. Fix it with simple hack + + return SCIENTIFIC_WITHOUT_DOT.test(res) ? res.replace('e', '.e') : res; +} + +function isFloat(object) { + return (Object.prototype.toString.call(object) === '[object Number]') && + (object % 1 !== 0 || common.isNegativeZero(object)); +} + +var float = new type('tag:yaml.org,2002:float', { + kind: 'scalar', + resolve: resolveYamlFloat, + construct: constructYamlFloat, + predicate: isFloat, + represent: representYamlFloat, + defaultStyle: 'lowercase' +}); + +var json$1 = failsafe.extend({ + implicit: [ + _null, + bool, + int, + float + ] +}); + +var core = json$1; + +var YAML_DATE_REGEXP = new RegExp( + '^([0-9][0-9][0-9][0-9])' + // [1] year + '-([0-9][0-9])' + // [2] month + '-([0-9][0-9])$'); // [3] day + +var YAML_TIMESTAMP_REGEXP = new RegExp( + '^([0-9][0-9][0-9][0-9])' + // [1] year + '-([0-9][0-9]?)' + // [2] month + '-([0-9][0-9]?)' + // [3] day + '(?:[Tt]|[ \\t]+)' + // ... + '([0-9][0-9]?)' + // [4] hour + ':([0-9][0-9])' + // [5] minute + ':([0-9][0-9])' + // [6] second + '(?:\\.([0-9]*))?' + // [7] fraction + '(?:[ \\t]*(Z|([-+])([0-9][0-9]?)' + // [8] tz [9] tz_sign [10] tz_hour + '(?::([0-9][0-9]))?))?$'); // [11] tz_minute + +function resolveYamlTimestamp(data) { + if (data === null) return false; + if (YAML_DATE_REGEXP.exec(data) !== null) return true; + if (YAML_TIMESTAMP_REGEXP.exec(data) !== null) return true; + return false; +} + +function constructYamlTimestamp(data) { + var match, year, month, day, hour, minute, second, fraction = 0, + delta = null, tz_hour, tz_minute, date; + + match = YAML_DATE_REGEXP.exec(data); + if (match === null) match = YAML_TIMESTAMP_REGEXP.exec(data); + + if (match === null) throw new Error('Date resolve error'); + + // match: [1] year [2] month [3] day + + year = +(match[1]); + month = +(match[2]) - 1; // JS month starts with 0 + day = +(match[3]); + + if (!match[4]) { // no hour + return new Date(Date.UTC(year, month, day)); + } + + // match: [4] hour [5] minute [6] second [7] fraction + + hour = +(match[4]); + minute = +(match[5]); + second = +(match[6]); + + if (match[7]) { + fraction = match[7].slice(0, 3); + while (fraction.length < 3) { // milli-seconds + fraction += '0'; + } + fraction = +fraction; + } + + // match: [8] tz [9] tz_sign [10] tz_hour [11] tz_minute + + if (match[9]) { + tz_hour = +(match[10]); + tz_minute = +(match[11] || 0); + delta = (tz_hour * 60 + tz_minute) * 60000; // delta in mili-seconds + if (match[9] === '-') delta = -delta; + } + + date = new Date(Date.UTC(year, month, day, hour, minute, second, fraction)); + + if (delta) date.setTime(date.getTime() - delta); + + return date; +} + +function representYamlTimestamp(object /*, style*/) { + return object.toISOString(); +} + +var timestamp = new type('tag:yaml.org,2002:timestamp', { + kind: 'scalar', + resolve: resolveYamlTimestamp, + construct: constructYamlTimestamp, + instanceOf: Date, + represent: representYamlTimestamp +}); + +function resolveYamlMerge(data) { + return data === '<<' || data === null; +} + +var merge$2 = new type('tag:yaml.org,2002:merge', { + kind: 'scalar', + resolve: resolveYamlMerge +}); + +/*eslint-disable no-bitwise*/ + + + + + +// [ 64, 65, 66 ] -> [ padding, CR, LF ] +var BASE64_MAP = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=\n\r'; + + +function resolveYamlBinary(data) { + if (data === null) return false; + + var code, idx, bitlen = 0, max = data.length, map = BASE64_MAP; + + // Convert one by one. + for (idx = 0; idx < max; idx++) { + code = map.indexOf(data.charAt(idx)); + + // Skip CR/LF + if (code > 64) continue; + + // Fail on illegal characters + if (code < 0) return false; + + bitlen += 6; + } + + // If there are any bits left, source was corrupted + return (bitlen % 8) === 0; +} + +function constructYamlBinary(data) { + var idx, tailbits, + input = data.replace(/[\r\n=]/g, ''), // remove CR/LF & padding to simplify scan + max = input.length, + map = BASE64_MAP, + bits = 0, + result = []; + + // Collect by 6*4 bits (3 bytes) + + for (idx = 0; idx < max; idx++) { + if ((idx % 4 === 0) && idx) { + result.push((bits >> 16) & 0xFF); + result.push((bits >> 8) & 0xFF); + result.push(bits & 0xFF); + } + + bits = (bits << 6) | map.indexOf(input.charAt(idx)); + } + + // Dump tail + + tailbits = (max % 4) * 6; + + if (tailbits === 0) { + result.push((bits >> 16) & 0xFF); + result.push((bits >> 8) & 0xFF); + result.push(bits & 0xFF); + } else if (tailbits === 18) { + result.push((bits >> 10) & 0xFF); + result.push((bits >> 2) & 0xFF); + } else if (tailbits === 12) { + result.push((bits >> 4) & 0xFF); + } + + return new Uint8Array(result); +} + +function representYamlBinary(object /*, style*/) { + var result = '', bits = 0, idx, tail, + max = object.length, + map = BASE64_MAP; + + // Convert every three bytes to 4 ASCII characters. + + for (idx = 0; idx < max; idx++) { + if ((idx % 3 === 0) && idx) { + result += map[(bits >> 18) & 0x3F]; + result += map[(bits >> 12) & 0x3F]; + result += map[(bits >> 6) & 0x3F]; + result += map[bits & 0x3F]; + } + + bits = (bits << 8) + object[idx]; + } + + // Dump tail + + tail = max % 3; + + if (tail === 0) { + result += map[(bits >> 18) & 0x3F]; + result += map[(bits >> 12) & 0x3F]; + result += map[(bits >> 6) & 0x3F]; + result += map[bits & 0x3F]; + } else if (tail === 2) { + result += map[(bits >> 10) & 0x3F]; + result += map[(bits >> 4) & 0x3F]; + result += map[(bits << 2) & 0x3F]; + result += map[64]; + } else if (tail === 1) { + result += map[(bits >> 2) & 0x3F]; + result += map[(bits << 4) & 0x3F]; + result += map[64]; + result += map[64]; + } + + return result; +} + +function isBinary(obj) { + return Object.prototype.toString.call(obj) === '[object Uint8Array]'; +} + +var binary$1 = new type('tag:yaml.org,2002:binary', { + kind: 'scalar', + resolve: resolveYamlBinary, + construct: constructYamlBinary, + predicate: isBinary, + represent: representYamlBinary +}); + +var _hasOwnProperty$3 = Object.prototype.hasOwnProperty; +var _toString$2 = Object.prototype.toString; + +function resolveYamlOmap(data) { + if (data === null) return true; + + var objectKeys = [], index, length, pair, pairKey, pairHasKey, + object = data; + + for (index = 0, length = object.length; index < length; index += 1) { + pair = object[index]; + pairHasKey = false; + + if (_toString$2.call(pair) !== '[object Object]') return false; + + for (pairKey in pair) { + if (_hasOwnProperty$3.call(pair, pairKey)) { + if (!pairHasKey) pairHasKey = true; + else return false; + } + } + + if (!pairHasKey) return false; + + if (objectKeys.indexOf(pairKey) === -1) objectKeys.push(pairKey); + else return false; + } + + return true; +} + +function constructYamlOmap(data) { + return data !== null ? data : []; +} + +var omap = new type('tag:yaml.org,2002:omap', { + kind: 'sequence', + resolve: resolveYamlOmap, + construct: constructYamlOmap +}); + +var _toString$1 = Object.prototype.toString; + +function resolveYamlPairs(data) { + if (data === null) return true; + + var index, length, pair, keys, result, + object = data; + + result = new Array(object.length); + + for (index = 0, length = object.length; index < length; index += 1) { + pair = object[index]; + + if (_toString$1.call(pair) !== '[object Object]') return false; + + keys = Object.keys(pair); + + if (keys.length !== 1) return false; + + result[index] = [ keys[0], pair[keys[0]] ]; + } + + return true; +} + +function constructYamlPairs(data) { + if (data === null) return []; + + var index, length, pair, keys, result, + object = data; + + result = new Array(object.length); + + for (index = 0, length = object.length; index < length; index += 1) { + pair = object[index]; + + keys = Object.keys(pair); + + result[index] = [ keys[0], pair[keys[0]] ]; + } + + return result; +} + +var pairs = new type('tag:yaml.org,2002:pairs', { + kind: 'sequence', + resolve: resolveYamlPairs, + construct: constructYamlPairs +}); + +var _hasOwnProperty$2 = Object.prototype.hasOwnProperty; + +function resolveYamlSet(data) { + if (data === null) return true; + + var key, object = data; + + for (key in object) { + if (_hasOwnProperty$2.call(object, key)) { + if (object[key] !== null) return false; + } + } + + return true; +} + +function constructYamlSet(data) { + return data !== null ? data : {}; +} + +var set$6 = new type('tag:yaml.org,2002:set', { + kind: 'mapping', + resolve: resolveYamlSet, + construct: constructYamlSet +}); + +var _default$2 = core.extend({ + implicit: [ + timestamp, + merge$2 + ], + explicit: [ + binary$1, + omap, + pairs, + set$6 + ] +}); + +/*eslint-disable max-len,no-use-before-define*/ + + + + + + + +var _hasOwnProperty$1 = Object.prototype.hasOwnProperty; + + +var CONTEXT_FLOW_IN = 1; +var CONTEXT_FLOW_OUT = 2; +var CONTEXT_BLOCK_IN = 3; +var CONTEXT_BLOCK_OUT = 4; + + +var CHOMPING_CLIP = 1; +var CHOMPING_STRIP = 2; +var CHOMPING_KEEP = 3; + + +var PATTERN_NON_PRINTABLE = /[\x00-\x08\x0B\x0C\x0E-\x1F\x7F-\x84\x86-\x9F\uFFFE\uFFFF]|[\uD800-\uDBFF](?![\uDC00-\uDFFF])|(?:[^\uD800-\uDBFF]|^)[\uDC00-\uDFFF]/; +var PATTERN_NON_ASCII_LINE_BREAKS = /[\x85\u2028\u2029]/; +var PATTERN_FLOW_INDICATORS = /[,\[\]\{\}]/; +var PATTERN_TAG_HANDLE = /^(?:!|!!|![a-z\-]+!)$/i; +var PATTERN_TAG_URI = /^(?:!|[^,\[\]\{\}])(?:%[0-9a-f]{2}|[0-9a-z\-#;\/\?:@&=\+\$,_\.!~\*'\(\)\[\]])*$/i; + + +function _class$y(obj) { return Object.prototype.toString.call(obj); } + +function is_EOL(c) { + return (c === 0x0A/* LF */) || (c === 0x0D/* CR */); +} + +function is_WHITE_SPACE(c) { + return (c === 0x09/* Tab */) || (c === 0x20/* Space */); +} + +function is_WS_OR_EOL(c) { + return (c === 0x09/* Tab */) || + (c === 0x20/* Space */) || + (c === 0x0A/* LF */) || + (c === 0x0D/* CR */); +} + +function is_FLOW_INDICATOR(c) { + return c === 0x2C/* , */ || + c === 0x5B/* [ */ || + c === 0x5D/* ] */ || + c === 0x7B/* { */ || + c === 0x7D/* } */; +} + +function fromHexCode(c) { + var lc; + + if ((0x30/* 0 */ <= c) && (c <= 0x39/* 9 */)) { + return c - 0x30; + } + + /*eslint-disable no-bitwise*/ + lc = c | 0x20; + + if ((0x61/* a */ <= lc) && (lc <= 0x66/* f */)) { + return lc - 0x61 + 10; + } + + return -1; +} + +function escapedHexLen(c) { + if (c === 0x78/* x */) { return 2; } + if (c === 0x75/* u */) { return 4; } + if (c === 0x55/* U */) { return 8; } + return 0; +} + +function fromDecimalCode(c) { + if ((0x30/* 0 */ <= c) && (c <= 0x39/* 9 */)) { + return c - 0x30; + } + + return -1; +} + +function simpleEscapeSequence(c) { + /* eslint-disable indent */ + return (c === 0x30/* 0 */) ? '\x00' : + (c === 0x61/* a */) ? '\x07' : + (c === 0x62/* b */) ? '\x08' : + (c === 0x74/* t */) ? '\x09' : + (c === 0x09/* Tab */) ? '\x09' : + (c === 0x6E/* n */) ? '\x0A' : + (c === 0x76/* v */) ? '\x0B' : + (c === 0x66/* f */) ? '\x0C' : + (c === 0x72/* r */) ? '\x0D' : + (c === 0x65/* e */) ? '\x1B' : + (c === 0x20/* Space */) ? ' ' : + (c === 0x22/* " */) ? '\x22' : + (c === 0x2F/* / */) ? '/' : + (c === 0x5C/* \ */) ? '\x5C' : + (c === 0x4E/* N */) ? '\x85' : + (c === 0x5F/* _ */) ? '\xA0' : + (c === 0x4C/* L */) ? '\u2028' : + (c === 0x50/* P */) ? '\u2029' : ''; +} + +function charFromCodepoint(c) { + if (c <= 0xFFFF) { + return String.fromCharCode(c); + } + // Encode UTF-16 surrogate pair + // https://en.wikipedia.org/wiki/UTF-16#Code_points_U.2B010000_to_U.2B10FFFF + return String.fromCharCode( + ((c - 0x010000) >> 10) + 0xD800, + ((c - 0x010000) & 0x03FF) + 0xDC00 + ); +} + +var simpleEscapeCheck = new Array(256); // integer, for fast access +var simpleEscapeMap = new Array(256); +for (var i$2 = 0; i$2 < 256; i$2++) { + simpleEscapeCheck[i$2] = simpleEscapeSequence(i$2) ? 1 : 0; + simpleEscapeMap[i$2] = simpleEscapeSequence(i$2); +} + + +function State$1(input, options) { + this.input = input; + + this.filename = options['filename'] || null; + this.schema = options['schema'] || _default$2; + this.onWarning = options['onWarning'] || null; + // (Hidden) Remove? makes the loader to expect YAML 1.1 documents + // if such documents have no explicit %YAML directive + this.legacy = options['legacy'] || false; + + this.json = options['json'] || false; + this.listener = options['listener'] || null; + + this.implicitTypes = this.schema.compiledImplicit; + this.typeMap = this.schema.compiledTypeMap; + + this.length = input.length; + this.position = 0; + this.line = 0; + this.lineStart = 0; + this.lineIndent = 0; + + // position of first leading tab in the current line, + // used to make sure there are no tabs in the indentation + this.firstTabInLine = -1; + + this.documents = []; + + /* + this.version; + this.checkLineBreaks; + this.tagMap; + this.anchorMap; + this.tag; + this.anchor; + this.kind; + this.result;*/ + +} + + +function generateError(state, message) { + var mark = { + name: state.filename, + buffer: state.input.slice(0, -1), // omit trailing \0 + position: state.position, + line: state.line, + column: state.position - state.lineStart + }; + + mark.snippet = snippet(mark); + + return new exception(message, mark); +} + +function throwError(state, message) { + throw generateError(state, message); +} + +function throwWarning(state, message) { + if (state.onWarning) { + state.onWarning.call(null, generateError(state, message)); + } +} + + +var directiveHandlers = { + + YAML: function handleYamlDirective(state, name, args) { + + var match, major, minor; + + if (state.version !== null) { + throwError(state, 'duplication of %YAML directive'); + } + + if (args.length !== 1) { + throwError(state, 'YAML directive accepts exactly one argument'); + } + + match = /^([0-9]+)\.([0-9]+)$/.exec(args[0]); + + if (match === null) { + throwError(state, 'ill-formed argument of the YAML directive'); + } + + major = parseInt(match[1], 10); + minor = parseInt(match[2], 10); + + if (major !== 1) { + throwError(state, 'unacceptable YAML version of the document'); + } + + state.version = args[0]; + state.checkLineBreaks = (minor < 2); + + if (minor !== 1 && minor !== 2) { + throwWarning(state, 'unsupported YAML version of the document'); + } + }, + + TAG: function handleTagDirective(state, name, args) { + + var handle, prefix; + + if (args.length !== 2) { + throwError(state, 'TAG directive accepts exactly two arguments'); + } + + handle = args[0]; + prefix = args[1]; + + if (!PATTERN_TAG_HANDLE.test(handle)) { + throwError(state, 'ill-formed tag handle (first argument) of the TAG directive'); + } + + if (_hasOwnProperty$1.call(state.tagMap, handle)) { + throwError(state, 'there is a previously declared suffix for "' + handle + '" tag handle'); + } + + if (!PATTERN_TAG_URI.test(prefix)) { + throwError(state, 'ill-formed tag prefix (second argument) of the TAG directive'); + } + + try { + prefix = decodeURIComponent(prefix); + } catch (err) { + throwError(state, 'tag prefix is malformed: ' + prefix); + } + + state.tagMap[handle] = prefix; + } +}; + + +function captureSegment(state, start, end, checkJson) { + var _position, _length, _character, _result; + + if (start < end) { + _result = state.input.slice(start, end); + + if (checkJson) { + for (_position = 0, _length = _result.length; _position < _length; _position += 1) { + _character = _result.charCodeAt(_position); + if (!(_character === 0x09 || + (0x20 <= _character && _character <= 0x10FFFF))) { + throwError(state, 'expected valid JSON character'); + } + } + } else if (PATTERN_NON_PRINTABLE.test(_result)) { + throwError(state, 'the stream contains non-printable characters'); + } + + state.result += _result; + } +} + +function mergeMappings(state, destination, source, overridableKeys) { + var sourceKeys, key, index, quantity; + + if (!common.isObject(source)) { + throwError(state, 'cannot merge mappings; the provided source object is unacceptable'); + } + + sourceKeys = Object.keys(source); + + for (index = 0, quantity = sourceKeys.length; index < quantity; index += 1) { + key = sourceKeys[index]; + + if (!_hasOwnProperty$1.call(destination, key)) { + destination[key] = source[key]; + overridableKeys[key] = true; + } + } +} + +function storeMappingPair(state, _result, overridableKeys, keyTag, keyNode, valueNode, + startLine, startLineStart, startPos) { + + var index, quantity; + + // The output is a plain object here, so keys can only be strings. + // We need to convert keyNode to a string, but doing so can hang the process + // (deeply nested arrays that explode exponentially using aliases). + if (Array.isArray(keyNode)) { + keyNode = Array.prototype.slice.call(keyNode); + + for (index = 0, quantity = keyNode.length; index < quantity; index += 1) { + if (Array.isArray(keyNode[index])) { + throwError(state, 'nested arrays are not supported inside keys'); + } + + if (typeof keyNode === 'object' && _class$y(keyNode[index]) === '[object Object]') { + keyNode[index] = '[object Object]'; + } + } + } + + // Avoid code execution in load() via toString property + // (still use its own toString for arrays, timestamps, + // and whatever user schema extensions happen to have @@toStringTag) + if (typeof keyNode === 'object' && _class$y(keyNode) === '[object Object]') { + keyNode = '[object Object]'; + } + + + keyNode = String(keyNode); + + if (_result === null) { + _result = {}; + } + + if (keyTag === 'tag:yaml.org,2002:merge') { + if (Array.isArray(valueNode)) { + for (index = 0, quantity = valueNode.length; index < quantity; index += 1) { + mergeMappings(state, _result, valueNode[index], overridableKeys); + } + } else { + mergeMappings(state, _result, valueNode, overridableKeys); + } + } else { + if (!state.json && + !_hasOwnProperty$1.call(overridableKeys, keyNode) && + _hasOwnProperty$1.call(_result, keyNode)) { + state.line = startLine || state.line; + state.lineStart = startLineStart || state.lineStart; + state.position = startPos || state.position; + throwError(state, 'duplicated mapping key'); + } + + // used for this specific key only because Object.defineProperty is slow + if (keyNode === '__proto__') { + Object.defineProperty(_result, keyNode, { + configurable: true, + enumerable: true, + writable: true, + value: valueNode + }); + } else { + _result[keyNode] = valueNode; + } + delete overridableKeys[keyNode]; + } + + return _result; +} + +function readLineBreak(state) { + var ch; + + ch = state.input.charCodeAt(state.position); + + if (ch === 0x0A/* LF */) { + state.position++; + } else if (ch === 0x0D/* CR */) { + state.position++; + if (state.input.charCodeAt(state.position) === 0x0A/* LF */) { + state.position++; + } + } else { + throwError(state, 'a line break is expected'); + } + + state.line += 1; + state.lineStart = state.position; + state.firstTabInLine = -1; +} + +function skipSeparationSpace(state, allowComments, checkIndent) { + var lineBreaks = 0, + ch = state.input.charCodeAt(state.position); + + while (ch !== 0) { + while (is_WHITE_SPACE(ch)) { + if (ch === 0x09/* Tab */ && state.firstTabInLine === -1) { + state.firstTabInLine = state.position; + } + ch = state.input.charCodeAt(++state.position); + } + + if (allowComments && ch === 0x23/* # */) { + do { + ch = state.input.charCodeAt(++state.position); + } while (ch !== 0x0A/* LF */ && ch !== 0x0D/* CR */ && ch !== 0); + } + + if (is_EOL(ch)) { + readLineBreak(state); + + ch = state.input.charCodeAt(state.position); + lineBreaks++; + state.lineIndent = 0; + + while (ch === 0x20/* Space */) { + state.lineIndent++; + ch = state.input.charCodeAt(++state.position); + } + } else { + break; + } + } + + if (checkIndent !== -1 && lineBreaks !== 0 && state.lineIndent < checkIndent) { + throwWarning(state, 'deficient indentation'); + } + + return lineBreaks; +} + +function testDocumentSeparator(state) { + var _position = state.position, + ch; + + ch = state.input.charCodeAt(_position); + + // Condition state.position === state.lineStart is tested + // in parent on each call, for efficiency. No needs to test here again. + if ((ch === 0x2D/* - */ || ch === 0x2E/* . */) && + ch === state.input.charCodeAt(_position + 1) && + ch === state.input.charCodeAt(_position + 2)) { + + _position += 3; + + ch = state.input.charCodeAt(_position); + + if (ch === 0 || is_WS_OR_EOL(ch)) { + return true; + } + } + + return false; +} + +function writeFoldedLines(state, count) { + if (count === 1) { + state.result += ' '; + } else if (count > 1) { + state.result += common.repeat('\n', count - 1); + } +} + + +function readPlainScalar(state, nodeIndent, withinFlowCollection) { + var preceding, + following, + captureStart, + captureEnd, + hasPendingContent, + _line, + _lineStart, + _lineIndent, + _kind = state.kind, + _result = state.result, + ch; + + ch = state.input.charCodeAt(state.position); + + if (is_WS_OR_EOL(ch) || + is_FLOW_INDICATOR(ch) || + ch === 0x23/* # */ || + ch === 0x26/* & */ || + ch === 0x2A/* * */ || + ch === 0x21/* ! */ || + ch === 0x7C/* | */ || + ch === 0x3E/* > */ || + ch === 0x27/* ' */ || + ch === 0x22/* " */ || + ch === 0x25/* % */ || + ch === 0x40/* @ */ || + ch === 0x60/* ` */) { + return false; + } + + if (ch === 0x3F/* ? */ || ch === 0x2D/* - */) { + following = state.input.charCodeAt(state.position + 1); + + if (is_WS_OR_EOL(following) || + withinFlowCollection && is_FLOW_INDICATOR(following)) { + return false; + } + } + + state.kind = 'scalar'; + state.result = ''; + captureStart = captureEnd = state.position; + hasPendingContent = false; + + while (ch !== 0) { + if (ch === 0x3A/* : */) { + following = state.input.charCodeAt(state.position + 1); + + if (is_WS_OR_EOL(following) || + withinFlowCollection && is_FLOW_INDICATOR(following)) { + break; + } + + } else if (ch === 0x23/* # */) { + preceding = state.input.charCodeAt(state.position - 1); + + if (is_WS_OR_EOL(preceding)) { + break; + } + + } else if ((state.position === state.lineStart && testDocumentSeparator(state)) || + withinFlowCollection && is_FLOW_INDICATOR(ch)) { + break; + + } else if (is_EOL(ch)) { + _line = state.line; + _lineStart = state.lineStart; + _lineIndent = state.lineIndent; + skipSeparationSpace(state, false, -1); + + if (state.lineIndent >= nodeIndent) { + hasPendingContent = true; + ch = state.input.charCodeAt(state.position); + continue; + } else { + state.position = captureEnd; + state.line = _line; + state.lineStart = _lineStart; + state.lineIndent = _lineIndent; + break; + } + } + + if (hasPendingContent) { + captureSegment(state, captureStart, captureEnd, false); + writeFoldedLines(state, state.line - _line); + captureStart = captureEnd = state.position; + hasPendingContent = false; + } + + if (!is_WHITE_SPACE(ch)) { + captureEnd = state.position + 1; + } + + ch = state.input.charCodeAt(++state.position); + } + + captureSegment(state, captureStart, captureEnd, false); + + if (state.result) { + return true; + } + + state.kind = _kind; + state.result = _result; + return false; +} + +function readSingleQuotedScalar(state, nodeIndent) { + var ch, + captureStart, captureEnd; + + ch = state.input.charCodeAt(state.position); + + if (ch !== 0x27/* ' */) { + return false; + } + + state.kind = 'scalar'; + state.result = ''; + state.position++; + captureStart = captureEnd = state.position; + + while ((ch = state.input.charCodeAt(state.position)) !== 0) { + if (ch === 0x27/* ' */) { + captureSegment(state, captureStart, state.position, true); + ch = state.input.charCodeAt(++state.position); + + if (ch === 0x27/* ' */) { + captureStart = state.position; + state.position++; + captureEnd = state.position; + } else { + return true; + } + + } else if (is_EOL(ch)) { + captureSegment(state, captureStart, captureEnd, true); + writeFoldedLines(state, skipSeparationSpace(state, false, nodeIndent)); + captureStart = captureEnd = state.position; + + } else if (state.position === state.lineStart && testDocumentSeparator(state)) { + throwError(state, 'unexpected end of the document within a single quoted scalar'); + + } else { + state.position++; + captureEnd = state.position; + } + } + + throwError(state, 'unexpected end of the stream within a single quoted scalar'); +} + +function readDoubleQuotedScalar(state, nodeIndent) { + var captureStart, + captureEnd, + hexLength, + hexResult, + tmp, + ch; + + ch = state.input.charCodeAt(state.position); + + if (ch !== 0x22/* " */) { + return false; + } + + state.kind = 'scalar'; + state.result = ''; + state.position++; + captureStart = captureEnd = state.position; + + while ((ch = state.input.charCodeAt(state.position)) !== 0) { + if (ch === 0x22/* " */) { + captureSegment(state, captureStart, state.position, true); + state.position++; + return true; + + } else if (ch === 0x5C/* \ */) { + captureSegment(state, captureStart, state.position, true); + ch = state.input.charCodeAt(++state.position); + + if (is_EOL(ch)) { + skipSeparationSpace(state, false, nodeIndent); + + // TODO: rework to inline fn with no type cast? + } else if (ch < 256 && simpleEscapeCheck[ch]) { + state.result += simpleEscapeMap[ch]; + state.position++; + + } else if ((tmp = escapedHexLen(ch)) > 0) { + hexLength = tmp; + hexResult = 0; + + for (; hexLength > 0; hexLength--) { + ch = state.input.charCodeAt(++state.position); + + if ((tmp = fromHexCode(ch)) >= 0) { + hexResult = (hexResult << 4) + tmp; + + } else { + throwError(state, 'expected hexadecimal character'); + } + } + + state.result += charFromCodepoint(hexResult); + + state.position++; + + } else { + throwError(state, 'unknown escape sequence'); + } + + captureStart = captureEnd = state.position; + + } else if (is_EOL(ch)) { + captureSegment(state, captureStart, captureEnd, true); + writeFoldedLines(state, skipSeparationSpace(state, false, nodeIndent)); + captureStart = captureEnd = state.position; + + } else if (state.position === state.lineStart && testDocumentSeparator(state)) { + throwError(state, 'unexpected end of the document within a double quoted scalar'); + + } else { + state.position++; + captureEnd = state.position; + } + } + + throwError(state, 'unexpected end of the stream within a double quoted scalar'); +} + +function readFlowCollection(state, nodeIndent) { + var readNext = true, + _line, + _lineStart, + _pos, + _tag = state.tag, + _result, + _anchor = state.anchor, + following, + terminator, + isPair, + isExplicitPair, + isMapping, + overridableKeys = Object.create(null), + keyNode, + keyTag, + valueNode, + ch; + + ch = state.input.charCodeAt(state.position); + + if (ch === 0x5B/* [ */) { + terminator = 0x5D;/* ] */ + isMapping = false; + _result = []; + } else if (ch === 0x7B/* { */) { + terminator = 0x7D;/* } */ + isMapping = true; + _result = {}; + } else { + return false; + } + + if (state.anchor !== null) { + state.anchorMap[state.anchor] = _result; + } + + ch = state.input.charCodeAt(++state.position); + + while (ch !== 0) { + skipSeparationSpace(state, true, nodeIndent); + + ch = state.input.charCodeAt(state.position); + + if (ch === terminator) { + state.position++; + state.tag = _tag; + state.anchor = _anchor; + state.kind = isMapping ? 'mapping' : 'sequence'; + state.result = _result; + return true; + } else if (!readNext) { + throwError(state, 'missed comma between flow collection entries'); + } else if (ch === 0x2C/* , */) { + // "flow collection entries can never be completely empty", as per YAML 1.2, section 7.4 + throwError(state, "expected the node content, but found ','"); + } + + keyTag = keyNode = valueNode = null; + isPair = isExplicitPair = false; + + if (ch === 0x3F/* ? */) { + following = state.input.charCodeAt(state.position + 1); + + if (is_WS_OR_EOL(following)) { + isPair = isExplicitPair = true; + state.position++; + skipSeparationSpace(state, true, nodeIndent); + } + } + + _line = state.line; // Save the current line. + _lineStart = state.lineStart; + _pos = state.position; + composeNode(state, nodeIndent, CONTEXT_FLOW_IN, false, true); + keyTag = state.tag; + keyNode = state.result; + skipSeparationSpace(state, true, nodeIndent); + + ch = state.input.charCodeAt(state.position); + + if ((isExplicitPair || state.line === _line) && ch === 0x3A/* : */) { + isPair = true; + ch = state.input.charCodeAt(++state.position); + skipSeparationSpace(state, true, nodeIndent); + composeNode(state, nodeIndent, CONTEXT_FLOW_IN, false, true); + valueNode = state.result; + } + + if (isMapping) { + storeMappingPair(state, _result, overridableKeys, keyTag, keyNode, valueNode, _line, _lineStart, _pos); + } else if (isPair) { + _result.push(storeMappingPair(state, null, overridableKeys, keyTag, keyNode, valueNode, _line, _lineStart, _pos)); + } else { + _result.push(keyNode); + } + + skipSeparationSpace(state, true, nodeIndent); + + ch = state.input.charCodeAt(state.position); + + if (ch === 0x2C/* , */) { + readNext = true; + ch = state.input.charCodeAt(++state.position); + } else { + readNext = false; + } + } + + throwError(state, 'unexpected end of the stream within a flow collection'); +} + +function readBlockScalar(state, nodeIndent) { + var captureStart, + folding, + chomping = CHOMPING_CLIP, + didReadContent = false, + detectedIndent = false, + textIndent = nodeIndent, + emptyLines = 0, + atMoreIndented = false, + tmp, + ch; + + ch = state.input.charCodeAt(state.position); + + if (ch === 0x7C/* | */) { + folding = false; + } else if (ch === 0x3E/* > */) { + folding = true; + } else { + return false; + } + + state.kind = 'scalar'; + state.result = ''; + + while (ch !== 0) { + ch = state.input.charCodeAt(++state.position); + + if (ch === 0x2B/* + */ || ch === 0x2D/* - */) { + if (CHOMPING_CLIP === chomping) { + chomping = (ch === 0x2B/* + */) ? CHOMPING_KEEP : CHOMPING_STRIP; + } else { + throwError(state, 'repeat of a chomping mode identifier'); + } + + } else if ((tmp = fromDecimalCode(ch)) >= 0) { + if (tmp === 0) { + throwError(state, 'bad explicit indentation width of a block scalar; it cannot be less than one'); + } else if (!detectedIndent) { + textIndent = nodeIndent + tmp - 1; + detectedIndent = true; + } else { + throwError(state, 'repeat of an indentation width identifier'); + } + + } else { + break; + } + } + + if (is_WHITE_SPACE(ch)) { + do { ch = state.input.charCodeAt(++state.position); } + while (is_WHITE_SPACE(ch)); + + if (ch === 0x23/* # */) { + do { ch = state.input.charCodeAt(++state.position); } + while (!is_EOL(ch) && (ch !== 0)); + } + } + + while (ch !== 0) { + readLineBreak(state); + state.lineIndent = 0; + + ch = state.input.charCodeAt(state.position); + + while ((!detectedIndent || state.lineIndent < textIndent) && + (ch === 0x20/* Space */)) { + state.lineIndent++; + ch = state.input.charCodeAt(++state.position); + } + + if (!detectedIndent && state.lineIndent > textIndent) { + textIndent = state.lineIndent; + } + + if (is_EOL(ch)) { + emptyLines++; + continue; + } + + // End of the scalar. + if (state.lineIndent < textIndent) { + + // Perform the chomping. + if (chomping === CHOMPING_KEEP) { + state.result += common.repeat('\n', didReadContent ? 1 + emptyLines : emptyLines); + } else if (chomping === CHOMPING_CLIP) { + if (didReadContent) { // i.e. only if the scalar is not empty. + state.result += '\n'; + } + } + + // Break this `while` cycle and go to the funciton's epilogue. + break; + } + + // Folded style: use fancy rules to handle line breaks. + if (folding) { + + // Lines starting with white space characters (more-indented lines) are not folded. + if (is_WHITE_SPACE(ch)) { + atMoreIndented = true; + // except for the first content line (cf. Example 8.1) + state.result += common.repeat('\n', didReadContent ? 1 + emptyLines : emptyLines); + + // End of more-indented block. + } else if (atMoreIndented) { + atMoreIndented = false; + state.result += common.repeat('\n', emptyLines + 1); + + // Just one line break - perceive as the same line. + } else if (emptyLines === 0) { + if (didReadContent) { // i.e. only if we have already read some scalar content. + state.result += ' '; + } + + // Several line breaks - perceive as different lines. + } else { + state.result += common.repeat('\n', emptyLines); + } + + // Literal style: just add exact number of line breaks between content lines. + } else { + // Keep all line breaks except the header line break. + state.result += common.repeat('\n', didReadContent ? 1 + emptyLines : emptyLines); + } + + didReadContent = true; + detectedIndent = true; + emptyLines = 0; + captureStart = state.position; + + while (!is_EOL(ch) && (ch !== 0)) { + ch = state.input.charCodeAt(++state.position); + } + + captureSegment(state, captureStart, state.position, false); + } + + return true; +} + +function readBlockSequence(state, nodeIndent) { + var _line, + _tag = state.tag, + _anchor = state.anchor, + _result = [], + following, + detected = false, + ch; + + // there is a leading tab before this token, so it can't be a block sequence/mapping; + // it can still be flow sequence/mapping or a scalar + if (state.firstTabInLine !== -1) return false; + + if (state.anchor !== null) { + state.anchorMap[state.anchor] = _result; + } + + ch = state.input.charCodeAt(state.position); + + while (ch !== 0) { + if (state.firstTabInLine !== -1) { + state.position = state.firstTabInLine; + throwError(state, 'tab characters must not be used in indentation'); + } + + if (ch !== 0x2D/* - */) { + break; + } + + following = state.input.charCodeAt(state.position + 1); + + if (!is_WS_OR_EOL(following)) { + break; + } + + detected = true; + state.position++; + + if (skipSeparationSpace(state, true, -1)) { + if (state.lineIndent <= nodeIndent) { + _result.push(null); + ch = state.input.charCodeAt(state.position); + continue; + } + } + + _line = state.line; + composeNode(state, nodeIndent, CONTEXT_BLOCK_IN, false, true); + _result.push(state.result); + skipSeparationSpace(state, true, -1); + + ch = state.input.charCodeAt(state.position); + + if ((state.line === _line || state.lineIndent > nodeIndent) && (ch !== 0)) { + throwError(state, 'bad indentation of a sequence entry'); + } else if (state.lineIndent < nodeIndent) { + break; + } + } + + if (detected) { + state.tag = _tag; + state.anchor = _anchor; + state.kind = 'sequence'; + state.result = _result; + return true; + } + return false; +} + +function readBlockMapping(state, nodeIndent, flowIndent) { + var following, + allowCompact, + _line, + _keyLine, + _keyLineStart, + _keyPos, + _tag = state.tag, + _anchor = state.anchor, + _result = {}, + overridableKeys = Object.create(null), + keyTag = null, + keyNode = null, + valueNode = null, + atExplicitKey = false, + detected = false, + ch; + + // there is a leading tab before this token, so it can't be a block sequence/mapping; + // it can still be flow sequence/mapping or a scalar + if (state.firstTabInLine !== -1) return false; + + if (state.anchor !== null) { + state.anchorMap[state.anchor] = _result; + } + + ch = state.input.charCodeAt(state.position); + + while (ch !== 0) { + if (!atExplicitKey && state.firstTabInLine !== -1) { + state.position = state.firstTabInLine; + throwError(state, 'tab characters must not be used in indentation'); + } + + following = state.input.charCodeAt(state.position + 1); + _line = state.line; // Save the current line. + + // + // Explicit notation case. There are two separate blocks: + // first for the key (denoted by "?") and second for the value (denoted by ":") + // + if ((ch === 0x3F/* ? */ || ch === 0x3A/* : */) && is_WS_OR_EOL(following)) { + + if (ch === 0x3F/* ? */) { + if (atExplicitKey) { + storeMappingPair(state, _result, overridableKeys, keyTag, keyNode, null, _keyLine, _keyLineStart, _keyPos); + keyTag = keyNode = valueNode = null; + } + + detected = true; + atExplicitKey = true; + allowCompact = true; + + } else if (atExplicitKey) { + // i.e. 0x3A/* : */ === character after the explicit key. + atExplicitKey = false; + allowCompact = true; + + } else { + throwError(state, 'incomplete explicit mapping pair; a key node is missed; or followed by a non-tabulated empty line'); + } + + state.position += 1; + ch = following; + + // + // Implicit notation case. Flow-style node as the key first, then ":", and the value. + // + } else { + _keyLine = state.line; + _keyLineStart = state.lineStart; + _keyPos = state.position; + + if (!composeNode(state, flowIndent, CONTEXT_FLOW_OUT, false, true)) { + // Neither implicit nor explicit notation. + // Reading is done. Go to the epilogue. + break; + } + + if (state.line === _line) { + ch = state.input.charCodeAt(state.position); + + while (is_WHITE_SPACE(ch)) { + ch = state.input.charCodeAt(++state.position); + } + + if (ch === 0x3A/* : */) { + ch = state.input.charCodeAt(++state.position); + + if (!is_WS_OR_EOL(ch)) { + throwError(state, 'a whitespace character is expected after the key-value separator within a block mapping'); + } + + if (atExplicitKey) { + storeMappingPair(state, _result, overridableKeys, keyTag, keyNode, null, _keyLine, _keyLineStart, _keyPos); + keyTag = keyNode = valueNode = null; + } + + detected = true; + atExplicitKey = false; + allowCompact = false; + keyTag = state.tag; + keyNode = state.result; + + } else if (detected) { + throwError(state, 'can not read an implicit mapping pair; a colon is missed'); + + } else { + state.tag = _tag; + state.anchor = _anchor; + return true; // Keep the result of `composeNode`. + } + + } else if (detected) { + throwError(state, 'can not read a block mapping entry; a multiline key may not be an implicit key'); + + } else { + state.tag = _tag; + state.anchor = _anchor; + return true; // Keep the result of `composeNode`. + } + } + + // + // Common reading code for both explicit and implicit notations. + // + if (state.line === _line || state.lineIndent > nodeIndent) { + if (atExplicitKey) { + _keyLine = state.line; + _keyLineStart = state.lineStart; + _keyPos = state.position; + } + + if (composeNode(state, nodeIndent, CONTEXT_BLOCK_OUT, true, allowCompact)) { + if (atExplicitKey) { + keyNode = state.result; + } else { + valueNode = state.result; + } + } + + if (!atExplicitKey) { + storeMappingPair(state, _result, overridableKeys, keyTag, keyNode, valueNode, _keyLine, _keyLineStart, _keyPos); + keyTag = keyNode = valueNode = null; + } + + skipSeparationSpace(state, true, -1); + ch = state.input.charCodeAt(state.position); + } + + if ((state.line === _line || state.lineIndent > nodeIndent) && (ch !== 0)) { + throwError(state, 'bad indentation of a mapping entry'); + } else if (state.lineIndent < nodeIndent) { + break; + } + } + + // + // Epilogue. + // + + // Special case: last mapping's node contains only the key in explicit notation. + if (atExplicitKey) { + storeMappingPair(state, _result, overridableKeys, keyTag, keyNode, null, _keyLine, _keyLineStart, _keyPos); + } + + // Expose the resulting mapping. + if (detected) { + state.tag = _tag; + state.anchor = _anchor; + state.kind = 'mapping'; + state.result = _result; + } + + return detected; +} + +function readTagProperty(state) { + var _position, + isVerbatim = false, + isNamed = false, + tagHandle, + tagName, + ch; + + ch = state.input.charCodeAt(state.position); + + if (ch !== 0x21/* ! */) return false; + + if (state.tag !== null) { + throwError(state, 'duplication of a tag property'); + } + + ch = state.input.charCodeAt(++state.position); + + if (ch === 0x3C/* < */) { + isVerbatim = true; + ch = state.input.charCodeAt(++state.position); + + } else if (ch === 0x21/* ! */) { + isNamed = true; + tagHandle = '!!'; + ch = state.input.charCodeAt(++state.position); + + } else { + tagHandle = '!'; + } + + _position = state.position; + + if (isVerbatim) { + do { ch = state.input.charCodeAt(++state.position); } + while (ch !== 0 && ch !== 0x3E/* > */); + + if (state.position < state.length) { + tagName = state.input.slice(_position, state.position); + ch = state.input.charCodeAt(++state.position); + } else { + throwError(state, 'unexpected end of the stream within a verbatim tag'); + } + } else { + while (ch !== 0 && !is_WS_OR_EOL(ch)) { + + if (ch === 0x21/* ! */) { + if (!isNamed) { + tagHandle = state.input.slice(_position - 1, state.position + 1); + + if (!PATTERN_TAG_HANDLE.test(tagHandle)) { + throwError(state, 'named tag handle cannot contain such characters'); + } + + isNamed = true; + _position = state.position + 1; + } else { + throwError(state, 'tag suffix cannot contain exclamation marks'); + } + } + + ch = state.input.charCodeAt(++state.position); + } + + tagName = state.input.slice(_position, state.position); + + if (PATTERN_FLOW_INDICATORS.test(tagName)) { + throwError(state, 'tag suffix cannot contain flow indicator characters'); + } + } + + if (tagName && !PATTERN_TAG_URI.test(tagName)) { + throwError(state, 'tag name cannot contain such characters: ' + tagName); + } + + try { + tagName = decodeURIComponent(tagName); + } catch (err) { + throwError(state, 'tag name is malformed: ' + tagName); + } + + if (isVerbatim) { + state.tag = tagName; + + } else if (_hasOwnProperty$1.call(state.tagMap, tagHandle)) { + state.tag = state.tagMap[tagHandle] + tagName; + + } else if (tagHandle === '!') { + state.tag = '!' + tagName; + + } else if (tagHandle === '!!') { + state.tag = 'tag:yaml.org,2002:' + tagName; + + } else { + throwError(state, 'undeclared tag handle "' + tagHandle + '"'); + } + + return true; +} + +function readAnchorProperty(state) { + var _position, + ch; + + ch = state.input.charCodeAt(state.position); + + if (ch !== 0x26/* & */) return false; + + if (state.anchor !== null) { + throwError(state, 'duplication of an anchor property'); + } + + ch = state.input.charCodeAt(++state.position); + _position = state.position; + + while (ch !== 0 && !is_WS_OR_EOL(ch) && !is_FLOW_INDICATOR(ch)) { + ch = state.input.charCodeAt(++state.position); + } + + if (state.position === _position) { + throwError(state, 'name of an anchor node must contain at least one character'); + } + + state.anchor = state.input.slice(_position, state.position); + return true; +} + +function readAlias(state) { + var _position, alias, + ch; + + ch = state.input.charCodeAt(state.position); + + if (ch !== 0x2A/* * */) return false; + + ch = state.input.charCodeAt(++state.position); + _position = state.position; + + while (ch !== 0 && !is_WS_OR_EOL(ch) && !is_FLOW_INDICATOR(ch)) { + ch = state.input.charCodeAt(++state.position); + } + + if (state.position === _position) { + throwError(state, 'name of an alias node must contain at least one character'); + } + + alias = state.input.slice(_position, state.position); + + if (!_hasOwnProperty$1.call(state.anchorMap, alias)) { + throwError(state, 'unidentified alias "' + alias + '"'); + } + + state.result = state.anchorMap[alias]; + skipSeparationSpace(state, true, -1); + return true; +} + +function composeNode(state, parentIndent, nodeContext, allowToSeek, allowCompact) { + var allowBlockStyles, + allowBlockScalars, + allowBlockCollections, + indentStatus = 1, // 1: this>parent, 0: this=parent, -1: this parentIndent) { + indentStatus = 1; + } else if (state.lineIndent === parentIndent) { + indentStatus = 0; + } else if (state.lineIndent < parentIndent) { + indentStatus = -1; + } + } + } + + if (indentStatus === 1) { + while (readTagProperty(state) || readAnchorProperty(state)) { + if (skipSeparationSpace(state, true, -1)) { + atNewLine = true; + allowBlockCollections = allowBlockStyles; + + if (state.lineIndent > parentIndent) { + indentStatus = 1; + } else if (state.lineIndent === parentIndent) { + indentStatus = 0; + } else if (state.lineIndent < parentIndent) { + indentStatus = -1; + } + } else { + allowBlockCollections = false; + } + } + } + + if (allowBlockCollections) { + allowBlockCollections = atNewLine || allowCompact; + } + + if (indentStatus === 1 || CONTEXT_BLOCK_OUT === nodeContext) { + if (CONTEXT_FLOW_IN === nodeContext || CONTEXT_FLOW_OUT === nodeContext) { + flowIndent = parentIndent; + } else { + flowIndent = parentIndent + 1; + } + + blockIndent = state.position - state.lineStart; + + if (indentStatus === 1) { + if (allowBlockCollections && + (readBlockSequence(state, blockIndent) || + readBlockMapping(state, blockIndent, flowIndent)) || + readFlowCollection(state, flowIndent)) { + hasContent = true; + } else { + if ((allowBlockScalars && readBlockScalar(state, flowIndent)) || + readSingleQuotedScalar(state, flowIndent) || + readDoubleQuotedScalar(state, flowIndent)) { + hasContent = true; + + } else if (readAlias(state)) { + hasContent = true; + + if (state.tag !== null || state.anchor !== null) { + throwError(state, 'alias node should not have any properties'); + } + + } else if (readPlainScalar(state, flowIndent, CONTEXT_FLOW_IN === nodeContext)) { + hasContent = true; + + if (state.tag === null) { + state.tag = '?'; + } + } + + if (state.anchor !== null) { + state.anchorMap[state.anchor] = state.result; + } + } + } else if (indentStatus === 0) { + // Special case: block sequences are allowed to have same indentation level as the parent. + // http://www.yaml.org/spec/1.2/spec.html#id2799784 + hasContent = allowBlockCollections && readBlockSequence(state, blockIndent); + } + } + + if (state.tag === null) { + if (state.anchor !== null) { + state.anchorMap[state.anchor] = state.result; + } + + } else if (state.tag === '?') { + // Implicit resolving is not allowed for non-scalar types, and '?' + // non-specific tag is only automatically assigned to plain scalars. + // + // We only need to check kind conformity in case user explicitly assigns '?' + // tag, for example like this: "! [0]" + // + if (state.result !== null && state.kind !== 'scalar') { + throwError(state, 'unacceptable node kind for ! tag; it should be "scalar", not "' + state.kind + '"'); + } + + for (typeIndex = 0, typeQuantity = state.implicitTypes.length; typeIndex < typeQuantity; typeIndex += 1) { + type = state.implicitTypes[typeIndex]; + + if (type.resolve(state.result)) { // `state.result` updated in resolver if matched + state.result = type.construct(state.result); + state.tag = type.tag; + if (state.anchor !== null) { + state.anchorMap[state.anchor] = state.result; + } + break; + } + } + } else if (state.tag !== '!') { + if (_hasOwnProperty$1.call(state.typeMap[state.kind || 'fallback'], state.tag)) { + type = state.typeMap[state.kind || 'fallback'][state.tag]; + } else { + // looking for multi type + type = null; + typeList = state.typeMap.multi[state.kind || 'fallback']; + + for (typeIndex = 0, typeQuantity = typeList.length; typeIndex < typeQuantity; typeIndex += 1) { + if (state.tag.slice(0, typeList[typeIndex].tag.length) === typeList[typeIndex].tag) { + type = typeList[typeIndex]; + break; + } + } + } + + if (!type) { + throwError(state, 'unknown tag !<' + state.tag + '>'); + } + + if (state.result !== null && type.kind !== state.kind) { + throwError(state, 'unacceptable node kind for !<' + state.tag + '> tag; it should be "' + type.kind + '", not "' + state.kind + '"'); + } + + if (!type.resolve(state.result, state.tag)) { // `state.result` updated in resolver if matched + throwError(state, 'cannot resolve a node with !<' + state.tag + '> explicit tag'); + } else { + state.result = type.construct(state.result, state.tag); + if (state.anchor !== null) { + state.anchorMap[state.anchor] = state.result; + } + } + } + + if (state.listener !== null) { + state.listener('close', state); + } + return state.tag !== null || state.anchor !== null || hasContent; +} + +function readDocument(state) { + var documentStart = state.position, + _position, + directiveName, + directiveArgs, + hasDirectives = false, + ch; + + state.version = null; + state.checkLineBreaks = state.legacy; + state.tagMap = Object.create(null); + state.anchorMap = Object.create(null); + + while ((ch = state.input.charCodeAt(state.position)) !== 0) { + skipSeparationSpace(state, true, -1); + + ch = state.input.charCodeAt(state.position); + + if (state.lineIndent > 0 || ch !== 0x25/* % */) { + break; + } + + hasDirectives = true; + ch = state.input.charCodeAt(++state.position); + _position = state.position; + + while (ch !== 0 && !is_WS_OR_EOL(ch)) { + ch = state.input.charCodeAt(++state.position); + } + + directiveName = state.input.slice(_position, state.position); + directiveArgs = []; + + if (directiveName.length < 1) { + throwError(state, 'directive name must not be less than one character in length'); + } + + while (ch !== 0) { + while (is_WHITE_SPACE(ch)) { + ch = state.input.charCodeAt(++state.position); + } + + if (ch === 0x23/* # */) { + do { ch = state.input.charCodeAt(++state.position); } + while (ch !== 0 && !is_EOL(ch)); + break; + } + + if (is_EOL(ch)) break; + + _position = state.position; + + while (ch !== 0 && !is_WS_OR_EOL(ch)) { + ch = state.input.charCodeAt(++state.position); + } + + directiveArgs.push(state.input.slice(_position, state.position)); + } + + if (ch !== 0) readLineBreak(state); + + if (_hasOwnProperty$1.call(directiveHandlers, directiveName)) { + directiveHandlers[directiveName](state, directiveName, directiveArgs); + } else { + throwWarning(state, 'unknown document directive "' + directiveName + '"'); + } + } + + skipSeparationSpace(state, true, -1); + + if (state.lineIndent === 0 && + state.input.charCodeAt(state.position) === 0x2D/* - */ && + state.input.charCodeAt(state.position + 1) === 0x2D/* - */ && + state.input.charCodeAt(state.position + 2) === 0x2D/* - */) { + state.position += 3; + skipSeparationSpace(state, true, -1); + + } else if (hasDirectives) { + throwError(state, 'directives end mark is expected'); + } + + composeNode(state, state.lineIndent - 1, CONTEXT_BLOCK_OUT, false, true); + skipSeparationSpace(state, true, -1); + + if (state.checkLineBreaks && + PATTERN_NON_ASCII_LINE_BREAKS.test(state.input.slice(documentStart, state.position))) { + throwWarning(state, 'non-ASCII line breaks are interpreted as content'); + } + + state.documents.push(state.result); + + if (state.position === state.lineStart && testDocumentSeparator(state)) { + + if (state.input.charCodeAt(state.position) === 0x2E/* . */) { + state.position += 3; + skipSeparationSpace(state, true, -1); + } + return; + } + + if (state.position < (state.length - 1)) { + throwError(state, 'end of the stream or a document separator is expected'); + } else { + return; + } +} + + +function loadDocuments(input, options) { + input = String(input); + options = options || {}; + + if (input.length !== 0) { + + // Add tailing `\n` if not exists + if (input.charCodeAt(input.length - 1) !== 0x0A/* LF */ && + input.charCodeAt(input.length - 1) !== 0x0D/* CR */) { + input += '\n'; + } + + // Strip BOM + if (input.charCodeAt(0) === 0xFEFF) { + input = input.slice(1); + } + } + + var state = new State$1(input, options); + + var nullpos = input.indexOf('\0'); + + if (nullpos !== -1) { + state.position = nullpos; + throwError(state, 'null byte is not allowed in input'); + } + + // Use 0 as string terminator. That significantly simplifies bounds check. + state.input += '\0'; + + while (state.input.charCodeAt(state.position) === 0x20/* Space */) { + state.lineIndent += 1; + state.position += 1; + } + + while (state.position < (state.length - 1)) { + readDocument(state); + } + + return state.documents; +} + + +function loadAll$1(input, iterator, options) { + if (iterator !== null && typeof iterator === 'object' && typeof options === 'undefined') { + options = iterator; + iterator = null; + } + + var documents = loadDocuments(input, options); + + if (typeof iterator !== 'function') { + return documents; + } + + for (var index = 0, length = documents.length; index < length; index += 1) { + iterator(documents[index]); + } +} + + +function load$1(input, options) { + var documents = loadDocuments(input, options); + + if (documents.length === 0) { + /*eslint-disable no-undefined*/ + return undefined; + } else if (documents.length === 1) { + return documents[0]; + } + throw new exception('expected a single document in the stream, but found more'); +} + + +var loadAll_1 = loadAll$1; +var load_1 = load$1; + +var loader = { + loadAll: loadAll_1, + load: load_1 +}; + +/*eslint-disable no-use-before-define*/ + + + + + +var _toString = Object.prototype.toString; +var _hasOwnProperty = Object.prototype.hasOwnProperty; + +var CHAR_BOM = 0xFEFF; +var CHAR_TAB = 0x09; /* Tab */ +var CHAR_LINE_FEED = 0x0A; /* LF */ +var CHAR_CARRIAGE_RETURN = 0x0D; /* CR */ +var CHAR_SPACE = 0x20; /* Space */ +var CHAR_EXCLAMATION = 0x21; /* ! */ +var CHAR_DOUBLE_QUOTE = 0x22; /* " */ +var CHAR_SHARP = 0x23; /* # */ +var CHAR_PERCENT = 0x25; /* % */ +var CHAR_AMPERSAND = 0x26; /* & */ +var CHAR_SINGLE_QUOTE = 0x27; /* ' */ +var CHAR_ASTERISK = 0x2A; /* * */ +var CHAR_COMMA = 0x2C; /* , */ +var CHAR_MINUS = 0x2D; /* - */ +var CHAR_COLON = 0x3A; /* : */ +var CHAR_EQUALS = 0x3D; /* = */ +var CHAR_GREATER_THAN = 0x3E; /* > */ +var CHAR_QUESTION = 0x3F; /* ? */ +var CHAR_COMMERCIAL_AT = 0x40; /* @ */ +var CHAR_LEFT_SQUARE_BRACKET = 0x5B; /* [ */ +var CHAR_RIGHT_SQUARE_BRACKET = 0x5D; /* ] */ +var CHAR_GRAVE_ACCENT = 0x60; /* ` */ +var CHAR_LEFT_CURLY_BRACKET = 0x7B; /* { */ +var CHAR_VERTICAL_LINE = 0x7C; /* | */ +var CHAR_RIGHT_CURLY_BRACKET = 0x7D; /* } */ + +var ESCAPE_SEQUENCES = {}; + +ESCAPE_SEQUENCES[0x00] = '\\0'; +ESCAPE_SEQUENCES[0x07] = '\\a'; +ESCAPE_SEQUENCES[0x08] = '\\b'; +ESCAPE_SEQUENCES[0x09] = '\\t'; +ESCAPE_SEQUENCES[0x0A] = '\\n'; +ESCAPE_SEQUENCES[0x0B] = '\\v'; +ESCAPE_SEQUENCES[0x0C] = '\\f'; +ESCAPE_SEQUENCES[0x0D] = '\\r'; +ESCAPE_SEQUENCES[0x1B] = '\\e'; +ESCAPE_SEQUENCES[0x22] = '\\"'; +ESCAPE_SEQUENCES[0x5C] = '\\\\'; +ESCAPE_SEQUENCES[0x85] = '\\N'; +ESCAPE_SEQUENCES[0xA0] = '\\_'; +ESCAPE_SEQUENCES[0x2028] = '\\L'; +ESCAPE_SEQUENCES[0x2029] = '\\P'; + +var DEPRECATED_BOOLEANS_SYNTAX = [ + 'y', 'Y', 'yes', 'Yes', 'YES', 'on', 'On', 'ON', + 'n', 'N', 'no', 'No', 'NO', 'off', 'Off', 'OFF' +]; + +var DEPRECATED_BASE60_SYNTAX = /^[-+]?[0-9_]+(?::[0-9_]+)+(?:\.[0-9_]*)?$/; + +function compileStyleMap(schema, map) { + var result, keys, index, length, tag, style, type; + + if (map === null) return {}; + + result = {}; + keys = Object.keys(map); + + for (index = 0, length = keys.length; index < length; index += 1) { + tag = keys[index]; + style = String(map[tag]); + + if (tag.slice(0, 2) === '!!') { + tag = 'tag:yaml.org,2002:' + tag.slice(2); + } + type = schema.compiledTypeMap['fallback'][tag]; + + if (type && _hasOwnProperty.call(type.styleAliases, style)) { + style = type.styleAliases[style]; + } + + result[tag] = style; + } + + return result; +} + +function encodeHex(character) { + var string, handle, length; + + string = character.toString(16).toUpperCase(); + + if (character <= 0xFF) { + handle = 'x'; + length = 2; + } else if (character <= 0xFFFF) { + handle = 'u'; + length = 4; + } else if (character <= 0xFFFFFFFF) { + handle = 'U'; + length = 8; + } else { + throw new exception('code point within a string may not be greater than 0xFFFFFFFF'); + } + + return '\\' + handle + common.repeat('0', length - string.length) + string; +} + + +var QUOTING_TYPE_SINGLE = 1, + QUOTING_TYPE_DOUBLE = 2; + +function State(options) { + this.schema = options['schema'] || _default$2; + this.indent = Math.max(1, (options['indent'] || 2)); + this.noArrayIndent = options['noArrayIndent'] || false; + this.skipInvalid = options['skipInvalid'] || false; + this.flowLevel = (common.isNothing(options['flowLevel']) ? -1 : options['flowLevel']); + this.styleMap = compileStyleMap(this.schema, options['styles'] || null); + this.sortKeys = options['sortKeys'] || false; + this.lineWidth = options['lineWidth'] || 80; + this.noRefs = options['noRefs'] || false; + this.noCompatMode = options['noCompatMode'] || false; + this.condenseFlow = options['condenseFlow'] || false; + this.quotingType = options['quotingType'] === '"' ? QUOTING_TYPE_DOUBLE : QUOTING_TYPE_SINGLE; + this.forceQuotes = options['forceQuotes'] || false; + this.replacer = typeof options['replacer'] === 'function' ? options['replacer'] : null; + + this.implicitTypes = this.schema.compiledImplicit; + this.explicitTypes = this.schema.compiledExplicit; + + this.tag = null; + this.result = ''; + + this.duplicates = []; + this.usedDuplicates = null; +} + +// Indents every line in a string. Empty lines (\n only) are not indented. +function indentString(string, spaces) { + var ind = common.repeat(' ', spaces), + position = 0, + next = -1, + result = '', + line, + length = string.length; + + while (position < length) { + next = string.indexOf('\n', position); + if (next === -1) { + line = string.slice(position); + position = length; + } else { + line = string.slice(position, next + 1); + position = next + 1; + } + + if (line.length && line !== '\n') result += ind; + + result += line; + } + + return result; +} + +function generateNextLine(state, level) { + return '\n' + common.repeat(' ', state.indent * level); +} + +function testImplicitResolving(state, str) { + var index, length, type; + + for (index = 0, length = state.implicitTypes.length; index < length; index += 1) { + type = state.implicitTypes[index]; + + if (type.resolve(str)) { + return true; + } + } + + return false; +} + +// [33] s-white ::= s-space | s-tab +function isWhitespace(c) { + return c === CHAR_SPACE || c === CHAR_TAB; +} + +// Returns true if the character can be printed without escaping. +// From YAML 1.2: "any allowed characters known to be non-printable +// should also be escaped. [However,] This isn’t mandatory" +// Derived from nb-char - \t - #x85 - #xA0 - #x2028 - #x2029. +function isPrintable(c) { + return (0x00020 <= c && c <= 0x00007E) + || ((0x000A1 <= c && c <= 0x00D7FF) && c !== 0x2028 && c !== 0x2029) + || ((0x0E000 <= c && c <= 0x00FFFD) && c !== CHAR_BOM) + || (0x10000 <= c && c <= 0x10FFFF); +} + +// [34] ns-char ::= nb-char - s-white +// [27] nb-char ::= c-printable - b-char - c-byte-order-mark +// [26] b-char ::= b-line-feed | b-carriage-return +// Including s-white (for some reason, examples doesn't match specs in this aspect) +// ns-char ::= c-printable - b-line-feed - b-carriage-return - c-byte-order-mark +function isNsCharOrWhitespace(c) { + return isPrintable(c) + && c !== CHAR_BOM + // - b-char + && c !== CHAR_CARRIAGE_RETURN + && c !== CHAR_LINE_FEED; +} + +// [127] ns-plain-safe(c) ::= c = flow-out ⇒ ns-plain-safe-out +// c = flow-in ⇒ ns-plain-safe-in +// c = block-key ⇒ ns-plain-safe-out +// c = flow-key ⇒ ns-plain-safe-in +// [128] ns-plain-safe-out ::= ns-char +// [129] ns-plain-safe-in ::= ns-char - c-flow-indicator +// [130] ns-plain-char(c) ::= ( ns-plain-safe(c) - “:” - “#” ) +// | ( /* An ns-char preceding */ “#” ) +// | ( “:” /* Followed by an ns-plain-safe(c) */ ) +function isPlainSafe(c, prev, inblock) { + var cIsNsCharOrWhitespace = isNsCharOrWhitespace(c); + var cIsNsChar = cIsNsCharOrWhitespace && !isWhitespace(c); + return ( + // ns-plain-safe + inblock ? // c = flow-in + cIsNsCharOrWhitespace + : cIsNsCharOrWhitespace + // - c-flow-indicator + && c !== CHAR_COMMA + && c !== CHAR_LEFT_SQUARE_BRACKET + && c !== CHAR_RIGHT_SQUARE_BRACKET + && c !== CHAR_LEFT_CURLY_BRACKET + && c !== CHAR_RIGHT_CURLY_BRACKET + ) + // ns-plain-char + && c !== CHAR_SHARP // false on '#' + && !(prev === CHAR_COLON && !cIsNsChar) // false on ': ' + || (isNsCharOrWhitespace(prev) && !isWhitespace(prev) && c === CHAR_SHARP) // change to true on '[^ ]#' + || (prev === CHAR_COLON && cIsNsChar); // change to true on ':[^ ]' +} + +// Simplified test for values allowed as the first character in plain style. +function isPlainSafeFirst(c) { + // Uses a subset of ns-char - c-indicator + // where ns-char = nb-char - s-white. + // No support of ( ( “?” | “:” | “-” ) /* Followed by an ns-plain-safe(c)) */ ) part + return isPrintable(c) && c !== CHAR_BOM + && !isWhitespace(c) // - s-white + // - (c-indicator ::= + // “-” | “?” | “:” | “,” | “[” | “]” | “{” | “}” + && c !== CHAR_MINUS + && c !== CHAR_QUESTION + && c !== CHAR_COLON + && c !== CHAR_COMMA + && c !== CHAR_LEFT_SQUARE_BRACKET + && c !== CHAR_RIGHT_SQUARE_BRACKET + && c !== CHAR_LEFT_CURLY_BRACKET + && c !== CHAR_RIGHT_CURLY_BRACKET + // | “#” | “&” | “*” | “!” | “|” | “=” | “>” | “'” | “"” + && c !== CHAR_SHARP + && c !== CHAR_AMPERSAND + && c !== CHAR_ASTERISK + && c !== CHAR_EXCLAMATION + && c !== CHAR_VERTICAL_LINE + && c !== CHAR_EQUALS + && c !== CHAR_GREATER_THAN + && c !== CHAR_SINGLE_QUOTE + && c !== CHAR_DOUBLE_QUOTE + // | “%” | “@” | “`”) + && c !== CHAR_PERCENT + && c !== CHAR_COMMERCIAL_AT + && c !== CHAR_GRAVE_ACCENT; +} + +// Simplified test for values allowed as the last character in plain style. +function isPlainSafeLast(c) { + // just not whitespace or colon, it will be checked to be plain character later + return !isWhitespace(c) && c !== CHAR_COLON; +} + +// Same as 'string'.codePointAt(pos), but works in older browsers. +function codePointAt(string, pos) { + var first = string.charCodeAt(pos), second; + if (first >= 0xD800 && first <= 0xDBFF && pos + 1 < string.length) { + second = string.charCodeAt(pos + 1); + if (second >= 0xDC00 && second <= 0xDFFF) { + // https://mathiasbynens.be/notes/javascript-encoding#surrogate-formulae + return (first - 0xD800) * 0x400 + second - 0xDC00 + 0x10000; + } + } + return first; +} + +// Determines whether block indentation indicator is required. +function needIndentIndicator(string) { + var leadingSpaceRe = /^\n* /; + return leadingSpaceRe.test(string); +} + +var STYLE_PLAIN = 1, + STYLE_SINGLE = 2, + STYLE_LITERAL = 3, + STYLE_FOLDED = 4, + STYLE_DOUBLE = 5; + +// Determines which scalar styles are possible and returns the preferred style. +// lineWidth = -1 => no limit. +// Pre-conditions: str.length > 0. +// Post-conditions: +// STYLE_PLAIN or STYLE_SINGLE => no \n are in the string. +// STYLE_LITERAL => no lines are suitable for folding (or lineWidth is -1). +// STYLE_FOLDED => a line > lineWidth and can be folded (and lineWidth != -1). +function chooseScalarStyle(string, singleLineOnly, indentPerLevel, lineWidth, + testAmbiguousType, quotingType, forceQuotes, inblock) { + + var i; + var char = 0; + var prevChar = null; + var hasLineBreak = false; + var hasFoldableLine = false; // only checked if shouldTrackWidth + var shouldTrackWidth = lineWidth !== -1; + var previousLineBreak = -1; // count the first line correctly + var plain = isPlainSafeFirst(codePointAt(string, 0)) + && isPlainSafeLast(codePointAt(string, string.length - 1)); + + if (singleLineOnly || forceQuotes) { + // Case: no block styles. + // Check for disallowed characters to rule out plain and single. + for (i = 0; i < string.length; char >= 0x10000 ? i += 2 : i++) { + char = codePointAt(string, i); + if (!isPrintable(char)) { + return STYLE_DOUBLE; + } + plain = plain && isPlainSafe(char, prevChar, inblock); + prevChar = char; + } + } else { + // Case: block styles permitted. + for (i = 0; i < string.length; char >= 0x10000 ? i += 2 : i++) { + char = codePointAt(string, i); + if (char === CHAR_LINE_FEED) { + hasLineBreak = true; + // Check if any line can be folded. + if (shouldTrackWidth) { + hasFoldableLine = hasFoldableLine || + // Foldable line = too long, and not more-indented. + (i - previousLineBreak - 1 > lineWidth && + string[previousLineBreak + 1] !== ' '); + previousLineBreak = i; + } + } else if (!isPrintable(char)) { + return STYLE_DOUBLE; + } + plain = plain && isPlainSafe(char, prevChar, inblock); + prevChar = char; + } + // in case the end is missing a \n + hasFoldableLine = hasFoldableLine || (shouldTrackWidth && + (i - previousLineBreak - 1 > lineWidth && + string[previousLineBreak + 1] !== ' ')); + } + // Although every style can represent \n without escaping, prefer block styles + // for multiline, since they're more readable and they don't add empty lines. + // Also prefer folding a super-long line. + if (!hasLineBreak && !hasFoldableLine) { + // Strings interpretable as another type have to be quoted; + // e.g. the string 'true' vs. the boolean true. + if (plain && !forceQuotes && !testAmbiguousType(string)) { + return STYLE_PLAIN; + } + return quotingType === QUOTING_TYPE_DOUBLE ? STYLE_DOUBLE : STYLE_SINGLE; + } + // Edge case: block indentation indicator can only have one digit. + if (indentPerLevel > 9 && needIndentIndicator(string)) { + return STYLE_DOUBLE; + } + // At this point we know block styles are valid. + // Prefer literal style unless we want to fold. + if (!forceQuotes) { + return hasFoldableLine ? STYLE_FOLDED : STYLE_LITERAL; + } + return quotingType === QUOTING_TYPE_DOUBLE ? STYLE_DOUBLE : STYLE_SINGLE; +} + +// Note: line breaking/folding is implemented for only the folded style. +// NB. We drop the last trailing newline (if any) of a returned block scalar +// since the dumper adds its own newline. This always works: +// • No ending newline => unaffected; already using strip "-" chomping. +// • Ending newline => removed then restored. +// Importantly, this keeps the "+" chomp indicator from gaining an extra line. +function writeScalar(state, string, level, iskey, inblock) { + state.dump = (function () { + if (string.length === 0) { + return state.quotingType === QUOTING_TYPE_DOUBLE ? '""' : "''"; + } + if (!state.noCompatMode) { + if (DEPRECATED_BOOLEANS_SYNTAX.indexOf(string) !== -1 || DEPRECATED_BASE60_SYNTAX.test(string)) { + return state.quotingType === QUOTING_TYPE_DOUBLE ? ('"' + string + '"') : ("'" + string + "'"); + } + } + + var indent = state.indent * Math.max(1, level); // no 0-indent scalars + // As indentation gets deeper, let the width decrease monotonically + // to the lower bound min(state.lineWidth, 40). + // Note that this implies + // state.lineWidth ≤ 40 + state.indent: width is fixed at the lower bound. + // state.lineWidth > 40 + state.indent: width decreases until the lower bound. + // This behaves better than a constant minimum width which disallows narrower options, + // or an indent threshold which causes the width to suddenly increase. + var lineWidth = state.lineWidth === -1 + ? -1 : Math.max(Math.min(state.lineWidth, 40), state.lineWidth - indent); + + // Without knowing if keys are implicit/explicit, assume implicit for safety. + var singleLineOnly = iskey + // No block styles in flow mode. + || (state.flowLevel > -1 && level >= state.flowLevel); + function testAmbiguity(string) { + return testImplicitResolving(state, string); + } + + switch (chooseScalarStyle(string, singleLineOnly, state.indent, lineWidth, + testAmbiguity, state.quotingType, state.forceQuotes && !iskey, inblock)) { + + case STYLE_PLAIN: + return string; + case STYLE_SINGLE: + return "'" + string.replace(/'/g, "''") + "'"; + case STYLE_LITERAL: + return '|' + blockHeader(string, state.indent) + + dropEndingNewline(indentString(string, indent)); + case STYLE_FOLDED: + return '>' + blockHeader(string, state.indent) + + dropEndingNewline(indentString(foldString(string, lineWidth), indent)); + case STYLE_DOUBLE: + return '"' + escapeString(string) + '"'; + default: + throw new exception('impossible error: invalid scalar style'); + } + }()); +} + +// Pre-conditions: string is valid for a block scalar, 1 <= indentPerLevel <= 9. +function blockHeader(string, indentPerLevel) { + var indentIndicator = needIndentIndicator(string) ? String(indentPerLevel) : ''; + + // note the special case: the string '\n' counts as a "trailing" empty line. + var clip = string[string.length - 1] === '\n'; + var keep = clip && (string[string.length - 2] === '\n' || string === '\n'); + var chomp = keep ? '+' : (clip ? '' : '-'); + + return indentIndicator + chomp + '\n'; +} + +// (See the note for writeScalar.) +function dropEndingNewline(string) { + return string[string.length - 1] === '\n' ? string.slice(0, -1) : string; +} + +// Note: a long line without a suitable break point will exceed the width limit. +// Pre-conditions: every char in str isPrintable, str.length > 0, width > 0. +function foldString(string, width) { + // In folded style, $k$ consecutive newlines output as $k+1$ newlines— + // unless they're before or after a more-indented line, or at the very + // beginning or end, in which case $k$ maps to $k$. + // Therefore, parse each chunk as newline(s) followed by a content line. + var lineRe = /(\n+)([^\n]*)/g; + + // first line (possibly an empty line) + var result = (function () { + var nextLF = string.indexOf('\n'); + nextLF = nextLF !== -1 ? nextLF : string.length; + lineRe.lastIndex = nextLF; + return foldLine(string.slice(0, nextLF), width); + }()); + // If we haven't reached the first content line yet, don't add an extra \n. + var prevMoreIndented = string[0] === '\n' || string[0] === ' '; + var moreIndented; + + // rest of the lines + var match; + while ((match = lineRe.exec(string))) { + var prefix = match[1], line = match[2]; + moreIndented = (line[0] === ' '); + result += prefix + + (!prevMoreIndented && !moreIndented && line !== '' + ? '\n' : '') + + foldLine(line, width); + prevMoreIndented = moreIndented; + } + + return result; +} + +// Greedy line breaking. +// Picks the longest line under the limit each time, +// otherwise settles for the shortest line over the limit. +// NB. More-indented lines *cannot* be folded, as that would add an extra \n. +function foldLine(line, width) { + if (line === '' || line[0] === ' ') return line; + + // Since a more-indented line adds a \n, breaks can't be followed by a space. + var breakRe = / [^ ]/g; // note: the match index will always be <= length-2. + var match; + // start is an inclusive index. end, curr, and next are exclusive. + var start = 0, end, curr = 0, next = 0; + var result = ''; + + // Invariants: 0 <= start <= length-1. + // 0 <= curr <= next <= max(0, length-2). curr - start <= width. + // Inside the loop: + // A match implies length >= 2, so curr and next are <= length-2. + while ((match = breakRe.exec(line))) { + next = match.index; + // maintain invariant: curr - start <= width + if (next - start > width) { + end = (curr > start) ? curr : next; // derive end <= length-2 + result += '\n' + line.slice(start, end); + // skip the space that was output as \n + start = end + 1; // derive start <= length-1 + } + curr = next; + } + + // By the invariants, start <= length-1, so there is something left over. + // It is either the whole string or a part starting from non-whitespace. + result += '\n'; + // Insert a break if the remainder is too long and there is a break available. + if (line.length - start > width && curr > start) { + result += line.slice(start, curr) + '\n' + line.slice(curr + 1); + } else { + result += line.slice(start); + } + + return result.slice(1); // drop extra \n joiner +} + +// Escapes a double-quoted string. +function escapeString(string) { + var result = ''; + var char = 0; + var escapeSeq; + + for (var i = 0; i < string.length; char >= 0x10000 ? i += 2 : i++) { + char = codePointAt(string, i); + escapeSeq = ESCAPE_SEQUENCES[char]; + + if (!escapeSeq && isPrintable(char)) { + result += string[i]; + if (char >= 0x10000) result += string[i + 1]; + } else { + result += escapeSeq || encodeHex(char); + } + } + + return result; +} + +function writeFlowSequence(state, level, object) { + var _result = '', + _tag = state.tag, + index, + length, + value; + + for (index = 0, length = object.length; index < length; index += 1) { + value = object[index]; + + if (state.replacer) { + value = state.replacer.call(object, String(index), value); + } + + // Write only valid elements, put null instead of invalid elements. + if (writeNode(state, level, value, false, false) || + (typeof value === 'undefined' && + writeNode(state, level, null, false, false))) { + + if (_result !== '') _result += ',' + (!state.condenseFlow ? ' ' : ''); + _result += state.dump; + } + } + + state.tag = _tag; + state.dump = '[' + _result + ']'; +} + +function writeBlockSequence(state, level, object, compact) { + var _result = '', + _tag = state.tag, + index, + length, + value; + + for (index = 0, length = object.length; index < length; index += 1) { + value = object[index]; + + if (state.replacer) { + value = state.replacer.call(object, String(index), value); + } + + // Write only valid elements, put null instead of invalid elements. + if (writeNode(state, level + 1, value, true, true, false, true) || + (typeof value === 'undefined' && + writeNode(state, level + 1, null, true, true, false, true))) { + + if (!compact || _result !== '') { + _result += generateNextLine(state, level); + } + + if (state.dump && CHAR_LINE_FEED === state.dump.charCodeAt(0)) { + _result += '-'; + } else { + _result += '- '; + } + + _result += state.dump; + } + } + + state.tag = _tag; + state.dump = _result || '[]'; // Empty sequence if no valid values. +} + +function writeFlowMapping(state, level, object) { + var _result = '', + _tag = state.tag, + objectKeyList = Object.keys(object), + index, + length, + objectKey, + objectValue, + pairBuffer; + + for (index = 0, length = objectKeyList.length; index < length; index += 1) { + + pairBuffer = ''; + if (_result !== '') pairBuffer += ', '; + + if (state.condenseFlow) pairBuffer += '"'; + + objectKey = objectKeyList[index]; + objectValue = object[objectKey]; + + if (state.replacer) { + objectValue = state.replacer.call(object, objectKey, objectValue); + } + + if (!writeNode(state, level, objectKey, false, false)) { + continue; // Skip this pair because of invalid key; + } + + if (state.dump.length > 1024) pairBuffer += '? '; + + pairBuffer += state.dump + (state.condenseFlow ? '"' : '') + ':' + (state.condenseFlow ? '' : ' '); + + if (!writeNode(state, level, objectValue, false, false)) { + continue; // Skip this pair because of invalid value. + } + + pairBuffer += state.dump; + + // Both key and value are valid. + _result += pairBuffer; + } + + state.tag = _tag; + state.dump = '{' + _result + '}'; +} + +function writeBlockMapping(state, level, object, compact) { + var _result = '', + _tag = state.tag, + objectKeyList = Object.keys(object), + index, + length, + objectKey, + objectValue, + explicitPair, + pairBuffer; + + // Allow sorting keys so that the output file is deterministic + if (state.sortKeys === true) { + // Default sorting + objectKeyList.sort(); + } else if (typeof state.sortKeys === 'function') { + // Custom sort function + objectKeyList.sort(state.sortKeys); + } else if (state.sortKeys) { + // Something is wrong + throw new exception('sortKeys must be a boolean or a function'); + } + + for (index = 0, length = objectKeyList.length; index < length; index += 1) { + pairBuffer = ''; + + if (!compact || _result !== '') { + pairBuffer += generateNextLine(state, level); + } + + objectKey = objectKeyList[index]; + objectValue = object[objectKey]; + + if (state.replacer) { + objectValue = state.replacer.call(object, objectKey, objectValue); + } + + if (!writeNode(state, level + 1, objectKey, true, true, true)) { + continue; // Skip this pair because of invalid key. + } + + explicitPair = (state.tag !== null && state.tag !== '?') || + (state.dump && state.dump.length > 1024); + + if (explicitPair) { + if (state.dump && CHAR_LINE_FEED === state.dump.charCodeAt(0)) { + pairBuffer += '?'; + } else { + pairBuffer += '? '; + } + } + + pairBuffer += state.dump; + + if (explicitPair) { + pairBuffer += generateNextLine(state, level); + } + + if (!writeNode(state, level + 1, objectValue, true, explicitPair)) { + continue; // Skip this pair because of invalid value. + } + + if (state.dump && CHAR_LINE_FEED === state.dump.charCodeAt(0)) { + pairBuffer += ':'; + } else { + pairBuffer += ': '; + } + + pairBuffer += state.dump; + + // Both key and value are valid. + _result += pairBuffer; + } + + state.tag = _tag; + state.dump = _result || '{}'; // Empty mapping if no valid pairs. +} + +function detectType(state, object, explicit) { + var _result, typeList, index, length, type, style; + + typeList = explicit ? state.explicitTypes : state.implicitTypes; + + for (index = 0, length = typeList.length; index < length; index += 1) { + type = typeList[index]; + + if ((type.instanceOf || type.predicate) && + (!type.instanceOf || ((typeof object === 'object') && (object instanceof type.instanceOf))) && + (!type.predicate || type.predicate(object))) { + + if (explicit) { + if (type.multi && type.representName) { + state.tag = type.representName(object); + } else { + state.tag = type.tag; + } + } else { + state.tag = '?'; + } + + if (type.represent) { + style = state.styleMap[type.tag] || type.defaultStyle; + + if (_toString.call(type.represent) === '[object Function]') { + _result = type.represent(object, style); + } else if (_hasOwnProperty.call(type.represent, style)) { + _result = type.represent[style](object, style); + } else { + throw new exception('!<' + type.tag + '> tag resolver accepts not "' + style + '" style'); + } + + state.dump = _result; + } + + return true; + } + } + + return false; +} + +// Serializes `object` and writes it to global `result`. +// Returns true on success, or false on invalid object. +// +function writeNode(state, level, object, block, compact, iskey, isblockseq) { + state.tag = null; + state.dump = object; + + if (!detectType(state, object, false)) { + detectType(state, object, true); + } + + var type = _toString.call(state.dump); + var inblock = block; + var tagStr; + + if (block) { + block = (state.flowLevel < 0 || state.flowLevel > level); + } + + var objectOrArray = type === '[object Object]' || type === '[object Array]', + duplicateIndex, + duplicate; + + if (objectOrArray) { + duplicateIndex = state.duplicates.indexOf(object); + duplicate = duplicateIndex !== -1; + } + + if ((state.tag !== null && state.tag !== '?') || duplicate || (state.indent !== 2 && level > 0)) { + compact = false; + } + + if (duplicate && state.usedDuplicates[duplicateIndex]) { + state.dump = '*ref_' + duplicateIndex; + } else { + if (objectOrArray && duplicate && !state.usedDuplicates[duplicateIndex]) { + state.usedDuplicates[duplicateIndex] = true; + } + if (type === '[object Object]') { + if (block && (Object.keys(state.dump).length !== 0)) { + writeBlockMapping(state, level, state.dump, compact); + if (duplicate) { + state.dump = '&ref_' + duplicateIndex + state.dump; + } + } else { + writeFlowMapping(state, level, state.dump); + if (duplicate) { + state.dump = '&ref_' + duplicateIndex + ' ' + state.dump; + } + } + } else if (type === '[object Array]') { + if (block && (state.dump.length !== 0)) { + if (state.noArrayIndent && !isblockseq && level > 0) { + writeBlockSequence(state, level - 1, state.dump, compact); + } else { + writeBlockSequence(state, level, state.dump, compact); + } + if (duplicate) { + state.dump = '&ref_' + duplicateIndex + state.dump; + } + } else { + writeFlowSequence(state, level, state.dump); + if (duplicate) { + state.dump = '&ref_' + duplicateIndex + ' ' + state.dump; + } + } + } else if (type === '[object String]') { + if (state.tag !== '?') { + writeScalar(state, state.dump, level, iskey, inblock); + } + } else if (type === '[object Undefined]') { + return false; + } else { + if (state.skipInvalid) return false; + throw new exception('unacceptable kind of an object to dump ' + type); + } + + if (state.tag !== null && state.tag !== '?') { + // Need to encode all characters except those allowed by the spec: + // + // [35] ns-dec-digit ::= [#x30-#x39] /* 0-9 */ + // [36] ns-hex-digit ::= ns-dec-digit + // | [#x41-#x46] /* A-F */ | [#x61-#x66] /* a-f */ + // [37] ns-ascii-letter ::= [#x41-#x5A] /* A-Z */ | [#x61-#x7A] /* a-z */ + // [38] ns-word-char ::= ns-dec-digit | ns-ascii-letter | “-” + // [39] ns-uri-char ::= “%” ns-hex-digit ns-hex-digit | ns-word-char | “#” + // | “;” | “/” | “?” | “:” | “@” | “&” | “=” | “+” | “$” | “,” + // | “_” | “.” | “!” | “~” | “*” | “'” | “(” | “)” | “[” | “]” + // + // Also need to encode '!' because it has special meaning (end of tag prefix). + // + tagStr = encodeURI( + state.tag[0] === '!' ? state.tag.slice(1) : state.tag + ).replace(/!/g, '%21'); + + if (state.tag[0] === '!') { + tagStr = '!' + tagStr; + } else if (tagStr.slice(0, 18) === 'tag:yaml.org,2002:') { + tagStr = '!!' + tagStr.slice(18); + } else { + tagStr = '!<' + tagStr + '>'; + } + + state.dump = tagStr + ' ' + state.dump; + } + } + + return true; +} + +function getDuplicateReferences(object, state) { + var objects = [], + duplicatesIndexes = [], + index, + length; + + inspectNode(object, objects, duplicatesIndexes); + + for (index = 0, length = duplicatesIndexes.length; index < length; index += 1) { + state.duplicates.push(objects[duplicatesIndexes[index]]); + } + state.usedDuplicates = new Array(length); +} + +function inspectNode(object, objects, duplicatesIndexes) { + var objectKeyList, + index, + length; + + if (object !== null && typeof object === 'object') { + index = objects.indexOf(object); + if (index !== -1) { + if (duplicatesIndexes.indexOf(index) === -1) { + duplicatesIndexes.push(index); + } + } else { + objects.push(object); + + if (Array.isArray(object)) { + for (index = 0, length = object.length; index < length; index += 1) { + inspectNode(object[index], objects, duplicatesIndexes); + } + } else { + objectKeyList = Object.keys(object); + + for (index = 0, length = objectKeyList.length; index < length; index += 1) { + inspectNode(object[objectKeyList[index]], objects, duplicatesIndexes); + } + } + } + } +} + +function dump$1(input, options) { + options = options || {}; + + var state = new State(options); + + if (!state.noRefs) getDuplicateReferences(input, state); + + var value = input; + + if (state.replacer) { + value = state.replacer.call({ '': value }, '', value); + } + + if (writeNode(state, 0, value, true, true)) return state.dump + '\n'; + + return ''; +} + +var dump_1 = dump$1; + +var dumper = { + dump: dump_1 +}; + +function renamed(from, to) { + return function () { + throw new Error('Function yaml.' + from + ' is removed in js-yaml 4. ' + + 'Use yaml.' + to + ' instead, which is now safe by default.'); + }; +} + + +var Type = type; +var Schema$2 = schema$1; +var FAILSAFE_SCHEMA = failsafe; +var JSON_SCHEMA = json$1; +var CORE_SCHEMA = core; +var DEFAULT_SCHEMA = _default$2; +var load = loader.load; +var loadAll = loader.loadAll; +var dump = dumper.dump; +var YAMLException = exception; + +// Re-export all types in case user wants to create custom schema +var types = { + binary: binary$1, + float: float, + map: map$5, + null: _null, + pairs: pairs, + set: set$6, + timestamp: timestamp, + bool: bool, + int: int, + merge: merge$2, + omap: omap, + seq: seq, + str: str$1 +}; + +// Removed functions from JS-YAML 3.0.x +var safeLoad = renamed('safeLoad', 'load'); +var safeLoadAll = renamed('safeLoadAll', 'loadAll'); +var safeDump = renamed('safeDump', 'dump'); + +var jsYaml = { + Type: Type, + Schema: Schema$2, + FAILSAFE_SCHEMA: FAILSAFE_SCHEMA, + JSON_SCHEMA: JSON_SCHEMA, + CORE_SCHEMA: CORE_SCHEMA, + DEFAULT_SCHEMA: DEFAULT_SCHEMA, + load: load, + loadAll: loadAll, + dump: dump, + YAMLException: YAMLException, + types: types, + safeLoad: safeLoad, + safeLoadAll: safeLoadAll, + safeDump: safeDump +}; + +var n,l$1,u$1,t$1,o$1,r$1,f$1,e$1={},c$2=[],s$1=/acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]|zoo|^ord|itera/i;function a$2(n,l){for(var u in l)n[u]=l[u];return n}function h$1(n){var l=n.parentNode;l&&l.removeChild(n);}function v$1(l,u,i){var t,o,r,f={};for(r in u)"key"==r?t=u[r]:"ref"==r?o=u[r]:f[r]=u[r];if(arguments.length>2&&(f.children=arguments.length>3?n.call(arguments,2):i),"function"==typeof l&&null!=l.defaultProps)for(r in l.defaultProps)void 0===f[r]&&(f[r]=l.defaultProps[r]);return y$4(l,f,t,o,null)}function y$4(n,i,t,o,r){var f={type:n,props:i,key:t,ref:o,__k:null,__:null,__b:0,__e:null,__d:void 0,__c:null,__h:null,constructor:void 0,__v:null==r?++u$1:r};return null!=l$1.vnode&&l$1.vnode(f),f}function p$1(){return {current:null}}function d$1(n){return n.children}function _$B(n,l){this.props=n,this.context=l;}function k$2(n,l){if(null==l)return n.__?k$2(n.__,n.__.__k.indexOf(n)+1):null;for(var u;l0?y$4(_.type,_.props,_.key,null,_.__v):_)){if(_.__=u,_.__b=u.__b+1,null===(p=w[h])||p&&_.key==p.key&&_.type===p.type)w[h]=void 0;else for(v=0;v2&&(f.children=arguments.length>3?n.call(arguments,2):i),y$4(l.type,f,t||l.key,o||l.ref,null)}function D$1(n,l){var u={__c:l="__cC"+f$1++,__:n,Consumer:function(n,l){return n.children(l)},Provider:function(n){var u,i;return this.getChildContext||(u=[],(i={})[l]=this,this.getChildContext=function(){return i},this.shouldComponentUpdate=function(n){this.props.value!==n.value&&u.some(m$2);},this.sub=function(n){u.push(n);var l=n.componentWillUnmount;n.componentWillUnmount=function(){u.splice(u.indexOf(n),1),l&&l.call(n);};}),n.children}};return u.Provider.__=u.Consumer.contextType=u}n=c$2.slice,l$1={__e:function(n,l){for(var u,i,t;l=l.__;)if((u=l.__c)&&!u.__)try{if((i=u.constructor)&&null!=i.getDerivedStateFromError&&(u.setState(i.getDerivedStateFromError(n)),t=u.__d),null!=u.componentDidCatch&&(u.componentDidCatch(n),t=u.__d),t)return u.__E=u}catch(l){n=l;}throw n}},u$1=0,_$B.prototype.setState=function(n,l){var u;u=null!=this.__s&&this.__s!==this.state?this.__s:this.__s=a$2({},this.state),"function"==typeof n&&(n=n(a$2({},u),this.props)),n&&a$2(u,n),null!=n&&this.__v&&(l&&this.__h.push(l),m$2(this));},_$B.prototype.forceUpdate=function(n){this.__v&&(this.__e=!0,n&&this.__h.push(n),m$2(this));},_$B.prototype.render=d$1,t$1=[],o$1="function"==typeof Promise?Promise.prototype.then.bind(Promise.resolve()):setTimeout,g$2.__r=0,f$1=0; + +var t,u,r,o=0,i$1=[],c$1=l$1.__b,f=l$1.__r,e=l$1.diffed,a$1=l$1.__c,v=l$1.unmount;function m$1(t,r){l$1.__h&&l$1.__h(u,t,o||r),o=0;var i=u.__H||(u.__H={__:[],__h:[]});return t>=i.__.length&&i.__.push({}),i.__[t]}function l(n){return o=1,p(w$1,n)}function p(n,r,o){var i=m$1(t++,2);return i.t=n,i.__c||(i.__=[o?o(r):w$1(void 0,r),function(n){var t=i.t(i.__[0],n);i.__[0]!==t&&(i.__=[t,i.__[1]],i.__c.setState({}));}],i.__c=u),i.__}function y$3(r,o){var i=m$1(t++,3);!l$1.__s&&k$1(i.__H,o)&&(i.__=r,i.__H=o,u.__H.__h.push(i));}function h(r,o){var i=m$1(t++,4);!l$1.__s&&k$1(i.__H,o)&&(i.__=r,i.__H=o,u.__h.push(i));}function s(n){return o=5,d(function(){return {current:n}},[])}function _$A(n,t,u){o=6,h(function(){"function"==typeof n?n(t()):n&&(n.current=t());},null==u?u:u.concat(n));}function d(n,u){var r=m$1(t++,7);return k$1(r.__H,u)&&(r.__=n(),r.__H=u,r.__h=n),r.__}function A$1(n,t){return o=8,d(function(){return n},t)}function F$1(n){var r=u.context[n.__c],o=m$1(t++,9);return o.c=n,r?(null==o.__&&(o.__=!0,r.sub(u)),r.props.value):n.__}function T$1(t,u){l$1.useDebugValue&&l$1.useDebugValue(u?u(t):t);}function q$1(n){var r=m$1(t++,10),o=l();return r.__=n,u.componentDidCatch||(u.componentDidCatch=function(n){r.__&&r.__(n),o[1](n);}),[o[0],function(){o[1](void 0);}]}function x$4(){i$1.forEach(function(t){if(t.__P)try{t.__H.__h.forEach(g$1),t.__H.__h.forEach(j$1),t.__H.__h=[];}catch(u){t.__H.__h=[],l$1.__e(u,t.__v);}}),i$1=[];}l$1.__b=function(n){u=null,c$1&&c$1(n);},l$1.__r=function(n){f&&f(n),t=0;var r=(u=n.__c).__H;r&&(r.__h.forEach(g$1),r.__h.forEach(j$1),r.__h=[]);},l$1.diffed=function(t){e&&e(t);var o=t.__c;o&&o.__H&&o.__H.__h.length&&(1!==i$1.push(o)&&r===l$1.requestAnimationFrame||((r=l$1.requestAnimationFrame)||function(n){var t,u=function(){clearTimeout(r),b&&cancelAnimationFrame(t),setTimeout(n);},r=setTimeout(u,100);b&&(t=requestAnimationFrame(u));})(x$4)),u=void 0;},l$1.__c=function(t,u){u.some(function(t){try{t.__h.forEach(g$1),t.__h=t.__h.filter(function(n){return !n.__||j$1(n)});}catch(r){u.some(function(n){n.__h&&(n.__h=[]);}),u=[],l$1.__e(r,t.__v);}}),a$1&&a$1(t,u);},l$1.unmount=function(t){v&&v(t);var u=t.__c;if(u&&u.__H)try{u.__H.__.forEach(g$1);}catch(t){l$1.__e(t,u.__v);}};var b="function"==typeof requestAnimationFrame;function g$1(n){var t=u;"function"==typeof n.__c&&n.__c(),u=t;}function j$1(n){var t=u;n.__c=n.__(),u=t;}function k$1(n,t){return !n||n.length!==t.length||t.some(function(t,u){return t!==n[u]})}function w$1(n,t){return "function"==typeof t?t(n):t} + +function S(n,t){for(var e in t)n[e]=t[e];return n}function C(n,t){for(var e in n)if("__source"!==e&&!(e in t))return !0;for(var r in t)if("__source"!==r&&n[r]!==t[r])return !0;return !1}function E(n){this.props=n;}function g(n,t){function e(n){var e=this.props.ref,r=e==n.ref;return !r&&e&&(e.call?e(null):e.current=null),t?!t(this.props,n)||!r:C(this.props,n)}function r(t){return this.shouldComponentUpdate=e,v$1(n,t)}return r.displayName="Memo("+(n.displayName||n.name)+")",r.prototype.isReactComponent=!0,r.__f=!0,r}(E.prototype=new _$B).isPureReactComponent=!0,E.prototype.shouldComponentUpdate=function(n,t){return C(this.props,n)||C(this.state,t)};var w=l$1.__b;l$1.__b=function(n){n.type&&n.type.__f&&n.ref&&(n.props.ref=n.ref,n.ref=null),w&&w(n);};var R="undefined"!=typeof Symbol&&Symbol.for&&Symbol.for("react.forward_ref")||3911;function x$3(n){function t(t,e){var r=S({},t);return delete r.ref,n(r,(e=t.ref||e)&&("object"!=typeof e||"current"in e)?e:null)}return t.$$typeof=R,t.render=t,t.prototype.isReactComponent=t.__f=!0,t.displayName="ForwardRef("+(n.displayName||n.name)+")",t}var N=function(n,t){return null==n?null:A$2(A$2(n).map(t))},k={map:N,forEach:N,count:function(n){return n?A$2(n).length:0},only:function(n){var t=A$2(n);if(1!==t.length)throw "Children.only";return t[0]},toArray:A$2},A=l$1.__e;l$1.__e=function(n,t,e){if(n.then)for(var r,u=t;u=u.__;)if((r=u.__c)&&r.__c)return null==t.__e&&(t.__e=e.__e,t.__k=e.__k),r.__c(n,t);A(n,t,e);};var O=l$1.unmount;function L(){this.__u=0,this.t=null,this.__b=null;}function U(n){var t=n.__.__c;return t&&t.__e&&t.__e(n)}function F(n){var t,e,r;function u(u){if(t||(t=n()).then(function(n){e=n.default||n;},function(n){r=n;}),r)throw r;if(!e)throw t;return v$1(e,u)}return u.displayName="Lazy",u.__f=!0,u}function M(){this.u=null,this.o=null;}l$1.unmount=function(n){var t=n.__c;t&&t.__R&&t.__R(),t&&!0===n.__h&&(n.type=null),O&&O(n);},(L.prototype=new _$B).__c=function(n,t){var e=t.__c,r=this;null==r.t&&(r.t=[]),r.t.push(e);var u=U(r.__v),o=!1,i=function(){o||(o=!0,e.__R=null,u?u(l):l());};e.__R=i;var l=function(){if(!--r.__u){if(r.state.__e){var n=r.state.__e;r.__v.__k[0]=function n(t,e,r){return t&&(t.__v=null,t.__k=t.__k&&t.__k.map(function(t){return n(t,e,r)}),t.__c&&t.__c.__P===e&&(t.__e&&r.insertBefore(t.__e,t.__d),t.__c.__e=!0,t.__c.__P=r)),t}(n,n.__c.__P,n.__c.__O);}var t;for(r.setState({__e:r.__b=null});t=r.t.pop();)t.forceUpdate();}},f=!0===t.__h;r.__u++||f||r.setState({__e:r.__b=r.__v.__k[0]}),n.then(i,i);},L.prototype.componentWillUnmount=function(){this.t=[];},L.prototype.render=function(n,t){if(this.__b){if(this.__v.__k){var e=document.createElement("div"),r=this.__v.__k[0].__c;this.__v.__k[0]=function n(t,e,r){return t&&(t.__c&&t.__c.__H&&(t.__c.__H.__.forEach(function(n){"function"==typeof n.__c&&n.__c();}),t.__c.__H=null),null!=(t=S({},t)).__c&&(t.__c.__P===r&&(t.__c.__P=e),t.__c=null),t.__k=t.__k&&t.__k.map(function(t){return n(t,e,r)})),t}(this.__b,e,r.__O=r.__P);}this.__b=null;}var u=t.__e&&v$1(d$1,null,n.fallback);return u&&(u.__h=null),[v$1(d$1,null,t.__e?null:n.children),u]};var T=function(n,t,e){if(++e[1]===e[0]&&n.o.delete(t),n.props.revealOrder&&("t"!==n.props.revealOrder[0]||!n.o.size))for(e=n.u;e;){for(;e.length>3;)e.pop()();if(e[1]>>1,1),t.i.removeChild(n);}}),S$1(v$1(D,{context:t.context},n.__v),t.l)):t.l&&t.componentWillUnmount();}function W(n,t){return v$1(I,{__v:n,i:t})}(M.prototype=new _$B).__e=function(n){var t=this,e=U(t.__v),r=t.o.get(n);return r[0]++,function(u){var o=function(){t.props.revealOrder?(r.push(u),T(t,n,r)):u();};e?e(o):o();}},M.prototype.render=function(n){this.u=null,this.o=new Map;var t=A$2(n.children);n.revealOrder&&"b"===n.revealOrder[0]&&t.reverse();for(var e=t.length;e--;)this.o.set(t[e],this.u=[1,0,this.u]);return n.children},M.prototype.componentDidUpdate=M.prototype.componentDidMount=function(){var n=this;this.o.forEach(function(t,e){T(n,e,t);});};var j="undefined"!=typeof Symbol&&Symbol.for&&Symbol.for("react.element")||60103,P=/^(?:accent|alignment|arabic|baseline|cap|clip(?!PathU)|color|fill|flood|font|glyph(?!R)|horiz|marker(?!H|W|U)|overline|paint|stop|strikethrough|stroke|text(?!L)|underline|unicode|units|v|vector|vert|word|writing|x(?!C))[A-Z]/,V=function(n){return ("undefined"!=typeof Symbol&&"symbol"==typeof Symbol()?/fil|che|rad/i:/fil|che|ra/i).test(n)};function z(n,t,e){return null==t.__k&&(t.textContent=""),S$1(n,t),"function"==typeof e&&e(),n?n.__c:null}function B(n,t,e){return q$2(n,t),"function"==typeof e&&e(),n?n.__c:null}_$B.prototype.isReactComponent={},["componentWillMount","componentWillReceiveProps","componentWillUpdate"].forEach(function(n){Object.defineProperty(_$B.prototype,n,{configurable:!0,get:function(){return this["UNSAFE_"+n]},set:function(t){Object.defineProperty(this,n,{configurable:!0,writable:!0,value:t});}});});var H=l$1.event;function Z(){}function Y(){return this.cancelBubble}function $(){return this.defaultPrevented}l$1.event=function(n){return H&&(n=H(n)),n.persist=Z,n.isPropagationStopped=Y,n.isDefaultPrevented=$,n.nativeEvent=n};var q,G={configurable:!0,get:function(){return this.class}},J=l$1.vnode;l$1.vnode=function(n){var t=n.type,e=n.props,r=e;if("string"==typeof t){for(var u in r={},e){var o=e[u];"value"===u&&"defaultValue"in e&&null==o||("defaultValue"===u&&"value"in e&&null==e.value?u="value":"download"===u&&!0===o?o="":/ondoubleclick/i.test(u)?u="ondblclick":/^onchange(textarea|input)/i.test(u+t)&&!V(e.type)?u="oninput":/^on(Ani|Tra|Tou|BeforeInp)/.test(u)?u=u.toLowerCase():P.test(u)?u=u.replace(/[A-Z0-9]/,"-$&").toLowerCase():null===o&&(o=void 0),r[u]=o);}"select"==t&&r.multiple&&Array.isArray(r.value)&&(r.value=A$2(e.children).forEach(function(n){n.props.selected=-1!=r.value.indexOf(n.props.value);})),"select"==t&&null!=r.defaultValue&&(r.value=A$2(e.children).forEach(function(n){n.props.selected=r.multiple?-1!=r.defaultValue.indexOf(n.props.value):r.defaultValue==n.props.value;})),n.props=r;}t&&e.class!=e.className&&(G.enumerable="className"in e,null!=e.className&&(r.class=e.className),Object.defineProperty(r,"className",G)),n.$$typeof=j,J&&J(n);};var K=l$1.__r;l$1.__r=function(n){K&&K(n),q=n.__c;};var Q={ReactCurrentDispatcher:{current:{readContext:function(n){return q.__n[n.__c].props.value}}}},X="17.0.2";function nn(n){return v$1.bind(null,n)}function tn(n){return !!n&&n.$$typeof===j}function en(n){return tn(n)?B$1.apply(null,arguments):n}function rn(n){return !!n.__k&&(S$1(null,n),!0)}function un(n){return n&&(n.base||1===n.nodeType&&n)||null}var on=function(n,t){return n(t)},ln=function(n,t){return n(t)},fn=d$1;var React = {useState:l,useReducer:p,useEffect:y$3,useLayoutEffect:h,useRef:s,useImperativeHandle:_$A,useMemo:d,useCallback:A$1,useContext:F$1,useDebugValue:T$1,version:"17.0.2",Children:k,render:z,hydrate:B,unmountComponentAtNode:rn,createPortal:W,createElement:v$1,createContext:D$1,createFactory:nn,cloneElement:en,createRef:p$1,Fragment:d$1,isValidElement:tn,findDOMNode:un,Component:_$B,PureComponent:E,memo:g,forwardRef:x$3,flushSync:ln,unstable_batchedUpdates:on,StrictMode:d$1,Suspense:L,SuspenseList:M,lazy:F,__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED:Q}; + +var index_module = /*#__PURE__*/Object.freeze({ + __proto__: null, + 'default': React, + createElement: v$1, + createContext: D$1, + createRef: p$1, + Fragment: d$1, + Component: _$B, + useState: l, + useReducer: p, + useEffect: y$3, + useLayoutEffect: h, + useRef: s, + useImperativeHandle: _$A, + useMemo: d, + useCallback: A$1, + useContext: F$1, + useDebugValue: T$1, + useErrorBoundary: q$1, + version: X, + Children: k, + render: z, + hydrate: B, + unmountComponentAtNode: rn, + createPortal: W, + createFactory: nn, + cloneElement: en, + isValidElement: tn, + findDOMNode: un, + PureComponent: E, + memo: g, + forwardRef: x$3, + flushSync: ln, + unstable_batchedUpdates: on, + StrictMode: fn, + Suspense: L, + SuspenseList: M, + lazy: F, + __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED: Q +}); + +var isArrayLike$a = function (value) { + /** + * isArrayLike([1, 2, 3]) => true + * isArrayLike(document.body.children) => true + * isArrayLike('abc') => true + * isArrayLike(Function) => false + */ + return value !== null && typeof value !== 'function' && isFinite(value.length); +}; + +var contains = function (arr, value) { + if (!isArrayLike$a(arr)) { + return false; + } + return arr.indexOf(value) > -1; +}; + +var filter$1 = function (arr, func) { + if (!isArrayLike$a(arr)) { + return arr; + } + var result = []; + for (var index = 0; index < arr.length; index++) { + var value = arr[index]; + if (func(value, index)) { + result.push(value); + } + } + return result; +}; + +/** + * Flattens `array` a single level deep. + * + * @param {Array} arr The array to inspect. + * @param {Array} values The values to exclude. + * @return {Array} Returns the new array of filtered values. + * @example + * difference([2, 1], [2, 3]); // => [1] + */ +var difference = function (arr, values) { + if (values === void 0) { values = []; } + return filter$1(arr, function (value) { return !contains(values, value); }); +}; + +var toString$8 = {}.toString; +var isType$3 = function (value, type) { return toString$8.call(value) === '[object ' + type + ']'; }; + +/** + * 是否为函数 + * @param {*} fn 对象 + * @return {Boolean} 是否函数 + */ +var isFunction$6 = (function (value) { + return isType$3(value, 'Function'); +}); + +// isFinite, +var isNil = function (value) { + /** + * isNil(null) => true + * isNil() => true + */ + return value === null || value === undefined; +}; + +var isArray$n = (function (value) { + return Array.isArray ? + Array.isArray(value) : + isType$3(value, 'Array'); +}); + +var isObject$f = (function (value) { + /** + * isObject({}) => true + * isObject([1, 2, 3]) => true + * isObject(Function) => true + * isObject(null) => false + */ + var type = typeof value; + return value !== null && type === 'object' || type === 'function'; +}); + +function each$2(elements, func) { + if (!elements) { + return; + } + var rst; + if (isArray$n(elements)) { + for (var i = 0, len = elements.length; i < len; i++) { + rst = func(elements[i], i); + if (rst === false) { + break; + } + } + } + else if (isObject$f(elements)) { + for (var k in elements) { + if (elements.hasOwnProperty(k)) { + rst = func(elements[k], k); + if (rst === false) { + break; + } + } + } + } +} + +var keys$8 = Object.keys ? function (obj) { return Object.keys(obj); } : function (obj) { + var result = []; + each$2(obj, function (value, key) { + if (!(isFunction$6(obj) && key === 'prototype')) { + result.push(key); + } + }); + return result; +}; + +function isMatch(obj, attrs) { + var _keys = keys$8(attrs); + var length = _keys.length; + if (isNil(obj)) + return !length; + for (var i = 0; i < length; i += 1) { + var key = _keys[i]; + if (attrs[key] !== obj[key] || !(key in obj)) { + return false; + } + } + return true; +} + +var isObjectLike$f = function (value) { + /** + * isObjectLike({}) => true + * isObjectLike([1, 2, 3]) => true + * isObjectLike(Function) => false + * isObjectLike(null) => false + */ + return typeof value === 'object' && value !== null; +}; + +var isPlainObject$3 = function (value) { + /** + * isObjectLike(new Foo) => false + * isObjectLike([1, 2, 3]) => false + * isObjectLike({ x: 0, y: 0 }) => true + * isObjectLike(Object.create(null)) => true + */ + if (!isObjectLike$f(value) || !isType$3(value, 'Object')) { + return false; + } + if (Object.getPrototypeOf(value) === null) { + return true; + } + var proto = value; + while (Object.getPrototypeOf(proto) !== null) { + proto = Object.getPrototypeOf(proto); + } + return Object.getPrototypeOf(value) === proto; +}; + +function find$3(arr, predicate) { + if (!isArray$n(arr)) + return null; + var _predicate; + if (isFunction$6(predicate)) { + _predicate = predicate; + } + if (isPlainObject$3(predicate)) { + _predicate = function (a) { return isMatch(a, predicate); }; + } + if (_predicate) { + for (var i = 0; i < arr.length; i += 1) { + if (_predicate(arr[i])) { + return arr[i]; + } + } + } + return null; +} + +function findIndex$2(arr, predicate, fromIndex) { + if (fromIndex === void 0) { fromIndex = 0; } + for (var i = fromIndex; i < arr.length; i++) { + if (predicate(arr[i], i)) { + // 找到终止循环 + return i; + } + } + return -1; +} + +var firstValue = function (data, name) { + var rst = null; + for (var i = 0; i < data.length; i++) { + var obj = data[i]; + var value = obj[name]; + if (!isNil(value)) { + if (isArray$n(value)) { + rst = value[0]; // todo 这里是否应该使用递归，调用 firstValue @绝云 + } + else { + rst = value; + } + break; + } + } + return rst; +}; + +/** + * Flattens `array` a single level deep. + * + * @param {Array} arr The array to flatten. + * @return {Array} Returns the new flattened array. + * @example + * + * flatten([1, [2, [3, [4]], 5]]); // => [1, 2, [3, [4]], 5] + */ +var flatten$2 = function (arr) { + if (!isArray$n(arr)) { + return []; + } + var rst = []; + for (var i = 0; i < arr.length; i++) { + rst = rst.concat(arr[i]); + } + return rst; +}; + +/** + * @param {Array} arr The array to iterate over. + * @return {*} Returns the maximum value. + * @example + * + * max([1, 2]); + * // => 2 + * + * max([]); + * // => undefined + * + * const data = new Array(1250010).fill(1).map((d,idx) => idx); + * + * max(data); + * // => 1250010 + * // Math.max(...data) will encounter "Maximum call stack size exceeded" error + */ +var max$7 = (function (arr) { + if (!isArray$n(arr)) { + return undefined; + } + return arr.reduce(function (prev, curr) { + return Math.max(prev, curr); + }, arr[0]); +}); + +/** + * @param {Array} arr The array to iterate over. + * @return {*} Returns the minimum value. + * @example + * + * min([1, 2]); + * // => 1 + * + * min([]); + * // => undefined + * + * const data = new Array(1250010).fill(1).map((d,idx) => idx); + * + * min(data); + * // => 1250010 + * // Math.min(...data) will encounter "Maximum call stack size exceeded" error + */ +var min$6 = (function (arr) { + if (!isArray$n(arr)) { + return undefined; + } + return arr.reduce(function (prev, curr) { + return Math.min(prev, curr); + }, arr[0]); +}); + +var getRange = function (values) { + // 存在 NaN 时，min,max 判定会出问题 + var filterValues = values.filter(function (v) { return !isNaN(v); }); + if (!filterValues.length) { + // 如果没有数值则直接返回0 + return { + min: 0, + max: 0, + }; + } + if (isArray$n(values[0])) { + var tmp = []; + for (var i = 0; i < values.length; i++) { + tmp = tmp.concat(values[i]); + } + filterValues = tmp; + } + var max = max$7(filterValues); + var min = min$6(filterValues); + return { + min: min, + max: max, + }; +}; + +var splice$1 = Array.prototype.splice; +var pullAt = function pullAt(arr, indexes) { + if (!isArrayLike$a(arr)) { + return []; + } + var length = arr ? indexes.length : 0; + var last = length - 1; + while (length--) { + var previous = void 0; + var index = indexes[length]; + if (length === last || index !== previous) { + previous = index; + splice$1.call(arr, index, 1); + } + } + return arr; +}; + +var reduce$1 = function (arr, fn, init) { + if (!isArray$n(arr) && !isPlainObject$3(arr)) { + return arr; + } + var result = init; + each$2(arr, function (data, i) { + result = fn(result, data, i); + }); + return result; +}; + +var remove = function (arr, predicate) { + /** + * const arr = [1, 2, 3, 4] + * const evens = remove(arr, n => n % 2 == 0) + * console.log(arr) // => [1, 3] + * console.log(evens) // => [2, 4] + */ + var result = []; + if (!isArrayLike$a(arr)) { + return result; + } + var i = -1; + var indexes = []; + var length = arr.length; + while (++i < length) { + var value = arr[i]; + if (predicate(value, i, arr)) { + result.push(value); + indexes.push(i); + } + } + pullAt(arr, indexes); + return result; +}; + +var isString$3 = (function (str) { + return isType$3(str, 'String'); +}); + +function sortBy$1(arr, key) { + var comparer; + if (isFunction$6(key)) { + comparer = function (a, b) { return key(a) - key(b); }; + } + else { + var keys_1 = []; + if (isString$3(key)) { + keys_1.push(key); + } + else if (isArray$n(key)) { + keys_1 = key; + } + comparer = function (a, b) { + for (var i = 0; i < keys_1.length; i += 1) { + var prop = keys_1[i]; + if (a[prop] > b[prop]) { + return 1; + } + if (a[prop] < b[prop]) { + return -1; + } + } + return 0; + }; + } + arr.sort(comparer); + return arr; +} + +function uniq$3(arr, cache) { + if (cache === void 0) { cache = new Map(); } + var r = []; + if (Array.isArray(arr)) { + for (var i = 0, len = arr.length; i < len; i++) { + var item = arr[i]; + // 加一个 cache，提升性能 + if (!cache.has(item)) { + r.push(item); + cache.set(item, true); + } + } + } + return r; +} + +var valuesOfKey = (function (data, name) { + var rst = []; + var tmpMap = {}; + for (var i = 0; i < data.length; i++) { + var obj = data[i]; + var value = obj[name]; + if (!isNil(value)) { + // flatten + if (!isArray$n(value)) { + value = [value]; + } + for (var j = 0; j < value.length; j++) { + var val = value[j]; + // unique + if (!tmpMap[val]) { + rst.push(val); + tmpMap[val] = true; + } + } + } + } + return rst; +}); + +function head(o) { + if (isArrayLike$a(o)) { + return o[0]; + } + return undefined; +} + +function last$1(o) { + if (isArrayLike$a(o)) { + var arr = o; + return arr[arr.length - 1]; + } + return undefined; +} + +/** + * 只要有一个不满足条件就返回 false + * @param arr + * @param func + */ +var every = function (arr, func) { + for (var i = 0; i < arr.length; i++) { + if (!func(arr[i], i)) + return false; + } + return true; +}; + +/** + * 只要有一个满足条件就返回 true + * @param arr + * @param func + */ +var some = function (arr, func) { + for (var i = 0; i < arr.length; i++) { + if (func(arr[i], i)) + return true; + } + return false; +}; + +var hasOwnProperty$i = Object.prototype.hasOwnProperty; +function groupBy(data, condition) { + if (!condition || !isArray$n(data)) { + return {}; + } + var result = {}; + // 兼容方法和 字符串的写法 + var predicate = isFunction$6(condition) ? condition : function (item) { return item[condition]; }; + var key; + for (var i = 0; i < data.length; i++) { + var item = data[i]; + key = predicate(item); + if (hasOwnProperty$i.call(result, key)) { + result[key].push(item); + } + else { + result[key] = [item]; + } + } + return result; +} + +/** + * 将数据分组成 map + * @param data + * @param condition + */ +function groupToMap(data, condition) { + if (!condition) { + return { + 0: data, + }; + } + if (!isFunction$6(condition)) { + // 如果是字符串，则按照 a*b 风格成数组 + var paramscondition_1 = isArray$n(condition) ? condition : condition.replace(/\s+/g, '').split('*'); + condition = function (row) { + var unique = '_'; // 避免出现数字作为Key的情况，会进行按照数字的排序 + // 根据字段列表的值，拼接成 key + for (var i = 0, l = paramscondition_1.length; i < l; i++) { + unique += row[paramscondition_1[i]] && row[paramscondition_1[i]].toString(); + } + return unique; + }; + } + return groupBy(data, condition); +} + +var group$1 = (function (data, condition) { + if (!condition) { + // 没有条件，则自身改成数组 + return [data]; + } + var groups = groupToMap(data, condition); + var array = []; + for (var i in groups) { + array.push(groups[i]); + } + return array; +}); + +/** + * 封装事件，便于使用上下文this,和便于解除事件时使用 + * @protected + * @param {Object} obj 对象 + * @param {String} action 事件名称 + * @return {Function} 返回事件处理函数 + */ +function wrapBehavior(obj, action) { + if (obj['_wrap_' + action]) { + return obj['_wrap_' + action]; + } + var method = function (e) { + obj[action](e); + }; + obj['_wrap_' + action] = method; + return method; +} + +var clamp$1 = function (a, min, max) { + if (a < min) { + return min; + } + else if (a > max) { + return max; + } + return a; +}; + +var fixedBase = function (v, base) { + var str = base.toString(); + var index = str.indexOf('.'); + if (index === -1) { + return Math.round(v); + } + var length = str.substr(index + 1).length; + if (length > 20) { + length = 20; + } + return parseFloat(v.toFixed(length)); +}; + +/** + * 判断是否数字 + * @return {Boolean} 是否数字 + */ +var isNumber$4 = function (value) { + return isType$3(value, 'Number'); +}; + +var PRECISION = 0.00001; // numbers less than this is considered as 0 +function isNumberEqual$1(a, b, precision) { + if (precision === void 0) { precision = PRECISION; } + return Math.abs((a - b)) < precision; +} + +/** + * @param {Array} arr The array to iterate over. + * @param {Function} [fn] The iteratee invoked per element. + * @return {*} Returns the maximum value. + * @example + * + * var objects = [{ 'n': 1 }, { 'n': 2 }]; + * + * maxBy(objects, function(o) { return o.n; }); + * // => { 'n': 2 } + * + * maxBy(objects, 'n'); + * // => { 'n': 2 } + */ +var maxBy = (function (arr, fn) { + if (!isArray$n(arr)) { + return undefined; + } + var maxItem; + var max = -Infinity; + for (var i = 0; i < arr.length; i++) { + var item = arr[i]; + var v = isFunction$6(fn) ? fn(item) : item[fn]; + if (v > max) { + maxItem = item; + max = v; + } + } + return maxItem; +}); + +/** + * @param {Array} arr The array to iterate over. + * @param {Function} [fn] The iteratee invoked per element. + * @return {*} Returns the minimum value. + * @example + * + * var objects = [{ 'n': 1 }, { 'n': 2 }]; + * + * minBy(objects, function(o) { return o.n; }); + * // => { 'n': 1 } + * + * minBy(objects, 'n'); + * // => { 'n': 1 } + */ +var minBy$1 = (function (arr, fn) { + if (!isArray$n(arr)) { + return undefined; + } + var minItem; + var min = Infinity; + for (var i = 0; i < arr.length; i++) { + var item = arr[i]; + var v = isFunction$6(fn) ? fn(item) : item[fn]; + if (v < min) { + minItem = item; + min = v; + } + } + return minItem; +}); + +var mod$1 = function (n, m) { + return ((n % m) + m) % m; +}; + +var RADIAN = Math.PI / 180; +var toRadian = function (degree) { + return RADIAN * degree; +}; + +var has$1 = (function (obj, key) { return obj.hasOwnProperty(key); }); + +// @ts-ignore +var values$1 = Object.values ? function (obj) { return Object.values(obj); } : function (obj) { + var result = []; + each$2(obj, function (value, key) { + if (!(isFunction$6(obj) && key === 'prototype')) { + result.push(value); + } + }); + return result; +}; + +var toString$7 = (function (value) { + if (isNil(value)) + return ''; + return value.toString(); +}); + +var lowerCase = function (str) { + return toString$7(str).toLowerCase(); +}; +var lowerCase$1 = lowerCase; + +function substitute$1(str, o) { + if (!str || !o) { + return str; + } + return str.replace(/\\?\{([^{}]+)\}/g, function (match, name) { + if (match.charAt(0) === '\\') { + return match.slice(1); + } + return (o[name] === undefined) ? '' : o[name]; + }); +} + +var upperFirst = function (value) { + var str = toString$7(value); + return str.charAt(0).toUpperCase() + str.substring(1); +}; + +var toString$6 = {}.toString; +var getType$1 = function (value) { + return toString$6.call(value).replace(/^\[object /, '').replace(/]$/, ''); +}; + +/** + * 是否是布尔类型 + * + * @param {Object} value 测试的值 + * @return {Boolean} + */ +var isBoolean = function (value) { + return isType$3(value, 'Boolean'); +}; + +var isDate = function (value) { + return isType$3(value, 'Date'); +}; + +var isNull = function (value) { + return value === null; +}; + +var objectProto$m = Object.prototype; +var isPrototype$5 = function (value) { + var Ctor = value && value.constructor; + var proto = (typeof Ctor === 'function' && Ctor.prototype) || objectProto$m; + return value === proto; +}; + +var isUndefined$1 = function (value) { + return value === undefined; +}; + +/** + * 判断是否HTML元素 + * @return {Boolean} 是否HTML元素 + */ +var isElement = function (o) { + return o instanceof Element || o instanceof HTMLDocument; +}; + +function requestAnimationFrame$1(fn) { + var method = window.requestAnimationFrame || + window.webkitRequestAnimationFrame || + // @ts-ignore + window.mozRequestAnimationFrame || + // @ts-ignore + window.msRequestAnimationFrame || + function (f) { + return setTimeout(f, 16); + }; + return method(fn); +} + +function cancelAnimationFrame$1(handler) { + var method = window.cancelAnimationFrame || + window.webkitCancelAnimationFrame || + // @ts-ignore + window.mozCancelAnimationFrame || + // @ts-ignore + window.msCancelAnimationFrame || + clearTimeout; + method(handler); +} + +// FIXME: Mutable param should be forbidden in static lang. +function _mix(dist, obj) { + for (var key in obj) { + if (obj.hasOwnProperty(key) && key !== 'constructor' && obj[key] !== undefined) { + dist[key] = obj[key]; + } + } +} +function mix(dist, src1, src2, src3) { + if (src1) + _mix(dist, src1); + if (src2) + _mix(dist, src2); + if (src3) + _mix(dist, src3); + return dist; +} + +var clone$7 = function (obj) { + if (typeof obj !== 'object' || obj === null) { + return obj; + } + var rst; + if (isArray$n(obj)) { + rst = []; + for (var i = 0, l = obj.length; i < l; i++) { + if (typeof obj[i] === 'object' && obj[i] != null) { + rst[i] = clone$7(obj[i]); + } + else { + rst[i] = obj[i]; + } + } + } + else { + rst = {}; + for (var k in obj) { + if (typeof obj[k] === 'object' && obj[k] != null) { + rst[k] = clone$7(obj[k]); + } + else { + rst[k] = obj[k]; + } + } + } + return rst; +}; + +function debounce$1(func, wait, immediate) { + var timeout; + return function () { + var context = this, args = arguments; + var later = function () { + timeout = null; + if (!immediate) { + func.apply(context, args); + } + }; + var callNow = immediate && !timeout; + clearTimeout(timeout); + timeout = setTimeout(later, wait); + if (callNow) { + func.apply(context, args); + } + }; +} + +/** + * _.memoize(calColor); + * _.memoize(calColor, (...args) => args[0]); + * @param f + * @param resolver + */ +var memoize$2 = (function (f, resolver) { + if (!isFunction$6(f)) { + throw new TypeError('Expected a function'); + } + var memoized = function () { + var args = []; + for (var _i = 0; _i < arguments.length; _i++) { + args[_i] = arguments[_i]; + } + // 使用方法构造 key，如果不存在 resolver，则直接取第一个参数作为 key + var key = resolver ? resolver.apply(this, args) : args[0]; + var cache = memoized.cache; + if (cache.has(key)) { + return cache.get(key); + } + var result = f.apply(this, args); + // 缓存起来 + cache.set(key, result); + return result; + }; + memoized.cache = new Map(); + return memoized; +}); + +var MAX_MIX_LEVEL$1 = 5; +function _deepMix(dist, src, level, maxLevel) { + level = level || 0; + maxLevel = maxLevel || MAX_MIX_LEVEL$1; + for (var key in src) { + if (src.hasOwnProperty(key)) { + var value = src[key]; + if (value !== null && isPlainObject$3(value)) { + if (!isPlainObject$3(dist[key])) { + dist[key] = {}; + } + if (level < maxLevel) { + _deepMix(dist[key], value, level + 1, maxLevel); + } + else { + dist[key] = src[key]; + } + } + else if (isArray$n(value)) { + dist[key] = []; + dist[key] = dist[key].concat(value); + } + else if (value !== undefined) { + dist[key] = value; + } + } + } +} +// todo 重写 +var deepMix = function (rst) { + var args = []; + for (var _i = 1; _i < arguments.length; _i++) { + args[_i - 1] = arguments[_i]; + } + for (var i = 0; i < args.length; i += 1) { + _deepMix(rst, args[i]); + } + return rst; +}; + +var indexOf = function (arr, obj) { + if (!isArrayLike$a(arr)) { + return -1; + } + var m = Array.prototype.indexOf; + if (m) { + return m.call(arr, obj); + } + var index = -1; + for (var i = 0; i < arr.length; i++) { + if (arr[i] === obj) { + index = i; + break; + } + } + return index; +}; + +var hasOwnProperty$h = Object.prototype.hasOwnProperty; +function isEmpty$1(value) { + /** + * isEmpty(null) => true + * isEmpty() => true + * isEmpty(true) => true + * isEmpty(1) => true + * isEmpty([1, 2, 3]) => false + * isEmpty('abc') => false + * isEmpty({ a: 1 }) => false + */ + if (isNil(value)) { + return true; + } + if (isArrayLike$a(value)) { + return !value.length; + } + var type = getType$1(value); + if (type === 'Map' || type === 'Set') { + return !value.size; + } + if (isPrototype$5(value)) { + return !Object.keys(value).length; + } + for (var key in value) { + if (hasOwnProperty$h.call(value, key)) { + return false; + } + } + return true; +} + +var isEqual$2 = function (value, other) { + if (value === other) { + return true; + } + if (!value || !other) { + return false; + } + if (isString$3(value) || isString$3(other)) { + return false; + } + if (isArrayLike$a(value) || isArrayLike$a(other)) { + if (value.length !== other.length) { + return false; + } + var rst = true; + for (var i = 0; i < value.length; i++) { + rst = isEqual$2(value[i], other[i]); + if (!rst) { + break; + } + } + return rst; + } + if (isObjectLike$f(value) || isObjectLike$f(other)) { + var valueKeys = Object.keys(value); + var otherKeys = Object.keys(other); + if (valueKeys.length !== otherKeys.length) { + return false; + } + var rst = true; + for (var i = 0; i < valueKeys.length; i++) { + rst = isEqual$2(value[valueKeys[i]], other[valueKeys[i]]); + if (!rst) { + break; + } + } + return rst; + } + return false; +}; + +var map$4 = function (arr, func) { + if (!isArrayLike$a(arr)) { + // @ts-ignore + return arr; + } + var result = []; + for (var index = 0; index < arr.length; index++) { + var value = arr[index]; + result.push(func(value, index)); + } + return result; +}; + +var identity$a = function (v) { return v; }; +var mapValues$1 = (function (object, func) { + if (func === void 0) { func = identity$a; } + var r = {}; + if (isObject$f(object) && !isNil(object)) { + Object.keys(object).forEach(function (key) { + // @ts-ignore + r[key] = func(object[key], key); + }); + } + return r; +}); + +/** + * https://github.com/developit/dlv/blob/master/index.js + * @param obj + * @param key + * @param defaultValue + */ +var get$3 = (function (obj, key, defaultValue) { + var p = 0; + var keyArr = isString$3(key) ? key.split('.') : key; + while (obj && p < keyArr.length) { + obj = obj[keyArr[p++]]; + } + return (obj === undefined || p < keyArr.length) ? defaultValue : obj; +}); + +/** + * https://github.com/developit/dlv/blob/master/index.js + * @param obj + * @param path + * @param value + */ +var set$5 = (function (obj, path, value) { + var o = obj; + var keyArr = isString$3(path) ? path.split('.') : path; + keyArr.forEach(function (key, idx) { + // 不是最后一个 + if (idx < keyArr.length - 1) { + if (!isObject$f(o[key])) { + o[key] = isNumber$4(keyArr[idx + 1]) ? [] : {}; + } + o = o[key]; + } + else { + o[key] = value; + } + }); + return obj; +}); + +var hasOwnProperty$g = Object.prototype.hasOwnProperty; +var pick$2 = (function (object, keys) { + if (object === null || !isPlainObject$3(object)) { + return {}; + } + var result = {}; + each$2(keys, function (key) { + if (hasOwnProperty$g.call(object, key)) { + result[key] = object[key]; + } + }); + return result; +}); + +var omit$1 = (function (obj, keys) { + return reduce$1(obj, function (r, curr, key) { + if (!keys.includes(key)) { + r[key] = curr; + } + return r; + }, {}); +}); + +var throttle = (function (func, wait, options) { + var timeout, context, args, result; + var previous = 0; + if (!options) + options = {}; + var later = function () { + previous = options.leading === false ? 0 : Date.now(); + timeout = null; + result = func.apply(context, args); + if (!timeout) + context = args = null; + }; + var throttled = function () { + var now = Date.now(); + if (!previous && options.leading === false) + previous = now; + var remaining = wait - (now - previous); + context = this; + args = arguments; + if (remaining <= 0 || remaining > wait) { + if (timeout) { + clearTimeout(timeout); + timeout = null; + } + previous = now; + result = func.apply(context, args); + if (!timeout) + context = args = null; + } + else if (!timeout && options.trailing !== false) { + timeout = setTimeout(later, remaining); + } + return result; + }; + throttled.cancel = function () { + clearTimeout(timeout); + previous = 0; + timeout = context = args = null; + }; + return throttled; +}); + +var toArray = (function (value) { + return isArrayLike$a(value) ? Array.prototype.slice.call(value) : []; +}); + +var map$3 = {}; +var uniqueId$3 = (function (prefix) { + prefix = prefix || 'g'; + if (!map$3[prefix]) { + map$3[prefix] = 1; + } + else { + map$3[prefix] += 1; + } + return prefix + map$3[prefix]; +}); + +var noop$3 = (function () { }); + +function size$1(o) { + if (isNil(o)) { + return 0; + } + if (isArrayLike$a(o)) { + return o.length; + } + return Object.keys(o).length; +} + +var ctx$2; +/** + * 计算文本的宽度 + */ +memoize$2(function (text, font) { + if (font === void 0) { font = {}; } + var fontSize = font.fontSize, fontFamily = font.fontFamily, fontWeight = font.fontWeight, fontStyle = font.fontStyle, fontVariant = font.fontVariant; + if (!ctx$2) { + ctx$2 = document.createElement('canvas').getContext('2d'); + } + ctx$2.font = [fontStyle, fontVariant, fontWeight, fontSize + "px", fontFamily].join(' '); + return ctx$2.measureText(isString$3(text) ? text : '').width; +}, function (text, font) { + if (font === void 0) { font = {}; } + return __spreadArrays$1([text], values$1(font)).join(''); +}); + +/** + * k-v 存储 + */ +var default_1 = /** @class */ (function () { + function default_1() { + this.map = {}; + } + default_1.prototype.has = function (key) { + return this.map[key] !== undefined; + }; + default_1.prototype.get = function (key, def) { + var v = this.map[key]; + return v === undefined ? def : v; + }; + default_1.prototype.set = function (key, value) { + this.map[key] = value; + }; + default_1.prototype.clear = function () { + this.map = {}; + }; + default_1.prototype.delete = function (key) { + delete this.map[key]; + }; + default_1.prototype.size = function () { + return Object.keys(this.map).length; + }; + return default_1; +}()); + +/** + * view 中三层 group 分层 key + */ +var LAYER; +(function (LAYER) { + /** 前景层 */ + LAYER["FORE"] = "fore"; + /** 中间层 */ + LAYER["MID"] = "mid"; + /** 背景层 */ + LAYER["BG"] = "bg"; +})(LAYER || (LAYER = {})); +/** + * 组件在画布的布局方位 12 方位 + */ +var DIRECTION; +(function (DIRECTION) { + DIRECTION["TOP"] = "top"; + DIRECTION["TOP_LEFT"] = "top-left"; + DIRECTION["TOP_RIGHT"] = "top-right"; + DIRECTION["RIGHT"] = "right"; + DIRECTION["RIGHT_TOP"] = "right-top"; + DIRECTION["RIGHT_BOTTOM"] = "right-bottom"; + DIRECTION["LEFT"] = "left"; + DIRECTION["LEFT_TOP"] = "left-top"; + DIRECTION["LEFT_BOTTOM"] = "left-bottom"; + DIRECTION["BOTTOM"] = "bottom"; + DIRECTION["BOTTOM_LEFT"] = "bottom-left"; + DIRECTION["BOTTOM_RIGHT"] = "bottom-right"; + DIRECTION["RADIUS"] = "radius"; + DIRECTION["CIRCLE"] = "circle"; + // no direction information + DIRECTION["NONE"] = "none"; +})(DIRECTION || (DIRECTION = {})); +/** + * 组件的类型，可能会影响到布局算法 + */ +var COMPONENT_TYPE; +(function (COMPONENT_TYPE) { + /** axis 组件 */ + COMPONENT_TYPE["AXIS"] = "axis"; + /** grid 组件 */ + COMPONENT_TYPE["GRID"] = "grid"; + /** legend 组件 */ + COMPONENT_TYPE["LEGEND"] = "legend"; + /** tooltip 组件 */ + COMPONENT_TYPE["TOOLTIP"] = "tooltip"; + /** annotation 组件 */ + COMPONENT_TYPE["ANNOTATION"] = "annotation"; + /** 缩略轴组件 */ + COMPONENT_TYPE["SLIDER"] = "slider"; + /** 滚动条组件 */ + COMPONENT_TYPE["SCROLLBAR"] = "scrollbar"; + /** 其他组件，自定义组件 */ + COMPONENT_TYPE["OTHER"] = "other"; +})(COMPONENT_TYPE || (COMPONENT_TYPE = {})); +/** + * 三层 group 的 z index + */ +var GROUP_Z_INDEX = { + FORE: 3, + MID: 2, + BG: 1, +}; +/** + * View 的生命周期阶段（和 3.x 的生命周期略有不同） + * 我们需要先确定在那写场景需要用到生命周期，如果只是为了在生命周期插入一下什么组件之类的，那么在现有架构就是不需要的 + */ +var VIEW_LIFE_CIRCLE; +(function (VIEW_LIFE_CIRCLE) { + VIEW_LIFE_CIRCLE["BEFORE_RENDER"] = "beforerender"; + VIEW_LIFE_CIRCLE["AFTER_RENDER"] = "afterrender"; + VIEW_LIFE_CIRCLE["BEFORE_PAINT"] = "beforepaint"; + VIEW_LIFE_CIRCLE["AFTER_PAINT"] = "afterpaint"; + VIEW_LIFE_CIRCLE["BEFORE_CHANGE_DATA"] = "beforechangedata"; + VIEW_LIFE_CIRCLE["AFTER_CHANGE_DATA"] = "afterchangedata"; + VIEW_LIFE_CIRCLE["BEFORE_CLEAR"] = "beforeclear"; + VIEW_LIFE_CIRCLE["AFTER_CLEAR"] = "afterclear"; + VIEW_LIFE_CIRCLE["BEFORE_DESTROY"] = "beforedestroy"; + VIEW_LIFE_CIRCLE["BEFORE_CHANGE_SIZE"] = "beforechangesize"; + VIEW_LIFE_CIRCLE["AFTER_CHANGE_SIZE"] = "afterchangesize"; +})(VIEW_LIFE_CIRCLE || (VIEW_LIFE_CIRCLE = {})); +/** + * geometry 的生命周期 + */ +var GEOMETRY_LIFE_CIRCLE; +(function (GEOMETRY_LIFE_CIRCLE) { + GEOMETRY_LIFE_CIRCLE["BEFORE_DRAW_ANIMATE"] = "beforeanimate"; + GEOMETRY_LIFE_CIRCLE["AFTER_DRAW_ANIMATE"] = "afteranimate"; +})(GEOMETRY_LIFE_CIRCLE || (GEOMETRY_LIFE_CIRCLE = {})); +/** + * 绘图区的事件列表 + */ +var PLOT_EVENTS; +(function (PLOT_EVENTS) { + // mouse 事件 + PLOT_EVENTS["MOUSE_ENTER"] = "plot:mouseenter"; + PLOT_EVENTS["MOUSE_DOWN"] = "plot:mousedown"; + PLOT_EVENTS["MOUSE_MOVE"] = "plot:mousemove"; + PLOT_EVENTS["MOUSE_UP"] = "plot:mouseup"; + PLOT_EVENTS["MOUSE_LEAVE"] = "plot:mouseleave"; + // 移动端事件 + PLOT_EVENTS["TOUCH_START"] = "plot:touchstart"; + PLOT_EVENTS["TOUCH_MOVE"] = "plot:touchmove"; + PLOT_EVENTS["TOUCH_END"] = "plot:touchend"; + PLOT_EVENTS["TOUCH_CANCEL"] = "plot:touchcancel"; + // click 事件 + PLOT_EVENTS["CLICK"] = "plot:click"; + PLOT_EVENTS["DBLCLICK"] = "plot:dblclick"; + PLOT_EVENTS["CONTEXTMENU"] = "plot:contextmenu"; + PLOT_EVENTS["LEAVE"] = "plot:leave"; + PLOT_EVENTS["ENTER"] = "plot:enter"; +})(PLOT_EVENTS || (PLOT_EVENTS = {})); +/** + * Element 图形交互状态 + */ +var ELEMENT_STATE; +(function (ELEMENT_STATE) { + ELEMENT_STATE["ACTIVE"] = "active"; + ELEMENT_STATE["INACTIVE"] = "inactive"; + ELEMENT_STATE["SELECTED"] = "selected"; + ELEMENT_STATE["DEFAULT"] = "default"; +})(ELEMENT_STATE || (ELEMENT_STATE = {})); +/** 参与分组的图形属性名 */ +var GROUP_ATTRS = ['color', 'shape', 'size']; +/** 存储原始数据的字段名 */ +var FIELD_ORIGIN = '_origin'; +/** 最小的图表宽度 */ +var MIN_CHART_WIDTH = 1; +/** 最小的图表高度 */ +var MIN_CHART_HEIGHT = 1; +/** 辅助组件占图表的尺寸的最大比例：如图表上方的图例最多占图表高度的25% */ +var COMPONENT_MAX_VIEW_PERCENTAGE = 0.25; + +var ENGINES = {}; +/** + * 通过名字获取渲染 engine + * @param name 渲染引擎名字 + * @returns G engine + */ +function getEngine(name) { + var G = ENGINES[name]; + if (!G) { + throw new Error("G engine '" + name + "' is not exist, please register it at first."); + } + return G; +} +/** + * 注册渲染引擎 + * @param name + * @param engine + */ +function registerEngine(name, engine) { + ENGINES[name] = engine; +} + +function addEventListener(target, eventType, callback) { + if (target) { + if (typeof target.addEventListener === 'function') { + target.addEventListener(eventType, callback, false); + return { + remove: function () { + target.removeEventListener(eventType, callback, false); + }, + }; + // @ts-ignore + } + if (typeof target.attachEvent === 'function') { + // @ts-ignore + target.attachEvent('on' + eventType, callback); + return { + remove: function () { + // @ts-ignore + target.detachEvent('on' + eventType, callback); + }, + }; + } + } +} + +/** + * 创建DOM 节点 + * @param {String} str Dom 字符串 + * @return {HTMLElement} DOM 节点 + */ +var TABLE; +var TABLE_TR; +var FRAGMENT_REG; +var CONTAINERS; +function initConstants() { + TABLE = document.createElement('table'); + TABLE_TR = document.createElement('tr'); + FRAGMENT_REG = /^\s*<(\w+|!)[^>]*>/; + CONTAINERS = { + tr: document.createElement('tbody'), + tbody: TABLE, + thead: TABLE, + tfoot: TABLE, + td: TABLE_TR, + th: TABLE_TR, + '*': document.createElement('div'), + }; +} +function createDom$1(str) { + if (!TABLE) { + initConstants(); + } + var name = FRAGMENT_REG.test(str) && RegExp.$1; + if (!name || !(name in CONTAINERS)) { + name = '*'; + } + var container = CONTAINERS[name]; + str = str.replace(/(^\s*)|(\s*$)/g, ''); + container.innerHTML = '' + str; + var dom = container.childNodes[0]; + container.removeChild(dom); + return dom; +} + +/** + * 获取样式 + * @param {Object} dom DOM节点 + * @param {String} name 样式名 + * @param {Any} defaultValue 默认值 + * @return {String} 属性值 + */ +function getStyle$2(dom, name, defaultValue) { + var v; + try { + v = window.getComputedStyle ? + window.getComputedStyle(dom, null)[name] : + dom.style[name]; // 一般不会走到这个逻辑，dom.style 获取的是标签 style 属性，也不准确 + } + catch (e) { + // do nothing + } + finally { + v = v === undefined ? defaultValue : v; + } + return v; +} + +function getHeight$1(el, defaultValue) { + var height = getStyle$2(el, 'height', defaultValue); + if (height === 'auto') { + height = el.offsetHeight; + } + return parseFloat(height); +} + +function getOuterHeight(el, defaultValue) { + var height = getHeight$1(el, defaultValue); + var bTop = parseFloat(getStyle$2(el, 'borderTopWidth')) || 0; + var pTop = parseFloat(getStyle$2(el, 'paddingTop')) || 0; + var pBottom = parseFloat(getStyle$2(el, 'paddingBottom')) || 0; + var bBottom = parseFloat(getStyle$2(el, 'borderBottomWidth')) || 0; + var mTop = parseFloat(getStyle$2(el, 'marginTop')) || 0; + var mBottom = parseFloat(getStyle$2(el, 'marginBottom')) || 0; + return height + bTop + bBottom + pTop + pBottom + mTop + mBottom; +} + +function getHeight(el, defaultValue) { + var width = getStyle$2(el, 'width', defaultValue); + if (width === 'auto') { + width = el.offsetWidth; + } + return parseFloat(width); +} + +function getOuterWidth(el, defaultValue) { + var width = getHeight(el, defaultValue); + var bLeft = parseFloat(getStyle$2(el, 'borderLeftWidth')) || 0; + var pLeft = parseFloat(getStyle$2(el, 'paddingLeft')) || 0; + var pRight = parseFloat(getStyle$2(el, 'paddingRight')) || 0; + var bRight = parseFloat(getStyle$2(el, 'borderRightWidth')) || 0; + var mRight = parseFloat(getStyle$2(el, 'marginRight')) || 0; + var mLeft = parseFloat(getStyle$2(el, 'marginLeft')) || 0; + return width + bLeft + bRight + pLeft + pRight + mLeft + mRight; +} + +function modifyCSS(dom, css) { + if (dom) { + for (var key in css) { + if (css.hasOwnProperty(key)) { + dom.style[key] = css[key]; + } + } + } + return dom; +} + +/** + * get the element's bounding size + * @param ele dom element + * @returns the element width and height + */ +function getElementSize(ele) { + var style = getComputedStyle(ele); + return { + width: (ele.clientWidth || parseInt(style.width, 10)) - + parseInt(style.paddingLeft, 10) - + parseInt(style.paddingRight, 10), + height: (ele.clientHeight || parseInt(style.height, 10)) - + parseInt(style.paddingTop, 10) - + parseInt(style.paddingBottom, 10), + }; +} +/** + * is value a valid number + * @param v the input value + * @returns whether it is a number + */ +function isNumber$3(v) { + return typeof v === 'number' && !isNaN(v); +} +/** + * @ignore + * calculate the chart size + * @param ele DOM element + * @param autoFit should auto fit + * @param width chart width which is set by user + * @param height chart height which is set by user + * @returns the chart width and height + */ +function getChartSize(ele, autoFit, width, height) { + var w = width; + var h = height; + if (autoFit) { + var size = getElementSize(ele); + w = size.width ? size.width : w; + h = size.height ? size.height : h; + } + return { + width: Math.max(isNumber$3(w) ? w : MIN_CHART_WIDTH, MIN_CHART_WIDTH), + height: Math.max(isNumber$3(h) ? h : MIN_CHART_HEIGHT, MIN_CHART_HEIGHT), + }; +} +/** + * @ignore + * remove html element from its parent + * @param dom + */ +function removeDom(dom) { + var parent = dom.parentNode; + if (parent) { + parent.removeChild(dom); + } +} + +var WILDCARD$2 = '*'; +/* event-emitter */ +var EventEmitter = /** @class */ (function () { + function EventEmitter() { + this._events = {}; + } + /** + * 监听一个事件 + * @param evt + * @param callback + * @param once + */ + EventEmitter.prototype.on = function (evt, callback, once) { + if (!this._events[evt]) { + this._events[evt] = []; + } + this._events[evt].push({ + callback: callback, + once: !!once, + }); + return this; + }; + /** + * 监听一个事件一次 + * @param evt + * @param callback + */ + EventEmitter.prototype.once = function (evt, callback) { + this.on(evt, callback, true); + return this; + }; + /** + * 触发一个事件 + * @param evt + * @param args + */ + EventEmitter.prototype.emit = function (evt) { + var _this = this; + var args = []; + for (var _i = 1; _i < arguments.length; _i++) { + args[_i - 1] = arguments[_i]; + } + var events = this._events[evt] || []; + var wildcardEvents = this._events[WILDCARD$2] || []; + // 实际的处理 emit 方法 + var doEmit = function (es) { + var length = es.length; + for (var i = 0; i < length; i++) { + if (!es[i]) { + continue; + } + var _a = es[i], callback = _a.callback, once = _a.once; + if (once) { + es.splice(i, 1); + if (es.length === 0) { + delete _this._events[evt]; + } + length--; + i--; + } + callback.apply(_this, args); + } + }; + doEmit(events); + doEmit(wildcardEvents); + }; + /** + * 取消监听一个事件，或者一个channel + * @param evt + * @param callback + */ + EventEmitter.prototype.off = function (evt, callback) { + if (!evt) { + // evt 为空全部清除 + this._events = {}; + } + else { + if (!callback) { + // evt 存在，callback 为空，清除事件所有方法 + delete this._events[evt]; + } + else { + // evt 存在，callback 存在，清除匹配的 + var events = this._events[evt] || []; + var length_1 = events.length; + for (var i = 0; i < length_1; i++) { + if (events[i].callback === callback) { + events.splice(i, 1); + length_1--; + i--; + } + } + if (events.length === 0) { + delete this._events[evt]; + } + } + } + return this; + }; + /* 当前所有的事件 */ + EventEmitter.prototype.getEvents = function () { + return this._events; + }; + return EventEmitter; +}()); + +/** + * G2 Chart、View、Geometry 以及 Element 等的基类，提供事件以及一些通用的方法。 + */ +var Base$4 = /** @class */ (function (_super) { + __extends$e(Base, _super); + function Base(cfg) { + var _this = _super.call(this) || this; + /** 标识对象是否已销毁 */ + _this.destroyed = false; + var _a = cfg.visible, visible = _a === void 0 ? true : _a; + _this.visible = visible; + return _this; + } + /** + * 显示。 + */ + Base.prototype.show = function () { + var visible = this.visible; + if (!visible) { + this.changeVisible(true); + } + }; + /** + * 隐藏。 + */ + Base.prototype.hide = function () { + var visible = this.visible; + if (visible) { + this.changeVisible(false); + } + }; + /** + * 销毁。 + */ + Base.prototype.destroy = function () { + this.off(); + this.destroyed = true; + }; + /** + * 显示或者隐藏。 + * @param visible + * @returns + */ + Base.prototype.changeVisible = function (visible) { + if (this.visible === visible) { + return; + } + this.visible = visible; + }; + return Base; +}(EventEmitter)); + +var SPACES$2 = '\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029'; +var PATH_COMMAND$2 = new RegExp("([a-z])[" + SPACES$2 + ",]*((-?\\d*\\.?\\d*(?:e[\\-+]?\\d+)?[" + SPACES$2 + "]*,?[" + SPACES$2 + "]*)+)", 'ig'); +var PATH_VALUES$2 = new RegExp("(-?\\d*\\.?\\d*(?:e[\\-+]?\\d+)?)[" + SPACES$2 + "]*,?[" + SPACES$2 + "]*", 'ig'); +// Parse given path string into an array of arrays of path segments +var parsePathString$2 = function (pathString) { + if (!pathString) { + return null; + } + if (isArray$n(pathString)) { + return pathString; + } + var paramCounts = { + a: 7, + c: 6, + o: 2, + h: 1, + l: 2, + m: 2, + r: 4, + q: 4, + s: 4, + t: 2, + v: 1, + u: 3, + z: 0, + }; + var data = []; + String(pathString).replace(PATH_COMMAND$2, function (a, b, c) { + var params = []; + var name = b.toLowerCase(); + c.replace(PATH_VALUES$2, function (a, b) { + b && params.push(+b); + }); + if (name === 'm' && params.length > 2) { + data.push([b].concat(params.splice(0, 2))); + name = 'l'; + b = b === 'm' ? 'l' : 'L'; + } + if (name === 'o' && params.length === 1) { + data.push([b, params[0]]); + } + if (name === 'r') { + data.push([b].concat(params)); + } + else { + while (params.length >= paramCounts[name]) { + data.push([b].concat(params.splice(0, paramCounts[name]))); + if (!paramCounts[name]) { + break; + } + } + } + return pathString; + }); + return data; +}; +// http://schepers.cc/getting-to-the-point +var catmullRomToBezier = function (crp, z) { + var d = []; + // @ts-ignore + for (var i = 0, iLen = crp.length; iLen - 2 * !z > i; i += 2) { + var p = [ + { + x: +crp[i - 2], + y: +crp[i - 1], + }, + { + x: +crp[i], + y: +crp[i + 1], + }, + { + x: +crp[i + 2], + y: +crp[i + 3], + }, + { + x: +crp[i + 4], + y: +crp[i + 5], + }, + ]; + if (z) { + if (!i) { + p[0] = { + x: +crp[iLen - 2], + y: +crp[iLen - 1], + }; + } + else if (iLen - 4 === i) { + p[3] = { + x: +crp[0], + y: +crp[1], + }; + } + else if (iLen - 2 === i) { + p[2] = { + x: +crp[0], + y: +crp[1], + }; + p[3] = { + x: +crp[2], + y: +crp[3], + }; + } + } + else { + if (iLen - 4 === i) { + p[3] = p[2]; + } + else if (!i) { + p[0] = { + x: +crp[i], + y: +crp[i + 1], + }; + } + } + d.push([ + 'C', + (-p[0].x + 6 * p[1].x + p[2].x) / 6, + (-p[0].y + 6 * p[1].y + p[2].y) / 6, + (p[1].x + 6 * p[2].x - p[3].x) / 6, + (p[1].y + 6 * p[2].y - p[3].y) / 6, + p[2].x, + p[2].y, + ]); + } + return d; +}; +var ellipsePath = function (x, y, rx, ry, a) { + var res = []; + if (a === null && ry === null) { + ry = rx; + } + x = +x; + y = +y; + rx = +rx; + ry = +ry; + if (a !== null) { + var rad = Math.PI / 180; + var x1 = x + rx * Math.cos(-ry * rad); + var x2 = x + rx * Math.cos(-a * rad); + var y1 = y + rx * Math.sin(-ry * rad); + var y2 = y + rx * Math.sin(-a * rad); + res = [ + ['M', x1, y1], + ['A', rx, rx, 0, +(a - ry > 180), 0, x2, y2], + ]; + } + else { + res = [['M', x, y], ['m', 0, -ry], ['a', rx, ry, 0, 1, 1, 0, 2 * ry], ['a', rx, ry, 0, 1, 1, 0, -2 * ry], ['z']]; + } + return res; +}; +var pathToAbsolute$1 = function (pathArray) { + pathArray = parsePathString$2(pathArray); + if (!pathArray || !pathArray.length) { + return [['M', 0, 0]]; + } + var res = []; + var x = 0; + var y = 0; + var mx = 0; + var my = 0; + var start = 0; + var pa0; + var dots; + if (pathArray[0][0] === 'M') { + x = +pathArray[0][1]; + y = +pathArray[0][2]; + mx = x; + my = y; + start++; + res[0] = ['M', x, y]; + } + var crz = pathArray.length === 3 && + pathArray[0][0] === 'M' && + pathArray[1][0].toUpperCase() === 'R' && + pathArray[2][0].toUpperCase() === 'Z'; + for (var r = void 0, pa = void 0, i = start, ii = pathArray.length; i < ii; i++) { + res.push((r = [])); + pa = pathArray[i]; + pa0 = pa[0]; + if (pa0 !== pa0.toUpperCase()) { + r[0] = pa0.toUpperCase(); + switch (r[0]) { + case 'A': + r[1] = pa[1]; + r[2] = pa[2]; + r[3] = pa[3]; + r[4] = pa[4]; + r[5] = pa[5]; + r[6] = +pa[6] + x; + r[7] = +pa[7] + y; + break; + case 'V': + r[1] = +pa[1] + y; + break; + case 'H': + r[1] = +pa[1] + x; + break; + case 'R': + dots = [x, y].concat(pa.slice(1)); + for (var j = 2, jj = dots.length; j < jj; j++) { + dots[j] = +dots[j] + x; + dots[++j] = +dots[j] + y; + } + res.pop(); + res = res.concat(catmullRomToBezier(dots, crz)); + break; + case 'O': + res.pop(); + dots = ellipsePath(x, y, pa[1], pa[2]); + dots.push(dots[0]); + res = res.concat(dots); + break; + case 'U': + res.pop(); + res = res.concat(ellipsePath(x, y, pa[1], pa[2], pa[3])); + r = ['U'].concat(res[res.length - 1].slice(-2)); + break; + case 'M': + mx = +pa[1] + x; + my = +pa[2] + y; + break; // for lint + default: + for (var j = 1, jj = pa.length; j < jj; j++) { + r[j] = +pa[j] + (j % 2 ? x : y); + } + } + } + else if (pa0 === 'R') { + dots = [x, y].concat(pa.slice(1)); + res.pop(); + res = res.concat(catmullRomToBezier(dots, crz)); + r = ['R'].concat(pa.slice(-2)); + } + else if (pa0 === 'O') { + res.pop(); + dots = ellipsePath(x, y, pa[1], pa[2]); + dots.push(dots[0]); + res = res.concat(dots); + } + else if (pa0 === 'U') { + res.pop(); + res = res.concat(ellipsePath(x, y, pa[1], pa[2], pa[3])); + r = ['U'].concat(res[res.length - 1].slice(-2)); + } + else { + for (var k = 0, kk = pa.length; k < kk; k++) { + r[k] = pa[k]; + } + } + pa0 = pa0.toUpperCase(); + if (pa0 !== 'O') { + switch (r[0]) { + case 'Z': + x = +mx; + y = +my; + break; + case 'H': + x = r[1]; + break; + case 'V': + y = r[1]; + break; + case 'M': + mx = r[r.length - 2]; + my = r[r.length - 1]; + break; // for lint + default: + x = r[r.length - 2]; + y = r[r.length - 1]; + } + } + } + return res; +}; +var l2c = function (x1, y1, x2, y2) { + return [x1, y1, x2, y2, x2, y2]; +}; +var q2c = function (x1, y1, ax, ay, x2, y2) { + var _13 = 1 / 3; + var _23 = 2 / 3; + return [_13 * x1 + _23 * ax, _13 * y1 + _23 * ay, _13 * x2 + _23 * ax, _13 * y2 + _23 * ay, x2, y2]; +}; +var a2c = function (x1, y1, rx, ry, angle, large_arc_flag, sweep_flag, x2, y2, recursive) { + // for more information of where this math came from visit: + // http://www.w3.org/TR/SVG11/implnote.html#ArcImplementationNotes + if (rx === ry) { + rx += 1; + } + var _120 = (Math.PI * 120) / 180; + var rad = (Math.PI / 180) * (+angle || 0); + var res = []; + var xy; + var f1; + var f2; + var cx; + var cy; + var rotate = function (x, y, rad) { + var X = x * Math.cos(rad) - y * Math.sin(rad); + var Y = x * Math.sin(rad) + y * Math.cos(rad); + return { + x: X, + y: Y, + }; + }; + if (!recursive) { + xy = rotate(x1, y1, -rad); + x1 = xy.x; + y1 = xy.y; + xy = rotate(x2, y2, -rad); + x2 = xy.x; + y2 = xy.y; + if (x1 === x2 && y1 === y2) { + // 若弧的起始点和终点重叠则错开一点 + x2 += 1; + y2 += 1; + } + // const cos = Math.cos(Math.PI / 180 * angle); + // const sin = Math.sin(Math.PI / 180 * angle); + var x = (x1 - x2) / 2; + var y = (y1 - y2) / 2; + var h = (x * x) / (rx * rx) + (y * y) / (ry * ry); + if (h > 1) { + h = Math.sqrt(h); + rx = h * rx; + ry = h * ry; + } + var rx2 = rx * rx; + var ry2 = ry * ry; + var k = (large_arc_flag === sweep_flag ? -1 : 1) * + Math.sqrt(Math.abs((rx2 * ry2 - rx2 * y * y - ry2 * x * x) / (rx2 * y * y + ry2 * x * x))); + cx = (k * rx * y) / ry + (x1 + x2) / 2; + cy = (k * -ry * x) / rx + (y1 + y2) / 2; + // @ts-ignore + f1 = Math.asin(((y1 - cy) / ry).toFixed(9)); + // @ts-ignore + f2 = Math.asin(((y2 - cy) / ry).toFixed(9)); + f1 = x1 < cx ? Math.PI - f1 : f1; + f2 = x2 < cx ? Math.PI - f2 : f2; + f1 < 0 && (f1 = Math.PI * 2 + f1); + f2 < 0 && (f2 = Math.PI * 2 + f2); + if (sweep_flag && f1 > f2) { + f1 = f1 - Math.PI * 2; + } + if (!sweep_flag && f2 > f1) { + f2 = f2 - Math.PI * 2; + } + } + else { + f1 = recursive[0]; + f2 = recursive[1]; + cx = recursive[2]; + cy = recursive[3]; + } + var df = f2 - f1; + if (Math.abs(df) > _120) { + var f2old = f2; + var x2old = x2; + var y2old = y2; + f2 = f1 + _120 * (sweep_flag && f2 > f1 ? 1 : -1); + x2 = cx + rx * Math.cos(f2); + y2 = cy + ry * Math.sin(f2); + res = a2c(x2, y2, rx, ry, angle, 0, sweep_flag, x2old, y2old, [f2, f2old, cx, cy]); + } + df = f2 - f1; + var c1 = Math.cos(f1); + var s1 = Math.sin(f1); + var c2 = Math.cos(f2); + var s2 = Math.sin(f2); + var t = Math.tan(df / 4); + var hx = (4 / 3) * rx * t; + var hy = (4 / 3) * ry * t; + var m1 = [x1, y1]; + var m2 = [x1 + hx * s1, y1 - hy * c1]; + var m3 = [x2 + hx * s2, y2 - hy * c2]; + var m4 = [x2, y2]; + m2[0] = 2 * m1[0] - m2[0]; + m2[1] = 2 * m1[1] - m2[1]; + if (recursive) { + return [m2, m3, m4].concat(res); + } + res = [m2, m3, m4].concat(res).join().split(','); + var newres = []; + for (var i = 0, ii = res.length; i < ii; i++) { + newres[i] = i % 2 ? rotate(res[i - 1], res[i], rad).y : rotate(res[i], res[i + 1], rad).x; + } + return newres; +}; +var pathToCurve = function (path, path2) { + var p = pathToAbsolute$1(path); + var p2 = path2 && pathToAbsolute$1(path2); + var attrs = { + x: 0, + y: 0, + bx: 0, + by: 0, + X: 0, + Y: 0, + qx: null, + qy: null, + }; + var attrs2 = { + x: 0, + y: 0, + bx: 0, + by: 0, + X: 0, + Y: 0, + qx: null, + qy: null, + }; + var pcoms1 = []; // path commands of original path p + var pcoms2 = []; // path commands of original path p2 + var pfirst = ''; // temporary holder for original path command + var pcom = ''; // holder for previous path command of original path + var ii; + var processPath = function (path, d, pcom) { + var nx; + var ny; + if (!path) { + return ['C', d.x, d.y, d.x, d.y, d.x, d.y]; + } + !(path[0] in + { + T: 1, + Q: 1, + }) && (d.qx = d.qy = null); + switch (path[0]) { + case 'M': + d.X = path[1]; + d.Y = path[2]; + break; + case 'A': + path = ['C'].concat(a2c.apply(0, [d.x, d.y].concat(path.slice(1)))); + break; + case 'S': + if (pcom === 'C' || pcom === 'S') { + // In "S" case we have to take into account, if the previous command is C/S. + nx = d.x * 2 - d.bx; // And reflect the previous + ny = d.y * 2 - d.by; // command's control point relative to the current point. + } + else { + // or some else or nothing + nx = d.x; + ny = d.y; + } + path = ['C', nx, ny].concat(path.slice(1)); + break; + case 'T': + if (pcom === 'Q' || pcom === 'T') { + // In "T" case we have to take into account, if the previous command is Q/T. + d.qx = d.x * 2 - d.qx; // And make a reflection similar + d.qy = d.y * 2 - d.qy; // to case "S". + } + else { + // or something else or nothing + d.qx = d.x; + d.qy = d.y; + } + path = ['C'].concat(q2c(d.x, d.y, d.qx, d.qy, path[1], path[2])); + break; + case 'Q': + d.qx = path[1]; + d.qy = path[2]; + path = ['C'].concat(q2c(d.x, d.y, path[1], path[2], path[3], path[4])); + break; + case 'L': + path = ['C'].concat(l2c(d.x, d.y, path[1], path[2])); + break; + case 'H': + path = ['C'].concat(l2c(d.x, d.y, path[1], d.y)); + break; + case 'V': + path = ['C'].concat(l2c(d.x, d.y, d.x, path[1])); + break; + case 'Z': + path = ['C'].concat(l2c(d.x, d.y, d.X, d.Y)); + break; + } + return path; + }; + var fixArc = function (pp, i) { + if (pp[i].length > 7) { + pp[i].shift(); + var pi = pp[i]; + while (pi.length) { + pcoms1[i] = 'A'; // if created multiple C:s, their original seg is saved + p2 && (pcoms2[i] = 'A'); // the same as above + pp.splice(i++, 0, ['C'].concat(pi.splice(0, 6))); + } + pp.splice(i, 1); + ii = Math.max(p.length, (p2 && p2.length) || 0); + } + }; + var fixM = function (path1, path2, a1, a2, i) { + if (path1 && path2 && path1[i][0] === 'M' && path2[i][0] !== 'M') { + path2.splice(i, 0, ['M', a2.x, a2.y]); + a1.bx = 0; + a1.by = 0; + a1.x = path1[i][1]; + a1.y = path1[i][2]; + ii = Math.max(p.length, (p2 && p2.length) || 0); + } + }; + ii = Math.max(p.length, (p2 && p2.length) || 0); + for (var i = 0; i < ii; i++) { + p[i] && (pfirst = p[i][0]); // save current path command + if (pfirst !== 'C') { + // C is not saved yet, because it may be result of conversion + pcoms1[i] = pfirst; // Save current path command + i && (pcom = pcoms1[i - 1]); // Get previous path command pcom + } + p[i] = processPath(p[i], attrs, pcom); // Previous path command is inputted to processPath + if (pcoms1[i] !== 'A' && pfirst === 'C') + pcoms1[i] = 'C'; // A is the only command + // which may produce multiple C:s + // so we have to make sure that C is also C in original path + fixArc(p, i); // fixArc adds also the right amount of A:s to pcoms1 + if (p2) { + // the same procedures is done to p2 + p2[i] && (pfirst = p2[i][0]); + if (pfirst !== 'C') { + pcoms2[i] = pfirst; + i && (pcom = pcoms2[i - 1]); + } + p2[i] = processPath(p2[i], attrs2, pcom); + if (pcoms2[i] !== 'A' && pfirst === 'C') { + pcoms2[i] = 'C'; + } + fixArc(p2, i); + } + fixM(p, p2, attrs, attrs2, i); + fixM(p2, p, attrs2, attrs, i); + var seg = p[i]; + var seg2 = p2 && p2[i]; + var seglen = seg.length; + var seg2len = p2 && seg2.length; + attrs.x = seg[seglen - 2]; + attrs.y = seg[seglen - 1]; + attrs.bx = parseFloat(seg[seglen - 4]) || attrs.x; + attrs.by = parseFloat(seg[seglen - 3]) || attrs.y; + attrs2.bx = p2 && (parseFloat(seg2[seg2len - 4]) || attrs2.x); + attrs2.by = p2 && (parseFloat(seg2[seg2len - 3]) || attrs2.y); + attrs2.x = p2 && seg2[seg2len - 2]; + attrs2.y = p2 && seg2[seg2len - 1]; + } + return p2 ? [p, p2] : p; +}; +var p2s = /,?([a-z]),?/gi; +var parsePathArray = function (path) { + return path.join(',').replace(p2s, '$1'); +}; +var base3 = function (t, p1, p2, p3, p4) { + var t1 = -3 * p1 + 9 * p2 - 9 * p3 + 3 * p4; + var t2 = t * t1 + 6 * p1 - 12 * p2 + 6 * p3; + return t * t2 - 3 * p1 + 3 * p2; +}; +var bezlen = function (x1, y1, x2, y2, x3, y3, x4, y4, z) { + if (z === null) { + z = 1; + } + z = z > 1 ? 1 : z < 0 ? 0 : z; + var z2 = z / 2; + var n = 12; + var Tvalues = [ + -0.1252, + 0.1252, + -0.3678, + 0.3678, + -0.5873, + 0.5873, + -0.7699, + 0.7699, + -0.9041, + 0.9041, + -0.9816, + 0.9816, + ]; + var Cvalues = [0.2491, 0.2491, 0.2335, 0.2335, 0.2032, 0.2032, 0.1601, 0.1601, 0.1069, 0.1069, 0.0472, 0.0472]; + var sum = 0; + for (var i = 0; i < n; i++) { + var ct = z2 * Tvalues[i] + z2; + var xbase = base3(ct, x1, x2, x3, x4); + var ybase = base3(ct, y1, y2, y3, y4); + var comb = xbase * xbase + ybase * ybase; + sum += Cvalues[i] * Math.sqrt(comb); + } + return z2 * sum; +}; +var curveDim = function (x0, y0, x1, y1, x2, y2, x3, y3) { + var tvalues = []; + var bounds = [[], []]; + var a; + var b; + var c; + var t; + for (var i = 0; i < 2; ++i) { + if (i === 0) { + b = 6 * x0 - 12 * x1 + 6 * x2; + a = -3 * x0 + 9 * x1 - 9 * x2 + 3 * x3; + c = 3 * x1 - 3 * x0; + } + else { + b = 6 * y0 - 12 * y1 + 6 * y2; + a = -3 * y0 + 9 * y1 - 9 * y2 + 3 * y3; + c = 3 * y1 - 3 * y0; + } + if (Math.abs(a) < 1e-12) { + if (Math.abs(b) < 1e-12) { + continue; + } + t = -c / b; + if (t > 0 && t < 1) { + tvalues.push(t); + } + continue; + } + var b2ac = b * b - 4 * c * a; + var sqrtb2ac = Math.sqrt(b2ac); + if (b2ac < 0) { + continue; + } + var t1 = (-b + sqrtb2ac) / (2 * a); + if (t1 > 0 && t1 < 1) { + tvalues.push(t1); + } + var t2 = (-b - sqrtb2ac) / (2 * a); + if (t2 > 0 && t2 < 1) { + tvalues.push(t2); + } + } + var j = tvalues.length; + var jlen = j; + var mt; + while (j--) { + t = tvalues[j]; + mt = 1 - t; + bounds[0][j] = mt * mt * mt * x0 + 3 * mt * mt * t * x1 + 3 * mt * t * t * x2 + t * t * t * x3; + bounds[1][j] = mt * mt * mt * y0 + 3 * mt * mt * t * y1 + 3 * mt * t * t * y2 + t * t * t * y3; + } + bounds[0][jlen] = x0; + bounds[1][jlen] = y0; + bounds[0][jlen + 1] = x3; + bounds[1][jlen + 1] = y3; + bounds[0].length = bounds[1].length = jlen + 2; + return { + min: { + x: Math.min.apply(0, bounds[0]), + y: Math.min.apply(0, bounds[1]), + }, + max: { + x: Math.max.apply(0, bounds[0]), + y: Math.max.apply(0, bounds[1]), + }, + }; +}; +var intersect = function (x1, y1, x2, y2, x3, y3, x4, y4) { + if (Math.max(x1, x2) < Math.min(x3, x4) || + Math.min(x1, x2) > Math.max(x3, x4) || + Math.max(y1, y2) < Math.min(y3, y4) || + Math.min(y1, y2) > Math.max(y3, y4)) { + return; + } + var nx = (x1 * y2 - y1 * x2) * (x3 - x4) - (x1 - x2) * (x3 * y4 - y3 * x4); + var ny = (x1 * y2 - y1 * x2) * (y3 - y4) - (y1 - y2) * (x3 * y4 - y3 * x4); + var denominator = (x1 - x2) * (y3 - y4) - (y1 - y2) * (x3 - x4); + if (!denominator) { + return; + } + var px = nx / denominator; + var py = ny / denominator; + var px2 = +px.toFixed(2); + var py2 = +py.toFixed(2); + if (px2 < +Math.min(x1, x2).toFixed(2) || + px2 > +Math.max(x1, x2).toFixed(2) || + px2 < +Math.min(x3, x4).toFixed(2) || + px2 > +Math.max(x3, x4).toFixed(2) || + py2 < +Math.min(y1, y2).toFixed(2) || + py2 > +Math.max(y1, y2).toFixed(2) || + py2 < +Math.min(y3, y4).toFixed(2) || + py2 > +Math.max(y3, y4).toFixed(2)) { + return; + } + return { + x: px, + y: py, + }; +}; +var isPointInsideBBox = function (bbox, x, y) { + return x >= bbox.x && x <= bbox.x + bbox.width && y >= bbox.y && y <= bbox.y + bbox.height; +}; +var rectPath = function (x, y, w, h, r) { + if (r) { + return [ + ['M', +x + +r, y], + ['l', w - r * 2, 0], + ['a', r, r, 0, 0, 1, r, r], + ['l', 0, h - r * 2], + ['a', r, r, 0, 0, 1, -r, r], + ['l', r * 2 - w, 0], + ['a', r, r, 0, 0, 1, -r, -r], + ['l', 0, r * 2 - h], + ['a', r, r, 0, 0, 1, r, -r], + ['z'], + ]; + } + var res = [['M', x, y], ['l', w, 0], ['l', 0, h], ['l', -w, 0], ['z']]; + // @ts-ignore + res.parsePathArray = parsePathArray; + return res; +}; +var box = function (x, y, width, height) { + if (x === null) { + x = y = width = height = 0; + } + if (y === null) { + y = x.y; + width = x.width; + height = x.height; + x = x.x; + } + return { + x: x, + y: y, + width: width, + w: width, + height: height, + h: height, + x2: x + width, + y2: y + height, + cx: x + width / 2, + cy: y + height / 2, + r1: Math.min(width, height) / 2, + r2: Math.max(width, height) / 2, + r0: Math.sqrt(width * width + height * height) / 2, + path: rectPath(x, y, width, height), + vb: [x, y, width, height].join(' '), + }; +}; +var isBBoxIntersect = function (bbox1, bbox2) { + bbox1 = box(bbox1); + bbox2 = box(bbox2); + return (isPointInsideBBox(bbox2, bbox1.x, bbox1.y) || + isPointInsideBBox(bbox2, bbox1.x2, bbox1.y) || + isPointInsideBBox(bbox2, bbox1.x, bbox1.y2) || + isPointInsideBBox(bbox2, bbox1.x2, bbox1.y2) || + isPointInsideBBox(bbox1, bbox2.x, bbox2.y) || + isPointInsideBBox(bbox1, bbox2.x2, bbox2.y) || + isPointInsideBBox(bbox1, bbox2.x, bbox2.y2) || + isPointInsideBBox(bbox1, bbox2.x2, bbox2.y2) || + (((bbox1.x < bbox2.x2 && bbox1.x > bbox2.x) || (bbox2.x < bbox1.x2 && bbox2.x > bbox1.x)) && + ((bbox1.y < bbox2.y2 && bbox1.y > bbox2.y) || (bbox2.y < bbox1.y2 && bbox2.y > bbox1.y)))); +}; +var bezierBBox = function (p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y) { + if (!isArray$n(p1x)) { + p1x = [p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y]; + } + var bbox = curveDim.apply(null, p1x); + return box(bbox.min.x, bbox.min.y, bbox.max.x - bbox.min.x, bbox.max.y - bbox.min.y); +}; +var findDotsAtSegment = function (p1x, p1y, c1x, c1y, c2x, c2y, p2x, p2y, t) { + var t1 = 1 - t; + var t13 = Math.pow(t1, 3); + var t12 = Math.pow(t1, 2); + var t2 = t * t; + var t3 = t2 * t; + var x = t13 * p1x + t12 * 3 * t * c1x + t1 * 3 * t * t * c2x + t3 * p2x; + var y = t13 * p1y + t12 * 3 * t * c1y + t1 * 3 * t * t * c2y + t3 * p2y; + var mx = p1x + 2 * t * (c1x - p1x) + t2 * (c2x - 2 * c1x + p1x); + var my = p1y + 2 * t * (c1y - p1y) + t2 * (c2y - 2 * c1y + p1y); + var nx = c1x + 2 * t * (c2x - c1x) + t2 * (p2x - 2 * c2x + c1x); + var ny = c1y + 2 * t * (c2y - c1y) + t2 * (p2y - 2 * c2y + c1y); + var ax = t1 * p1x + t * c1x; + var ay = t1 * p1y + t * c1y; + var cx = t1 * c2x + t * p2x; + var cy = t1 * c2y + t * p2y; + var alpha = 90 - (Math.atan2(mx - nx, my - ny) * 180) / Math.PI; + // (mx > nx || my < ny) && (alpha += 180); + return { + x: x, + y: y, + m: { + x: mx, + y: my, + }, + n: { + x: nx, + y: ny, + }, + start: { + x: ax, + y: ay, + }, + end: { + x: cx, + y: cy, + }, + alpha: alpha, + }; +}; +var interHelper = function (bez1, bez2, justCount) { + var bbox1 = bezierBBox(bez1); + var bbox2 = bezierBBox(bez2); + if (!isBBoxIntersect(bbox1, bbox2)) { + return justCount ? 0 : []; + } + var l1 = bezlen.apply(0, bez1); + var l2 = bezlen.apply(0, bez2); + var n1 = ~~(l1 / 8); + var n2 = ~~(l2 / 8); + var dots1 = []; + var dots2 = []; + var xy = {}; + var res = justCount ? 0 : []; + for (var i = 0; i < n1 + 1; i++) { + var d = findDotsAtSegment.apply(0, bez1.concat(i / n1)); + dots1.push({ + x: d.x, + y: d.y, + t: i / n1, + }); + } + for (var i = 0; i < n2 + 1; i++) { + var d = findDotsAtSegment.apply(0, bez2.concat(i / n2)); + dots2.push({ + x: d.x, + y: d.y, + t: i / n2, + }); + } + for (var i = 0; i < n1; i++) { + for (var j = 0; j < n2; j++) { + var di = dots1[i]; + var di1 = dots1[i + 1]; + var dj = dots2[j]; + var dj1 = dots2[j + 1]; + var ci = Math.abs(di1.x - di.x) < 0.001 ? 'y' : 'x'; + var cj = Math.abs(dj1.x - dj.x) < 0.001 ? 'y' : 'x'; + var is = intersect(di.x, di.y, di1.x, di1.y, dj.x, dj.y, dj1.x, dj1.y); + if (is) { + if (xy[is.x.toFixed(4)] === is.y.toFixed(4)) { + continue; + } + xy[is.x.toFixed(4)] = is.y.toFixed(4); + var t1 = di.t + Math.abs((is[ci] - di[ci]) / (di1[ci] - di[ci])) * (di1.t - di.t); + var t2 = dj.t + Math.abs((is[cj] - dj[cj]) / (dj1[cj] - dj[cj])) * (dj1.t - dj.t); + if (t1 >= 0 && t1 <= 1 && t2 >= 0 && t2 <= 1) { + if (justCount) { + // @ts-ignore + res += 1; + } + else { + // @ts-ignore + res.push({ + x: is.x, + y: is.y, + t1: t1, + t2: t2, + }); + } + } + } + } + } + return res; +}; +var interPathHelper = function (path1, path2, justCount) { + path1 = pathToCurve(path1); + path2 = pathToCurve(path2); + var x1; + var y1; + var x2; + var y2; + var x1m; + var y1m; + var x2m; + var y2m; + var bez1; + var bez2; + var res = justCount ? 0 : []; + for (var i = 0, ii = path1.length; i < ii; i++) { + var pi = path1[i]; + if (pi[0] === 'M') { + x1 = x1m = pi[1]; + y1 = y1m = pi[2]; + } + else { + if (pi[0] === 'C') { + bez1 = [x1, y1].concat(pi.slice(1)); + x1 = bez1[6]; + y1 = bez1[7]; + } + else { + bez1 = [x1, y1, x1, y1, x1m, y1m, x1m, y1m]; + x1 = x1m; + y1 = y1m; + } + for (var j = 0, jj = path2.length; j < jj; j++) { + var pj = path2[j]; + if (pj[0] === 'M') { + x2 = x2m = pj[1]; + y2 = y2m = pj[2]; + } + else { + if (pj[0] === 'C') { + bez2 = [x2, y2].concat(pj.slice(1)); + x2 = bez2[6]; + y2 = bez2[7]; + } + else { + bez2 = [x2, y2, x2, y2, x2m, y2m, x2m, y2m]; + x2 = x2m; + y2 = y2m; + } + var intr = interHelper(bez1, bez2, justCount); + if (justCount) { + // @ts-ignore + res += intr; + } + else { + // @ts-ignore + for (var k = 0, kk = intr.length; k < kk; k++) { + intr[k].segment1 = i; + intr[k].segment2 = j; + intr[k].bez1 = bez1; + intr[k].bez2 = bez2; + } + // @ts-ignore + res = res.concat(intr); + } + } + } + } + } + return res; +}; +var intersection = function (path1, path2) { + return interPathHelper(path1, path2); +}; +function decasteljau(points, t) { + var left = []; + var right = []; + function recurse(points, t) { + if (points.length === 1) { + left.push(points[0]); + right.push(points[0]); + } + else { + var middlePoints = []; + for (var i = 0; i < points.length - 1; i++) { + if (i === 0) { + left.push(points[0]); + } + if (i === points.length - 2) { + right.push(points[i + 1]); + } + middlePoints[i] = [ + (1 - t) * points[i][0] + t * points[i + 1][0], + (1 - t) * points[i][1] + t * points[i + 1][1], + ]; + } + recurse(middlePoints, t); + } + } + if (points.length) { + recurse(points, t); + } + return { left: left, right: right.reverse() }; +} +function splitCurve(start, end, count) { + var points = [[start[1], start[2]]]; + count = count || 2; + var segments = []; + if (end[0] === 'A') { + points.push(end[6]); + points.push(end[7]); + } + else if (end[0] === 'C') { + points.push([end[1], end[2]]); + points.push([end[3], end[4]]); + points.push([end[5], end[6]]); + } + else if (end[0] === 'S' || end[0] === 'Q') { + points.push([end[1], end[2]]); + points.push([end[3], end[4]]); + } + else { + points.push([end[1], end[2]]); + } + var leftSegments = points; + var t = 1 / count; + for (var i = 0; i < count - 1; i++) { + var rt = t / (1 - t * i); + var split = decasteljau(leftSegments, rt); + segments.push(split.left); + leftSegments = split.right; + } + segments.push(leftSegments); + var result = segments.map(function (segment) { + var cmd = []; + if (segment.length === 4) { + cmd.push('C'); + cmd = cmd.concat(segment[2]); + } + if (segment.length >= 3) { + if (segment.length === 3) { + cmd.push('Q'); + } + cmd = cmd.concat(segment[1]); + } + if (segment.length === 2) { + cmd.push('L'); + } + cmd = cmd.concat(segment[segment.length - 1]); + return cmd; + }); + return result; +} +var splitSegment = function (start, end, count) { + if (count === 1) { + return [[].concat(start)]; + } + var segments = []; + if (end[0] === 'L' || end[0] === 'C' || end[0] === 'Q') { + segments = segments.concat(splitCurve(start, end, count)); + } + else { + var temp = [].concat(start); + if (temp[0] === 'M') { + temp[0] = 'L'; + } + for (var i = 0; i <= count - 1; i++) { + segments.push(temp); + } + } + return segments; +}; +var fillPath = function (source, target) { + if (source.length === 1) { + return source; + } + var sourceLen = source.length - 1; + var targetLen = target.length - 1; + var ratio = sourceLen / targetLen; + var segmentsToFill = []; + if (source.length === 1 && source[0][0] === 'M') { + for (var i = 0; i < targetLen - sourceLen; i++) { + source.push(source[0]); + } + return source; + } + for (var i = 0; i < targetLen; i++) { + var index = Math.floor(ratio * i); + segmentsToFill[index] = (segmentsToFill[index] || 0) + 1; + } + var filled = segmentsToFill.reduce(function (filled, count, i) { + if (i === sourceLen) { + return filled.concat(source[sourceLen]); + } + return filled.concat(splitSegment(source[i], source[i + 1], count)); + }, []); + filled.unshift(source[0]); + if (target[targetLen] === 'Z' || target[targetLen] === 'z') { + filled.push('Z'); + } + return filled; +}; +var isEqual$1 = function (obj1, obj2) { + if (obj1.length !== obj2.length) { + return false; + } + var result = true; + each$2(obj1, function (item, i) { + if (item !== obj2[i]) { + result = false; + return false; + } + }); + return result; +}; +function getMinDiff$1(del, add, modify) { + var type = null; + var min = modify; + if (add < min) { + min = add; + type = 'add'; + } + if (del < min) { + min = del; + type = 'del'; + } + return { + type: type, + min: min, + }; +} +/* + * https://en.wikipedia.org/wiki/Levenshtein_distance + * 计算两条path的编辑距离 + */ +var levenshteinDistance$1 = function (source, target) { + var sourceLen = source.length; + var targetLen = target.length; + var sourceSegment; + var targetSegment; + var temp = 0; + if (sourceLen === 0 || targetLen === 0) { + return null; + } + var dist = []; + for (var i = 0; i <= sourceLen; i++) { + dist[i] = []; + dist[i][0] = { min: i }; + } + for (var j = 0; j <= targetLen; j++) { + dist[0][j] = { min: j }; + } + for (var i = 1; i <= sourceLen; i++) { + sourceSegment = source[i - 1]; + for (var j = 1; j <= targetLen; j++) { + targetSegment = target[j - 1]; + if (isEqual$1(sourceSegment, targetSegment)) { + temp = 0; + } + else { + temp = 1; + } + var del = dist[i - 1][j].min + 1; + var add = dist[i][j - 1].min + 1; + var modify = dist[i - 1][j - 1].min + temp; + dist[i][j] = getMinDiff$1(del, add, modify); + } + } + return dist; +}; +var fillPathByDiff$1 = function (source, target) { + var diffMatrix = levenshteinDistance$1(source, target); + var sourceLen = source.length; + var targetLen = target.length; + var changes = []; + var index = 1; + var minPos = 1; + // 如果source和target不是完全不相等 + if (diffMatrix[sourceLen][targetLen].min !== sourceLen) { + // 获取从source到target所需改动 + for (var i = 1; i <= sourceLen; i++) { + var min = diffMatrix[i][i].min; + minPos = i; + for (var j = index; j <= targetLen; j++) { + if (diffMatrix[i][j].min < min) { + min = diffMatrix[i][j].min; + minPos = j; + } + } + index = minPos; + if (diffMatrix[i][index].type) { + changes.push({ index: i - 1, type: diffMatrix[i][index].type }); + } + } + // 对source进行增删path + for (var i = changes.length - 1; i >= 0; i--) { + index = changes[i].index; + if (changes[i].type === 'add') { + source.splice(index, 0, [].concat(source[index])); + } + else { + source.splice(index, 1); + } + } + } + // source尾部补齐 + sourceLen = source.length; + var diff = targetLen - sourceLen; + if (sourceLen < targetLen) { + for (var i = 0; i < diff; i++) { + if (source[sourceLen - 1][0] === 'z' || source[sourceLen - 1][0] === 'Z') { + source.splice(sourceLen - 2, 0, source[sourceLen - 2]); + } + else { + source.push(source[sourceLen - 1]); + } + sourceLen += 1; + } + } + return source; +}; +// 将两个点均分成count个点 +function _splitPoints$1(points, former, count) { + var result = [].concat(points); + var index; + var t = 1 / (count + 1); + var formerEnd = _getSegmentPoints$1(former)[0]; + for (var i = 1; i <= count; i++) { + t *= i; + index = Math.floor(points.length * t); + if (index === 0) { + result.unshift([formerEnd[0] * t + points[index][0] * (1 - t), formerEnd[1] * t + points[index][1] * (1 - t)]); + } + else { + result.splice(index, 0, [ + formerEnd[0] * t + points[index][0] * (1 - t), + formerEnd[1] * t + points[index][1] * (1 - t), + ]); + } + } + return result; +} +/* + * 抽取pathSegment中的关键点 + * M,L,A,Q,H,V一个端点 + * Q, S抽取一个端点，一个控制点 + * C抽取一个端点，两个控制点 + */ +function _getSegmentPoints$1(segment) { + var points = []; + switch (segment[0]) { + case 'M': + points.push([segment[1], segment[2]]); + break; + case 'L': + points.push([segment[1], segment[2]]); + break; + case 'A': + points.push([segment[6], segment[7]]); + break; + case 'Q': + points.push([segment[3], segment[4]]); + points.push([segment[1], segment[2]]); + break; + case 'T': + points.push([segment[1], segment[2]]); + break; + case 'C': + points.push([segment[5], segment[6]]); + points.push([segment[1], segment[2]]); + points.push([segment[3], segment[4]]); + break; + case 'S': + points.push([segment[3], segment[4]]); + points.push([segment[1], segment[2]]); + break; + case 'H': + points.push([segment[1], segment[1]]); + break; + case 'V': + points.push([segment[1], segment[1]]); + break; + } + return points; +} +var formatPath$1 = function (fromPath, toPath) { + if (fromPath.length <= 1) { + return fromPath; + } + var points; + for (var i = 0; i < toPath.length; i++) { + if (fromPath[i][0] !== toPath[i][0]) { + // 获取fromPath的pathSegment的端点，根据toPath的指令对其改造 + points = _getSegmentPoints$1(fromPath[i]); + switch (toPath[i][0]) { + case 'M': + fromPath[i] = ['M'].concat(points[0]); + break; + case 'L': + fromPath[i] = ['L'].concat(points[0]); + break; + case 'A': + fromPath[i] = [].concat(toPath[i]); + fromPath[i][6] = points[0][0]; + fromPath[i][7] = points[0][1]; + break; + case 'Q': + if (points.length < 2) { + if (i > 0) { + points = _splitPoints$1(points, fromPath[i - 1], 1); + } + else { + fromPath[i] = toPath[i]; + break; + } + } + fromPath[i] = ['Q'].concat(points.reduce(function (arr, i) { + return arr.concat(i); + }, [])); + break; + case 'T': + fromPath[i] = ['T'].concat(points[0]); + break; + case 'C': + if (points.length < 3) { + if (i > 0) { + points = _splitPoints$1(points, fromPath[i - 1], 2); + } + else { + fromPath[i] = toPath[i]; + break; + } + } + fromPath[i] = ['C'].concat(points.reduce(function (arr, i) { + return arr.concat(i); + }, [])); + break; + case 'S': + if (points.length < 2) { + if (i > 0) { + points = _splitPoints$1(points, fromPath[i - 1], 1); + } + else { + fromPath[i] = toPath[i]; + break; + } + } + fromPath[i] = ['S'].concat(points.reduce(function (arr, i) { + return arr.concat(i); + }, [])); + break; + default: + fromPath[i] = toPath[i]; + } + } + } + return fromPath; +}; + +var PathUtil$2 = /*#__PURE__*/Object.freeze({ + __proto__: null, + catmullRomToBezier: catmullRomToBezier, + fillPath: fillPath, + fillPathByDiff: fillPathByDiff$1, + formatPath: formatPath$1, + intersection: intersection, + parsePathArray: parsePathArray, + parsePathString: parsePathString$2, + pathToAbsolute: pathToAbsolute$1, + pathToCurve: pathToCurve, + rectPath: rectPath +}); + +var GraphEvent$1 = /** @class */ (function () { + function GraphEvent(type, event) { + /** + * 是否允许冒泡 + * @type {boolean} + */ + this.bubbles = true; + /** + * 触发对象 + * @type {object} + */ + this.target = null; + /** + * 监听对象 + * @type {object} + */ + this.currentTarget = null; + /** + * 委托对象 + * @type {object} + */ + this.delegateTarget = null; + /** + * 委托事件监听对象的代理对象，即 ev.delegateObject = ev.currentTarget.get('delegateObject') + * @type {object} + */ + this.delegateObject = null; + /** + * 是否阻止了原生事件 + * @type {boolean} + */ + this.defaultPrevented = false; + /** + * 是否阻止传播（向上冒泡） + * @type {boolean} + */ + this.propagationStopped = false; + /** + * 触发事件的图形 + * @type {IShape} + */ + this.shape = null; + /** + * 开始触发事件的图形 + * @type {IShape} + */ + this.fromShape = null; + /** + * 事件结束时的触发图形 + * @type {IShape} + */ + this.toShape = null; + // 触发事件的路径 + this.propagationPath = []; + this.type = type; + this.name = type; + this.originalEvent = event; + this.timeStamp = event.timeStamp; + } + /** + * 阻止浏览器默认的行为 + */ + GraphEvent.prototype.preventDefault = function () { + this.defaultPrevented = true; + if (this.originalEvent.preventDefault) { + this.originalEvent.preventDefault(); + } + }; + /** + * 阻止冒泡 + */ + GraphEvent.prototype.stopPropagation = function () { + this.propagationStopped = true; + }; + GraphEvent.prototype.toString = function () { + var type = this.type; + return "[Event (type=" + type + ")]"; + }; + GraphEvent.prototype.save = function () { }; + GraphEvent.prototype.restore = function () { }; + return GraphEvent; +}()); + +function removeFromArray$1(arr, obj) { + var index = arr.indexOf(obj); + if (index !== -1) { + arr.splice(index, 1); + } +} +var isBrowser$1 = typeof window !== 'undefined' && typeof window.document !== 'undefined'; +// 是否元素的父容器 +function isParent$1(container, shape) { + // 所有 shape 都是 canvas 的子元素 + if (container.isCanvas()) { + return true; + } + var parent = shape.getParent(); + var isParent = false; + while (parent) { + if (parent === container) { + isParent = true; + break; + } + parent = parent.getParent(); + } + return isParent; +} +function isAllowCapture$1(element) { + // @ts-ignore + return element.cfg.visible && element.cfg.capture; +} + +var Base$3 = /** @class */ (function (_super) { + __extends$e(Base, _super); + function Base(cfg) { + var _this = _super.call(this) || this; + /** + * 是否被销毁 + * @type {boolean} + */ + _this.destroyed = false; + var defaultCfg = _this.getDefaultCfg(); + _this.cfg = mix(defaultCfg, cfg); + return _this; + } + /** + * @protected + * 默认的配置项 + * @returns {object} 默认的配置项 + */ + Base.prototype.getDefaultCfg = function () { + return {}; + }; + // 实现接口的方法 + Base.prototype.get = function (name) { + return this.cfg[name]; + }; + // 实现接口的方法 + Base.prototype.set = function (name, value) { + this.cfg[name] = value; + }; + // 实现接口的方法 + Base.prototype.destroy = function () { + this.cfg = { + destroyed: true, + }; + this.off(); + this.destroyed = true; + }; + return Base; +}(EventEmitter)); + +var __spreadArrays = (undefined && undefined.__spreadArrays) || function () { + for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length; + for (var r = Array(s), k = 0, i = 0; i < il; i++) + for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++) + r[k] = a[j]; + return r; +}; +var BrowserInfo = /** @class */ (function () { + function BrowserInfo(name, version, os) { + this.name = name; + this.version = version; + this.os = os; + this.type = 'browser'; + } + return BrowserInfo; +}()); +var NodeInfo = /** @class */ (function () { + function NodeInfo(version) { + this.version = version; + this.type = 'node'; + this.name = 'node'; + this.os = process.platform; + } + return NodeInfo; +}()); +var SearchBotDeviceInfo = /** @class */ (function () { + function SearchBotDeviceInfo(name, version, os, bot) { + this.name = name; + this.version = version; + this.os = os; + this.bot = bot; + this.type = 'bot-device'; + } + return SearchBotDeviceInfo; +}()); +var BotInfo = /** @class */ (function () { + function BotInfo() { + this.type = 'bot'; + this.bot = true; // NOTE: deprecated test name instead + this.name = 'bot'; + this.version = null; + this.os = null; + } + return BotInfo; +}()); +var ReactNativeInfo = /** @class */ (function () { + function ReactNativeInfo() { + this.type = 'react-native'; + this.name = 'react-native'; + this.version = null; + this.os = null; + } + return ReactNativeInfo; +}()); +// tslint:disable-next-line:max-line-length +var SEARCHBOX_UA_REGEX = /alexa|bot|crawl(er|ing)|facebookexternalhit|feedburner|google web preview|nagios|postrank|pingdom|slurp|spider|yahoo!|yandex/; +var SEARCHBOT_OS_REGEX = /(nuhk|Googlebot|Yammybot|Openbot|Slurp|MSNBot|Ask\ Jeeves\/Teoma|ia_archiver)/; +var REQUIRED_VERSION_PARTS = 3; +var userAgentRules = [ + ['aol', /AOLShield\/([0-9\._]+)/], + ['edge', /Edge\/([0-9\._]+)/], + ['edge-ios', /EdgiOS\/([0-9\._]+)/], + ['yandexbrowser', /YaBrowser\/([0-9\._]+)/], + ['kakaotalk', /KAKAOTALK\s([0-9\.]+)/], + ['samsung', /SamsungBrowser\/([0-9\.]+)/], + ['silk', /\bSilk\/([0-9._-]+)\b/], + ['miui', /MiuiBrowser\/([0-9\.]+)$/], + ['beaker', /BeakerBrowser\/([0-9\.]+)/], + ['edge-chromium', /EdgA?\/([0-9\.]+)/], + [ + 'chromium-webview', + /(?!Chrom.*OPR)wv\).*Chrom(?:e|ium)\/([0-9\.]+)(:?\s|$)/, + ], + ['chrome', /(?!Chrom.*OPR)Chrom(?:e|ium)\/([0-9\.]+)(:?\s|$)/], + ['phantomjs', /PhantomJS\/([0-9\.]+)(:?\s|$)/], + ['crios', /CriOS\/([0-9\.]+)(:?\s|$)/], + ['firefox', /Firefox\/([0-9\.]+)(?:\s|$)/], + ['fxios', /FxiOS\/([0-9\.]+)/], + ['opera-mini', /Opera Mini.*Version\/([0-9\.]+)/], + ['opera', /Opera\/([0-9\.]+)(?:\s|$)/], + ['opera', /OPR\/([0-9\.]+)(:?\s|$)/], + ['ie', /Trident\/7\.0.*rv\:([0-9\.]+).*\).*Gecko$/], + ['ie', /MSIE\s([0-9\.]+);.*Trident\/[4-7].0/], + ['ie', /MSIE\s(7\.0)/], + ['bb10', /BB10;\sTouch.*Version\/([0-9\.]+)/], + ['android', /Android\s([0-9\.]+)/], + ['ios', /Version\/([0-9\._]+).*Mobile.*Safari.*/], + ['safari', /Version\/([0-9\._]+).*Safari/], + ['facebook', /FBAV\/([0-9\.]+)/], + ['instagram', /Instagram\s([0-9\.]+)/], + ['ios-webview', /AppleWebKit\/([0-9\.]+).*Mobile/], + ['ios-webview', /AppleWebKit\/([0-9\.]+).*Gecko\)$/], + ['searchbot', SEARCHBOX_UA_REGEX], +]; +var operatingSystemRules = [ + ['iOS', /iP(hone|od|ad)/], + ['Android OS', /Android/], + ['BlackBerry OS', /BlackBerry|BB10/], + ['Windows Mobile', /IEMobile/], + ['Amazon OS', /Kindle/], + ['Windows 3.11', /Win16/], + ['Windows 95', /(Windows 95)|(Win95)|(Windows_95)/], + ['Windows 98', /(Windows 98)|(Win98)/], + ['Windows 2000', /(Windows NT 5.0)|(Windows 2000)/], + ['Windows XP', /(Windows NT 5.1)|(Windows XP)/], + ['Windows Server 2003', /(Windows NT 5.2)/], + ['Windows Vista', /(Windows NT 6.0)/], + ['Windows 7', /(Windows NT 6.1)/], + ['Windows 8', /(Windows NT 6.2)/], + ['Windows 8.1', /(Windows NT 6.3)/], + ['Windows 10', /(Windows NT 10.0)/], + ['Windows ME', /Windows ME/], + ['Open BSD', /OpenBSD/], + ['Sun OS', /SunOS/], + ['Chrome OS', /CrOS/], + ['Linux', /(Linux)|(X11)/], + ['Mac OS', /(Mac_PowerPC)|(Macintosh)/], + ['QNX', /QNX/], + ['BeOS', /BeOS/], + ['OS/2', /OS\/2/], +]; +function detect(userAgent) { + if (!!userAgent) { + return parseUserAgent(userAgent); + } + if (typeof document === 'undefined' && + typeof navigator !== 'undefined' && + navigator.product === 'ReactNative') { + return new ReactNativeInfo(); + } + if (typeof navigator !== 'undefined') { + return parseUserAgent(navigator.userAgent); + } + return getNodeVersion(); +} +function matchUserAgent(ua) { + // opted for using reduce here rather than Array#first with a regex.test call + // this is primarily because using the reduce we only perform the regex + // execution once rather than once for the test and for the exec again below + // probably something that needs to be benchmarked though + return (ua !== '' && + userAgentRules.reduce(function (matched, _a) { + var browser = _a[0], regex = _a[1]; + if (matched) { + return matched; + } + var uaMatch = regex.exec(ua); + return !!uaMatch && [browser, uaMatch]; + }, false)); +} +function parseUserAgent(ua) { + var matchedRule = matchUserAgent(ua); + if (!matchedRule) { + return null; + } + var name = matchedRule[0], match = matchedRule[1]; + if (name === 'searchbot') { + return new BotInfo(); + } + var versionParts = match[1] && match[1].split(/[._]/).slice(0, 3); + if (versionParts) { + if (versionParts.length < REQUIRED_VERSION_PARTS) { + versionParts = __spreadArrays(versionParts, createVersionParts(REQUIRED_VERSION_PARTS - versionParts.length)); + } + } + else { + versionParts = []; + } + var version = versionParts.join('.'); + var os = detectOS(ua); + var searchBotMatch = SEARCHBOT_OS_REGEX.exec(ua); + if (searchBotMatch && searchBotMatch[1]) { + return new SearchBotDeviceInfo(name, version, os, searchBotMatch[1]); + } + return new BrowserInfo(name, version, os); +} +function detectOS(ua) { + for (var ii = 0, count = operatingSystemRules.length; ii < count; ii++) { + var _a = operatingSystemRules[ii], os = _a[0], regex = _a[1]; + var match = regex.exec(ua); + if (match) { + return os; + } + } + return null; +} +function getNodeVersion() { + var isNode = typeof process !== 'undefined' && process.version; + return isNode ? new NodeInfo(process.version.slice(1)) : null; +} +function createVersionParts(count) { + var output = []; + for (var ii = 0; ii < count; ii++) { + output.push('0'); + } + return output; +} + +/** + * Common utilities + * @module glMatrix + */ +// Configuration Constants +var EPSILON$2 = 0.000001; +var ARRAY_TYPE = typeof Float32Array !== 'undefined' ? Float32Array : Array; +if (!Math.hypot) Math.hypot = function () { + var y = 0, + i = arguments.length; + + while (i--) { + y += arguments[i] * arguments[i]; + } + + return Math.sqrt(y); +}; + +/** + * 3x3 Matrix + * @module mat3 + */ + +/** + * Creates a new identity mat3 + * + * @returns {mat3} a new 3x3 matrix + */ + +function create$6() { + var out = new ARRAY_TYPE(9); + + if (ARRAY_TYPE != Float32Array) { + out[1] = 0; + out[2] = 0; + out[3] = 0; + out[5] = 0; + out[6] = 0; + out[7] = 0; + } + + out[0] = 1; + out[4] = 1; + out[8] = 1; + return out; +} +/** + * Copies the upper-left 3x3 values into the given mat3. + * + * @param {mat3} out the receiving 3x3 matrix + * @param {ReadonlyMat4} a the source 4x4 matrix + * @returns {mat3} out + */ + +function fromMat4(out, a) { + out[0] = a[0]; + out[1] = a[1]; + out[2] = a[2]; + out[3] = a[4]; + out[4] = a[5]; + out[5] = a[6]; + out[6] = a[8]; + out[7] = a[9]; + out[8] = a[10]; + return out; +} +/** + * Creates a new mat3 initialized with values from an existing matrix + * + * @param {ReadonlyMat3} a matrix to clone + * @returns {mat3} a new 3x3 matrix + */ + +function clone$6(a) { + var out = new ARRAY_TYPE(9); + out[0] = a[0]; + out[1] = a[1]; + out[2] = a[2]; + out[3] = a[3]; + out[4] = a[4]; + out[5] = a[5]; + out[6] = a[6]; + out[7] = a[7]; + out[8] = a[8]; + return out; +} +/** + * Copy the values from one mat3 to another + * + * @param {mat3} out the receiving matrix + * @param {ReadonlyMat3} a the source matrix + * @returns {mat3} out + */ + +function copy$5(out, a) { + out[0] = a[0]; + out[1] = a[1]; + out[2] = a[2]; + out[3] = a[3]; + out[4] = a[4]; + out[5] = a[5]; + out[6] = a[6]; + out[7] = a[7]; + out[8] = a[8]; + return out; +} +/** + * Create a new mat3 with the given values + * + * @param {Number} m00 Component in column 0, row 0 position (index 0) + * @param {Number} m01 Component in column 0, row 1 position (index 1) + * @param {Number} m02 Component in column 0, row 2 position (index 2) + * @param {Number} m10 Component in column 1, row 0 position (index 3) + * @param {Number} m11 Component in column 1, row 1 position (index 4) + * @param {Number} m12 Component in column 1, row 2 position (index 5) + * @param {Number} m20 Component in column 2, row 0 position (index 6) + * @param {Number} m21 Component in column 2, row 1 position (index 7) + * @param {Number} m22 Component in column 2, row 2 position (index 8) + * @returns {mat3} A new mat3 + */ + +function fromValues$4(m00, m01, m02, m10, m11, m12, m20, m21, m22) { + var out = new ARRAY_TYPE(9); + out[0] = m00; + out[1] = m01; + out[2] = m02; + out[3] = m10; + out[4] = m11; + out[5] = m12; + out[6] = m20; + out[7] = m21; + out[8] = m22; + return out; +} +/** + * Set the components of a mat3 to the given values + * + * @param {mat3} out the receiving matrix + * @param {Number} m00 Component in column 0, row 0 position (index 0) + * @param {Number} m01 Component in column 0, row 1 position (index 1) + * @param {Number} m02 Component in column 0, row 2 position (index 2) + * @param {Number} m10 Component in column 1, row 0 position (index 3) + * @param {Number} m11 Component in column 1, row 1 position (index 4) + * @param {Number} m12 Component in column 1, row 2 position (index 5) + * @param {Number} m20 Component in column 2, row 0 position (index 6) + * @param {Number} m21 Component in column 2, row 1 position (index 7) + * @param {Number} m22 Component in column 2, row 2 position (index 8) + * @returns {mat3} out + */ + +function set$4(out, m00, m01, m02, m10, m11, m12, m20, m21, m22) { + out[0] = m00; + out[1] = m01; + out[2] = m02; + out[3] = m10; + out[4] = m11; + out[5] = m12; + out[6] = m20; + out[7] = m21; + out[8] = m22; + return out; +} +/** + * Set a mat3 to the identity matrix + * + * @param {mat3} out the receiving matrix + * @returns {mat3} out + */ + +function identity$9(out) { + out[0] = 1; + out[1] = 0; + out[2] = 0; + out[3] = 0; + out[4] = 1; + out[5] = 0; + out[6] = 0; + out[7] = 0; + out[8] = 1; + return out; +} +/** + * Transpose the values of a mat3 + * + * @param {mat3} out the receiving matrix + * @param {ReadonlyMat3} a the source matrix + * @returns {mat3} out + */ + +function transpose$2(out, a) { + // If we are transposing ourselves we can skip a few steps but have to cache some values + if (out === a) { + var a01 = a[1], + a02 = a[2], + a12 = a[5]; + out[1] = a[3]; + out[2] = a[6]; + out[3] = a01; + out[5] = a[7]; + out[6] = a02; + out[7] = a12; + } else { + out[0] = a[0]; + out[1] = a[3]; + out[2] = a[6]; + out[3] = a[1]; + out[4] = a[4]; + out[5] = a[7]; + out[6] = a[2]; + out[7] = a[5]; + out[8] = a[8]; + } + + return out; +} +/** + * Inverts a mat3 + * + * @param {mat3} out the receiving matrix + * @param {ReadonlyMat3} a the source matrix + * @returns {mat3} out + */ + +function invert$4(out, a) { + var a00 = a[0], + a01 = a[1], + a02 = a[2]; + var a10 = a[3], + a11 = a[4], + a12 = a[5]; + var a20 = a[6], + a21 = a[7], + a22 = a[8]; + var b01 = a22 * a11 - a12 * a21; + var b11 = -a22 * a10 + a12 * a20; + var b21 = a21 * a10 - a11 * a20; // Calculate the determinant + + var det = a00 * b01 + a01 * b11 + a02 * b21; + + if (!det) { + return null; + } + + det = 1.0 / det; + out[0] = b01 * det; + out[1] = (-a22 * a01 + a02 * a21) * det; + out[2] = (a12 * a01 - a02 * a11) * det; + out[3] = b11 * det; + out[4] = (a22 * a00 - a02 * a20) * det; + out[5] = (-a12 * a00 + a02 * a10) * det; + out[6] = b21 * det; + out[7] = (-a21 * a00 + a01 * a20) * det; + out[8] = (a11 * a00 - a01 * a10) * det; + return out; +} +/** + * Calculates the adjugate of a mat3 + * + * @param {mat3} out the receiving matrix + * @param {ReadonlyMat3} a the source matrix + * @returns {mat3} out + */ + +function adjoint(out, a) { + var a00 = a[0], + a01 = a[1], + a02 = a[2]; + var a10 = a[3], + a11 = a[4], + a12 = a[5]; + var a20 = a[6], + a21 = a[7], + a22 = a[8]; + out[0] = a11 * a22 - a12 * a21; + out[1] = a02 * a21 - a01 * a22; + out[2] = a01 * a12 - a02 * a11; + out[3] = a12 * a20 - a10 * a22; + out[4] = a00 * a22 - a02 * a20; + out[5] = a02 * a10 - a00 * a12; + out[6] = a10 * a21 - a11 * a20; + out[7] = a01 * a20 - a00 * a21; + out[8] = a00 * a11 - a01 * a10; + return out; +} +/** + * Calculates the determinant of a mat3 + * + * @param {ReadonlyMat3} a the source matrix + * @returns {Number} determinant of a + */ + +function determinant(a) { + var a00 = a[0], + a01 = a[1], + a02 = a[2]; + var a10 = a[3], + a11 = a[4], + a12 = a[5]; + var a20 = a[6], + a21 = a[7], + a22 = a[8]; + return a00 * (a22 * a11 - a12 * a21) + a01 * (-a22 * a10 + a12 * a20) + a02 * (a21 * a10 - a11 * a20); +} +/** + * Multiplies two mat3's + * + * @param {mat3} out the receiving matrix + * @param {ReadonlyMat3} a the first operand + * @param {ReadonlyMat3} b the second operand + * @returns {mat3} out + */ + +function multiply$4(out, a, b) { + var a00 = a[0], + a01 = a[1], + a02 = a[2]; + var a10 = a[3], + a11 = a[4], + a12 = a[5]; + var a20 = a[6], + a21 = a[7], + a22 = a[8]; + var b00 = b[0], + b01 = b[1], + b02 = b[2]; + var b10 = b[3], + b11 = b[4], + b12 = b[5]; + var b20 = b[6], + b21 = b[7], + b22 = b[8]; + out[0] = b00 * a00 + b01 * a10 + b02 * a20; + out[1] = b00 * a01 + b01 * a11 + b02 * a21; + out[2] = b00 * a02 + b01 * a12 + b02 * a22; + out[3] = b10 * a00 + b11 * a10 + b12 * a20; + out[4] = b10 * a01 + b11 * a11 + b12 * a21; + out[5] = b10 * a02 + b11 * a12 + b12 * a22; + out[6] = b20 * a00 + b21 * a10 + b22 * a20; + out[7] = b20 * a01 + b21 * a11 + b22 * a21; + out[8] = b20 * a02 + b21 * a12 + b22 * a22; + return out; +} +/** + * Translate a mat3 by the given vector + * + * @param {mat3} out the receiving matrix + * @param {ReadonlyMat3} a the matrix to translate + * @param {ReadonlyVec2} v vector to translate by + * @returns {mat3} out + */ + +function translate$3(out, a, v) { + var a00 = a[0], + a01 = a[1], + a02 = a[2], + a10 = a[3], + a11 = a[4], + a12 = a[5], + a20 = a[6], + a21 = a[7], + a22 = a[8], + x = v[0], + y = v[1]; + out[0] = a00; + out[1] = a01; + out[2] = a02; + out[3] = a10; + out[4] = a11; + out[5] = a12; + out[6] = x * a00 + y * a10 + a20; + out[7] = x * a01 + y * a11 + a21; + out[8] = x * a02 + y * a12 + a22; + return out; +} +/** + * Rotates a mat3 by the given angle + * + * @param {mat3} out the receiving matrix + * @param {ReadonlyMat3} a the matrix to rotate + * @param {Number} rad the angle to rotate the matrix by + * @returns {mat3} out + */ + +function rotate$4(out, a, rad) { + var a00 = a[0], + a01 = a[1], + a02 = a[2], + a10 = a[3], + a11 = a[4], + a12 = a[5], + a20 = a[6], + a21 = a[7], + a22 = a[8], + s = Math.sin(rad), + c = Math.cos(rad); + out[0] = c * a00 + s * a10; + out[1] = c * a01 + s * a11; + out[2] = c * a02 + s * a12; + out[3] = c * a10 - s * a00; + out[4] = c * a11 - s * a01; + out[5] = c * a12 - s * a02; + out[6] = a20; + out[7] = a21; + out[8] = a22; + return out; +} +/** + * Scales the mat3 by the dimensions in the given vec2 + * + * @param {mat3} out the receiving matrix + * @param {ReadonlyMat3} a the matrix to rotate + * @param {ReadonlyVec2} v the vec2 to scale the matrix by + * @returns {mat3} out + **/ + +function scale$6(out, a, v) { + var x = v[0], + y = v[1]; + out[0] = x * a[0]; + out[1] = x * a[1]; + out[2] = x * a[2]; + out[3] = y * a[3]; + out[4] = y * a[4]; + out[5] = y * a[5]; + out[6] = a[6]; + out[7] = a[7]; + out[8] = a[8]; + return out; +} +/** + * Creates a matrix from a vector translation + * This is equivalent to (but much faster than): + * + * mat3.identity(dest); + * mat3.translate(dest, dest, vec); + * + * @param {mat3} out mat3 receiving operation result + * @param {ReadonlyVec2} v Translation vector + * @returns {mat3} out + */ + +function fromTranslation(out, v) { + out[0] = 1; + out[1] = 0; + out[2] = 0; + out[3] = 0; + out[4] = 1; + out[5] = 0; + out[6] = v[0]; + out[7] = v[1]; + out[8] = 1; + return out; +} +/** + * Creates a matrix from a given angle + * This is equivalent to (but much faster than): + * + * mat3.identity(dest); + * mat3.rotate(dest, dest, rad); + * + * @param {mat3} out mat3 receiving operation result + * @param {Number} rad the angle to rotate the matrix by + * @returns {mat3} out + */ + +function fromRotation(out, rad) { + var s = Math.sin(rad), + c = Math.cos(rad); + out[0] = c; + out[1] = s; + out[2] = 0; + out[3] = -s; + out[4] = c; + out[5] = 0; + out[6] = 0; + out[7] = 0; + out[8] = 1; + return out; +} +/** + * Creates a matrix from a vector scaling + * This is equivalent to (but much faster than): + * + * mat3.identity(dest); + * mat3.scale(dest, dest, vec); + * + * @param {mat3} out mat3 receiving operation result + * @param {ReadonlyVec2} v Scaling vector + * @returns {mat3} out + */ + +function fromScaling(out, v) { + out[0] = v[0]; + out[1] = 0; + out[2] = 0; + out[3] = 0; + out[4] = v[1]; + out[5] = 0; + out[6] = 0; + out[7] = 0; + out[8] = 1; + return out; +} +/** + * Copies the values from a mat2d into a mat3 + * + * @param {mat3} out the receiving matrix + * @param {ReadonlyMat2d} a the matrix to copy + * @returns {mat3} out + **/ + +function fromMat2d(out, a) { + out[0] = a[0]; + out[1] = a[1]; + out[2] = 0; + out[3] = a[2]; + out[4] = a[3]; + out[5] = 0; + out[6] = a[4]; + out[7] = a[5]; + out[8] = 1; + return out; +} +/** + * Calculates a 3x3 matrix from the given quaternion + * + * @param {mat3} out mat3 receiving operation result + * @param {ReadonlyQuat} q Quaternion to create matrix from + * + * @returns {mat3} out + */ + +function fromQuat$1(out, q) { + var x = q[0], + y = q[1], + z = q[2], + w = q[3]; + var x2 = x + x; + var y2 = y + y; + var z2 = z + z; + var xx = x * x2; + var yx = y * x2; + var yy = y * y2; + var zx = z * x2; + var zy = z * y2; + var zz = z * z2; + var wx = w * x2; + var wy = w * y2; + var wz = w * z2; + out[0] = 1 - yy - zz; + out[3] = yx - wz; + out[6] = zx + wy; + out[1] = yx + wz; + out[4] = 1 - xx - zz; + out[7] = zy - wx; + out[2] = zx - wy; + out[5] = zy + wx; + out[8] = 1 - xx - yy; + return out; +} +/** + * Calculates a 3x3 normal matrix (transpose inverse) from the 4x4 matrix + * + * @param {mat3} out mat3 receiving operation result + * @param {ReadonlyMat4} a Mat4 to derive the normal matrix from + * + * @returns {mat3} out + */ + +function normalFromMat4(out, a) { + var a00 = a[0], + a01 = a[1], + a02 = a[2], + a03 = a[3]; + var a10 = a[4], + a11 = a[5], + a12 = a[6], + a13 = a[7]; + var a20 = a[8], + a21 = a[9], + a22 = a[10], + a23 = a[11]; + var a30 = a[12], + a31 = a[13], + a32 = a[14], + a33 = a[15]; + var b00 = a00 * a11 - a01 * a10; + var b01 = a00 * a12 - a02 * a10; + var b02 = a00 * a13 - a03 * a10; + var b03 = a01 * a12 - a02 * a11; + var b04 = a01 * a13 - a03 * a11; + var b05 = a02 * a13 - a03 * a12; + var b06 = a20 * a31 - a21 * a30; + var b07 = a20 * a32 - a22 * a30; + var b08 = a20 * a33 - a23 * a30; + var b09 = a21 * a32 - a22 * a31; + var b10 = a21 * a33 - a23 * a31; + var b11 = a22 * a33 - a23 * a32; // Calculate the determinant + + var det = b00 * b11 - b01 * b10 + b02 * b09 + b03 * b08 - b04 * b07 + b05 * b06; + + if (!det) { + return null; + } + + det = 1.0 / det; + out[0] = (a11 * b11 - a12 * b10 + a13 * b09) * det; + out[1] = (a12 * b08 - a10 * b11 - a13 * b07) * det; + out[2] = (a10 * b10 - a11 * b08 + a13 * b06) * det; + out[3] = (a02 * b10 - a01 * b11 - a03 * b09) * det; + out[4] = (a00 * b11 - a02 * b08 + a03 * b07) * det; + out[5] = (a01 * b08 - a00 * b10 - a03 * b06) * det; + out[6] = (a31 * b05 - a32 * b04 + a33 * b03) * det; + out[7] = (a32 * b02 - a30 * b05 - a33 * b01) * det; + out[8] = (a30 * b04 - a31 * b02 + a33 * b00) * det; + return out; +} +/** + * Generates a 2D projection matrix with the given bounds + * + * @param {mat3} out mat3 frustum matrix will be written into + * @param {number} width Width of your gl context + * @param {number} height Height of gl context + * @returns {mat3} out + */ + +function projection(out, width, height) { + out[0] = 2 / width; + out[1] = 0; + out[2] = 0; + out[3] = 0; + out[4] = -2 / height; + out[5] = 0; + out[6] = -1; + out[7] = 1; + out[8] = 1; + return out; +} +/** + * Returns a string representation of a mat3 + * + * @param {ReadonlyMat3} a matrix to represent as a string + * @returns {String} string representation of the matrix + */ + +function str(a) { + return "mat3(" + a[0] + ", " + a[1] + ", " + a[2] + ", " + a[3] + ", " + a[4] + ", " + a[5] + ", " + a[6] + ", " + a[7] + ", " + a[8] + ")"; +} +/** + * Returns Frobenius norm of a mat3 + * + * @param {ReadonlyMat3} a the matrix to calculate Frobenius norm of + * @returns {Number} Frobenius norm + */ + +function frob(a) { + return Math.hypot(a[0], a[1], a[2], a[3], a[4], a[5], a[6], a[7], a[8]); +} +/** + * Adds two mat3's + * + * @param {mat3} out the receiving matrix + * @param {ReadonlyMat3} a the first operand + * @param {ReadonlyMat3} b the second operand + * @returns {mat3} out + */ + +function add$5(out, a, b) { + out[0] = a[0] + b[0]; + out[1] = a[1] + b[1]; + out[2] = a[2] + b[2]; + out[3] = a[3] + b[3]; + out[4] = a[4] + b[4]; + out[5] = a[5] + b[5]; + out[6] = a[6] + b[6]; + out[7] = a[7] + b[7]; + out[8] = a[8] + b[8]; + return out; +} +/** + * Subtracts matrix b from matrix a + * + * @param {mat3} out the receiving matrix + * @param {ReadonlyMat3} a the first operand + * @param {ReadonlyMat3} b the second operand + * @returns {mat3} out + */ + +function subtract$4(out, a, b) { + out[0] = a[0] - b[0]; + out[1] = a[1] - b[1]; + out[2] = a[2] - b[2]; + out[3] = a[3] - b[3]; + out[4] = a[4] - b[4]; + out[5] = a[5] - b[5]; + out[6] = a[6] - b[6]; + out[7] = a[7] - b[7]; + out[8] = a[8] - b[8]; + return out; +} +/** + * Multiply each element of the matrix by a scalar. + * + * @param {mat3} out the receiving matrix + * @param {ReadonlyMat3} a the matrix to scale + * @param {Number} b amount to scale the matrix's elements by + * @returns {mat3} out + */ + +function multiplyScalar(out, a, b) { + out[0] = a[0] * b; + out[1] = a[1] * b; + out[2] = a[2] * b; + out[3] = a[3] * b; + out[4] = a[4] * b; + out[5] = a[5] * b; + out[6] = a[6] * b; + out[7] = a[7] * b; + out[8] = a[8] * b; + return out; +} +/** + * Adds two mat3's after multiplying each element of the second operand by a scalar value. + * + * @param {mat3} out the receiving vector + * @param {ReadonlyMat3} a the first operand + * @param {ReadonlyMat3} b the second operand + * @param {Number} scale the amount to scale b's elements by before adding + * @returns {mat3} out + */ + +function multiplyScalarAndAdd(out, a, b, scale) { + out[0] = a[0] + b[0] * scale; + out[1] = a[1] + b[1] * scale; + out[2] = a[2] + b[2] * scale; + out[3] = a[3] + b[3] * scale; + out[4] = a[4] + b[4] * scale; + out[5] = a[5] + b[5] * scale; + out[6] = a[6] + b[6] * scale; + out[7] = a[7] + b[7] * scale; + out[8] = a[8] + b[8] * scale; + return out; +} +/** + * Returns whether or not the matrices have exactly the same elements in the same position (when compared with ===) + * + * @param {ReadonlyMat3} a The first matrix. + * @param {ReadonlyMat3} b The second matrix. + * @returns {Boolean} True if the matrices are equal, false otherwise. + */ + +function exactEquals$2(a, b) { + return a[0] === b[0] && a[1] === b[1] && a[2] === b[2] && a[3] === b[3] && a[4] === b[4] && a[5] === b[5] && a[6] === b[6] && a[7] === b[7] && a[8] === b[8]; +} +/** + * Returns whether or not the matrices have approximately the same elements in the same position. + * + * @param {ReadonlyMat3} a The first matrix. + * @param {ReadonlyMat3} b The second matrix. + * @returns {Boolean} True if the matrices are equal, false otherwise. + */ + +function equals$1(a, b) { + var a0 = a[0], + a1 = a[1], + a2 = a[2], + a3 = a[3], + a4 = a[4], + a5 = a[5], + a6 = a[6], + a7 = a[7], + a8 = a[8]; + var b0 = b[0], + b1 = b[1], + b2 = b[2], + b3 = b[3], + b4 = b[4], + b5 = b[5], + b6 = b[6], + b7 = b[7], + b8 = b[8]; + return Math.abs(a0 - b0) <= EPSILON$2 * Math.max(1.0, Math.abs(a0), Math.abs(b0)) && Math.abs(a1 - b1) <= EPSILON$2 * Math.max(1.0, Math.abs(a1), Math.abs(b1)) && Math.abs(a2 - b2) <= EPSILON$2 * Math.max(1.0, Math.abs(a2), Math.abs(b2)) && Math.abs(a3 - b3) <= EPSILON$2 * Math.max(1.0, Math.abs(a3), Math.abs(b3)) && Math.abs(a4 - b4) <= EPSILON$2 * Math.max(1.0, Math.abs(a4), Math.abs(b4)) && Math.abs(a5 - b5) <= EPSILON$2 * Math.max(1.0, Math.abs(a5), Math.abs(b5)) && Math.abs(a6 - b6) <= EPSILON$2 * Math.max(1.0, Math.abs(a6), Math.abs(b6)) && Math.abs(a7 - b7) <= EPSILON$2 * Math.max(1.0, Math.abs(a7), Math.abs(b7)) && Math.abs(a8 - b8) <= EPSILON$2 * Math.max(1.0, Math.abs(a8), Math.abs(b8)); +} +/** + * Alias for {@link mat3.multiply} + * @function + */ + +var mul$2 = multiply$4; +/** + * Alias for {@link mat3.subtract} + * @function + */ + +var sub$3 = subtract$4; + +var mat3 = /*#__PURE__*/Object.freeze({ + __proto__: null, + create: create$6, + fromMat4: fromMat4, + clone: clone$6, + copy: copy$5, + fromValues: fromValues$4, + set: set$4, + identity: identity$9, + transpose: transpose$2, + invert: invert$4, + adjoint: adjoint, + determinant: determinant, + multiply: multiply$4, + translate: translate$3, + rotate: rotate$4, + scale: scale$6, + fromTranslation: fromTranslation, + fromRotation: fromRotation, + fromScaling: fromScaling, + fromMat2d: fromMat2d, + fromQuat: fromQuat$1, + normalFromMat4: normalFromMat4, + projection: projection, + str: str, + frob: frob, + add: add$5, + subtract: subtract$4, + multiplyScalar: multiplyScalar, + multiplyScalarAndAdd: multiplyScalarAndAdd, + exactEquals: exactEquals$2, + equals: equals$1, + mul: mul$2, + sub: sub$3 +}); + +/** + * 4x4 Matrix
Format: column-major, when typed out it looks like row-major
The matrices are being post multiplied. + * @module mat4 + */ + +/** + * Creates a new identity mat4 + * + * @returns {mat4} a new 4x4 matrix + */ + +function create$5() { + var out = new ARRAY_TYPE(16); + + if (ARRAY_TYPE != Float32Array) { + out[1] = 0; + out[2] = 0; + out[3] = 0; + out[4] = 0; + out[6] = 0; + out[7] = 0; + out[8] = 0; + out[9] = 0; + out[11] = 0; + out[12] = 0; + out[13] = 0; + out[14] = 0; + } + + out[0] = 1; + out[5] = 1; + out[10] = 1; + out[15] = 1; + return out; +} +/** + * Creates a new mat4 initialized with values from an existing matrix + * + * @param {ReadonlyMat4} a matrix to clone + * @returns {mat4} a new 4x4 matrix + */ + +function clone$5(a) { + var out = new ARRAY_TYPE(16); + out[0] = a[0]; + out[1] = a[1]; + out[2] = a[2]; + out[3] = a[3]; + out[4] = a[4]; + out[5] = a[5]; + out[6] = a[6]; + out[7] = a[7]; + out[8] = a[8]; + out[9] = a[9]; + out[10] = a[10]; + out[11] = a[11]; + out[12] = a[12]; + out[13] = a[13]; + out[14] = a[14]; + out[15] = a[15]; + return out; +} +/** + * Copy the values from one mat4 to another + * + * @param {mat4} out the receiving matrix + * @param {ReadonlyMat4} a the source matrix + * @returns {mat4} out + */ + +function copy$4(out, a) { + out[0] = a[0]; + out[1] = a[1]; + out[2] = a[2]; + out[3] = a[3]; + out[4] = a[4]; + out[5] = a[5]; + out[6] = a[6]; + out[7] = a[7]; + out[8] = a[8]; + out[9] = a[9]; + out[10] = a[10]; + out[11] = a[11]; + out[12] = a[12]; + out[13] = a[13]; + out[14] = a[14]; + out[15] = a[15]; + return out; +} +/** + * Set a mat4 to the identity matrix + * + * @param {mat4} out the receiving matrix + * @returns {mat4} out + */ + +function identity$8(out) { + out[0] = 1; + out[1] = 0; + out[2] = 0; + out[3] = 0; + out[4] = 0; + out[5] = 1; + out[6] = 0; + out[7] = 0; + out[8] = 0; + out[9] = 0; + out[10] = 1; + out[11] = 0; + out[12] = 0; + out[13] = 0; + out[14] = 0; + out[15] = 1; + return out; +} +/** + * Inverts a mat4 + * + * @param {mat4} out the receiving matrix + * @param {ReadonlyMat4} a the source matrix + * @returns {mat4} out + */ + +function invert$3(out, a) { + var a00 = a[0], + a01 = a[1], + a02 = a[2], + a03 = a[3]; + var a10 = a[4], + a11 = a[5], + a12 = a[6], + a13 = a[7]; + var a20 = a[8], + a21 = a[9], + a22 = a[10], + a23 = a[11]; + var a30 = a[12], + a31 = a[13], + a32 = a[14], + a33 = a[15]; + var b00 = a00 * a11 - a01 * a10; + var b01 = a00 * a12 - a02 * a10; + var b02 = a00 * a13 - a03 * a10; + var b03 = a01 * a12 - a02 * a11; + var b04 = a01 * a13 - a03 * a11; + var b05 = a02 * a13 - a03 * a12; + var b06 = a20 * a31 - a21 * a30; + var b07 = a20 * a32 - a22 * a30; + var b08 = a20 * a33 - a23 * a30; + var b09 = a21 * a32 - a22 * a31; + var b10 = a21 * a33 - a23 * a31; + var b11 = a22 * a33 - a23 * a32; // Calculate the determinant + + var det = b00 * b11 - b01 * b10 + b02 * b09 + b03 * b08 - b04 * b07 + b05 * b06; + + if (!det) { + return null; + } + + det = 1.0 / det; + out[0] = (a11 * b11 - a12 * b10 + a13 * b09) * det; + out[1] = (a02 * b10 - a01 * b11 - a03 * b09) * det; + out[2] = (a31 * b05 - a32 * b04 + a33 * b03) * det; + out[3] = (a22 * b04 - a21 * b05 - a23 * b03) * det; + out[4] = (a12 * b08 - a10 * b11 - a13 * b07) * det; + out[5] = (a00 * b11 - a02 * b08 + a03 * b07) * det; + out[6] = (a32 * b02 - a30 * b05 - a33 * b01) * det; + out[7] = (a20 * b05 - a22 * b02 + a23 * b01) * det; + out[8] = (a10 * b10 - a11 * b08 + a13 * b06) * det; + out[9] = (a01 * b08 - a00 * b10 - a03 * b06) * det; + out[10] = (a30 * b04 - a31 * b02 + a33 * b00) * det; + out[11] = (a21 * b02 - a20 * b04 - a23 * b00) * det; + out[12] = (a11 * b07 - a10 * b09 - a12 * b06) * det; + out[13] = (a00 * b09 - a01 * b07 + a02 * b06) * det; + out[14] = (a31 * b01 - a30 * b03 - a32 * b00) * det; + out[15] = (a20 * b03 - a21 * b01 + a22 * b00) * det; + return out; +} +/** + * Multiplies two mat4s + * + * @param {mat4} out the receiving matrix + * @param {ReadonlyMat4} a the first operand + * @param {ReadonlyMat4} b the second operand + * @returns {mat4} out + */ + +function multiply$3(out, a, b) { + var a00 = a[0], + a01 = a[1], + a02 = a[2], + a03 = a[3]; + var a10 = a[4], + a11 = a[5], + a12 = a[6], + a13 = a[7]; + var a20 = a[8], + a21 = a[9], + a22 = a[10], + a23 = a[11]; + var a30 = a[12], + a31 = a[13], + a32 = a[14], + a33 = a[15]; // Cache only the current line of the second matrix + + var b0 = b[0], + b1 = b[1], + b2 = b[2], + b3 = b[3]; + out[0] = b0 * a00 + b1 * a10 + b2 * a20 + b3 * a30; + out[1] = b0 * a01 + b1 * a11 + b2 * a21 + b3 * a31; + out[2] = b0 * a02 + b1 * a12 + b2 * a22 + b3 * a32; + out[3] = b0 * a03 + b1 * a13 + b2 * a23 + b3 * a33; + b0 = b[4]; + b1 = b[5]; + b2 = b[6]; + b3 = b[7]; + out[4] = b0 * a00 + b1 * a10 + b2 * a20 + b3 * a30; + out[5] = b0 * a01 + b1 * a11 + b2 * a21 + b3 * a31; + out[6] = b0 * a02 + b1 * a12 + b2 * a22 + b3 * a32; + out[7] = b0 * a03 + b1 * a13 + b2 * a23 + b3 * a33; + b0 = b[8]; + b1 = b[9]; + b2 = b[10]; + b3 = b[11]; + out[8] = b0 * a00 + b1 * a10 + b2 * a20 + b3 * a30; + out[9] = b0 * a01 + b1 * a11 + b2 * a21 + b3 * a31; + out[10] = b0 * a02 + b1 * a12 + b2 * a22 + b3 * a32; + out[11] = b0 * a03 + b1 * a13 + b2 * a23 + b3 * a33; + b0 = b[12]; + b1 = b[13]; + b2 = b[14]; + b3 = b[15]; + out[12] = b0 * a00 + b1 * a10 + b2 * a20 + b3 * a30; + out[13] = b0 * a01 + b1 * a11 + b2 * a21 + b3 * a31; + out[14] = b0 * a02 + b1 * a12 + b2 * a22 + b3 * a32; + out[15] = b0 * a03 + b1 * a13 + b2 * a23 + b3 * a33; + return out; +} +/** + * Translate a mat4 by the given vector + * + * @param {mat4} out the receiving matrix + * @param {ReadonlyMat4} a the matrix to translate + * @param {ReadonlyVec3} v vector to translate by + * @returns {mat4} out + */ + +function translate$2(out, a, v) { + var x = v[0], + y = v[1], + z = v[2]; + var a00, a01, a02, a03; + var a10, a11, a12, a13; + var a20, a21, a22, a23; + + if (a === out) { + out[12] = a[0] * x + a[4] * y + a[8] * z + a[12]; + out[13] = a[1] * x + a[5] * y + a[9] * z + a[13]; + out[14] = a[2] * x + a[6] * y + a[10] * z + a[14]; + out[15] = a[3] * x + a[7] * y + a[11] * z + a[15]; + } else { + a00 = a[0]; + a01 = a[1]; + a02 = a[2]; + a03 = a[3]; + a10 = a[4]; + a11 = a[5]; + a12 = a[6]; + a13 = a[7]; + a20 = a[8]; + a21 = a[9]; + a22 = a[10]; + a23 = a[11]; + out[0] = a00; + out[1] = a01; + out[2] = a02; + out[3] = a03; + out[4] = a10; + out[5] = a11; + out[6] = a12; + out[7] = a13; + out[8] = a20; + out[9] = a21; + out[10] = a22; + out[11] = a23; + out[12] = a00 * x + a10 * y + a20 * z + a[12]; + out[13] = a01 * x + a11 * y + a21 * z + a[13]; + out[14] = a02 * x + a12 * y + a22 * z + a[14]; + out[15] = a03 * x + a13 * y + a23 * z + a[15]; + } + + return out; +} +/** + * Rotates a matrix by the given angle around the X axis + * + * @param {mat4} out the receiving matrix + * @param {ReadonlyMat4} a the matrix to rotate + * @param {Number} rad the angle to rotate the matrix by + * @returns {mat4} out + */ + +function rotateX(out, a, rad) { + var s = Math.sin(rad); + var c = Math.cos(rad); + var a10 = a[4]; + var a11 = a[5]; + var a12 = a[6]; + var a13 = a[7]; + var a20 = a[8]; + var a21 = a[9]; + var a22 = a[10]; + var a23 = a[11]; + + if (a !== out) { + // If the source and destination differ, copy the unchanged rows + out[0] = a[0]; + out[1] = a[1]; + out[2] = a[2]; + out[3] = a[3]; + out[12] = a[12]; + out[13] = a[13]; + out[14] = a[14]; + out[15] = a[15]; + } // Perform axis-specific matrix multiplication + + + out[4] = a10 * c + a20 * s; + out[5] = a11 * c + a21 * s; + out[6] = a12 * c + a22 * s; + out[7] = a13 * c + a23 * s; + out[8] = a20 * c - a10 * s; + out[9] = a21 * c - a11 * s; + out[10] = a22 * c - a12 * s; + out[11] = a23 * c - a13 * s; + return out; +} +/** + * Rotates a matrix by the given angle around the Y axis + * + * @param {mat4} out the receiving matrix + * @param {ReadonlyMat4} a the matrix to rotate + * @param {Number} rad the angle to rotate the matrix by + * @returns {mat4} out + */ + +function rotateY(out, a, rad) { + var s = Math.sin(rad); + var c = Math.cos(rad); + var a00 = a[0]; + var a01 = a[1]; + var a02 = a[2]; + var a03 = a[3]; + var a20 = a[8]; + var a21 = a[9]; + var a22 = a[10]; + var a23 = a[11]; + + if (a !== out) { + // If the source and destination differ, copy the unchanged rows + out[4] = a[4]; + out[5] = a[5]; + out[6] = a[6]; + out[7] = a[7]; + out[12] = a[12]; + out[13] = a[13]; + out[14] = a[14]; + out[15] = a[15]; + } // Perform axis-specific matrix multiplication + + + out[0] = a00 * c - a20 * s; + out[1] = a01 * c - a21 * s; + out[2] = a02 * c - a22 * s; + out[3] = a03 * c - a23 * s; + out[8] = a00 * s + a20 * c; + out[9] = a01 * s + a21 * c; + out[10] = a02 * s + a22 * c; + out[11] = a03 * s + a23 * c; + return out; +} +/** + * Returns the translation vector component of a transformation + * matrix. If a matrix is built with fromRotationTranslation, + * the returned vector will be the same as the translation vector + * originally supplied. + * @param {vec3} out Vector to receive translation component + * @param {ReadonlyMat4} mat Matrix to be decomposed (input) + * @return {vec3} out + */ + +function getTranslation(out, mat) { + out[0] = mat[12]; + out[1] = mat[13]; + out[2] = mat[14]; + return out; +} +/** + * Returns the scaling factor component of a transformation + * matrix. If a matrix is built with fromRotationTranslationScale + * with a normalized Quaternion paramter, the returned vector will be + * the same as the scaling vector + * originally supplied. + * @param {vec3} out Vector to receive scaling factor component + * @param {ReadonlyMat4} mat Matrix to be decomposed (input) + * @return {vec3} out + */ + +function getScaling(out, mat) { + var m11 = mat[0]; + var m12 = mat[1]; + var m13 = mat[2]; + var m21 = mat[4]; + var m22 = mat[5]; + var m23 = mat[6]; + var m31 = mat[8]; + var m32 = mat[9]; + var m33 = mat[10]; + out[0] = Math.hypot(m11, m12, m13); + out[1] = Math.hypot(m21, m22, m23); + out[2] = Math.hypot(m31, m32, m33); + return out; +} +/** + * Returns a quaternion representing the rotational component + * of a transformation matrix. If a matrix is built with + * fromRotationTranslation, the returned quaternion will be the + * same as the quaternion originally supplied. + * @param {quat} out Quaternion to receive the rotation component + * @param {ReadonlyMat4} mat Matrix to be decomposed (input) + * @return {quat} out + */ + +function getRotation(out, mat) { + var scaling = new ARRAY_TYPE(3); + getScaling(scaling, mat); + var is1 = 1 / scaling[0]; + var is2 = 1 / scaling[1]; + var is3 = 1 / scaling[2]; + var sm11 = mat[0] * is1; + var sm12 = mat[1] * is2; + var sm13 = mat[2] * is3; + var sm21 = mat[4] * is1; + var sm22 = mat[5] * is2; + var sm23 = mat[6] * is3; + var sm31 = mat[8] * is1; + var sm32 = mat[9] * is2; + var sm33 = mat[10] * is3; + var trace = sm11 + sm22 + sm33; + var S = 0; + + if (trace > 0) { + S = Math.sqrt(trace + 1.0) * 2; + out[3] = 0.25 * S; + out[0] = (sm23 - sm32) / S; + out[1] = (sm31 - sm13) / S; + out[2] = (sm12 - sm21) / S; + } else if (sm11 > sm22 && sm11 > sm33) { + S = Math.sqrt(1.0 + sm11 - sm22 - sm33) * 2; + out[3] = (sm23 - sm32) / S; + out[0] = 0.25 * S; + out[1] = (sm12 + sm21) / S; + out[2] = (sm31 + sm13) / S; + } else if (sm22 > sm33) { + S = Math.sqrt(1.0 + sm22 - sm11 - sm33) * 2; + out[3] = (sm31 - sm13) / S; + out[0] = (sm12 + sm21) / S; + out[1] = 0.25 * S; + out[2] = (sm23 + sm32) / S; + } else { + S = Math.sqrt(1.0 + sm33 - sm11 - sm22) * 2; + out[3] = (sm12 - sm21) / S; + out[0] = (sm31 + sm13) / S; + out[1] = (sm23 + sm32) / S; + out[2] = 0.25 * S; + } + + return out; +} +/** + * Creates a matrix from a quaternion rotation, vector translation and vector scale + * This is equivalent to (but much faster than): + * + * mat4.identity(dest); + * mat4.translate(dest, vec); + * let quatMat = mat4.create(); + * quat4.toMat4(quat, quatMat); + * mat4.multiply(dest, quatMat); + * mat4.scale(dest, scale) + * + * @param {mat4} out mat4 receiving operation result + * @param {quat4} q Rotation quaternion + * @param {ReadonlyVec3} v Translation vector + * @param {ReadonlyVec3} s Scaling vector + * @returns {mat4} out + */ + +function fromRotationTranslationScale(out, q, v, s) { + // Quaternion math + var x = q[0], + y = q[1], + z = q[2], + w = q[3]; + var x2 = x + x; + var y2 = y + y; + var z2 = z + z; + var xx = x * x2; + var xy = x * y2; + var xz = x * z2; + var yy = y * y2; + var yz = y * z2; + var zz = z * z2; + var wx = w * x2; + var wy = w * y2; + var wz = w * z2; + var sx = s[0]; + var sy = s[1]; + var sz = s[2]; + out[0] = (1 - (yy + zz)) * sx; + out[1] = (xy + wz) * sx; + out[2] = (xz - wy) * sx; + out[3] = 0; + out[4] = (xy - wz) * sy; + out[5] = (1 - (xx + zz)) * sy; + out[6] = (yz + wx) * sy; + out[7] = 0; + out[8] = (xz + wy) * sz; + out[9] = (yz - wx) * sz; + out[10] = (1 - (xx + yy)) * sz; + out[11] = 0; + out[12] = v[0]; + out[13] = v[1]; + out[14] = v[2]; + out[15] = 1; + return out; +} +/** + * Calculates a 4x4 matrix from the given quaternion + * + * @param {mat4} out mat4 receiving operation result + * @param {ReadonlyQuat} q Quaternion to create matrix from + * + * @returns {mat4} out + */ + +function fromQuat(out, q) { + var x = q[0], + y = q[1], + z = q[2], + w = q[3]; + var x2 = x + x; + var y2 = y + y; + var z2 = z + z; + var xx = x * x2; + var yx = y * x2; + var yy = y * y2; + var zx = z * x2; + var zy = z * y2; + var zz = z * z2; + var wx = w * x2; + var wy = w * y2; + var wz = w * z2; + out[0] = 1 - yy - zz; + out[1] = yx + wz; + out[2] = zx - wy; + out[3] = 0; + out[4] = yx - wz; + out[5] = 1 - xx - zz; + out[6] = zy + wx; + out[7] = 0; + out[8] = zx + wy; + out[9] = zy - wx; + out[10] = 1 - xx - yy; + out[11] = 0; + out[12] = 0; + out[13] = 0; + out[14] = 0; + out[15] = 1; + return out; +} +/** + * Generates a perspective projection matrix with the given bounds. + * Passing null/undefined/no value for far will generate infinite projection matrix. + * + * @param {mat4} out mat4 frustum matrix will be written into + * @param {number} fovy Vertical field of view in radians + * @param {number} aspect Aspect ratio. typically viewport width/height + * @param {number} near Near bound of the frustum + * @param {number} far Far bound of the frustum, can be null or Infinity + * @returns {mat4} out + */ + +function perspective(out, fovy, aspect, near, far) { + var f = 1.0 / Math.tan(fovy / 2), + nf; + out[0] = f / aspect; + out[1] = 0; + out[2] = 0; + out[3] = 0; + out[4] = 0; + out[5] = f; + out[6] = 0; + out[7] = 0; + out[8] = 0; + out[9] = 0; + out[11] = -1; + out[12] = 0; + out[13] = 0; + out[15] = 0; + + if (far != null && far !== Infinity) { + nf = 1 / (near - far); + out[10] = (far + near) * nf; + out[14] = 2 * far * near * nf; + } else { + out[10] = -1; + out[14] = -2 * near; + } + + return out; +} +/** + * Generates a orthogonal projection matrix with the given bounds + * + * @param {mat4} out mat4 frustum matrix will be written into + * @param {number} left Left bound of the frustum + * @param {number} right Right bound of the frustum + * @param {number} bottom Bottom bound of the frustum + * @param {number} top Top bound of the frustum + * @param {number} near Near bound of the frustum + * @param {number} far Far bound of the frustum + * @returns {mat4} out + */ + +function ortho(out, left, right, bottom, top, near, far) { + var lr = 1 / (left - right); + var bt = 1 / (bottom - top); + var nf = 1 / (near - far); + out[0] = -2 * lr; + out[1] = 0; + out[2] = 0; + out[3] = 0; + out[4] = 0; + out[5] = -2 * bt; + out[6] = 0; + out[7] = 0; + out[8] = 0; + out[9] = 0; + out[10] = 2 * nf; + out[11] = 0; + out[12] = (left + right) * lr; + out[13] = (top + bottom) * bt; + out[14] = (far + near) * nf; + out[15] = 1; + return out; +} +/** + * Generates a look-at matrix with the given eye position, focal point, and up axis. + * If you want a matrix that actually makes an object look at another object, you should use targetTo instead. + * + * @param {mat4} out mat4 frustum matrix will be written into + * @param {ReadonlyVec3} eye Position of the viewer + * @param {ReadonlyVec3} center Point the viewer is looking at + * @param {ReadonlyVec3} up vec3 pointing up + * @returns {mat4} out + */ + +function lookAt(out, eye, center, up) { + var x0, x1, x2, y0, y1, y2, z0, z1, z2, len; + var eyex = eye[0]; + var eyey = eye[1]; + var eyez = eye[2]; + var upx = up[0]; + var upy = up[1]; + var upz = up[2]; + var centerx = center[0]; + var centery = center[1]; + var centerz = center[2]; + + if (Math.abs(eyex - centerx) < EPSILON$2 && Math.abs(eyey - centery) < EPSILON$2 && Math.abs(eyez - centerz) < EPSILON$2) { + return identity$8(out); + } + + z0 = eyex - centerx; + z1 = eyey - centery; + z2 = eyez - centerz; + len = 1 / Math.hypot(z0, z1, z2); + z0 *= len; + z1 *= len; + z2 *= len; + x0 = upy * z2 - upz * z1; + x1 = upz * z0 - upx * z2; + x2 = upx * z1 - upy * z0; + len = Math.hypot(x0, x1, x2); + + if (!len) { + x0 = 0; + x1 = 0; + x2 = 0; + } else { + len = 1 / len; + x0 *= len; + x1 *= len; + x2 *= len; + } + + y0 = z1 * x2 - z2 * x1; + y1 = z2 * x0 - z0 * x2; + y2 = z0 * x1 - z1 * x0; + len = Math.hypot(y0, y1, y2); + + if (!len) { + y0 = 0; + y1 = 0; + y2 = 0; + } else { + len = 1 / len; + y0 *= len; + y1 *= len; + y2 *= len; + } + + out[0] = x0; + out[1] = y0; + out[2] = z0; + out[3] = 0; + out[4] = x1; + out[5] = y1; + out[6] = z1; + out[7] = 0; + out[8] = x2; + out[9] = y2; + out[10] = z2; + out[11] = 0; + out[12] = -(x0 * eyex + x1 * eyey + x2 * eyez); + out[13] = -(y0 * eyex + y1 * eyey + y2 * eyez); + out[14] = -(z0 * eyex + z1 * eyey + z2 * eyez); + out[15] = 1; + return out; +} + +/** + * 3 Dimensional Vector + * @module vec3 + */ + +/** + * Creates a new, empty vec3 + * + * @returns {vec3} a new 3D vector + */ + +function create$4() { + var out = new ARRAY_TYPE(3); + + if (ARRAY_TYPE != Float32Array) { + out[0] = 0; + out[1] = 0; + out[2] = 0; + } + + return out; +} +/** + * Creates a new vec3 initialized with values from an existing vector + * + * @param {ReadonlyVec3} a vector to clone + * @returns {vec3} a new 3D vector + */ + +function clone$4(a) { + var out = new ARRAY_TYPE(3); + out[0] = a[0]; + out[1] = a[1]; + out[2] = a[2]; + return out; +} +/** + * Calculates the length of a vec3 + * + * @param {ReadonlyVec3} a vector to calculate length of + * @returns {Number} length of a + */ + +function length$2(a) { + var x = a[0]; + var y = a[1]; + var z = a[2]; + return Math.hypot(x, y, z); +} +/** + * Creates a new vec3 initialized with the given values + * + * @param {Number} x X component + * @param {Number} y Y component + * @param {Number} z Z component + * @returns {vec3} a new 3D vector + */ + +function fromValues$3(x, y, z) { + var out = new ARRAY_TYPE(3); + out[0] = x; + out[1] = y; + out[2] = z; + return out; +} +/** + * Copy the values from one vec3 to another + * + * @param {vec3} out the receiving vector + * @param {ReadonlyVec3} a the source vector + * @returns {vec3} out + */ + +function copy$3(out, a) { + out[0] = a[0]; + out[1] = a[1]; + out[2] = a[2]; + return out; +} +/** + * Set the components of a vec3 to the given values + * + * @param {vec3} out the receiving vector + * @param {Number} x X component + * @param {Number} y Y component + * @param {Number} z Z component + * @returns {vec3} out + */ + +function set$3(out, x, y, z) { + out[0] = x; + out[1] = y; + out[2] = z; + return out; +} +/** + * Adds two vec3's + * + * @param {vec3} out the receiving vector + * @param {ReadonlyVec3} a the first operand + * @param {ReadonlyVec3} b the second operand + * @returns {vec3} out + */ + +function add$4(out, a, b) { + out[0] = a[0] + b[0]; + out[1] = a[1] + b[1]; + out[2] = a[2] + b[2]; + return out; +} +/** + * Subtracts vector b from vector a + * + * @param {vec3} out the receiving vector + * @param {ReadonlyVec3} a the first operand + * @param {ReadonlyVec3} b the second operand + * @returns {vec3} out + */ + +function subtract$3(out, a, b) { + out[0] = a[0] - b[0]; + out[1] = a[1] - b[1]; + out[2] = a[2] - b[2]; + return out; +} +/** + * Multiplies two vec3's + * + * @param {vec3} out the receiving vector + * @param {ReadonlyVec3} a the first operand + * @param {ReadonlyVec3} b the second operand + * @returns {vec3} out + */ + +function multiply$2(out, a, b) { + out[0] = a[0] * b[0]; + out[1] = a[1] * b[1]; + out[2] = a[2] * b[2]; + return out; +} +/** + * Scales a vec3 by a scalar number + * + * @param {vec3} out the receiving vector + * @param {ReadonlyVec3} a the vector to scale + * @param {Number} b amount to scale the vector by + * @returns {vec3} out + */ + +function scale$5(out, a, b) { + out[0] = a[0] * b; + out[1] = a[1] * b; + out[2] = a[2] * b; + return out; +} +/** + * Calculates the euclidian distance between two vec3's + * + * @param {ReadonlyVec3} a the first operand + * @param {ReadonlyVec3} b the second operand + * @returns {Number} distance between a and b + */ + +function distance$b(a, b) { + var x = b[0] - a[0]; + var y = b[1] - a[1]; + var z = b[2] - a[2]; + return Math.hypot(x, y, z); +} +/** + * Normalize a vec3 + * + * @param {vec3} out the receiving vector + * @param {ReadonlyVec3} a vector to normalize + * @returns {vec3} out + */ + +function normalize$7(out, a) { + var x = a[0]; + var y = a[1]; + var z = a[2]; + var len = x * x + y * y + z * z; + + if (len > 0) { + //TODO: evaluate use of glm_invsqrt here? + len = 1 / Math.sqrt(len); + } + + out[0] = a[0] * len; + out[1] = a[1] * len; + out[2] = a[2] * len; + return out; +} +/** + * Calculates the dot product of two vec3's + * + * @param {ReadonlyVec3} a the first operand + * @param {ReadonlyVec3} b the second operand + * @returns {Number} dot product of a and b + */ + +function dot$4(a, b) { + return a[0] * b[0] + a[1] * b[1] + a[2] * b[2]; +} +/** + * Computes the cross product of two vec3's + * + * @param {vec3} out the receiving vector + * @param {ReadonlyVec3} a the first operand + * @param {ReadonlyVec3} b the second operand + * @returns {vec3} out + */ + +function cross$2(out, a, b) { + var ax = a[0], + ay = a[1], + az = a[2]; + var bx = b[0], + by = b[1], + bz = b[2]; + out[0] = ay * bz - az * by; + out[1] = az * bx - ax * bz; + out[2] = ax * by - ay * bx; + return out; +} +/** + * Performs a linear interpolation between two vec3's + * + * @param {vec3} out the receiving vector + * @param {ReadonlyVec3} a the first operand + * @param {ReadonlyVec3} b the second operand + * @param {Number} t interpolation amount, in the range [0-1], between the two inputs + * @returns {vec3} out + */ + +function lerp$2(out, a, b, t) { + var ax = a[0]; + var ay = a[1]; + var az = a[2]; + out[0] = ax + t * (b[0] - ax); + out[1] = ay + t * (b[1] - ay); + out[2] = az + t * (b[2] - az); + return out; +} +/** + * Transforms the vec3 with a mat4. + * 4th vector component is implicitly '1' + * + * @param {vec3} out the receiving vector + * @param {ReadonlyVec3} a the vector to transform + * @param {ReadonlyMat4} m matrix to transform with + * @returns {vec3} out + */ + +function transformMat4$2(out, a, m) { + var x = a[0], + y = a[1], + z = a[2]; + var w = m[3] * x + m[7] * y + m[11] * z + m[15]; + w = w || 1.0; + out[0] = (m[0] * x + m[4] * y + m[8] * z + m[12]) / w; + out[1] = (m[1] * x + m[5] * y + m[9] * z + m[13]) / w; + out[2] = (m[2] * x + m[6] * y + m[10] * z + m[14]) / w; + return out; +} +/** + * Transforms the vec3 with a mat3. + * + * @param {vec3} out the receiving vector + * @param {ReadonlyVec3} a the vector to transform + * @param {ReadonlyMat3} m the 3x3 matrix to transform with + * @returns {vec3} out + */ + +function transformMat3$2(out, a, m) { + var x = a[0], + y = a[1], + z = a[2]; + out[0] = x * m[0] + y * m[3] + z * m[6]; + out[1] = x * m[1] + y * m[4] + z * m[7]; + out[2] = x * m[2] + y * m[5] + z * m[8]; + return out; +} +/** + * Transforms the vec3 with a quat + * Can also be used for dual quaternions. (Multiply it with the real part) + * + * @param {vec3} out the receiving vector + * @param {ReadonlyVec3} a the vector to transform + * @param {ReadonlyQuat} q quaternion to transform with + * @returns {vec3} out + */ + +function transformQuat(out, a, q) { + // benchmarks: https://jsperf.com/quaternion-transform-vec3-implementations-fixed + var qx = q[0], + qy = q[1], + qz = q[2], + qw = q[3]; + var x = a[0], + y = a[1], + z = a[2]; // var qvec = [qx, qy, qz]; + // var uv = vec3.cross([], qvec, a); + + var uvx = qy * z - qz * y, + uvy = qz * x - qx * z, + uvz = qx * y - qy * x; // var uuv = vec3.cross([], qvec, uv); + + var uuvx = qy * uvz - qz * uvy, + uuvy = qz * uvx - qx * uvz, + uuvz = qx * uvy - qy * uvx; // vec3.scale(uv, uv, 2 * w); + + var w2 = qw * 2; + uvx *= w2; + uvy *= w2; + uvz *= w2; // vec3.scale(uuv, uuv, 2); + + uuvx *= 2; + uuvy *= 2; + uuvz *= 2; // return vec3.add(out, a, vec3.add(out, uv, uuv)); + + out[0] = x + uvx + uuvx; + out[1] = y + uvy + uuvy; + out[2] = z + uvz + uuvz; + return out; +} +/** + * Alias for {@link vec3.subtract} + * @function + */ + +var sub$2 = subtract$3; +/** + * Alias for {@link vec3.distance} + * @function + */ + +var dist$1 = distance$b; +/** + * Alias for {@link vec3.length} + * @function + */ + +var len$2 = length$2; +/** + * Perform some operation over an array of vec3s. + * + * @param {Array} a the array of vectors to iterate over + * @param {Number} stride Number of elements between the start of each vec3. If 0 assumes tightly packed + * @param {Number} offset Number of elements to skip at the beginning of the array + * @param {Number} count Number of vec3s to iterate over. If 0 iterates over entire array + * @param {Function} fn Function to call for each vector in the array + * @param {Object} [arg] additional argument to pass to fn + * @returns {Array} a + * @function + */ + +(function () { + var vec = create$4(); + return function (a, stride, offset, count, fn, arg) { + var i, l; + + if (!stride) { + stride = 3; + } + + if (!offset) { + offset = 0; + } + + if (count) { + l = Math.min(count * stride + offset, a.length); + } else { + l = a.length; + } + + for (i = offset; i < l; i += stride) { + vec[0] = a[i]; + vec[1] = a[i + 1]; + vec[2] = a[i + 2]; + fn(vec, vec, arg); + a[i] = vec[0]; + a[i + 1] = vec[1]; + a[i + 2] = vec[2]; + } + + return a; + }; +})(); + +/** + * 4 Dimensional Vector + * @module vec4 + */ + +/** + * Creates a new, empty vec4 + * + * @returns {vec4} a new 4D vector + */ + +function create$3() { + var out = new ARRAY_TYPE(4); + + if (ARRAY_TYPE != Float32Array) { + out[0] = 0; + out[1] = 0; + out[2] = 0; + out[3] = 0; + } + + return out; +} +/** + * Creates a new vec4 initialized with the given values + * + * @param {Number} x X component + * @param {Number} y Y component + * @param {Number} z Z component + * @param {Number} w W component + * @returns {vec4} a new 4D vector + */ + +function fromValues$2(x, y, z, w) { + var out = new ARRAY_TYPE(4); + out[0] = x; + out[1] = y; + out[2] = z; + out[3] = w; + return out; +} +/** + * Copy the values from one vec4 to another + * + * @param {vec4} out the receiving vector + * @param {ReadonlyVec4} a the source vector + * @returns {vec4} out + */ + +function copy$2(out, a) { + out[0] = a[0]; + out[1] = a[1]; + out[2] = a[2]; + out[3] = a[3]; + return out; +} +/** + * Normalize a vec4 + * + * @param {vec4} out the receiving vector + * @param {ReadonlyVec4} a vector to normalize + * @returns {vec4} out + */ + +function normalize$6(out, a) { + var x = a[0]; + var y = a[1]; + var z = a[2]; + var w = a[3]; + var len = x * x + y * y + z * z + w * w; + + if (len > 0) { + len = 1 / Math.sqrt(len); + } + + out[0] = x * len; + out[1] = y * len; + out[2] = z * len; + out[3] = w * len; + return out; +} +/** + * Transforms the vec4 with a mat4. + * + * @param {vec4} out the receiving vector + * @param {ReadonlyVec4} a the vector to transform + * @param {ReadonlyMat4} m matrix to transform with + * @returns {vec4} out + */ + +function transformMat4$1(out, a, m) { + var x = a[0], + y = a[1], + z = a[2], + w = a[3]; + out[0] = m[0] * x + m[4] * y + m[8] * z + m[12] * w; + out[1] = m[1] * x + m[5] * y + m[9] * z + m[13] * w; + out[2] = m[2] * x + m[6] * y + m[10] * z + m[14] * w; + out[3] = m[3] * x + m[7] * y + m[11] * z + m[15] * w; + return out; +} +/** + * Perform some operation over an array of vec4s. + * + * @param {Array} a the array of vectors to iterate over + * @param {Number} stride Number of elements between the start of each vec4. If 0 assumes tightly packed + * @param {Number} offset Number of elements to skip at the beginning of the array + * @param {Number} count Number of vec4s to iterate over. If 0 iterates over entire array + * @param {Function} fn Function to call for each vector in the array + * @param {Object} [arg] additional argument to pass to fn + * @returns {Array} a + * @function + */ + +(function () { + var vec = create$3(); + return function (a, stride, offset, count, fn, arg) { + var i, l; + + if (!stride) { + stride = 4; + } + + if (!offset) { + offset = 0; + } + + if (count) { + l = Math.min(count * stride + offset, a.length); + } else { + l = a.length; + } + + for (i = offset; i < l; i += stride) { + vec[0] = a[i]; + vec[1] = a[i + 1]; + vec[2] = a[i + 2]; + vec[3] = a[i + 3]; + fn(vec, vec, arg); + a[i] = vec[0]; + a[i + 1] = vec[1]; + a[i + 2] = vec[2]; + a[i + 3] = vec[3]; + } + + return a; + }; +})(); + +/** + * Quaternion + * @module quat + */ + +/** + * Creates a new identity quat + * + * @returns {quat} a new quaternion + */ + +function create$2() { + var out = new ARRAY_TYPE(4); + + if (ARRAY_TYPE != Float32Array) { + out[0] = 0; + out[1] = 0; + out[2] = 0; + } + + out[3] = 1; + return out; +} +/** + * Sets a quat from the given angle and rotation axis, + * then returns it. + * + * @param {quat} out the receiving quaternion + * @param {ReadonlyVec3} axis the axis around which to rotate + * @param {Number} rad the angle in radians + * @returns {quat} out + **/ + +function setAxisAngle(out, axis, rad) { + rad = rad * 0.5; + var s = Math.sin(rad); + out[0] = s * axis[0]; + out[1] = s * axis[1]; + out[2] = s * axis[2]; + out[3] = Math.cos(rad); + return out; +} +/** + * Multiplies two quat's + * + * @param {quat} out the receiving quaternion + * @param {ReadonlyQuat} a the first operand + * @param {ReadonlyQuat} b the second operand + * @returns {quat} out + */ + +function multiply$1(out, a, b) { + var ax = a[0], + ay = a[1], + az = a[2], + aw = a[3]; + var bx = b[0], + by = b[1], + bz = b[2], + bw = b[3]; + out[0] = ax * bw + aw * bx + ay * bz - az * by; + out[1] = ay * bw + aw * by + az * bx - ax * bz; + out[2] = az * bw + aw * bz + ax * by - ay * bx; + out[3] = aw * bw - ax * bx - ay * by - az * bz; + return out; +} +/** + * Performs a spherical linear interpolation between two quat + * + * @param {quat} out the receiving quaternion + * @param {ReadonlyQuat} a the first operand + * @param {ReadonlyQuat} b the second operand + * @param {Number} t interpolation amount, in the range [0-1], between the two inputs + * @returns {quat} out + */ + +function slerp(out, a, b, t) { + // benchmarks: + // http://jsperf.com/quaternion-slerp-implementations + var ax = a[0], + ay = a[1], + az = a[2], + aw = a[3]; + var bx = b[0], + by = b[1], + bz = b[2], + bw = b[3]; + var omega, cosom, sinom, scale0, scale1; // calc cosine + + cosom = ax * bx + ay * by + az * bz + aw * bw; // adjust signs (if necessary) + + if (cosom < 0.0) { + cosom = -cosom; + bx = -bx; + by = -by; + bz = -bz; + bw = -bw; + } // calculate coefficients + + + if (1.0 - cosom > EPSILON$2) { + // standard case (slerp) + omega = Math.acos(cosom); + sinom = Math.sin(omega); + scale0 = Math.sin((1.0 - t) * omega) / sinom; + scale1 = Math.sin(t * omega) / sinom; + } else { + // "from" and "to" quaternions are very close + // ... so we can do a linear interpolation + scale0 = 1.0 - t; + scale1 = t; + } // calculate final values + + + out[0] = scale0 * ax + scale1 * bx; + out[1] = scale0 * ay + scale1 * by; + out[2] = scale0 * az + scale1 * bz; + out[3] = scale0 * aw + scale1 * bw; + return out; +} +/** + * Calculates the inverse of a quat + * + * @param {quat} out the receiving quaternion + * @param {ReadonlyQuat} a quat to calculate inverse of + * @returns {quat} out + */ + +function invert$2(out, a) { + var a0 = a[0], + a1 = a[1], + a2 = a[2], + a3 = a[3]; + var dot = a0 * a0 + a1 * a1 + a2 * a2 + a3 * a3; + var invDot = dot ? 1.0 / dot : 0; // TODO: Would be faster to return [0,0,0,0] immediately if dot == 0 + + out[0] = -a0 * invDot; + out[1] = -a1 * invDot; + out[2] = -a2 * invDot; + out[3] = a3 * invDot; + return out; +} +/** + * Creates a quaternion from the given 3x3 rotation matrix. + * + * NOTE: The resultant quaternion is not normalized, so you should be sure + * to renormalize the quaternion yourself where necessary. + * + * @param {quat} out the receiving quaternion + * @param {ReadonlyMat3} m rotation matrix + * @returns {quat} out + * @function + */ + +function fromMat3(out, m) { + // Algorithm in Ken Shoemake's article in 1987 SIGGRAPH course notes + // article "Quaternion Calculus and Fast Animation". + var fTrace = m[0] + m[4] + m[8]; + var fRoot; + + if (fTrace > 0.0) { + // |w| > 1/2, may as well choose w > 1/2 + fRoot = Math.sqrt(fTrace + 1.0); // 2w + + out[3] = 0.5 * fRoot; + fRoot = 0.5 / fRoot; // 1/(4w) + + out[0] = (m[5] - m[7]) * fRoot; + out[1] = (m[6] - m[2]) * fRoot; + out[2] = (m[1] - m[3]) * fRoot; + } else { + // |w| <= 1/2 + var i = 0; + if (m[4] > m[0]) i = 1; + if (m[8] > m[i * 3 + i]) i = 2; + var j = (i + 1) % 3; + var k = (i + 2) % 3; + fRoot = Math.sqrt(m[i * 3 + i] - m[j * 3 + j] - m[k * 3 + k] + 1.0); + out[i] = 0.5 * fRoot; + fRoot = 0.5 / fRoot; + out[3] = (m[j * 3 + k] - m[k * 3 + j]) * fRoot; + out[j] = (m[j * 3 + i] + m[i * 3 + j]) * fRoot; + out[k] = (m[k * 3 + i] + m[i * 3 + k]) * fRoot; + } + + return out; +} +/** + * Creates a quaternion from the given euler angle x, y, z. + * + * @param {quat} out the receiving quaternion + * @param {x} Angle to rotate around X axis in degrees. + * @param {y} Angle to rotate around Y axis in degrees. + * @param {z} Angle to rotate around Z axis in degrees. + * @returns {quat} out + * @function + */ + +function fromEuler(out, x, y, z) { + var halfToRad = 0.5 * Math.PI / 180.0; + x *= halfToRad; + y *= halfToRad; + z *= halfToRad; + var sx = Math.sin(x); + var cx = Math.cos(x); + var sy = Math.sin(y); + var cy = Math.cos(y); + var sz = Math.sin(z); + var cz = Math.cos(z); + out[0] = sx * cy * cz - cx * sy * sz; + out[1] = cx * sy * cz + sx * cy * sz; + out[2] = cx * cy * sz - sx * sy * cz; + out[3] = cx * cy * cz + sx * sy * sz; + return out; +} +/** + * Creates a new quat initialized with the given values + * + * @param {Number} x X component + * @param {Number} y Y component + * @param {Number} z Z component + * @param {Number} w W component + * @returns {quat} a new quaternion + * @function + */ + +var fromValues$1 = fromValues$2; +/** + * Copy the values from one quat to another + * + * @param {quat} out the receiving quaternion + * @param {ReadonlyQuat} a the source quaternion + * @returns {quat} out + * @function + */ + +var copy$1 = copy$2; +/** + * Alias for {@link quat.multiply} + * @function + */ + +var mul$1 = multiply$1; +/** + * Normalize a quat + * + * @param {quat} out the receiving quaternion + * @param {ReadonlyQuat} a quaternion to normalize + * @returns {quat} out + * @function + */ + +var normalize$5 = normalize$6; +/** + * Sets a quaternion to represent the shortest rotation from one + * vector to another. + * + * Both vectors are assumed to be unit length. + * + * @param {quat} out the receiving quaternion. + * @param {ReadonlyVec3} a the initial vector + * @param {ReadonlyVec3} b the destination vector + * @returns {quat} out + */ + +(function () { + var tmpvec3 = create$4(); + var xUnitVec3 = fromValues$3(1, 0, 0); + var yUnitVec3 = fromValues$3(0, 1, 0); + return function (out, a, b) { + var dot = dot$4(a, b); + + if (dot < -0.999999) { + cross$2(tmpvec3, xUnitVec3, a); + if (len$2(tmpvec3) < 0.000001) cross$2(tmpvec3, yUnitVec3, a); + normalize$7(tmpvec3, tmpvec3); + setAxisAngle(out, tmpvec3, Math.PI); + return out; + } else if (dot > 0.999999) { + out[0] = 0; + out[1] = 0; + out[2] = 0; + out[3] = 1; + return out; + } else { + cross$2(tmpvec3, a, b); + out[0] = tmpvec3[0]; + out[1] = tmpvec3[1]; + out[2] = tmpvec3[2]; + out[3] = 1 + dot; + return normalize$5(out, out); + } + }; +})(); +/** + * Performs a spherical linear interpolation with two control points + * + * @param {quat} out the receiving quaternion + * @param {ReadonlyQuat} a the first operand + * @param {ReadonlyQuat} b the second operand + * @param {ReadonlyQuat} c the third operand + * @param {ReadonlyQuat} d the fourth operand + * @param {Number} t interpolation amount, in the range [0-1], between the two inputs + * @returns {quat} out + */ + +(function () { + var temp1 = create$2(); + var temp2 = create$2(); + return function (out, a, b, c, d, t) { + slerp(temp1, a, d, t); + slerp(temp2, b, c, t); + slerp(out, temp1, temp2, 2 * t * (1 - t)); + return out; + }; +})(); +/** + * Sets the specified quaternion with values corresponding to the given + * axes. Each axis is a vec3 and is expected to be unit length and + * perpendicular to all other specified axes. + * + * @param {ReadonlyVec3} view the vector representing the viewing direction + * @param {ReadonlyVec3} right the vector representing the local "right" direction + * @param {ReadonlyVec3} up the vector representing the local "up" direction + * @returns {quat} out + */ + +(function () { + var matr = create$6(); + return function (out, view, right, up) { + matr[0] = right[0]; + matr[3] = right[1]; + matr[6] = right[2]; + matr[1] = up[0]; + matr[4] = up[1]; + matr[7] = up[2]; + matr[2] = -view[0]; + matr[5] = -view[1]; + matr[8] = -view[2]; + return normalize$5(out, fromMat3(out, matr)); + }; +})(); + +/** + * 2 Dimensional Vector + * @module vec2 + */ + +/** + * Creates a new, empty vec2 + * + * @returns {vec2} a new 2D vector + */ + +function create$1() { + var out = new ARRAY_TYPE(2); + + if (ARRAY_TYPE != Float32Array) { + out[0] = 0; + out[1] = 0; + } + + return out; +} +/** + * Adds two vec2's + * + * @param {vec2} out the receiving vector + * @param {ReadonlyVec2} a the first operand + * @param {ReadonlyVec2} b the second operand + * @returns {vec2} out + */ + +function add$3(out, a, b) { + out[0] = a[0] + b[0]; + out[1] = a[1] + b[1]; + return out; +} +/** + * Subtracts vector b from vector a + * + * @param {vec2} out the receiving vector + * @param {ReadonlyVec2} a the first operand + * @param {ReadonlyVec2} b the second operand + * @returns {vec2} out + */ + +function subtract$2(out, a, b) { + out[0] = a[0] - b[0]; + out[1] = a[1] - b[1]; + return out; +} +/** + * Returns the minimum of two vec2's + * + * @param {vec2} out the receiving vector + * @param {ReadonlyVec2} a the first operand + * @param {ReadonlyVec2} b the second operand + * @returns {vec2} out + */ + +function min$5(out, a, b) { + out[0] = Math.min(a[0], b[0]); + out[1] = Math.min(a[1], b[1]); + return out; +} +/** + * Returns the maximum of two vec2's + * + * @param {vec2} out the receiving vector + * @param {ReadonlyVec2} a the first operand + * @param {ReadonlyVec2} b the second operand + * @returns {vec2} out + */ + +function max$6(out, a, b) { + out[0] = Math.max(a[0], b[0]); + out[1] = Math.max(a[1], b[1]); + return out; +} +/** + * Scales a vec2 by a scalar number + * + * @param {vec2} out the receiving vector + * @param {ReadonlyVec2} a the vector to scale + * @param {Number} b amount to scale the vector by + * @returns {vec2} out + */ + +function scale$4(out, a, b) { + out[0] = a[0] * b; + out[1] = a[1] * b; + return out; +} +/** + * Calculates the euclidian distance between two vec2's + * + * @param {ReadonlyVec2} a the first operand + * @param {ReadonlyVec2} b the second operand + * @returns {Number} distance between a and b + */ + +function distance$a(a, b) { + var x = b[0] - a[0], + y = b[1] - a[1]; + return Math.hypot(x, y); +} +/** + * Calculates the length of a vec2 + * + * @param {ReadonlyVec2} a vector to calculate length of + * @returns {Number} length of a + */ + +function length$1(a) { + var x = a[0], + y = a[1]; + return Math.hypot(x, y); +} +/** + * Normalize a vec2 + * + * @param {vec2} out the receiving vector + * @param {ReadonlyVec2} a vector to normalize + * @returns {vec2} out + */ + +function normalize$4(out, a) { + var x = a[0], + y = a[1]; + var len = x * x + y * y; + + if (len > 0) { + //TODO: evaluate use of glm_invsqrt here? + len = 1 / Math.sqrt(len); + } + + out[0] = a[0] * len; + out[1] = a[1] * len; + return out; +} +/** + * Calculates the dot product of two vec2's + * + * @param {ReadonlyVec2} a the first operand + * @param {ReadonlyVec2} b the second operand + * @returns {Number} dot product of a and b + */ + +function dot$3(a, b) { + return a[0] * b[0] + a[1] * b[1]; +} +/** + * Transforms the vec2 with a mat3 + * 3rd vector component is implicitly '1' + * + * @param {vec2} out the receiving vector + * @param {ReadonlyVec2} a the vector to transform + * @param {ReadonlyMat3} m matrix to transform with + * @returns {vec2} out + */ + +function transformMat3$1(out, a, m) { + var x = a[0], + y = a[1]; + out[0] = m[0] * x + m[3] * y + m[6]; + out[1] = m[1] * x + m[4] * y + m[7]; + return out; +} +/** + * Get the angle between two 2D vectors + * @param {ReadonlyVec2} a The first operand + * @param {ReadonlyVec2} b The second operand + * @returns {Number} The angle in radians + */ + +function angle(a, b) { + var x1 = a[0], + y1 = a[1], + x2 = b[0], + y2 = b[1], + // mag is the product of the magnitudes of a and b + mag = Math.sqrt(x1 * x1 + y1 * y1) * Math.sqrt(x2 * x2 + y2 * y2), + // mag &&.. short circuits if mag == 0 + cosine = mag && (x1 * x2 + y1 * y2) / mag; // Math.min(Math.max(cosine, -1), 1) clamps the cosine between -1 and 1 + + return Math.acos(Math.min(Math.max(cosine, -1), 1)); +} +/** + * Returns whether or not the vectors exactly have the same elements in the same position (when compared with ===) + * + * @param {ReadonlyVec2} a The first vector. + * @param {ReadonlyVec2} b The second vector. + * @returns {Boolean} True if the vectors are equal, false otherwise. + */ + +function exactEquals$1(a, b) { + return a[0] === b[0] && a[1] === b[1]; +} +/** + * Alias for {@link vec2.subtract} + * @function + */ + +var sub$1 = subtract$2; +/** + * Perform some operation over an array of vec2s. + * + * @param {Array} a the array of vectors to iterate over + * @param {Number} stride Number of elements between the start of each vec2. If 0 assumes tightly packed + * @param {Number} offset Number of elements to skip at the beginning of the array + * @param {Number} count Number of vec2s to iterate over. If 0 iterates over entire array + * @param {Function} fn Function to call for each vector in the array + * @param {Object} [arg] additional argument to pass to fn + * @returns {Array} a + * @function + */ + +(function () { + var vec = create$1(); + return function (a, stride, offset, count, fn, arg) { + var i, l; + + if (!stride) { + stride = 2; + } + + if (!offset) { + offset = 0; + } + + if (count) { + l = Math.min(count * stride + offset, a.length); + } else { + l = a.length; + } + + for (i = offset; i < l; i += stride) { + vec[0] = a[i]; + vec[1] = a[i + 1]; + fn(vec, vec, arg); + a[i] = vec[0]; + a[i + 1] = vec[1]; + } + + return a; + }; +})(); + +/** + * @description 扩展方法，提供 gl-matrix 为提供的方法 + * */ +function leftTranslate$2(out, a, v) { + var transMat = [0, 0, 0, 0, 0, 0, 0, 0, 0]; + fromTranslation(transMat, v); + return multiply$4(out, transMat, a); +} +function leftRotate$2(out, a, rad) { + var rotateMat = [0, 0, 0, 0, 0, 0, 0, 0, 0]; + fromRotation(rotateMat, rad); + return multiply$4(out, rotateMat, a); +} +function leftScale$2(out, a, v) { + var scaleMat = [0, 0, 0, 0, 0, 0, 0, 0, 0]; + fromScaling(scaleMat, v); + return multiply$4(out, scaleMat, a); +} +function leftMultiply$2(out, a, a1) { + return multiply$4(out, a1, a); +} +/** + * 根据 actions 来做 transform + * @param m + * @param actions + */ +function transform$i(m, actions) { + var matrix = m ? [].concat(m) : [1, 0, 0, 0, 1, 0, 0, 0, 1]; + for (var i = 0, len = actions.length; i < len; i++) { + var action = actions[i]; + switch (action[0]) { + case 't': + leftTranslate$2(matrix, matrix, [action[1], action[2]]); + break; + case 's': + leftScale$2(matrix, matrix, [action[1], action[2]]); + break; + case 'r': + leftRotate$2(matrix, matrix, action[1]); + break; + case 'm': + leftMultiply$2(matrix, matrix, action[1]); + break; + } + } + return matrix; +} +/** + * 向量 v1 到 向量 v2 夹角的方向 + * @param {Array} v1 向量 + * @param {Array} v2 向量 + * @return {Boolean} >= 0 顺时针 < 0 逆时针 + */ +function direction$1(v1, v2) { + return v1[0] * v2[1] - v2[0] * v1[1]; +} +/** + * 二维向量 v1 到 v2 的夹角 + * @param v1 + * @param v2 + * @param direct + */ +function angleTo(v1, v2, direct) { + var ang = angle(v1, v2); + var angleLargeThanPI = direction$1(v1, v2) >= 0; + if (direct) { + if (angleLargeThanPI) { + return Math.PI * 2 - ang; + } + return ang; + } + if (angleLargeThanPI) { + return ang; + } + return Math.PI * 2 - ang; +} + +/** + * @fileoverview 矩阵运算，本来是要引入 gl-matrix, 但是考虑到 g-mobile 对大小有限制，同时 g-webgl 使用的 matrix 不一致 + * 所以，这里仅实现 2D 几个运算，上层自己引入 gl-matrix + * @author dxq613@gmail.com + */ +/** + * 3阶矩阵相乘 + * @param {number[]} a 矩阵1 + * @param {number[]} b 矩阵2 + */ +function multiplyMatrix$1(a, b) { + var out = []; + var a00 = a[0]; + var a01 = a[1]; + var a02 = a[2]; + var a10 = a[3]; + var a11 = a[4]; + var a12 = a[5]; + var a20 = a[6]; + var a21 = a[7]; + var a22 = a[8]; + var b00 = b[0]; + var b01 = b[1]; + var b02 = b[2]; + var b10 = b[3]; + var b11 = b[4]; + var b12 = b[5]; + var b20 = b[6]; + var b21 = b[7]; + var b22 = b[8]; + out[0] = b00 * a00 + b01 * a10 + b02 * a20; + out[1] = b00 * a01 + b01 * a11 + b02 * a21; + out[2] = b00 * a02 + b01 * a12 + b02 * a22; + out[3] = b10 * a00 + b11 * a10 + b12 * a20; + out[4] = b10 * a01 + b11 * a11 + b12 * a21; + out[5] = b10 * a02 + b11 * a12 + b12 * a22; + out[6] = b20 * a00 + b21 * a10 + b22 * a20; + out[7] = b20 * a01 + b21 * a11 + b22 * a21; + out[8] = b20 * a02 + b21 * a12 + b22 * a22; + return out; +} +/** + * 3阶矩阵同2阶向量相乘 + * @param {number[]} m 矩阵 + * @param {number[]} v 二阶向量 + */ +function multiplyVec2$2(m, v) { + var out = []; + var x = v[0]; + var y = v[1]; + out[0] = m[0] * x + m[3] * y + m[6]; + out[1] = m[1] * x + m[4] * y + m[7]; + return out; +} +/** + * 矩阵的逆 + * @param {number[]} a 矩阵 + */ +function invert$1(a) { + var out = []; + var a00 = a[0]; + var a01 = a[1]; + var a02 = a[2]; + var a10 = a[3]; + var a11 = a[4]; + var a12 = a[5]; + var a20 = a[6]; + var a21 = a[7]; + var a22 = a[8]; + var b01 = a22 * a11 - a12 * a21; + var b11 = -a22 * a10 + a12 * a20; + var b21 = a21 * a10 - a11 * a20; + // Calculate the determinant + var det = a00 * b01 + a01 * b11 + a02 * b21; + if (!det) { + return null; + } + det = 1.0 / det; + out[0] = b01 * det; + out[1] = (-a22 * a01 + a02 * a21) * det; + out[2] = (a12 * a01 - a02 * a11) * det; + out[3] = b11 * det; + out[4] = (a22 * a00 - a02 * a20) * det; + out[5] = (-a12 * a00 + a02 * a10) * det; + out[6] = b21 * det; + out[7] = (-a21 * a00 + a01 * a20) * det; + out[8] = (a11 * a00 - a01 * a10) * det; + return out; +} + +var transform$h = transform$i; +var MATRIX$1 = 'matrix'; +var CLONE_CFGS$1 = ['zIndex', 'capture', 'visible', 'type']; +// 可以在 toAttrs 中设置，但不属于绘图属性的字段 +var RESERVED_PORPS$1 = ['repeat']; +var DELEGATION_SPLIT$1 = ':'; +var WILDCARD$1 = '*'; +// 需要考虑数组嵌套数组的场景 +// 数组嵌套对象的场景不考虑 +function _cloneArrayAttr$1(arr) { + var result = []; + for (var i = 0; i < arr.length; i++) { + if (isArray$n(arr[i])) { + result.push([].concat(arr[i])); + } + else { + result.push(arr[i]); + } + } + return result; +} +function getFormatFromAttrs$1(toAttrs, shape) { + var fromAttrs = {}; + var attrs = shape.attrs; + for (var k in toAttrs) { + fromAttrs[k] = attrs[k]; + } + return fromAttrs; +} +function getFormatToAttrs$1(props, shape) { + var toAttrs = {}; + var attrs = shape.attr(); + each$2(props, function (v, k) { + if (RESERVED_PORPS$1.indexOf(k) === -1 && !isEqual$2(attrs[k], v)) { + toAttrs[k] = v; + } + }); + return toAttrs; +} +function checkExistedAttrs$1(animations, animation) { + if (animation.onFrame) { + return animations; + } + var startTime = animation.startTime, delay = animation.delay, duration = animation.duration; + var hasOwnProperty = Object.prototype.hasOwnProperty; + each$2(animations, function (item) { + // 后一个动画开始执行的时间 < 前一个动画的结束时间 && 后一个动画的执行时间 > 前一个动画的延迟 + if (startTime + delay < item.startTime + item.delay + item.duration && duration > item.delay) { + each$2(animation.toAttrs, function (v, k) { + if (hasOwnProperty.call(item.toAttrs, k)) { + delete item.toAttrs[k]; + delete item.fromAttrs[k]; + } + }); + } + }); + return animations; +} +var Element$4 = /** @class */ (function (_super) { + __extends$e(Element, _super); + function Element(cfg) { + var _this = _super.call(this, cfg) || this; + /** + * @protected + * 图形属性 + * @type {ShapeAttrs} + */ + _this.attrs = {}; + var attrs = _this.getDefaultAttrs(); + mix(attrs, cfg.attrs); + _this.attrs = attrs; + _this.initAttrs(attrs); + _this.initAnimate(); // 初始化动画 + return _this; + } + // override + Element.prototype.getDefaultCfg = function () { + return { + visible: true, + capture: true, + zIndex: 0, + }; + }; + /** + * @protected + * 获取默认的属相 + */ + Element.prototype.getDefaultAttrs = function () { + return { + matrix: this.getDefaultMatrix(), + opacity: 1, + }; + }; + /** + * @protected + * 一些方法调用会引起画布变化 + * @param {ChangeType} changeType 改变的类型 + */ + Element.prototype.onCanvasChange = function (changeType) { }; + /** + * @protected + * 初始化属性，有些属性需要加工 + * @param {object} attrs 属性值 + */ + Element.prototype.initAttrs = function (attrs) { }; + /** + * @protected + * 初始化动画 + */ + Element.prototype.initAnimate = function () { + this.set('animable', true); + this.set('animating', false); + }; + Element.prototype.isGroup = function () { + return false; + }; + Element.prototype.getParent = function () { + return this.get('parent'); + }; + Element.prototype.getCanvas = function () { + return this.get('canvas'); + }; + Element.prototype.attr = function () { + var _a; + var args = []; + for (var _i = 0; _i < arguments.length; _i++) { + args[_i] = arguments[_i]; + } + var name = args[0], value = args[1]; + if (!name) + return this.attrs; + if (isObject$f(name)) { + for (var k in name) { + this.setAttr(k, name[k]); + } + this.afterAttrsChange(name); + return this; + } + if (args.length === 2) { + this.setAttr(name, value); + this.afterAttrsChange((_a = {}, + _a[name] = value, + _a)); + return this; + } + return this.attrs[name]; + }; + // 是否被裁剪，被裁剪则不显示，不参与拾取 + Element.prototype.isClipped = function (refX, refY) { + var clip = this.getClip(); + return clip && !clip.isHit(refX, refY); + }; + /** + * 内部设置属性值的接口 + * @param {string} name 属性名 + * @param {any} value 属性值 + */ + Element.prototype.setAttr = function (name, value) { + var originValue = this.attrs[name]; + if (originValue !== value) { + this.attrs[name] = value; + this.onAttrChange(name, value, originValue); + } + }; + /** + * @protected + * 属性值发生改变 + * @param {string} name 属性名 + * @param {any} value 属性值 + * @param {any} originValue 属性值 + */ + Element.prototype.onAttrChange = function (name, value, originValue) { + if (name === 'matrix') { + this.set('totalMatrix', null); + } + }; + /** + * 属性更改后需要做的事情 + * @protected + */ + Element.prototype.afterAttrsChange = function (targetAttrs) { + if (this.cfg.isClipShape) { + var applyTo = this.cfg.applyTo; + if (applyTo) { + applyTo.onCanvasChange('clip'); + } + } + else { + this.onCanvasChange('attr'); + } + }; + Element.prototype.show = function () { + // 不是高频操作直接使用 set + this.set('visible', true); + this.onCanvasChange('show'); + return this; + }; + Element.prototype.hide = function () { + // 不是高频操作直接使用 set + this.set('visible', false); + this.onCanvasChange('hide'); + return this; + }; + Element.prototype.setZIndex = function (zIndex) { + this.set('zIndex', zIndex); + var parent = this.getParent(); + if (parent) { + // 改变 zIndex 不应该立即触发渲染 (调用 onCanvasChange('zIndex'))，需要经过 sort 再触发 + parent.sort(); + } + return this; + }; + Element.prototype.toFront = function () { + var parent = this.getParent(); + if (!parent) { + return; + } + var children = parent.getChildren(); + this.get('el'); + var index = children.indexOf(this); + children.splice(index, 1); + children.push(this); + this.onCanvasChange('zIndex'); + }; + Element.prototype.toBack = function () { + var parent = this.getParent(); + if (!parent) { + return; + } + var children = parent.getChildren(); + this.get('el'); + var index = children.indexOf(this); + children.splice(index, 1); + children.unshift(this); + this.onCanvasChange('zIndex'); + }; + Element.prototype.remove = function (destroy) { + if (destroy === void 0) { destroy = true; } + var parent = this.getParent(); + if (parent) { + removeFromArray$1(parent.getChildren(), this); + if (!parent.get('clearing')) { + // 如果父元素正在清理，当前元素不触发 remove + this.onCanvasChange('remove'); + } + } + else { + this.onCanvasChange('remove'); + } + if (destroy) { + this.destroy(); + } + }; + Element.prototype.resetMatrix = function () { + this.attr(MATRIX$1, this.getDefaultMatrix()); + this.onCanvasChange('matrix'); + }; + Element.prototype.getMatrix = function () { + return this.attr(MATRIX$1); + }; + Element.prototype.setMatrix = function (m) { + this.attr(MATRIX$1, m); + this.onCanvasChange('matrix'); + }; + // 获取总的 matrix + Element.prototype.getTotalMatrix = function () { + var totalMatrix = this.cfg.totalMatrix; + if (!totalMatrix) { + var currentMatrix = this.attr('matrix'); + var parentMatrix = this.cfg.parentMatrix; + if (parentMatrix && currentMatrix) { + totalMatrix = multiplyMatrix$1(parentMatrix, currentMatrix); + } + else { + totalMatrix = currentMatrix || parentMatrix; + } + this.set('totalMatrix', totalMatrix); + } + return totalMatrix; + }; + // 上层分组设置 matrix + Element.prototype.applyMatrix = function (matrix) { + var currentMatrix = this.attr('matrix'); + var totalMatrix = null; + if (matrix && currentMatrix) { + totalMatrix = multiplyMatrix$1(matrix, currentMatrix); + } + else { + totalMatrix = currentMatrix || matrix; + } + this.set('totalMatrix', totalMatrix); + this.set('parentMatrix', matrix); + }; + /** + * @protected + * 获取默认的矩阵 + * @returns {number[]|null} 默认的矩阵 + */ + Element.prototype.getDefaultMatrix = function () { + return null; + }; + // 将向量应用设置的矩阵 + Element.prototype.applyToMatrix = function (v) { + var matrix = this.attr('matrix'); + if (matrix) { + return multiplyVec2$2(matrix, v); + } + return v; + }; + // 根据设置的矩阵，将向量转换相对于图形/分组的位置 + Element.prototype.invertFromMatrix = function (v) { + var matrix = this.attr('matrix'); + if (matrix) { + var invertMatrix = invert$1(matrix); + if (invertMatrix) { + return multiplyVec2$2(invertMatrix, v); + } + } + return v; + }; + // 设置 clip + Element.prototype.setClip = function (clipCfg) { + var canvas = this.getCanvas(); + // 应该只设置当前元素的 clip，不应该去修改 clip 本身，方便 clip 被复用 + // TODO: setClip 的传参既 shape 配置，也支持 shape 对象 + // const preShape = this.get('clipShape'); + // if (preShape) { + // // 将之前的 clipShape 销毁 + // preShape.destroy(); + // } + var clipShape = null; + // 如果配置项为 null，则不移除 clipShape + if (clipCfg) { + var ShapeBase = this.getShapeBase(); + var shapeType = upperFirst(clipCfg.type); + var Cons = ShapeBase[shapeType]; + if (Cons) { + clipShape = new Cons({ + type: clipCfg.type, + isClipShape: true, + applyTo: this, + attrs: clipCfg.attrs, + canvas: canvas, + }); + } + } + this.set('clipShape', clipShape); + this.onCanvasChange('clip'); + return clipShape; + }; + Element.prototype.getClip = function () { + // 高频率调用的地方直接使用 this.cfg.xxx + var clipShape = this.cfg.clipShape; + // 未设置时返回 Null，保证一致性 + if (!clipShape) { + return null; + } + return clipShape; + }; + Element.prototype.clone = function () { + var _this = this; + var originAttrs = this.attrs; + var attrs = {}; + each$2(originAttrs, function (i, k) { + if (isArray$n(originAttrs[k])) { + attrs[k] = _cloneArrayAttr$1(originAttrs[k]); + } + else { + attrs[k] = originAttrs[k]; + } + }); + var cons = this.constructor; + // @ts-ignore + var clone = new cons({ attrs: attrs }); + each$2(CLONE_CFGS$1, function (cfgName) { + clone.set(cfgName, _this.get(cfgName)); + }); + return clone; + }; + Element.prototype.destroy = function () { + var destroyed = this.destroyed; + if (destroyed) { + return; + } + this.attrs = {}; + _super.prototype.destroy.call(this); + // this.onCanvasChange('destroy'); + }; + /** + * 是否处于动画暂停状态 + * @return {boolean} 是否处于动画暂停状态 + */ + Element.prototype.isAnimatePaused = function () { + return this.get('_pause').isPaused; + }; + /** + * 执行动画，支持多种函数签名 + * 1. animate(toAttrs: ElementAttrs, duration: number, easing?: string, callback?: () => void, delay?: number) + * 2. animate(onFrame: OnFrame, duration: number, easing?: string, callback?: () => void, delay?: number) + * 3. animate(toAttrs: ElementAttrs, cfg: AnimateCfg) + * 4. animate(onFrame: OnFrame, cfg: AnimateCfg) + * 各个参数的含义为: + * toAttrs 动画最终状态 + * onFrame 自定义帧动画函数 + * duration 动画执行时间 + * easing 动画缓动效果 + * callback 动画执行后的回调 + * delay 动画延迟时间 + */ + Element.prototype.animate = function () { + var args = []; + for (var _i = 0; _i < arguments.length; _i++) { + args[_i] = arguments[_i]; + } + if (!this.get('timeline') && !this.get('canvas')) { + return; + } + this.set('animating', true); + var timeline = this.get('timeline'); + if (!timeline) { + timeline = this.get('canvas').get('timeline'); + this.set('timeline', timeline); + } + var animations = this.get('animations') || []; + // 初始化 tick + if (!timeline.timer) { + timeline.initTimer(); + } + var toAttrs = args[0], duration = args[1], _a = args[2], easing = _a === void 0 ? 'easeLinear' : _a, _b = args[3], callback = _b === void 0 ? noop$3 : _b, _c = args[4], delay = _c === void 0 ? 0 : _c; + var onFrame; + var repeat; + var pauseCallback; + var resumeCallback; + var animateCfg; + // 第二个参数，既可以是动画最终状态 toAttrs，也可以是自定义帧动画函数 onFrame + if (isFunction$6(toAttrs)) { + onFrame = toAttrs; + toAttrs = {}; + } + else if (isObject$f(toAttrs) && toAttrs.onFrame) { + // 兼容 3.0 中的写法，onFrame 和 repeat 可在 toAttrs 中设置 + onFrame = toAttrs.onFrame; + repeat = toAttrs.repeat; + } + // 第二个参数，既可以是执行时间 duration，也可以是动画参数 animateCfg + if (isObject$f(duration)) { + animateCfg = duration; + duration = animateCfg.duration; + easing = animateCfg.easing || 'easeLinear'; + delay = animateCfg.delay || 0; + // animateCfg 中的设置优先级更高 + repeat = animateCfg.repeat || repeat || false; + callback = animateCfg.callback || noop$3; + pauseCallback = animateCfg.pauseCallback || noop$3; + resumeCallback = animateCfg.resumeCallback || noop$3; + } + else { + // 第四个参数，既可以是回调函数 callback，也可以是延迟时间 delay + if (isNumber$4(callback)) { + delay = callback; + callback = null; + } + // 第三个参数，既可以是缓动参数 easing，也可以是回调函数 callback + if (isFunction$6(easing)) { + callback = easing; + easing = 'easeLinear'; + } + else { + easing = easing || 'easeLinear'; + } + } + var formatToAttrs = getFormatToAttrs$1(toAttrs, this); + var animation = { + fromAttrs: getFormatFromAttrs$1(formatToAttrs, this), + toAttrs: formatToAttrs, + duration: duration, + easing: easing, + repeat: repeat, + callback: callback, + pauseCallback: pauseCallback, + resumeCallback: resumeCallback, + delay: delay, + startTime: timeline.getTime(), + id: uniqueId$3(), + onFrame: onFrame, + pathFormatted: false, + }; + // 如果动画元素队列中已经有这个图形了 + if (animations.length > 0) { + // 先检查是否需要合并属性。若有相同的动画，将该属性从前一个动画中删除,直接用后一个动画中 + animations = checkExistedAttrs$1(animations, animation); + } + else { + // 否则将图形添加到动画元素队列 + timeline.addAnimator(this); + } + animations.push(animation); + this.set('animations', animations); + this.set('_pause', { isPaused: false }); + }; + /** + * 停止动画 + * @param {boolean} toEnd 是否到动画的最终状态 + */ + Element.prototype.stopAnimate = function (toEnd) { + var _this = this; + if (toEnd === void 0) { toEnd = true; } + var animations = this.get('animations'); + each$2(animations, function (animation) { + // 将动画执行到最后一帧 + if (toEnd) { + if (animation.onFrame) { + _this.attr(animation.onFrame(1)); + } + else { + _this.attr(animation.toAttrs); + } + } + if (animation.callback) { + // 动画停止时的回调 + animation.callback(); + } + }); + this.set('animating', false); + this.set('animations', []); + }; + /** + * 暂停动画 + */ + Element.prototype.pauseAnimate = function () { + var timeline = this.get('timeline'); + var animations = this.get('animations'); + var pauseTime = timeline.getTime(); + each$2(animations, function (animation) { + animation._paused = true; + animation._pauseTime = pauseTime; + if (animation.pauseCallback) { + // 动画暂停时的回调 + animation.pauseCallback(); + } + }); + // 记录下是在什么时候暂停的 + this.set('_pause', { + isPaused: true, + pauseTime: pauseTime, + }); + return this; + }; + /** + * 恢复动画 + */ + Element.prototype.resumeAnimate = function () { + var timeline = this.get('timeline'); + var current = timeline.getTime(); + var animations = this.get('animations'); + var pauseTime = this.get('_pause').pauseTime; + // 之后更新属性需要计算动画已经执行的时长，如果暂停了，就把初始时间调后 + each$2(animations, function (animation) { + animation.startTime = animation.startTime + (current - pauseTime); + animation._paused = false; + animation._pauseTime = null; + if (animation.resumeCallback) { + animation.resumeCallback(); + } + }); + this.set('_pause', { + isPaused: false, + }); + this.set('animations', animations); + return this; + }; + /** + * 触发委托事件 + * @param {string} type 事件类型 + * @param {GraphEvent} eventObj 事件对象 + */ + Element.prototype.emitDelegation = function (type, eventObj) { + var _this = this; + var paths = eventObj.propagationPath; + this.getEvents(); + var relativeShape; + if (type === 'mouseenter') { + relativeShape = eventObj.fromShape; + } + else if (type === 'mouseleave') { + relativeShape = eventObj.toShape; + } + var _loop_1 = function (i) { + var element = paths[i]; + // 暂定跟 name 绑定 + var name_1 = element.get('name'); + if (name_1) { + // 第一个 mouseenter 和 mouseleave 的停止即可，因为后面的都是前面的 Parent + if ( + // 只有 element 是 Group 或者 Canvas 的时候，才需要判断 isParent + (element.isGroup() || (element.isCanvas && element.isCanvas())) && + relativeShape && + isParent$1(element, relativeShape)) { + return "break"; + } + if (isArray$n(name_1)) { + each$2(name_1, function (subName) { + _this.emitDelegateEvent(element, subName, eventObj); + }); + } + else { + this_1.emitDelegateEvent(element, name_1, eventObj); + } + } + }; + var this_1 = this; + // 至少有一个对象，且第一个对象为 shape + for (var i = 0; i < paths.length; i++) { + var state_1 = _loop_1(i); + if (state_1 === "break") + break; + } + }; + Element.prototype.emitDelegateEvent = function (element, name, eventObj) { + var events = this.getEvents(); + // 事件委托的形式 name:type + var eventName = name + DELEGATION_SPLIT$1 + eventObj.type; + if (events[eventName] || events[WILDCARD$1]) { + // 对于通配符 *，事件名称 = 委托事件名称 + eventObj.name = eventName; + eventObj.currentTarget = element; + eventObj.delegateTarget = this; + // 将委托事件的监听对象 delegateObject 挂载到事件对象上 + eventObj.delegateObject = element.get('delegateObject'); + this.emit(eventName, eventObj); + } + }; + /** + * 移动元素 + * @param {number} translateX 水平移动距离 + * @param {number} translateY 垂直移动距离 + * @return {IElement} 元素 + */ + Element.prototype.translate = function (translateX, translateY) { + if (translateX === void 0) { translateX = 0; } + if (translateY === void 0) { translateY = 0; } + var matrix = this.getMatrix(); + var newMatrix = transform$h(matrix, [['t', translateX, translateY]]); + this.setMatrix(newMatrix); + return this; + }; + /** + * 移动元素到目标位置 + * @param {number} targetX 目标位置的水平坐标 + * @param {number} targetX 目标位置的垂直坐标 + * @return {IElement} 元素 + */ + Element.prototype.move = function (targetX, targetY) { + var x = this.attr('x') || 0; + var y = this.attr('y') || 0; + this.translate(targetX - x, targetY - y); + return this; + }; + /** + * 移动元素到目标位置，等价于 move 方法。由于 moveTo 的语义性更强，因此在文档中推荐使用 moveTo 方法 + * @param {number} targetX 目标位置的 x 轴坐标 + * @param {number} targetY 目标位置的 y 轴坐标 + * @return {IElement} 元素 + */ + Element.prototype.moveTo = function (targetX, targetY) { + return this.move(targetX, targetY); + }; + /** + * 缩放元素 + * @param {number} ratioX 水平缩放比例 + * @param {number} ratioY 垂直缩放比例 + * @return {IElement} 元素 + */ + Element.prototype.scale = function (ratioX, ratioY) { + var matrix = this.getMatrix(); + var newMatrix = transform$h(matrix, [['s', ratioX, ratioY || ratioX]]); + this.setMatrix(newMatrix); + return this; + }; + /** + * 以画布左上角 (0, 0) 为中心旋转元素 + * @param {number} radian 旋转角度(弧度值) + * @return {IElement} 元素 + */ + Element.prototype.rotate = function (radian) { + var matrix = this.getMatrix(); + var newMatrix = transform$h(matrix, [['r', radian]]); + this.setMatrix(newMatrix); + return this; + }; + /** + * 以起始点为中心旋转元素 + * @param {number} radian 旋转角度(弧度值) + * @return {IElement} 元素 + */ + Element.prototype.rotateAtStart = function (rotate) { + var _a = this.attr(), x = _a.x, y = _a.y; + var matrix = this.getMatrix(); + var newMatrix = transform$h(matrix, [ + ['t', -x, -y], + ['r', rotate], + ['t', x, y], + ]); + this.setMatrix(newMatrix); + return this; + }; + /** + * 以任意点 (x, y) 为中心旋转元素 + * @param {number} radian 旋转角度(弧度值) + * @return {IElement} 元素 + */ + Element.prototype.rotateAtPoint = function (x, y, rotate) { + var matrix = this.getMatrix(); + var newMatrix = transform$h(matrix, [ + ['t', -x, -y], + ['r', rotate], + ['t', x, y], + ]); + this.setMatrix(newMatrix); + return this; + }; + return Element; +}(Base$3)); + +var SHAPE_MAP$1 = {}; +var INDEX$1 = '_INDEX'; +/** + * 设置 canvas + * @param {IElement} element 元素 + * @param {ICanvas} canvas 画布 + */ +function setCanvas$1(element, canvas) { + element.set('canvas', canvas); + if (element.isGroup()) { + var children = element.get('children'); + if (children.length) { + children.forEach(function (child) { + setCanvas$1(child, canvas); + }); + } + } +} +/** + * 设置 timeline + * @param {IElement} element 元素 + * @param {Timeline} timeline 时间轴 + */ +function setTimeline$1(element, timeline) { + element.set('timeline', timeline); + if (element.isGroup()) { + var children = element.get('children'); + if (children.length) { + children.forEach(function (child) { + setTimeline$1(child, timeline); + }); + } + } +} +function removeChild$1(container, element, destroy) { + if (destroy === void 0) { destroy = true; } + // 不再调用 element.remove() 方法，会出现循环调用 + if (destroy) { + element.destroy(); + } + else { + element.set('parent', null); + element.set('canvas', null); + } + removeFromArray$1(container.getChildren(), element); +} +function getComparer$1(compare) { + return function (left, right) { + var result = compare(left, right); + return result === 0 ? left[INDEX$1] - right[INDEX$1] : result; + }; +} +var Container$2 = /** @class */ (function (_super) { + __extends$e(Container, _super); + function Container() { + return _super !== null && _super.apply(this, arguments) || this; + } + Container.prototype.isCanvas = function () { + return false; + }; + // 根据子节点确定 BBox + Container.prototype.getBBox = function () { + // 所有的值可能在画布的可视区外 + var minX = Infinity; + var maxX = -Infinity; + var minY = Infinity; + var maxY = -Infinity; + var xArr = []; + var yArr = []; + // 将可见元素、图形以及不为空的图形分组筛选出来，用于包围盒合并 + var children = this.getChildren().filter(function (child) { + return child.get('visible') && (!child.isGroup() || (child.isGroup() && child.getChildren().length > 0)); + }); + if (children.length > 0) { + each$2(children, function (child) { + var box = child.getBBox(); + xArr.push(box.minX, box.maxX); + yArr.push(box.minY, box.maxY); + }); + minX = min$6(xArr); + maxX = max$7(xArr); + minY = min$6(yArr); + maxY = max$7(yArr); + } + else { + minX = 0; + maxX = 0; + minY = 0; + maxY = 0; + } + var box = { + x: minX, + y: minY, + minX: minX, + minY: minY, + maxX: maxX, + maxY: maxY, + width: maxX - minX, + height: maxY - minY, + }; + return box; + }; + // 获取画布的包围盒 + Container.prototype.getCanvasBBox = function () { + var minX = Infinity; + var maxX = -Infinity; + var minY = Infinity; + var maxY = -Infinity; + var xArr = []; + var yArr = []; + // 将可见元素、图形以及不为空的图形分组筛选出来，用于包围盒合并 + var children = this.getChildren().filter(function (child) { + return child.get('visible') && (!child.isGroup() || (child.isGroup() && child.getChildren().length > 0)); + }); + if (children.length > 0) { + each$2(children, function (child) { + var box = child.getCanvasBBox(); + xArr.push(box.minX, box.maxX); + yArr.push(box.minY, box.maxY); + }); + minX = min$6(xArr); + maxX = max$7(xArr); + minY = min$6(yArr); + maxY = max$7(yArr); + } + else { + minX = 0; + maxX = 0; + minY = 0; + maxY = 0; + } + var box = { + x: minX, + y: minY, + minX: minX, + minY: minY, + maxX: maxX, + maxY: maxY, + width: maxX - minX, + height: maxY - minY, + }; + return box; + }; + Container.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + cfg['children'] = []; + return cfg; + }; + Container.prototype.onAttrChange = function (name, value, originValue) { + _super.prototype.onAttrChange.call(this, name, value, originValue); + if (name === 'matrix') { + var totalMatrix = this.getTotalMatrix(); + this._applyChildrenMarix(totalMatrix); + } + }; + // 不但应用到自己身上还要应用于子元素 + Container.prototype.applyMatrix = function (matrix) { + var preTotalMatrix = this.getTotalMatrix(); + _super.prototype.applyMatrix.call(this, matrix); + var totalMatrix = this.getTotalMatrix(); + // totalMatrix 没有发生变化时，这里仅考虑两者都为 null 时 + // 不继续向下传递矩阵 + if (totalMatrix === preTotalMatrix) { + return; + } + this._applyChildrenMarix(totalMatrix); + }; + // 在子元素上设置矩阵 + Container.prototype._applyChildrenMarix = function (totalMatrix) { + var children = this.getChildren(); + each$2(children, function (child) { + child.applyMatrix(totalMatrix); + }); + }; + // 兼容老版本的接口 + Container.prototype.addShape = function () { + var args = []; + for (var _i = 0; _i < arguments.length; _i++) { + args[_i] = arguments[_i]; + } + var type = args[0]; + var cfg = args[1]; + if (isObject$f(type)) { + cfg = type; + } + else { + cfg['type'] = type; + } + var shapeType = SHAPE_MAP$1[cfg.type]; + if (!shapeType) { + shapeType = upperFirst(cfg.type); + SHAPE_MAP$1[cfg.type] = shapeType; + } + var ShapeBase = this.getShapeBase(); + var shape = new ShapeBase[shapeType](cfg); + this.add(shape); + return shape; + }; + Container.prototype.addGroup = function () { + var args = []; + for (var _i = 0; _i < arguments.length; _i++) { + args[_i] = arguments[_i]; + } + var groupClass = args[0], cfg = args[1]; + var group; + if (isFunction$6(groupClass)) { + if (cfg) { + group = new groupClass(cfg); + } + else { + group = new groupClass({ + // canvas, + parent: this, + }); + } + } + else { + var tmpCfg = groupClass || {}; + var TmpGroupClass = this.getGroupBase(); + group = new TmpGroupClass(tmpCfg); + } + this.add(group); + return group; + }; + Container.prototype.getCanvas = function () { + var canvas; + if (this.isCanvas()) { + canvas = this; + } + else { + canvas = this.get('canvas'); + } + return canvas; + }; + Container.prototype.getShape = function (x, y, ev) { + // 如果不支持拾取，则直接返回 + if (!isAllowCapture$1(this)) { + return null; + } + var children = this.getChildren(); + var shape; + // 如果容器是 group + if (!this.isCanvas()) { + var v = [x, y, 1]; + // 将 x, y 转换成对应于 group 的局部坐标 + v = this.invertFromMatrix(v); + if (!this.isClipped(v[0], v[1])) { + shape = this._findShape(children, v[0], v[1], ev); + } + } + else { + shape = this._findShape(children, x, y, ev); + } + return shape; + }; + Container.prototype._findShape = function (children, x, y, ev) { + var shape = null; + for (var i = children.length - 1; i >= 0; i--) { + var child = children[i]; + if (isAllowCapture$1(child)) { + if (child.isGroup()) { + shape = child.getShape(x, y, ev); + } + else if (child.isHit(x, y)) { + shape = child; + } + } + if (shape) { + break; + } + } + return shape; + }; + Container.prototype.add = function (element) { + var canvas = this.getCanvas(); + var children = this.getChildren(); + var timeline = this.get('timeline'); + var preParent = element.getParent(); + if (preParent) { + removeChild$1(preParent, element, false); + } + element.set('parent', this); + if (canvas) { + setCanvas$1(element, canvas); + } + if (timeline) { + setTimeline$1(element, timeline); + } + children.push(element); + element.onCanvasChange('add'); + this._applyElementMatrix(element); + }; + // 将当前容器的矩阵应用到子元素 + Container.prototype._applyElementMatrix = function (element) { + var totalMatrix = this.getTotalMatrix(); + // 添加图形或者分组时，需要把当前图元的矩阵设置进去 + if (totalMatrix) { + element.applyMatrix(totalMatrix); + } + }; + Container.prototype.getChildren = function () { + return this.get('children'); + }; + Container.prototype.sort = function () { + var children = this.getChildren(); + // 稳定排序 + each$2(children, function (child, index) { + child[INDEX$1] = index; + return child; + }); + children.sort(getComparer$1(function (obj1, obj2) { + return obj1.get('zIndex') - obj2.get('zIndex'); + })); + this.onCanvasChange('sort'); + }; + Container.prototype.clear = function () { + this.set('clearing', true); + if (this.destroyed) { + return; + } + var children = this.getChildren(); + for (var i = children.length - 1; i >= 0; i--) { + children[i].destroy(); // 销毁子元素 + } + this.set('children', []); + this.onCanvasChange('clear'); + this.set('clearing', false); + }; + Container.prototype.destroy = function () { + if (this.get('destroyed')) { + return; + } + this.clear(); + _super.prototype.destroy.call(this); + }; + /** + * 获取第一个子元素 + * @return {IElement} 第一个元素 + */ + Container.prototype.getFirst = function () { + return this.getChildByIndex(0); + }; + /** + * 获取最后一个子元素 + * @return {IElement} 元素 + */ + Container.prototype.getLast = function () { + var children = this.getChildren(); + return this.getChildByIndex(children.length - 1); + }; + /** + * 根据索引获取子元素 + * @return {IElement} 第一个元素 + */ + Container.prototype.getChildByIndex = function (index) { + var children = this.getChildren(); + return children[index]; + }; + /** + * 子元素的数量 + * @return {number} 子元素数量 + */ + Container.prototype.getCount = function () { + var children = this.getChildren(); + return children.length; + }; + /** + * 是否包含对应元素 + * @param {IElement} element 元素 + * @return {boolean} + */ + Container.prototype.contain = function (element) { + var children = this.getChildren(); + return children.indexOf(element) > -1; + }; + /** + * 移除对应子元素 + * @param {IElement} element 子元素 + * @param {boolean} destroy 是否销毁子元素，默认为 true + */ + Container.prototype.removeChild = function (element, destroy) { + if (destroy === void 0) { destroy = true; } + if (this.contain(element)) { + element.remove(destroy); + } + }; + /** + * 查找所有匹配的元素 + * @param {ElementFilterFn} fn 匹配函数 + * @return {IElement[]} 元素数组 + */ + Container.prototype.findAll = function (fn) { + var rst = []; + var children = this.getChildren(); + each$2(children, function (element) { + if (fn(element)) { + rst.push(element); + } + if (element.isGroup()) { + rst = rst.concat(element.findAll(fn)); + } + }); + return rst; + }; + /** + * 查找元素，找到第一个返回 + * @param {ElementFilterFn} fn 匹配函数 + * @return {IElement|null} 元素，可以为空 + */ + Container.prototype.find = function (fn) { + var rst = null; + var children = this.getChildren(); + each$2(children, function (element) { + if (fn(element)) { + rst = element; + } + else if (element.isGroup()) { + rst = element.find(fn); + } + if (rst) { + return false; + } + }); + return rst; + }; + /** + * 根据 ID 查找元素 + * @param {string} id 元素 id + * @return {IElement|null} 元素 + */ + Container.prototype.findById = function (id) { + return this.find(function (element) { + return element.get('id') === id; + }); + }; + /** + * 该方法即将废弃，不建议使用 + * 根据 className 查找元素 + * TODO: 该方式定义暂时只给 G6 3.3 以后的版本使用，待 G6 中的 findByClassName 方法移除后，G 也需要同步移除 + * @param {string} className 元素 className + * @return {IElement | null} 元素 + */ + Container.prototype.findByClassName = function (className) { + return this.find(function (element) { + return element.get('className') === className; + }); + }; + /** + * 根据 name 查找元素列表 + * @param {string} name 元素名称 + * @return {IElement[]} 元素 + */ + Container.prototype.findAllByName = function (name) { + return this.findAll(function (element) { + return element.get('name') === name; + }); + }; + return Container; +}(Element$4)); + +var frame = 0, // is an animation frame pending? + timeout = 0, // is a timeout pending? + interval$1 = 0, // are any timers active? + pokeDelay = 1000, // how frequently we check for clock skew + taskHead, + taskTail, + clockLast = 0, + clockNow = 0, + clockSkew = 0, + clock = typeof performance === "object" && performance.now ? performance : Date, + setFrame = typeof window === "object" && window.requestAnimationFrame ? window.requestAnimationFrame.bind(window) : function(f) { setTimeout(f, 17); }; + +function now$1() { + return clockNow || (setFrame(clearNow), clockNow = clock.now() + clockSkew); +} + +function clearNow() { + clockNow = 0; +} + +function Timer() { + this._call = + this._time = + this._next = null; +} + +Timer.prototype = timer$1.prototype = { + constructor: Timer, + restart: function(callback, delay, time) { + if (typeof callback !== "function") throw new TypeError("callback is not a function"); + time = (time == null ? now$1() : +time) + (delay == null ? 0 : +delay); + if (!this._next && taskTail !== this) { + if (taskTail) taskTail._next = this; + else taskHead = this; + taskTail = this; + } + this._call = callback; + this._time = time; + sleep(); + }, + stop: function() { + if (this._call) { + this._call = null; + this._time = Infinity; + sleep(); + } + } +}; + +function timer$1(callback, delay, time) { + var t = new Timer; + t.restart(callback, delay, time); + return t; +} + +function timerFlush() { + now$1(); // Get the current time, if not already set. + ++frame; // Pretend we’ve set an alarm, if we haven’t already. + var t = taskHead, e; + while (t) { + if ((e = clockNow - t._time) >= 0) t._call.call(null, e); + t = t._next; + } + --frame; +} + +function wake() { + clockNow = (clockLast = clock.now()) + clockSkew; + frame = timeout = 0; + try { + timerFlush(); + } finally { + frame = 0; + nap(); + clockNow = 0; + } +} + +function poke() { + var now = clock.now(), delay = now - clockLast; + if (delay > pokeDelay) clockSkew -= delay, clockLast = now; +} + +function nap() { + var t0, t1 = taskHead, t2, time = Infinity; + while (t1) { + if (t1._call) { + if (time > t1._time) time = t1._time; + t0 = t1, t1 = t1._next; + } else { + t2 = t1._next, t1._next = null; + t1 = t0 ? t0._next = t2 : taskHead = t2; + } + } + taskTail = t0; + sleep(time); +} + +function sleep(time) { + if (frame) return; // Soonest alarm already set, or will be. + if (timeout) timeout = clearTimeout(timeout); + var delay = time - clockNow; // Strictly less than if we recomputed clockNow. + if (delay > 24) { + if (time < Infinity) timeout = setTimeout(wake, time - clock.now() - clockSkew); + if (interval$1) interval$1 = clearInterval(interval$1); + } else { + if (!interval$1) clockLast = clock.now(), interval$1 = setInterval(poke, pokeDelay); + frame = 1, setFrame(wake); + } +} + +function linear$2(t) { + return +t; +} + +function quadIn(t) { + return t * t; +} + +function quadOut(t) { + return t * (2 - t); +} + +function quadInOut(t) { + return ((t *= 2) <= 1 ? t * t : --t * (2 - t) + 1) / 2; +} + +function cubicIn(t) { + return t * t * t; +} + +function cubicOut(t) { + return --t * t * t + 1; +} + +function cubicInOut(t) { + return ((t *= 2) <= 1 ? t * t * t : (t -= 2) * t * t + 2) / 2; +} + +var exponent = 3; + +var polyIn = (function custom(e) { + e = +e; + + function polyIn(t) { + return Math.pow(t, e); + } + + polyIn.exponent = custom; + + return polyIn; +})(exponent); + +var polyOut = (function custom(e) { + e = +e; + + function polyOut(t) { + return 1 - Math.pow(1 - t, e); + } + + polyOut.exponent = custom; + + return polyOut; +})(exponent); + +var polyInOut = (function custom(e) { + e = +e; + + function polyInOut(t) { + return ((t *= 2) <= 1 ? Math.pow(t, e) : 2 - Math.pow(2 - t, e)) / 2; + } + + polyInOut.exponent = custom; + + return polyInOut; +})(exponent); + +var pi = Math.PI, + halfPi = pi / 2; + +function sinIn(t) { + return (+t === 1) ? 1 : 1 - Math.cos(t * halfPi); +} + +function sinOut(t) { + return Math.sin(t * halfPi); +} + +function sinInOut(t) { + return (1 - Math.cos(pi * t)) / 2; +} + +// tpmt is two power minus ten times t scaled to [0,1] +function tpmt(x) { + return (Math.pow(2, -10 * x) - 0.0009765625) * 1.0009775171065494; +} + +function expIn(t) { + return tpmt(1 - +t); +} + +function expOut(t) { + return 1 - tpmt(t); +} + +function expInOut(t) { + return ((t *= 2) <= 1 ? tpmt(1 - t) : 2 - tpmt(t - 1)) / 2; +} + +function circleIn(t) { + return 1 - Math.sqrt(1 - t * t); +} + +function circleOut(t) { + return Math.sqrt(1 - --t * t); +} + +function circleInOut(t) { + return ((t *= 2) <= 1 ? 1 - Math.sqrt(1 - t * t) : Math.sqrt(1 - (t -= 2) * t) + 1) / 2; +} + +var b1 = 4 / 11, + b2 = 6 / 11, + b3 = 8 / 11, + b4 = 3 / 4, + b5 = 9 / 11, + b6 = 10 / 11, + b7 = 15 / 16, + b8 = 21 / 22, + b9 = 63 / 64, + b0 = 1 / b1 / b1; + +function bounceIn(t) { + return 1 - bounceOut(1 - t); +} + +function bounceOut(t) { + return (t = +t) < b1 ? b0 * t * t : t < b3 ? b0 * (t -= b2) * t + b4 : t < b6 ? b0 * (t -= b5) * t + b7 : b0 * (t -= b8) * t + b9; +} + +function bounceInOut(t) { + return ((t *= 2) <= 1 ? 1 - bounceOut(1 - t) : bounceOut(t - 1) + 1) / 2; +} + +var overshoot = 1.70158; + +var backIn = (function custom(s) { + s = +s; + + function backIn(t) { + return (t = +t) * t * (s * (t - 1) + t); + } + + backIn.overshoot = custom; + + return backIn; +})(overshoot); + +var backOut = (function custom(s) { + s = +s; + + function backOut(t) { + return --t * t * ((t + 1) * s + t) + 1; + } + + backOut.overshoot = custom; + + return backOut; +})(overshoot); + +var backInOut = (function custom(s) { + s = +s; + + function backInOut(t) { + return ((t *= 2) < 1 ? t * t * ((s + 1) * t - s) : (t -= 2) * t * ((s + 1) * t + s) + 2) / 2; + } + + backInOut.overshoot = custom; + + return backInOut; +})(overshoot); + +var tau = 2 * Math.PI, + amplitude = 1, + period = 0.3; + +var elasticIn = (function custom(a, p) { + var s = Math.asin(1 / (a = Math.max(1, a))) * (p /= tau); + + function elasticIn(t) { + return a * tpmt(-(--t)) * Math.sin((s - t) / p); + } + + elasticIn.amplitude = function(a) { return custom(a, p * tau); }; + elasticIn.period = function(p) { return custom(a, p); }; + + return elasticIn; +})(amplitude, period); + +var elasticOut = (function custom(a, p) { + var s = Math.asin(1 / (a = Math.max(1, a))) * (p /= tau); + + function elasticOut(t) { + return 1 - a * tpmt(t = +t) * Math.sin((t + s) / p); + } + + elasticOut.amplitude = function(a) { return custom(a, p * tau); }; + elasticOut.period = function(p) { return custom(a, p); }; + + return elasticOut; +})(amplitude, period); + +var elasticInOut = (function custom(a, p) { + var s = Math.asin(1 / (a = Math.max(1, a))) * (p /= tau); + + function elasticInOut(t) { + return ((t = t * 2 - 1) < 0 + ? a * tpmt(-t) * Math.sin((s - t) / p) + : 2 - a * tpmt(t) * Math.sin((s + t) / p)) / 2; + } + + elasticInOut.amplitude = function(a) { return custom(a, p * tau); }; + elasticInOut.period = function(p) { return custom(a, p); }; + + return elasticInOut; +})(amplitude, period); + +var d3Ease = /*#__PURE__*/Object.freeze({ + __proto__: null, + easeLinear: linear$2, + easeQuad: quadInOut, + easeQuadIn: quadIn, + easeQuadOut: quadOut, + easeQuadInOut: quadInOut, + easeCubic: cubicInOut, + easeCubicIn: cubicIn, + easeCubicOut: cubicOut, + easeCubicInOut: cubicInOut, + easePoly: polyInOut, + easePolyIn: polyIn, + easePolyOut: polyOut, + easePolyInOut: polyInOut, + easeSin: sinInOut, + easeSinIn: sinIn, + easeSinOut: sinOut, + easeSinInOut: sinInOut, + easeExp: expInOut, + easeExpIn: expIn, + easeExpOut: expOut, + easeExpInOut: expInOut, + easeCircle: circleInOut, + easeCircleIn: circleIn, + easeCircleOut: circleOut, + easeCircleInOut: circleInOut, + easeBounce: bounceOut, + easeBounceIn: bounceIn, + easeBounceOut: bounceOut, + easeBounceInOut: bounceInOut, + easeBack: backInOut, + easeBackIn: backIn, + easeBackOut: backOut, + easeBackInOut: backInOut, + easeElastic: elasticOut, + easeElasticIn: elasticIn, + easeElasticOut: elasticOut, + easeElasticInOut: elasticInOut +}); + +function define(constructor, factory, prototype) { + constructor.prototype = factory.prototype = prototype; + prototype.constructor = constructor; +} + +function extend(parent, definition) { + var prototype = Object.create(parent.prototype); + for (var key in definition) prototype[key] = definition[key]; + return prototype; +} + +function Color$2() {} + +var darker = 0.7; +var brighter = 1 / darker; + +var reI = "\\s*([+-]?\\d+)\\s*", + reN = "\\s*([+-]?\\d*\\.?\\d+(?:[eE][+-]?\\d+)?)\\s*", + reP = "\\s*([+-]?\\d*\\.?\\d+(?:[eE][+-]?\\d+)?)%\\s*", + reHex = /^#([0-9a-f]{3,8})$/, + reRgbInteger = new RegExp("^rgb\\(" + [reI, reI, reI] + "\\)$"), + reRgbPercent = new RegExp("^rgb\\(" + [reP, reP, reP] + "\\)$"), + reRgbaInteger = new RegExp("^rgba\\(" + [reI, reI, reI, reN] + "\\)$"), + reRgbaPercent = new RegExp("^rgba\\(" + [reP, reP, reP, reN] + "\\)$"), + reHslPercent = new RegExp("^hsl\\(" + [reN, reP, reP] + "\\)$"), + reHslaPercent = new RegExp("^hsla\\(" + [reN, reP, reP, reN] + "\\)$"); + +var named$2 = { + aliceblue: 0xf0f8ff, + antiquewhite: 0xfaebd7, + aqua: 0x00ffff, + aquamarine: 0x7fffd4, + azure: 0xf0ffff, + beige: 0xf5f5dc, + bisque: 0xffe4c4, + black: 0x000000, + blanchedalmond: 0xffebcd, + blue: 0x0000ff, + blueviolet: 0x8a2be2, + brown: 0xa52a2a, + burlywood: 0xdeb887, + cadetblue: 0x5f9ea0, + chartreuse: 0x7fff00, + chocolate: 0xd2691e, + coral: 0xff7f50, + cornflowerblue: 0x6495ed, + cornsilk: 0xfff8dc, + crimson: 0xdc143c, + cyan: 0x00ffff, + darkblue: 0x00008b, + darkcyan: 0x008b8b, + darkgoldenrod: 0xb8860b, + darkgray: 0xa9a9a9, + darkgreen: 0x006400, + darkgrey: 0xa9a9a9, + darkkhaki: 0xbdb76b, + darkmagenta: 0x8b008b, + darkolivegreen: 0x556b2f, + darkorange: 0xff8c00, + darkorchid: 0x9932cc, + darkred: 0x8b0000, + darksalmon: 0xe9967a, + darkseagreen: 0x8fbc8f, + darkslateblue: 0x483d8b, + darkslategray: 0x2f4f4f, + darkslategrey: 0x2f4f4f, + darkturquoise: 0x00ced1, + darkviolet: 0x9400d3, + deeppink: 0xff1493, + deepskyblue: 0x00bfff, + dimgray: 0x696969, + dimgrey: 0x696969, + dodgerblue: 0x1e90ff, + firebrick: 0xb22222, + floralwhite: 0xfffaf0, + forestgreen: 0x228b22, + fuchsia: 0xff00ff, + gainsboro: 0xdcdcdc, + ghostwhite: 0xf8f8ff, + gold: 0xffd700, + goldenrod: 0xdaa520, + gray: 0x808080, + green: 0x008000, + greenyellow: 0xadff2f, + grey: 0x808080, + honeydew: 0xf0fff0, + hotpink: 0xff69b4, + indianred: 0xcd5c5c, + indigo: 0x4b0082, + ivory: 0xfffff0, + khaki: 0xf0e68c, + lavender: 0xe6e6fa, + lavenderblush: 0xfff0f5, + lawngreen: 0x7cfc00, + lemonchiffon: 0xfffacd, + lightblue: 0xadd8e6, + lightcoral: 0xf08080, + lightcyan: 0xe0ffff, + lightgoldenrodyellow: 0xfafad2, + lightgray: 0xd3d3d3, + lightgreen: 0x90ee90, + lightgrey: 0xd3d3d3, + lightpink: 0xffb6c1, + lightsalmon: 0xffa07a, + lightseagreen: 0x20b2aa, + lightskyblue: 0x87cefa, + lightslategray: 0x778899, + lightslategrey: 0x778899, + lightsteelblue: 0xb0c4de, + lightyellow: 0xffffe0, + lime: 0x00ff00, + limegreen: 0x32cd32, + linen: 0xfaf0e6, + magenta: 0xff00ff, + maroon: 0x800000, + mediumaquamarine: 0x66cdaa, + mediumblue: 0x0000cd, + mediumorchid: 0xba55d3, + mediumpurple: 0x9370db, + mediumseagreen: 0x3cb371, + mediumslateblue: 0x7b68ee, + mediumspringgreen: 0x00fa9a, + mediumturquoise: 0x48d1cc, + mediumvioletred: 0xc71585, + midnightblue: 0x191970, + mintcream: 0xf5fffa, + mistyrose: 0xffe4e1, + moccasin: 0xffe4b5, + navajowhite: 0xffdead, + navy: 0x000080, + oldlace: 0xfdf5e6, + olive: 0x808000, + olivedrab: 0x6b8e23, + orange: 0xffa500, + orangered: 0xff4500, + orchid: 0xda70d6, + palegoldenrod: 0xeee8aa, + palegreen: 0x98fb98, + paleturquoise: 0xafeeee, + palevioletred: 0xdb7093, + papayawhip: 0xffefd5, + peachpuff: 0xffdab9, + peru: 0xcd853f, + pink: 0xffc0cb, + plum: 0xdda0dd, + powderblue: 0xb0e0e6, + purple: 0x800080, + rebeccapurple: 0x663399, + red: 0xff0000, + rosybrown: 0xbc8f8f, + royalblue: 0x4169e1, + saddlebrown: 0x8b4513, + salmon: 0xfa8072, + sandybrown: 0xf4a460, + seagreen: 0x2e8b57, + seashell: 0xfff5ee, + sienna: 0xa0522d, + silver: 0xc0c0c0, + skyblue: 0x87ceeb, + slateblue: 0x6a5acd, + slategray: 0x708090, + slategrey: 0x708090, + snow: 0xfffafa, + springgreen: 0x00ff7f, + steelblue: 0x4682b4, + tan: 0xd2b48c, + teal: 0x008080, + thistle: 0xd8bfd8, + tomato: 0xff6347, + turquoise: 0x40e0d0, + violet: 0xee82ee, + wheat: 0xf5deb3, + white: 0xffffff, + whitesmoke: 0xf5f5f5, + yellow: 0xffff00, + yellowgreen: 0x9acd32 +}; + +define(Color$2, color$2, { + copy: function(channels) { + return Object.assign(new this.constructor, this, channels); + }, + displayable: function() { + return this.rgb().displayable(); + }, + hex: color_formatHex, // Deprecated! Use color.formatHex. + formatHex: color_formatHex, + formatHsl: color_formatHsl, + formatRgb: color_formatRgb, + toString: color_formatRgb +}); + +function color_formatHex() { + return this.rgb().formatHex(); +} + +function color_formatHsl() { + return hslConvert(this).formatHsl(); +} + +function color_formatRgb() { + return this.rgb().formatRgb(); +} + +function color$2(format) { + var m, l; + format = (format + "").trim().toLowerCase(); + return (m = reHex.exec(format)) ? (l = m[1].length, m = parseInt(m[1], 16), l === 6 ? rgbn(m) // #ff0000 + : l === 3 ? new Rgb((m >> 8 & 0xf) | (m >> 4 & 0xf0), (m >> 4 & 0xf) | (m & 0xf0), ((m & 0xf) << 4) | (m & 0xf), 1) // #f00 + : l === 8 ? rgba(m >> 24 & 0xff, m >> 16 & 0xff, m >> 8 & 0xff, (m & 0xff) / 0xff) // #ff000000 + : l === 4 ? rgba((m >> 12 & 0xf) | (m >> 8 & 0xf0), (m >> 8 & 0xf) | (m >> 4 & 0xf0), (m >> 4 & 0xf) | (m & 0xf0), (((m & 0xf) << 4) | (m & 0xf)) / 0xff) // #f000 + : null) // invalid hex + : (m = reRgbInteger.exec(format)) ? new Rgb(m[1], m[2], m[3], 1) // rgb(255, 0, 0) + : (m = reRgbPercent.exec(format)) ? new Rgb(m[1] * 255 / 100, m[2] * 255 / 100, m[3] * 255 / 100, 1) // rgb(100%, 0%, 0%) + : (m = reRgbaInteger.exec(format)) ? rgba(m[1], m[2], m[3], m[4]) // rgba(255, 0, 0, 1) + : (m = reRgbaPercent.exec(format)) ? rgba(m[1] * 255 / 100, m[2] * 255 / 100, m[3] * 255 / 100, m[4]) // rgb(100%, 0%, 0%, 1) + : (m = reHslPercent.exec(format)) ? hsla(m[1], m[2] / 100, m[3] / 100, 1) // hsl(120, 50%, 50%) + : (m = reHslaPercent.exec(format)) ? hsla(m[1], m[2] / 100, m[3] / 100, m[4]) // hsla(120, 50%, 50%, 1) + : named$2.hasOwnProperty(format) ? rgbn(named$2[format]) // eslint-disable-line no-prototype-builtins + : format === "transparent" ? new Rgb(NaN, NaN, NaN, 0) + : null; +} + +function rgbn(n) { + return new Rgb(n >> 16 & 0xff, n >> 8 & 0xff, n & 0xff, 1); +} + +function rgba(r, g, b, a) { + if (a <= 0) r = g = b = NaN; + return new Rgb(r, g, b, a); +} + +function rgbConvert(o) { + if (!(o instanceof Color$2)) o = color$2(o); + if (!o) return new Rgb; + o = o.rgb(); + return new Rgb(o.r, o.g, o.b, o.opacity); +} + +function rgb$1(r, g, b, opacity) { + return arguments.length === 1 ? rgbConvert(r) : new Rgb(r, g, b, opacity == null ? 1 : opacity); +} + +function Rgb(r, g, b, opacity) { + this.r = +r; + this.g = +g; + this.b = +b; + this.opacity = +opacity; +} + +define(Rgb, rgb$1, extend(Color$2, { + brighter: function(k) { + k = k == null ? brighter : Math.pow(brighter, k); + return new Rgb(this.r * k, this.g * k, this.b * k, this.opacity); + }, + darker: function(k) { + k = k == null ? darker : Math.pow(darker, k); + return new Rgb(this.r * k, this.g * k, this.b * k, this.opacity); + }, + rgb: function() { + return this; + }, + displayable: function() { + return (-0.5 <= this.r && this.r < 255.5) + && (-0.5 <= this.g && this.g < 255.5) + && (-0.5 <= this.b && this.b < 255.5) + && (0 <= this.opacity && this.opacity <= 1); + }, + hex: rgb_formatHex, // Deprecated! Use color.formatHex. + formatHex: rgb_formatHex, + formatRgb: rgb_formatRgb, + toString: rgb_formatRgb +})); + +function rgb_formatHex() { + return "#" + hex(this.r) + hex(this.g) + hex(this.b); +} + +function rgb_formatRgb() { + var a = this.opacity; a = isNaN(a) ? 1 : Math.max(0, Math.min(1, a)); + return (a === 1 ? "rgb(" : "rgba(") + + Math.max(0, Math.min(255, Math.round(this.r) || 0)) + ", " + + Math.max(0, Math.min(255, Math.round(this.g) || 0)) + ", " + + Math.max(0, Math.min(255, Math.round(this.b) || 0)) + + (a === 1 ? ")" : ", " + a + ")"); +} + +function hex(value) { + value = Math.max(0, Math.min(255, Math.round(value) || 0)); + return (value < 16 ? "0" : "") + value.toString(16); +} + +function hsla(h, s, l, a) { + if (a <= 0) h = s = l = NaN; + else if (l <= 0 || l >= 1) h = s = NaN; + else if (s <= 0) h = NaN; + return new Hsl(h, s, l, a); +} + +function hslConvert(o) { + if (o instanceof Hsl) return new Hsl(o.h, o.s, o.l, o.opacity); + if (!(o instanceof Color$2)) o = color$2(o); + if (!o) return new Hsl; + if (o instanceof Hsl) return o; + o = o.rgb(); + var r = o.r / 255, + g = o.g / 255, + b = o.b / 255, + min = Math.min(r, g, b), + max = Math.max(r, g, b), + h = NaN, + s = max - min, + l = (max + min) / 2; + if (s) { + if (r === max) h = (g - b) / s + (g < b) * 6; + else if (g === max) h = (b - r) / s + 2; + else h = (r - g) / s + 4; + s /= l < 0.5 ? max + min : 2 - max - min; + h *= 60; + } else { + s = l > 0 && l < 1 ? 0 : h; + } + return new Hsl(h, s, l, o.opacity); +} + +function hsl(h, s, l, opacity) { + return arguments.length === 1 ? hslConvert(h) : new Hsl(h, s, l, opacity == null ? 1 : opacity); +} + +function Hsl(h, s, l, opacity) { + this.h = +h; + this.s = +s; + this.l = +l; + this.opacity = +opacity; +} + +define(Hsl, hsl, extend(Color$2, { + brighter: function(k) { + k = k == null ? brighter : Math.pow(brighter, k); + return new Hsl(this.h, this.s, this.l * k, this.opacity); + }, + darker: function(k) { + k = k == null ? darker : Math.pow(darker, k); + return new Hsl(this.h, this.s, this.l * k, this.opacity); + }, + rgb: function() { + var h = this.h % 360 + (this.h < 0) * 360, + s = isNaN(h) || isNaN(this.s) ? 0 : this.s, + l = this.l, + m2 = l + (l < 0.5 ? l : 1 - l) * s, + m1 = 2 * l - m2; + return new Rgb( + hsl2rgb(h >= 240 ? h - 240 : h + 120, m1, m2), + hsl2rgb(h, m1, m2), + hsl2rgb(h < 120 ? h + 240 : h - 120, m1, m2), + this.opacity + ); + }, + displayable: function() { + return (0 <= this.s && this.s <= 1 || isNaN(this.s)) + && (0 <= this.l && this.l <= 1) + && (0 <= this.opacity && this.opacity <= 1); + }, + formatHsl: function() { + var a = this.opacity; a = isNaN(a) ? 1 : Math.max(0, Math.min(1, a)); + return (a === 1 ? "hsl(" : "hsla(") + + (this.h || 0) + ", " + + (this.s || 0) * 100 + "%, " + + (this.l || 0) * 100 + "%" + + (a === 1 ? ")" : ", " + a + ")"); + } +})); + +/* From FvD 13.37, CSS Color Module Level 3 */ +function hsl2rgb(h, m1, m2) { + return (h < 60 ? m1 + (m2 - m1) * h / 60 + : h < 180 ? m2 + : h < 240 ? m1 + (m2 - m1) * (240 - h) / 60 + : m1) * 255; +} + +function constant$6(x) { + return function() { + return x; + }; +} + +function linear$1(a, d) { + return function(t) { + return a + t * d; + }; +} + +function exponential(a, b, y) { + return a = Math.pow(a, y), b = Math.pow(b, y) - a, y = 1 / y, function(t) { + return Math.pow(a + t * b, y); + }; +} + +function gamma(y) { + return (y = +y) === 1 ? nogamma : function(a, b) { + return b - a ? exponential(a, b, y) : constant$6(isNaN(a) ? b : a); + }; +} + +function nogamma(a, b) { + var d = b - a; + return d ? linear$1(a, d) : constant$6(isNaN(a) ? b : a); +} + +var rgb = (function rgbGamma(y) { + var color = gamma(y); + + function rgb(start, end) { + var r = color((start = rgb$1(start)).r, (end = rgb$1(end)).r), + g = color(start.g, end.g), + b = color(start.b, end.b), + opacity = nogamma(start.opacity, end.opacity); + return function(t) { + start.r = r(t); + start.g = g(t); + start.b = b(t); + start.opacity = opacity(t); + return start + ""; + }; + } + + rgb.gamma = rgbGamma; + + return rgb; +})(1); + +function numberArray(a, b) { + if (!b) b = []; + var n = a ? Math.min(b.length, a.length) : 0, + c = b.slice(), + i; + return function(t) { + for (i = 0; i < n; ++i) c[i] = a[i] * (1 - t) + b[i] * t; + return c; + }; +} + +function isNumberArray(x) { + return ArrayBuffer.isView(x) && !(x instanceof DataView); +} + +function interpolateArray(a, b) { + return (isNumberArray(b) ? numberArray : genericArray)(a, b); +} + +function genericArray(a, b) { + var nb = b ? b.length : 0, + na = a ? Math.min(nb, a.length) : 0, + x = new Array(na), + c = new Array(nb), + i; + + for (i = 0; i < na; ++i) x[i] = interpolate(a[i], b[i]); + for (; i < nb; ++i) c[i] = b[i]; + + return function(t) { + for (i = 0; i < na; ++i) c[i] = x[i](t); + return c; + }; +} + +function date(a, b) { + var d = new Date; + return a = +a, b = +b, function(t) { + return d.setTime(a * (1 - t) + b * t), d; + }; +} + +function number(a, b) { + return a = +a, b = +b, function(t) { + return a * (1 - t) + b * t; + }; +} + +function object$1(a, b) { + var i = {}, + c = {}, + k; + + if (a === null || typeof a !== "object") a = {}; + if (b === null || typeof b !== "object") b = {}; + + for (k in b) { + if (k in a) { + i[k] = interpolate(a[k], b[k]); + } else { + c[k] = b[k]; + } + } + + return function(t) { + for (k in i) c[k] = i[k](t); + return c; + }; +} + +var reA = /[-+]?(?:\d+\.?\d*|\.?\d+)(?:[eE][-+]?\d+)?/g, + reB = new RegExp(reA.source, "g"); + +function zero(b) { + return function() { + return b; + }; +} + +function one(b) { + return function(t) { + return b(t) + ""; + }; +} + +function string(a, b) { + var bi = reA.lastIndex = reB.lastIndex = 0, // scan index for next number in b + am, // current match in a + bm, // current match in b + bs, // string preceding current number in b, if any + i = -1, // index in s + s = [], // string constants and placeholders + q = []; // number interpolators + + // Coerce inputs to strings. + a = a + "", b = b + ""; + + // Interpolate pairs of numbers in a & b. + while ((am = reA.exec(a)) + && (bm = reB.exec(b))) { + if ((bs = bm.index) > bi) { // a string precedes the next number in b + bs = b.slice(bi, bs); + if (s[i]) s[i] += bs; // coalesce with previous string + else s[++i] = bs; + } + if ((am = am[0]) === (bm = bm[0])) { // numbers in a & b match + if (s[i]) s[i] += bm; // coalesce with previous string + else s[++i] = bm; + } else { // interpolate non-matching numbers + s[++i] = null; + q.push({i: i, x: number(am, bm)}); + } + bi = reB.lastIndex; + } + + // Add remains of b. + if (bi < b.length) { + bs = b.slice(bi); + if (s[i]) s[i] += bs; // coalesce with previous string + else s[++i] = bs; + } + + // Special optimization for only a single match. + // Otherwise, interpolate each of the numbers and rejoin the string. + return s.length < 2 ? (q[0] + ? one(q[0].x) + : zero(b)) + : (b = q.length, function(t) { + for (var i = 0, o; i < b; ++i) s[(o = q[i]).i] = o.x(t); + return s.join(""); + }); +} + +function interpolate(a, b) { + var t = typeof b, c; + return b == null || t === "boolean" ? constant$6(b) + : (t === "number" ? number + : t === "string" ? ((c = color$2(b)) ? (b = c, rgb) : string) + : b instanceof color$2 ? rgb + : b instanceof Date ? date + : isNumberArray(b) ? numberArray + : Array.isArray(b) ? genericArray + : typeof b.valueOf !== "function" && typeof b.toString !== "function" || isNaN(b) ? object$1 + : number)(a, b); +} + +var isColorProp$1 = function (prop) { return ['fill', 'stroke', 'fillStyle', 'strokeStyle'].includes(prop); }; +var isGradientColor$2 = function (val) { return /^[r,R,L,l]{1}[\s]*\(/.test(val); }; + +var IDENTITY_MATRIX$1 = [1, 0, 0, 0, 1, 0, 0, 0, 1]; +/** + * 使用 ratio 进行插值计算来更新属性 + * @param {IElement} shape 元素 + * @param {Animation} animation 动画 + * @param {number} ratio 比例 + * @return {boolean} 动画是否执行完成 + */ +function _update$1(shape, animation, ratio) { + var cProps = {}; // 此刻属性 + var fromAttrs = animation.fromAttrs, toAttrs = animation.toAttrs; + if (shape.destroyed) { + return; + } + var interf; // 差值函数 + for (var k in toAttrs) { + if (!isEqual$2(fromAttrs[k], toAttrs[k])) { + if (k === 'path') { + var toPath = toAttrs[k]; + var fromPath = fromAttrs[k]; + if (toPath.length > fromPath.length) { + toPath = parsePathString$2(toAttrs[k]); // 终点状态 + fromPath = parsePathString$2(fromAttrs[k]); // 起始状态 + fromPath = fillPathByDiff$1(fromPath, toPath); + fromPath = formatPath$1(fromPath, toPath); + animation.fromAttrs.path = fromPath; + animation.toAttrs.path = toPath; + } + else if (!animation.pathFormatted) { + toPath = parsePathString$2(toAttrs[k]); + fromPath = parsePathString$2(fromAttrs[k]); + fromPath = formatPath$1(fromPath, toPath); + animation.fromAttrs.path = fromPath; + animation.toAttrs.path = toPath; + animation.pathFormatted = true; + } + cProps[k] = []; + for (var i = 0; i < toPath.length; i++) { + var toPathPoint = toPath[i]; + var fromPathPoint = fromPath[i]; + var cPathPoint = []; + for (var j = 0; j < toPathPoint.length; j++) { + if (isNumber$4(toPathPoint[j]) && fromPathPoint && isNumber$4(fromPathPoint[j])) { + interf = interpolate(fromPathPoint[j], toPathPoint[j]); + cPathPoint.push(interf(ratio)); + } + else { + cPathPoint.push(toPathPoint[j]); + } + } + cProps[k].push(cPathPoint); + } + } + else if (k === 'matrix') { + /* + 对矩阵进行插值时，需要保证矩阵不为空，为空则使用单位矩阵 + TODO: 二维和三维场景下单位矩阵不同，之后 WebGL 版需要做进一步处理 + */ + var matrixFn = interpolateArray(fromAttrs[k] || IDENTITY_MATRIX$1, toAttrs[k] || IDENTITY_MATRIX$1); + var currentMatrix = matrixFn(ratio); + cProps[k] = currentMatrix; + } + else if (isColorProp$1(k) && isGradientColor$2(toAttrs[k])) { + cProps[k] = toAttrs[k]; + } + else if (!isFunction$6(toAttrs[k])) { + // 非函数类型的值才能做插值 + interf = interpolate(fromAttrs[k], toAttrs[k]); + cProps[k] = interf(ratio); + } + } + } + shape.attr(cProps); +} +/** + * 根据自定义帧动画函数 onFrame 来更新属性 + * @param {IElement} shape 元素 + * @param {Animation} animation 动画 + * @param {number} elapsed 动画执行时间(毫秒) + * @return {boolean} 动画是否执行完成 + */ +function update$1(shape, animation, elapsed) { + var startTime = animation.startTime, delay = animation.delay; + // 如果还没有开始执行或暂停，先不更新 + if (elapsed < startTime + delay || animation._paused) { + return false; + } + var ratio; + var duration = animation.duration; + var easing = animation.easing; + // 已执行时间 + elapsed = elapsed - startTime - animation.delay; + if (animation.repeat) { + // 如果动画重复执行，则 elapsed > duration，计算 ratio 时需取模 + ratio = (elapsed % duration) / duration; + ratio = d3Ease[easing](ratio); + } + else { + ratio = elapsed / duration; + if (ratio < 1) { + // 动画未执行完 + ratio = d3Ease[easing](ratio); + } + else { + // 动画已执行完 + if (animation.onFrame) { + shape.attr(animation.onFrame(1)); + } + else { + shape.attr(animation.toAttrs); + } + return true; + } + } + if (animation.onFrame) { + var attrs = animation.onFrame(ratio); + shape.attr(attrs); + } + else { + _update$1(shape, animation, ratio); + } + return false; +} +var Timeline$1 = /** @class */ (function () { + /** + * 时间轴构造函数，依赖于画布 + * @param {} + */ + function Timeline(canvas) { + /** + * 执行动画的元素列表 + * @type {IElement[]} + */ + this.animators = []; + /** + * 当前时间 + * @type {number} + */ + this.current = 0; + /** + * 定时器 + * @type {d3Timer.Timer} + */ + this.timer = null; + this.canvas = canvas; + } + /** + * 初始化定时器 + */ + Timeline.prototype.initTimer = function () { + var _this = this; + var isFinished = false; + var shape; + var animations; + var animation; + this.timer = timer$1(function (elapsed) { + _this.current = elapsed; + if (_this.animators.length > 0) { + for (var i = _this.animators.length - 1; i >= 0; i--) { + shape = _this.animators[i]; + if (shape.destroyed) { + // 如果已经被销毁，直接移出队列 + _this.removeAnimator(i); + continue; + } + if (!shape.isAnimatePaused()) { + animations = shape.get('animations'); + for (var j = animations.length - 1; j >= 0; j--) { + animation = animations[j]; + isFinished = update$1(shape, animation, elapsed); + if (isFinished) { + animations.splice(j, 1); + isFinished = false; + if (animation.callback) { + animation.callback(); + } + } + } + } + if (animations.length === 0) { + _this.removeAnimator(i); + } + } + var autoDraw = _this.canvas.get('autoDraw'); + // 非自动渲染模式下，手动调用 canvas.draw() 重新渲染 + if (!autoDraw) { + _this.canvas.draw(); + } + } + }); + }; + /** + * 增加动画元素 + */ + Timeline.prototype.addAnimator = function (shape) { + this.animators.push(shape); + }; + /** + * 移除动画元素 + */ + Timeline.prototype.removeAnimator = function (index) { + this.animators.splice(index, 1); + }; + /** + * 是否有动画在执行 + */ + Timeline.prototype.isAnimating = function () { + return !!this.animators.length; + }; + /** + * 停止定时器 + */ + Timeline.prototype.stop = function () { + if (this.timer) { + this.timer.stop(); + } + }; + /** + * 停止时间轴上所有元素的动画，并置空动画元素列表 + * @param {boolean} toEnd 是否到动画的最终状态，用来透传给动画元素的 stopAnimate 方法 + */ + Timeline.prototype.stopAllAnimations = function (toEnd) { + if (toEnd === void 0) { toEnd = true; } + this.animators.forEach(function (animator) { + animator.stopAnimate(toEnd); + }); + this.animators = []; + this.canvas.draw(); + }; + /** + * 获取当前时间 + */ + Timeline.prototype.getTime = function () { + return this.current; + }; + return Timeline; +}()); + +/** + * @fileoverview 事件处理器 + * @author dxq613@gmail.com + */ +var CLICK_OFFSET$1 = 40; +var LEFT_BTN_CODE$1 = 0; +var EVENTS$3 = [ + 'mousedown', + 'mouseup', + 'dblclick', + 'mouseout', + 'mouseover', + 'mousemove', + 'mouseleave', + 'mouseenter', + 'touchstart', + 'touchmove', + 'touchend', + 'dragenter', + 'dragover', + 'dragleave', + 'drop', + 'contextmenu', + 'mousewheel', +]; +// 触发目标事件，目标只能是 shape 或 canvas +function emitTargetEvent$1(target, type, eventObj) { + eventObj.name = type; + eventObj.target = target; + eventObj.currentTarget = target; + eventObj.delegateTarget = target; + target.emit(type, eventObj); +} +// 事件冒泡, enter 和 leave 需要对 fromShape 和 toShape 进行判同 +function bubbleEvent$1(container, type, eventObj) { + if (eventObj.bubbles) { + var relativeShape = void 0; + var isOverEvent = false; + if (type === 'mouseenter') { + relativeShape = eventObj.fromShape; + isOverEvent = true; + } + else if (type === 'mouseleave') { + isOverEvent = true; + relativeShape = eventObj.toShape; + } + // canvas 上的 mouseenter， mouseleave 事件，仅当进入或者移出 canvas 时触发 + if (container.isCanvas() && isOverEvent) { + return; + } + // 如果相关图形同当前图形在同一个容器内，不触发事件 + if (relativeShape && isParent$1(container, relativeShape)) { + // 阻止继续向上冒泡 + eventObj.bubbles = false; + return; + } + // 事件名称可能在委托过程中被修改，因此事件冒泡时需要重新设置事件名称 + eventObj.name = type; + eventObj.currentTarget = container; + eventObj.delegateTarget = container; + container.emit(type, eventObj); + } +} +var EventController$3 = /** @class */ (function () { + function EventController(cfg) { + var _this = this; + // 正在被拖拽的图形 + this.draggingShape = null; + this.dragging = false; + // 当前鼠标/touch所在位置的图形 + this.currentShape = null; + this.mousedownShape = null; + this.mousedownPoint = null; + // 统一处理所有的回调 + this._eventCallback = function (ev) { + var type = ev.type; + _this._triggerEvent(type, ev); + }; + // 在 document 处理拖拽到画布外的事件，处理从图形上移除画布未被捕捉的问题 + this._onDocumentMove = function (ev) { + var canvas = _this.canvas; + var el = canvas.get('el'); + if (el !== ev.target) { + // 不在 canvas 上移动 + if (_this.dragging || _this.currentShape) { + var pointInfo = _this._getPointInfo(ev); + // 还在拖拽过程中 + if (_this.dragging) { + _this._emitEvent('drag', ev, pointInfo, _this.draggingShape); + } + // 说明从某个图形直接移动到了画布外面， + // 修复了 mouseleave 的 bug 后不再出现这种情况 + // if (this.currentShape) { + // this._emitEvent('mouseleave', ev, pointInfo, this.currentShape, this.currentShape, null); + // this.currentShape = null; + // } + } + } + }; + // 在 document 上处理拖拽到外面，释放鼠标时触发 dragend + this._onDocumentMouseUp = function (ev) { + var canvas = _this.canvas; + var el = canvas.get('el'); + if (el !== ev.target) { + // 不在 canvas 上移动 + if (_this.dragging) { + var pointInfo = _this._getPointInfo(ev); + if (_this.draggingShape) { + // 如果存在拖拽的图形，则也触发 drop 事件 + _this._emitEvent('drop', ev, pointInfo, null); + } + _this._emitEvent('dragend', ev, pointInfo, _this.draggingShape); + _this._afterDrag(_this.draggingShape, pointInfo, ev); + } + } + }; + this.canvas = cfg.canvas; + } + EventController.prototype.init = function () { + this._bindEvents(); + }; + // 注册事件 + EventController.prototype._bindEvents = function () { + var _this = this; + var el = this.canvas.get('el'); + each$2(EVENTS$3, function (eventName) { + el.addEventListener(eventName, _this._eventCallback); + }); + if (document) { + // 处理移动到外面没有触发 shape mouse leave 的事件 + // 处理拖拽到外部的问题 + document.addEventListener('mousemove', this._onDocumentMove); + // 处理拖拽过程中在外部释放鼠标的问题 + document.addEventListener('mouseup', this._onDocumentMouseUp); + } + }; + // 清理事件 + EventController.prototype._clearEvents = function () { + var _this = this; + var el = this.canvas.get('el'); + each$2(EVENTS$3, function (eventName) { + el.removeEventListener(eventName, _this._eventCallback); + }); + if (document) { + document.removeEventListener('mousemove', this._onDocumentMove); + document.removeEventListener('mouseup', this._onDocumentMouseUp); + } + }; + EventController.prototype._getEventObj = function (type, event, point, target, fromShape, toShape) { + var eventObj = new GraphEvent$1(type, event); + eventObj.fromShape = fromShape; + eventObj.toShape = toShape; + eventObj.x = point.x; + eventObj.y = point.y; + eventObj.clientX = point.clientX; + eventObj.clientY = point.clientY; + eventObj.propagationPath.push(target); + // 事件的x,y应该是基于画布左上角的，与canvas的matrix无关 + return eventObj; + }; + // 根据点获取图形，提取成独立方法，便于后续优化 + EventController.prototype._getShape = function (point, ev) { + return this.canvas.getShape(point.x, point.y, ev); + }; + // 获取事件的当前点的信息 + EventController.prototype._getPointInfo = function (ev) { + var canvas = this.canvas; + var clientPoint = canvas.getClientByEvent(ev); + var point = canvas.getPointByEvent(ev); + return { + x: point.x, + y: point.y, + clientX: clientPoint.x, + clientY: clientPoint.y, + }; + }; + // 触发事件 + EventController.prototype._triggerEvent = function (type, ev) { + var pointInfo = this._getPointInfo(ev); + // 每次都获取图形有一定成本，后期可以考虑进行缓存策略 + var shape = this._getShape(pointInfo, ev); + var method = this["_on" + type]; + var leaveCanvas = false; + if (method) { + method.call(this, pointInfo, shape, ev); + } + else { + var preShape = this.currentShape; + // 如果进入、移出画布时存在图形，则要分别触发事件 + if (type === 'mouseenter' || type === 'dragenter' || type === 'mouseover') { + this._emitEvent(type, ev, pointInfo, null, null, shape); // 先进入画布 + if (shape) { + this._emitEvent(type, ev, pointInfo, shape, null, shape); // 再触发图形的事件 + } + if (type === 'mouseenter' && this.draggingShape) { + // 如果正在拖拽图形, 则触发 dragleave + this._emitEvent('dragenter', ev, pointInfo, null); + } + } + else if (type === 'mouseleave' || type === 'dragleave' || type === 'mouseout') { + leaveCanvas = true; + if (preShape) { + this._emitEvent(type, ev, pointInfo, preShape, preShape, null); // 先触发图形的事件 + } + this._emitEvent(type, ev, pointInfo, null, preShape, null); // 再触发离开画布事件 + if (type === 'mouseleave' && this.draggingShape) { + this._emitEvent('dragleave', ev, pointInfo, null); + } + } + else { + this._emitEvent(type, ev, pointInfo, shape, null, null); // 一般事件中不需要考虑 from, to + } + } + if (!leaveCanvas) { + this.currentShape = shape; + } + // 当鼠标从画布移动到 shape 或者从 preShape 移动到 shape 时，应用 shape 上的鼠标样式 + if (shape && !shape.get('destroyed')) { + var canvas = this.canvas; + var el = canvas.get('el'); + el.style.cursor = shape.attr('cursor') || canvas.get('cursor'); + } + }; + // 记录下点击的位置、图形，便于拖拽事件、click 事件的判定 + EventController.prototype._onmousedown = function (pointInfo, shape, event) { + // 只有鼠标左键的 mousedown 事件才会设置 mousedownShape 等属性，避免鼠标右键的 mousedown 事件引起其他事件发生 + if (event.button === LEFT_BTN_CODE$1) { + this.mousedownShape = shape; + this.mousedownPoint = pointInfo; + this.mousedownTimeStamp = event.timeStamp; + } + this._emitEvent('mousedown', event, pointInfo, shape, null, null); // mousedown 不考虑fromShape, toShape + }; + // mouseleave 和 mouseenter 都是成对存在的 + // mouseenter 和 mouseover 同时触发 + EventController.prototype._emitMouseoverEvents = function (event, pointInfo, fromShape, toShape) { + var el = this.canvas.get('el'); + if (fromShape !== toShape) { + if (fromShape) { + this._emitEvent('mouseout', event, pointInfo, fromShape, fromShape, toShape); + this._emitEvent('mouseleave', event, pointInfo, fromShape, fromShape, toShape); + // 当鼠标从 fromShape 移动到画布上时，重置鼠标样式 + if (!toShape || toShape.get('destroyed')) { + el.style.cursor = this.canvas.get('cursor'); + } + } + if (toShape) { + this._emitEvent('mouseover', event, pointInfo, toShape, fromShape, toShape); + this._emitEvent('mouseenter', event, pointInfo, toShape, fromShape, toShape); + } + } + }; + // dragover 不等同于 mouseover，而等同于 mousemove + EventController.prototype._emitDragoverEvents = function (event, pointInfo, fromShape, toShape, isCanvasEmit) { + if (toShape) { + if (toShape !== fromShape) { + if (fromShape) { + this._emitEvent('dragleave', event, pointInfo, fromShape, fromShape, toShape); + } + this._emitEvent('dragenter', event, pointInfo, toShape, fromShape, toShape); + } + if (!isCanvasEmit) { + this._emitEvent('dragover', event, pointInfo, toShape); + } + } + else if (fromShape) { + // TODO: 此处判断有问题，当 drag 图形时，也会触发一次 dragleave 事件，因为此时 toShape 为 null，这不是所期望的 + // 经过空白区域 + this._emitEvent('dragleave', event, pointInfo, fromShape, fromShape, toShape); + } + if (isCanvasEmit) { + this._emitEvent('dragover', event, pointInfo, toShape); + } + }; + // drag 完成后，需要做一些清理工作 + EventController.prototype._afterDrag = function (draggingShape, pointInfo, event) { + if (draggingShape) { + draggingShape.set('capture', true); // 恢复可以拾取 + this.draggingShape = null; + } + this.dragging = false; + // drag 完成后，有可能 draggingShape 已经移动到了当前位置，所以不能直接取当前图形 + var shape = this._getShape(pointInfo, event); + // 拖拽完成后，进行 enter，leave 的判定 + if (shape !== draggingShape) { + this._emitMouseoverEvents(event, pointInfo, draggingShape, shape); + } + this.currentShape = shape; // 更新当前 shape，如果不处理当前图形的 mouseleave 事件可能会出问题 + }; + // 按键抬起时，会终止拖拽、触发点击 + EventController.prototype._onmouseup = function (pointInfo, shape, event) { + // eevent.button === 0 表示鼠标左键事件，此处加上判断主要是为了避免右键鼠标会触发 mouseup 和 click 事件 + // ref: https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/button + if (event.button === LEFT_BTN_CODE$1) { + var draggingShape = this.draggingShape; + if (this.dragging) { + // 存在可以拖拽的图形，同时拖拽到其他图形上时触发 drag 事件 + if (draggingShape) { + this._emitEvent('drop', event, pointInfo, shape); + } + this._emitEvent('dragend', event, pointInfo, draggingShape); + this._afterDrag(draggingShape, pointInfo, event); + } + else { + this._emitEvent('mouseup', event, pointInfo, shape); // 先触发 mouseup 再触发 click + if (shape === this.mousedownShape) { + this._emitEvent('click', event, pointInfo, shape); + } + this.mousedownShape = null; + this.mousedownPoint = null; + } + } + }; + // 当触发浏览器的 dragover 事件时，不会再触发 mousemove ，所以这时候的 dragenter, dragleave 事件需要重新处理 + EventController.prototype._ondragover = function (pointInfo, shape, event) { + event.preventDefault(); // 如果不对 dragover 进行 preventDefault，则不会在 canvas 上触发 drop 事件 + var preShape = this.currentShape; + this._emitDragoverEvents(event, pointInfo, preShape, shape, true); + }; + // 大量的图形事件，都通过 mousemove 模拟 + EventController.prototype._onmousemove = function (pointInfo, shape, event) { + var canvas = this.canvas; + var preShape = this.currentShape; + var draggingShape = this.draggingShape; + // 正在拖拽时 + if (this.dragging) { + // 正在拖拽中 + if (draggingShape) { + // 如果拖拽了 shape 会触发 dragenter, dragleave, dragover 和 drag 事件 + this._emitDragoverEvents(event, pointInfo, preShape, shape, false); + } + // 如果存在 draggingShape 则会在 draggingShape 上触发 drag 事件，冒泡到 canvas 上 + // 否则在 canvas 上触发 drag 事件 + this._emitEvent('drag', event, pointInfo, draggingShape); + } + else { + var mousedownPoint = this.mousedownPoint; + if (mousedownPoint) { + // 当鼠标点击下去，同时移动时，进行 drag 判定 + var mousedownShape = this.mousedownShape; + var now = event.timeStamp; + var timeWindow = now - this.mousedownTimeStamp; + var dx = mousedownPoint.clientX - pointInfo.clientX; + var dy = mousedownPoint.clientY - pointInfo.clientY; + var dist = dx * dx + dy * dy; + if (timeWindow > 120 || dist > CLICK_OFFSET$1) { + if (mousedownShape && mousedownShape.get('draggable')) { + // 设置了 draggable 的 shape 才能触发 drag 相关的事件 + draggingShape = this.mousedownShape; // 拖动鼠标点下时的 shape + draggingShape.set('capture', false); // 禁止继续拾取，否则无法进行 dragover,dragenter,dragleave,drop的判定 + this.draggingShape = draggingShape; + this.dragging = true; + this._emitEvent('dragstart', event, pointInfo, draggingShape); + // 清理按下鼠标时缓存的值 + this.mousedownShape = null; + this.mousedownPoint = null; + } + else if (!mousedownShape && canvas.get('draggable')) { + // 设置了 draggable 的 canvas 才能触发 drag 相关的事件 + this.dragging = true; + this._emitEvent('dragstart', event, pointInfo, null); + // 清理按下鼠标时缓存的值 + this.mousedownShape = null; + this.mousedownPoint = null; + } + else { + this._emitMouseoverEvents(event, pointInfo, preShape, shape); + this._emitEvent('mousemove', event, pointInfo, shape); + } + } + else { + this._emitMouseoverEvents(event, pointInfo, preShape, shape); + this._emitEvent('mousemove', event, pointInfo, shape); + } + } + else { + // 没有按键按下时，则直接触发 mouse over 相关的各种事件 + this._emitMouseoverEvents(event, pointInfo, preShape, shape); + // 始终触发移动 + this._emitEvent('mousemove', event, pointInfo, shape); + } + } + }; + // 触发事件 + EventController.prototype._emitEvent = function (type, event, pointInfo, shape, fromShape, toShape) { + var eventObj = this._getEventObj(type, event, pointInfo, shape, fromShape, toShape); + // 存在 shape 触发，则进行冒泡处理 + if (shape) { + eventObj.shape = shape; + // 触发 shape 上的事件 + emitTargetEvent$1(shape, type, eventObj); + var parent_1 = shape.getParent(); + // 执行冒泡 + while (parent_1) { + // 委托事件要先触发 + parent_1.emitDelegation(type, eventObj); + // 事件冒泡停止，不能妨碍委托事件 + if (!eventObj.propagationStopped) { + bubbleEvent$1(parent_1, type, eventObj); + } + eventObj.propagationPath.push(parent_1); + parent_1 = parent_1.getParent(); + } + } + else { + // 如果没有 shape 直接在 canvas 上触发 + var canvas = this.canvas; + // 直接触发 canvas 上的事件 + emitTargetEvent$1(canvas, type, eventObj); + } + }; + EventController.prototype.destroy = function () { + // 清理事件 + this._clearEvents(); + // 清理缓存的对象 + this.canvas = null; + this.currentShape = null; + this.draggingShape = null; + this.mousedownPoint = null; + this.mousedownShape = null; + this.mousedownTimeStamp = null; + }; + return EventController; +}()); + +var PX_SUFFIX$1 = 'px'; +var browser$1 = detect(); +var isFirefox$1 = browser$1 && browser$1.name === 'firefox'; +var Canvas$2 = /** @class */ (function (_super) { + __extends$e(Canvas, _super); + function Canvas(cfg) { + var _this = _super.call(this, cfg) || this; + _this.initContainer(); + _this.initDom(); + _this.initEvents(); + _this.initTimeline(); + return _this; + } + Canvas.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + // set default cursor style for canvas + cfg['cursor'] = 'default'; + // CSS transform 目前尚未经过长时间验证，为了避免影响上层业务，默认关闭，上层按需开启 + cfg['supportCSSTransform'] = false; + return cfg; + }; + /** + * @protected + * 初始化容器 + */ + Canvas.prototype.initContainer = function () { + var container = this.get('container'); + if (isString$3(container)) { + container = document.getElementById(container); + this.set('container', container); + } + }; + /** + * @protected + * 初始化 DOM + */ + Canvas.prototype.initDom = function () { + var el = this.createDom(); + this.set('el', el); + // 附加到容器 + var container = this.get('container'); + container.appendChild(el); + // 设置初始宽度 + this.setDOMSize(this.get('width'), this.get('height')); + }; + /** + * @protected + * 初始化绑定的事件 + */ + Canvas.prototype.initEvents = function () { + var eventController = new EventController$3({ + canvas: this, + }); + eventController.init(); + this.set('eventController', eventController); + }; + /** + * @protected + * 初始化时间轴 + */ + Canvas.prototype.initTimeline = function () { + var timeline = new Timeline$1(this); + this.set('timeline', timeline); + }; + /** + * @protected + * 修改画布对应的 DOM 的大小 + * @param {number} width 宽度 + * @param {number} height 高度 + */ + Canvas.prototype.setDOMSize = function (width, height) { + var el = this.get('el'); + if (isBrowser$1) { + el.style.width = width + PX_SUFFIX$1; + el.style.height = height + PX_SUFFIX$1; + } + }; + // 实现接口 + Canvas.prototype.changeSize = function (width, height) { + this.setDOMSize(width, height); + this.set('width', width); + this.set('height', height); + this.onCanvasChange('changeSize'); + }; + /** + * 获取当前的渲染引擎 + * @return {Renderer} 返回当前的渲染引擎 + */ + Canvas.prototype.getRenderer = function () { + return this.get('renderer'); + }; + /** + * 获取画布的 cursor 样式 + * @return {Cursor} + */ + Canvas.prototype.getCursor = function () { + return this.get('cursor'); + }; + /** + * 设置画布的 cursor 样式 + * @param {Cursor} cursor cursor 样式 + */ + Canvas.prototype.setCursor = function (cursor) { + this.set('cursor', cursor); + var el = this.get('el'); + if (isBrowser$1 && el) { + // 直接设置样式，不等待鼠标移动时再设置 + el.style.cursor = cursor; + } + }; + // 实现接口 + Canvas.prototype.getPointByEvent = function (ev) { + var supportCSSTransform = this.get('supportCSSTransform'); + if (supportCSSTransform) { + // For Firefox <= 38 + if (isFirefox$1 && !isNil(ev.layerX) && ev.layerX !== ev.offsetX) { + return { + x: ev.layerX, + y: ev.layerY, + }; + } + if (!isNil(ev.offsetX)) { + // For IE6+, Firefox >= 39, Chrome, Safari, Opera + return { + x: ev.offsetX, + y: ev.offsetY, + }; + } + } + // should calculate by self for other cases, like Safari in ios + // TODO: support CSS transform + var _a = this.getClientByEvent(ev), clientX = _a.x, clientY = _a.y; + return this.getPointByClient(clientX, clientY); + }; + // 获取 touch 事件的 clientX 和 clientY 需要单独处理 + Canvas.prototype.getClientByEvent = function (ev) { + var clientInfo = ev; + if (ev.touches) { + if (ev.type === 'touchend') { + clientInfo = ev.changedTouches[0]; + } + else { + clientInfo = ev.touches[0]; + } + } + return { + x: clientInfo.clientX, + y: clientInfo.clientY, + }; + }; + // 实现接口 + Canvas.prototype.getPointByClient = function (clientX, clientY) { + var el = this.get('el'); + var bbox = el.getBoundingClientRect(); + return { + x: clientX - bbox.left, + y: clientY - bbox.top, + }; + }; + // 实现接口 + Canvas.prototype.getClientByPoint = function (x, y) { + var el = this.get('el'); + var bbox = el.getBoundingClientRect(); + return { + x: x + bbox.left, + y: y + bbox.top, + }; + }; + // 实现接口 + Canvas.prototype.draw = function () { }; + /** + * @protected + * 销毁 DOM 容器 + */ + Canvas.prototype.removeDom = function () { + var el = this.get('el'); + el.parentNode.removeChild(el); + }; + /** + * @protected + * 清理所有的事件 + */ + Canvas.prototype.clearEvents = function () { + var eventController = this.get('eventController'); + eventController.destroy(); + }; + Canvas.prototype.isCanvas = function () { + return true; + }; + Canvas.prototype.getParent = function () { + return null; + }; + Canvas.prototype.destroy = function () { + var timeline = this.get('timeline'); + if (this.get('destroyed')) { + return; + } + this.clear(); + // 同初始化时相反顺序调用 + if (timeline) { + // 画布销毁时自动停止动画 + timeline.stop(); + } + this.clearEvents(); + this.removeDom(); + _super.prototype.destroy.call(this); + }; + return Canvas; +}(Container$2)); + +var AbstractGroup = /** @class */ (function (_super) { + __extends$e(AbstractGroup, _super); + function AbstractGroup() { + return _super !== null && _super.apply(this, arguments) || this; + } + AbstractGroup.prototype.isGroup = function () { + return true; + }; + AbstractGroup.prototype.isEntityGroup = function () { + return false; + }; + AbstractGroup.prototype.clone = function () { + var clone = _super.prototype.clone.call(this); + // 获取构造函数 + var children = this.getChildren(); + for (var i = 0; i < children.length; i++) { + var child = children[i]; + clone.add(child.clone()); + } + return clone; + }; + return AbstractGroup; +}(Container$2)); + +var AbstractShape = /** @class */ (function (_super) { + __extends$e(AbstractShape, _super); + function AbstractShape(cfg) { + return _super.call(this, cfg) || this; + } + // 是否在包围盒内 + AbstractShape.prototype._isInBBox = function (refX, refY) { + var bbox = this.getBBox(); + return bbox.minX <= refX && bbox.maxX >= refX && bbox.minY <= refY && bbox.maxY >= refY; + }; + /** + * 属性更改后需要做的事情 + * @protected + * @param {ShapeAttrs} targetAttrs 渲染的图像属性 + */ + AbstractShape.prototype.afterAttrsChange = function (targetAttrs) { + _super.prototype.afterAttrsChange.call(this, targetAttrs); + this.clearCacheBBox(); + }; + // 计算包围盒时，需要缓存，这是一个高频的操作 + AbstractShape.prototype.getBBox = function () { + var bbox = this.cfg.bbox; + if (!bbox) { + bbox = this.calculateBBox(); + this.set('bbox', bbox); + } + return bbox; + }; + // 计算相对于画布的包围盒 + AbstractShape.prototype.getCanvasBBox = function () { + var canvasBBox = this.cfg.canvasBBox; + if (!canvasBBox) { + canvasBBox = this.calculateCanvasBBox(); + this.set('canvasBBox', canvasBBox); + } + return canvasBBox; + }; + AbstractShape.prototype.applyMatrix = function (matrix) { + _super.prototype.applyMatrix.call(this, matrix); + // 清理掉缓存的包围盒 + this.set('canvasBBox', null); + }; + /** + * 计算相对于画布的包围盒，默认等同于 bbox + * @return {BBox} 包围盒 + */ + AbstractShape.prototype.calculateCanvasBBox = function () { + var bbox = this.getBBox(); + var totalMatrix = this.getTotalMatrix(); + var minX = bbox.minX, minY = bbox.minY, maxX = bbox.maxX, maxY = bbox.maxY; + if (totalMatrix) { + var topLeft = multiplyVec2$2(totalMatrix, [bbox.minX, bbox.minY]); + var topRight = multiplyVec2$2(totalMatrix, [bbox.maxX, bbox.minY]); + var bottomLeft = multiplyVec2$2(totalMatrix, [bbox.minX, bbox.maxY]); + var bottomRight = multiplyVec2$2(totalMatrix, [bbox.maxX, bbox.maxY]); + minX = Math.min(topLeft[0], topRight[0], bottomLeft[0], bottomRight[0]); + maxX = Math.max(topLeft[0], topRight[0], bottomLeft[0], bottomRight[0]); + minY = Math.min(topLeft[1], topRight[1], bottomLeft[1], bottomRight[1]); + maxY = Math.max(topLeft[1], topRight[1], bottomLeft[1], bottomRight[1]); + } + var attrs = this.attrs; + // 如果存在 shadow 则计算 shadow + if (attrs.shadowColor) { + var _a = attrs.shadowBlur, shadowBlur = _a === void 0 ? 0 : _a, _b = attrs.shadowOffsetX, shadowOffsetX = _b === void 0 ? 0 : _b, _c = attrs.shadowOffsetY, shadowOffsetY = _c === void 0 ? 0 : _c; + var shadowLeft = minX - shadowBlur + shadowOffsetX; + var shadowRight = maxX + shadowBlur + shadowOffsetX; + var shadowTop = minY - shadowBlur + shadowOffsetY; + var shadowBottom = maxY + shadowBlur + shadowOffsetY; + minX = Math.min(minX, shadowLeft); + maxX = Math.max(maxX, shadowRight); + minY = Math.min(minY, shadowTop); + maxY = Math.max(maxY, shadowBottom); + } + return { + x: minX, + y: minY, + minX: minX, + minY: minY, + maxX: maxX, + maxY: maxY, + width: maxX - minX, + height: maxY - minY, + }; + }; + /** + * @protected + * 清理缓存的 bbox + */ + AbstractShape.prototype.clearCacheBBox = function () { + this.set('bbox', null); + this.set('canvasBBox', null); + }; + // 实现接口 + AbstractShape.prototype.isClipShape = function () { + return this.get('isClipShape'); + }; + /** + * @protected + * 不同的图形自己实现是否在图形内部的逻辑，要判断边和填充区域 + * @param {number} refX 相对于图形的坐标 x + * @param {number} refY 相对于图形的坐标 Y + * @return {boolean} 点是否在图形内部 + */ + AbstractShape.prototype.isInShape = function (refX, refY) { + return false; + }; + /** + * 是否仅仅使用 BBox 检测就可以判定拾取到图形 + * 默认是 false，但是有些图形例如 image、marker 等都可直接使用 BBox 的检测而不需要使用图形拾取 + * @return {Boolean} 仅仅使用 BBox 进行拾取 + */ + AbstractShape.prototype.isOnlyHitBox = function () { + return false; + }; + // 不同的 Shape 各自实现 + AbstractShape.prototype.isHit = function (x, y) { + var startArrowShape = this.get('startArrowShape'); + var endArrowShape = this.get('endArrowShape'); + var vec = [x, y, 1]; + vec = this.invertFromMatrix(vec); + var refX = vec[0], refY = vec[1]; + var inBBox = this._isInBBox(refX, refY); + // 跳过图形的拾取，在某些图形中可以省略一倍的检测成本 + if (this.isOnlyHitBox()) { + return inBBox; + } + // 被裁减掉的和不在包围盒内的不进行计算 + if (inBBox && !this.isClipped(refX, refY)) { + // 对图形进行拾取判断 + if (this.isInShape(refX, refY)) { + return true; + } + // 对起始箭头进行拾取判断 + if (startArrowShape && startArrowShape.isHit(refX, refY)) { + return true; + } + // 对结束箭头进行拾取判断 + if (endArrowShape && endArrowShape.isHit(refX, refY)) { + return true; + } + } + return false; + }; + return AbstractShape; +}(Element$4)); + +var cache$2 = new Map(); +/** + * 注册计算包围盒的算法 + * @param type 方法名 + * @param method 方法 + */ +function register$1(type, method) { + cache$2.set(type, method); +} +/** + * 获取计算包围盒的算法 + * @param type 方法名 + */ +function getMethod(type) { + return cache$2.get(type); +} + +function rect$2 (shape) { + var attrs = shape.attr(); + var x = attrs.x, y = attrs.y, width = attrs.width, height = attrs.height; + return { + x: x, + y: y, + width: width, + height: height, + }; +} + +function circle$2 (shape) { + var _a = shape.attr(), x = _a.x, y = _a.y, r = _a.r; + return { + x: x - r, + y: y - r, + width: r * 2, + height: r * 2, + }; +} + +function minNum(array) { + return Math.min.apply(null, array); +} +function maxNum(array) { + return Math.max.apply(null, array); +} +/** + * 两点之间的距离 + * @param {number} x1 起始点 x + * @param {number} y1 起始点 y + * @param {number} x2 结束点 x + * @param {number} y2 结束点 y + * @return {number} 距离 + */ +function distance$9(x1, y1, x2, y2) { + var dx = x1 - x2; + var dy = y1 - y2; + return Math.sqrt(dx * dx + dy * dy); +} +function isNumberEqual(v1, v2) { + return Math.abs(v1 - v2) < 0.001; +} +function getBBoxByArray(xArr, yArr) { + var minX = minNum(xArr); + var minY = minNum(yArr); + var maxX = maxNum(xArr); + var maxY = maxNum(yArr); + return { + x: minX, + y: minY, + width: maxX - minX, + height: maxY - minY, + }; +} +function piMod(angle) { + return (angle + Math.PI * 2) % (Math.PI * 2); +} + +var LineUtil = { + /** + * 计算线段的包围盒 + * @param {number} x1 起始点 x + * @param {number} y1 起始点 y + * @param {number} x2 结束点 x + * @param {number} y2 结束点 y + * @return {object} 包围盒对象 + */ + box: function (x1, y1, x2, y2) { + return getBBoxByArray([x1, x2], [y1, y2]); + }, + /** + * 线段的长度 + * @param {number} x1 起始点 x + * @param {number} y1 起始点 y + * @param {number} x2 结束点 x + * @param {number} y2 结束点 y + * @return {number} 距离 + */ + length: function (x1, y1, x2, y2) { + return distance$9(x1, y1, x2, y2); + }, + /** + * 根据比例获取点 + * @param {number} x1 起始点 x + * @param {number} y1 起始点 y + * @param {number} x2 结束点 x + * @param {number} y2 结束点 y + * @param {number} t 指定比例 + * @return {object} 包含 x, y 的点 + */ + pointAt: function (x1, y1, x2, y2, t) { + return { + x: (1 - t) * x1 + t * x2, + y: (1 - t) * y1 + t * y2, + }; + }, + /** + * 点到线段的距离 + * @param {number} x1 起始点 x + * @param {number} y1 起始点 y + * @param {number} x2 结束点 x + * @param {number} y2 结束点 y + * @param {number} x 测试点 x + * @param {number} y 测试点 y + * @return {number} 距离 + */ + pointDistance: function (x1, y1, x2, y2, x, y) { + // 投影距离 x1, y1 的向量，假设 p, p1, p2 三个点，投影点为 a + // p1a = p1p.p1p2/|p1p2| * (p1p 的单位向量) + var cross = (x2 - x1) * (x - x1) + (y2 - y1) * (y - y1); + if (cross < 0) { + return distance$9(x1, y1, x, y); + } + var lengthSquare = (x2 - x1) * (x2 - x1) + (y2 - y1) * (y2 - y1); + if (cross > lengthSquare) { + return distance$9(x2, y2, x, y); + } + return this.pointToLine(x1, y1, x2, y2, x, y); + }, + /** + * 点到直线的距离，而不是点到线段的距离 + * @param {number} x1 起始点 x + * @param {number} y1 起始点 y + * @param {number} x2 结束点 x + * @param {number} y2 结束点 y + * @param {number} x 测试点 x + * @param {number} y 测试点 y + * @return {number} 距离 + */ + pointToLine: function (x1, y1, x2, y2, x, y) { + var d = [x2 - x1, y2 - y1]; + // 如果端点相等，则判定点到点的距离 + if (exactEquals$1(d, [0, 0])) { + return Math.sqrt((x - x1) * (x - x1) + (y - y1) * (y - y1)); + } + var u = [-d[1], d[0]]; + normalize$4(u, u); + var a = [x - x1, y - y1]; + return Math.abs(dot$3(a, u)); + }, + /** + * 线段的角度 + * @param {number} x1 起始点 x + * @param {number} y1 起始点 y + * @param {number} x2 结束点 x + * @param {number} y2 结束点 y + * @return {number} 导数 + */ + tangentAngle: function (x1, y1, x2, y2) { + return Math.atan2(y2 - y1, x2 - x1); + }, +}; + +var EPSILON$1 = 0.0001; +/** + * 使用牛顿切割法求最近的点 + * @param {number[]} xArr 点的 x 数组 + * @param {number[]} yArr 点的 y 数组 + * @param {number} x 指定的点 x + * @param {number} y 指定的点 y + * @param {Function} tCallback 差值函数 + */ +function nearestPoint(xArr, yArr, x, y, tCallback, length) { + var t; + var d = Infinity; + var v0 = [x, y]; + var segNum = 20; + if (length && length > 200) { + segNum = length / 10; + } + var increaseRate = 1 / segNum; + var interval = increaseRate / 10; + for (var i = 0; i <= segNum; i++) { + var _t = i * increaseRate; + var v1 = [tCallback.apply(null, xArr.concat([_t])), tCallback.apply(null, yArr.concat([_t]))]; + var d1 = distance$9(v0[0], v0[1], v1[0], v1[1]); + if (d1 < d) { + t = _t; + d = d1; + } + } + // 提前终止 + if (t === 0) { + return { + x: xArr[0], + y: yArr[0], + }; + } + if (t === 1) { + var count = xArr.length; + return { + x: xArr[count - 1], + y: yArr[count - 1], + }; + } + d = Infinity; + for (var i = 0; i < 32; i++) { + if (interval < EPSILON$1) { + break; + } + var prev = t - interval; + var next = t + interval; + var v1 = [tCallback.apply(null, xArr.concat([prev])), tCallback.apply(null, yArr.concat([prev]))]; + var d1 = distance$9(v0[0], v0[1], v1[0], v1[1]); + if (prev >= 0 && d1 < d) { + t = prev; + d = d1; + } + else { + var v2 = [tCallback.apply(null, xArr.concat([next])), tCallback.apply(null, yArr.concat([next]))]; + var d2 = distance$9(v0[0], v0[1], v2[0], v2[1]); + if (next <= 1 && d2 < d) { + t = next; + d = d2; + } + else { + interval *= 0.5; + } + } + } + return { + x: tCallback.apply(null, xArr.concat([t])), + y: tCallback.apply(null, yArr.concat([t])), + }; +} +// 近似求解 https://community.khronos.org/t/3d-cubic-bezier-segment-length/62363/2 +function snapLength(xArr, yArr) { + var totalLength = 0; + var count = xArr.length; + for (var i = 0; i < count; i++) { + var x = xArr[i]; + var y = yArr[i]; + var nextX = xArr[(i + 1) % count]; + var nextY = yArr[(i + 1) % count]; + totalLength += distance$9(x, y, nextX, nextY); + } + return totalLength / 2; +} + +// 差值公式 +function quadraticAt(p0, p1, p2, t) { + var onet = 1 - t; + return onet * onet * p0 + 2 * t * onet * p1 + t * t * p2; +} +// 求极值 +function extrema$1(p0, p1, p2) { + var a = p0 + p2 - 2 * p1; + if (isNumberEqual(a, 0)) { + return [0.5]; + } + var rst = (p0 - p1) / a; + if (rst <= 1 && rst >= 0) { + return [rst]; + } + return []; +} +function derivativeAt$1(p0, p1, p2, t) { + return 2 * (1 - t) * (p1 - p0) + 2 * t * (p2 - p1); +} +// 分割贝塞尔曲线 +function divideQuadratic(x1, y1, x2, y2, x3, y3, t) { + // 划分点 + var xt = quadraticAt(x1, x2, x3, t); + var yt = quadraticAt(y1, y2, y3, t); + // 分割的第一条曲线的控制点 + var controlPoint1 = LineUtil.pointAt(x1, y1, x2, y2, t); + // 分割的第二条曲线的控制点 + var controlPoint2 = LineUtil.pointAt(x2, y2, x3, y3, t); + return [ + [x1, y1, controlPoint1.x, controlPoint1.y, xt, yt], + [xt, yt, controlPoint2.x, controlPoint2.y, x3, y3], + ]; +} +// 使用迭代法取贝塞尔曲线的长度 +function quadraticLength(x1, y1, x2, y2, x3, y3, iterationCount) { + if (iterationCount === 0) { + return (distance$9(x1, y1, x2, y2) + distance$9(x2, y2, x3, y3) + distance$9(x1, y1, x3, y3)) / 2; + } + var quadratics = divideQuadratic(x1, y1, x2, y2, x3, y3, 0.5); + var left = quadratics[0]; + var right = quadratics[1]; + left.push(iterationCount - 1); + right.push(iterationCount - 1); + return quadraticLength.apply(null, left) + quadraticLength.apply(null, right); +} +var QuadUtil = { + box: function (x1, y1, x2, y2, x3, y3) { + var xExtrema = extrema$1(x1, x2, x3)[0]; + var yExtrema = extrema$1(y1, y2, y3)[0]; + // 控制点不加入 box 的计算 + var xArr = [x1, x3]; + var yArr = [y1, y3]; + if (xExtrema !== undefined) { + xArr.push(quadraticAt(x1, x2, x3, xExtrema)); + } + if (yExtrema !== undefined) { + yArr.push(quadraticAt(y1, y2, y3, yExtrema)); + } + return getBBoxByArray(xArr, yArr); + }, + length: function (x1, y1, x2, y2, x3, y3) { + return quadraticLength(x1, y1, x2, y2, x3, y3, 3); + }, + nearestPoint: function (x1, y1, x2, y2, x3, y3, x0, y0) { + return nearestPoint([x1, x2, x3], [y1, y2, y3], x0, y0, quadraticAt); + }, + pointDistance: function (x1, y1, x2, y2, x3, y3, x0, y0) { + var point = this.nearestPoint(x1, y1, x2, y2, x3, y3, x0, y0); + return distance$9(point.x, point.y, x0, y0); + }, + interpolationAt: quadraticAt, + pointAt: function (x1, y1, x2, y2, x3, y3, t) { + return { + x: quadraticAt(x1, x2, x3, t), + y: quadraticAt(y1, y2, y3, t), + }; + }, + divide: function (x1, y1, x2, y2, x3, y3, t) { + return divideQuadratic(x1, y1, x2, y2, x3, y3, t); + }, + tangentAngle: function (x1, y1, x2, y2, x3, y3, t) { + var dx = derivativeAt$1(x1, x2, x3, t); + var dy = derivativeAt$1(y1, y2, y3, t); + var angle = Math.atan2(dy, dx); + return piMod(angle); + }, +}; + +function cubicAt(p0, p1, p2, p3, t) { + var onet = 1 - t; // t * t * t 的性能大概是 Math.pow(t, 3) 的三倍 + return onet * onet * onet * p0 + 3 * p1 * t * onet * onet + 3 * p2 * t * t * onet + p3 * t * t * t; +} +function derivativeAt(p0, p1, p2, p3, t) { + var onet = 1 - t; + return 3 * (onet * onet * (p1 - p0) + 2 * onet * t * (p2 - p1) + t * t * (p3 - p2)); +} +function extrema(p0, p1, p2, p3) { + var a = -3 * p0 + 9 * p1 - 9 * p2 + 3 * p3; + var b = 6 * p0 - 12 * p1 + 6 * p2; + var c = 3 * p1 - 3 * p0; + var extremas = []; + var t1; + var t2; + var discSqrt; + if (isNumberEqual(a, 0)) { + if (!isNumberEqual(b, 0)) { + t1 = -c / b; + if (t1 >= 0 && t1 <= 1) { + extremas.push(t1); + } + } + } + else { + var disc = b * b - 4 * a * c; + if (isNumberEqual(disc, 0)) { + extremas.push(-b / (2 * a)); + } + else if (disc > 0) { + discSqrt = Math.sqrt(disc); + t1 = (-b + discSqrt) / (2 * a); + t2 = (-b - discSqrt) / (2 * a); + if (t1 >= 0 && t1 <= 1) { + extremas.push(t1); + } + if (t2 >= 0 && t2 <= 1) { + extremas.push(t2); + } + } + } + return extremas; +} +// 分割贝塞尔曲线 +function divideCubic(x1, y1, x2, y2, x3, y3, x4, y4, t) { + // 划分点 + var xt = cubicAt(x1, x2, x3, x4, t); + var yt = cubicAt(y1, y2, y3, y4, t); + // 计算两点之间的差值点 + var c1 = LineUtil.pointAt(x1, y1, x2, y2, t); + var c2 = LineUtil.pointAt(x2, y2, x3, y3, t); + var c3 = LineUtil.pointAt(x3, y3, x4, y4, t); + var c12 = LineUtil.pointAt(c1.x, c1.y, c2.x, c2.y, t); + var c23 = LineUtil.pointAt(c2.x, c2.y, c3.x, c3.y, t); + return [ + [x1, y1, c1.x, c1.y, c12.x, c12.y, xt, yt], + [xt, yt, c23.x, c23.y, c3.x, c3.y, x4, y4], + ]; +} +// 使用迭代法取贝塞尔曲线的长度，二阶和三阶分开写，更清晰和便于调试 +function cubicLength(x1, y1, x2, y2, x3, y3, x4, y4, iterationCount) { + if (iterationCount === 0) { + return snapLength([x1, x2, x3, x4], [y1, y2, y3, y4]); + } + var cubics = divideCubic(x1, y1, x2, y2, x3, y3, x4, y4, 0.5); + var left = cubics[0]; + var right = cubics[1]; + left.push(iterationCount - 1); + right.push(iterationCount - 1); + return cubicLength.apply(null, left) + cubicLength.apply(null, right); +} +var CubicUtil = { + extrema: extrema, + box: function (x1, y1, x2, y2, x3, y3, x4, y4) { + var xArr = [x1, x4]; + var yArr = [y1, y4]; + var xExtrema = extrema(x1, x2, x3, x4); + var yExtrema = extrema(y1, y2, y3, y4); + for (var i = 0; i < xExtrema.length; i++) { + xArr.push(cubicAt(x1, x2, x3, x4, xExtrema[i])); + } + for (var i = 0; i < yExtrema.length; i++) { + yArr.push(cubicAt(y1, y2, y3, y4, yExtrema[i])); + } + return getBBoxByArray(xArr, yArr); + }, + length: function (x1, y1, x2, y2, x3, y3, x4, y4) { + // 迭代三次，划分成 8 段求长度 + return cubicLength(x1, y1, x2, y2, x3, y3, x4, y4, 3); + }, + nearestPoint: function (x1, y1, x2, y2, x3, y3, x4, y4, x0, y0, length) { + return nearestPoint([x1, x2, x3, x4], [y1, y2, y3, y4], x0, y0, cubicAt, length); + }, + pointDistance: function (x1, y1, x2, y2, x3, y3, x4, y4, x0, y0, length) { + var point = this.nearestPoint(x1, y1, x2, y2, x3, y3, x4, y4, x0, y0, length); + return distance$9(point.x, point.y, x0, y0); + }, + interpolationAt: cubicAt, + pointAt: function (x1, y1, x2, y2, x3, y3, x4, y4, t) { + return { + x: cubicAt(x1, x2, x3, x4, t), + y: cubicAt(y1, y2, y3, y4, t), + }; + }, + divide: function (x1, y1, x2, y2, x3, y3, x4, y4, t) { + return divideCubic(x1, y1, x2, y2, x3, y3, x4, y4, t); + }, + tangentAngle: function (x1, y1, x2, y2, x3, y3, x4, y4, t) { + var dx = derivativeAt(x1, x2, x3, x4, t); + var dy = derivativeAt(y1, y2, y3, y4, t); + return piMod(Math.atan2(dy, dx)); + }, +}; + +/** + * @fileoverview 椭圆的一些计算， + * - 周长计算参考：https://www.mathsisfun.com/geometry/ellipse-perimeter.html + * - 距离计算参考：https://wet-robots.ghost.io/simple-method-for-distance-to-ellipse/ + * @author dxq613@gmail.com + */ +function copysign(v1, v2) { + var absv = Math.abs(v1); + return v2 > 0 ? absv : absv * -1; +} +var ellipse$2 = { + /** + * 包围盒计算 + * @param {number} x 椭圆中心 x + * @param {number} y 椭圆中心 y + * @param {number} rx 椭圆 x 方向半径 + * @param {number} ry 椭圆 y 方向半径 + * @return {object} 包围盒 + */ + box: function (x, y, rx, ry) { + return { + x: x - rx, + y: y - ry, + width: rx * 2, + height: ry * 2, + }; + }, + /** + * 计算周长，使用近似法 + * @param {number} x 椭圆中心 x + * @param {number} y 椭圆中心 y + * @param {number} rx 椭圆 x 方向半径 + * @param {number} ry 椭圆 y 方向半径 + * @return {number} 椭圆周长 + */ + length: function (x, y, rx, ry) { + return Math.PI * (3 * (rx + ry) - Math.sqrt((3 * rx + ry) * (rx + 3 * ry))); + }, + /** + * 距离椭圆最近的点 + * @param {number} x 椭圆中心 x + * @param {number} y 椭圆中心 y + * @param {number} rx 椭圆 x 方向半径 + * @param {number} ry 椭圆 y 方向半径 + * @param {number} x0 指定的点 x + * @param {number} y0 指定的点 y + * @return {object} 椭圆上距离指定点最近的点 + */ + nearestPoint: function (x, y, rx, ry, x0, y0) { + var a = rx; + var b = ry; + // 假如椭圆半径为0则返回圆心 + if (a === 0 || b === 0) { + return { + x: x, + y: y, + }; + } + // 转换成 0， 0 为中心的椭圆计算 + var relativeX = x0 - x; + var relativeY = y0 - y; + var px = Math.abs(relativeX); + var py = Math.abs(relativeY); + var squareA = a * a; + var squareB = b * b; + // const angle0 = Math.atan2(relativeY, relativeX); + var t = Math.PI / 4; + var nearestX; // 椭圆上的任一点 + var nearestY; + // 迭代 4 次 + for (var i = 0; i < 4; i++) { + nearestX = a * Math.cos(t); + nearestY = b * Math.sin(t); + var ex = ((squareA - squareB) * Math.pow(Math.cos(t), 3)) / a; + var ey = ((squareB - squareA) * Math.pow(Math.sin(t), 3)) / b; + var rx1 = nearestX - ex; + var ry1 = nearestY - ey; + var qx = px - ex; + var qy = py - ey; + var r = Math.hypot(ry1, rx1); + var q = Math.hypot(qy, qx); + var delta_c = r * Math.asin((rx1 * qy - ry1 * qx) / (r * q)); + var delta_t = delta_c / Math.sqrt(squareA + squareB - nearestX * nearestX - nearestY * nearestY); + t += delta_t; + t = Math.min(Math.PI / 2, Math.max(0, t)); + } + return { + x: x + copysign(nearestX, relativeX), + y: y + copysign(nearestY, relativeY), + }; + }, + /** + * 点到椭圆最近的距离 + * @param {number} x 椭圆中心 x + * @param {number} y 椭圆中心 y + * @param {number} rx 椭圆 x 方向半径 + * @param {number} ry 椭圆 y 方向半径 + * @param {number} x0 指定的点 x + * @param {number} y0 指定的点 y + * @return {number} 点到椭圆的距离 + */ + pointDistance: function (x, y, rx, ry, x0, y0) { + var nearestPoint = this.nearestPoint(x, y, rx, ry, x0, y0); + return distance$9(nearestPoint.x, nearestPoint.y, x0, y0); + }, + /** + * 根据比例获取点 + * @param {number} x 椭圆中心 x + * @param {number} y 椭圆中心 y + * @param {number} rx 椭圆 x 方向半径 + * @param {number} ry 椭圆 y 方向半径 + * @param {number} t 指定比例，x轴方向为 0 + * @return {object} 点 + */ + pointAt: function (x, y, rx, ry, t) { + var angle = 2 * Math.PI * t; // 按照角度进行计算，而不按照周长计算 + return { + x: x + rx * Math.cos(angle), + y: y + ry * Math.sin(angle), + }; + }, + /** + * 根据比例计算切线角度 + * @param {number} x 椭圆中心 x + * @param {number} y 椭圆中心 y + * @param {number} rx 椭圆 x 方向半径 + * @param {number} ry 椭圆 y 方向半径 + * @param {number} t 指定比例 0 - 1 之间，x轴方向为 0。在 0-1 范围之外是循环还是返回 null，还需要调整 + * @return {number} 角度，在 0 - 2PI 之间 + */ + tangentAngle: function (x, y, rx, ry, t) { + var angle = 2 * Math.PI * t; // 按照角度进行计算，而不按照周长计算 + // 直接使用 x,y 的导数计算， x' = -rx * sin(t); y' = ry * cos(t); + var tangentAngle = Math.atan2(ry * Math.cos(angle), -rx * Math.sin(angle)); + // 也可以使用指定点的切线方程计算，成本有些高 + // const point = this.pointAt(0, 0, rx, ry, t); // 椭圆的切线同椭圆的中心不相关 + // let tangentAngle = -1 * Math.atan((ry * ry * point.x) / (rx * rx * point.y)); + // if (angle >= 0 && angle <= Math.PI) { + // tangentAngle += Math.PI; + // } + return piMod(tangentAngle); + }, +}; + +// 偏导数 x +function derivativeXAt(cx, cy, rx, ry, xRotation, startAngle, endAngle, angle) { + return -1 * rx * Math.cos(xRotation) * Math.sin(angle) - ry * Math.sin(xRotation) * Math.cos(angle); +} +// 偏导数 y +function derivativeYAt(cx, cy, rx, ry, xRotation, startAngle, endAngle, angle) { + return -1 * rx * Math.sin(xRotation) * Math.sin(angle) + ry * Math.cos(xRotation) * Math.cos(angle); +} +// x 的极值 +function xExtrema(rx, ry, xRotation) { + return Math.atan((-ry / rx) * Math.tan(xRotation)); +} +// y 的极值 +function yExtrema(rx, ry, xRotation) { + return Math.atan(ry / (rx * Math.tan(xRotation))); +} +// 根据角度求 x 坐标 +function xAt(cx, cy, rx, ry, xRotation, angle) { + return rx * Math.cos(xRotation) * Math.cos(angle) - ry * Math.sin(xRotation) * Math.sin(angle) + cx; +} +// 根据角度求 y 坐标 +function yAt(cx, cy, rx, ry, xRotation, angle) { + return rx * Math.sin(xRotation) * Math.cos(angle) + ry * Math.cos(xRotation) * Math.sin(angle) + cy; +} +// 获取点在椭圆上的角度 +function getAngle$3(rx, ry, x0, y0) { + var angle = Math.atan2(y0 * rx, x0 * ry); + // 转换到 0 - 2PI 内 + return (angle + Math.PI * 2) % (Math.PI * 2); +} +// 根据角度获取，x,y +function getPoint(rx, ry, angle) { + return { + x: rx * Math.cos(angle), + y: ry * Math.sin(angle), + }; +} +// 旋转 +function rotate$3(x, y, angle) { + var cos = Math.cos(angle); + var sin = Math.sin(angle); + return [x * cos - y * sin, x * sin + y * cos]; +} +var EllipseArcUtil = { + /** + * 计算包围盒 + * @param {number} cx 圆心 x + * @param {number} cy 圆心 y + * @param {number} rx x 轴方向的半径 + * @param {number} ry y 轴方向的半径 + * @param {number} xRotation 旋转角度 + * @param {number} startAngle 起始角度 + * @param {number} endAngle 结束角度 + * @return {object} 包围盒对象 + */ + box: function (cx, cy, rx, ry, xRotation, startAngle, endAngle) { + var xDim = xExtrema(rx, ry, xRotation); + var minX = Infinity; + var maxX = -Infinity; + var xs = [startAngle, endAngle]; + for (var i = -Math.PI * 2; i <= Math.PI * 2; i += Math.PI) { + var xAngle = xDim + i; + if (startAngle < endAngle) { + if (startAngle < xAngle && xAngle < endAngle) { + xs.push(xAngle); + } + } + else { + if (endAngle < xAngle && xAngle < startAngle) { + xs.push(xAngle); + } + } + } + for (var i = 0; i < xs.length; i++) { + var x = xAt(cx, cy, rx, ry, xRotation, xs[i]); + if (x < minX) { + minX = x; + } + if (x > maxX) { + maxX = x; + } + } + var yDim = yExtrema(rx, ry, xRotation); + var minY = Infinity; + var maxY = -Infinity; + var ys = [startAngle, endAngle]; + for (var i = -Math.PI * 2; i <= Math.PI * 2; i += Math.PI) { + var yAngle = yDim + i; + if (startAngle < endAngle) { + if (startAngle < yAngle && yAngle < endAngle) { + ys.push(yAngle); + } + } + else { + if (endAngle < yAngle && yAngle < startAngle) { + ys.push(yAngle); + } + } + } + for (var i = 0; i < ys.length; i++) { + var y = yAt(cx, cy, rx, ry, xRotation, ys[i]); + if (y < minY) { + minY = y; + } + if (y > maxY) { + maxY = y; + } + } + return { + x: minX, + y: minY, + width: maxX - minX, + height: maxY - minY, + }; + }, + /** + * 获取圆弧的长度，计算圆弧长度时不考虑旋转角度， + * 仅跟 rx, ry, startAngle, endAngle 相关 + * @param {number} cx 圆心 x + * @param {number} cy 圆心 y + * @param {number} rx x 轴方向的半径 + * @param {number} ry y 轴方向的半径 + * @param {number} xRotation 旋转角度 + * @param {number} startAngle 起始角度 + * @param {number} endAngle 结束角度 + */ + length: function (cx, cy, rx, ry, xRotation, startAngle, endAngle) { }, + /** + * 获取指定点到圆弧的最近距离的点 + * @param {number} cx 圆心 x + * @param {number} cy 圆心 y + * @param {number} rx x 轴方向的半径 + * @param {number} ry y 轴方向的半径 + * @param {number} xRotation 旋转角度 + * @param {number} startAngle 起始角度 + * @param {number} endAngle 结束角度 + * @param {number} x0 指定点的 x + * @param {number} y0 指定点的 y + * @return {object} 到指定点最近距离的点 + */ + nearestPoint: function (cx, cy, rx, ry, xRotation, startAngle, endAngle, x0, y0) { + // 将最近距离问题转换成到椭圆中心 0,0 没有旋转的椭圆问题 + var relativeVector = rotate$3(x0 - cx, y0 - cy, -xRotation); + var x1 = relativeVector[0], y1 = relativeVector[1]; + // 计算点到椭圆的最近的点 + var relativePoint = ellipse$2.nearestPoint(0, 0, rx, ry, x1, y1); + // 获取点在椭圆上的角度 + var angle = getAngle$3(rx, ry, relativePoint.x, relativePoint.y); + // 点没有在圆弧上 + if (angle < startAngle) { + // 小于起始圆弧 + relativePoint = getPoint(rx, ry, startAngle); + } + else if (angle > endAngle) { + // 大于结束圆弧 + relativePoint = getPoint(rx, ry, endAngle); + } + // 旋转到 xRotation 的角度 + var vector = rotate$3(relativePoint.x, relativePoint.y, xRotation); + return { + x: vector[0] + cx, + y: vector[1] + cy, + }; + }, + pointDistance: function (cx, cy, rx, ry, xRotation, startAngle, endAngle, x0, y0) { + var nearestPoint = this.nearestPoint(cx, cy, rx, ry, x0, y0); + return distance$9(nearestPoint.x, nearestPoint.y, x0, y0); + }, + pointAt: function (cx, cy, rx, ry, xRotation, startAngle, endAngle, t) { + var angle = (endAngle - startAngle) * t + startAngle; + return { + x: xAt(cx, cy, rx, ry, xRotation, angle), + y: yAt(cx, cy, rx, ry, xRotation, angle), + }; + }, + tangentAngle: function (cx, cy, rx, ry, xRotation, startAngle, endAngle, t) { + var angle = (endAngle - startAngle) * t + startAngle; + var dx = derivativeXAt(cx, cy, rx, ry, xRotation, startAngle, endAngle, angle); + var dy = derivativeYAt(cx, cy, rx, ry, xRotation, startAngle, endAngle, angle); + return piMod(Math.atan2(dy, dx)); + }, +}; + +function analyzePoints(points) { + // 计算每段的长度和总的长度 + var totalLength = 0; + var segments = []; + for (var i = 0; i < points.length - 1; i++) { + var from = points[i]; + var to = points[i + 1]; + var length_1 = distance$9(from[0], from[1], to[0], to[1]); + var seg = { + from: from, + to: to, + length: length_1, + }; + segments.push(seg); + totalLength += length_1; + } + return { segments: segments, totalLength: totalLength }; +} +function lengthOfSegment(points) { + if (points.length < 2) { + return 0; + } + var totalLength = 0; + for (var i = 0; i < points.length - 1; i++) { + var from = points[i]; + var to = points[i + 1]; + totalLength += distance$9(from[0], from[1], to[0], to[1]); + } + return totalLength; +} +/** + * 按照比例在数据片段中获取点 + * @param {array} points 点的集合 + * @param {number} t 百分比 0-1 + * @return {object} 点的坐标 + */ +function pointAtSegments(points, t) { + // 边界判断 + if (t > 1 || t < 0 || points.length < 2) { + return null; + } + var _a = analyzePoints(points), segments = _a.segments, totalLength = _a.totalLength; + // 多个点有可能重合 + if (totalLength === 0) { + return { + x: points[0][0], + y: points[0][1], + }; + } + // 计算比例 + var startRatio = 0; + var point = null; + for (var i = 0; i < segments.length; i++) { + var seg = segments[i]; + var from = seg.from, to = seg.to; + var currentRatio = seg.length / totalLength; + if (t >= startRatio && t <= startRatio + currentRatio) { + var localRatio = (t - startRatio) / currentRatio; + point = LineUtil.pointAt(from[0], from[1], to[0], to[1], localRatio); + break; + } + startRatio += currentRatio; + } + return point; +} +/** + * 按照比例在数据片段中获取切线的角度 + * @param {array} points 点的集合 + * @param {number} t 百分比 0-1 + */ +function angleAtSegments(points, t) { + // 边界判断 + if (t > 1 || t < 0 || points.length < 2) { + return 0; + } + var _a = analyzePoints(points), segments = _a.segments, totalLength = _a.totalLength; + // 计算比例 + var startRatio = 0; + var angle = 0; + for (var i = 0; i < segments.length; i++) { + var seg = segments[i]; + var from = seg.from, to = seg.to; + var currentRatio = seg.length / totalLength; + if (t >= startRatio && t <= startRatio + currentRatio) { + angle = Math.atan2(to[1] - from[1], to[0] - from[0]); + break; + } + startRatio += currentRatio; + } + return angle; +} +function distanceAtSegment(points, x, y) { + var minDistance = Infinity; + for (var i = 0; i < points.length - 1; i++) { + var point = points[i]; + var nextPoint = points[i + 1]; + var distance_1 = LineUtil.pointDistance(point[0], point[1], nextPoint[0], nextPoint[1], x, y); + if (distance_1 < minDistance) { + minDistance = distance_1; + } + } + return minDistance; +} + +var PolylineUtil = { + /** + * 计算多折线的包围盒 + * @param {array} points 点的集合 [x,y] 的形式 + * @return {object} 包围盒 + */ + box: function (points) { + var xArr = []; + var yArr = []; + for (var i = 0; i < points.length; i++) { + var point = points[i]; + xArr.push(point[0]); + yArr.push(point[1]); + } + return getBBoxByArray(xArr, yArr); + }, + /** + * 计算多折线的长度 + * @param {array} points 点的集合 [x,y] 的形式 + * @return {object} 多条边的长度 + */ + length: function (points) { + return lengthOfSegment(points); + }, + /** + * 根据比例获取多折线的点 + * @param {array} points 点的集合 [x,y] 的形式 + * @param {number} t 在多折线的长度上的比例 + * @return {object} 根据比例值计算出来的点 + */ + pointAt: function (points, t) { + return pointAtSegments(points, t); + }, + /** + * 指定点到多折线的距离 + * @param {array} points 点的集合 [x,y] 的形式 + * @param {number} x 指定点的 x + * @param {number} y 指定点的 y + * @return {number} 点到多折线的距离 + */ + pointDistance: function (points, x, y) { + return distanceAtSegment(points, x, y); + }, + /** + * 根据比例获取多折线的切线角度 + * @param {array} points 点的集合 [x,y] 的形式 + * @param {number} t 在多折线的长度上的比例 + * @return {object} 根据比例值计算出来的角度 + */ + tangentAngle: function (points, t) { + return angleAtSegments(points, t); + }, +}; + +// 合并包围盒 +function mergeBBox$2(bbox1, bbox2) { + if (!bbox1 || !bbox2) { + return bbox1 || bbox2; + } + return { + minX: Math.min(bbox1.minX, bbox2.minX), + minY: Math.min(bbox1.minY, bbox2.minY), + maxX: Math.max(bbox1.maxX, bbox2.maxX), + maxY: Math.max(bbox1.maxY, bbox2.maxY), + }; +} +// 合并箭头的包围盒 +function mergeArrowBBox$1(shape, bbox) { + var startArrowShape = shape.get('startArrowShape'); + var endArrowShape = shape.get('endArrowShape'); + var startArrowBBox = null; + var endArrowBBox = null; + if (startArrowShape) { + startArrowBBox = startArrowShape.getCanvasBBox(); + bbox = mergeBBox$2(bbox, startArrowBBox); + } + if (endArrowShape) { + endArrowBBox = endArrowShape.getCanvasBBox(); + bbox = mergeBBox$2(bbox, endArrowBBox); + } + return bbox; +} + +function polyline$1 (shape) { + var attrs = shape.attr(); + var points = attrs.points; + var xArr = []; + var yArr = []; + for (var i = 0; i < points.length; i++) { + var point = points[i]; + xArr.push(point[0]); + yArr.push(point[1]); + } + var _a = getBBoxByArray(xArr, yArr), x = _a.x, y = _a.y, width = _a.width, height = _a.height; + var bbox = { + minX: x, + minY: y, + maxX: x + width, + maxY: y + height, + }; + bbox = mergeArrowBBox$1(shape, bbox); + return { + x: bbox.minX, + y: bbox.minY, + width: bbox.maxX - bbox.minX, + height: bbox.maxY - bbox.minY, + }; +} + +function polygon$2 (shape) { + var attrs = shape.attr(); + var points = attrs.points; + var xArr = []; + var yArr = []; + for (var i = 0; i < points.length; i++) { + var point = points[i]; + xArr.push(point[0]); + yArr.push(point[1]); + } + return getBBoxByArray(xArr, yArr); +} + +// 全局设置一个唯一离屏的 ctx，用于计算 isPointInPath +var offScreenCtx$1 = null; +function getOffScreenContext$1() { + if (!offScreenCtx$1) { + var canvas = document.createElement('canvas'); + canvas.width = 1; + canvas.height = 1; + offScreenCtx$1 = canvas.getContext('2d'); + } + return offScreenCtx$1; +} + +/** + * 获取文本的高度 + * @param text 文本 + * @param fontSize 字体大小 + * @param lineHeight 行高，可以为空 + */ +function getTextHeight$1(text, fontSize, lineHeight) { + var lineCount = 1; + if (isString$3(text)) { + lineCount = text.split('\n').length; + } + if (lineCount > 1) { + var spaceingY = getLineSpaceing$1(fontSize, lineHeight); + return fontSize * lineCount + spaceingY * (lineCount - 1); + } + return fontSize; +} +/** + * 获取行间距如果文本多行，需要获取文本间距 + * @param fontSize 字体大小 + * @param lineHeight 行高 + */ +function getLineSpaceing$1(fontSize, lineHeight) { + return lineHeight ? lineHeight - fontSize : fontSize * 0.14; +} +/** + * 字体宽度 + * @param text 文本 + * @param font 字体 + */ +function getTextWidth$1(text, font) { + var context = getOffScreenContext$1(); // 获取离屏的 ctx 进行计算 + var width = 0; + // null 或者 undefined 时，宽度为 0 + if (isNil(text) || text === '') { + return width; + } + context.save(); + context.font = font; + if (isString$3(text) && text.includes('\n')) { + var textArr = text.split('\n'); + each$2(textArr, function (subText) { + var measureWidth = context.measureText(subText).width; + if (width < measureWidth) { + width = measureWidth; + } + }); + } + else { + width = context.measureText(text).width; + } + context.restore(); + return width; +} +function assembleFont$1(attrs) { + var fontSize = attrs.fontSize, fontFamily = attrs.fontFamily, fontWeight = attrs.fontWeight, fontStyle = attrs.fontStyle, fontVariant = attrs.fontVariant; + return [fontStyle, fontVariant, fontWeight, fontSize + "px", fontFamily].join(' ').trim(); +} + +function text$1 (shape) { + var attrs = shape.attr(); + var x = attrs.x, y = attrs.y, text = attrs.text, fontSize = attrs.fontSize, lineHeight = attrs.lineHeight; + var font = attrs.font; + if (!font) { + // 如果未组装 font + font = assembleFont$1(attrs); + } + var width = getTextWidth$1(text, font); + var bbox; + if (!width) { + // 如果width不存在，四点共其实点 + bbox = { + x: x, + y: y, + width: 0, + height: 0, + }; + } + else { + var textAlign = attrs.textAlign, textBaseline = attrs.textBaseline; + var height = getTextHeight$1(text, fontSize, lineHeight); // attrs.height + // 默认左右对齐：left, 默认上下对齐 bottom + var point = { + x: x, + y: y - height, + }; + if (textAlign) { + if (textAlign === 'end' || textAlign === 'right') { + point.x -= width; + } + else if (textAlign === 'center') { + point.x -= width / 2; + } + } + if (textBaseline) { + if (textBaseline === 'top') { + point.y += height; + } + else if (textBaseline === 'middle') { + point.y += height / 2; + } + } + bbox = { + x: point.x, + y: point.y, + width: width, + height: height, + }; + } + return bbox; +} + +var regexTags = /[MLHVQTCSAZ]([^MLHVQTCSAZ]*)/ig; +var regexDot = /[^\s\,]+/ig; +function parsePath(p) { + var path = p || []; + if (isArray$n(path)) { + return path; + } + if (isString$3(path)) { + path = path.match(regexTags); + each$2(path, function (item, index) { + // @ts-ignore + item = item.match(regexDot); + if (item[0].length > 1) { + var tag = item[0].charAt(0); + // @ts-ignore + item.splice(1, 0, item[0].substr(1)); + // @ts-ignore + item[0] = tag; + } + // @ts-ignore + each$2(item, function (sub, i) { + if (!isNaN(sub)) { + // @ts-ignore + item[i] = +sub; + } + }); + // @ts-ignore + path[index] = item; + }); + return path; + } +} + +// http://schepers.cc/getting-to-the-point +function catmullRom2Bezier(crp, z) { + var d = []; + // @ts-ignore + for (var i = 0, iLen = crp.length; iLen - 2 * !z > i; i += 2) { + var p = [{ + x: +crp[i - 2], + y: +crp[i - 1], + }, { + x: +crp[i], + y: +crp[i + 1], + }, { + x: +crp[i + 2], + y: +crp[i + 3], + }, { + x: +crp[i + 4], + y: +crp[i + 5], + }]; + if (z) { + if (!i) { + p[0] = { + x: +crp[iLen - 2], + y: +crp[iLen - 1], + }; + } + else if (iLen - 4 === i) { + p[3] = { + x: +crp[0], + y: +crp[1], + }; + } + else if (iLen - 2 === i) { + p[2] = { + x: +crp[0], + y: +crp[1], + }; + p[3] = { + x: +crp[2], + y: +crp[3], + }; + } + } + else { + if (iLen - 4 === i) { + p[3] = p[2]; + } + else if (!i) { + p[0] = { + x: +crp[i], + y: +crp[i + 1], + }; + } + } + d.push(['C', + (-p[0].x + 6 * p[1].x + p[2].x) / 6, + (-p[0].y + 6 * p[1].y + p[2].y) / 6, + (p[1].x + 6 * p[2].x - p[3].x) / 6, + (p[1].y + 6 * p[2].y - p[3].y) / 6, + p[2].x, + p[2].y, + ]); + } + return d; +} + +var SPACES$1 = '\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029'; +var PATH_COMMAND$1 = new RegExp('([a-z])[' + SPACES$1 + ',]*((-?\\d*\\.?\\d*(?:e[\\-+]?\\d+)?[' + SPACES$1 + ']*,?[' + SPACES$1 + ']*)+)', 'ig'); +var PATH_VALUES$1 = new RegExp('(-?\\d*\\.?\\d*(?:e[\\-+]?\\d+)?)[' + SPACES$1 + ']*,?[' + SPACES$1 + ']*', 'ig'); +// Parses given path string into an array of arrays of path segments +function parsePathString$1(pathString) { + if (!pathString) { + return null; + } + if (isArray$n(pathString)) { + return pathString; + } + var paramCounts = { + a: 7, + c: 6, + o: 2, + h: 1, + l: 2, + m: 2, + r: 4, + q: 4, + s: 4, + t: 2, + v: 1, + u: 3, + z: 0, + }; + var data = []; + String(pathString).replace(PATH_COMMAND$1, function (a, b, c) { + var params = []; + var name = b.toLowerCase(); + c.replace(PATH_VALUES$1, function (a, b) { + b && params.push(+b); + }); + if (name === 'm' && params.length > 2) { + data.push([b].concat(params.splice(0, 2))); + name = 'l'; + b = b === 'm' ? 'l' : 'L'; + } + if (name === 'o' && params.length === 1) { + data.push([b, params[0]]); + } + if (name === 'r') { + data.push([b].concat(params)); + } + else { + while (params.length >= paramCounts[name]) { + data.push([b].concat(params.splice(0, paramCounts[name]))); + if (!paramCounts[name]) { + break; + } + } + } + return ''; + }); + return data; +} + +var REGEX_MD = /[a-z]/; +function toSymmetry$1(p, c) { + return [ + c[0] + (c[0] - p[0]), + c[1] + (c[1] - p[1]), + ]; +} +function pathToAbsolute(pathString) { + var pathArray = parsePathString$1(pathString); + if (!pathArray || !pathArray.length) { + return [ + ['M', 0, 0], + ]; + } + var needProcess = false; // 如果存在小写的命令或者 V,H,T,S 则需要处理 + for (var i = 0; i < pathArray.length; i++) { + var cmd = pathArray[i][0]; + // 如果存在相对位置的命令，则中断返回 + if (REGEX_MD.test(cmd) || ['V', 'H', 'T', 'S'].indexOf(cmd) >= 0) { + needProcess = true; + break; + } + } + // 如果不存在相对命令，则直接返回 + // 如果在业务上都写绝对路径，这种方式最快，仅做了一次检测 + if (!needProcess) { + return pathArray; + } + var res = []; + var x = 0; + var y = 0; + var mx = 0; + var my = 0; + var start = 0; + var first = pathArray[0]; + if (first[0] === 'M' || first[0] === 'm') { + x = +first[1]; + y = +first[2]; + mx = x; + my = y; + start++; + res[0] = ['M', x, y]; + } + for (var i = start, ii = pathArray.length; i < ii; i++) { + var pa = pathArray[i]; + var preParams = res[i - 1]; // 取前一个已经处理后的节点，否则会出现问题 + var r = []; + var cmd = pa[0]; + var upCmd = cmd.toUpperCase(); + if (cmd !== upCmd) { + r[0] = upCmd; + switch (upCmd) { + case 'A': + r[1] = pa[1]; + r[2] = pa[2]; + r[3] = pa[3]; + r[4] = pa[4]; + r[5] = pa[5]; + r[6] = +pa[6] + x; + r[7] = +pa[7] + y; + break; + case 'V': + r[1] = +pa[1] + y; + break; + case 'H': + r[1] = +pa[1] + x; + break; + case 'M': + mx = +pa[1] + x; + my = +pa[2] + y; + r[1] = mx; + r[2] = my; + break; // for lint + default: + for (var j = 1, jj = pa.length; j < jj; j++) { + r[j] = +pa[j] + ((j % 2) ? x : y); + } + } + } + else { // 如果本来已经大写，则不处理 + r = pathArray[i]; + } + // 需要在外面统一做，同时处理 V,H,S,T 等特殊指令 + switch (upCmd) { + case 'Z': + x = +mx; + y = +my; + break; + case 'H': + x = r[1]; + r = ['L', x, y]; + break; + case 'V': + y = r[1]; + r = ['L', x, y]; + break; + case 'T': + x = r[1]; + y = r[2]; + // 以 x, y 为中心的，上一个控制点的对称点 + // 需要假设上一个节点的命令为 Q + var symetricT = toSymmetry$1([preParams[1], preParams[2]], [preParams[3], preParams[4]]); + r = ['Q', symetricT[0], symetricT[1], x, y]; + break; + case 'S': + x = r[r.length - 2]; + y = r[r.length - 1]; + // 以 x,y 为中心，取上一个控制点， + // 需要假设上一个线段为 C 或者 S + var length_1 = preParams.length; + var symetricS = toSymmetry$1([preParams[length_1 - 4], preParams[length_1 - 3]], [preParams[length_1 - 2], preParams[length_1 - 1]]); + r = ['C', symetricS[0], symetricS[1], r[1], r[2], x, y]; + break; + case 'M': + mx = r[r.length - 2]; + my = r[r.length - 1]; + break; // for lint + default: + x = r[r.length - 2]; + y = r[r.length - 1]; + } + res.push(r); + } + return res; +} + +// 向量长度 +function vMag$1(v) { + return Math.sqrt(v[0] * v[0] + v[1] * v[1]); +} +// u.v/|u||v|，计算夹角的余弦值 +function vRatio$1(u, v) { + // 当存在一个向量的长度为 0 时，夹角也为 0，即夹角的余弦值为 1 + return vMag$1(u) * vMag$1(v) ? (u[0] * v[0] + u[1] * v[1]) / (vMag$1(u) * vMag$1(v)) : 1; +} +// 向量角度 +function vAngle$1(u, v) { + return (u[0] * v[1] < u[1] * v[0] ? -1 : 1) * Math.acos(vRatio$1(u, v)); +} +/** + * 判断两个点是否重合，点坐标的格式为 [x, y] + * @param {Array} point1 第一个点 + * @param {Array} point2 第二个点 + */ +function isSamePoint$1(point1, point2) { + return point1[0] === point2[0] && point1[1] === point2[1]; +} +// A 0:rx 1:ry 2:x-axis-rotation 3:large-arc-flag 4:sweep-flag 5: x 6: y +function getArcParams$1(startPoint, params) { + var rx = params[1]; + var ry = params[2]; + var xRotation = mod$1(toRadian(params[3]), Math.PI * 2); + var arcFlag = params[4]; + var sweepFlag = params[5]; + // 弧形起点坐标 + var x1 = startPoint[0]; + var y1 = startPoint[1]; + // 弧形终点坐标 + var x2 = params[6]; + var y2 = params[7]; + var xp = (Math.cos(xRotation) * (x1 - x2)) / 2.0 + (Math.sin(xRotation) * (y1 - y2)) / 2.0; + var yp = (-1 * Math.sin(xRotation) * (x1 - x2)) / 2.0 + (Math.cos(xRotation) * (y1 - y2)) / 2.0; + var lambda = (xp * xp) / (rx * rx) + (yp * yp) / (ry * ry); + if (lambda > 1) { + rx *= Math.sqrt(lambda); + ry *= Math.sqrt(lambda); + } + var diff = rx * rx * (yp * yp) + ry * ry * (xp * xp); + var f = diff ? Math.sqrt((rx * rx * (ry * ry) - diff) / diff) : 1; + if (arcFlag === sweepFlag) { + f *= -1; + } + if (isNaN(f)) { + f = 0; + } + // 旋转前的起点坐标，且当长半轴和短半轴的长度为 0 时，坐标按 (0, 0) 处理 + var cxp = ry ? (f * rx * yp) / ry : 0; + var cyp = rx ? (f * -ry * xp) / rx : 0; + // 椭圆圆心坐标 + var cx = (x1 + x2) / 2.0 + Math.cos(xRotation) * cxp - Math.sin(xRotation) * cyp; + var cy = (y1 + y2) / 2.0 + Math.sin(xRotation) * cxp + Math.cos(xRotation) * cyp; + // 起始点的单位向量 + var u = [(xp - cxp) / rx, (yp - cyp) / ry]; + // 终止点的单位向量 + var v = [(-1 * xp - cxp) / rx, (-1 * yp - cyp) / ry]; + // 计算起始点和圆心的连线，与 x 轴正方向的夹角 + var theta = vAngle$1([1, 0], u); + // 计算圆弧起始点和终止点与椭圆圆心连线的夹角 + var dTheta = vAngle$1(u, v); + if (vRatio$1(u, v) <= -1) { + dTheta = Math.PI; + } + if (vRatio$1(u, v) >= 1) { + dTheta = 0; + } + if (sweepFlag === 0 && dTheta > 0) { + dTheta = dTheta - 2 * Math.PI; + } + if (sweepFlag === 1 && dTheta < 0) { + dTheta = dTheta + 2 * Math.PI; + } + return { + cx: cx, + cy: cy, + // 弧形的起点和终点相同时，长轴和短轴的长度按 0 处理 + rx: isSamePoint$1(startPoint, [x2, y2]) ? 0 : rx, + ry: isSamePoint$1(startPoint, [x2, y2]) ? 0 : ry, + startAngle: theta, + endAngle: theta + dTheta, + xRotation: xRotation, + arcFlag: arcFlag, + sweepFlag: sweepFlag, + }; +} + +// 点对称 +function toSymmetry(point, center) { + return [center[0] + (center[0] - point[0]), center[1] + (center[1] - point[1])]; +} +function getSegments(path) { + path = parsePath(path); + var segments = []; + var currentPoint = null; // 当前图形 + var nextParams = null; // 下一节点的 path 参数 + var startMovePoint = null; // 开始 M 的点，可能会有多个 + var lastStartMovePointIndex = 0; // 最近一个开始点 M 的索引 + var count = path.length; + for (var i = 0; i < count; i++) { + var params = path[i]; + nextParams = path[i + 1]; + var command = params[0]; + // 数学定义上的参数，便于后面的计算 + var segment = { + command: command, + prePoint: currentPoint, + params: params, + startTangent: null, + endTangent: null, + }; + switch (command) { + case 'M': + startMovePoint = [params[1], params[2]]; + lastStartMovePointIndex = i; + break; + case 'A': + var arcParams = getArcParams$1(currentPoint, params); + segment['arcParams'] = arcParams; + break; + } + if (command === 'Z') { + // 有了 Z 后，当前节点从开始 M 的点开始 + currentPoint = startMovePoint; + // 如果当前点的命令为 Z，相当于当前点为最近一个 M 点，则下一个点直接指向最近一个 M 点的下一个点 + nextParams = path[lastStartMovePointIndex + 1]; + } + else { + var len = params.length; + currentPoint = [params[len - 2], params[len - 1]]; + } + if (nextParams && nextParams[0] === 'Z') { + // 如果下一个点的命令为 Z，则下一个点直接指向最近一个 M 点 + nextParams = path[lastStartMovePointIndex]; + if (segments[lastStartMovePointIndex]) { + // 如果下一个点的命令为 Z，则最近一个 M 点的前一个点为当前点 + segments[lastStartMovePointIndex].prePoint = currentPoint; + } + } + segment['currentPoint'] = currentPoint; + // 如果当前点与最近一个 M 点相同，则最近一个 M 点的前一个点为当前点的前一个点 + if (segments[lastStartMovePointIndex] && + isSamePoint$1(currentPoint, segments[lastStartMovePointIndex].currentPoint)) { + segments[lastStartMovePointIndex].prePoint = segment.prePoint; + } + var nextPoint = nextParams ? [nextParams[nextParams.length - 2], nextParams[nextParams.length - 1]] : null; + segment['nextPoint'] = nextPoint; + // Add startTangent and endTangent + var prePoint = segment.prePoint; + if (['L', 'H', 'V'].includes(command)) { + segment.startTangent = [prePoint[0] - currentPoint[0], prePoint[1] - currentPoint[1]]; + segment.endTangent = [currentPoint[0] - prePoint[0], currentPoint[1] - prePoint[1]]; + } + else if (command === 'Q') { + // 二次贝塞尔曲线只有一个控制点 + var cp = [params[1], params[2]]; + // 二次贝塞尔曲线的终点为 currentPoint + segment.startTangent = [prePoint[0] - cp[0], prePoint[1] - cp[1]]; + segment.endTangent = [currentPoint[0] - cp[0], currentPoint[1] - cp[1]]; + } + else if (command === 'T') { + var preSegment = segments[i - 1]; + var cp = toSymmetry(preSegment.currentPoint, prePoint); + if (preSegment.command === 'Q') { + segment.command = 'Q'; + segment.startTangent = [prePoint[0] - cp[0], prePoint[1] - cp[1]]; + segment.endTangent = [currentPoint[0] - cp[0], currentPoint[1] - cp[1]]; + } + else { + segment.command = 'TL'; + segment.startTangent = [prePoint[0] - currentPoint[0], prePoint[1] - currentPoint[1]]; + segment.endTangent = [currentPoint[0] - prePoint[0], currentPoint[1] - prePoint[1]]; + } + } + else if (command === 'C') { + // 三次贝塞尔曲线有两个控制点 + var cp1 = [params[1], params[2]]; + var cp2 = [params[3], params[4]]; + segment.startTangent = [prePoint[0] - cp1[0], prePoint[1] - cp1[1]]; + segment.endTangent = [currentPoint[0] - cp2[0], currentPoint[1] - cp2[1]]; + // horizontal line, eg. ['C', 100, 100, 100, 100, 200, 200] + if (segment.startTangent[0] === 0 && segment.startTangent[1] === 0) { + segment.startTangent = [cp1[0] - cp2[0], cp1[1] - cp2[1]]; + } + if (segment.endTangent[0] === 0 && segment.endTangent[1] === 0) { + segment.endTangent = [cp2[0] - cp1[0], cp2[1] - cp1[1]]; + } + } + else if (command === 'S') { + var preSegment = segments[i - 1]; + var cp1 = toSymmetry(preSegment.currentPoint, prePoint); + var cp2 = [params[1], params[2]]; + if (preSegment.command === 'C') { + segment.command = 'C'; // 将 S 命令变换为 C 命令 + segment.startTangent = [prePoint[0] - cp1[0], prePoint[1] - cp1[1]]; + segment.endTangent = [currentPoint[0] - cp2[0], currentPoint[1] - cp2[1]]; + } + else { + segment.command = 'SQ'; // 将 S 命令变换为 SQ 命令 + segment.startTangent = [prePoint[0] - cp2[0], prePoint[1] - cp2[1]]; + segment.endTangent = [currentPoint[0] - cp2[0], currentPoint[1] - cp2[1]]; + } + } + else if (command === 'A') { + var d = 0.001; + var _a = segment['arcParams'] || {}, _b = _a.cx, cx = _b === void 0 ? 0 : _b, _c = _a.cy, cy = _c === void 0 ? 0 : _c, _d = _a.rx, rx = _d === void 0 ? 0 : _d, _e = _a.ry, ry = _e === void 0 ? 0 : _e, _f = _a.sweepFlag, sweepFlag = _f === void 0 ? 0 : _f, _g = _a.startAngle, startAngle = _g === void 0 ? 0 : _g, _h = _a.endAngle, endAngle = _h === void 0 ? 0 : _h; + if (sweepFlag === 0) { + d *= -1; + } + var dx1 = rx * Math.cos(startAngle - d) + cx; + var dy1 = ry * Math.sin(startAngle - d) + cy; + segment.startTangent = [dx1 - startMovePoint[0], dy1 - startMovePoint[1]]; + var dx2 = rx * Math.cos(startAngle + endAngle + d) + cx; + var dy2 = ry * Math.sin(startAngle + endAngle - d) + cy; + segment.endTangent = [prePoint[0] - dx2, prePoint[1] - dy2]; + } + segments.push(segment); + } + return segments; +} + +var isBetween$3 = function (value, min, max) { return value >= min && value <= max; }; +function getLineIntersect$1(p0, p1, p2, p3) { + var tolerance = 0.001; + var E = { + x: p2.x - p0.x, + y: p2.y - p0.y, + }; + var D0 = { + x: p1.x - p0.x, + y: p1.y - p0.y, + }; + var D1 = { + x: p3.x - p2.x, + y: p3.y - p2.y, + }; + var kross = D0.x * D1.y - D0.y * D1.x; + var sqrKross = kross * kross; + var sqrLen0 = D0.x * D0.x + D0.y * D0.y; + var sqrLen1 = D1.x * D1.x + D1.y * D1.y; + var point = null; + if (sqrKross > tolerance * sqrLen0 * sqrLen1) { + var s = (E.x * D1.y - E.y * D1.x) / kross; + var t = (E.x * D0.y - E.y * D0.x) / kross; + if (isBetween$3(s, 0, 1) && isBetween$3(t, 0, 1)) { + point = { + x: p0.x + s * D0.x, + y: p0.y + s * D0.y, + }; + } + } + return point; +} + +/** + * @fileoverview 判断点是否在多边形内 + * @author dxq613@gmail.com + */ +// 多边形的射线检测，参考：https://blog.csdn.net/WilliamSun0122/article/details/77994526 +var tolerance$1 = 1e-6; +// 三态函数，判断两个double在eps精度下的大小关系 +function dcmp$1(x) { + if (Math.abs(x) < tolerance$1) { + return 0; + } + return x < 0 ? -1 : 1; +} +// 判断点Q是否在p1和p2的线段上 +function onSegment$2(p1, p2, q) { + if ((q[0] - p1[0]) * (p2[1] - p1[1]) === (p2[0] - p1[0]) * (q[1] - p1[1]) && + Math.min(p1[0], p2[0]) <= q[0] && + q[0] <= Math.max(p1[0], p2[0]) && + Math.min(p1[1], p2[1]) <= q[1] && + q[1] <= Math.max(p1[1], p2[1])) { + return true; + } + return false; +} +// 判断点P在多边形内-射线法 +function isInPolygon$1(points, x, y) { + var isHit = false; + var n = points.length; + if (n <= 2) { + // svg 中点小于 3 个时，不显示，也无法被拾取 + return false; + } + for (var i = 0; i < n; i++) { + var p1 = points[i]; + var p2 = points[(i + 1) % n]; + if (onSegment$2(p1, p2, [x, y])) { + // 点在多边形一条边上 + return true; + } + // 前一个判断min(p1[1],p2[1]) 0 !== dcmp$1(p2[1] - y) > 0 && + dcmp$1(x - ((y - p1[1]) * (p1[0] - p2[0])) / (p1[1] - p2[1]) - p1[0]) < 0) { + isHit = !isHit; + } + } + return isHit; +} + +function parseToLines(points) { + var lines = []; + var count = points.length; + for (var i = 0; i < count - 1; i++) { + var point = points[i]; + var next = points[i + 1]; + lines.push({ + from: { + x: point[0], + y: point[1] + }, + to: { + x: next[0], + y: next[1] + } + }); + } + if (lines.length > 1) { + var first = points[0]; + var last = points[count - 1]; + lines.push({ + from: { + x: last[0], + y: last[1] + }, + to: { + x: first[0], + y: first[1] + } + }); + } + return lines; +} +function lineIntersectPolygon$1(lines, line) { + var isIntersect = false; + each$2(lines, function (l) { + if (getLineIntersect$1(l.from, l.to, line.from, line.to)) { + isIntersect = true; + return false; + } + }); + return isIntersect; +} +function getBBox$2(points) { + var xArr = points.map(function (p) { return p[0]; }); + var yArr = points.map(function (p) { return p[1]; }); + return { + minX: Math.min.apply(null, xArr), + maxX: Math.max.apply(null, xArr), + minY: Math.min.apply(null, yArr), + maxY: Math.max.apply(null, yArr) + }; +} +function intersectBBox$2(box1, box2) { + return !(box2.minX > box1.maxX || box2.maxX < box1.minX || box2.minY > box1.maxY || box2.maxY < box1.minY); +} +function isPolygonsIntersect$2(points1, points2) { + // 空数组，或者一个点返回 false + if (points1.length < 2 || points2.length < 2) { + return false; + } + var bbox1 = getBBox$2(points1); + var bbox2 = getBBox$2(points2); + // 判定包围盒是否相交，比判定点是否在多边形内要快的多，可以筛选掉大多数情况 + if (!intersectBBox$2(bbox1, bbox2)) { + return false; + } + var isIn = false; + // 判定点是否在多边形内部，一旦有一个点在另一个多边形内，则返回 + each$2(points2, function (point) { + if (isInPolygon$1(points1, point[0], point[1])) { + isIn = true; + return false; + } + }); + if (isIn) { + return true; + } + // 两个多边形都需要判定 + each$2(points1, function (point) { + if (isInPolygon$1(points2, point[0], point[1])) { + isIn = true; + return false; + } + }); + if (isIn) { + return true; + } + var lines1 = parseToLines(points1); + var lines2 = parseToLines(points2); + var isIntersect = false; + each$2(lines2, function (line) { + if (lineIntersectPolygon$1(lines1, line)) { + isIntersect = true; + return false; + } + }); + return isIntersect; +} + +function getPathBox$1(segments, lineWidth) { + var xArr = []; + var yArr = []; + var segmentsWithAngle = []; + for (var i = 0; i < segments.length; i++) { + var segment = segments[i]; + var currentPoint = segment.currentPoint, params = segment.params, prePoint = segment.prePoint; + var box = void 0; + switch (segment.command) { + case 'Q': + box = QuadUtil.box(prePoint[0], prePoint[1], params[1], params[2], params[3], params[4]); + break; + case 'C': + box = CubicUtil.box(prePoint[0], prePoint[1], params[1], params[2], params[3], params[4], params[5], params[6]); + break; + case 'A': + var arcParams = segment.arcParams; + box = EllipseArcUtil.box(arcParams.cx, arcParams.cy, arcParams.rx, arcParams.ry, arcParams.xRotation, arcParams.startAngle, arcParams.endAngle); + break; + default: + xArr.push(currentPoint[0]); + yArr.push(currentPoint[1]); + break; + } + if (box) { + segment.box = box; + xArr.push(box.x, box.x + box.width); + yArr.push(box.y, box.y + box.height); + } + if (lineWidth && (segment.command === 'L' || segment.command === 'M') && segment.prePoint && segment.nextPoint) { + segmentsWithAngle.push(segment); + } + } + // bbox calculation should ignore NaN for path attribute + // ref: https://github.com/antvis/g/issues/210 + xArr = xArr.filter(function (item) { return !Number.isNaN(item); }); + yArr = yArr.filter(function (item) { return !Number.isNaN(item); }); + var minX = min$6(xArr); + var minY = min$6(yArr); + var maxX = max$7(xArr); + var maxY = max$7(yArr); + if (segmentsWithAngle.length === 0) { + return { + x: minX, + y: minY, + width: maxX - minX, + height: maxY - minY, + }; + } + for (var i = 0; i < segmentsWithAngle.length; i++) { + var segment = segmentsWithAngle[i]; + var currentPoint = segment.currentPoint; + var extra = void 0; + if (currentPoint[0] === minX) { + extra = getExtraFromSegmentWithAngle$1(segment, lineWidth); + minX = minX - extra.xExtra; + } + else if (currentPoint[0] === maxX) { + extra = getExtraFromSegmentWithAngle$1(segment, lineWidth); + maxX = maxX + extra.xExtra; + } + if (currentPoint[1] === minY) { + extra = getExtraFromSegmentWithAngle$1(segment, lineWidth); + minY = minY - extra.yExtra; + } + else if (currentPoint[1] === maxY) { + extra = getExtraFromSegmentWithAngle$1(segment, lineWidth); + maxY = maxY + extra.yExtra; + } + } + return { + x: minX, + y: minY, + width: maxX - minX, + height: maxY - minY, + }; +} +function getExtraFromSegmentWithAngle$1(segment, lineWidth) { + var prePoint = segment.prePoint, currentPoint = segment.currentPoint, nextPoint = segment.nextPoint; + var currentAndPre = Math.pow(currentPoint[0] - prePoint[0], 2) + Math.pow(currentPoint[1] - prePoint[1], 2); + var currentAndNext = Math.pow(currentPoint[0] - nextPoint[0], 2) + Math.pow(currentPoint[1] - nextPoint[1], 2); + var preAndNext = Math.pow(prePoint[0] - nextPoint[0], 2) + Math.pow(prePoint[1] - nextPoint[1], 2); + // 以 currentPoint 为顶点的夹角 + var currentAngle = Math.acos((currentAndPre + currentAndNext - preAndNext) / (2 * Math.sqrt(currentAndPre) * Math.sqrt(currentAndNext))); + // 夹角为空、 0 或 PI 时，不需要计算夹角处的额外宽度 + // 注意: 由于计算精度问题，夹角为 0 的情况计算出来的角度可能是一个很小的值，还需要判断其与 0 是否近似相等 + if (!currentAngle || Math.sin(currentAngle) === 0 || isNumberEqual$1(currentAngle, 0)) { + return { + xExtra: 0, + yExtra: 0, + }; + } + var xAngle = Math.abs(Math.atan2(nextPoint[1] - currentPoint[1], nextPoint[0] - currentPoint[0])); + var yAngle = Math.abs(Math.atan2(nextPoint[0] - currentPoint[0], nextPoint[1] - currentPoint[1])); + // 将夹角转为锐角 + xAngle = xAngle > Math.PI / 2 ? Math.PI - xAngle : xAngle; + yAngle = yAngle > Math.PI / 2 ? Math.PI - yAngle : yAngle; + // 这里不考虑在水平和垂直方向的投影，直接使用最大差值 + // 由于上层统一加减了二分之一线宽，这里需要进行弥补 + var extra = { + // 水平方向投影 + xExtra: Math.cos(currentAngle / 2 - xAngle) * ((lineWidth / 2) * (1 / Math.sin(currentAngle / 2))) - lineWidth / 2 || 0, + // 垂直方向投影 + yExtra: Math.cos(yAngle - currentAngle / 2) * ((lineWidth / 2) * (1 / Math.sin(currentAngle / 2))) - lineWidth / 2 || 0, + }; + return extra; +} +function path$1 (shape) { + var attrs = shape.attr(); + var path = attrs.path, stroke = attrs.stroke; + var lineWidth = stroke ? attrs.lineWidth : 0; // 只有有 stroke 时，lineWidth 才生效 + var segments = shape.get('segments') || getSegments(path); + var _a = getPathBox$1(segments, lineWidth), x = _a.x, y = _a.y, width = _a.width, height = _a.height; + var bbox = { + minX: x, + minY: y, + maxX: x + width, + maxY: y + height, + }; + bbox = mergeArrowBBox$1(shape, bbox); + return { + x: bbox.minX, + y: bbox.minY, + width: bbox.maxX - bbox.minX, + height: bbox.maxY - bbox.minY, + }; +} + +function line$2 (shape) { + var attrs = shape.attr(); + var x1 = attrs.x1, y1 = attrs.y1, x2 = attrs.x2, y2 = attrs.y2; + var minX = Math.min(x1, x2); + var maxX = Math.max(x1, x2); + var minY = Math.min(y1, y2); + var maxY = Math.max(y1, y2); + var bbox = { + minX: minX, + maxX: maxX, + minY: minY, + maxY: maxY, + }; + bbox = mergeArrowBBox$1(shape, bbox); + return { + x: bbox.minX, + y: bbox.minY, + width: bbox.maxX - bbox.minX, + height: bbox.maxY - bbox.minY, + }; +} + +function ellipse$1 (shape) { + var attrs = shape.attr(); + var x = attrs.x, y = attrs.y, rx = attrs.rx, ry = attrs.ry; + return { + x: x - rx, + y: y - ry, + width: rx * 2, + height: ry * 2, + }; +} + +register$1('rect', rect$2); +register$1('image', rect$2); // image 使用 rect 的包围盒计算 +register$1('circle', circle$2); +register$1('marker', circle$2); // marker 使用 circle 的计算方案 +register$1('polyline', polyline$1); +register$1('polygon', polygon$2); +register$1('text', text$1); +register$1('path', path$1); +register$1('line', line$2); +register$1('ellipse', ellipse$1); + +var DEFAULT_Y = 0; // 默认的 y 的值 +// 偏移之后，间距 +var MARGIN_RATIO = 1 / 2; +var DODGE_RATIO = 1 / 2; +// 散点分开之后，距离边界的距离 +var GAP = 0.05; + +var Adjust = /** @class */ (function () { + function Adjust(cfg) { + var xField = cfg.xField, yField = cfg.yField, _a = cfg.adjustNames, adjustNames = _a === void 0 ? ['x', 'y'] : _a; + this.adjustNames = adjustNames; + this.xField = xField; + this.yField = yField; + } + /** + * 查看维度是否是 adjust 字段 + * @param dim + */ + Adjust.prototype.isAdjust = function (dim) { + return this.adjustNames.indexOf(dim) >= 0; + }; + Adjust.prototype.getAdjustRange = function (dim, dimValue, values) { + var yField = this.yField; + var index = values.indexOf(dimValue); + var length = values.length; + var pre; + var next; + // 没有 y 字段，但是需要根据 y 调整 + if (!yField && this.isAdjust('y')) { + pre = 0; + next = 1; + } + else if (length > 1) { + // 如果以其开头，则取之，否则取他前面一个 + pre = values[index === 0 ? 0 : index - 1]; + // 如果以其结尾，则取之，否则取他后面一个 + next = values[index === length - 1 ? length - 1 : index + 1]; + if (index !== 0) { + pre += (dimValue - pre) / 2; + } + else { + pre -= (next - dimValue) / 2; + } + if (index !== length - 1) { + next -= (next - dimValue) / 2; + } + else { + next += (dimValue - values[length - 2]) / 2; + } + } + else { + pre = dimValue === 0 ? 0 : dimValue - 0.5; + next = dimValue === 0 ? 1 : dimValue + 0.5; + } + return { + pre: pre, + next: next, + }; + }; + Adjust.prototype.adjustData = function (groupedDataArray, mergedData) { + var _this = this; + // 所有调整维度的值数组 + var dimValuesMap = this.getDimValues(mergedData); + // 按照每一个分组来进行调整 + each$2(groupedDataArray, function (dataArray, index) { + // 遍历所有数据集合 + // 每个分组中，分别按照不同的 dim 进行调整 + each$2(dimValuesMap, function (values, dim) { + // 根据不同的度量分别调整位置 + _this.adjustDim(dim, values, dataArray, index); + }); + }); + }; + /** + * 对数据进行分组adjustData + * @param data 数据 + * @param dim 分组的字段 + * @return 分组结果 + */ + Adjust.prototype.groupData = function (data, dim) { + // 补齐数据空数据为默认值 + each$2(data, function (record) { + if (record[dim] === undefined) { + record[dim] = DEFAULT_Y; + } + }); + // 按照 dim 维度分组 + return groupBy(data, dim); + }; + /** @override */ + Adjust.prototype.adjustDim = function (dim, values, data, index) { }; + /** + * 获取可调整度量对应的值 + * @param mergedData 数据 + * @return 值的映射 + */ + Adjust.prototype.getDimValues = function (mergedData) { + var _a = this, xField = _a.xField, yField = _a.yField; + var dimValuesMap = {}; + // 所有的维度 + var dims = []; + if (xField && this.isAdjust('x')) { + dims.push(xField); + } + if (yField && this.isAdjust('y')) { + dims.push(yField); + } + dims.forEach(function (dim) { + // 在每个维度上，所有的值 + dimValuesMap[dim] = valuesOfKey(mergedData, dim).sort(function (v1, v2) { return v1 - v2; }); + }); + // 只有一维的情况下，同时调整 y，赋予默认值 + if (!yField && this.isAdjust('y')) { + var dim = 'y'; + dimValuesMap[dim] = [DEFAULT_Y, 1]; // 默认分布在 y 轴的 0 与 1 之间 + } + return dimValuesMap; + }; + return Adjust; +}()); + +var ADJUST_MAP = {}; +/** + * 根据类型获取 Adjust 类 + * @param type + */ +var getAdjust = function (type) { + return ADJUST_MAP[type.toLowerCase()]; +}; +/** + * 注册自定义 Adjust + * @param type + * @param ctor + */ +var registerAdjust = function (type, ctor) { + // 注册的时候，需要校验 type 重名，不区分大小写 + if (getAdjust(type)) { + throw new Error("Adjust type '" + type + "' existed."); + } + // 存储到 map 中 + ADJUST_MAP[type.toLowerCase()] = ctor; +}; + +/*! ***************************************************************************** +Copyright (c) Microsoft Corporation. + +Permission to use, copy, modify, and/or distribute this software for any +purpose with or without fee is hereby granted. + +THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH +REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY +AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, +INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM +LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR +OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR +PERFORMANCE OF THIS SOFTWARE. +***************************************************************************** */ +/* global Reflect, Promise */ + +var extendStatics$1 = function(d, b) { + extendStatics$1 = Object.setPrototypeOf || + ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) || + function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; }; + return extendStatics$1(d, b); +}; + +function __extends$d(d, b) { + extendStatics$1(d, b); + function __() { this.constructor = d; } + d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); +} + +var __assign$q = function() { + __assign$q = Object.assign || function __assign(t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; + } + return t; + }; + return __assign$q.apply(this, arguments); +}; + +var Dodge = /** @class */ (function (_super) { + __extends$d(Dodge, _super); + function Dodge(cfg) { + var _this = _super.call(this, cfg) || this; + _this.cacheMap = {}; + _this.adjustDataArray = []; + _this.mergeData = []; + var _a = cfg.marginRatio, marginRatio = _a === void 0 ? MARGIN_RATIO : _a, _b = cfg.dodgeRatio, dodgeRatio = _b === void 0 ? DODGE_RATIO : _b, dodgeBy = cfg.dodgeBy, intervalPadding = cfg.intervalPadding, dodgePadding = cfg.dodgePadding, xDimensionLength = cfg.xDimensionLength, groupNum = cfg.groupNum, defaultSize = cfg.defaultSize, maxColumnWidth = cfg.maxColumnWidth, minColumnWidth = cfg.minColumnWidth, columnWidthRatio = cfg.columnWidthRatio; + _this.marginRatio = marginRatio; + _this.dodgeRatio = dodgeRatio; + _this.dodgeBy = dodgeBy; + _this.intervalPadding = intervalPadding; + _this.dodgePadding = dodgePadding; + _this.xDimensionLegenth = xDimensionLength; + _this.groupNum = groupNum; + _this.defaultSize = defaultSize; + _this.maxColumnWidth = maxColumnWidth; + _this.minColumnWidth = minColumnWidth; + _this.columnWidthRatio = columnWidthRatio; + return _this; + } + Dodge.prototype.process = function (groupDataArray) { + var groupedDataArray = clone$7(groupDataArray); + // 将数据数组展开一层 + var mergeData = flatten$2(groupedDataArray); + var dodgeBy = this.dodgeBy; + // 如果指定了分组 dim 的字段 + var adjustDataArray = dodgeBy ? group$1(mergeData, dodgeBy) : groupedDataArray; + this.cacheMap = {}; + this.adjustDataArray = adjustDataArray; + this.mergeData = mergeData; + this.adjustData(adjustDataArray, mergeData); + this.adjustDataArray = []; + this.mergeData = []; + return groupedDataArray; + }; + Dodge.prototype.adjustDim = function (dim, values, data, frameIndex) { + var _this = this; + var map = this.getDistribution(dim); + var groupData = this.groupData(data, dim); // 根据值分组 + each$2(groupData, function (group, key) { + var range; + // xField 中只有一个值，不需要做 dodge + if (values.length === 1) { + range = { + pre: values[0] - 1, + next: values[0] + 1, + }; + } + else { + // 如果有多个，则需要获取调整的范围 + range = _this.getAdjustRange(dim, parseFloat(key), values); + } + each$2(group, function (d) { + var value = d[dim]; + var valueArr = map[value]; + var valIndex = valueArr.indexOf(frameIndex); + d[dim] = _this.getDodgeOffset(range, valIndex, valueArr.length); + }); + }); + return []; + }; + Dodge.prototype.getDodgeOffset = function (range, idx, len) { + var _a = this, dodgeRatio = _a.dodgeRatio, marginRatio = _a.marginRatio, intervalPadding = _a.intervalPadding, dodgePadding = _a.dodgePadding; + var pre = range.pre, next = range.next; + var tickLength = next - pre; + var position; + // 分多种输入情况 + if (!isNil(intervalPadding) && isNil(dodgePadding) && intervalPadding >= 0) { + // 仅配置intervalPadding + var offset = this.getIntervalOnlyOffset(len, idx); + position = pre + offset; + } + else if (!isNil(dodgePadding) && isNil(intervalPadding) && dodgePadding >= 0) { + // 仅配置dodgePadding + var offset = this.getDodgeOnlyOffset(len, idx); + position = pre + offset; + } + else if (!isNil(intervalPadding) && + !isNil(dodgePadding) && + intervalPadding >= 0 && + dodgePadding >= 0) { + // 同时配置intervalPadding和dodgePadding + var offset = this.getIntervalAndDodgeOffset(len, idx); + position = pre + offset; + } + else { + // 默认情况 + var width = (tickLength * dodgeRatio) / len; + var margin = marginRatio * width; + var offset = (1 / 2) * (tickLength - len * width - (len - 1) * margin) + + ((idx + 1) * width + idx * margin) - + (1 / 2) * width - + (1 / 2) * tickLength; + position = (pre + next) / 2 + offset; + } + return position; + }; + Dodge.prototype.getIntervalOnlyOffset = function (len, idx) { + var _a = this, defaultSize = _a.defaultSize, intervalPadding = _a.intervalPadding, xDimensionLegenth = _a.xDimensionLegenth, groupNum = _a.groupNum, dodgeRatio = _a.dodgeRatio, maxColumnWidth = _a.maxColumnWidth, minColumnWidth = _a.minColumnWidth, columnWidthRatio = _a.columnWidthRatio; + var normalizedIntervalPadding = intervalPadding / xDimensionLegenth; + var normalizedDodgePadding = (1 - (groupNum - 1) * normalizedIntervalPadding) / groupNum * dodgeRatio / (len - 1); + var geomWidth = ((1 - normalizedIntervalPadding * (groupNum - 1)) / groupNum - normalizedDodgePadding * (len - 1)) / len; + // 根据columnWidthRatio/defaultSize/maxColumnWidth/minColumnWidth调整宽度 + geomWidth = (!isNil(columnWidthRatio)) ? 1 / groupNum / len * columnWidthRatio : geomWidth; + if (!isNil(maxColumnWidth)) { + var normalizedMaxWidht = maxColumnWidth / xDimensionLegenth; + geomWidth = Math.min(geomWidth, normalizedMaxWidht); + } + if (!isNil(minColumnWidth)) { + var normalizedMinWidht = minColumnWidth / xDimensionLegenth; + geomWidth = Math.max(geomWidth, normalizedMinWidht); + } + geomWidth = defaultSize ? (defaultSize / xDimensionLegenth) : geomWidth; + // 调整组内间隔 + normalizedDodgePadding = ((1 - (groupNum - 1) * normalizedIntervalPadding) / groupNum - len * geomWidth) / (len - 1); + var offset = ((1 / 2 + idx) * geomWidth + idx * normalizedDodgePadding + + (1 / 2) * normalizedIntervalPadding) * groupNum - + normalizedIntervalPadding / 2; + return offset; + }; + Dodge.prototype.getDodgeOnlyOffset = function (len, idx) { + var _a = this, defaultSize = _a.defaultSize, dodgePadding = _a.dodgePadding, xDimensionLegenth = _a.xDimensionLegenth, groupNum = _a.groupNum, marginRatio = _a.marginRatio, maxColumnWidth = _a.maxColumnWidth, minColumnWidth = _a.minColumnWidth, columnWidthRatio = _a.columnWidthRatio; + var normalizedDodgePadding = dodgePadding / xDimensionLegenth; + var normalizedIntervalPadding = 1 * marginRatio / (groupNum - 1); + var geomWidth = ((1 - normalizedIntervalPadding * (groupNum - 1)) / groupNum - normalizedDodgePadding * (len - 1)) / len; + // 根据columnWidthRatio/defaultSize/maxColumnWidth/minColumnWidth调整宽度 + geomWidth = columnWidthRatio ? 1 / groupNum / len * columnWidthRatio : geomWidth; + if (!isNil(maxColumnWidth)) { + var normalizedMaxWidht = maxColumnWidth / xDimensionLegenth; + geomWidth = Math.min(geomWidth, normalizedMaxWidht); + } + if (!isNil(minColumnWidth)) { + var normalizedMinWidht = minColumnWidth / xDimensionLegenth; + geomWidth = Math.max(geomWidth, normalizedMinWidht); + } + geomWidth = defaultSize ? (defaultSize / xDimensionLegenth) : geomWidth; + // 调整组间距 + normalizedIntervalPadding = (1 - (geomWidth * len + normalizedDodgePadding * (len - 1)) * groupNum) / (groupNum - 1); + var offset = ((1 / 2 + idx) * geomWidth + idx * normalizedDodgePadding + + (1 / 2) * normalizedIntervalPadding) * groupNum - + normalizedIntervalPadding / 2; + return offset; + }; + Dodge.prototype.getIntervalAndDodgeOffset = function (len, idx) { + var _a = this, intervalPadding = _a.intervalPadding, dodgePadding = _a.dodgePadding, xDimensionLegenth = _a.xDimensionLegenth, groupNum = _a.groupNum; + var normalizedIntervalPadding = intervalPadding / xDimensionLegenth; + var normalizedDodgePadding = dodgePadding / xDimensionLegenth; + var geomWidth = ((1 - normalizedIntervalPadding * (groupNum - 1)) / groupNum - normalizedDodgePadding * (len - 1)) / len; + var offset = ((1 / 2 + idx) * geomWidth + idx * normalizedDodgePadding + + (1 / 2) * normalizedIntervalPadding) * groupNum - + normalizedIntervalPadding / 2; + return offset; + }; + Dodge.prototype.getDistribution = function (dim) { + var groupedDataArray = this.adjustDataArray; + var cacheMap = this.cacheMap; + var map = cacheMap[dim]; + if (!map) { + map = {}; + each$2(groupedDataArray, function (data, index) { + var values = valuesOfKey(data, dim); + if (!values.length) { + values.push(0); + } + each$2(values, function (val) { + if (!map[val]) { + map[val] = []; + } + map[val].push(index); + }); + }); + cacheMap[dim] = map; + } + return map; + }; + return Dodge; +}(Adjust)); + +function randomNumber(min, max) { + return (max - min) * Math.random() + min; +} +var Jitter = /** @class */ (function (_super) { + __extends$d(Jitter, _super); + function Jitter() { + return _super !== null && _super.apply(this, arguments) || this; + } + Jitter.prototype.process = function (groupDataArray) { + var groupedDataArray = clone$7(groupDataArray); + // 之前分组之后的数据，然后有合并回去（和分组前可以理解成是一样的） + var mergeData = flatten$2(groupedDataArray); + // 返回值 + this.adjustData(groupedDataArray, mergeData); + return groupedDataArray; + }; + /** + * 当前数据分组（index）中，按照维度 dim 进行 jitter 调整 + * @param dim + * @param values + * @param dataArray + */ + Jitter.prototype.adjustDim = function (dim, values, dataArray) { + var _this = this; + // 在每一个分组中，将数据再按照 dim 分组，用于散列 + var groupDataArray = this.groupData(dataArray, dim); + return each$2(groupDataArray, function (data, dimValue) { + return _this.adjustGroup(data, dim, parseFloat(dimValue), values); + }); + }; + // 随机出来的字段值 + Jitter.prototype.getAdjustOffset = function (range) { + var pre = range.pre, next = range.next; + // 随机的范围 + var margin = (next - pre) * GAP; + return randomNumber(pre + margin, next - margin); + }; + // adjust group data + Jitter.prototype.adjustGroup = function (group, dim, dimValue, values) { + var _this = this; + // 调整范围 + var range = this.getAdjustRange(dim, dimValue, values); + each$2(group, function (data) { + data[dim] = _this.getAdjustOffset(range); // 获取调整的位置 + }); + return group; + }; + return Jitter; +}(Adjust)); + +var Cache = default_1; +var Stack$6 = /** @class */ (function (_super) { + __extends$d(Stack, _super); + function Stack(cfg) { + var _this = _super.call(this, cfg) || this; + var _a = cfg.adjustNames, adjustNames = _a === void 0 ? ['y'] : _a, _b = cfg.height, height = _b === void 0 ? NaN : _b, _c = cfg.size, size = _c === void 0 ? 10 : _c, _d = cfg.reverseOrder, reverseOrder = _d === void 0 ? false : _d; + _this.adjustNames = adjustNames; + _this.height = height; + _this.size = size; + _this.reverseOrder = reverseOrder; + return _this; + } + /** + * 方法入参是经过数据分组、数据数字化之后的二维数组 + * @param groupDataArray 分组之后的数据 + */ + Stack.prototype.process = function (groupDataArray) { + var _a = this, yField = _a.yField, reverseOrder = _a.reverseOrder; + // 如果有指定 y 字段，那么按照 y 字段来 stack + // 否则，按照高度均分 + var d = yField ? this.processStack(groupDataArray) : this.processOneDimStack(groupDataArray); + return reverseOrder ? this.reverse(d) : d; + }; + Stack.prototype.reverse = function (groupedDataArray) { + return groupedDataArray.slice(0).reverse(); + }; + Stack.prototype.processStack = function (groupDataArray) { + var _a = this, xField = _a.xField, yField = _a.yField, reverseOrder = _a.reverseOrder; + // 层叠顺序翻转 + var groupedDataArray = reverseOrder ? this.reverse(groupDataArray) : groupDataArray; + // 用来缓存，正数和负数的堆叠问题 + var positive = new Cache(); + var negative = new Cache(); + return groupedDataArray.map(function (dataArray) { + return dataArray.map(function (data) { + var _a; + var x = get$3(data, xField, 0); + var y = get$3(data, [yField]); + var xKey = x.toString(); + // todo 是否应该取 _origin？因为 y 可能取到的值不正确，比如先 symmetric，再 stack！ + y = isArray$n(y) ? y[1] : y; + if (!isNil(y)) { + var cache = y >= 0 ? positive : negative; + if (!cache.has(xKey)) { + cache.set(xKey, 0); + } + var xValue = cache.get(xKey); + var newXValue = y + xValue; + // 存起来 + cache.set(xKey, newXValue); + return __assign$q(__assign$q({}, data), (_a = {}, _a[yField] = [xValue, newXValue], _a)); + } + // 没有修改，则直接返回 + return data; + }); + }); + }; + Stack.prototype.processOneDimStack = function (groupDataArray) { + var _this = this; + var _a = this, xField = _a.xField, height = _a.height, reverseOrder = _a.reverseOrder; + var yField = 'y'; + // 如果层叠的顺序翻转 + var groupedDataArray = reverseOrder ? this.reverse(groupDataArray) : groupDataArray; + // 缓存累加数据 + var cache = new Cache(); + return groupedDataArray.map(function (dataArray) { + return dataArray.map(function (data) { + var _a; + var size = _this.size; + var xValue = data[xField]; + // todo 没有看到这个 stack 计算原理 + var stackHeight = (size * 2) / height; + if (!cache.has(xValue)) { + cache.set(xValue, stackHeight / 2); // 初始值大小 + } + var stackValue = cache.get(xValue); + // 增加一层 stackHeight + cache.set(xValue, stackValue + stackHeight); + return __assign$q(__assign$q({}, data), (_a = {}, _a[yField] = stackValue, _a)); + }); + }); + }; + return Stack; +}(Adjust)); + +var Symmetric = /** @class */ (function (_super) { + __extends$d(Symmetric, _super); + function Symmetric() { + return _super !== null && _super.apply(this, arguments) || this; + } + Symmetric.prototype.process = function (groupDataArray) { + var mergeData = flatten$2(groupDataArray); + var _a = this, xField = _a.xField, yField = _a.yField; + // 每个 x 值对应的 最大值 + var cache = this.getXValuesMaxMap(mergeData); + // 所有数据的最大的值 + var max = Math.max.apply(Math, Object.keys(cache).map(function (key) { return cache[key]; })); + return map$4(groupDataArray, function (dataArray) { + return map$4(dataArray, function (data) { + var _a, _b; + var yValue = data[yField]; + var xValue = data[xField]; + // 数组处理逻辑 + if (isArray$n(yValue)) { + var off_1 = (max - cache[xValue]) / 2; + return __assign$q(__assign$q({}, data), (_a = {}, _a[yField] = map$4(yValue, function (y) { return off_1 + y; }), _a)); + } + // 非数组处理逻辑 + var offset = (max - yValue) / 2; + return __assign$q(__assign$q({}, data), (_b = {}, _b[yField] = [offset, yValue + offset], _b)); + }); + }); + }; + // 获取每个 x 对应的最大的值 + Symmetric.prototype.getXValuesMaxMap = function (mergeData) { + var _this = this; + var _a = this, xField = _a.xField, yField = _a.yField; + // 根据 xField 的值进行分组 + var groupDataArray = groupBy(mergeData, function (data) { return data[xField]; }); + // 获取每个 xField 值中的最大值 + return mapValues$1(groupDataArray, function (dataArray) { return _this.getDimMaxValue(dataArray, yField); }); + }; + Symmetric.prototype.getDimMaxValue = function (mergeData, dim) { + // 所有的 value 值 + var dimValues = map$4(mergeData, function (data) { return get$3(data, dim, []); }); + // 将数组打平（dim value 有可能是数组，比如 stack 之后的） + var flattenValues = flatten$2(dimValues); + // 求出数组的最大值 + return Math.max.apply(Math, flattenValues); + }; + return Symmetric; +}(Adjust)); + +// 注册内置的 adjust +registerAdjust('Dodge', Dodge); +registerAdjust('Jitter', Jitter); +registerAdjust('Stack', Stack$6); +registerAdjust('Symmetric', Symmetric); + +// todo 这个到底目的是什么？ +var toScaleString = function (scale, value) { + if (isString$3(value)) { + return value; + } + return scale.invert(scale.scale(value)); +}; +/** + * 所有视觉通道属性的基类 + * @class Base + */ +var Attribute = /** @class */ (function () { + function Attribute(cfg) { + this.names = []; + this.scales = []; + this.linear = false; + this.values = []; + this.callback = function () { return []; }; + // 解析配置 + this._parseCfg(cfg); + } + /** + * 映射的值组成的数组 + * @param params 对应 scale 顺序的值传入 + */ + Attribute.prototype.mapping = function () { + var _this = this; + var params = []; + for (var _i = 0; _i < arguments.length; _i++) { + params[_i] = arguments[_i]; + } + var values = params.map(function (param, idx) { + return _this._toOriginParam(param, _this.scales[idx]); + }); + return this.callback.apply(this, values); + }; + /** + * 如果进行线性映射，返回对应的映射值 + * @param percent + */ + Attribute.prototype.getLinearValue = function (percent) { + // 分段数量 + var steps = this.values.length - 1; + var step = Math.floor(steps * percent); + var leftPercent = steps * percent - step; + // todo 不懂这个逻辑 + var start = this.values[step]; + var end = step === steps ? start : this.values[step + 1]; + // 线性方程 + return start + (end - start) * leftPercent; + }; + /** + * 根据度量获取属性名 + */ + Attribute.prototype.getNames = function () { + var scales = this.scales; + var names = this.names; + var length = Math.min(scales.length, names.length); + var rst = []; + for (var i = 0; i < length; i += 1) { + rst.push(names[i]); + } + return rst; + }; + /** + * 获取所有的维度名 + */ + Attribute.prototype.getFields = function () { + return this.scales.map(function (scale) { return scale.field; }); + }; + /** + * 根据名称获取度量 + * @param name + */ + Attribute.prototype.getScale = function (name) { + return this.scales[this.names.indexOf(name)]; + }; + /** + * 默认的回调函数（用户没有自定义 callback，或者用户自定义 callback 返回空的时候，使用 values 映射） + * @param params + */ + Attribute.prototype.defaultCallback = function () { + var _this = this; + var params = []; + for (var _i = 0; _i < arguments.length; _i++) { + params[_i] = arguments[_i]; + } + // 没有 params 的情况，是指没有指定 fields，直接返回配置的 values 常量 + if (params.length === 0) { + return this.values; + } + return params.map(function (param, idx) { + var scale = _this.scales[idx]; + return scale.type === 'identity' ? scale.values[0] : _this._getAttributeValue(scale, param); + }); + }; + // 解析配置 + Attribute.prototype._parseCfg = function (cfg) { + var _this = this; + var _a = cfg.type, type = _a === void 0 ? 'base' : _a, _b = cfg.names, names = _b === void 0 ? [] : _b, _c = cfg.scales, scales = _c === void 0 ? [] : _c, _d = cfg.values, values = _d === void 0 ? [] : _d, callback = cfg.callback; + this.type = type; + this.scales = scales; + this.values = values; + this.names = names; + // 构造 callback 方法 + this.callback = function () { + var params = []; + for (var _i = 0; _i < arguments.length; _i++) { + params[_i] = arguments[_i]; + } + /** + * 当用户设置的 callback 返回 null 时, 应该返回默认 callback 中的值 + */ + if (callback) { + // 使用用户返回的值处理 + var ret = callback.apply(void 0, params); + if (!isNil(ret)) { + return [ret]; + } + } + // 没有 callback 或者用户 callback 返回值为空，则使用默认的逻辑处理 + return _this.defaultCallback.apply(_this, params); + }; + }; + // 获取属性值，将值映射到视觉通道 + Attribute.prototype._getAttributeValue = function (scale, value) { + // 如果是非线性的字段，直接从 values 中取值即可 + if (scale.isCategory && !this.linear) { + // 离散 scale 变换成索引 + var idx = scale.translate(value); + return this.values[idx % this.values.length]; + } + // 线性则使用线性值 + var percent = scale.scale(value); + return this.getLinearValue(percent); + }; + /** + * 通过 scale 拿到数据对应的原始的参数 + * @param param + * @param scale + * @private + */ + Attribute.prototype._toOriginParam = function (param, scale) { + // 是线性，直接返回 + // 非线性，使用 scale 变换 + return !scale.isLinear + ? isArray$n(param) + ? param.map(function (p) { return toScaleString(scale, p); }) + : toScaleString(scale, param) + : param; + }; + return Attribute; +}()); + +/*! ***************************************************************************** +Copyright (c) Microsoft Corporation. + +Permission to use, copy, modify, and/or distribute this software for any +purpose with or without fee is hereby granted. + +THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH +REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY +AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, +INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM +LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR +OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR +PERFORMANCE OF THIS SOFTWARE. +***************************************************************************** */ +/* global Reflect, Promise */ + +var extendStatics = function(d, b) { + extendStatics = Object.setPrototypeOf || + ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) || + function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; }; + return extendStatics(d, b); +}; + +function __extends$c(d, b) { + extendStatics(d, b); + function __() { this.constructor = d; } + d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); +} + +var RGB_REG = /rgba?\(([\s.,0-9]+)\)/; +var regexLG$2 = /^l\s*\(\s*([\d.]+)\s*\)\s*(.*)/i; +var regexRG$2 = /^r\s*\(\s*([\d.]+)\s*,\s*([\d.]+)\s*,\s*([\d.]+)\s*\)\s*(.*)/i; +var regexColorStop$2 = /[\d.]+:(#[^\s]+|[^\)]+\))/gi; +var isGradientColor$1 = function (val) { return /^[r,R,L,l]{1}[\s]*\(/.test(val); }; +// 创建辅助 tag 取颜色 +var createTmp = function () { + var i = document.createElement('i'); + i.title = 'Web Colour Picker'; + i.style.display = 'none'; + document.body.appendChild(i); + return i; +}; +// 获取颜色之间的插值 +var getValue$3 = function (start, end, percent, index) { + return start[index] + (end[index] - start[index]) * percent; +}; +// 数组转换成颜色 +function arr2rgb(arr) { + return "#" + toHex(arr[0]) + toHex(arr[1]) + toHex(arr[2]); +} +// rgb 颜色转换成数组 +var rgb2arr = function (str) { + return [ + parseInt(str.substr(1, 2), 16), + parseInt(str.substr(3, 2), 16), + parseInt(str.substr(5, 2), 16), + ]; +}; +// 将数值从 0-255 转换成16进制字符串 +var toHex = function (value) { + var x16Value = Math.round(value).toString(16); + return x16Value.length === 1 ? "0" + x16Value : x16Value; +}; +// 计算颜色 +var calColor = function (points, percent) { + var fixedPercent = isNaN(Number(percent)) || percent < 0 ? 0 : + percent > 1 ? 1 : + Number(percent); + var steps = points.length - 1; + var step = Math.floor(steps * fixedPercent); + var left = steps * fixedPercent - step; + var start = points[step]; + var end = step === steps ? start : points[step + 1]; + return arr2rgb([ + getValue$3(start, end, left, 0), + getValue$3(start, end, left, 1), + getValue$3(start, end, left, 2), + ]); +}; +// 用于给 toRGB 的缓存（使用 memoize 方法替换） +// const colorCache = {}; +var iEl; +/** + * 将颜色转换到 rgb 的格式 + * @param {color} color 颜色 + * @return 将颜色转换到 '#ffffff' 的格式 + */ +var toRGB = function (color) { + // 如果已经是 rgb的格式 + if (color[0] === '#' && color.length === 7) { + return color; + } + if (!iEl) { + // 防止防止在页头报错 + iEl = createTmp(); + } + iEl.style.color = color; + var rst = document.defaultView.getComputedStyle(iEl, '').getPropertyValue('color'); + var matches = RGB_REG.exec(rst); + var cArray = matches[1].split(/\s*,\s*/).map(function (s) { return Number(s); }); + rst = arr2rgb(cArray); + return rst; +}; +/** + * 获取渐变函数 + * @param colors 多个颜色 + * @return 颜色值 + */ +var gradient = function (colors) { + var colorArray = isString$3(colors) ? colors.split('-') : colors; + var points = map$4(colorArray, function (color) { + return rgb2arr(color.indexOf('#') === -1 ? toRGB(color) : color); + }); + // 返回一个函数 + return function (percent) { + return calColor(points, percent); + }; +}; +var toCSSGradient = function (gradientColor) { + if (isGradientColor$1(gradientColor)) { + var cssColor_1; + var steps = void 0; + if (gradientColor[0] === 'l') { + // 线性渐变 + var arr = regexLG$2.exec(gradientColor); + var angle = +arr[1] + 90; // css 和 g 的渐变起始角度不同 + steps = arr[2]; + cssColor_1 = "linear-gradient(" + angle + "deg, "; + } + else if (gradientColor[0] === 'r') { + // 径向渐变 + cssColor_1 = 'radial-gradient('; + var arr = regexRG$2.exec(gradientColor); + steps = arr[4]; + } + var colorStops_1 = steps.match(regexColorStop$2); + each$2(colorStops_1, function (item, index) { + var itemArr = item.split(':'); + cssColor_1 += itemArr[1] + " " + itemArr[0] * 100 + "%"; + if (index !== (colorStops_1.length - 1)) { + cssColor_1 += ', '; + } + }); + cssColor_1 += ')'; + return cssColor_1; + } + return gradientColor; +}; +var colorUtil = { + rgb2arr: rgb2arr, + gradient: gradient, + toRGB: memoize$2(toRGB), + toCSSGradient: toCSSGradient, +}; + +var Color$1 = /** @class */ (function (_super) { + __extends$c(Color, _super); + function Color(cfg) { + var _this = _super.call(this, cfg) || this; + _this.type = 'color'; + _this.names = ['color']; + if (isString$3(_this.values)) { + _this.linear = true; + } + _this.gradient = colorUtil.gradient(_this.values); + return _this; + } + /** + * @override + */ + Color.prototype.getLinearValue = function (percent) { + return this.gradient(percent); + }; + return Color; +}(Attribute)); + +var Opacity = /** @class */ (function (_super) { + __extends$c(Opacity, _super); + function Opacity(cfg) { + var _this = _super.call(this, cfg) || this; + _this.type = 'opacity'; + _this.names = ['opacity']; + return _this; + } + return Opacity; +}(Attribute)); + +var Position = /** @class */ (function (_super) { + __extends$c(Position, _super); + function Position(cfg) { + var _this = _super.call(this, cfg) || this; + _this.names = ['x', 'y']; + _this.type = 'position'; + return _this; + } + Position.prototype.mapping = function (x, y) { + var _a = this.scales, scaleX = _a[0], scaleY = _a[1]; + if (isNil(x) || isNil(y)) { + return []; + } + return [ + isArray$n(x) ? x.map(function (xi) { return scaleX.scale(xi); }) : scaleX.scale(x), + isArray$n(y) ? y.map(function (yi) { return scaleY.scale(yi); }) : scaleY.scale(y), + ]; + }; + return Position; +}(Attribute)); + +var Shape$3 = /** @class */ (function (_super) { + __extends$c(Shape, _super); + function Shape(cfg) { + var _this = _super.call(this, cfg) || this; + _this.type = 'shape'; + _this.names = ['shape']; + return _this; + } + /** + * @override + */ + Shape.prototype.getLinearValue = function (percent) { + var idx = Math.round((this.values.length - 1) * percent); + return this.values[idx]; + }; + return Shape; +}(Attribute)); + +var Size = /** @class */ (function (_super) { + __extends$c(Size, _super); + function Size(cfg) { + var _this = _super.call(this, cfg) || this; + _this.type = 'size'; + _this.names = ['size']; + return _this; + } + return Size; +}(Attribute)); + +var methodCache = {}; +/** + * 获取计算 ticks 的方法 + * @param key 键值 + * @returns 计算 ticks 的方法 + */ +function getTickMethod(key) { + return methodCache[key]; +} +/** + * 注册计算 ticks 的方法 + * @param key 键值 + * @param method 方法 + */ +function registerTickMethod(key, method) { + methodCache[key] = method; +} + +var Scale = /** @class */ (function () { + function Scale(cfg) { + /** + * 度量的类型 + */ + this.type = 'base'; + /** + * 是否分类类型的度量 + */ + this.isCategory = false; + /** + * 是否线性度量，有linear, time 度量 + */ + this.isLinear = false; + /** + * 是否连续类型的度量，linear,time,log, pow, quantile, quantize 都支持 + */ + this.isContinuous = false; + /** + * 是否是常量的度量，传入和传出一致 + */ + this.isIdentity = false; + this.values = []; + this.range = [0, 1]; + this.ticks = []; + this.__cfg__ = cfg; + this.initCfg(); + this.init(); + } + // 对于原始值的必要转换，如分类、时间字段需转换成数值，用transform/map命名可能更好 + Scale.prototype.translate = function (v) { + return v; + }; + /** 重新初始化 */ + Scale.prototype.change = function (cfg) { + // 覆盖配置项，而不替代 + mix(this.__cfg__, cfg); + this.init(); + }; + Scale.prototype.clone = function () { + return this.constructor(this.__cfg__); + }; + /** 获取坐标轴需要的ticks */ + Scale.prototype.getTicks = function () { + var _this = this; + return map$4(this.ticks, function (tick, idx) { + if (isObject$f(tick)) { + // 仅当符合Tick类型时才有意义 + return tick; + } + return { + text: _this.getText(tick, idx), + tickValue: tick, + value: _this.scale(tick), + }; + }); + }; + /** 获取Tick的格式化结果 */ + Scale.prototype.getText = function (value, key) { + var formatter = this.formatter; + var res = formatter ? formatter(value, key) : value; + if (isNil(res) || !isFunction$6(res.toString)) { + return ''; + } + return res.toString(); + }; + // 获取配置项中的值，当前 scale 上的值可能会被修改 + Scale.prototype.getConfig = function (key) { + return this.__cfg__[key]; + }; + // scale初始化 + Scale.prototype.init = function () { + mix(this, this.__cfg__); + this.setDomain(); + if (isEmpty$1(this.getConfig('ticks'))) { + this.ticks = this.calculateTicks(); + } + }; + // 子类上覆盖某些属性，不能直接在类上声明，否则会被覆盖 + Scale.prototype.initCfg = function () { }; + Scale.prototype.setDomain = function () { }; + Scale.prototype.calculateTicks = function () { + var tickMethod = this.tickMethod; + var ticks = []; + if (isString$3(tickMethod)) { + var method = getTickMethod(tickMethod); + if (!method) { + throw new Error('There is no method to to calculate ticks!'); + } + ticks = method(this); + } + else if (isFunction$6(tickMethod)) { + ticks = tickMethod(this); + } + return ticks; + }; + // range 的最小值 + Scale.prototype.rangeMin = function () { + return this.range[0]; + }; + // range 的最大值 + Scale.prototype.rangeMax = function () { + return this.range[1]; + }; + /** 定义域转 0~1 */ + Scale.prototype.calcPercent = function (value, min, max) { + if (isNumber$4(value)) { + return (value - min) / (max - min); + } + return NaN; + }; + /** 0~1转定义域 */ + Scale.prototype.calcValue = function (percent, min, max) { + return min + percent * (max - min); + }; + return Scale; +}()); +var Base$2 = Scale; + +/** + * 分类度量 + * @class + */ +var Category$1 = /** @class */ (function (_super) { + __extends$e(Category, _super); + function Category() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.type = 'cat'; + _this.isCategory = true; + return _this; + } + Category.prototype.buildIndexMap = function () { + if (!this.translateIndexMap) { + this.translateIndexMap = new Map(); + // 重新构建缓存 + for (var i = 0; i < this.values.length; i++) { + this.translateIndexMap.set(this.values[i], i); + } + } + }; + Category.prototype.translate = function (value) { + // 按需构建 map + this.buildIndexMap(); + // 找得到 + var idx = this.translateIndexMap.get(value); + if (idx === undefined) { + idx = isNumber$4(value) ? value : NaN; + } + return idx; + }; + Category.prototype.scale = function (value) { + var order = this.translate(value); + // 分类数据允许 0.5 范围内调整 + // if (order < this.min - 0.5 || order > this.max + 0.5) { + // return NaN; + // } + var percent = this.calcPercent(order, this.min, this.max); + return this.calcValue(percent, this.rangeMin(), this.rangeMax()); + }; + Category.prototype.invert = function (scaledValue) { + var domainRange = this.max - this.min; + var percent = this.calcPercent(scaledValue, this.rangeMin(), this.rangeMax()); + var idx = Math.round(domainRange * percent) + this.min; + if (idx < this.min || idx > this.max) { + return NaN; + } + return this.values[idx]; + }; + Category.prototype.getText = function (value) { + var args = []; + for (var _i = 1; _i < arguments.length; _i++) { + args[_i - 1] = arguments[_i]; + } + var v = value; + // value为index + if (isNumber$4(value) && !this.values.includes(value)) { + v = this.values[v]; + } + return _super.prototype.getText.apply(this, __spreadArrays$1([v], args)); + }; + // 复写属性 + Category.prototype.initCfg = function () { + this.tickMethod = 'cat'; + }; + // 设置 min, max + Category.prototype.setDomain = function () { + // 用户有可能设置 min + if (isNil(this.getConfig('min'))) { + this.min = 0; + } + if (isNil(this.getConfig('max'))) { + var size = this.values.length; + this.max = size > 1 ? size - 1 : size; + } + // scale.init 的时候清除缓存 + if (this.translateIndexMap) { + this.translateIndexMap = undefined; + } + }; + return Category; +}(Base$2)); + +var token = /d{1,4}|M{1,4}|YY(?:YY)?|S{1,3}|Do|ZZ|Z|([HhMsDm])\1?|[aA]|"[^"]*"|'[^']*'/g; +var twoDigitsOptional = "[1-9]\\d?"; +var twoDigits = "\\d\\d"; +var threeDigits = "\\d{3}"; +var fourDigits = "\\d{4}"; +var word = "[^\\s]+"; +var literal = /\[([^]*?)\]/gm; +function shorten(arr, sLen) { + var newArr = []; + for (var i = 0, len = arr.length; i < len; i++) { + newArr.push(arr[i].substr(0, sLen)); + } + return newArr; +} +var monthUpdate = function (arrName) { return function (v, i18n) { + var lowerCaseArr = i18n[arrName].map(function (v) { return v.toLowerCase(); }); + var index = lowerCaseArr.indexOf(v.toLowerCase()); + if (index > -1) { + return index; + } + return null; +}; }; +function assign(origObj) { + var args = []; + for (var _i = 1; _i < arguments.length; _i++) { + args[_i - 1] = arguments[_i]; + } + for (var _a = 0, args_1 = args; _a < args_1.length; _a++) { + var obj = args_1[_a]; + for (var key in obj) { + // @ts-ignore ex + origObj[key] = obj[key]; + } + } + return origObj; +} +var dayNames = [ + "Sunday", + "Monday", + "Tuesday", + "Wednesday", + "Thursday", + "Friday", + "Saturday" +]; +var monthNames = [ + "January", + "February", + "March", + "April", + "May", + "June", + "July", + "August", + "September", + "October", + "November", + "December" +]; +var monthNamesShort = shorten(monthNames, 3); +var dayNamesShort = shorten(dayNames, 3); +var defaultI18n = { + dayNamesShort: dayNamesShort, + dayNames: dayNames, + monthNamesShort: monthNamesShort, + monthNames: monthNames, + amPm: ["am", "pm"], + DoFn: function (dayOfMonth) { + return (dayOfMonth + + ["th", "st", "nd", "rd"][dayOfMonth % 10 > 3 + ? 0 + : ((dayOfMonth - (dayOfMonth % 10) !== 10 ? 1 : 0) * dayOfMonth) % 10]); + } +}; +var globalI18n = assign({}, defaultI18n); +var setGlobalDateI18n = function (i18n) { + return (globalI18n = assign(globalI18n, i18n)); +}; +var regexEscape = function (str) { + return str.replace(/[|\\{()[^$+*?.-]/g, "\\$&"); +}; +var pad = function (val, len) { + if (len === void 0) { len = 2; } + val = String(val); + while (val.length < len) { + val = "0" + val; + } + return val; +}; +var formatFlags = { + D: function (dateObj) { return String(dateObj.getDate()); }, + DD: function (dateObj) { return pad(dateObj.getDate()); }, + Do: function (dateObj, i18n) { + return i18n.DoFn(dateObj.getDate()); + }, + d: function (dateObj) { return String(dateObj.getDay()); }, + dd: function (dateObj) { return pad(dateObj.getDay()); }, + ddd: function (dateObj, i18n) { + return i18n.dayNamesShort[dateObj.getDay()]; + }, + dddd: function (dateObj, i18n) { + return i18n.dayNames[dateObj.getDay()]; + }, + M: function (dateObj) { return String(dateObj.getMonth() + 1); }, + MM: function (dateObj) { return pad(dateObj.getMonth() + 1); }, + MMM: function (dateObj, i18n) { + return i18n.monthNamesShort[dateObj.getMonth()]; + }, + MMMM: function (dateObj, i18n) { + return i18n.monthNames[dateObj.getMonth()]; + }, + YY: function (dateObj) { + return pad(String(dateObj.getFullYear()), 4).substr(2); + }, + YYYY: function (dateObj) { return pad(dateObj.getFullYear(), 4); }, + h: function (dateObj) { return String(dateObj.getHours() % 12 || 12); }, + hh: function (dateObj) { return pad(dateObj.getHours() % 12 || 12); }, + H: function (dateObj) { return String(dateObj.getHours()); }, + HH: function (dateObj) { return pad(dateObj.getHours()); }, + m: function (dateObj) { return String(dateObj.getMinutes()); }, + mm: function (dateObj) { return pad(dateObj.getMinutes()); }, + s: function (dateObj) { return String(dateObj.getSeconds()); }, + ss: function (dateObj) { return pad(dateObj.getSeconds()); }, + S: function (dateObj) { + return String(Math.round(dateObj.getMilliseconds() / 100)); + }, + SS: function (dateObj) { + return pad(Math.round(dateObj.getMilliseconds() / 10), 2); + }, + SSS: function (dateObj) { return pad(dateObj.getMilliseconds(), 3); }, + a: function (dateObj, i18n) { + return dateObj.getHours() < 12 ? i18n.amPm[0] : i18n.amPm[1]; + }, + A: function (dateObj, i18n) { + return dateObj.getHours() < 12 + ? i18n.amPm[0].toUpperCase() + : i18n.amPm[1].toUpperCase(); + }, + ZZ: function (dateObj) { + var offset = dateObj.getTimezoneOffset(); + return ((offset > 0 ? "-" : "+") + + pad(Math.floor(Math.abs(offset) / 60) * 100 + (Math.abs(offset) % 60), 4)); + }, + Z: function (dateObj) { + var offset = dateObj.getTimezoneOffset(); + return ((offset > 0 ? "-" : "+") + + pad(Math.floor(Math.abs(offset) / 60), 2) + + ":" + + pad(Math.abs(offset) % 60, 2)); + } +}; +var monthParse = function (v) { return +v - 1; }; +var emptyDigits = [null, twoDigitsOptional]; +var emptyWord = [null, word]; +var amPm = [ + "isPm", + word, + function (v, i18n) { + var val = v.toLowerCase(); + if (val === i18n.amPm[0]) { + return 0; + } + else if (val === i18n.amPm[1]) { + return 1; + } + return null; + } +]; +var timezoneOffset = [ + "timezoneOffset", + "[^\\s]*?[\\+\\-]\\d\\d:?\\d\\d|[^\\s]*?Z?", + function (v) { + var parts = (v + "").match(/([+-]|\d\d)/gi); + if (parts) { + var minutes = +parts[1] * 60 + parseInt(parts[2], 10); + return parts[0] === "+" ? minutes : -minutes; + } + return 0; + } +]; +var parseFlags = { + D: ["day", twoDigitsOptional], + DD: ["day", twoDigits], + Do: ["day", twoDigitsOptional + word, function (v) { return parseInt(v, 10); }], + M: ["month", twoDigitsOptional, monthParse], + MM: ["month", twoDigits, monthParse], + YY: [ + "year", + twoDigits, + function (v) { + var now = new Date(); + var cent = +("" + now.getFullYear()).substr(0, 2); + return +("" + (+v > 68 ? cent - 1 : cent) + v); + } + ], + h: ["hour", twoDigitsOptional, undefined, "isPm"], + hh: ["hour", twoDigits, undefined, "isPm"], + H: ["hour", twoDigitsOptional], + HH: ["hour", twoDigits], + m: ["minute", twoDigitsOptional], + mm: ["minute", twoDigits], + s: ["second", twoDigitsOptional], + ss: ["second", twoDigits], + YYYY: ["year", fourDigits], + S: ["millisecond", "\\d", function (v) { return +v * 100; }], + SS: ["millisecond", twoDigits, function (v) { return +v * 10; }], + SSS: ["millisecond", threeDigits], + d: emptyDigits, + dd: emptyDigits, + ddd: emptyWord, + dddd: emptyWord, + MMM: ["month", word, monthUpdate("monthNamesShort")], + MMMM: ["month", word, monthUpdate("monthNames")], + a: amPm, + A: amPm, + ZZ: timezoneOffset, + Z: timezoneOffset +}; +// Some common format strings +var globalMasks = { + default: "ddd MMM DD YYYY HH:mm:ss", + shortDate: "M/D/YY", + mediumDate: "MMM D, YYYY", + longDate: "MMMM D, YYYY", + fullDate: "dddd, MMMM D, YYYY", + isoDate: "YYYY-MM-DD", + isoDateTime: "YYYY-MM-DDTHH:mm:ssZ", + shortTime: "HH:mm", + mediumTime: "HH:mm:ss", + longTime: "HH:mm:ss.SSS" +}; +var setGlobalDateMasks = function (masks) { return assign(globalMasks, masks); }; +/*** + * Format a date + * @method format + * @param {Date|number} dateObj + * @param {string} mask Format of the date, i.e. 'mm-dd-yy' or 'shortDate' + * @returns {string} Formatted date string + */ +var format = function (dateObj, mask, i18n) { + if (mask === void 0) { mask = globalMasks["default"]; } + if (i18n === void 0) { i18n = {}; } + if (typeof dateObj === "number") { + dateObj = new Date(dateObj); + } + if (Object.prototype.toString.call(dateObj) !== "[object Date]" || + isNaN(dateObj.getTime())) { + throw new Error("Invalid Date pass to format"); + } + mask = globalMasks[mask] || mask; + var literals = []; + // Make literals inactive by replacing them with @@@ + mask = mask.replace(literal, function ($0, $1) { + literals.push($1); + return "@@@"; + }); + var combinedI18nSettings = assign(assign({}, globalI18n), i18n); + // Apply formatting rules + mask = mask.replace(token, function ($0) { + return formatFlags[$0](dateObj, combinedI18nSettings); + }); + // Inline literal values back into the formatted value + return mask.replace(/@@@/g, function () { return literals.shift(); }); +}; +/** + * Parse a date string into a Javascript Date object / + * @method parse + * @param {string} dateStr Date string + * @param {string} format Date parse format + * @param {i18n} I18nSettingsOptional Full or subset of I18N settings + * @returns {Date|null} Returns Date object. Returns null what date string is invalid or doesn't match format + */ +function parse(dateStr, format, i18n) { + if (i18n === void 0) { i18n = {}; } + if (typeof format !== "string") { + throw new Error("Invalid format in fecha parse"); + } + // Check to see if the format is actually a mask + format = globalMasks[format] || format; + // Avoid regular expression denial of service, fail early for really long strings + // https://www.owasp.org/index.php/Regular_expression_Denial_of_Service_-_ReDoS + if (dateStr.length > 1000) { + return null; + } + // Default to the beginning of the year. + var today = new Date(); + var dateInfo = { + year: today.getFullYear(), + month: 0, + day: 1, + hour: 0, + minute: 0, + second: 0, + millisecond: 0, + isPm: null, + timezoneOffset: null + }; + var parseInfo = []; + var literals = []; + // Replace all the literals with @@@. Hopefully a string that won't exist in the format + var newFormat = format.replace(literal, function ($0, $1) { + literals.push(regexEscape($1)); + return "@@@"; + }); + var specifiedFields = {}; + var requiredFields = {}; + // Change every token that we find into the correct regex + newFormat = regexEscape(newFormat).replace(token, function ($0) { + var info = parseFlags[$0]; + var field = info[0], regex = info[1], requiredField = info[3]; + // Check if the person has specified the same field twice. This will lead to confusing results. + if (specifiedFields[field]) { + throw new Error("Invalid format. " + field + " specified twice in format"); + } + specifiedFields[field] = true; + // Check if there are any required fields. For instance, 12 hour time requires AM/PM specified + if (requiredField) { + requiredFields[requiredField] = true; + } + parseInfo.push(info); + return "(" + regex + ")"; + }); + // Check all the required fields are present + Object.keys(requiredFields).forEach(function (field) { + if (!specifiedFields[field]) { + throw new Error("Invalid format. " + field + " is required in specified format"); + } + }); + // Add back all the literals after + newFormat = newFormat.replace(/@@@/g, function () { return literals.shift(); }); + // Check if the date string matches the format. If it doesn't return null + var matches = dateStr.match(new RegExp(newFormat, "i")); + if (!matches) { + return null; + } + var combinedI18nSettings = assign(assign({}, globalI18n), i18n); + // For each match, call the parser function for that date part + for (var i = 1; i < matches.length; i++) { + var _a = parseInfo[i - 1], field = _a[0], parser = _a[2]; + var value = parser + ? parser(matches[i], combinedI18nSettings) + : +matches[i]; + // If the parser can't make sense of the value, return null + if (value == null) { + return null; + } + dateInfo[field] = value; + } + if (dateInfo.isPm === 1 && dateInfo.hour != null && +dateInfo.hour !== 12) { + dateInfo.hour = +dateInfo.hour + 12; + } + else if (dateInfo.isPm === 0 && +dateInfo.hour === 12) { + dateInfo.hour = 0; + } + var dateWithoutTZ = new Date(dateInfo.year, dateInfo.month, dateInfo.day, dateInfo.hour, dateInfo.minute, dateInfo.second, dateInfo.millisecond); + var validateFields = [ + ["month", "getMonth"], + ["day", "getDate"], + ["hour", "getHours"], + ["minute", "getMinutes"], + ["second", "getSeconds"] + ]; + for (var i = 0, len = validateFields.length; i < len; i++) { + // Check to make sure the date field is within the allowed range. Javascript dates allows values + // outside the allowed range. If the values don't match the value was invalid + if (specifiedFields[validateFields[i][0]] && + dateInfo[validateFields[i][0]] !== dateWithoutTZ[validateFields[i][1]]()) { + return null; + } + } + if (dateInfo.timezoneOffset == null) { + return dateWithoutTZ; + } + return new Date(Date.UTC(dateInfo.year, dateInfo.month, dateInfo.day, dateInfo.hour, dateInfo.minute - dateInfo.timezoneOffset, dateInfo.second, dateInfo.millisecond)); +} +var fecha = { + format: format, + parse: parse, + defaultI18n: defaultI18n, + setGlobalDateI18n: setGlobalDateI18n, + setGlobalDateMasks: setGlobalDateMasks +}; + +var fecha1 = /*#__PURE__*/Object.freeze({ + __proto__: null, + 'default': fecha, + assign: assign, + format: format, + parse: parse, + defaultI18n: defaultI18n, + setGlobalDateI18n: setGlobalDateI18n, + setGlobalDateMasks: setGlobalDateMasks +}); + +/** + * 二分右侧查找 + * https://github.com/d3/d3-array/blob/master/src/bisector.js + */ +function bisector (getter) { + /** + * x: 目标值 + * lo: 起始位置 + * hi: 结束位置 + */ + return function (a, x, _lo, _hi) { + var lo = isNil(_lo) ? 0 : _lo; + var hi = isNil(_hi) ? a.length : _hi; + while (lo < hi) { + var mid = (lo + hi) >>> 1; + if (getter(a[mid]) > x) { + hi = mid; + } + else { + lo = mid + 1; + } + } + return lo; + }; +} + +var FORMAT_METHOD = 'format'; +function timeFormat(time, mask) { + var method = fecha1[FORMAT_METHOD] || fecha[FORMAT_METHOD]; + return method(time, mask); +} +/** + * 转换成时间戳 + * @param value 时间值 + */ +function toTimeStamp(value) { + if (isString$3(value)) { + if (value.indexOf('T') > 0) { + value = new Date(value).getTime(); + } + else { + // new Date('2010/01/10') 和 new Date('2010-01-10') 的差别在于: + // 如果仅有年月日时，前者是带有时区的: Fri Jan 10 2020 02:40:13 GMT+0800 (中国标准时间) + // 后者会格式化成 Sun Jan 10 2010 08:00:00 GMT+0800 (中国标准时间) + value = new Date(value.replace(/-/gi, '/')).getTime(); + } + } + if (isDate(value)) { + value = value.getTime(); + } + return value; +} +var SECOND = 1000; +var MINUTE = 60 * SECOND; +var HOUR = 60 * MINUTE; +var DAY = 24 * HOUR; +var MONTH = DAY * 31; +var YEAR = DAY * 365; +var intervals = [ + ['HH:mm:ss', SECOND], + ['HH:mm:ss', SECOND * 10], + ['HH:mm:ss', SECOND * 30], + ['HH:mm', MINUTE], + ['HH:mm', MINUTE * 10], + ['HH:mm', MINUTE * 30], + ['HH', HOUR], + ['HH', HOUR * 6], + ['HH', HOUR * 12], + ['YYYY-MM-DD', DAY], + ['YYYY-MM-DD', DAY * 4], + ['YYYY-WW', DAY * 7], + ['YYYY-MM', MONTH], + ['YYYY-MM', MONTH * 4], + ['YYYY-MM', MONTH * 6], + ['YYYY', DAY * 380], +]; +function getTickInterval(min, max, tickCount) { + var target = (max - min) / tickCount; + var idx = bisector(function (o) { return o[1]; })(intervals, target) - 1; + var interval = intervals[idx]; + if (idx < 0) { + interval = intervals[0]; + } + else if (idx >= intervals.length) { + interval = last$1(intervals); + } + return interval; +} + +/** + * 时间分类度量 + * @class + */ +var TimeCat = /** @class */ (function (_super) { + __extends$e(TimeCat, _super); + function TimeCat() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.type = 'timeCat'; + return _this; + } + /** + * @override + */ + TimeCat.prototype.translate = function (value) { + value = toTimeStamp(value); + var index = this.values.indexOf(value); + if (index === -1) { + if (isNumber$4(value) && value < this.values.length) { + index = value; + } + else { + index = NaN; + } + } + return index; + }; + /** + * 由于时间类型数据需要转换一下，所以复写 getText + * @override + */ + TimeCat.prototype.getText = function (value, tickIndex) { + var index = this.translate(value); + if (index > -1) { + var result = this.values[index]; + var formatter = this.formatter; + result = formatter ? formatter(result, tickIndex) : timeFormat(result, this.mask); + return result; + } + return value; + }; + TimeCat.prototype.initCfg = function () { + this.tickMethod = 'time-cat'; + this.mask = 'YYYY-MM-DD'; + this.tickCount = 7; // 一般时间数据会显示 7， 14， 30 天的数字 + }; + TimeCat.prototype.setDomain = function () { + var values = this.values; + // 针对时间分类类型，会将时间统一转换为时间戳 + each$2(values, function (v, i) { + values[i] = toTimeStamp(v); + }); + values.sort(function (v1, v2) { + return v1 - v2; + }); + _super.prototype.setDomain.call(this); + }; + return TimeCat; +}(Category$1)); + +/** + * 连续度量的基类 + * @class + */ +var Continuous = /** @class */ (function (_super) { + __extends$e(Continuous, _super); + function Continuous() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.isContinuous = true; + return _this; + } + Continuous.prototype.scale = function (value) { + if (isNil(value)) { + return NaN; + } + var rangeMin = this.rangeMin(); + var rangeMax = this.rangeMax(); + var max = this.max; + var min = this.min; + if (max === min) { + return rangeMin; + } + var percent = this.getScalePercent(value); + return rangeMin + percent * (rangeMax - rangeMin); + }; + Continuous.prototype.init = function () { + _super.prototype.init.call(this); + // init 完成后保证 min, max 包含 ticks 的范围 + var ticks = this.ticks; + var firstTick = head(ticks); + var lastTick = last$1(ticks); + if (firstTick < this.min) { + this.min = firstTick; + } + if (lastTick > this.max) { + this.max = lastTick; + } + // strict-limit 方式 + if (!isNil(this.minLimit)) { + this.min = firstTick; + } + if (!isNil(this.maxLimit)) { + this.max = lastTick; + } + }; + Continuous.prototype.setDomain = function () { + var _a = getRange(this.values), min = _a.min, max = _a.max; + if (isNil(this.min)) { + this.min = min; + } + if (isNil(this.max)) { + this.max = max; + } + if (this.min > this.max) { + this.min = min; + this.max = max; + } + }; + Continuous.prototype.calculateTicks = function () { + var _this = this; + var ticks = _super.prototype.calculateTicks.call(this); + if (!this.nice) { + ticks = filter$1(ticks, function (tick) { + return tick >= _this.min && tick <= _this.max; + }); + } + return ticks; + }; + // 计算原始值值占的百分比 + Continuous.prototype.getScalePercent = function (value) { + var max = this.max; + var min = this.min; + return (value - min) / (max - min); + }; + Continuous.prototype.getInvertPercent = function (value) { + return (value - this.rangeMin()) / (this.rangeMax() - this.rangeMin()); + }; + return Continuous; +}(Base$2)); + +/** + * 线性度量 + * @class + */ +var Linear = /** @class */ (function (_super) { + __extends$e(Linear, _super); + function Linear() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.type = 'linear'; + _this.isLinear = true; + return _this; + } + Linear.prototype.invert = function (value) { + var percent = this.getInvertPercent(value); + return this.min + percent * (this.max - this.min); + }; + Linear.prototype.initCfg = function () { + this.tickMethod = 'wilkinson-extended'; + this.nice = false; + }; + return Linear; +}(Continuous)); + +// 求以a为次幂，结果为b的基数，如 x^^a = b;求x +// 虽然数学上 b 不支持负数，但是这里需要支持 负数 +function calBase(a, b) { + var e = Math.E; + var value; + if (b >= 0) { + value = Math.pow(e, Math.log(b) / a); // 使用换底公式求底 + } + else { + value = Math.pow(e, Math.log(-b) / a) * -1; // 使用换底公式求底 + } + return value; +} +function log$1(a, b) { + if (a === 1) { + return 1; + } + return Math.log(b) / Math.log(a); +} +function getLogPositiveMin(values, base, max) { + if (isNil(max)) { + max = Math.max.apply(null, values); + } + var positiveMin = max; + each$2(values, function (value) { + if (value > 0 && value < positiveMin) { + positiveMin = value; + } + }); + if (positiveMin === max) { + positiveMin = max / base; + } + if (positiveMin > 1) { + positiveMin = 1; + } + return positiveMin; +} + +/** + * Log 度量，处理非均匀分布 + */ +var Log = /** @class */ (function (_super) { + __extends$e(Log, _super); + function Log() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.type = 'log'; + return _this; + } + /** + * @override + */ + Log.prototype.invert = function (value) { + var base = this.base; + var max = log$1(base, this.max); + var rangeMin = this.rangeMin(); + var range = this.rangeMax() - rangeMin; + var min; + var positiveMin = this.positiveMin; + if (positiveMin) { + if (value === 0) { + return 0; + } + min = log$1(base, positiveMin / base); + var appendPercent = (1 / (max - min)) * range; // 0 到 positiveMin的占比 + if (value < appendPercent) { + // 落到 0 - positiveMin 之间 + return (value / appendPercent) * positiveMin; + } + } + else { + min = log$1(base, this.min); + } + var percent = (value - rangeMin) / range; + var tmp = percent * (max - min) + min; + return Math.pow(base, tmp); + }; + Log.prototype.initCfg = function () { + this.tickMethod = 'log'; + this.base = 10; + this.tickCount = 6; + this.nice = true; + }; + // 设置 + Log.prototype.setDomain = function () { + _super.prototype.setDomain.call(this); + var min = this.min; + if (min < 0) { + throw new Error('When you use log scale, the minimum value must be greater than zero!'); + } + if (min === 0) { + this.positiveMin = getLogPositiveMin(this.values, this.base, this.max); + } + }; + // 根据当前值获取占比 + Log.prototype.getScalePercent = function (value) { + var max = this.max; + var min = this.min; + if (max === min) { + return 0; + } + // 如果值小于等于0，则按照0处理 + if (value <= 0) { + return 0; + } + var base = this.base; + var positiveMin = this.positiveMin; + // 如果min == 0, 则根据比0大的最小值，计算比例关系。这个最小值作为坐标轴上的第二个tick，第一个是0但是不显示 + if (positiveMin) { + min = (positiveMin * 1) / base; + } + var percent; + // 如果数值小于次小值，那么就计算 value / 次小值 占整体的比例 + if (value < positiveMin) { + percent = value / positiveMin / (log$1(base, max) - log$1(base, min)); + } + else { + percent = (log$1(base, value) - log$1(base, min)) / (log$1(base, max) - log$1(base, min)); + } + return percent; + }; + return Log; +}(Continuous)); + +/** + * Pow 度量，处理非均匀分布 + */ +var Pow = /** @class */ (function (_super) { + __extends$e(Pow, _super); + function Pow() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.type = 'pow'; + return _this; + } + /** + * @override + */ + Pow.prototype.invert = function (value) { + var percent = this.getInvertPercent(value); + var exponent = this.exponent; + var max = calBase(exponent, this.max); + var min = calBase(exponent, this.min); + var tmp = percent * (max - min) + min; + var factor = tmp >= 0 ? 1 : -1; + return Math.pow(tmp, exponent) * factor; + }; + Pow.prototype.initCfg = function () { + this.tickMethod = 'pow'; + this.exponent = 2; + this.tickCount = 5; + this.nice = true; + }; + // 获取度量计算时，value占的定义域百分比 + Pow.prototype.getScalePercent = function (value) { + var max = this.max; + var min = this.min; + if (max === min) { + return 0; + } + var exponent = this.exponent; + var percent = (calBase(exponent, value) - calBase(exponent, min)) / (calBase(exponent, max) - calBase(exponent, min)); + return percent; + }; + return Pow; +}(Continuous)); + +/** + * 时间度量 + * @class + */ +var Time = /** @class */ (function (_super) { + __extends$e(Time, _super); + function Time() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.type = 'time'; + return _this; + } + /** + * @override + */ + Time.prototype.getText = function (value, index) { + var numberValue = this.translate(value); + var formatter = this.formatter; + return formatter ? formatter(numberValue, index) : timeFormat(numberValue, this.mask); + }; + /** + * @override + */ + Time.prototype.scale = function (value) { + var v = value; + if (isString$3(v) || isDate(v)) { + v = this.translate(v); + } + return _super.prototype.scale.call(this, v); + }; + /** + * 将时间转换成数字 + * @override + */ + Time.prototype.translate = function (v) { + return toTimeStamp(v); + }; + Time.prototype.initCfg = function () { + this.tickMethod = 'time-pretty'; + this.mask = 'YYYY-MM-DD'; + this.tickCount = 7; + this.nice = false; + }; + Time.prototype.setDomain = function () { + var values = this.values; + // 是否设置了 min, max，而不是直接取 this.min, this.max + var minConfig = this.getConfig('min'); + var maxConfig = this.getConfig('max'); + // 如果设置了 min,max 则转换成时间戳 + if (!isNil(minConfig) || !isNumber$4(minConfig)) { + this.min = this.translate(this.min); + } + if (!isNil(maxConfig) || !isNumber$4(maxConfig)) { + this.max = this.translate(this.max); + } + // 没有设置 min, max 时 + if (values && values.length) { + // 重新计算最大最小值 + var timeStamps_1 = []; + var min_1 = Infinity; // 最小值 + var secondMin_1 = min_1; // 次小值 + var max_1 = 0; + // 使用一个循环，计算min,max,secondMin + each$2(values, function (v) { + var timeStamp = toTimeStamp(v); + if (isNaN(timeStamp)) { + throw new TypeError("Invalid Time: " + v + " in time scale!"); + } + if (min_1 > timeStamp) { + secondMin_1 = min_1; + min_1 = timeStamp; + } + else if (secondMin_1 > timeStamp) { + secondMin_1 = timeStamp; + } + if (max_1 < timeStamp) { + max_1 = timeStamp; + } + timeStamps_1.push(timeStamp); + }); + // 存在多个值时，设置最小间距 + if (values.length > 1) { + this.minTickInterval = secondMin_1 - min_1; + } + if (isNil(minConfig)) { + this.min = min_1; + } + if (isNil(maxConfig)) { + this.max = max_1; + } + } + }; + return Time; +}(Linear)); + +/** + * 分段度量 + */ +var Quantize = /** @class */ (function (_super) { + __extends$e(Quantize, _super); + function Quantize() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.type = 'quantize'; + return _this; + } + Quantize.prototype.invert = function (value) { + var ticks = this.ticks; + var length = ticks.length; + var percent = this.getInvertPercent(value); + var minIndex = Math.floor(percent * (length - 1)); + // 最后一个 + if (minIndex >= length - 1) { + return last$1(ticks); + } + // 超出左边界， 则取第一个 + if (minIndex < 0) { + return head(ticks); + } + var minTick = ticks[minIndex]; + var nextTick = ticks[minIndex + 1]; + // 比当前值小的 tick 在度量上的占比 + var minIndexPercent = minIndex / (length - 1); + var maxIndexPercent = (minIndex + 1) / (length - 1); + return minTick + (percent - minIndexPercent) / (maxIndexPercent - minIndexPercent) * (nextTick - minTick); + }; + Quantize.prototype.initCfg = function () { + this.tickMethod = 'r-pretty'; + this.tickCount = 5; + this.nice = true; + }; + Quantize.prototype.calculateTicks = function () { + var ticks = _super.prototype.calculateTicks.call(this); + if (!this.nice) { // 如果 nice = false ,补充 min, max + if (last$1(ticks) !== this.max) { + ticks.push(this.max); + } + if (head(ticks) !== this.min) { + ticks.unshift(this.min); + } + } + return ticks; + }; + // 计算当前值在刻度中的占比 + Quantize.prototype.getScalePercent = function (value) { + var ticks = this.ticks; + // 超出左边界 + if (value < head(ticks)) { + return 0; + } + // 超出右边界 + if (value > last$1(ticks)) { + return 1; + } + var minIndex = 0; + each$2(ticks, function (tick, index) { + if (value >= tick) { + minIndex = index; + } + else { + return false; + } + }); + return minIndex / (ticks.length - 1); + }; + return Quantize; +}(Continuous)); + +var Quantile = /** @class */ (function (_super) { + __extends$e(Quantile, _super); + function Quantile() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.type = 'quantile'; + return _this; + } + Quantile.prototype.initCfg = function () { + this.tickMethod = 'quantile'; + this.tickCount = 5; + this.nice = true; + }; + return Quantile; +}(Quantize)); + +var map$2 = {}; +function getClass(key) { + return map$2[key]; +} +function registerClass(key, cls) { + if (getClass(key)) { + throw new Error("type '" + key + "' existed."); + } + map$2[key] = cls; +} + +/** + * identity scale原则上是定义域和值域一致，scale/invert方法也是一致的 + * 参考R的实现：https://github.com/r-lib/scales/blob/master/R/pal-identity.r + * 参考d3的实现（做了下转型）：https://github.com/d3/d3-scale/blob/master/src/identity.js + */ +var Identity = /** @class */ (function (_super) { + __extends$e(Identity, _super); + function Identity() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.type = 'identity'; + _this.isIdentity = true; + return _this; + } + Identity.prototype.calculateTicks = function () { + return this.values; + }; + Identity.prototype.scale = function (value) { + // 如果传入的值不等于 identity 的值，则直接返回，用于一维图时的 dodge + if (this.values[0] !== value && isNumber$4(value)) { + return value; + } + return this.range[0]; + }; + Identity.prototype.invert = function (value) { + var range = this.range; + if (value < range[0] || value > range[1]) { + return NaN; + } + return this.values[0]; + }; + return Identity; +}(Base$2)); + +var DEFAULT_Q = [1, 5, 2, 2.5, 4, 3]; +var eps = Number.EPSILON * 100; +function mod(n, m) { + return ((n % m) + m) % m; +} +function simplicity(q, Q, j, lmin, lmax, lstep) { + var n = size$1(Q); + var i = indexOf(Q, q); + var v = 0; + var m = mod(lmin, lstep); + if ((m < eps || lstep - m < eps) && lmin <= 0 && lmax >= 0) { + v = 1; + } + return 1 - i / (n - 1) - j + v; +} +function simplicityMax(q, Q, j) { + var n = size$1(Q); + var i = indexOf(Q, q); + var v = 1; + return 1 - i / (n - 1) - j + v; +} +function density(k, m, dMin, dMax, lMin, lMax) { + var r = (k - 1) / (lMax - lMin); + var rt = (m - 1) / (Math.max(lMax, dMax) - Math.min(dMin, lMin)); + return 2 - Math.max(r / rt, rt / r); +} +function densityMax(k, m) { + if (k >= m) { + return 2 - (k - 1) / (m - 1); + } + return 1; +} +function coverage(dMin, dMax, lMin, lMax) { + var range = dMax - dMin; + return 1 - (0.5 * (Math.pow((dMax - lMax), 2) + Math.pow((dMin - lMin), 2))) / Math.pow((0.1 * range), 2); +} +function coverageMax(dMin, dMax, span) { + var range = dMax - dMin; + if (span > range) { + var half = (span - range) / 2; + return 1 - Math.pow(half, 2) / Math.pow((0.1 * range), 2); + } + return 1; +} +function legibility() { + return 1; +} +// 解决 js 计算精度问题 +function prettyNumber$1(n) { + return n < 1e-15 ? n : parseFloat(n.toFixed(15)); +} +/** + * An Extension of Wilkinson's Algorithm for Position Tick Labels on Axes + * https://www.yuque.com/preview/yuque/0/2019/pdf/185317/1546999150858-45c3b9c2-4e86-4223-bf1a-8a732e8195ed.pdf + * @param dMin 最小值 + * @param dMax 最大值 + * @param m tick个数 + * @param onlyLoose 是否允许扩展min、max，不绝对强制，例如[3, 97] + * @param Q nice numbers集合 + * @param w 四个优化组件的权重 + */ +function extended(dMin, dMax, m, onlyLoose, Q, w) { + if (m === void 0) { m = 5; } + if (onlyLoose === void 0) { onlyLoose = true; } + if (Q === void 0) { Q = DEFAULT_Q; } + if (w === void 0) { w = [0.25, 0.2, 0.5, 0.05]; } + // nan 也会导致异常 + if (Number.isNaN(dMin) || Number.isNaN(dMax) || typeof dMin !== 'number' || typeof dMax !== 'number' || !m) { + return { + min: 0, + max: 0, + ticks: [], + }; + } + // js 极大值极小值问题，差值小于 1e-15 会导致计算出错 + if (dMax - dMin < 1e-15 || m === 1) { + return { + min: dMin, + max: dMax, + ticks: [dMin], + }; + } + var best = { + score: -2, + lmin: 0, + lmax: 0, + lstep: 0, + }; + var j = 1; + while (j < Infinity) { + for (var i = 0; i < Q.length; i += 1) { + var q = Q[i]; + var sm = simplicityMax(q, Q, j); + if (w[0] * sm + w[1] + w[2] + w[3] < best.score) { + j = Infinity; + break; + } + var k = 2; + while (k < Infinity) { + var dm = densityMax(k, m); + if (w[0] * sm + w[1] + w[2] * dm + w[3] < best.score) { + break; + } + var delta = (dMax - dMin) / (k + 1) / j / q; + var z = Math.ceil(Math.log10(delta)); + while (z < Infinity) { + var step = j * q * Math.pow(10, z); + var cm = coverageMax(dMin, dMax, step * (k - 1)); + if (w[0] * sm + w[1] * cm + w[2] * dm + w[3] < best.score) { + break; + } + var minStart = Math.floor(dMax / step) * j - (k - 1) * j; + var maxStart = Math.ceil(dMin / step) * j; + if (minStart <= maxStart) { + var count = maxStart - minStart; + for (var i_1 = 0; i_1 <= count; i_1 += 1) { + var start = minStart + i_1; + var lMin = start * (step / j); + var lMax = lMin + step * (k - 1); + var lStep = step; + var s = simplicity(q, Q, j, lMin, lMax, lStep); + var c = coverage(dMin, dMax, lMin, lMax); + var g = density(k, m, dMin, dMax, lMin, lMax); + var l = legibility(); + var score = w[0] * s + w[1] * c + w[2] * g + w[3] * l; + if (score > best.score && (!onlyLoose || (lMin <= dMin && lMax >= dMax))) { + best.lmin = lMin; + best.lmax = lMax; + best.lstep = lStep; + best.score = score; + } + } + } + z += 1; + } + k += 1; + } + } + j += 1; + } + var lmax = best.lmax, lmin = best.lmin, lstep = best.lstep; + var tickCount = Math.floor((lmax - lmin) / lstep) + 1; + var ticks = new Array(tickCount); + for (var i = 0; i < tickCount; i++) { + ticks[i] = prettyNumber$1(lmin + i * lstep); + } + return { + min: Math.min(dMin, head(ticks)), + max: Math.max(dMax, last$1(ticks)), + ticks: ticks, + }; +} + +/** + * 计算分类 ticks + * @param cfg 度量的配置项 + * @returns 计算后的 ticks + */ +function calculateCatTicks(cfg) { + var values = cfg.values, tickInterval = cfg.tickInterval, tickCount = cfg.tickCount; + var ticks = values; + if (isNumber$4(tickInterval)) { + return filter$1(ticks, function (__, i) { return i % tickInterval === 0; }); + } + var min = cfg.min, max = cfg.max; + if (isNil(min)) { + min = 0; + } + if (isNil(max)) { + max = values.length - 1; + } + if (isNumber$4(tickCount) && tickCount < max - min) { + // 简单过滤，部分情况下小数的倍数也可以是整数 + // tslint:disable-next-line: no-shadowed-variable + var ticks_1 = extended(min, max, tickCount, false, [1, 2, 5, 3, 4, 7, 6, 8, 9]).ticks; + var valid = filter$1(ticks_1, function (tick) { return tick >= min && tick <= max; }); + return valid.map(function (index) { return values[index]; }); + } + return values.slice(min, max + 1); +} + +function d3Linear(cfg) { + var min = cfg.min, max = cfg.max, nice = cfg.nice, tickCount = cfg.tickCount; + var linear = new D3Linear(); + linear.domain([min, max]); + if (nice) { + linear.nice(tickCount); + } + return linear.ticks(tickCount); +} +var DEFAULT_COUNT = 5; +var e10 = Math.sqrt(50); +var e5 = Math.sqrt(10); +var e2 = Math.sqrt(2); +// https://github.com/d3/d3-scale +var D3Linear = /** @class */ (function () { + function D3Linear() { + this._domain = [0, 1]; + } + D3Linear.prototype.domain = function (domain) { + if (domain) { + this._domain = Array.from(domain, Number); + return this; + } + return this._domain.slice(); + }; + D3Linear.prototype.nice = function (count) { + var _a, _b; + if (count === void 0) { count = DEFAULT_COUNT; } + var d = this._domain.slice(); + var i0 = 0; + var i1 = this._domain.length - 1; + var start = this._domain[i0]; + var stop = this._domain[i1]; + var step; + if (stop < start) { + _a = [stop, start], start = _a[0], stop = _a[1]; + _b = [i1, i0], i0 = _b[0], i1 = _b[1]; + } + step = tickIncrement(start, stop, count); + if (step > 0) { + start = Math.floor(start / step) * step; + stop = Math.ceil(stop / step) * step; + step = tickIncrement(start, stop, count); + } + else if (step < 0) { + start = Math.ceil(start * step) / step; + stop = Math.floor(stop * step) / step; + step = tickIncrement(start, stop, count); + } + if (step > 0) { + d[i0] = Math.floor(start / step) * step; + d[i1] = Math.ceil(stop / step) * step; + this.domain(d); + } + else if (step < 0) { + d[i0] = Math.ceil(start * step) / step; + d[i1] = Math.floor(stop * step) / step; + this.domain(d); + } + return this; + }; + D3Linear.prototype.ticks = function (count) { + if (count === void 0) { count = DEFAULT_COUNT; } + return d3ArrayTicks(this._domain[0], this._domain[this._domain.length - 1], count || DEFAULT_COUNT); + }; + return D3Linear; +}()); +function d3ArrayTicks(start, stop, count) { + var reverse; + var i = -1; + var n; + var ticks; + var step; + (stop = +stop), (start = +start), (count = +count); + if (start === stop && count > 0) { + return [start]; + } + // tslint:disable-next-line + if ((reverse = stop < start)) { + (n = start), (start = stop), (stop = n); + } + // tslint:disable-next-line + if ((step = tickIncrement(start, stop, count)) === 0 || !isFinite(step)) { + return []; + } + if (step > 0) { + start = Math.ceil(start / step); + stop = Math.floor(stop / step); + ticks = new Array((n = Math.ceil(stop - start + 1))); + while (++i < n) { + ticks[i] = (start + i) * step; + } + } + else { + start = Math.floor(start * step); + stop = Math.ceil(stop * step); + ticks = new Array((n = Math.ceil(start - stop + 1))); + while (++i < n) { + ticks[i] = (start - i) / step; + } + } + if (reverse) { + ticks.reverse(); + } + return ticks; +} +function tickIncrement(start, stop, count) { + var step = (stop - start) / Math.max(0, count); + var power = Math.floor(Math.log(step) / Math.LN10); + var error = step / Math.pow(10, power); + return power >= 0 + ? (error >= e10 ? 10 : error >= e5 ? 5 : error >= e2 ? 2 : 1) * Math.pow(10, power) + : -Math.pow(10, -power) / (error >= e10 ? 10 : error >= e5 ? 5 : error >= e2 ? 2 : 1); +} + +function snapMultiple(v, base, snapType) { + var div; + if (snapType === 'ceil') { + div = Math.ceil(v / base); + } + else if (snapType === 'floor') { + div = Math.floor(v / base); + } + else { + div = Math.round(v / base); + } + return div * base; +} +function intervalTicks(min, max, interval) { + // 变成 interval 的倍数 + var minTick = snapMultiple(min, interval, 'floor'); + var maxTick = snapMultiple(max, interval, 'ceil'); + // 统一小数位数 + minTick = fixedBase(minTick, interval); + maxTick = fixedBase(maxTick, interval); + var ticks = []; + for (var i = minTick; i <= maxTick; i = i + interval) { + var tickValue = fixedBase(i, interval); // 防止浮点数加法出现问题 + ticks.push(tickValue); + } + return { + min: minTick, + max: maxTick, + ticks: ticks + }; +} + +/** + * 按照给定的 minLimit/maxLimit/tickCount 均匀计算出刻度 ticks + * + * @param cfg Scale 配置项 + * @return ticks + */ +function strictLimit(cfg, defaultMin, defaultMax) { + var _a; + var minLimit = cfg.minLimit, maxLimit = cfg.maxLimit, min = cfg.min, max = cfg.max, _b = cfg.tickCount, tickCount = _b === void 0 ? 5 : _b; + var tickMin = isNil(minLimit) ? (isNil(defaultMin) ? min : defaultMin) : minLimit; + var tickMax = isNil(maxLimit) ? (isNil(defaultMax) ? max : defaultMax) : maxLimit; + if (tickMin > tickMax) { + _a = [tickMin, tickMax], tickMax = _a[0], tickMin = _a[1]; + } + if (tickCount <= 2) { + return [tickMin, tickMax]; + } + var step = (tickMax - tickMin) / (tickCount - 1); + var ticks = []; + for (var i = 0; i < tickCount; i++) { + ticks.push(tickMin + step * i); + } + return ticks; +} + +function d3LinearTickMethod(cfg) { + var min = cfg.min, max = cfg.max, tickInterval = cfg.tickInterval, minLimit = cfg.minLimit, maxLimit = cfg.maxLimit; + var ticks = d3Linear(cfg); + if (!isNil(minLimit) || !isNil(maxLimit)) { + return strictLimit(cfg, head(ticks), last$1(ticks)); + } + if (tickInterval) { + return intervalTicks(min, max, tickInterval).ticks; + } + return ticks; +} + +/** + * 计算线性的 ticks，使用 wilkinson extended 方法 + * @param cfg 度量的配置项 + * @returns 计算后的 ticks + */ +function linear(cfg) { + var min = cfg.min, max = cfg.max, tickCount = cfg.tickCount, nice = cfg.nice, tickInterval = cfg.tickInterval, minLimit = cfg.minLimit, maxLimit = cfg.maxLimit; + var ticks = extended(min, max, tickCount, nice).ticks; + if (!isNil(minLimit) || !isNil(maxLimit)) { + return strictLimit(cfg, head(ticks), last$1(ticks)); + } + if (tickInterval) { + return intervalTicks(min, max, tickInterval).ticks; + } + return ticks; +} + +/** + * 计算 log 的 ticks，考虑 min = 0 的场景 + * @param cfg 度量的配置项 + * @returns 计算后的 ticks + */ +function calculateLogTicks(cfg) { + var base = cfg.base, tickCount = cfg.tickCount, min = cfg.min, max = cfg.max, values = cfg.values; + var minTick; + var maxTick = log$1(base, max); + if (min > 0) { + minTick = Math.floor(log$1(base, min)); + } + else { + var positiveMin = getLogPositiveMin(values, base, max); + minTick = Math.floor(log$1(base, positiveMin)); + } + var count = maxTick - minTick; + var avg = Math.ceil(count / tickCount); + var ticks = []; + for (var i = minTick; i < maxTick + avg; i = i + avg) { + ticks.push(Math.pow(base, i)); + } + if (min <= 0) { + // 最小值 <= 0 时显示 0 + ticks.unshift(0); + } + return ticks; +} + +function prettyNumber(n) { + return n < 1e-15 ? n : parseFloat(n.toFixed(15)); +} +function pretty(min, max, n) { + if (n === void 0) { n = 5; } + if (min === max) { + return { + max: max, + min: min, + ticks: [min], + }; + } + /* + R pretty: + https://svn.r-project.org/R/trunk/src/appl/pretty.c + https://www.rdocumentation.org/packages/base/versions/3.5.2/topics/pretty + */ + var h = 1.5; // high.u.bias + var h5 = 0.5 + 1.5 * h; // u5.bias + // 反正我也不会调参，跳过所有判断步骤 + var d = max - min; + var c = d / n; + // 当d非常小的时候触发，但似乎没什么用 + // const min_n = Math.floor(n / 3); + // const shrink_sml = Math.pow(2, 5); + // if (Math.log10(d) < -2) { + // c = (_.max([ Math.abs(max), Math.abs(min) ]) * shrink_sml) / min_n; + // } + var base = Math.pow(10, Math.floor(Math.log10(c))); + var unit = base; + if (2 * base - c < h * (c - unit)) { + unit = 2 * base; + if (5 * base - c < h5 * (c - unit)) { + unit = 5 * base; + if (10 * base - c < h * (c - unit)) { + unit = 10 * base; + } + } + } + var nu = Math.ceil(max / unit); + var ns = Math.floor(min / unit); + var hi = Math.max(nu * unit, max); + var lo = Math.min(ns * unit, min); + var size = Math.floor((hi - lo) / unit) + 1; + var ticks = new Array(size); + for (var i = 0; i < size; i++) { + ticks[i] = prettyNumber(lo + i * unit); + } + return { + min: lo, + max: hi, + ticks: ticks, + }; +} + +/** + * 计算 Pow 的 ticks + * @param cfg 度量的配置项 + * @returns 计算后的 ticks + */ +function calculatePowTicks(cfg) { + var exponent = cfg.exponent, tickCount = cfg.tickCount; + var max = Math.ceil(calBase(exponent, cfg.max)); + var min = Math.floor(calBase(exponent, cfg.min)); + var ticks = pretty(min, max, tickCount).ticks; + return ticks.map(function (tick) { + var factor = tick >= 0 ? 1 : -1; + return Math.pow(tick, exponent) * factor; + }); +} + +/** + * 计算几分位 https://github.com/simple-statistics/simple-statistics/blob/master/src/quantile_sorted.js + * @param x 数组 + * @param p 百分比 + */ +function quantileSorted$1(x, p) { + var idx = x.length * p; + /*if (x.length === 0) { // 当前场景这些条件不可能命中 + throw new Error('quantile requires at least one value.'); + } else if (p < 0 || p > 1) { + throw new Error('quantiles must be between 0 and 1'); + } else */ + if (p === 1) { + // If p is 1, directly return the last element + return x[x.length - 1]; + } + else if (p === 0) { + // If p is 0, directly return the first element + return x[0]; + } + else if (idx % 1 !== 0) { + // If p is not integer, return the next element in array + return x[Math.ceil(idx) - 1]; + } + else if (x.length % 2 === 0) { + // If the list has even-length, we'll take the average of this number + // and the next value, if there is one + return (x[idx - 1] + x[idx]) / 2; + } + else { + // Finally, in the simple case of an integer value + // with an odd-length list, return the x value at the index. + return x[idx]; + } +} +function calculateTicks(cfg) { + var tickCount = cfg.tickCount, values = cfg.values; + if (!values || !values.length) { + return []; + } + var sorted = values.slice().sort(function (a, b) { + return a - b; + }); + var ticks = []; + for (var i = 0; i < tickCount; i++) { + var p = i / (tickCount - 1); + ticks.push(quantileSorted$1(sorted, p)); + } + return ticks; +} + +/** + * 计算线性的 ticks，使用 R's pretty 方法 + * @param cfg 度量的配置项 + * @returns 计算后的 ticks + */ +function linearPretty(cfg) { + var min = cfg.min, max = cfg.max, tickCount = cfg.tickCount, tickInterval = cfg.tickInterval, minLimit = cfg.minLimit, maxLimit = cfg.maxLimit; + var ticks = pretty(min, max, tickCount).ticks; + if (!isNil(minLimit) || !isNil(maxLimit)) { + return strictLimit(cfg, head(ticks), last$1(ticks)); + } + if (tickInterval) { + return intervalTicks(min, max, tickInterval).ticks; + } + return ticks; +} + +function calculateTimeTicks(cfg) { + var min = cfg.min, max = cfg.max, minTickInterval = cfg.minTickInterval; + var tickInterval = cfg.tickInterval; + var tickCount = cfg.tickCount; + // 指定 tickInterval 后 tickCount 不生效，需要重新计算 + if (tickInterval) { + tickCount = Math.ceil((max - min) / tickInterval); + } + else { + tickInterval = getTickInterval(min, max, tickCount)[1]; + var count = (max - min) / tickInterval; + var ratio = count / tickCount; + if (ratio > 1) { + tickInterval = tickInterval * Math.ceil(ratio); + } + // 如果设置了最小间距，则使用最小间距 + if (minTickInterval && tickInterval < minTickInterval) { + tickInterval = minTickInterval; + } + } + var ticks = []; + for (var i = min; i < max + tickInterval; i += tickInterval) { + ticks.push(i); + } + return ticks; +} + +/** + * 计算时间分类的 ticks, 保头，保尾 + * @param cfg 度量的配置项 + * @returns 计算后的 ticks + */ +function calculateTimeCatTicks(cfg) { + var ticks = calculateCatTicks(cfg); + var lastValue = last$1(cfg.values); + if (lastValue !== last$1(ticks)) { + ticks.push(lastValue); + } + return ticks; +} + +function getYear(date) { + return new Date(date).getFullYear(); +} +function createYear(year) { + return new Date(year, 0, 1).getTime(); +} +function getMonth(date) { + return new Date(date).getMonth(); +} +function diffMonth(min, max) { + var minYear = getYear(min); + var maxYear = getYear(max); + var minMonth = getMonth(min); + var maxMonth = getMonth(max); + return (maxYear - minYear) * 12 + ((maxMonth - minMonth) % 12); +} +function creatMonth(year, month) { + return new Date(year, month, 1).getTime(); +} +function diffDay(min, max) { + return Math.ceil((max - min) / DAY); +} +function diffHour(min, max) { + return Math.ceil((max - min) / HOUR); +} +function diffMinus(min, max) { + return Math.ceil((max - min) / (60 * 1000)); +} +/** + * 计算 time 的 ticks，对 month, year 进行 pretty 处理 + * @param cfg 度量的配置项 + * @returns 计算后的 ticks + */ +function timePretty(cfg) { + var min = cfg.min, max = cfg.max, minTickInterval = cfg.minTickInterval, tickCount = cfg.tickCount; + var tickInterval = cfg.tickInterval; + var ticks = []; + // 指定 tickInterval 后 tickCount 不生效，需要重新计算 + if (!tickInterval) { + tickInterval = (max - min) / tickCount; + // 如果设置了最小间距，则使用最小间距 + if (minTickInterval && tickInterval < minTickInterval) { + tickInterval = minTickInterval; + } + } + var minYear = getYear(min); + // 如果间距大于 1 年，则将开始日期从整年开始 + if (tickInterval > YEAR) { + var maxYear = getYear(max); + var yearInterval = Math.ceil(tickInterval / YEAR); + for (var i = minYear; i <= maxYear + yearInterval; i = i + yearInterval) { + ticks.push(createYear(i)); + } + } + else if (tickInterval > MONTH) { + // 大于月时 + var monthInterval = Math.ceil(tickInterval / MONTH); + var mmMoth = getMonth(min); + var dMonths = diffMonth(min, max); + for (var i = 0; i <= dMonths + monthInterval; i = i + monthInterval) { + ticks.push(creatMonth(minYear, i + mmMoth)); + } + } + else if (tickInterval > DAY) { + // 大于天 + var date = new Date(min); + var year = date.getFullYear(); + var month = date.getMonth(); + var mday = date.getDate(); + var day = Math.ceil(tickInterval / DAY); + var ddays = diffDay(min, max); + for (var i = 0; i < ddays + day; i = i + day) { + ticks.push(new Date(year, month, mday + i).getTime()); + } + } + else if (tickInterval > HOUR) { + // 大于小时 + var date = new Date(min); + var year = date.getFullYear(); + var month = date.getMonth(); + var day = date.getDate(); + var hour = date.getHours(); + var hours = Math.ceil(tickInterval / HOUR); + var dHours = diffHour(min, max); + for (var i = 0; i <= dHours + hours; i = i + hours) { + ticks.push(new Date(year, month, day, hour + i).getTime()); + } + } + else if (tickInterval > MINUTE) { + // 大于分钟 + var dMinus = diffMinus(min, max); + var minutes = Math.ceil(tickInterval / MINUTE); + for (var i = 0; i <= dMinus + minutes; i = i + minutes) { + ticks.push(min + i * MINUTE); + } + } + else { + // 小于分钟 + var interval = tickInterval; + if (interval < SECOND) { + interval = SECOND; + } + var minSecond = Math.floor(min / SECOND) * SECOND; + var dSeconds = Math.ceil((max - min) / SECOND); + var seconds = Math.ceil(interval / SECOND); + for (var i = 0; i < dSeconds + seconds; i = i + seconds) { + ticks.push(minSecond + i * SECOND); + } + } + // 最好是能从算法能解决这个问题，但是如果指定了 tickInterval，计算 ticks，也只能这么算，所以 + // 打印警告提示 + if (ticks.length >= 512) { + console.warn("Notice: current ticks length(" + ticks.length + ") >= 512, may cause performance issues, even out of memory. Because of the configure \"tickInterval\"(in milliseconds, current is " + tickInterval + ") is too small, increase the value to solve the problem!"); + } + return ticks; +} + +registerTickMethod('cat', calculateCatTicks); +registerTickMethod('time-cat', calculateTimeCatTicks); +registerTickMethod('wilkinson-extended', linear); +registerTickMethod('r-pretty', linearPretty); +registerTickMethod('time', calculateTimeTicks); +registerTickMethod('time-pretty', timePretty); +registerTickMethod('log', calculateLogTicks); +registerTickMethod('pow', calculatePowTicks); +registerTickMethod('quantile', calculateTicks); +registerTickMethod('d3-linear', d3LinearTickMethod); + +registerClass('cat', Category$1); +registerClass('category', Category$1); +registerClass('identity', Identity); +registerClass('linear', Linear); +registerClass('log', Log); +registerClass('pow', Pow); +registerClass('time', Time); +registerClass('timeCat', TimeCat); +registerClass('quantize', Quantize); +registerClass('quantile', Quantile); + +// 所有的 attribute map +var ATTRIBUTE_MAP = {}; +/** + * 通过类型获得 Attribute 类 + * @param type + */ +var getAttribute = function (type) { + return ATTRIBUTE_MAP[type.toLowerCase()]; +}; +var registerAttribute = function (type, ctor) { + // 注册的时候，需要校验 type 重名，不区分大小写 + if (getAttribute(type)) { + throw new Error("Attribute type '" + type + "' existed."); + } + // 存储到 map 中 + ATTRIBUTE_MAP[type.toLowerCase()] = ctor; +}; + +registerAttribute('Color', Color$1); +registerAttribute('Opacity', Opacity); +registerAttribute('Position', Position); +registerAttribute('Shape', Shape$3); +registerAttribute('Size', Size); + +/** + * Coordinate Base Class + */ +var Coordinate = /** @class */ (function () { + function Coordinate(cfg) { + // 自身属性 + this.type = 'coordinate'; + this.isRect = false; + this.isHelix = false; + this.isPolar = false; + this.isReflectX = false; + this.isReflectY = false; + var start = cfg.start, end = cfg.end, _a = cfg.matrix, matrix = _a === void 0 ? [1, 0, 0, 0, 1, 0, 0, 0, 1] : _a, _b = cfg.isTransposed, isTransposed = _b === void 0 ? false : _b; + this.start = start; + this.end = end; + this.matrix = matrix; + this.originalMatrix = __spreadArray$3([], matrix); // 去除引用 + this.isTransposed = isTransposed; + } + /** + * 初始化流程 + */ + Coordinate.prototype.initial = function () { + // center、width、height + this.center = { + x: (this.start.x + this.end.x) / 2, + y: (this.start.y + this.end.y) / 2, + }; + this.width = Math.abs(this.end.x - this.start.x); + this.height = Math.abs(this.end.y - this.start.y); + }; + /** + * 更新配置 + * @param cfg + */ + Coordinate.prototype.update = function (cfg) { + mix(this, cfg); + this.initial(); + }; + Coordinate.prototype.convertDim = function (percent, dim) { + var _a; + var _b = this[dim], start = _b.start, end = _b.end; + // 交换 + if (this.isReflect(dim)) { + _a = [end, start], start = _a[0], end = _a[1]; + } + return start + percent * (end - start); + }; + Coordinate.prototype.invertDim = function (value, dim) { + var _a; + var _b = this[dim], start = _b.start, end = _b.end; + // 交换 + if (this.isReflect(dim)) { + _a = [end, start], start = _a[0], end = _a[1]; + } + return (value - start) / (end - start); + }; + /** + * 将坐标点进行矩阵变换 + * @param x 对应 x 轴画布坐标 + * @param y 对应 y 轴画布坐标 + * @param tag 默认为 0，可取值 0, 1 + * @return 返回变换后的三阶向量 [x, y, z] + */ + Coordinate.prototype.applyMatrix = function (x, y, tag) { + if (tag === void 0) { tag = 0; } + var matrix = this.matrix; + var vector = [x, y, tag]; + transformMat3$2(vector, vector, matrix); + return vector; + }; + /** + * 将坐标点进行矩阵逆变换 + * @param x 对应 x 轴画布坐标 + * @param y 对应 y 轴画布坐标 + * @param tag 默认为 0，可取值 0, 1 + * @return 返回矩阵逆变换后的三阶向量 [x, y, z] + */ + Coordinate.prototype.invertMatrix = function (x, y, tag) { + if (tag === void 0) { tag = 0; } + var matrix = this.matrix; + var inverted = invert$4([0, 0, 0, 0, 0, 0, 0, 0, 0], matrix); + var vector = [x, y, tag]; + if (inverted) { + // 如果为空则不进行矩阵变化，防止报错 + transformMat3$2(vector, vector, inverted); + } + return vector; + }; + /** + * 将归一化的坐标点数据转换为画布坐标，并根据坐标系当前矩阵进行变换 + * @param point 归一化的坐标点 + * @return 返回进行矩阵变换后的画布坐标 + */ + Coordinate.prototype.convert = function (point) { + var _a = this.convertPoint(point), x = _a.x, y = _a.y; + var vector = this.applyMatrix(x, y, 1); + return { + x: vector[0], + y: vector[1], + }; + }; + /** + * 将进行过矩阵变换画布坐标转换为归一化坐标 + * @param point 画布坐标 + * @return 返回归一化的坐标点 + */ + Coordinate.prototype.invert = function (point) { + var vector = this.invertMatrix(point.x, point.y, 1); + return this.invertPoint({ + x: vector[0], + y: vector[1], + }); + }; + /** + * 坐标系旋转变换 + * @param radian 旋转弧度 + * @return 返回坐标系对象 + */ + Coordinate.prototype.rotate = function (radian) { + var matrix = this.matrix; + var center = this.center; + leftTranslate$2(matrix, matrix, [-center.x, -center.y]); + leftRotate$2(matrix, matrix, radian); + leftTranslate$2(matrix, matrix, [center.x, center.y]); + return this; + }; + /** + * 坐标系反射变换 + * @param dim 反射维度 + * @return 返回坐标系对象 + */ + Coordinate.prototype.reflect = function (dim) { + if (dim === 'x') { + this.isReflectX = !this.isReflectX; + } + else { + this.isReflectY = !this.isReflectY; + } + return this; + }; + /** + * 坐标系比例变换 + * @param s1 x 方向缩放比例 + * @param s2 y 方向缩放比例 + * @return 返回坐标系对象 + */ + Coordinate.prototype.scale = function (s1, s2) { + var matrix = this.matrix; + var center = this.center; + leftTranslate$2(matrix, matrix, [-center.x, -center.y]); + leftScale$2(matrix, matrix, [s1, s2]); + leftTranslate$2(matrix, matrix, [center.x, center.y]); + return this; + }; + /** + * 坐标系平移变换 + * @param x x 方向平移像素 + * @param y y 方向平移像素 + * @return 返回坐标系对象 + */ + Coordinate.prototype.translate = function (x, y) { + var matrix = this.matrix; + leftTranslate$2(matrix, matrix, [x, y]); + return this; + }; + /** + * 将坐标系 x y 两个轴进行转置 + * @return 返回坐标系对象 + */ + Coordinate.prototype.transpose = function () { + this.isTransposed = !this.isTransposed; + return this; + }; + Coordinate.prototype.getCenter = function () { + return this.center; + }; + Coordinate.prototype.getWidth = function () { + return this.width; + }; + Coordinate.prototype.getHeight = function () { + return this.height; + }; + Coordinate.prototype.getRadius = function () { + return this.radius; + }; + /** + * whether has reflect + * @param dim + */ + Coordinate.prototype.isReflect = function (dim) { + return dim === 'x' ? this.isReflectX : this.isReflectY; + }; + /** + * 重置 matrix + * @param matrix 如果传入，则使用，否则使用构造函数中传入的默认 matrix + */ + Coordinate.prototype.resetMatrix = function (matrix) { + // 去除引用关系 + this.matrix = matrix ? matrix : __spreadArray$3([], this.originalMatrix); + }; + return Coordinate; +}()); +var Coordinate$1 = Coordinate; + +/** + * 笛卡尔坐标系 + * https://www.zhihu.com/question/20665303 + */ +var Cartesian = /** @class */ (function (_super) { + __extends$e(Cartesian, _super); + function Cartesian(cfg) { + var _this = _super.call(this, cfg) || this; + _this.isRect = true; + _this.type = 'cartesian'; + _this.initial(); + return _this; + } + Cartesian.prototype.initial = function () { + _super.prototype.initial.call(this); + var start = this.start; + var end = this.end; + this.x = { + start: start.x, + end: end.x, + }; + this.y = { + start: start.y, + end: end.y, + }; + }; + Cartesian.prototype.convertPoint = function (point) { + var _a; + var x = point.x, y = point.y; + // 交换 + if (this.isTransposed) { + _a = [y, x], x = _a[0], y = _a[1]; + } + return { + x: this.convertDim(x, 'x'), + y: this.convertDim(y, 'y'), + }; + }; + Cartesian.prototype.invertPoint = function (point) { + var _a; + var x = this.invertDim(point.x, 'x'); + var y = this.invertDim(point.y, 'y'); + if (this.isTransposed) { + _a = [y, x], x = _a[0], y = _a[1]; + } + return { x: x, y: y }; + }; + return Cartesian; +}(Coordinate$1)); + +/** + * 螺旋坐标系 + */ +var Helix = /** @class */ (function (_super) { + __extends$e(Helix, _super); + function Helix(cfg) { + var _this = _super.call(this, cfg) || this; + _this.isHelix = true; + _this.type = 'helix'; + var _a = cfg.startAngle, startAngle = _a === void 0 ? 1.25 * Math.PI : _a, _b = cfg.endAngle, endAngle = _b === void 0 ? 7.25 * Math.PI : _b, _c = cfg.innerRadius, innerRadius = _c === void 0 ? 0 : _c, radius = cfg.radius; + _this.startAngle = startAngle; + _this.endAngle = endAngle; + _this.innerRadius = innerRadius; + _this.radius = radius; + _this.initial(); + return _this; + } + Helix.prototype.initial = function () { + _super.prototype.initial.call(this); + var index = (this.endAngle - this.startAngle) / (2 * Math.PI) + 1; // 螺线圈数 + var maxRadius = Math.min(this.width, this.height) / 2; + if (this.radius && this.radius >= 0 && this.radius <= 1) { + maxRadius = maxRadius * this.radius; + } + this.d = Math.floor((maxRadius * (1 - this.innerRadius)) / index); + this.a = this.d / (Math.PI * 2); // 螺线系数 + this.x = { + start: this.startAngle, + end: this.endAngle, + }; + this.y = { + start: this.innerRadius * maxRadius, + end: this.innerRadius * maxRadius + this.d * 0.99, + }; + }; + /** + * 将百分比数据变成屏幕坐标 + * @param point 归一化的点坐标 + * @return 返回对应的屏幕坐标 + */ + Helix.prototype.convertPoint = function (point) { + var _a; + var x = point.x, y = point.y; + if (this.isTransposed) { + _a = [y, x], x = _a[0], y = _a[1]; + } + var thi = this.convertDim(x, 'x'); + var r = this.a * thi; + var newY = this.convertDim(y, 'y'); + return { + x: this.center.x + Math.cos(thi) * (r + newY), + y: this.center.y + Math.sin(thi) * (r + newY), + }; + }; + /** + * 将屏幕坐标点还原成百分比数据 + * @param point 屏幕坐标 + * @return 返回对应的归一化后的数据 + */ + Helix.prototype.invertPoint = function (point) { + var _a; + var d = this.d + this.y.start; + var v = subtract$2([0, 0], [point.x, point.y], [this.center.x, this.center.y]); + var thi = angleTo(v, [1, 0], true); + var rMin = thi * this.a; // 坐标与原点的连线在第一圈上的交点，最小r值 + if (length$1(v) < rMin) { + // 坐标与原点的连线不可能小于最小r值，但不排除因小数计算产生的略小于rMin的情况 + rMin = length$1(v); + } + var index = Math.floor((length$1(v) - rMin) / d); // 当前点位于第index圈 + thi = 2 * index * Math.PI + thi; + var r = this.a * thi; + var newY = length$1(v) - r; + newY = isNumberEqual$1(newY, 0) ? 0 : newY; + var x = this.invertDim(thi, 'x'); + var y = this.invertDim(newY, 'y'); + x = isNumberEqual$1(x, 0) ? 0 : x; + y = isNumberEqual$1(y, 0) ? 0 : y; + if (this.isTransposed) { + _a = [y, x], x = _a[0], y = _a[1]; + } + return { x: x, y: y }; + }; + return Helix; +}(Coordinate$1)); + +var Polar = /** @class */ (function (_super) { + __extends$e(Polar, _super); + function Polar(cfg) { + var _this = _super.call(this, cfg) || this; + _this.isPolar = true; + _this.type = 'polar'; + var _a = cfg.startAngle, startAngle = _a === void 0 ? -Math.PI / 2 : _a, _b = cfg.endAngle, endAngle = _b === void 0 ? (Math.PI * 3) / 2 : _b, _c = cfg.innerRadius, innerRadius = _c === void 0 ? 0 : _c, radius = cfg.radius; + _this.startAngle = startAngle; + _this.endAngle = endAngle; + _this.innerRadius = innerRadius; + _this.radius = radius; + _this.initial(); + return _this; + } + Polar.prototype.initial = function () { + _super.prototype.initial.call(this); + while (this.endAngle < this.startAngle) { + this.endAngle += Math.PI * 2; + } + var oneBox = this.getOneBox(); + var oneWidth = oneBox.maxX - oneBox.minX; + var oneHeight = oneBox.maxY - oneBox.minY; + var left = Math.abs(oneBox.minX) / oneWidth; + var top = Math.abs(oneBox.minY) / oneHeight; + var maxRadius; + if (this.height / oneHeight > this.width / oneWidth) { + // width 为主 + maxRadius = this.width / oneWidth; + this.circleCenter = { + x: this.center.x - (0.5 - left) * this.width, + y: this.center.y - (0.5 - top) * maxRadius * oneHeight, + }; + } + else { + // height 为主 + maxRadius = this.height / oneHeight; + this.circleCenter = { + x: this.center.x - (0.5 - left) * maxRadius * oneWidth, + y: this.center.y - (0.5 - top) * this.height, + }; + } + this.polarRadius = this.radius; + if (!this.radius) { + this.polarRadius = maxRadius; + } + else if (this.radius > 0 && this.radius <= 1) { + this.polarRadius = maxRadius * this.radius; + } + else if (this.radius <= 0 || this.radius > maxRadius) { + this.polarRadius = maxRadius; + } + this.x = { + start: this.startAngle, + end: this.endAngle, + }; + this.y = { + start: this.innerRadius * this.polarRadius, + end: this.polarRadius, + }; + }; + Polar.prototype.getRadius = function () { + return this.polarRadius; + }; + Polar.prototype.convertPoint = function (point) { + var _a; + var center = this.getCenter(); + var x = point.x, y = point.y; + if (this.isTransposed) { + _a = [y, x], x = _a[0], y = _a[1]; + } + x = this.convertDim(x, 'x'); + y = this.convertDim(y, 'y'); + return { + x: center.x + Math.cos(x) * y, + y: center.y + Math.sin(x) * y, + }; + }; + Polar.prototype.invertPoint = function (point) { + var _a; + var center = this.getCenter(); + var vPoint = [point.x - center.x, point.y - center.y]; + var _b = this, startAngle = _b.startAngle, endAngle = _b.endAngle; + if (this.isReflect('x')) { + _a = [endAngle, startAngle], startAngle = _a[0], endAngle = _a[1]; + } + var m = [1, 0, 0, 0, 1, 0, 0, 0, 1]; + leftRotate$2(m, m, startAngle); + var vStart3 = [1, 0, 0]; + transformMat3$2(vStart3, vStart3, m); + var vStart2 = [vStart3[0], vStart3[1]]; + var angle = angleTo(vStart2, vPoint, endAngle < startAngle); + if (isNumberEqual$1(angle, Math.PI * 2)) { + angle = 0; + } + var radius = length$1(vPoint); + var xPercent = angle / (endAngle - startAngle); + xPercent = endAngle - startAngle > 0 ? xPercent : -xPercent; + var yPercent = this.invertDim(radius, 'y'); + var rst = { x: 0, y: 0 }; + rst.x = this.isTransposed ? yPercent : xPercent; + rst.y = this.isTransposed ? xPercent : yPercent; + return rst; + }; + Polar.prototype.getCenter = function () { + return this.circleCenter; + }; + Polar.prototype.getOneBox = function () { + var startAngle = this.startAngle; + var endAngle = this.endAngle; + if (Math.abs(endAngle - startAngle) >= Math.PI * 2) { + return { + minX: -1, + maxX: 1, + minY: -1, + maxY: 1, + }; + } + var xs = [0, Math.cos(startAngle), Math.cos(endAngle)]; + var ys = [0, Math.sin(startAngle), Math.sin(endAngle)]; + for (var i = Math.min(startAngle, endAngle); i < Math.max(startAngle, endAngle); i += Math.PI / 18) { + xs.push(Math.cos(i)); + ys.push(Math.sin(i)); + } + return { + minX: Math.min.apply(Math, xs), + maxX: Math.max.apply(Math, xs), + minY: Math.min.apply(Math, ys), + maxY: Math.max.apply(Math, ys), + }; + }; + return Polar; +}(Coordinate$1)); + +// 所有的 Coordinate map +var COORDINATE_MAP = {}; +/** + * 通过类型获得 coordinate 类 + * @param type + */ +var getCoordinate = function (type) { + return COORDINATE_MAP[type.toLowerCase()]; +}; +/** + * 注册 coordinate 类 + * @param type + * @param ctor + */ +var registerCoordinate = function (type, ctor) { + // 存储到 map 中 + COORDINATE_MAP[type.toLowerCase()] = ctor; +}; + +registerCoordinate('rect', Cartesian); +registerCoordinate('cartesian', Cartesian); +registerCoordinate('polar', Polar); +registerCoordinate('helix', Helix); + +var SPACES = '\x09\x0a\x0b\x0c\x0d\x20\xa0\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000\u2028\u2029'; +var PATH_COMMAND = new RegExp("([a-z])[" + SPACES + ",]*((-?\\d*\\.?\\d*(?:e[\\-+]?\\d+)?[" + SPACES + "]*,?[" + SPACES + "]*)+)", 'ig'); +var PATH_VALUES = new RegExp("(-?\\d*\\.?\\d*(?:e[\\-+]?\\d+)?)[" + SPACES + "]*,?[" + SPACES + "]*", 'ig'); +// Parse given path string into an array of arrays of path segments +var parsePathString = function (pathString) { + if (!pathString) { + return null; + } + if (isArray$n(pathString)) { + return pathString; + } + var paramCounts = { + a: 7, + c: 6, + o: 2, + h: 1, + l: 2, + m: 2, + r: 4, + q: 4, + s: 4, + t: 2, + v: 1, + u: 3, + z: 0, + }; + var data = []; + String(pathString).replace(PATH_COMMAND, function (a, b, c) { + var params = []; + var name = b.toLowerCase(); + c.replace(PATH_VALUES, function (a, b) { + b && params.push(+b); + }); + if (name === 'm' && params.length > 2) { + data.push([b].concat(params.splice(0, 2))); + name = 'l'; + b = b === 'm' ? 'l' : 'L'; + } + if (name === 'o' && params.length === 1) { + data.push([b, params[0]]); + } + if (name === 'r') { + data.push([b].concat(params)); + } + else { + while (params.length >= paramCounts[name]) { + data.push([b].concat(params.splice(0, paramCounts[name]))); + if (!paramCounts[name]) { + break; + } + } + } + return pathString; + }); + return data; +}; +var isEqual = function (obj1, obj2) { + if (obj1.length !== obj2.length) { + return false; + } + var result = true; + each$2(obj1, function (item, i) { + if (item !== obj2[i]) { + result = false; + return false; + } + }); + return result; +}; +function getMinDiff(del, add, modify) { + var type = null; + var min = modify; + if (add < min) { + min = add; + type = 'add'; + } + if (del < min) { + min = del; + type = 'del'; + } + return { + type: type, + min: min, + }; +} +/* + * https://en.wikipedia.org/wiki/Levenshtein_distance + * 计算两条path的编辑距离 + */ +var levenshteinDistance = function (source, target) { + var sourceLen = source.length; + var targetLen = target.length; + var sourceSegment; + var targetSegment; + var temp = 0; + if (sourceLen === 0 || targetLen === 0) { + return null; + } + var dist = []; + for (var i = 0; i <= sourceLen; i++) { + dist[i] = []; + dist[i][0] = { min: i }; + } + for (var j = 0; j <= targetLen; j++) { + dist[0][j] = { min: j }; + } + for (var i = 1; i <= sourceLen; i++) { + sourceSegment = source[i - 1]; + for (var j = 1; j <= targetLen; j++) { + targetSegment = target[j - 1]; + if (isEqual(sourceSegment, targetSegment)) { + temp = 0; + } + else { + temp = 1; + } + var del = dist[i - 1][j].min + 1; + var add = dist[i][j - 1].min + 1; + var modify = dist[i - 1][j - 1].min + temp; + dist[i][j] = getMinDiff(del, add, modify); + } + } + return dist; +}; +var fillPathByDiff = function (source, target) { + var diffMatrix = levenshteinDistance(source, target); + var sourceLen = source.length; + var targetLen = target.length; + var changes = []; + var index = 1; + var minPos = 1; + // 如果source和target不是完全不相等 + if (diffMatrix[sourceLen][targetLen].min !== sourceLen) { + // 获取从source到target所需改动 + for (var i = 1; i <= sourceLen; i++) { + var min = diffMatrix[i][i].min; + minPos = i; + for (var j = index; j <= targetLen; j++) { + if (diffMatrix[i][j].min < min) { + min = diffMatrix[i][j].min; + minPos = j; + } + } + index = minPos; + if (diffMatrix[i][index].type) { + changes.push({ index: i - 1, type: diffMatrix[i][index].type }); + } + } + // 对source进行增删path + for (var i = changes.length - 1; i >= 0; i--) { + index = changes[i].index; + if (changes[i].type === 'add') { + source.splice(index, 0, [].concat(source[index])); + } + else { + source.splice(index, 1); + } + } + } + // source尾部补齐 + sourceLen = source.length; + var diff = targetLen - sourceLen; + if (sourceLen < targetLen) { + for (var i = 0; i < diff; i++) { + if (source[sourceLen - 1][0] === 'z' || source[sourceLen - 1][0] === 'Z') { + source.splice(sourceLen - 2, 0, source[sourceLen - 2]); + } + else { + source.push(source[sourceLen - 1]); + } + sourceLen += 1; + } + } + return source; +}; +// 将两个点均分成count个点 +function _splitPoints(points, former, count) { + var result = [].concat(points); + var index; + var t = 1 / (count + 1); + var formerEnd = _getSegmentPoints(former)[0]; + for (var i = 1; i <= count; i++) { + t *= i; + index = Math.floor(points.length * t); + if (index === 0) { + result.unshift([formerEnd[0] * t + points[index][0] * (1 - t), formerEnd[1] * t + points[index][1] * (1 - t)]); + } + else { + result.splice(index, 0, [ + formerEnd[0] * t + points[index][0] * (1 - t), + formerEnd[1] * t + points[index][1] * (1 - t), + ]); + } + } + return result; +} +/* + * 抽取pathSegment中的关键点 + * M,L,A,Q,H,V一个端点 + * Q, S抽取一个端点，一个控制点 + * C抽取一个端点，两个控制点 + */ +function _getSegmentPoints(segment) { + var points = []; + switch (segment[0]) { + case 'M': + points.push([segment[1], segment[2]]); + break; + case 'L': + points.push([segment[1], segment[2]]); + break; + case 'A': + points.push([segment[6], segment[7]]); + break; + case 'Q': + points.push([segment[3], segment[4]]); + points.push([segment[1], segment[2]]); + break; + case 'T': + points.push([segment[1], segment[2]]); + break; + case 'C': + points.push([segment[5], segment[6]]); + points.push([segment[1], segment[2]]); + points.push([segment[3], segment[4]]); + break; + case 'S': + points.push([segment[3], segment[4]]); + points.push([segment[1], segment[2]]); + break; + case 'H': + points.push([segment[1], segment[1]]); + break; + case 'V': + points.push([segment[1], segment[1]]); + break; + } + return points; +} +var formatPath = function (fromPath, toPath) { + if (fromPath.length <= 1) { + return fromPath; + } + var points; + for (var i = 0; i < toPath.length; i++) { + if (fromPath[i][0] !== toPath[i][0]) { + // 获取fromPath的pathSegment的端点，根据toPath的指令对其改造 + points = _getSegmentPoints(fromPath[i]); + switch (toPath[i][0]) { + case 'M': + fromPath[i] = ['M'].concat(points[0]); + break; + case 'L': + fromPath[i] = ['L'].concat(points[0]); + break; + case 'A': + fromPath[i] = [].concat(toPath[i]); + fromPath[i][6] = points[0][0]; + fromPath[i][7] = points[0][1]; + break; + case 'Q': + if (points.length < 2) { + if (i > 0) { + points = _splitPoints(points, fromPath[i - 1], 1); + } + else { + fromPath[i] = toPath[i]; + break; + } + } + fromPath[i] = ['Q'].concat(points.reduce(function (arr, i) { + return arr.concat(i); + }, [])); + break; + case 'T': + fromPath[i] = ['T'].concat(points[0]); + break; + case 'C': + if (points.length < 3) { + if (i > 0) { + points = _splitPoints(points, fromPath[i - 1], 2); + } + else { + fromPath[i] = toPath[i]; + break; + } + } + fromPath[i] = ['C'].concat(points.reduce(function (arr, i) { + return arr.concat(i); + }, [])); + break; + case 'S': + if (points.length < 2) { + if (i > 0) { + points = _splitPoints(points, fromPath[i - 1], 1); + } + else { + fromPath[i] = toPath[i]; + break; + } + } + fromPath[i] = ['S'].concat(points.reduce(function (arr, i) { + return arr.concat(i); + }, [])); + break; + default: + fromPath[i] = toPath[i]; + } + } + } + return fromPath; +}; + +var GraphEvent = /** @class */ (function () { + function GraphEvent(type, event) { + /** + * 是否允许冒泡 + * @type {boolean} + */ + this.bubbles = true; + /** + * 触发对象 + * @type {object} + */ + this.target = null; + /** + * 监听对象 + * @type {object} + */ + this.currentTarget = null; + /** + * 委托对象 + * @type {object} + */ + this.delegateTarget = null; + /** + * 委托事件监听对象的代理对象，即 ev.delegateObject = ev.currentTarget.get('delegateObject') + * @type {object} + */ + this.delegateObject = null; + /** + * 是否阻止了原生事件 + * @type {boolean} + */ + this.defaultPrevented = false; + /** + * 是否阻止传播（向上冒泡） + * @type {boolean} + */ + this.propagationStopped = false; + /** + * 触发事件的图形 + * @type {IShape} + */ + this.shape = null; + /** + * 开始触发事件的图形 + * @type {IShape} + */ + this.fromShape = null; + /** + * 事件结束时的触发图形 + * @type {IShape} + */ + this.toShape = null; + // 触发事件的路径 + this.propagationPath = []; + this.type = type; + this.name = type; + this.originalEvent = event; + this.timeStamp = event.timeStamp; + } + /** + * 阻止浏览器默认的行为 + */ + GraphEvent.prototype.preventDefault = function () { + this.defaultPrevented = true; + if (this.originalEvent.preventDefault) { + this.originalEvent.preventDefault(); + } + }; + /** + * 阻止冒泡 + */ + GraphEvent.prototype.stopPropagation = function () { + this.propagationStopped = true; + }; + GraphEvent.prototype.toString = function () { + var type = this.type; + return "[Event (type=" + type + ")]"; + }; + GraphEvent.prototype.save = function () { }; + GraphEvent.prototype.restore = function () { }; + return GraphEvent; +}()); + +function removeFromArray(arr, obj) { + var index = arr.indexOf(obj); + if (index !== -1) { + arr.splice(index, 1); + } +} +var isBrowser = typeof window !== 'undefined' && typeof window.document !== 'undefined'; +// 是否元素的父容器 +function isParent(container, shape) { + // 所有 shape 都是 canvas 的子元素 + if (container.isCanvas()) { + return true; + } + var parent = shape.getParent(); + var isParent = false; + while (parent) { + if (parent === container) { + isParent = true; + break; + } + parent = parent.getParent(); + } + return isParent; +} +function isAllowCapture(element) { + // @ts-ignore + return element.cfg.visible && element.cfg.capture; +} + +var Base$1 = /** @class */ (function (_super) { + __extends$e(Base, _super); + function Base(cfg) { + var _this = _super.call(this) || this; + /** + * 是否被销毁 + * @type {boolean} + */ + _this.destroyed = false; + var defaultCfg = _this.getDefaultCfg(); + _this.cfg = mix(defaultCfg, cfg); + return _this; + } + /** + * @protected + * 默认的配置项 + * @returns {object} 默认的配置项 + */ + Base.prototype.getDefaultCfg = function () { + return {}; + }; + // 实现接口的方法 + Base.prototype.get = function (name) { + return this.cfg[name]; + }; + // 实现接口的方法 + Base.prototype.set = function (name, value) { + this.cfg[name] = value; + }; + // 实现接口的方法 + Base.prototype.destroy = function () { + this.cfg = { + destroyed: true, + }; + this.off(); + this.destroyed = true; + }; + return Base; +}(EventEmitter)); + +/** + * @fileoverview 矩阵运算，本来是要引入 gl-matrix, 但是考虑到 g-mobile 对大小有限制，同时 g-webgl 使用的 matrix 不一致 + * 所以，这里仅实现 2D 几个运算，上层自己引入 gl-matrix + * @author dxq613@gmail.com + */ +/** + * 3阶矩阵相乘 + * @param {number[]} a 矩阵1 + * @param {number[]} b 矩阵2 + */ +function multiplyMatrix(a, b) { + var out = []; + var a00 = a[0]; + var a01 = a[1]; + var a02 = a[2]; + var a10 = a[3]; + var a11 = a[4]; + var a12 = a[5]; + var a20 = a[6]; + var a21 = a[7]; + var a22 = a[8]; + var b00 = b[0]; + var b01 = b[1]; + var b02 = b[2]; + var b10 = b[3]; + var b11 = b[4]; + var b12 = b[5]; + var b20 = b[6]; + var b21 = b[7]; + var b22 = b[8]; + out[0] = b00 * a00 + b01 * a10 + b02 * a20; + out[1] = b00 * a01 + b01 * a11 + b02 * a21; + out[2] = b00 * a02 + b01 * a12 + b02 * a22; + out[3] = b10 * a00 + b11 * a10 + b12 * a20; + out[4] = b10 * a01 + b11 * a11 + b12 * a21; + out[5] = b10 * a02 + b11 * a12 + b12 * a22; + out[6] = b20 * a00 + b21 * a10 + b22 * a20; + out[7] = b20 * a01 + b21 * a11 + b22 * a21; + out[8] = b20 * a02 + b21 * a12 + b22 * a22; + return out; +} +/** + * 3阶矩阵同2阶向量相乘 + * @param {number[]} m 矩阵 + * @param {number[]} v 二阶向量 + */ +function multiplyVec2$1(m, v) { + var out = []; + var x = v[0]; + var y = v[1]; + out[0] = m[0] * x + m[3] * y + m[6]; + out[1] = m[1] * x + m[4] * y + m[7]; + return out; +} +/** + * 矩阵的逆 + * @param {number[]} a 矩阵 + */ +function invert(a) { + var out = []; + var a00 = a[0]; + var a01 = a[1]; + var a02 = a[2]; + var a10 = a[3]; + var a11 = a[4]; + var a12 = a[5]; + var a20 = a[6]; + var a21 = a[7]; + var a22 = a[8]; + var b01 = a22 * a11 - a12 * a21; + var b11 = -a22 * a10 + a12 * a20; + var b21 = a21 * a10 - a11 * a20; + // Calculate the determinant + var det = a00 * b01 + a01 * b11 + a02 * b21; + if (!det) { + return null; + } + det = 1.0 / det; + out[0] = b01 * det; + out[1] = (-a22 * a01 + a02 * a21) * det; + out[2] = (a12 * a01 - a02 * a11) * det; + out[3] = b11 * det; + out[4] = (a22 * a00 - a02 * a20) * det; + out[5] = (-a12 * a00 + a02 * a10) * det; + out[6] = b21 * det; + out[7] = (-a21 * a00 + a01 * a20) * det; + out[8] = (a11 * a00 - a01 * a10) * det; + return out; +} + +var transform$g = transform$i; +var MATRIX = 'matrix'; +var CLONE_CFGS = ['zIndex', 'capture', 'visible', 'type']; +// 可以在 toAttrs 中设置，但不属于绘图属性的字段 +var RESERVED_PORPS = ['repeat']; +var DELEGATION_SPLIT = ':'; +var WILDCARD = '*'; +// 需要考虑数组嵌套数组的场景 +// 数组嵌套对象的场景不考虑 +function _cloneArrayAttr(arr) { + var result = []; + for (var i = 0; i < arr.length; i++) { + if (isArray$n(arr[i])) { + result.push([].concat(arr[i])); + } + else { + result.push(arr[i]); + } + } + return result; +} +function getFormatFromAttrs(toAttrs, shape) { + var fromAttrs = {}; + var attrs = shape.attrs; + for (var k in toAttrs) { + fromAttrs[k] = attrs[k]; + } + return fromAttrs; +} +function getFormatToAttrs(props, shape) { + var toAttrs = {}; + var attrs = shape.attr(); + each$2(props, function (v, k) { + if (RESERVED_PORPS.indexOf(k) === -1 && !isEqual$2(attrs[k], v)) { + toAttrs[k] = v; + } + }); + return toAttrs; +} +function checkExistedAttrs(animations, animation) { + if (animation.onFrame) { + return animations; + } + var startTime = animation.startTime, delay = animation.delay, duration = animation.duration; + var hasOwnProperty = Object.prototype.hasOwnProperty; + each$2(animations, function (item) { + // 后一个动画开始执行的时间 < 前一个动画的结束时间 && 后一个动画的执行时间 > 前一个动画的延迟 + if (startTime + delay < item.startTime + item.delay + item.duration && duration > item.delay) { + each$2(animation.toAttrs, function (v, k) { + if (hasOwnProperty.call(item.toAttrs, k)) { + delete item.toAttrs[k]; + delete item.fromAttrs[k]; + } + }); + } + }); + return animations; +} +var Element$3 = /** @class */ (function (_super) { + __extends$e(Element, _super); + function Element(cfg) { + var _this = _super.call(this, cfg) || this; + /** + * @protected + * 图形属性 + * @type {ShapeAttrs} + */ + _this.attrs = {}; + var attrs = _this.getDefaultAttrs(); + mix(attrs, cfg.attrs); + _this.attrs = attrs; + _this.initAttrs(attrs); + _this.initAnimate(); // 初始化动画 + return _this; + } + // override + Element.prototype.getDefaultCfg = function () { + return { + visible: true, + capture: true, + zIndex: 0, + }; + }; + /** + * @protected + * 获取默认的属相 + */ + Element.prototype.getDefaultAttrs = function () { + return { + matrix: this.getDefaultMatrix(), + opacity: 1, + }; + }; + /** + * @protected + * 一些方法调用会引起画布变化 + * @param {ChangeType} changeType 改变的类型 + */ + Element.prototype.onCanvasChange = function (changeType) { }; + /** + * @protected + * 初始化属性，有些属性需要加工 + * @param {object} attrs 属性值 + */ + Element.prototype.initAttrs = function (attrs) { }; + /** + * @protected + * 初始化动画 + */ + Element.prototype.initAnimate = function () { + this.set('animable', true); + this.set('animating', false); + }; + Element.prototype.isGroup = function () { + return false; + }; + Element.prototype.getParent = function () { + return this.get('parent'); + }; + Element.prototype.getCanvas = function () { + return this.get('canvas'); + }; + Element.prototype.attr = function () { + var _a; + var args = []; + for (var _i = 0; _i < arguments.length; _i++) { + args[_i] = arguments[_i]; + } + var name = args[0], value = args[1]; + if (!name) + return this.attrs; + if (isObject$f(name)) { + for (var k in name) { + this.setAttr(k, name[k]); + } + this.afterAttrsChange(name); + return this; + } + if (args.length === 2) { + this.setAttr(name, value); + this.afterAttrsChange((_a = {}, + _a[name] = value, + _a)); + return this; + } + return this.attrs[name]; + }; + // 是否被裁剪，被裁剪则不显示，不参与拾取 + Element.prototype.isClipped = function (refX, refY) { + var clip = this.getClip(); + return clip && !clip.isHit(refX, refY); + }; + /** + * 内部设置属性值的接口 + * @param {string} name 属性名 + * @param {any} value 属性值 + */ + Element.prototype.setAttr = function (name, value) { + var originValue = this.attrs[name]; + if (originValue !== value) { + this.attrs[name] = value; + this.onAttrChange(name, value, originValue); + } + }; + /** + * @protected + * 属性值发生改变 + * @param {string} name 属性名 + * @param {any} value 属性值 + * @param {any} originValue 属性值 + */ + Element.prototype.onAttrChange = function (name, value, originValue) { + if (name === 'matrix') { + this.set('totalMatrix', null); + } + }; + /** + * 属性更改后需要做的事情 + * @protected + */ + Element.prototype.afterAttrsChange = function (targetAttrs) { + if (this.cfg.isClipShape) { + var applyTo = this.cfg.applyTo; + if (applyTo) { + applyTo.onCanvasChange('clip'); + } + } + else { + this.onCanvasChange('attr'); + } + }; + Element.prototype.show = function () { + // 不是高频操作直接使用 set + this.set('visible', true); + this.onCanvasChange('show'); + return this; + }; + Element.prototype.hide = function () { + // 不是高频操作直接使用 set + this.set('visible', false); + this.onCanvasChange('hide'); + return this; + }; + Element.prototype.setZIndex = function (zIndex) { + this.set('zIndex', zIndex); + var parent = this.getParent(); + if (parent) { + // 改变 zIndex 不应该立即触发渲染 (调用 onCanvasChange('zIndex'))，需要经过 sort 再触发 + parent.sort(); + } + return this; + }; + Element.prototype.toFront = function () { + var parent = this.getParent(); + if (!parent) { + return; + } + var children = parent.getChildren(); + this.get('el'); + var index = children.indexOf(this); + children.splice(index, 1); + children.push(this); + this.onCanvasChange('zIndex'); + }; + Element.prototype.toBack = function () { + var parent = this.getParent(); + if (!parent) { + return; + } + var children = parent.getChildren(); + this.get('el'); + var index = children.indexOf(this); + children.splice(index, 1); + children.unshift(this); + this.onCanvasChange('zIndex'); + }; + Element.prototype.remove = function (destroy) { + if (destroy === void 0) { destroy = true; } + var parent = this.getParent(); + if (parent) { + removeFromArray(parent.getChildren(), this); + if (!parent.get('clearing')) { + // 如果父元素正在清理，当前元素不触发 remove + this.onCanvasChange('remove'); + } + } + else { + this.onCanvasChange('remove'); + } + if (destroy) { + this.destroy(); + } + }; + Element.prototype.resetMatrix = function () { + this.attr(MATRIX, this.getDefaultMatrix()); + this.onCanvasChange('matrix'); + }; + Element.prototype.getMatrix = function () { + return this.attr(MATRIX); + }; + Element.prototype.setMatrix = function (m) { + this.attr(MATRIX, m); + this.onCanvasChange('matrix'); + }; + // 获取总的 matrix + Element.prototype.getTotalMatrix = function () { + var totalMatrix = this.cfg.totalMatrix; + if (!totalMatrix) { + var currentMatrix = this.attr('matrix'); + var parentMatrix = this.cfg.parentMatrix; + if (parentMatrix && currentMatrix) { + totalMatrix = multiplyMatrix(parentMatrix, currentMatrix); + } + else { + totalMatrix = currentMatrix || parentMatrix; + } + this.set('totalMatrix', totalMatrix); + } + return totalMatrix; + }; + // 上层分组设置 matrix + Element.prototype.applyMatrix = function (matrix) { + var currentMatrix = this.attr('matrix'); + var totalMatrix = null; + if (matrix && currentMatrix) { + totalMatrix = multiplyMatrix(matrix, currentMatrix); + } + else { + totalMatrix = currentMatrix || matrix; + } + this.set('totalMatrix', totalMatrix); + this.set('parentMatrix', matrix); + }; + /** + * @protected + * 获取默认的矩阵 + * @returns {number[]|null} 默认的矩阵 + */ + Element.prototype.getDefaultMatrix = function () { + return null; + }; + // 将向量应用设置的矩阵 + Element.prototype.applyToMatrix = function (v) { + var matrix = this.attr('matrix'); + if (matrix) { + return multiplyVec2$1(matrix, v); + } + return v; + }; + // 根据设置的矩阵，将向量转换相对于图形/分组的位置 + Element.prototype.invertFromMatrix = function (v) { + var matrix = this.attr('matrix'); + if (matrix) { + var invertMatrix = invert(matrix); + if (invertMatrix) { + return multiplyVec2$1(invertMatrix, v); + } + } + return v; + }; + // 设置 clip + Element.prototype.setClip = function (clipCfg) { + var canvas = this.getCanvas(); + // 应该只设置当前元素的 clip，不应该去修改 clip 本身，方便 clip 被复用 + // TODO: setClip 的传参既 shape 配置，也支持 shape 对象 + // const preShape = this.get('clipShape'); + // if (preShape) { + // // 将之前的 clipShape 销毁 + // preShape.destroy(); + // } + var clipShape = null; + // 如果配置项为 null，则不移除 clipShape + if (clipCfg) { + var ShapeBase = this.getShapeBase(); + var shapeType = upperFirst(clipCfg.type); + var Cons = ShapeBase[shapeType]; + if (Cons) { + clipShape = new Cons({ + type: clipCfg.type, + isClipShape: true, + applyTo: this, + attrs: clipCfg.attrs, + canvas: canvas, + }); + } + } + this.set('clipShape', clipShape); + this.onCanvasChange('clip'); + return clipShape; + }; + Element.prototype.getClip = function () { + // 高频率调用的地方直接使用 this.cfg.xxx + var clipShape = this.cfg.clipShape; + // 未设置时返回 Null，保证一致性 + if (!clipShape) { + return null; + } + return clipShape; + }; + Element.prototype.clone = function () { + var _this = this; + var originAttrs = this.attrs; + var attrs = {}; + each$2(originAttrs, function (i, k) { + if (isArray$n(originAttrs[k])) { + attrs[k] = _cloneArrayAttr(originAttrs[k]); + } + else { + attrs[k] = originAttrs[k]; + } + }); + var cons = this.constructor; + // @ts-ignore + var clone = new cons({ attrs: attrs }); + each$2(CLONE_CFGS, function (cfgName) { + clone.set(cfgName, _this.get(cfgName)); + }); + return clone; + }; + Element.prototype.destroy = function () { + var destroyed = this.destroyed; + if (destroyed) { + return; + } + this.attrs = {}; + _super.prototype.destroy.call(this); + // this.onCanvasChange('destroy'); + }; + /** + * 是否处于动画暂停状态 + * @return {boolean} 是否处于动画暂停状态 + */ + Element.prototype.isAnimatePaused = function () { + return this.get('_pause').isPaused; + }; + /** + * 执行动画，支持多种函数签名 + * 1. animate(toAttrs: ElementAttrs, duration: number, easing?: string, callback?: () => void, delay?: number) + * 2. animate(onFrame: OnFrame, duration: number, easing?: string, callback?: () => void, delay?: number) + * 3. animate(toAttrs: ElementAttrs, cfg: AnimateCfg) + * 4. animate(onFrame: OnFrame, cfg: AnimateCfg) + * 各个参数的含义为: + * toAttrs 动画最终状态 + * onFrame 自定义帧动画函数 + * duration 动画执行时间 + * easing 动画缓动效果 + * callback 动画执行后的回调 + * delay 动画延迟时间 + */ + Element.prototype.animate = function () { + var args = []; + for (var _i = 0; _i < arguments.length; _i++) { + args[_i] = arguments[_i]; + } + if (!this.get('timeline') && !this.get('canvas')) { + return; + } + this.set('animating', true); + var timeline = this.get('timeline'); + if (!timeline) { + timeline = this.get('canvas').get('timeline'); + this.set('timeline', timeline); + } + var animations = this.get('animations') || []; + // 初始化 tick + if (!timeline.timer) { + timeline.initTimer(); + } + var toAttrs = args[0], duration = args[1], _a = args[2], easing = _a === void 0 ? 'easeLinear' : _a, _b = args[3], callback = _b === void 0 ? noop$3 : _b, _c = args[4], delay = _c === void 0 ? 0 : _c; + var onFrame; + var repeat; + var pauseCallback; + var resumeCallback; + var animateCfg; + // 第二个参数，既可以是动画最终状态 toAttrs，也可以是自定义帧动画函数 onFrame + if (isFunction$6(toAttrs)) { + onFrame = toAttrs; + toAttrs = {}; + } + else if (isObject$f(toAttrs) && toAttrs.onFrame) { + // 兼容 3.0 中的写法，onFrame 和 repeat 可在 toAttrs 中设置 + onFrame = toAttrs.onFrame; + repeat = toAttrs.repeat; + } + // 第二个参数，既可以是执行时间 duration，也可以是动画参数 animateCfg + if (isObject$f(duration)) { + animateCfg = duration; + duration = animateCfg.duration; + easing = animateCfg.easing || 'easeLinear'; + delay = animateCfg.delay || 0; + // animateCfg 中的设置优先级更高 + repeat = animateCfg.repeat || repeat || false; + callback = animateCfg.callback || noop$3; + pauseCallback = animateCfg.pauseCallback || noop$3; + resumeCallback = animateCfg.resumeCallback || noop$3; + } + else { + // 第四个参数，既可以是回调函数 callback，也可以是延迟时间 delay + if (isNumber$4(callback)) { + delay = callback; + callback = null; + } + // 第三个参数，既可以是缓动参数 easing，也可以是回调函数 callback + if (isFunction$6(easing)) { + callback = easing; + easing = 'easeLinear'; + } + else { + easing = easing || 'easeLinear'; + } + } + var formatToAttrs = getFormatToAttrs(toAttrs, this); + var animation = { + fromAttrs: getFormatFromAttrs(formatToAttrs, this), + toAttrs: formatToAttrs, + duration: duration, + easing: easing, + repeat: repeat, + callback: callback, + pauseCallback: pauseCallback, + resumeCallback: resumeCallback, + delay: delay, + startTime: timeline.getTime(), + id: uniqueId$3(), + onFrame: onFrame, + pathFormatted: false, + }; + // 如果动画元素队列中已经有这个图形了 + if (animations.length > 0) { + // 先检查是否需要合并属性。若有相同的动画，将该属性从前一个动画中删除,直接用后一个动画中 + animations = checkExistedAttrs(animations, animation); + } + else { + // 否则将图形添加到动画元素队列 + timeline.addAnimator(this); + } + animations.push(animation); + this.set('animations', animations); + this.set('_pause', { isPaused: false }); + }; + /** + * 停止动画 + * @param {boolean} toEnd 是否到动画的最终状态 + */ + Element.prototype.stopAnimate = function (toEnd) { + var _this = this; + if (toEnd === void 0) { toEnd = true; } + var animations = this.get('animations'); + each$2(animations, function (animation) { + // 将动画执行到最后一帧 + if (toEnd) { + if (animation.onFrame) { + _this.attr(animation.onFrame(1)); + } + else { + _this.attr(animation.toAttrs); + } + } + if (animation.callback) { + // 动画停止时的回调 + animation.callback(); + } + }); + this.set('animating', false); + this.set('animations', []); + }; + /** + * 暂停动画 + */ + Element.prototype.pauseAnimate = function () { + var timeline = this.get('timeline'); + var animations = this.get('animations'); + var pauseTime = timeline.getTime(); + each$2(animations, function (animation) { + animation._paused = true; + animation._pauseTime = pauseTime; + if (animation.pauseCallback) { + // 动画暂停时的回调 + animation.pauseCallback(); + } + }); + // 记录下是在什么时候暂停的 + this.set('_pause', { + isPaused: true, + pauseTime: pauseTime, + }); + return this; + }; + /** + * 恢复动画 + */ + Element.prototype.resumeAnimate = function () { + var timeline = this.get('timeline'); + var current = timeline.getTime(); + var animations = this.get('animations'); + var pauseTime = this.get('_pause').pauseTime; + // 之后更新属性需要计算动画已经执行的时长，如果暂停了，就把初始时间调后 + each$2(animations, function (animation) { + animation.startTime = animation.startTime + (current - pauseTime); + animation._paused = false; + animation._pauseTime = null; + if (animation.resumeCallback) { + animation.resumeCallback(); + } + }); + this.set('_pause', { + isPaused: false, + }); + this.set('animations', animations); + return this; + }; + /** + * 触发委托事件 + * @param {string} type 事件类型 + * @param {GraphEvent} eventObj 事件对象 + */ + Element.prototype.emitDelegation = function (type, eventObj) { + var _this = this; + var paths = eventObj.propagationPath; + this.getEvents(); + var relativeShape; + if (type === 'mouseenter') { + relativeShape = eventObj.fromShape; + } + else if (type === 'mouseleave') { + relativeShape = eventObj.toShape; + } + var _loop_1 = function (i) { + var element = paths[i]; + // 暂定跟 name 绑定 + var name_1 = element.get('name'); + if (name_1) { + // 第一个 mouseenter 和 mouseleave 的停止即可，因为后面的都是前面的 Parent + if ( + // 只有 element 是 Group 或者 Canvas 的时候，才需要判断 isParent + (element.isGroup() || (element.isCanvas && element.isCanvas())) && + relativeShape && + isParent(element, relativeShape)) { + return "break"; + } + if (isArray$n(name_1)) { + each$2(name_1, function (subName) { + _this.emitDelegateEvent(element, subName, eventObj); + }); + } + else { + this_1.emitDelegateEvent(element, name_1, eventObj); + } + } + }; + var this_1 = this; + // 至少有一个对象，且第一个对象为 shape + for (var i = 0; i < paths.length; i++) { + var state_1 = _loop_1(i); + if (state_1 === "break") + break; + } + }; + Element.prototype.emitDelegateEvent = function (element, name, eventObj) { + var events = this.getEvents(); + // 事件委托的形式 name:type + var eventName = name + DELEGATION_SPLIT + eventObj.type; + if (events[eventName] || events[WILDCARD]) { + // 对于通配符 *，事件名称 = 委托事件名称 + eventObj.name = eventName; + eventObj.currentTarget = element; + eventObj.delegateTarget = this; + // 将委托事件的监听对象 delegateObject 挂载到事件对象上 + eventObj.delegateObject = element.get('delegateObject'); + this.emit(eventName, eventObj); + } + }; + /** + * 移动元素 + * @param {number} translateX 水平移动距离 + * @param {number} translateY 垂直移动距离 + * @return {IElement} 元素 + */ + Element.prototype.translate = function (translateX, translateY) { + if (translateX === void 0) { translateX = 0; } + if (translateY === void 0) { translateY = 0; } + var matrix = this.getMatrix(); + var newMatrix = transform$g(matrix, [['t', translateX, translateY]]); + this.setMatrix(newMatrix); + return this; + }; + /** + * 移动元素到目标位置 + * @param {number} targetX 目标位置的水平坐标 + * @param {number} targetX 目标位置的垂直坐标 + * @return {IElement} 元素 + */ + Element.prototype.move = function (targetX, targetY) { + var x = this.attr('x') || 0; + var y = this.attr('y') || 0; + this.translate(targetX - x, targetY - y); + return this; + }; + /** + * 移动元素到目标位置，等价于 move 方法。由于 moveTo 的语义性更强，因此在文档中推荐使用 moveTo 方法 + * @param {number} targetX 目标位置的 x 轴坐标 + * @param {number} targetY 目标位置的 y 轴坐标 + * @return {IElement} 元素 + */ + Element.prototype.moveTo = function (targetX, targetY) { + return this.move(targetX, targetY); + }; + /** + * 缩放元素 + * @param {number} ratioX 水平缩放比例 + * @param {number} ratioY 垂直缩放比例 + * @return {IElement} 元素 + */ + Element.prototype.scale = function (ratioX, ratioY) { + var matrix = this.getMatrix(); + var newMatrix = transform$g(matrix, [['s', ratioX, ratioY || ratioX]]); + this.setMatrix(newMatrix); + return this; + }; + /** + * 以画布左上角 (0, 0) 为中心旋转元素 + * @param {number} radian 旋转角度(弧度值) + * @return {IElement} 元素 + */ + Element.prototype.rotate = function (radian) { + var matrix = this.getMatrix(); + var newMatrix = transform$g(matrix, [['r', radian]]); + this.setMatrix(newMatrix); + return this; + }; + /** + * 以起始点为中心旋转元素 + * @param {number} radian 旋转角度(弧度值) + * @return {IElement} 元素 + */ + Element.prototype.rotateAtStart = function (rotate) { + var _a = this.attr(), x = _a.x, y = _a.y; + var matrix = this.getMatrix(); + var newMatrix = transform$g(matrix, [ + ['t', -x, -y], + ['r', rotate], + ['t', x, y], + ]); + this.setMatrix(newMatrix); + return this; + }; + /** + * 以任意点 (x, y) 为中心旋转元素 + * @param {number} radian 旋转角度(弧度值) + * @return {IElement} 元素 + */ + Element.prototype.rotateAtPoint = function (x, y, rotate) { + var matrix = this.getMatrix(); + var newMatrix = transform$g(matrix, [ + ['t', -x, -y], + ['r', rotate], + ['t', x, y], + ]); + this.setMatrix(newMatrix); + return this; + }; + return Element; +}(Base$1)); + +var SHAPE_MAP = {}; +var INDEX = '_INDEX'; +/** + * 设置 canvas + * @param {IElement} element 元素 + * @param {ICanvas} canvas 画布 + */ +function setCanvas(element, canvas) { + element.set('canvas', canvas); + if (element.isGroup()) { + var children = element.get('children'); + if (children.length) { + children.forEach(function (child) { + setCanvas(child, canvas); + }); + } + } +} +/** + * 设置 timeline + * @param {IElement} element 元素 + * @param {Timeline} timeline 时间轴 + */ +function setTimeline(element, timeline) { + element.set('timeline', timeline); + if (element.isGroup()) { + var children = element.get('children'); + if (children.length) { + children.forEach(function (child) { + setTimeline(child, timeline); + }); + } + } +} +function removeChild(container, element, destroy) { + if (destroy === void 0) { destroy = true; } + // 不再调用 element.remove() 方法，会出现循环调用 + if (destroy) { + element.destroy(); + } + else { + element.set('parent', null); + element.set('canvas', null); + } + removeFromArray(container.getChildren(), element); +} +function getComparer(compare) { + return function (left, right) { + var result = compare(left, right); + return result === 0 ? left[INDEX] - right[INDEX] : result; + }; +} +var Container$1 = /** @class */ (function (_super) { + __extends$e(Container, _super); + function Container() { + return _super !== null && _super.apply(this, arguments) || this; + } + Container.prototype.isCanvas = function () { + return false; + }; + // 根据子节点确定 BBox + Container.prototype.getBBox = function () { + // 所有的值可能在画布的可视区外 + var minX = Infinity; + var maxX = -Infinity; + var minY = Infinity; + var maxY = -Infinity; + var xArr = []; + var yArr = []; + // 将可见元素、图形以及不为空的图形分组筛选出来，用于包围盒合并 + var children = this.getChildren().filter(function (child) { + return child.get('visible') && (!child.isGroup() || (child.isGroup() && child.getChildren().length > 0)); + }); + if (children.length > 0) { + each$2(children, function (child) { + var box = child.getBBox(); + xArr.push(box.minX, box.maxX); + yArr.push(box.minY, box.maxY); + }); + minX = min$6(xArr); + maxX = max$7(xArr); + minY = min$6(yArr); + maxY = max$7(yArr); + } + else { + minX = 0; + maxX = 0; + minY = 0; + maxY = 0; + } + var box = { + x: minX, + y: minY, + minX: minX, + minY: minY, + maxX: maxX, + maxY: maxY, + width: maxX - minX, + height: maxY - minY, + }; + return box; + }; + // 获取画布的包围盒 + Container.prototype.getCanvasBBox = function () { + var minX = Infinity; + var maxX = -Infinity; + var minY = Infinity; + var maxY = -Infinity; + var xArr = []; + var yArr = []; + // 将可见元素、图形以及不为空的图形分组筛选出来，用于包围盒合并 + var children = this.getChildren().filter(function (child) { + return child.get('visible') && (!child.isGroup() || (child.isGroup() && child.getChildren().length > 0)); + }); + if (children.length > 0) { + each$2(children, function (child) { + var box = child.getCanvasBBox(); + xArr.push(box.minX, box.maxX); + yArr.push(box.minY, box.maxY); + }); + minX = min$6(xArr); + maxX = max$7(xArr); + minY = min$6(yArr); + maxY = max$7(yArr); + } + else { + minX = 0; + maxX = 0; + minY = 0; + maxY = 0; + } + var box = { + x: minX, + y: minY, + minX: minX, + minY: minY, + maxX: maxX, + maxY: maxY, + width: maxX - minX, + height: maxY - minY, + }; + return box; + }; + Container.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + cfg['children'] = []; + return cfg; + }; + Container.prototype.onAttrChange = function (name, value, originValue) { + _super.prototype.onAttrChange.call(this, name, value, originValue); + if (name === 'matrix') { + var totalMatrix = this.getTotalMatrix(); + this._applyChildrenMarix(totalMatrix); + } + }; + // 不但应用到自己身上还要应用于子元素 + Container.prototype.applyMatrix = function (matrix) { + var preTotalMatrix = this.getTotalMatrix(); + _super.prototype.applyMatrix.call(this, matrix); + var totalMatrix = this.getTotalMatrix(); + // totalMatrix 没有发生变化时，这里仅考虑两者都为 null 时 + // 不继续向下传递矩阵 + if (totalMatrix === preTotalMatrix) { + return; + } + this._applyChildrenMarix(totalMatrix); + }; + // 在子元素上设置矩阵 + Container.prototype._applyChildrenMarix = function (totalMatrix) { + var children = this.getChildren(); + each$2(children, function (child) { + child.applyMatrix(totalMatrix); + }); + }; + // 兼容老版本的接口 + Container.prototype.addShape = function () { + var args = []; + for (var _i = 0; _i < arguments.length; _i++) { + args[_i] = arguments[_i]; + } + var type = args[0]; + var cfg = args[1]; + if (isObject$f(type)) { + cfg = type; + } + else { + cfg['type'] = type; + } + var shapeType = SHAPE_MAP[cfg.type]; + if (!shapeType) { + shapeType = upperFirst(cfg.type); + SHAPE_MAP[cfg.type] = shapeType; + } + var ShapeBase = this.getShapeBase(); + var shape = new ShapeBase[shapeType](cfg); + this.add(shape); + return shape; + }; + Container.prototype.addGroup = function () { + var args = []; + for (var _i = 0; _i < arguments.length; _i++) { + args[_i] = arguments[_i]; + } + var groupClass = args[0], cfg = args[1]; + var group; + if (isFunction$6(groupClass)) { + if (cfg) { + group = new groupClass(cfg); + } + else { + group = new groupClass({ + // canvas, + parent: this, + }); + } + } + else { + var tmpCfg = groupClass || {}; + var TmpGroupClass = this.getGroupBase(); + group = new TmpGroupClass(tmpCfg); + } + this.add(group); + return group; + }; + Container.prototype.getCanvas = function () { + var canvas; + if (this.isCanvas()) { + canvas = this; + } + else { + canvas = this.get('canvas'); + } + return canvas; + }; + Container.prototype.getShape = function (x, y, ev) { + // 如果不支持拾取，则直接返回 + if (!isAllowCapture(this)) { + return null; + } + var children = this.getChildren(); + var shape; + // 如果容器是 group + if (!this.isCanvas()) { + var v = [x, y, 1]; + // 将 x, y 转换成对应于 group 的局部坐标 + v = this.invertFromMatrix(v); + if (!this.isClipped(v[0], v[1])) { + shape = this._findShape(children, v[0], v[1], ev); + } + } + else { + shape = this._findShape(children, x, y, ev); + } + return shape; + }; + Container.prototype._findShape = function (children, x, y, ev) { + var shape = null; + for (var i = children.length - 1; i >= 0; i--) { + var child = children[i]; + if (isAllowCapture(child)) { + if (child.isGroup()) { + shape = child.getShape(x, y, ev); + } + else if (child.isHit(x, y)) { + shape = child; + } + } + if (shape) { + break; + } + } + return shape; + }; + Container.prototype.add = function (element) { + var canvas = this.getCanvas(); + var children = this.getChildren(); + var timeline = this.get('timeline'); + var preParent = element.getParent(); + if (preParent) { + removeChild(preParent, element, false); + } + element.set('parent', this); + if (canvas) { + setCanvas(element, canvas); + } + if (timeline) { + setTimeline(element, timeline); + } + children.push(element); + element.onCanvasChange('add'); + this._applyElementMatrix(element); + }; + // 将当前容器的矩阵应用到子元素 + Container.prototype._applyElementMatrix = function (element) { + var totalMatrix = this.getTotalMatrix(); + // 添加图形或者分组时，需要把当前图元的矩阵设置进去 + if (totalMatrix) { + element.applyMatrix(totalMatrix); + } + }; + Container.prototype.getChildren = function () { + return this.get('children'); + }; + Container.prototype.sort = function () { + var children = this.getChildren(); + // 稳定排序 + each$2(children, function (child, index) { + child[INDEX] = index; + return child; + }); + children.sort(getComparer(function (obj1, obj2) { + return obj1.get('zIndex') - obj2.get('zIndex'); + })); + this.onCanvasChange('sort'); + }; + Container.prototype.clear = function () { + this.set('clearing', true); + if (this.destroyed) { + return; + } + var children = this.getChildren(); + for (var i = children.length - 1; i >= 0; i--) { + children[i].destroy(); // 销毁子元素 + } + this.set('children', []); + this.onCanvasChange('clear'); + this.set('clearing', false); + }; + Container.prototype.destroy = function () { + if (this.get('destroyed')) { + return; + } + this.clear(); + _super.prototype.destroy.call(this); + }; + /** + * 获取第一个子元素 + * @return {IElement} 第一个元素 + */ + Container.prototype.getFirst = function () { + return this.getChildByIndex(0); + }; + /** + * 获取最后一个子元素 + * @return {IElement} 元素 + */ + Container.prototype.getLast = function () { + var children = this.getChildren(); + return this.getChildByIndex(children.length - 1); + }; + /** + * 根据索引获取子元素 + * @return {IElement} 第一个元素 + */ + Container.prototype.getChildByIndex = function (index) { + var children = this.getChildren(); + return children[index]; + }; + /** + * 子元素的数量 + * @return {number} 子元素数量 + */ + Container.prototype.getCount = function () { + var children = this.getChildren(); + return children.length; + }; + /** + * 是否包含对应元素 + * @param {IElement} element 元素 + * @return {boolean} + */ + Container.prototype.contain = function (element) { + var children = this.getChildren(); + return children.indexOf(element) > -1; + }; + /** + * 移除对应子元素 + * @param {IElement} element 子元素 + * @param {boolean} destroy 是否销毁子元素，默认为 true + */ + Container.prototype.removeChild = function (element, destroy) { + if (destroy === void 0) { destroy = true; } + if (this.contain(element)) { + element.remove(destroy); + } + }; + /** + * 查找所有匹配的元素 + * @param {ElementFilterFn} fn 匹配函数 + * @return {IElement[]} 元素数组 + */ + Container.prototype.findAll = function (fn) { + var rst = []; + var children = this.getChildren(); + each$2(children, function (element) { + if (fn(element)) { + rst.push(element); + } + if (element.isGroup()) { + rst = rst.concat(element.findAll(fn)); + } + }); + return rst; + }; + /** + * 查找元素，找到第一个返回 + * @param {ElementFilterFn} fn 匹配函数 + * @return {IElement|null} 元素，可以为空 + */ + Container.prototype.find = function (fn) { + var rst = null; + var children = this.getChildren(); + each$2(children, function (element) { + if (fn(element)) { + rst = element; + } + else if (element.isGroup()) { + rst = element.find(fn); + } + if (rst) { + return false; + } + }); + return rst; + }; + /** + * 根据 ID 查找元素 + * @param {string} id 元素 id + * @return {IElement|null} 元素 + */ + Container.prototype.findById = function (id) { + return this.find(function (element) { + return element.get('id') === id; + }); + }; + /** + * 该方法即将废弃，不建议使用 + * 根据 className 查找元素 + * TODO: 该方式定义暂时只给 G6 3.3 以后的版本使用，待 G6 中的 findByClassName 方法移除后，G 也需要同步移除 + * @param {string} className 元素 className + * @return {IElement | null} 元素 + */ + Container.prototype.findByClassName = function (className) { + return this.find(function (element) { + return element.get('className') === className; + }); + }; + /** + * 根据 name 查找元素列表 + * @param {string} name 元素名称 + * @return {IElement[]} 元素 + */ + Container.prototype.findAllByName = function (name) { + return this.findAll(function (element) { + return element.get('name') === name; + }); + }; + return Container; +}(Element$3)); + +var isColorProp = function (prop) { return ['fill', 'stroke', 'fillStyle', 'strokeStyle'].includes(prop); }; +var isGradientColor = function (val) { return /^[r,R,L,l]{1}[\s]*\(/.test(val); }; + +var IDENTITY_MATRIX = [1, 0, 0, 0, 1, 0, 0, 0, 1]; +/** + * 使用 ratio 进行插值计算来更新属性 + * @param {IElement} shape 元素 + * @param {Animation} animation 动画 + * @param {number} ratio 比例 + * @return {boolean} 动画是否执行完成 + */ +function _update(shape, animation, ratio) { + var cProps = {}; // 此刻属性 + var fromAttrs = animation.fromAttrs, toAttrs = animation.toAttrs; + if (shape.destroyed) { + return; + } + var interf; // 差值函数 + for (var k in toAttrs) { + if (!isEqual$2(fromAttrs[k], toAttrs[k])) { + if (k === 'path') { + var toPath = toAttrs[k]; + var fromPath = fromAttrs[k]; + if (toPath.length > fromPath.length) { + toPath = parsePathString(toAttrs[k]); // 终点状态 + fromPath = parsePathString(fromAttrs[k]); // 起始状态 + fromPath = fillPathByDiff(fromPath, toPath); + fromPath = formatPath(fromPath, toPath); + animation.fromAttrs.path = fromPath; + animation.toAttrs.path = toPath; + } + else if (!animation.pathFormatted) { + toPath = parsePathString(toAttrs[k]); + fromPath = parsePathString(fromAttrs[k]); + fromPath = formatPath(fromPath, toPath); + animation.fromAttrs.path = fromPath; + animation.toAttrs.path = toPath; + animation.pathFormatted = true; + } + cProps[k] = []; + for (var i = 0; i < toPath.length; i++) { + var toPathPoint = toPath[i]; + var fromPathPoint = fromPath[i]; + var cPathPoint = []; + for (var j = 0; j < toPathPoint.length; j++) { + if (isNumber$4(toPathPoint[j]) && fromPathPoint && isNumber$4(fromPathPoint[j])) { + interf = interpolate(fromPathPoint[j], toPathPoint[j]); + cPathPoint.push(interf(ratio)); + } + else { + cPathPoint.push(toPathPoint[j]); + } + } + cProps[k].push(cPathPoint); + } + } + else if (k === 'matrix') { + /* + 对矩阵进行插值时，需要保证矩阵不为空，为空则使用单位矩阵 + TODO: 二维和三维场景下单位矩阵不同，之后 WebGL 版需要做进一步处理 + */ + var matrixFn = interpolateArray(fromAttrs[k] || IDENTITY_MATRIX, toAttrs[k] || IDENTITY_MATRIX); + var currentMatrix = matrixFn(ratio); + cProps[k] = currentMatrix; + } + else if (isColorProp(k) && isGradientColor(toAttrs[k])) { + cProps[k] = toAttrs[k]; + } + else if (!isFunction$6(toAttrs[k])) { + // 非函数类型的值才能做插值 + interf = interpolate(fromAttrs[k], toAttrs[k]); + cProps[k] = interf(ratio); + } + } + } + shape.attr(cProps); +} +/** + * 根据自定义帧动画函数 onFrame 来更新属性 + * @param {IElement} shape 元素 + * @param {Animation} animation 动画 + * @param {number} elapsed 动画执行时间(毫秒) + * @return {boolean} 动画是否执行完成 + */ +function update(shape, animation, elapsed) { + var startTime = animation.startTime, delay = animation.delay; + // 如果还没有开始执行或暂停，先不更新 + if (elapsed < startTime + delay || animation._paused) { + return false; + } + var ratio; + var duration = animation.duration; + var easing = animation.easing; + // 已执行时间 + elapsed = elapsed - startTime - animation.delay; + if (animation.repeat) { + // 如果动画重复执行，则 elapsed > duration，计算 ratio 时需取模 + ratio = (elapsed % duration) / duration; + ratio = d3Ease[easing](ratio); + } + else { + ratio = elapsed / duration; + if (ratio < 1) { + // 动画未执行完 + ratio = d3Ease[easing](ratio); + } + else { + // 动画已执行完 + if (animation.onFrame) { + shape.attr(animation.onFrame(1)); + } + else { + shape.attr(animation.toAttrs); + } + return true; + } + } + if (animation.onFrame) { + var attrs = animation.onFrame(ratio); + shape.attr(attrs); + } + else { + _update(shape, animation, ratio); + } + return false; +} +var Timeline = /** @class */ (function () { + /** + * 时间轴构造函数，依赖于画布 + * @param {} + */ + function Timeline(canvas) { + /** + * 执行动画的元素列表 + * @type {IElement[]} + */ + this.animators = []; + /** + * 当前时间 + * @type {number} + */ + this.current = 0; + /** + * 定时器 + * @type {d3Timer.Timer} + */ + this.timer = null; + this.canvas = canvas; + } + /** + * 初始化定时器 + */ + Timeline.prototype.initTimer = function () { + var _this = this; + var isFinished = false; + var shape; + var animations; + var animation; + this.timer = timer$1(function (elapsed) { + _this.current = elapsed; + if (_this.animators.length > 0) { + for (var i = _this.animators.length - 1; i >= 0; i--) { + shape = _this.animators[i]; + if (shape.destroyed) { + // 如果已经被销毁，直接移出队列 + _this.removeAnimator(i); + continue; + } + if (!shape.isAnimatePaused()) { + animations = shape.get('animations'); + for (var j = animations.length - 1; j >= 0; j--) { + animation = animations[j]; + isFinished = update(shape, animation, elapsed); + if (isFinished) { + animations.splice(j, 1); + isFinished = false; + if (animation.callback) { + animation.callback(); + } + } + } + } + if (animations.length === 0) { + _this.removeAnimator(i); + } + } + var autoDraw = _this.canvas.get('autoDraw'); + // 非自动渲染模式下，手动调用 canvas.draw() 重新渲染 + if (!autoDraw) { + _this.canvas.draw(); + } + } + }); + }; + /** + * 增加动画元素 + */ + Timeline.prototype.addAnimator = function (shape) { + this.animators.push(shape); + }; + /** + * 移除动画元素 + */ + Timeline.prototype.removeAnimator = function (index) { + this.animators.splice(index, 1); + }; + /** + * 是否有动画在执行 + */ + Timeline.prototype.isAnimating = function () { + return !!this.animators.length; + }; + /** + * 停止定时器 + */ + Timeline.prototype.stop = function () { + if (this.timer) { + this.timer.stop(); + } + }; + /** + * 停止时间轴上所有元素的动画，并置空动画元素列表 + * @param {boolean} toEnd 是否到动画的最终状态，用来透传给动画元素的 stopAnimate 方法 + */ + Timeline.prototype.stopAllAnimations = function (toEnd) { + if (toEnd === void 0) { toEnd = true; } + this.animators.forEach(function (animator) { + animator.stopAnimate(toEnd); + }); + this.animators = []; + this.canvas.draw(); + }; + /** + * 获取当前时间 + */ + Timeline.prototype.getTime = function () { + return this.current; + }; + return Timeline; +}()); + +/** + * @fileoverview 事件处理器 + * @author dxq613@gmail.com + */ +var CLICK_OFFSET = 40; +var LEFT_BTN_CODE = 0; +var EVENTS$2 = [ + 'mousedown', + 'mouseup', + 'dblclick', + 'mouseout', + 'mouseover', + 'mousemove', + 'mouseleave', + 'mouseenter', + 'touchstart', + 'touchmove', + 'touchend', + 'dragenter', + 'dragover', + 'dragleave', + 'drop', + 'contextmenu', + 'mousewheel', +]; +// 触发目标事件，目标只能是 shape 或 canvas +function emitTargetEvent(target, type, eventObj) { + eventObj.name = type; + eventObj.target = target; + eventObj.currentTarget = target; + eventObj.delegateTarget = target; + target.emit(type, eventObj); +} +// 事件冒泡, enter 和 leave 需要对 fromShape 和 toShape 进行判同 +function bubbleEvent(container, type, eventObj) { + if (eventObj.bubbles) { + var relativeShape = void 0; + var isOverEvent = false; + if (type === 'mouseenter') { + relativeShape = eventObj.fromShape; + isOverEvent = true; + } + else if (type === 'mouseleave') { + isOverEvent = true; + relativeShape = eventObj.toShape; + } + // canvas 上的 mouseenter， mouseleave 事件，仅当进入或者移出 canvas 时触发 + if (container.isCanvas() && isOverEvent) { + return; + } + // 如果相关图形同当前图形在同一个容器内，不触发事件 + if (relativeShape && isParent(container, relativeShape)) { + // 阻止继续向上冒泡 + eventObj.bubbles = false; + return; + } + // 事件名称可能在委托过程中被修改，因此事件冒泡时需要重新设置事件名称 + eventObj.name = type; + eventObj.currentTarget = container; + eventObj.delegateTarget = container; + container.emit(type, eventObj); + } +} +var EventController$2 = /** @class */ (function () { + function EventController(cfg) { + var _this = this; + // 正在被拖拽的图形 + this.draggingShape = null; + this.dragging = false; + // 当前鼠标/touch所在位置的图形 + this.currentShape = null; + this.mousedownShape = null; + this.mousedownPoint = null; + // 统一处理所有的回调 + this._eventCallback = function (ev) { + var type = ev.type; + _this._triggerEvent(type, ev); + }; + // 在 document 处理拖拽到画布外的事件，处理从图形上移除画布未被捕捉的问题 + this._onDocumentMove = function (ev) { + var canvas = _this.canvas; + var el = canvas.get('el'); + if (el !== ev.target) { + // 不在 canvas 上移动 + if (_this.dragging || _this.currentShape) { + var pointInfo = _this._getPointInfo(ev); + // 还在拖拽过程中 + if (_this.dragging) { + _this._emitEvent('drag', ev, pointInfo, _this.draggingShape); + } + // 说明从某个图形直接移动到了画布外面， + // 修复了 mouseleave 的 bug 后不再出现这种情况 + // if (this.currentShape) { + // this._emitEvent('mouseleave', ev, pointInfo, this.currentShape, this.currentShape, null); + // this.currentShape = null; + // } + } + } + }; + // 在 document 上处理拖拽到外面，释放鼠标时触发 dragend + this._onDocumentMouseUp = function (ev) { + var canvas = _this.canvas; + var el = canvas.get('el'); + if (el !== ev.target) { + // 不在 canvas 上移动 + if (_this.dragging) { + var pointInfo = _this._getPointInfo(ev); + if (_this.draggingShape) { + // 如果存在拖拽的图形，则也触发 drop 事件 + _this._emitEvent('drop', ev, pointInfo, null); + } + _this._emitEvent('dragend', ev, pointInfo, _this.draggingShape); + _this._afterDrag(_this.draggingShape, pointInfo, ev); + } + } + }; + this.canvas = cfg.canvas; + } + EventController.prototype.init = function () { + this._bindEvents(); + }; + // 注册事件 + EventController.prototype._bindEvents = function () { + var _this = this; + var el = this.canvas.get('el'); + each$2(EVENTS$2, function (eventName) { + el.addEventListener(eventName, _this._eventCallback); + }); + if (document) { + // 处理移动到外面没有触发 shape mouse leave 的事件 + // 处理拖拽到外部的问题 + document.addEventListener('mousemove', this._onDocumentMove); + // 处理拖拽过程中在外部释放鼠标的问题 + document.addEventListener('mouseup', this._onDocumentMouseUp); + } + }; + // 清理事件 + EventController.prototype._clearEvents = function () { + var _this = this; + var el = this.canvas.get('el'); + each$2(EVENTS$2, function (eventName) { + el.removeEventListener(eventName, _this._eventCallback); + }); + if (document) { + document.removeEventListener('mousemove', this._onDocumentMove); + document.removeEventListener('mouseup', this._onDocumentMouseUp); + } + }; + EventController.prototype._getEventObj = function (type, event, point, target, fromShape, toShape) { + var eventObj = new GraphEvent(type, event); + eventObj.fromShape = fromShape; + eventObj.toShape = toShape; + eventObj.x = point.x; + eventObj.y = point.y; + eventObj.clientX = point.clientX; + eventObj.clientY = point.clientY; + eventObj.propagationPath.push(target); + // 事件的x,y应该是基于画布左上角的，与canvas的matrix无关 + return eventObj; + }; + // 根据点获取图形，提取成独立方法，便于后续优化 + EventController.prototype._getShape = function (point, ev) { + return this.canvas.getShape(point.x, point.y, ev); + }; + // 获取事件的当前点的信息 + EventController.prototype._getPointInfo = function (ev) { + var canvas = this.canvas; + var clientPoint = canvas.getClientByEvent(ev); + var point = canvas.getPointByEvent(ev); + return { + x: point.x, + y: point.y, + clientX: clientPoint.x, + clientY: clientPoint.y, + }; + }; + // 触发事件 + EventController.prototype._triggerEvent = function (type, ev) { + var pointInfo = this._getPointInfo(ev); + // 每次都获取图形有一定成本，后期可以考虑进行缓存策略 + var shape = this._getShape(pointInfo, ev); + var method = this["_on" + type]; + var leaveCanvas = false; + if (method) { + method.call(this, pointInfo, shape, ev); + } + else { + var preShape = this.currentShape; + // 如果进入、移出画布时存在图形，则要分别触发事件 + if (type === 'mouseenter' || type === 'dragenter' || type === 'mouseover') { + this._emitEvent(type, ev, pointInfo, null, null, shape); // 先进入画布 + if (shape) { + this._emitEvent(type, ev, pointInfo, shape, null, shape); // 再触发图形的事件 + } + if (type === 'mouseenter' && this.draggingShape) { + // 如果正在拖拽图形, 则触发 dragleave + this._emitEvent('dragenter', ev, pointInfo, null); + } + } + else if (type === 'mouseleave' || type === 'dragleave' || type === 'mouseout') { + leaveCanvas = true; + if (preShape) { + this._emitEvent(type, ev, pointInfo, preShape, preShape, null); // 先触发图形的事件 + } + this._emitEvent(type, ev, pointInfo, null, preShape, null); // 再触发离开画布事件 + if (type === 'mouseleave' && this.draggingShape) { + this._emitEvent('dragleave', ev, pointInfo, null); + } + } + else { + this._emitEvent(type, ev, pointInfo, shape, null, null); // 一般事件中不需要考虑 from, to + } + } + if (!leaveCanvas) { + this.currentShape = shape; + } + // 当鼠标从画布移动到 shape 或者从 preShape 移动到 shape 时，应用 shape 上的鼠标样式 + if (shape && !shape.get('destroyed')) { + var canvas = this.canvas; + var el = canvas.get('el'); + el.style.cursor = shape.attr('cursor') || canvas.get('cursor'); + } + }; + // 记录下点击的位置、图形，便于拖拽事件、click 事件的判定 + EventController.prototype._onmousedown = function (pointInfo, shape, event) { + // 只有鼠标左键的 mousedown 事件才会设置 mousedownShape 等属性，避免鼠标右键的 mousedown 事件引起其他事件发生 + if (event.button === LEFT_BTN_CODE) { + this.mousedownShape = shape; + this.mousedownPoint = pointInfo; + this.mousedownTimeStamp = event.timeStamp; + } + this._emitEvent('mousedown', event, pointInfo, shape, null, null); // mousedown 不考虑fromShape, toShape + }; + // mouseleave 和 mouseenter 都是成对存在的 + // mouseenter 和 mouseover 同时触发 + EventController.prototype._emitMouseoverEvents = function (event, pointInfo, fromShape, toShape) { + var el = this.canvas.get('el'); + if (fromShape !== toShape) { + if (fromShape) { + this._emitEvent('mouseout', event, pointInfo, fromShape, fromShape, toShape); + this._emitEvent('mouseleave', event, pointInfo, fromShape, fromShape, toShape); + // 当鼠标从 fromShape 移动到画布上时，重置鼠标样式 + if (!toShape || toShape.get('destroyed')) { + el.style.cursor = this.canvas.get('cursor'); + } + } + if (toShape) { + this._emitEvent('mouseover', event, pointInfo, toShape, fromShape, toShape); + this._emitEvent('mouseenter', event, pointInfo, toShape, fromShape, toShape); + } + } + }; + // dragover 不等同于 mouseover，而等同于 mousemove + EventController.prototype._emitDragoverEvents = function (event, pointInfo, fromShape, toShape, isCanvasEmit) { + if (toShape) { + if (toShape !== fromShape) { + if (fromShape) { + this._emitEvent('dragleave', event, pointInfo, fromShape, fromShape, toShape); + } + this._emitEvent('dragenter', event, pointInfo, toShape, fromShape, toShape); + } + if (!isCanvasEmit) { + this._emitEvent('dragover', event, pointInfo, toShape); + } + } + else if (fromShape) { + // TODO: 此处判断有问题，当 drag 图形时，也会触发一次 dragleave 事件，因为此时 toShape 为 null，这不是所期望的 + // 经过空白区域 + this._emitEvent('dragleave', event, pointInfo, fromShape, fromShape, toShape); + } + if (isCanvasEmit) { + this._emitEvent('dragover', event, pointInfo, toShape); + } + }; + // drag 完成后，需要做一些清理工作 + EventController.prototype._afterDrag = function (draggingShape, pointInfo, event) { + if (draggingShape) { + draggingShape.set('capture', true); // 恢复可以拾取 + this.draggingShape = null; + } + this.dragging = false; + // drag 完成后，有可能 draggingShape 已经移动到了当前位置，所以不能直接取当前图形 + var shape = this._getShape(pointInfo, event); + // 拖拽完成后，进行 enter，leave 的判定 + if (shape !== draggingShape) { + this._emitMouseoverEvents(event, pointInfo, draggingShape, shape); + } + this.currentShape = shape; // 更新当前 shape，如果不处理当前图形的 mouseleave 事件可能会出问题 + }; + // 按键抬起时，会终止拖拽、触发点击 + EventController.prototype._onmouseup = function (pointInfo, shape, event) { + // eevent.button === 0 表示鼠标左键事件，此处加上判断主要是为了避免右键鼠标会触发 mouseup 和 click 事件 + // ref: https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/button + if (event.button === LEFT_BTN_CODE) { + var draggingShape = this.draggingShape; + if (this.dragging) { + // 存在可以拖拽的图形，同时拖拽到其他图形上时触发 drag 事件 + if (draggingShape) { + this._emitEvent('drop', event, pointInfo, shape); + } + this._emitEvent('dragend', event, pointInfo, draggingShape); + this._afterDrag(draggingShape, pointInfo, event); + } + else { + this._emitEvent('mouseup', event, pointInfo, shape); // 先触发 mouseup 再触发 click + if (shape === this.mousedownShape) { + this._emitEvent('click', event, pointInfo, shape); + } + this.mousedownShape = null; + this.mousedownPoint = null; + } + } + }; + // 当触发浏览器的 dragover 事件时，不会再触发 mousemove ，所以这时候的 dragenter, dragleave 事件需要重新处理 + EventController.prototype._ondragover = function (pointInfo, shape, event) { + event.preventDefault(); // 如果不对 dragover 进行 preventDefault，则不会在 canvas 上触发 drop 事件 + var preShape = this.currentShape; + this._emitDragoverEvents(event, pointInfo, preShape, shape, true); + }; + // 大量的图形事件，都通过 mousemove 模拟 + EventController.prototype._onmousemove = function (pointInfo, shape, event) { + var canvas = this.canvas; + var preShape = this.currentShape; + var draggingShape = this.draggingShape; + // 正在拖拽时 + if (this.dragging) { + // 正在拖拽中 + if (draggingShape) { + // 如果拖拽了 shape 会触发 dragenter, dragleave, dragover 和 drag 事件 + this._emitDragoverEvents(event, pointInfo, preShape, shape, false); + } + // 如果存在 draggingShape 则会在 draggingShape 上触发 drag 事件，冒泡到 canvas 上 + // 否则在 canvas 上触发 drag 事件 + this._emitEvent('drag', event, pointInfo, draggingShape); + } + else { + var mousedownPoint = this.mousedownPoint; + if (mousedownPoint) { + // 当鼠标点击下去，同时移动时，进行 drag 判定 + var mousedownShape = this.mousedownShape; + var now = event.timeStamp; + var timeWindow = now - this.mousedownTimeStamp; + var dx = mousedownPoint.clientX - pointInfo.clientX; + var dy = mousedownPoint.clientY - pointInfo.clientY; + var dist = dx * dx + dy * dy; + if (timeWindow > 120 || dist > CLICK_OFFSET) { + if (mousedownShape && mousedownShape.get('draggable')) { + // 设置了 draggable 的 shape 才能触发 drag 相关的事件 + draggingShape = this.mousedownShape; // 拖动鼠标点下时的 shape + draggingShape.set('capture', false); // 禁止继续拾取，否则无法进行 dragover,dragenter,dragleave,drop的判定 + this.draggingShape = draggingShape; + this.dragging = true; + this._emitEvent('dragstart', event, pointInfo, draggingShape); + // 清理按下鼠标时缓存的值 + this.mousedownShape = null; + this.mousedownPoint = null; + } + else if (!mousedownShape && canvas.get('draggable')) { + // 设置了 draggable 的 canvas 才能触发 drag 相关的事件 + this.dragging = true; + this._emitEvent('dragstart', event, pointInfo, null); + // 清理按下鼠标时缓存的值 + this.mousedownShape = null; + this.mousedownPoint = null; + } + else { + this._emitMouseoverEvents(event, pointInfo, preShape, shape); + this._emitEvent('mousemove', event, pointInfo, shape); + } + } + else { + this._emitMouseoverEvents(event, pointInfo, preShape, shape); + this._emitEvent('mousemove', event, pointInfo, shape); + } + } + else { + // 没有按键按下时，则直接触发 mouse over 相关的各种事件 + this._emitMouseoverEvents(event, pointInfo, preShape, shape); + // 始终触发移动 + this._emitEvent('mousemove', event, pointInfo, shape); + } + } + }; + // 触发事件 + EventController.prototype._emitEvent = function (type, event, pointInfo, shape, fromShape, toShape) { + var eventObj = this._getEventObj(type, event, pointInfo, shape, fromShape, toShape); + // 存在 shape 触发，则进行冒泡处理 + if (shape) { + eventObj.shape = shape; + // 触发 shape 上的事件 + emitTargetEvent(shape, type, eventObj); + var parent_1 = shape.getParent(); + // 执行冒泡 + while (parent_1) { + // 委托事件要先触发 + parent_1.emitDelegation(type, eventObj); + // 事件冒泡停止，不能妨碍委托事件 + if (!eventObj.propagationStopped) { + bubbleEvent(parent_1, type, eventObj); + } + eventObj.propagationPath.push(parent_1); + parent_1 = parent_1.getParent(); + } + } + else { + // 如果没有 shape 直接在 canvas 上触发 + var canvas = this.canvas; + // 直接触发 canvas 上的事件 + emitTargetEvent(canvas, type, eventObj); + } + }; + EventController.prototype.destroy = function () { + // 清理事件 + this._clearEvents(); + // 清理缓存的对象 + this.canvas = null; + this.currentShape = null; + this.draggingShape = null; + this.mousedownPoint = null; + this.mousedownShape = null; + this.mousedownTimeStamp = null; + }; + return EventController; +}()); + +var PX_SUFFIX = 'px'; +var browser = detect(); +var isFirefox = browser && browser.name === 'firefox'; +/** @class */ ((function (_super) { + __extends$e(Canvas, _super); + function Canvas(cfg) { + var _this = _super.call(this, cfg) || this; + _this.initContainer(); + _this.initDom(); + _this.initEvents(); + _this.initTimeline(); + return _this; + } + Canvas.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + // set default cursor style for canvas + cfg['cursor'] = 'default'; + // CSS transform 目前尚未经过长时间验证，为了避免影响上层业务，默认关闭，上层按需开启 + cfg['supportCSSTransform'] = false; + return cfg; + }; + /** + * @protected + * 初始化容器 + */ + Canvas.prototype.initContainer = function () { + var container = this.get('container'); + if (isString$3(container)) { + container = document.getElementById(container); + this.set('container', container); + } + }; + /** + * @protected + * 初始化 DOM + */ + Canvas.prototype.initDom = function () { + var el = this.createDom(); + this.set('el', el); + // 附加到容器 + var container = this.get('container'); + container.appendChild(el); + // 设置初始宽度 + this.setDOMSize(this.get('width'), this.get('height')); + }; + /** + * @protected + * 初始化绑定的事件 + */ + Canvas.prototype.initEvents = function () { + var eventController = new EventController$2({ + canvas: this, + }); + eventController.init(); + this.set('eventController', eventController); + }; + /** + * @protected + * 初始化时间轴 + */ + Canvas.prototype.initTimeline = function () { + var timeline = new Timeline(this); + this.set('timeline', timeline); + }; + /** + * @protected + * 修改画布对应的 DOM 的大小 + * @param {number} width 宽度 + * @param {number} height 高度 + */ + Canvas.prototype.setDOMSize = function (width, height) { + var el = this.get('el'); + if (isBrowser) { + el.style.width = width + PX_SUFFIX; + el.style.height = height + PX_SUFFIX; + } + }; + // 实现接口 + Canvas.prototype.changeSize = function (width, height) { + this.setDOMSize(width, height); + this.set('width', width); + this.set('height', height); + this.onCanvasChange('changeSize'); + }; + /** + * 获取当前的渲染引擎 + * @return {Renderer} 返回当前的渲染引擎 + */ + Canvas.prototype.getRenderer = function () { + return this.get('renderer'); + }; + /** + * 获取画布的 cursor 样式 + * @return {Cursor} + */ + Canvas.prototype.getCursor = function () { + return this.get('cursor'); + }; + /** + * 设置画布的 cursor 样式 + * @param {Cursor} cursor cursor 样式 + */ + Canvas.prototype.setCursor = function (cursor) { + this.set('cursor', cursor); + var el = this.get('el'); + if (isBrowser && el) { + // 直接设置样式，不等待鼠标移动时再设置 + el.style.cursor = cursor; + } + }; + // 实现接口 + Canvas.prototype.getPointByEvent = function (ev) { + var supportCSSTransform = this.get('supportCSSTransform'); + if (supportCSSTransform) { + // For Firefox <= 38 + if (isFirefox && !isNil(ev.layerX) && ev.layerX !== ev.offsetX) { + return { + x: ev.layerX, + y: ev.layerY, + }; + } + if (!isNil(ev.offsetX)) { + // For IE6+, Firefox >= 39, Chrome, Safari, Opera + return { + x: ev.offsetX, + y: ev.offsetY, + }; + } + } + // should calculate by self for other cases, like Safari in ios + // TODO: support CSS transform + var _a = this.getClientByEvent(ev), clientX = _a.x, clientY = _a.y; + return this.getPointByClient(clientX, clientY); + }; + // 获取 touch 事件的 clientX 和 clientY 需要单独处理 + Canvas.prototype.getClientByEvent = function (ev) { + var clientInfo = ev; + if (ev.touches) { + if (ev.type === 'touchend') { + clientInfo = ev.changedTouches[0]; + } + else { + clientInfo = ev.touches[0]; + } + } + return { + x: clientInfo.clientX, + y: clientInfo.clientY, + }; + }; + // 实现接口 + Canvas.prototype.getPointByClient = function (clientX, clientY) { + var el = this.get('el'); + var bbox = el.getBoundingClientRect(); + return { + x: clientX - bbox.left, + y: clientY - bbox.top, + }; + }; + // 实现接口 + Canvas.prototype.getClientByPoint = function (x, y) { + var el = this.get('el'); + var bbox = el.getBoundingClientRect(); + return { + x: x + bbox.left, + y: y + bbox.top, + }; + }; + // 实现接口 + Canvas.prototype.draw = function () { }; + /** + * @protected + * 销毁 DOM 容器 + */ + Canvas.prototype.removeDom = function () { + var el = this.get('el'); + el.parentNode.removeChild(el); + }; + /** + * @protected + * 清理所有的事件 + */ + Canvas.prototype.clearEvents = function () { + var eventController = this.get('eventController'); + eventController.destroy(); + }; + Canvas.prototype.isCanvas = function () { + return true; + }; + Canvas.prototype.getParent = function () { + return null; + }; + Canvas.prototype.destroy = function () { + var timeline = this.get('timeline'); + if (this.get('destroyed')) { + return; + } + this.clear(); + // 同初始化时相反顺序调用 + if (timeline) { + // 画布销毁时自动停止动画 + timeline.stop(); + } + this.clearEvents(); + this.removeDom(); + _super.prototype.destroy.call(this); + }; + return Canvas; +})(Container$1)); + +/** @class */ ((function (_super) { + __extends$e(AbstractGroup, _super); + function AbstractGroup() { + return _super !== null && _super.apply(this, arguments) || this; + } + AbstractGroup.prototype.isGroup = function () { + return true; + }; + AbstractGroup.prototype.isEntityGroup = function () { + return false; + }; + AbstractGroup.prototype.clone = function () { + var clone = _super.prototype.clone.call(this); + // 获取构造函数 + var children = this.getChildren(); + for (var i = 0; i < children.length; i++) { + var child = children[i]; + clone.add(child.clone()); + } + return clone; + }; + return AbstractGroup; +})(Container$1)); + +/** @class */ ((function (_super) { + __extends$e(AbstractShape, _super); + function AbstractShape(cfg) { + return _super.call(this, cfg) || this; + } + // 是否在包围盒内 + AbstractShape.prototype._isInBBox = function (refX, refY) { + var bbox = this.getBBox(); + return bbox.minX <= refX && bbox.maxX >= refX && bbox.minY <= refY && bbox.maxY >= refY; + }; + /** + * 属性更改后需要做的事情 + * @protected + * @param {ShapeAttrs} targetAttrs 渲染的图像属性 + */ + AbstractShape.prototype.afterAttrsChange = function (targetAttrs) { + _super.prototype.afterAttrsChange.call(this, targetAttrs); + this.clearCacheBBox(); + }; + // 计算包围盒时，需要缓存，这是一个高频的操作 + AbstractShape.prototype.getBBox = function () { + var bbox = this.cfg.bbox; + if (!bbox) { + bbox = this.calculateBBox(); + this.set('bbox', bbox); + } + return bbox; + }; + // 计算相对于画布的包围盒 + AbstractShape.prototype.getCanvasBBox = function () { + var canvasBBox = this.cfg.canvasBBox; + if (!canvasBBox) { + canvasBBox = this.calculateCanvasBBox(); + this.set('canvasBBox', canvasBBox); + } + return canvasBBox; + }; + AbstractShape.prototype.applyMatrix = function (matrix) { + _super.prototype.applyMatrix.call(this, matrix); + // 清理掉缓存的包围盒 + this.set('canvasBBox', null); + }; + /** + * 计算相对于画布的包围盒，默认等同于 bbox + * @return {BBox} 包围盒 + */ + AbstractShape.prototype.calculateCanvasBBox = function () { + var bbox = this.getBBox(); + var totalMatrix = this.getTotalMatrix(); + var minX = bbox.minX, minY = bbox.minY, maxX = bbox.maxX, maxY = bbox.maxY; + if (totalMatrix) { + var topLeft = multiplyVec2$1(totalMatrix, [bbox.minX, bbox.minY]); + var topRight = multiplyVec2$1(totalMatrix, [bbox.maxX, bbox.minY]); + var bottomLeft = multiplyVec2$1(totalMatrix, [bbox.minX, bbox.maxY]); + var bottomRight = multiplyVec2$1(totalMatrix, [bbox.maxX, bbox.maxY]); + minX = Math.min(topLeft[0], topRight[0], bottomLeft[0], bottomRight[0]); + maxX = Math.max(topLeft[0], topRight[0], bottomLeft[0], bottomRight[0]); + minY = Math.min(topLeft[1], topRight[1], bottomLeft[1], bottomRight[1]); + maxY = Math.max(topLeft[1], topRight[1], bottomLeft[1], bottomRight[1]); + } + var attrs = this.attrs; + // 如果存在 shadow 则计算 shadow + if (attrs.shadowColor) { + var _a = attrs.shadowBlur, shadowBlur = _a === void 0 ? 0 : _a, _b = attrs.shadowOffsetX, shadowOffsetX = _b === void 0 ? 0 : _b, _c = attrs.shadowOffsetY, shadowOffsetY = _c === void 0 ? 0 : _c; + var shadowLeft = minX - shadowBlur + shadowOffsetX; + var shadowRight = maxX + shadowBlur + shadowOffsetX; + var shadowTop = minY - shadowBlur + shadowOffsetY; + var shadowBottom = maxY + shadowBlur + shadowOffsetY; + minX = Math.min(minX, shadowLeft); + maxX = Math.max(maxX, shadowRight); + minY = Math.min(minY, shadowTop); + maxY = Math.max(maxY, shadowBottom); + } + return { + x: minX, + y: minY, + minX: minX, + minY: minY, + maxX: maxX, + maxY: maxY, + width: maxX - minX, + height: maxY - minY, + }; + }; + /** + * @protected + * 清理缓存的 bbox + */ + AbstractShape.prototype.clearCacheBBox = function () { + this.set('bbox', null); + this.set('canvasBBox', null); + }; + // 实现接口 + AbstractShape.prototype.isClipShape = function () { + return this.get('isClipShape'); + }; + /** + * @protected + * 不同的图形自己实现是否在图形内部的逻辑，要判断边和填充区域 + * @param {number} refX 相对于图形的坐标 x + * @param {number} refY 相对于图形的坐标 Y + * @return {boolean} 点是否在图形内部 + */ + AbstractShape.prototype.isInShape = function (refX, refY) { + return false; + }; + /** + * 是否仅仅使用 BBox 检测就可以判定拾取到图形 + * 默认是 false，但是有些图形例如 image、marker 等都可直接使用 BBox 的检测而不需要使用图形拾取 + * @return {Boolean} 仅仅使用 BBox 进行拾取 + */ + AbstractShape.prototype.isOnlyHitBox = function () { + return false; + }; + // 不同的 Shape 各自实现 + AbstractShape.prototype.isHit = function (x, y) { + var startArrowShape = this.get('startArrowShape'); + var endArrowShape = this.get('endArrowShape'); + var vec = [x, y, 1]; + vec = this.invertFromMatrix(vec); + var refX = vec[0], refY = vec[1]; + var inBBox = this._isInBBox(refX, refY); + // 跳过图形的拾取，在某些图形中可以省略一倍的检测成本 + if (this.isOnlyHitBox()) { + return inBBox; + } + // 被裁减掉的和不在包围盒内的不进行计算 + if (inBBox && !this.isClipped(refX, refY)) { + // 对图形进行拾取判断 + if (this.isInShape(refX, refY)) { + return true; + } + // 对起始箭头进行拾取判断 + if (startArrowShape && startArrowShape.isHit(refX, refY)) { + return true; + } + // 对结束箭头进行拾取判断 + if (endArrowShape && endArrowShape.isHit(refX, refY)) { + return true; + } + } + return false; + }; + return AbstractShape; +})(Element$3)); + +var cache$1 = new Map(); +/** + * 注册计算包围盒的算法 + * @param type 方法名 + * @param method 方法 + */ +function register(type, method) { + cache$1.set(type, method); +} + +function rect$1 (shape) { + var attrs = shape.attr(); + var x = attrs.x, y = attrs.y, width = attrs.width, height = attrs.height; + return { + x: x, + y: y, + width: width, + height: height, + }; +} + +function circle$1 (shape) { + var _a = shape.attr(), x = _a.x, y = _a.y, r = _a.r; + return { + x: x - r, + y: y - r, + width: r * 2, + height: r * 2, + }; +} + +// 合并包围盒 +function mergeBBox$1(bbox1, bbox2) { + if (!bbox1 || !bbox2) { + return bbox1 || bbox2; + } + return { + minX: Math.min(bbox1.minX, bbox2.minX), + minY: Math.min(bbox1.minY, bbox2.minY), + maxX: Math.max(bbox1.maxX, bbox2.maxX), + maxY: Math.max(bbox1.maxY, bbox2.maxY), + }; +} +// 合并箭头的包围盒 +function mergeArrowBBox(shape, bbox) { + var startArrowShape = shape.get('startArrowShape'); + var endArrowShape = shape.get('endArrowShape'); + var startArrowBBox = null; + var endArrowBBox = null; + if (startArrowShape) { + startArrowBBox = startArrowShape.getCanvasBBox(); + bbox = mergeBBox$1(bbox, startArrowBBox); + } + if (endArrowShape) { + endArrowBBox = endArrowShape.getCanvasBBox(); + bbox = mergeBBox$1(bbox, endArrowBBox); + } + return bbox; +} + +function polyline (shape) { + var attrs = shape.attr(); + var points = attrs.points; + var xArr = []; + var yArr = []; + for (var i = 0; i < points.length; i++) { + var point = points[i]; + xArr.push(point[0]); + yArr.push(point[1]); + } + var _a = getBBoxByArray(xArr, yArr), x = _a.x, y = _a.y, width = _a.width, height = _a.height; + var bbox = { + minX: x, + minY: y, + maxX: x + width, + maxY: y + height, + }; + bbox = mergeArrowBBox(shape, bbox); + return { + x: bbox.minX, + y: bbox.minY, + width: bbox.maxX - bbox.minX, + height: bbox.maxY - bbox.minY, + }; +} + +function polygon$1 (shape) { + var attrs = shape.attr(); + var points = attrs.points; + var xArr = []; + var yArr = []; + for (var i = 0; i < points.length; i++) { + var point = points[i]; + xArr.push(point[0]); + yArr.push(point[1]); + } + return getBBoxByArray(xArr, yArr); +} + +// 全局设置一个唯一离屏的 ctx，用于计算 isPointInPath +var offScreenCtx = null; +function getOffScreenContext() { + if (!offScreenCtx) { + var canvas = document.createElement('canvas'); + canvas.width = 1; + canvas.height = 1; + offScreenCtx = canvas.getContext('2d'); + } + return offScreenCtx; +} + +/** + * 获取文本的高度 + * @param text 文本 + * @param fontSize 字体大小 + * @param lineHeight 行高，可以为空 + */ +function getTextHeight(text, fontSize, lineHeight) { + var lineCount = 1; + if (isString$3(text)) { + lineCount = text.split('\n').length; + } + if (lineCount > 1) { + var spaceingY = getLineSpaceing(fontSize, lineHeight); + return fontSize * lineCount + spaceingY * (lineCount - 1); + } + return fontSize; +} +/** + * 获取行间距如果文本多行，需要获取文本间距 + * @param fontSize 字体大小 + * @param lineHeight 行高 + */ +function getLineSpaceing(fontSize, lineHeight) { + return lineHeight ? lineHeight - fontSize : fontSize * 0.14; +} +/** + * 字体宽度 + * @param text 文本 + * @param font 字体 + */ +function getTextWidth(text, font) { + var context = getOffScreenContext(); // 获取离屏的 ctx 进行计算 + var width = 0; + // null 或者 undefined 时，宽度为 0 + if (isNil(text) || text === '') { + return width; + } + context.save(); + context.font = font; + if (isString$3(text) && text.includes('\n')) { + var textArr = text.split('\n'); + each$2(textArr, function (subText) { + var measureWidth = context.measureText(subText).width; + if (width < measureWidth) { + width = measureWidth; + } + }); + } + else { + width = context.measureText(text).width; + } + context.restore(); + return width; +} +function assembleFont(attrs) { + var fontSize = attrs.fontSize, fontFamily = attrs.fontFamily, fontWeight = attrs.fontWeight, fontStyle = attrs.fontStyle, fontVariant = attrs.fontVariant; + return [fontStyle, fontVariant, fontWeight, fontSize + "px", fontFamily].join(' ').trim(); +} + +function text (shape) { + var attrs = shape.attr(); + var x = attrs.x, y = attrs.y, text = attrs.text, fontSize = attrs.fontSize, lineHeight = attrs.lineHeight; + var font = attrs.font; + if (!font) { + // 如果未组装 font + font = assembleFont(attrs); + } + var width = getTextWidth(text, font); + var bbox; + if (!width) { + // 如果width不存在，四点共其实点 + bbox = { + x: x, + y: y, + width: 0, + height: 0, + }; + } + else { + var textAlign = attrs.textAlign, textBaseline = attrs.textBaseline; + var height = getTextHeight(text, fontSize, lineHeight); // attrs.height + // 默认左右对齐：left, 默认上下对齐 bottom + var point = { + x: x, + y: y - height, + }; + if (textAlign) { + if (textAlign === 'end' || textAlign === 'right') { + point.x -= width; + } + else if (textAlign === 'center') { + point.x -= width / 2; + } + } + if (textBaseline) { + if (textBaseline === 'top') { + point.y += height; + } + else if (textBaseline === 'middle') { + point.y += height / 2; + } + } + bbox = { + x: point.x, + y: point.y, + width: width, + height: height, + }; + } + return bbox; +} + +function getPathBox(segments, lineWidth) { + var xArr = []; + var yArr = []; + var segmentsWithAngle = []; + for (var i = 0; i < segments.length; i++) { + var segment = segments[i]; + var currentPoint = segment.currentPoint, params = segment.params, prePoint = segment.prePoint; + var box = void 0; + switch (segment.command) { + case 'Q': + box = QuadUtil.box(prePoint[0], prePoint[1], params[1], params[2], params[3], params[4]); + break; + case 'C': + box = CubicUtil.box(prePoint[0], prePoint[1], params[1], params[2], params[3], params[4], params[5], params[6]); + break; + case 'A': + var arcParams = segment.arcParams; + box = EllipseArcUtil.box(arcParams.cx, arcParams.cy, arcParams.rx, arcParams.ry, arcParams.xRotation, arcParams.startAngle, arcParams.endAngle); + break; + default: + xArr.push(currentPoint[0]); + yArr.push(currentPoint[1]); + break; + } + if (box) { + segment.box = box; + xArr.push(box.x, box.x + box.width); + yArr.push(box.y, box.y + box.height); + } + if (lineWidth && (segment.command === 'L' || segment.command === 'M') && segment.prePoint && segment.nextPoint) { + segmentsWithAngle.push(segment); + } + } + // bbox calculation should ignore NaN for path attribute + // ref: https://github.com/antvis/g/issues/210 + xArr = xArr.filter(function (item) { return !Number.isNaN(item); }); + yArr = yArr.filter(function (item) { return !Number.isNaN(item); }); + var minX = min$6(xArr); + var minY = min$6(yArr); + var maxX = max$7(xArr); + var maxY = max$7(yArr); + if (segmentsWithAngle.length === 0) { + return { + x: minX, + y: minY, + width: maxX - minX, + height: maxY - minY, + }; + } + for (var i = 0; i < segmentsWithAngle.length; i++) { + var segment = segmentsWithAngle[i]; + var currentPoint = segment.currentPoint; + var extra = void 0; + if (currentPoint[0] === minX) { + extra = getExtraFromSegmentWithAngle(segment, lineWidth); + minX = minX - extra.xExtra; + } + else if (currentPoint[0] === maxX) { + extra = getExtraFromSegmentWithAngle(segment, lineWidth); + maxX = maxX + extra.xExtra; + } + if (currentPoint[1] === minY) { + extra = getExtraFromSegmentWithAngle(segment, lineWidth); + minY = minY - extra.yExtra; + } + else if (currentPoint[1] === maxY) { + extra = getExtraFromSegmentWithAngle(segment, lineWidth); + maxY = maxY + extra.yExtra; + } + } + return { + x: minX, + y: minY, + width: maxX - minX, + height: maxY - minY, + }; +} +function getExtraFromSegmentWithAngle(segment, lineWidth) { + var prePoint = segment.prePoint, currentPoint = segment.currentPoint, nextPoint = segment.nextPoint; + var currentAndPre = Math.pow(currentPoint[0] - prePoint[0], 2) + Math.pow(currentPoint[1] - prePoint[1], 2); + var currentAndNext = Math.pow(currentPoint[0] - nextPoint[0], 2) + Math.pow(currentPoint[1] - nextPoint[1], 2); + var preAndNext = Math.pow(prePoint[0] - nextPoint[0], 2) + Math.pow(prePoint[1] - nextPoint[1], 2); + // 以 currentPoint 为顶点的夹角 + var currentAngle = Math.acos((currentAndPre + currentAndNext - preAndNext) / (2 * Math.sqrt(currentAndPre) * Math.sqrt(currentAndNext))); + // 夹角为空、 0 或 PI 时，不需要计算夹角处的额外宽度 + // 注意: 由于计算精度问题，夹角为 0 的情况计算出来的角度可能是一个很小的值，还需要判断其与 0 是否近似相等 + if (!currentAngle || Math.sin(currentAngle) === 0 || isNumberEqual$1(currentAngle, 0)) { + return { + xExtra: 0, + yExtra: 0, + }; + } + var xAngle = Math.abs(Math.atan2(nextPoint[1] - currentPoint[1], nextPoint[0] - currentPoint[0])); + var yAngle = Math.abs(Math.atan2(nextPoint[0] - currentPoint[0], nextPoint[1] - currentPoint[1])); + // 将夹角转为锐角 + xAngle = xAngle > Math.PI / 2 ? Math.PI - xAngle : xAngle; + yAngle = yAngle > Math.PI / 2 ? Math.PI - yAngle : yAngle; + // 这里不考虑在水平和垂直方向的投影，直接使用最大差值 + // 由于上层统一加减了二分之一线宽，这里需要进行弥补 + var extra = { + // 水平方向投影 + xExtra: Math.cos(currentAngle / 2 - xAngle) * ((lineWidth / 2) * (1 / Math.sin(currentAngle / 2))) - lineWidth / 2 || 0, + // 垂直方向投影 + yExtra: Math.cos(yAngle - currentAngle / 2) * ((lineWidth / 2) * (1 / Math.sin(currentAngle / 2))) - lineWidth / 2 || 0, + }; + return extra; +} +function path (shape) { + var attrs = shape.attr(); + var path = attrs.path, stroke = attrs.stroke; + var lineWidth = stroke ? attrs.lineWidth : 0; // 只有有 stroke 时，lineWidth 才生效 + var segments = shape.get('segments') || getSegments(path); + var _a = getPathBox(segments, lineWidth), x = _a.x, y = _a.y, width = _a.width, height = _a.height; + var bbox = { + minX: x, + minY: y, + maxX: x + width, + maxY: y + height, + }; + bbox = mergeArrowBBox(shape, bbox); + return { + x: bbox.minX, + y: bbox.minY, + width: bbox.maxX - bbox.minX, + height: bbox.maxY - bbox.minY, + }; +} + +function line$1 (shape) { + var attrs = shape.attr(); + var x1 = attrs.x1, y1 = attrs.y1, x2 = attrs.x2, y2 = attrs.y2; + var minX = Math.min(x1, x2); + var maxX = Math.max(x1, x2); + var minY = Math.min(y1, y2); + var maxY = Math.max(y1, y2); + var bbox = { + minX: minX, + maxX: maxX, + minY: minY, + maxY: maxY, + }; + bbox = mergeArrowBBox(shape, bbox); + return { + x: bbox.minX, + y: bbox.minY, + width: bbox.maxX - bbox.minX, + height: bbox.maxY - bbox.minY, + }; +} + +function ellipse (shape) { + var attrs = shape.attr(); + var x = attrs.x, y = attrs.y, rx = attrs.rx, ry = attrs.ry; + return { + x: x - rx, + y: y - ry, + width: rx * 2, + height: ry * 2, + }; +} + +register('rect', rect$1); +register('image', rect$1); // image 使用 rect 的包围盒计算 +register('circle', circle$1); +register('marker', circle$1); // marker 使用 circle 的计算方案 +register('polyline', polyline); +register('polygon', polygon$1); +register('text', text); +register('path', path); +register('line', line$1); +register('ellipse', ellipse); + +/** + * + * @param group 分组 + * @param eventName 事件名 + * @param eventObject 事件对象 + */ +function propagationDelegate(group, eventName, eventObject) { + var event = new GraphEvent(eventName, eventObject); + event.target = group; + event.propagationPath.push(group); // 从当前 group 开始触发 delegation + group.emitDelegation(eventName, event); + var parent = group.getParent(); + // 执行冒泡 + while (parent) { + // 委托事件要先触发 + parent.emitDelegation(eventName, event); + event.propagationPath.push(parent); + parent = parent.getParent(); + } +} + +var identityMatrix = [1, 0, 0, 0, 1, 0, 0, 0, 1]; +function getMatrixByAngle(point, angle, matrix) { + if (matrix === void 0) { matrix = identityMatrix; } + if (!angle) { + // 角度为 0 或者 null 时返回 null + return null; + } + var m = transform$i(matrix, [ + ['t', -point.x, -point.y], + ['r', angle], + ['t', point.x, point.y], + ]); + return m; +} +function getMatrixByTranslate(point, currentMatrix) { + if (!point.x && !point.y) { + // 0，0 或者 nan 的情况下返回 null + return null; + } + return transform$i(currentMatrix || identityMatrix, [['t', point.x, point.y]]); +} +// 从矩阵获取旋转的角度 +function getAngleByMatrix(matrix) { + var xVector = [1, 0, 0]; + var out = [0, 0, 0]; + transformMat3$2(out, xVector, matrix); + return Math.atan2(out[1], out[0]); +} +// 矩阵 * 向量 +function multiplyVec2(matrix, v) { + var out = [0, 0]; + transformMat3$1(out, v, matrix); + return out; +} +function applyMatrix2BBox(matrix, bbox) { + var topLeft = multiplyVec2(matrix, [bbox.minX, bbox.minY]); + var topRight = multiplyVec2(matrix, [bbox.maxX, bbox.minY]); + var bottomLeft = multiplyVec2(matrix, [bbox.minX, bbox.maxY]); + var bottomRight = multiplyVec2(matrix, [bbox.maxX, bbox.maxY]); + var minX = Math.min(topLeft[0], topRight[0], bottomLeft[0], bottomRight[0]); + var maxX = Math.max(topLeft[0], topRight[0], bottomLeft[0], bottomRight[0]); + var minY = Math.min(topLeft[1], topRight[1], bottomLeft[1], bottomRight[1]); + var maxY = Math.max(topLeft[1], topRight[1], bottomLeft[1], bottomRight[1]); + return { + x: minX, + y: minY, + minX: minX, + minY: minY, + maxX: maxX, + maxY: maxY, + width: maxX - minX, + height: maxY - minY, + }; +} +function applyRotate(shape, rotate, x, y) { + if (rotate) { + var matrix = getMatrixByAngle({ x: x, y: y }, rotate, shape.getMatrix()); + shape.setMatrix(matrix); + } +} +function applyTranslate(shape, x, y) { + var translateMatrix = getMatrixByTranslate({ x: x, y: y }); + shape.attr('matrix', translateMatrix); +} + +function formatPadding$1(padding) { + var top = 0; + var left = 0; + var right = 0; + var bottom = 0; + if (isNumber$4(padding)) { + top = left = right = bottom = padding; + } + else if (isArray$n(padding)) { + top = padding[0]; + right = !isNil(padding[1]) ? padding[1] : padding[0]; + bottom = !isNil(padding[2]) ? padding[2] : padding[0]; + left = !isNil(padding[3]) ? padding[3] : right; + } + return [top, right, bottom, left]; +} +function clearDom(container) { + var children = container.childNodes; + var length = children.length; + for (var i = length - 1; i >= 0; i--) { + container.removeChild(children[i]); + } +} +function hasClass(elements, cName) { + return !!elements.className.match(new RegExp("(\\s|^)" + cName + "(\\s|$)")); +} +function regionToBBox(region) { + var start = region.start, end = region.end; + var minX = Math.min(start.x, end.x); + var minY = Math.min(start.y, end.y); + var maxX = Math.max(start.x, end.x); + var maxY = Math.max(start.y, end.y); + return { + x: minX, + y: minY, + minX: minX, + minY: minY, + maxX: maxX, + maxY: maxY, + width: maxX - minX, + height: maxY - minY, + }; +} +function pointsToBBox(points) { + var xs = points.map(function (point) { return point.x; }); + var ys = points.map(function (point) { return point.y; }); + var minX = Math.min.apply(Math, xs); + var minY = Math.min.apply(Math, ys); + var maxX = Math.max.apply(Math, xs); + var maxY = Math.max.apply(Math, ys); + return { + x: minX, + y: minY, + minX: minX, + minY: minY, + maxX: maxX, + maxY: maxY, + width: maxX - minX, + height: maxY - minY, + }; +} +function createBBox(x, y, width, height) { + var maxX = x + width; + var maxY = y + height; + return { + x: x, + y: y, + width: width, + height: height, + minX: x, + minY: y, + // 非常奇葩的 js 特性 + // Infinity + Infinity = Infinity + // Infinity - Infinity = NaN + // fixed https://github.com/antvis/G2Plot/issues/1243 + maxX: isNaN(maxX) ? 0 : maxX, + maxY: isNaN(maxY) ? 0 : maxY, + }; +} +function getValueByPercent(min, max, percent) { + return (1 - percent) * min + max * percent; +} +function getCirclePoint(center, radius, angle) { + return { + x: center.x + Math.cos(angle) * radius, + y: center.y + Math.sin(angle) * radius, + }; +} +function distance$8(p1, p2) { + var dx = p2.x - p1.x; + var dy = p2.y - p1.y; + return Math.sqrt(dx * dx + dy * dy); +} +/** + * 判断两个数值 是否接近 + * - 解决精度问题（由于无法确定精度上限，根据具体场景可传入 精度 参数） + */ +var near = function (x, y, e) { + if (e === void 0) { e = Math.pow(Number.EPSILON, 0.5); } + return [x, y].includes(Infinity) ? Math.abs(x) === Math.abs(y) : Math.abs(x - y) < e; +}; +function intersectBBox$1(box1, box2) { + var minX = Math.max(box1.minX, box2.minX); + var minY = Math.max(box1.minY, box2.minY); + var maxX = Math.min(box1.maxX, box2.maxX); + var maxY = Math.min(box1.maxY, box2.maxY); + return createBBox(minX, minY, maxX - minX, maxY - minY); +} +function getBBoxWithClip(element) { + var clipShape = element.getClip(); + var clipBBox = clipShape && clipShape.getBBox(); + var bbox; + if (!element.isGroup()) { + // 如果是普通的图形 + bbox = element.getBBox(); + } + else { + var minX_1 = Infinity; + var maxX_1 = -Infinity; + var minY_1 = Infinity; + var maxY_1 = -Infinity; + var children = element.getChildren(); + if (children.length > 0) { + each$2(children, function (child) { + if (child.get('visible')) { + // 如果分组没有子元素，则直接跳过 + if (child.isGroup() && child.get('children').length === 0) { + return true; + } + var box = getBBoxWithClip(child); + // 计算 4 个顶点 + var leftTop = child.applyToMatrix([box.minX, box.minY, 1]); + var leftBottom = child.applyToMatrix([box.minX, box.maxY, 1]); + var rightTop = child.applyToMatrix([box.maxX, box.minY, 1]); + var rightBottom = child.applyToMatrix([box.maxX, box.maxY, 1]); + // 从中取最小的范围 + var boxMinX = Math.min(leftTop[0], leftBottom[0], rightTop[0], rightBottom[0]); + var boxMaxX = Math.max(leftTop[0], leftBottom[0], rightTop[0], rightBottom[0]); + var boxMinY = Math.min(leftTop[1], leftBottom[1], rightTop[1], rightBottom[1]); + var boxMaxY = Math.max(leftTop[1], leftBottom[1], rightTop[1], rightBottom[1]); + if (boxMinX < minX_1) { + minX_1 = boxMinX; + } + if (boxMaxX > maxX_1) { + maxX_1 = boxMaxX; + } + if (boxMinY < minY_1) { + minY_1 = boxMinY; + } + if (boxMaxY > maxY_1) { + maxY_1 = boxMaxY; + } + } + }); + } + else { + minX_1 = 0; + maxX_1 = 0; + minY_1 = 0; + maxY_1 = 0; + } + bbox = createBBox(minX_1, minY_1, maxX_1 - minX_1, maxY_1 - minY_1); + } + if (clipBBox) { + return intersectBBox$1(bbox, clipBBox); + } + else { + return bbox; + } +} +function updateClip(element, newElement) { + if (!element.getClip() && !newElement.getClip()) { + // 两者都没有 clip + return; + } + var newClipShape = newElement.getClip(); + if (!newClipShape) { + // 新的 element 没有 clip + element.setClip(null); // 移除 clip + return; + } + var clipCfg = { + type: newClipShape.get('type'), + attrs: newClipShape.attr(), + }; + element.setClip(clipCfg); +} +function toPx(number) { + return number + "px"; +} +function getTextPoint(start, end, position, offset) { + var lineLength = distance$8(start, end); + var offsetPercent = offset / lineLength; // 计算间距同线的比例，用于计算最终的位置 + var percent = 0; + if (position === 'start') { + percent = 0 - offsetPercent; + } + else if (position === 'end') { + percent = 1 + offsetPercent; + } + return { + x: getValueByPercent(start.x, end.x, percent), + y: getValueByPercent(start.y, end.y, percent), + }; +} + +var LOCATION_FIELD_MAP = { + none: [], + point: ['x', 'y'], + region: ['start', 'end'], + points: ['points'], + circle: ['center', 'radius', 'startAngle', 'endAngle'], +}; +var Component$1 = /** @class */ (function (_super) { + __extends$e(Component, _super); + function Component(cfg) { + var _this = _super.call(this, cfg) || this; + _this.initCfg(); + return _this; + } + /** + * @protected + * 默认的配置项 + * @returns {object} 默认的配置项 + */ + Component.prototype.getDefaultCfg = function () { + return { + id: '', + name: '', + type: '', + locationType: 'none', + offsetX: 0, + offsetY: 0, + animate: false, + capture: true, + updateAutoRender: false, + animateOption: { + appear: null, + update: { + duration: 400, + easing: 'easeQuadInOut', + }, + enter: { + duration: 400, + easing: 'easeQuadInOut', + }, + leave: { + duration: 350, + easing: 'easeQuadIn', + }, + }, + events: null, + defaultCfg: {}, + visible: true, + }; + }; + /** + * 清理组件的内容，一般配合 render 使用 + * @example + * axis.clear(); + * axis.render(); + */ + Component.prototype.clear = function () { }; + /** + * 更新组件 + * @param {object} cfg 更新属性 + */ + Component.prototype.update = function (cfg) { + var _this = this; + var defaultCfg = this.get('defaultCfg'); + each$2(cfg, function (value, name) { + var originCfg = _this.get(name); + var newCfg = value; + if (originCfg !== value) { + // 判断两者是否相等，主要是进行 null 的判定 + if (isObject$f(value) && defaultCfg[name]) { + // 新设置的属性与默认值进行合并 + newCfg = deepMix({}, defaultCfg[name], value); + } + _this.set(name, newCfg); + } + }); + this.updateInner(cfg); + this.afterUpdate(cfg); + }; + // 更新内部 + Component.prototype.updateInner = function (cfg) { + }; + Component.prototype.afterUpdate = function (cfg) { + // 更新时考虑显示、隐藏 + if (has$1(cfg, 'visible')) { + if (cfg.visible) { + this.show(); + } + else { + this.hide(); + } + } + // 更新时考虑capture + if (has$1(cfg, 'capture')) { + this.setCapture(cfg.capture); + } + }; + Component.prototype.getLayoutBBox = function () { + return this.getBBox(); // 默认返回 getBBox，不同的组件内部单独实现 + }; + Component.prototype.getLocationType = function () { + return this.get('locationType'); + }; + Component.prototype.getOffset = function () { + return { + offsetX: this.get('offsetX'), + offsetY: this.get('offsetY'), + }; + }; + // 默认使用 update + Component.prototype.setOffset = function (offsetX, offsetY) { + this.update({ + offsetX: offsetX, + offsetY: offsetY, + }); + }; + Component.prototype.setLocation = function (cfg) { + var location = __assign$r({}, cfg); + this.update(location); + }; + // 实现 ILocation 接口的 getLocation + Component.prototype.getLocation = function () { + var _this = this; + var location = {}; + var locationType = this.get('locationType'); + var fields = LOCATION_FIELD_MAP[locationType]; + each$2(fields, function (field) { + location[field] = _this.get(field); + }); + return location; + }; + Component.prototype.isList = function () { + return false; + }; + Component.prototype.isSlider = function () { + return false; + }; + /** + * @protected + * 初始化，用于具体的组件继承 + */ + Component.prototype.init = function () { }; + // 将组件默认的配置项设置合并到传入的配置项 + Component.prototype.initCfg = function () { + var _this = this; + var defaultCfg = this.get('defaultCfg'); + each$2(defaultCfg, function (value, name) { + var cfg = _this.get(name); + if (isObject$f(cfg)) { + var newCfg = deepMix({}, value, cfg); + _this.set(name, newCfg); + } + }); + }; + return Component; +}(Base$1)); + +var STATUS_UPDATE = 'update_status'; +var COPY_PROPERTIES = ['visible', 'tip', 'delegateObject']; // 更新对象时需要复制的属性 +var COPY_PROPERTIES_EXCLUDES = ['container', 'group', 'shapesMap', 'isRegister', 'isUpdating', 'destroyed']; // 更新子组件时排除的属性 +var GroupComponent = /** @class */ (function (_super) { + __extends$e(GroupComponent, _super); + function GroupComponent() { + return _super !== null && _super.apply(this, arguments) || this; + } + GroupComponent.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { container: null, + /** + * @private + * 缓存图形的 Map + */ + shapesMap: {}, group: null, capture: true, + /** + * @private 组件或者图形是否允许注册 + * @type {false} + */ + isRegister: false, + /** + * @private 是否正在更新 + * @type {false} + */ + isUpdating: false, + /** + * @private + * 是否初始状态，一旦 render，update 后，这个状态就变成 false, clear 后恢复 + */ + isInit: true }); + }; + GroupComponent.prototype.remove = function () { + this.clear(); + var group = this.get('group'); + group.remove(); + }; + GroupComponent.prototype.clear = function () { + var group = this.get('group'); + group.clear(); + this.set('shapesMap', {}); + this.clearOffScreenCache(); + this.set('isInit', true); + }; + GroupComponent.prototype.getChildComponentById = function (id) { + var group = this.getElementById(id); + var inst = group && group.get('component'); + return inst; + }; + GroupComponent.prototype.getElementById = function (id) { + return this.get('shapesMap')[id]; + }; + GroupComponent.prototype.getElementByLocalId = function (localId) { + var id = this.getElementId(localId); + return this.getElementById(id); + }; + GroupComponent.prototype.getElementsByName = function (name) { + var rst = []; + each$2(this.get('shapesMap'), function (elem) { + if (elem.get('name') === name) { + rst.push(elem); + } + }); + return rst; + }; + GroupComponent.prototype.getContainer = function () { + return this.get('container'); + }; + GroupComponent.prototype.updateInner = function (cfg) { + // this.updateInner(); + // this.set('isUpdating', false); + this.offScreenRender(); + if (this.get('updateAutoRender')) { + this.render(); + } + }; + GroupComponent.prototype.render = function () { + var offScreenGroup = this.get('offScreenGroup'); + if (!offScreenGroup) { + offScreenGroup = this.offScreenRender(); + } + var group = this.get('group'); + this.updateElements(offScreenGroup, group); + this.deleteElements(); + this.applyOffset(); + if (!this.get('eventInitted')) { + this.initEvent(); + this.set('eventInitted', true); + } + this.set('isInit', false); + }; + GroupComponent.prototype.show = function () { + var group = this.get('group'); + group.show(); + this.set('visible', true); + }; + GroupComponent.prototype.hide = function () { + var group = this.get('group'); + group.hide(); + this.set('visible', false); + }; + GroupComponent.prototype.setCapture = function (capture) { + var group = this.get('group'); + group.set('capture', capture); + this.set('capture', capture); + }; + GroupComponent.prototype.destroy = function () { + this.removeEvent(); + this.remove(); + _super.prototype.destroy.call(this); + }; + GroupComponent.prototype.getBBox = function () { + return this.get('group').getCanvasBBox(); + }; + GroupComponent.prototype.getLayoutBBox = function () { + var group = this.get('group'); + // 防止被 clear 了，offScreenBBox 不存在 + var bbox = this.getInnerLayoutBBox(); + var matrix = group.getTotalMatrix(); + if (matrix) { + bbox = applyMatrix2BBox(matrix, bbox); + } + return bbox; // 默认返回 getBBox，不同的组件内部单独实现 + }; + // 复写 on, off, emit 透传到 group + GroupComponent.prototype.on = function (evt, callback, once) { + var group = this.get('group'); + group.on(evt, callback, once); + return this; + }; + GroupComponent.prototype.off = function (evt, callback) { + var group = this.get('group'); + group && group.off(evt, callback); + return this; + }; + GroupComponent.prototype.emit = function (eventName, eventObject) { + var group = this.get('group'); + group.emit(eventName, eventObject); + }; + GroupComponent.prototype.init = function () { + _super.prototype.init.call(this); + if (!this.get('group')) { + this.initGroup(); + } + this.offScreenRender(); // 绘制离屏 group + }; + // 获取组件内部布局占的包围盒 + GroupComponent.prototype.getInnerLayoutBBox = function () { + return this.get('offScreenBBox') || this.get('group').getBBox(); + }; + // 抛出委托对象 + GroupComponent.prototype.delegateEmit = function (eventName, eventObject) { + var group = this.get('group'); + eventObject.target = group; + group.emit(eventName, eventObject); + propagationDelegate(group, eventName, eventObject); + }; + // 创建离屏的 group ,不添加在 canvas 中 + GroupComponent.prototype.createOffScreenGroup = function () { + var group = this.get('group'); + var GroupClass = group.getGroupBase(); // 获取分组的构造函数 + var newGroup = new GroupClass({ + delegateObject: this.getDelegateObject(), + }); + return newGroup; + }; + // 应用 offset + GroupComponent.prototype.applyOffset = function () { + var offsetX = this.get('offsetX'); + var offsetY = this.get('offsetY'); + this.moveElementTo(this.get('group'), { + x: offsetX, + y: offsetY, + }); + }; + GroupComponent.prototype.initGroup = function () { + var container = this.get('container'); + this.set('group', container.addGroup({ + id: this.get('id'), + name: this.get('name'), + capture: this.get('capture'), + visible: this.get('visible'), + isComponent: true, + component: this, + delegateObject: this.getDelegateObject(), + })); + }; + // 离屏渲染 + GroupComponent.prototype.offScreenRender = function () { + this.clearOffScreenCache(); + var offScreenGroup = this.createOffScreenGroup(); + this.renderInner(offScreenGroup); + this.set('offScreenGroup', offScreenGroup); + // 包含包围盒的 bbox + this.set('offScreenBBox', getBBoxWithClip(offScreenGroup)); + return offScreenGroup; + }; + /** + * @protected + * 在组件上添加分组，主要解决 isReigeter 的问题 + * @param {IGroup} parent 父元素 + * @param {object} cfg 分组的配置项 + */ + GroupComponent.prototype.addGroup = function (parent, cfg) { + this.appendDelegateObject(parent, cfg); + var group = parent.addGroup(cfg); + if (this.get('isRegister')) { + this.registerElement(group); + } + return group; + }; + /** + * @protected + * 在组件上添加图形，主要解决 isReigeter 的问题 + * @param {IGroup} parent 父元素 + * @param {object} cfg 分组的配置项 + */ + GroupComponent.prototype.addShape = function (parent, cfg) { + this.appendDelegateObject(parent, cfg); + var shape = parent.addShape(cfg); + if (this.get('isRegister')) { + this.registerElement(shape); + } + return shape; + }; + /** + * 在组件上添加子组件 + * + * @param parent 父元素 + * @param cfg 子组件配置项 + */ + GroupComponent.prototype.addComponent = function (parent, cfg) { + var id = cfg.id, Ctor = cfg.component, restCfg = __rest$G(cfg, ["id", "component"]); + // @ts-ignore + var inst = new Ctor(__assign$r(__assign$r({}, restCfg), { id: id, container: parent, updateAutoRender: this.get('updateAutoRender') })); + inst.init(); + inst.render(); + if (this.get('isRegister')) { + this.registerElement(inst.get('group')); + } + return inst; + }; + GroupComponent.prototype.initEvent = function () { }; + GroupComponent.prototype.removeEvent = function () { + var group = this.get('group'); + group.off(); + }; + GroupComponent.prototype.getElementId = function (localId) { + var id = this.get('id'); // 组件的 Id + var name = this.get('name'); // 组件的名称 + return id + "-" + name + "-" + localId; + }; + GroupComponent.prototype.registerElement = function (element) { + var id = element.get('id'); + this.get('shapesMap')[id] = element; + }; + GroupComponent.prototype.unregisterElement = function (element) { + var id = element.get('id'); + delete this.get('shapesMap')[id]; + }; + // 移动元素 + GroupComponent.prototype.moveElementTo = function (element, point) { + var matrix = getMatrixByTranslate(point); + element.attr('matrix', matrix); + }; + /** + * 图形元素新出现时的动画，默认图形从透明度 0 到当前透明度 + * @protected + * @param {string} elmentName 图形元素名称 + * @param {IElement} newElement 新的图形元素 + * @param {object} animateCfg 动画的配置项 + */ + GroupComponent.prototype.addAnimation = function (elmentName, newElement, animateCfg) { + // 缓存透明度 + var originOpacity = newElement.attr('opacity'); + if (isNil(originOpacity)) { + originOpacity = 1; + } + newElement.attr('opacity', 0); + newElement.animate({ opacity: originOpacity }, animateCfg); + }; + /** + * 图形元素新出现时的动画，默认图形从透明度 0 到当前透明度 + * @protected + * @param {string} elmentName 图形元素名称 + * @param {IElement} originElement 要删除的图形元素 + * @param {object} animateCfg 动画的配置项 + */ + GroupComponent.prototype.removeAnimation = function (elementName, originElement, animateCfg) { + originElement.animate({ opacity: 0 }, animateCfg); + }; + /** + * 图形元素的更新动画 + * @param {string} elmentName 图形元素名称 + * @param {IElement} originElement 现有的图形元素 + * @param {object} newAttrs 新的图形元素 + * @param {object} animateCfg 动画的配置项 + */ + GroupComponent.prototype.updateAnimation = function (elementName, originElement, newAttrs, animateCfg) { + originElement.animate(newAttrs, animateCfg); + }; + // 更新组件的图形 + GroupComponent.prototype.updateElements = function (newGroup, originGroup) { + var _this = this; + var animate = this.get('animate'); + var animateOption = this.get('animateOption'); + var children = newGroup.getChildren().slice(0); // 创建一个新数组，防止添加到 originGroup 时， children 变动 + var preElement; // 前面已经匹配到的图形元素，用于 + each$2(children, function (element) { + var elementId = element.get('id'); + var originElement = _this.getElementById(elementId); + var elementName = element.get('name'); + if (originElement) { + if (element.get('isComponent')) { + // 嵌套子组件更新 + var childComponent = element.get('component'); + var origChildComponent = originElement.get('component'); + var newCfg = pick$2(childComponent.cfg, difference(keys$8(childComponent.cfg), COPY_PROPERTIES_EXCLUDES)); + origChildComponent.update(newCfg); + originElement.set(STATUS_UPDATE, 'update'); + } + else { + var replaceAttrs = _this.getReplaceAttrs(originElement, element); + // 更新 + if (animate && animateOption.update) { + // 没有动画 + _this.updateAnimation(elementName, originElement, replaceAttrs, animateOption.update); + } + else { + // originElement.attrs = replaceAttrs; // 直接替换 + originElement.attr(replaceAttrs); + } + // 如果是分组，则继续执行 + if (element.isGroup()) { + _this.updateElements(element, originElement); + } + // 复制属性 + each$2(COPY_PROPERTIES, function (name) { + originElement.set(name, element.get(name)); + }); + updateClip(originElement, element); + preElement = originElement; + // 执行完更新后设置状态位为更新 + originElement.set(STATUS_UPDATE, 'update'); + } + } + else { + // 没有对应的图形，则插入当前图形 + originGroup.add(element); // 应该在 group 加个 insertAt 的方法 + var siblings = originGroup.getChildren(); // 兄弟节点 + siblings.splice(siblings.length - 1, 1); // 先从数组中移除，然后放到合适的位置 + if (preElement) { + // 前面已经有更新的图形或者插入的图形，则在这个图形后面插入 + var index = siblings.indexOf(preElement); + siblings.splice(index + 1, 0, element); // 在已经更新的图形元素后面插入 + } + else { + siblings.unshift(element); + } + _this.registerElement(element); // 注册节点 + element.set(STATUS_UPDATE, 'add'); // 执行完更新后设置状态位为添加 + if (element.get('isComponent')) { + // 直接新增子组件container属性，实例不变 + var childComponent = element.get('component'); + childComponent.set('container', originGroup); + } + else if (element.isGroup()) { + // 如果元素是新增加的元素，则遍历注册所有的子节点 + _this.registerNewGroup(element); + } + preElement = element; + if (animate) { + var animateCfg = _this.get('isInit') ? animateOption.appear : animateOption.enter; + if (animateCfg) { + _this.addAnimation(elementName, element, animateCfg); + } + } + } + }); + }; + GroupComponent.prototype.clearUpdateStatus = function (group) { + var children = group.getChildren(); + each$2(children, function (el) { + el.set(STATUS_UPDATE, null); // 清理掉更新状态 + }); + }; + // 清理离屏缓存 + GroupComponent.prototype.clearOffScreenCache = function () { + var offScreenGroup = this.get('offScreenGroup'); + if (offScreenGroup) { + // 销毁原先的离线 Group + offScreenGroup.destroy(); + } + this.set('offScreenGroup', null); + this.set('offScreenBBox', null); + }; + // private updateInner() { + // const group = this.get('group'); + // const newGroup = this.createOffScreenGroup(); + // this.renderInner(newGroup); + // this.applyOffset(); + // this.updateElements(newGroup, group); + // this.deleteElements(); + // newGroup.destroy(); // 销毁虚拟分组 + // } + // 获取发生委托时的对象，在事件中抛出 + GroupComponent.prototype.getDelegateObject = function () { + var _a; + var name = this.get('name'); + var delegateObject = (_a = {}, + _a[name] = this, + _a.component = this, + _a); + return delegateObject; + }; + // 附加委托信息，用于事件 + GroupComponent.prototype.appendDelegateObject = function (parent, cfg) { + var parentObject = parent.get('delegateObject'); + if (!cfg.delegateObject) { + cfg.delegateObject = {}; + } + mix(cfg.delegateObject, parentObject); // 将父元素上的委托信息复制到自身 + }; + // 获取需要替换的属性，如果原先图形元素存在，而新图形不存在，则设置 undefined + GroupComponent.prototype.getReplaceAttrs = function (originElement, newElement) { + var originAttrs = originElement.attr(); + var newAttrs = newElement.attr(); + each$2(originAttrs, function (v, k) { + if (newAttrs[k] === undefined) { + newAttrs[k] = undefined; + } + }); + return newAttrs; + }; + GroupComponent.prototype.registerNewGroup = function (group) { + var _this = this; + var children = group.getChildren(); + each$2(children, function (element) { + _this.registerElement(element); // 注册节点 + element.set(STATUS_UPDATE, 'add'); // 执行完更新后设置状态位为添加 + if (element.isGroup()) { + _this.registerNewGroup(element); + } + }); + }; + // 移除多余的元素 + GroupComponent.prototype.deleteElements = function () { + var _this = this; + var shapesMap = this.get('shapesMap'); + var deleteArray = []; + // 遍历获取需要删除的图形元素 + each$2(shapesMap, function (element, id) { + if (!element.get(STATUS_UPDATE) || element.destroyed) { + deleteArray.push([id, element]); + } + else { + element.set(STATUS_UPDATE, null); // 清理掉更新状态 + } + }); + var animate = this.get('animate'); + var animateOption = this.get('animateOption'); + // 删除图形元素 + each$2(deleteArray, function (item) { + var id = item[0], element = item[1]; + if (!element.destroyed) { + var elementName = element.get('name'); + if (animate && animateOption.leave) { + // 需要动画结束时移除图形 + var callbackAnimCfg = mix({ + callback: function () { + _this.removeElement(element); + }, + }, animateOption.leave); + _this.removeAnimation(elementName, element, callbackAnimCfg); + } + else { + _this.removeElement(element); + } + } + delete shapesMap[id]; // 从缓存中移除 + }); + }; + GroupComponent.prototype.removeElement = function (element) { + if (element.get('isGroup')) { + var component = element.get('component'); + if (component) { + component.destroy(); + } + } + element.remove(); + }; + return GroupComponent; +}(Component$1)); + +var ELLIPSIS_CODE$1 = '\u2026'; +/** 获取字符串长度 */ +function strLen(str) { + var len = 0; + for (var i = 0; i < str.length; i++) { + len += charAtLength(str, i); + } + return len; +} +/** 是否属于ASCII编码范畴 */ +function charAtLength(str, i) { + if (str.charCodeAt(i) > 0 && str.charCodeAt(i) < 128) { + return 1; + } + else { + return 2; + } +} +/** 文本省略 */ +function ellipsisString(str, reseveLength, position) { + if (position === void 0) { position = 'tail'; } + var count = str.length; + var rst = ''; + if (position === 'tail') { + for (var i = 0, index = 0; i < reseveLength;) { + var charLength = charAtLength(str, index); + if (i + charLength <= reseveLength) { + rst += str[index]; + i += charAtLength(str, index); + index++; + } + else { + break; + } + } + rst += ELLIPSIS_CODE$1; + } + else if (position === 'head') { + for (var i = 0, index = count - 1; i < reseveLength;) { + var charLength = charAtLength(str, index); + if (i + charLength <= reseveLength) { + rst += str[index]; + i += charAtLength(str, index); + index--; + } + else { + break; + } + } + rst = ELLIPSIS_CODE$1 + rst; + } + else { + var startStr = ''; + var endStr = ''; + for (var i = 0, startIndex = 0, endIndex = count - 1; i < reseveLength;) { + var startCodeLen = charAtLength(str, startIndex); + var hasAdd = false; // 设置标志位，防止头尾都没有附加字符 + if (startCodeLen + i <= reseveLength) { + startStr += str[startIndex]; + startIndex++; + i += startCodeLen; + hasAdd = true; + } + var endCodeLen = charAtLength(str, endIndex); + if (endCodeLen + i <= reseveLength) { + endStr = str[endIndex] + endStr; + i += endCodeLen; + endIndex--; + hasAdd = true; + } + if (!hasAdd) { + // 如果都没有增加字符，说明都不适合则中断 + break; + } + } + rst = startStr + ELLIPSIS_CODE$1 + endStr; + } + return rst; +} + +var ELLIPSIS_CODE = '\u2026'; +var ELLIPSIS_CODE_LENGTH = 2; // 省略号的长度 +/** 大数据量阈值 */ +var OPTIMIZE_THRESHOLD = 400; +/** + * 针对大数据量做优化的 getMaxLabelWidth，做法不是直接去比较每一个 label 的最大宽度 + * 而是先通过比较每个 label 每个的字符串的长度，这里区分了下中英文字符 + * 最终是去字符串最“长”的那个 label 的宽度。 + * @param labels + */ +function getMaxLabelWidthOptimized(labels) { + var texts = labels.map(function (label) { + var text = label.attr('text'); + return isNil(text) ? '' : "" + text; + }); + var maxLen = 0; + var maxIdx = 0; + for (var i = 0; i < texts.length; i += 1) { + var len = 0; + for (var j = 0; j <= texts[i].length; j += 1) { + var code = texts[i].charCodeAt(j); + if (code >= 19968 && code <= 40869) { + len += 2; + } + else { + len += 1; + } + } + if (len > maxLen) { + maxLen = len; + maxIdx = i; + } + } + return labels[maxIdx].getBBox().width; +} +/** 获取最长的 label */ +function getMaxLabelWidth(labels) { + if (labels.length > OPTIMIZE_THRESHOLD) { + return getMaxLabelWidthOptimized(labels); + } + var max = 0; + each$2(labels, function (label) { + var bbox = label.getBBox(); + var width = bbox.width; + if (max < width) { + max = width; + } + }); + return max; +} +/** 获取label长度 */ +function getLabelLength(isVertical, label) { + var bbox = label.getCanvasBBox(); + return isVertical ? bbox.width : bbox.height; +} +/** 处理 text shape 的自动省略 */ +function ellipsisLabel(isVertical, label, limitLength, position) { + if (position === void 0) { position = 'tail'; } + var text = label.attr('text'); + var labelLength = getLabelLength(isVertical, label); + var codeLength = strLen(text); + var ellipsised = false; + if (limitLength < labelLength) { + var reseveLength = Math.floor((limitLength / labelLength) * codeLength) - ELLIPSIS_CODE_LENGTH; // 计算出来的应该保存的长度 + var newText = void 0; + if (reseveLength >= 0) { + newText = ellipsisString(text, reseveLength, position); + } + else { + newText = ELLIPSIS_CODE; + } + if (newText) { + label.attr('text', newText); + ellipsised = true; + } + } + if (ellipsised) { + label.set('tip', text); + } + else { + label.set('tip', null); + } + return ellipsised; +} + +function renderTag$1(container, tagCfg) { + var x = tagCfg.x, y = tagCfg.y, content = tagCfg.content, style = tagCfg.style, id = tagCfg.id, name = tagCfg.name, rotate = tagCfg.rotate, maxLength = tagCfg.maxLength, autoEllipsis = tagCfg.autoEllipsis, isVertical = tagCfg.isVertical, ellipsisPosition = tagCfg.ellipsisPosition, background = tagCfg.background; + var tagGroup = container.addGroup({ + id: id + "-group", + name: name + "-group", + attrs: { + x: x, + y: y, + } + }); + // Text shape + var text = tagGroup.addShape({ + type: 'text', + id: id, + name: name, + attrs: __assign$r({ x: 0, y: 0, text: content }, style), + }); + // maxLength 应包含 background 中的 padding 值 + var padding = formatPadding$1(get$3(background, 'padding', 0)); + if (maxLength && autoEllipsis) { + var maxTextLength = maxLength - (padding[1] + padding[3]); + // 超出自动省略 + ellipsisLabel(!isVertical, text, maxTextLength, ellipsisPosition); + } + if (background) { + // 渲染文本背景 + var backgroundStyle = get$3(background, 'style', {}); + var _a = text.getCanvasBBox(), minX = _a.minX, minY = _a.minY, width = _a.width, height = _a.height; + var tagBg = tagGroup.addShape('rect', { + id: id + "-bg", + name: id + "-bg", + attrs: __assign$r({ x: minX - padding[3], y: minY - padding[0], width: width + padding[1] + padding[3], height: height + padding[0] + padding[2] }, backgroundStyle), + }); + tagBg.toBack(); + } + applyTranslate(tagGroup, x, y); + applyRotate(tagGroup, rotate, x, y); +} + +var Theme = { + fontFamily: "\n \"-apple-system\", BlinkMacSystemFont, \"Segoe UI\", Roboto,\"Helvetica Neue\",\n Helvetica, \"PingFang SC\", \"Hiragino Sans GB\", \"Microsoft YaHei\",\n SimSun, \"sans-serif\"", + textColor: '#2C3542', + activeTextColor: '#333333', + uncheckedColor: '#D8D8D8', + lineColor: '#416180', + regionColor: '#CCD7EB', + verticalAxisRotate: -Math.PI / 4, + horizontalAxisRotate: Math.PI / 4, +}; + +var LineAnnotation = /** @class */ (function (_super) { + __extends$e(LineAnnotation, _super); + function LineAnnotation() { + return _super !== null && _super.apply(this, arguments) || this; + } + /** + * @protected + * 默认的配置项 + * @returns {object} 默认的配置项 + */ + LineAnnotation.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { name: 'annotation', type: 'line', locationType: 'region', start: null, end: null, style: {}, text: null, defaultCfg: { + style: { + fill: Theme.textColor, + fontSize: 12, + textAlign: 'center', + textBaseline: 'bottom', + fontFamily: Theme.fontFamily, + }, + text: { + position: 'center', + autoRotate: true, + content: null, + offsetX: 0, + offsetY: 0, + style: { + stroke: Theme.lineColor, + lineWidth: 1, + }, + }, + } }); + }; + LineAnnotation.prototype.renderInner = function (group) { + this.renderLine(group); + if (this.get('text')) { + this.renderLabel(group); + } + }; + // 绘制线 + LineAnnotation.prototype.renderLine = function (group) { + var start = this.get('start'); + var end = this.get('end'); + var style = this.get('style'); + this.addShape(group, { + type: 'line', + id: this.getElementId('line'), + name: 'annotation-line', + attrs: __assign$r({ x1: start.x, y1: start.y, x2: end.x, y2: end.y }, style), + }); + }; + // 获取 label 的位置 + LineAnnotation.prototype.getLabelPoint = function (start, end, position) { + var percent; + if (position === 'start') { + percent = 0; + } + else if (position === 'center') { + percent = 0.5; + } + else if (isString$3(position) && position.indexOf('%') !== -1) { + percent = parseInt(position, 10) / 100; + } + else if (isNumber$4(position)) { + percent = position; + } + else { + percent = 1; + } + if (percent > 1 || percent < 0) { + percent = 1; + } + return { + x: getValueByPercent(start.x, end.x, percent), + y: getValueByPercent(start.y, end.y, percent), + }; + }; + // 绘制 label + LineAnnotation.prototype.renderLabel = function (group) { + var text = this.get('text'); + var start = this.get('start'); + var end = this.get('end'); + var position = text.position, content = text.content, style = text.style, offsetX = text.offsetX, offsetY = text.offsetY, autoRotate = text.autoRotate, maxLength = text.maxLength, autoEllipsis = text.autoEllipsis, ellipsisPosition = text.ellipsisPosition, background = text.background, _a = text.isVertical, isVertical = _a === void 0 ? false : _a; + var point = this.getLabelPoint(start, end, position); + var x = point.x + offsetX; + var y = point.y + offsetY; + var cfg = { + id: this.getElementId('line-text'), + name: 'annotation-line-text', + x: x, + y: y, + content: content, + style: style, + maxLength: maxLength, + autoEllipsis: autoEllipsis, + ellipsisPosition: ellipsisPosition, + background: background, + isVertical: isVertical, + }; + // 如果自动旋转 + if (autoRotate) { + var vector = [end.x - start.x, end.y - start.y]; + cfg.rotate = Math.atan2(vector[1], vector[0]); + } + renderTag$1(group, cfg); + }; + return LineAnnotation; +}(GroupComponent)); + +var TextAnnotation = /** @class */ (function (_super) { + __extends$e(TextAnnotation, _super); + function TextAnnotation() { + return _super !== null && _super.apply(this, arguments) || this; + } + /** + * @protected + * 默认的配置项 + * @returns {object} 默认的配置项 + */ + TextAnnotation.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { name: 'annotation', type: 'text', locationType: 'point', x: 0, y: 0, content: '', rotate: null, style: {}, background: null, maxLength: null, autoEllipsis: true, isVertical: false, ellipsisPosition: 'tail', defaultCfg: { + style: { + fill: Theme.textColor, + fontSize: 12, + textAlign: 'center', + textBaseline: 'middle', + fontFamily: Theme.fontFamily, + }, + } }); + }; + // 复写 setLocation 方法，不需要重新创建 text + TextAnnotation.prototype.setLocation = function (location) { + this.set('x', location.x); + this.set('y', location.y); + this.resetLocation(); + }; + TextAnnotation.prototype.renderInner = function (group) { + var _a = this.getLocation(), x = _a.x, y = _a.y; + var content = this.get('content'); + var style = this.get('style'); + var id = this.getElementId('text'); + var name = this.get('name') + "-text"; + var maxLength = this.get('maxLength'); + var autoEllipsis = this.get('autoEllipsis'); + var isVertical = this.get('isVertical'); + var ellipsisPosition = this.get('ellipsisPosition'); + var background = this.get('background'); + var rotate = this.get('rotate'); + var cfg = { + id: id, + name: name, + x: x, + y: y, + content: content, + style: style, + maxLength: maxLength, + autoEllipsis: autoEllipsis, + isVertical: isVertical, + ellipsisPosition: ellipsisPosition, + background: background, + rotate: rotate, + }; + renderTag$1(group, cfg); + }; + TextAnnotation.prototype.resetLocation = function () { + var textGroup = this.getElementByLocalId('text-group'); + if (textGroup) { + var _a = this.getLocation(), x = _a.x, y = _a.y; + var rotate = this.get('rotate'); + applyTranslate(textGroup, x, y); + applyRotate(textGroup, rotate, x, y); + } + }; + return TextAnnotation; +}(GroupComponent)); + +var ArcAnnotation = /** @class */ (function (_super) { + __extends$e(ArcAnnotation, _super); + function ArcAnnotation() { + return _super !== null && _super.apply(this, arguments) || this; + } + /** + * @protected + * 默认的配置项 + * @returns {object} 默认的配置项 + */ + ArcAnnotation.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { name: 'annotation', type: 'arc', locationType: 'circle', center: null, radius: 100, startAngle: -Math.PI / 2, endAngle: (Math.PI * 3) / 2, style: { + stroke: '#999', + lineWidth: 1, + } }); + }; + ArcAnnotation.prototype.renderInner = function (group) { + this.renderArc(group); + }; + ArcAnnotation.prototype.getArcPath = function () { + var _a = this.getLocation(), center = _a.center, radius = _a.radius, startAngle = _a.startAngle, endAngle = _a.endAngle; + var startPoint = getCirclePoint(center, radius, startAngle); + var endPoint = getCirclePoint(center, radius, endAngle); + var largeFlag = endAngle - startAngle > Math.PI ? 1 : 0; + var path = [['M', startPoint.x, startPoint.y]]; + if (endAngle - startAngle === Math.PI * 2) { + // 整个圆是分割成两个圆 + var middlePoint = getCirclePoint(center, radius, startAngle + Math.PI); + path.push(['A', radius, radius, 0, largeFlag, 1, middlePoint.x, middlePoint.y]); + path.push(['A', radius, radius, 0, largeFlag, 1, endPoint.x, endPoint.y]); + } + else { + path.push(['A', radius, radius, 0, largeFlag, 1, endPoint.x, endPoint.y]); + } + return path; + }; + // 绘制 arc + ArcAnnotation.prototype.renderArc = function (group) { + // 也可以 通过 get('center') 类似的方式逐个获取 + var path = this.getArcPath(); + var style = this.get('style'); + this.addShape(group, { + type: 'path', + id: this.getElementId('arc'), + name: 'annotation-arc', + attrs: __assign$r({ path: path }, style), + }); + }; + return ArcAnnotation; +}(GroupComponent)); + +var RegionAnnotation = /** @class */ (function (_super) { + __extends$e(RegionAnnotation, _super); + function RegionAnnotation() { + return _super !== null && _super.apply(this, arguments) || this; + } + /** + * @protected + * 默认的配置项 + * @returns {object} 默认的配置项 + */ + RegionAnnotation.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { name: 'annotation', type: 'region', locationType: 'region', start: null, end: null, style: {}, defaultCfg: { + style: { + lineWidth: 0, + fill: Theme.regionColor, + opacity: 0.4, + }, + } }); + }; + RegionAnnotation.prototype.renderInner = function (group) { + this.renderRegion(group); + }; + RegionAnnotation.prototype.renderRegion = function (group) { + var start = this.get('start'); + var end = this.get('end'); + var style = this.get('style'); + var bbox = regionToBBox({ start: start, end: end }); + this.addShape(group, { + type: 'rect', + id: this.getElementId('region'), + name: 'annotation-region', + attrs: __assign$r({ x: bbox.x, y: bbox.y, width: bbox.width, height: bbox.height }, style), + }); + }; + return RegionAnnotation; +}(GroupComponent)); + +var ImageAnnotation = /** @class */ (function (_super) { + __extends$e(ImageAnnotation, _super); + function ImageAnnotation() { + return _super !== null && _super.apply(this, arguments) || this; + } + /** + * @protected + * 默认的配置项 + * @returns {object} 默认的配置项 + */ + ImageAnnotation.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { name: 'annotation', type: 'image', locationType: 'region', start: null, end: null, src: null, style: {} }); + }; + ImageAnnotation.prototype.renderInner = function (group) { + this.renderImage(group); + }; + ImageAnnotation.prototype.getImageAttrs = function () { + var start = this.get('start'); + var end = this.get('end'); + var style = this.get('style'); + var bbox = regionToBBox({ start: start, end: end }); + var src = this.get('src'); + return __assign$r({ x: bbox.x, y: bbox.y, img: src, width: bbox.width, height: bbox.height }, style); + }; + // 绘制图片 + ImageAnnotation.prototype.renderImage = function (group) { + this.addShape(group, { + type: 'image', + id: this.getElementId('image'), + name: 'annotation-image', + attrs: this.getImageAttrs(), + }); + }; + return ImageAnnotation; +}(GroupComponent)); + +var DataMarkerAnnotation = /** @class */ (function (_super) { + __extends$e(DataMarkerAnnotation, _super); + function DataMarkerAnnotation() { + return _super !== null && _super.apply(this, arguments) || this; + } + /** + * 默认的配置项 + * @returns {object} 默认的配置项 + */ + DataMarkerAnnotation.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { name: 'annotation', type: 'dataMarker', locationType: 'point', x: 0, y: 0, point: {}, line: {}, text: {}, direction: 'upward', autoAdjust: true, coordinateBBox: null, defaultCfg: { + point: { + display: true, + style: { + r: 3, + fill: '#FFFFFF', + stroke: '#1890FF', + lineWidth: 2, + }, + }, + line: { + display: true, + length: 20, + style: { + stroke: Theme.lineColor, + lineWidth: 1, + }, + }, + text: { + content: '', + display: true, + style: { + fill: Theme.textColor, + opacity: 0.65, + fontSize: 12, + textAlign: 'start', + fontFamily: Theme.fontFamily, + }, + }, + } }); + }; + DataMarkerAnnotation.prototype.renderInner = function (group) { + if (get$3(this.get('line'), 'display')) { + this.renderLine(group); + } + if (get$3(this.get('text'), 'display')) { + this.renderText(group); + } + if (get$3(this.get('point'), 'display')) { + this.renderPoint(group); + } + if (this.get('autoAdjust')) { + this.autoAdjust(group); + } + }; + DataMarkerAnnotation.prototype.applyOffset = function () { + this.moveElementTo(this.get('group'), { + x: this.get('x') + this.get('offsetX'), + y: this.get('y') + this.get('offsetY'), + }); + }; + DataMarkerAnnotation.prototype.renderPoint = function (group) { + var point = this.getShapeAttrs().point; + this.addShape(group, { + type: 'circle', + id: this.getElementId('point'), + name: 'annotation-point', + attrs: point, + }); + }; + DataMarkerAnnotation.prototype.renderLine = function (group) { + var line = this.getShapeAttrs().line; + this.addShape(group, { + type: 'path', + id: this.getElementId('line'), + name: 'annotation-line', + attrs: line, + }); + }; + DataMarkerAnnotation.prototype.renderText = function (group) { + var textAttrs = this.getShapeAttrs().text; + var x = textAttrs.x, y = textAttrs.y, text = textAttrs.text, style = __rest$G(textAttrs, ["x", "y", "text"]); + var _a = this.get('text'), background = _a.background, maxLength = _a.maxLength, autoEllipsis = _a.autoEllipsis, isVertival = _a.isVertival, ellipsisPosition = _a.ellipsisPosition; + var tagCfg = { + x: x, + y: y, + id: this.getElementId('text'), + name: 'annotation-text', + content: text, + style: style, + background: background, + maxLength: maxLength, + autoEllipsis: autoEllipsis, + isVertival: isVertival, + ellipsisPosition: ellipsisPosition, + }; + renderTag$1(group, tagCfg); + }; + DataMarkerAnnotation.prototype.autoAdjust = function (group) { + var direction = this.get('direction'); + var x = this.get('x'); + var y = this.get('y'); + var lineLength = get$3(this.get('line'), 'length', 0); + var coordinateBBox = this.get('coordinateBBox'); + var _a = group.getBBox(), minX = _a.minX, maxX = _a.maxX, minY = _a.minY, maxY = _a.maxY; + var textGroup = group.findById(this.getElementId('text-group')); + var textShape = group.findById(this.getElementId('text')); + var lineShape = group.findById(this.getElementId('line')); + if (!coordinateBBox) { + return; + } + if (textGroup) { + if (x + minX <= coordinateBBox.minX) { + // 左侧超出 + var overflow = coordinateBBox.minX - (x + minX); + applyTranslate(textGroup, textGroup.attr('x') + overflow, textGroup.attr('y')); + } + if (x + maxX >= coordinateBBox.maxX) { + // 右侧超出 + var overflow = x + maxX - coordinateBBox.maxX; + applyTranslate(textGroup, textGroup.attr('x') - overflow, textGroup.attr('y')); + } + } + if ((direction === 'upward' && y + minY <= coordinateBBox.minY) || + (direction !== 'upward' && y + maxY >= coordinateBBox.maxY)) { + // 上方或者下方超出 + var textBaseline = void 0; + var factor = void 0; + if (direction === 'upward' && y + minY <= coordinateBBox.minY) { + textBaseline = 'top'; + factor = 1; + } + else { + textBaseline = 'bottom'; + factor = -1; + } + textShape.attr('textBaseline', textBaseline); + if (lineShape) { + lineShape.attr('path', [ + ['M', 0, 0], + ['L', 0, lineLength * factor], + ]); + } + applyTranslate(textGroup, textGroup.attr('x'), (lineLength + 2) * factor); + } + }; + DataMarkerAnnotation.prototype.getShapeAttrs = function () { + var lineDisplay = get$3(this.get('line'), 'display'); + var pointStyle = get$3(this.get('point'), 'style', {}); + var lineStyle = get$3(this.get('line'), 'style', {}); + var textStyle = get$3(this.get('text'), 'style', {}); + var direction = this.get('direction'); + var lineLength = lineDisplay ? get$3(this.get('line'), 'length', 0) : 0; + var factor = direction === 'upward' ? -1 : 1; + return { + point: __assign$r({ x: 0, y: 0 }, pointStyle), + line: __assign$r({ path: [ + ['M', 0, 0], + ['L', 0, lineLength * factor], + ] }, lineStyle), + text: __assign$r({ x: 0, y: (lineLength + 2) * factor, text: get$3(this.get('text'), 'content', ''), textBaseline: direction === 'upward' ? 'bottom' : 'top' }, textStyle), + }; + }; + return DataMarkerAnnotation; +}(GroupComponent)); + +var DataRegionAnnotation = /** @class */ (function (_super) { + __extends$e(DataRegionAnnotation, _super); + function DataRegionAnnotation() { + return _super !== null && _super.apply(this, arguments) || this; + } + /** + * 默认的配置项 + * @returns {object} 默认的配置项 + */ + DataRegionAnnotation.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { name: 'annotation', type: 'dataRegion', locationType: 'points', points: [], lineLength: 0, region: {}, text: {}, defaultCfg: { + region: { + style: { + lineWidth: 0, + fill: Theme.regionColor, + opacity: 0.4, + }, + }, + text: { + content: '', + style: { + textAlign: 'center', + textBaseline: 'bottom', + fontSize: 12, + fill: Theme.textColor, + fontFamily: Theme.fontFamily, + }, + }, + } }); + }; + DataRegionAnnotation.prototype.renderInner = function (group) { + var regionStyle = get$3(this.get('region'), 'style', {}); + get$3(this.get('text'), 'style', {}); + var lineLength = this.get('lineLength') || 0; + var points = this.get('points'); + if (!points.length) { + return; + } + var bbox = pointsToBBox(points); + // render region + var path = []; + path.push(['M', points[0].x, bbox.minY - lineLength]); + points.forEach(function (point) { + path.push(['L', point.x, point.y]); + }); + path.push(['L', points[points.length - 1].x, points[points.length - 1].y - lineLength]); + this.addShape(group, { + type: 'path', + id: this.getElementId('region'), + name: 'annotation-region', + attrs: __assign$r({ path: path }, regionStyle), + }); + // render text + var textCfg = __assign$r({ id: this.getElementId('text'), name: 'annotation-text', x: (bbox.minX + bbox.maxX) / 2, y: bbox.minY - lineLength }, this.get('text')); + renderTag$1(group, textCfg); + }; + return DataRegionAnnotation; +}(GroupComponent)); + +var RegionFilterAnnotation = /** @class */ (function (_super) { + __extends$e(RegionFilterAnnotation, _super); + function RegionFilterAnnotation() { + return _super !== null && _super.apply(this, arguments) || this; + } + /** + * 默认的配置项 + * @returns {object} 默认的配置项 + */ + RegionFilterAnnotation.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { name: 'annotation', type: 'regionFilter', locationType: 'region', start: null, end: null, color: null, shape: [] }); + }; + RegionFilterAnnotation.prototype.renderInner = function (group) { + var _this = this; + var start = this.get('start'); + var end = this.get('end'); + // 1. add region layer + var layer = this.addGroup(group, { + id: this.getElementId('region-filter'), + capture: false, + }); + // 2. clone shape & color it + each$2(this.get('shapes'), function (shape, shapeIdx) { + var type = shape.get('type'); + var attrs = clone$7(shape.attr()); + _this.adjustShapeAttrs(attrs); + _this.addShape(layer, { + id: _this.getElementId("shape-" + type + "-" + shapeIdx), + capture: false, + type: type, + attrs: attrs, + }); + }); + // 3. clip + var clipBBox = regionToBBox({ start: start, end: end }); + layer.setClip({ + type: 'rect', + attrs: { + x: clipBBox.minX, + y: clipBBox.minY, + width: clipBBox.width, + height: clipBBox.height, + }, + }); + }; + RegionFilterAnnotation.prototype.adjustShapeAttrs = function (attr) { + var color = this.get('color'); + if (attr.fill) { + attr.fill = attr.fillStyle = color; + } + attr.stroke = attr.strokeStyle = color; + }; + return RegionFilterAnnotation; +}(GroupComponent)); + +var ShapeAnnotation = /** @class */ (function (_super) { + __extends$e(ShapeAnnotation, _super); + function ShapeAnnotation() { + return _super !== null && _super.apply(this, arguments) || this; + } + ShapeAnnotation.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { name: 'annotation', type: 'shape', draw: noop$3 }); + }; + ShapeAnnotation.prototype.renderInner = function (group) { + var render = this.get('render'); + if (isFunction$6(render)) { + render(group); + } + }; + return ShapeAnnotation; +}(GroupComponent)); + +var HtmlComponent = /** @class */ (function (_super) { + __extends$e(HtmlComponent, _super); + function HtmlComponent() { + return _super !== null && _super.apply(this, arguments) || this; + } + HtmlComponent.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { container: null, containerTpl: '
', updateAutoRender: true, containerClassName: '', parent: null }); + }; + HtmlComponent.prototype.getContainer = function () { + return this.get('container'); + }; + /** + * 显示组件 + */ + HtmlComponent.prototype.show = function () { + var container = this.get('container'); + container.style.display = ''; + this.set('visible', true); + }; + /** + * 隐藏组件 + */ + HtmlComponent.prototype.hide = function () { + var container = this.get('container'); + container.style.display = 'none'; + this.set('visible', false); + }; + /** + * 是否允许捕捉事件 + * @param capture 事件捕捉 + */ + HtmlComponent.prototype.setCapture = function (capture) { + var container = this.getContainer(); + var value = capture ? 'auto' : 'none'; + container.style.pointerEvents = value; + this.set('capture', capture); + }; + HtmlComponent.prototype.getBBox = function () { + var container = this.getContainer(); + var x = parseFloat(container.style.left) || 0; + var y = parseFloat(container.style.top) || 0; + return createBBox(x, y, container.clientWidth, container.clientHeight); + }; + HtmlComponent.prototype.clear = function () { + var container = this.get('container'); + clearDom(container); + }; + HtmlComponent.prototype.destroy = function () { + this.removeEvent(); + this.removeDom(); + _super.prototype.destroy.call(this); + }; + /** + * 复写 init，主要是初始化 DOM 和事件 + */ + HtmlComponent.prototype.init = function () { + _super.prototype.init.call(this); + this.initContainer(); + this.initDom(); + this.resetStyles(); // 初始化样式 + this.applyStyles(); // 应用样式 + this.initEvent(); + this.initCapture(); + this.initVisible(); + }; + HtmlComponent.prototype.initCapture = function () { + this.setCapture(this.get('capture')); + }; + HtmlComponent.prototype.initVisible = function () { + if (!this.get('visible')) { + // 设置初始显示状态 + this.hide(); + } + else { + this.show(); + } + }; + HtmlComponent.prototype.initDom = function () { + }; + HtmlComponent.prototype.initContainer = function () { + var container = this.get('container'); + if (isNil(container)) { + // 未指定 container 则创建 + container = this.createDom(); + var parent_1 = this.get('parent'); + if (isString$3(parent_1)) { + parent_1 = document.getElementById(parent_1); + this.set('parent', parent_1); + } + parent_1.appendChild(container); + this.set('container', container); + } + else if (isString$3(container)) { + // 用户传入的 id, 作为 container + container = document.getElementById(container); + this.set('container', container); + } // else container 是 DOM + if (!this.get('parent')) { + this.set('parent', container.parentNode); + } + }; + // 样式需要进行合并，不能单纯的替换，否则使用非常不方便 + HtmlComponent.prototype.resetStyles = function () { + var style = this.get('domStyles'); + var defaultStyles = this.get('defaultStyles'); + if (!style) { + style = defaultStyles; + } + else { + style = deepMix({}, defaultStyles, style); + } + this.set('domStyles', style); + }; + // 应用所有的样式 + HtmlComponent.prototype.applyStyles = function () { + var domStyles = this.get('domStyles'); + if (!domStyles) { + return; + } + var container = this.getContainer(); + this.applyChildrenStyles(container, domStyles); + var containerClassName = this.get('containerClassName'); + if (containerClassName && hasClass(container, containerClassName)) { + var containerCss = domStyles[containerClassName]; + modifyCSS(container, containerCss); + } + }; + HtmlComponent.prototype.applyChildrenStyles = function (element, styles) { + each$2(styles, function (style, name) { + var elements = element.getElementsByClassName(name); + each$2(elements, function (el) { + modifyCSS(el, style); + }); + }); + }; + // 应用到单个 DOM + HtmlComponent.prototype.applyStyle = function (cssName, dom) { + var domStyles = this.get('domStyles'); + modifyCSS(dom, domStyles[cssName]); + }; + /** + * @protected + */ + HtmlComponent.prototype.createDom = function () { + var containerTpl = this.get('containerTpl'); + return createDom$1(containerTpl); + }; + /** + * @protected + * 初始化事件 + */ + HtmlComponent.prototype.initEvent = function () { }; + /** + * @protected + * 清理 DOM + */ + HtmlComponent.prototype.removeDom = function () { + var container = this.get('container'); + // 节点不一定有parentNode + container && container.parentNode && container.parentNode.removeChild(container); + }; + /** + * @protected + * 清理事件 + */ + HtmlComponent.prototype.removeEvent = function () { }; + HtmlComponent.prototype.updateInner = function (cfg) { + // 更新样式 + if (has$1(cfg, 'domStyles')) { + this.resetStyles(); + this.applyStyles(); + } + // 只要属性发生变化，都调整一些位置 + this.resetPosition(); + }; + HtmlComponent.prototype.resetPosition = function () { }; + return HtmlComponent; +}(Component$1)); + +var HtmlAnnotation = /** @class */ (function (_super) { + __extends$e(HtmlAnnotation, _super); + function HtmlAnnotation() { + return _super !== null && _super.apply(this, arguments) || this; + } + HtmlAnnotation.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { name: 'annotation', type: 'html', locationType: 'point', x: 0, y: 0, containerTpl: "
", alignX: 'left', alignY: 'top', html: '', zIndex: 7 }); + }; + HtmlAnnotation.prototype.render = function () { + var container = this.getContainer(); + var html = this.get('html'); + clearDom(container); + var rst = isFunction$6(html) ? html(container) : html; + if (isElement(rst)) { + container.appendChild(rst); + } + else if (isString$3(rst)) { + container.appendChild(createDom$1(rst)); + } + this.resetPosition(); + }; + HtmlAnnotation.prototype.resetPosition = function () { + var container = this.getContainer(); + var _a = this.getLocation(), x = _a.x, y = _a.y; + var alignX = this.get('alignX'); + var alignY = this.get('alignY'); + var offsetX = this.get('offsetX'); + var offsetY = this.get('offsetY'); + var domWidth = getOuterWidth(container); + var domHeight = getOuterHeight(container); + var position = { + x: x, + y: y, + }; + if (alignX === 'middle') { + position.x -= Math.round(domWidth / 2); + } + else if (alignX === 'right') { + position.x -= Math.round(domWidth); + } + if (alignY === 'middle') { + position.y -= Math.round(domHeight / 2); + } + else if (alignY === 'bottom') { + position.y -= Math.round(domHeight); + } + if (offsetX) { + position.x += offsetX; + } + if (offsetY) { + position.y += offsetY; + } + modifyCSS(container, { + position: 'absolute', + left: position.x + "px", + top: position.y + "px", + zIndex: this.get('zIndex'), + }); + }; + return HtmlAnnotation; +}(HtmlComponent)); + +var AnnotationComponent = /*#__PURE__*/Object.freeze({ + __proto__: null, + Line: LineAnnotation, + Text: TextAnnotation, + Arc: ArcAnnotation, + Region: RegionAnnotation, + Image: ImageAnnotation, + DataMarker: DataMarkerAnnotation, + DataRegion: DataRegionAnnotation, + RegionFilter: RegionFilterAnnotation, + Shape: ShapeAnnotation, + Html: HtmlAnnotation +}); + +// 获取多个状态量的合并值 +function getStatesStyle(item, elementName, stateStyles) { + var styleName = elementName + "Style"; // activeStyle + var styles = null; + each$2(stateStyles, function (v, state) { + if (item[state] && v[styleName]) { + if (!styles) { + styles = {}; + } + mix(styles, v[styleName]); // 合并样式 + } + }); + return styles; +} + +var AxisBase = /** @class */ (function (_super) { + __extends$e(AxisBase, _super); + function AxisBase() { + return _super !== null && _super.apply(this, arguments) || this; + } + AxisBase.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { name: 'axis', ticks: [], line: {}, tickLine: {}, subTickLine: null, title: null, + /** + * 文本标签的配置项 + */ + label: {}, + /** + * 垂直于坐标轴方向的因子，决定文本、title、tickLine 在坐标轴的哪一侧 + */ + verticalFactor: 1, + // 垂直方向限制的长度，对文本自适应有很大影响 + verticalLimitLength: null, overlapOrder: ['autoRotate', 'autoEllipsis', 'autoHide'], tickStates: {}, optimize: {}, defaultCfg: { + line: { + // @type {Attrs} 坐标轴线的图形属性,如果设置成null，则不显示轴线 + style: { + lineWidth: 1, + stroke: Theme.lineColor, + }, + }, + tickLine: { + // @type {Attrs} 标注坐标线的图形属性 + style: { + lineWidth: 1, + stroke: Theme.lineColor, + }, + alignTick: true, + length: 5, + displayWithLabel: true, + }, + subTickLine: { + // @type {Attrs} 标注坐标线的图形属性 + style: { + lineWidth: 1, + stroke: Theme.lineColor, + }, + count: 4, + length: 2, + }, + label: { + autoRotate: true, + autoHide: false, + autoEllipsis: false, + style: { + fontSize: 12, + fill: Theme.textColor, + fontFamily: Theme.fontFamily, + fontWeight: 'normal', + }, + offset: 10, + }, + title: { + autoRotate: true, + spacing: 5, + position: 'center', + style: { + fontSize: 12, + fill: Theme.textColor, + textBaseline: 'middle', + fontFamily: Theme.fontFamily, + textAlign: 'center', + }, + }, + tickStates: { + active: { + labelStyle: { + fontWeight: 500, + }, + tickLineStyle: { + lineWidth: 2, + }, + }, + inactive: { + labelStyle: { + fill: Theme.uncheckedColor, + }, + }, + }, + // 针对大数据量进行优化配置 + optimize: { + enable: true, + threshold: 400, + }, + }, theme: {} }); + }; + /** + * 绘制组件 + */ + AxisBase.prototype.renderInner = function (group) { + if (this.get('line')) { + this.drawLine(group); + } + // drawTicks 包括 drawLabels 和 drawTickLines + this.drawTicks(group); + if (this.get('title')) { + this.drawTitle(group); + } + }; + // 实现 IList 接口 + AxisBase.prototype.isList = function () { + return true; + }; + /** + * 获取图例项 + * @return {ListItem[]} 列表项集合 + */ + AxisBase.prototype.getItems = function () { + return this.get('ticks'); + }; + /** + * 设置列表项 + * @param {ListItem[]} items 列表项集合 + */ + AxisBase.prototype.setItems = function (items) { + this.update({ + ticks: items, + }); + }; + /** + * 更新列表项 + * @param {ListItem} item 列表项 + * @param {object} cfg 列表项 + */ + AxisBase.prototype.updateItem = function (item, cfg) { + mix(item, cfg); + this.clear(); // 由于单个图例项变化，会引起全局变化，所以全部更新 + this.render(); + }; + /** + * 清空列表 + */ + AxisBase.prototype.clearItems = function () { + var itemGroup = this.getElementByLocalId('label-group'); + itemGroup && itemGroup.clear(); + }; + /** + * 设置列表项的状态 + * @param {ListItem} item 列表项 + * @param {string} state 状态名 + * @param {boolean} value 状态值, true, false + */ + AxisBase.prototype.setItemState = function (item, state, value) { + item[state] = value; + this.updateTickStates(item); // 应用状态样式 + }; + /** + * 是否存在指定的状态 + * @param {ListItem} item 列表项 + * @param {boolean} state 状态名 + */ + AxisBase.prototype.hasState = function (item, state) { + return !!item[state]; + }; + AxisBase.prototype.getItemStates = function (item) { + var tickStates = this.get('tickStates'); + var rst = []; + each$2(tickStates, function (v, k) { + if (item[k]) { + // item.selected + rst.push(k); + } + }); + return rst; + }; + /** + * 清楚所有列表项的状态 + * @param {string} state 状态值 + */ + AxisBase.prototype.clearItemsState = function (state) { + var _this = this; + var items = this.getItemsByState(state); + each$2(items, function (item) { + _this.setItemState(item, state, false); + }); + }; + /** + * 根据状态获取图例项 + * @param {string} state [description] + * @return {ListItem[]} [description] + */ + AxisBase.prototype.getItemsByState = function (state) { + var _this = this; + var items = this.getItems(); + return filter$1(items, function (item) { + return _this.hasState(item, state); + }); + }; + AxisBase.prototype.getSidePoint = function (point, offset) { + var self = this; + var vector = self.getSideVector(offset, point); + return { + x: point.x + vector[0], + y: point.y + vector[1], + }; + }; + AxisBase.prototype.getTextAnchor = function (vector) { + var align; + if (isNumberEqual$1(vector[0], 0)) { + align = 'center'; + } + else if (vector[0] > 0) { + align = 'start'; + } + else if (vector[0] < 0) { + align = 'end'; + } + return align; + }; + AxisBase.prototype.getTextBaseline = function (vector) { + var base; + if (isNumberEqual$1(vector[1], 0)) { + base = 'middle'; + } + else if (vector[1] > 0) { + base = 'top'; + } + else if (vector[1] < 0) { + base = 'bottom'; + } + return base; + }; + AxisBase.prototype.processOverlap = function (labelGroup) { }; + // 绘制坐标轴线 + AxisBase.prototype.drawLine = function (group) { + var path = this.getLinePath(); + var line = this.get('line'); // line 的判空在调用 drawLine 之前，不在这里判定 + this.addShape(group, { + type: 'path', + id: this.getElementId('line'), + name: 'axis-line', + attrs: mix({ + path: path, + }, line.style), + }); + }; + AxisBase.prototype.getTickLineItems = function (ticks) { + var _this = this; + var tickLineItems = []; + var tickLine = this.get('tickLine'); + var alignTick = tickLine.alignTick; + var tickLineLength = tickLine.length; + var tickSegment = 1; + var tickCount = ticks.length; + if (tickCount >= 2) { + tickSegment = ticks[1].value - ticks[0].value; + } + each$2(ticks, function (tick) { + var point = tick.point; + if (!alignTick) { + // tickLine 不同 tick 对齐时需要调整 point + point = _this.getTickPoint(tick.value - tickSegment / 2); + } + var endPoint = _this.getSidePoint(point, tickLineLength); + tickLineItems.push({ + startPoint: point, + tickValue: tick.value, + endPoint: endPoint, + tickId: tick.id, + id: "tickline-" + tick.id, + }); + }); + // 如果 tickLine 不居中对齐，则需要在最后面补充一个 tickLine + // if (!alignTick && tickCount > 0) { + // const tick = ticks[tickCount - 1]; + // const point = this.getTickPoint(tick.value + tickSegment / 2); + // } + return tickLineItems; + }; + AxisBase.prototype.getSubTickLineItems = function (tickLineItems) { + var subTickLineItems = []; + var subTickLine = this.get('subTickLine'); + var subCount = subTickLine.count; + var tickLineCount = tickLineItems.length; + // 刻度线的数量大于 2 时，才绘制子刻度 + if (tickLineCount >= 2) { + for (var i = 0; i < tickLineCount - 1; i++) { + var pre = tickLineItems[i]; + var next = tickLineItems[i + 1]; + for (var j = 0; j < subCount; j++) { + var percent = (j + 1) / (subCount + 1); + var tickValue = (1 - percent) * pre.tickValue + percent * next.tickValue; + var point = this.getTickPoint(tickValue); + var endPoint = this.getSidePoint(point, subTickLine.length); + subTickLineItems.push({ + startPoint: point, + endPoint: endPoint, + tickValue: tickValue, + id: "sub-" + pre.id + "-" + j, + }); + } + } + } + return subTickLineItems; + }; + AxisBase.prototype.getTickLineAttrs = function (tickItem, type, index, tickItems) { + var style = this.get(type).style; + // 保持和 grid 相同的数据结构 + var item = { + points: [tickItem.startPoint, tickItem.endPoint], + }; + var defaultTickLineStyle = get$3(this.get('theme'), ['tickLine', 'style'], {}); + style = isFunction$6(style) ? mix({}, defaultTickLineStyle, style(item, index, tickItems)) : style; + var startPoint = tickItem.startPoint, endPoint = tickItem.endPoint; + return __assign$r({ x1: startPoint.x, y1: startPoint.y, x2: endPoint.x, y2: endPoint.y }, style); + }; + // 绘制坐标轴刻度线 + AxisBase.prototype.drawTick = function (tickItem, tickLineGroup, type, index, tickItems) { + this.addShape(tickLineGroup, { + type: 'line', + id: this.getElementId(tickItem.id), + name: "axis-" + type, + attrs: this.getTickLineAttrs(tickItem, type, index, tickItems), + }); + }; + // 绘制坐标轴刻度线，包括子刻度线 + AxisBase.prototype.drawTickLines = function (group) { + var _this = this; + var ticks = this.get('ticks'); + var subTickLine = this.get('subTickLine'); + var tickLineItems = this.getTickLineItems(ticks); + var tickLineGroup = this.addGroup(group, { + name: 'axis-tickline-group', + id: this.getElementId('tickline-group'), + }); + var tickCfg = this.get('tickLine'); + each$2(tickLineItems, function (item, index) { + if (tickCfg.displayWithLabel) { + // 如果跟随 label 显示，则检测是否存在对应的 label + var labelId = _this.getElementId("label-" + item.tickId); + if (group.findById(labelId)) { + _this.drawTick(item, tickLineGroup, 'tickLine', index, tickLineItems); + } + } + else { + _this.drawTick(item, tickLineGroup, 'tickLine', index, tickLineItems); + } + }); + if (subTickLine) { + var subTickLineItems_1 = this.getSubTickLineItems(tickLineItems); + each$2(subTickLineItems_1, function (item, index) { + _this.drawTick(item, tickLineGroup, 'subTickLine', index, subTickLineItems_1); + }); + } + }; + // 预处理 ticks 确定位置和补充 id + AxisBase.prototype.processTicks = function () { + var _this = this; + var ticks = this.get('ticks'); + each$2(ticks, function (tick) { + tick.point = _this.getTickPoint(tick.value); + // 补充 tick 的 id，为动画和更新做准备 + if (isNil(tick.id)) { + // 默认使用 tick.name 作为id + tick.id = tick.name; + } + }); + }; + // 绘制 ticks 包括文本和 tickLine + AxisBase.prototype.drawTicks = function (group) { + var _this = this; + this.optimizeTicks(); + this.processTicks(); + if (this.get('label')) { + this.drawLabels(group); + } + if (this.get('tickLine')) { + this.drawTickLines(group); + } + var ticks = this.get('ticks'); + each$2(ticks, function (tick) { + _this.applyTickStates(tick, group); + }); + }; + /** + * 根据 optimize 配置对 ticks 进行抽样，对抽样过后的 ticks 才进行真实的渲染 + */ + AxisBase.prototype.optimizeTicks = function () { + var optimize = this.get('optimize'); + var ticks = this.get('ticks'); + if (optimize && optimize.enable && optimize.threshold > 0) { + var len = size$1(ticks); + if (len > optimize.threshold) { + var page_1 = Math.ceil(len / optimize.threshold); + var optimizedTicks = ticks.filter(function (tick, idx) { return idx % page_1 === 0; }); + this.set('ticks', optimizedTicks); + this.set('originalTicks', ticks); + } + } + }; + // 获取 label 的配置项 + AxisBase.prototype.getLabelAttrs = function (tick, index, ticks) { + var labelCfg = this.get('label'); + var offset = labelCfg.offset, rotate = labelCfg.rotate, formatter = labelCfg.formatter; + var point = this.getSidePoint(tick.point, offset); + var vector = this.getSideVector(offset, point); + var text = formatter ? formatter(tick.name, tick, index) : tick.name; + var style = labelCfg.style; + style = isFunction$6(style) ? get$3(this.get('theme'), ['label', 'style'], {}) : style; + var attrs = mix({ + x: point.x, + y: point.y, + text: text, + textAlign: this.getTextAnchor(vector), + textBaseline: this.getTextBaseline(vector), + }, style); + if (rotate) { + attrs.matrix = getMatrixByAngle(point, rotate); + } + return attrs; + }; + // 绘制文本 + AxisBase.prototype.drawLabels = function (group) { + var _this = this; + var ticks = this.get('ticks'); + var labelGroup = this.addGroup(group, { + name: 'axis-label-group', + id: this.getElementId('label-group'), + }); + each$2(ticks, function (tick, index) { + _this.addShape(labelGroup, { + type: 'text', + name: 'axis-label', + id: _this.getElementId("label-" + tick.id), + attrs: _this.getLabelAttrs(tick, index, ticks), + delegateObject: { + tick: tick, + item: tick, + index: index, + }, + }); + }); + this.processOverlap(labelGroup); + // 处理完后再进行 style 回调处理 + var labels = labelGroup.getChildren(); + var defaultLabelStyle = get$3(this.get('theme'), ['label', 'style'], {}); + var _a = this.get('label'), style = _a.style, formatter = _a.formatter; + if (isFunction$6(style)) { + var afterProcessTicks_1 = labels.map(function (label) { return get$3(label.get('delegateObject'), 'tick'); }); + each$2(labels, function (label, index) { + var tick = label.get('delegateObject').tick; + var text = formatter ? formatter(tick.name, tick, index) : tick.name; + var newStyle = mix({}, defaultLabelStyle, style(text, index, afterProcessTicks_1)); + label.attr(newStyle); + }); + } + }; + // 标题的属性 + AxisBase.prototype.getTitleAttrs = function () { + var titleCfg = this.get('title'); + var style = titleCfg.style, position = titleCfg.position, offset = titleCfg.offset, _a = titleCfg.spacing, spacing = _a === void 0 ? 0 : _a, autoRotate = titleCfg.autoRotate; + var titleHeight = style.fontSize; + var percent = 0.5; + if (position === 'start') { + percent = 0; + } + else if (position === 'end') { + percent = 1; + } + var point = this.getTickPoint(percent); // 标题对应的坐标轴上的点 + // 如果没有指定 titleOffset 也没有渲染 label，这里需要自动计算 offset + var titlePoint = this.getSidePoint(point, offset || spacing + titleHeight / 2); // 标题的点 + var attrs = mix({ + x: titlePoint.x, + y: titlePoint.y, + text: titleCfg.text, + }, style); + var rotate = titleCfg.rotate; // rotate 是角度值 + var angle = rotate; + if (isNil(rotate) && autoRotate) { + // 用户没有设定旋转角度，同时设置自动旋转 + var vector = this.getAxisVector(point); + var v1 = [1, 0]; // 水平方向的向量 + angle = angleTo(vector, v1, true); + } + if (angle) { + var matrix = getMatrixByAngle(titlePoint, angle); + attrs.matrix = matrix; + } + return attrs; + }; + // 绘制标题 + AxisBase.prototype.drawTitle = function (group) { + this.addShape(group, { + type: 'text', + id: this.getElementId('title'), + name: 'axis-title', + attrs: this.getTitleAttrs(), + }); + }; + AxisBase.prototype.applyTickStates = function (tick, group) { + var states = this.getItemStates(tick); + if (states.length) { + var tickStates = this.get('tickStates'); + // 分别更新 label 和 tickLine + var labelId = this.getElementId("label-" + tick.id); + var labelShape = group.findById(labelId); + if (labelShape) { + var labelStateStyle = getStatesStyle(tick, 'label', tickStates); + labelStateStyle && labelShape.attr(labelStateStyle); + } + var tickLineId = this.getElementId("tickline-" + tick.id); + var tickLineShape = group.findById(tickLineId); + if (tickLineShape) { + var tickLineStateStyle = getStatesStyle(tick, 'tickLine', tickStates); + tickLineStateStyle && tickLineShape.attr(tickLineStateStyle); + } + } + }; + AxisBase.prototype.updateTickStates = function (tick) { + var states = this.getItemStates(tick); + var tickStates = this.get('tickStates'); + var labelCfg = this.get('label'); + var labelShape = this.getElementByLocalId("label-" + tick.id); + var tickLineCfg = this.get('tickLine'); + var tickLineShape = this.getElementByLocalId("tickline-" + tick.id); + if (states.length) { + if (labelShape) { + var labelStateStyle = getStatesStyle(tick, 'label', tickStates); + labelStateStyle && labelShape.attr(labelStateStyle); + } + if (tickLineShape) { + var tickLineStateStyle = getStatesStyle(tick, 'tickLine', tickStates); + tickLineStateStyle && tickLineShape.attr(tickLineStateStyle); + } + } + else { + if (labelShape) { + labelShape.attr(labelCfg.style); + } + if (tickLineShape) { + tickLineShape.attr(tickLineCfg.style); + } + } + }; + return AxisBase; +}(GroupComponent)); + +function ellipseLabels(isVertical, labelGroup, limitLength, position) { + var children = labelGroup.getChildren(); + var ellipsised = false; + each$2(children, function (label) { + var rst = ellipsisLabel(isVertical, label, limitLength, position); + ellipsised = ellipsised || rst; + }); + return ellipsised; +} +function getDefault$2() { + return ellipsisTail; +} +function ellipsisHead(isVertical, labelGroup, limitLength) { + return ellipseLabels(isVertical, labelGroup, limitLength, 'head'); +} +function ellipsisTail(isVertical, labelGroup, limitLength) { + return ellipseLabels(isVertical, labelGroup, limitLength, 'tail'); +} +function ellipsisMiddle(isVertical, labelGroup, limitLength) { + return ellipseLabels(isVertical, labelGroup, limitLength, 'middle'); +} + +var autoEllipsis = /*#__PURE__*/Object.freeze({ + __proto__: null, + getDefault: getDefault$2, + ellipsisHead: ellipsisHead, + ellipsisTail: ellipsisTail, + ellipsisMiddle: ellipsisMiddle +}); + +// 文本是否旋转 +function isRotate(label) { + var matrix = label.attr('matrix'); + return matrix && matrix[0] !== 1; // 仅在这个场景下判定 +} +function getRotateAngle(label) { + var angle = isRotate(label) ? getAngleByMatrix(label.attr('matrix')) : 0; + return angle % 360; +} +// autohide 不再考虑超出限制 +// function isOutLimit(isVertical: boolean, label: IElement, limitLength: number) { +// if (!limitLength) { +// // 如果没限制 limitLength 则直接返回 false +// return false; +// } +// const canvasBBox = label.getCanvasBBox(); +// let isOut = false; +// if (isVertical) { +// isOut = canvasBBox.width > limitLength; +// } else { +// isOut = canvasBBox.height > limitLength; +// } +// return isOut; +// } +// 是否重叠 +function isOverlap(isVertical, first, second, minGap) { + var overlap = false; + var angle = getRotateAngle(first); + var distance = isVertical + ? Math.abs(second.attr('y') - first.attr('y')) + : Math.abs(second.attr('x') - first.attr('x')); + var prevBBox = (isVertical + ? second.attr('y') > first.attr('y') + : second.attr('x') > first.attr('x')) + ? first.getBBox() + : second.getBBox(); + if (isVertical) { + var ratio = Math.abs(Math.cos(angle)); + if (near(ratio, 0, Math.PI / 180)) { + overlap = prevBBox.width + minGap > distance; + } + else { + overlap = prevBBox.height / ratio + minGap > distance; + } + } + else { + var ratio = Math.abs(Math.sin(angle)); + if (near(ratio, 0, Math.PI / 180)) { + overlap = prevBBox.width + minGap > distance; + } + else { + overlap = prevBBox.height / ratio + minGap > distance; + } + } + return overlap; +} +// 保留第一个或者最后一个 +function reserveOne(isVertical, labelsGroup, reversed, autoHideCfg) { + var minGap = (autoHideCfg === null || autoHideCfg === void 0 ? void 0 : autoHideCfg.minGap) || 0; + var labels = labelsGroup + .getChildren() + .slice() // 复制数组 + .filter(function (item) { return item.get('visible'); }); + if (!labels.length) { + return false; + } + var hasHide = false; + if (reversed) { + // 翻转 + labels.reverse(); + } + var count = labels.length; + var first = labels[0]; + var prev = first; + for (var i = 1; i < count; i++) { + var label = labels[i]; + label.getBBox(); + // 不再考虑超出限制，而仅仅根据是否重叠进行隐藏 isOutLimit(isVertical, label, limitLength) || + var isHide = isOverlap(isVertical, prev, label, minGap); + if (isHide) { + label.hide(); + hasHide = true; + } + else { + prev = label; + } + } + return hasHide; +} +// 均匀抽样隐藏标签，注意这里假设 label/tick 是均匀的 +function parityHide(isVertical, labelsGroup, autoHideCfg) { + var minGap = (autoHideCfg === null || autoHideCfg === void 0 ? void 0 : autoHideCfg.minGap) || 0; + var labels = labelsGroup.getChildren().slice(); // 复制数组 + if (labels.length < 2) { + // 如果数量小于 2 则直接返回，等于 2 时可能也会重合 + return false; + } + var hasHide = false; + var first = labels[0]; + var firstBBox = first.getBBox(); + var second = labels[1]; + var count = labels.length; + var angle = getRotateAngle(first); + var distance = isVertical + ? Math.abs(second.attr('y') - first.attr('y')) + : Math.abs(second.attr('x') - first.attr('x')); + var interval = 0; // 不重叠的坐标文本间距个数 + if (isVertical) { + // 垂直的坐标轴计算垂直方向的间距 + var ratio = Math.abs(Math.cos(angle)); + if (near(ratio, 0, Math.PI / 180)) { + var maxWidth = getMaxLabelWidth(labels); + interval = (maxWidth + minGap) / distance; + } + else { + interval = (firstBBox.height / ratio + minGap) / distance; + } + } + else { + // 水平坐标轴 + var ratio = Math.abs(Math.sin(angle)); + if (near(ratio, 0, Math.PI / 180)) { + var maxWidth = getMaxLabelWidth(labels); + interval = (maxWidth + minGap) / distance; + } + else { + interval = (firstBBox.height / ratio + minGap) / distance; + } + } + // interval > 1 时需要对 label 进行隐藏 + if (interval > 1) { + interval = Math.ceil(interval); + for (var i = 0; i < count; i++) { + if (i % interval !== 0) { + // 仅保留被整除的 label + labels[i].hide(); + hasHide = true; + } + } + } + return hasHide; +} +function getDefault$1() { + return equidistance; +} +/** + * 保证首个 label 可见，即使超过 limitLength 也不隐藏 + * @param {boolean} isVertical 是否垂直 + * @param {IGroup} labelsGroup label 的分组 + * @param {number} limitLength 另一个方向的长度限制，autoHide 不关心 + * @param {AxisLabelAutoHideCfg} autoHideCfg autoHide overlap 的可选配置参数 + */ +function reserveFirst(isVertical, labelsGroup, limitLength, autoHideCfg) { + return reserveOne(isVertical, labelsGroup, false, autoHideCfg); +} +/** + * 保证最后一个 label 可见，即使超过 limitLength 也不隐藏 + * @param {boolean} isVertical 是否垂直 + * @param {IGroup} labelsGroup label 的分组 + * @param {number} limitLength 另一个方向的长度限制，autoHide 不关心 + * @param {AxisLabelAutoHideCfg} autoHideCfg autoHide overlap 的可选配置参数 + */ +function reserveLast(isVertical, labelsGroup, limitLength, autoHideCfg) { + return reserveOne(isVertical, labelsGroup, true, autoHideCfg); +} +/** + * 保证第一个最后一个 label 可见，即使超过 limitLength 也不隐藏 + * @param {boolean} isVertical 是否垂直 + * @param {IGroup} labelsGroup label 的分组 + * @param {number} limitLength 另一个方向的长度限制，autoHide 不关心 + * @param {AxisLabelAutoHideCfg} autoHideCfg autoHide overlap 的可选配置参数 + */ +function reserveBoth(isVertical, labelsGroup, limitLength, autoHideCfg) { + var minGap = (autoHideCfg === null || autoHideCfg === void 0 ? void 0 : autoHideCfg.minGap) || 0; + var labels = labelsGroup.getChildren().slice(); // 复制数组 + if (labels.length <= 2) { + // 如果数量小于或等于 2 则直接返回 + return false; + } + var hasHide = false; + var count = labels.length; + var first = labels[0]; + var last = labels[count - 1]; + var preLabel = first; + // 按照先保存第一个的逻辑循环一遍，最后一个不参与循环 + for (var i = 1; i < count - 1; i++) { + var label = labels[i]; + label.getBBox(); + // 废弃 isOutLimit(isVertical, label, limitLength) || + var isHide = isOverlap(isVertical, preLabel, label, minGap); + if (isHide) { + label.hide(); + hasHide = true; + } + else { + preLabel = label; + } + } + var overlap = isOverlap(isVertical, preLabel, last, minGap); + if (overlap) { + // 发生冲突，则隐藏前一个保留后一个 + preLabel.hide(); + hasHide = true; + } + return hasHide; +} +/** + * 保证 label 均匀显示 和 不出现重叠，主要解决文本层叠的问题，对于 limitLength 不处理 + * @param {boolean} isVertical 是否垂直 + * @param {IGroup} labelsGroup label 的分组 + * @param {number} limitLength 另一个方向的长度限制，autoHide 不关心 + * @param {AxisLabelAutoHideCfg} autoHideCfg autoHide overlap 的可选配置参数 + */ +function equidistance(isVertical, labelsGroup, limitLength, autoHideCfg) { + var hasHide = parityHide(isVertical, labelsGroup, autoHideCfg); + // 处理 timeCat 类型的 tick，在均匀的基础上，再次检查出现重叠的进行隐藏 + if (reserveOne(isVertical, labelsGroup, false)) { + hasHide = true; + } + return hasHide; +} +/** + * 同 equidistance， 首先会保证 labels 均匀显示，然后会保留首尾 + * @param isVertical + * @param labelsGroup + * @param {number} limitLength 另一个方向的长度限制，autoHide 不关心 + * @param {AxisLabelAutoHideCfg} autoHideCfg autoHide overlap 的可选配置参数 + */ +function equidistanceWithReverseBoth(isVertical, labelsGroup, limitLength, autoHideCfg) { + var labels = labelsGroup.getChildren().slice(); // 复制数组 + var hasHide = parityHide(isVertical, labelsGroup, autoHideCfg); + if (labels.length > 2) { + var first = labels[0]; + var last = labels[labels.length - 1]; + // 如果第一个被隐藏了 + if (!first.get('visible')) { + first.show(); + if (reserveOne(isVertical, labelsGroup, false, autoHideCfg)) { + hasHide = true; + } + } + // 如果最后一个被隐藏了 + if (!last.get('visible')) { + last.show(); + if (reserveOne(isVertical, labelsGroup, true, autoHideCfg)) { + hasHide = true; + } + } + } + return hasHide; +} + +var autoHide = /*#__PURE__*/Object.freeze({ + __proto__: null, + getDefault: getDefault$1, + reserveFirst: reserveFirst, + reserveLast: reserveLast, + reserveBoth: reserveBoth, + equidistance: equidistance, + equidistanceWithReverseBoth: equidistanceWithReverseBoth +}); + +// 统一设置文本的角度 +function setLabelsAngle(labels, angle) { + each$2(labels, function (label) { + var x = label.attr('x'); + var y = label.attr('y'); + var matrix = getMatrixByAngle({ x: x, y: y }, angle); + label.attr('matrix', matrix); + }); +} +// 旋转文本 +function labelRotate(isVertical, labelsGroup, limitLength, getAngle) { + var labels = labelsGroup.getChildren(); + if (!labels.length) { + return false; + } + if (!isVertical && labels.length < 2) { + // 水平时至少有两个时才旋转 + return false; + } + var maxWidth = getMaxLabelWidth(labels); + var isOverlap = false; + if (isVertical) { + // limitLength 为 0 或者 null 时不生效 + isOverlap = !!limitLength && maxWidth > limitLength; + } + else { + // 同 limitLength 无关 + var tickWidth = Math.abs(labels[1].attr('x') - labels[0].attr('x')); + isOverlap = maxWidth > tickWidth; + } + if (isOverlap) { + var angle = getAngle(limitLength, maxWidth); + setLabelsAngle(labels, angle); + } + return isOverlap; +} +function getDefault() { + return fixedAngle; +} +/** + * 固定角度旋转文本 + * @param {boolean} isVertical 是否垂直方向 + * @param {IGroup} labelsGroup 文本的 group + * @param {number} limitLength 限定长度 + * @param {number} customRotate 自定义旋转角度 + * @return {boolean} 是否发生了旋转 + */ +function fixedAngle(isVertical, labelsGroup, limitLength, customRotate) { + return labelRotate(isVertical, labelsGroup, limitLength, function () { + if (isNumber$4(customRotate)) { + return customRotate; + } + return isVertical ? Theme.verticalAxisRotate : Theme.horizontalAxisRotate; + }); +} +/** + * 非固定角度旋转文本 + * @param {boolean} isVertical 是否垂直方向 + * @param {IGroup} labelsGroup 文本的 group + * @param {number} limitLength 限定长度 + * @return {boolean} 是否发生了旋转 + */ +function unfixedAngle(isVertical, labelsGroup, limitLength) { + return labelRotate(isVertical, labelsGroup, limitLength, function (length, maxWidth) { + if (!length) { + // 如果没有设置 limitLength，则使用固定的角度旋转 + return isVertical ? Theme.verticalAxisRotate : Theme.horizontalAxisRotate; + } + if (isVertical) { + // 垂直时不需要判定 limitLength > maxWidth ，因为此时不会 overlap + return -Math.acos(length / maxWidth); + } + else { + var angle = 0; + if (length > maxWidth) { + // 需要判定，asin 的参数 -1， 1 + angle = Math.PI / 4; + } + else { + angle = Math.asin(length / maxWidth); + if (angle > Math.PI / 4) { + // 大于 Math.PI / 4 时没意义 + angle = Math.PI / 4; + } + } + return angle; + } + }); +} + +var autoRotate = /*#__PURE__*/Object.freeze({ + __proto__: null, + getDefault: getDefault, + fixedAngle: fixedAngle, + unfixedAngle: unfixedAngle +}); + +var OverlapUtil = /*#__PURE__*/Object.freeze({ + __proto__: null, + autoHide: autoHide, + autoRotate: autoRotate, + autoEllipsis: autoEllipsis +}); + +var Line$a = /** @class */ (function (_super) { + __extends$e(Line, _super); + function Line() { + return _super !== null && _super.apply(this, arguments) || this; + } + Line.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { type: 'line', locationType: 'region', + /** + * 起始点, x, y + * @type {object} + */ + start: null, + /** + * 结束点, x, y + * @type {object} + */ + end: null }); + }; + // 获取坐标轴线的 path + Line.prototype.getLinePath = function () { + var start = this.get('start'); + var end = this.get('end'); + var path = []; + path.push(['M', start.x, start.y]); + path.push(['L', end.x, end.y]); + return path; + }; + // 重新计算 layout bbox，考虑到 line 不显示 + Line.prototype.getInnerLayoutBBox = function () { + var start = this.get('start'); + var end = this.get('end'); + var bbox = _super.prototype.getInnerLayoutBBox.call(this); + var minX = Math.min(start.x, end.x, bbox.x); + var minY = Math.min(start.y, end.y, bbox.y); + var maxX = Math.max(start.x, end.x, bbox.maxX); + var maxY = Math.max(start.y, end.y, bbox.maxY); + return { + x: minX, + y: minY, + minX: minX, + minY: minY, + maxX: maxX, + maxY: maxY, + width: maxX - minX, + height: maxY - minY, + }; + }; + Line.prototype.isVertical = function () { + var start = this.get('start'); + var end = this.get('end'); + return isNumberEqual$1(start.x, end.x); + }; + Line.prototype.isHorizontal = function () { + var start = this.get('start'); + var end = this.get('end'); + return isNumberEqual$1(start.y, end.y); + }; + Line.prototype.getTickPoint = function (tickValue) { + var self = this; + var start = self.get('start'); + var end = self.get('end'); + var regionX = end.x - start.x; + var regionY = end.y - start.y; + return { + x: start.x + regionX * tickValue, + y: start.y + regionY * tickValue, + }; + }; + // 直线坐标轴下任一点的向量方向都相同 + Line.prototype.getSideVector = function (offset) { + var axisVector = this.getAxisVector(); + var normal = normalize$4([0, 0], axisVector); + var factor = this.get('verticalFactor'); + var verticalVector = [normal[1], normal[0] * -1]; // 垂直方向，逆时针方向 + return scale$4([0, 0], verticalVector, offset * factor); + }; + // 获取坐标轴的向量 + Line.prototype.getAxisVector = function () { + var start = this.get('start'); + var end = this.get('end'); + return [end.x - start.x, end.y - start.y]; + }; + Line.prototype.processOverlap = function (labelGroup) { + var _this = this; + var isVertical = this.isVertical(); + var isHorizontal = this.isHorizontal(); + // 非垂直，或者非水平时不处理遮挡问题 + if (!isVertical && !isHorizontal) { + return; + } + var labelCfg = this.get('label'); + var titleCfg = this.get('title'); + var verticalLimitLength = this.get('verticalLimitLength'); + var labelOffset = labelCfg.offset; + var limitLength = verticalLimitLength; + var titleHeight = 0; + var titleSpacing = 0; + if (titleCfg) { + titleHeight = titleCfg.style.fontSize; + titleSpacing = titleCfg.spacing; + } + if (limitLength) { + limitLength = limitLength - labelOffset - titleSpacing - titleHeight; + } + var overlapOrder = this.get('overlapOrder'); + each$2(overlapOrder, function (name) { + if (labelCfg[name] && _this.canProcessOverlap(name)) { + _this.autoProcessOverlap(name, labelCfg[name], labelGroup, limitLength); + } + }); + if (titleCfg) { + if (isNil(titleCfg.offset)) { + // 调整 title 的 offset + var bbox = labelGroup.getCanvasBBox(); + var length_1 = isVertical ? bbox.width : bbox.height; + // 如果用户没有设置 offset，则自动计算 + titleCfg.offset = labelOffset + length_1 + titleSpacing + titleHeight / 2; + } + } + }; + /** + * 是否可以执行某一 overlap + * @param name + */ + Line.prototype.canProcessOverlap = function (name) { + var labelCfg = this.get('label'); + // 对 autoRotate，如果配置了旋转角度，直接进行固定角度旋转 + if (name === 'autoRotate') { + return isNil(labelCfg.rotate); + } + // 默认所有 overlap 都可执行 + return true; + }; + Line.prototype.autoProcessOverlap = function (name, value, labelGroup, limitLength) { + var _this = this; + var isVertical = this.isVertical(); + var hasAdjusted = false; + var util = OverlapUtil[name]; + if (value === true) { + this.get('label'); + // true 形式的配置：使用 overlap 默认的的处理方法进行处理 + hasAdjusted = util.getDefault()(isVertical, labelGroup, limitLength); + } + else if (isFunction$6(value)) { + // 回调函数形式的配置： 用户可以传入回调函数 + hasAdjusted = value(isVertical, labelGroup, limitLength); + } + else if (isObject$f(value)) { + // object 形式的配置方式：包括 处理方法 type， 和可选参数配置 cfg + var overlapCfg = value; + if (util[overlapCfg.type]) { + hasAdjusted = util[overlapCfg.type](isVertical, labelGroup, limitLength, overlapCfg.cfg); + } + } + else if (util[value]) { + // 字符串类型的配置：按照名称执行 overlap 处理方法 + hasAdjusted = util[value](isVertical, labelGroup, limitLength); + } + if (name === 'autoRotate') { + // 文本旋转后，文本的对齐方式可能就不合适了 + if (hasAdjusted) { + var labels = labelGroup.getChildren(); + var verticalFactor_1 = this.get('verticalFactor'); + each$2(labels, function (label) { + var textAlign = label.attr('textAlign'); + if (textAlign === 'center') { + // 居中的文本需要调整旋转度 + var newAlign = verticalFactor_1 > 0 ? 'end' : 'start'; + label.attr('textAlign', newAlign); + } + }); + } + } + else if (name === 'autoHide') { + var children = labelGroup.getChildren().slice(0); // 复制数组，删除时不会出错 + each$2(children, function (label) { + if (!label.get('visible')) { + if (_this.get('isRegister')) { + // 已经注册过了，则删除 + _this.unregisterElement(label); + } + label.remove(); // 防止 label 数量太多，所以统一删除 + } + }); + } + }; + return Line; +}(AxisBase)); + +var Circle$6 = /** @class */ (function (_super) { + __extends$e(Circle, _super); + function Circle() { + return _super !== null && _super.apply(this, arguments) || this; + } + Circle.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { type: 'circle', locationType: 'circle', center: null, radius: null, startAngle: -Math.PI / 2, endAngle: (Math.PI * 3) / 2 }); + }; + Circle.prototype.getLinePath = function () { + var center = this.get('center'); + var x = center.x; + var y = center.y; + var rx = this.get('radius'); + var ry = rx; + var startAngle = this.get('startAngle'); + var endAngle = this.get('endAngle'); + var path = []; + if (Math.abs(endAngle - startAngle) === Math.PI * 2) { + path = [['M', x, y - ry], ['A', rx, ry, 0, 1, 1, x, y + ry], ['A', rx, ry, 0, 1, 1, x, y - ry], ['Z']]; + } + else { + var startPoint = this.getCirclePoint(startAngle); + var endPoint = this.getCirclePoint(endAngle); + var large = Math.abs(endAngle - startAngle) > Math.PI ? 1 : 0; + var sweep = startAngle > endAngle ? 0 : 1; + path = [ + ['M', x, y], + ['L', startPoint.x, startPoint.y], + ['A', rx, ry, 0, large, sweep, endPoint.x, endPoint.y], + ['L', x, y], + ]; + } + return path; + }; + Circle.prototype.getTickPoint = function (tickValue) { + var startAngle = this.get('startAngle'); + var endAngle = this.get('endAngle'); + var angle = startAngle + (endAngle - startAngle) * tickValue; + return this.getCirclePoint(angle); + }; + // 获取垂直于坐标轴的向量 + Circle.prototype.getSideVector = function (offset, point) { + var center = this.get('center'); + var vector = [point.x - center.x, point.y - center.y]; + var factor = this.get('verticalFactor'); + var vecLen = length$1(vector); + scale$4(vector, vector, (factor * offset) / vecLen); + return vector; + }; + // 获取沿坐标轴方向的向量 + Circle.prototype.getAxisVector = function (point) { + var center = this.get('center'); + var vector = [point.x - center.x, point.y - center.y]; + return [vector[1], -1 * vector[0]]; // 获取顺时针方向的向量 + }; + // 根据圆心和半径获取点 + Circle.prototype.getCirclePoint = function (angle, radius) { + var center = this.get('center'); + radius = radius || this.get('radius'); + return { + x: center.x + Math.cos(angle) * radius, + y: center.y + Math.sin(angle) * radius, + }; + }; + return Circle; +}(AxisBase)); + +var CrosshairBase = /** @class */ (function (_super) { + __extends$e(CrosshairBase, _super); + function CrosshairBase() { + return _super !== null && _super.apply(this, arguments) || this; + } + CrosshairBase.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { name: 'crosshair', type: 'base', line: {}, text: null, textBackground: {}, capture: false, defaultCfg: { + line: { + style: { + lineWidth: 1, + stroke: Theme.lineColor, + }, + }, + text: { + position: 'start', + offset: 10, + autoRotate: false, + content: null, + style: { + fill: Theme.textColor, + textAlign: 'center', + textBaseline: 'middle', + fontFamily: Theme.fontFamily, + }, + }, + textBackground: { + padding: 5, + style: { + stroke: Theme.lineColor, + }, + }, + } }); + }; + CrosshairBase.prototype.renderInner = function (group) { + if (this.get('line')) { + this.renderLine(group); + } + if (this.get('text')) { + this.renderText(group); + this.renderBackground(group); + } + }; + CrosshairBase.prototype.renderText = function (group) { + var text = this.get('text'); + var style = text.style, autoRotate = text.autoRotate, content = text.content; + if (!isNil(content)) { + var textPoint = this.getTextPoint(); + var matrix = null; + if (autoRotate) { + var angle = this.getRotateAngle(); + matrix = getMatrixByAngle(textPoint, angle); + } + this.addShape(group, { + type: 'text', + name: 'crosshair-text', + id: this.getElementId('text'), + attrs: __assign$r(__assign$r(__assign$r({}, textPoint), { text: content, matrix: matrix }), style), + }); + } + }; + CrosshairBase.prototype.renderLine = function (group) { + var path = this.getLinePath(); + var line = this.get('line'); + var style = line.style; + this.addShape(group, { + type: 'path', + name: 'crosshair-line', + id: this.getElementId('line'), + attrs: __assign$r({ path: path }, style), + }); + }; + // 绘制文本的背景 + CrosshairBase.prototype.renderBackground = function (group) { + var textId = this.getElementId('text'); + var textShape = group.findById(textId); // 查找文本 + var textBackground = this.get('textBackground'); + if (textBackground && textShape) { + var textBBox = textShape.getBBox(); + var padding = formatPadding$1(textBackground.padding); // 用户传入的 padding 格式不定 + var style = textBackground.style; + var backgroundShape = this.addShape(group, { + type: 'rect', + name: 'crosshair-text-background', + id: this.getElementId('text-background'), + attrs: __assign$r({ x: textBBox.x - padding[3], y: textBBox.y - padding[0], width: textBBox.width + padding[1] + padding[3], height: textBBox.height + padding[0] + padding[2], matrix: textShape.attr('matrix') }, style), + }); + backgroundShape.toBack(); + } + }; + return CrosshairBase; +}(GroupComponent)); + +var LineCrosshair$1 = /** @class */ (function (_super) { + __extends$e(LineCrosshair, _super); + function LineCrosshair() { + return _super !== null && _super.apply(this, arguments) || this; + } + LineCrosshair.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { type: 'line', locationType: 'region', start: null, end: null }); + }; + // 直线的文本需要同直线垂直 + LineCrosshair.prototype.getRotateAngle = function () { + var _a = this.getLocation(), start = _a.start, end = _a.end; + var position = this.get('text').position; + var angle = Math.atan2(end.y - start.y, end.x - start.x); + var tangentAngle = position === 'start' ? angle - Math.PI / 2 : angle + Math.PI / 2; + return tangentAngle; + }; + LineCrosshair.prototype.getTextPoint = function () { + var _a = this.getLocation(), start = _a.start, end = _a.end; + var _b = this.get('text'), position = _b.position, offset = _b.offset; + return getTextPoint(start, end, position, offset); + }; + LineCrosshair.prototype.getLinePath = function () { + var _a = this.getLocation(), start = _a.start, end = _a.end; + return [ + ['M', start.x, start.y], + ['L', end.x, end.y], + ]; + }; + return LineCrosshair; +}(CrosshairBase)); + +var LineCrosshair = /** @class */ (function (_super) { + __extends$e(LineCrosshair, _super); + function LineCrosshair() { + return _super !== null && _super.apply(this, arguments) || this; + } + LineCrosshair.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { type: 'circle', locationType: 'circle', center: null, radius: 100, startAngle: -Math.PI / 2, endAngle: (Math.PI * 3) / 2 }); + }; + LineCrosshair.prototype.getRotateAngle = function () { + var _a = this.getLocation(), startAngle = _a.startAngle, endAngle = _a.endAngle; + var position = this.get('text').position; + var tangentAngle = position === 'start' ? startAngle + Math.PI / 2 : endAngle - Math.PI / 2; + return tangentAngle; + }; + LineCrosshair.prototype.getTextPoint = function () { + var text = this.get('text'); + var position = text.position, offset = text.offset; + var _a = this.getLocation(), center = _a.center, radius = _a.radius, startAngle = _a.startAngle, endAngle = _a.endAngle; + var angle = position === 'start' ? startAngle : endAngle; + var tangentAngle = this.getRotateAngle() - Math.PI; + var point = getCirclePoint(center, radius, angle); + // 这个地方其实应该求切线向量然后在乘以 offset，但是太啰嗦了，直接给出结果 + // const tangent = [Math.cos(tangentAngle), Math.sin(tangentAngle)]; + // const offsetVector = vec2.scale([], tangent, offset); + var offsetX = Math.cos(tangentAngle) * offset; + var offsetY = Math.sin(tangentAngle) * offset; + return { + x: point.x + offsetX, + y: point.y + offsetY, + }; + }; + LineCrosshair.prototype.getLinePath = function () { + var _a = this.getLocation(), center = _a.center, radius = _a.radius, startAngle = _a.startAngle, endAngle = _a.endAngle; + var path = null; + if (endAngle - startAngle === Math.PI * 2) { + // 整圆 + var x = center.x, y = center.y; + path = [ + ['M', x, y - radius], + ['A', radius, radius, 0, 1, 1, x, y + radius], + ['A', radius, radius, 0, 1, 1, x, y - radius], + ['Z'], + ]; + } + else { + var startPoint = getCirclePoint(center, radius, startAngle); + var endPoint = getCirclePoint(center, radius, endAngle); + var large = Math.abs(endAngle - startAngle) > Math.PI ? 1 : 0; + var sweep = startAngle > endAngle ? 0 : 1; + path = [ + ['M', startPoint.x, startPoint.y], + ['A', radius, radius, 0, large, sweep, endPoint.x, endPoint.y], + ]; + } + return path; + }; + return LineCrosshair; +}(CrosshairBase)); + +var CONTAINER_CLASS$1 = 'g2-crosshair'; +var CROSSHAIR_LINE = CONTAINER_CLASS$1 + "-line"; +var CROSSHAIR_TEXT = CONTAINER_CLASS$1 + "-text"; + +var _a$4; +var HtmlTheme = (_a$4 = {}, + // css style for tooltip + _a$4["" + CONTAINER_CLASS$1] = { + position: 'relative' + }, + _a$4["" + CROSSHAIR_LINE] = { + position: 'absolute', + backgroundColor: 'rgba(0, 0, 0, 0.25)', + }, + _a$4["" + CROSSHAIR_TEXT] = { + position: 'absolute', + color: Theme.textColor, + fontFamily: Theme.fontFamily, + }, + _a$4); + +var HtmlCrosshair = /** @class */ (function (_super) { + __extends$e(HtmlCrosshair, _super); + function HtmlCrosshair() { + return _super !== null && _super.apply(this, arguments) || this; + } + HtmlCrosshair.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { name: 'crosshair', type: 'html', locationType: 'region', start: { x: 0, y: 0 }, end: { x: 0, y: 0 }, capture: false, text: null, containerTpl: "
", crosshairTpl: "
", textTpl: "{content}", domStyles: null, containerClassName: CONTAINER_CLASS$1, defaultStyles: HtmlTheme, defaultCfg: { + text: { + position: 'start', + content: null, + align: 'center', + offset: 10 + } + } }); + }; + HtmlCrosshair.prototype.render = function () { + this.resetText(); + this.resetPosition(); + }; + // 绘制 crosshair + HtmlCrosshair.prototype.initCrossHair = function () { + var container = this.getContainer(); + var crosshairTpl = this.get('crosshairTpl'); + var crosshairEl = createDom$1(crosshairTpl); + container.appendChild(crosshairEl); + this.applyStyle(CROSSHAIR_LINE, crosshairEl); + this.set('crosshairEl', crosshairEl); + }; + // 获取文本的位置 + HtmlCrosshair.prototype.getTextPoint = function () { + var _a = this.getLocation(), start = _a.start, end = _a.end; + var _b = this.get('text'), position = _b.position, offset = _b.offset; + return getTextPoint(start, end, position, offset); + }; + // 设置 text + HtmlCrosshair.prototype.resetText = function () { + var text = this.get('text'); + var textEl = this.get('textEl'); + if (text) { + var content = text.content; + if (!textEl) { + var container = this.getContainer(); + var textTpl = substitute$1(this.get('textTpl'), text); + textEl = createDom$1(textTpl); + container.appendChild(textEl); + this.applyStyle(CROSSHAIR_TEXT, textEl); + this.set('textEl', textEl); + } + textEl.innerHTML = content; + } + else if (textEl) { + textEl.remove(); + } + }; + // 是否垂直 + HtmlCrosshair.prototype.isVertical = function (start, end) { + return start.x === end.x; + }; + // 重新调整位置 + HtmlCrosshair.prototype.resetPosition = function () { + var crosshairEl = this.get('crosshairEl'); + if (!crosshairEl) { + this.initCrossHair(); + crosshairEl = this.get('crosshairEl'); + } + var start = this.get('start'); + var end = this.get('end'); + var minX = Math.min(start.x, end.x); + var minY = Math.min(start.y, end.y); + if (this.isVertical(start, end)) { + modifyCSS(crosshairEl, { + width: '1px', + height: toPx(Math.abs(end.y - start.y)) + }); + } + else { + modifyCSS(crosshairEl, { + height: '1px', + width: toPx(Math.abs(end.x - start.x)) + }); + } + modifyCSS(crosshairEl, { + top: toPx(minY), + left: toPx(minX) + }); + this.alignText(); + }; + HtmlCrosshair.prototype.alignText = function () { + // 重新设置 text 位置 + var textEl = this.get('textEl'); + if (textEl) { + var align = this.get('text').align; + var clientWidth = textEl.clientWidth; + var point = this.getTextPoint(); + switch (align) { + case 'center': + point.x = point.x - clientWidth / 2; + break; + case 'right': + point.x = point.x - clientWidth; + } + modifyCSS(textEl, { + top: toPx(point.y), + left: toPx(point.x) + }); + } + }; + HtmlCrosshair.prototype.updateInner = function (cfg) { + if (has$1(cfg, 'text')) { + this.resetText(); + } + _super.prototype.updateInner.call(this, cfg); + }; + return HtmlCrosshair; +}(HtmlComponent)); + +var Crosshair = /*#__PURE__*/Object.freeze({ + __proto__: null, + Line: LineCrosshair$1, + Circle: LineCrosshair, + Base: CrosshairBase, + Html: HtmlCrosshair +}); + +var GridBase = /** @class */ (function (_super) { + __extends$e(GridBase, _super); + function GridBase() { + return _super !== null && _super.apply(this, arguments) || this; + } + GridBase.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { name: 'grid', line: {}, alternateColor: null, capture: false, items: [], closed: false, defaultCfg: { + line: { + type: 'line', + style: { + lineWidth: 1, + stroke: Theme.lineColor, + }, + }, + } }); + }; + /** + * 获取栅格线的类型 + * @return {string} 栅格线类型 + */ + GridBase.prototype.getLineType = function () { + var line = this.get('line') || this.get('defaultCfg').line; + return line.type; + }; + GridBase.prototype.renderInner = function (group) { + this.drawGrid(group); + }; + GridBase.prototype.getAlternatePath = function (prePoints, points) { + var regionPath = this.getGridPath(prePoints); + var reversePoints = points.slice(0).reverse(); + var nextPath = this.getGridPath(reversePoints, true); + var closed = this.get('closed'); + if (closed) { + regionPath = regionPath.concat(nextPath); + } + else { + nextPath[0][0] = 'L'; // 更新第一个节点 + regionPath = regionPath.concat(nextPath); + regionPath.push(['Z']); + } + return regionPath; + }; + // 获取路径的配置项 + GridBase.prototype.getPathStyle = function () { + return this.get('line').style; + }; + // 绘制栅格 + GridBase.prototype.drawGrid = function (group) { + var _this = this; + var line = this.get('line'); + var items = this.get('items'); + var alternateColor = this.get('alternateColor'); + var preItem = null; + each$2(items, function (item, index) { + var id = item.id || index; + // 绘制栅格线 + if (line) { + var style = _this.getPathStyle(); + style = isFunction$6(style) ? style(item, index, items) : style; + var lineId = _this.getElementId("line-" + id); + var gridPath = _this.getGridPath(item.points); + _this.addShape(group, { + type: 'path', + name: 'grid-line', + id: lineId, + attrs: mix({ + path: gridPath, + }, style), + }); + } + // 如果存在 alternateColor 则绘制矩形 + // 从第二个栅格线开始绘制 + if (alternateColor && index > 0) { + var regionId = _this.getElementId("region-" + id); + var isEven = index % 2 === 0; + if (isString$3(alternateColor)) { + // 如果颜色是单值，则是仅绘制偶数时的区域 + if (isEven) { + _this.drawAlternateRegion(regionId, group, preItem.points, item.points, alternateColor); + } + } + else { + var color = isEven ? alternateColor[1] : alternateColor[0]; + _this.drawAlternateRegion(regionId, group, preItem.points, item.points, color); + } + } + preItem = item; + }); + }; + // 绘制栅格线间的间隔 + GridBase.prototype.drawAlternateRegion = function (id, group, prePoints, points, color) { + var regionPath = this.getAlternatePath(prePoints, points); + this.addShape(group, { + type: 'path', + id: id, + name: 'grid-region', + attrs: { + path: regionPath, + fill: color, + }, + }); + }; + return GridBase; +}(GroupComponent)); + +function distance$7(x1, y1, x2, y2) { + var dx = x2 - x1; + var dy = y2 - y1; + return Math.sqrt(dx * dx + dy * dy); +} +var Circle$5 = /** @class */ (function (_super) { + __extends$e(Circle, _super); + function Circle() { + return _super !== null && _super.apply(this, arguments) || this; + } + Circle.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { type: 'circle', + /** + * 中心点 + * @type {object} + */ + center: null, + /** + * 栅格线是否封闭 + * @type {true} + */ + closed: true }); + }; + Circle.prototype.getGridPath = function (points, reversed) { + var lineType = this.getLineType(); + var closed = this.get('closed'); + var path = []; + if (points.length) { + // 防止出错 + if (lineType === 'circle') { + var center = this.get('center'); + var firstPoint = points[0]; + var radius_1 = distance$7(center.x, center.y, firstPoint.x, firstPoint.y); + var sweepFlag_1 = reversed ? 0 : 1; // 顺时针还是逆时针 + if (closed) { + // 封闭时，绘制整个圆 + path.push(['M', center.x, center.y - radius_1]); + path.push(['A', radius_1, radius_1, 0, 0, sweepFlag_1, center.x, center.y + radius_1]); + path.push(['A', radius_1, radius_1, 0, 0, sweepFlag_1, center.x, center.y - radius_1]); + path.push(['Z']); + } + else { + each$2(points, function (point, index) { + if (index === 0) { + path.push(['M', point.x, point.y]); + } + else { + path.push(['A', radius_1, radius_1, 0, 0, sweepFlag_1, point.x, point.y]); + } + }); + } + } + else { + each$2(points, function (point, index) { + if (index === 0) { + path.push(['M', point.x, point.y]); + } + else { + path.push(['L', point.x, point.y]); + } + }); + if (closed) { + path.push(['Z']); + } + } + } + return path; + }; + return Circle; +}(GridBase)); + +var Line$9 = /** @class */ (function (_super) { + __extends$e(Line, _super); + function Line() { + return _super !== null && _super.apply(this, arguments) || this; + } + Line.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { type: 'line' }); + }; + Line.prototype.getGridPath = function (points) { + var path = []; + each$2(points, function (point, index) { + if (index === 0) { + path.push(['M', point.x, point.y]); + } + else { + path.push(['L', point.x, point.y]); + } + }); + return path; + }; + return Line; +}(GridBase)); + +var LegendBase = /** @class */ (function (_super) { + __extends$e(LegendBase, _super); + function LegendBase() { + return _super !== null && _super.apply(this, arguments) || this; + } + LegendBase.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { name: 'legend', + /** + * 布局方式： horizontal，vertical + * @type {String} + */ + layout: 'horizontal', locationType: 'point', x: 0, y: 0, offsetX: 0, offsetY: 0, title: null, background: null }); + }; + LegendBase.prototype.getLayoutBBox = function () { + var bbox = _super.prototype.getLayoutBBox.call(this); + var maxWidth = this.get('maxWidth'); + var maxHeight = this.get('maxHeight'); + var width = bbox.width, height = bbox.height; + if (maxWidth) { + width = Math.min(width, maxWidth); + } + if (maxHeight) { + height = Math.min(height, maxHeight); + } + return createBBox(bbox.minX, bbox.minY, width, height); + }; + LegendBase.prototype.setLocation = function (cfg) { + this.set('x', cfg.x); + this.set('y', cfg.y); + this.resetLocation(); + }; + LegendBase.prototype.resetLocation = function () { + var x = this.get('x'); + var y = this.get('y'); + var offsetX = this.get('offsetX'); + var offsetY = this.get('offsetY'); + this.moveElementTo(this.get('group'), { + x: x + offsetX, + y: y + offsetY, + }); + }; + LegendBase.prototype.applyOffset = function () { + this.resetLocation(); + }; + // 获取当前绘制的点 + LegendBase.prototype.getDrawPoint = function () { + return this.get('currentPoint'); + }; + LegendBase.prototype.setDrawPoint = function (point) { + return this.set('currentPoint', point); + }; + // 复写父类定义的绘制方法 + LegendBase.prototype.renderInner = function (group) { + this.resetDraw(); + if (this.get('title')) { + this.drawTitle(group); + } + this.drawLegendContent(group); + if (this.get('background')) { + this.drawBackground(group); + } + // this.resetLocation(); // 在顶层已经在处理偏移时一起处理了 + }; + // 绘制背景 + LegendBase.prototype.drawBackground = function (group) { + var background = this.get('background'); + var bbox = group.getBBox(); + var padding = formatPadding$1(background.padding); + var attrs = __assign$r({ + // 背景从 (0,0) 开始绘制 + x: 0, y: 0, width: bbox.width + padding[1] + padding[3], height: bbox.height + padding[0] + padding[2] }, background.style); + var backgroundShape = this.addShape(group, { + type: 'rect', + id: this.getElementId('background'), + name: 'legend-background', + attrs: attrs, + }); + backgroundShape.toBack(); + }; + // 绘制标题，标题在图例项的上面 + LegendBase.prototype.drawTitle = function (group) { + var currentPoint = this.get('currentPoint'); + var titleCfg = this.get('title'); + var spacing = titleCfg.spacing, style = titleCfg.style, text = titleCfg.text; + var shape = this.addShape(group, { + type: 'text', + id: this.getElementId('title'), + name: 'legend-title', + attrs: __assign$r({ text: text, x: currentPoint.x, y: currentPoint.y }, style), + }); + var bbox = shape.getBBox(); + // 标题单独在一行 + this.set('currentPoint', { x: currentPoint.x, y: bbox.maxY + spacing }); + }; + // 重置绘制时开始的位置，如果绘制边框，考虑边框的 padding + LegendBase.prototype.resetDraw = function () { + var background = this.get('background'); + var currentPoint = { x: 0, y: 0 }; + if (background) { + var padding = formatPadding$1(background.padding); + currentPoint.x = padding[3]; // 左边 padding + currentPoint.y = padding[0]; // 上面 padding + } + this.set('currentPoint', currentPoint); // 设置绘制的初始位置 + }; + return LegendBase; +}(GroupComponent)); + +/** + * 分页器 默认配置 + */ +var DEFAULT_PAGE_NAVIGATOR = { + marker: { + style: { + inactiveFill: '#000', + inactiveOpacity: 0.45, + fill: '#000', + opacity: 1, + size: 12, + }, + }, + text: { + style: { + fill: '#ccc', + fontSize: 12, + }, + }, +}; +// 默认 文本style +var textStyle = { + fill: Theme.textColor, + fontSize: 12, + textAlign: 'start', + textBaseline: 'middle', + fontFamily: Theme.fontFamily, + fontWeight: "normal", + lineHeight: 12, +}; +var Category = /** @class */ (function (_super) { + __extends$e(Category, _super); + function Category() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.currentPageIndex = 1; + _this.totalPagesCnt = 1; + _this.pageWidth = 0; + _this.pageHeight = 0; + _this.startX = 0; + _this.startY = 0; + _this.onNavigationBack = function () { + var itemGroup = _this.getElementByLocalId('item-group'); + if (_this.currentPageIndex > 1) { + _this.currentPageIndex -= 1; + _this.updateNavigation(); + var matrix = _this.getCurrentNavigationMatrix(); + if (_this.get('animate')) { + itemGroup.animate({ + matrix: matrix, + }, 100); + } + else { + itemGroup.attr({ matrix: matrix }); + } + } + }; + _this.onNavigationAfter = function () { + var itemGroup = _this.getElementByLocalId('item-group'); + if (_this.currentPageIndex < _this.totalPagesCnt) { + _this.currentPageIndex += 1; + _this.updateNavigation(); + var matrix = _this.getCurrentNavigationMatrix(); + if (_this.get('animate')) { + itemGroup.animate({ + matrix: matrix, + }, 100); + } + else { + itemGroup.attr({ matrix: matrix }); + } + } + }; + return _this; + } + Category.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { name: 'legend', type: 'category', itemSpacing: 24, itemMarginBottom: 8, maxItemWidth: null, itemWidth: null, itemHeight: null, itemName: {}, itemValue: null, maxWidth: null, maxHeight: null, marker: {}, items: [], itemStates: {}, itemBackground: {}, pageNavigator: {}, defaultCfg: { + title: { + spacing: 5, + style: { + fill: Theme.textColor, + fontSize: 12, + textAlign: 'start', + textBaseline: 'top', + }, + }, + background: { + padding: 5, + style: { + stroke: Theme.lineColor, + }, + }, + itemBackground: { + style: { + opacity: 0, + fill: '#fff', + }, + }, + pageNavigator: DEFAULT_PAGE_NAVIGATOR, + itemName: { + spacing: 16, + style: textStyle, + }, + marker: { + spacing: 8, + style: { + r: 6, + symbol: 'circle', + }, + }, + itemValue: { + alignRight: false, + formatter: null, + style: textStyle, + }, + itemStates: { + active: { + nameStyle: { + opacity: 0.8, + }, + }, + unchecked: { + nameStyle: { + fill: Theme.uncheckedColor, + }, + markerStyle: { + fill: Theme.uncheckedColor, + stroke: Theme.uncheckedColor, + }, + }, + inactive: { + nameStyle: { + fill: Theme.uncheckedColor, + }, + markerStyle: { + opacity: 0.2, + }, + }, + }, + } }); + }; + // 实现 IList 接口 + Category.prototype.isList = function () { + return true; + }; + /** + * 获取图例项 + * @return {ListItem[]} 列表项集合 + */ + Category.prototype.getItems = function () { + return this.get('items'); + }; + /** + * 设置列表项 + * @param {ListItem[]} items 列表项集合 + */ + Category.prototype.setItems = function (items) { + this.update({ + items: items, + }); + }; + /** + * 更新列表项 + * @param {ListItem} item 列表项 + * @param {object} cfg 列表项 + */ + Category.prototype.updateItem = function (item, cfg) { + mix(item, cfg); + this.clear(); // 由于单个图例项变化，会引起全局变化，所以全部更新 + this.render(); + }; + /** + * 清空列表 + */ + Category.prototype.clearItems = function () { + var itemGroup = this.getElementByLocalId('item-group'); + itemGroup && itemGroup.clear(); + }; + /** + * 设置列表项的状态 + * @param {ListItem} item 列表项 + * @param {string} state 状态名 + * @param {boolean} value 状态值, true, false + */ + Category.prototype.setItemState = function (item, state, value) { + item[state] = value; + var itemElement = this.getElementByLocalId("item-" + item.id); + if (itemElement) { + var items = this.getItems(); + var index = items.indexOf(item); + var offsetGroup = this.createOffScreenGroup(); // 离屏的 group + var newElement = this.drawItem(item, index, this.getItemHeight(), offsetGroup); + this.updateElements(newElement, itemElement); // 更新整个分组 + this.clearUpdateStatus(itemElement); // 清理更新状态，防止出现 bug + } + }; + /** + * 是否存在指定的状态 + * @param {ListItem} item 列表项 + * @param {boolean} state 状态名 + */ + Category.prototype.hasState = function (item, state) { + return !!item[state]; + }; + Category.prototype.getItemStates = function (item) { + var itemStates = this.get('itemStates'); + var rst = []; + each$2(itemStates, function (v, k) { + if (item[k]) { + // item.selected + rst.push(k); + } + }); + return rst; + }; + /** + * 清楚所有列表项的状态 + * @param {string} state 状态值 + */ + Category.prototype.clearItemsState = function (state) { + var _this = this; + var items = this.getItemsByState(state); + each$2(items, function (item) { + _this.setItemState(item, state, false); + }); + }; + /** + * 根据状态获取图例项 + * @param {string} state [description] + * @return {ListItem[]} [description] + */ + Category.prototype.getItemsByState = function (state) { + var _this = this; + var items = this.getItems(); + return filter$1(items, function (item) { + return _this.hasState(item, state); + }); + }; + // 绘制 legend 的选项 + Category.prototype.drawLegendContent = function (group) { + this.processItems(); + this.drawItems(group); + }; + // 防止未设置 id + Category.prototype.processItems = function () { + var items = this.get('items'); + each$2(items, function (item) { + if (!item.id) { + // 如果没有设置 id，默认使用 name + item.id = item.name; + } + }); + }; + // 绘制所有的图例选项 + Category.prototype.drawItems = function (group) { + var _this = this; + var itemContainerGroup = this.addGroup(group, { + id: this.getElementId('item-container-group'), + name: 'legend-item-container-group', + }); + var itemGroup = this.addGroup(itemContainerGroup, { + id: this.getElementId('item-group'), + name: 'legend-item-group', + }); + var itemHeight = this.getItemHeight(); + var itemWidth = this.get('itemWidth'); + var itemSpacing = this.get('itemSpacing'); + var itemMarginBottom = this.get('itemMarginBottom'); + var currentPoint = this.get('currentPoint'); + var startX = currentPoint.x; + var startY = currentPoint.y; + var layout = this.get('layout'); + var items = this.get('items'); + var wrapped = false; + var pageWidth = 0; + var maxWidth = this.get('maxWidth'); // 最大宽度，会导致 layout : 'horizontal' 时自动换行 + var maxHeight = this.get('maxHeight'); // 最大高度，会导致出现分页 + // 暂时不考虑分页 + each$2(items, function (item, index) { + var subGroup = _this.drawItem(item, index, itemHeight, itemGroup); + var bbox = subGroup.getBBox(); + var width = itemWidth || bbox.width; + if (width > pageWidth) { + pageWidth = width; + } + if (layout === 'horizontal') { + // 如果水平布局 + if (maxWidth && maxWidth < currentPoint.x + width - startX) { + // 检测是否换行 + wrapped = true; + currentPoint.x = startX; + currentPoint.y += itemHeight + itemMarginBottom; + } + _this.moveElementTo(subGroup, currentPoint); + currentPoint.x += width + itemSpacing; + } + else { + // 如果垂直布局 + if (maxHeight && maxHeight < currentPoint.y + itemHeight + itemMarginBottom - startY) { + // 换行 + wrapped = true; + currentPoint.x += pageWidth + itemSpacing; + currentPoint.y = startY; + pageWidth = 0; + } + _this.moveElementTo(subGroup, currentPoint); + currentPoint.y += itemHeight + itemMarginBottom; // itemSpacing 仅影响水平间距 + } + }); + if (wrapped && this.get('flipPage')) { + this.pageHeight = 0; + this.pageWidth = 0; + this.totalPagesCnt = 1; + this.startX = startX; + this.startY = startY; + this.adjustNavigation(group, itemGroup); + } + }; + // 获取图例项的高度，如果未定义，则按照 name 的高度计算 + Category.prototype.getItemHeight = function () { + var itemHeight = this.get('itemHeight'); + if (!itemHeight) { + var style_1 = (this.get('itemName') || {}).style; + if (isFunction$6(style_1)) { + var items_1 = this.getItems(); + items_1.forEach(function (item, index) { + var fontSize = __assign$r(__assign$r({}, textStyle), style_1(item, index, items_1)).fontSize; + if (itemHeight < fontSize) { + itemHeight = fontSize; + } + }); + } + else if (style_1) { + itemHeight = style_1.fontSize; + } + } + return itemHeight; + }; + // 绘制 marker + Category.prototype.drawMarker = function (container, markerCfg, item, itemHeight) { + var markerAttrs = __assign$r(__assign$r(__assign$r({ x: 0, y: itemHeight / 2 }, markerCfg.style), { symbol: get$3(item.marker, 'symbol', 'circle') }), get$3(item.marker, 'style', {})); + var shape = this.addShape(container, { + type: 'marker', + id: this.getElementId("item-" + item.id + "-marker"), + name: 'legend-item-marker', + attrs: markerAttrs, + }); + var bbox = shape.getBBox(); + shape.attr('x', bbox.width / 2); // marker 需要左对齐，所以不能占用左侧的空间 + var _a = shape.attr(), stroke = _a.stroke, fill = _a.fill; + if (stroke) { + shape.set('isStroke', true); + } + if (fill) { + shape.set('isFill', true); + } + return shape; + }; + // 绘制文本 + Category.prototype.drawItemText = function (container, textName, cfg, item, itemHeight, xPosition, index) { + var formatter = cfg.formatter; + var style = cfg.style; + var attrs = __assign$r(__assign$r({ x: xPosition, y: itemHeight / 2, text: formatter ? formatter(item[textName], item, index) : item[textName] }, textStyle), (isFunction$6(style) ? style(item, index, this.getItems()) : style)); + return this.addShape(container, { + type: 'text', + id: this.getElementId("item-" + item.id + "-" + textName), + name: "legend-item-" + textName, + attrs: attrs, + }); + }; + // 绘制图例项 + Category.prototype.drawItem = function (item, index, itemHeight, itemGroup) { + var groupId = "item-" + item.id; + // 设置单独的 Group 用于 setClip + var subContainer = this.addGroup(itemGroup, { + name: 'legend-item-container', + id: this.getElementId("item-container-" + groupId), + delegateObject: { + item: item, + index: index, + }, + }); + var subGroup = this.addGroup(subContainer, { + name: 'legend-item', + id: this.getElementId(groupId), + delegateObject: { + item: item, + index: index, + }, + }); + var marker = this.get('marker'); + var itemName = this.get('itemName'); + var itemValue = this.get('itemValue'); + var itemBackground = this.get('itemBackground'); + var itemWidth = this.getLimitItemWidth(); + var curX = 0; // 记录当前 x 的位置 + if (marker) { + var markerShape = this.drawMarker(subGroup, marker, item, itemHeight); + var spacing = marker.spacing; + var itemMarkerSpacing = get$3(item, ['marker', 'spacing']); + if (isNumber$4(itemMarkerSpacing)) { + // 如果 item 有配置 marker.spacing，采用 item 的配置 + spacing = itemMarkerSpacing; + } + curX = markerShape.getBBox().maxX + spacing; + } + if (itemName) { + var nameShape = this.drawItemText(subGroup, 'name', itemName, item, itemHeight, curX, index); + if (itemWidth) { + // 设置了 item 的最大宽度限制，并且超出了，进行省略处理 + ellipsisLabel(true, nameShape, clamp$1(itemWidth - curX, 0, itemWidth)); + } + curX = nameShape.getBBox().maxX + itemName.spacing; + } + if (itemValue) { + var valueShape = this.drawItemText(subGroup, 'value', itemValue, item, itemHeight, curX, index); + if (itemWidth) { + if (itemValue.alignRight) { + valueShape.attr({ + textAlign: 'right', + x: itemWidth, + }); + ellipsisLabel(true, valueShape, clamp$1(itemWidth - curX, 0, itemWidth), 'head'); + } + else { + ellipsisLabel(true, valueShape, clamp$1(itemWidth - curX, 0, itemWidth)); + } + } + } + // 添加透明的背景，便于拾取和包围盒计算 + if (itemBackground) { + var bbox = subGroup.getBBox(); + var backShape = this.addShape(subGroup, { + type: 'rect', + name: 'legend-item-background', + id: this.getElementId(groupId + "-background"), + attrs: __assign$r({ x: 0, y: 0, width: bbox.width, height: itemHeight }, itemBackground.style), + }); + backShape.toBack(); + } + this.applyItemStates(item, subGroup); + return subGroup; + }; + // 加上分页器并重新排序 items + Category.prototype.adjustNavigation = function (container, itemGroup) { + var _this = this; + var startX = this.startX; + var startY = this.startY; + var layout = this.get('layout'); + var subGroups = itemGroup.findAll(function (item) { return item.get('name') === 'legend-item'; }); + var maxWidth = this.get('maxWidth'); + var maxHeight = this.get('maxHeight'); + var itemWidth = this.get('itemWidth'); + var itemSpacing = this.get('itemSpacing'); + var itemHeight = this.getItemHeight(); + var pageNavigator = deepMix({}, DEFAULT_PAGE_NAVIGATOR, this.get('pageNavigator')); + var navigation = this.drawNavigation(container, layout, '00/00', pageNavigator); + var navigationBBox = navigation.getBBox(); + var currentPoint = { x: startX, y: startY }; + var pages = 1; + var widthLimit = 0; + var pageWidth = 0; + var maxItemWidth = 0; + var itemMarginBottom = this.get('itemMarginBottom'); + if (layout === 'horizontal') { + var maxRow = this.get('maxRow') || 1; + var maxRowHeight_1 = itemHeight + (maxRow === 1 ? 0 : itemMarginBottom); + this.pageHeight = maxRowHeight_1 * maxRow; + each$2(subGroups, function (item) { + var bbox = item.getBBox(); + var width = itemWidth || bbox.width; + if ((widthLimit && widthLimit < currentPoint.x + width + itemSpacing) || + maxWidth < currentPoint.x + width + itemSpacing + navigationBBox.width) { + if (pages === 1) { + widthLimit = currentPoint.x + itemSpacing; + _this.pageWidth = widthLimit; + _this.moveElementTo(navigation, { + x: maxWidth - itemSpacing - navigationBBox.width - navigationBBox.minX, + y: currentPoint.y + itemHeight / 2 - navigationBBox.height / 2 - navigationBBox.minY, + }); + } + pages += 1; + currentPoint.x = startX; + currentPoint.y += maxRowHeight_1; + } + _this.moveElementTo(item, currentPoint); + item.getParent().setClip({ + type: 'rect', + attrs: { + x: currentPoint.x, + y: currentPoint.y, + width: width + itemSpacing, + height: itemHeight, + }, + }); + currentPoint.x += width + itemSpacing; + }); + } + else { + each$2(subGroups, function (item) { + var bbox = item.getBBox(); + if (bbox.width > pageWidth) { + pageWidth = bbox.width; + } + }); + maxItemWidth = pageWidth; + pageWidth += itemSpacing; + if (maxWidth) { + // maxWidth 限制加上 + pageWidth = Math.min(maxWidth, pageWidth); + maxItemWidth = Math.min(maxWidth, maxItemWidth); + } + this.pageWidth = pageWidth; + this.pageHeight = maxHeight - Math.max(navigationBBox.height, itemHeight + itemMarginBottom); + var cntPerPage_1 = Math.floor(this.pageHeight / (itemHeight + itemMarginBottom)); + each$2(subGroups, function (item, index) { + if (index !== 0 && index % cntPerPage_1 === 0) { + pages += 1; + currentPoint.x += pageWidth; + currentPoint.y = startY; + } + _this.moveElementTo(item, currentPoint); + item.getParent().setClip({ + type: 'rect', + attrs: { + x: currentPoint.x, + y: currentPoint.y, + width: pageWidth, + height: itemHeight, + }, + }); + currentPoint.y += itemHeight + itemMarginBottom; + }); + this.totalPagesCnt = pages; + this.moveElementTo(navigation, { + x: startX + maxItemWidth / 2 - navigationBBox.width / 2 - navigationBBox.minX, + y: maxHeight - navigationBBox.height - navigationBBox.minY, + }); + } + if (this.pageHeight && this.pageWidth) { + // 为了使固定的 clip 生效，clip 设置在 itemContainerGroup 上，itemGroup 需要在翻页时会设置 matrix + itemGroup.getParent().setClip({ + type: 'rect', + attrs: { + x: this.startX, + y: this.startY, + width: this.pageWidth, + height: this.pageHeight, + }, + }); + } + // 重新计算 totalPagesCnt + if (layout === 'horizontal' && this.get('maxRow')) { + this.totalPagesCnt = Math.ceil(pages / this.get('maxRow')); + } + else { + this.totalPagesCnt = pages; + } + if (this.currentPageIndex > this.totalPagesCnt) { + this.currentPageIndex = 1; + } + this.updateNavigation(navigation); + // update initial matrix + itemGroup.attr('matrix', this.getCurrentNavigationMatrix()); + }; + /** + * 绘制分页器 + */ + Category.prototype.drawNavigation = function (group, layout, text, styleCfg) { + var currentPoint = { x: 0, y: 0 }; + var subGroup = this.addGroup(group, { + id: this.getElementId('navigation-group'), + name: 'legend-navigation', + }); + var _a = get$3(styleCfg.marker, 'style', {}), _b = _a.size, size = _b === void 0 ? 12 : _b, arrowStyle = __rest$G(_a, ["size"]); + var leftArrow = this.drawArrow(subGroup, currentPoint, 'navigation-arrow-left', layout === 'horizontal' ? 'up' : 'left', size, arrowStyle); + leftArrow.on('click', this.onNavigationBack); + var leftArrowBBox = leftArrow.getBBox(); + currentPoint.x += leftArrowBBox.width + 2; + var textShape = this.addShape(subGroup, { + type: 'text', + id: this.getElementId('navigation-text'), + name: 'navigation-text', + attrs: __assign$r({ x: currentPoint.x, y: currentPoint.y + size / 2, text: text, textBaseline: 'middle' }, get$3(styleCfg.text, 'style')), + }); + var textBBox = textShape.getBBox(); + currentPoint.x += textBBox.width + 2; + var rightArrow = this.drawArrow(subGroup, currentPoint, 'navigation-arrow-right', layout === 'horizontal' ? 'down' : 'right', size, arrowStyle); + rightArrow.on('click', this.onNavigationAfter); + return subGroup; + }; + Category.prototype.updateNavigation = function (navigation) { + var pageNavigator = deepMix({}, DEFAULT_PAGE_NAVIGATOR, this.get('pageNavigator')); + var _a = pageNavigator.marker.style, fill = _a.fill, opacity = _a.opacity, inactiveFill = _a.inactiveFill, inactiveOpacity = _a.inactiveOpacity; + var text = this.currentPageIndex + "/" + this.totalPagesCnt; + var textShape = navigation ? navigation.getChildren()[1] : this.getElementByLocalId('navigation-text'); + var leftArrow = navigation + ? navigation.findById(this.getElementId('navigation-arrow-left')) + : this.getElementByLocalId('navigation-arrow-left'); + var rightArrow = navigation + ? navigation.findById(this.getElementId('navigation-arrow-right')) + : this.getElementByLocalId('navigation-arrow-right'); + var origBBox = textShape.getBBox(); + textShape.attr('text', text); + var newBBox = textShape.getBBox(); + textShape.attr('x', textShape.attr('x') - (newBBox.width - origBBox.width) / 2); + // 更新 left-arrow marker + leftArrow.attr('opacity', this.currentPageIndex === 1 ? inactiveOpacity : opacity); + leftArrow.attr('fill', this.currentPageIndex === 1 ? inactiveFill : fill); + leftArrow.attr('cursor', this.currentPageIndex === 1 ? 'not-allowed' : 'pointer'); + // 更新 right-arrow marker + rightArrow.attr('opacity', this.currentPageIndex === this.totalPagesCnt ? inactiveOpacity : opacity); + rightArrow.attr('fill', this.currentPageIndex === this.totalPagesCnt ? inactiveFill : fill); + rightArrow.attr('cursor', this.currentPageIndex === this.totalPagesCnt ? 'not-allowed' : 'pointer'); + }; + Category.prototype.drawArrow = function (group, currentPoint, name, direction, size, style) { + var x = currentPoint.x, y = currentPoint.y; + var rotateMap = { + right: (90 * Math.PI) / 180, + left: ((360 - 90) * Math.PI) / 180, + up: 0, + down: (180 * Math.PI) / 180, + }; + var shape = this.addShape(group, { + type: 'path', + id: this.getElementId(name), + name: name, + attrs: __assign$r({ path: [['M', x + size / 2, y], ['L', x, y + size], ['L', x + size, y + size], ['Z']], cursor: 'pointer' }, style), + }); + shape.attr('matrix', getMatrixByAngle({ x: x + size / 2, y: y + size / 2 }, rotateMap[direction])); + return shape; + }; + Category.prototype.getCurrentNavigationMatrix = function () { + var _a = this, currentPageIndex = _a.currentPageIndex, pageWidth = _a.pageWidth, pageHeight = _a.pageHeight; + var layout = this.get('layout'); + var translate = layout === 'horizontal' + ? { + x: 0, + y: pageHeight * (1 - currentPageIndex), + } + : { + x: pageWidth * (1 - currentPageIndex), + y: 0, + }; + return getMatrixByTranslate(translate); + }; + // 附加状态对应的样式 + Category.prototype.applyItemStates = function (item, subGroup) { + var states = this.getItemStates(item); + var hasStates = states.length > 0; + if (hasStates) { + var children = subGroup.getChildren(); + var itemStates_1 = this.get('itemStates'); + each$2(children, function (element) { + var name = element.get('name'); + var elName = name.split('-')[2]; // marker, name, value + var statesStyle = getStatesStyle(item, elName, itemStates_1); + if (statesStyle) { + element.attr(statesStyle); + if (elName === 'marker' && !(element.get('isStroke') && element.get('isFill'))) { + // 如果 marker 是单填充或者单描边的话，就不要额外添加 stroke 或这 fill 属性，否则会影响 unchecked 后的显示 + if (element.get('isStroke')) { + element.attr('fill', null); + } + if (element.get('isFill')) { + element.attr('stroke', null); + } + } + } + }); + } + }; + // 获取 itemWidth 的最终设置 + Category.prototype.getLimitItemWidth = function () { + var itemWidth = this.get('itemWidth'); + var maxItemWidth = this.get('maxItemWidth'); + if (maxItemWidth) { + // 设置了最大宽度 + if (itemWidth) { + maxItemWidth = itemWidth <= maxItemWidth ? itemWidth : maxItemWidth; + } + } + else if (itemWidth) { + maxItemWidth = itemWidth; + } + return maxItemWidth; + }; + return Category; +}(LegendBase)); + +var HANDLER_HEIGHT_RATIO = 1.4; +var HANDLER_TRIANGLE_RATIO = 0.4; +var ContinueLegend = /** @class */ (function (_super) { + __extends$e(ContinueLegend, _super); + function ContinueLegend() { + return _super !== null && _super.apply(this, arguments) || this; + } + ContinueLegend.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { type: 'continue', min: 0, max: 100, value: null, colors: [], track: {}, rail: {}, label: {}, handler: {}, slidable: true, tip: null, step: null, maxWidth: null, maxHeight: null, defaultCfg: { + label: { + align: 'rail', + spacing: 5, + formatter: null, + style: { + fontSize: 12, + fill: Theme.textColor, + textBaseline: 'middle', + fontFamily: Theme.fontFamily, + }, + }, + handler: { + size: 10, + style: { + fill: '#fff', + stroke: '#333', + }, + }, + track: {}, + rail: { + type: 'color', + size: 20, + defaultLength: 100, + style: { + fill: '#DCDEE2', + }, + }, + title: { + spacing: 5, + style: { + fill: Theme.textColor, + fontSize: 12, + textAlign: 'start', + textBaseline: 'top', + }, + }, + } }); + }; + ContinueLegend.prototype.isSlider = function () { + return true; + }; + // 实现 IList 接口 + ContinueLegend.prototype.getValue = function () { + return this.getCurrentValue(); + }; + ContinueLegend.prototype.getRange = function () { + return { + min: this.get('min'), + max: this.get('max'), + }; + }; + // 改变 range + ContinueLegend.prototype.setRange = function (min, max) { + this.update({ + min: min, + max: max, + }); + }; + ContinueLegend.prototype.setValue = function (value) { + var originValue = this.getValue(); + this.set('value', value); + var group = this.get('group'); + this.resetTrackClip(); + if (this.get('slidable')) { + this.resetHandlers(group); + } + this.delegateEmit('valuechanged', { + originValue: originValue, + value: value, + }); + }; + ContinueLegend.prototype.initEvent = function () { + var group = this.get('group'); + this.bindSliderEvent(group); + this.bindRailEvent(group); + this.bindTrackEvent(group); + }; + ContinueLegend.prototype.drawLegendContent = function (group) { + this.drawRail(group); + this.drawLabels(group); + this.fixedElements(group); // 调整各个图形位置，适应宽高的限制 + this.resetTrack(group); + this.resetTrackClip(group); + if (this.get('slidable')) { + this.resetHandlers(group); + } + }; + ContinueLegend.prototype.bindSliderEvent = function (group) { + this.bindHandlersEvent(group); + }; + ContinueLegend.prototype.bindHandlersEvent = function (group) { + var _this = this; + group.on('legend-handler-min:drag', function (ev) { + var minValue = _this.getValueByCanvasPoint(ev.x, ev.y); + var currentValue = _this.getCurrentValue(); + var maxValue = currentValue[1]; + if (maxValue < minValue) { + // 如果小于最小值，则调整最小值 + maxValue = minValue; + } + _this.setValue([minValue, maxValue]); + }); + group.on('legend-handler-max:drag', function (ev) { + var maxValue = _this.getValueByCanvasPoint(ev.x, ev.y); + var currentValue = _this.getCurrentValue(); + var minValue = currentValue[0]; + if (minValue > maxValue) { + // 如果小于最小值，则调整最小值 + minValue = maxValue; + } + _this.setValue([minValue, maxValue]); + }); + }; + ContinueLegend.prototype.bindRailEvent = function (group) { }; + ContinueLegend.prototype.bindTrackEvent = function (group) { + var _this = this; + var prePoint = null; + group.on('legend-track:dragstart', function (ev) { + prePoint = { + x: ev.x, + y: ev.y, + }; + }); + group.on('legend-track:drag', function (ev) { + if (!prePoint) { + return; + } + var preValue = _this.getValueByCanvasPoint(prePoint.x, prePoint.y); + var curValue = _this.getValueByCanvasPoint(ev.x, ev.y); + var currentValue = _this.getCurrentValue(); + var curDiff = currentValue[1] - currentValue[0]; + var range = _this.getRange(); + var dValue = curValue - preValue; + if (dValue < 0) { + // 减小, 同时未出边界 + if (currentValue[0] + dValue > range.min) { + _this.setValue([currentValue[0] + dValue, currentValue[1] + dValue]); + } + else { + _this.setValue([range.min, range.min + curDiff]); + } + // && || + } + else if (dValue > 0) { + if (dValue > 0 && currentValue[1] + dValue < range.max) { + _this.setValue([currentValue[0] + dValue, currentValue[1] + dValue]); + } + else { + _this.setValue([range.max - curDiff, range.max]); + } + } + prePoint = { + x: ev.x, + y: ev.y, + }; + }); + group.on('legend-track:dragend', function (ev) { + prePoint = null; + }); + }; + ContinueLegend.prototype.drawLabels = function (group) { + this.drawLabel('min', group); + this.drawLabel('max', group); + }; + ContinueLegend.prototype.drawLabel = function (name, group) { + var labelCfg = this.get('label'); + var style = labelCfg.style; + var labelAlign = labelCfg.align; + var labelFormatter = labelCfg.formatter; + var value = this.get(name); + var alignAttrs = this.getLabelAlignAttrs(name, labelAlign); + var localId = "label-" + name; + this.addShape(group, { + type: 'text', + id: this.getElementId(localId), + name: "legend-label-" + name, + attrs: __assign$r(__assign$r({ x: 0, y: 0, text: isFunction$6(labelFormatter) ? labelFormatter(value) : value }, style), alignAttrs), + }); + }; + // 获取文本的对齐方式，为了自适应真实操碎了心 + ContinueLegend.prototype.getLabelAlignAttrs = function (name, align) { + var isVertical = this.isVertical(); + var textAlign = 'center'; + var textBaseline = 'middle'; + if (isVertical) { + // 垂直布局的所有的文本都左对齐 + textAlign = 'start'; + if (align !== 'rail') { + if (name === 'min') { + textBaseline = 'top'; + } + else { + textBaseline = 'bottom'; + } + } + else { + textBaseline = 'top'; + } + } + else { + if (align !== 'rail') { + textBaseline = 'top'; + if (name === 'min') { + textAlign = 'start'; + } + else { + textAlign = 'end'; + } + } + else { + textAlign = 'start'; + textBaseline = 'middle'; + } + } + return { + textAlign: textAlign, + textBaseline: textBaseline, + }; + }; + ContinueLegend.prototype.getRailPath = function (x, y, w, h) { + var railCfg = this.get('rail'); + var size = railCfg.size, defaultLength = railCfg.defaultLength, type = railCfg.type; + var isVertical = this.isVertical(); + var length = defaultLength; + var width = w; + var height = h; + if (!width) { + width = isVertical ? size : length; + } + if (!height) { + height = isVertical ? length : size; + } + var path = []; + if (type === 'color') { + path.push(['M', x, y]); + path.push(['L', x + width, y]); + path.push(['L', x + width, y + height]); + path.push(['L', x, y + height]); + path.push(['Z']); + } + else { + path.push(['M', x + width, y]); + path.push(['L', x + width, y + height]); + path.push(['L', x, y + height]); + path.push(['Z']); + } + return path; + }; + ContinueLegend.prototype.drawRail = function (group) { + var railCfg = this.get('rail'); + var style = railCfg.style; + this.addShape(group, { + type: 'path', + id: this.getElementId('rail'), + name: 'legend-rail', + attrs: __assign$r({ path: this.getRailPath(0, 0) }, style), + }); + }; + // 将传入的颜色转换成渐变色 + ContinueLegend.prototype.getTrackColor = function (colors) { + var count = colors.length; + if (!count) { + return null; + } + if (count === 1) { + return colors[0]; + } + var color; // 最终形态 l(0) 0:colors[0] 0.5:colors[1] 1:colors[2]; + if (this.isVertical()) { + // 根据方向设置渐变方向 + color = 'l(90)'; + } + else { + color = 'l(0)'; + } + for (var i = 0; i < count; i++) { + var percent = i / (count - 1); + color += " " + percent + ":" + colors[i]; + } + return color; + }; + ContinueLegend.prototype.getTrackPath = function (group) { + var railShape = this.getRailShape(group); + var path = railShape.attr('path'); + return clone$7(path); + }; + ContinueLegend.prototype.getClipTrackAttrs = function (group) { + var value = this.getCurrentValue(); + var min = value[0], max = value[1]; + var railBBox = this.getRailBBox(group); + var startPoint = this.getPointByValue(min, group); + var endPoint = this.getPointByValue(max, group); + var isVertical = this.isVertical(); + var x; + var y; + var width; + var height; + if (isVertical) { + x = railBBox.minX; + y = startPoint.y; + width = railBBox.width; + height = endPoint.y - startPoint.y; + } + else { + x = startPoint.x; + y = railBBox.minY; + width = endPoint.x - startPoint.x; + height = railBBox.height; + } + return { + x: x, + y: y, + width: width, + height: height, + }; + }; + // 获取 track 的属性，由 path 和 颜色构成 + ContinueLegend.prototype.getTrackAttrs = function (group) { + var trackCfg = this.get('track'); + var colors = this.get('colors'); + var path = this.getTrackPath(group); + return mix({ + path: path, + fill: this.getTrackColor(colors), + }, trackCfg.style); + }; + ContinueLegend.prototype.resetTrackClip = function (group) { + var container = group || this.get('group'); + var trackId = this.getElementId('track'); + var trackShape = container.findById(trackId); + var clipShape = trackShape.getClip(); + var attrs = this.getClipTrackAttrs(group); + if (!clipShape) { + trackShape.setClip({ + type: 'rect', + attrs: attrs, + }); + } + else { + clipShape.attr(attrs); + } + }; + ContinueLegend.prototype.resetTrack = function (group) { + var trackId = this.getElementId('track'); + var trackShape = group.findById(trackId); + var trackAttrs = this.getTrackAttrs(group); + if (trackShape) { + trackShape.attr(trackAttrs); + } + else { + this.addShape(group, { + type: 'path', + id: trackId, + draggable: this.get('slidable'), + name: 'legend-track', + attrs: trackAttrs, + }); + } + }; + ContinueLegend.prototype.getPointByValue = function (value, group) { + var _a = this.getRange(), min = _a.min, max = _a.max; + var percent = (value - min) / (max - min); + var bbox = this.getRailBBox(group); + var isVertcal = this.isVertical(); + var point = { x: 0, y: 0 }; + if (isVertcal) { + point.x = bbox.minX + bbox.width / 2; + point.y = getValueByPercent(bbox.minY, bbox.maxY, percent); + } + else { + point.x = getValueByPercent(bbox.minX, bbox.maxX, percent); + point.y = bbox.minY + bbox.height / 2; + } + return point; + }; + ContinueLegend.prototype.getRailShape = function (group) { + var container = group || this.get('group'); + return container.findById(this.getElementId('rail')); + }; + // 获取滑轨的宽高信息 + ContinueLegend.prototype.getRailBBox = function (group) { + var railShape = this.getRailShape(group); + var bbox = railShape.getBBox(); + return bbox; + }; + ContinueLegend.prototype.getRailCanvasBBox = function () { + var container = this.get('group'); + var railShape = container.findById(this.getElementId('rail')); + var bbox = railShape.getCanvasBBox(); + return bbox; + }; + // 是否垂直 + ContinueLegend.prototype.isVertical = function () { + return this.get('layout') === 'vertical'; + }; + // 用于交互时 + ContinueLegend.prototype.getValueByCanvasPoint = function (x, y) { + var _a = this.getRange(), min = _a.min, max = _a.max; + var bbox = this.getRailCanvasBBox(); // 因为 x, y 是画布坐标 + var isVertcal = this.isVertical(); + var step = this.get('step'); + var percent; + if (isVertcal) { + // 垂直时计算 y + percent = (y - bbox.minY) / bbox.height; + } + else { + // 水平时计算 x + percent = (x - bbox.minX) / bbox.width; + } + var value = getValueByPercent(min, max, percent); + if (step) { + var count = Math.round((value - min) / step); + value = min + count * step; // 移动到最近的 + } + if (value > max) { + value = max; + } + if (value < min) { + value = min; + } + return value; + }; + // 当前选中的范围 + ContinueLegend.prototype.getCurrentValue = function () { + var value = this.get('value'); + if (!value) { + var values = this.get('values'); + if (!values) { + return [this.get('min'), this.get('max')]; + } + // 如果没有定义，取最大范围 最小值 为 values 中的最小值， 如果最小值 超过了 定义的最大值 则 做限制 最大值 反之 + return [Math.max(Math.min.apply(Math, __spreadArrays$1(values, [this.get('max')])), this.get('min')), Math.min(Math.max.apply(Math, __spreadArrays$1(values, [this.get('min')])), this.get('max'))]; + } + return value; + }; + // 重置滑块 handler + ContinueLegend.prototype.resetHandlers = function (group) { + var currentValue = this.getCurrentValue(); + var min = currentValue[0], max = currentValue[1]; + this.resetHandler(group, 'min', min); + this.resetHandler(group, 'max', max); + }; + // 获取滑块的 path + ContinueLegend.prototype.getHandlerPath = function (handlerCfg, point) { + var isVertical = this.isVertical(); + var path = []; + var width = handlerCfg.size; + var x = point.x, y = point.y; + var height = width * HANDLER_HEIGHT_RATIO; + var halfWidth = width / 2; + var oneSixthWidth = width / 6; + if (isVertical) { + /** + * 竖直情况下的滑块 handler，左侧顶点是 x,y + * /----| + * -- | + * -- | + * \----| + */ + var triangleX = x + height * HANDLER_TRIANGLE_RATIO; + path.push(['M', x, y]); + path.push(['L', triangleX, y + halfWidth]); + path.push(['L', x + height, y + halfWidth]); + path.push(['L', x + height, y - halfWidth]); + path.push(['L', triangleX, y - halfWidth]); + path.push(['Z']); + // 绘制两条横线 + path.push(['M', triangleX, y + oneSixthWidth]); + path.push(['L', x + height - 2, y + oneSixthWidth]); + path.push(['M', triangleX, y - oneSixthWidth]); + path.push(['L', x + height - 2, y - oneSixthWidth]); + } + else { + /** + * 水平情况下的滑块，上面顶点处是 x,y + * / \ + * | | | | + * | | | | + * ----- + */ + var triangleY = y + height * HANDLER_TRIANGLE_RATIO; + path.push(['M', x, y]); + path.push(['L', x - halfWidth, triangleY]); + path.push(['L', x - halfWidth, y + height]); + path.push(['L', x + halfWidth, y + height]); + path.push(['L', x + halfWidth, triangleY]); + path.push(['Z']); + // 绘制两条竖线 + path.push(['M', x - oneSixthWidth, triangleY]); + path.push(['L', x - oneSixthWidth, y + height - 2]); + path.push(['M', x + oneSixthWidth, triangleY]); + path.push(['L', x + oneSixthWidth, y + height - 2]); + } + return path; + }; + // 调整 handler 的位置，如果未存在则绘制 + ContinueLegend.prototype.resetHandler = function (group, name, value) { + var point = this.getPointByValue(value, group); + var handlerCfg = this.get('handler'); + var path = this.getHandlerPath(handlerCfg, point); + var id = this.getElementId("handler-" + name); + var handlerShape = group.findById(id); + var isVertical = this.isVertical(); + if (handlerShape) { + handlerShape.attr('path', path); + } + else { + this.addShape(group, { + type: 'path', + name: "legend-handler-" + name, + draggable: true, + id: id, + attrs: __assign$r(__assign$r({ path: path }, handlerCfg.style), { cursor: isVertical ? 'ns-resize' : 'ew-resize' }), + }); + } + }; + // 当设置了 maxWidth, maxHeight 时调整 rail 的宽度， + // 文本的位置 + ContinueLegend.prototype.fixedElements = function (group) { + var railShape = group.findById(this.getElementId('rail')); + var minLabel = group.findById(this.getElementId('label-min')); + var maxLabel = group.findById(this.getElementId('label-max')); + var startPoint = this.getDrawPoint(); + if (this.isVertical()) { + // 横向布局 + this.fixedVertail(minLabel, maxLabel, railShape, startPoint); + } + else { + // 水平布局 + this.fixedHorizontal(minLabel, maxLabel, railShape, startPoint); + } + }; + ContinueLegend.prototype.fitRailLength = function (minLabelBBox, maxLabelBBox, railBBox, railShape) { + var isVertical = this.isVertical(); + var lengthField = isVertical ? 'height' : 'width'; + var labelCfg = this.get('label'); + var labelAlign = labelCfg.align; + var spacing = labelCfg.spacing; + var maxLength = this.get("max" + upperFirst(lengthField)); // get('maxWidth') + if (maxLength) { + var elementsLength = labelAlign === 'rail' + ? railBBox[lengthField] + minLabelBBox[lengthField] + maxLabelBBox[lengthField] + spacing * 2 + : railBBox[lengthField]; + var diff = elementsLength - maxLength; + if (diff > 0) { + // 大于限制的长度 + this.changeRailLength(railShape, lengthField, railBBox[lengthField] - diff); + } + } + }; + ContinueLegend.prototype.changeRailLength = function (railShape, lengthField, length) { + var bbox = railShape.getBBox(); + var path; + if (lengthField === 'height') { + path = this.getRailPath(bbox.x, bbox.y, bbox.width, length); + } + else { + path = this.getRailPath(bbox.x, bbox.y, length, bbox.height); + } + railShape.attr('path', path); + }; + ContinueLegend.prototype.changeRailPosition = function (railShape, x, y) { + var bbox = railShape.getBBox(); + var path = this.getRailPath(x, y, bbox.width, bbox.height); + railShape.attr('path', path); + }; + ContinueLegend.prototype.fixedHorizontal = function (minLabel, maxLabel, railShape, startPoint) { + var labelCfg = this.get('label'); + var labelAlign = labelCfg.align; + var spacing = labelCfg.spacing; + var railBBox = railShape.getBBox(); + var minLabelBBox = minLabel.getBBox(); + var maxLabelBBox = maxLabel.getBBox(); + var railHeight = railBBox.height; // 取 rail 的高度，作为高度 + this.fitRailLength(minLabelBBox, maxLabelBBox, railBBox, railShape); + railBBox = railShape.getBBox(); + if (labelAlign === 'rail') { + // 沿着 rail 方向 + minLabel.attr({ + x: startPoint.x, + y: startPoint.y + railHeight / 2, + }); + this.changeRailPosition(railShape, startPoint.x + minLabelBBox.width + spacing, startPoint.y); + maxLabel.attr({ + x: startPoint.x + minLabelBBox.width + railBBox.width + spacing * 2, + y: startPoint.y + railHeight / 2, + }); + } + else if (labelAlign === 'top') { + minLabel.attr({ + x: startPoint.x, + y: startPoint.y, + }); + maxLabel.attr({ + x: startPoint.x + railBBox.width, + y: startPoint.y, + }); + this.changeRailPosition(railShape, startPoint.x, startPoint.y + minLabelBBox.height + spacing); + } + else { + this.changeRailPosition(railShape, startPoint.x, startPoint.y); + minLabel.attr({ + x: startPoint.x, + y: startPoint.y + railBBox.height + spacing, + }); + maxLabel.attr({ + x: startPoint.x + railBBox.width, + y: startPoint.y + railBBox.height + spacing, + }); + } + }; + ContinueLegend.prototype.fixedVertail = function (minLabel, maxLabel, railShape, startPoint) { + var labelCfg = this.get('label'); + var labelAlign = labelCfg.align; + var spacing = labelCfg.spacing; + var railBBox = railShape.getBBox(); + var minLabelBBox = minLabel.getBBox(); + var maxLabelBBox = maxLabel.getBBox(); + this.fitRailLength(minLabelBBox, maxLabelBBox, railBBox, railShape); + railBBox = railShape.getBBox(); + if (labelAlign === 'rail') { + // 沿着 rail 方向 + minLabel.attr({ + x: startPoint.x, + y: startPoint.y, + }); + this.changeRailPosition(railShape, startPoint.x, startPoint.y + minLabelBBox.height + spacing); + maxLabel.attr({ + x: startPoint.x, + y: startPoint.y + minLabelBBox.height + railBBox.height + spacing * 2, + }); + } + else if (labelAlign === 'right') { + minLabel.attr({ + x: startPoint.x + railBBox.width + spacing, + y: startPoint.y, + }); + this.changeRailPosition(railShape, startPoint.x, startPoint.y); + maxLabel.attr({ + x: startPoint.x + railBBox.width + spacing, + y: startPoint.y + railBBox.height, + }); + } + else { + // left + var maxLabelWidth = Math.max(minLabelBBox.width, maxLabelBBox.width); + minLabel.attr({ + x: startPoint.x, + y: startPoint.y, + }); + this.changeRailPosition(railShape, startPoint.x + maxLabelWidth + spacing, startPoint.y); + maxLabel.attr({ + x: startPoint.x, + y: startPoint.y + railBBox.height, + }); + } + }; + return ContinueLegend; +}(LegendBase)); + +var CONTAINER_CLASS = 'g2-tooltip'; +var TITLE_CLASS = 'g2-tooltip-title'; +var LIST_CLASS = 'g2-tooltip-list'; +var LIST_ITEM_CLASS = 'g2-tooltip-list-item'; +var MARKER_CLASS = 'g2-tooltip-marker'; +var VALUE_CLASS = 'g2-tooltip-value'; +var NAME_CLASS = 'g2-tooltip-name'; +var CROSSHAIR_X = 'g2-tooltip-crosshair-x'; +var CROSSHAIR_Y = 'g2-tooltip-crosshair-y'; + +var CssConst = /*#__PURE__*/Object.freeze({ + __proto__: null, + CONTAINER_CLASS: CONTAINER_CLASS, + TITLE_CLASS: TITLE_CLASS, + LIST_CLASS: LIST_CLASS, + LIST_ITEM_CLASS: LIST_ITEM_CLASS, + MARKER_CLASS: MARKER_CLASS, + VALUE_CLASS: VALUE_CLASS, + NAME_CLASS: NAME_CLASS, + CROSSHAIR_X: CROSSHAIR_X, + CROSSHAIR_Y: CROSSHAIR_Y +}); + +var _a$3; +var TooltipTheme = (_a$3 = {}, + // css style for tooltip + _a$3["" + CONTAINER_CLASS] = { + position: 'absolute', + visibility: 'visible', + // @2018-07-25 by blue.lb 这里去掉浮动，火狐上存在样式错位 + // whiteSpace: 'nowrap', + zIndex: 8, + transition: 'visibility 0.2s cubic-bezier(0.23, 1, 0.32, 1), ' + + 'left 0.4s cubic-bezier(0.23, 1, 0.32, 1), ' + + 'top 0.4s cubic-bezier(0.23, 1, 0.32, 1)', + backgroundColor: 'rgba(255, 255, 255, 0.9)', + boxShadow: '0px 0px 10px #aeaeae', + borderRadius: '3px', + color: 'rgb(87, 87, 87)', + fontSize: '12px', + fontFamily: Theme.fontFamily, + lineHeight: '20px', + padding: '10px 10px 6px 10px', + }, + _a$3["" + TITLE_CLASS] = { + marginBottom: '4px', + }, + _a$3["" + LIST_CLASS] = { + margin: '0px', + listStyleType: 'none', + padding: '0px', + }, + _a$3["" + LIST_ITEM_CLASS] = { + listStyleType: 'none', + marginBottom: '4px', + }, + _a$3["" + MARKER_CLASS] = { + width: '8px', + height: '8px', + borderRadius: '50%', + display: 'inline-block', + marginRight: '8px', + }, + _a$3["" + VALUE_CLASS] = { + display: 'inline-block', + float: 'right', + marginLeft: '30px', + }, + _a$3["" + CROSSHAIR_X] = { + position: 'absolute', + width: '1px', + backgroundColor: 'rgba(0, 0, 0, 0.25)', + }, + _a$3["" + CROSSHAIR_Y] = { + position: 'absolute', + height: '1px', + backgroundColor: 'rgba(0, 0, 0, 0.25)', + }, + _a$3); + +// 检测各边是否超出 +function getOutSides(x, y, width, height, limitBox) { + var hits = { + left: x < limitBox.x, + right: x + width > limitBox.x + limitBox.width, + top: y < limitBox.y, + bottom: y + height > limitBox.y + limitBox.height, + }; + return hits; +} +function getPointByPosition(x, y, offset, width, height, position) { + var px = x; + var py = y; + switch (position) { + case 'left': // left center + px = x - width - offset; + py = y - height / 2; + break; + case 'right': + px = x + offset; + py = y - height / 2; + break; + case 'top': + px = x - width / 2; + py = y - height - offset; + break; + case 'bottom': + // bottom + px = x - width / 2; + py = y + offset; + break; + default: + // auto, 在 top-right + px = x + offset; + py = y - height - offset; + break; + } + return { + x: px, + y: py, + }; +} +function getAlignPoint(x, y, offset, width, height, position, limitBox) { + var point = getPointByPosition(x, y, offset, width, height, position); + if (limitBox) { + var outSides = getOutSides(point.x, point.y, width, height, limitBox); + if (position === 'auto') { + // 如果是 auto，默认 tooltip 在右上角，仅需要判定右侧和上测冲突即可 + if (outSides.right) { + point.x = Math.max(0, x - width - offset); + } + if (outSides.top) { + point.y = Math.max(0, y - height - offset); + } + } + else if (position === 'top' || position === 'bottom') { + if (outSides.left) { + // 左侧躲避 + point.x = limitBox.x; + } + if (outSides.right) { + // 右侧躲避 + point.x = limitBox.x + limitBox.width - width; + } + if (position === 'top' && outSides.top) { + // 如果上面对齐检测上面，不检测下面 + point.y = y + offset; + } + if (position === 'bottom' && outSides.bottom) { + point.y = y - height - offset; + } + } + else { + // 检测左右位置 + if (outSides.top) { + point.y = limitBox.y; + } + if (outSides.bottom) { + point.y = limitBox.y + limitBox.height - height; + } + if (position === 'left' && outSides.left) { + point.x = x + offset; + } + if (position === 'right' && outSides.right) { + point.x = x - width - offset; + } + } + } + return point; +} + +function hasOneKey(obj, keys) { + var result = false; + each$2(keys, function (key) { + if (has$1(obj, key)) { + result = true; + return false; + } + }); + return result; +} +var Tooltip$4 = /** @class */ (function (_super) { + __extends$e(Tooltip, _super); + function Tooltip() { + return _super !== null && _super.apply(this, arguments) || this; + } + Tooltip.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { name: 'tooltip', type: 'html', x: 0, y: 0, items: [], customContent: null, containerTpl: "
    ", itemTpl: "
  • \n \n {name}:\n {value}\n
    • ", xCrosshairTpl: "
    ", yCrosshairTpl: "
    ", title: null, showTitle: true, + /** + * tooltip 限制的区域 + * @type {Region} + */ + region: null, + // crosshair 的限制区域 + crosshairsRegion: null, containerClassName: CONTAINER_CLASS, + // x, y, xy + crosshairs: null, offset: 10, position: 'right', domStyles: null, defaultStyles: TooltipTheme }); + }; + // tooltip 渲染时，渲染 title，items 和 corosshairs + Tooltip.prototype.render = function () { + if (this.get('customContent')) { + this.renderCustomContent(); + } + else { + this.resetTitle(); + this.renderItems(); + } + // 绘制完成后，再定位 + this.resetPosition(); + }; + // 复写清空函数，因为有模板的存在，所以默认的写法不合适 + Tooltip.prototype.clear = function () { + // 由于 crosshair 没有在 container 内，所以需要单独清理 + this.clearCrosshairs(); + this.setTitle(''); // 清空标题 + this.clearItemDoms(); + }; + Tooltip.prototype.show = function () { + var container = this.getContainer(); + if (!container || this.destroyed) { + // 防止容器不存在或者被销毁时报错 + return; + } + this.set('visible', true); + modifyCSS(container, { + visibility: 'visible', + }); + this.setCrossHairsVisible(true); + }; + Tooltip.prototype.hide = function () { + var container = this.getContainer(); + // relative: https://github.com/antvis/g2/issues/1221 + if (!container || this.destroyed) { + return; + } + this.set('visible', false); + modifyCSS(container, { + visibility: 'hidden', + }); + this.setCrossHairsVisible(false); + }; + // 实现 IPointLocation 的接口 + Tooltip.prototype.getLocation = function () { + return { x: this.get('x'), y: this.get('y') }; + }; + // 实现 IPointLocation 的接口 + Tooltip.prototype.setLocation = function (point) { + this.set('x', point.x); + this.set('y', point.y); + this.resetPosition(); + }; + Tooltip.prototype.setCrossHairsVisible = function (visible) { + var display = visible ? '' : 'none'; + var xCrosshairDom = this.get('xCrosshairDom'); + var yCrosshairDom = this.get('yCrosshairDom'); + xCrosshairDom && + modifyCSS(xCrosshairDom, { + display: display, + }); + yCrosshairDom && + modifyCSS(yCrosshairDom, { + display: display, + }); + }; + // 如有 customContent 则根据 customContent 设置 container + Tooltip.prototype.initContainer = function () { + _super.prototype.initContainer.call(this); + if (this.get('customContent')) { + if (this.get('container')) { + this.get('container').remove(); + } + var container = this.getHtmlContentNode(); + this.get('parent').appendChild(container); + this.set('container', container); + this.resetStyles(); + this.applyStyles(); + } + }; + // 更新属性的同时，可能会引起 DOM 的变化，这里对可能引起 DOM 变化的场景做了处理 + Tooltip.prototype.updateInner = function (cfg) { + if (this.get('customContent')) { + this.renderCustomContent(); + } + else { + // 更新标题 + if (hasOneKey(cfg, ['title', 'showTitle'])) { + this.resetTitle(); + } + // 更新内容 + if (has$1(cfg, 'items')) { + this.renderItems(); + } + } + _super.prototype.updateInner.call(this, cfg); + }; + Tooltip.prototype.initDom = function () { + this.cacheDoms(); + }; + // 清理 DOM + Tooltip.prototype.removeDom = function () { + _super.prototype.removeDom.call(this); + this.clearCrosshairs(); + }; + // 调整位置 + Tooltip.prototype.resetPosition = function () { + var x = this.get('x'); + var y = this.get('y'); + var offset = this.get('offset'); + var _a = this.getOffset(), offsetX = _a.offsetX, offsetY = _a.offsetY; + var position = this.get('position'); + var region = this.get('region'); + var container = this.getContainer(); + var bbox = this.getBBox(); + var width = bbox.width, height = bbox.height; + var limitBox; + if (region) { + // 不限制位置 + limitBox = regionToBBox(region); + } + var point = getAlignPoint(x, y, offset, width, height, position, limitBox); + modifyCSS(container, { + left: toPx(point.x + offsetX), + top: toPx(point.y + offsetY), + }); + this.resetCrosshairs(); + }; + // 根据 customContent 渲染 + Tooltip.prototype.renderCustomContent = function () { + var node = this.getHtmlContentNode(); + var parent = this.get('parent'); + var curContainer = this.get('container'); + if (curContainer && curContainer.parentNode === parent) { + parent.replaceChild(node, curContainer); + } + else { + parent.appendChild(node); + } + this.set('container', node); + this.resetStyles(); + this.applyStyles(); + }; + Tooltip.prototype.getHtmlContentNode = function () { + var node; + var customContent = this.get('customContent'); + if (customContent) { + var elem = customContent(this.get('title'), this.get('items')); + if (isElement(elem)) { + node = elem; + } + else { + node = createDom$1(elem); + } + } + return node; + }; + // 缓存模板设置的各种 DOM + Tooltip.prototype.cacheDoms = function () { + var container = this.getContainer(); + var titleDom = container.getElementsByClassName(TITLE_CLASS)[0]; + var listDom = container.getElementsByClassName(LIST_CLASS)[0]; + this.set('titleDom', titleDom); + this.set('listDom', listDom); + }; + // 重置 title + Tooltip.prototype.resetTitle = function () { + var title = this.get('title'); + var showTitle = this.get('showTitle'); + if (showTitle && title) { + this.setTitle(title); + } + else { + this.setTitle(''); + } + }; + // 设置 title 文本 + Tooltip.prototype.setTitle = function (text) { + var titleDom = this.get('titleDom'); + if (titleDom) { + titleDom.innerText = text; + } + }; + // 终止 crosshair + Tooltip.prototype.resetCrosshairs = function () { + var crosshairsRegion = this.get('crosshairsRegion'); + var crosshairs = this.get('crosshairs'); + if (!crosshairsRegion || !crosshairs) { + // 不显示 crosshair，都移除，没有设定 region 也都移除掉 + this.clearCrosshairs(); + } + else { + var crosshairBox = regionToBBox(crosshairsRegion); + var xCrosshairDom = this.get('xCrosshairDom'); + var yCrosshairDom = this.get('yCrosshairDom'); + if (crosshairs === 'x') { + this.resetCrosshair('x', crosshairBox); + // 仅显示 x 的 crosshair，y 移除 + if (yCrosshairDom) { + yCrosshairDom.remove(); + this.set('yCrosshairDom', null); + } + } + else if (crosshairs === 'y') { + this.resetCrosshair('y', crosshairBox); + // 仅显示 y 的 crosshair，x 移除 + if (xCrosshairDom) { + xCrosshairDom.remove(); + this.set('xCrosshairDom', null); + } + } + else { + this.resetCrosshair('x', crosshairBox); + this.resetCrosshair('y', crosshairBox); + } + this.setCrossHairsVisible(this.get('visible')); + } + }; + // 设定 crosshair 的位置，需要区分 x,y + Tooltip.prototype.resetCrosshair = function (name, bbox) { + var croshairDom = this.checkCrosshair(name); + var value = this.get(name); + if (name === 'x') { + modifyCSS(croshairDom, { + left: toPx(value), + top: toPx(bbox.y), + height: toPx(bbox.height), + }); + } + else { + modifyCSS(croshairDom, { + top: toPx(value), + left: toPx(bbox.x), + width: toPx(bbox.width), + }); + } + }; + // 如果 crosshair 对应的 dom 不存在，则创建 + Tooltip.prototype.checkCrosshair = function (name) { + var domName = name + "CrosshairDom"; + var tplName = name + "CrosshairTpl"; + var constName = "CROSSHAIR_" + name.toUpperCase(); + var styleName = CssConst[constName]; + var croshairDom = this.get(domName); + var parent = this.get('parent'); + if (!croshairDom) { + croshairDom = createDom$1(this.get(tplName)); // 创建 + this.applyStyle(styleName, croshairDom); // 设置初始样式 + parent.appendChild(croshairDom); // 添加到跟 tooltip 同级的目录下 + this.set(domName, croshairDom); + } + return croshairDom; + }; + Tooltip.prototype.renderItems = function () { + this.clearItemDoms(); + var items = this.get('items'); + var itemTpl = this.get('itemTpl'); + var listDom = this.get('listDom'); + if (listDom) { + each$2(items, function (item) { + var color = colorUtil.toCSSGradient(item.color); + var substituteObj = __assign$r(__assign$r({}, item), { color: color }); + var domStr = substitute$1(itemTpl, substituteObj); + var itemDom = createDom$1(domStr); + listDom.appendChild(itemDom); + }); + this.applyChildrenStyles(listDom, this.get('domStyles')); + } + }; + Tooltip.prototype.clearItemDoms = function () { + if (this.get('listDom')) { + clearDom(this.get('listDom')); + } + }; + Tooltip.prototype.clearCrosshairs = function () { + var xCrosshairDom = this.get('xCrosshairDom'); + var yCrosshairDom = this.get('yCrosshairDom'); + xCrosshairDom && xCrosshairDom.remove(); + yCrosshairDom && yCrosshairDom.remove(); + this.set('xCrosshairDom', null); + this.set('yCrosshairDom', null); + }; + return Tooltip; +}(HtmlComponent)); + +var BACKGROUND_STYLE$2 = { + // fill: 'red', + opacity: 0, +}; +var LINE_STYLE$1 = { + stroke: '#C5C5C5', + strokeOpacity: 0.85, +}; +var AREA_STYLE$1 = { + fill: '#CACED4', + opacity: 0.85, +}; + +/** + * 点数组转 path + * @param points + */ +function pointsToPath$1(points) { + return map$4(points, function (p, idx) { + var command = idx === 0 ? 'M' : 'L'; + var x = p[0], y = p[1]; + return [command, x, y]; + }); +} +/** + * 将点连接成路径 path + * @param points + */ +function getLinePath$2(points) { + return pointsToPath$1(points); +} +/** + * 将点连成平滑的曲线 + * @param points + */ +function getSmoothLinePath$1(points) { + if (points.length <= 2) { + // 两点以内直接绘制成路径 + return getLinePath$2(points); + } + var data = []; + each$2(points, function (p) { + // 当前点和上一个点一样的时候，忽略掉 + if (!isEqual$2(p, data.slice(data.length - 2))) { + data.push(p[0], p[1]); + } + }); + // const constraint = [ // 范围 + // [ 0, 0 ], + // [ 1, 1 ], + // ]; + var path = catmullRom2Bezier(data, false); + var _a = head(points), x = _a[0], y = _a[1]; + path.unshift(['M', x, y]); + return path; +} +/** + * 将数据转成 path，利用 scale 的归一化能力 + * @param data + * @param width + * @param height + * @param smooth + */ +function dataToPath$1(data, width, height, smooth) { + if (smooth === void 0) { smooth = true; } + // 利用 scale 来获取 y 上的映射 + var y = new Linear({ + values: data, + }); + var x = new Category$1({ + values: map$4(data, function (v, idx) { return idx; }), + }); + var points = map$4(data, function (v, idx) { + return [x.scale(idx) * width, height - y.scale(v) * height]; + }); + return smooth ? getSmoothLinePath$1(points) : getLinePath$2(points); +} +/** + * 获得 area 面积的横向连接线的 px 位置 + * @param data + * @param width + * @param height + */ +function getAreaLineY$1(data, height) { + var y = new Linear({ + values: data, + }); + var lineY = Math.max(0, y.min); + return height - y.scale(lineY) * height; +} +/** + * 线 path 转 area path + * @param path + * @param width + * @param height + */ +function linePathToAreaPath$1(path, width, height, data) { + var areaPath = __spreadArrays$1(path); + var lineYPx = getAreaLineY$1(data, height); + areaPath.push(['L', width, lineYPx]); + areaPath.push(['L', 0, lineYPx]); + areaPath.push(['Z']); + return areaPath; +} + +var Trend$2 = /** @class */ (function (_super) { + __extends$e(Trend, _super); + function Trend() { + return _super !== null && _super.apply(this, arguments) || this; + } + Trend.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { name: 'trend', x: 0, y: 0, width: 200, height: 16, smooth: true, isArea: false, data: [], backgroundStyle: BACKGROUND_STYLE$2, lineStyle: LINE_STYLE$1, areaStyle: AREA_STYLE$1 }); + }; + Trend.prototype.renderInner = function (group) { + var _a = this.cfg, width = _a.width, height = _a.height, data = _a.data, smooth = _a.smooth, isArea = _a.isArea, backgroundStyle = _a.backgroundStyle, lineStyle = _a.lineStyle, areaStyle = _a.areaStyle; + // 背景 + this.addShape(group, { + id: this.getElementId('background'), + type: 'rect', + attrs: __assign$r({ x: 0, y: 0, width: width, + height: height }, backgroundStyle), + }); + var path = dataToPath$1(data, width, height, smooth); + // 线 + this.addShape(group, { + id: this.getElementId('line'), + type: 'path', + attrs: __assign$r({ path: path }, lineStyle), + }); + // area + // 在 path 的基础上，增加两个坐标点 + if (isArea) { + var areaPath = linePathToAreaPath$1(path, width, height, data); + this.addShape(group, { + id: this.getElementId('area'), + type: 'path', + attrs: __assign$r({ path: areaPath }, areaStyle), + }); + } + }; + Trend.prototype.applyOffset = function () { + var _a = this.cfg, x = _a.x, y = _a.y; + // 统一移动到对应的位置 + this.moveElementTo(this.get('group'), { + x: x, + y: y, + }); + }; + return Trend; +}(GroupComponent)); + +var DEFAULT_HANDLER_STYLE = { + fill: '#F7F7F7', + stroke: '#BFBFBF', + radius: 2, + opacity: 1, + cursor: 'ew-resize', + // 高亮的颜色 + highLightFill: '#FFF', +}; +var Handler$2 = /** @class */ (function (_super) { + __extends$e(Handler, _super); + function Handler() { + return _super !== null && _super.apply(this, arguments) || this; + } + Handler.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { name: 'handler', x: 0, y: 0, width: 10, height: 24, style: DEFAULT_HANDLER_STYLE }); + }; + Handler.prototype.renderInner = function (group) { + var _a = this.cfg, width = _a.width, height = _a.height, style = _a.style; + var fill = style.fill, stroke = style.stroke, radius = style.radius, opacity = style.opacity, cursor = style.cursor; + // 按钮框框 + this.addShape(group, { + type: 'rect', + id: this.getElementId('background'), + attrs: { + x: 0, + y: 0, + width: width, + height: height, + fill: fill, + stroke: stroke, + radius: radius, + opacity: opacity, + cursor: cursor, + }, + }); + // 两根竖线 + var x1 = (1 / 3) * width; + var x2 = (2 / 3) * width; + var y1 = (1 / 4) * height; + var y2 = (3 / 4) * height; + this.addShape(group, { + id: this.getElementId('line-left'), + type: 'line', + attrs: { + x1: x1, + y1: y1, + x2: x1, + y2: y2, + stroke: stroke, + cursor: cursor, + }, + }); + this.addShape(group, { + id: this.getElementId('line-right'), + type: 'line', + attrs: { + x1: x2, + y1: y1, + x2: x2, + y2: y2, + stroke: stroke, + cursor: cursor, + }, + }); + }; + Handler.prototype.applyOffset = function () { + this.moveElementTo(this.get('group'), { + x: this.get('x'), + y: this.get('y'), + }); + }; + Handler.prototype.initEvent = function () { + this.bindEvents(); + }; + Handler.prototype.bindEvents = function () { + var _this = this; + this.get('group').on('mouseenter', function () { + var highLightFill = _this.get('style').highLightFill; + _this.getElementByLocalId('background').attr('fill', highLightFill); + _this.draw(); + }); + this.get('group').on('mouseleave', function () { + var fill = _this.get('style').fill; + _this.getElementByLocalId('background').attr('fill', fill); + _this.draw(); + }); + }; + Handler.prototype.draw = function () { + var canvas = this.get('container').get('canvas'); + if (canvas) { + canvas.draw(); + } + }; + return Handler; +}(GroupComponent)); + +/** + * 一些默认的样式配置 + */ +var BACKGROUND_STYLE$1 = { + fill: '#416180', + opacity: 0.05, +}; +var FOREGROUND_STYLE$1 = { + fill: '#5B8FF9', + opacity: 0.15, + cursor: 'move', +}; +var DEFAULT_HANDLER_WIDTH$1 = 10; +var HANDLER_STYLE$1 = { + width: DEFAULT_HANDLER_WIDTH$1, + height: 24, +}; +var TEXT_STYLE$1 = { + textBaseline: 'middle', + fill: '#000', + opacity: 0.45, +}; +var SLIDER_CHANGE = 'sliderchange'; + +var Slider$1 = /** @class */ (function (_super) { + __extends$e(Slider, _super); + function Slider() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.onMouseDown = function (target) { return function (e) { + _this.currentTarget = target; + // 取出原生事件 + var event = e.originalEvent; + // 2. 存储当前点击位置 + event.stopPropagation(); + event.preventDefault(); + // 兼容移动端获取数据 + _this.prevX = get$3(event, 'touches.0.pageX', event.pageX); + _this.prevY = get$3(event, 'touches.0.pageY', event.pageY); + // 3. 开始滑动的时候，绑定 move 和 up 事件 + var containerDOM = _this.getContainerDOM(); + containerDOM.addEventListener('mousemove', _this.onMouseMove); + containerDOM.addEventListener('mouseup', _this.onMouseUp); + containerDOM.addEventListener('mouseleave', _this.onMouseUp); + // 移动端事件 + containerDOM.addEventListener('touchmove', _this.onMouseMove); + containerDOM.addEventListener('touchend', _this.onMouseUp); + containerDOM.addEventListener('touchcancel', _this.onMouseUp); + }; }; + _this.onMouseMove = function (event) { + var width = _this.cfg.width; + var originValue = [_this.get('start'), _this.get('end')]; + // 滑动过程中，计算偏移，更新滑块，然后 emit 数据出去 + event.stopPropagation(); + event.preventDefault(); + var x = get$3(event, 'touches.0.pageX', event.pageX); + var y = get$3(event, 'touches.0.pageY', event.pageY); + // 横向的 slider 只处理 x + var offsetX = x - _this.prevX; + var offsetXRange = _this.adjustOffsetRange(offsetX / width); + // 更新 start end range 范围 + _this.updateStartEnd(offsetXRange); + // 更新 ui + _this.updateUI(_this.getElementByLocalId('foreground'), _this.getElementByLocalId('minText'), _this.getElementByLocalId('maxText')); + _this.prevX = x; + _this.prevY = y; + _this.draw(); + // 因为存储的 start、end 可能不一定是按大小存储的，所以排序一下，对外是 end >= start + _this.emit(SLIDER_CHANGE, [_this.get('start'), _this.get('end')].sort()); + _this.delegateEmit('valuechanged', { + originValue: originValue, + value: [_this.get('start'), _this.get('end')], + }); + }; + _this.onMouseUp = function () { + // 结束之后，取消绑定的事件 + if (_this.currentTarget) { + _this.currentTarget = undefined; + } + var containerDOM = _this.getContainerDOM(); + if (containerDOM) { + containerDOM.removeEventListener('mousemove', _this.onMouseMove); + containerDOM.removeEventListener('mouseup', _this.onMouseUp); + // 防止滑动到 canvas 外部之后，状态丢失 + containerDOM.removeEventListener('mouseleave', _this.onMouseUp); + // 移动端事件 + containerDOM.removeEventListener('touchmove', _this.onMouseMove); + containerDOM.removeEventListener('touchend', _this.onMouseUp); + containerDOM.removeEventListener('touchcancel', _this.onMouseUp); + } + }; + return _this; + } + Slider.prototype.setRange = function (min, max) { + this.set('minLimit', min); + this.set('maxLimit', max); + var oldStart = this.get('start'); + var oldEnd = this.get('end'); + var newStart = clamp$1(oldStart, min, max); + var newEnd = clamp$1(oldEnd, min, max); + if (!this.get('isInit') && (oldStart !== newStart || oldEnd !== newEnd)) { + this.setValue([newStart, newEnd]); + } + }; + Slider.prototype.getRange = function () { + return { + min: this.get('minLimit') || 0, + max: this.get('maxLimit') || 1, + }; + }; + Slider.prototype.setValue = function (value) { + var range = this.getRange(); + if (isArray$n(value) && value.length === 2) { + var originValue = [this.get('start'), this.get('end')]; + this.update({ + start: clamp$1(value[0], range.min, range.max), + end: clamp$1(value[1], range.min, range.max), + }); + if (!this.get('updateAutoRender')) { + this.render(); + } + this.delegateEmit('valuechanged', { + originValue: originValue, + value: value, + }); + } + }; + Slider.prototype.getValue = function () { + return [this.get('start'), this.get('end')]; + }; + Slider.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { name: 'slider', x: 0, y: 0, width: 100, height: 16, backgroundStyle: {}, foregroundStyle: {}, handlerStyle: {}, textStyle: {}, defaultCfg: { + backgroundStyle: BACKGROUND_STYLE$1, + foregroundStyle: FOREGROUND_STYLE$1, + handlerStyle: HANDLER_STYLE$1, + textStyle: TEXT_STYLE$1, + } }); + }; + Slider.prototype.update = function (cfg) { + var start = cfg.start, end = cfg.end; + var validCfg = __assign$r({}, cfg); + if (!isNil(start)) { + validCfg.start = clamp$1(start, 0, 1); + } + if (!isNil(end)) { + validCfg.end = clamp$1(end, 0, 1); + } + _super.prototype.update.call(this, validCfg); + this.minHandler = this.getChildComponentById(this.getElementId('minHandler')); + this.maxHandler = this.getChildComponentById(this.getElementId('maxHandler')); + this.trend = this.getChildComponentById(this.getElementId('trend')); + }; + Slider.prototype.init = function () { + this.set('start', clamp$1(this.get('start'), 0, 1)); + this.set('end', clamp$1(this.get('end'), 0, 1)); + _super.prototype.init.call(this); + }; + Slider.prototype.render = function () { + _super.prototype.render.call(this); + this.updateUI(this.getElementByLocalId('foreground'), this.getElementByLocalId('minText'), this.getElementByLocalId('maxText')); + }; + Slider.prototype.renderInner = function (group) { + var _a = this.cfg; _a.start; _a.end; var width = _a.width, height = _a.height, _b = _a.trendCfg, trendCfg = _b === void 0 ? {} : _b, minText = _a.minText, maxText = _a.maxText, _c = _a.backgroundStyle, backgroundStyle = _c === void 0 ? {} : _c, _d = _a.foregroundStyle, foregroundStyle = _d === void 0 ? {} : _d, _e = _a.textStyle, textStyle = _e === void 0 ? {} : _e; + var handlerStyle = deepMix({}, DEFAULT_HANDLER_STYLE, this.cfg.handlerStyle); + // 趋势图数据 + if (size$1(get$3(trendCfg, 'data'))) { + this.trend = this.addComponent(group, __assign$r({ component: Trend$2, id: this.getElementId('trend'), x: 0, y: 0, width: width, + height: height }, trendCfg)); + } + // 1. 背景 + this.addShape(group, { + id: this.getElementId('background'), + type: 'rect', + attrs: __assign$r({ x: 0, y: 0, width: width, + height: height }, backgroundStyle), + }); + // 2. 左右文字 + this.addShape(group, { + id: this.getElementId('minText'), + type: 'text', + attrs: __assign$r({ + // x: 0, + y: height / 2, textAlign: 'right', text: minText, silent: false }, textStyle), + }); + this.addShape(group, { + id: this.getElementId('maxText'), + type: 'text', + attrs: __assign$r({ + // x: 0, + y: height / 2, textAlign: 'left', text: maxText, silent: false }, textStyle), + }); + // 3. 前景 选中背景框 + this.addShape(group, { + id: this.getElementId('foreground'), + name: 'foreground', + type: 'rect', + attrs: __assign$r({ + // x: 0, + y: 0, + // width: 0, + height: height }, foregroundStyle), + }); + // 滑块相关的大小信息 + var handlerWidth = get$3(handlerStyle, 'width', DEFAULT_HANDLER_WIDTH$1); + var handlerHeight = get$3(handlerStyle, 'height', 24); + // 4. 左右滑块 + this.minHandler = this.addComponent(group, { + component: Handler$2, + id: this.getElementId('minHandler'), + name: 'handler-min', + x: 0, + y: (height - handlerHeight) / 2, + width: handlerWidth, + height: handlerHeight, + cursor: 'ew-resize', + style: handlerStyle, + }); + this.maxHandler = this.addComponent(group, { + component: Handler$2, + id: this.getElementId('maxHandler'), + name: 'handler-max', + x: 0, + y: (height - handlerHeight) / 2, + width: handlerWidth, + height: handlerHeight, + cursor: 'ew-resize', + style: handlerStyle, + }); + }; + Slider.prototype.applyOffset = function () { + this.moveElementTo(this.get('group'), { + x: this.get('x'), + y: this.get('y'), + }); + }; + Slider.prototype.initEvent = function () { + this.bindEvents(); + }; + Slider.prototype.updateUI = function (foregroundShape, minTextShape, maxTextShape) { + var _a = this.cfg, start = _a.start, end = _a.end, width = _a.width, minText = _a.minText, maxText = _a.maxText, handlerStyle = _a.handlerStyle, height = _a.height; + var min = start * width; + var max = end * width; + if (this.trend) { + this.trend.update({ + width: width, + height: height, + }); + if (!this.get('updateAutoRender')) { + this.trend.render(); + } + } + // 1. foreground + foregroundShape.attr('x', min); + foregroundShape.attr('width', max - min); + // 滑块相关的大小信息 + var handlerWidth = get$3(handlerStyle, 'width', DEFAULT_HANDLER_WIDTH$1); + // 设置文本 + minTextShape.attr('text', minText); + maxTextShape.attr('text', maxText); + var _b = this._dodgeText([min, max], minTextShape, maxTextShape), minAttrs = _b[0], maxAttrs = _b[1]; + // 2. 左侧滑块和文字位置 + if (this.minHandler) { + this.minHandler.update({ + x: min - handlerWidth / 2, + }); + if (!this.get('updateAutoRender')) { + this.minHandler.render(); + } + } + each$2(minAttrs, function (v, k) { return minTextShape.attr(k, v); }); + // 3. 右侧滑块和文字位置 + if (this.maxHandler) { + this.maxHandler.update({ + x: max - handlerWidth / 2, + }); + if (!this.get('updateAutoRender')) { + this.maxHandler.render(); + } + } + each$2(maxAttrs, function (v, k) { return maxTextShape.attr(k, v); }); + }; + Slider.prototype.bindEvents = function () { + var group = this.get('group'); + group.on('handler-min:mousedown', this.onMouseDown('minHandler')); + group.on('handler-min:touchstart', this.onMouseDown('minHandler')); + // 2. 右滑块的滑动 + group.on('handler-max:mousedown', this.onMouseDown('maxHandler')); + group.on('handler-max:touchstart', this.onMouseDown('maxHandler')); + // 3. 前景选中区域 + var foreground = group.findById(this.getElementId('foreground')); + foreground.on('mousedown', this.onMouseDown('foreground')); + foreground.on('touchstart', this.onMouseDown('foreground')); + }; + /** + * 调整 offsetRange，因为一些范围的限制 + * @param offsetRange + */ + Slider.prototype.adjustOffsetRange = function (offsetRange) { + var _a = this.cfg, start = _a.start, end = _a.end; + // 针对不同的滑动组件，处理的方式不同 + switch (this.currentTarget) { + case 'minHandler': { + var min = 0 - start; + var max = 1 - start; + return Math.min(max, Math.max(min, offsetRange)); + } + case 'maxHandler': { + var min = 0 - end; + var max = 1 - end; + return Math.min(max, Math.max(min, offsetRange)); + } + case 'foreground': { + var min = 0 - start; + var max = 1 - end; + return Math.min(max, Math.max(min, offsetRange)); + } + } + }; + Slider.prototype.updateStartEnd = function (offsetRange) { + var _a = this.cfg, start = _a.start, end = _a.end; + // 操作不同的组件，反馈不一样 + switch (this.currentTarget) { + case 'minHandler': + start += offsetRange; + break; + case 'maxHandler': + end += offsetRange; + break; + case 'foreground': + start += offsetRange; + end += offsetRange; + break; + } + this.set('start', start); + this.set('end', end); + }; + /** + * 调整 text 的位置，自动躲避 + * 根据位置，调整返回新的位置 + * @param range + */ + Slider.prototype._dodgeText = function (range, minTextShape, maxTextShape) { + var _a, _b; + var _c = this.cfg, handlerStyle = _c.handlerStyle, width = _c.width; + var PADDING = 2; + var handlerWidth = get$3(handlerStyle, 'width', DEFAULT_HANDLER_WIDTH$1); + var min = range[0], max = range[1]; + var sorted = false; + // 如果交换了位置，则对应的 min max 也交互 + if (min > max) { + _a = [max, min], min = _a[0], max = _a[1]; + _b = [maxTextShape, minTextShape], minTextShape = _b[0], maxTextShape = _b[1]; + sorted = true; + } + // 避让规则，优先显示在两侧，只有显示不下的时候，才显示在中间 + var minBBox = minTextShape.getBBox(); + var maxBBox = maxTextShape.getBBox(); + var minAttrs = minBBox.width > min - PADDING + ? { x: min + handlerWidth / 2 + PADDING, textAlign: 'left' } + : { x: min - handlerWidth / 2 - PADDING, textAlign: 'right' }; + var maxAttrs = maxBBox.width > width - max - PADDING + ? { x: max - handlerWidth / 2 - PADDING, textAlign: 'right' } + : { x: max + handlerWidth / 2 + PADDING, textAlign: 'left' }; + return !sorted ? [minAttrs, maxAttrs] : [maxAttrs, minAttrs]; + }; + Slider.prototype.draw = function () { + var container = this.get('container'); + var canvas = container && container.get('canvas'); + if (canvas) { + canvas.draw(); + } + }; + Slider.prototype.getContainerDOM = function () { + var container = this.get('container'); + var canvas = container && container.get('canvas'); + return canvas && canvas.get('container'); + }; + return Slider; +}(GroupComponent)); + +var DEFAULT_STYLE$1 = { + trackColor: 'rgba(0,0,0,0)', + thumbColor: 'rgba(0,0,0,0.15)', + size: 8, + lineCap: 'round', +}; +var DEFAULT_THEME = { + // 默认样式 + default: DEFAULT_STYLE$1, + // 鼠标 hover 的样式 + hover: { + thumbColor: 'rgba(0,0,0,0.2)', + }, +}; +var Scrollbar$1 = /** @class */ (function (_super) { + __extends$e(Scrollbar, _super); + function Scrollbar() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.clearEvents = noop$3; + _this.onStartEvent = function (isMobile) { return function (e) { + _this.isMobile = isMobile; + e.originalEvent.preventDefault(); + var clientX = isMobile ? get$3(e.originalEvent, 'touches.0.clientX') : e.clientX; + var clientY = isMobile ? get$3(e.originalEvent, 'touches.0.clientY') : e.clientY; + // 将开始的点记录下来 + _this.startPos = _this.cfg.isHorizontal ? clientX : clientY; + _this.bindLaterEvent(); + }; }; + _this.bindLaterEvent = function () { + var containerDOM = _this.getContainerDOM(); + var events = []; + if (_this.isMobile) { + events = [ + addEventListener(containerDOM, 'touchmove', _this.onMouseMove), + addEventListener(containerDOM, 'touchend', _this.onMouseUp), + addEventListener(containerDOM, 'touchcancel', _this.onMouseUp), + ]; + } + else { + events = [ + addEventListener(containerDOM, 'mousemove', _this.onMouseMove), + addEventListener(containerDOM, 'mouseup', _this.onMouseUp), + // 为了保证划出 canvas containerDom 时还没触发 mouseup + addEventListener(containerDOM, 'mouseleave', _this.onMouseUp), + ]; + } + _this.clearEvents = function () { + events.forEach(function (e) { + e.remove(); + }); + }; + }; + // 拖拽滑块的事件回调 + // 这里是 dom 原生事件，绑定在 dom 元素上的 + _this.onMouseMove = function (e) { + var _a = _this.cfg, isHorizontal = _a.isHorizontal, thumbOffset = _a.thumbOffset; + e.preventDefault(); + var clientX = _this.isMobile ? get$3(e, 'touches.0.clientX') : e.clientX; + var clientY = _this.isMobile ? get$3(e, 'touches.0.clientY') : e.clientY; + // 鼠标松开的位置 + var endPos = isHorizontal ? clientX : clientY; + // 滑块需要移动的距离, 由于这里是对滑块监听，所以移动的距离就是 diffDis, 如果监听对象是 container dom，则需要算比例 + var diff = endPos - _this.startPos; + // 更新 _startPos + _this.startPos = endPos; + _this.updateThumbOffset(thumbOffset + diff); + }; + _this.onMouseUp = function (e) { + e.preventDefault(); + _this.clearEvents(); + }; + // 点击滑道的事件回调,移动滑块位置 + _this.onTrackClick = function (e) { + var _a = _this.cfg, isHorizontal = _a.isHorizontal, x = _a.x, y = _a.y, thumbLen = _a.thumbLen; + var containerDOM = _this.getContainerDOM(); + var rect = containerDOM.getBoundingClientRect(); + var clientX = e.clientX, clientY = e.clientY; + var offset = isHorizontal ? clientX - rect.left - x - thumbLen / 2 : clientY - rect.top - y - thumbLen / 2; + var newOffset = _this.validateRange(offset); + _this.updateThumbOffset(newOffset); + }; + _this.onThumbMouseOver = function () { + var thumbColor = _this.cfg.theme.hover.thumbColor; + _this.getElementByLocalId('thumb').attr('stroke', thumbColor); + _this.draw(); + }; + _this.onThumbMouseOut = function () { + var thumbColor = _this.cfg.theme.default.thumbColor; + _this.getElementByLocalId('thumb').attr('stroke', thumbColor); + _this.draw(); + }; + return _this; + } + Scrollbar.prototype.setRange = function (min, max) { + this.set('minLimit', min); + this.set('maxLimit', max); + var curValue = this.getValue(); + var newValue = clamp$1(curValue, min, max); + if (curValue !== newValue && !this.get('isInit')) { + this.setValue(newValue); + } + }; + Scrollbar.prototype.getRange = function () { + var min = this.get('minLimit') || 0; + var max = this.get('maxLimit') || 1; + return { min: min, max: max }; + }; + Scrollbar.prototype.setValue = function (value) { + var range = this.getRange(); + var originalValue = this.getValue(); + this.update({ + thumbOffset: (this.get('trackLen') - this.get('thumbLen')) * clamp$1(value, range.min, range.max), + }); + this.delegateEmit('valuechange', { + originalValue: originalValue, + value: this.getValue(), + }); + }; + Scrollbar.prototype.getValue = function () { + return clamp$1(this.get('thumbOffset') / (this.get('trackLen') - this.get('thumbLen')), 0, 1); + }; + Scrollbar.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + return __assign$r(__assign$r({}, cfg), { name: 'scrollbar', isHorizontal: true, minThumbLen: 20, thumbOffset: 0, theme: DEFAULT_THEME }); + }; + Scrollbar.prototype.renderInner = function (group) { + this.renderTrackShape(group); + this.renderThumbShape(group); + }; + Scrollbar.prototype.applyOffset = function () { + this.moveElementTo(this.get('group'), { + x: this.get('x'), + y: this.get('y'), + }); + }; + Scrollbar.prototype.initEvent = function () { + this.bindEvents(); + }; + // 创建滑道的 shape + Scrollbar.prototype.renderTrackShape = function (group) { + var _a = this.cfg, trackLen = _a.trackLen, _b = _a.theme, theme = _b === void 0 ? { default: {} } : _b; + var _c = deepMix({}, DEFAULT_THEME, theme).default, lineCap = _c.lineCap, trackColor = _c.trackColor, themeSize = _c.size; + var size = get$3(this.cfg, 'size', themeSize); + var attrs = this.get('isHorizontal') + ? { + x1: 0 + size / 2, + y1: size / 2, + x2: trackLen - size / 2, + y2: size / 2, + lineWidth: size, + stroke: trackColor, + lineCap: lineCap, + } + : { + x1: size / 2, + y1: 0 + size / 2, + x2: size / 2, + y2: trackLen - size / 2, + lineWidth: size, + stroke: trackColor, + lineCap: lineCap, + }; + return this.addShape(group, { + id: this.getElementId('track'), + name: 'track', + type: 'line', + attrs: attrs, + }); + }; + // 创建滑块的 shape + Scrollbar.prototype.renderThumbShape = function (group) { + var _a = this.cfg, thumbOffset = _a.thumbOffset, thumbLen = _a.thumbLen, theme = _a.theme; + var _b = deepMix({}, DEFAULT_THEME, theme).default, themeSize = _b.size, lineCap = _b.lineCap, thumbColor = _b.thumbColor; + var size = get$3(this.cfg, 'size', themeSize); + var attrs = this.get('isHorizontal') + ? { + x1: thumbOffset + size / 2, + y1: size / 2, + x2: thumbOffset + thumbLen - size / 2, + y2: size / 2, + lineWidth: size, + stroke: thumbColor, + lineCap: lineCap, + cursor: 'default', + } + : { + x1: size / 2, + y1: thumbOffset + size / 2, + x2: size / 2, + y2: thumbOffset + thumbLen - size / 2, + lineWidth: size, + stroke: thumbColor, + lineCap: lineCap, + cursor: 'default', + }; + return this.addShape(group, { + id: this.getElementId('thumb'), + name: 'thumb', + type: 'line', + attrs: attrs, + }); + }; + Scrollbar.prototype.bindEvents = function () { + var group = this.get('group'); + group.on('mousedown', this.onStartEvent(false)); + group.on('mouseup', this.onMouseUp); + group.on('touchstart', this.onStartEvent(true)); + group.on('touchend', this.onMouseUp); + var trackShape = group.findById(this.getElementId('track')); + trackShape.on('click', this.onTrackClick); + var thumbShape = group.findById(this.getElementId('thumb')); + thumbShape.on('mouseover', this.onThumbMouseOver); + thumbShape.on('mouseout', this.onThumbMouseOut); + }; + Scrollbar.prototype.getContainerDOM = function () { + var container = this.get('container'); + var canvas = container && container.get('canvas'); + return canvas && canvas.get('container'); + }; + Scrollbar.prototype.validateRange = function (offset) { + var _a = this.cfg, thumbLen = _a.thumbLen, trackLen = _a.trackLen; + var newOffset = offset; + if (offset + thumbLen > trackLen) { + newOffset = trackLen - thumbLen; + } + else if (offset + thumbLen < thumbLen) { + newOffset = 0; + } + return newOffset; + }; + Scrollbar.prototype.draw = function () { + var container = this.get('container'); + var canvas = container && container.get('canvas'); + if (canvas) { + canvas.draw(); + } + }; + Scrollbar.prototype.updateThumbOffset = function (offset) { + var _a = this.cfg, thumbOffset = _a.thumbOffset, isHorizontal = _a.isHorizontal, thumbLen = _a.thumbLen, size = _a.size; + var newOffset = this.validateRange(offset); + if (newOffset === thumbOffset) { + // 如果更新后的 offset 与原值相同，则不改变 + return; + } + var thumbShape = this.getElementByLocalId('thumb'); + if (isHorizontal) { + thumbShape.attr({ + x1: newOffset + size / 2, + x2: newOffset + thumbLen - size / 2, + }); + } + else { + thumbShape.attr({ + y1: newOffset + size / 2, + y2: newOffset + thumbLen - size / 2, + }); + } + this.emitOffsetChange(newOffset); + }; + Scrollbar.prototype.emitOffsetChange = function (offset) { + var _a = this.cfg, originalValue = _a.thumbOffset, trackLen = _a.trackLen, thumbLen = _a.thumbLen; + this.cfg.thumbOffset = offset; + // 发送事件 + this.emit('scrollchange', { + thumbOffset: offset, + ratio: clamp$1(offset / (trackLen - thumbLen), 0, 1), + }); + this.delegateEmit('valuechange', { + originalValue: originalValue, + value: offset, + }); + }; + return Scrollbar; +}(GroupComponent)); + +/* 依赖的模块，在这里统一引入，方便打包优化 */ +// axis +var LineAxis = Line$a, CircleAxis = Circle$6; +// grid +var LineGrid = Line$9, CircleGrid = Circle$5; +// legend +var CategoryLegend = Category, ContinuousLegend = ContinueLegend; +// Tooltip +var HtmlTooltip = Tooltip$4; + +// 获取图形的包围盒 +function getPointsBox(points) { + if (isEmpty$1(points)) { + return null; + } + var minX = points[0].x; + var maxX = points[0].x; + var minY = points[0].y; + var maxY = points[0].y; + each$2(points, function (point) { + minX = minX > point.x ? point.x : minX; + maxX = maxX < point.x ? point.x : maxX; + minY = minY > point.y ? point.y : minY; + maxY = maxY < point.y ? point.y : maxY; + }); + return { + minX: minX, + maxX: maxX, + minY: minY, + maxY: maxY, + centerX: (minX + maxX) / 2, + centerY: (minY + maxY) / 2, + }; +} +/** + * @ignore + * 根据弧度计算极坐标系下的坐标点 + * @param centerX + * @param centerY + * @param radius + * @param angleInRadian + * @returns + */ +function polarToCartesian(centerX, centerY, radius, angleInRadian) { + return { + x: centerX + radius * Math.cos(angleInRadian), + y: centerY + radius * Math.sin(angleInRadian), + }; +} +/** + * @ignore + * 根据起始角度计算绘制扇形的 path + * @param centerX + * @param centerY + * @param radius + * @param startAngleInRadian + * @param endAngleInRadian + * @returns + */ +function getSectorPath(centerX, centerY, radius, startAngleInRadian, endAngleInRadian, innerRadius) { + if (innerRadius === void 0) { innerRadius = 0; } + var start = polarToCartesian(centerX, centerY, radius, startAngleInRadian); + var end = polarToCartesian(centerX, centerY, radius, endAngleInRadian); + var innerStart = polarToCartesian(centerX, centerY, innerRadius, startAngleInRadian); + var innerEnd = polarToCartesian(centerX, centerY, innerRadius, endAngleInRadian); + if (endAngleInRadian - startAngleInRadian === Math.PI * 2) { + // 整个圆是分割成两个圆 + var middlePoint = polarToCartesian(centerX, centerY, radius, startAngleInRadian + Math.PI); + var innerMiddlePoint = polarToCartesian(centerX, centerY, innerRadius, startAngleInRadian + Math.PI); + var circlePathCommands = [ + ['M', start.x, start.y], + ['A', radius, radius, 0, 1, 1, middlePoint.x, middlePoint.y], + ['A', radius, radius, 0, 1, 1, end.x, end.y], + ['M', innerStart.x, innerStart.y], + ]; + if (innerRadius) { + circlePathCommands.push(['A', innerRadius, innerRadius, 0, 1, 0, innerMiddlePoint.x, innerMiddlePoint.y]); + circlePathCommands.push(['A', innerRadius, innerRadius, 0, 1, 0, innerEnd.x, innerEnd.y]); + } + circlePathCommands.push(['M', start.x, start.y]); + circlePathCommands.push(['Z']); + return circlePathCommands; + } + var arcSweep = endAngleInRadian - startAngleInRadian <= Math.PI ? 0 : 1; + var sectorPathCommands = [ + ['M', start.x, start.y], + ['A', radius, radius, 0, arcSweep, 1, end.x, end.y], + ['L', innerEnd.x, innerEnd.y], + ]; + if (innerRadius) { + sectorPathCommands.push(['A', innerRadius, innerRadius, 0, arcSweep, 0, innerStart.x, innerStart.y]); + } + sectorPathCommands.push(['L', start.x, start.y]); + sectorPathCommands.push(['Z']); + return sectorPathCommands; +} +/** + * @ignore + * Gets arc path + * @param centerX + * @param centerY + * @param radius + * @param startAngleInRadian + * @param endAngleInRadian + * @returns + */ +function getArcPath(centerX, centerY, radius, startAngleInRadian, endAngleInRadian) { + var start = polarToCartesian(centerX, centerY, radius, startAngleInRadian); + var end = polarToCartesian(centerX, centerY, radius, endAngleInRadian); + if (isNumberEqual$1(endAngleInRadian - startAngleInRadian, Math.PI * 2)) { + var middlePoint = polarToCartesian(centerX, centerY, radius, startAngleInRadian + Math.PI); + return [ + ['M', start.x, start.y], + ['A', radius, radius, 0, 1, 1, middlePoint.x, middlePoint.y], + ['A', radius, radius, 0, 1, 1, start.x, start.y], + ['A', radius, radius, 0, 1, 0, middlePoint.x, middlePoint.y], + ['A', radius, radius, 0, 1, 0, start.x, start.y], + ['Z'], + ]; + } + var arcSweep = endAngleInRadian - startAngleInRadian <= Math.PI ? 0 : 1; + return [ + ['M', start.x, start.y], + ['A', radius, radius, 0, arcSweep, 1, end.x, end.y], + ]; +} +/** + * @ignore + * 从数据模型中的 points 换算角度 + * @param shapeModel + * @param coordinate + * @returns + */ +function getAngle$2(shapeModel, coordinate) { + var points = shapeModel.points; + var box = getPointsBox(points); + var endAngle; + var startAngle; + var coordStartAngle = coordinate.startAngle, coordEndAngle = coordinate.endAngle; + var diffAngle = coordEndAngle - coordStartAngle; + if (coordinate.isTransposed) { + endAngle = box.maxY * diffAngle; + startAngle = box.minY * diffAngle; + } + else { + endAngle = box.maxX * diffAngle; + startAngle = box.minX * diffAngle; + } + endAngle += coordStartAngle; + startAngle += coordStartAngle; + return { + startAngle: startAngle, + endAngle: endAngle, + }; +} +/** + * @ignore + * 计算多边形重心: https://en.wikipedia.org/wiki/Centroid#Of_a_polygon + */ +function getPolygonCentroid(xs, ys) { + if (isNumber$4(xs) && isNumber$4(ys)) { + // 普通色块图，xs 和 ys 是数值 + return [xs, ys]; + } + var i = -1; + var x = 0; + var y = 0; + var former; + var current = xs.length - 1; + var diff; + var k = 0; + while (++i < xs.length) { + former = current; + current = i; + k += diff = xs[former] * ys[current] - xs[current] * ys[former]; + x += (xs[former] + xs[current]) * diff; + y += (ys[former] + ys[current]) * diff; + } + k *= 3; + return [x / k, y / k]; +} +/** + * @ignore + * 获取需要替换的属性，如果原先图形元素存在，而新图形不存在，则设置 undefined + */ +function getReplaceAttrs(sourceShape, targetShape) { + var originAttrs = sourceShape.attr(); + var newAttrs = targetShape.attr(); + each$2(originAttrs, function (v, k) { + if (newAttrs[k] === undefined) { + newAttrs[k] = undefined; + } + }); + return newAttrs; +} + +/** + * @ignore + * Determines whether between is + * @param value + * @param start + * @param end + * @returns true if between + */ +function isBetween$2(value, start, end) { + var min = Math.min(start, end); + var max = Math.max(start, end); + return value >= min && value <= max; +} +/** + * @ignore + * pads the current string/array with a given value (repeated, if needed) so that the resulting reaches a given length. + * The padding is applied from the end of the current value. + * + * @param source + * @param targetLength + * @param padValue + * @returns + */ +function padEnd(source, targetLength, padValue) { + if (isString$3(source)) { + return source.padEnd(targetLength, padValue); + } + else if (isArray$n(source)) { + var sourceLength = source.length; + if (sourceLength < targetLength) { + var diff = targetLength - sourceLength; + for (var i = 0; i < diff; i++) { + source.push(padValue); + } + } + } + return source; +} +/** + * @ignore + * omit keys of an object. + * @param obj + * @param keys + */ +function omit(obj, keys) { + if (typeof obj === 'object') { + keys.forEach(function (key) { + delete obj[key]; + }); + } + return obj; +} +/** + * @ignore + * @param sourceArray + * @param targetArray + * @param map + */ +function uniq$2(sourceArray, targetArray, map) { + if (targetArray === void 0) { targetArray = []; } + if (map === void 0) { map = {}; } + for (var _i = 0, sourceArray_1 = sourceArray; _i < sourceArray_1.length; _i++) { + var source = sourceArray_1[_i]; + if (!map[source]) { + targetArray.push(source); + map[source] = true; + } + } + return targetArray; +} + +/** + * 用于包围盒计算。 + */ +var BBox = /** @class */ (function () { + function BBox(x, y, width, height) { + if (x === void 0) { x = 0; } + if (y === void 0) { y = 0; } + if (width === void 0) { width = 0; } + if (height === void 0) { height = 0; } + this.x = x; + this.y = y; + this.height = height; + this.width = width; + } + BBox.fromRange = function (minX, minY, maxX, maxY) { + return new BBox(minX, minY, maxX - minX, maxY - minY); + }; + BBox.fromObject = function (bbox) { + return new BBox(bbox.minX, bbox.minY, bbox.width, bbox.height); + }; + Object.defineProperty(BBox.prototype, "minX", { + get: function () { + return this.x; + }, + enumerable: false, + configurable: true + }); + Object.defineProperty(BBox.prototype, "maxX", { + get: function () { + return this.x + this.width; + }, + enumerable: false, + configurable: true + }); + Object.defineProperty(BBox.prototype, "minY", { + get: function () { + return this.y; + }, + enumerable: false, + configurable: true + }); + Object.defineProperty(BBox.prototype, "maxY", { + get: function () { + return this.y + this.height; + }, + enumerable: false, + configurable: true + }); + Object.defineProperty(BBox.prototype, "tl", { + get: function () { + return { x: this.x, y: this.y }; + }, + enumerable: false, + configurable: true + }); + Object.defineProperty(BBox.prototype, "tr", { + get: function () { + return { x: this.maxX, y: this.y }; + }, + enumerable: false, + configurable: true + }); + Object.defineProperty(BBox.prototype, "bl", { + get: function () { + return { x: this.x, y: this.maxY }; + }, + enumerable: false, + configurable: true + }); + Object.defineProperty(BBox.prototype, "br", { + get: function () { + return { x: this.maxX, y: this.maxY }; + }, + enumerable: false, + configurable: true + }); + Object.defineProperty(BBox.prototype, "top", { + get: function () { + return { + x: this.x + this.width / 2, + y: this.minY, + }; + }, + enumerable: false, + configurable: true + }); + Object.defineProperty(BBox.prototype, "right", { + get: function () { + return { + x: this.maxX, + y: this.y + this.height / 2, + }; + }, + enumerable: false, + configurable: true + }); + Object.defineProperty(BBox.prototype, "bottom", { + get: function () { + return { + x: this.x + this.width / 2, + y: this.maxY, + }; + }, + enumerable: false, + configurable: true + }); + Object.defineProperty(BBox.prototype, "left", { + get: function () { + return { + x: this.minX, + y: this.y + this.height / 2, + }; + }, + enumerable: false, + configurable: true + }); + // end 计算属性 + /** + * 包围盒是否相等 + * @param {BBox} bbox 包围盒 + * @returns 包围盒是否相等 + */ + BBox.prototype.isEqual = function (bbox) { + return this.x === bbox.x && this.y === bbox.y && this.width === bbox.width && this.height === bbox.height; + }; + /** + * 是否包含了另一个包围盒 + * @param child + */ + BBox.prototype.contains = function (child) { + return child.minX >= this.minX && child.maxX <= this.maxX && child.minY >= this.minY && child.maxY <= this.maxY; + }; + /** + * 克隆包围盒 + * @returns 包围盒 + */ + BBox.prototype.clone = function () { + return new BBox(this.x, this.y, this.width, this.height); + }; + /** + * 取并集 + * @param subBBox + */ + BBox.prototype.add = function () { + var subBBox = []; + for (var _i = 0; _i < arguments.length; _i++) { + subBBox[_i] = arguments[_i]; + } + var bbox = this.clone(); + each$2(subBBox, function (b) { + bbox.x = Math.min(b.x, bbox.x); + bbox.y = Math.min(b.y, bbox.y); + bbox.width = Math.max(b.maxX, bbox.maxX) - bbox.x; + bbox.height = Math.max(b.maxY, bbox.maxY) - bbox.y; + }); + return bbox; + }; + /** + * 取交集 + * @param subBBox + */ + BBox.prototype.merge = function () { + var subBBox = []; + for (var _i = 0; _i < arguments.length; _i++) { + subBBox[_i] = arguments[_i]; + } + var bbox = this.clone(); + each$2(subBBox, function (b) { + bbox.x = Math.max(b.x, bbox.x); + bbox.y = Math.max(b.y, bbox.y); + bbox.width = Math.min(b.maxX, bbox.maxX) - bbox.x; + bbox.height = Math.min(b.maxY, bbox.maxY) - bbox.y; + }); + return bbox; + }; + /** + * bbox 剪裁 + * @param subBBox + * @param direction + */ + BBox.prototype.cut = function (subBBox, direction) { + var width = subBBox.width; + var height = subBBox.height; + switch (direction) { + case DIRECTION.TOP: + case DIRECTION.TOP_LEFT: + case DIRECTION.TOP_RIGHT: + return BBox.fromRange(this.minX, this.minY + height, this.maxX, this.maxY); + case DIRECTION.RIGHT: + case DIRECTION.RIGHT_TOP: + case DIRECTION.RIGHT_BOTTOM: + return BBox.fromRange(this.minX, this.minY, this.maxX - width, this.maxY); + case DIRECTION.BOTTOM: + case DIRECTION.BOTTOM_LEFT: + case DIRECTION.BOTTOM_RIGHT: + return BBox.fromRange(this.minX, this.minY, this.maxX, this.maxY - height); + case DIRECTION.LEFT: + case DIRECTION.LEFT_TOP: + case DIRECTION.LEFT_BOTTOM: + return BBox.fromRange(this.minX + width, this.minY, this.maxX, this.maxY); + default: + // 其他情况不裁剪，原样返回 + return this; + } + }; + /** + * 收缩形成新的 + * @param gap + */ + BBox.prototype.shrink = function (gap) { + var top = gap[0], right = gap[1], bottom = gap[2], left = gap[3]; + return new BBox(this.x + left, this.y + top, this.width - left - right, this.height - top - bottom); + }; + /** + * 扩张形成新的 + * @param gap + */ + BBox.prototype.expand = function (gap) { + var top = gap[0], right = gap[1], bottom = gap[2], left = gap[3]; + return new BBox(this.x - left, this.y - top, this.width + left + right, this.height + top + bottom); + }; + /** + * get the gap of two bbox, if not exceed, then 0 + * @param bbox + * @returns [top, right, bottom, left] + */ + BBox.prototype.exceed = function (bbox) { + return [ + Math.max(-this.minY + bbox.minY, 0), + Math.max(this.maxX - bbox.maxX, 0), + Math.max(this.maxY - bbox.maxY, 0), + Math.max(-this.minX + bbox.minX, 0), + ]; + }; + /** + * 是否碰撞 + * @param bbox + */ + BBox.prototype.collide = function (bbox) { + return this.minX < bbox.maxX && this.maxX > bbox.minX && + this.minY < bbox.maxY && this.maxY > bbox.minY; + }; + /** + * 获取包围盒大小 + * @returns 包围盒大小 + */ + BBox.prototype.size = function () { + return this.width * this.height; + }; + /** + * 点是否在 bbox 中 + * @param p + */ + BBox.prototype.isPointIn = function (p) { + return p.x >= this.minX && p.x <= this.maxX && p.y >= this.minY && p.y <= this.maxY; + }; + return BBox; +}()); +/** + * 将 bbox 转换成 points + * @param bbox + */ +function toPoints(bbox) { + return [ + [bbox.minX, bbox.minY], + [bbox.maxX, bbox.minY], + [bbox.maxX, bbox.maxY], + [bbox.minX, bbox.maxY], + ]; +} + +/** + * @ignore + * Gets x dimension length + * @param coordinate + * @returns x dimension length + */ +function getXDimensionLength(coordinate) { + if (coordinate.isPolar && !coordinate.isTransposed) { + // 极坐标系下 width 为弧长 + return (coordinate.endAngle - coordinate.startAngle) * coordinate.getRadius(); + } + // 直角坐标系 + var start = coordinate.convert({ x: 0, y: 0 }); + var end = coordinate.convert({ x: 1, y: 0 }); + // 坐标系有可能发生 transpose 等变换，所有通过两点之间的距离进行计算 + return Math.sqrt(Math.pow(end.x - start.x, 2) + Math.pow(end.y - start.y, 2)); +} +/** + * @ignore + * Determines whether full circle is + * @param coordinate + * @returns true if full circle + */ +function isFullCircle(coordinate) { + if (coordinate.isPolar) { + var startAngle = coordinate.startAngle, endAngle = coordinate.endAngle; + return endAngle - startAngle === Math.PI * 2; + } + return false; +} +/** + * @ignore + * 获取当前点到坐标系圆心的距离 + * @param coordinate 坐标系 + * @param point 当前点 + * @returns distance to center + */ +function getDistanceToCenter(coordinate, point) { + var center = coordinate.getCenter(); + return Math.sqrt(Math.pow((point.x - center.x), 2) + Math.pow((point.y - center.y), 2)); +} +/** + * @ignore + * 坐标点是否在坐标系中 + * @param coordinate + * @param point + */ +function isPointInCoordinate(coordinate, point) { + var result = false; + if (coordinate) { + if (coordinate.type === 'theta') { + var start = coordinate.start, end = coordinate.end; + result = isBetween$2(point.x, start.x, end.x) && isBetween$2(point.y, start.y, end.y); + } + else { + var invertPoint = coordinate.invert(point); + result = isBetween$2(invertPoint.x, 0, 1) && isBetween$2(invertPoint.y, 0, 1); + } + } + return result; +} +/** + * @ignore + * 获取点到圆心的连线与水平方向的夹角 + */ +function getAngleByPoint(coordinate, point) { + var center = coordinate.getCenter(); + return Math.atan2(point.y - center.y, point.x - center.x); +} +/** + * @ignore + * 获取同坐标系范围相同的剪切区域 + * @param coordinate + * @returns + */ +function getCoordinateClipCfg(coordinate, margin) { + if (margin === void 0) { margin = 0; } + var start = coordinate.start, end = coordinate.end; + var width = coordinate.getWidth(); + var height = coordinate.getHeight(); + if (coordinate.isPolar) { + var startAngle_1 = coordinate.startAngle, endAngle_1 = coordinate.endAngle; + var center_1 = coordinate.getCenter(); + var radius_1 = coordinate.getRadius(); + return { + type: 'path', + startState: { + path: getSectorPath(center_1.x, center_1.y, radius_1 + margin, startAngle_1, startAngle_1), + }, + endState: function (ratio) { + var diff = (endAngle_1 - startAngle_1) * ratio + startAngle_1; + var path = getSectorPath(center_1.x, center_1.y, radius_1 + margin, startAngle_1, diff); + return { + path: path, + }; + }, + attrs: { + path: getSectorPath(center_1.x, center_1.y, radius_1 + margin, startAngle_1, endAngle_1), + }, + }; + } + var endState; + if (coordinate.isTransposed) { + endState = { + height: height + margin * 2, + }; + } + else { + endState = { + width: width + margin * 2, + }; + } + return { + type: 'rect', + startState: { + x: start.x - margin, + y: end.y - margin, + width: coordinate.isTransposed ? width + margin * 2 : 0, + height: coordinate.isTransposed ? 0 : height + margin * 2, + }, + endState: endState, + attrs: { + x: start.x - margin, + y: end.y - margin, + width: width + margin * 2, + height: height + margin * 2, + }, + }; +} +/** + * 获取坐标系范围的 BBox + * @param coordinate + * @param margin + */ +function getCoordinateBBox(coordinate, margin) { + if (margin === void 0) { margin = 0; } + var start = coordinate.start, end = coordinate.end; + var width = coordinate.getWidth(); + var height = coordinate.getHeight(); + var minX = Math.min(start.x, end.x); + var minY = Math.min(start.y, end.y); + return BBox.fromRange(minX - margin, minY - margin, minX + width + margin, minY + height + margin); +} + +var dateRegex = /^(?:(?!0000)[0-9]{4}([-/.]+)(?:(?:0?[1-9]|1[0-2])\1(?:0?[1-9]|1[0-9]|2[0-8])|(?:0?[13-9]|1[0-2])\1(?:29|30)|(?:0?[13578]|1[02])\1(?:31))|(?:[0-9]{2}(?:0[48]|[2468][048]|[13579][26])|(?:0[48]|[2468][048]|[13579][26])00)([-/.]+)0?2\2(?:29))(\s+([01]|([01][0-9]|2[0-3])):([0-9]|[0-5][0-9]):([0-9]|[0-5][0-9]))?$/; +/** + * 获取字段对应数据的类型 + * @param field 数据字段名 + * @param data 数据源 + * @returns default type 返回对应的数据类型 + */ +function getDefaultType(value) { + var type = 'linear'; + if (dateRegex.test(value)) { + type = 'timeCat'; + } + else if (isString$3(value)) { + type = 'cat'; + } + return type; +} +/** + * @ignore + * 为指定的 `field` 字段数据创建 scale + * @param field 字段名 + * @param [data] 数据集，可为空 + * @param [scaleDef] 列定义，可为空 + * @returns scale 返回创建的 Scale 实例 + */ +function createScaleByField(field, data, scaleDef) { + var validData = data || []; + if (isNumber$4(field) || (isNil(firstValue(validData, field)) && isEmpty$1(scaleDef))) { + var Identity = getClass('identity'); + return new Identity({ + field: field.toString(), + values: [field], + }); + } + var values = valuesOfKey(validData, field); + // 如果已经定义过这个度量 + var type = get$3(scaleDef, 'type', getDefaultType(values[0])); + var ScaleCtor = getClass(type); + return new ScaleCtor(__assign$r({ field: field, + values: values }, scaleDef)); +} +/** + * @ignore + * 同步 scale + * @todo 是否可以通过 scale.update() 方法进行更新 + * @param scale 需要同步的 scale 实例 + * @param newScale 同步源 Scale + */ +function syncScale(scale, newScale) { + if (scale.type !== 'identity' && newScale.type !== 'identity') { + var obj = {}; + for (var k in newScale) { + if (Object.prototype.hasOwnProperty.call(newScale, k)) { + obj[k] = newScale[k]; + } + } + scale.change(obj); + } +} +/** + * @ignore + * get the scale name, if alias exist, return alias, or else field + * @param scale + * @returns the name of field + */ +function getName(scale) { + return scale.alias || scale.field; +} +/** + * 根据 scale values 和 coordinate 获取分类默认 range + * @param scale 需要获取的 scale 实例 + * @param coordinate coordinate 实例 + * @param theme theme + */ +function getDefaultCategoryScaleRange(scale, coordinate, theme) { + var values = scale.values; + var count = values.length; + var range; + if (count === 1) { + range = [0.5, 1]; // 只有一个分类时,防止计算出现 [0.5,0.5] 的状态 + } + else { + var widthRatio = 1; + var offset = 0; + if (isFullCircle(coordinate)) { + if (!coordinate.isTransposed) { + range = [0, 1 - 1 / count]; + } + else { + widthRatio = get$3(theme, 'widthRatio.multiplePie', 1 / 1.3); + offset = (1 / count) * widthRatio; + range = [offset / 2, 1 - offset / 2]; + } + } + else { + offset = 1 / count / 2; // 两边留下分类空间的一半 + range = [offset, 1 - offset]; // 坐标轴最前面和最后面留下空白防止绘制柱状图时 + } + } + return range; +} +/** + * @function y轴scale的max + * @param {yScale} + */ +function getMaxScale(scale) { + // 过滤values[]中 NaN/undefined/null 等 + var values = scale.values.filter(function (item) { return !isNil(item) && !isNaN(item); }); + return Math.max.apply(Math, __spreadArrays$1(values, [isNil(scale.max) ? -Infinity : scale.max])); +} + +/** + * @ignore + * get axis relative region ( 0 ~ 1) by direction when coordinate is rect + * @param direction + * @returns axis coordinate region + */ +function getLineAxisRelativeRegion(direction) { + var start; + var end; + switch (direction) { + case DIRECTION.TOP: + start = { x: 0, y: 1 }; + end = { x: 1, y: 1 }; + break; + case DIRECTION.RIGHT: + start = { x: 1, y: 0 }; + end = { x: 1, y: 1 }; + break; + case DIRECTION.BOTTOM: + start = { x: 0, y: 0 }; + end = { x: 1, y: 0 }; + break; + case DIRECTION.LEFT: + start = { x: 0, y: 0 }; + end = { x: 0, y: 1 }; + break; + default: + start = end = { x: 0, y: 0 }; + } + return { start: start, end: end }; +} +/** + * @ignore + * get axis relative region ( 0 ~ 1) by direction when coordinate is polar + * @param coordinate + * @returns axis coordinate region + */ +function getCircleAxisRelativeRegion(coordinate) { + var start; + var end; + if (coordinate.isTransposed) { + start = { + x: 0, + y: 0, + }; + end = { + x: 1, + y: 0, + }; + } + else { + start = { + x: 0, + y: 0, + }; + end = { + x: 0, + y: 1, + }; + } + return { start: start, end: end }; +} +/** + * @ignore + * get the axis region from coordinate + * @param coordinate + * @param direction + * @returns the axis region (start point, end point) + */ +function getAxisRegion(coordinate, direction) { + var region = { start: { x: 0, y: 0 }, end: { x: 0, y: 0 } }; + if (coordinate.isRect) { + region = getLineAxisRelativeRegion(direction); + } + else if (coordinate.isPolar) { + region = getCircleAxisRelativeRegion(coordinate); + } + var start = region.start, end = region.end; + return { + start: coordinate.convert(start), + end: coordinate.convert(end), + }; +} +/** + * @ignore + * whether the axis isVertical + * @param region + * @returns isVertical + */ +function isVertical(region) { + var start = region.start, end = region.end; + return start.x === end.x; +} +/** + * @ignore + * get factor by region (real position) + * @param region + * @param center + * @returns factor + */ +function getAxisFactorByRegion(region, center) { + var start = region.start, end = region.end; + var isAxisVertical = isVertical(region); + // 垂直 + if (isAxisVertical) { + // 左方,从下到上、右方,从上到下 + if ((start.y - end.y) * (center.x - start.x) > 0) { + return 1; + } + else { + return -1; + } + } + else { + // 下方,从左到右、上方,从右到做 + if ((end.x - start.x) * (start.y - center.y) > 0) { + return -1; + } + else { + return 1; + } + } +} +/** + * @ignore + * get the axis cfg from theme, will mix the common cfg of legend theme + * + * @param theme view theme object + * @param direction axis direction + * @returns axis theme cfg + */ +function getAxisThemeCfg(theme, direction) { + var axisTheme = get$3(theme, ['components', 'axis'], {}); + return deepMix({}, get$3(axisTheme, ['common'], {}), deepMix({}, get$3(axisTheme, [direction], {}))); +} +/** + * get the options of axis title，mix the cfg from theme, avoid common themeCfg not work + * @param theme + * @param direction + * @param axisOptions + * @returns axis title options + */ +function getAxisTitleOptions(theme, direction, axisOptions) { + var axisTheme = get$3(theme, ['components', 'axis'], {}); + return deepMix({}, get$3(axisTheme, ['common', 'title'], {}), deepMix({}, get$3(axisTheme, [direction, 'title'], {})), axisOptions); +} +/** + * @ignore + * get circle axis center and radius + * @param coordinate + */ +function getCircleAxisCenterRadius(coordinate) { + // @ts-ignore + var x = coordinate.x, y = coordinate.y, center = coordinate.circleCenter; + var isReflectY = y.start > y.end; + var start = coordinate.isTransposed + ? coordinate.convert({ + x: isReflectY ? 0 : 1, + y: 0, + }) + : coordinate.convert({ + x: 0, + y: isReflectY ? 0 : 1, + }); + var startVector = [start.x - center.x, start.y - center.y]; + var normalVector = [1, 0]; + var startAngle = start.y > center.y ? angle(startVector, normalVector) : angle(startVector, normalVector) * -1; + var endAngle = startAngle + (x.end - x.start); + var radius = Math.sqrt(Math.pow((start.x - center.x), 2) + Math.pow((start.y - center.y), 2)); + return { + center: center, + radius: radius, + startAngle: startAngle, + endAngle: endAngle, + }; +} +/** + * @ignore + * 从配置中获取单个字段的 axis 配置 + * @param axes + * @param field + * @returns the axis option of field + */ +function getAxisOption(axes, field) { + if (isBoolean(axes)) { + return axes === false ? false : {}; + } + return get$3(axes, [field]); +} +/** + * @ignore + * 如果配置了 position，则使用配置 + * @param axisOption + * @param def + */ +function getAxisDirection(axisOption, def) { + return get$3(axisOption, 'position', def); +} +/** + * 获取 axis 的 title 文本 + * @param scale + * @param axisOption + */ +function getAxisTitleText(scale, axisOption) { + return get$3(axisOption, ['title', 'text'], getName(scale)); +} + +/** + * facet 基类 + * - 定义生命周期，方便自定义 facet + * - 提供基础的生命流程方法 + * + * 生命周期： + * + * 初始化 init + * 1. 初始化容器 + * 2. 数据分面，生成分面布局信息 + * + * 渲染阶段 render + * 1. view 创建 + * 2. title + * 3. axis + * + * 清除阶段 clear + * 1. 清除 view + * + * 销毁阶段 destroy + * 1. clear + * 2. 清除事件 + * 3. 清除 group + */ +var Facet$2 = /** @class */ (function () { + function Facet(view, cfg) { + /** 是否销毁 */ + this.destroyed = false; + /** 分面之后的所有分面数据结构 */ + this.facets = []; + this.view = view; + this.cfg = deepMix({}, this.getDefaultCfg(), cfg); + } + /** + * 初始化过程 + */ + Facet.prototype.init = function () { + // 初始化容器 + if (!this.container) { + this.container = this.createContainer(); + } + // 生成分面布局信息 + var data = this.view.getData(); + this.facets = this.generateFacets(data); + }; + /** + * 渲染分面，由上层 view 调用。包括： + * - 分面 view + * - 轴 + * - title + * + * 子类可以复写，添加一些其他组件，比如滚动条等 + */ + Facet.prototype.render = function () { + this.renderViews(); + }; + /** + * 更新 facet + */ + Facet.prototype.update = function () { + // 其实不用做任何事情，因为 facet 最终生成的 View 和 Geometry 都在父 view 的更新中处理了 + }; + /** + * 清空，clear 之后如果还需要使用，需要重新调用 init 初始化过程 + * 一般在数据有变更的时候调用，重新进行数据的分面逻辑 + */ + Facet.prototype.clear = function () { + this.clearFacetViews(); + }; + /** + * 销毁 + */ + Facet.prototype.destroy = function () { + this.clear(); + if (this.container) { + this.container.remove(true); + this.container = undefined; + } + this.destroyed = true; + this.view = undefined; + this.facets = []; + }; + /** + * 根据 facet 生成 view，可以给上层自定义使用 + * @param facet + */ + Facet.prototype.facetToView = function (facet) { + var region = facet.region, data = facet.data, _a = facet.padding, padding = _a === void 0 ? this.cfg.padding : _a; + var view = this.view.createView({ + region: region, + padding: padding, + }); + // 设置分面的数据 + view.data(data || []); + facet.view = view; + // 前置钩子 + this.beforeEachView(view, facet); + var eachView = this.cfg.eachView; + if (eachView) { + eachView(view, facet); + } + // 后置钩子 + this.afterEachView(view, facet); + return view; + }; + // 创建容器 + Facet.prototype.createContainer = function () { + var foregroundGroup = this.view.getLayer(LAYER.FORE); + return foregroundGroup.addGroup(); + }; + /** + * 初始化 view + */ + Facet.prototype.renderViews = function () { + this.createFacetViews(); + }; + /** + * 创建 分面 view + */ + Facet.prototype.createFacetViews = function () { + var _this = this; + // 使用分面数据 创建分面 view + return this.facets.map(function (facet) { + return _this.facetToView(facet); + }); + }; + /** + * 从 view 中清除 facetView + */ + Facet.prototype.clearFacetViews = function () { + var _this = this; + // 从 view 中移除分面 view + each$2(this.facets, function (facet) { + if (facet.view) { + _this.view.removeView(facet.view); + facet.view = undefined; + } + }); + }; + // 其他一些提供给子类使用的方法 + /** + * 获取这个字段对应的所有值，数组 + * @protected + * @param data 数据 + * @param field 字段名 + * @return 字段对应的值 + */ + Facet.prototype.getFieldValues = function (data, field) { + var rst = []; + var cache = {}; + // 去重、去除 Nil 值 + each$2(data, function (d) { + var value = d[field]; + if (!isNil(value) && !cache[value]) { + rst.push(value); + cache[value] = true; + } + }); + return rst; + }; + /** + * 获得每个分面的 region，平分区域 + * @param rows row 总数 + * @param cols col 总数 + * @param xIndex x 方向 index + * @param yIndex y 方向 index + */ + Facet.prototype.getRegion = function (rows, cols, xIndex, yIndex) { + // x, y 方向均分 100% 宽高 + var xRatio = 1 / (cols === 0 ? 1 : cols); + var yRatio = 1 / (rows === 0 ? 1 : rows); + var start = { + x: xRatio * xIndex, + y: yRatio * yIndex, + }; + var end = { + x: xRatio * (xIndex + 1), + y: yRatio * (yIndex + 1), + }; + return { + start: start, + end: end, + }; + }; + Facet.prototype.getDefaultCfg = function () { + return { + eachView: undefined, + showTitle: true, + padding: 10, + fields: [], + }; + }; + /** + * 默认的 title 样式，因为有的分面是 title，有的分面配置是 columnTitle、rowTitle + */ + Facet.prototype.getDefaultTitleCfg = function () { + // @ts-ignore + var fontFamily = this.view.getTheme().fontFamily; + return { + style: { + fontSize: 14, + fill: '#666', + fontFamily: fontFamily, + }, + }; + }; + /** + * 处理 axis 的默认配置 + * @param view + * @param facet + */ + Facet.prototype.processAxis = function (view, facet) { + var options = view.getOptions(); + var coordinateOption = options.coordinate; + var geometries = view.geometries; + var coordinateType = get$3(coordinateOption, 'type', 'rect'); + if (coordinateType === 'rect' && geometries.length) { + if (isNil(options.axes)) { + // @ts-ignore + options.axes = {}; + } + var axes = options.axes; + var _a = geometries[0].getXYFields(), x = _a[0], y = _a[1]; + var xOption = getAxisOption(axes, x); + var yOption = getAxisOption(axes, y); + if (xOption !== false) { + options.axes[x] = this.getXAxisOption(x, axes, xOption, facet); + } + if (yOption !== false) { + options.axes[y] = this.getYAxisOption(y, axes, yOption, facet); + } + } + }; + /** + * 获取分面数据 + * @param conditions + */ + Facet.prototype.getFacetDataFilter = function (conditions) { + return function (datum) { + // 过滤出全部满足条件的数据 + return every(conditions, function (condition) { + var field = condition.field, value = condition.value; + if (!isNil(value) && field) { + return datum[field] === value; + } + return true; + }); + }; + }; + return Facet; +}()); + +/** + * 所有的 Facet 类 + */ +var Facets = {}; +/** + * 根据 type 获取 facet 类 + * @param type 分面类型 + */ +var getFacet = function (type) { + return Facets[lowerCase$1(type)]; +}; +/** + * 注册一个 Facet 类 + * @param type 分面类型 + * @param ctor 分面类 + */ +var registerFacet = function (type, ctor) { + Facets[lowerCase$1(type)] = ctor; +}; + +/** + * Action 的基类 + */ +var Action = /** @class */ (function () { + function Action(context, cfg) { + this.context = context; + this.cfg = cfg; + context.addAction(this); + } + /** + * 设置配置项传入的值 + * @param cfg + */ + Action.prototype.applyCfg = function (cfg) { + mix(this, cfg); + }; + /** + * Inits action，提供给子类用于继承 + */ + Action.prototype.init = function () { + this.applyCfg(this.cfg); + }; + /** + * Destroys action + */ + Action.prototype.destroy = function () { + // 移除 action + this.context.removeAction(this); + // 清空 + this.context = null; + }; + return Action; +}()); +var Action$1 = Action; + +/** 回调函数构建的 Action */ +var CallbackAction = /** @class */ (function (_super) { + __extends$e(CallbackAction, _super); + function CallbackAction() { + return _super !== null && _super.apply(this, arguments) || this; + } + /** + * 执行 + */ + CallbackAction.prototype.execute = function () { + if (this.callback) { + this.callback(this.context); + } + }; + /** + * 销毁 + */ + CallbackAction.prototype.destroy = function () { + _super.prototype.destroy.call(this); + this.callback = null; + }; + return CallbackAction; +}(Action$1)); + +// Action 类的缓存 +var ActionCache = {}; +/** + * 根据名称获取 Action 实例 + * @param actionName - action 的名称 + * @param context 上下文 + * @returns Action 实例 + */ +function createAction(actionName, context) { + var actionOption = ActionCache[actionName]; + var action = null; + if (actionOption) { + var ActionClass = actionOption.ActionClass, cfg = actionOption.cfg; + action = new ActionClass(context, cfg); + action.name = actionName; + action.init(); + } + return action; +} +/** + * 根据 action 的 name 获取定义的类 + * @param actionName action 的 name + */ +function getActionClass(actionName) { + var actionOption = ActionCache[actionName]; + return get$3(actionOption, 'ActionClass'); +} +/** + * 注册 Action + * @param actionName - action 的名称 + * @param ActionClass - 继承自 action 的类 + */ +function registerAction(actionName, ActionClass, cfg) { + ActionCache[actionName] = { + ActionClass: ActionClass, + cfg: cfg, + }; +} +/** + * 根据回调函数获取 Action 实例 + * @param callback - action 的回调函数 + * @param context 上下文 + * @returns Action 实例 + */ +function createCallbackAction(callback, context) { + var action = new CallbackAction(context); + action.callback = callback; + action.name = 'callback'; + return action; +} + +function _points2path(points, isInCircle) { + var path = []; + if (points.length) { + path.push(['M', points[0].x, points[0].y]); + for (var i = 1, length_1 = points.length; i < length_1; i += 1) { + var item = points[i]; + path.push(['L', item.x, item.y]); + } + if (isInCircle) { + path.push(['Z']); + } + } + return path; +} +function _convertArr(arr, coord) { + var tmp = [arr[0]]; + for (var i = 1, len = arr.length; i < len; i = i + 2) { + var point = coord.convert({ + x: arr[i], + y: arr[i + 1], + }); + tmp.push(point.x, point.y); + } + return tmp; +} +function _convertArcPath(path, coord) { + var isTransposed = coord.isTransposed; + var r = path[1]; + var x = path[6]; + var y = path[7]; + var point = coord.convert({ x: x, y: y }); + var direction = isTransposed ? 0 : 1; + return ['A', r, r, 0, 0, direction, point.x, point.y]; +} +function _convertPolarPath(pre, cur, coord) { + var isTransposed = coord.isTransposed, startAngle = coord.startAngle, endAngle = coord.endAngle; + var prePoint = pre[0].toLowerCase() === 'a' + ? { + x: pre[6], + y: pre[7], + } + : { + x: pre[1], + y: pre[2], + }; + var curPoint = { + x: cur[1], + y: cur[2], + }; + var rst = []; + var xDim = isTransposed ? 'y' : 'x'; + var angleRange = Math.abs(curPoint[xDim] - prePoint[xDim]) * (endAngle - startAngle); + var direction = curPoint[xDim] >= prePoint[xDim] ? 1 : 0; // 圆弧的方向 + var flag = angleRange > Math.PI ? 1 : 0; // 大弧还是小弧标志位 + var convertPoint = coord.convert(curPoint); + var r = getDistanceToCenter(coord, convertPoint); + if (r >= 0.5) { + // 小于1像素的圆在图像上无法识别 + if (angleRange === Math.PI * 2) { + var middlePoint = { + x: (curPoint.x + prePoint.x) / 2, + y: (curPoint.y + prePoint.y) / 2, + }; + var middleConvertPoint = coord.convert(middlePoint); + rst.push(['A', r, r, 0, flag, direction, middleConvertPoint.x, middleConvertPoint.y]); + rst.push(['A', r, r, 0, flag, direction, convertPoint.x, convertPoint.y]); + } + else { + rst.push(['A', r, r, 0, flag, direction, convertPoint.x, convertPoint.y]); + } + } + return rst; +} +// 当存在整体的圆时，去除圆前面和后面的线，防止出现直线穿过整个圆的情形 +function _filterFullCirleLine(path) { + each$2(path, function (subPath, index) { + var cur = subPath; + if (cur[0].toLowerCase() === 'a') { + var pre = path[index - 1]; + var next = path[index + 1]; + if (next && next[0].toLowerCase() === 'a') { + if (pre && pre[0].toLowerCase() === 'l') { + pre[0] = 'M'; + } + } + else if (pre && pre[0].toLowerCase() === 'a') { + if (next && next[0].toLowerCase() === 'l') { + next[0] = 'M'; + } + } + } + }); +} +/** + * @ignore + * 计算光滑的贝塞尔曲线 + */ +var smoothBezier$1 = function (points, smooth, isLoop, constraint) { + var cps = []; + var hasConstraint = !!constraint; + var prevPoint; + var nextPoint; + var min; + var max; + var nextCp0; + var cp1; + var cp0; + if (hasConstraint) { + min = constraint[0], max = constraint[1]; + for (var i = 0, l = points.length; i < l; i++) { + var point = points[i]; + min = min$5([0, 0], min, point); + max = max$6([0, 0], max, point); + } + } + for (var i = 0, len = points.length; i < len; i++) { + var point = points[i]; + if (i === 0 && !isLoop) { + cp0 = point; + } + else if (i === len - 1 && !isLoop) { + cp1 = point; + cps.push(cp0); + cps.push(cp1); + } + else { + prevPoint = points[isLoop ? (i ? i - 1 : len - 1) : i - 1]; + nextPoint = points[isLoop ? (i + 1) % len : i + 1]; + var v = [0, 0]; + v = sub$1(v, nextPoint, prevPoint); + v = scale$4(v, v, smooth); + var d0 = distance$a(point, prevPoint); + var d1 = distance$a(point, nextPoint); + var sum = d0 + d1; + if (sum !== 0) { + d0 /= sum; + d1 /= sum; + } + var v1 = scale$4([0, 0], v, -d0); + var v2 = scale$4([0, 0], v, d1); + cp1 = add$3([0, 0], point, v1); + nextCp0 = add$3([0, 0], point, v2); + // 下一个控制点必须在这个点和下一个点之间 + nextCp0 = min$5([0, 0], nextCp0, max$6([0, 0], nextPoint, point)); + nextCp0 = max$6([0, 0], nextCp0, min$5([0, 0], nextPoint, point)); + // 重新计算 cp1 的值 + v1 = sub$1([0, 0], nextCp0, point); + v1 = scale$4([0, 0], v1, -d0 / d1); + cp1 = add$3([0, 0], point, v1); + // 上一个控制点必须要在上一个点和这一个点之间 + cp1 = min$5([0, 0], cp1, max$6([0, 0], prevPoint, point)); + cp1 = max$6([0, 0], cp1, min$5([0, 0], prevPoint, point)); + // 重新计算 nextCp0 的值 + v2 = sub$1([0, 0], point, cp1); + v2 = scale$4([0, 0], v2, d1 / d0); + nextCp0 = add$3([0, 0], point, v2); + if (hasConstraint) { + cp1 = max$6([0, 0], cp1, min); + cp1 = min$5([0, 0], cp1, max); + nextCp0 = max$6([0, 0], nextCp0, min); + nextCp0 = min$5([0, 0], nextCp0, max); + } + cps.push(cp0); + cps.push(cp1); + cp0 = nextCp0; + } + } + if (isLoop) { + cps.push(cps.shift()); + } + return cps; +}; +/** + * @ignore + * 贝塞尔曲线 + */ +function catmullRom2bezier$1(crp, z, constraint) { + var isLoop = !!z; + var pointList = []; + for (var i = 0, l = crp.length; i < l; i += 2) { + pointList.push([crp[i], crp[i + 1]]); + } + var controlPointList = smoothBezier$1(pointList, 0.4, isLoop, constraint); + var len = pointList.length; + var d1 = []; + var cp1; + var cp2; + var p; + for (var i = 0; i < len - 1; i++) { + cp1 = controlPointList[i * 2]; + cp2 = controlPointList[i * 2 + 1]; + p = pointList[i + 1]; + d1.push(['C', cp1[0], cp1[1], cp2[0], cp2[1], p[0], p[1]]); + } + if (isLoop) { + cp1 = controlPointList[len]; + cp2 = controlPointList[len + 1]; + p = pointList[0]; + d1.push(['C', cp1[0], cp1[1], cp2[0], cp2[1], p[0], p[1]]); + } + return d1; +} +/** + * @ignore + * 将点连接成路径 path + */ +function getLinePath$1(points, isInCircle) { + return _points2path(points, isInCircle); +} +/** + * @ignore + * 根据关键点获取限定了范围的平滑线 + */ +function getSplinePath$1(points, isInCircle, constaint) { + var data = []; + var first = points[0]; + var prePoint = null; + if (points.length <= 2) { + // 两点以内直接绘制成路径 + return getLinePath$1(points, isInCircle); + } + for (var i = 0, len = points.length; i < len; i++) { + var point = points[i]; + if (!prePoint || !(prePoint.x === point.x && prePoint.y === point.y)) { + data.push(point.x); + data.push(point.y); + prePoint = point; + } + } + var constraint = constaint || [ + // 范围 + [0, 0], + [1, 1], + ]; + var splinePath = catmullRom2bezier$1(data, isInCircle, constraint); + splinePath.unshift(['M', first.x, first.y]); + return splinePath; +} +/** + * @ignore + * 将归一化后的路径数据转换成坐标 + */ +function convertNormalPath(coord, path) { + var tmp = []; + each$2(path, function (subPath) { + var action = subPath[0]; + switch (action.toLowerCase()) { + case 'm': + case 'l': + case 'c': + tmp.push(_convertArr(subPath, coord)); + break; + case 'a': + tmp.push(_convertArcPath(subPath, coord)); + break; + case 'z': + default: + tmp.push(subPath); + break; + } + }); + return tmp; +} +/** + * @ignore + * 将路径转换为极坐标下的真实路径 + */ +function convertPolarPath(coord, path) { + var tmp = []; + var pre; + var cur; + var transposed; + var equals; + each$2(path, function (subPath, index) { + var action = subPath[0]; + switch (action.toLowerCase()) { + case 'm': + case 'c': + case 'q': + tmp.push(_convertArr(subPath, coord)); + break; + case 'l': + pre = path[index - 1]; + cur = subPath; + transposed = coord.isTransposed; + // 是否半径相同，转换成圆弧 + equals = transposed ? pre[pre.length - 2] === cur[1] : pre[pre.length - 1] === cur[2]; + if (equals) { + tmp = tmp.concat(_convertPolarPath(pre, cur, coord)); + } + else { + // y 不相等，所以直接转换 + tmp.push(_convertArr(subPath, coord)); + } + break; + case 'a': + tmp.push(_convertArcPath(subPath, coord)); + break; + case 'z': + default: + tmp.push(subPath); + break; + } + }); + _filterFullCirleLine(tmp); // 过滤多余的直线 + return tmp; +} + +function getMaskBBox(context, tolerance) { + var event = context.event; + var maskShape = event.target; + var maskBBox = maskShape.getCanvasBBox(); + // 如果 bbox 过小则不返回 + if (!(maskBBox.width >= tolerance || maskBBox.height >= tolerance)) { + return null; + } + return maskBBox; +} +function getMaskPath(context, tolerance) { + var event = context.event; + var maskShape = event.target; + var maskBBox = maskShape.getCanvasBBox(); + // 如果 bbox 过小则不返回 + if (!(maskBBox.width >= tolerance || maskBBox.height >= tolerance)) { + return null; + } + return maskShape.attr('path'); +} +/** + * 获取当前事件相关的图表元素 + * @param context 交互的上下文 + * @ignore + */ +function getCurrentElement(context) { + var event = context.event; + var element; + var target = event.target; + if (target) { + element = target.get('element'); + } + return element; +} +/** + * 获取委托对象 + * @param context 上下文 + * @ignore + */ +function getDelegationObject(context) { + var event = context.event; + var target = event.target; + var delegateObject; + if (target) { + delegateObject = target.get('delegateObject'); + } + return delegateObject; +} +function isElementChange(context) { + var event = context.event.gEvent; + // 在同一个 element 内部移动，label 和 shape 之间 + if (event && event.fromShape && event.toShape && event.fromShape.get('element') === event.toShape.get('element')) { + return false; + } + return true; +} +/** + * 是否是列表组件 + * @param delegateObject 委托对象 + * @ignore + */ +function isList(delegateObject) { + return delegateObject && delegateObject.component && delegateObject.component.isList(); +} +/** + * 是否是滑块组件 + * @param delegateObject 委托对象 + * @ignore + */ +function isSlider(delegateObject) { + return delegateObject && delegateObject.component && delegateObject.component.isSlider(); +} +/** + * 是否由 mask 触发 + * @param context 上下文 + * @ignore + */ +function isMask(context) { + var event = context.event; + var target = event.target; + return target && target.get('name') === 'mask'; +} +/** + * 获取被遮挡的 elements + * @param context 上下文 + * @ignore + */ +function getMaskedElements(context, tolerance) { + var target = context.event.target; + if (target.get('type') === 'path') { + var maskPath = getMaskPath(context, tolerance); + if (!maskPath) { + return; + } + return getElementsByPath(context.view, maskPath); + } + var maskBBox = getMaskBBox(context, tolerance); + // 如果 bbox 过小则不返回 + if (!maskBBox) { + return null; + } + return getIntersectElements(context.view, maskBBox); +} +/** + * @ignore + */ +function getSiblingMaskElements(context, sibling, tolerance) { + var maskBBox = getMaskBBox(context, tolerance); + // 如果 bbox 过小则不返回 + if (!maskBBox) { + return null; + } + var view = context.view; + var start = getSiblingPoint(view, sibling, { x: maskBBox.x, y: maskBBox.y }); + var end = getSiblingPoint(view, sibling, { x: maskBBox.maxX, y: maskBBox.maxY }); + var box = { + minX: start.x, + minY: start.y, + maxX: end.x, + maxY: end.y, + }; + return getIntersectElements(sibling, box); +} +/** + * 获取所有的图表元素 + * @param view View/Chart + * @ignore + */ +function getElements(view) { + var geometries = view.geometries; + var rst = []; + each$2(geometries, function (geom) { + var elements = geom.elements; + rst = rst.concat(elements); + }); + if (view.views && view.views.length) { + each$2(view.views, function (subView) { + rst = rst.concat(getElements(subView)); + }); + } + return rst; +} +/** + * 获取所有的图表元素 + * @param view View/Chart + * @param field 字段名 + * @param value 字段值 + * @ignore + */ +function getElementsByField(view, field, value) { + var elements = getElements(view); + return elements.filter(function (el) { + return getElementValue$1(el, field) === value; + }); +} +/** + * 根据状态名获取图表元素 + * @param view View/Chart + * @param stateName 状态名 + * @ignore + */ +function getElementsByState(view, stateName) { + var geometries = view.geometries; + var rst = []; + each$2(geometries, function (geom) { + var elements = geom.getElementsBy(function (el) { return el.hasState(stateName); }); + rst = rst.concat(elements); + }); + return rst; +} +/** + * 获取图表元素对应字段的值 + * @param element 图表元素 + * @param field 字段名 + * @ignore + */ +function getElementValue$1(element, field) { + var model = element.getModel(); + var record = model.data; + var value; + if (isArray$n(record)) { + value = record[0][field]; + } + else { + value = record[field]; + } + return value; +} +/** + * 两个包围盒是否相交 + * @param box1 包围盒1 + * @param box2 包围盒2 + * @ignore + */ +function intersectRect$2(box1, box2) { + return !(box2.minX > box1.maxX || box2.maxX < box1.minX || box2.minY > box1.maxY || box2.maxY < box1.minY); +} +/** + * 获取包围盒内的图表元素 + * @param view View/Chart + * @param box 包围盒 + * @ignore + */ +function getIntersectElements(view, box) { + var elements = getElements(view); + var rst = []; + each$2(elements, function (el) { + var shape = el.shape; + var shapeBBox = shape.getCanvasBBox(); + if (intersectRect$2(box, shapeBBox)) { + rst.push(el); + } + }); + return rst; +} +function pathToPoints$2(path) { + var points = []; + each$2(path, function (seg) { + var command = seg[0]; + if (command !== 'A') { + for (var i = 1; i < seg.length; i = i + 2) { + points.push([seg[i], seg[i + 1]]); + } + } + else { + var length_1 = seg.length; + points.push([seg[length_1 - 2], seg[length_1 - 1]]); + } + }); + return points; +} +/** + * 获取包围盒内的图表元素 + * @param view View/Chart + * @param path 路径 + * @ignore + */ +function getElementsByPath(view, path) { + var elements = getElements(view); + var points = pathToPoints$2(path); + var rst = elements.filter(function (el) { + var shape = el.shape; + var shapePoints; + if (shape.get('type') === 'path') { + shapePoints = pathToPoints$2(shape.attr('path')); + } + else { + var shapeBBox = shape.getCanvasBBox(); + shapePoints = toPoints(shapeBBox); + } + return isPolygonsIntersect$2(points, shapePoints); + }); + return rst; +} +/** + * 获取当前 View 的所有组件 + * @param view View/Chart + * @ignore + */ +function getComponents(view) { + return view.getComponents().map(function (co) { return co.component; }); +} +/** @ignore */ +function distance$6(p1, p2) { + var dx = p2.x - p1.x; + var dy = p2.y - p1.y; + return Math.sqrt(dx * dx + dy * dy); +} +/** @ignore */ +function getSpline$1(points, z) { + if (points.length <= 2) { + return getLinePath$1(points, false); + } + var first = points[0]; + var arr = []; + each$2(points, function (point) { + arr.push(point.x); + arr.push(point.y); + }); + var path = catmullRom2bezier$1(arr, z, null); + path.unshift(['M', first.x, first.y]); + return path; +} +/** + * 检测点是否在包围盒内 + * @param box 包围盒 + * @param point 点 + * @ignore + */ +function isInBox(box, point) { + return box.x <= point.x && box.maxX >= point.x && box.y <= point.y && box.maxY > point.y; +} +/** + * 获取同 view 同一级的 views + * @param view 当前 view + * @returns 同一级的 views + * @ignore + */ +function getSilbings(view) { + var parent = view.parent; + var siblings = null; + if (parent) { + siblings = parent.views.filter(function (sub) { return sub !== view; }); + } + return siblings; +} +function point2Normalize(view, point) { + var coord = view.getCoordinate(); + return coord.invert(point); +} +/** + * 将 view 上的一点转换成另一个 view 的点 + * @param view 当前的 view + * @param sibling 同一层级的 view + * @param point 指定点 + * @ignore + */ +function getSiblingPoint(view, sibling, point) { + var normalPoint = point2Normalize(view, point); + return sibling.getCoordinate().convert(normalPoint); +} +/** + * 是否在记录中，临时因为所有的 view 中的数据不是引用，而使用的方法 + * 不同 view 上对数据的引用不相等，导致无法直接用 includes + * 假设 x, y 值相等时是同一条数据，这个假设不完全正确，而改成 isEqual 则成本太高 + * 后面改成同一个引用时可以修改回来 + * @param records + * @param record + * @param xFiled + * @param yField + * @returns + * @ignore + */ +function isInRecords(records, record, xFiled, yField) { + var isIn = false; + each$2(records, function (r) { + if (r[xFiled] === record[xFiled] && r[yField] === record[yField]) { + isIn = true; + return false; + } + }); + return isIn; +} +// 级联获取 field 对应的 scale，如果 view 上没有，遍历子 view +function getScaleByField(view, field) { + var scale = view.getScaleByField(field); + if (!scale && view.views) { + each$2(view.views, function (subView) { + scale = getScaleByField(subView, field); + if (scale) { + return false; // 终止循环 + } + }); + } + return scale; +} + +/** + * 交互的上下文 + */ +var Context$1 = /** @class */ (function () { + function Context(view) { + /** 当前所有的 Action */ + this.actions = []; + /** 当前事件对象 */ + this.event = null; + this.cacheMap = {}; + this.view = view; + } + /** + * 缓存信息 + * @param params 缓存的字段 + * - 如果一个字段则获取缓存 + * - 两个字段则设置缓存 + */ + Context.prototype.cache = function () { + var params = []; + for (var _i = 0; _i < arguments.length; _i++) { + params[_i] = arguments[_i]; + } + if (params.length === 1) { + return this.cacheMap[params[0]]; + } + else if (params.length === 2) { + this.cacheMap[params[0]] = params[1]; + } + }; + /** + * 获取 Action + * @param name Action 的名称 + */ + Context.prototype.getAction = function (name) { + return this.actions.find(function (action) { return action.name === name; }); + }; + /** + * 获取 Action + * @param action Action 对象 + */ + Context.prototype.addAction = function (action) { + this.actions.push(action); + }; + /** + * 移除 Action + * @param action Action 对象 + */ + Context.prototype.removeAction = function (action) { + var actions = this.actions; + var index = this.actions.indexOf(action); + if (index >= 0) { + actions.splice(index, 1); + } + }; + /** + * 获取当前的点 + */ + Context.prototype.getCurrentPoint = function () { + var event = this.event; + if (event) { + if (event.target instanceof HTMLElement) { + var canvas = this.view.getCanvas(); + var point = canvas.getPointByClient(event.clientX, event.clientY); + return point; + } + else { + return { + x: event.x, + y: event.y, + }; + } + } + return null; + }; + /** + * 获取当前 shape + * @returns current shape + */ + Context.prototype.getCurrentShape = function () { + return get$3(this.event, ['gEvent', 'shape']); + }; + /** + * 当前的触发是否在 View 内 + */ + Context.prototype.isInPlot = function () { + var point = this.getCurrentPoint(); + if (point) { + return this.view.isPointInPlot(point); + } + return false; + }; + /** + * 是否在指定的图形内 + * @param name shape 的 name + */ + Context.prototype.isInShape = function (name) { + var shape = this.getCurrentShape(); // 不再考虑在 shape 的 parent 内的情况 + if (shape) { + return shape.get('name') === name; + } + return false; + }; + /** + * 当前的触发是组件内部 + * @param name 组件名，可以为空 + */ + Context.prototype.isInComponent = function (name) { + var components = getComponents(this.view); + var point = this.getCurrentPoint(); + if (point) { + return !!components.find(function (component) { + var bbox = component.getBBox(); + if (name) { + return component.get('name') === name && isInBox(bbox, point); + } + else { + return isInBox(bbox, point); + } + }); + } + return false; + }; + /** + * 销毁 + */ + Context.prototype.destroy = function () { + this.view = null; + this.event = null; + // 先销毁 action 再清空，一边遍历，一边删除，所以数组需要更新引用 + each$2(this.actions.slice(), function (action) { + action.destroy(); + }); + this.actions = null; + this.cacheMap = null; + }; + return Context; +}()); + +/** + * 交互的基类。 + */ +var Interaction = /** @class */ (function () { + function Interaction(view, cfg) { + this.view = view; + this.cfg = cfg; + } + /** + * 初始化。 + */ + Interaction.prototype.init = function () { + this.initEvents(); + }; + /** + * 绑定事件 + */ + Interaction.prototype.initEvents = function () { }; + /** + * 销毁事件 + */ + Interaction.prototype.clearEvents = function () { }; + /** + * 销毁。 + */ + Interaction.prototype.destroy = function () { + this.clearEvents(); + }; + return Interaction; +}()); +var Interaction$1 = Interaction; + +// 将字符串转换成 action +function parseAction(actionStr, context, arg) { + var arr = actionStr.split(':'); + var actionName = arr[0]; + // 如果已经初始化过 action ，则直接引用之前的 action + var action = context.getAction(actionName) || createAction(actionName, context); + if (!action) { + throw new Error("There is no action named " + actionName); + } + var methodName = arr[1]; + return { + action: action, + methodName: methodName, + arg: arg, + }; +} +// 执行 Action +function executeAction(actionObject) { + var action = actionObject.action, methodName = actionObject.methodName, arg = actionObject.arg; + if (action[methodName]) { + action[methodName](arg); + } + else { + throw new Error("Action(" + action.name + ") doesn't have a method called " + methodName); + } +} +var STEP_NAMES = { + START: 'start', + SHOW_ENABLE: 'showEnable', + END: 'end', + ROLLBACK: 'rollback', + PROCESSING: 'processing', +}; +/** + * 支持语法的交互类 + */ +var GrammarInteraction = /** @class */ (function (_super) { + __extends$e(GrammarInteraction, _super); + function GrammarInteraction(view, steps) { + var _this = _super.call(this, view, steps) || this; + _this.callbackCaches = {}; + // 某个触发和反馈在本环节是否执行或 + _this.emitCaches = {}; + _this.steps = steps; + return _this; + } + /** + * 初始化 + */ + GrammarInteraction.prototype.init = function () { + this.initContext(); + _super.prototype.init.call(this); + }; + /** + * 清理资源 + */ + GrammarInteraction.prototype.destroy = function () { + _super.prototype.destroy.call(this); // 先清理事件 + this.steps = null; + if (this.context) { + this.context.destroy(); + this.context = null; + } + this.callbackCaches = null; + this.view = null; + }; + /** + * 绑定事件 + */ + GrammarInteraction.prototype.initEvents = function () { + var _this = this; + each$2(this.steps, function (stepArr, stepName) { + each$2(stepArr, function (step) { + var callback = _this.getActionCallback(stepName, step); + if (callback) { + // 如果存在 callback，才绑定，有时候会出现无 callback 的情况 + _this.bindEvent(step.trigger, callback); + } + }); + }); + }; + /** + * 清理绑定的事件 + */ + GrammarInteraction.prototype.clearEvents = function () { + var _this = this; + each$2(this.steps, function (stepArr, stepName) { + each$2(stepArr, function (step) { + var callback = _this.getActionCallback(stepName, step); + if (callback) { + _this.offEvent(step.trigger, callback); + } + }); + }); + }; + // 初始化上下文，并初始化 action + GrammarInteraction.prototype.initContext = function () { + var view = this.view; + var context = new Context$1(view); + this.context = context; + var steps = this.steps; + // 生成具体的 Action + each$2(steps, function (subSteps) { + each$2(subSteps, function (step) { + if (isFunction$6(step.action)) { + // 如果传入回调函数，则直接生成 CallbackAction + step.actionObject = { + action: createCallbackAction(step.action, context), + methodName: 'execute', + }; + } + else if (isString$3(step.action)) { + // 如果是字符串 + step.actionObject = parseAction(step.action, context, step.arg); + } + else if (isArray$n(step.action)) { + // 如果是数组 + var actionArr = step.action; + var argArr_1 = isArray$n(step.arg) ? step.arg : [step.arg]; + step.actionObject = []; + each$2(actionArr, function (actionStr, idx) { + step.actionObject.push(parseAction(actionStr, context, argArr_1[idx])); + }); + } + // 如果 action 既不是字符串，也不是函数，则不会生成 actionObject + }); + }); + }; + // 是否允许指定阶段名称执行 + GrammarInteraction.prototype.isAllowStep = function (stepName) { + var currentStepName = this.currentStepName; + var steps = this.steps; + // 相同的阶段允许同时执行 + if (currentStepName === stepName) { + return true; + } + if (stepName === STEP_NAMES.SHOW_ENABLE) { + // 示能在整个过程中都可用 + return true; + } + if (stepName === STEP_NAMES.PROCESSING) { + // 只有当前是 start 时，才允许 processing + return currentStepName === STEP_NAMES.START; + } + if (stepName === STEP_NAMES.START) { + // 如果当前是 processing，则无法 start，必须等待 end 后才能执行 + return currentStepName !== STEP_NAMES.PROCESSING; + } + if (stepName === STEP_NAMES.END) { + return currentStepName === STEP_NAMES.PROCESSING || currentStepName === STEP_NAMES.START; + } + if (stepName === STEP_NAMES.ROLLBACK) { + if (steps[STEP_NAMES.END]) { + // 如果定义了 end, 只有 end 时才允许回滚 + return currentStepName === STEP_NAMES.END; + } + else if (currentStepName === STEP_NAMES.START) { + // 如果未定义 end, 则判断是否是开始 + return true; + } + } + return false; + }; + // 具体的指定阶段是否允许执行 + GrammarInteraction.prototype.isAllowExecute = function (stepName, step) { + if (this.isAllowStep(stepName)) { + var key = this.getKey(stepName, step); + // 如果是在本环节内仅允许触发一次，同时已经触发过，则不允许再触发 + if (step.once && this.emitCaches[key]) { + return false; + } + // 如果是允许的阶段，则验证 isEnable 方法 + if (step.isEnable) { + return step.isEnable(this.context); + } + return true; // 如果没有 isEnable 则允许执行 + } + return false; + }; + GrammarInteraction.prototype.enterStep = function (stepName) { + this.currentStepName = stepName; + this.emitCaches = {}; // 清除所有本环节触发的缓存 + }; + // 执行完某个触发和反馈（子环节） + GrammarInteraction.prototype.afterExecute = function (stepName, step) { + // show enable 不计入正常的流程，其他情况则设置当前的 step + if (stepName !== STEP_NAMES.SHOW_ENABLE && this.currentStepName !== stepName) { + this.enterStep(stepName); + } + var key = this.getKey(stepName, step); + // 一旦执行，则缓存标记为，一直保持到跳出改环节 + this.emitCaches[key] = true; + }; + // 获取某个环节的唯一的键值 + GrammarInteraction.prototype.getKey = function (stepName, step) { + return stepName + step.trigger + step.action; + }; + // 获取 step 的回调函数，如果已经生成，则直接返回，如果未生成，则创建 + GrammarInteraction.prototype.getActionCallback = function (stepName, step) { + var _this = this; + var context = this.context; + var callbackCaches = this.callbackCaches; + var actionObject = step.actionObject; + if (step.action && actionObject) { + var key = this.getKey(stepName, step); + if (!callbackCaches[key]) { + // 动态生成执行的方法，执行对应 action 的名称 + var actionCallback = function (event) { + context.event = event; // 保证检测时的 event + if (_this.isAllowExecute(stepName, step)) { + // 如果是数组时，则依次执行 + if (isArray$n(actionObject)) { + each$2(actionObject, function (obj) { + context.event = event; // 可能触发新的事件，保证执行前的 context.event 是正确的 + executeAction(obj); + }); + } + else { + context.event = event; // 保证执行前的 context.event 是正确的 + executeAction(actionObject); + } + _this.afterExecute(stepName, step); + if (step.callback) { + context.event = event; // 保证执行前的 context.event 是正确的 + step.callback(context); + } + } + else { + // 如果未通过验证，则事件不要绑定在上面 + context.event = null; + } + }; + // 如果设置了 debounce + if (step.debounce) { + callbackCaches[key] = debounce$1(actionCallback, step.debounce.wait, step.debounce.immediate); + } + else if (step.throttle) { + // 设置 throttle + callbackCaches[key] = throttle(actionCallback, step.throttle.wait, { + leading: step.throttle.leading, + trailing: step.throttle.trailing, + }); + } + else { + // 直接设置 + callbackCaches[key] = actionCallback; + } + } + return callbackCaches[key]; + } + return null; + }; + GrammarInteraction.prototype.bindEvent = function (eventName, callback) { + var nameArr = eventName.split(':'); + if (nameArr[0] === 'window') { + window.addEventListener(nameArr[1], callback); + } + else if (nameArr[0] === 'document') { + document.addEventListener(nameArr[1], callback); + } + else { + this.view.on(eventName, callback); + } + }; + GrammarInteraction.prototype.offEvent = function (eventName, callback) { + var nameArr = eventName.split(':'); + if (nameArr[0] === 'window') { + window.removeEventListener(nameArr[1], callback); + } + else if (nameArr[0] === 'document') { + document.removeEventListener(nameArr[1], callback); + } + else { + this.view.off(eventName, callback); + } + }; + return GrammarInteraction; +}(Interaction$1)); + +var Interactions = {}; +/** + * 根据交互行为名字获取对应的交互类 + * @param name 交互名字 + * @returns 交互类 + */ +function getInteraction(name) { + return Interactions[lowerCase$1(name)]; +} +/** + * 注册交互行为 + * @param name 交互行为名字 + * @param interaction 交互类 + */ +function registerInteraction(name, interaction) { + Interactions[lowerCase$1(name)] = interaction; +} +/** + * 创建交互实例 + * @param name 交互名 + * @param view 交互应用的 View 实例 + * @param cfg 交互行为配置 + */ +function createInteraction(name, view, cfg) { + var interaciton = getInteraction(name); + if (!interaciton) { + return null; + } + if (isPlainObject$3(interaciton)) { + // 如果不 clone 则会多个 interaction 实例共享 step 的定义 + var steps = mix(clone$7(interaciton), cfg); + return new GrammarInteraction(view, steps); + } + else { + var cls = interaciton; + return new cls(view, cfg); + } +} + +/** + * 根据样式表创建 axis 组件主题样式 + * @param styleSheet + */ +function createAxisStyles(styleSheet) { + return { + title: { + autoRotate: true, + position: 'center', + spacing: styleSheet.axisTitleSpacing, + style: { + fill: styleSheet.axisTitleTextFillColor, + fontSize: styleSheet.axisTitleTextFontSize, + lineHeight: styleSheet.axisTitleTextLineHeight, + textBaseline: 'middle', + fontFamily: styleSheet.fontFamily, + }, + }, + label: { + autoRotate: false, + autoEllipsis: false, + autoHide: { type: 'equidistance', cfg: { minGap: 6 } }, + offset: styleSheet.axisLabelOffset, + style: { + fill: styleSheet.axisLabelFillColor, + fontSize: styleSheet.axisLabelFontSize, + lineHeight: styleSheet.axisLabelLineHeight, + fontFamily: styleSheet.fontFamily, + }, + }, + line: { + style: { + lineWidth: styleSheet.axisLineBorder, + stroke: styleSheet.axisLineBorderColor, + }, + }, + grid: { + line: { + type: 'line', + style: { + stroke: styleSheet.axisGridBorderColor, + lineWidth: styleSheet.axisGridBorder, + lineDash: styleSheet.axisGridLineDash, + }, + }, + alignTick: true, + animate: true, + }, + tickLine: { + style: { + lineWidth: styleSheet.axisTickLineBorder, + stroke: styleSheet.axisTickLineBorderColor, + }, + alignTick: true, + length: styleSheet.axisTickLineLength, + }, + subTickLine: null, + animate: true, + }; +} +/** + * + * @param styleSheet + */ +// export function +/** + * 根据样式表创建 legend 组件主题样式 + * @param styleSheet + */ +function createLegendStyles(styleSheet) { + return { + title: null, + marker: { + symbol: 'circle', + spacing: styleSheet.legendMarkerSpacing, + style: { + r: styleSheet.legendCircleMarkerSize, + fill: styleSheet.legendMarkerColor, + }, + }, + itemName: { + spacing: 5, + style: { + fill: styleSheet.legendItemNameFillColor, + fontFamily: styleSheet.fontFamily, + fontSize: styleSheet.legendItemNameFontSize, + lineHeight: styleSheet.legendItemNameLineHeight, + fontWeight: styleSheet.legendItemNameFontWeight, + textAlign: 'start', + textBaseline: 'middle', + }, + }, + itemStates: { + active: { + nameStyle: { + opacity: 0.8, + }, + }, + unchecked: { + nameStyle: { + fill: '#D8D8D8', + }, + markerStyle: { + fill: '#D8D8D8', + stroke: '#D8D8D8', + }, + }, + inactive: { + nameStyle: { + fill: '#D8D8D8', + }, + markerStyle: { + opacity: 0.2, + }, + }, + }, + flipPage: true, + pageNavigator: { + marker: { + style: { + size: styleSheet.legendPageNavigatorMarkerSize, + inactiveFill: styleSheet.legendPageNavigatorMarkerInactiveFillColor, + inactiveOpacity: styleSheet.legendPageNavigatorMarkerInactiveFillOpacity, + fill: styleSheet.legendPageNavigatorMarkerFillColor, + opacity: styleSheet.legendPageNavigatorMarkerFillOpacity, + }, + }, + text: { + style: { + fill: styleSheet.legendPageNavigatorTextFillColor, + fontSize: styleSheet.legendPageNavigatorTextFontSize, + }, + }, + }, + animate: false, + maxItemWidth: 200, + itemSpacing: styleSheet.legendItemSpacing, + itemMarginBottom: styleSheet.legendItemMarginBottom, + padding: styleSheet.legendPadding, + }; +} +/** + * 根据主题样式表生成主题结构 + * @param styleSheet 主题样式表 + */ +function createThemeByStyleSheet(styleSheet) { + var _a; + var shapeStyles = { + point: { + default: { + fill: styleSheet.pointFillColor, + r: styleSheet.pointSize, + stroke: styleSheet.pointBorderColor, + lineWidth: styleSheet.pointBorder, + fillOpacity: styleSheet.pointFillOpacity, + }, + active: { + stroke: styleSheet.pointActiveBorderColor, + lineWidth: styleSheet.pointActiveBorder, + }, + selected: { + stroke: styleSheet.pointSelectedBorderColor, + lineWidth: styleSheet.pointSelectedBorder, + }, + inactive: { + fillOpacity: styleSheet.pointInactiveFillOpacity, + strokeOpacity: styleSheet.pointInactiveBorderOpacity, + }, + }, + hollowPoint: { + default: { + fill: styleSheet.hollowPointFillColor, + lineWidth: styleSheet.hollowPointBorder, + stroke: styleSheet.hollowPointBorderColor, + strokeOpacity: styleSheet.hollowPointBorderOpacity, + r: styleSheet.hollowPointSize, + }, + active: { + stroke: styleSheet.hollowPointActiveBorderColor, + strokeOpacity: styleSheet.hollowPointActiveBorderOpacity, + }, + selected: { + lineWidth: styleSheet.hollowPointSelectedBorder, + stroke: styleSheet.hollowPointSelectedBorderColor, + strokeOpacity: styleSheet.hollowPointSelectedBorderOpacity, + }, + inactive: { + strokeOpacity: styleSheet.hollowPointInactiveBorderOpacity, + }, + }, + area: { + default: { + fill: styleSheet.areaFillColor, + fillOpacity: styleSheet.areaFillOpacity, + stroke: null, + }, + active: { + fillOpacity: styleSheet.areaActiveFillOpacity, + }, + selected: { + fillOpacity: styleSheet.areaSelectedFillOpacity, + }, + inactive: { + fillOpacity: styleSheet.areaInactiveFillOpacity, + }, + }, + hollowArea: { + default: { + fill: null, + stroke: styleSheet.hollowAreaBorderColor, + lineWidth: styleSheet.hollowAreaBorder, + strokeOpacity: styleSheet.hollowAreaBorderOpacity, + }, + active: { + fill: null, + lineWidth: styleSheet.hollowAreaActiveBorder, + }, + selected: { + fill: null, + lineWidth: styleSheet.hollowAreaSelectedBorder, + }, + inactive: { + strokeOpacity: styleSheet.hollowAreaInactiveBorderOpacity, + }, + }, + interval: { + default: { + fill: styleSheet.intervalFillColor, + fillOpacity: styleSheet.intervalFillOpacity, + }, + active: { + stroke: styleSheet.intervalActiveBorderColor, + lineWidth: styleSheet.intervalActiveBorder, + }, + selected: { + stroke: styleSheet.intervalSelectedBorderColor, + lineWidth: styleSheet.intervalSelectedBorder, + }, + inactive: { + fillOpacity: styleSheet.intervalInactiveFillOpacity, + strokeOpacity: styleSheet.intervalInactiveBorderOpacity, + }, + }, + hollowInterval: { + default: { + fill: styleSheet.hollowIntervalFillColor, + stroke: styleSheet.hollowIntervalBorderColor, + lineWidth: styleSheet.hollowIntervalBorder, + strokeOpacity: styleSheet.hollowIntervalBorderOpacity, + }, + active: { + stroke: styleSheet.hollowIntervalActiveBorderColor, + lineWidth: styleSheet.hollowIntervalActiveBorder, + strokeOpacity: styleSheet.hollowIntervalActiveBorderOpacity, + }, + selected: { + stroke: styleSheet.hollowIntervalSelectedBorderColor, + lineWidth: styleSheet.hollowIntervalSelectedBorder, + strokeOpacity: styleSheet.hollowIntervalSelectedBorderOpacity, + }, + inactive: { + stroke: styleSheet.hollowIntervalInactiveBorderColor, + lineWidth: styleSheet.hollowIntervalInactiveBorder, + strokeOpacity: styleSheet.hollowIntervalInactiveBorderOpacity, + }, + }, + line: { + default: { + stroke: styleSheet.lineBorderColor, + lineWidth: styleSheet.lineBorder, + strokeOpacity: styleSheet.lineBorderOpacity, + fill: null, + lineAppendWidth: 10, + lineCap: 'round', + lineJoin: 'round', + }, + active: { + lineWidth: styleSheet.lineActiveBorder, + }, + selected: { + lineWidth: styleSheet.lineSelectedBorder, + }, + inactive: { + strokeOpacity: styleSheet.lineInactiveBorderOpacity, + }, + }, + }; + var axisStyles = createAxisStyles(styleSheet); + var legendStyles = createLegendStyles(styleSheet); + return { + background: styleSheet.backgroundColor, + defaultColor: styleSheet.brandColor, + subColor: styleSheet.subColor, + semanticRed: styleSheet.paletteSemanticRed, + semanticGreen: styleSheet.paletteSemanticGreen, + padding: 'auto', + fontFamily: styleSheet.fontFamily, + // 兼容Theme配置 + /** 一般柱状图宽度占比，geometry中已添加默认值，为了geometry配置生效默认值为null */ + columnWidthRatio: 1 / 2, + /** 柱状图最大宽度 */ + maxColumnWidth: null, + /** 柱状图最小宽度 */ + minColumnWidth: null, + /** 玫瑰图占比 */ + roseWidthRatio: 0.9999999, + /** 多层饼图/环图占比 */ + multiplePieWidthRatio: 1 / 1.3, + colors10: styleSheet.paletteQualitative10, + colors20: styleSheet.paletteQualitative20, + sequenceColors: styleSheet.paletteSequence, + shapes: { + point: [ + 'hollow-circle', + 'hollow-square', + 'hollow-bowtie', + 'hollow-diamond', + 'hollow-hexagon', + 'hollow-triangle', + 'hollow-triangle-down', + 'circle', + 'square', + 'bowtie', + 'diamond', + 'hexagon', + 'triangle', + 'triangle-down', + 'cross', + 'tick', + 'plus', + 'hyphen', + 'line', + ], + line: ['line', 'dash', 'dot', 'smooth'], + area: ['area', 'smooth', 'line', 'smooth-line'], + interval: ['rect', 'hollow-rect', 'line', 'tick'], + }, + sizes: [1, 10], + geometries: { + interval: { + rect: { + default: { + style: shapeStyles.interval.default, + }, + active: { + style: shapeStyles.interval.active, + }, + inactive: { + style: shapeStyles.interval.inactive, + }, + selected: { + style: function (element) { + var coordinate = element.geometry.coordinate; + if (coordinate.isPolar && coordinate.isTransposed) { + var _a = getAngle$2(element.getModel(), coordinate), startAngle = _a.startAngle, endAngle = _a.endAngle; + var middleAngle = (startAngle + endAngle) / 2; + var r = 7.5; + var x = r * Math.cos(middleAngle); + var y = r * Math.sin(middleAngle); + return { + matrix: transform$i(null, [['t', x, y]]), + }; + } + return shapeStyles.interval.selected; + }, + }, + }, + 'hollow-rect': { + default: { + style: shapeStyles.hollowInterval.default, + }, + active: { + style: shapeStyles.hollowInterval.active, + }, + inactive: { + style: shapeStyles.hollowInterval.inactive, + }, + selected: { + style: shapeStyles.hollowInterval.selected, + }, + }, + line: { + default: { + style: shapeStyles.hollowInterval.default, + }, + active: { + style: shapeStyles.hollowInterval.active, + }, + inactive: { + style: shapeStyles.hollowInterval.inactive, + }, + selected: { + style: shapeStyles.hollowInterval.selected, + }, + }, + tick: { + default: { + style: shapeStyles.hollowInterval.default, + }, + active: { + style: shapeStyles.hollowInterval.active, + }, + inactive: { + style: shapeStyles.hollowInterval.inactive, + }, + selected: { + style: shapeStyles.hollowInterval.selected, + }, + }, + funnel: { + default: { + style: shapeStyles.interval.default, + }, + active: { + style: shapeStyles.interval.active, + }, + inactive: { + style: shapeStyles.interval.inactive, + }, + selected: { + style: shapeStyles.interval.selected, + }, + }, + pyramid: { + default: { + style: shapeStyles.interval.default, + }, + active: { + style: shapeStyles.interval.active, + }, + inactive: { + style: shapeStyles.interval.inactive, + }, + selected: { + style: shapeStyles.interval.selected, + }, + }, + }, + line: { + line: { + default: { + style: shapeStyles.line.default, + }, + active: { + style: shapeStyles.line.active, + }, + inactive: { + style: shapeStyles.line.inactive, + }, + selected: { + style: shapeStyles.line.selected, + }, + }, + dot: { + default: { + style: __assign$r(__assign$r({}, shapeStyles.line.default), { lineCap: null, lineDash: [1, 1] }), + }, + active: { + style: __assign$r(__assign$r({}, shapeStyles.line.active), { lineCap: null, lineDash: [1, 1] }), + }, + inactive: { + style: __assign$r(__assign$r({}, shapeStyles.line.inactive), { lineCap: null, lineDash: [1, 1] }), + }, + selected: { + style: __assign$r(__assign$r({}, shapeStyles.line.selected), { lineCap: null, lineDash: [1, 1] }), + }, + }, + dash: { + default: { + style: __assign$r(__assign$r({}, shapeStyles.line.default), { lineCap: null, lineDash: [5.5, 1] }), + }, + active: { + style: __assign$r(__assign$r({}, shapeStyles.line.active), { lineCap: null, lineDash: [5.5, 1] }), + }, + inactive: { + style: __assign$r(__assign$r({}, shapeStyles.line.inactive), { lineCap: null, lineDash: [5.5, 1] }), + }, + selected: { + style: __assign$r(__assign$r({}, shapeStyles.line.selected), { lineCap: null, lineDash: [5.5, 1] }), + }, + }, + smooth: { + default: { + style: shapeStyles.line.default, + }, + active: { + style: shapeStyles.line.active, + }, + inactive: { + style: shapeStyles.line.inactive, + }, + selected: { + style: shapeStyles.line.selected, + }, + }, + hv: { + default: { + style: shapeStyles.line.default, + }, + active: { + style: shapeStyles.line.active, + }, + inactive: { + style: shapeStyles.line.inactive, + }, + selected: { + style: shapeStyles.line.selected, + }, + }, + vh: { + default: { + style: shapeStyles.line.default, + }, + active: { + style: shapeStyles.line.active, + }, + inactive: { + style: shapeStyles.line.inactive, + }, + selected: { + style: shapeStyles.line.selected, + }, + }, + hvh: { + default: { + style: shapeStyles.line.default, + }, + active: { + style: shapeStyles.line.active, + }, + inactive: { + style: shapeStyles.line.inactive, + }, + selected: { + style: shapeStyles.line.selected, + }, + }, + vhv: { + default: { + style: shapeStyles.line.default, + }, + active: { + style: shapeStyles.line.active, + }, + inactive: { + style: shapeStyles.line.inactive, + }, + selected: { + style: shapeStyles.line.selected, + }, + }, + }, + polygon: { + polygon: { + default: { + style: shapeStyles.interval.default, + }, + active: { + style: shapeStyles.interval.active, + }, + inactive: { + style: shapeStyles.interval.inactive, + }, + selected: { + style: shapeStyles.interval.selected, + }, + }, + }, + point: { + circle: { + default: { + style: shapeStyles.point.default, + }, + active: { + style: shapeStyles.point.active, + }, + inactive: { + style: shapeStyles.point.inactive, + }, + selected: { + style: shapeStyles.point.selected, + }, + }, + square: { + default: { + style: shapeStyles.point.default, + }, + active: { + style: shapeStyles.point.active, + }, + inactive: { + style: shapeStyles.point.inactive, + }, + selected: { + style: shapeStyles.point.selected, + }, + }, + bowtie: { + default: { + style: shapeStyles.point.default, + }, + active: { + style: shapeStyles.point.active, + }, + inactive: { + style: shapeStyles.point.inactive, + }, + selected: { + style: shapeStyles.point.selected, + }, + }, + diamond: { + default: { + style: shapeStyles.point.default, + }, + active: { + style: shapeStyles.point.active, + }, + inactive: { + style: shapeStyles.point.inactive, + }, + selected: { + style: shapeStyles.point.selected, + }, + }, + hexagon: { + default: { + style: shapeStyles.point.default, + }, + active: { + style: shapeStyles.point.active, + }, + inactive: { + style: shapeStyles.point.inactive, + }, + selected: { + style: shapeStyles.point.selected, + }, + }, + triangle: { + default: { + style: shapeStyles.point.default, + }, + active: { + style: shapeStyles.point.active, + }, + inactive: { + style: shapeStyles.point.inactive, + }, + selected: { + style: shapeStyles.point.selected, + }, + }, + 'triangle-down': { + default: { + style: shapeStyles.point.default, + }, + active: { + style: shapeStyles.point.active, + }, + inactive: { + style: shapeStyles.point.inactive, + }, + selected: { + style: shapeStyles.point.selected, + }, + }, + 'hollow-circle': { + default: { + style: shapeStyles.hollowPoint.default, + }, + active: { + style: shapeStyles.hollowPoint.active, + }, + inactive: { + style: shapeStyles.hollowPoint.inactive, + }, + selected: { + style: shapeStyles.hollowPoint.selected, + }, + }, + 'hollow-square': { + default: { + style: shapeStyles.hollowPoint.default, + }, + active: { + style: shapeStyles.hollowPoint.active, + }, + inactive: { + style: shapeStyles.hollowPoint.inactive, + }, + selected: { + style: shapeStyles.hollowPoint.selected, + }, + }, + 'hollow-bowtie': { + default: { + style: shapeStyles.hollowPoint.default, + }, + active: { + style: shapeStyles.hollowPoint.active, + }, + inactive: { + style: shapeStyles.hollowPoint.inactive, + }, + selected: { + style: shapeStyles.hollowPoint.selected, + }, + }, + 'hollow-diamond': { + default: { + style: shapeStyles.hollowPoint.default, + }, + active: { + style: shapeStyles.hollowPoint.active, + }, + inactive: { + style: shapeStyles.hollowPoint.inactive, + }, + selected: { + style: shapeStyles.hollowPoint.selected, + }, + }, + 'hollow-hexagon': { + default: { + style: shapeStyles.hollowPoint.default, + }, + active: { + style: shapeStyles.hollowPoint.active, + }, + inactive: { + style: shapeStyles.hollowPoint.inactive, + }, + selected: { + style: shapeStyles.hollowPoint.selected, + }, + }, + 'hollow-triangle': { + default: { + style: shapeStyles.hollowPoint.default, + }, + active: { + style: shapeStyles.hollowPoint.active, + }, + inactive: { + style: shapeStyles.hollowPoint.inactive, + }, + selected: { + style: shapeStyles.hollowPoint.selected, + }, + }, + 'hollow-triangle-down': { + default: { + style: shapeStyles.hollowPoint.default, + }, + active: { + style: shapeStyles.hollowPoint.active, + }, + inactive: { + style: shapeStyles.hollowPoint.inactive, + }, + selected: { + style: shapeStyles.hollowPoint.selected, + }, + }, + cross: { + default: { + style: shapeStyles.hollowPoint.default, + }, + active: { + style: shapeStyles.hollowPoint.active, + }, + inactive: { + style: shapeStyles.hollowPoint.inactive, + }, + selected: { + style: shapeStyles.hollowPoint.selected, + }, + }, + tick: { + default: { + style: shapeStyles.hollowPoint.default, + }, + active: { + style: shapeStyles.hollowPoint.active, + }, + inactive: { + style: shapeStyles.hollowPoint.inactive, + }, + selected: { + style: shapeStyles.hollowPoint.selected, + }, + }, + plus: { + default: { + style: shapeStyles.hollowPoint.default, + }, + active: { + style: shapeStyles.hollowPoint.active, + }, + inactive: { + style: shapeStyles.hollowPoint.inactive, + }, + selected: { + style: shapeStyles.hollowPoint.selected, + }, + }, + hyphen: { + default: { + style: shapeStyles.hollowPoint.default, + }, + active: { + style: shapeStyles.hollowPoint.active, + }, + inactive: { + style: shapeStyles.hollowPoint.inactive, + }, + selected: { + style: shapeStyles.hollowPoint.selected, + }, + }, + line: { + default: { + style: shapeStyles.hollowPoint.default, + }, + active: { + style: shapeStyles.hollowPoint.active, + }, + inactive: { + style: shapeStyles.hollowPoint.inactive, + }, + selected: { + style: shapeStyles.hollowPoint.selected, + }, + }, + }, + area: { + area: { + default: { + style: shapeStyles.area.default, + }, + active: { + style: shapeStyles.area.active, + }, + inactive: { + style: shapeStyles.area.inactive, + }, + selected: { + style: shapeStyles.area.selected, + }, + }, + smooth: { + default: { + style: shapeStyles.area.default, + }, + active: { + style: shapeStyles.area.active, + }, + inactive: { + style: shapeStyles.area.inactive, + }, + selected: { + style: shapeStyles.area.selected, + }, + }, + line: { + default: { + style: shapeStyles.hollowArea.default, + }, + active: { + style: shapeStyles.hollowArea.active, + }, + inactive: { + style: shapeStyles.hollowArea.inactive, + }, + selected: { + style: shapeStyles.hollowArea.selected, + }, + }, + 'smooth-line': { + default: { + style: shapeStyles.hollowArea.default, + }, + active: { + style: shapeStyles.hollowArea.active, + }, + inactive: { + style: shapeStyles.hollowArea.inactive, + }, + selected: { + style: shapeStyles.hollowArea.selected, + }, + }, + }, + schema: { + candle: { + default: { + style: shapeStyles.hollowInterval.default, + }, + active: { + style: shapeStyles.hollowInterval.active, + }, + inactive: { + style: shapeStyles.hollowInterval.inactive, + }, + selected: { + style: shapeStyles.hollowInterval.selected, + }, + }, + box: { + default: { + style: shapeStyles.hollowInterval.default, + }, + active: { + style: shapeStyles.hollowInterval.active, + }, + inactive: { + style: shapeStyles.hollowInterval.inactive, + }, + selected: { + style: shapeStyles.hollowInterval.selected, + }, + }, + }, + edge: { + line: { + default: { + style: shapeStyles.line.default, + }, + active: { + style: shapeStyles.line.active, + }, + inactive: { + style: shapeStyles.line.inactive, + }, + selected: { + style: shapeStyles.line.selected, + }, + }, + vhv: { + default: { + style: shapeStyles.line.default, + }, + active: { + style: shapeStyles.line.active, + }, + inactive: { + style: shapeStyles.line.inactive, + }, + selected: { + style: shapeStyles.line.selected, + }, + }, + smooth: { + default: { + style: shapeStyles.line.default, + }, + active: { + style: shapeStyles.line.active, + }, + inactive: { + style: shapeStyles.line.inactive, + }, + selected: { + style: shapeStyles.line.selected, + }, + }, + arc: { + default: { + style: shapeStyles.line.default, + }, + active: { + style: shapeStyles.line.active, + }, + inactive: { + style: shapeStyles.line.inactive, + }, + selected: { + style: shapeStyles.line.selected, + }, + }, + }, + violin: { + violin: { + default: { + style: shapeStyles.line.default, + }, + active: { + style: shapeStyles.line.active, + }, + inactive: { + style: shapeStyles.line.inactive, + }, + selected: { + style: shapeStyles.line.selected, + }, + }, + smooth: { + default: { + style: shapeStyles.line.default, + }, + active: { + style: shapeStyles.line.active, + }, + inactive: { + style: shapeStyles.line.inactive, + }, + selected: { + style: shapeStyles.line.selected, + }, + }, + hollow: { + default: { + style: shapeStyles.hollowArea.default, + }, + active: { + style: shapeStyles.hollowArea.active, + }, + inactive: { + style: shapeStyles.hollowArea.inactive, + }, + selected: { + style: shapeStyles.hollowArea.selected, + }, + }, + 'hollow-smooth': { + default: { + style: shapeStyles.hollowArea.default, + }, + active: { + style: shapeStyles.hollowArea.active, + }, + inactive: { + style: shapeStyles.hollowArea.inactive, + }, + selected: { + style: shapeStyles.hollowArea.selected, + }, + }, + }, + }, + components: { + axis: { + common: axisStyles, + top: { + position: 'top', + grid: null, + title: null, + verticalLimitLength: 1 / 2, + }, + bottom: { + position: 'bottom', + grid: null, + title: null, + verticalLimitLength: 1 / 2, + }, + left: { + position: 'left', + title: null, + line: null, + tickLine: null, + verticalLimitLength: 1 / 3, + }, + right: { + position: 'right', + title: null, + line: null, + tickLine: null, + verticalLimitLength: 1 / 3, + }, + circle: { + title: null, + grid: deepMix({}, axisStyles.grid, { line: { type: 'line' } }), + }, + radius: { + title: null, + grid: deepMix({}, axisStyles.grid, { line: { type: 'circle' } }), + }, + }, + legend: { + common: legendStyles, + right: { + layout: 'vertical', + padding: styleSheet.legendVerticalPadding, + }, + left: { + layout: 'vertical', + padding: styleSheet.legendVerticalPadding, + }, + top: { + layout: 'horizontal', + padding: styleSheet.legendHorizontalPadding, + }, + bottom: { + layout: 'horizontal', + padding: styleSheet.legendHorizontalPadding, + }, + continuous: { + title: null, + background: null, + track: {}, + rail: { + type: 'color', + size: styleSheet.sliderRailHeight, + defaultLength: styleSheet.sliderRailWidth, + style: { + fill: styleSheet.sliderRailFillColor, + stroke: styleSheet.sliderRailBorderColor, + lineWidth: styleSheet.sliderRailBorder, + }, + }, + label: { + align: 'rail', + spacing: 4, + formatter: null, + style: { + fill: styleSheet.sliderLabelTextFillColor, + fontSize: styleSheet.sliderLabelTextFontSize, + lineHeight: styleSheet.sliderLabelTextLineHeight, + textBaseline: 'middle', + fontFamily: styleSheet.fontFamily, + }, + }, + handler: { + size: styleSheet.sliderHandlerWidth, + style: { + fill: styleSheet.sliderHandlerFillColor, + stroke: styleSheet.sliderHandlerBorderColor, + }, + }, + slidable: true, + padding: legendStyles.padding, + }, + }, + tooltip: { + showContent: true, + follow: true, + showCrosshairs: false, + showMarkers: true, + shared: false, + enterable: false, + position: 'auto', + marker: { + symbol: 'circle', + stroke: '#fff', + shadowBlur: 10, + shadowOffsetX: 0, + shadowOffsetY: 0, + shadowColor: 'rgba(0,0,0,0.09)', + lineWidth: 2, + r: 4, + }, + crosshairs: { + line: { + style: { + stroke: styleSheet.tooltipCrosshairsBorderColor, + lineWidth: styleSheet.tooltipCrosshairsBorder, + }, + }, + text: null, + textBackground: { + padding: 2, + style: { + fill: 'rgba(0, 0, 0, 0.25)', + lineWidth: 0, + stroke: null, + }, + }, + follow: false, + }, + // tooltip dom 样式 + domStyles: (_a = {}, + _a["" + CONTAINER_CLASS] = { + position: 'absolute', + visibility: 'hidden', + zIndex: 8, + transition: 'left 0.4s cubic-bezier(0.23, 1, 0.32, 1) 0s, top 0.4s cubic-bezier(0.23, 1, 0.32, 1) 0s', + backgroundColor: styleSheet.tooltipContainerFillColor, + opacity: styleSheet.tooltipContainerFillOpacity, + boxShadow: styleSheet.tooltipContainerShadow, + borderRadius: styleSheet.tooltipContainerBorderRadius + "px", + color: styleSheet.tooltipTextFillColor, + fontSize: styleSheet.tooltipTextFontSize + "px", + fontFamily: styleSheet.fontFamily, + lineHeight: styleSheet.tooltipTextLineHeight + "px", + padding: '0 12px 0 12px', + }, + _a["" + TITLE_CLASS] = { + marginBottom: '12px', + marginTop: '12px', + }, + _a["" + LIST_CLASS] = { + margin: 0, + listStyleType: 'none', + padding: 0, + }, + _a["" + LIST_ITEM_CLASS] = { + listStyleType: 'none', + padding: 0, + marginBottom: '12px', + marginTop: '12px', + marginLeft: 0, + marginRight: 0, + }, + _a["" + MARKER_CLASS] = { + width: '8px', + height: '8px', + borderRadius: '50%', + display: 'inline-block', + marginRight: '8px', + }, + _a["" + VALUE_CLASS] = { + display: 'inline-block', + float: 'right', + marginLeft: '30px', + }, + _a), + }, + annotation: { + arc: { + style: { + stroke: styleSheet.annotationArcBorderColor, + lineWidth: styleSheet.annotationArcBorder, + }, + animate: true, + }, + line: { + style: { + stroke: styleSheet.annotationLineBorderColor, + lineDash: styleSheet.annotationLineDash, + lineWidth: styleSheet.annotationLineBorder, + }, + text: { + position: 'start', + autoRotate: true, + style: { + fill: styleSheet.annotationTextFillColor, + stroke: styleSheet.annotationTextBorderColor, + lineWidth: styleSheet.annotationTextBorder, + fontSize: styleSheet.annotationTextFontSize, + textAlign: 'start', + fontFamily: styleSheet.fontFamily, + textBaseline: 'bottom', + }, + }, + animate: true, + }, + text: { + style: { + fill: styleSheet.annotationTextFillColor, + stroke: styleSheet.annotationTextBorderColor, + lineWidth: styleSheet.annotationTextBorder, + fontSize: styleSheet.annotationTextFontSize, + textBaseline: 'middle', + textAlign: 'start', + fontFamily: styleSheet.fontFamily, + }, + animate: true, + }, + region: { + top: false, + style: { + lineWidth: styleSheet.annotationRegionBorder, + stroke: styleSheet.annotationRegionBorderColor, + fill: styleSheet.annotationRegionFillColor, + fillOpacity: styleSheet.annotationRegionFillOpacity, + }, + animate: true, + }, + image: { + top: false, + animate: true, + }, + dataMarker: { + top: true, + point: { + style: { + r: 3, + stroke: styleSheet.brandColor, + lineWidth: 2, + }, + }, + line: { + style: { + stroke: styleSheet.annotationLineBorderColor, + lineWidth: styleSheet.annotationLineBorder, + }, + length: styleSheet.annotationDataMarkerLineLength, + }, + text: { + style: { + textAlign: 'start', + fill: styleSheet.annotationTextFillColor, + stroke: styleSheet.annotationTextBorderColor, + lineWidth: styleSheet.annotationTextBorder, + fontSize: styleSheet.annotationTextFontSize, + fontFamily: styleSheet.fontFamily, + }, + }, + direction: 'upward', + autoAdjust: true, + animate: true, + }, + dataRegion: { + style: { + region: { + fill: styleSheet.annotationRegionFillColor, + fillOpacity: styleSheet.annotationRegionFillOpacity, + }, + text: { + textAlign: 'center', + textBaseline: 'bottom', + fill: styleSheet.annotationTextFillColor, + stroke: styleSheet.annotationTextBorderColor, + lineWidth: styleSheet.annotationTextBorder, + fontSize: styleSheet.annotationTextFontSize, + fontFamily: styleSheet.fontFamily, + }, + }, + animate: true, + }, + }, + slider: { + common: { + padding: [8, 8, 8, 8], + backgroundStyle: { + fill: styleSheet.cSliderBackgroundFillColor, + opacity: styleSheet.cSliderBackgroundFillOpacity, + }, + foregroundStyle: { + fill: styleSheet.cSliderForegroundFillColor, + opacity: styleSheet.cSliderForegroundFillOpacity, + }, + handlerStyle: { + width: styleSheet.cSliderHandlerWidth, + height: styleSheet.cSliderHandlerHeight, + fill: styleSheet.cSliderHandlerFillColor, + opacity: styleSheet.cSliderHandlerFillOpacity, + stroke: styleSheet.cSliderHandlerBorderColor, + lineWidth: styleSheet.cSliderHandlerBorder, + radius: styleSheet.cSliderHandlerBorderRadius, + // 高亮的颜色 + highLightFill: styleSheet.cSliderHandlerHighlightFillColor, + }, + textStyle: { + fill: styleSheet.cSliderTextFillColor, + opacity: styleSheet.cSliderTextFillOpacity, + fontSize: styleSheet.cSliderTextFontSize, + lineHeight: styleSheet.cSliderTextLineHeight, + fontWeight: styleSheet.cSliderTextFontWeight, + stroke: styleSheet.cSliderTextBorderColor, + lineWidth: styleSheet.cSliderTextBorder, + }, + }, + }, + scrollbar: { + common: { + padding: [8, 8, 8, 8], + }, + default: { + style: { + trackColor: styleSheet.scrollbarTrackFillColor, + thumbColor: styleSheet.scrollbarThumbFillColor, + }, + }, + hover: { + style: { + thumbColor: styleSheet.scrollbarThumbHighlightFillColor, + }, + }, + }, + }, + labels: { + offset: 12, + style: { + fill: styleSheet.labelFillColor, + fontSize: styleSheet.labelFontSize, + fontFamily: styleSheet.fontFamily, + stroke: styleSheet.labelBorderColor, + lineWidth: styleSheet.labelBorder, + }, + fillColorDark: styleSheet.labelFillColorDark, + fillColorLight: styleSheet.labelFillColorLight, + autoRotate: true, + }, + innerLabels: { + style: { + fill: styleSheet.innerLabelFillColor, + fontSize: styleSheet.innerLabelFontSize, + fontFamily: styleSheet.fontFamily, + stroke: styleSheet.innerLabelBorderColor, + lineWidth: styleSheet.innerLabelBorder, + }, + autoRotate: true, + }, + overflowLabels: { + style: { + fill: styleSheet.overflowLabelFillColor, + fontSize: styleSheet.overflowLabelFontSize, + fontFamily: styleSheet.fontFamily, + stroke: styleSheet.overflowLabelBorderColor, + lineWidth: styleSheet.overflowLabelBorder, + }, + }, + pieLabels: { + labelHeight: 14, + offset: 10, + labelLine: { + style: { + lineWidth: styleSheet.labelLineBorder, + }, + }, + autoRotate: true, + }, + }; +} + +var BLACK_COLORS$1 = { + 100: '#000', + 95: '#0D0D0D', + 85: '#262626', + 65: '#595959', + 45: '#8C8C8C', + 25: '#BFBFBF', + 15: '#D9D9D9', + 6: '#F0F0F0', +}; +var WHITE_COLORS$1 = { + 100: '#FFFFFF', + 95: '#F2F2F2', + 85: '#D9D9D9', + 65: '#A6A6A6', + 45: '#737373', + 25: '#404040', + 15: '#262626', + 6: '#0F0F0F', +}; +var QUALITATIVE_10$1 = [ + '#5B8FF9', + '#5AD8A6', + '#5D7092', + '#F6BD16', + '#6F5EF9', + '#6DC8EC', + '#945FB9', + '#FF9845', + '#1E9493', + '#FF99C3', +]; +var QUALITATIVE_20$1 = [ + '#5B8FF9', + '#CDDDFD', + '#5AD8A6', + '#CDF3E4', + '#5D7092', + '#CED4DE', + '#F6BD16', + '#FCEBB9', + '#6F5EF9', + '#D3CEFD', + '#6DC8EC', + '#D3EEF9', + '#945FB9', + '#DECFEA', + '#FF9845', + '#FFE0C7', + '#1E9493', + '#BBDEDE', + '#FF99C3', + '#FFE0ED', +]; +/** 单色顺序色板 */ +var SINGLE_SEQUENCE$1 = [ + '#B8E1FF', + '#9AC5FF', + '#7DAAFF', + '#5B8FF9', + '#3D76DD', + '#085EC0', + '#0047A5', + '#00318A', + '#001D70', +]; +var createLightStyleSheet = function (cfg) { + if (cfg === void 0) { cfg = {}; } + var _a = cfg.backgroundColor, backgroundColor = _a === void 0 ? 'transparent' : _a, _b = cfg.subColor, subColor = _b === void 0 ? 'rgba(0,0,0,0.05)' : _b, _c = cfg.paletteQualitative10, paletteQualitative10 = _c === void 0 ? QUALITATIVE_10$1 : _c, _d = cfg.paletteQualitative20, paletteQualitative20 = _d === void 0 ? QUALITATIVE_20$1 : _d, _e = cfg.paletteSemanticRed, paletteSemanticRed = _e === void 0 ? '#F4664A' : _e, _f = cfg.paletteSemanticGreen, paletteSemanticGreen = _f === void 0 ? '#30BF78' : _f, _g = cfg.paletteSemanticYellow, paletteSemanticYellow = _g === void 0 ? '#FAAD14' : _g, _h = cfg.paletteSequence, paletteSequence = _h === void 0 ? SINGLE_SEQUENCE$1 : _h, _j = cfg.fontFamily, fontFamily = _j === void 0 ? "\"-apple-system\", \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial,\n \"Noto Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\",\n \"Noto Color Emoji\"" : _j; + var _k = cfg.brandColor, brandColor = _k === void 0 ? paletteQualitative10[0] : _k; + return { + /** 图表背景色 */ + backgroundColor: backgroundColor, + /** 主题色 */ + brandColor: brandColor, + /** 图表辅助色 */ + subColor: subColor, + /** 分类色板 1，在数据量小于等于 10 时使用 */ + paletteQualitative10: paletteQualitative10, + /** 分类色板 2，在数据量大于 10 时使用 */ + paletteQualitative20: paletteQualitative20, + /** 语义色 */ + paletteSemanticRed: paletteSemanticRed, + /** 语义色 */ + paletteSemanticGreen: paletteSemanticGreen, + /** 语义色 */ + paletteSemanticYellow: paletteSemanticYellow, + /** (单色)顺序色板 */ + paletteSequence: paletteSequence, + /** 字体 */ + fontFamily: fontFamily, + // -------------------- 坐标轴 -------------------- + /** 坐标轴线颜色 */ + axisLineBorderColor: BLACK_COLORS$1[25], + /** 坐标轴线粗细 */ + axisLineBorder: 1, + /** 坐标轴线 lineDash 设置 */ + axisLineDash: null, + /** 坐标轴标题颜色 */ + axisTitleTextFillColor: BLACK_COLORS$1[65], + /** 坐标轴标题文本字体大小 */ + axisTitleTextFontSize: 12, + /** 坐标轴标题文本行高 */ + axisTitleTextLineHeight: 12, + /** 坐标轴标题文本字体粗细 */ + axisTitleTextFontWeight: 'normal', + /** 坐标轴标题距离坐标轴文本的间距 */ + axisTitleSpacing: 12, + /** 坐标轴刻度线颜色 */ + axisTickLineBorderColor: BLACK_COLORS$1[25], + /** 坐标轴刻度线长度 */ + axisTickLineLength: 4, + /** 坐标轴刻度线粗细 */ + axisTickLineBorder: 1, + /** 坐标轴次刻度线颜色 */ + axisSubTickLineBorderColor: BLACK_COLORS$1[15], + /** 坐标轴次刻度线长度 */ + axisSubTickLineLength: 2, + /** 坐标轴次刻度线粗细 */ + axisSubTickLineBorder: 1, + /** 坐标轴刻度文本颜色 */ + axisLabelFillColor: BLACK_COLORS$1[45], + /** 坐标轴刻度文本字体大小 */ + axisLabelFontSize: 12, + /** 坐标轴刻度文本行高 */ + axisLabelLineHeight: 12, + /** 坐标轴刻度文本字体粗细 */ + axisLabelFontWeight: 'normal', + /** 坐标轴刻度文本距离坐标轴线的间距 */ + axisLabelOffset: 8, + /** 坐标轴网格线颜色 */ + axisGridBorderColor: BLACK_COLORS$1[15], + /** 坐标轴网格线粗细 */ + axisGridBorder: 1, + /** 坐标轴网格线虚线设置 */ + axisGridLineDash: null, + // -------------------- 图例 -------------------- + /** 图例标题颜色 */ + legendTitleTextFillColor: BLACK_COLORS$1[45], + /** 图例标题文本字体大小 */ + legendTitleTextFontSize: 12, + /** 图例标题文本行高 */ + legendTitleTextLineHeight: 21, + /** 图例标题文本字体粗细 */ + legendTitleTextFontWeight: 'normal', + /** 图例 marker 颜色 */ + legendMarkerColor: brandColor, + /** 图例 marker 距离图例文本的间距 */ + legendMarkerSpacing: 8, + /** 图例 marker 默认半径大小 */ + legendMarkerSize: 4, + /** 图例 'circle' marker 半径 */ + legendCircleMarkerSize: 4, + /** 图例 'square' marker 半径 */ + legendSquareMarkerSize: 4, + /** 图例 'line' marker 半径 */ + legendLineMarkerSize: 5, + /** 图例项文本颜色 */ + legendItemNameFillColor: BLACK_COLORS$1[65], + /** 图例项文本字体大小 */ + legendItemNameFontSize: 12, + /** 图例项文本行高 */ + legendItemNameLineHeight: 12, + /** 图例项粗细 */ + legendItemNameFontWeight: 'normal', + /** 图例项之间的水平间距 */ + legendItemSpacing: 24, + /** 图例项垂直方向的间隔 */ + legendItemMarginBottom: 12, + /** 图例与图表绘图区域的偏移距离 */ + legendPadding: [8, 8, 8, 8], + /** 水平布局的图例与绘图区域偏移距离 */ + legendHorizontalPadding: [8, 0, 8, 0], + /** 垂直布局的图例与绘图区域偏移距离 */ + legendVerticalPadding: [0, 8, 0, 8], + // 图例分页器 + /** 图例分页器 marker 大小 */ + legendPageNavigatorMarkerSize: 12, + /** 图例分页器 marker 非激活状态填充色 */ + legendPageNavigatorMarkerInactiveFillColor: BLACK_COLORS$1[100], + /** 图例分页器 marker 非激活状态填充色透明度 */ + legendPageNavigatorMarkerInactiveFillOpacity: 0.45, + /** 图例分页器 marker 填充色 */ + legendPageNavigatorMarkerFillColor: BLACK_COLORS$1[100], + /** 图例分页器 marker 填充色透明度 */ + legendPageNavigatorMarkerFillOpacity: 1, + /** 图例分页器文本颜色 */ + legendPageNavigatorTextFillColor: BLACK_COLORS$1[45], + /** 图例分页器文本字体大小 */ + legendPageNavigatorTextFontSize: 12, + /** 连续图例滑块填充色 */ + sliderRailFillColor: BLACK_COLORS$1[15], + /** 连续图例滑块边框粗细 */ + sliderRailBorder: 0, + /** 连续图例滑块边框颜色 */ + sliderRailBorderColor: null, + /** 连续图例滑块宽度 */ + sliderRailWidth: 100, + /** 连续图例滑块高度 */ + sliderRailHeight: 12, + /** 连续图例文本颜色 */ + sliderLabelTextFillColor: BLACK_COLORS$1[45], + /** 连续图例文本字体大小 */ + sliderLabelTextFontSize: 12, + /** 连续图例文本行高 */ + sliderLabelTextLineHeight: 12, + /** 连续图例文本字体粗细 */ + sliderLabelTextFontWeight: 'normal', + /** 连续图例滑块颜色 */ + sliderHandlerFillColor: BLACK_COLORS$1[6], + /** 连续图例滑块宽度 */ + sliderHandlerWidth: 10, + /** 连续图例滑块高度 */ + sliderHandlerHeight: 14, + /** 连续图例滑块边框粗细 */ + sliderHandlerBorder: 1, + /** 连续图例滑块边框颜色 */ + sliderHandlerBorderColor: BLACK_COLORS$1[25], + // -------------------- Annotation，图形标注 -------------------- + /** arc 图形标注描边颜色 */ + annotationArcBorderColor: BLACK_COLORS$1[15], + /** arc 图形标注粗细 */ + annotationArcBorder: 1, + /** line 图形标注颜色 */ + annotationLineBorderColor: BLACK_COLORS$1[25], + /** line 图形标注粗细 */ + annotationLineBorder: 1, + /** lube 图形标注的虚线间隔 */ + annotationLineDash: null, + /** text 图形标注文本颜色 */ + annotationTextFillColor: BLACK_COLORS$1[65], + /** text 图形标注文本字体大小 */ + annotationTextFontSize: 12, + /** text 图形标注文本行高 */ + annotationTextLineHeight: 12, + /** text 图形标注文本字体粗细 */ + annotationTextFontWeight: 'normal', + /** text 图形标注文本边框颜色 */ + annotationTextBorderColor: null, + /** text 图形标注文本边框粗细 */ + annotationTextBorder: 0, + /** region 图形标注填充颜色 */ + annotationRegionFillColor: BLACK_COLORS$1[100], + /** region 图形标注填充颜色透明色 */ + annotationRegionFillOpacity: 0.06, + /** region 图形标注描边粗细 */ + annotationRegionBorder: 0, + /** region 图形标注描边颜色 */ + annotationRegionBorderColor: null, + /** dataMarker 图形标注线的长度 */ + annotationDataMarkerLineLength: 16, + // -------------------- Tooltip -------------------- + /** tooltip crosshairs 辅助线颜色 */ + tooltipCrosshairsBorderColor: BLACK_COLORS$1[25], + /** tooltip crosshairs 辅助线粗细 */ + tooltipCrosshairsBorder: 1, + /** tooltip crosshairs 辅助线虚线间隔 */ + tooltipCrosshairsLineDash: null, + /** tooltip 内容框背景色 */ + tooltipContainerFillColor: 'rgb(255, 255, 255)', + tooltipContainerFillOpacity: 0.95, + /** tooltip 内容框阴影 */ + tooltipContainerShadow: '0px 0px 10px #aeaeae', + /** tooltip 内容框圆角 */ + tooltipContainerBorderRadius: 3, + /** tooltip 文本颜色 */ + tooltipTextFillColor: BLACK_COLORS$1[65], + /** tooltip 文本字体大小 */ + tooltipTextFontSize: 12, + /** tooltip 文本行高 */ + tooltipTextLineHeight: 12, + /** tooltip 文本字体粗细 */ + tooltipTextFontWeight: 'bold', + // -------------------- Geometry labels -------------------- + /** Geometry label 文本颜色 */ + labelFillColor: BLACK_COLORS$1[65], + labelFillColorDark: '#2c3542', + labelFillColorLight: '#ffffff', + /** Geometry label 文本字体大小 */ + labelFontSize: 12, + /** Geometry label 文本行高 */ + labelLineHeight: 12, + /** Geometry label 文本字体粗细 */ + labelFontWeight: 'normal', + /** Geometry label 文本描边颜色 */ + labelBorderColor: null, + /** Geometry label 文本描边粗细 */ + labelBorder: 0, + /** Geometry innerLabel 文本颜色 */ + innerLabelFillColor: WHITE_COLORS$1[100], + /** Geometry innerLabel 文本字体大小 */ + innerLabelFontSize: 12, + /** Geometry innerLabel 文本行高 */ + innerLabelLineHeight: 12, + /** Geometry innerLabel 文本字体粗细 */ + innerLabelFontWeight: 'normal', + /** Geometry innerLabel 文本描边颜色 */ + innerLabelBorderColor: null, + /** Geometry innerLabel 文本描边粗细 */ + innerLabelBorder: 0, + /** Geometry overflowLabel 文本颜色 */ + overflowLabelFillColor: BLACK_COLORS$1[65], + /** Geometry overflowLabel 文本字体大小 */ + overflowLabelFontSize: 12, + /** Geometry overflowLabel 文本行高 */ + overflowLabelLineHeight: 12, + /** Geometry overflowLabel 文本字体粗细 */ + overflowLabelFontWeight: 'normal', + /** Geometry overflowLabel 文本描边颜色 */ + overflowLabelBorderColor: WHITE_COLORS$1[100], + /** Geometry overflowLabel 文本描边粗细 */ + overflowLabelBorder: 1, + /** Geometry label　文本连接线粗细 */ + labelLineBorder: 1, + /** Geometry label 文本连接线颜色 */ + labelLineBorderColor: BLACK_COLORS$1[25], + // -------------------- Slider 组件样式-------------------- + /** slider 滑道高度 */ + cSliderRailHieght: 16, + /** slider 滑道背景色 */ + cSliderBackgroundFillColor: '#416180', + /** slider 滑道背景色透明度 */ + cSliderBackgroundFillOpacity: 0.05, + /** slider 滑道前景色 */ + cSliderForegroundFillColor: '#5B8FF9', + /** slider 滑道前景色透明度 */ + cSliderForegroundFillOpacity: 0.15, + // slider handlerStyle 手柄样式 + /** slider 手柄高度 */ + cSliderHandlerHeight: 24, + /** Slider 手柄宽度 */ + cSliderHandlerWidth: 10, + /** Slider 手柄背景色 */ + cSliderHandlerFillColor: '#F7F7F7', + /** Slider 手柄背景色透明度 */ + cSliderHandlerFillOpacity: 1, + /** Slider 手柄高亮背景色 */ + cSliderHandlerHighlightFillColor: '#FFF', + /** Slider 手柄边框色 */ + cSliderHandlerBorderColor: '#BFBFBF', + /** Slider 手柄边框粗细 */ + cSliderHandlerBorder: 1, + /** Slider 手柄边框圆角 */ + cSliderHandlerBorderRadius: 2, + // slider textStyle 字体标签样式 + /** Slider 字体标签颜色 */ + cSliderTextFillColor: '#000', + /** Slider 字体标签透明度 */ + cSliderTextFillOpacity: 0.45, + /** Slider 字体标签大小 */ + cSliderTextFontSize: 12, + /** Slider 字体标签行高 */ + cSliderTextLineHeight: 12, + /** Slider 字体标签字重 */ + cSliderTextFontWeight: 'normal', + /** Slider 字体标签描边色 */ + cSliderTextBorderColor: null, + /** Slider 字体标签描边粗细 */ + cSliderTextBorder: 0, + // -------------------- Scrollbar 组件样式-------------------- + /** 滚动条 滚道填充色 */ + scrollbarTrackFillColor: 'rgba(0,0,0,0)', + /** 滚动条 滑块填充色 */ + scrollbarThumbFillColor: 'rgba(0,0,0,0.15)', + /** 滚动条 滑块高亮填充色 */ + scrollbarThumbHighlightFillColor: 'rgba(0,0,0,0.2)', + // -------------------- Geometry 图形样式-------------------- + /** 点图填充颜色 */ + pointFillColor: brandColor, + /** 点图填充颜色透明度 */ + pointFillOpacity: 0.95, + /** 点图大小 */ + pointSize: 4, + /** 点图描边粗细 */ + pointBorder: 1, + /** 点图描边颜色 */ + pointBorderColor: WHITE_COLORS$1[100], + /** 点图描边透明度 */ + pointBorderOpacity: 1, + /** 点图 active 状态下描边颜色 */ + pointActiveBorderColor: BLACK_COLORS$1[100], + /** 点图 selected 状态下描边粗细 */ + pointSelectedBorder: 2, + /** 点图 selected 状态下描边颜色 */ + pointSelectedBorderColor: BLACK_COLORS$1[100], + /** 点图 inactive 状态下填充颜色透明度 */ + pointInactiveFillOpacity: 0.3, + /** 点图 inactive 状态下描边透明度 */ + pointInactiveBorderOpacity: 0.3, + /** 空心点图大小 */ + hollowPointSize: 4, + /** 空心点图描边粗细 */ + hollowPointBorder: 1, + /** 空心点图描边颜色 */ + hollowPointBorderColor: brandColor, + /** 空心点图描边透明度 */ + hollowPointBorderOpacity: 0.95, + hollowPointFillColor: WHITE_COLORS$1[100], + /** 空心点图 active 状态下描边粗细 */ + hollowPointActiveBorder: 1, + /** 空心点图 active 状态下描边颜色 */ + hollowPointActiveBorderColor: BLACK_COLORS$1[100], + /** 空心点图 active 状态下描边透明度 */ + hollowPointActiveBorderOpacity: 1, + /** 空心点图 selected 状态下描边粗细 */ + hollowPointSelectedBorder: 2, + /** 空心点图 selected 状态下描边颜色 */ + hollowPointSelectedBorderColor: BLACK_COLORS$1[100], + /** 空心点图 selected 状态下描边透明度 */ + hollowPointSelectedBorderOpacity: 1, + /** 空心点图 inactive 状态下描边透明度 */ + hollowPointInactiveBorderOpacity: 0.3, + /** 线图粗细 */ + lineBorder: 2, + /** 线图颜色 */ + lineBorderColor: brandColor, + /** 线图透明度 */ + lineBorderOpacity: 1, + /** 线图 Active 状态下粗细 */ + lineActiveBorder: 3, + /** 线图 selected 状态下粗细 */ + lineSelectedBorder: 3, + /** 线图 inactive 状态下透明度 */ + lineInactiveBorderOpacity: 0.3, + /** area 填充颜色 */ + areaFillColor: brandColor, + /** area 填充透明度 */ + areaFillOpacity: 0.25, + /** area 在 active 状态下的填充透明度 */ + areaActiveFillColor: brandColor, + areaActiveFillOpacity: 0.5, + /** area 在 selected 状态下的填充透明度 */ + areaSelectedFillColor: brandColor, + areaSelectedFillOpacity: 0.5, + /** area inactive 状态下填充透明度 */ + areaInactiveFillOpacity: 0.3, + /** hollowArea 颜色 */ + hollowAreaBorderColor: brandColor, + /** hollowArea 边框粗细 */ + hollowAreaBorder: 2, + /** hollowArea 边框透明度 */ + hollowAreaBorderOpacity: 1, + /** hollowArea active 状态下的边框粗细 */ + hollowAreaActiveBorder: 3, + hollowAreaActiveBorderColor: BLACK_COLORS$1[100], + /** hollowArea selected 状态下的边框粗细 */ + hollowAreaSelectedBorder: 3, + hollowAreaSelectedBorderColor: BLACK_COLORS$1[100], + /** hollowArea inactive 状态下的边框透明度 */ + hollowAreaInactiveBorderOpacity: 0.3, + /** interval 填充颜色 */ + intervalFillColor: brandColor, + /** interval 填充透明度 */ + intervalFillOpacity: 0.95, + /** interval active 状态下边框粗细 */ + intervalActiveBorder: 1, + /** interval active 状态下边框颜色 */ + intervalActiveBorderColor: BLACK_COLORS$1[100], + intervalActiveBorderOpacity: 1, + /** interval selected 状态下边框粗细 */ + intervalSelectedBorder: 2, + /** interval selected 状态下边框颜色 */ + intervalSelectedBorderColor: BLACK_COLORS$1[100], + /** interval selected 状态下边框透明度 */ + intervalSelectedBorderOpacity: 1, + /** interval inactive 状态下边框透明度 */ + intervalInactiveBorderOpacity: 0.3, + /** interval inactive 状态下填充透明度 */ + intervalInactiveFillOpacity: 0.3, + /** interval 边框粗细 */ + hollowIntervalBorder: 2, + /** hollowInterval 边框颜色 */ + hollowIntervalBorderColor: brandColor, + /** hollowInterval 边框透明度 */ + hollowIntervalBorderOpacity: 1, + hollowIntervalFillColor: WHITE_COLORS$1[100], + /** hollowInterval active 状态下边框粗细 */ + hollowIntervalActiveBorder: 2, + /** hollowInterval active 状态下边框颜色 */ + hollowIntervalActiveBorderColor: BLACK_COLORS$1[100], + /** hollowInterval selected 状态下边框粗细 */ + hollowIntervalSelectedBorder: 3, + /** hollowInterval selected 状态下边框颜色 */ + hollowIntervalSelectedBorderColor: BLACK_COLORS$1[100], + /** hollowInterval selected 状态下边框透明度 */ + hollowIntervalSelectedBorderOpacity: 1, + /** hollowInterval inactive 状态下边框透明度 */ + hollowIntervalInactiveBorderOpacity: 0.3, + }; +}; +createLightStyleSheet(); + +function createTheme(themeCfg) { + var _a = themeCfg.styleSheet, styleSheetCfg = _a === void 0 ? {} : _a, themeObject = __rest$G(themeCfg, ["styleSheet"]); + // ① 创建样式表 (默认创建 light 的样式表) + var styleSheet = createLightStyleSheet(styleSheetCfg); + // ② 创建主题 + return deepMix({}, createThemeByStyleSheet(styleSheet), themeObject); +} + +var defaultTheme = createTheme({}); +// 所有已经存在的主题 +var Themes = { + default: defaultTheme, +}; +/** + * 获取主题配置信息。 + * @param theme 主题名 + */ +function getTheme(theme) { + return get$3(Themes, lowerCase$1(theme), Themes.default); +} +/** + * 注册新的主题配置信息。 + * @param theme 主题名。 + * @param value 具体的主题配置。 + */ +function registerTheme(theme, value) { + Themes[lowerCase$1(theme)] = createTheme(value); +} + +function snapEqual(v1, v2, scale) { + var value1 = scale.translate(v1); + var value2 = scale.translate(v2); + return isNumberEqual$1(value1, value2); +} +function getXValueByPoint(point, geometry) { + var coordinate = geometry.coordinate; + var xScale = geometry.getXScale(); + var range = xScale.range; + var rangeMax = range[range.length - 1]; + var rangeMin = range[0]; + var invertPoint = coordinate.invert(point); + var xValue = invertPoint.x; + if (coordinate.isPolar && xValue > (1 + rangeMax) / 2) { + xValue = rangeMin; // 极坐标下，scale 的 range 被做过特殊处理 + } + return xScale.translate(xScale.invert(xValue)); +} +function filterYValue(data, point, geometry) { + var coordinate = geometry.coordinate; + var yScale = geometry.getYScale(); + var yField = yScale.field; + var invertPoint = coordinate.invert(point); + var yValue = yScale.invert(invertPoint.y); + var result = find$3(data, function (obj) { + var originData = obj[FIELD_ORIGIN]; + return originData[yField][0] <= yValue && originData[yField][1] >= yValue; + }); + return result || data[data.length - 1]; +} +var getXDistance = memoize$2(function (scale) { + if (scale.isCategory) { + return 1; + } + var scaleValues = scale.values; // values 是无序的 + var length = scaleValues.length; + var min = scale.translate(scaleValues[0]); + var max = min; + for (var index = 0; index < length; index++) { + var value = scaleValues[index]; + // 时间类型需要 translate + var numericValue = scale.translate(value); + if (numericValue < min) { + min = numericValue; + } + if (numericValue > max) { + max = numericValue; + } + } + return (max - min) / (length - 1); +}); +/** + * 获得 tooltip 的 title + * @param originData + * @param geometry + * @param title + */ +function getTooltipTitle(originData, geometry, title) { + var positionAttr = geometry.getAttribute('position'); + var fields = positionAttr.getFields(); + var scales = geometry.scales; + var titleField = isFunction$6(title) || !title ? fields[0] : title; + var titleScale = scales[titleField]; + // 如果创建了该字段对应的 scale，则通过 scale.getText() 方式取值，因为用户可能对数据进行了格式化 + // 如果没有对应的 scale，则从原始数据中取值，如果原始数据中仍不存在，则直接放回 title 值 + var tooltipTitle = titleScale ? titleScale.getText(originData[titleField]) : originData[titleField] || titleField; + return isFunction$6(title) ? title(tooltipTitle, originData) : tooltipTitle; +} +function getAttributesForLegend(geometry) { + var attributes = values$1(geometry.attributes); + return filter$1(attributes, function (attribute) { return contains(GROUP_ATTRS, attribute.type); }); +} +function getTooltipValueScale(geometry) { + var attributes = getAttributesForLegend(geometry); + var scale; + for (var _i = 0, attributes_1 = attributes; _i < attributes_1.length; _i++) { + var attribute = attributes_1[_i]; + var tmpScale = attribute.getScale(attribute.type); + if (tmpScale && tmpScale.isLinear) { + // 如果指定字段是非 position 的，同时是连续的 + scale = tmpScale; + break; + } + } + var xScale = geometry.getXScale(); + var yScale = geometry.getYScale(); + return scale || yScale || xScale; +} +function getTooltipValue(originData, valueScale) { + var field = valueScale.field; + var value = originData[field]; + if (isArray$n(value)) { + var texts = value.map(function (eachValue) { + return valueScale.getText(eachValue); + }); + return texts.join('-'); + } + return valueScale.getText(value); +} +// 根据原始数据获取 tooltip item 中 name 值 +function getTooltipName(originData, geometry) { + var nameScale; + var groupScales = geometry.getGroupScales(); + if (groupScales.length) { + // 如果存在分组类型，取第一个分组类型 + nameScale = groupScales[0]; + } + if (nameScale) { + var field = nameScale.field; + return nameScale.getText(originData[field]); + } + var valueScale = getTooltipValueScale(geometry); + return getName(valueScale); +} +/** + * @ignore + * Finds data from geometry by point + * @param point canvas point + * @param data an item of geometry.dataArray + * @param geometry + * @returns + */ +function findDataByPoint(point, data, geometry) { + if (data.length === 0) { + return null; + } + var geometryType = geometry.type; + var xScale = geometry.getXScale(); + var yScale = geometry.getYScale(); + var xField = xScale.field; + var yField = yScale.field; + var rst = null; + // 热力图采用最小逼近策略查找 point 击中的数据 + if (geometryType === 'heatmap' || geometryType === 'point') { + // 将 point 画布坐标转换为原始数据值 + var coordinate = geometry.coordinate; + var invertPoint = coordinate.invert(point); // 转换成归一化的数据 + var x = xScale.invert(invertPoint.x); // 转换为原始值 + var y = yScale.invert(invertPoint.y); // 转换为原始值 + var min = Infinity; + for (var index = 0; index < data.length; index++) { + var obj = data[index]; + var originData = obj[FIELD_ORIGIN]; + var range = Math.pow((originData[xField] - x), 2) + Math.pow((originData[yField] - y), 2); + if (range < min) { + min = range; + rst = obj; + } + } + return rst; + } + // 其他 Geometry 类型按照 x 字段数据进行查找 + var first = data[0]; + var last = data[data.length - 1]; + var xValue = getXValueByPoint(point, geometry); + var firstXValue = first[FIELD_ORIGIN][xField]; + var firstYValue = first[FIELD_ORIGIN][yField]; + var lastXValue = last[FIELD_ORIGIN][xField]; + var isYArray = yScale.isLinear && isArray$n(firstYValue); // 考虑 x 维度相同，y 是数组区间的情况 + // 如果 x 的值是数组 + if (isArray$n(firstXValue)) { + for (var index = 0; index < data.length; index++) { + var record = data[index]; + var originData = record[FIELD_ORIGIN]; + // xValue 在 originData[xField] 的数值区间内 + if (xScale.translate(originData[xField][0]) <= xValue && xScale.translate(originData[xField][1]) >= xValue) { + if (isYArray) { + // 层叠直方图场景，x 和 y 都是数组区间 + if (!isArray$n(rst)) { + rst = []; + } + rst.push(record); + } + else { + rst = record; + break; + } + } + } + if (isArray$n(rst)) { + rst = filterYValue(rst, point, geometry); + } + } + else { + var next = void 0; + if (!xScale.isLinear && xScale.type !== 'timeCat') { + // x 轴对应的数据为非线性以及非时间类型的数据采用遍历查找 + for (var index = 0; index < data.length; index++) { + var record = data[index]; + var originData = record[FIELD_ORIGIN]; + if (snapEqual(originData[xField], xValue, xScale)) { + if (isYArray) { + if (!isArray$n(rst)) { + rst = []; + } + rst.push(record); + } + else { + rst = record; + break; + } + } + else if (xScale.translate(originData[xField]) <= xValue) { + last = record; + next = data[index + 1]; + } + } + if (isArray$n(rst)) { + rst = filterYValue(rst, point, geometry); + } + } + else { + // x 轴对应的数据为线性以及时间类型，进行二分查找，性能更好 + if ((xValue > xScale.translate(lastXValue) || xValue < xScale.translate(firstXValue)) && + (xValue > xScale.max || xValue < xScale.min)) { + // 不在数据范围内 + return null; + } + var firstIdx = 0; + var lastIdx = data.length - 1; + var middleIdx = void 0; + while (firstIdx <= lastIdx) { + middleIdx = Math.floor((firstIdx + lastIdx) / 2); + var item = data[middleIdx][FIELD_ORIGIN][xField]; + if (snapEqual(item, xValue, xScale)) { + return data[middleIdx]; + } + if (xScale.translate(item) <= xScale.translate(xValue)) { + firstIdx = middleIdx + 1; + last = data[middleIdx]; + next = data[middleIdx + 1]; + } + else { + if (lastIdx === 0) { + last = data[0]; + } + lastIdx = middleIdx - 1; + } + } + } + if (last && next) { + // 计算最逼近的 + if (Math.abs(xScale.translate(last[FIELD_ORIGIN][xField]) - xValue) > + Math.abs(xScale.translate(next[FIELD_ORIGIN][xField]) - xValue)) { + last = next; + } + } + } + var distance = getXDistance(geometry.getXScale()); // 每个分类间的平均间距 + if (!rst && Math.abs(xScale.translate(last[FIELD_ORIGIN][xField]) - xValue) <= distance / 2) { + rst = last; + } + return rst; +} +/** + * @ignore + * Gets tooltip items + * @param data + * @param geometry + * @param [title] + * @returns + */ +function getTooltipItems(data, geometry, title, showNil) { + if (title === void 0) { title = ''; } + if (showNil === void 0) { showNil = false; } + var originData = data[FIELD_ORIGIN]; + var tooltipTitle = getTooltipTitle(originData, geometry, title); + var tooltipOption = geometry.tooltipOption; + var defaultColor = geometry.theme.defaultColor; + var items = []; + var name; + var value; + function addItem(itemName, itemValue) { + if (showNil || (!isNil(itemValue) && itemValue !== '')) { + // 值为 null的时候，忽视 + var item = { + title: tooltipTitle, + data: originData, + mappingData: data, + name: itemName, + value: itemValue, + color: data.color || defaultColor, + marker: true, + }; + items.push(item); + } + } + if (isObject$f(tooltipOption)) { + var fields = tooltipOption.fields, callback = tooltipOption.callback; + if (callback) { + // 用户定义了回调函数 + var callbackParams = fields.map(function (field) { + return data[FIELD_ORIGIN][field]; + }); + var cfg = callback.apply(void 0, callbackParams); + var itemCfg = __assign$r({ data: data[FIELD_ORIGIN], mappingData: data, title: tooltipTitle, color: data.color || defaultColor, marker: true }, cfg); + items.push(itemCfg); + } + else { + var scales = geometry.scales; + for (var _i = 0, fields_1 = fields; _i < fields_1.length; _i++) { + var field = fields_1[_i]; + if (!isNil(originData[field])) { + // 字段数据为null, undefined 时不显示 + var scale = scales[field]; + name = getName(scale); + value = scale.getText(originData[field]); + addItem(name, value); + } + } + } + } + else { + var valueScale = getTooltipValueScale(geometry); + // 字段数据为null ,undefined时不显示 + value = getTooltipValue(originData, valueScale); + name = getTooltipName(originData, geometry); + addItem(name, value); + } + return items; +} +function getTooltipItemsByFindData(geometry, point, title, tooltipCfg) { + var showNil = tooltipCfg.showNil; + var result = []; + var dataArray = geometry.dataArray; + if (!isEmpty$1(dataArray)) { + geometry.sort(dataArray); // 先进行排序，便于 tooltip 查找 + for (var _i = 0, dataArray_1 = dataArray; _i < dataArray_1.length; _i++) { + var data = dataArray_1[_i]; + var record = findDataByPoint(point, data, geometry); + if (record) { + var elementId = geometry.getElementId(record); + var element = geometry.elementsMap[elementId]; + if (geometry.type === 'heatmap' || element.visible) { + // Heatmap 没有 Element + // 如果图形元素隐藏了，怎不再 tooltip 上展示相关数据 + var items = getTooltipItems(record, geometry, title, showNil); + if (items.length) { + result.push(items); + } + } + } + } + } + return result; +} +function getTooltipItemsByHitShape(geometry, point, title, tooltipCfg) { + var showNil = tooltipCfg.showNil; + var result = []; + var container = geometry.container; + var shape = container.getShape(point.x, point.y); + if (shape && shape.get('visible') && shape.get('origin')) { + var mappingData = shape.get('origin').mappingData; + var items = getTooltipItems(mappingData, geometry, title, showNil); + if (items.length) { + result.push(items); + } + } + return result; +} +/** + * 不进行递归查找 + */ +function findItemsFromView(view, point, tooltipCfg) { + var result = []; + // 先从 view 本身查找 + var geometries = view.geometries; + var shared = tooltipCfg.shared, title = tooltipCfg.title, reversed = tooltipCfg.reversed; + for (var _i = 0, geometries_1 = geometries; _i < geometries_1.length; _i++) { + var geometry = geometries_1[_i]; + if (geometry.visible && geometry.tooltipOption !== false) { + // geometry 可见同时未关闭 tooltip + var geometryType = geometry.type; + var tooltipItems = void 0; + if (['point', 'edge', 'polygon'].includes(geometryType)) { + // 始终通过图形拾取 + tooltipItems = getTooltipItemsByHitShape(geometry, point, title, tooltipCfg); + } + else if (['area', 'line', 'path', 'heatmap'].includes(geometryType)) { + // 如果是 'area', 'line', 'path'，始终通过数据查找方法查找 tooltip + tooltipItems = getTooltipItemsByFindData(geometry, point, title, tooltipCfg); + } + else { + if (shared !== false) { + tooltipItems = getTooltipItemsByFindData(geometry, point, title, tooltipCfg); + } + else { + tooltipItems = getTooltipItemsByHitShape(geometry, point, title, tooltipCfg); + } + } + if (tooltipItems.length) { + if (reversed) { + tooltipItems.reverse(); + } + // geometry 有可能会有多个 item，因为用户可以设置 geometry.tooltip('x*y*z') + result.push(tooltipItems); + } + } + } + return result; +} +function findItemsFromViewRecurisive(view, point, tooltipCfg) { + var result = findItemsFromView(view, point, tooltipCfg); + // 递归查找，并合并结果 + for (var _i = 0, _a = view.views; _i < _a.length; _i++) { + var childView = _a[_i]; + result = result.concat(findItemsFromView(childView, point, tooltipCfg)); + } + return result; +} + +/** + * @ignore + * 是否是自动 padding + * @param padding + */ +function isAutoPadding(padding) { + return !isNumber$4(padding) && !isArray$n(padding); +} +/** + * @ignore + * padding 的解析逻辑 + * @param padding + * @return [ top, right, bottom, left ] + */ +function parsePadding(padding) { + if (padding === void 0) { padding = 0; } + var paddingArray = isArray$n(padding) ? padding : [padding]; + switch (paddingArray.length) { + case 0: + paddingArray = [0, 0, 0, 0]; + break; + case 1: + paddingArray = new Array(4).fill(paddingArray[0]); + break; + case 2: + paddingArray = __spreadArrays$1(paddingArray, paddingArray); + break; + case 3: + paddingArray = __spreadArrays$1(paddingArray, [paddingArray[1]]); + break; + default: + // 其他情况，只去四个 + paddingArray = paddingArray.slice(0, 4); + break; + } + return paddingArray; +} + +var LOAD_COMPONENT_CONTROLLERS = {}; +/** + * 全局注册组件。 + * @param name 组件名称 + * @param plugin 注册的组件类 + * @returns void + */ +function registerComponentController(name, plugin) { + LOAD_COMPONENT_CONTROLLERS[name] = plugin; +} +/** + * 获取以注册的组件名。 + * @returns string[] 返回已注册的组件名称 + */ +function getComponentControllerNames() { + return Object.keys(LOAD_COMPONENT_CONTROLLERS); +} +/** + * 根据组件名获取组件类。 + * @param name 组件名 + * @returns 返回组件类 + */ +function getComponentController(name) { + return LOAD_COMPONENT_CONTROLLERS[name]; +} + +/** + * coordinate controller，职责： + * 1. 创建实例 + * 2. 暂存配置 + */ +var CoordinateController = /** @class */ (function () { + function CoordinateController(option) { + // 设置默认值，并存储配置 + this.option = this.wrapperOption(option); + } + /** + * 更新配置 + * @param option + */ + CoordinateController.prototype.update = function (option) { + this.option = this.wrapperOption(option); + return this; + }; + /** + * 是否存在某一个 action + * @param actionName + */ + CoordinateController.prototype.hasAction = function (actionName) { + var actions = this.option.actions; + return some(actions, function (action) { return action[0] === actionName; }); + }; + /** + * 创建坐标系对象 + * @param start 起始位置 + * @param end 结束位置 + * @return 坐标系实例 + */ + CoordinateController.prototype.create = function (start, end) { + var _a = this.option, type = _a.type, cfg = _a.cfg; + var isTheta = type === 'theta'; + // 1. 起始位置 + var props = __assign$r({ start: start, + end: end }, cfg); + // 2. 创建实例 + var C = getCoordinate(isTheta ? 'polar' : type); + this.coordinate = new C(props); + // @ts-ignore FIXME coordinate 包问题导致 type 不正确 + this.coordinate.type = type; + // 3. 添加默认 action + if (isTheta) { + // 不存在 transpose，为其自动设置一个 action + if (!this.hasAction('transpose')) { + this.transpose(); + } + } + // 4. 执行 action + this.execActions(); + return this.coordinate; + }; + /** + * 更新坐标系对象 + * @param start 起始位置 + * @param end 结束位置 + * @return 坐标系实例 + */ + CoordinateController.prototype.adjust = function (start, end) { + this.coordinate.update({ + start: start, + end: end, + }); + // 更新坐标系大小的时候，需要： + // 1. 重置 matrix + // 2. 重新执行作用于 matrix 的 action + this.coordinate.resetMatrix(); + this.execActions(['scale', 'rotate', 'translate']); + return this.coordinate; + }; + /** + * 旋转弧度 + * @param angle + */ + CoordinateController.prototype.rotate = function (angle) { + this.option.actions.push(['rotate', angle]); + return this; + }; + /** + * 镜像 + * @param dim + */ + CoordinateController.prototype.reflect = function (dim) { + this.option.actions.push(['reflect', dim]); + return this; + }; + /** + * scale + * @param sx + * @param sy + */ + CoordinateController.prototype.scale = function (sx, sy) { + this.option.actions.push(['scale', sx, sy]); + return this; + }; + /** + * 对角变换 + */ + CoordinateController.prototype.transpose = function () { + this.option.actions.push(['transpose']); + return this; + }; + /** + * 获取配置 + */ + CoordinateController.prototype.getOption = function () { + return this.option; + }; + /** + * 获得 coordinate 实例 + */ + CoordinateController.prototype.getCoordinate = function () { + return this.coordinate; + }; + /** + * 包装配置的默认值 + * @param option + */ + CoordinateController.prototype.wrapperOption = function (option) { + return __assign$r({ type: 'rect', actions: [], cfg: {} }, option); + }; + /** + * coordinate 实例执行 actions + * @params includeActions 如果没有指定，则执行全部，否则，执行指定的 action + */ + CoordinateController.prototype.execActions = function (includeActions) { + var _this = this; + var actions = this.option.actions; + each$2(actions, function (action) { + var _a; + var actionName = action[0], args = action.slice(1); + var shouldExec = isNil(includeActions) ? true : includeActions.includes(actionName); + if (shouldExec) { + (_a = _this.coordinate)[actionName].apply(_a, args); + } + }); + }; + return CoordinateController; +}()); + +/** + * @todo Whether it can(or necessary to) keep consistent with the structure of G.Event or directly use the structure of G.Event + * G2 事件的事件包装类，基于 G.Event + */ +var Event = /** @class */ (function () { + function Event(view, gEvent, data) { + this.view = view; + this.gEvent = gEvent; + this.data = data; + this.type = gEvent.type; + } + /** + * 非交互产生的事件 + * @param view + * @param type + * @param data + */ + Event.fromData = function (view, type, data) { + return new Event(view, new GraphEvent$1(type, {}), data); + }; + Object.defineProperty(Event.prototype, "target", { + // below props are proxy props of G.event convenient + /** the real trigger shape of the event */ + get: function () { + // @todo G 中事件定义为 object 不正确，这里先 ignore + // @ts-ignore + return this.gEvent.target; + }, + enumerable: false, + configurable: true + }); + Object.defineProperty(Event.prototype, "event", { + /** 获取对应的 dom 原生时间 */ + get: function () { + return this.gEvent.originalEvent; + }, + enumerable: false, + configurable: true + }); + Object.defineProperty(Event.prototype, "x", { + /** x 画布坐标 */ + get: function () { + return this.gEvent.x; + }, + enumerable: false, + configurable: true + }); + Object.defineProperty(Event.prototype, "y", { + /** y 画布坐标 */ + get: function () { + return this.gEvent.y; + }, + enumerable: false, + configurable: true + }); + Object.defineProperty(Event.prototype, "clientX", { + /** x 窗口坐标 */ + get: function () { + return this.gEvent.clientX; + }, + enumerable: false, + configurable: true + }); + Object.defineProperty(Event.prototype, "clientY", { + /** y 窗口坐标 */ + get: function () { + return this.gEvent.clientY; + }, + enumerable: false, + configurable: true + }); + // end for proxy events + /** + * event string + * @returns string + */ + Event.prototype.toString = function () { + return "[Event (type=" + this.type + ")]"; + }; + /** + * clone a new event with same attributes + * @returns [[Event]] + */ + Event.prototype.clone = function () { + return new Event(this.view, this.gEvent, this.data); + }; + return Event; +}()); +var Event$1 = Event; + +/** + * @ignore + * G2 默认提供的 layout 函数 + * 内置布局函数处理的逻辑： + * + * 1. 如果 padding = 'auto'，那么自动根据组件的 direction 来计算 padding 数组 + * 2. 根据 padding 和 direction 去分配对应方向的 padding 数值 + * 3. 移动组件位置 + * + * 前面 1，2 步骤在 view 中已经做掉了。对于组件响应式布局，可以尝试使用约束布局的方式去求解位置信息。 + * @param view + */ +function defaultLayout$c(view) { + var axis = view.getController('axis'); + var legend = view.getController('legend'); + var annotation = view.getController('annotation'); + var slider = view.getController('slider'); + var scrollbar = view.getController('scrollbar'); + // 根据最新的 coordinate 重新布局组件 + [axis, slider, scrollbar, legend, annotation].forEach(function (controller) { + if (controller) { + controller.layout(); + } + }); +} + +/** + * view 中缓存 scale 的类 + */ +/** @ignore */ +var ScalePool = /** @class */ (function () { + function ScalePool() { + /** 所有的 scales */ + this.scales = new Map(); + /** 需要同步的 scale 分组， key: scaleKeyArray */ + this.syncScales = new Map(); + } + /** + * 创建 scale + * @param field + * @param data + * @param scaleDef + * @param key + */ + ScalePool.prototype.createScale = function (field, data, scaleDef, key) { + var finalScaleDef = scaleDef; + var cacheScaleMeta = this.getScaleMeta(key); + if (data.length === 0 && cacheScaleMeta) { + // 在更新过程中数据变为空，同时 key 对应的 scale 已存在则保持 scale 同类型 + var cacheScale = cacheScaleMeta.scale; + var cacheScaleDef = { + type: cacheScale.type, + }; + if (cacheScale.isCategory) { + // 如果是分类类型，保持 values + cacheScaleDef.values = cacheScale.values; + } + finalScaleDef = deepMix(cacheScaleDef, cacheScaleMeta.scaleDef, scaleDef); + } + var scale = createScaleByField(field, data, finalScaleDef); + // 缓存起来 + this.cacheScale(scale, scaleDef, key); + return scale; + }; + /** + * 同步 scale + */ + ScalePool.prototype.sync = function (coordinate, theme) { + var _this = this; + // 对于 syncScales 中每一个 syncKey 下面的 scale 数组进行同步处理 + this.syncScales.forEach(function (scaleKeys, syncKey) { + // min, max, values, ranges + var min = Number.MAX_SAFE_INTEGER; + var max = Number.MIN_SAFE_INTEGER; + var values = []; + // 1. 遍历求得最大最小值，values 等 + each$2(scaleKeys, function (key) { + var scale = _this.getScale(key); + max = isNumber$4(scale.max) ? Math.max(max, scale.max) : max; + min = isNumber$4(scale.min) ? Math.min(min, scale.min) : min; + // 去重 + each$2(scale.values, function (v) { + if (!values.includes(v)) { + values.push(v); + } + }); + }); + // 2. 同步 + each$2(scaleKeys, function (key) { + var scale = _this.getScale(key); + if (scale.isContinuous) { + scale.change({ + min: min, + max: max, + values: values, + }); + } + else if (scale.isCategory) { + var range = scale.range; + var cacheScaleMeta = _this.getScaleMeta(key); + // 存在 value 值，且用户没有配置 range 配置 to fix https://github.com/antvis/G2/issues/2996 + if (values && !get$3(cacheScaleMeta, ['scaleDef', 'range'])) { + // 更新 range + range = getDefaultCategoryScaleRange(deepMix({}, scale, { + values: values + }), coordinate, theme); + } + scale.change({ + values: values, + range: range, + }); + } + }); + }); + }; + /** + * 缓存一个 scale + * @param scale + * @param scaleDef + * @param key + */ + ScalePool.prototype.cacheScale = function (scale, scaleDef, key) { + // 1. 缓存到 scales + var sm = this.getScaleMeta(key); + // 存在则更新，同时检测类型是否一致 + if (sm && sm.scale.type === scale.type) { + syncScale(sm.scale, scale); + sm.scaleDef = scaleDef; + // 更新 scaleDef + } + else { + sm = { + key: key, + scale: scale, + scaleDef: scaleDef, + }; + this.scales.set(key, sm); + } + // 2. 缓存到 syncScales，构造 Record 数据结构 + var syncKey = this.getSyncKey(sm); + sm.syncKey = syncKey; // 设置 sync 同步的 key + // 因为存在更新 scale 机制，所以在缓存之前，先从原 syncScales 中去除 sync 的缓存引用 + this.removeFromSyncScales(key); + // 存在 sync 标记才进行 sync + if (syncKey) { + // 不存在这个 syncKey，则创建一个空数组 + var scaleKeys = this.syncScales.get(syncKey); + if (!scaleKeys) { + scaleKeys = []; + this.syncScales.set(syncKey, scaleKeys); + } + scaleKeys.push(key); + } + }; + /** + * 通过 key 获取 scale + * @param key + */ + ScalePool.prototype.getScale = function (key) { + var scaleMeta = this.getScaleMeta(key); + if (!scaleMeta) { + var field = last$1(key.split('-')); + var scaleKeys = this.syncScales.get(field); + if (scaleKeys && scaleKeys.length) { + scaleMeta = this.getScaleMeta(scaleKeys[0]); + } + } + return scaleMeta && scaleMeta.scale; + }; + /** + * 在 view 销毁的时候，删除 scale 实例，防止内存泄露 + * @param key + */ + ScalePool.prototype.deleteScale = function (key) { + var scaleMeta = this.getScaleMeta(key); + if (scaleMeta) { + var syncKey = scaleMeta.syncKey; + var scaleKeys = this.syncScales.get(syncKey); + // 移除同步的关系 + if (scaleKeys && scaleKeys.length) { + var idx = scaleKeys.indexOf(key); + if (idx !== -1) { + scaleKeys.splice(idx, 1); + } + } + } + // 删除 scale 实例 + this.scales.delete(key); + }; + /** + * 清空 + */ + ScalePool.prototype.clear = function () { + this.scales.clear(); + this.syncScales.clear(); + }; + /** + * 删除 sync scale 引用 + * @param key + */ + ScalePool.prototype.removeFromSyncScales = function (key) { + var _this = this; + this.syncScales.forEach(function (scaleKeys, syncKey) { + var idx = scaleKeys.indexOf(key); + if (idx !== -1) { + scaleKeys.splice(idx, 1); + // 删除空数组值 + if (scaleKeys.length === 0) { + _this.syncScales.delete(syncKey); + } + return false; // 跳出循环 + } + }); + }; + /** + * get sync key + * @param sm + */ + ScalePool.prototype.getSyncKey = function (sm) { + var scale = sm.scale, scaleDef = sm.scaleDef; + var field = scale.field; + var sync = get$3(scaleDef, ['sync']); + // 如果 sync = true，则直接使用字段名作为 syncKey + return sync === true ? field : sync === false ? undefined : sync; + }; + /** + * 通过 key 获取 scale + * @param key + */ + ScalePool.prototype.getScaleMeta = function (key) { + return this.scales.get(key); + }; + return ScalePool; +}()); + +/** @ignore */ +var PaddingCal = /** @class */ (function () { + /** + * 初始的 padding 数据 + * @param top + * @param right + * @param bottom + * @param left + */ + function PaddingCal(top, right, bottom, left) { + if (top === void 0) { top = 0; } + if (right === void 0) { right = 0; } + if (bottom === void 0) { bottom = 0; } + if (left === void 0) { left = 0; } + this.top = top; + this.right = right; + this.bottom = bottom; + this.left = left; + } + /** + * 使用静态方法创建一个 + * @param top + * @param right + * @param bottom + * @param left + */ + PaddingCal.instance = function (top, right, bottom, left) { + if (top === void 0) { top = 0; } + if (right === void 0) { right = 0; } + if (bottom === void 0) { bottom = 0; } + if (left === void 0) { left = 0; } + return new PaddingCal(top, right, bottom, left); + }; + /** + * 取最大区间 + * @param padding + */ + PaddingCal.prototype.max = function (padding) { + var top = padding[0], right = padding[1], bottom = padding[2], left = padding[3]; + this.top = Math.max(this.top, top); + this.right = Math.max(this.right, right); + this.bottom = Math.max(this.bottom, bottom); + this.left = Math.max(this.left, left); + return this; + }; + /** + * 四周增加 padding + * @param padding + */ + PaddingCal.prototype.shrink = function (padding) { + var top = padding[0], right = padding[1], bottom = padding[2], left = padding[3]; + this.top += top; + this.right += right; + this.bottom += bottom; + this.left += left; + return this; + }; + /** + * 在某一个方向增加 padding + * @param bbox + * @param direction + */ + PaddingCal.prototype.inc = function (bbox, direction) { + var width = bbox.width, height = bbox.height; + switch (direction) { + case DIRECTION.TOP: + case DIRECTION.TOP_LEFT: + case DIRECTION.TOP_RIGHT: + this.top += height; + break; + case DIRECTION.RIGHT: + case DIRECTION.RIGHT_TOP: + case DIRECTION.RIGHT_BOTTOM: + this.right += width; + break; + case DIRECTION.BOTTOM: + case DIRECTION.BOTTOM_LEFT: + case DIRECTION.BOTTOM_RIGHT: + this.bottom += height; + break; + case DIRECTION.LEFT: + case DIRECTION.LEFT_TOP: + case DIRECTION.LEFT_BOTTOM: + this.left += width; + break; + } + return this; + }; + /** + * 获得最终的 padding + */ + PaddingCal.prototype.getPadding = function () { + return [this.top, this.right, this.bottom, this.left]; + }; + /** + * clone 一个 padding cal + */ + PaddingCal.prototype.clone = function () { + return new (PaddingCal.bind.apply(PaddingCal, __spreadArrays$1([void 0], this.getPadding())))(); + }; + return PaddingCal; +}()); + +/** + * @ignore + * 根据 view 中的组件，计算实际的 padding 数值 + * @param view + */ +function calculatePadding(view) { + var padding = view.padding; + // 如果不是 auto padding，那么直接解析之后返回 + if (!isAutoPadding(padding)) { + return new (PaddingCal.bind.apply(PaddingCal, __spreadArrays$1([void 0], parsePadding(padding))))(); + } + // 是 auto padding，根据组件的情况，来计算 padding + var viewBBox = view.viewBBox; + var paddingCal = new PaddingCal(); + var axisComponents = []; + var paddingComponents = []; + var otherComponents = []; + each$2(view.getComponents(), function (co) { + var type = co.type; + if (type === COMPONENT_TYPE.AXIS) { + axisComponents.push(co); + } + else if ([COMPONENT_TYPE.LEGEND, COMPONENT_TYPE.SLIDER, COMPONENT_TYPE.SCROLLBAR].includes(type)) { + paddingComponents.push(co); + } + else if (type !== COMPONENT_TYPE.GRID && type !== COMPONENT_TYPE.TOOLTIP) { + otherComponents.push(co); + } + }); + // 进行坐标轴布局，应该是取 padding 的并集，而不是进行相加 + each$2(axisComponents, function (co) { + var component = co.component; + var bboxObject = component.getLayoutBBox(); + var componentBBox = new BBox(bboxObject.x, bboxObject.y, bboxObject.width, bboxObject.height); + var exceed = componentBBox.exceed(viewBBox); + // 在对组件分组之后，先对 axis 进行处理，然后取最大的超出即可。 + paddingCal.max(exceed); + }); + // 有 padding 的组件布局 + each$2(paddingComponents, function (co) { + var component = co.component, direction = co.direction; + var bboxObject = component.getLayoutBBox(); + var componentPadding = component.get('padding'); + var componentBBox = new BBox(bboxObject.x, bboxObject.y, bboxObject.width, bboxObject.height).expand(componentPadding); + // 按照方向计算 padding + paddingCal.inc(componentBBox, direction); + }); + // 其他组件布局 + each$2(otherComponents, function (co) { + var component = co.component, direction = co.direction; + var bboxObject = component.getLayoutBBox(); + var componentBBox = new BBox(bboxObject.x, bboxObject.y, bboxObject.width, bboxObject.height); + // 按照方向计算 padding + paddingCal.inc(componentBBox, direction); + }); + return paddingCal; +} + +/** + * 默认的 syncViewPadding 逻辑 + * @param chart + * @param views + * @param PC: PaddingCalCtor + */ +function defaultSyncViewPadding(chart, views, PC) { + var syncPadding = PC.instance(); + // 所有的 view 的 autoPadding 指向同一个引用 + views.forEach(function (v) { + v.autoPadding = syncPadding.max(v.autoPadding.getPadding()); + }); +} + +/** + * G2 视图 View 类 + */ +var View$1 = /** @class */ (function (_super) { + __extends$e(View, _super); + function View(props) { + var _this = _super.call(this, { visible: props.visible }) || this; + /** 所有的子 view。 */ + _this.views = []; + /** 所有的 geometry 实例。 */ + _this.geometries = []; + /** 所有的组件 controllers。 */ + _this.controllers = []; + /** 所有的 Interaction 实例。 */ + _this.interactions = {}; + /** 是否对超出坐标系范围的 Geometry 进行剪切 */ + _this.limitInPlot = false; + // 配置信息存储 + _this.options = { + data: [], + animate: true, + }; // 初始化为空 + /** 配置开启的组件插件，默认为全局配置的组件。 */ + _this.usedControllers = getComponentControllerNames(); + /** 所有的 scales */ + _this.scalePool = new ScalePool(); + /** 布局函数 */ + _this.layoutFunc = defaultLayout$c; + /** 当前鼠标是否在 plot 内（CoordinateBBox） */ + _this.isPreMouseInPlot = false; + /** 默认标识位，用于判定数据是否更新 */ + _this.isDataChanged = false; + /** 用于判断坐标系范围是否发生变化的标志位 */ + _this.isCoordinateChanged = false; + /** 从当前这个 view 创建的 scale key */ + _this.createdScaleKeys = new Map(); + _this.onCanvasEvent = function (evt) { + var name = evt.name; + if (!name.includes(':')) { + // 非委托事件 + var e = _this.createViewEvent(evt); + // 处理 plot 事件 + _this.doPlotEvent(e); + _this.emit(name, e); + } + }; + /** + * 触发事件之后 + * @param evt + */ + _this.onDelegateEvents = function (evt) { + // 阻止继续冒泡，防止重复事件触发 + // evt.preventDefault(); + var name = evt.name; + if (!name.includes(':')) { + return; + } + // 事件在 view 嵌套中冒泡（暂不提供阻止冒泡的机制） + var e = _this.createViewEvent(evt); + // 包含有基本事件、组合事件 + _this.emit(name, e); + // const currentTarget = evt.currentTarget as IShape; + // const inheritNames = currentTarget.get('inheritNames'); + // if (evt.delegateObject || inheritNames) { + // const events = this.getEvents(); + // each(inheritNames, (subName) => { + // const eventName = `${subName}:${type}`; + // if (events[eventName]) { + // this.emit(eventName, e); + // } + // }); + // } + }; + var _a = props.id, id = _a === void 0 ? uniqueId$3('view') : _a, parent = props.parent, canvas = props.canvas, backgroundGroup = props.backgroundGroup, middleGroup = props.middleGroup, foregroundGroup = props.foregroundGroup, _b = props.region, region = _b === void 0 ? { start: { x: 0, y: 0 }, end: { x: 1, y: 1 } } : _b, padding = props.padding, appendPadding = props.appendPadding, theme = props.theme, options = props.options, limitInPlot = props.limitInPlot, syncViewPadding = props.syncViewPadding; + _this.parent = parent; + _this.canvas = canvas; + _this.backgroundGroup = backgroundGroup; + _this.middleGroup = middleGroup; + _this.foregroundGroup = foregroundGroup; + _this.region = region; + _this.padding = padding; + _this.appendPadding = appendPadding; + // 接受父 view 传入的参数 + _this.options = __assign$r(__assign$r({}, _this.options), options); + _this.limitInPlot = limitInPlot; + _this.id = id; + _this.syncViewPadding = syncViewPadding; + // 初始化 theme + _this.themeObject = isObject$f(theme) ? deepMix({}, getTheme('default'), createTheme(theme)) : getTheme(theme); + _this.init(); + return _this; + } + /** + * 设置 layout 布局函数 + * @param layout 布局函数 + * @returns void + */ + View.prototype.setLayout = function (layout) { + this.layoutFunc = layout; + }; + /** + * 生命周期：初始化 + * @returns voids + */ + View.prototype.init = function () { + // 计算画布的 viewBBox + this.calculateViewBBox(); + // 事件委托机制 + this.initEvents(); + // 初始化组件 controller + this.initComponentController(); + this.initOptions(); + }; + /** + * 生命周期：渲染流程，渲染过程需要处理数据更新的情况。 + * render 函数仅仅会处理 view 和子 view。 + * @param isUpdate 是否触发更新流程。 + * @param params render 事件参数 + */ + View.prototype.render = function (isUpdate, payload) { + if (isUpdate === void 0) { isUpdate = false; } + this.emit(VIEW_LIFE_CIRCLE.BEFORE_RENDER, Event$1.fromData(this, VIEW_LIFE_CIRCLE.BEFORE_RENDER, payload)); + // 递归渲染 + this.paint(isUpdate); + this.emit(VIEW_LIFE_CIRCLE.AFTER_RENDER, Event$1.fromData(this, VIEW_LIFE_CIRCLE.AFTER_RENDER, payload)); + if (this.visible === false) { + // 用户在初始化的时候声明 visible: false + this.changeVisible(false); + } + }; + /** + * 生命周期：清空图表上所有的绘制内容，但是不销毁图表，chart 仍可使用。 + * @returns void + */ + View.prototype.clear = function () { + var _this = this; + this.emit(VIEW_LIFE_CIRCLE.BEFORE_CLEAR); + // 1. 清空缓存和计算数据 + this.filteredData = []; + this.coordinateInstance = undefined; + this.isDataChanged = false; // 复位 + this.isCoordinateChanged = false; // 复位 + // 2. 清空 geometries + var geometries = this.geometries; + for (var i = 0; i < geometries.length; i++) { + geometries[i].clear(); + // view 中使用 geometry 的时候，还需要清空它的容器，不然下一次 chart.geometry() 的时候，又创建了一个，导致泄露， #2799。 + geometries[i].container.remove(true); + } + this.geometries = []; + // 3. 清空 controllers + var controllers = this.controllers; + for (var i = 0; i < controllers.length; i++) { + if (controllers[i].name === 'annotation') { + // 需要清空配置项 + controllers[i].clear(true); + } + else { + controllers[i].clear(); + } + } + // 4. 删除 scale 缓存 + this.createdScaleKeys.forEach(function (v, k) { + _this.getRootView().scalePool.deleteScale(k); + }); + this.createdScaleKeys.clear(); + // 递归处理子 view + var views = this.views; + for (var i = 0; i < views.length; i++) { + views[i].clear(); + } + this.emit(VIEW_LIFE_CIRCLE.AFTER_CLEAR); + }; + /** + * 生命周期：销毁，完全无法使用。 + * @returns void + */ + View.prototype.destroy = function () { + // 销毁前事件，销毁之后已经没有意义了，所以不抛出事件 + this.emit(VIEW_LIFE_CIRCLE.BEFORE_DESTROY); + var interactions = this.interactions; + // 销毁 interactions + each$2(interactions, function (interaction) { + if (interaction) { + // 有可能已经销毁，设置了 undefined + interaction.destroy(); + } + }); + this.clear(); + // 销毁 controller 中的组件 + var controllers = this.controllers; + for (var i = 0, len = controllers.length; i < len; i++) { + var controller = controllers[i]; + controller.destroy(); + } + this.backgroundGroup.remove(true); + this.middleGroup.remove(true); + this.foregroundGroup.remove(true); + _super.prototype.destroy.call(this); + }; + /* end 生命周期函数 */ + /** + * 显示或者隐藏整个 view。 + * @param visible 是否可见 + * @returns View + */ + View.prototype.changeVisible = function (visible) { + _super.prototype.changeVisible.call(this, visible); + var geometries = this.geometries; + for (var i = 0, len = geometries.length; i < len; i++) { + var geometry = geometries[i]; + geometry.changeVisible(visible); + } + var controllers = this.controllers; + for (var i = 0, len = controllers.length; i < len; i++) { + var controller = controllers[i]; + controller.changeVisible(visible); + } + this.foregroundGroup.set('visible', visible); + this.middleGroup.set('visible', visible); + this.backgroundGroup.set('visible', visible); + // group.set('visible', visible) 不会触发自动刷新 + this.getCanvas().draw(); + return this; + }; + /** + * 装载数据源。 + * + * ```ts + * view.data([{ city: '杭州', sale: 100 }, { city: '上海', sale: 110 } ]); + * ``` + * + * @param data 数据源，json 数组。 + * @returns View + */ + View.prototype.data = function (data) { + set$5(this.options, 'data', data); + this.isDataChanged = true; + return this; + }; + /** + * @deprecated + * This method will be removed at G2 V4.1. Replaced by {@link #data(data)} + */ + View.prototype.source = function (data) { + console.warn('This method will be removed at G2 V4.1. Please use chart.data() instead.'); + return this.data(data); + }; + /** + * 设置数据筛选规则。 + * + * ```ts + * view.filter('city', (value: any, datum: Datum) => value !== '杭州'); + * + * // 删除 'city' 字段对应的筛选规则。 + * view.filter('city', null); + * ``` + * + * @param field 数据字段 + * @param condition 筛选规则 + * @returns View + */ + View.prototype.filter = function (field, condition) { + if (isFunction$6(condition)) { + set$5(this.options, ['filters', field], condition); + return this; + } + // condition 为空，则表示删除过滤条件 + if (!condition && get$3(this.options, ['filters', field])) { + delete this.options.filters[field]; + } + return this; + }; + View.prototype.axis = function (field, axisOption) { + if (isBoolean(field)) { + set$5(this.options, ['axes'], field); + } + else { + set$5(this.options, ['axes', field], axisOption); + } + return this; + }; + View.prototype.legend = function (field, legendOption) { + if (isBoolean(field)) { + set$5(this.options, ['legends'], field); + } + else if (isString$3(field)) { + set$5(this.options, ['legends', field], legendOption); + if (isPlainObject$3(legendOption) && (legendOption === null || legendOption === void 0 ? void 0 : legendOption.selected)) { + set$5(this.options, ['filters', field], function (name) { + var _a; + return (_a = legendOption === null || legendOption === void 0 ? void 0 : legendOption.selected[name]) !== null && _a !== void 0 ? _a : true; + }); + } + } + else { + // 设置全局的 legend 配置 + set$5(this.options, ['legends'], field); + } + return this; + }; + View.prototype.scale = function (field, scaleOption) { + var _this = this; + if (isString$3(field)) { + set$5(this.options, ['scales', field], scaleOption); + } + else if (isObject$f(field)) { + each$2(field, function (v, k) { + set$5(_this.options, ['scales', k], v); + }); + } + return this; + }; + /** + * tooltip 提示信息配置。 + * + * ```ts + * view.tooltip(false); // 关闭 tooltip + * + * view.tooltip({ + * shared: true + * }); + * ``` + * + * @param cfg Tooltip 配置，更详细的配置项参考：https://github.com/antvis/component#tooltip + * @returns View + */ + View.prototype.tooltip = function (cfg) { + set$5(this.options, 'tooltip', cfg); + return this; + }; + /** + * 辅助标记配置。 + * + * ```ts + * view.annotation().line({ + * start: ['min', 85], + * end: ['max', 85], + * style: { + * stroke: '#595959', + * lineWidth: 1, + * lineDash: [3, 3], + * }, + * }); + * ``` + * 更详细的配置项：https://github.com/antvis/component#annotation + * @returns [[Annotation]] + */ + View.prototype.annotation = function () { + return this.getController('annotation'); + }; + /** + * @deprecated + * This method will be removed at G2 V4.1. Replaced by {@link #guide()} + */ + View.prototype.guide = function () { + console.warn('This method will be removed at G2 V4.1. Please use chart.annotation() instead.'); + return this.annotation(); + }; + View.prototype.coordinate = function (type, coordinateCfg) { + // 提供语法糖，使用更简单 + if (isString$3(type)) { + set$5(this.options, 'coordinate', { type: type, cfg: coordinateCfg }); + } + else { + set$5(this.options, 'coordinate', type); + } + // 更新 coordinate 配置 + this.coordinateController.update(this.options.coordinate); + return this.coordinateController; + }; + /** + * @deprecated + * This method will be removed at G2 V4.1. Replaced by {@link #coordinate()} + */ + View.prototype.coord = function (type, coordinateCfg) { + console.warn('This method will be removed at G2 V4.1. Please use chart.coordinate() instead.'); + // @ts-ignore + return this.coordinate(type, coordinateCfg); + }; + /** + * view 分面绘制。 + * + * ```ts + * view.facet('rect', { + * rowField: 'province', + * columnField: 'category', + * eachView: (innerView: View, facet?: FacetData) => { + * innerView.line().position('city*sale'); + * }, + * }); + * ``` + * + * @param type 分面类型 + * @param cfg 分面配置， [[FacetCfgMap]] + * @returns View + */ + View.prototype.facet = function (type, cfg) { + // 先销毁掉之前的分面 + if (this.facetInstance) { + this.facetInstance.destroy(); + } + // 创建新的分面 + var Ctor = getFacet(type); + if (!Ctor) { + throw new Error("facet '" + type + "' is not exist!"); + } + this.facetInstance = new Ctor(this, __assign$r(__assign$r({}, cfg), { type: type })); + return this; + }; + /* + * 开启或者关闭动画。 + * + * ```ts + * view.animate(false); + * ``` + * + * @param status 动画状态，true 表示开始，false 表示关闭 + * @returns View + */ + View.prototype.animate = function (status) { + set$5(this.options, 'animate', status); + return this; + }; + /** + * 更新配置项，用于配置项式声明。 + * @param options 配置项 + */ + View.prototype.updateOptions = function (options) { + this.clear(); // 清空 + mix(this.options, options); + // 需要把已存在的 view 销毁，否则会重复创建 + // 目前针对配置项还没有特别好的 view 更新机制，为了不影响主流流程，所以在这里直接销毁 + this.views.forEach(function (view) { return view.destroy(); }); + this.views = []; + this.initOptions(); + // 初始化坐标系大小，保证 padding 计算正确 + this.coordinateBBox = this.viewBBox; + return this; + }; + /** + * 往 `view.options` 属性中存储配置项。 + * @param name 属性名称 + * @param opt 属性值 + * @returns view + */ + View.prototype.option = function (name, opt) { + // 对于内置的 option，避免覆盖。 + // name 在原型上，说明可能是内置 API，存在 option 被覆盖的风险，不处理 + if (View.prototype[name]) { + throw new Error("Can't use built in variable name \"" + name + "\", please change another one."); + } + // 存入到 option 中 + set$5(this.options, name, opt); + return this; + }; + /** + * 设置主题。 + * + * ```ts + * view.theme('dark'); // 'dark' 需要事先通过 `registerTheme()` 接口注册完成 + * + * view.theme({ defaultColor: 'red' }); + * ``` + * + * @param theme 主题名或者主题配置 + * @returns View + */ + View.prototype.theme = function (theme) { + this.themeObject = isObject$f(theme) ? deepMix({}, this.themeObject, createTheme(theme)) : getTheme(theme); + return this; + }; + /* end 一系列传入配置的 API */ + /** + * Call the interaction based on the interaction name + * + * ```ts + * view.interaction('my-interaction', { extra: 'hello world' }); + * ``` + * 详细文档可以参考：https://g2.antv.vision/zh/docs/api/general/interaction + * @param name interaction name + * @param cfg interaction config + * @returns + */ + View.prototype.interaction = function (name, cfg) { + var existInteraction = this.interactions[name]; + // 存在则先销毁已有的 + if (existInteraction) { + existInteraction.destroy(); + } + // 新建交互实例 + var interaction = createInteraction(name, this, cfg); + if (interaction) { + interaction.init(); + this.interactions[name] = interaction; + } + return this; + }; + /** + * 移除当前 View 的 interaction + * ```ts + * view.removeInteraction('my-interaction'); + * ``` + * @param name interaction name + */ + View.prototype.removeInteraction = function (name) { + var existInteraction = this.interactions[name]; + // 存在则先销毁已有的 + if (existInteraction) { + existInteraction.destroy(); + this.interactions[name] = undefined; + } + }; + /** + * 修改数据，数据更新逻辑，数据更新仅仅影响当前这一层的 view + * + * ```ts + * view.changeData([{ city: '北京', sale: '200' }]); + * ``` + * + * @param data + * @returns void + */ + View.prototype.changeData = function (data) { + this.isDataChanged = true; + this.emit(VIEW_LIFE_CIRCLE.BEFORE_CHANGE_DATA, Event$1.fromData(this, VIEW_LIFE_CIRCLE.BEFORE_CHANGE_DATA, null)); + // 1. 保存数据 + this.data(data); + // 2. 渲染 + this.paint(true); + // 3. 遍历子 view 进行 change data + var views = this.views; + for (var i = 0, len = views.length; i < len; i++) { + var view = views[i]; + // FIXME 子 view 有自己的数据的情况，该如何处理？ + view.changeData(data); + } + this.emit(VIEW_LIFE_CIRCLE.AFTER_CHANGE_DATA, Event$1.fromData(this, VIEW_LIFE_CIRCLE.AFTER_CHANGE_DATA, null)); + }; + /* View 管理相关的 API */ + /** + * 创建子 view + * + * ```ts + * const innerView = view.createView({ + * start: { x: 0, y: 0 }, + * end: { x: 0.5, y: 0.5 }, + * padding: 8, + * }); + * ``` + * + * @param cfg + * @returns View + */ + View.prototype.createView = function (cfg) { + // 将会在 4.1 版本中移除递归嵌套 view，仅仅只允许 chart - view 两层。 + // 这个 API 理论上用户量不多，所以暂时不发大版本，所以先暂时打一个 warning。 + if (this.parent && this.parent.parent) { + // 存在 3 层 结构了 + console.warn('The view nesting recursive feature will be removed at G2 V4.1. Please avoid to use it.'); + } + // 子 view 共享 options 配置数据 + var sharedOptions = { + data: this.options.data, + scales: clone$7(this.options.scales), + axes: clone$7(this.options.axes), + coordinate: clone$7(this.coordinateController.getOption()), + tooltip: clone$7(this.options.tooltip), + legends: clone$7(this.options.legends), + animate: this.options.animate, + visible: this.visible, + }; + var v = new View(__assign$r(__assign$r({ parent: this, canvas: this.canvas, + // 子 view 共用三层 group + backgroundGroup: this.backgroundGroup.addGroup({ zIndex: GROUP_Z_INDEX.BG }), middleGroup: this.middleGroup.addGroup({ zIndex: GROUP_Z_INDEX.MID }), foregroundGroup: this.foregroundGroup.addGroup({ zIndex: GROUP_Z_INDEX.FORE }), theme: this.themeObject, padding: this.padding }, cfg), { options: __assign$r(__assign$r({}, sharedOptions), get$3(cfg, 'options', {})) })); + this.views.push(v); + return v; + }; + /** + * @deprecated + * This method will be removed at G2 V4.1. Replaced by {@link #createView()} + */ + View.prototype.view = function (cfg) { + console.warn('This method will be removed at G2 V4.1. Please use chart.createView() instead.'); + return this.createView(cfg); + }; + /** + * 删除一个子 view + * @param view + * @return removedView + */ + View.prototype.removeView = function (view) { + var removedView = remove(this.views, function (v) { return v === view; })[0]; + if (removedView) { + removedView.destroy(); + } + return removedView; + }; + /* end View 管理相关的 API */ + // 一些 get 方法 + /** + * 获取当前坐标系实例。 + * @returns [[Coordinate]] + */ + View.prototype.getCoordinate = function () { + return this.coordinateInstance; + }; + /** + * 获取当前 view 的主题配置。 + * @returns themeObject + */ + View.prototype.getTheme = function () { + return this.themeObject; + }; + /** + * 获得 x 轴字段的 scale 实例。 + * @returns view 中 Geometry 对于的 x scale + */ + View.prototype.getXScale = function () { + // 拿第一个 Geometry 的 X scale + // 隐藏逻辑：一个 view 中的 Geometry 必须 x 字段一致 + var g = this.geometries[0]; + return g ? g.getXScale() : null; + }; + /** + * 获取 y 轴字段的 scales 实例。 + * @returns view 中 Geometry 对于的 y scale 数组 + */ + View.prototype.getYScales = function () { + // 拿到所有的 Geometry 的 Y scale，然后去重 + var tmpMap = {}; + return this.geometries.map(function (g) { + var yScale = g.getYScale(); + var field = yScale.field; + if (!tmpMap[field]) { + tmpMap[field] = true; + return yScale; + } + }); + }; + /** + * 获取 x 轴或者 y 轴对应的所有 scale 实例。 + * @param dimType x | y + * @returns x 轴或者 y 轴对应的所有 scale 实例。 + */ + View.prototype.getScalesByDim = function (dimType) { + var geometries = this.geometries; + var scales = {}; + for (var i = 0, len = geometries.length; i < len; i++) { + var geometry = geometries[i]; + var scale = dimType === 'x' ? geometry.getXScale() : geometry.getYScale(); + if (scale && !scales[scale.field]) { + scales[scale.field] = scale; + } + } + return scales; + }; + /** + * 根据字段名去获取 scale 实例。 + * @param field 数据字段名称 + * @param key id + */ + View.prototype.getScaleByField = function (field, key) { + var defaultKey = key ? key : this.getScaleKey(field); + // 调用根节点 view 的方法获取 + return this.getRootView().scalePool.getScale(defaultKey); + }; + /** + * 返回所有配置信息。 + * @returns 所有的 view API 配置。 + */ + View.prototype.getOptions = function () { + return this.options; + }; + /** + * 获取 view 的数据（过滤后的数据）。 + * @returns 处理过滤器之后的数据。 + */ + View.prototype.getData = function () { + return this.filteredData; + }; + /** + * 获得绘制的层级 group。 + * @param layer 层级名称。 + * @returns 对应层级的 Group。 + */ + View.prototype.getLayer = function (layer) { + return layer === LAYER.BG + ? this.backgroundGroup + : layer === LAYER.MID + ? this.middleGroup + : layer === LAYER.FORE + ? this.foregroundGroup + : this.foregroundGroup; + }; + /** + * 对外暴露方法，判断一个点是否在绘图区域（即坐标系范围）内部。 + * @param point 坐标点 + */ + View.prototype.isPointInPlot = function (point) { + return isPointInCoordinate(this.getCoordinate(), point); + }; + /** + * 获得所有的 legend 对应的 attribute 实例。 + * @returns 维度字段的 Attribute 数组 + */ + View.prototype.getLegendAttributes = function () { + return flatten$2(this.geometries.map(function (g) { return g.getGroupAttributes(); })); + }; + /** + * 获取所有的分组字段的 scale 实例。 + * @returns 获得分组字段的 scale 实例数组。 + */ + View.prototype.getGroupScales = function () { + // 拿到所有的 Geometry 的 分组字段 scale，然后打平去重 + var scales = this.geometries.map(function (g) { return g.getGroupScales(); }); + return uniq$2(flatten$2(scales)); + }; + /** + * 获取 G.Canvas 实例。 + * @returns G.Canvas 画布实例。 + */ + View.prototype.getCanvas = function () { + return this.getRootView().canvas; + }; + /** + * 获得根节点 view。 + */ + View.prototype.getRootView = function () { + var v = this; + while (true) { + if (v.parent) { + v = v.parent; + continue; + } + break; + } + return v; + }; + /** + * 获取该数据在可视化后，对应的画布坐标点。 + * @param data 原始数据记录 + * @returns 对应的画布坐标点 + */ + View.prototype.getXY = function (data) { + var coordinate = this.getCoordinate(); + var xScales = this.getScalesByDim('x'); + var yScales = this.getScalesByDim('y'); + var x; + var y; + each$2(data, function (value, key) { + if (xScales[key]) { + x = xScales[key].scale(value); + } + if (yScales[key]) { + y = yScales[key].scale(value); + } + }); + if (!isNil(x) && !isNil(y)) { + return coordinate.convert({ x: x, y: y }); + } + }; + /** + * 获取 name 对应的 controller 实例 + * @param name + */ + View.prototype.getController = function (name) { + return find$3(this.controllers, function (c) { return c.name === name; }); + }; + /** + * 显示 point 坐标点对应的 tooltip。 + * @param point 画布坐标点 + * @returns View + */ + View.prototype.showTooltip = function (point) { + var tooltip = this.getController('tooltip'); + if (tooltip) { + tooltip.showTooltip(point); + } + return this; + }; + /** + * 隐藏 tooltip。 + * @returns View + */ + View.prototype.hideTooltip = function () { + var tooltip = this.getController('tooltip'); + if (tooltip) { + tooltip.hideTooltip(); + } + return this; + }; + /** + * 将 tooltip 锁定到当前位置不能移动。 + * @returns View + */ + View.prototype.lockTooltip = function () { + var tooltip = this.getController('tooltip'); + if (tooltip) { + tooltip.lockTooltip(); + } + return this; + }; + /** + * 将 tooltip 锁定解除。 + * @returns View + */ + View.prototype.unlockTooltip = function () { + var tooltip = this.getController('tooltip'); + if (tooltip) { + tooltip.unlockTooltip(); + } + return this; + }; + /** + * 是否锁定 tooltip。 + * @returns 是否锁定 + */ + View.prototype.isTooltipLocked = function () { + var tooltip = this.getController('tooltip'); + return tooltip && tooltip.isTooltipLocked(); + }; + /** + * 获取当前 point 对应的 tooltip 数据项。 + * @param point 坐标点 + * @returns tooltip 数据项 + */ + View.prototype.getTooltipItems = function (point) { + var tooltip = this.getController('tooltip'); + return tooltip ? tooltip.getTooltipItems(point) : []; + }; + /** + * 获取逼近的点的数据集合 + * @param point 当前坐标点 + * @returns 数据 + */ + View.prototype.getSnapRecords = function (point) { + var geometries = this.geometries; + var rst = []; + for (var i = 0, len = geometries.length; i < len; i++) { + var geom = geometries[i]; + var dataArray = geom.dataArray; + geom.sort(dataArray); // 先进行排序，便于 tooltip 查找 + var record = void 0; + for (var j = 0, dataLen = dataArray.length; j < dataLen; j++) { + var data = dataArray[j]; + record = findDataByPoint(point, data, geom); + if (record) { + rst.push(record); + } + } + } + // 同样递归处理子 views + var views = this.views; + for (var i = 0, len = views.length; i < len; i++) { + var view = views[i]; + var snapRecords = view.getSnapRecords(point); + rst = rst.concat(snapRecords); + } + return rst; + }; + /** + * 获取所有的 pure component 组件，用于布局。 + */ + View.prototype.getComponents = function () { + var components = []; + var controllers = this.controllers; + for (var i = 0, len = controllers.length; i < len; i++) { + var controller = controllers[i]; + components = components.concat(controller.getComponents()); + } + return components; + }; + /** + * 将 data 数据进行过滤。 + * @param data + * @returns 过滤之后的数据 + */ + View.prototype.filterData = function (data) { + var filters = this.options.filters; + // 不存在 filters，则不需要进行数据过滤 + if (size$1(filters) === 0) { + return data; + } + // 存在过滤器，则逐个执行过滤，过滤器之间是 与 的关系 + return filter$1(data, function (datum, idx) { + // 所有的 filter 字段 + var fields = Object.keys(filters); + // 所有的条件都通过，才算通过 + return fields.every(function (field) { + var condition = filters[field]; + // condition 返回 true，则保留 + return condition(datum[field], datum, idx); + }); + }); + }; + /** + * 对某一个字段进行过滤 + * @param field + * @param data + */ + View.prototype.filterFieldData = function (field, data) { + var filters = this.options.filters; + var condition = get$3(filters, field); + if (isUndefined$1(condition)) { + return data; + } + return data.filter(function (datum, idx) { return condition(datum[field], datum, idx); }); + }; + /** + * 调整 coordinate 的坐标范围。 + */ + View.prototype.adjustCoordinate = function () { + var _a = this.getCoordinate(), curStart = _a.start, curEnd = _a.end; + var start = this.coordinateBBox.bl; + var end = this.coordinateBBox.tr; + // 在 defaultLayoutFn 中只会在 coordinateBBox 发生变化的时候会调用 adjustCoordinate()，所以不用担心被置位 + if (isEqual$2(curStart, start) && isEqual$2(curEnd, end)) { + this.isCoordinateChanged = false; + // 如果大小没有变化则不更新 + return; + } + this.isCoordinateChanged = true; + this.coordinateInstance = this.coordinateController.adjust(start, end); + }; + View.prototype.paint = function (isUpdate) { + this.renderDataRecursive(isUpdate); + // 处理 sync scale 的逻辑 + this.syncScale(); + this.emit(VIEW_LIFE_CIRCLE.BEFORE_PAINT); + // 初始化图形、组件位置，计算 padding + this.renderPaddingRecursive(isUpdate); + // 布局图形、组件 + this.renderLayoutRecursive(isUpdate); + // 背景色 shape + this.renderBackgroundStyleShape(); + // 最终的绘制 render + this.renderPaintRecursive(isUpdate); + this.emit(VIEW_LIFE_CIRCLE.AFTER_PAINT); + this.isDataChanged = false; // 渲染完毕复位 + }; + /** + * 渲染背景样式的 shape。 + * 放到 view 中创建的原因是让使用 view 绘制图形的时候，也能够处理背景色 + */ + View.prototype.renderBackgroundStyleShape = function () { + // 只有根节点才处理 + if (this.parent) { + return; + } + var background = get$3(this.themeObject, 'background'); + // 配置了背景色 + if (background) { + // 1. 不存在则创建 + if (!this.backgroundStyleRectShape) { + this.backgroundStyleRectShape = this.backgroundGroup.addShape('rect', { + attrs: {}, + zIndex: -1, + // 背景色 shape 不设置事件捕获 + capture: false, + }); + this.backgroundStyleRectShape.toBack(); + } + // 2. 有了 shape 之后设置背景，位置（更新的时候） + var _a = this.viewBBox, x = _a.x, y = _a.y, width = _a.width, height = _a.height; + this.backgroundStyleRectShape.attr({ + fill: background, + x: x, + y: y, + width: width, + height: height, + }); + } + else { + // 没有配置背景色 + if (this.backgroundStyleRectShape) { + this.backgroundStyleRectShape.remove(true); + this.backgroundStyleRectShape = undefined; + } + } + }; + /** + * 递归计算每个 view 的 padding 值，coordinateBBox 和 coordinateInstance + * @param isUpdate + */ + View.prototype.renderPaddingRecursive = function (isUpdate) { + // 1. 子 view 大小相对 coordinateBBox，changeSize 的时候需要重新计算 + this.calculateViewBBox(); + // 2. 更新 coordinate + this.adjustCoordinate(); + // 3. 初始化组件 component + this.initComponents(isUpdate); + // 4. 布局计算每隔 view 的 padding 值 + // 4.1. 自动加 auto padding -> absolute padding，并且增加 appendPadding + this.autoPadding = calculatePadding(this).shrink(parsePadding(this.appendPadding)); + // 4.2. 计算出新的 coordinateBBox，更新 Coordinate + // 这里必须保留，原因是后面子 view 的 viewBBox 或根据 parent 的 coordinateBBox + this.coordinateBBox = this.viewBBox.shrink(this.autoPadding.getPadding()); + this.adjustCoordinate(); + // 同样递归处理子 views + var views = this.views; + for (var i = 0, len = views.length; i < len; i++) { + var view = views[i]; + view.renderPaddingRecursive(isUpdate); + } + }; + /** + * 递归处理 view 的布局，最终是计算各个 view 的 coordinateBBox 和 coordinateInstance + * @param isUpdate + */ + View.prototype.renderLayoutRecursive = function (isUpdate) { + // 1. 同步子 view padding + // 根据配置获取 padding + var syncViewPaddingFn = this.syncViewPadding === true + ? defaultSyncViewPadding + : isFunction$6(this.syncViewPadding) + ? this.syncViewPadding + : undefined; + if (syncViewPaddingFn) { + syncViewPaddingFn(this, this.views, PaddingCal); + // 同步 padding 之后，更新 coordinate + this.views.forEach(function (v) { + v.coordinateBBox = v.viewBBox.shrink(v.autoPadding.getPadding()); + v.adjustCoordinate(); + }); + } + // 3. 将 view 中的组件按照 view padding 移动到对应的位置 + this.doLayout(); + // 同样递归处理子 views + var views = this.views; + for (var i = 0, len = views.length; i < len; i++) { + var view = views[i]; + view.renderLayoutRecursive(isUpdate); + } + }; + /** + * 最终递归绘制组件和图形 + * @param isUpdate + */ + View.prototype.renderPaintRecursive = function (isUpdate) { + var middleGroup = this.middleGroup; + if (this.limitInPlot) { + var _a = getCoordinateClipCfg(this.coordinateInstance), type = _a.type, attrs = _a.attrs; + middleGroup.setClip({ + type: type, + attrs: attrs, + }); + } + else { + // 清除已有的 clip + middleGroup.setClip(undefined); + } + // 1. 渲染几何标记 + this.paintGeometries(isUpdate); + // 2. 绘制组件 + this.renderComponents(isUpdate); + // 同样递归处理子 views + var views = this.views; + for (var i = 0, len = views.length; i < len; i++) { + var view = views[i]; + view.renderPaintRecursive(isUpdate); + } + }; + // end Get 方法 + /** + * 创建 scale，递归到顶层 view 去创建和缓存 scale + * @param field + * @param data + * @param scaleDef + * @param key + */ + View.prototype.createScale = function (field, data, scaleDef, key) { + // 1. 合并 field 对应的 scaleDef，合并原则是底层覆盖顶层（就近原则） + var currentScaleDef = get$3(this.options.scales, [field]); + var mergedScaleDef = __assign$r(__assign$r({}, currentScaleDef), scaleDef); + // 2. 是否存在父 view，在则递归，否则创建 + if (this.parent) { + return this.parent.createScale(field, data, mergedScaleDef, key); + } + // 3. 在根节点 view 通过 scalePool 创建 + return this.scalePool.createScale(field, data, mergedScaleDef, key); + }; + /** + * 递归渲染中的数据处理 + * @param isUpdate + */ + View.prototype.renderDataRecursive = function (isUpdate) { + // 1. 处理数据 + this.doFilterData(); + // 2. 创建实例 + this.createCoordinate(); + // 3. 初始化 Geometry + this.initGeometries(isUpdate); + // 4. 处理分面逻辑，最终都是生成子 view 和 geometry + this.renderFacet(isUpdate); + // 同样递归处理子 views + var views = this.views; + for (var i = 0, len = views.length; i < len; i++) { + var view = views[i]; + view.renderDataRecursive(isUpdate); + } + }; + /** + * 计算 region，计算实际的像素范围坐标 + * @private + */ + View.prototype.calculateViewBBox = function () { + var x; + var y; + var width; + var height; + if (this.parent) { + var bbox = this.parent.coordinateBBox; + // 存在 parent， 那么就是通过父容器大小计算 + x = bbox.x; + y = bbox.y; + width = bbox.width; + height = bbox.height; + } + else { + // 顶层容器，从 canvas 中取值 宽高 + x = 0; + y = 0; + width = this.canvas.get('width'); + height = this.canvas.get('height'); + } + var _a = this.region, start = _a.start, end = _a.end; + // 根据 region 计算当前 view 的 bbox 大小。 + var viewBBox = new BBox(x + width * start.x, y + height * start.y, width * (end.x - start.x), height * (end.y - start.y)); + if (!this.viewBBox || !this.viewBBox.isEqual(viewBBox)) { + // viewBBox 发生变化的时候进行更新 + this.viewBBox = new BBox(x + width * start.x, y + height * start.y, width * (end.x - start.x), height * (end.y - start.y)); + } + // 初始的 coordinate bbox 大小 + this.coordinateBBox = this.viewBBox; + }; + /** + * 初始化事件机制：G 4.0 底层内置支持 name:event 的机制，那么只要所有组件都有自己的 name 即可。 + * + * G2 的事件只是获取事件委托，然后在 view 嵌套结构中，形成事件冒泡机制。 + * 当前 view 只委托自己 view 中的 Component 和 Geometry 事件，并向上冒泡 + * @private + */ + View.prototype.initEvents = function () { + // 三层 group 中的 shape 事件都会通过 G 冒泡上来的 + this.foregroundGroup.on('*', this.onDelegateEvents); + this.middleGroup.on('*', this.onDelegateEvents); + this.backgroundGroup.on('*', this.onDelegateEvents); + this.canvas.on('*', this.onCanvasEvent); + }; + /** + * 初始化插件 + */ + View.prototype.initComponentController = function () { + var usedControllers = this.usedControllers; + for (var i = 0, len = usedControllers.length; i < len; i++) { + var controllerName = usedControllers[i]; + var Ctor = getComponentController(controllerName); + if (Ctor) { + this.controllers.push(new Ctor(this)); + } + } + }; + View.prototype.createViewEvent = function (evt) { + var shape = evt.shape, name = evt.name; + var data = shape ? shape.get('origin') : null; + // 事件在 view 嵌套中冒泡（暂不提供阻止冒泡的机制） + var e = new Event$1(this, evt, data); + e.type = name; + return e; + }; + /** + * 处理 PLOT_EVENTS + * plot event 需要处理所有的基础事件，并判断是否在画布中，然后再决定是否要 emit。 + * 对于 mouseenter、mouseleave 比较特殊，需要做一下数学比较。 + * @param e + */ + View.prototype.doPlotEvent = function (e) { + var type = e.type, x = e.x, y = e.y; + var point = { x: x, y: y }; + var ALL_EVENTS = [ + 'mousedown', + 'mouseup', + 'mousemove', + 'mouseleave', + 'mousewheel', + 'touchstart', + 'touchmove', + 'touchend', + 'touchcancel', + 'click', + 'dblclick', + 'contextmenu', + ]; + if (ALL_EVENTS.includes(type)) { + var currentInPlot = this.isPointInPlot(point); + var newEvent = e.clone(); + if (currentInPlot) { + var TYPE = "plot:" + type; // 组合 plot 事件 + newEvent.type = TYPE; + this.emit(TYPE, newEvent); + if (type === 'mouseleave' || type === 'touchend') { + // 在plot 内部却离开画布 + this.isPreMouseInPlot = false; + } + } + // 对于 mouseenter, mouseleave 的计算处理 + if (type === 'mousemove' || type === 'touchmove') { + if (this.isPreMouseInPlot && !currentInPlot) { + if (type === 'mousemove') { + newEvent.type = PLOT_EVENTS.MOUSE_LEAVE; + this.emit(PLOT_EVENTS.MOUSE_LEAVE, newEvent); + } + newEvent.type = PLOT_EVENTS.LEAVE; + this.emit(PLOT_EVENTS.LEAVE, newEvent); + } + else if (!this.isPreMouseInPlot && currentInPlot) { + if (type === 'mousemove') { + newEvent.type = PLOT_EVENTS.MOUSE_ENTER; + this.emit(PLOT_EVENTS.MOUSE_ENTER, newEvent); + } + newEvent.type = PLOT_EVENTS.ENTER; + this.emit(PLOT_EVENTS.ENTER, newEvent); + } + // 赋新的状态值 + this.isPreMouseInPlot = currentInPlot; + } + else if (type === 'mouseleave' || type === 'touchend') { + // 可能不在 currentInPlot 中 + if (this.isPreMouseInPlot) { + if (type === 'mouseleave') { + newEvent.type = PLOT_EVENTS.MOUSE_LEAVE; + this.emit(PLOT_EVENTS.MOUSE_LEAVE, newEvent); + } + newEvent.type = PLOT_EVENTS.LEAVE; + this.emit(PLOT_EVENTS.LEAVE, newEvent); + this.isPreMouseInPlot = false; + } + } + } + }; + // view 生命周期 —— 渲染流程 + /** + * 处理筛选器，筛选数据 + * @private + */ + View.prototype.doFilterData = function () { + var data = this.options.data; + this.filteredData = this.filterData(data); + }; + /** + * 初始化 Geometries + * @private + */ + View.prototype.initGeometries = function (isUpdate) { + // 初始化图形的之前，先创建 / 更新 scales + this.createOrUpdateScales(); + // 实例化 Geometry，然后 view 将所有的 scale 管理起来 + var coordinate = this.getCoordinate(); + var scaleDefs = get$3(this.options, 'scales', {}); + var geometries = this.geometries; + for (var i = 0, len = geometries.length; i < len; i++) { + var geometry = geometries[i]; + // 保持 scales 引用不要变化 + geometry.scales = this.getGeometryScales(); + var cfg = { + coordinate: coordinate, + scaleDefs: scaleDefs, + data: this.filteredData, + theme: this.themeObject, + isDataChanged: this.isDataChanged, + isCoordinateChanged: this.isCoordinateChanged, + }; + if (isUpdate) { + // 数据发生更新 + geometry.update(cfg); + } + else { + geometry.init(cfg); + } + } + // Geometry 初始化之后，生成了 scale，然后进行调整 scale 配置 + this.adjustScales(); + }; + /** + * 根据 Geometry 的所有字段创建 scales + * 如果存在，则更新，不存在则创建 + */ + View.prototype.createOrUpdateScales = function () { + var fields = this.getScaleFields(); + var groupedFields = this.getGroupedFields(); + var _a = this.getOptions(), data = _a.data, _b = _a.scales, scales = _b === void 0 ? {} : _b; + var filteredData = this.filteredData; + for (var i = 0, len = fields.length; i < len; i++) { + var field = fields[i]; + var scaleDef = scales[field]; + // 调用方法，递归去创建 + var key = this.getScaleKey(field); + this.createScale(field, + // 分组字段的 scale 使用未过滤的数据创建 + groupedFields.includes(field) ? data : filteredData, scaleDef, key); + // 缓存从当前 view 创建的 scale key + this.createdScaleKeys.set(key, true); + } + }; + /** + * 处理 scale 同步逻辑 + */ + View.prototype.syncScale = function () { + // 最终调用 root view 的 + this.getRootView().scalePool.sync(this.getCoordinate(), this.theme); + }; + /** + * 获得 Geometry 中的 scale 对象 + */ + View.prototype.getGeometryScales = function () { + var fields = this.getScaleFields(); + var scales = {}; + for (var i = 0; i < fields.length; i++) { + var field = fields[i]; + scales[field] = this.getScaleByField(field); + } + return scales; + }; + View.prototype.getScaleFields = function () { + var fields = []; + var tmpMap = {}; + var geometries = this.geometries; + for (var i = 0; i < geometries.length; i++) { + var geometry = geometries[i]; + var geometryScales = geometry.getScaleFields(); + uniq$2(geometryScales, fields, tmpMap); + } + return fields; + }; + View.prototype.getGroupedFields = function () { + var fields = []; + var tmpMap = {}; + var geometries = this.geometries; + for (var i = 0; i < geometries.length; i++) { + var geometry = geometries[i]; + var groupFields = geometry.getGroupFields(); + uniq$2(groupFields, fields, tmpMap); + } + return fields; + }; + /** + * 调整 scale 配置 + * @private + */ + View.prototype.adjustScales = function () { + // 调整目前包括： + // 分类 scale，调整 range 范围 + this.adjustCategoryScaleRange(); + }; + /** + * 调整分类 scale 的 range，防止超出坐标系外面 + * @private + */ + View.prototype.adjustCategoryScaleRange = function () { + var _this = this; + var xyScales = __spreadArrays$1([this.getXScale()], this.getYScales()).filter(function (e) { return !!e; }); + var coordinate = this.getCoordinate(); + var scaleOptions = this.options.scales; + each$2(xyScales, function (scale) { + var field = scale.field, values = scale.values, isCategory = scale.isCategory, isIdentity = scale.isIdentity; + // 分类或者 identity 的 scale 才进行处理 + if (isCategory || isIdentity) { + // 存在 value 值，且用户没有配置 range 配置 + if (values && !get$3(scaleOptions, [field, 'range'])) { + // 更新 range + scale.range = getDefaultCategoryScaleRange(scale, coordinate, _this.theme); + } + } + }); + }; + /** + * 根据 options 配置、Geometry 字段配置，自动生成 components + * @param isUpdate 是否是更新 + * @private + */ + View.prototype.initComponents = function (isUpdate) { + // 先全部清空，然后 render + var controllers = this.controllers; + for (var i = 0; i < controllers.length; i++) { + var controller = controllers[i]; + // 更新则走更新逻辑；否则清空载重绘 + if (isUpdate) { + controller.update(); + } + else { + controller.clear(); + controller.render(); + } + } + }; + View.prototype.doLayout = function () { + this.layoutFunc(this); + }; + /** + * 创建坐标系 + * @private + */ + View.prototype.createCoordinate = function () { + var start = this.coordinateBBox.bl; + var end = this.coordinateBBox.tr; + this.coordinateInstance = this.coordinateController.create(start, end); + }; + /** + * 根据 options 配置自动渲染 geometry + * @private + */ + View.prototype.paintGeometries = function (isUpdate) { + var doAnimation = this.options.animate; + // geometry 的 paint 阶段 + var coordinate = this.getCoordinate(); + var canvasRegion = { + x: this.viewBBox.x, + y: this.viewBBox.y, + minX: this.viewBBox.minX, + minY: this.viewBBox.minY, + maxX: this.viewBBox.maxX, + maxY: this.viewBBox.maxY, + width: this.viewBBox.width, + height: this.viewBBox.height, + }; + var geometries = this.geometries; + for (var i = 0; i < geometries.length; i++) { + var geometry = geometries[i]; + geometry.coordinate = coordinate; + geometry.canvasRegion = canvasRegion; + if (!doAnimation) { + // 如果 view 不执行动画，那么 view 下所有的 geometry 都不执行动画 + geometry.animate(false); + } + geometry.paint(isUpdate); + } + }; + /** + * 最后的绘制组件 + * @param isUpdate + */ + View.prototype.renderComponents = function (isUpdate) { + // 先全部清空，然后 render + for (var i = 0; i < this.getComponents().length; i++) { + var co = this.getComponents()[i]; + co.component.render(); + } + }; + /** + * 渲染分面，会在其中进行数据分面，然后进行子 view 创建 + * @param isUpdate + */ + View.prototype.renderFacet = function (isUpdate) { + if (this.facetInstance) { + if (isUpdate) { + this.facetInstance.update(); + } + else { + this.facetInstance.clear(); + // 计算分面数据 + this.facetInstance.init(); + // 渲染组件和 views + this.facetInstance.render(); + } + } + }; + View.prototype.initOptions = function () { + var _this = this; + var _a = this.options, _b = _a.geometries, geometries = _b === void 0 ? [] : _b, _c = _a.interactions, interactions = _c === void 0 ? [] : _c, _d = _a.views, views = _d === void 0 ? [] : _d, _e = _a.annotations, annotations = _e === void 0 ? [] : _e, coordinate = _a.coordinate, events = _a.events, facets = _a.facets; + // 设置坐标系 + if (this.coordinateController) { + // 更新 coordinate controller + coordinate && this.coordinateController.update(coordinate); + } + else { + // 创建 coordinate controller + this.coordinateController = new CoordinateController(coordinate); + } + // 创建 geometry 实例 + for (var i = 0; i < geometries.length; i++) { + var geometryOption = geometries[i]; + this.createGeometry(geometryOption); + } + // 创建 interactions 实例 + for (var j = 0; j < interactions.length; j++) { + var interactionOption = interactions[j]; + var type = interactionOption.type, cfg = interactionOption.cfg; + this.interaction(type, cfg); + } + // 创建 view 实例 + for (var k = 0; k < views.length; k++) { + var viewOption = views[k]; + this.createView(viewOption); + } + // 设置 annotation + var annotationComponent = this.getController('annotation'); + for (var l = 0; l < annotations.length; l++) { + var annotationOption = annotations[l]; + annotationComponent.annotation(annotationOption); + } + // 设置 events + if (events) { + each$2(events, function (eventCallback, eventName) { + _this.on(eventName, eventCallback); + }); + } + if (facets) { + each$2(facets, function (facet) { + var type = facet.type, rest = __rest$G(facet, ["type"]); + _this.facet(type, rest); + }); + } + }; + View.prototype.createGeometry = function (geometryOption) { + var type = geometryOption.type, _a = geometryOption.cfg, cfg = _a === void 0 ? {} : _a; + if (this[type]) { + var geometry_1 = this[type](cfg); + each$2(geometryOption, function (v, k) { + if (isFunction$6(geometry_1[k])) { + geometry_1[k](v); + } + }); + } + }; + /** + * scale key 的创建方式 + * @param field + */ + View.prototype.getScaleKey = function (field) { + return this.id + "-" + field; + }; + return View; +}(Base$4)); +/** + * 注册 geometry 组件 + * @param name + * @param Ctor + * @returns Geometry + */ +function registerGeometry(name, Ctor) { + // 语法糖，在 view API 上增加原型方法 + View$1.prototype[name.toLowerCase()] = function (cfg) { + if (cfg === void 0) { cfg = {}; } + var props = __assign$r({ + /** 图形容器 */ + container: this.middleGroup.addGroup(), labelsContainer: this.foregroundGroup.addGroup() }, cfg); + var geometry = new Ctor(props); + this.geometries.push(geometry); + return geometry; + }; +} +var View$2 = View$1; + +/** + * Chart 类，是使用 G2 进行绘图的入口。 + */ +var Chart$1 = /** @class */ (function (_super) { + __extends$e(Chart, _super); + // @ts-ignore + function Chart(props) { + var _this = this; + var container = props.container, width = props.width, height = props.height, _a = props.autoFit, autoFit = _a === void 0 ? false : _a, padding = props.padding, appendPadding = props.appendPadding, _b = props.renderer, renderer = _b === void 0 ? 'canvas' : _b, pixelRatio = props.pixelRatio, _c = props.localRefresh, localRefresh = _c === void 0 ? true : _c, _d = props.visible, visible = _d === void 0 ? true : _d, _e = props.supportCSSTransform, supportCSSTransform = _e === void 0 ? false : _e, _f = props.defaultInteractions, defaultInteractions = _f === void 0 ? ['tooltip', 'legend-filter', 'legend-active', 'continuous-filter', 'ellipsis-text'] : _f, options = props.options, limitInPlot = props.limitInPlot, theme = props.theme, syncViewPadding = props.syncViewPadding; + var ele = isString$3(container) ? document.getElementById(container) : container; + // 生成内部正式绘制的 div 元素 + var wrapperElement = createDom$1('
    '); + ele.appendChild(wrapperElement); + // if autoFit, use the container size, to avoid the graph render twice. + var size = getChartSize(ele, autoFit, width, height); + var G = getEngine(renderer); + var canvas = new G.Canvas(__assign$r({ container: wrapperElement, pixelRatio: pixelRatio, + localRefresh: localRefresh, + supportCSSTransform: supportCSSTransform }, size)); + // 调用 view 的创建 + _this = _super.call(this, { + parent: null, + canvas: canvas, + // create 3 group layers for views. + backgroundGroup: canvas.addGroup({ zIndex: GROUP_Z_INDEX.BG }), + middleGroup: canvas.addGroup({ zIndex: GROUP_Z_INDEX.MID }), + foregroundGroup: canvas.addGroup({ zIndex: GROUP_Z_INDEX.FORE }), + padding: padding, + appendPadding: appendPadding, + visible: visible, + options: options, + limitInPlot: limitInPlot, + theme: theme, + syncViewPadding: syncViewPadding, + }) || this; + /** + * when container size changed, change chart size props, and re-render. + */ + _this.onResize = debounce$1(function () { + _this.forceFit(); + }, 300); + _this.ele = ele; + _this.canvas = canvas; + _this.width = size.width; + _this.height = size.height; + _this.autoFit = autoFit; + _this.localRefresh = localRefresh; + _this.renderer = renderer; + _this.wrapperElement = wrapperElement; + // 自适应大小 + _this.updateCanvasStyle(); + _this.bindAutoFit(); + _this.initDefaultInteractions(defaultInteractions); + return _this; + } + Chart.prototype.initDefaultInteractions = function (interactions) { + var _this = this; + each$2(interactions, function (interaction) { + _this.interaction(interaction); + }); + }; + /** + * 改变图表大小，同时重新渲染。 + * @param width 图表宽度 + * @param height 图表高度 + * @returns + */ + Chart.prototype.changeSize = function (width, height) { + // 如果宽高一致，那么 changeSize 不执行任何操作 + if (this.width === width && this.height === height) { + return this; + } + this.emit(VIEW_LIFE_CIRCLE.BEFORE_CHANGE_SIZE); + this.width = width; + this.height = height; + this.canvas.changeSize(width, height); + // 重新渲染 + this.render(true); + this.emit(VIEW_LIFE_CIRCLE.AFTER_CHANGE_SIZE); + return this; + }; + /** + * 销毁图表，同时解绑事件，销毁创建的 G.Canvas 实例。 + * @returns void + */ + Chart.prototype.destroy = function () { + _super.prototype.destroy.call(this); + this.unbindAutoFit(); + this.canvas.destroy(); + removeDom(this.wrapperElement); + this.wrapperElement = null; + }; + /** + * 显示或隐藏图表 + * @param visible 是否可见，true 表示显示，false 表示隐藏 + * @returns + */ + Chart.prototype.changeVisible = function (visible) { + _super.prototype.changeVisible.call(this, visible); // 需要更新 visible 变量 + this.wrapperElement.style.display = visible ? '' : 'none'; + return this; + }; + /** + * 自动根据容器大小 resize 画布 + */ + Chart.prototype.forceFit = function () { + // skip if already destroyed + if (!this.destroyed) { + // 注意第二参数用 true，意思是即时 autoFit = false，forceFit() 调用之后一样是适配容器 + var _a = getChartSize(this.ele, true, this.width, this.height), width = _a.width, height = _a.height; + this.changeSize(width, height); + } + }; + Chart.prototype.updateCanvasStyle = function () { + modifyCSS(this.canvas.get('el'), { + display: 'inline-block', + verticalAlign: 'middle', + }); + }; + Chart.prototype.bindAutoFit = function () { + if (this.autoFit) { + window.addEventListener('resize', this.onResize); + } + }; + Chart.prototype.unbindAutoFit = function () { + if (this.autoFit) { + window.removeEventListener('resize', this.onResize); + } + }; + return Chart; +}(View$2)); +var Chart$2 = Chart$1; + +/** + * Component Controller 规范需要定义的基类 + * 1. 规范的 option 输入 + * 2. 统一的信息获取 API + * 3. 明确定义的组件事件（名称、数据） + */ +var Controller = /** @class */ (function () { + function Controller(view) { + /** 是否可见 */ + this.visible = true; + /** 所有的 component */ + this.components = []; + this.view = view; + } + /** + * clear + * @param includeOption 是否清空 option 配置项（used in annotation） + */ + Controller.prototype.clear = function (includeOption) { + // destroy all components + each$2(this.components, function (co) { + co.component.destroy(); + }); + // clear all component instance + this.components = []; + }; + /** + * destroy the component + */ + Controller.prototype.destroy = function () { + this.clear(); + }; + /** + * get all components + * @returns components array + */ + Controller.prototype.getComponents = function () { + return this.components; + }; + /** + * change visibility of component + * @param visible + */ + Controller.prototype.changeVisible = function (visible) { + if (this.visible === visible) { + return; + } + this.components.forEach(function (co) { + if (visible) { + co.component.show(); + } + else { + co.component.hide(); + } + }); + this.visible = visible; + }; + return Controller; +}()); + +// Filter duplicates, use `name`, `color`, `value` and `title` property values as condition +function uniq$1(items) { + var uniqItems = []; + var _loop_1 = function (index) { + var item = items[index]; + var result = find$3(uniqItems, function (subItem) { + return (subItem.color === item.color && + subItem.name === item.name && + subItem.value === item.value && + subItem.title === item.title); + }); + if (!result) { + uniqItems.push(item); + } + }; + for (var index = 0; index < items.length; index++) { + _loop_1(index); + } + return uniqItems; +} +/** @ignore */ +var Tooltip$3 = /** @class */ (function (_super) { + __extends$e(Tooltip, _super); + function Tooltip() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.isLocked = false; + return _this; + } + Object.defineProperty(Tooltip.prototype, "name", { + get: function () { + return 'tooltip'; + }, + enumerable: false, + configurable: true + }); + Tooltip.prototype.init = function () { }; + Tooltip.prototype.isVisible = function () { + var option = this.view.getOptions().tooltip; + return option !== false; + }; + Tooltip.prototype.render = function () { }; + /** + * Shows tooltip + * @param point + */ + Tooltip.prototype.showTooltip = function (point) { + this.point = point; + if (!this.isVisible()) { + // 如果设置 tooltip(false) 则始终不显示 + return; + } + var view = this.view; + var items = this.getTooltipItems(point); + if (!items.length) { + // 无内容则不展示，同时 tooltip 需要隐藏 + this.hideTooltip(); + return; + } + var title = this.getTitle(items); + var dataPoint = { + x: items[0].x, + y: items[0].y, + }; // 数据点位置 + view.emit('tooltip:show', Event$1.fromData(view, 'tooltip:show', __assign$r({ items: items, + title: title }, point))); + var cfg = this.getTooltipCfg(); + var follow = cfg.follow, showMarkers = cfg.showMarkers, showCrosshairs = cfg.showCrosshairs, showContent = cfg.showContent, marker = cfg.marker; + var lastItems = this.items; + var lastTitle = this.title; + if (!isEqual$2(lastTitle, title) || !isEqual$2(lastItems, items)) { + // 内容发生变化了更新 tooltip + view.emit('tooltip:change', Event$1.fromData(view, 'tooltip:change', __assign$r({ items: items, + title: title }, point))); + if (isFunction$6(showContent) ? showContent(items) : showContent) { + // 展示 tooltip 内容框才渲染 tooltip + if (!this.tooltip) { + // 延迟生成 + this.renderTooltip(); + } + this.tooltip.update(mix({}, cfg, { + items: this.getItemsAfterProcess(items), + title: title, + }, follow ? point : {})); + this.tooltip.show(); + } + if (showMarkers) { + // 展示 tooltipMarkers，tooltipMarkers 跟随数据 + this.renderTooltipMarkers(items, marker); + } + } + else { + // 内容未发生变化，则更新位置 + if (this.tooltip && follow) { + this.tooltip.update(point); + this.tooltip.show(); // tooltip 有可能被隐藏，需要保证显示状态 + } + if (this.tooltipMarkersGroup) { + this.tooltipMarkersGroup.show(); + } + } + this.items = items; + this.title = title; + if (showCrosshairs) { + // 展示 tooltip 辅助线 + var isCrosshairsFollowCursor = get$3(cfg, ['crosshairs', 'follow'], false); // 辅助线是否要跟随鼠标 + this.renderCrosshairs(isCrosshairsFollowCursor ? point : dataPoint, cfg); + } + }; + Tooltip.prototype.hideTooltip = function () { + var follow = this.getTooltipCfg().follow; + if (!follow) { + this.point = null; + return; + } + // hide the tooltipMarkers + var tooltipMarkersGroup = this.tooltipMarkersGroup; + if (tooltipMarkersGroup) { + tooltipMarkersGroup.hide(); + } + // hide crosshairs + var xCrosshair = this.xCrosshair; + var yCrosshair = this.yCrosshair; + if (xCrosshair) { + xCrosshair.hide(); + } + if (yCrosshair) { + yCrosshair.hide(); + } + var tooltip = this.tooltip; + if (tooltip) { + tooltip.hide(); + } + this.view.emit('tooltip:hide', Event$1.fromData(this.view, 'tooltip:hide', {})); + this.point = null; + }; + /** + * lockTooltip + */ + Tooltip.prototype.lockTooltip = function () { + this.isLocked = true; + if (this.tooltip) { + // tooltip contianer 可捕获事件 + this.tooltip.setCapture(true); + } + }; + /** + * unlockTooltip + */ + Tooltip.prototype.unlockTooltip = function () { + this.isLocked = false; + var cfg = this.getTooltipCfg(); + if (this.tooltip) { + // 重置 capture 属性 + this.tooltip.setCapture(cfg.capture); + } + }; + /** + * isTooltipLocked + */ + Tooltip.prototype.isTooltipLocked = function () { + return this.isLocked; + }; + Tooltip.prototype.clear = function () { + var _a = this, tooltip = _a.tooltip, xCrosshair = _a.xCrosshair, yCrosshair = _a.yCrosshair, tooltipMarkersGroup = _a.tooltipMarkersGroup; + if (tooltip) { + tooltip.hide(); + tooltip.clear(); + } + if (xCrosshair) { + xCrosshair.clear(); + } + if (yCrosshair) { + yCrosshair.clear(); + } + if (tooltipMarkersGroup) { + tooltipMarkersGroup.clear(); + } + this.reset(); + }; + Tooltip.prototype.destroy = function () { + if (this.tooltip) { + this.tooltip.destroy(); + } + if (this.xCrosshair) { + this.xCrosshair.destroy(); + } + if (this.yCrosshair) { + this.yCrosshair.destroy(); + } + if (this.guideGroup) { + this.guideGroup.remove(true); + } + this.reset(); + }; + Tooltip.prototype.reset = function () { + this.items = null; + this.title = null; + this.tooltipMarkersGroup = null; + this.tooltipCrosshairsGroup = null; + this.xCrosshair = null; + this.yCrosshair = null; + this.tooltip = null; + this.guideGroup = null; + this.isLocked = false; + this.point = null; + }; + Tooltip.prototype.changeVisible = function (visible) { + if (this.visible === visible) { + return; + } + var _a = this, tooltip = _a.tooltip, tooltipMarkersGroup = _a.tooltipMarkersGroup, xCrosshair = _a.xCrosshair, yCrosshair = _a.yCrosshair; + if (visible) { + if (tooltip) { + tooltip.show(); + } + if (tooltipMarkersGroup) { + tooltipMarkersGroup.show(); + } + if (xCrosshair) { + xCrosshair.show(); + } + if (yCrosshair) { + yCrosshair.show(); + } + } + else { + if (tooltip) { + tooltip.hide(); + } + if (tooltipMarkersGroup) { + tooltipMarkersGroup.hide(); + } + if (xCrosshair) { + xCrosshair.hide(); + } + if (yCrosshair) { + yCrosshair.hide(); + } + } + this.visible = visible; + }; + Tooltip.prototype.getTooltipItems = function (point) { + var items = this.findItemsFromView(this.view, point); + if (items.length) { + // 三层 + items = flatten$2(items); + for (var _i = 0, items_1 = items; _i < items_1.length; _i++) { + var itemArr = items_1[_i]; + for (var _a = 0, itemArr_1 = itemArr; _a < itemArr_1.length; _a++) { + var item = itemArr_1[_a]; + var _b = item.mappingData, x = _b.x, y = _b.y; + item.x = isArray$n(x) ? x[x.length - 1] : x; + item.y = isArray$n(y) ? y[y.length - 1] : y; + } + } + var shared = this.getTooltipCfg().shared; + // shared: false 代表只显示当前拾取到的 shape 的数据，但是一个 view 会有多个 Geometry，所以有可能会拾取到多个 shape + if (shared === false && items.length > 1) { + var snapItem = items[0]; + var min = Math.abs(point.y - snapItem[0].y); + for (var _c = 0, items_2 = items; _c < items_2.length; _c++) { + var aItem = items_2[_c]; + var yDistance = Math.abs(point.y - aItem[0].y); + if (yDistance <= min) { + snapItem = aItem; + min = yDistance; + } + } + items = [snapItem]; + } + return uniq$1(flatten$2(items)); + } + return []; + }; + Tooltip.prototype.layout = function () { }; + Tooltip.prototype.update = function () { + if (this.point) { + this.showTooltip(this.point); + } + if (this.tooltip) { + // #2279 修复resize之后tooltip越界的问题 + // 确保tooltip已经创建的情况下 + var canvas = this.view.getCanvas(); + // TODO 逍为 tooltip 的区域不应该是 canvas，而应该是整个 特别是在图比较小的时候 + // 更新 region + this.tooltip.set('region', { + start: { x: 0, y: 0 }, + end: { x: canvas.get('width'), y: canvas.get('height') }, + }); + } + }; + /** + * 当前鼠标点是在 enter tooltip 中 + * @param point + */ + Tooltip.prototype.isCursorEntered = function (point) { + // 是可捕获的，并且点在 tooltip dom 上 + if (this.tooltip) { + var el = this.tooltip.getContainer(); + var capture = this.tooltip.get('capture'); + if (el && capture) { + var _a = el.getBoundingClientRect(), x = _a.x, y = _a.y, width = _a.width, height = _a.height; + return new BBox(x, y, width, height).isPointIn(point); + } + } + return false; + }; + // 获取 tooltip 配置，因为用户可能会通过 view.tooltip() 重新配置 tooltip，所以就不做缓存，每次直接读取 + Tooltip.prototype.getTooltipCfg = function () { + var view = this.view; + var option = view.getOptions().tooltip; + var processOption = this.processCustomContent(option); + var theme = view.getTheme(); + var defaultCfg = get$3(theme, ['components', 'tooltip'], {}); + var enterable = get$3(processOption, 'enterable', defaultCfg.enterable); + return deepMix({}, defaultCfg, processOption, { + capture: enterable || this.isLocked ? true : false, + }); + }; + // process customContent + Tooltip.prototype.processCustomContent = function (option) { + if (isBoolean(option) || !get$3(option, 'customContent')) { + return option; + } + var currentCustomContent = option.customContent; + var customContent = function (title, items) { + var content = currentCustomContent(title, items) || ''; + return isString$3(content) ? '
    ' + content + '
    ' : content; + }; + return __assign$r(__assign$r({}, option), { customContent: customContent }); + }; + Tooltip.prototype.getTitle = function (items) { + var title = items[0].title || items[0].name; + this.title = title; + return title; + }; + Tooltip.prototype.renderTooltip = function () { + var canvas = this.view.getCanvas(); + var region = { + start: { x: 0, y: 0 }, + end: { x: canvas.get('width'), y: canvas.get('height') }, + }; + var cfg = this.getTooltipCfg(); + var tooltip = new HtmlTooltip(__assign$r(__assign$r({ parent: canvas.get('el').parentNode, region: region }, cfg), { visible: false, crosshairs: null })); + tooltip.init(); + this.tooltip = tooltip; + }; + Tooltip.prototype.renderTooltipMarkers = function (items, marker) { + var tooltipMarkersGroup = this.getTooltipMarkersGroup(); + for (var _i = 0, items_3 = items; _i < items_3.length; _i++) { + var item = items_3[_i]; + var x = item.x, y = item.y; + var attrs = __assign$r(__assign$r({ fill: item.color, symbol: 'circle', shadowColor: item.color }, marker), { x: x, + y: y }); + tooltipMarkersGroup.addShape('marker', { + attrs: attrs, + }); + } + }; + Tooltip.prototype.renderCrosshairs = function (point, cfg) { + var crosshairsType = get$3(cfg, ['crosshairs', 'type'], 'x'); // 默认展示 x 轴上的辅助线 + if (crosshairsType === 'x') { + if (this.yCrosshair) { + this.yCrosshair.hide(); + } + this.renderXCrosshairs(point, cfg); + } + else if (crosshairsType === 'y') { + if (this.xCrosshair) { + this.xCrosshair.hide(); + } + this.renderYCrosshairs(point, cfg); + } + else if (crosshairsType === 'xy') { + this.renderXCrosshairs(point, cfg); + this.renderYCrosshairs(point, cfg); + } + }; + // 渲染 x 轴上的 tooltip 辅助线 + Tooltip.prototype.renderXCrosshairs = function (point, tooltipCfg) { + var coordinate = this.getViewWithGeometry(this.view).getCoordinate(); + if (!isPointInCoordinate(coordinate, point)) { + return; + } + var start; + var end; + if (coordinate.isRect) { + if (coordinate.isTransposed) { + start = { + x: coordinate.start.x, + y: point.y, + }; + end = { + x: coordinate.end.x, + y: point.y, + }; + } + else { + start = { + x: point.x, + y: coordinate.end.y, + }; + end = { + x: point.x, + y: coordinate.start.y, + }; + } + } + else { + // 极坐标下 x 轴上的 crosshairs 表现为半径 + var angle = getAngleByPoint(coordinate, point); + var center = coordinate.getCenter(); + var radius = coordinate.getRadius(); + end = polarToCartesian(center.x, center.y, radius, angle); + start = center; + } + var cfg = deepMix({ + start: start, + end: end, + container: this.getTooltipCrosshairsGroup(), + }, get$3(tooltipCfg, 'crosshairs', {}), this.getCrosshairsText('x', point, tooltipCfg)); + delete cfg.type; // 与 Crosshairs 组件的 type 冲突故删除 + var xCrosshair = this.xCrosshair; + if (xCrosshair) { + xCrosshair.update(cfg); + } + else { + xCrosshair = new LineCrosshair$1(cfg); + xCrosshair.init(); + } + xCrosshair.render(); + xCrosshair.show(); + this.xCrosshair = xCrosshair; + }; + // 渲染 y 轴上的辅助线 + Tooltip.prototype.renderYCrosshairs = function (point, tooltipCfg) { + var coordinate = this.getViewWithGeometry(this.view).getCoordinate(); + if (!isPointInCoordinate(coordinate, point)) { + return; + } + var cfg; + var type; + if (coordinate.isRect) { + var start = void 0; + var end = void 0; + if (coordinate.isTransposed) { + start = { + x: point.x, + y: coordinate.end.y, + }; + end = { + x: point.x, + y: coordinate.start.y, + }; + } + else { + start = { + x: coordinate.start.x, + y: point.y, + }; + end = { + x: coordinate.end.x, + y: point.y, + }; + } + cfg = { + start: start, + end: end, + }; + type = 'Line'; + } + else { + // 极坐标下 y 轴上的 crosshairs 表现为圆弧 + cfg = { + center: coordinate.getCenter(), + // @ts-ignore + radius: getDistanceToCenter(coordinate, point), + startAngle: coordinate.startAngle, + endAngle: coordinate.endAngle, + }; + type = 'Circle'; + } + cfg = deepMix({ + container: this.getTooltipCrosshairsGroup(), + }, cfg, get$3(tooltipCfg, 'crosshairs', {}), this.getCrosshairsText('y', point, tooltipCfg)); + delete cfg.type; // 与 Crosshairs 组件的 type 冲突故删除 + var yCrosshair = this.yCrosshair; + if (yCrosshair) { + // 如果坐标系发生直角坐标系与极坐标的切换操作 + if ((coordinate.isRect && yCrosshair.get('type') === 'circle') || + (!coordinate.isRect && yCrosshair.get('type') === 'line')) { + yCrosshair = new Crosshair[type](cfg); + yCrosshair.init(); + } + else { + yCrosshair.update(cfg); + } + } + else { + yCrosshair = new Crosshair[type](cfg); + yCrosshair.init(); + } + yCrosshair.render(); + yCrosshair.show(); + this.yCrosshair = yCrosshair; + }; + Tooltip.prototype.getCrosshairsText = function (type, point, tooltipCfg) { + var textCfg = get$3(tooltipCfg, ['crosshairs', 'text']); + var follow = get$3(tooltipCfg, ['crosshairs', 'follow']); + var items = this.items; + if (textCfg) { + var view = this.getViewWithGeometry(this.view); + // 需要展示文本 + var firstItem = items[0]; + var xScale = view.getXScale(); + var yScale = view.getYScales()[0]; + var xValue = void 0; + var yValue = void 0; + if (follow) { + // 如果需要跟随鼠标移动，就需要将当前鼠标坐标点转换为对应的数值 + var invertPoint = this.view.getCoordinate().invert(point); + xValue = xScale.invert(invertPoint.x); // 转换为原始值 + yValue = yScale.invert(invertPoint.y); // 转换为原始值 + } + else { + xValue = firstItem.data[xScale.field]; + yValue = firstItem.data[yScale.field]; + } + var content = type === 'x' ? xValue : yValue; + if (isFunction$6(textCfg)) { + textCfg = textCfg(type, content, items, point); + } + else { + textCfg.content = content; + } + return { + text: textCfg, + }; + } + }; + // 获取存储 tooltipMarkers 和 crosshairs 的容器 + Tooltip.prototype.getGuideGroup = function () { + if (!this.guideGroup) { + var foregroundGroup = this.view.foregroundGroup; + this.guideGroup = foregroundGroup.addGroup({ + name: 'tooltipGuide', + capture: false, + }); + } + return this.guideGroup; + }; + // 获取 tooltipMarkers 存储的容器 + Tooltip.prototype.getTooltipMarkersGroup = function () { + var tooltipMarkersGroup = this.tooltipMarkersGroup; + if (tooltipMarkersGroup && !tooltipMarkersGroup.destroyed) { + tooltipMarkersGroup.clear(); + tooltipMarkersGroup.show(); + } + else { + tooltipMarkersGroup = this.getGuideGroup().addGroup({ + name: 'tooltipMarkersGroup', + }); + tooltipMarkersGroup.toFront(); + this.tooltipMarkersGroup = tooltipMarkersGroup; + } + return tooltipMarkersGroup; + }; + // 获取 tooltip crosshairs 存储的容器 + Tooltip.prototype.getTooltipCrosshairsGroup = function () { + var tooltipCrosshairsGroup = this.tooltipCrosshairsGroup; + if (!tooltipCrosshairsGroup) { + tooltipCrosshairsGroup = this.getGuideGroup().addGroup({ + name: 'tooltipCrosshairsGroup', + capture: false, + }); + tooltipCrosshairsGroup.toBack(); + this.tooltipCrosshairsGroup = tooltipCrosshairsGroup; + } + return tooltipCrosshairsGroup; + }; + Tooltip.prototype.findItemsFromView = function (view, point) { + if (view.getOptions().tooltip === false) { + // 如果 view 关闭了 tooltip + return []; + } + var tooltipCfg = this.getTooltipCfg(); + var result = findItemsFromView(view, point, tooltipCfg); + // 递归查找，并合并结果 + for (var _i = 0, _a = view.views; _i < _a.length; _i++) { + var childView = _a[_i]; + result = result.concat(this.findItemsFromView(childView, point)); + } + return result; + }; + // FIXME: hack 方法 + // 因为 tooltip 的交互是挂载在 Chart 上，所以当chart 上没有绘制 Geometry 的时候，就查找不到数据，并且绘图区域同子 View 的区域不同 + Tooltip.prototype.getViewWithGeometry = function (view) { + var _this = this; + if (view.geometries.length) { + return view; + } + return find$3(view.views, function (childView) { return _this.getViewWithGeometry(childView); }); + }; + /** + * 根据用户配置的 items 配置，来进行用户自定义的处理，并返回最终的 items + * 默认不做任何处理 + */ + Tooltip.prototype.getItemsAfterProcess = function (originalItems) { + var customItems = this.getTooltipCfg().customItems; + var fn = customItems ? customItems : function (v) { return v; }; + return fn(originalItems); + }; + return Tooltip; +}(Controller)); +var TooltipController = Tooltip$3; + +var ANIMATIONS_MAP = {}; +/** + * 根据名称获取对应的动画执行函数 + * @param type 动画函数名称 + */ +function getAnimation(type) { + return ANIMATIONS_MAP[type.toLowerCase()]; +} +/** + * 注册动画执行函数 + * @param type 动画执行函数名称 + * @param animation 动画执行函数 + */ +function registerAnimation(type, animation) { + ANIMATIONS_MAP[type.toLowerCase()] = animation; +} + +// 默认的动画参数配置 +var DEFAULT_ANIMATE_CFG = { + appear: { + duration: 450, + easing: 'easeQuadOut', + }, + update: { + duration: 400, + easing: 'easeQuadInOut', + }, + enter: { + duration: 400, + easing: 'easeQuadInOut', + }, + leave: { + duration: 350, + easing: 'easeQuadIn', + }, +}; +// 各个 Geometry 默认的动画执行函数 +var GEOMETRY_ANIMATE_CFG = { + interval: function (coordinate) { + return { + enter: { + animation: coordinate.isRect ? (coordinate.isTransposed ? 'scale-in-x' : 'scale-in-y') : 'fade-in', + }, + update: { + animation: coordinate.isPolar && coordinate.isTransposed ? 'sector-path-update' : null, + }, + leave: { + animation: 'fade-out', + }, + }; + }, + line: { + enter: { + animation: 'fade-in', + }, + leave: { + animation: 'fade-out', + }, + }, + path: { + enter: { + animation: 'fade-in', + }, + leave: { + animation: 'fade-out', + }, + }, + point: { + appear: { + animation: 'zoom-in', + }, + enter: { + animation: 'zoom-in', + }, + leave: { + animation: 'zoom-out', + }, + }, + area: { + enter: { + animation: 'fade-in', + }, + leave: { + animation: 'fade-out', + }, + }, + polygon: { + enter: { + animation: 'fade-in', + }, + leave: { + animation: 'fade-out', + }, + }, + schema: { + enter: { + animation: 'fade-in', + }, + leave: { + animation: 'fade-out', + }, + }, + edge: { + enter: { + animation: 'fade-in', + }, + leave: { + animation: 'fade-out', + }, + }, + label: { + appear: { + animation: 'fade-in', + delay: 450, + }, + enter: { + animation: 'fade-in', + }, + update: { + animation: 'position-update', + }, + leave: { + animation: 'fade-out', + }, + }, +}; +// 各个 Geometry 默认的群组出场动画 +var GEOMETRY_GROUP_APPEAR_ANIMATION = { + line: function () { + return { + animation: 'wave-in', + }; + }, + area: function () { + return { + animation: 'wave-in', + }; + }, + path: function () { + return { + animation: 'fade-in', + }; + }, + interval: function (coordinate) { + var animation; + if (coordinate.isRect) { + animation = coordinate.isTransposed ? 'grow-in-x' : 'grow-in-y'; + } + else { + animation = 'grow-in-xy'; + if (coordinate.isPolar && coordinate.isTransposed) { + // pie chart + animation = 'wave-in'; + } + } + return { + animation: animation, + }; + }, + schema: function (coordinate) { + var animation; + if (coordinate.isRect) { + animation = coordinate.isTransposed ? 'grow-in-x' : 'grow-in-y'; + } + else { + animation = 'grow-in-xy'; + } + return { + animation: animation, + }; + }, + polygon: function () { + return { + animation: 'fade-in', + duration: 500, + }; + }, + edge: function () { + return { + animation: 'fade-in', + }; + }, +}; +// 解析用户的动画配置 +function parseAnimateConfig(animateCfg, data) { + return { + delay: isFunction$6(animateCfg.delay) ? animateCfg.delay(data) : animateCfg.delay, + easing: isFunction$6(animateCfg.easing) ? animateCfg.easing(data) : animateCfg.easing, + duration: isFunction$6(animateCfg.duration) ? animateCfg.duration(data) : animateCfg.duration, + callback: animateCfg.callback, + repeat: animateCfg.repeat, + }; +} +/** + * @ignore + * 获取 elementName 对应的动画配置，当声明了 `animateType`，则返回 `animateType` 对应的动画配置 + * @param elementName 元素名称 + * @param coordinate 做表弟类型 + * @param animateType 可选，动画类型 + */ +function getDefaultAnimateCfg(elementName, coordinate, animateType) { + var animateCfg = GEOMETRY_ANIMATE_CFG[elementName]; + if (animateCfg) { + if (isFunction$6(animateCfg)) { + animateCfg = animateCfg(coordinate); + } + animateCfg = deepMix({}, DEFAULT_ANIMATE_CFG, animateCfg); + if (animateType) { + return animateCfg[animateType]; + } + } + return animateCfg; +} +/** + * @ignore + * 工具函数 + * 根据用户传入的配置为 shape 执行动画 + * @param shape 执行动画的图形元素 + * @param animateCfg 动画配置 + * @param cfg 额外的信息 + */ +function doAnimate(shape, animateCfg, cfg) { + var data = get$3(shape.get('origin'), 'data', FIELD_ORIGIN); + var animation = animateCfg.animation; // 获取动画执行函数 + var parsedAnimateCfg = parseAnimateConfig(animateCfg, data); + if (animation) { + // 用户声明了动画执行函数 + var animateFunction = getAnimation(animation); + if (animateFunction) { + animateFunction(shape, parsedAnimateCfg, cfg); + } + } + else { + // 没有声明，则根据 toAttrs 做差值动画 + shape.animate(cfg.toAttrs, parsedAnimateCfg); + } +} +/** + * @ignore + * 执行 Geometry 群组入场动画 + * @param container 执行群组动画的图形元素 + * @param animateCfg 动画配置 + * @param geometryType geometry 类型 + * @param coordinate 坐标系对象 + * @param minYPoint y 轴最小值对应的画布坐标点 + */ +function doGroupAppearAnimate(container, animateCfg, geometryType, coordinate, minYPoint) { + if (GEOMETRY_GROUP_APPEAR_ANIMATION[geometryType]) { + var defaultCfg = GEOMETRY_GROUP_APPEAR_ANIMATION[geometryType](coordinate); + var animation = getAnimation(get$3(defaultCfg, 'animation', '')); + if (animation) { + var cfg = __assign$r(__assign$r(__assign$r({}, DEFAULT_ANIMATE_CFG.appear), defaultCfg), animateCfg); + container.stopAnimate(); // 先结束当前 container 动画 + animation(container, cfg, { + coordinate: coordinate, + minYPoint: minYPoint, + toAttrs: null, + }); + } + } +} + +/** + * Name of Background Shape + */ +var BACKGROUND_SHAPE = 'element-background'; + +/** + * Element 图形元素。 + * 定义：在 G2 中，我们会将数据通过图形语法映射成不同的图形，比如点图，数据集中的每条数据会对应一个点，柱状图每条数据对应一个柱子，线图则是一组数据对应一条折线，Element 即一条/一组数据对应的图形元素，它代表一条数据或者一个数据集，在图形层面，它可以是单个 Shape 也可以是多个 Shape，我们称之为图形元素。 + */ +var Element$1 = /** @class */ (function (_super) { + __extends$e(Element, _super); + function Element(cfg) { + var _this = _super.call(this, cfg) || this; + // 存储当前开启的状态 + _this.states = []; + var shapeFactory = cfg.shapeFactory, container = cfg.container, offscreenGroup = cfg.offscreenGroup, _a = cfg.visible, visible = _a === void 0 ? true : _a; + _this.shapeFactory = shapeFactory; + _this.container = container; + _this.offscreenGroup = offscreenGroup; + _this.visible = visible; + return _this; + } + /** + * 绘制图形。 + * @param model 绘制数据。 + * @param isUpdate 可选，是否是更新发生后的绘制。 + */ + Element.prototype.draw = function (model, isUpdate) { + if (isUpdate === void 0) { isUpdate = false; } + this.model = model; + this.data = model.data; // 存储原始数据 + this.shapeType = this.getShapeType(model); + // 绘制图形 + this.drawShape(model, isUpdate); + if (this.visible === false) { + // 用户在初始化的时候声明 visible: false + this.changeVisible(false); + } + }; + /** + * 更新图形。 + * @param model 更新的绘制数据。 + */ + Element.prototype.update = function (model) { + var _a = this, shapeFactory = _a.shapeFactory, shape = _a.shape; + if (!shape) { + return; + } + // 更新数据 + this.model = model; + this.data = model.data; + this.shapeType = this.getShapeType(model); + // step 1: 更新 shape 携带的信息 + this.setShapeInfo(shape, model); + // step 2: 使用虚拟 Group 重新绘制 shape，然后更新当前 shape + var offscreenGroup = this.getOffscreenGroup(); + var newShape = shapeFactory.drawShape(this.shapeType, model, offscreenGroup); + // @ts-ignore + newShape.cfg.data = this.data; + // @ts-ignore + newShape.cfg.origin = model; + // label 需要使用 + newShape.cfg.element = this; + // step 3: 同步 shape 样式 + this.syncShapeStyle(shape, newShape, this.getStates(), this.getAnimateCfg('update')); + }; + /** + * 销毁 element 实例。 + */ + Element.prototype.destroy = function () { + var _a = this, shapeFactory = _a.shapeFactory, shape = _a.shape; + if (shape) { + var animateCfg = this.getAnimateCfg('leave'); + if (animateCfg) { + // 指定了动画配置则执行销毁动画 + doAnimate(shape, animateCfg, { + coordinate: shapeFactory.coordinate, + toAttrs: __assign$r({}, shape.attr()), + }); + } + else { + // 否则直接销毁 + shape.remove(true); + } + } + // reset + this.states = []; + this.shapeFactory = undefined; + this.container = undefined; + this.shape = undefined; + this.animate = undefined; + this.geometry = undefined; + this.labelShape = undefined; + this.model = undefined; + this.data = undefined; + this.offscreenGroup = undefined; + this.statesStyle = undefined; + _super.prototype.destroy.call(this); + }; + /** + * 显示或者隐藏 element。 + * @param visible 是否可见。 + */ + Element.prototype.changeVisible = function (visible) { + _super.prototype.changeVisible.call(this, visible); + if (visible) { + if (this.shape) { + this.shape.show(); + } + if (this.labelShape) { + this.labelShape.forEach(function (label) { + label.show(); + }); + } + } + else { + if (this.shape) { + this.shape.hide(); + } + if (this.labelShape) { + this.labelShape.forEach(function (label) { + label.hide(); + }); + } + } + }; + /** + * 设置 Element 的状态。 + * + * 目前 Element 开放三种状态： + * 1. active + * 2. selected + * 3. inactive + * + * 这三种状态相互独立，可以进行叠加。 + * + * 这三种状态的样式可在 [[Theme]] 主题中或者通过 `geometry.state()` 接口进行配置。 + * + * ```ts + * // 激活 active 状态 + * setState('active', true); + * ``` + * + * @param stateName 状态名 + * @param stateStatus 是否开启状态 + */ + Element.prototype.setState = function (stateName, stateStatus) { + var _a = this, states = _a.states, shapeFactory = _a.shapeFactory, model = _a.model, shape = _a.shape, shapeType = _a.shapeType; + var index = states.indexOf(stateName); + if (stateStatus) { + // 开启状态 + if (index > -1) { + // 该状态已经开启，则返回 + return; + } + states.push(stateName); + if (stateName === 'active' || stateName === 'selected') { + shape === null || shape === void 0 ? void 0 : shape.toFront(); + } + } + else { + if (index === -1) { + // 关闭状态，但是状态未设置过 + return; + } + states.splice(index, 1); + if (stateName === 'active' || stateName === 'selected') { + shape === null || shape === void 0 ? void 0 : shape.toBack(); + } + } + // 使用虚拟 group 重新绘制 shape，然后对这个 shape 应用状态样式后，更新当前 shape。 + var offscreenShape = shapeFactory.drawShape(shapeType, model, this.getOffscreenGroup()); + if (states.length) { + // 应用当前状态 + this.syncShapeStyle(shape, offscreenShape, states, null); + } + else { + // 如果没有状态，则需要恢复至原始状态 + this.syncShapeStyle(shape, offscreenShape, ['reset'], null); + } + offscreenShape.remove(true); // 销毁，减少内存占用 + var eventObject = { + state: stateName, + stateStatus: stateStatus, + element: this, + target: this.container, + }; + this.container.emit('statechange', eventObject); + // @ts-ignore + propagationDelegate(this.shape, 'statechange', eventObject); + }; + /** + * 清空状量态，恢复至初始状态。 + */ + Element.prototype.clearStates = function () { + var _this = this; + var states = this.states; + each$2(states, function (state) { + _this.setState(state, false); + }); + this.states = []; + }; + /** + * 查询当前 Element 上是否已设置 `stateName` 对应的状态。 + * @param stateName 状态名称。 + * @returns true 表示存在，false 表示不存在。 + */ + Element.prototype.hasState = function (stateName) { + return this.states.includes(stateName); + }; + /** + * 获取当前 Element 上所有的状态。 + * @returns 当前 Element 上所有的状态数组。 + */ + Element.prototype.getStates = function () { + return this.states; + }; + /** + * 获取 Element 对应的原始数据。 + * @returns 原始数据。 + */ + Element.prototype.getData = function () { + return this.data; + }; + /** + * 获取 Element 对应的图形绘制数据。 + * @returns 图形绘制数据。 + */ + Element.prototype.getModel = function () { + return this.model; + }; + /** + * 返回 Element 元素整体的 bbox，包含文本及文本连线（有的话）。 + * @returns 整体包围盒。 + */ + Element.prototype.getBBox = function () { + var _a = this, shape = _a.shape, labelShape = _a.labelShape; + var bbox = { + x: 0, + y: 0, + minX: 0, + minY: 0, + maxX: 0, + maxY: 0, + width: 0, + height: 0, + }; + if (shape) { + bbox = shape.getCanvasBBox(); + } + if (labelShape) { + labelShape.forEach(function (label) { + var labelBBox = label.getCanvasBBox(); + bbox.x = Math.min(labelBBox.x, bbox.x); + bbox.y = Math.min(labelBBox.y, bbox.y); + bbox.minX = Math.min(labelBBox.minX, bbox.minX); + bbox.minY = Math.min(labelBBox.minY, bbox.minY); + bbox.maxX = Math.max(labelBBox.maxX, bbox.maxX); + bbox.maxY = Math.max(labelBBox.maxY, bbox.maxY); + }); + } + bbox.width = bbox.maxX - bbox.minX; + bbox.height = bbox.maxY - bbox.minY; + return bbox; + }; + Element.prototype.getStatesStyle = function () { + if (!this.statesStyle) { + var _a = this, shapeType = _a.shapeType, geometry = _a.geometry, shapeFactory = _a.shapeFactory; + var stateOption = geometry.stateOption; + var defaultShapeType = shapeFactory.defaultShapeType; + var stateTheme = shapeFactory.theme[shapeType] || shapeFactory.theme[defaultShapeType]; + this.statesStyle = deepMix({}, stateTheme, stateOption); + } + return this.statesStyle; + }; + // 从主题中获取对应状态量的样式 + Element.prototype.getStateStyle = function (stateName, shapeKey) { + var statesStyle = this.getStatesStyle(); + var stateCfg = get$3(statesStyle, [stateName, 'style'], {}); + var shapeStyle = stateCfg[shapeKey] || stateCfg; + if (isFunction$6(shapeStyle)) { + return shapeStyle(this); + } + return shapeStyle; + }; + // 获取动画配置 + Element.prototype.getAnimateCfg = function (animateType) { + var _this = this; + var animate = this.animate; + if (animate) { + var cfg_1 = animate[animateType]; + if (cfg_1) { + // 增加动画的回调函数，如果外部传入了，则先执行外部，然后发射 geometry 的 animate 事件 + return __assign$r(__assign$r({}, cfg_1), { callback: function () { + var _a; + isFunction$6(cfg_1.callback) && cfg_1.callback(); + (_a = _this.geometry) === null || _a === void 0 ? void 0 : _a.emit(GEOMETRY_LIFE_CIRCLE.AFTER_DRAW_ANIMATE); + } }); + } + return cfg_1; + } + return null; + }; + // 绘制图形 + Element.prototype.drawShape = function (model, isUpdate) { + var _a; + if (isUpdate === void 0) { isUpdate = false; } + var _b = this, shapeFactory = _b.shapeFactory, container = _b.container, shapeType = _b.shapeType; + // 自定义 shape 有可能返回空 shape + this.shape = shapeFactory.drawShape(shapeType, model, container); + if (this.shape) { + this.setShapeInfo(this.shape, model); // 存储绘图数据 + // @ts-ignore + var name_1 = this.shape.cfg.name; + // 附加 element 的 name, name 现在支持数组了，很好用了 + if (!name_1) { + // 这个地方如果用户添加了 name, 则附加 name ，否则就添加自己的 name + // @ts-ignore + this.shape.cfg.name = ['element', this.shapeFactory.geometryType]; + } + else if (isString$3(name_1)) { + // @ts-ignore + this.shape.cfg.name = ['element', name_1]; + } + // 执行入场动画 + var animateType = isUpdate ? 'enter' : 'appear'; + var animateCfg = this.getAnimateCfg(animateType); + if (animateCfg) { + // 开始执行动画的生命周期 + (_a = this.geometry) === null || _a === void 0 ? void 0 : _a.emit(GEOMETRY_LIFE_CIRCLE.BEFORE_DRAW_ANIMATE); + doAnimate(this.shape, animateCfg, { + coordinate: shapeFactory.coordinate, + toAttrs: __assign$r({}, this.shape.attr()), + }); + } + } + }; + // 获取虚拟 Group + Element.prototype.getOffscreenGroup = function () { + if (!this.offscreenGroup) { + var GroupCtor = this.container.getGroupBase(); // 获取分组的构造函数 + this.offscreenGroup = new GroupCtor({}); + } + return this.offscreenGroup; + }; + // 设置 shape 上需要携带的信息 + Element.prototype.setShapeInfo = function (shape, data) { + var _this = this; + // @ts-ignore + shape.cfg.origin = data; + // @ts-ignore + shape.cfg.element = this; + if (shape.isGroup()) { + var children = shape.get('children'); + children.forEach(function (child) { + _this.setShapeInfo(child, data); + }); + } + }; + // 更新当前 shape 的样式 + Element.prototype.syncShapeStyle = function (sourceShape, targetShape, states, animateCfg, index) { + var _this = this; + var _a; + if (states === void 0) { states = []; } + if (index === void 0) { index = 0; } + if (!sourceShape || !targetShape) { + return; + } + // 所有的 shape 都需要同步 clip + var clip = sourceShape.get('clipShape'); + var newClip = targetShape.get('clipShape'); + this.syncShapeStyle(clip, newClip, states, animateCfg); + if (sourceShape.isGroup()) { + var children = sourceShape.get('children'); + var newChildren = targetShape.get('children'); + for (var i = 0; i < children.length; i++) { + this.syncShapeStyle(children[i], newChildren[i], states, animateCfg, index + i); + } + } + else { + if (!isEmpty$1(states) && !isEqual$2(states, ['reset'])) { + var name_2 = sourceShape.get('name'); + if (isArray$n(name_2)) { + // 会附加 element 的 name + name_2 = name_2[1]; + } + each$2(states, function (state) { + // background shape 不进行状态样式设置 + if (targetShape.get('name') !== BACKGROUND_SHAPE) { + var style = _this.getStateStyle(state, name_2 || index); // 如果用户没有设置 name，则默认根据索引值 + targetShape.attr(style); + } + }); + } + var newAttrs = getReplaceAttrs(sourceShape, targetShape); + if (this.animate) { + if (animateCfg) { + (_a = this.geometry) === null || _a === void 0 ? void 0 : _a.emit(GEOMETRY_LIFE_CIRCLE.BEFORE_DRAW_ANIMATE); + // 需要进行动画 + doAnimate(sourceShape, animateCfg, { + coordinate: this.shapeFactory.coordinate, + toAttrs: newAttrs, + shapeModel: this.model, + }); + } + else if (isEmpty$1(states)) { + sourceShape.stopAnimate(); + sourceShape.animate(newAttrs, { + duration: 300, + }); + } + else { + sourceShape.attr(newAttrs); + } + } + else { + sourceShape.attr(newAttrs); + } + } + }; + Element.prototype.getShapeType = function (model) { + var shape = get$3(model, 'shape'); + return isArray$n(shape) ? shape[0] : shape; + }; + return Element; +}(Base$4)); +var Element$2 = Element$1; + +var GEOMETRY_LABELS_MAP = {}; +var GEOMETRY_LABELS_LAYOUT_MAP = {}; +/** + * 获取 `type` 对应的 [[GeometryLabel]] 类 + * @param type + * @returns + */ +function getGeometryLabel(type) { + return GEOMETRY_LABELS_MAP[type.toLowerCase()]; +} +/** + * 注册定义的 GeometryLabel 类 + * @param type GeometryLabel 类型名称 + * @param ctor GeometryLabel 类 + */ +function registerGeometryLabel(type, ctor) { + GEOMETRY_LABELS_MAP[type.toLowerCase()] = ctor; +} +/** + * 获取 `type` 对应的 [[GeometryLabelsLayoutFn]] label 布局函数 + * @param type 布局函数名称 + * @returns + */ +function getGeometryLabelLayout(type) { + return GEOMETRY_LABELS_LAYOUT_MAP[type.toLowerCase()]; +} +/** + * 注册定义的 label 布局函数 + * @param type label 布局函数名称 + * @param layoutFn label 布局函数 + */ +function registerGeometryLabelLayout(type, layoutFn) { + GEOMETRY_LABELS_LAYOUT_MAP[type.toLowerCase()] = layoutFn; +} + +/** ShapeFactory 基类 */ +var ShapeFactoryBase$1 = { + /** 坐标系对象 */ + coordinate: null, + /** 默认绘制的 Shape 类型 */ + defaultShapeType: null, + /** 主题样式 */ + theme: null, + /** + * 获取 shape 绘制需要的关键点 + * @param shapeType shape 类型 + * @param shapePoint 每条数据映射后的坐标点以及 size 数值 + * @returns 图形关键点信息 + */ + getShapePoints: function (shapeType, shapePoint) { + var shape = this.getShape(shapeType); + if (shape.getPoints) { + return shape.getPoints(shapePoint); + } + return this.getDefaultPoints(shapePoint); + }, + /** + * 根据 shape 类型获取具体的 shape 实例 + * @param shapeType string shape 的类型 + * @returns + */ + getShape: function (shapeType) { + var shape = this[shapeType] || this[this.defaultShapeType]; + shape.coordinate = this.coordinate; + return shape; + }, + /** + * 获取 shape 的默认关键点 + * @override + */ + getDefaultPoints: function () { + return []; + }, + /** + * 获取 shape 的默认绘制样式 (内置的 shapeFactory 均有注册默认样式) + */ + getDefaultStyle: function (geometryTheme) { + return get$3(geometryTheme, [this.defaultShapeType, 'default', 'style'], {}); + }, + /** + * 获取 shape 对应的缩略图配置信息。 + * @param shapeType shape 类型 + * @param color 颜色 + * @param isInPolar 是否在极坐标系下 + * @returns 返回缩略图 marker 配置。 + */ + getMarker: function (shapeType, markerCfg) { + var shape = this.getShape(shapeType); + if (!shape.getMarker) { + var defaultShapeType = this.defaultShapeType; + shape = this.getShape(defaultShapeType); + } + var theme = this.theme; + var shapeStyle = get$3(theme, [shapeType, 'default'], {}); + var markerStyle = shape.getMarker(markerCfg); + return deepMix({}, shapeStyle, markerStyle); + }, + /** + * 绘制 shape + * @override + * @param shapeType 绘制的 shape 类型 + * @param cfg 绘制 shape 需要的信息 + * @param element Element 实例 + * @returns + */ + drawShape: function (shapeType, cfg, container) { + var shape = this.getShape(shapeType); + return shape.draw(cfg, container); + }, +}; +/** Shape 基类 */ +var ShapeBase$4 = { + /** 坐标系对象 */ + coordinate: null, + /** + * 将归一化的 path 转换成坐标系下的 path + * @param path 归一化的路径 + * @returns + */ + parsePath: function (path) { + var coordinate = this.coordinate; + var parsedPath = parsePathString$1(path); + if (coordinate.isPolar) { + parsedPath = convertPolarPath(coordinate, parsedPath); + } + else { + parsedPath = convertNormalPath(coordinate, parsedPath); + } + return parsedPath; + }, + /** + * 将归一化的坐标转换成画布坐标 + * @param point 归一化的坐标点数据 + * @returns + */ + parsePoint: function (point) { + var coordinate = this.coordinate; + return coordinate.convert(point); + }, + /** + * 0～1 points 转 画布 points + * @param points 节点集合 + * @returns + */ + parsePoints: function (points) { + var coordinate = this.coordinate; + return points.map(function (point) { + return coordinate.convert(point); + }); + }, + /** + * 绘制 shape + * @override + */ + draw: function (cfg, container) { }, +}; +var ShapeFactoryMap = {}; +/** + * 注册 ShapeFactory。 + * @param factoryName ShapeFactory 名称，对应 Geometry 几何标记名称。 + * @param cfg 注册 ShapeFactory 需要覆写定义的属性。 + * @returns 返回 ShapeFactory 对象。 + */ +function registerShapeFactory(factoryName, cfg) { + var className = upperFirst(factoryName); + var geomObj = __assign$r(__assign$r(__assign$r({}, ShapeFactoryBase$1), cfg), { geometryType: factoryName }); + ShapeFactoryMap[className] = geomObj; + return geomObj; +} +/** + * 注册 Shape。 + * @param factoryName 对应的 ShapeFactory 名称。 + * @param shapeType 注册的 shape 名称。 + * @param cfg 注册 Shape 需要覆写定义的属性。 + * @returns shape 返回注册的 shape 对象。 + */ +function registerShape(factoryName, shapeType, cfg) { + var className = upperFirst(factoryName); + var factory = ShapeFactoryMap[className]; + var shapeObj = __assign$r(__assign$r({}, ShapeBase$4), cfg); + factory[shapeType] = shapeObj; + return shapeObj; +} +/** + * 获取 factoryName 对应的 shapeFactory + * @param factoryName + * @returns shape factory + */ +function getShapeFactory(factoryName) { + var className = upperFirst(factoryName); + return ShapeFactoryMap[className]; +} + +/** @ignore */ +function group(data, fields, appendConditions) { + if (appendConditions === void 0) { appendConditions = {}; } + if (!fields) { + return [data]; + } + var groups = groupToMap(data, fields); + var array = []; + if (fields.length === 1 && appendConditions[fields[0]]) { + var values = appendConditions[fields[0]]; + for (var _i = 0, values_1 = values; _i < values_1.length; _i++) { + var value = values_1[_i]; + var arr = groups["_" + value]; + if (arr) { + // 可能存在用户设置 values ，但是数据中没有对应的字段，则这时候 arr 就为 null + array.push(arr); + } + } + } + else { + for (var k in groups) { + if (groups.hasOwnProperty(k)) { + var eachGroup = groups[k]; + array.push(eachGroup); + } + } + } + return array; +} + +/** + * @ignore + * Determines whether model is change + * @param currentModel + * @param preModel + * @returns + */ +function isModelChange(currentModel, preModel) { + return some(['color', 'shape', 'size', 'x', 'y', 'isInCircle', 'data', 'style', 'defaultStyle', 'points', 'mappingData'], function (key) { + return !isEqual$2(currentModel[key], preModel[key]); + }); +} + +/** @ignore */ +function parseFields(field) { + if (isArray$n(field)) { + return field; + } + return field.split('*'); +} + +// 根据 elementId 查找对应的 label，因为有可能一个 element 对应多个 labels，所以在给 labels 打标识时做了处理 +// 打标规则详见 ./label/base.ts#L263 +function filterLabelsById(id, labelsMap) { + var labels = []; + each$2(labelsMap, function (label, labelId) { + var elementId = labelId.split(' ')[0]; + if (elementId === id) { + labels.push(label); + } + }); + return labels; +} +/** + * Geometry 几何标记基类，主要负责数据到图形属性的映射以及绘制逻辑。 + */ +var Geometry$1 = /** @class */ (function (_super) { + __extends$e(Geometry, _super); + /** + * 创建 Geometry 实例。 + * @param cfg + */ + function Geometry(cfg) { + var _this = _super.call(this, cfg) || this; + /** Geometry 几何标记类型。 */ + _this.type = 'base'; + // 内部产生的属性 + /** Attribute map */ + _this.attributes = {}; + /** Element map */ + _this.elements = []; + /** 使用 key-value 结构存储 Element，key 为每个 Element 实例对应的唯一 ID */ + _this.elementsMap = {}; + /** animate 配置项 */ + _this.animateOption = true; + /** 图形属性映射配置 */ + _this.attributeOption = {}; + /** 存储上一次渲染时的 element 映射表，用于更新逻辑 */ + _this.lastElementsMap = {}; + /** 是否生成多个点来绘制图形。 */ + _this.generatePoints = false; + /** 存储发生图形属性映射前的数据 */ + _this.beforeMappingData = null; + _this.adjusts = {}; + _this.idFields = []; + _this.hasSorted = false; + _this.isCoordinateChanged = false; + var container = cfg.container, labelsContainer = cfg.labelsContainer, coordinate = cfg.coordinate, data = cfg.data, _a = cfg.sortable, sortable = _a === void 0 ? false : _a, _b = cfg.visible, visible = _b === void 0 ? true : _b, theme = cfg.theme, _c = cfg.scales, scales = _c === void 0 ? {} : _c, _d = cfg.scaleDefs, scaleDefs = _d === void 0 ? {} : _d, + // 柱状图间隔与宽度相关配置 + intervalPadding = cfg.intervalPadding, dodgePadding = cfg.dodgePadding, maxColumnWidth = cfg.maxColumnWidth, minColumnWidth = cfg.minColumnWidth, columnWidthRatio = cfg.columnWidthRatio, roseWidthRatio = cfg.roseWidthRatio, multiplePieWidthRatio = cfg.multiplePieWidthRatio, zIndexReversed = cfg.zIndexReversed; + _this.container = container; + _this.labelsContainer = labelsContainer; + _this.coordinate = coordinate; + _this.data = data; + _this.sortable = sortable; + _this.visible = visible; + _this.userTheme = theme; + _this.scales = scales; + _this.scaleDefs = scaleDefs; + // 柱状图间隔与宽度相关配置 + _this.intervalPadding = intervalPadding; + _this.dodgePadding = dodgePadding; + _this.maxColumnWidth = maxColumnWidth; + _this.minColumnWidth = minColumnWidth; + _this.columnWidthRatio = columnWidthRatio; + _this.roseWidthRatio = roseWidthRatio; + _this.multiplePieWidthRatio = multiplePieWidthRatio; + _this.zIndexReversed = zIndexReversed; + return _this; + } + /** + * 配置 position 通道映射规则。 + * + * @example + * ```typescript + * // 数据结构: [{ x: 'A', y: 10, color: 'red' }] + * geometry.position('x*y'); + * geometry.position([ 'x', 'y' ]); + * geometry.position({ + * fields: [ 'x', 'y' ], + * }); + * ``` + * + * @param cfg 映射规则 + * @returns + */ + Geometry.prototype.position = function (cfg) { + var positionCfg = cfg; + if (!isPlainObject$3(cfg)) { + // 字符串字段或者数组字段 + positionCfg = { + fields: parseFields(cfg), + }; + } + var fields = get$3(positionCfg, 'fields'); + if (fields.length === 1) { + // 默认填充一维 1*xx + fields.unshift('1'); + set$5(positionCfg, 'fields', fields); + } + set$5(this.attributeOption, 'position', positionCfg); + return this; + }; + Geometry.prototype.color = function (field, cfg) { + this.createAttrOption('color', field, cfg); + return this; + }; + Geometry.prototype.shape = function (field, cfg) { + this.createAttrOption('shape', field, cfg); + return this; + }; + Geometry.prototype.size = function (field, cfg) { + this.createAttrOption('size', field, cfg); + return this; + }; + /** + * 设置数据调整方式。G2 目前内置了四种类型： + * 1. dodge + * 2. stack + * 3. symmetric + * 4. jitter + * + * + * **Tip** + * + 对于 'dodge' 类型，可以额外进行如下属性的配置: + * ```typescript + * geometry.adjust('dodge', { + * marginRatio: 0, // 取 0 到 1 范围的值（相对于每个柱子宽度），用于控制一个分组中柱子之间的间距 + * dodgeBy: 'x', // 该属性只对 'dodge' 类型生效，声明以哪个数据字段为分组依据 + * }); + * ``` + * + * + 对于 'stack' 类型，可以额外进行如下属性的配置: + * ```typescript + * geometry.adjust('stack', { + * reverseOrder: false, // 用于控制是否对数据进行反序操作 + * }); + * ``` + * + * @example + * ```typescript + * geometry.adjust('stack'); + * + * geometry.adjust({ + * type: 'stack', + * reverseOrder: false, + * }); + * + * // 组合使用 adjust + * geometry.adjust([ 'stack', 'dodge' ]); + * + * geometry.adjust([ + * { type: 'stack' }, + * { type: 'dodge', dodgeBy: 'x' }, + * ]); + * ``` + * + * @param adjustCfg 数据调整配置 + * @returns + */ + Geometry.prototype.adjust = function (adjustCfg) { + var adjusts = adjustCfg; + if (isString$3(adjustCfg) || isPlainObject$3(adjustCfg)) { + adjusts = [adjustCfg]; + } + each$2(adjusts, function (adjust, index) { + if (!isObject$f(adjust)) { + adjusts[index] = { type: adjust }; + } + }); + this.adjustOption = adjusts; + return this; + }; + Geometry.prototype.style = function (field, styleFunc) { + if (isString$3(field)) { + var fields = parseFields(field); + this.styleOption = { + fields: fields, + callback: styleFunc, + }; + } + else { + var _a = field, fields = _a.fields, callback = _a.callback, cfg = _a.cfg; + if (fields || callback || cfg) { + this.styleOption = field; + } + else { + this.styleOption = { + cfg: field, + }; + } + } + return this; + }; + Geometry.prototype.tooltip = function (field, cfg) { + if (isString$3(field)) { + var fields = parseFields(field); + this.tooltipOption = { + fields: fields, + callback: cfg, + }; + } + else { + this.tooltipOption = field; + } + return this; + }; + /** + * Geometry 动画配置。 + * + * + `animate(false)` 关闭动画 + * + `animate(true)` 开启动画，默认开启。 + * + * 我们将动画分为四个场景： + * 1. appear: 图表第一次加载时的入场动画； + * 2. enter: 图表绘制完成，发生更新后，产生的新图形的进场动画； + * 3. update: 图表绘制完成，数据发生变更后，有状态变更的图形的更新动画； + * 4. leave: 图表绘制完成，数据发生变更后，被销毁图形的销毁动画。 + * + * @example + * ```typescript + * animate({ + * enter: { + * duration: 1000, // enter 动画执行时间 + * }, + * leave: false, // 关闭 leave 销毁动画 + * }); + * ``` + * + * @param cfg 动画配置 + * @returns + */ + Geometry.prototype.animate = function (cfg) { + this.animateOption = cfg; + return this; + }; + Geometry.prototype.label = function (field, secondParam, thirdParam) { + if (isString$3(field)) { + var labelOption = {}; + var fields = parseFields(field); + labelOption.fields = fields; + if (isFunction$6(secondParam)) { + labelOption.callback = secondParam; + } + else if (isPlainObject$3(secondParam)) { + labelOption.cfg = secondParam; + } + if (thirdParam) { + labelOption.cfg = thirdParam; + } + this.labelOption = labelOption; + } + else { + this.labelOption = field; + } + return this; + }; + /** + * 设置状态对应的样式。 + * + * @example + * ```ts + * chart.interval().state({ + * selected: { + * animate: { duration: 100, easing: 'easeLinear' }, + * style: { + * lineWidth: 2, + * stroke: '#000', + * }, + * }, + * }); + * ``` + * + * 如果图形 shape 是由多个 shape 组成，即为一个 G.Group 对象，那么针对 group 中的每个 shape，我们需要使用下列方式进行状态样式设置： + * 如果我们为 group 中的每个 shape 设置了 'name' 属性(shape.set('name', 'xx'))，则以 'name' 作为 key，否则默认以索引值（即 shape 的 添加顺序）为 key。 + * + * ```ts + * chart.interval().shape('groupShape').state({ + * selected: { + * style: { + * 0: { lineWidth: 2 }, + * 1: { fillOpacity: 1 }, + * } + * } + * }); + * ``` + * + * @param cfg 状态样式 + */ + Geometry.prototype.state = function (cfg) { + this.stateOption = cfg; + return this; + }; + /** + * 用于向 shape 中传入自定义的数据。目前可能仅仅可能用于在自定义 shape 的时候，像自定义 shape 中传入自定义的数据，方便实现自定义 shape 的配置能力。 + * + * @example + * ```ts + * chart.interval().customInfo({ yourData: 'hello, g2!' }); + * ``` + * + * 然后在自定义 shape 的时候，可以拿到这个信息。 + * + * ```ts + * registerShape('interval', 'your-shape', { + * draw(shapeInfo, container) { + * const { customInfo } = shapeInfo; + * console.log(customInfo); // will log { yourData: 'hello, g2!' }. + * } + * }); + * ``` + * + * @param cfg + */ + Geometry.prototype.customInfo = function (cfg) { + this.customOption = cfg; + return this; + }; + /** + * 初始化 Geomtry 实例： + * 创建 [[Attribute]] and [[Scale]] 实例，进行数据处理，包括分组、数值化以及数据调整。 + */ + Geometry.prototype.init = function (cfg) { + if (cfg === void 0) { cfg = {}; } + this.setCfg(cfg); + this.initAttributes(); // 创建图形属性 + // 数据加工：分组 -> 数字化 -> adjust + this.processData(this.data); + // 调整 scale + this.adjustScale(); + }; + /** + * Geometry 更新。 + * @param [cfg] 更新的配置 + */ + Geometry.prototype.update = function (cfg) { + if (cfg === void 0) { cfg = {}; } + var data = cfg.data, isDataChanged = cfg.isDataChanged, isCoordinateChanged = cfg.isCoordinateChanged; + var _a = this, attributeOption = _a.attributeOption, lastAttributeOption = _a.lastAttributeOption; + if (!isEqual$2(attributeOption, lastAttributeOption)) { + // 映射发生改变，则重新创建图形属性 + this.init(cfg); + } + else if (data && (isDataChanged || !isEqual$2(data, this.data))) { + // 数据发生变化 + this.setCfg(cfg); + this.initAttributes(); // 创建图形属性 + this.processData(data); // 数据加工：分组 -> 数字化 -> adjust + } + else { + // 有可能 coordinate 变化 + this.setCfg(cfg); + } + // 调整 scale + this.adjustScale(); + this.isCoordinateChanged = isCoordinateChanged; + }; + /** + * 将原始数据映射至图形空间，同时创建图形对象。 + */ + Geometry.prototype.paint = function (isUpdate) { + var _this = this; + if (isUpdate === void 0) { isUpdate = false; } + if (this.animateOption) { + this.animateOption = deepMix({}, getDefaultAnimateCfg(this.type, this.coordinate), this.animateOption); + } + this.defaultSize = undefined; + this.elements = []; + this.elementsMap = {}; + var offscreenGroup = this.getOffscreenGroup(); + offscreenGroup.clear(); + var beforeMappingData = this.beforeMappingData; + var dataArray = this.beforeMapping(beforeMappingData); + var mappingArray = []; + for (var index = 0, length_1 = dataArray.length; index < length_1; index++) { + var eachGroup = dataArray[index]; + var mappingData = this.mapping(eachGroup); + mappingArray.push(mappingData); + this.createElements(mappingData, index, isUpdate); + } + if (this.canDoGroupAnimation(isUpdate)) { + // 如果用户没有配置 appear.animation，就默认走整体动画 + var container = this.container; + var type = this.type; + var coordinate = this.coordinate; + var animateCfg = get$3(this.animateOption, 'appear'); + var yScale = this.getYScale(); + var yMinPoint = coordinate.convert({ + x: 0, + y: yScale.scale(this.getYMinValue()), + }); + doGroupAppearAnimate(container, animateCfg, type, coordinate, yMinPoint); + } + // 添加 label + if (this.labelOption) { + this.renderLabels(flatten$2(mappingArray), isUpdate); + } + this.dataArray = mappingArray; + // 销毁被删除的 elements + each$2(this.lastElementsMap, function (deletedElement) { + // 更新动画配置，用户有可能在更新之前有对动画进行配置操作 + deletedElement.animate = _this.animateOption; + deletedElement.destroy(); + }); + this.lastElementsMap = this.elementsMap; + // 缓存，用于更新 + this.lastAttributeOption = __assign$r({}, this.attributeOption); + if (this.visible === false) { + // 用户在初始化的时候声明 visible: false + this.changeVisible(false); + } + }; + /** + * 清空当前 Geometry，配置项仍保留，但是内部创建的对象全部清空。 + * @override + */ + Geometry.prototype.clear = function () { + var _a = this, container = _a.container, geometryLabel = _a.geometryLabel, offscreenGroup = _a.offscreenGroup; + if (container) { + container.clear(); + } + if (geometryLabel) { + geometryLabel.clear(); + } + if (offscreenGroup) { + offscreenGroup.clear(); + } + // 属性恢复至出厂状态 + this.scaleDefs = undefined; + this.attributes = {}; + this.scales = {}; + this.elementsMap = {}; + this.lastElementsMap = {}; + this.elements = []; + this.adjusts = {}; + this.dataArray = null; + this.beforeMappingData = null; + this.lastAttributeOption = undefined; + this.defaultSize = undefined; + this.idFields = []; + this.groupScales = undefined; + this.hasSorted = false; + this.isCoordinateChanged = false; + }; + /** + * 销毁 Geometry 实例。 + */ + Geometry.prototype.destroy = function () { + this.clear(); + var container = this.container; + container.remove(true); + if (this.offscreenGroup) { + this.offscreenGroup.remove(true); + this.offscreenGroup = null; + } + if (this.geometryLabel) { + this.geometryLabel.destroy(); + this.geometryLabel = null; + } + this.theme = undefined; + this.shapeFactory = undefined; + _super.prototype.destroy.call(this); + }; + /** + * 获取决定分组的图形属性对应的 scale 实例。 + * @returns + */ + Geometry.prototype.getGroupScales = function () { + return this.groupScales; + }; + /** + * 根据名字获取图形属性实例。 + */ + Geometry.prototype.getAttribute = function (name) { + return this.attributes[name]; + }; + /** 获取 x 轴对应的 scale 实例。 */ + Geometry.prototype.getXScale = function () { + return this.getAttribute('position').scales[0]; + }; + /** 获取 y 轴对应的 scale 实例。 */ + Geometry.prototype.getYScale = function () { + return this.getAttribute('position').scales[1]; + }; + /** + * 获取决定分组的图形属性实例。 + */ + Geometry.prototype.getGroupAttributes = function () { + var rst = []; + each$2(this.attributes, function (attr) { + if (GROUP_ATTRS.includes(attr.type)) { + rst.push(attr); + } + }); + return rst; + }; + /** 获取图形属性默认的映射值。 */ + Geometry.prototype.getDefaultValue = function (attrName) { + var value; + var attr = this.getAttribute(attrName); + if (attr && isEmpty$1(attr.scales)) { + // 获取映射至常量的值 + value = attr.values[0]; + } + return value; + }; + /** + * 获取该数据发生图形映射后对应的 Attribute 图形空间数据。 + * @param attr Attribute 图形属性实例。 + * @param obj 需要进行映射的原始数据。 + * @returns + */ + Geometry.prototype.getAttributeValues = function (attr, obj) { + var params = []; + var scales = attr.scales; + for (var index = 0, length_2 = scales.length; index < length_2; index++) { + var scale = scales[index]; + var field = scale.field; + if (scale.isIdentity) { + params.push(scale.values); + } + else { + params.push(obj[field]); + } + } + return attr.mapping.apply(attr, params); + }; + Geometry.prototype.getAdjust = function (adjustType) { + return this.adjusts[adjustType]; + }; + /** + * 获取 shape 对应的 marker 样式。 + * @param shapeName shape 具体名字 + * @param cfg marker 信息 + * @returns + */ + Geometry.prototype.getShapeMarker = function (shapeName, cfg) { + var shapeFactory = this.getShapeFactory(); + return shapeFactory.getMarker(shapeName, cfg); + }; + /** + * 根据一定的规则查找 Geometry 的 Elements。 + * + * ```typescript + * getElementsBy((element) => { + * const data = element.getData(); + * + * return data.a === 'a'; + * }); + * ``` + * + * @param condition 定义查找规则的回调函数。 + * @returns + */ + Geometry.prototype.getElementsBy = function (condition) { + return this.elements.filter(function (element) { + return condition(element); + }); + }; + /** + * 获取数据对应的唯一 id。 + * @param data Element 对应的绘制数据 + * @returns + */ + Geometry.prototype.getElementId = function (data) { + data = isArray$n(data) ? data[0] : data; + var originData = data[FIELD_ORIGIN]; + // 如果用户声明了使用哪些字段作为 id 值 + if (this.idFields.length) { + var elementId = originData[this.idFields[0]]; + for (var index = 1; index < this.idFields.length; index++) { + elementId += '-' + originData[this.idFields[index]]; + } + return elementId; + } + var type = this.type; + var xScale = this.getXScale(); + var yScale = this.getYScale(); + var xField = xScale.field || 'x'; + var yField = yScale.field || 'y'; + var yVal = originData[yField]; + var xVal; + if (xScale.type === 'identity') { + xVal = xScale.values[0]; + } + else { + xVal = originData[xField]; + } + var id; + if (type === 'interval' || type === 'schema') { + id = "" + xVal; + } + else if (type === 'line' || type === 'area' || type === 'path') { + id = type; + } + else { + id = xVal + "-" + yVal; + } + var groupScales = this.groupScales; + if (isEmpty$1(groupScales)) { + groupScales = get$3(this.getAttribute('color'), 'scales', []); + } + for (var index = 0, length_3 = groupScales.length; index < length_3; index++) { + var groupScale = groupScales[index]; + var field = groupScale.field; + id = id + "-" + originData[field]; + } + // 用户在进行 dodge 类型的 adjust 调整的时候设置了 dodgeBy 属性 + var dodgeAdjust = this.getAdjust('dodge'); + if (dodgeAdjust) { + var dodgeBy = dodgeAdjust.dodgeBy; + if (dodgeBy) { + id = id + "-" + originData[dodgeBy]; + } + } + if (this.getAdjust('jitter')) { + id = id + "-" + data.x + "-" + data.y; + } + return id; + }; + /** + * 获取所有需要创建 scale 的字段名称。 + */ + Geometry.prototype.getScaleFields = function () { + var fields = []; + var tmpMap = {}; + var _a = this, attributeOption = _a.attributeOption, labelOption = _a.labelOption, tooltipOption = _a.tooltipOption; + // 获取图形属性上的 fields + for (var attributeType in attributeOption) { + if (attributeOption.hasOwnProperty(attributeType)) { + var eachOpt = attributeOption[attributeType]; + if (eachOpt.fields) { + uniq$2(eachOpt.fields, fields, tmpMap); + } + else if (eachOpt.values) { + // 考虑 size(10), shape('circle') 等场景 + uniq$2(eachOpt.values, fields, tmpMap); + } + } + } + // 获取 label 上的字段 + if (labelOption && labelOption.fields) { + uniq$2(labelOption.fields, fields, tmpMap); + } + // 获取 tooltip 上的字段 + if (isObject$f(tooltipOption) && tooltipOption.fields) { + uniq$2(tooltipOption.fields, fields, tmpMap); + } + return fields; + }; + /** + * 显示或者隐藏 geometry。 + * @param visible + */ + Geometry.prototype.changeVisible = function (visible) { + _super.prototype.changeVisible.call(this, visible); + var elements = this.elements; + for (var index = 0, length_4 = elements.length; index < length_4; index++) { + var element = elements[index]; + element.changeVisible(visible); + } + if (visible) { + if (this.container) { + this.container.show(); + } + if (this.labelsContainer) { + this.labelsContainer.show(); + } + } + else { + if (this.container) { + this.container.hide(); + } + if (this.labelsContainer) { + this.labelsContainer.hide(); + } + } + }; + /** + * 获取当前配置中的所有分组 & 分类的字段。 + * @return fields string[] + */ + Geometry.prototype.getGroupFields = function () { + var groupFields = []; + var tmpMap = {}; // 用于去重过滤 + for (var index = 0, length_5 = GROUP_ATTRS.length; index < length_5; index++) { + var attributeName = GROUP_ATTRS[index]; + var cfg = this.attributeOption[attributeName]; + if (cfg && cfg.fields) { + uniq$2(cfg.fields, groupFields, tmpMap); + } + } + return groupFields; + }; + /** + * 获得图形的 x y 字段。 + */ + Geometry.prototype.getXYFields = function () { + var _a = this.attributeOption.position.fields, x = _a[0], y = _a[1]; + return [x, y]; + }; + /** + * 获取该 Geometry 下所有生成的 shapes。 + * @returns shapes + */ + Geometry.prototype.getShapes = function () { + return this.elements.map(function (element) { return element.shape; }); + }; + /** + * 获取虚拟 Group。 + * @returns + */ + Geometry.prototype.getOffscreenGroup = function () { + if (!this.offscreenGroup) { + var GroupCtor = this.container.getGroupBase(); // 获取分组的构造函数 + this.offscreenGroup = new GroupCtor({}); + } + return this.offscreenGroup; + }; + // 对数据进行排序 + Geometry.prototype.sort = function (mappingArray) { + if (!this.hasSorted) { + // 未发生过排序 + var xScale_1 = this.getXScale(); + var xField_1 = xScale_1.field; + for (var index = 0; index < mappingArray.length; index++) { + var itemArr = mappingArray[index]; + itemArr.sort(function (obj1, obj2) { + return xScale_1.translate(obj1[FIELD_ORIGIN][xField_1]) - xScale_1.translate(obj2[FIELD_ORIGIN][xField_1]); + }); + } + } + this.hasSorted = true; + }; + /** + * 调整度量范围。主要针对发生层叠以及一些特殊需求的 Geometry，比如 Interval 下的柱状图 Y 轴默认从 0 开始。 + */ + Geometry.prototype.adjustScale = function () { + var yScale = this.getYScale(); + // 如果数据发生过 stack adjust，需要调整下 yScale 的数据范围 + if (yScale && this.getAdjust('stack')) { + this.updateStackRange(yScale, this.beforeMappingData); + } + }; + /** + * 获取当前 Geometry 对应的 Shape 工厂实例。 + */ + Geometry.prototype.getShapeFactory = function () { + var shapeType = this.shapeType; + if (!getShapeFactory(shapeType)) { + return; + } + if (!this.shapeFactory) { + this.shapeFactory = clone$7(getShapeFactory(shapeType)); // 防止多个 view 共享一个 shapeFactory 实例，导致 coordinate 被篡改 + } + // 因为这里缓存了 shapeFactory，但是外部可能会变更 coordinate，导致无法重新设置到 shapeFactory 中 + this.shapeFactory.coordinate = this.coordinate; + // theme 原因同上 + this.shapeFactory.theme = this.theme.geometries[shapeType] || {}; + return this.shapeFactory; + }; + /** + * 获取每个 Shape 对应的关键点数据。 + * @param obj 经过分组 -> 数字化 -> adjust 调整后的数据记录 + * @returns + */ + Geometry.prototype.createShapePointsCfg = function (obj) { + var xScale = this.getXScale(); + var yScale = this.getYScale(); + var x = this.normalizeValues(obj[xScale.field], xScale); + var y; // 存在没有 y 的情况 + if (yScale) { + y = this.normalizeValues(obj[yScale.field], yScale); + } + else { + y = obj.y ? obj.y : 0.1; + } + return { + x: x, + y: y, + y0: yScale ? yScale.scale(this.getYMinValue()) : undefined, + }; + }; + /** + * 创建 Element 实例。 + * @param mappingDatum Element 对应的绘制数据 + * @param [isUpdate] 是否处于更新阶段 + * @returns element 返回创建的 Element 实例 + */ + Geometry.prototype.createElement = function (mappingDatum, isUpdate) { + if (isUpdate === void 0) { isUpdate = false; } + var container = this.container; + var shapeCfg = this.getDrawCfg(mappingDatum); // 获取绘制图形的配置信息 + var shapeFactory = this.getShapeFactory(); + var element = new Element$2({ + shapeFactory: shapeFactory, + container: container, + offscreenGroup: this.getOffscreenGroup(), + }); + element.animate = this.animateOption; + element.geometry = this; + element.draw(shapeCfg, isUpdate); // 绘制 + return element; + }; + /** + * 获取每条数据对应的图形绘制数据。 + * @param mappingDatum 映射后的数据 + * @returns draw cfg + */ + Geometry.prototype.getDrawCfg = function (mappingDatum) { + var originData = mappingDatum[FIELD_ORIGIN]; // 原始数据 + var cfg = { + mappingData: mappingDatum, + data: originData, + x: mappingDatum.x, + y: mappingDatum.y, + color: mappingDatum.color, + size: mappingDatum.size, + isInCircle: this.coordinate.isPolar, + customInfo: this.customOption, + }; + var shapeName = mappingDatum.shape; + if (!shapeName && this.getShapeFactory()) { + shapeName = this.getShapeFactory().defaultShapeType; + } + cfg.shape = shapeName; + // 获取默认样式 + var theme = this.theme.geometries[this.shapeType]; + cfg.defaultStyle = get$3(theme, [shapeName, 'default'], {}).style; + if (!cfg.defaultStyle && this.getShapeFactory()) { + cfg.defaultStyle = this.getShapeFactory().getDefaultStyle(theme); + } + var styleOption = this.styleOption; + if (styleOption) { + cfg.style = this.getStyleCfg(styleOption, originData); + } + if (this.generatePoints) { + cfg.points = mappingDatum.points; + cfg.nextPoints = mappingDatum.nextPoints; + } + return cfg; + }; + /** + * 创建所有的 Elements。 + * @param mappingData + * @param [isUpdate] + * @returns elements + */ + Geometry.prototype.createElements = function (mappingData, index, isUpdate) { + if (isUpdate === void 0) { isUpdate = false; } + var _a = this, lastElementsMap = _a.lastElementsMap, elementsMap = _a.elementsMap, elements = _a.elements; + for (var subIndex = 0, length_6 = mappingData.length; subIndex < length_6; subIndex++) { + var mappingDatum = mappingData[subIndex]; + var id = this.getElementId(mappingDatum); + if (elementsMap[id]) { + // 存在重复数据，则根据再根据 index 进行区分 + id = id + "-" + index + "-" + subIndex; + } + var result = lastElementsMap[id]; + if (!result) { + // 创建新的 element + result = this.createElement(mappingDatum, isUpdate); + } + else { + // element 已经创建 + var currentShapeCfg = this.getDrawCfg(mappingDatum); + var preShapeCfg = result.getModel(); + if (this.isCoordinateChanged || isModelChange(currentShapeCfg, preShapeCfg)) { + result.animate = this.animateOption; + // 通过绘制数据的变更来判断是否需要更新，因为用户有可能会修改图形属性映射 + result.update(currentShapeCfg); // 更新对应的 element + } + delete lastElementsMap[id]; + } + elements.push(result); + elementsMap[id] = result; + } + // 对 elements 的 zIndex 进行反序 + if (this.zIndexReversed) { + var length_7 = elements.length; + elements.forEach(function (ele, idx) { + ele.shape.setZIndex(length_7 - idx); + }); + } + return elements; + }; + /** + * 获取渲染的 label 类型。 + */ + Geometry.prototype.getLabelType = function () { + var _a = this, labelOption = _a.labelOption, coordinate = _a.coordinate, type = _a.type; + var coordinateType = coordinate.type, isTransposed = coordinate.isTransposed; + var labelType = get$3(labelOption, ['cfg', 'type']); + if (!labelType) { + // 用户未定义，则进行默认的逻辑 + if (coordinateType === 'polar') { + // 极坐标下使用通用的极坐标文本，转置则使用饼图 + labelType = isTransposed ? 'pie' : 'polar'; + } + else if (coordinateType === 'theta') { + // theta 坐标系下使用饼图文本 + labelType = 'pie'; + } + else if (type === 'interval' || type === 'polygon') { + labelType = 'interval'; + } + else { + labelType = 'base'; + } + } + return labelType; + }; + /** + * 获取 Y 轴上的最小值。 + */ + Geometry.prototype.getYMinValue = function () { + var yScale = this.getYScale(); + var min = yScale.min, max = yScale.max; + var value; + if (min >= 0) { + value = min; + } + else if (max <= 0) { + // 当值全位于负区间时，需要保证 ymin 在区域内，不可为 0 + value = max; + } + else { + value = 0; + } + return value; + }; + // 创建图形属性相关的配置项 + Geometry.prototype.createAttrOption = function (attrName, field, cfg) { + if (isNil(field) || isObject$f(field)) { + if (isObject$f(field) && isEqual$2(Object.keys(field), ['values'])) { + // shape({ values: [ 'funnel' ] }) + set$5(this.attributeOption, attrName, { + fields: field.values, + }); + } + else { + set$5(this.attributeOption, attrName, field); + } + } + else { + var attrCfg = {}; + if (isNumber$4(field)) { + // size(3) + attrCfg.values = [field]; + } + else { + attrCfg.fields = parseFields(field); + } + if (cfg) { + if (isFunction$6(cfg)) { + attrCfg.callback = cfg; + } + else { + attrCfg.values = cfg; + } + } + set$5(this.attributeOption, attrName, attrCfg); + } + }; + Geometry.prototype.initAttributes = function () { + var _this = this; + var _a = this, attributes = _a.attributes, attributeOption = _a.attributeOption, theme = _a.theme, shapeType = _a.shapeType; + this.groupScales = []; + var tmpMap = {}; + var _loop_1 = function (attrType) { + if (attributeOption.hasOwnProperty(attrType)) { + var option = attributeOption[attrType]; + if (!option) { + return { value: void 0 }; + } + var attrCfg = __assign$r({}, option); + var callback = attrCfg.callback, values = attrCfg.values, _a = attrCfg.fields, fields = _a === void 0 ? [] : _a; + // 获取每一个字段对应的 scale + var scales = fields.map(function (field) { + var scale = _this.scales[field]; + if (scale.isCategory && !tmpMap[field] && GROUP_ATTRS.includes(attrType)) { + _this.groupScales.push(scale); + tmpMap[field] = true; + } + return scale; + }); + attrCfg.scales = scales; + if (attrType !== 'position' && scales.length === 1 && scales[0].type === 'identity') { + // 用户在图形通道上声明了常量字段 color('red'), size(5) + attrCfg.values = scales[0].values; + } + else if (!callback && !values) { + // 用户没有指定任何规则，则使用默认的映射规则 + if (attrType === 'size') { + attrCfg.values = theme.sizes; + } + else if (attrType === 'shape') { + attrCfg.values = theme.shapes[shapeType] || []; + } + else if (attrType === 'color') { + if (scales.length) { + // 根据数值个数使用对应的色板 + attrCfg.values = scales[0].values.length <= 10 ? theme.colors10 : theme.colors20; + } + else { + attrCfg.values = theme.colors10; + } + } + } + var AttributeCtor = getAttribute(attrType); + attributes[attrType] = new AttributeCtor(attrCfg); + } + }; + // 遍历每一个 attrOption，各自创建 Attribute 实例 + for (var attrType in attributeOption) { + var state_1 = _loop_1(attrType); + if (typeof state_1 === "object") + return state_1.value; + } + }; + // 处理数据：分组 -> 数字化 -> adjust 调整 + Geometry.prototype.processData = function (data) { + this.hasSorted = false; + var scales = this.getAttribute('position').scales; + var categoryScales = scales.filter(function (scale) { return scale.isCategory; }); + var groupedArray = this.groupData(data); // 数据分组 + var beforeAdjust = []; + for (var i = 0, len = groupedArray.length; i < len; i++) { + var subData = groupedArray[i]; + var arr = []; + for (var j = 0, subLen = subData.length; j < subLen; j++) { + var originData = subData[j]; + var item = {}; + // tslint:disable-next-line: forin + for (var k in originData) { + item[k] = originData[k]; + } + item[FIELD_ORIGIN] = originData; + // 将分类数据翻译成数据, 仅对位置相关的度量进行数字化处理 + for (var _i = 0, categoryScales_1 = categoryScales; _i < categoryScales_1.length; _i++) { + var scale = categoryScales_1[_i]; + var field = scale.field; + item[field] = scale.translate(item[field]); + } + arr.push(item); + } + beforeAdjust.push(arr); + } + var dataArray = this.adjustData(beforeAdjust); // 进行 adjust 数据调整 + this.beforeMappingData = dataArray; + return dataArray; + }; + // 调整数据 + Geometry.prototype.adjustData = function (dataArray) { + var adjustOption = this.adjustOption; + var _a = this, intervalPadding = _a.intervalPadding, dodgePadding = _a.dodgePadding, theme = _a.theme; + // 兼容theme配置 + var maxColumnWidth = this.maxColumnWidth || theme.maxColumnWidth; + var minColumnWidth = this.minColumnWidth || theme.minColumnWidth; + var columnWidthRatio = this.columnWidthRatio || theme.columnWidthRatio; + var result = dataArray; + if (adjustOption) { + var xScale = this.getXScale(); + var yScale = this.getYScale(); + var xField = xScale.field; + var yField = yScale ? yScale.field : null; + var xDimensionLength = getXDimensionLength(this.coordinate); + var groupNum = xScale.values.length; + // 传入size计算相关参数，默认宽度、最大最小宽度约束 + var sizeAttr = this.getAttribute('size'); + var defaultSize = void 0; + if (sizeAttr) { + defaultSize = sizeAttr.values[0]; + } + for (var i = 0, len = adjustOption.length; i < len; i++) { + var adjust = adjustOption[i]; + var adjustCfg = __assign$r({ xField: xField, + yField: yField, + intervalPadding: intervalPadding, + dodgePadding: dodgePadding, + xDimensionLength: xDimensionLength, + groupNum: groupNum, + defaultSize: defaultSize, + maxColumnWidth: maxColumnWidth, + minColumnWidth: minColumnWidth, + columnWidthRatio: columnWidthRatio }, adjust); + var type = adjust.type; + if (type === 'dodge') { + var adjustNames = []; + if (xScale.isCategory || xScale.type === 'identity') { + adjustNames.push('x'); + } + else if (!yScale) { + adjustNames.push('y'); + } + else { + throw new Error('dodge is not support linear attribute, please use category attribute!'); + } + adjustCfg.adjustNames = adjustNames; + // 每个分组内每条柱子的宽度占比，用户不可指定，用户需要通过 columnWidthRatio 指定 + // 兼容theme配置 + adjustCfg.dodgeRatio = columnWidthRatio; + } + else if (type === 'stack') { + var coordinate = this.coordinate; + if (!yScale) { + // 一维的情况下获取高度和默认size + adjustCfg.height = coordinate.getHeight(); + var size = this.getDefaultValue('size') || 3; + adjustCfg.size = size; + } + // 不进行 transpose 时，用户又没有设置这个参数时，默认从上向下 + if (!coordinate.isTransposed && isNil(adjustCfg.reverseOrder)) { + adjustCfg.reverseOrder = true; + } + } + var adjustCtor = getAdjust(type); + var adjustInstance = new adjustCtor(adjustCfg); + result = adjustInstance.process(result); + this.adjusts[type] = adjustInstance; + } + } + return result; + }; + // 对数据进行分组 + Geometry.prototype.groupData = function (data) { + var groupScales = this.getGroupScales(); + var scaleDefs = this.scaleDefs; + var appendConditions = {}; + var groupFields = []; + for (var index = 0; index < groupScales.length; index++) { + var scale = groupScales[index]; + var field = scale.field; + groupFields.push(field); + if (get$3(scaleDefs, [field, 'values'])) { + // 用户通过 view.scale() 接口指定了 values 属性 + appendConditions[field] = scaleDefs[field].values; + } + } + return group(data, groupFields, appendConditions); + }; + // 更新发生层叠后的数据对应的度量范围 + Geometry.prototype.updateStackRange = function (scale, dataArray) { + var mergeArray = flatten$2(dataArray); + var field = scale.field; + var min = scale.min; + var max = scale.max; + for (var index = 0; index < mergeArray.length; index++) { + var obj = mergeArray[index]; + var tmpMin = Math.min.apply(null, obj[field]); + var tmpMax = Math.max.apply(null, obj[field]); + if (tmpMin < min) { + min = tmpMin; + } + if (tmpMax > max) { + max = tmpMax; + } + } + var scaleDefs = this.scaleDefs; + var cfg = {}; + if (min < scale.min && !get$3(scaleDefs, [field, 'min'])) { + // 用户如果在列定义中定义了 min，则以用户定义的为准 + cfg.min = min; + } + if (max > scale.max && !get$3(scaleDefs, [field, 'max'])) { + // 用户如果在列定义中定义了 max + cfg.max = max; + } + scale.change(cfg); + }; + // 将数据映射至图形空间前的操作：排序以及关键点的生成 + Geometry.prototype.beforeMapping = function (beforeMappingData) { + // 当初加 clone 是因为 points 的引用关系，导致更新失败，可是现在貌似复现不出来了，所以暂时不进行 clone + // const source = clone(beforeMappingData); + var source = beforeMappingData; + if (this.sortable) { + this.sort(source); + } + if (this.generatePoints) { + // 需要生成关键点 + for (var index = 0, length_8 = source.length; index < length_8; index++) { + var currentData = source[index]; + this.generateShapePoints(currentData); + var nextData = source[index + 1]; + if (nextData) { + this.generateShapePoints(nextData); + currentData[0].nextPoints = nextData[0].points; + } + } + } + return source; + }; + // 生成 shape 的关键点 + Geometry.prototype.generateShapePoints = function (data) { + var shapeFactory = this.getShapeFactory(); + var shapeAttr = this.getAttribute('shape'); + for (var index = 0; index < data.length; index++) { + var obj = data[index]; + var cfg = this.createShapePointsCfg(obj); + var shape = shapeAttr ? this.getAttributeValues(shapeAttr, obj) : null; + var points = shapeFactory.getShapePoints(shape, cfg); + obj.points = points; + } + }; + // 将数据归一化 + Geometry.prototype.normalizeValues = function (values, scale) { + var rst = []; + if (isArray$n(values)) { + for (var index = 0; index < values.length; index++) { + var value = values[index]; + rst.push(scale.scale(value)); + } + } + else { + rst = scale.scale(values); + } + return rst; + }; + // 将数据映射至图形空间 + Geometry.prototype.mapping = function (data) { + var attributes = this.attributes; + var mappingData = []; + for (var index = 0; index < data.length; index++) { + var record = data[index]; + var newRecord = { + _origin: record[FIELD_ORIGIN], + points: record.points, + nextPoints: record.nextPoints, + }; + for (var k in attributes) { + if (attributes.hasOwnProperty(k)) { + var attr = attributes[k]; + var names = attr.names; + var values = this.getAttributeValues(attr, record); + if (names.length > 1) { + // position 之类的生成多个字段的属性 + for (var j = 0; j < values.length; j += 1) { + var val = values[j]; + var name_1 = names[j]; + newRecord[name_1] = isArray$n(val) && val.length === 1 ? val[0] : val; // 只有一个值时返回第一个属性值 + } + } + else { + // values.length === 1 的判断是以下情况，获取用户设置的图形属性值 + // shape('a', ['dot', 'dash']), color('a', ['red', 'yellow']) + newRecord[names[0]] = values.length === 1 ? values[0] : values; + } + } + } + this.convertPoint(newRecord); // 将 x、y 转换成画布坐标 + mappingData.push(newRecord); + } + return mappingData; + }; + // 将归一化的坐标值转换成画布坐标 + Geometry.prototype.convertPoint = function (mappingRecord) { + var x = mappingRecord.x, y = mappingRecord.y; + var rstX; + var rstY; + var obj; + var coordinate = this.coordinate; + if (isArray$n(x) && isArray$n(y)) { + rstX = []; + rstY = []; + for (var i = 0, j = 0, xLen = x.length, yLen = y.length; i < xLen && j < yLen; i += 1, j += 1) { + obj = coordinate.convert({ + x: x[i], + y: y[j], + }); + rstX.push(obj.x); + rstY.push(obj.y); + } + } + else if (isArray$n(y)) { + rstY = []; + for (var index = 0; index < y.length; index++) { + var yVal = y[index]; + obj = coordinate.convert({ + x: x, + y: yVal, + }); + if (rstX && rstX !== obj.x) { + if (!isArray$n(rstX)) { + rstX = [rstX]; + } + rstX.push(obj.x); + } + else { + rstX = obj.x; + } + rstY.push(obj.y); + } + } + else if (isArray$n(x)) { + rstX = []; + for (var index = 0; index < x.length; index++) { + var xVal = x[index]; + obj = coordinate.convert({ + x: xVal, + y: y, + }); + if (rstY && rstY !== obj.y) { + if (!isArray$n(rstY)) { + rstY = [rstY]; + } + rstY.push(obj.y); + } + else { + rstY = obj.y; + } + rstX.push(obj.x); + } + } + else { + var point = coordinate.convert({ + x: x, + y: y, + }); + rstX = point.x; + rstY = point.y; + } + mappingRecord.x = rstX; + mappingRecord.y = rstY; + }; + // 获取 style 配置 + Geometry.prototype.getStyleCfg = function (styleOption, originData) { + var _a = styleOption.fields, fields = _a === void 0 ? [] : _a, callback = styleOption.callback, cfg = styleOption.cfg; + if (cfg) { + // 用户直接配置样式属性 + return cfg; + } + var params = fields.map(function (field) { + return originData[field]; + }); + return callback.apply(void 0, params); + }; + Geometry.prototype.setCfg = function (cfg) { + var _this = this; + var coordinate = cfg.coordinate, data = cfg.data, theme = cfg.theme, scaleDefs = cfg.scaleDefs; + if (coordinate) { + this.coordinate = coordinate; + } + if (data) { + this.data = data; + } + if (scaleDefs) { + this.scaleDefs = scaleDefs; + this.idFields = []; + each$2(scaleDefs, function (scaleDef, field) { + if (scaleDef && scaleDef.key) { + _this.idFields.push(field); + } + }); + } + if (theme) { + this.theme = this.userTheme ? deepMix({}, theme, this.userTheme) : theme; // 支持 geometry 层级的主题设置 + } + }; + Geometry.prototype.renderLabels = function (mappingArray, isUpdate) { + if (isUpdate === void 0) { isUpdate = false; } + var geometryLabel = this.geometryLabel; + if (!geometryLabel) { + // 初次创建 + var labelType = this.getLabelType(); + var GeometryLabelsCtor = getGeometryLabel(labelType); + geometryLabel = new GeometryLabelsCtor(this); + this.geometryLabel = geometryLabel; + } + geometryLabel.render(mappingArray, isUpdate); + // 将 label 同 element 进行关联 + var labelsMap = geometryLabel.labelsRenderer.shapesMap; + each$2(this.elementsMap, function (element, id) { + var labels = filterLabelsById(id, labelsMap); // element 实例同 label 进行绑定 + if (labels.length) { + element.labelShape = labels; + for (var i = 0; i < labels.length; i++) { + var label = labels[i]; + var labelChildren = label.getChildren(); + for (var j = 0; j < labelChildren.length; j++) { + var child = labelChildren[j]; + child.cfg.name = ['element', 'label']; + child.cfg.element = element; + } + } + } + }); + }; + /** + * 是否需要进行群组入场动画 + * 规则： + * 1. 如果发生更新，则不进行 + * 2. 如果用户关闭 geometry 动画，则不进行 + * 3. 如果用户关闭了 appear 动画，则不进行 + * 4. 如果用户配置了 appear.animation，则不进行 + */ + Geometry.prototype.canDoGroupAnimation = function (isUpdate) { + return (!isUpdate && + this.animateOption && + (get$3(this.animateOption, 'appear') === undefined || + (get$3(this.animateOption, 'appear') && get$3(this.animateOption, ['appear', 'animation']) === undefined))); + }; + return Geometry; +}(Base$4)); +var Geometry$2 = Geometry$1; + +var transform$f = transform$i; +/** + * 对元素进行平移操作。 + * @param element 进行变换的元素 + * @param x x 方向位移 + * @param y y 方向位移 + */ +function translate$1(element, x, y) { + var matrix = transform$f(element.getMatrix(), [['t', x, y]]); + element.setMatrix(matrix); +} +/** + * 获取元素旋转矩阵 (以元素的左上角为旋转点) + * @param element 进行变换的元素 + * @param rotateRadian 旋转弧度 + */ +function getRotateMatrix(element, rotateRadian) { + var _a = element.attr(), x = _a.x, y = _a.y; + var matrix = transform$f(element.getMatrix(), [ + ['t', -x, -y], + ['r', rotateRadian], + ['t', x, y], + ]); + return matrix; +} +/** + * 对元素进行旋转操作。 + * @param element 进行变换的元素 + * @param rotateRadian 旋转弧度 + */ +function rotate$2(element, rotateRadian) { + var matrix = getRotateMatrix(element, rotateRadian); + element.setMatrix(matrix); +} +/** + * 围绕图形中心点进行缩放 + * @param element 进行缩放的图形元素 + * @param ratio 缩放比例 + */ +function zoom(element, ratio) { + var bbox = element.getBBox(); + var x = (bbox.minX + bbox.maxX) / 2; + var y = (bbox.minY + bbox.maxY) / 2; + element.applyToMatrix([x, y, 1]); + var matrix = transform$f(element.getMatrix(), [ + ['t', -x, -y], + ['s', ratio, ratio], + ['t', x, y], + ]); + element.setMatrix(matrix); +} + +/** + * @file utils of label + */ +/** + * 查找 Label Group 中的文本 shape 对象 + * @param label + */ +function findLabelTextShape(label) { + return label.find(function (el) { return el.get('type') === 'text'; }); +} +/** + * 获取标签背景信息: box (无旋转) + rotation (旋转角度) + */ +function getlLabelBackgroundInfo(labelGroup, labelItem, padding) { + if (padding === void 0) { padding = [0, 0, 0, 0]; } + var content = labelGroup.getChildren()[0]; + if (content) { + var labelShape = content.clone(); + // revert rotate + if (labelItem === null || labelItem === void 0 ? void 0 : labelItem.rotate) { + rotate$2(labelShape, -labelItem.rotate); + } + // use `getCanvasBBox`, because if Shape is been translated, `getBBox` is not the actual box position + var _a = labelShape.getCanvasBBox(), x = _a.x, y = _a.y, width = _a.width, height = _a.height; + labelShape.destroy(); + var boxPadding = padding; + if (isNil(boxPadding)) { + boxPadding = [2, 2, 2, 2]; + } + else if (isNumber$4(boxPadding)) { + boxPadding = new Array(4).fill(boxPadding); + } + return { + x: x - boxPadding[3], + y: y - boxPadding[0], + width: width + boxPadding[1] + boxPadding[3], + height: height + boxPadding[0] + boxPadding[2], + rotation: (labelItem === null || labelItem === void 0 ? void 0 : labelItem.rotate) || 0, + }; + } +} +/** + * 计算两个矩形之间的堆叠区域面积 + */ +function getOverlapArea$2(a, b, margin) { + if (margin === void 0) { margin = 0; } + var xOverlap = Math.max(0, Math.min(a.x + a.width + margin, b.x + b.width + margin) - Math.max(a.x - margin, b.x - margin)); + var yOverlap = Math.max(0, Math.min(a.y + a.height + margin, b.y + b.height + margin) - Math.max(a.y - margin, b.y - margin)); + return xOverlap * yOverlap; +} +/** 检测是否和已布局的堆叠 */ +function checkShapeOverlap$2(cur, dones) { + var box = cur.getBBox(); + return some(dones, function (done) { + var target = done.getBBox(); + return getOverlapArea$2(box, target, 2) > 0; + }); +} + +/** + * @desc 更新 label (目前没有根据 id 索引，还是会存在一点小问题的，只能根据 idx 索引) + * @done shape 属性更新 + * @done shape delete + * @done shape append + * + * @param fromShape old labelShape + * @param toShape new labelShape + * @param cfg + */ +function updateLabel(fromShape, toShape, cfg) { + var data = cfg.data, origin = cfg.origin, animateCfg = cfg.animateCfg, coordinate = cfg.coordinate; + var updateAnimateCfg = get$3(animateCfg, 'update'); + fromShape.set('data', data); + fromShape.set('origin', origin); + fromShape.set('animateCfg', animateCfg); + fromShape.set('coordinate', coordinate); + fromShape.set('visible', toShape.get('visible')); + fromShape.getChildren().forEach(function (fromChild, idx) { + var toChild = toShape.getChildByIndex(idx); + if (!toChild) { + fromShape.removeChild(fromChild); + fromChild.remove(true); + } + else { + fromChild.set('data', data); + fromChild.set('origin', origin); + fromChild.set('animateCfg', animateCfg); + fromChild.set('coordinate', coordinate); + var newAttrs = getReplaceAttrs(fromChild, toChild); + if (updateAnimateCfg) { + doAnimate(fromChild, updateAnimateCfg, { + toAttrs: newAttrs, + coordinate: coordinate, + }); + } + else { + fromChild.attr(newAttrs); + } + if (toChild.isGroup()) { + updateLabel(fromChild, toChild, cfg); + } + } + }); + // append + each$2(toShape.getChildren(), function (child, idx) { + if (idx >= fromShape.getCount()) { + if (!child.destroyed) { + fromShape.add(child); + } + } + }); +} + +/** + * Geometry labels 渲染组件 + */ +var Labels = /** @class */ (function () { + function Labels(cfg) { + /** 存储当前 shape 的映射表，键值为 shape id */ + this.shapesMap = {}; + this.lastShapesMap = {}; + var layout = cfg.layout, container = cfg.container; + this.layout = layout; + this.container = container; + } + /** + * 渲染文本 + */ + Labels.prototype.render = function (items, shapes, isUpdate) { + var _this = this; + if (isUpdate === void 0) { isUpdate = false; } + this.shapesMap = {}; + var container = this.container; + var offscreenGroup = this.createOffscreenGroup(); // 创建虚拟分组 + if (items.length) { + // 如果 items 空的话就不进行绘制调整操作 + // step 1: 在虚拟 group 中创建 shapes + for (var _i = 0, items_1 = items; _i < items_1.length; _i++) { + var item = items_1[_i]; + if (item) { + this.renderLabel(item, offscreenGroup); + } + } + // step 2: 根据布局，调整 labels + this.doLayout(items, shapes); + // step 3.1: 绘制 labelLine + this.renderLabelLine(items); + // step 3.2: 绘制 labelBackground + this.renderLabelBackground(items); + // step 4: 根据用户设置的偏移量调整 label + this.adjustLabel(items); + } + // 进行添加、更新、销毁操作 + var lastShapesMap = this.lastShapesMap; + var shapesMap = this.shapesMap; + each$2(shapesMap, function (shape, id) { + if (shape.destroyed) { + // label 在布局调整环节被删除了（doLayout） + delete shapesMap[id]; + } + else { + if (lastShapesMap[id]) { + // 图形发生更新 + var data = shape.get('data'); + var origin_1 = shape.get('origin'); + var coordinate = shape.get('coordinate'); + var currentAnimateCfg = shape.get('animateCfg'); + var currentShape = lastShapesMap[id]; // 已经在渲染树上的 shape + updateLabel(currentShape, shapesMap[id], { + data: data, + origin: origin_1, + animateCfg: currentAnimateCfg, + coordinate: coordinate, + }); + _this.shapesMap[id] = currentShape; // 保存引用 + } + else { + // 新生成的 shape + container.add(shape); + var animateCfg = get$3(shape.get('animateCfg'), isUpdate ? 'enter' : 'appear'); + if (animateCfg) { + doAnimate(shape, animateCfg, { + toAttrs: __assign$r({}, shape.attr()), + coordinate: shape.get('coordinate'), + }); + } + } + delete lastShapesMap[id]; + } + }); + // 移除 + each$2(lastShapesMap, function (deleteShape) { + var animateCfg = get$3(deleteShape.get('animateCfg'), 'leave'); + if (animateCfg) { + doAnimate(deleteShape, animateCfg, { + toAttrs: null, + coordinate: deleteShape.get('coordinate'), + }); + } + else { + deleteShape.remove(true); // 移除 + } + }); + this.lastShapesMap = shapesMap; + offscreenGroup.destroy(); + }; + /** 清除当前 labels */ + Labels.prototype.clear = function () { + this.container.clear(); + this.shapesMap = {}; + this.lastShapesMap = {}; + }; + /** 销毁 */ + Labels.prototype.destroy = function () { + this.container.destroy(); + this.shapesMap = null; + this.lastShapesMap = null; + }; + Labels.prototype.renderLabel = function (cfg, container) { + var id = cfg.id, elementId = cfg.elementId, data = cfg.data, mappingData = cfg.mappingData, coordinate = cfg.coordinate, animate = cfg.animate, content = cfg.content; + var shapeAppendCfg = { + id: id, + elementId: elementId, + data: data, + origin: __assign$r(__assign$r({}, mappingData), { data: mappingData[FIELD_ORIGIN] }), + coordinate: coordinate, + }; + var labelGroup = container.addGroup(__assign$r({ name: 'label', + // 如果 this.animate === false 或者 cfg.animate === false/null 则不进行动画，否则进行动画配置的合并 + animateCfg: this.animate === false || animate === null || animate === false ? false : deepMix({}, this.animate, animate) }, shapeAppendCfg)); + var labelShape; + if ((content.isGroup && content.isGroup()) || (content.isShape && content.isShape())) { + // 如果 content 是 Group 或者 Shape，根据 textAlign 调整位置后，直接将其加入 labelGroup + var _a = content.getCanvasBBox(), width = _a.width, height = _a.height; + var textAlign = get$3(cfg, 'textAlign', 'left'); + var x = cfg.x; + var y = cfg.y - height / 2; + if (textAlign === 'center') { + x = x - width / 2; + } + else if (textAlign === 'right' || textAlign === 'end') { + x = x - width; + } + translate$1(content, x, y); // 将 label 平移至 x, y 指定的位置 + labelShape = content; + labelGroup.add(content); + } + else { + var fill = get$3(cfg, ['style', 'fill']); + labelShape = labelGroup.addShape('text', __assign$r({ attrs: __assign$r(__assign$r({ x: cfg.x, y: cfg.y, textAlign: cfg.textAlign, textBaseline: get$3(cfg, 'textBaseline', 'middle'), text: cfg.content }, cfg.style), { fill: isNull(fill) ? cfg.color : fill }) }, shapeAppendCfg)); + } + if (cfg.rotate) { + rotate$2(labelShape, cfg.rotate); + } + this.shapesMap[id] = labelGroup; + }; + // 根据type对label布局 + Labels.prototype.doLayout = function (items, shapes) { + var _this = this; + if (this.layout) { + var layouts = isArray$n(this.layout) ? this.layout : [this.layout]; + each$2(layouts, function (layout) { + var layoutFn = getGeometryLabelLayout(get$3(layout, 'type', '')); + if (layoutFn) { + var labelShapes_1 = []; + var geometryShapes_1 = []; + each$2(_this.shapesMap, function (labelShape, id) { + labelShapes_1.push(labelShape); + geometryShapes_1.push(shapes[labelShape.get('elementId')]); + }); + layoutFn(items, labelShapes_1, geometryShapes_1, _this.region, layout.cfg); + } + }); + } + }; + Labels.prototype.renderLabelLine = function (labelItems) { + var _this = this; + each$2(labelItems, function (labelItem) { + var coordinate = get$3(labelItem, 'coordinate'); + if (!labelItem || !coordinate) { + return; + } + var center = coordinate.getCenter(); + var radius = coordinate.getRadius(); + if (!labelItem.labelLine) { + // labelLine: null | false，关闭 label 对应的 labelLine + return; + } + var labelLineCfg = get$3(labelItem, 'labelLine', {}); + var id = labelItem.id; + var path = labelLineCfg.path; + if (!path) { + var start = polarToCartesian(center.x, center.y, radius, labelItem.angle); + path = [ + ['M', start.x, start.y], + ['L', labelItem.x, labelItem.y], + ]; + } + var labelGroup = _this.shapesMap[id]; + if (!labelGroup.destroyed) { + labelGroup.addShape('path', { + capture: false, + attrs: __assign$r({ path: path, stroke: labelItem.color ? labelItem.color : get$3(labelItem, ['style', 'fill'], '#000'), fill: null }, labelLineCfg.style), + id: id, + origin: labelItem.mappingData, + data: labelItem.data, + coordinate: labelItem.coordinate, + }); + } + }); + }; + /** + * 绘制标签背景 + * @param labelItems + */ + Labels.prototype.renderLabelBackground = function (labelItems) { + var _this = this; + each$2(labelItems, function (labelItem) { + var coordinate = get$3(labelItem, 'coordinate'); + var background = get$3(labelItem, 'background'); + if (!background || !coordinate) { + return; + } + var id = labelItem.id; + var labelGroup = _this.shapesMap[id]; + if (!labelGroup.destroyed) { + var labelContentShape = labelGroup.getChildren()[0]; + if (labelContentShape) { + var _a = getlLabelBackgroundInfo(labelGroup, labelItem, background.padding), rotation = _a.rotation, box = __rest$G(_a, ["rotation"]); + var backgroundShape = labelGroup.addShape('rect', { + attrs: __assign$r(__assign$r({}, box), (background.style || {})), + id: id, + origin: labelItem.mappingData, + data: labelItem.data, + coordinate: labelItem.coordinate, + }); + backgroundShape.setZIndex(-1); + if (rotation) { + var matrix = labelContentShape.getMatrix(); + backgroundShape.setMatrix(matrix); + } + } + } + }); + }; + Labels.prototype.createOffscreenGroup = function () { + var container = this.container; + var GroupClass = container.getGroupBase(); // 获取分组的构造函数 + var newGroup = new GroupClass({}); + return newGroup; + }; + Labels.prototype.adjustLabel = function (items) { + var _this = this; + each$2(items, function (item) { + if (item) { + var id = item.id; + var labelGroup = _this.shapesMap[id]; + if (!labelGroup.destroyed) { + // fix: 如果说开发者的 label content 是一个 group，此处的偏移无法对 整个 content group 生效；场景类似 饼图 spider label 是一个含 2 个 textShape 的 gorup + var labelShapes = labelGroup.findAll(function (ele) { return ele.get('type') !== 'path'; }); + each$2(labelShapes, function (labelShape) { + if (labelShape) { + if (item.offsetX) { + labelShape.attr('x', labelShape.attr('x') + item.offsetX); + } + if (item.offsetY) { + labelShape.attr('y', labelShape.attr('y') + item.offsetY); + } + } + }); + } + } + }); + }; + return Labels; +}()); + +function avg(arr) { + var sum = 0; + each$2(arr, function (value) { + sum += value; + }); + return sum / arr.length; +} +/** + * Geometry Label 基类，用于生成 Geometry 下所有 label 的配置项信息 + */ +var GeometryLabel = /** @class */ (function () { + function GeometryLabel(geometry) { + this.geometry = geometry; + } + GeometryLabel.prototype.getLabelItems = function (mapppingArray) { + var _this = this; + var items = []; + var labelCfgs = this.getLabelCfgs(mapppingArray); + // 获取 label 相关的 x，y 的值，获取具体的 x, y，防止存在数组 + each$2(mapppingArray, function (mappingData, index) { + var labelCfg = labelCfgs[index]; + if (!labelCfg || isNil(mappingData.x) || isNil(mappingData.y)) { + items.push(null); + return; + } + var labelContent = !isArray$n(labelCfg.content) ? [labelCfg.content] : labelCfg.content; + labelCfg.content = labelContent; + var total = labelContent.length; + each$2(labelContent, function (content, subIndex) { + if (isNil(content) || content === '') { + items.push(null); + return; + } + var item = __assign$r(__assign$r({}, labelCfg), _this.getLabelPoint(labelCfg, mappingData, subIndex)); + if (!item.textAlign) { + item.textAlign = _this.getLabelAlign(item, subIndex, total); + } + if (item.offset <= 0) { + item.labelLine = null; + } + items.push(item); + }); + }); + return items; + }; + GeometryLabel.prototype.render = function (mapppingArray, isUpdate) { + if (isUpdate === void 0) { isUpdate = false; } + var labelItems = this.getLabelItems(mapppingArray); + var labelsRenderer = this.getLabelsRenderer(); + var shapes = this.getGeometryShapes(); + // 渲染文本 + labelsRenderer.render(labelItems, shapes, isUpdate); + }; + GeometryLabel.prototype.clear = function () { + var labelsRenderer = this.labelsRenderer; + if (labelsRenderer) { + labelsRenderer.clear(); + } + }; + GeometryLabel.prototype.destroy = function () { + var labelsRenderer = this.labelsRenderer; + if (labelsRenderer) { + labelsRenderer.destroy(); + } + this.labelsRenderer = null; + }; + // geometry 更新之后，对应的 Coordinate 也会更新，为了获取到最新鲜的 Coordinate，故使用方法获取 + GeometryLabel.prototype.getCoordinate = function () { + return this.geometry.coordinate; + }; + /** + * 获取 label 的默认配置 + */ + GeometryLabel.prototype.getDefaultLabelCfg = function (offset, position) { + var geometry = this.geometry; + var type = geometry.type, theme = geometry.theme; + if (type === 'polygon' || + (type === 'interval' && position === 'middle') || + (offset < 0 && !['line', 'point', 'path'].includes(type))) { + // polygon 或者 (interval 且 middle) 或者 offset 小于 0 时，文本展示在图形内部，将其颜色设置为 白色 + return get$3(theme, 'innerLabels', {}); + } + return get$3(theme, 'labels', {}); + }; + /** + * 获取当前 label 的最终配置 + * @param labelCfg + */ + GeometryLabel.prototype.getThemedLabelCfg = function (labelCfg) { + var geometry = this.geometry; + var defaultLabelCfg = this.getDefaultLabelCfg(); + var type = geometry.type, theme = geometry.theme; + var themedLabelCfg; + if (type === 'polygon' || (labelCfg.offset < 0 && !['line', 'point', 'path'].includes(type))) { + // polygon 或者 offset 小于 0 时，文本展示在图形内部，将其颜色设置为 白色 + themedLabelCfg = deepMix({}, defaultLabelCfg, theme.innerLabels, labelCfg); + } + else { + themedLabelCfg = deepMix({}, defaultLabelCfg, theme.labels, labelCfg); + } + return themedLabelCfg; + }; + /** + * 设置 label 位置 + * @param labelPointCfg + * @param mappingData + * @param index + * @param position + */ + GeometryLabel.prototype.setLabelPosition = function (labelPointCfg, mappingData, index, position) { }; + /** + * @desc 获取 label offset + */ + GeometryLabel.prototype.getLabelOffset = function (offset) { + var coordinate = this.getCoordinate(); + var vector = this.getOffsetVector(offset); + return coordinate.isTransposed ? vector[0] : vector[1]; + }; + /** + * 获取每个 label 的偏移量 (矢量) + * @param labelCfg + * @param index + * @param total + * @return {Point} offsetPoint + */ + GeometryLabel.prototype.getLabelOffsetPoint = function (labelCfg, index, total) { + var offset = labelCfg.offset; + var coordinate = this.getCoordinate(); + var transposed = coordinate.isTransposed; + var dim = transposed ? 'x' : 'y'; + var factor = transposed ? 1 : -1; // y 方向上越大，像素的坐标越小，所以transposed时将系数变成 + var offsetPoint = { + x: 0, + y: 0, + }; + if (index > 0 || total === 1) { + // 判断是否小于0 + offsetPoint[dim] = offset * factor; + } + else { + offsetPoint[dim] = offset * factor * -1; + } + return offsetPoint; + }; + /** + * 获取每个 label 的位置 + * @param labelCfg + * @param mappingData + * @param index + * @returns label point + */ + GeometryLabel.prototype.getLabelPoint = function (labelCfg, mappingData, index) { + var coordinate = this.getCoordinate(); + var total = labelCfg.content.length; + function getDimValue(value, idx, isAvg) { + if (isAvg === void 0) { isAvg = false; } + var v = value; + if (isArray$n(v)) { + if (labelCfg.content.length === 1) { + if (isAvg) { + v = avg(v); + } + else { + // 如果仅一个 label，多个 y, 取最后一个 y + if (v.length <= 2) { + v = v[value.length - 1]; + } + else { + v = avg(v); + } + } + } + else { + v = v[idx]; + } + } + return v; + } + var label = { + content: labelCfg.content[index], + x: 0, + y: 0, + start: { x: 0, y: 0 }, + color: '#fff', + }; + var shape = isArray$n(mappingData.shape) ? mappingData.shape[0] : mappingData.shape; + var isFunnel = shape === 'funnel' || shape === 'pyramid'; + // 多边形场景，多用于地图 + if (this.geometry.type === 'polygon') { + var centroid = getPolygonCentroid(mappingData.x, mappingData.y); + label.x = centroid[0]; + label.y = centroid[1]; + } + else if (this.geometry.type === 'interval' && !isFunnel) { + // 对直方图的label X 方向的位置居中 + label.x = getDimValue(mappingData.x, index, true); + label.y = getDimValue(mappingData.y, index); + } + else { + label.x = getDimValue(mappingData.x, index); + label.y = getDimValue(mappingData.y, index); + } + // 处理漏斗图文本位置 + if (isFunnel) { + var nextPoints = get$3(mappingData, 'nextPoints'); + var points = get$3(mappingData, 'points'); + if (nextPoints) { + // 非漏斗图底部 + var point1 = coordinate.convert(points[1]); + var point2 = coordinate.convert(nextPoints[1]); + label.x = (point1.x + point2.x) / 2; + label.y = (point1.y + point2.y) / 2; + } + else if (shape === 'pyramid') { + var point1 = coordinate.convert(points[1]); + var point2 = coordinate.convert(points[2]); + label.x = (point1.x + point2.x) / 2; + label.y = (point1.y + point2.y) / 2; + } + } + if (labelCfg.position) { + // 如果 label 支持 position 属性 + this.setLabelPosition(label, mappingData, index, labelCfg.position); + } + var offsetPoint = this.getLabelOffsetPoint(labelCfg, index, total); + label.start = { x: label.x, y: label.y }; + label.x += offsetPoint.x; + label.y += offsetPoint.y; + label.color = mappingData.color; + return label; + }; + /** + * 获取文本的对齐方式 + * @param item + * @param index + * @param total + * @returns + */ + GeometryLabel.prototype.getLabelAlign = function (item, index, total) { + var align = 'center'; + var coordinate = this.getCoordinate(); + if (coordinate.isTransposed) { + var offset = item.offset; + if (offset < 0) { + align = 'right'; + } + else if (offset === 0) { + align = 'center'; + } + else { + align = 'left'; + } + if (total > 1 && index === 0) { + if (align === 'right') { + align = 'left'; + } + else if (align === 'left') { + align = 'right'; + } + } + } + return align; + }; + /** + * 获取每一个 label 的唯一 id + * @param mappingData label 对应的图形的绘制数据 + */ + GeometryLabel.prototype.getLabelId = function (mappingData) { + var geometry = this.geometry; + var type = geometry.type; + var xScale = geometry.getXScale(); + var yScale = geometry.getYScale(); + var origin = mappingData[FIELD_ORIGIN]; // 原始数据 + var labelId = geometry.getElementId(mappingData); + if (type === 'line' || type === 'area') { + // 折线图以及区域图，一条线会对应一组数据，即多个 labels，为了区分这些 labels，需要在 line id 的前提下加上 x 字段值 + labelId += " " + origin[xScale.field]; + } + else if (type === 'path') { + // path 路径图，无序，有可能存在相同 x 不同 y 的情况，需要通过 x y 来确定唯一 id + labelId += " " + origin[xScale.field] + "-" + origin[yScale.field]; + } + return labelId; + }; + // 获取 labels 组件 + GeometryLabel.prototype.getLabelsRenderer = function () { + var _a = this.geometry, labelsContainer = _a.labelsContainer, labelOption = _a.labelOption, canvasRegion = _a.canvasRegion, animateOption = _a.animateOption; + var coordinate = this.geometry.coordinate; + var labelsRenderer = this.labelsRenderer; + if (!labelsRenderer) { + labelsRenderer = new Labels({ + container: labelsContainer, + layout: get$3(labelOption, ['cfg', 'layout'], { + type: this.defaultLayout, + }), + }); + this.labelsRenderer = labelsRenderer; + } + labelsRenderer.region = canvasRegion; + // 设置动画配置，如果 geometry 的动画关闭了，那么 label 的动画也会关闭 + labelsRenderer.animate = animateOption ? getDefaultAnimateCfg('label', coordinate) : false; + return labelsRenderer; + }; + GeometryLabel.prototype.getLabelCfgs = function (mapppingArray) { + var _this = this; + var geometry = this.geometry; + var labelOption = geometry.labelOption, scales = geometry.scales, coordinate = geometry.coordinate; + var _a = labelOption, fields = _a.fields, callback = _a.callback, cfg = _a.cfg; + var labelScales = fields.map(function (field) { + return scales[field]; + }); + var labelCfgs = []; + each$2(mapppingArray, function (mappingData, index) { + var origin = mappingData[FIELD_ORIGIN]; // 原始数据 + var originText = _this.getLabelText(origin, labelScales); + var callbackCfg; + if (callback) { + // 当同时配置了 callback 和 cfg 时，以 callback 为准 + var originValues = fields.map(function (field) { return origin[field]; }); + callbackCfg = callback.apply(void 0, originValues); + if (isNil(callbackCfg)) { + labelCfgs.push(null); + return; + } + } + var labelCfg = __assign$r(__assign$r({ id: _this.getLabelId(mappingData), elementId: _this.geometry.getElementId(mappingData), data: origin, // 存储原始数据 + mappingData: mappingData, + coordinate: coordinate }, cfg), callbackCfg); + if (isFunction$6(labelCfg.position)) { + labelCfg.position = labelCfg.position(origin, mappingData, index); + } + var offset = _this.getLabelOffset(labelCfg.offset || 0); + // defaultCfg 需要判断 innerLabels & labels + var defaultLabelCfg = _this.getDefaultLabelCfg(offset, labelCfg.position); + // labelCfg priority: defaultCfg < cfg < callbackCfg + labelCfg = deepMix({}, defaultLabelCfg, labelCfg); + // 获取最终的 offset + labelCfg.offset = _this.getLabelOffset(labelCfg.offset || 0); + var content = labelCfg.content; + if (isFunction$6(content)) { + labelCfg.content = content(origin, mappingData, index); + } + else if (isUndefined$1(content)) { + // 用户未配置 content，则默认为映射的第一个字段的值 + labelCfg.content = originText[0]; + } + labelCfgs.push(labelCfg); + }); + return labelCfgs; + }; + GeometryLabel.prototype.getLabelText = function (origin, scales) { + var labelTexts = []; + each$2(scales, function (scale) { + var value = origin[scale.field]; + if (isArray$n(value)) { + value = value.map(function (subVal) { + return scale.getText(subVal); + }); + } + else { + value = scale.getText(value); + } + if (isNil(value) || value === '') { + labelTexts.push(null); + } + else { + labelTexts.push(value); + } + }); + return labelTexts; + }; + GeometryLabel.prototype.getOffsetVector = function (offset) { + if (offset === void 0) { offset = 0; } + var coordinate = this.getCoordinate(); + var actualOffset = 0; + if (isNumber$4(offset)) { + actualOffset = offset; + } + // 如果 x,y 翻转，则偏移 x，否则偏移 y + return coordinate.isTransposed ? coordinate.applyMatrix(actualOffset, 0) : coordinate.applyMatrix(0, actualOffset); + }; + GeometryLabel.prototype.getGeometryShapes = function () { + var geometry = this.geometry; + var shapes = {}; + each$2(geometry.elementsMap, function (element, id) { + shapes[id] = element.shape; + }); + // 因为有可能 shape 还在进行动画，导致 shape.getBBox() 获取到的值不是最终态，所以需要从 offscreenGroup 获取 + each$2(geometry.getOffscreenGroup().getChildren(), function (child) { + var id = geometry.getElementId(child.get('origin').mappingData); + shapes[id] = child; + }); + return shapes; + }; + return GeometryLabel; +}()); +var GeometryLabel$1 = GeometryLabel; + +/** + * @ignore + * get the mapping value by attribute, if mapping value is nil, return def + * @param attr + * @param value + * @param def + * @returns get mapping value + */ +function getMappingValue(attr, value, def) { + if (!attr) { + return def; + } + var r; + // 多参数映射，阻止程序报错 + if (attr.callback && attr.callback.length > 1) { + var restArgs = Array(attr.callback.length - 1).fill(''); + r = attr.mapping.apply(attr, __spreadArrays$1([value], restArgs)).join(''); + } + else { + r = attr.mapping(value).join(''); + } + return r || def; +} + +/** @ignore */ +var MarkerSymbols = { + hexagon: function (x, y, r) { + var diffX = (r / 2) * Math.sqrt(3); + return [ + ['M', x, y - r], + ['L', x + diffX, y - r / 2], + ['L', x + diffX, y + r / 2], + ['L', x, y + r], + ['L', x - diffX, y + r / 2], + ['L', x - diffX, y - r / 2], + ['Z'], + ]; + }, + bowtie: function (x, y, r) { + var diffY = r - 1.5; + return [['M', x - r, y - diffY], ['L', x + r, y + diffY], ['L', x + r, y - diffY], ['L', x - r, y + diffY], ['Z']]; + }, + cross: function (x, y, r) { + return [ + ['M', x - r, y - r], + ['L', x + r, y + r], + ['M', x + r, y - r], + ['L', x - r, y + r], + ]; + }, + tick: function (x, y, r) { + return [ + ['M', x - r / 2, y - r], + ['L', x + r / 2, y - r], + ['M', x, y - r], + ['L', x, y + r], + ['M', x - r / 2, y + r], + ['L', x + r / 2, y + r], + ]; + }, + plus: function (x, y, r) { + return [ + ['M', x - r, y], + ['L', x + r, y], + ['M', x, y - r], + ['L', x, y + r], + ]; + }, + hyphen: function (x, y, r) { + return [ + ['M', x - r, y], + ['L', x + r, y], + ]; + }, + line: function (x, y, r) { + return [ + ['M', x, y - r], + ['L', x, y + r], + ]; + }, +}; + +/** 线条形 marker symbol */ +var STROKES_SYMBOLS = ['line', 'cross', 'tick', 'plus', 'hyphen']; +/** + * 处理用户配置的 marker style + * @param markerStyle + * @param userMarker.style + * @returns {ShapeAttrs} newStyle + */ +function handleUserMarkerStyle(markerStyle, style) { + if (isFunction$6(style)) { + return style(markerStyle); + } + return deepMix({}, markerStyle, style); +} +/** + * 根据 marker 是否为线条形 symbol, 来调整下样式 + * @param symbol + * @param style + * @param color + */ +function adpatorMarkerStyle(marker, color) { + var symbol = marker.symbol; + if (isString$3(symbol) && STROKES_SYMBOLS.indexOf(symbol) !== -1) { + var markerStyle = get$3(marker, 'style', {}); + var lineWidth = get$3(markerStyle, 'lineWidth', 1); + var stroke = markerStyle.stroke || markerStyle.fill || color; + marker.style = deepMix({}, marker.style, { lineWidth: lineWidth, stroke: stroke, fill: null }); + } +} +/** + * 设置 marker 的 symbol，将 字符串的 symbol 转换为真正的绘制命令 + * @param marker + */ +function setMarkerSymbol(marker) { + var symbol = marker.symbol; + if (isString$3(symbol) && MarkerSymbols[symbol]) { + marker.symbol = MarkerSymbols[symbol]; + } +} +/** + * @ignore + * get the legend layout from direction + * @param direction + * @returns layout 'horizontal' | 'vertical' + */ +function getLegendLayout(direction) { + return direction.startsWith(DIRECTION.LEFT) || direction.startsWith(DIRECTION.RIGHT) ? 'vertical' : 'horizontal'; +} +/** + * @ignore + * get the legend items + * @param view + * @param geometry + * @param attr + * @param themeMarker + * @param markerCfg + * @returns legend items + */ +function getLegendItems(view, geometry, attr, themeMarker, userMarker) { + var scale = attr.getScale(attr.type); + if (scale.isCategory) { + var field_1 = scale.field; + var colorAttr_1 = geometry.getAttribute('color'); + var shapeAttr_1 = geometry.getAttribute('shape'); + var defaultColor_1 = view.getTheme().defaultColor; + var isInPolar_1 = geometry.coordinate.isPolar; + return scale.getTicks().map(function (tick, index) { + var _a; + var text = tick.text, scaleValue = tick.value; + var name = text; + var value = scale.invert(scaleValue); + // 通过过滤图例项的数据，来看是否 unchecked + var unchecked = view.filterFieldData(field_1, [(_a = {}, _a[field_1] = value, _a)]).length === 0; + each$2(view.views, function (subView) { + var _a; + if (!subView.filterFieldData(field_1, [(_a = {}, _a[field_1] = value, _a)]).length) { + unchecked = true; + } + }); + // @ts-ignore + var color = getMappingValue(colorAttr_1, value, defaultColor_1); + var shape = getMappingValue(shapeAttr_1, value, 'point'); + var marker = geometry.getShapeMarker(shape, { + color: color, + isInPolar: isInPolar_1, + }); + var markerCfg = userMarker; + if (isFunction$6(markerCfg)) { + markerCfg = markerCfg(name, index, __assign$r({ name: name, value: value }, deepMix({}, themeMarker, marker))); + } + // the marker configure order should be ensure + marker = deepMix({}, themeMarker, marker, omit(__assign$r({}, markerCfg), ['style'])); + adpatorMarkerStyle(marker, color); + if (markerCfg && markerCfg.style) { + // handle user's style settings + marker.style = handleUserMarkerStyle(marker.style, markerCfg.style); + } + setMarkerSymbol(marker); + return { id: value, name: name, value: value, marker: marker, unchecked: unchecked }; + }); + } + return []; +} +/** + * + * @ignore + * custom legend 的 items 获取 + * @param themeMarker + * @param userMarker + * @param customItems + */ +function getCustomLegendItems(themeMarker, userMarker, customItems) { + // 如果有自定义的 item，那么就直接使用，并合并主题的 marker 配置 + return customItems.map(function (item, index) { + var markerCfg = userMarker; + if (isFunction$6(markerCfg)) { + markerCfg = markerCfg(item.name, index, deepMix({}, themeMarker, item)); + } + var marker = deepMix({}, themeMarker, markerCfg, item.marker); + setMarkerSymbol(marker); + item.marker = marker; + return item; + }); +} +/** + * get the legend cfg from theme, will mix the common cfg of legend theme + * + * @param theme view theme object + * @param direction legend direction + * @returns legend theme cfg + */ +function getLegendThemeCfg(theme, direction) { + var legendTheme = get$3(theme, ['components', 'legend'], {}); + return deepMix({}, get$3(legendTheme, ['common'], {}), deepMix({}, get$3(legendTheme, [direction], {}))); +} + +/* G2 的一个壳子，不包含 Geometry，由开发者自己定义和引入 */ +var VERSION = '4.1.25'; +var Util$1 = { + getLegendItems: getLegendItems, + translate: translate$1, + rotate: rotate$2, + zoom: zoom, + transform: transform$f, + getAngle: getAngle$2, + getSectorPath: getSectorPath, + polarToCartesian: polarToCartesian, + getDelegationObject: getDelegationObject, + getTooltipItems: getTooltipItems, + getMappingValue: getMappingValue, +}; + +var WHITE_COLORS = { + 100: '#000', + 95: '#0D0D0D', + 85: '#262626', + 65: '#595959', + 45: '#8C8C8C', + 25: '#BFBFBF', + 15: '#D9D9D9', + 6: '#F0F0F0', +}; +var BLACK_COLORS = { + 100: '#FFFFFF', + 95: '#F2F2F2', + 85: '#D9D9D9', + 65: '#A6A6A6', + 45: '#737373', + 25: '#404040', + 15: '#262626', + 6: '#0F0F0F', +}; +var QUALITATIVE_10 = [ + '#5B8FF9', + '#5AD8A6', + '#5D7092', + '#F6BD16', + '#E86452', + '#6DC8EC', + '#945FB9', + '#FF9845', + '#1E9493', + '#FF99C3', +]; +var QUALITATIVE_20 = [ + '#5B8FF9', + '#CDDDFD', + '#5AD8A6', + '#CDF3E4', + '#5D7092', + '#CED4DE', + '#F6BD16', + '#FCEBB9', + '#E86452', + '#F8D0CB', + '#6DC8EC', + '#D3EEF9', + '#945FB9', + '#DECFEA', + '#FF9845', + '#FFE0C7', + '#1E9493', + '#BBDEDE', + '#FF99C3', + '#FFE0ED', +]; +/** 单色顺序色板 */ +var SINGLE_SEQUENCE = [ + '#B8E1FF', + '#9AC5FF', + '#7DAAFF', + '#5B8FF9', + '#3D76DD', + '#085EC0', + '#0047A5', + '#00318A', + '#001D70', +]; +var createDarkStyleSheet = function (cfg) { + if (cfg === void 0) { cfg = {}; } + var _a = cfg.backgroundColor, backgroundColor = _a === void 0 ? '#141414' : _a, _b = cfg.subColor, subColor = _b === void 0 ? 'rgba(255,255,255,0.05)' : _b, _c = cfg.paletteQualitative10, paletteQualitative10 = _c === void 0 ? QUALITATIVE_10 : _c, _d = cfg.paletteQualitative20, paletteQualitative20 = _d === void 0 ? QUALITATIVE_20 : _d, _e = cfg.paletteSemanticRed, paletteSemanticRed = _e === void 0 ? '#F4664A' : _e, _f = cfg.paletteSemanticGreen, paletteSemanticGreen = _f === void 0 ? '#30BF78' : _f, _g = cfg.paletteSemanticYellow, paletteSemanticYellow = _g === void 0 ? '#FAAD14' : _g, _h = cfg.paletteSequence, paletteSequence = _h === void 0 ? SINGLE_SEQUENCE : _h, _j = cfg.fontFamily, fontFamily = _j === void 0 ? "\"-apple-system\", \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial,\n \"Noto Sans\", sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\",\n \"Noto Color Emoji\"" : _j; + var _k = cfg.brandColor, brandColor = _k === void 0 ? paletteQualitative10[0] : _k; + return { + /** 图表背景色 */ + backgroundColor: backgroundColor, + /** 主题色 */ + brandColor: brandColor, + /** 图表辅助色 */ + subColor: subColor, + /** 分类色板 1，在数据量小于等于 10 时使用 */ + paletteQualitative10: paletteQualitative10, + /** 分类色板 2，在数据量大于 10 时使用 */ + paletteQualitative20: paletteQualitative20, + /** 语义色 */ + paletteSemanticRed: paletteSemanticRed, + /** 语义色 */ + paletteSemanticGreen: paletteSemanticGreen, + /** 语义色 */ + paletteSemanticYellow: paletteSemanticYellow, + /** (单色)顺序色板 */ + paletteSequence: paletteSequence, + /** 字体 */ + fontFamily: fontFamily, + // -------------------- 坐标轴 -------------------- + /** 坐标轴线颜色 */ + axisLineBorderColor: BLACK_COLORS[25], + /** 坐标轴线粗细 */ + axisLineBorder: 1, + /** 坐标轴线 lineDash 设置 */ + axisLineDash: null, + /** 坐标轴标题颜色 */ + axisTitleTextFillColor: BLACK_COLORS[65], + /** 坐标轴标题文本字体大小 */ + axisTitleTextFontSize: 12, + /** 坐标轴标题文本行高 */ + axisTitleTextLineHeight: 12, + /** 坐标轴标题文本字体粗细 */ + axisTitleTextFontWeight: 'normal', + /** 坐标轴标题距离坐标轴文本的间距 */ + axisTitleSpacing: 12, + /** 坐标轴刻度线颜色 */ + axisTickLineBorderColor: BLACK_COLORS[25], + /** 坐标轴刻度线长度 */ + axisTickLineLength: 4, + /** 坐标轴刻度线粗细 */ + axisTickLineBorder: 1, + /** 坐标轴次刻度线颜色 */ + axisSubTickLineBorderColor: BLACK_COLORS[15], + /** 坐标轴次刻度线长度 */ + axisSubTickLineLength: 2, + /** 坐标轴次刻度线粗细 */ + axisSubTickLineBorder: 1, + /** 坐标轴刻度文本颜色 */ + axisLabelFillColor: BLACK_COLORS[45], + /** 坐标轴刻度文本字体大小 */ + axisLabelFontSize: 12, + /** 坐标轴刻度文本行高 */ + axisLabelLineHeight: 12, + /** 坐标轴刻度文本字体粗细 */ + axisLabelFontWeight: 'normal', + /** 坐标轴刻度文本距离坐标轴线的间距 */ + axisLabelOffset: 8, + /** 坐标轴网格线颜色 */ + axisGridBorderColor: BLACK_COLORS[15], + /** 坐标轴网格线粗细 */ + axisGridBorder: 1, + /** 坐标轴网格线虚线设置 */ + axisGridLineDash: null, + // -------------------- 图例 -------------------- + /** 图例标题颜色 */ + legendTitleTextFillColor: BLACK_COLORS[45], + /** 图例标题文本字体大小 */ + legendTitleTextFontSize: 12, + /** 图例标题文本行高 */ + legendTitleTextLineHeight: 21, + /** 图例标题文本字体粗细 */ + legendTitleTextFontWeight: 'normal', + /** 图例 marker 颜色 */ + legendMarkerColor: QUALITATIVE_10[0], + /** 图例 marker 距离图例文本的间距 */ + legendMarkerSpacing: 8, + /** 图例 marker 默认半径大小 */ + legendMarkerSize: 4, + /** 图例 'circle' marker 半径 */ + legendCircleMarkerSize: 4, + /** 图例 'square' marker 半径 */ + legendSquareMarkerSize: 4, + /** 图例 'line' marker 半径 */ + legendLineMarkerSize: 5, + /** 图例项文本颜色 */ + legendItemNameFillColor: BLACK_COLORS[65], + /** 图例项文本字体大小 */ + legendItemNameFontSize: 12, + /** 图例项文本行高 */ + legendItemNameLineHeight: 12, + /** 图例项粗细 */ + legendItemNameFontWeight: 'normal', + /** 图例项之间的水平间距 */ + legendItemSpacing: 24, + /** 图例项垂直方向的间隔 */ + legendItemMarginBottom: 12, + /** 图例与图表绘图区域的偏移距离 */ + legendSpacing: 16, + /** 图例与图表绘图区域的偏移距离 */ + legendPadding: [8, 8, 8, 8], + /** 水平布局的图例与绘图区域偏移距离 */ + legendHorizontalPadding: [8, 0, 8, 0], + /** 垂直布局的图例与绘图区域偏移距离 */ + legendVerticalPadding: [0, 8, 0, 8], + // 图例分页器 + /** 图例分页器 marker 大小 */ + legendPageNavigatorMarkerSize: 12, + /** 图例分页器 marker 填充色 */ + legendPageNavigatorMarkerInactiveFillColor: BLACK_COLORS[45], + /** 图例分页器 marker 填充色透明度 */ + legendPageNavigatorMarkerInactiveFillOpacity: 0.45, + /** 图例分页器 marker 激活状态填充色 */ + legendPageNavigatorMarkerFillColor: BLACK_COLORS[45], + /** 图例分页器 marker 激活状态填充色透明度 */ + legendPageNavigatorMarkerFillOpacity: 1, + /** 图例分页器文本颜色 */ + legendPageNavigatorTextFillColor: BLACK_COLORS[65], + /** 图例分页器文本字体大小 */ + legendPageNavigatorTextFontSize: 12, + /** 连续图例滑块填充色 */ + sliderRailFillColor: BLACK_COLORS[15], + /** 连续图例滑块边框粗细 */ + sliderRailBorder: 0, + /** 连续图例滑块边框颜色 */ + sliderRailBorderColor: null, + /** 连续图例滑块宽度 */ + sliderRailWidth: 100, + /** 连续图例滑块高度 */ + sliderRailHeight: 12, + /** 连续图例文本颜色 */ + sliderLabelTextFillColor: BLACK_COLORS[45], + /** 连续图例文本字体大小 */ + sliderLabelTextFontSize: 12, + /** 连续图例文本行高 */ + sliderLabelTextLineHeight: 12, + /** 连续图例文本字体粗细 */ + sliderLabelTextFontWeight: 'normal', + /** 连续图例滑块颜色 */ + sliderHandlerFillColor: WHITE_COLORS[6], + /** 连续图例滑块宽度 */ + sliderHandlerWidth: 10, + /** 连续图例滑块高度 */ + sliderHandlerHeight: 14, + /** 连续图例滑块边框粗细 */ + sliderHandlerBorder: 1, + /** 连续图例滑块边框颜色 */ + sliderHandlerBorderColor: WHITE_COLORS[25], + // -------------------- Annotation，图形标注 -------------------- + /** arc 图形标注描边颜色 */ + annotationArcBorderColor: BLACK_COLORS[15], + /** arc 图形标注粗细 */ + annotationArcBorder: 1, + /** line 图形标注颜色 */ + annotationLineBorderColor: BLACK_COLORS[25], + /** line 图形标注粗细 */ + annotationLineBorder: 1, + /** lube 图形标注的虚线间隔 */ + annotationLineDash: null, + /** text 图形标注文本颜色 */ + annotationTextFillColor: BLACK_COLORS[65], + /** text 图形标注文本字体大小 */ + annotationTextFontSize: 12, + /** text 图形标注文本行高 */ + annotationTextLineHeight: 12, + /** text 图形标注文本字体粗细 */ + annotationTextFontWeight: 'normal', + /** text 图形标注文本边框颜色 */ + annotationTextBorderColor: null, + /** text 图形标注文本边框粗细 */ + annotationTextBorder: 0, + /** region 图形标注填充颜色 */ + annotationRegionFillColor: BLACK_COLORS[100], + /** region 图形标注填充颜色透明色 */ + annotationRegionFillOpacity: 0.06, + /** region 图形标注描边粗细 */ + annotationRegionBorder: 0, + /** region 图形标注描边颜色 */ + annotationRegionBorderColor: null, + /** dataMarker 图形标注线的长度 */ + annotationDataMarkerLineLength: 16, + // -------------------- Tooltip -------------------- + /** tooltip crosshairs 辅助线颜色 */ + tooltipCrosshairsBorderColor: BLACK_COLORS[25], + /** tooltip crosshairs 辅助线粗细 */ + tooltipCrosshairsBorder: 1, + /** tooltip crosshairs 辅助线虚线间隔 */ + tooltipCrosshairsLineDash: null, + /** tooltip 内容框背景色 */ + tooltipContainerFillColor: '#1f1f1f', + tooltipContainerFillOpacity: 0.95, + /** tooltip 内容框阴影 */ + tooltipContainerShadow: '0px 2px 4px rgba(0,0,0,.5)', + /** tooltip 内容框圆角 */ + tooltipContainerBorderRadius: 3, + /** tooltip 文本颜色 */ + tooltipTextFillColor: BLACK_COLORS[65], + /** tooltip 文本字体大小 */ + tooltipTextFontSize: 12, + /** tooltip 文本行高 */ + tooltipTextLineHeight: 12, + /** tooltip 文本字体粗细 */ + tooltipTextFontWeight: 'bold', + // -------------------- Geometry labels -------------------- + /** Geometry label 文本颜色 */ + labelFillColor: BLACK_COLORS[65], + labelFillColorDark: '#2c3542', + labelFillColorLight: '#ffffff', + /** Geometry label 文本字体大小 */ + labelFontSize: 12, + /** Geometry label 文本行高 */ + labelLineHeight: 12, + /** Geometry label 文本字体粗细 */ + labelFontWeight: 'normal', + /** Geometry label 文本描边颜色 */ + labelBorderColor: null, + /** Geometry label 文本描边粗细 */ + labelBorder: 0, + /** Geometry innerLabel 文本颜色 */ + innerLabelFillColor: WHITE_COLORS[100], + /** Geometry innerLabel 文本字体大小 */ + innerLabelFontSize: 12, + /** Geometry innerLabel 文本行高 */ + innerLabelLineHeight: 12, + /** Geometry innerLabel 文本字体粗细 */ + innerLabelFontWeight: 'normal', + /** Geometry innerLabel 文本描边颜色 */ + innerLabelBorderColor: null, + /** Geometry innerLabel 文本描边粗细 */ + innerLabelBorder: 0, + /** Geometry label 文本颜色 */ + overflowLabelFillColor: BLACK_COLORS[65], + overflowLabelFillColorDark: '#2c3542', + overflowLabelFillColorLight: '#ffffff', + /** Geometry label 文本字体大小 */ + overflowLabelFontSize: 12, + /** Geometry label 文本行高 */ + overflowLabelLineHeight: 12, + /** Geometry label 文本字体粗细 */ + overflowLabelFontWeight: 'normal', + /** Geometry label 文本描边颜色 */ + overflowLabelBorderColor: WHITE_COLORS[100], + /** Geometry label 文本描边粗细 */ + overflowLabelBorder: 1, + /** Geometry label　文本连接线粗细 */ + labelLineBorder: 1, + /** Geometry label 文本连接线颜色 */ + labelLineBorderColor: BLACK_COLORS[25], + // -------------------- Slider 组件样式-------------------- + /** slider 滑道高度 */ + cSliderRailHieght: 16, + /** slider 滑道背景色 */ + cSliderBackgroundFillColor: '#416180', + /** slider 滑道背景色透明度 */ + cSliderBackgroundFillOpacity: 0.05, + /** slider 滑道前景色 */ + cSliderForegroundFillColor: '#5B8FF9', + /** slider 滑道前景色透明度 */ + cSliderForegroundFillOpacity: 0.15, + // slider handlerStyle 手柄样式 + /** slider 手柄高度 */ + cSliderHandlerHeight: 24, + /** Slider 手柄宽度 */ + cSliderHandlerWidth: 10, + /** Slider 手柄背景色 */ + cSliderHandlerFillColor: '#F7F7F7', + /** Slider 手柄背景色透明度 */ + cSliderHandlerFillOpacity: 1, + /** Slider 手柄高亮背景色 */ + cSliderHandlerHighlightFillColor: '#FFF', + /** Slider 手柄边框色 */ + cSliderHandlerBorderColor: '#BFBFBF', + /** Slider 手柄边框粗细 */ + cSliderHandlerBorder: 1, + /** Slider 手柄边框圆角 */ + cSliderHandlerBorderRadius: 2, + // slider textStyle 字体标签样式 + /** Slider 字体标签颜色 */ + cSliderTextFillColor: '#fff', + /** Slider 字体标签透明度 */ + cSliderTextFillOpacity: 0.45, + /** Slider 字体标签大小 */ + cSliderTextFontSize: 12, + /** Slider 字体标签行高 */ + cSliderTextLineHeight: 12, + /** Slider 字体标签字重 */ + cSliderTextFontWeight: 'normal', + /** Slider 字体标签描边色 */ + cSliderTextBorderColor: null, + /** Slider 字体标签描边粗细 */ + cSliderTextBorder: 0, + // -------------------- Scrollbar 组件样式-------------------- + /** 滚动条 滚道填充色 */ + scrollbarTrackFillColor: 'rgba(255,255,255,0.65)', + /** 滚动条 滑块填充色 */ + scrollbarThumbFillColor: 'rgba(0,0,0,0.35)', + /** 滚动条 滑块高亮填充色 */ + scrollbarThumbHighlightFillColor: 'rgba(0,0,0,0.45)', + // -------------------- Geometry 图形样式-------------------- + /** 点图填充颜色 */ + pointFillColor: QUALITATIVE_10[0], + /** 点图填充颜色透明度 */ + pointFillOpacity: 0.95, + /** 点图大小 */ + pointSize: 4, + /** 点图描边粗细 */ + pointBorder: 1, + /** 点图描边颜色 */ + pointBorderColor: WHITE_COLORS[100], + /** 点图描边透明度 */ + pointBorderOpacity: 1, + /** 点图 active 状态下描边颜色 */ + pointActiveBorderColor: BLACK_COLORS[100], + /** 点图 selected 状态下描边粗细 */ + pointSelectedBorder: 2, + /** 点图 selected 状态下描边颜色 */ + pointSelectedBorderColor: BLACK_COLORS[100], + /** 点图 inactive 状态下填充颜色透明度 */ + pointInactiveFillOpacity: 0.3, + /** 点图 inactive 状态下描边透明度 */ + pointInactiveBorderOpacity: 0.3, + /** 空心点图大小 */ + hollowPointSize: 4, + /** 空心点图描边粗细 */ + hollowPointBorder: 1, + /** 空心点图描边颜色 */ + hollowPointBorderColor: QUALITATIVE_10[0], + /** 空心点图描边透明度 */ + hollowPointBorderOpacity: 0.95, + hollowPointFillColor: WHITE_COLORS[100], + /** 空心点图 active 状态下描边粗细 */ + hollowPointActiveBorder: 1, + /** 空心点图 active 状态下描边颜色 */ + hollowPointActiveBorderColor: BLACK_COLORS[100], + /** 空心点图 active 状态下描边透明度 */ + hollowPointActiveBorderOpacity: 1, + /** 空心点图 selected 状态下描边粗细 */ + hollowPointSelectedBorder: 2, + /** 空心点图 selected 状态下描边颜色 */ + hollowPointSelectedBorderColor: BLACK_COLORS[100], + /** 空心点图 selected 状态下描边透明度 */ + hollowPointSelectedBorderOpacity: 1, + /** 空心点图 inactive 状态下描边透明度 */ + hollowPointInactiveBorderOpacity: 0.3, + /** 线图粗细 */ + lineBorder: 2, + /** 线图颜色 */ + lineBorderColor: QUALITATIVE_10[0], + /** 线图透明度 */ + lineBorderOpacity: 1, + /** 线图 Active 状态下粗细 */ + lineActiveBorder: 3, + /** 线图 selected 状态下粗细 */ + lineSelectedBorder: 3, + /** 线图 inactive 状态下透明度 */ + lineInactiveBorderOpacity: 0.3, + /** area 填充颜色 */ + areaFillColor: QUALITATIVE_10[0], + /** area 填充透明度 */ + areaFillOpacity: 0.25, + /** area 在 active 状态下的填充透明度 */ + areaActiveFillColor: QUALITATIVE_10[0], + areaActiveFillOpacity: 0.5, + /** area 在 selected 状态下的填充透明度 */ + areaSelectedFillColor: QUALITATIVE_10[0], + areaSelectedFillOpacity: 0.5, + /** area inactive 状态下填充透明度 */ + areaInactiveFillOpacity: 0.3, + /** hollowArea 颜色 */ + hollowAreaBorderColor: QUALITATIVE_10[0], + /** hollowArea 边框粗细 */ + hollowAreaBorder: 2, + /** hollowArea 边框透明度 */ + hollowAreaBorderOpacity: 1, + /** hollowArea active 状态下的边框粗细 */ + hollowAreaActiveBorder: 3, + hollowAreaActiveBorderColor: BLACK_COLORS[100], + /** hollowArea selected 状态下的边框粗细 */ + hollowAreaSelectedBorder: 3, + hollowAreaSelectedBorderColor: BLACK_COLORS[100], + /** hollowArea inactive 状态下的边框透明度 */ + hollowAreaInactiveBorderOpacity: 0.3, + /** interval 填充颜色 */ + intervalFillColor: QUALITATIVE_10[0], + /** interval 填充透明度 */ + intervalFillOpacity: 0.95, + /** interval active 状态下边框粗细 */ + intervalActiveBorder: 1, + /** interval active 状态下边框颜色 */ + intervalActiveBorderColor: BLACK_COLORS[100], + intervalActiveBorderOpacity: 1, + /** interval selected 状态下边框粗细 */ + intervalSelectedBorder: 2, + /** interval selected 状态下边框颜色 */ + intervalSelectedBorderColor: BLACK_COLORS[100], + /** interval selected 状态下边框透明度 */ + intervalSelectedBorderOpacity: 1, + /** interval inactive 状态下边框透明度 */ + intervalInactiveBorderOpacity: 0.3, + /** interval inactive 状态下填充透明度 */ + intervalInactiveFillOpacity: 0.3, + /** interval 边框粗细 */ + hollowIntervalBorder: 2, + /** hollowInterval 边框颜色 */ + hollowIntervalBorderColor: QUALITATIVE_10[0], + /** hollowInterval 边框透明度 */ + hollowIntervalBorderOpacity: 1, + hollowIntervalFillColor: WHITE_COLORS[100], + /** hollowInterval active 状态下边框粗细 */ + hollowIntervalActiveBorder: 2, + /** hollowInterval active 状态下边框颜色 */ + hollowIntervalActiveBorderColor: BLACK_COLORS[100], + /** hollowInterval selected 状态下边框粗细 */ + hollowIntervalSelectedBorder: 3, + /** hollowInterval selected 状态下边框颜色 */ + hollowIntervalSelectedBorderColor: BLACK_COLORS[100], + /** hollowInterval selected 状态下边框透明度 */ + hollowIntervalSelectedBorderOpacity: 1, + /** hollowInterval inactive 状态下边框透明度 */ + hollowIntervalInactiveBorderOpacity: 0.3, + }; +}; +var antvDark = createDarkStyleSheet(); + +function getPixelRatio$1() { + return window ? window.devicePixelRatio : 1; +} +/** + * 两点之间的距离 + * @param {number} x1 起始点 x + * @param {number} y1 起始点 y + * @param {number} x2 结束点 x + * @param {number} y2 结束点 y + */ +function distance$5(x1, y1, x2, y2) { + var dx = x1 - x2; + var dy = y1 - y2; + return Math.sqrt(dx * dx + dy * dy); +} +/** + * 是否在包围盒内 + * @param {number} minX 包围盒开始的点 x + * @param {number} minY 包围盒开始的点 y + * @param {number} width 宽度 + * @param {number} height 高度 + * @param {[type]} x 检测点的 x + * @param {[type]} y 监测点的 y + */ +function inBox(minX, minY, width, height, x, y) { + return x >= minX && x <= minX + width && y >= minY && y <= minY + height; +} +function intersectRect$1(box1, box2) { + return !(box2.minX > box1.maxX || box2.maxX < box1.minX || box2.minY > box1.maxY || box2.maxY < box1.minY); +} +// 合并两个区域 +function mergeRegion(region1, region2) { + if (!region1 || !region2) { + return region1 || region2; + } + return { + minX: Math.min(region1.minX, region2.minX), + minY: Math.min(region1.minY, region2.minY), + maxX: Math.max(region1.maxX, region2.maxX), + maxY: Math.max(region1.maxY, region2.maxY), + }; +} +/** + * 判断两个点是否重合，点坐标的格式为 [x, y] + * @param {Array} point1 第一个点 + * @param {Array} point2 第二个点 + */ +function isSamePoint(point1, point2) { + return point1[0] === point2[0] && point1[1] === point2[1]; +} + +var regexLG$1 = /^l\s*\(\s*([\d.]+)\s*\)\s*(.*)/i; +var regexRG$1 = /^r\s*\(\s*([\d.]+)\s*,\s*([\d.]+)\s*,\s*([\d.]+)\s*\)\s*(.*)/i; +var regexPR$1 = /^p\s*\(\s*([axyn])\s*\)\s*(.*)/i; +var regexColorStop$1 = /[\d.]+:(#[^\s]+|[^\)]+\))/gi; +function addStop$1(steps, gradient) { + var arr = steps.match(regexColorStop$1); + each$2(arr, function (item) { + var itemArr = item.split(':'); + gradient.addColorStop(itemArr[0], itemArr[1]); + }); +} +/** + * 将边和填充设置的颜色转换成线性渐变对象 + * @param {CanvasRenderingContext2D} context canvas 上下文 + * @param {IElement} element 图形元素 + * @param {string} gradientStr 颜色 + * @returns {any} 渐变对象 + */ +function parseLineGradient$1(context, element, gradientStr) { + var arr = regexLG$1.exec(gradientStr); + var angle = (parseFloat(arr[1]) % 360) * (Math.PI / 180); + var steps = arr[2]; + var box = element.getBBox(); + var start; + var end; + if (angle >= 0 && angle < (1 / 2) * Math.PI) { + start = { + x: box.minX, + y: box.minY, + }; + end = { + x: box.maxX, + y: box.maxY, + }; + } + else if ((1 / 2) * Math.PI <= angle && angle < Math.PI) { + start = { + x: box.maxX, + y: box.minY, + }; + end = { + x: box.minX, + y: box.maxY, + }; + } + else if (Math.PI <= angle && angle < (3 / 2) * Math.PI) { + start = { + x: box.maxX, + y: box.maxY, + }; + end = { + x: box.minX, + y: box.minY, + }; + } + else { + start = { + x: box.minX, + y: box.maxY, + }; + end = { + x: box.maxX, + y: box.minY, + }; + } + var tanTheta = Math.tan(angle); + var tanTheta2 = tanTheta * tanTheta; + var x = (end.x - start.x + tanTheta * (end.y - start.y)) / (tanTheta2 + 1) + start.x; + var y = (tanTheta * (end.x - start.x + tanTheta * (end.y - start.y))) / (tanTheta2 + 1) + start.y; + var gradient = context.createLinearGradient(start.x, start.y, x, y); + addStop$1(steps, gradient); + return gradient; +} +/** + * 将边和填充设置的颜色转换成圆形渐变对象 + * @param {CanvasRenderingContext2D} context canvas 上下文 + * @param {IElement} element 图形元素 + * @param {string} gradientStr 颜色 + * @returns {any} 渐变对象 + */ +function parseRadialGradient$1(context, element, gradientStr) { + var arr = regexRG$1.exec(gradientStr); + var fx = parseFloat(arr[1]); + var fy = parseFloat(arr[2]); + var fr = parseFloat(arr[3]); + var steps = arr[4]; + // 环半径为0时，默认无渐变，取渐变序列的最后一个颜色 + if (fr === 0) { + var colors = steps.match(regexColorStop$1); + return colors[colors.length - 1].split(':')[1]; + } + var box = element.getBBox(); + var width = box.maxX - box.minX; + var height = box.maxY - box.minY; + var r = Math.sqrt(width * width + height * height) / 2; + var gradient = context.createRadialGradient(box.minX + width * fx, box.minY + height * fy, 0, box.minX + width / 2, box.minY + height / 2, fr * r); + addStop$1(steps, gradient); + return gradient; +} +/** + * 边和填充设置的颜色转换成 pattern + * @param {CanvasRenderingContext2D} context canvas 上下文 + * @param {IElement} element 图形元素 + * @param {string} patternStr 生成 pattern 的字符串 + */ +function parsePattern(context, element, patternStr) { + // 在转换过程中进行了缓存 + if (element.get('patternSource') && element.get('patternSource') === patternStr) { + return element.get('pattern'); + } + var pattern; + var img; + var arr = regexPR$1.exec(patternStr); + var repeat = arr[1]; + var source = arr[2]; + // Function to be called when pattern loads + function onload() { + // Create pattern + pattern = context.createPattern(img, repeat); + element.set('pattern', pattern); // be a cache + element.set('patternSource', patternStr); + } + switch (repeat) { + case 'a': + repeat = 'repeat'; + break; + case 'x': + repeat = 'repeat-x'; + break; + case 'y': + repeat = 'repeat-y'; + break; + case 'n': + repeat = 'no-repeat'; + break; + default: + repeat = 'no-repeat'; + } + img = new Image(); + // If source URL is not a data URL + if (!source.match(/^data:/i)) { + // Set crossOrigin for this image + img.crossOrigin = 'Anonymous'; + } + img.src = source; + if (img.complete) { + onload(); + } + else { + img.onload = onload; + // Fix onload() bug in IE9 + img.src = img.src; + } + return pattern; +} +function parseStyle(context, element, color) { + var bbox = element.getBBox(); + if (isNaN(bbox.x) || isNaN(bbox.y) || isNaN(bbox.width) || isNaN(bbox.height)) { + return color; + } + if (isString$3(color)) { + if (color[1] === '(' || color[2] === '(') { + if (color[0] === 'l') { + // regexLG.test(color) + return parseLineGradient$1(context, element, color); + } + if (color[0] === 'r') { + // regexRG.test(color) + return parseRadialGradient$1(context, element, color); + } + if (color[0] === 'p') { + // regexPR.test(color) + return parsePattern(context, element, color); + } + } + return color; + } + if (color instanceof CanvasPattern) { + return color; + } +} +function parseRadius$2(radius) { + var r1 = 0; + var r2 = 0; + var r3 = 0; + var r4 = 0; + if (isArray$n(radius)) { + if (radius.length === 1) { + r1 = r2 = r3 = r4 = radius[0]; + } + else if (radius.length === 2) { + r1 = r3 = radius[0]; + r2 = r4 = radius[1]; + } + else if (radius.length === 3) { + r1 = radius[0]; + r2 = r4 = radius[1]; + r3 = radius[2]; + } + else { + r1 = radius[0]; + r2 = radius[1]; + r3 = radius[2]; + r4 = radius[3]; + } + } + else { + r1 = r2 = r3 = r4 = radius; + } + return [r1, r2, r3, r4]; +} + +// 向量长度 +function vMag(v) { + return Math.sqrt(v[0] * v[0] + v[1] * v[1]); +} +// u.v/|u||v|，计算夹角的余弦值 +function vRatio(u, v) { + // 当存在一个向量的长度为 0 时，夹角也为 0，即夹角的余弦值为 1 + return vMag(u) * vMag(v) ? (u[0] * v[0] + u[1] * v[1]) / (vMag(u) * vMag(v)) : 1; +} +// 向量角度 +function vAngle(u, v) { + return (u[0] * v[1] < u[1] * v[0] ? -1 : 1) * Math.acos(vRatio(u, v)); +} +// A 0:rx 1:ry 2:x-axis-rotation 3:large-arc-flag 4:sweep-flag 5: x 6: y +function getArcParams(startPoint, params) { + var rx = params[1]; + var ry = params[2]; + var xRotation = mod$1(toRadian(params[3]), Math.PI * 2); + var arcFlag = params[4]; + var sweepFlag = params[5]; + // 弧形起点坐标 + var x1 = startPoint[0]; + var y1 = startPoint[1]; + // 弧形终点坐标 + var x2 = params[6]; + var y2 = params[7]; + var xp = (Math.cos(xRotation) * (x1 - x2)) / 2.0 + (Math.sin(xRotation) * (y1 - y2)) / 2.0; + var yp = (-1 * Math.sin(xRotation) * (x1 - x2)) / 2.0 + (Math.cos(xRotation) * (y1 - y2)) / 2.0; + var lambda = (xp * xp) / (rx * rx) + (yp * yp) / (ry * ry); + if (lambda > 1) { + rx *= Math.sqrt(lambda); + ry *= Math.sqrt(lambda); + } + var diff = rx * rx * (yp * yp) + ry * ry * (xp * xp); + var f = diff ? Math.sqrt((rx * rx * (ry * ry) - diff) / diff) : 1; + if (arcFlag === sweepFlag) { + f *= -1; + } + if (isNaN(f)) { + f = 0; + } + // 旋转前的起点坐标，且当长半轴和短半轴的长度为 0 时，坐标按 (0, 0) 处理 + var cxp = ry ? (f * rx * yp) / ry : 0; + var cyp = rx ? (f * -ry * xp) / rx : 0; + // 椭圆圆心坐标 + var cx = (x1 + x2) / 2.0 + Math.cos(xRotation) * cxp - Math.sin(xRotation) * cyp; + var cy = (y1 + y2) / 2.0 + Math.sin(xRotation) * cxp + Math.cos(xRotation) * cyp; + // 起始点的单位向量 + var u = [(xp - cxp) / rx, (yp - cyp) / ry]; + // 终止点的单位向量 + var v = [(-1 * xp - cxp) / rx, (-1 * yp - cyp) / ry]; + // 计算起始点和圆心的连线，与 x 轴正方向的夹角 + var theta = vAngle([1, 0], u); + // 计算圆弧起始点和终止点与椭圆圆心连线的夹角 + var dTheta = vAngle(u, v); + if (vRatio(u, v) <= -1) { + dTheta = Math.PI; + } + if (vRatio(u, v) >= 1) { + dTheta = 0; + } + if (sweepFlag === 0 && dTheta > 0) { + dTheta = dTheta - 2 * Math.PI; + } + if (sweepFlag === 1 && dTheta < 0) { + dTheta = dTheta + 2 * Math.PI; + } + return { + cx: cx, + cy: cy, + // 弧形的起点和终点相同时，长轴和短轴的长度按 0 处理 + rx: isSamePoint(startPoint, [x2, y2]) ? 0 : rx, + ry: isSamePoint(startPoint, [x2, y2]) ? 0 : ry, + startAngle: theta, + endAngle: theta + dTheta, + xRotation: xRotation, + arcFlag: arcFlag, + sweepFlag: sweepFlag, + }; +} + +var sin$1 = Math.sin, cos$1 = Math.cos, atan2 = Math.atan2, PI$1 = Math.PI; +function _addDefaultArrow(shape, attrs, x1, y1, x2, y2, isStart) { + var stroke = attrs.stroke, lineWidth = attrs.lineWidth; + var x = x1 - x2; + var y = y1 - y2; + var rad = atan2(y, x); + var arrowShape = new Path$4({ + type: 'path', + canvas: shape.get('canvas'), + isArrowShape: true, + attrs: { + // 默认箭头的边长为 10，夹角为 60 度 + path: "M" + 10 * cos$1(PI$1 / 6) + "," + 10 * sin$1(PI$1 / 6) + " L0,0 L" + 10 * cos$1(PI$1 / 6) + ",-" + 10 * sin$1(PI$1 / 6), + // 使用 shape stroke 值 + stroke: stroke, + lineWidth: lineWidth, + }, + }); + arrowShape.translate(x2, y2); + arrowShape.rotateAtPoint(x2, y2, rad); + shape.set(isStart ? 'startArrowShape' : 'endArrowShape', arrowShape); +} +/** + * 箭头 path 的设置要求 + * 1. 箭头顶点坐标需要为 (0, 0) + * 2. 箭头夹角的中心分割线需要与 X 轴正方向对齐 + */ +function _addCustomizedArrow(shape, attrs, x1, y1, x2, y2, isStart) { + var startArrow = attrs.startArrow, endArrow = attrs.endArrow, stroke = attrs.stroke, lineWidth = attrs.lineWidth; + var arrowAttrs = isStart ? startArrow : endArrow; + var d = arrowAttrs.d, arrowFill = arrowAttrs.fill, arrowStroke = arrowAttrs.stroke, arrowLineWidth = arrowAttrs.lineWidth, restAttrs = __rest$G(arrowAttrs, ["d", "fill", "stroke", "lineWidth"]); + var x = x1 - x2; + var y = y1 - y2; + var rad = atan2(y, x); + if (d) { + x2 = x2 - cos$1(rad) * d; + y2 = y2 - sin$1(rad) * d; + } + var arrowShape = new Path$4({ + type: 'path', + canvas: shape.get('canvas'), + isArrowShape: true, + attrs: __assign$r(__assign$r({}, restAttrs), { + // 支持单独设置箭头的 stroke 和 lineWidth，若为空则使用 shape 的值 + stroke: arrowStroke || stroke, lineWidth: arrowLineWidth || lineWidth, + // 箭头是否填充需要手动设置，不会继承自 shape 的值 + fill: arrowFill }), + }); + arrowShape.translate(x2, y2); + arrowShape.rotateAtPoint(x2, y2, rad); + shape.set(isStart ? 'startArrowShape' : 'endArrowShape', arrowShape); +} +/** + * 如果自定义箭头并且有 d 需要做偏移，如果直接画，线条会超出箭头尖端，因此需要根据箭头偏移 d, 返回线需要缩短的距离 + * |---------------- + * |<|-------------- + * | + * @param {number} x1 起始点 x + * @param {number} y1 起始点 y + * @param {number} x2 箭头作用点 x + * @param {number} y2 箭头作用点 y + * @param {number} d 箭头沿线条方向的偏移距离 + * @return {{dx: number, dy: number}} 返回线条偏移距离 + */ +function getShortenOffset(x1, y1, x2, y2, d) { + var rad = atan2(y2 - y1, x2 - x1); + return { + dx: cos$1(rad) * d, + dy: sin$1(rad) * d, + }; +} +/** + * 绘制起始箭头 + * @param {IShape} shape 图形 + * @param {ShapeAttrs} attrs shape 的绘图属性 + * @param {number} x1 起始点 x + * @param {number} y1 起始点 y + * @param {number} x2 箭头作用点 x + * @param {number} y2 箭头作用点 y + */ +function addStartArrow(shape, attrs, x1, y1, x2, y2) { + if (typeof attrs.startArrow === 'object') { + _addCustomizedArrow(shape, attrs, x1, y1, x2, y2, true); + } + else if (attrs.startArrow) { + _addDefaultArrow(shape, attrs, x1, y1, x2, y2, true); + } + else { + shape.set('startArrowShape', null); + } +} +/** + * 绘制结束箭头 + * @param {IShape} shape 图形 + * @param {ShapeAttrs} attrs shape 的绘图属性 + * @param {number} x1 起始点 x + * @param {number} y1 起始点 y + * @param {number} x2 箭头作用点 x + * @param {number} y2 箭头作用点 y + */ +function addEndArrow(shape, attrs, x1, y1, x2, y2) { + if (typeof attrs.endArrow === 'object') { + _addCustomizedArrow(shape, attrs, x1, y1, x2, y2, false); + } + else if (attrs.endArrow) { + _addDefaultArrow(shape, attrs, x1, y1, x2, y2, false); + } + else { + shape.set('startArrowShape', null); + } +} + +var SHAPE_ATTRS_MAP = { + fill: 'fillStyle', + stroke: 'strokeStyle', + opacity: 'globalAlpha', +}; +function applyAttrsToContext(context, element) { + var attrs = element.attr(); + for (var k in attrs) { + var v = attrs[k]; + // 转换一下不与 canvas 兼容的属性名 + var name_1 = SHAPE_ATTRS_MAP[k] ? SHAPE_ATTRS_MAP[k] : k; + if (name_1 === 'matrix' && v) { + // 设置矩阵 + context.transform(v[0], v[1], v[3], v[4], v[6], v[7]); + } + else if (name_1 === 'lineDash' && context.setLineDash) { + // 设置虚线，只支持数组形式，非数组形式不做任何操作 + isArray$n(v) && context.setLineDash(v); + } + else { + if (name_1 === 'strokeStyle' || name_1 === 'fillStyle') { + // 如果存在渐变、pattern 这个开销有些大 + // 可以考虑缓存机制，通过 hasUpdate 来避免一些运算 + v = parseStyle(context, element, v); + } + else if (name_1 === 'globalAlpha') { + // opacity 效果可以叠加，子元素的 opacity 需要与父元素 opacity 相乘 + v = v * context.globalAlpha; + } + context[name_1] = v; + } + } +} +function drawChildren$1(context, children, region) { + for (var i = 0; i < children.length; i++) { + var child = children[i]; + if (child.cfg.visible) { + child.draw(context, region); + } + else { + child.skipDraw(); + } + } +} +// 这个地方的逻辑比较复杂，简单画了一张图：https://www.yuque.com/antv/ou292n/pcgt5g#OW1QE +function checkRefresh(canvas, children, region) { + var refreshElements = canvas.get('refreshElements'); + // 先遍历需要刷新的元素，将这些元素的父元素也设置 refresh + each$2(refreshElements, function (el) { + if (el !== canvas) { + var parent_1 = el.cfg.parent; + while (parent_1 && parent_1 !== canvas && !parent_1.cfg.refresh) { + parent_1.cfg.refresh = true; + parent_1 = parent_1.cfg.parent; + } + } + }); + if (refreshElements[0] === canvas) { + setChildrenRefresh(children); + } + else { + // 检查所有子元素是否可以刷新 + checkChildrenRefresh(children, region); + } +} +// 检查所有的子元素是否应该更新 +function checkChildrenRefresh(children, region) { + for (var i = 0; i < children.length; i++) { + var child = children[i]; + if (child.cfg.visible) { + // 先判断 hasChanged，因为它的优先级判断应该高于 refresh + if (child.cfg.hasChanged) { + // 如果节点发生了 change，则需要级联设置子元素的 refresh + child.cfg.refresh = true; + if (child.isGroup()) { + setChildrenRefresh(child.cfg.children); + } + } + else if (child.cfg.refresh) { + // 如果当前图形/分组 refresh = true，说明其子节点存在 changed + if (child.isGroup()) { + checkChildrenRefresh(child.cfg.children, region); + } + } + else { + // 这个分支说明此次局部刷新，所有的节点和父元素没有发生变化，仅需要检查包围盒（缓存）是否相交即可 + var refresh = checkElementRefresh(child, region); + child.cfg.refresh = refresh; + if (refresh && child.isGroup()) { + // 如果需要刷新，说明子元素也需要刷新，继续进行判定 + checkChildrenRefresh(child.cfg.children, region); + } + } + } + } +} +// 由于对改变的图形放入 refreshElements 时做了优化，判定父元素 changed 时不加入 +// 那么有可能会出现 elements 都为空，所以最终 group +function clearChanged(elements) { + for (var i = 0; i < elements.length; i++) { + var el = elements[i]; + el.cfg.hasChanged = false; + // 级联清理 + if (el.isGroup() && !el.destroyed) { + clearChanged(el.cfg.children); + } + } +} +// 当某个父元素发生改变时，调用这个方法级联设置 refresh +function setChildrenRefresh(children, region) { + for (var i = 0; i < children.length; i++) { + var child = children[i]; + // let refresh = true; + // 获取缓存的 bbox，如果这个 bbox 还存在则说明父元素不是矩阵发生了改变 + // const bbox = child.cfg.canvasBBox; + // if (bbox) { + // // 如果这时候 + // refresh = intersectRect(bbox, region); + // } + child.cfg.refresh = true; + // 如果需要刷新当前节点，所有的子元素设置 refresh + if (child.isGroup()) { + setChildrenRefresh(child.get('children')); + } + } +} +function checkElementRefresh(shape, region) { + var bbox = shape.cfg.cacheCanvasBBox; + var isAllow = shape.cfg.isInView && bbox && intersectRect$1(bbox, region); + return isAllow; +} +// 绘制 path +function drawPath(shape, context, attrs, arcParamsCache) { + var path = attrs.path, startArrow = attrs.startArrow, endArrow = attrs.endArrow; + if (!path) { + return; + } + var currentPoint = [0, 0]; // 当前图形 + var startMovePoint = [0, 0]; // 开始 M 的点，可能会有多个 + var distance = { + dx: 0, + dy: 0, + }; + context.beginPath(); + for (var i = 0; i < path.length; i++) { + var params = path[i]; + var command = params[0]; + if (i === 0 && startArrow && startArrow.d) { + var tangent = shape.getStartTangent(); + distance = getShortenOffset(tangent[0][0], tangent[0][1], tangent[1][0], tangent[1][1], startArrow.d); + } + else if (i === path.length - 2 && path[i + 1][0] === 'Z' && endArrow && endArrow.d) { + // 为了防止结尾为 Z 的 segment 缩短不起效，需要取最后两个 segment 特殊处理 + var lastPath = path[i + 1]; + if (lastPath[0] === 'Z') { + var tangent = shape.getEndTangent(); + distance = getShortenOffset(tangent[0][0], tangent[0][1], tangent[1][0], tangent[1][1], endArrow.d); + } + } + else if (i === path.length - 1 && endArrow && endArrow.d) { + if (path[0] !== 'Z') { + var tangent = shape.getEndTangent(); + distance = getShortenOffset(tangent[0][0], tangent[0][1], tangent[1][0], tangent[1][1], endArrow.d); + } + } + var dx = distance.dx, dy = distance.dy; + // V,H,S,T 都在前面被转换成标准形式 + switch (command) { + case 'M': + context.moveTo(params[1] - dx, params[2] - dy); + startMovePoint = [params[1], params[2]]; + break; + case 'L': + context.lineTo(params[1] - dx, params[2] - dy); + break; + case 'Q': + context.quadraticCurveTo(params[1], params[2], params[3] - dx, params[4] - dy); + break; + case 'C': + context.bezierCurveTo(params[1], params[2], params[3], params[4], params[5] - dx, params[6] - dy); + break; + case 'A': { + var arcParams = void 0; + // 为了加速绘制，可以提供参数的缓存，各个图形自己缓存 + if (arcParamsCache) { + arcParams = arcParamsCache[i]; + if (!arcParams) { + arcParams = getArcParams(currentPoint, params); + arcParamsCache[i] = arcParams; + } + } + else { + arcParams = getArcParams(currentPoint, params); + } + var cx = arcParams.cx, cy = arcParams.cy, rx = arcParams.rx, ry = arcParams.ry, startAngle = arcParams.startAngle, endAngle = arcParams.endAngle, xRotation = arcParams.xRotation, sweepFlag = arcParams.sweepFlag; + // 直接使用椭圆的 api + if (context.ellipse) { + context.ellipse(cx, cy, rx, ry, xRotation, startAngle, endAngle, 1 - sweepFlag); + } + else { + var r = rx > ry ? rx : ry; + var scaleX = rx > ry ? 1 : rx / ry; + var scaleY = rx > ry ? ry / rx : 1; + context.translate(cx, cy); + context.rotate(xRotation); + context.scale(scaleX, scaleY); + context.arc(0, 0, r, startAngle, endAngle, 1 - sweepFlag); + context.scale(1 / scaleX, 1 / scaleY); + context.rotate(-xRotation); + context.translate(-cx, -cy); + } + break; + } + case 'Z': + context.closePath(); + break; + } + // 有了 Z 后，当前节点从开始 M 的点开始 + if (command === 'Z') { + currentPoint = startMovePoint; + } + else { + var len = params.length; + currentPoint = [params[len - 2], params[len - 1]]; + } + } +} +// 刷新图形元素(Shape 或者 Group) +function refreshElement$1(element, changeType) { + var canvas = element.get('canvas'); + // 只有存在于 canvas 上时生效 + if (canvas) { + if (changeType === 'remove') { + // 一旦 remove，则无法在 element 上拿到包围盒 + // destroy 后所有属性都拿不到，所以需要暂存一下 + // 这是一段 hack 的代码 + element._cacheCanvasBBox = element.get('cacheCanvasBBox'); + } + // 防止反复刷新 + if (!element.get('hasChanged')) { + // 但是始终要标记为 hasChanged，便于后面进行局部渲染 + element.set('hasChanged', true); + // 本来只有局部渲染模式下，才需要记录更新的元素队列 + // if (canvas.get('localRefresh')) { + // canvas.refreshElement(element, changeType, canvas); + // } + // 但对于 https://github.com/antvis/g/issues/422 的场景，全局渲染的模式下也需要记录更新的元素队列 + // 如果当前元素的父元素发生了改变，可以不放入队列，这句话大概能够提升 15% 的初次渲染性能 + if (!(element.cfg.parent && element.cfg.parent.get('hasChanged'))) { + canvas.refreshElement(element, changeType, canvas); + if (canvas.get('autoDraw')) { + canvas.draw(); + } + } + } + } +} +function getRefreshRegion(element) { + var region; + if (!element.destroyed) { + var cacheBox = element.get('cacheCanvasBBox'); + var validCache = cacheBox && !!(cacheBox.width && cacheBox.height); + var bbox = element.getCanvasBBox(); + var validBBox = bbox && !!(bbox.width && bbox.height); + // 是否是有效 bbox 判定，一些 NaN 或者 宽高为 0 的情况过滤掉 + if (validCache && validBBox) { + region = mergeRegion(cacheBox, bbox); + } + else if (validCache) { + region = cacheBox; + } + else if (validBBox) { + region = bbox; + } + } + else { + // 因为元素已经销毁所以无法获取到缓存的包围盒 + region = element['_cacheCanvasBBox']; + } + return region; +} +function getMergedRegion(elements) { + if (!elements.length) { + return null; + } + var minXArr = []; + var minYArr = []; + var maxXArr = []; + var maxYArr = []; + each$2(elements, function (el) { + var region = getRefreshRegion(el); + if (region) { + minXArr.push(region.minX); + minYArr.push(region.minY); + maxXArr.push(region.maxX); + maxYArr.push(region.maxY); + } + }); + return { + minX: min$6(minXArr), + minY: min$6(minYArr), + maxX: max$7(maxXArr), + maxY: max$7(maxYArr), + }; +} +function mergeView(region, viewRegion) { + if (!region || !viewRegion) { + return null; + } + // 不相交，则直接返回 null + if (!intersectRect$1(region, viewRegion)) { + return null; + } + return { + minX: Math.max(region.minX, viewRegion.minX), + minY: Math.max(region.minY, viewRegion.minY), + maxX: Math.min(region.maxX, viewRegion.maxX), + maxY: Math.min(region.maxY, viewRegion.maxY), + }; +} + +var Group$1 = /** @class */ (function (_super) { + __extends$e(Group, _super); + function Group() { + return _super !== null && _super.apply(this, arguments) || this; + } + /** + * 一些方法调用会引起画布变化 + * @param {ChangeType} changeType 改变的类型 + */ + Group.prototype.onCanvasChange = function (changeType) { + refreshElement$1(this, changeType); + }; + Group.prototype.getShapeBase = function () { + return Shape$2; + }; + Group.prototype.getGroupBase = function () { + return Group; + }; + // 同 shape 中的方法重复了 + Group.prototype._applyClip = function (context, clip) { + if (clip) { + context.save(); + // 将 clip 的属性挂载到 context 上 + applyAttrsToContext(context, clip); + // 绘制 clip 路径 + clip.createPath(context); + context.restore(); + // 裁剪 + context.clip(); + clip._afterDraw(); + } + }; + // 这个方法以前直接使用的 getCanvasBBox，由于 group 上没有缓存，所以每次重新计算，导致性能开销比较大 + // 大概能够节省全局渲染 15-20% 的性能，如果不在这里加缓存优化后 10W 个节点无法达到 5-6 ms，大概能够 30-40ms + Group.prototype.cacheCanvasBBox = function () { + var children = this.cfg.children; + var xArr = []; + var yArr = []; + each$2(children, function (child) { + var bbox = child.cfg.cacheCanvasBBox; + // isInview 的判定是一旦图形或者分组渲染就要计算是否在视图内， + // 这个判定 10W 个图形下差不多能够节省 5-6 ms 的开销 + if (bbox && child.cfg.isInView) { + xArr.push(bbox.minX, bbox.maxX); + yArr.push(bbox.minY, bbox.maxY); + } + }); + var bbox = null; + if (xArr.length) { + var minX = min$6(xArr); + var maxX = max$7(xArr); + var minY = min$6(yArr); + var maxY = max$7(yArr); + bbox = { + minX: minX, + minY: minY, + x: minX, + y: minY, + maxX: maxX, + maxY: maxY, + width: maxX - minX, + height: maxY - minY, + }; + var canvas = this.cfg.canvas; + if (canvas) { + var viewRange = canvas.getViewRange(); + // 如果这个地方判定 isInView == false 设置 bbox 为 false 的话，拾取的性能会更高 + // 但是目前 10W 图形的拾取在 2-5ms 内，这个优化意义不大，可以后期观察再看 + this.set('isInView', intersectRect$1(bbox, viewRange)); + } + } + else { + this.set('isInView', false); + } + this.set('cacheCanvasBBox', bbox); + }; + Group.prototype.draw = function (context, region) { + var children = this.cfg.children; + var allowDraw = region ? this.cfg.refresh : true; // 局部刷新需要判定 + // 这个地方需要判定，在 G6 的场景每个 group 都有 transform 的场景下性能会开销非常大 + // 通过 refresh 的判定，可以不刷新没有发生过变化的分组，不在视窗内的分组等等 + // 如果想进一步提升局部渲染性能，可以进一步优化 refresh 的判定，依然有潜力 + if (children.length && allowDraw) { + context.save(); + // group 上的矩阵和属性也会应用到上下文上 + // 先将 attrs 应用到上下文中，再设置 clip。因为 clip 应该被当前元素的 matrix 所影响 + applyAttrsToContext(context, this); + this._applyClip(context, this.getClip()); + drawChildren$1(context, children, region); + context.restore(); + this.cacheCanvasBBox(); + } + // 这里的成本比较大，如果不绘制则不再 + // this.set('cacheCanvasBBox', this.getCanvasBBox()); + this.cfg.refresh = null; + // 绘制后，消除更新标记 + this.set('hasChanged', false); + }; + // 绘制时被跳过，一般发生在分组隐藏时 + Group.prototype.skipDraw = function () { + this.set('cacheCanvasBBox', null); + this.set('hasChanged', false); + }; + return Group; +}(AbstractGroup)); + +var ShapeBase$2 = /** @class */ (function (_super) { + __extends$e(ShapeBase, _super); + function ShapeBase() { + return _super !== null && _super.apply(this, arguments) || this; + } + ShapeBase.prototype.getDefaultAttrs = function () { + var attrs = _super.prototype.getDefaultAttrs.call(this); + // 设置默认值 + return __assign$r(__assign$r({}, attrs), { lineWidth: 1, lineAppendWidth: 0, strokeOpacity: 1, fillOpacity: 1 }); + }; + ShapeBase.prototype.getShapeBase = function () { + return Shape$2; + }; + ShapeBase.prototype.getGroupBase = function () { + return Group$1; + }; + /** + * 一些方法调用会引起画布变化 + * @param {ChangeType} changeType 改变的类型 + */ + ShapeBase.prototype.onCanvasChange = function (changeType) { + refreshElement$1(this, changeType); + }; + ShapeBase.prototype.calculateBBox = function () { + var type = this.get('type'); + var lineWidth = this.getHitLineWidth(); + // const attrs = this.attr(); + var bboxMethod = getMethod(type); + var box = bboxMethod(this); + var halfLineWidth = lineWidth / 2; + var minX = box.x - halfLineWidth; + var minY = box.y - halfLineWidth; + var maxX = box.x + box.width + halfLineWidth; + var maxY = box.y + box.height + halfLineWidth; + return { + x: minX, + minX: minX, + y: minY, + minY: minY, + width: box.width + lineWidth, + height: box.height + lineWidth, + maxX: maxX, + maxY: maxY, + }; + }; + ShapeBase.prototype.isFill = function () { + return !!this.attrs['fill'] || this.isClipShape(); + }; + ShapeBase.prototype.isStroke = function () { + return !!this.attrs['stroke']; + }; + // 同 shape 中的方法重复了 + ShapeBase.prototype._applyClip = function (context, clip) { + if (clip) { + context.save(); + // 将 clip 的属性挂载到 context 上 + applyAttrsToContext(context, clip); + // 绘制 clip 路径 + clip.createPath(context); + context.restore(); + // 裁剪 + context.clip(); + clip._afterDraw(); + } + }; + // 绘制图形时需要考虑 region 限制 + ShapeBase.prototype.draw = function (context, region) { + var clip = this.cfg.clipShape; + // 如果指定了 region，同时不允许刷新时，直接返回 + if (region) { + if (this.cfg.refresh === false) { + // this._afterDraw(); + this.set('hasChanged', false); + return; + } + // 是否相交需要考虑 clip 的包围盒 + var bbox = this.getCanvasBBox(); + if (!intersectRect$1(region, bbox)) { + // 图形的包围盒与重绘区域不相交时，也需要清除标记 + this.set('hasChanged', false); + // 存在多种情形需要更新 cacheCanvasBBox 和 isInview 的判定 + // 1. 之前图形在视窗内，但是现在不再视窗内 + // 2. 如果当前的图形以及父元素都没有发生过变化，refresh = false 不会走到这里，所以这里的图形都是父元素发生变化，但是没有在视图内的元素 + if (this.cfg.isInView) { + this._afterDraw(); + } + return; + } + } + context.save(); + // 先将 attrs 应用到上下文中，再设置 clip。因为 clip 应该被当前元素的 matrix 所影响 + applyAttrsToContext(context, this); + this._applyClip(context, clip); + this.drawPath(context); + context.restore(); + this._afterDraw(); + }; + ShapeBase.prototype.getCanvasViewBox = function () { + var canvas = this.cfg.canvas; + if (canvas) { + // @ts-ignore + return canvas.getViewRange(); + } + return null; + }; + ShapeBase.prototype.cacheCanvasBBox = function () { + var canvasBBox = this.getCanvasViewBox(); + // 绘制的时候缓存包围盒 + if (canvasBBox) { + var bbox = this.getCanvasBBox(); + var isInView = intersectRect$1(bbox, canvasBBox); + this.set('isInView', isInView); + // 不再视窗内 cacheCanvasBBox 设置成 null，会提升局部渲染的性能， + // 因为在局部渲染影响的包围盒计算时不考虑这个图形的包围盒 + // 父元素 cacheCanvasBBox 计算的时候也不计算 + if (isInView) { + this.set('cacheCanvasBBox', bbox); + } + else { + this.set('cacheCanvasBBox', null); + } + } + }; + ShapeBase.prototype._afterDraw = function () { + this.cacheCanvasBBox(); + // 绘制后消除标记 + this.set('hasChanged', false); + this.set('refresh', null); + }; + ShapeBase.prototype.skipDraw = function () { + this.set('cacheCanvasBBox', null); + this.set('isInView', null); + this.set('hasChanged', false); + }; + /** + * 绘制图形的路径 + * @param {CanvasRenderingContext2D} context 上下文 + */ + ShapeBase.prototype.drawPath = function (context) { + this.createPath(context); + this.strokeAndFill(context); + this.afterDrawPath(context); + }; + /** + * @protected + * 填充图形 + * @param {CanvasRenderingContext2D} context context 上下文 + */ + ShapeBase.prototype.fill = function (context) { + context.fill(); + }; + /** + * @protected + * 绘制图形边框 + * @param {CanvasRenderingContext2D} context context 上下文 + */ + ShapeBase.prototype.stroke = function (context) { + context.stroke(); + }; + // 绘制或者填充 + ShapeBase.prototype.strokeAndFill = function (context) { + var _a = this.attrs, lineWidth = _a.lineWidth, opacity = _a.opacity, strokeOpacity = _a.strokeOpacity, fillOpacity = _a.fillOpacity; + if (this.isFill()) { + if (!isNil(fillOpacity) && fillOpacity !== 1) { + context.globalAlpha = fillOpacity; + this.fill(context); + context.globalAlpha = opacity; + } + else { + this.fill(context); + } + } + if (this.isStroke()) { + if (lineWidth > 0) { + if (!isNil(strokeOpacity) && strokeOpacity !== 1) { + context.globalAlpha = strokeOpacity; + } + this.stroke(context); + } + } + this.afterDrawPath(context); + }; + /** + * @protected + * 绘制图形的路径 + * @param {CanvasRenderingContext2D} context 上下文 + */ + ShapeBase.prototype.createPath = function (context) { }; + /** + * 绘制完成 path 后的操作 + * @param {CanvasRenderingContext2D} context 上下文 + */ + ShapeBase.prototype.afterDrawPath = function (context) { }; + ShapeBase.prototype.isInShape = function (refX, refY) { + // return HitUtil.isHitShape(this, refX, refY); + var isStroke = this.isStroke(); + var isFill = this.isFill(); + var lineWidth = this.getHitLineWidth(); + return this.isInStrokeOrPath(refX, refY, isStroke, isFill, lineWidth); + }; + // 之所以不拆成 isInStroke 和 isInPath 在于两者存在一些共同的计算 + ShapeBase.prototype.isInStrokeOrPath = function (x, y, isStroke, isFill, lineWidth) { + return false; + }; + /** + * 获取线拾取的宽度 + * @returns {number} 线的拾取宽度 + */ + ShapeBase.prototype.getHitLineWidth = function () { + if (!this.isStroke()) { + return 0; + } + var attrs = this.attrs; + return attrs['lineWidth'] + attrs['lineAppendWidth']; + }; + return ShapeBase; +}(AbstractShape)); +var ShapeBase$3 = ShapeBase$2; + +/** + * @fileoverview 圆 + * @author dxq613@gmail.com + */ +var Circle$3 = /** @class */ (function (_super) { + __extends$e(Circle, _super); + function Circle() { + return _super !== null && _super.apply(this, arguments) || this; + } + Circle.prototype.getDefaultAttrs = function () { + var attrs = _super.prototype.getDefaultAttrs.call(this); + return __assign$r(__assign$r({}, attrs), { x: 0, y: 0, r: 0 }); + }; + Circle.prototype.isInStrokeOrPath = function (x, y, isStroke, isFill, lineWidth) { + var attrs = this.attr(); + var cx = attrs.x; + var cy = attrs.y; + var r = attrs.r; + var halfLineWidth = lineWidth / 2; + var absDistance = distance$5(cx, cy, x, y); + // 直接用距离，如果同时存在边和填充时，可以减少两次计算 + if (isFill && isStroke) { + return absDistance <= r + halfLineWidth; + } + if (isFill) { + return absDistance <= r; + } + if (isStroke) { + return absDistance >= r - halfLineWidth && absDistance <= r + halfLineWidth; + } + return false; + }; + Circle.prototype.createPath = function (context) { + var attrs = this.attr(); + var cx = attrs.x; + var cy = attrs.y; + var r = attrs.r; + context.beginPath(); + context.arc(cx, cy, r, 0, Math.PI * 2, false); + context.closePath(); + }; + return Circle; +}(ShapeBase$3)); +var Circle$4 = Circle$3; + +/** + * @fileoverview 椭圆 + * @author dxq613@gmail.com + */ +// 根据椭圆公式计算 x*x/rx*rx + y*y/ry*ry; +function ellipseDistance(squareX, squareY, rx, ry) { + return squareX / (rx * rx) + squareY / (ry * ry); +} +var Ellipse$2 = /** @class */ (function (_super) { + __extends$e(Ellipse, _super); + function Ellipse() { + return _super !== null && _super.apply(this, arguments) || this; + } + Ellipse.prototype.getDefaultAttrs = function () { + var attrs = _super.prototype.getDefaultAttrs.call(this); + return __assign$r(__assign$r({}, attrs), { x: 0, y: 0, rx: 0, ry: 0 }); + }; + Ellipse.prototype.isInStrokeOrPath = function (x, y, isStroke, isFill, lineWidth) { + var attrs = this.attr(); + var halfLineWith = lineWidth / 2; + var cx = attrs.x; + var cy = attrs.y; + var rx = attrs.rx, ry = attrs.ry; + var squareX = (x - cx) * (x - cx); + var squareY = (y - cy) * (y - cy); + // 使用椭圆的公式： x*x/rx*rx + y*y/ry*ry = 1; + if (isFill && isStroke) { + return ellipseDistance(squareX, squareY, rx + halfLineWith, ry + halfLineWith) <= 1; + } + if (isFill) { + return ellipseDistance(squareX, squareY, rx, ry) <= 1; + } + if (isStroke) { + return (ellipseDistance(squareX, squareY, rx - halfLineWith, ry - halfLineWith) >= 1 && + ellipseDistance(squareX, squareY, rx + halfLineWith, ry + halfLineWith) <= 1); + } + return false; + }; + Ellipse.prototype.createPath = function (context) { + var attrs = this.attr(); + var cx = attrs.x; + var cy = attrs.y; + var rx = attrs.rx; + var ry = attrs.ry; + context.beginPath(); + // 兼容逻辑 + if (context.ellipse) { + context.ellipse(cx, cy, rx, ry, 0, 0, Math.PI * 2, false); + } + else { + // 如果不支持，则使用圆来绘制，进行变形 + var r = rx > ry ? rx : ry; + var scaleX = rx > ry ? 1 : rx / ry; + var scaleY = rx > ry ? ry / rx : 1; + context.save(); + context.translate(cx, cy); + context.scale(scaleX, scaleY); + context.arc(0, 0, r, 0, Math.PI * 2); + context.restore(); + context.closePath(); + } + }; + return Ellipse; +}(ShapeBase$3)); +var Ellipse$3 = Ellipse$2; + +/** + * @fileoverview 图片 + * @author dxq613@gmail.com + */ +function isCanvas(dom) { + return dom instanceof HTMLElement && isString$3(dom.nodeName) && dom.nodeName.toUpperCase() === 'CANVAS'; +} +var ImageShape = /** @class */ (function (_super) { + __extends$e(ImageShape, _super); + function ImageShape() { + return _super !== null && _super.apply(this, arguments) || this; + } + ImageShape.prototype.getDefaultAttrs = function () { + var attrs = _super.prototype.getDefaultAttrs.call(this); + return __assign$r(__assign$r({}, attrs), { x: 0, y: 0, width: 0, height: 0 }); + }; + ImageShape.prototype.initAttrs = function (attrs) { + this._setImage(attrs.img); + }; + // image 不计算 stroke + ImageShape.prototype.isStroke = function () { + return false; + }; + // 仅仅使用包围盒检测来进行拾取 + // 所以不需要复写 isInStrokeOrPath 的方法 + ImageShape.prototype.isOnlyHitBox = function () { + return true; + }; + ImageShape.prototype._afterLoading = function () { + if (this.get('toDraw') === true) { + var canvas = this.get('canvas'); + if (canvas) { + // 这段应该改成局部渲染 + canvas.draw(); + } + else { + // 这种方式如果发生遮挡会出现问题 + this.createPath(this.get('context')); + } + } + }; + ImageShape.prototype._setImage = function (img) { + var _this = this; + var attrs = this.attrs; + if (isString$3(img)) { + var image_1 = new Image(); + image_1.onload = function () { + // 图片未加载完，则已经被销毁 + if (_this.destroyed) { + return false; + } + // 缓存原始地址，可以做对比，防止重复加载图片 + // 如果考虑到在加载过程中可能替换 img 属性，则情况更加复杂 + // this.set('imgSrc', img); + // 这里会循环调用 _setImage 方法，但不会再走这个分支 + _this.attr('img', image_1); + _this.set('loading', false); + _this._afterLoading(); + var callback = _this.get('callback'); + if (callback) { + callback.call(_this); + } + }; + // 设置跨域 + image_1.crossOrigin = 'Anonymous'; + image_1.src = img; + // loading 过程中不绘制 + this.set('loading', true); + } + else if (img instanceof Image) { + // 如果是一个 image 对象，则设置宽高 + if (!attrs.width) { + attrs.width = img.width; + } + if (!attrs.height) { + attrs.height = img.height; + } + } + else if (isCanvas(img)) { + // 如果设置了 canvas 对象 + if (!attrs.width) { + attrs.width = Number(img.getAttribute('width')); + } + if (!attrs.height) { + attrs.height, Number(img.getAttribute('height')); + } + } + }; + ImageShape.prototype.onAttrChange = function (name, value, originValue) { + _super.prototype.onAttrChange.call(this, name, value, originValue); + // 如果加载的已经是当前图片，则不再处理 + if (name === 'img') { + // 可以加缓冲，&& this.get('imgSrc') !== value + this._setImage(value); + } + }; + ImageShape.prototype.createPath = function (context) { + // 正在加载则不绘制 + if (this.get('loading')) { + this.set('toDraw', true); // 加载完成后绘制 + this.set('context', context); + return; + } + var attrs = this.attr(); + var x = attrs.x, y = attrs.y, width = attrs.width, height = attrs.height, sx = attrs.sx, sy = attrs.sy, swidth = attrs.swidth, sheight = attrs.sheight; + var img = attrs.img; + if (img instanceof Image || isCanvas(img)) { + if (!isNil(sx) && !isNil(sy) && !isNil(swidth) && !isNil(sheight)) { + context.drawImage(img, sx, sy, swidth, sheight, x, y, width, height); + } + else { + context.drawImage(img, x, y, width, height); + } + } + }; + return ImageShape; +}(ShapeBase$3)); +var ImageShape$1 = ImageShape; + +function inLine(x1, y1, x2, y2, lineWidth, x, y) { + var minX = Math.min(x1, x2); + var maxX = Math.max(x1, x2); + var minY = Math.min(y1, y2); + var maxY = Math.max(y1, y2); + var halfWidth = lineWidth / 2; + // 因为目前的方案是计算点到直线的距离，而有可能会在延长线上，所以要先判断是否在包围盒内 + // 这种方案会在水平或者竖直的情况下载线的延长线上有半 lineWidth 的误差 + if (!(x >= minX - halfWidth && x <= maxX + halfWidth && y >= minY - halfWidth && y <= maxY + halfWidth)) { + return false; + } + // 因为已经计算了包围盒，所以仅需要计算到直线的距离即可，可以显著提升性能 + return LineUtil.pointToLine(x1, y1, x2, y2, x, y) <= lineWidth / 2; +} + +var Line$7 = /** @class */ (function (_super) { + __extends$e(Line, _super); + function Line() { + return _super !== null && _super.apply(this, arguments) || this; + } + Line.prototype.getDefaultAttrs = function () { + var attrs = _super.prototype.getDefaultAttrs.call(this); + return __assign$r(__assign$r({}, attrs), { x1: 0, y1: 0, x2: 0, y2: 0, startArrow: false, endArrow: false }); + }; + Line.prototype.initAttrs = function (attrs) { + this.setArrow(); + }; + // 更新属性时，检测是否更改了箭头 + Line.prototype.onAttrChange = function (name, value, originValue) { + _super.prototype.onAttrChange.call(this, name, value, originValue); + // 由于箭头的绘制依赖于 line 的诸多 attrs，因此这里不再对每个 attr 进行判断，attr 每次变化都会影响箭头的更新 + this.setArrow(); + }; + Line.prototype.setArrow = function () { + var attrs = this.attr(); + var x1 = attrs.x1, y1 = attrs.y1, x2 = attrs.x2, y2 = attrs.y2, startArrow = attrs.startArrow, endArrow = attrs.endArrow; + if (startArrow) { + addStartArrow(this, attrs, x2, y2, x1, y1); + } + if (endArrow) { + addEndArrow(this, attrs, x1, y1, x2, y2); + } + }; + Line.prototype.isInStrokeOrPath = function (x, y, isStroke, isFill, lineWidth) { + if (!isStroke || !lineWidth) { + return false; + } + var _a = this.attr(), x1 = _a.x1, y1 = _a.y1, x2 = _a.x2, y2 = _a.y2; + return inLine(x1, y1, x2, y2, lineWidth, x, y); + }; + Line.prototype.createPath = function (context) { + var attrs = this.attr(); + var x1 = attrs.x1, y1 = attrs.y1, x2 = attrs.x2, y2 = attrs.y2, startArrow = attrs.startArrow, endArrow = attrs.endArrow; + var startArrowDistance = { + dx: 0, + dy: 0, + }; + var endArrowDistance = { + dx: 0, + dy: 0, + }; + if (startArrow && startArrow.d) { + startArrowDistance = getShortenOffset(x1, y1, x2, y2, attrs.startArrow.d); + } + if (endArrow && endArrow.d) { + endArrowDistance = getShortenOffset(x1, y1, x2, y2, attrs.endArrow.d); + } + context.beginPath(); + // 如果自定义箭头，线条相应缩进 + context.moveTo(x1 + startArrowDistance.dx, y1 + startArrowDistance.dy); + context.lineTo(x2 - endArrowDistance.dx, y2 - endArrowDistance.dy); + }; + Line.prototype.afterDrawPath = function (context) { + var startArrowShape = this.get('startArrowShape'); + var endArrowShape = this.get('endArrowShape'); + if (startArrowShape) { + startArrowShape.draw(context); + } + if (endArrowShape) { + endArrowShape.draw(context); + } + }; + /** + * Get length of line + * @return {number} length + */ + Line.prototype.getTotalLength = function () { + var _a = this.attr(), x1 = _a.x1, y1 = _a.y1, x2 = _a.x2, y2 = _a.y2; + return LineUtil.length(x1, y1, x2, y2); + }; + /** + * Get point according to ratio + * @param {number} ratio + * @return {Point} point + */ + Line.prototype.getPoint = function (ratio) { + var _a = this.attr(), x1 = _a.x1, y1 = _a.y1, x2 = _a.x2, y2 = _a.y2; + return LineUtil.pointAt(x1, y1, x2, y2, ratio); + }; + return Line; +}(ShapeBase$3)); +var Line$8 = Line$7; + +/** + * @fileoverview Marker + * @author dxq613@gmail.com + */ +var Symbols$1 = { + // 圆 + circle: function (x, y, r) { + return [ + ['M', x - r, y], + ['A', r, r, 0, 1, 0, x + r, y], + ['A', r, r, 0, 1, 0, x - r, y], + ]; + }, + // 正方形 + square: function (x, y, r) { + return [['M', x - r, y - r], ['L', x + r, y - r], ['L', x + r, y + r], ['L', x - r, y + r], ['Z']]; + }, + // 菱形 + diamond: function (x, y, r) { + return [['M', x - r, y], ['L', x, y - r], ['L', x + r, y], ['L', x, y + r], ['Z']]; + }, + // 三角形 + triangle: function (x, y, r) { + var diffY = r * Math.sin((1 / 3) * Math.PI); + return [['M', x - r, y + diffY], ['L', x, y - diffY], ['L', x + r, y + diffY], ['Z']]; + }, + // 倒三角形 + 'triangle-down': function (x, y, r) { + var diffY = r * Math.sin((1 / 3) * Math.PI); + return [['M', x - r, y - diffY], ['L', x + r, y - diffY], ['L', x, y + diffY], ['Z']]; + }, +}; +var Marker$3 = /** @class */ (function (_super) { + __extends$e(Marker, _super); + function Marker() { + return _super !== null && _super.apply(this, arguments) || this; + } + Marker.prototype.initAttrs = function (attrs) { + this._resetParamsCache(); + }; + // 重置绘制 path 存储的缓存 + Marker.prototype._resetParamsCache = function () { + // 为了加速 path 的绘制、拾取和计算，这个地方可以缓存很多东西 + // 这些缓存都是第一次需要时计算和存储，虽然增加了复杂度，但是频繁调用的方法，性能有很大提升 + this.set('paramsCache', {}); // 清理缓存 + }; + // 更新属性时，检测是否更改了 path + Marker.prototype.onAttrChange = function (name, value, originValue) { + _super.prototype.onAttrChange.call(this, name, value, originValue); + if (['symbol', 'x', 'y', 'r', 'radius'].indexOf(name) !== -1) { + // path 相关属性更改时，清理缓存 + this._resetParamsCache(); + } + }; + // 仅仅使用包围盒检测来进行拾取 + // 所以不需要复写 isInStrokeOrPath 的方法 + Marker.prototype.isOnlyHitBox = function () { + return true; + }; + Marker.prototype._getR = function (attrs) { + // 兼容 r 和 radius 两种写法，推荐使用 r + return isNil(attrs.r) ? attrs.radius : attrs.r; + }; + Marker.prototype._getPath = function () { + var attrs = this.attr(); + var x = attrs.x, y = attrs.y; + var symbol = attrs.symbol || 'circle'; + var r = this._getR(attrs); + var method; + var path; + if (isFunction$6(symbol)) { + method = symbol; + path = method(x, y, r); + // 将 path 转成绝对路径 + path = pathToAbsolute(path); + } + else { + // 内置 symbol 的 path 都是绝对路径，直接绘制即可，不需要对 path 进行特殊处理 + method = Marker.Symbols[symbol]; + if (!method) { + console.warn(symbol + " marker is not supported."); + return null; + } + path = method(x, y, r); + } + return path; + }; + Marker.prototype.createPath = function (context) { + var path = this._getPath(); + var paramsCache = this.get('paramsCache'); + drawPath(this, context, { path: path }, paramsCache); + }; + Marker.Symbols = Symbols$1; + return Marker; +}(ShapeBase$3)); +var Marker$4 = Marker$3; + +function isPointInPath(shape, x, y) { + var ctx = getOffScreenContext$1(); + shape.createPath(ctx); + return ctx.isPointInPath(x, y); +} + +/** + * @fileoverview 判断点是否在多边形内 + * @author dxq613@gmail.com + */ +// 多边形的射线检测，参考：https://blog.csdn.net/WilliamSun0122/article/details/77994526 +var tolerance = 1e-6; +// 三态函数，判断两个double在eps精度下的大小关系 +function dcmp(x) { + if (Math.abs(x) < tolerance) { + return 0; + } + return x < 0 ? -1 : 1; +} +// 判断点Q是否在p1和p2的线段上 +function onSegment$1(p1, p2, q) { + if ((q[0] - p1[0]) * (p2[1] - p1[1]) === (p2[0] - p1[0]) * (q[1] - p1[1]) && + Math.min(p1[0], p2[0]) <= q[0] && + q[0] <= Math.max(p1[0], p2[0]) && + Math.min(p1[1], p2[1]) <= q[1] && + q[1] <= Math.max(p1[1], p2[1])) { + return true; + } + return false; +} +// 判断点P在多边形内-射线法 +function isInPolygon(points, x, y) { + var isHit = false; + var n = points.length; + if (n <= 2) { + // svg 中点小于 3 个时，不显示，也无法被拾取 + return false; + } + for (var i = 0; i < n; i++) { + var p1 = points[i]; + var p2 = points[(i + 1) % n]; + if (onSegment$1(p1, p2, [x, y])) { + // 点在多边形一条边上 + return true; + } + // 前一个判断min(p1[1],p2[1]) 0 !== dcmp(p2[1] - y) > 0 && + dcmp(x - ((y - p1[1]) * (p1[0] - p2[0])) / (p1[1] - p2[1]) - p1[0]) < 0) { + isHit = !isHit; + } + } + return isHit; +} + +function arc(cx, cy, r, startAngle, endAngle, lineWidth, x, y) { + var angle = (Math.atan2(y - cy, x - cx) + Math.PI * 2) % (Math.PI * 2); // 转换到 0 - 2 * Math.PI 之间 + if (angle < startAngle || angle > endAngle) { + return false; + } + var point = { + x: cx + r * Math.cos(angle), + y: cy + r * Math.sin(angle), + }; + return distance$5(point.x, point.y, x, y) <= lineWidth / 2; +} + +var transform$e = transform$i; +function hasArc(path) { + var hasArc = false; + var count = path.length; + for (var i = 0; i < count; i++) { + var params = path[i]; + var cmd = params[0]; + if (cmd === 'C' || cmd === 'A' || cmd === 'Q') { + hasArc = true; + break; + } + } + return hasArc; +} +function isPointInStroke(segments, lineWidth, x, y, length) { + var isHit = false; + var halfWidth = lineWidth / 2; + for (var i = 0; i < segments.length; i++) { + var segment = segments[i]; + var currentPoint = segment.currentPoint, params = segment.params, prePoint = segment.prePoint, box = segment.box; + // 如果在前面已经生成过包围盒，直接按照包围盒计算 + if (box && !inBox(box.x - halfWidth, box.y - halfWidth, box.width + lineWidth, box.height + lineWidth, x, y)) { + continue; + } + switch (segment.command) { + // L 和 Z 都是直线， M 不进行拾取 + case 'L': + case 'Z': + isHit = inLine(prePoint[0], prePoint[1], currentPoint[0], currentPoint[1], lineWidth, x, y); + break; + case 'Q': + var qDistance = QuadUtil.pointDistance(prePoint[0], prePoint[1], params[1], params[2], params[3], params[4], x, y); + isHit = qDistance <= lineWidth / 2; + break; + case 'C': + var cDistance = CubicUtil.pointDistance(prePoint[0], // 上一段结束位置, 即 C 的起始点 + prePoint[1], params[1], // 'C' 的参数，1、2 为第一个控制点，3、4 为第二个控制点，5、6 为结束点 + params[2], params[3], params[4], params[5], params[6], x, y, length); + isHit = cDistance <= lineWidth / 2; + break; + case 'A': + // 计算点到椭圆圆弧的距离，暂时使用近似算法，后面可以改成切割法求最近距离 + var arcParams = segment.arcParams; + var cx = arcParams.cx, cy = arcParams.cy, rx = arcParams.rx, ry = arcParams.ry, startAngle = arcParams.startAngle, endAngle = arcParams.endAngle, xRotation = arcParams.xRotation; + var p = [x, y, 1]; + var r = rx > ry ? rx : ry; + var scaleX = rx > ry ? 1 : rx / ry; + var scaleY = rx > ry ? ry / rx : 1; + var m = transform$e(null, [ + ['t', -cx, -cy], + ['r', -xRotation], + ['s', 1 / scaleX, 1 / scaleY], + ]); + transformMat3$2(p, p, m); + isHit = arc(0, 0, r, startAngle, endAngle, lineWidth, p[0], p[1]); + break; + } + if (isHit) { + break; + } + } + return isHit; +} +/** + * 提取出内部的闭合多边形和非闭合的多边形，假设 path 不存在圆弧 + * @param {Array} path 路径 + * @returns {Array} 点的集合 + */ +function extractPolygons(path) { + var count = path.length; + var polygons = []; + var polylines = []; + var points = []; // 防止第一个命令不是 'M' + for (var i = 0; i < count; i++) { + var params = path[i]; + var cmd = params[0]; + if (cmd === 'M') { + // 遇到 'M' 判定是否是新数组，新数组中没有点 + if (points.length) { + // 如果存在点，则说明没有遇到 'Z'，开始了一个新的多边形 + polylines.push(points); + points = []; // 创建新的点 + } + points.push([params[1], params[2]]); + } + else if (cmd === 'Z') { + if (points.length) { + // 存在点 + polygons.push(points); + points = []; // 开始新的点集合 + } + // 如果不存在点，同时 'Z'，则说明是错误，不处理 + } + else { + points.push([params[1], params[2]]); + } + } + // 说明 points 未放入 polygons 或者 polyline + // 仅当只有一个 M，没有 Z 时会发生这种情况 + if (points.length > 0) { + polylines.push(points); + } + return { + polygons: polygons, + polylines: polylines, + }; +} +var PathUtil$1 = __assign$r({ hasArc: hasArc, extractPolygons: extractPolygons, isPointInStroke: isPointInStroke }, PathUtil$2); + +// 是否在多个多边形内部 +function isInPolygons(polygons, x, y) { + var isHit = false; + for (var i = 0; i < polygons.length; i++) { + var points = polygons[i]; + isHit = isInPolygon(points, x, y); + if (isHit) { + break; + } + } + return isHit; +} +var Path$3 = /** @class */ (function (_super) { + __extends$e(Path, _super); + function Path() { + return _super !== null && _super.apply(this, arguments) || this; + } + Path.prototype.getDefaultAttrs = function () { + var attrs = _super.prototype.getDefaultAttrs.call(this); + return __assign$r(__assign$r({}, attrs), { startArrow: false, endArrow: false }); + }; + Path.prototype.initAttrs = function (attrs) { + this._setPathArr(attrs.path); + this.setArrow(); + }; + // 更新属性时，检测是否更改了 path + Path.prototype.onAttrChange = function (name, value, originValue) { + _super.prototype.onAttrChange.call(this, name, value, originValue); + if (name === 'path') { + this._setPathArr(value); + } + // 由于箭头的绘制依赖于 line 的诸多 attrs，因此这里不再对每个 attr 进行判断，attr 每次变化都会影响箭头的更新 + this.setArrow(); + }; + // 将 path 转换成绝对路径 + Path.prototype._setPathArr = function (path) { + // 转换 path 的格式 + this.attrs.path = pathToAbsolute(path); + var hasArc = PathUtil$1.hasArc(path); + // 为了加速 path 的绘制、拾取和计算，这个地方可以缓存很多东西 + // 这些缓存都是第一次需要时计算和存储，虽然增加了复杂度，但是频繁调用的方法，性能有很大提升 + this.set('hasArc', hasArc); + this.set('paramsCache', {}); // 清理缓存 + this.set('segments', null); // 延迟生成 path，在动画场景下可能不会有拾取 + this.set('curve', null); + this.set('tCache', null); + this.set('totalLength', null); + }; + Path.prototype.getSegments = function () { + var segments = this.get('segements'); + if (!segments) { + segments = getSegments(this.attr('path')); + this.set('segments', segments); + } + return segments; + }; + Path.prototype.setArrow = function () { + var attrs = this.attr(); + var startArrow = attrs.startArrow, endArrow = attrs.endArrow; + if (startArrow) { + var tangent = this.getStartTangent(); + addStartArrow(this, attrs, tangent[0][0], tangent[0][1], tangent[1][0], tangent[1][1]); + } + if (endArrow) { + var tangent = this.getEndTangent(); + addEndArrow(this, attrs, tangent[0][0], tangent[0][1], tangent[1][0], tangent[1][1]); + } + }; + Path.prototype.isInStrokeOrPath = function (x, y, isStroke, isFill, lineWidth) { + var segments = this.getSegments(); + var hasArc = this.get('hasArc'); + var isHit = false; + if (isStroke) { + var length_1 = this.getTotalLength(); + isHit = PathUtil$1.isPointInStroke(segments, lineWidth, x, y, length_1); + } + if (!isHit && isFill) { + if (hasArc) { + // 存在曲线时，暂时使用 canvas 的 api 计算，后续可以进行多边形切割 + isHit = isPointInPath(this, x, y); + } + else { + var path = this.attr('path'); + var extractResutl = PathUtil$1.extractPolygons(path); + // 提取出来的多边形包含闭合的和非闭合的，在这里统一按照多边形处理 + isHit = isInPolygons(extractResutl.polygons, x, y) || isInPolygons(extractResutl.polylines, x, y); + } + } + return isHit; + }; + Path.prototype.createPath = function (context) { + var attrs = this.attr(); + var paramsCache = this.get('paramsCache'); // 由于计算圆弧的参数成本很大，所以要缓存 + drawPath(this, context, attrs, paramsCache); + }; + Path.prototype.afterDrawPath = function (context) { + var startArrowShape = this.get('startArrowShape'); + var endArrowShape = this.get('endArrowShape'); + if (startArrowShape) { + startArrowShape.draw(context); + } + if (endArrowShape) { + endArrowShape.draw(context); + } + }; + /** + * Get total length of path + * @return {number} length + */ + Path.prototype.getTotalLength = function () { + var totalLength = this.get('totalLength'); + if (!isNil(totalLength)) { + return totalLength; + } + this._calculateCurve(); + this._setTcache(); + return this.get('totalLength'); + }; + /** + * Get point according to ratio + * @param {number} ratio + * @return {Point} point + */ + Path.prototype.getPoint = function (ratio) { + var tCache = this.get('tCache'); + if (!tCache) { + this._calculateCurve(); + this._setTcache(); + tCache = this.get('tCache'); + } + var subt; + var index; + var curve = this.get('curve'); + if (!tCache || tCache.length === 0) { + if (curve) { + return { + x: curve[0][1], + y: curve[0][2], + }; + } + return null; + } + each$2(tCache, function (v, i) { + if (ratio >= v[0] && ratio <= v[1]) { + subt = (ratio - v[0]) / (v[1] - v[0]); + index = i; + } + }); + var seg = curve[index]; + if (isNil(seg) || isNil(index)) { + return null; + } + var l = seg.length; + var nextSeg = curve[index + 1]; + return CubicUtil.pointAt(seg[l - 2], seg[l - 1], nextSeg[1], nextSeg[2], nextSeg[3], nextSeg[4], nextSeg[5], nextSeg[6], subt); + }; + Path.prototype._calculateCurve = function () { + var path = this.attr().path; + this.set('curve', PathUtil$1.pathToCurve(path)); + }; + Path.prototype._setTcache = function () { + var totalLength = 0; + var tempLength = 0; + // 每段 curve 对应起止点的长度比例列表，形如: [[0, 0.25], [0.25, 0.6]. [0.6, 0.9], [0.9, 1]] + var tCache = []; + var segmentT; + var segmentL; + var segmentN; + var l; + var curve = this.get('curve'); + if (!curve) { + return; + } + each$2(curve, function (segment, i) { + segmentN = curve[i + 1]; + l = segment.length; + if (segmentN) { + totalLength += + CubicUtil.length(segment[l - 2], segment[l - 1], segmentN[1], segmentN[2], segmentN[3], segmentN[4], segmentN[5], segmentN[6]) || 0; + } + }); + this.set('totalLength', totalLength); + if (totalLength === 0) { + this.set('tCache', []); + return; + } + each$2(curve, function (segment, i) { + segmentN = curve[i + 1]; + l = segment.length; + if (segmentN) { + segmentT = []; + segmentT[0] = tempLength / totalLength; + segmentL = CubicUtil.length(segment[l - 2], segment[l - 1], segmentN[1], segmentN[2], segmentN[3], segmentN[4], segmentN[5], segmentN[6]); + // 当 path 不连续时，segmentL 可能为空，为空时需要作为 0 处理 + tempLength += segmentL || 0; + segmentT[1] = tempLength / totalLength; + tCache.push(segmentT); + } + }); + this.set('tCache', tCache); + }; + /** + * Get start tangent vector + * @return {Array} + */ + Path.prototype.getStartTangent = function () { + var segments = this.getSegments(); + var result; + if (segments.length > 1) { + var startPoint = segments[0].currentPoint; + var endPoint = segments[1].currentPoint; + var tangent = segments[1].startTangent; + result = []; + if (tangent) { + result.push([startPoint[0] - tangent[0], startPoint[1] - tangent[1]]); + result.push([startPoint[0], startPoint[1]]); + } + else { + result.push([endPoint[0], endPoint[1]]); + result.push([startPoint[0], startPoint[1]]); + } + } + return result; + }; + /** + * Get end tangent vector + * @return {Array} + */ + Path.prototype.getEndTangent = function () { + var segments = this.getSegments(); + var length = segments.length; + var result; + if (length > 1) { + var startPoint = segments[length - 2].currentPoint; + var endPoint = segments[length - 1].currentPoint; + var tangent = segments[length - 1].endTangent; + result = []; + if (tangent) { + result.push([endPoint[0] - tangent[0], endPoint[1] - tangent[1]]); + result.push([endPoint[0], endPoint[1]]); + } + else { + result.push([startPoint[0], startPoint[1]]); + result.push([endPoint[0], endPoint[1]]); + } + } + return result; + }; + return Path; +}(ShapeBase$3)); +var Path$4 = Path$3; + +function inPolyline(points, lineWidth, x, y, isClose) { + var count = points.length; + if (count < 2) { + return false; + } + for (var i = 0; i < count - 1; i++) { + var x1 = points[i][0]; + var y1 = points[i][1]; + var x2 = points[i + 1][0]; + var y2 = points[i + 1][1]; + if (inLine(x1, y1, x2, y2, lineWidth, x, y)) { + return true; + } + } + // 如果封闭，则计算起始点和结束点的边 + if (isClose) { + var first = points[0]; + var last = points[count - 1]; + if (inLine(first[0], first[1], last[0], last[1], lineWidth, x, y)) { + return true; + } + } + return false; +} + +/** + * @fileoverview 多边形 + * @author dxq613@gmail.com + */ +var Polygon$3 = /** @class */ (function (_super) { + __extends$e(Polygon, _super); + function Polygon() { + return _super !== null && _super.apply(this, arguments) || this; + } + Polygon.prototype.isInStrokeOrPath = function (x, y, isStroke, isFill, lineWidth) { + var points = this.attr().points; + var isHit = false; + if (isStroke) { + isHit = inPolyline(points, lineWidth, x, y, true); + } + if (!isHit && isFill) { + isHit = isInPolygon(points, x, y); // isPointInPath(shape, x, y); + } + return isHit; + }; + Polygon.prototype.createPath = function (context) { + var attrs = this.attr(); + var points = attrs.points; + if (points.length < 2) { + return; + } + context.beginPath(); + for (var i = 0; i < points.length; i++) { + var point = points[i]; + if (i === 0) { + context.moveTo(point[0], point[1]); + } + else { + context.lineTo(point[0], point[1]); + } + } + context.closePath(); + }; + return Polygon; +}(ShapeBase$3)); +var Polygon$4 = Polygon$3; + +var PolyLine = /** @class */ (function (_super) { + __extends$e(PolyLine, _super); + function PolyLine() { + return _super !== null && _super.apply(this, arguments) || this; + } + PolyLine.prototype.getDefaultAttrs = function () { + var attrs = _super.prototype.getDefaultAttrs.call(this); + return __assign$r(__assign$r({}, attrs), { startArrow: false, endArrow: false }); + }; + PolyLine.prototype.initAttrs = function (attrs) { + this.setArrow(); + }; + // 更新属性时，检测是否更改了 points + PolyLine.prototype.onAttrChange = function (name, value, originValue) { + _super.prototype.onAttrChange.call(this, name, value, originValue); + this.setArrow(); + if (['points'].indexOf(name) !== -1) { + this._resetCache(); + } + }; + PolyLine.prototype._resetCache = function () { + this.set('totalLength', null); + this.set('tCache', null); + }; + PolyLine.prototype.setArrow = function () { + var attrs = this.attr(); + var _a = this.attrs, points = _a.points, startArrow = _a.startArrow, endArrow = _a.endArrow; + var length = points.length; + var x1 = points[0][0]; + var y1 = points[0][1]; + var x2 = points[length - 1][0]; + var y2 = points[length - 1][1]; + if (startArrow) { + addStartArrow(this, attrs, points[1][0], points[1][1], x1, y1); + } + if (endArrow) { + addEndArrow(this, attrs, points[length - 2][0], points[length - 2][1], x2, y2); + } + }; + // 不允许 fill + PolyLine.prototype.isFill = function () { + return false; + }; + PolyLine.prototype.isInStrokeOrPath = function (x, y, isStroke, isFill, lineWidth) { + // 没有设置 stroke 不能被拾取, 没有线宽不能被拾取 + if (!isStroke || !lineWidth) { + return false; + } + var points = this.attr().points; + return inPolyline(points, lineWidth, x, y, false); + }; + // 始终填充 + PolyLine.prototype.isStroke = function () { + return true; + }; + PolyLine.prototype.createPath = function (context) { + var _a = this.attr(), points = _a.points, startArrow = _a.startArrow, endArrow = _a.endArrow; + var length = points.length; + if (points.length < 2) { + return; + } + var x1 = points[0][0]; + var y1 = points[0][1]; + var x2 = points[length - 1][0]; + var y2 = points[length - 1][1]; + // 如果定义了箭头，并且是自定义箭头，线条相应缩进 + if (startArrow && startArrow.d) { + var distance = getShortenOffset(x1, y1, points[1][0], points[1][1], startArrow.d); + x1 += distance.dx; + y1 += distance.dy; + } + if (endArrow && endArrow.d) { + var distance = getShortenOffset(points[length - 2][0], points[length - 2][1], x2, y2, endArrow.d); + x2 -= distance.dx; + y2 -= distance.dy; + } + context.beginPath(); + context.moveTo(x1, y1); + for (var i = 0; i < length - 1; i++) { + var point = points[i]; + context.lineTo(point[0], point[1]); + } + context.lineTo(x2, y2); + }; + PolyLine.prototype.afterDrawPath = function (context) { + var startArrowShape = this.get('startArrowShape'); + var endArrowShape = this.get('endArrowShape'); + if (startArrowShape) { + startArrowShape.draw(context); + } + if (endArrowShape) { + endArrowShape.draw(context); + } + }; + /** + * Get length of polyline + * @return {number} length + */ + PolyLine.prototype.getTotalLength = function () { + var points = this.attr().points; + // get totalLength from cache + var totalLength = this.get('totalLength'); + if (!isNil(totalLength)) { + return totalLength; + } + this.set('totalLength', PolylineUtil.length(points)); + return this.get('totalLength'); + }; + /** + * Get point according to ratio + * @param {number} ratio + * @return {Point} point + */ + PolyLine.prototype.getPoint = function (ratio) { + var points = this.attr().points; + // get tCache from cache + var tCache = this.get('tCache'); + if (!tCache) { + this._setTcache(); + tCache = this.get('tCache'); + } + var subt; + var index; + each$2(tCache, function (v, i) { + if (ratio >= v[0] && ratio <= v[1]) { + subt = (ratio - v[0]) / (v[1] - v[0]); + index = i; + } + }); + return LineUtil.pointAt(points[index][0], points[index][1], points[index + 1][0], points[index + 1][1], subt); + }; + PolyLine.prototype._setTcache = function () { + var points = this.attr().points; + if (!points || points.length === 0) { + return; + } + var totalLength = this.getTotalLength(); + if (totalLength <= 0) { + return; + } + var tempLength = 0; + var tCache = []; + var segmentT; + var segmentL; + each$2(points, function (p, i) { + if (points[i + 1]) { + segmentT = []; + segmentT[0] = tempLength / totalLength; + segmentL = LineUtil.length(p[0], p[1], points[i + 1][0], points[i + 1][1]); + tempLength += segmentL; + segmentT[1] = tempLength / totalLength; + tCache.push(segmentT); + } + }); + this.set('tCache', tCache); + }; + /** + * Get start tangent vector + * @return {Array} + */ + PolyLine.prototype.getStartTangent = function () { + var points = this.attr().points; + var result = []; + result.push([points[1][0], points[1][1]]); + result.push([points[0][0], points[0][1]]); + return result; + }; + /** + * Get end tangent vector + * @return {Array} + */ + PolyLine.prototype.getEndTangent = function () { + var points = this.attr().points; + var l = points.length - 1; + var result = []; + result.push([points[l - 1][0], points[l - 1][1]]); + result.push([points[l][0], points[l][1]]); + return result; + }; + return PolyLine; +}(ShapeBase$3)); +var PolyLine$1 = PolyLine; + +function inRect(minX, minY, width, height, lineWidth, x, y) { + var halfWidth = lineWidth / 2; + // 将四个边看做矩形来检测，比边的检测算法要快 + return (inBox(minX - halfWidth, minY - halfWidth, width, lineWidth, x, y) || // 上边 + inBox(minX + width - halfWidth, minY - halfWidth, lineWidth, height, x, y) || // 右边 + inBox(minX + halfWidth, minY + height - halfWidth, width, lineWidth, x, y) || // 下边 + inBox(minX - halfWidth, minY + halfWidth, lineWidth, height, x, y)); // 左边 +} + +function rectWithRadius(minX, minY, width, height, radius, lineWidth, x, y) { + return (inLine(minX + radius, minY, minX + width - radius, minY, lineWidth, x, y) || + inLine(minX + width, minY + radius, minX + width, minY + height - radius, lineWidth, x, y) || + inLine(minX + width - radius, minY + height, minX + radius, minY + height, lineWidth, x, y) || + inLine(minX, minY + height - radius, minX, minY + radius, lineWidth, x, y) || + arc(minX + width - radius, minY + radius, radius, 1.5 * Math.PI, 2 * Math.PI, lineWidth, x, y) || + arc(minX + width - radius, minY + height - radius, radius, 0, 0.5 * Math.PI, lineWidth, x, y) || + arc(minX + radius, minY + height - radius, radius, 0.5 * Math.PI, Math.PI, lineWidth, x, y) || + arc(minX + radius, minY + radius, radius, Math.PI, 1.5 * Math.PI, lineWidth, x, y)); +} + +/** + * @fileoverview 矩形 + * @author dxq613@gmail.com + */ +var Rect$3 = /** @class */ (function (_super) { + __extends$e(Rect, _super); + function Rect() { + return _super !== null && _super.apply(this, arguments) || this; + } + Rect.prototype.getDefaultAttrs = function () { + var attrs = _super.prototype.getDefaultAttrs.call(this); + return __assign$r(__assign$r({}, attrs), { x: 0, y: 0, width: 0, height: 0, radius: 0 }); + }; + Rect.prototype.isInStrokeOrPath = function (x, y, isStroke, isFill, lineWidth) { + var attrs = this.attr(); + var minX = attrs.x; + var minY = attrs.y; + var width = attrs.width; + var height = attrs.height; + var radius = attrs.radius; + // 无圆角时的策略 + if (!radius) { + var halfWidth = lineWidth / 2; + // 同时填充和带有边框 + if (isFill && isStroke) { + return inBox(minX - halfWidth, minY - halfWidth, width + halfWidth, height + halfWidth, x, y); + } + // 仅填充 + if (isFill) { + return inBox(minX, minY, width, height, x, y); + } + if (isStroke) { + return inRect(minX, minY, width, height, lineWidth, x, y); + } + } + else { + var isHit = false; + if (isStroke) { + isHit = rectWithRadius(minX, minY, width, height, radius, lineWidth, x, y); + } + // 仅填充时带有圆角的矩形直接通过图形拾取 + // 以后可以改成纯数学的近似拾取，将圆弧切割成多边形 + if (!isHit && isFill) { + isHit = isPointInPath(this, x, y); + } + return isHit; + } + }; + Rect.prototype.createPath = function (context) { + var attrs = this.attr(); + var x = attrs.x; + var y = attrs.y; + var width = attrs.width; + var height = attrs.height; + var radius = attrs.radius; + context.beginPath(); + if (radius === 0) { + // 改成原生的rect方法 + context.rect(x, y, width, height); + } + else { + var _a = parseRadius$2(radius), r1 = _a[0], r2 = _a[1], r3 = _a[2], r4 = _a[3]; + context.moveTo(x + r1, y); + context.lineTo(x + width - r2, y); + r2 !== 0 && context.arc(x + width - r2, y + r2, r2, -Math.PI / 2, 0); + context.lineTo(x + width, y + height - r3); + r3 !== 0 && context.arc(x + width - r3, y + height - r3, r3, 0, Math.PI / 2); + context.lineTo(x + r4, y + height); + r4 !== 0 && context.arc(x + r4, y + height - r4, r4, Math.PI / 2, Math.PI); + context.lineTo(x, y + r1); + r1 !== 0 && context.arc(x + r1, y + r1, r1, Math.PI, Math.PI * 1.5); + context.closePath(); + } + }; + return Rect; +}(ShapeBase$3)); +var Rect$4 = Rect$3; + +/** + * @fileoverview 文本 + * @author dxq613@gmail.com + */ +var Text$2 = /** @class */ (function (_super) { + __extends$e(Text, _super); + function Text() { + return _super !== null && _super.apply(this, arguments) || this; + } + // 默认文本属性 + Text.prototype.getDefaultAttrs = function () { + var attrs = _super.prototype.getDefaultAttrs.call(this); + return __assign$r(__assign$r({}, attrs), { x: 0, y: 0, text: null, fontSize: 12, fontFamily: 'sans-serif', fontStyle: 'normal', fontWeight: 'normal', fontVariant: 'normal', textAlign: 'start', textBaseline: 'bottom' }); + }; + // 仅仅使用包围盒检测来进行拾取 + Text.prototype.isOnlyHitBox = function () { + return true; + }; + // 初始化时组合 font，同时判断 text 是否换行 + Text.prototype.initAttrs = function (attrs) { + this._assembleFont(); + if (attrs.text) { + this._setText(attrs.text); + } + }; + // 组装字体 + Text.prototype._assembleFont = function () { + var attrs = this.attrs; + attrs.font = assembleFont$1(attrs); + }; + // 如果文本换行，则缓存数组 + Text.prototype._setText = function (text) { + var textArr = null; + if (isString$3(text) && text.indexOf('\n') !== -1) { + textArr = text.split('\n'); + } + this.set('textArr', textArr); + }; + // 更新属性时，检测是否更改了 font、text + Text.prototype.onAttrChange = function (name, value, originValue) { + _super.prototype.onAttrChange.call(this, name, value, originValue); + if (name.startsWith('font')) { + this._assembleFont(); + } + if (name === 'text') { + this._setText(value); + } + }; + // 这个方法在 text 时没有可以做的事情，如果要支持文字背景时可以考虑 + // createPath(context) { + // } + // 如果文本多行，需要获取文本间距 + Text.prototype._getSpaceingY = function () { + var attrs = this.attrs; + var lineHeight = attrs.lineHeight; + var fontSize = attrs.fontSize * 1; + return lineHeight ? lineHeight - fontSize : fontSize * 0.14; + }; + // 绘制文本，考虑多行的场景 + Text.prototype._drawTextArr = function (context, textArr, isFill) { + var attrs = this.attrs; + var textBaseline = attrs.textBaseline; + var x = attrs.x; + var y = attrs.y; + var fontSize = attrs.fontSize * 1; + var spaceingY = this._getSpaceingY(); + var height = getTextHeight$1(attrs.text, attrs.fontSize, attrs.lineHeight); + var subY; + each$2(textArr, function (subText, index) { + subY = y + index * (spaceingY + fontSize) - height + fontSize; // bottom; + if (textBaseline === 'middle') + subY += height - fontSize - (height - fontSize) / 2; + if (textBaseline === 'top') + subY += height - fontSize; + if (!isNil(subText)) { + if (isFill) { + context.fillText(subText, x, subY); + } + else { + context.strokeText(subText, x, subY); + } + } + }); + }; + // 绘制文本，同时考虑填充和绘制边框 + Text.prototype._drawText = function (context, isFill) { + var attrs = this.attr(); + var x = attrs.x; + var y = attrs.y; + var textArr = this.get('textArr'); + if (textArr) { + this._drawTextArr(context, textArr, isFill); + } + else { + var text = attrs.text; + if (!isNil(text)) { + if (isFill) { + context.fillText(text, x, y); + } + else { + context.strokeText(text, x, y); + } + } + } + }; + // 复写绘制和填充的逻辑：对于文本，应该先绘制边框，再进行填充 + Text.prototype.strokeAndFill = function (context) { + var _a = this.attrs, lineWidth = _a.lineWidth, opacity = _a.opacity, strokeOpacity = _a.strokeOpacity, fillOpacity = _a.fillOpacity; + if (this.isStroke()) { + if (lineWidth > 0) { + if (!isNil(strokeOpacity) && strokeOpacity !== 1) { + context.globalAlpha = opacity; + } + this.stroke(context); + } + } + if (this.isFill()) { + if (!isNil(fillOpacity) && fillOpacity !== 1) { + context.globalAlpha = fillOpacity; + this.fill(context); + context.globalAlpha = opacity; + } + else { + this.fill(context); + } + } + this.afterDrawPath(context); + }; + // 复写填充逻辑 + Text.prototype.fill = function (context) { + this._drawText(context, true); + }; + // 复写绘制边框的逻辑 + Text.prototype.stroke = function (context) { + this._drawText(context, false); + }; + return Text; +}(ShapeBase$3)); +var Text$3 = Text$2; + +function invertFromMatrix(v, matrix) { + if (matrix) { + var invertMatrix = invert$1(matrix); + return multiplyVec2$2(invertMatrix, v); + } + return v; +} +function getRefXY(element, x, y) { + // @ts-ignore + var totalMatrix = element.getTotalMatrix(); + if (totalMatrix) { + var _a = invertFromMatrix([x, y, 1], totalMatrix), refX = _a[0], refY = _a[1]; + return [refX, refY]; + } + return [x, y]; +} +// 拾取前的检测，只有通过检测才能继续拾取 +function preTest(element, x, y) { + // @ts-ignore + if (element.isCanvas && element.isCanvas()) { + return true; + } + // 不允许被拾取，则返回 null + // @ts-ignore + if (!isAllowCapture$1(element) || element.cfg.isInView === false) { + return false; + } + if (element.cfg.clipShape) { + // 如果存在 clip + var _a = getRefXY(element, x, y), refX = _a[0], refY = _a[1]; + if (element.isClipped(refX, refY)) { + return false; + } + } + // @ts-ignore ，这个地方调用过于频繁 + var bbox = element.cfg.cacheCanvasBBox || element.getCanvasBBox(); + // 如果没有缓存 bbox，则说明不可见 + // 注释掉的这段可能会加速拾取，上面的语句改写成 const bbox = element.cfg.cacheCanvasBBox; + // 这时候的拾取假设图形/分组在上一次绘制都在视窗内，但是上面已经判定了 isInView 所以意义不大 + // 现在还调用 element.getCanvasBBox(); 一个很大的原因是便于单元测试 + // if (!bbox) { + // return false; + // } + if (!(x >= bbox.minX && x <= bbox.maxX && y >= bbox.minY && y <= bbox.maxY)) { + return false; + } + return true; +} +// 这个方法复写了 g-base 的 getShape +function getShape(container, x, y) { + // 没有通过检测，则返回 null + if (!preTest(container, x, y)) { + return null; + } + var shape = null; + var children = container.getChildren(); + var count = children.length; + for (var i = count - 1; i >= 0; i--) { + var child = children[i]; + if (child.isGroup()) { + shape = getShape(child, x, y); + } + else if (preTest(child, x, y)) { + var curShape = child; + var _a = getRefXY(child, x, y), refX = _a[0], refY = _a[1]; + // @ts-ignore + if (curShape.isInShape(refX, refY)) { + shape = child; + } + } + if (shape) { + break; + } + } + return shape; +} + +var Canvas$1 = /** @class */ (function (_super) { + __extends$e(Canvas, _super); + function Canvas() { + return _super !== null && _super.apply(this, arguments) || this; + } + Canvas.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); + // 设置渲染引擎为 canvas，只读属性 + cfg['renderer'] = 'canvas'; + // 是否自动绘制，不需要用户调用 draw 方法 + cfg['autoDraw'] = true; + // 是否允许局部刷新图表 + cfg['localRefresh'] = true; + cfg['refreshElements'] = []; + // 是否在视图内自动裁剪 + cfg['clipView'] = true; + // 是否使用快速拾取的方案，默认为 false，上层可以打开 + cfg['quickHit'] = false; + return cfg; + }; + /** + * 一些方法调用会引起画布变化 + * @param {ChangeType} changeType 改变的类型 + */ + Canvas.prototype.onCanvasChange = function (changeType) { + /** + * 触发画布更新的三种 changeType + * 1. attr: 修改画布的绘图属性 + * 2. sort: 画布排序，图形的层次会发生变化 + * 3. changeSize: 改变画布大小 + */ + if (changeType === 'attr' || changeType === 'sort' || changeType === 'changeSize') { + this.set('refreshElements', [this]); + this.draw(); + } + }; + Canvas.prototype.getShapeBase = function () { + return Shape$2; + }; + Canvas.prototype.getGroupBase = function () { + return Group$1; + }; + /** + * 获取屏幕像素比 + */ + Canvas.prototype.getPixelRatio = function () { + var pixelRatio = this.get('pixelRatio') || getPixelRatio$1(); + // 不足 1 的取 1，超出 1 的取整 + return pixelRatio >= 1 ? Math.ceil(pixelRatio) : 1; + }; + Canvas.prototype.getViewRange = function () { + return { + minX: 0, + minY: 0, + maxX: this.cfg.width, + maxY: this.cfg.height, + }; + }; + // 复写基类的方法生成标签 + Canvas.prototype.createDom = function () { + var element = document.createElement('canvas'); + var context = element.getContext('2d'); + // 缓存 context 对象 + this.set('context', context); + return element; + }; + Canvas.prototype.setDOMSize = function (width, height) { + _super.prototype.setDOMSize.call(this, width, height); + var context = this.get('context'); + var el = this.get('el'); + var pixelRatio = this.getPixelRatio(); + el.width = pixelRatio * width; + el.height = pixelRatio * height; + // 设置 canvas 元素的宽度和高度，会重置缩放，因此 context.scale 需要在每次设置宽、高后调用 + if (pixelRatio > 1) { + context.scale(pixelRatio, pixelRatio); + } + }; + // 复写基类方法 + Canvas.prototype.clear = function () { + _super.prototype.clear.call(this); + this._clearFrame(); // 需要清理掉延迟绘制的帧 + var context = this.get('context'); + var element = this.get('el'); + context.clearRect(0, 0, element.width, element.height); + }; + Canvas.prototype.getShape = function (x, y) { + var shape; + if (this.get('quickHit')) { + shape = getShape(this, x, y); + } + else { + shape = _super.prototype.getShape.call(this, x, y, null); + } + return shape; + }; + // 对绘制区域边缘取整，避免浮点数问题 + Canvas.prototype._getRefreshRegion = function () { + var elements = this.get('refreshElements'); + var viewRegion = this.getViewRange(); + var region; + // 如果是当前画布整体发生了变化，则直接重绘整个画布 + if (elements.length && elements[0] === this) { + region = viewRegion; + } + else { + region = getMergedRegion(elements); + if (region) { + region.minX = Math.floor(region.minX); + region.minY = Math.floor(region.minY); + region.maxX = Math.ceil(region.maxX); + region.maxY = Math.ceil(region.maxY); + region.maxY += 1; // 在很多环境下字体的高低会不一致，附加一像素，避免残影 + var clipView = this.get('clipView'); + // 自动裁剪不在 view 内的区域 + if (clipView) { + region = mergeView(region, viewRegion); + } + } + } + return region; + }; + /** + * 刷新图形元素，这里仅仅是放入队列，下次绘制时进行绘制 + * @param {IElement} element 图形元素 + */ + Canvas.prototype.refreshElement = function (element) { + var refreshElements = this.get('refreshElements'); + refreshElements.push(element); + // if (this.get('autoDraw')) { + // this._startDraw(); + // } + }; + // 清理还在进行的绘制 + Canvas.prototype._clearFrame = function () { + var drawFrame = this.get('drawFrame'); + if (drawFrame) { + // 如果全部渲染时，存在局部渲染，则抛弃掉局部渲染 + cancelAnimationFrame$1(drawFrame); + this.set('drawFrame', null); + this.set('refreshElements', []); + } + }; + // 手工调用绘制接口 + Canvas.prototype.draw = function () { + var drawFrame = this.get('drawFrame'); + if (this.get('autoDraw') && drawFrame) { + return; + } + this._startDraw(); + }; + // 绘制所有图形 + Canvas.prototype._drawAll = function () { + var context = this.get('context'); + var element = this.get('el'); + var children = this.getChildren(); + context.clearRect(0, 0, element.width, element.height); + applyAttrsToContext(context, this); + drawChildren$1(context, children); + // 对于 https://github.com/antvis/g/issues/422 的场景，全局渲染的模式下也会记录更新的元素队列，因此全局渲染完后也需要置空 + this.set('refreshElements', []); + }; + // 绘制局部 + Canvas.prototype._drawRegion = function () { + var context = this.get('context'); + var refreshElements = this.get('refreshElements'); + var children = this.getChildren(); + var region = this._getRefreshRegion(); + // 需要注意可能没有 region 的场景 + // 一般发生在设置了 localRefresh ,在没有图形发生变化的情况下，用户调用了 draw + if (region) { + // 清理指定区域 + context.clearRect(region.minX, region.minY, region.maxX - region.minX, region.maxY - region.minY); + // 保存上下文，设置 clip + context.save(); + context.beginPath(); + context.rect(region.minX, region.minY, region.maxX - region.minX, region.maxY - region.minY); + context.clip(); + applyAttrsToContext(context, this); + // 确认更新的元素，这个优化可以提升 10 倍左右的性能，10W 个带有 group 的节点，局部渲染会从 90ms 下降到 5-6 ms + checkRefresh(this, children, region); + // 绘制子元素 + drawChildren$1(context, children, region); + context.restore(); + } + else if (refreshElements.length) { + // 防止发生改变的 elements 没有 region 的场景，这会发生在多个情况下 + // 1. 空的 group + // 2. 所有 elements 没有在绘图区域 + // 3. group 下面的 elements 隐藏掉 + // 如果不进行清理 hasChanged 的状态会不正确 + clearChanged(refreshElements); + } + each$2(refreshElements, function (element) { + if (element.get('hasChanged')) { + // 在视窗外的 Group 元素会加入到更新队列里，但实际却没有执行 draw() 逻辑，也就没有清除 hasChanged 标记 + // 即已经重绘完、但 hasChanged 标记没有清除的元素，需要统一清除掉。主要是 Group 存在问题，具体原因待排查 + element.set('hasChanged', false); + } + }); + this.set('refreshElements', []); + }; + // 触发绘制 + Canvas.prototype._startDraw = function () { + var _this = this; + var drawFrame = this.get('drawFrame'); + if (!drawFrame) { + drawFrame = requestAnimationFrame$1(function () { + if (_this.get('localRefresh')) { + _this._drawRegion(); + } + else { + _this._drawAll(); + } + _this.set('drawFrame', null); + }); + this.set('drawFrame', drawFrame); + } + }; + Canvas.prototype.skipDraw = function () { }; + Canvas.prototype.removeDom = function () { + var el = this.get('el'); + // 需要清理 canvas 画布内容，否则ios下 创建的canvas垃圾未回收，导致Total canvas memory use exceeds问题 + // 相关问题列表 + // https://stackoverflow.com/questions/52532614/total-canvas-memory-use-exceeds-the-maximum-limit-safari-12 + // https://github.com/openlayers/openlayers/issues/9291 + el.width = 0; + el.height = 0; + el.parentNode.removeChild(el); + }; + return Canvas; +}(Canvas$2)); + +var version$3 = '0.5.12'; + +var CanvasEngine = /*#__PURE__*/Object.freeze({ + __proto__: null, + Shape: Shape$2, + version: version$3, + Canvas: Canvas$1, + Group: Group$1, + getArcParams: getArcParams, + Event: GraphEvent$1, + Base: Base$3, + AbstractCanvas: Canvas$2, + AbstractGroup: AbstractGroup, + AbstractShape: AbstractShape, + getBBoxMethod: getMethod, + getTextHeight: getTextHeight$1, + assembleFont: assembleFont$1, + isAllowCapture: isAllowCapture$1, + multiplyVec2: multiplyVec2$2, + invert: invert$1, + getOffScreenContext: getOffScreenContext$1, + PathUtil: PathUtil$2 +}); + +var SHAPE_TO_TAGS = { + rect: 'path', + circle: 'circle', + line: 'line', + path: 'path', + marker: 'path', + text: 'text', + polyline: 'polyline', + polygon: 'polygon', + image: 'image', + ellipse: 'ellipse', + dom: 'foreignObject', +}; +var SVG_ATTR_MAP = { + opacity: 'opacity', + fillStyle: 'fill', + fill: 'fill', + fillOpacity: 'fill-opacity', + strokeStyle: 'stroke', + strokeOpacity: 'stroke-opacity', + stroke: 'stroke', + x: 'x', + y: 'y', + r: 'r', + rx: 'rx', + ry: 'ry', + width: 'width', + height: 'height', + x1: 'x1', + x2: 'x2', + y1: 'y1', + y2: 'y2', + lineCap: 'stroke-linecap', + lineJoin: 'stroke-linejoin', + lineWidth: 'stroke-width', + lineDash: 'stroke-dasharray', + lineDashOffset: 'stroke-dashoffset', + miterLimit: 'stroke-miterlimit', + font: 'font', + fontSize: 'font-size', + fontStyle: 'font-style', + fontVariant: 'font-variant', + fontWeight: 'font-weight', + fontFamily: 'font-family', + startArrow: 'marker-start', + endArrow: 'marker-end', + path: 'd', + class: 'class', + id: 'id', + style: 'style', + preserveAspectRatio: 'preserveAspectRatio', +}; + +/** + * 创建并返回图形的 svg 元素 + * @param type svg类型 + */ +function createSVGElement(type) { + return document.createElementNS('http://www.w3.org/2000/svg', type); +} +/** + * 创建并返回图形的 dom 元素 + * @param {IShape} shape 图形 + * @return {SVGElement} + */ +function createDom(shape) { + var type = SHAPE_TO_TAGS[shape.type]; + var parent = shape.getParent(); + if (!type) { + throw new Error("the type " + shape.type + " is not supported by svg"); + } + var element = createSVGElement(type); + if (shape.get('id')) { + element.id = shape.get('id'); + } + shape.set('el', element); + shape.set('attrs', {}); + // 对于 defs 下的 dom 节点，parent 为空，通过 context 统一挂载到 defs 节点下 + if (parent) { + var parentNode = parent.get('el'); + if (parentNode) { + parentNode.appendChild(element); + } + else { + // parentNode maybe null for group + parentNode = parent.createDom(); + parent.set('el', parentNode); + parentNode.appendChild(element); + } + } + return element; +} +/** + * 对 dom 元素进行排序 + * @param {IElement} element 元素 + * @param {sorter} function 排序函数 + */ +function sortDom(element, sorter) { + var el = element.get('el'); + var childList = toArray(el.children).sort(sorter); + // create empty fragment + var fragment = document.createDocumentFragment(); + childList.forEach(function (child) { + fragment.appendChild(child); + }); + el.appendChild(fragment); +} +/** + * 将 dom 元素移动到父元素下的指定位置 + * @param {SVGElement} element dom 元素 + * @param {number} targetIndex 目标位置(从 0 开始) + */ +function moveTo(element, targetIndex) { + var parentNode = element.parentNode; + var siblings = Array.from(parentNode.childNodes).filter( + // 要求为元素节点，且不能为 defs 节点 + function (node) { return node.nodeType === 1 && node.nodeName.toLowerCase() !== 'defs'; }); + // 获取目标节点 + var target = siblings[targetIndex]; + var currentIndex = siblings.indexOf(element); + // 如果目标节点存在 + if (target) { + // 当前索引 > 目标索引，直接插入到目标节点之前即可 + if (currentIndex > targetIndex) { + parentNode.insertBefore(element, target); + } + else if (currentIndex < targetIndex) { + // 当前索引 < 目标索引 + // 获取目标节点的下一个节点 + var targetNext = siblings[targetIndex + 1]; + // 如果目标节点的下一个节点存在，插入到该节点之前 + if (targetNext) { + parentNode.insertBefore(element, targetNext); + } + else { + // 如果该节点不存在，则追加到末尾 + parentNode.appendChild(element); + } + } + } + else { + parentNode.appendChild(element); + } +} + +function setShadow(model, context) { + var el = model.cfg.el; + var attrs = model.attr(); + var cfg = { + dx: attrs.shadowOffsetX, + dy: attrs.shadowOffsetY, + blur: attrs.shadowBlur, + color: attrs.shadowColor, + }; + if (!cfg.dx && !cfg.dy && !cfg.blur && !cfg.color) { + el.removeAttribute('filter'); + } + else { + var id = context.find('filter', cfg); + if (!id) { + id = context.addShadow(cfg); + } + el.setAttribute('filter', "url(#" + id + ")"); + } +} +function setTransform(model) { + var matrix = model.attr().matrix; + if (matrix) { + var el = model.cfg.el; + var transform = []; + for (var i = 0; i < 9; i += 3) { + transform.push(matrix[i] + "," + matrix[i + 1]); + } + transform = transform.join(','); + if (transform.indexOf('NaN') === -1) { + el.setAttribute('transform', "matrix(" + transform + ")"); + } + else { + console.warn('invalid matrix:', matrix); + } + } +} +function setClip(model, context) { + var clip = model.getClip(); + var el = model.get('el'); + if (!clip) { + el.removeAttribute('clip-path'); + } + else if (clip && !el.hasAttribute('clip-path')) { + createDom(clip); + clip.createPath(context); + var id = context.addClip(clip); + el.setAttribute('clip-path', "url(#" + id + ")"); + } +} + +function drawChildren(context, children) { + children.forEach(function (child) { + child.draw(context); + }); +} +/** + * 更新元素，包括 group 和 shape + * @param {IElement} element SVG 元素 + * @param {ChangeType} changeType 更新类型 + */ +function refreshElement(element, changeType) { + // 对于还没有挂载到画布下的元素，canvas 可能为空 + var canvas = element.get('canvas'); + // 只有挂载到画布下，才对元素进行实际渲染 + if (canvas && canvas.get('autoDraw')) { + var context = canvas.get('context'); + var parent_1 = element.getParent(); + var parentChildren = parent_1 ? parent_1.getChildren() : [canvas]; + var el = element.get('el'); + if (changeType === 'remove') { + var isClipShape = element.get('isClipShape'); + // 对于 clip，不仅需要将 clipShape 对于的 SVG 元素删除，还需要将上层的 clipPath 元素也删除 + if (isClipShape) { + var clipPathEl = el && el.parentNode; + var defsEl = clipPathEl && clipPathEl.parentNode; + if (clipPathEl && defsEl) { + defsEl.removeChild(clipPathEl); + } + } + else if (el && el.parentNode) { + el.parentNode.removeChild(el); + } + } + else if (changeType === 'show') { + el.setAttribute('visibility', 'visible'); + } + else if (changeType === 'hide') { + el.setAttribute('visibility', 'hidden'); + } + else if (changeType === 'zIndex') { + moveTo(el, parentChildren.indexOf(element)); + } + else if (changeType === 'sort') { + var children_1 = element.get('children'); + if (children_1 && children_1.length) { + sortDom(element, function (a, b) { + return children_1.indexOf(a) - children_1.indexOf(b) ? 1 : 0; + }); + } + } + else if (changeType === 'clear') { + // el maybe null for group + if (el) { + el.innerHTML = ''; + } + } + else if (changeType === 'matrix') { + setTransform(element); + } + else if (changeType === 'clip') { + setClip(element, context); + } + else if (changeType === 'attr') ; + else if (changeType === 'add') { + element.draw(context); + } + } +} + +var Group = /** @class */ (function (_super) { + __extends$e(Group, _super); + function Group() { + return _super !== null && _super.apply(this, arguments) || this; + } + // SVG 中分组对应实体标签 + Group.prototype.isEntityGroup = function () { + return true; + }; + Group.prototype.createDom = function () { + var element = createSVGElement('g'); + this.set('el', element); + var parent = this.getParent(); + if (parent) { + var parentNode = parent.get('el'); + if (parentNode) { + parentNode.appendChild(element); + } + else { + // parentNode maybe null for group + parentNode = parent.createDom(); + parent.set('el', parentNode); + parentNode.appendChild(element); + } + } + return element; + }; + // 覆盖基类的 afterAttrsChange 方法 + Group.prototype.afterAttrsChange = function (targetAttrs) { + _super.prototype.afterAttrsChange.call(this, targetAttrs); + var canvas = this.get('canvas'); + // 只有挂载到画布下，才对元素进行实际渲染 + if (canvas && canvas.get('autoDraw')) { + var context = canvas.get('context'); + this.createPath(context, targetAttrs); + } + }; + /** + * 一些方法调用会引起画布变化 + * @param {ChangeType} changeType 改变的类型 + */ + Group.prototype.onCanvasChange = function (changeType) { + refreshElement(this, changeType); + }; + Group.prototype.getShapeBase = function () { + return Shape$1; + }; + Group.prototype.getGroupBase = function () { + return Group; + }; + Group.prototype.draw = function (context) { + var children = this.getChildren(); + var el = this.get('el'); + if (this.get('destroyed')) { + if (el) { + el.parentNode.removeChild(el); + } + } + else { + if (!el) { + this.createDom(); + } + setClip(this, context); + this.createPath(context); + if (children.length) { + drawChildren(context, children); + } + } + }; + /** + * 绘制分组的路径 + * @param {Defs} context 上下文 + * @param {ShapeAttrs} targetAttrs 渲染的目标属性 + */ + Group.prototype.createPath = function (context, targetAttrs) { + var attrs = this.attr(); + var el = this.get('el'); + each$2(targetAttrs || attrs, function (value, attr) { + if (SVG_ATTR_MAP[attr]) { + el.setAttribute(SVG_ATTR_MAP[attr], value); + } + }); + setTransform(this); + }; + return Group; +}(AbstractGroup)); + +var ShapeBase = /** @class */ (function (_super) { + __extends$e(ShapeBase, _super); + function ShapeBase() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.type = 'svg'; + _this.canFill = false; + _this.canStroke = false; + return _this; + } + ShapeBase.prototype.getDefaultAttrs = function () { + var attrs = _super.prototype.getDefaultAttrs.call(this); + // 设置默认值 + return __assign$r(__assign$r({}, attrs), { lineWidth: 1, lineAppendWidth: 0, strokeOpacity: 1, fillOpacity: 1 }); + }; + // 覆盖基类的 afterAttrsChange 方法 + ShapeBase.prototype.afterAttrsChange = function (targetAttrs) { + _super.prototype.afterAttrsChange.call(this, targetAttrs); + var canvas = this.get('canvas'); + // 只有挂载到画布下，才对元素进行实际渲染 + if (canvas && canvas.get('autoDraw')) { + var context = canvas.get('context'); + this.draw(context, targetAttrs); + } + }; + ShapeBase.prototype.getShapeBase = function () { + return Shape$1; + }; + ShapeBase.prototype.getGroupBase = function () { + return Group; + }; + /** + * 一些方法调用会引起画布变化 + * @param {ChangeType} changeType 改变的类型 + */ + ShapeBase.prototype.onCanvasChange = function (changeType) { + refreshElement(this, changeType); + }; + ShapeBase.prototype.calculateBBox = function () { + var el = this.get('el'); + var bbox = null; + // 包围盒计算依赖于绘制，如果还没有生成对应的 Dom 元素，则包围盒的长宽均为 0 + if (el) { + bbox = el.getBBox(); + } + else { + var bboxMethod = getMethod(this.get('type')); + if (bboxMethod) { + bbox = bboxMethod(this); + } + } + if (bbox) { + var x = bbox.x, y = bbox.y, width = bbox.width, height = bbox.height; + var lineWidth = this.getHitLineWidth(); + var halfWidth = lineWidth / 2; + var minX = x - halfWidth; + var minY = y - halfWidth; + var maxX = x + width + halfWidth; + var maxY = y + height + halfWidth; + return { + x: minX, + y: minY, + minX: minX, + minY: minY, + maxX: maxX, + maxY: maxY, + width: width + lineWidth, + height: height + lineWidth, + }; + } + return { + x: 0, + y: 0, + minX: 0, + minY: 0, + maxX: 0, + maxY: 0, + width: 0, + height: 0, + }; + }; + ShapeBase.prototype.isFill = function () { + var _a = this.attr(), fill = _a.fill, fillStyle = _a.fillStyle; + return (fill || fillStyle || this.isClipShape()) && this.canFill; + }; + ShapeBase.prototype.isStroke = function () { + var _a = this.attr(), stroke = _a.stroke, strokeStyle = _a.strokeStyle; + return (stroke || strokeStyle) && this.canStroke; + }; + ShapeBase.prototype.draw = function (context, targetAttrs) { + var el = this.get('el'); + if (this.get('destroyed')) { + if (el) { + el.parentNode.removeChild(el); + } + } + else { + if (!el) { + createDom(this); + } + setClip(this, context); + this.createPath(context, targetAttrs); + this.shadow(context, targetAttrs); + this.strokeAndFill(context, targetAttrs); + this.transform(targetAttrs); + } + }; + /** + * @protected + * 绘制图形的路径 + * @param {Defs} context 上下文 + * @param {ShapeAttrs} targetAttrs 渲染的目标属性 + */ + ShapeBase.prototype.createPath = function (context, targetAttrs) { }; + // stroke and fill + ShapeBase.prototype.strokeAndFill = function (context, targetAttrs) { + var attrs = targetAttrs || this.attr(); + var fill = attrs.fill, fillStyle = attrs.fillStyle, stroke = attrs.stroke, strokeStyle = attrs.strokeStyle, fillOpacity = attrs.fillOpacity, strokeOpacity = attrs.strokeOpacity, lineWidth = attrs.lineWidth; + var el = this.get('el'); + if (this.canFill) { + // 初次渲染和更新渲染的逻辑有所不同: 初次渲染值为空时，需要设置为 none，否则就会是黑色，而更新渲染则不需要 + if (!targetAttrs) { + this._setColor(context, 'fill', fill || fillStyle); + } + else if ('fill' in attrs) { + this._setColor(context, 'fill', fill); + } + else if ('fillStyle' in attrs) { + // compatible with fillStyle + this._setColor(context, 'fill', fillStyle); + } + if (fillOpacity) { + el.setAttribute(SVG_ATTR_MAP['fillOpacity'], fillOpacity); + } + } + if (this.canStroke && lineWidth > 0) { + if (!targetAttrs) { + this._setColor(context, 'stroke', stroke || strokeStyle); + } + else if ('stroke' in attrs) { + this._setColor(context, 'stroke', stroke); + } + else if ('strokeStyle' in attrs) { + // compatible with strokeStyle + this._setColor(context, 'stroke', strokeStyle); + } + if (strokeOpacity) { + el.setAttribute(SVG_ATTR_MAP['strokeOpacity'], strokeOpacity); + } + if (lineWidth) { + el.setAttribute(SVG_ATTR_MAP['lineWidth'], lineWidth); + } + } + }; + ShapeBase.prototype._setColor = function (context, attr, value) { + var el = this.get('el'); + if (!value) { + // need to set `none` to avoid default value + el.setAttribute(SVG_ATTR_MAP[attr], 'none'); + return; + } + value = value.trim(); + if (/^[r,R,L,l]{1}[\s]*\(/.test(value)) { + var id = context.find('gradient', value); + if (!id) { + id = context.addGradient(value); + } + el.setAttribute(SVG_ATTR_MAP[attr], "url(#" + id + ")"); + } + else if (/^[p,P]{1}[\s]*\(/.test(value)) { + var id = context.find('pattern', value); + if (!id) { + id = context.addPattern(value); + } + el.setAttribute(SVG_ATTR_MAP[attr], "url(#" + id + ")"); + } + else { + el.setAttribute(SVG_ATTR_MAP[attr], value); + } + }; + ShapeBase.prototype.shadow = function (context, targetAttrs) { + var attrs = this.attr(); + var _a = targetAttrs || attrs, shadowOffsetX = _a.shadowOffsetX, shadowOffsetY = _a.shadowOffsetY, shadowBlur = _a.shadowBlur, shadowColor = _a.shadowColor; + if (shadowOffsetX || shadowOffsetY || shadowBlur || shadowColor) { + setShadow(this, context); + } + }; + ShapeBase.prototype.transform = function (targetAttrs) { + var attrs = this.attr(); + var matrix = (targetAttrs || attrs).matrix; + if (matrix) { + setTransform(this); + } + }; + ShapeBase.prototype.isInShape = function (refX, refY) { + return this.isPointInPath(refX, refY); + }; + ShapeBase.prototype.isPointInPath = function (refX, refY) { + var el = this.get('el'); + var canvas = this.get('canvas'); + var bbox = canvas.get('el').getBoundingClientRect(); + var clientX = refX + bbox.left; + var clientY = refY + bbox.top; + var element = document.elementFromPoint(clientX, clientY); + if (element && element.isEqualNode(el)) { + return true; + } + return false; + }; + /** + * 获取线拾取的宽度 + * @returns {number} 线的拾取宽度 + */ + ShapeBase.prototype.getHitLineWidth = function () { + var _a = this.attrs, lineWidth = _a.lineWidth, lineAppendWidth = _a.lineAppendWidth; + if (this.isStroke()) { + return lineWidth + lineAppendWidth; + } + return 0; + }; + return ShapeBase; +}(AbstractShape)); +var ShapeBase$1 = ShapeBase; + +/** + * @fileoverview circle + * @author dengfuping_develop@163.com + */ +var Circle$1 = /** @class */ (function (_super) { + __extends$e(Circle, _super); + function Circle() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.type = 'circle'; + _this.canFill = true; + _this.canStroke = true; + return _this; + } + Circle.prototype.getDefaultAttrs = function () { + var attrs = _super.prototype.getDefaultAttrs.call(this); + return __assign$r(__assign$r({}, attrs), { x: 0, y: 0, r: 0 }); + }; + Circle.prototype.createPath = function (context, targetAttrs) { + var attrs = this.attr(); + var el = this.get('el'); + each$2(targetAttrs || attrs, function (value, attr) { + // 圆和椭圆的点坐标属性不是 x, y，而是 cx, cy + if (attr === 'x' || attr === 'y') { + el.setAttribute("c" + attr, value); + } + else if (SVG_ATTR_MAP[attr]) { + el.setAttribute(SVG_ATTR_MAP[attr], value); + } + }); + }; + return Circle; +}(ShapeBase$1)); +var Circle$2 = Circle$1; + +/** + * @fileoverview dom + * @author dengfuping_develop@163.com + */ +var Dom = /** @class */ (function (_super) { + __extends$e(Dom, _super); + function Dom() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.type = 'dom'; + _this.canFill = false; + _this.canStroke = false; + return _this; + } + Dom.prototype.createPath = function (context, targetAttrs) { + var attrs = this.attr(); + var el = this.get('el'); + each$2(targetAttrs || attrs, function (value, attr) { + if (SVG_ATTR_MAP[attr]) { + el.setAttribute(SVG_ATTR_MAP[attr], value); + } + }); + if (typeof attrs['html'] === 'function') { + var element = attrs['html'].call(this, attrs); + if (element instanceof Element || element instanceof HTMLDocument) { + var children = el.childNodes; + for (var i = children.length - 1; i >= 0; i--) { + el.removeChild(children[i]); + } + el.appendChild(element); // append to el if it's an element + } + else { + el.innerHTML = element; // set innerHTML + } + } + else { + el.innerHTML = attrs['html']; // set innerHTML + } + }; + return Dom; +}(ShapeBase$1)); +var Dom$1 = Dom; + +/** + * @fileoverview ellipse + * @author dengfuping_develop@163.com + */ +var Ellipse = /** @class */ (function (_super) { + __extends$e(Ellipse, _super); + function Ellipse() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.type = 'ellipse'; + _this.canFill = true; + _this.canStroke = true; + return _this; + } + Ellipse.prototype.getDefaultAttrs = function () { + var attrs = _super.prototype.getDefaultAttrs.call(this); + return __assign$r(__assign$r({}, attrs), { x: 0, y: 0, rx: 0, ry: 0 }); + }; + Ellipse.prototype.createPath = function (context, targetAttrs) { + var attrs = this.attr(); + var el = this.get('el'); + each$2(targetAttrs || attrs, function (value, attr) { + // 圆和椭圆的点坐标属性不是 x, y，而是 cx, cy + if (attr === 'x' || attr === 'y') { + el.setAttribute("c" + attr, value); + } + else if (SVG_ATTR_MAP[attr]) { + el.setAttribute(SVG_ATTR_MAP[attr], value); + } + }); + }; + return Ellipse; +}(ShapeBase$1)); +var Ellipse$1 = Ellipse; + +/** + * @fileoverview image + * @author dengfuping_develop@163.com + */ +var Image$1 = /** @class */ (function (_super) { + __extends$e(Image, _super); + function Image() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.type = 'image'; + _this.canFill = false; + _this.canStroke = false; + return _this; + } + Image.prototype.getDefaultAttrs = function () { + var attrs = _super.prototype.getDefaultAttrs.call(this); + return __assign$r(__assign$r({}, attrs), { x: 0, y: 0, width: 0, height: 0 }); + }; + Image.prototype.createPath = function (context, targetAttrs) { + var _this = this; + var attrs = this.attr(); + var el = this.get('el'); + each$2(targetAttrs || attrs, function (value, attr) { + if (attr === 'img') { + _this._setImage(attrs.img); + } + else if (SVG_ATTR_MAP[attr]) { + el.setAttribute(SVG_ATTR_MAP[attr], value); + } + }); + }; + Image.prototype.setAttr = function (name, value) { + this.attrs[name] = value; + if (name === 'img') { + this._setImage(value); + } + }; + Image.prototype._setImage = function (img) { + var attrs = this.attr(); + var el = this.get('el'); + if (isString$3(img)) { + el.setAttribute('href', img); + } + else if (img instanceof window.Image) { + if (!attrs.width) { + el.setAttribute('width', img.width); + this.attr('width', img.width); + } + if (!attrs.height) { + el.setAttribute('height', img.height); + this.attr('height', img.height); + } + el.setAttribute('href', img.src); + } + else if (img instanceof HTMLElement && isString$3(img.nodeName) && img.nodeName.toUpperCase() === 'CANVAS') { + // @ts-ignore + el.setAttribute('href', img.toDataURL()); + } + else if (img instanceof ImageData) { + var canvas = document.createElement('canvas'); + canvas.setAttribute('width', "" + img.width); + canvas.setAttribute('height', "" + img.height); + canvas.getContext('2d').putImageData(img, 0, 0); + if (!attrs.width) { + el.setAttribute('width', "" + img.width); + this.attr('width', img.width); + } + if (!attrs.height) { + el.setAttribute('height', "" + img.height); + this.attr('height', img.height); + } + el.setAttribute('href', canvas.toDataURL()); + } + }; + return Image; +}(ShapeBase$1)); +var Image$2 = Image$1; + +var Line$5 = /** @class */ (function (_super) { + __extends$e(Line, _super); + function Line() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.type = 'line'; + _this.canFill = false; + _this.canStroke = true; + return _this; + } + Line.prototype.getDefaultAttrs = function () { + var attrs = _super.prototype.getDefaultAttrs.call(this); + return __assign$r(__assign$r({}, attrs), { x1: 0, y1: 0, x2: 0, y2: 0, startArrow: false, endArrow: false }); + }; + Line.prototype.createPath = function (context, targetAttrs) { + var attrs = this.attr(); + var el = this.get('el'); + each$2(targetAttrs || attrs, function (value, attr) { + if (attr === 'startArrow' || attr === 'endArrow') { + if (value) { + var id = isObject$f(value) + ? context.addArrow(attrs, SVG_ATTR_MAP[attr]) + : context.getDefaultArrow(attrs, SVG_ATTR_MAP[attr]); + el.setAttribute(SVG_ATTR_MAP[attr], "url(#" + id + ")"); + } + else { + el.removeAttribute(SVG_ATTR_MAP[attr]); + } + } + else if (SVG_ATTR_MAP[attr]) { + el.setAttribute(SVG_ATTR_MAP[attr], value); + } + }); + }; + /** + * Use math calculation to get length of line + * @return {number} length + */ + Line.prototype.getTotalLength = function () { + var _a = this.attr(), x1 = _a.x1, y1 = _a.y1, x2 = _a.x2, y2 = _a.y2; + return LineUtil.length(x1, y1, x2, y2); + }; + /** + * Use math calculation to get point according to ratio as same sa Canvas version + * @param {number} ratio + * @return {Point} point + */ + Line.prototype.getPoint = function (ratio) { + var _a = this.attr(), x1 = _a.x1, y1 = _a.y1, x2 = _a.x2, y2 = _a.y2; + return LineUtil.pointAt(x1, y1, x2, y2, ratio); + }; + return Line; +}(ShapeBase$1)); +var Line$6 = Line$5; + +var Symbols = { + // 圆 + circle: function (x, y, r) { + return [ + ['M', x, y], + ['m', -r, 0], + ['a', r, r, 0, 1, 0, r * 2, 0], + ['a', r, r, 0, 1, 0, -r * 2, 0], + ]; + }, + // 正方形 + square: function (x, y, r) { + return [['M', x - r, y - r], ['L', x + r, y - r], ['L', x + r, y + r], ['L', x - r, y + r], ['Z']]; + }, + // 菱形 + diamond: function (x, y, r) { + return [['M', x - r, y], ['L', x, y - r], ['L', x + r, y], ['L', x, y + r], ['Z']]; + }, + // 三角形 + triangle: function (x, y, r) { + var diffY = r * Math.sin((1 / 3) * Math.PI); + return [['M', x - r, y + diffY], ['L', x, y - diffY], ['L', x + r, y + diffY], ['z']]; + }, + // 倒三角形 + triangleDown: function (x, y, r) { + var diffY = r * Math.sin((1 / 3) * Math.PI); + return [['M', x - r, y - diffY], ['L', x + r, y - diffY], ['L', x, y + diffY], ['Z']]; + }, +}; +var symbolsFactory = { + get: function (type) { + return Symbols[type]; + }, + register: function (type, func) { + Symbols[type] = func; + }, + remove: function (type) { + delete Symbols[type]; + }, + getAll: function () { + return Symbols; + }, +}; + +/** + * @fileoverview marker + * @author dengfuping_develop@163.com + */ +var Marker$1 = /** @class */ (function (_super) { + __extends$e(Marker, _super); + function Marker() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.type = 'marker'; + _this.canFill = true; + _this.canStroke = true; + return _this; + } + Marker.prototype.createPath = function (context) { + var el = this.get('el'); + el.setAttribute('d', this._assembleMarker()); + }; + Marker.prototype._assembleMarker = function () { + var d = this._getPath(); + if (isArray$n(d)) { + return d + .map(function (path) { + return path.join(' '); + }) + .join(''); + } + return d; + }; + Marker.prototype._getPath = function () { + var attrs = this.attr(); + var x = attrs.x, y = attrs.y; + // 兼容 r 和 radius 两种写法，推荐使用 r + var r = attrs.r || attrs.radius; + var symbol = attrs.symbol || 'circle'; + var method; + if (isFunction$6(symbol)) { + method = symbol; + } + else { + method = symbolsFactory.get(symbol); + } + if (!method) { + console.warn(method + " symbol is not exist."); + return null; + } + return method(x, y, r); + }; + // 作为其静态属性 + Marker.symbolsFactory = symbolsFactory; + return Marker; +}(ShapeBase$1)); +var Marker$2 = Marker$1; + +var Path$1 = /** @class */ (function (_super) { + __extends$e(Path, _super); + function Path() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.type = 'path'; + _this.canFill = true; + _this.canStroke = true; + return _this; + } + Path.prototype.getDefaultAttrs = function () { + var attrs = _super.prototype.getDefaultAttrs.call(this); + return __assign$r(__assign$r({}, attrs), { startArrow: false, endArrow: false }); + }; + Path.prototype.createPath = function (context, targetAttrs) { + var _this = this; + var attrs = this.attr(); + var el = this.get('el'); + each$2(targetAttrs || attrs, function (value, attr) { + if (attr === 'path' && isArray$n(value)) { + el.setAttribute('d', _this._formatPath(value)); + } + else if (attr === 'startArrow' || attr === 'endArrow') { + if (value) { + var id = isObject$f(value) + ? context.addArrow(attrs, SVG_ATTR_MAP[attr]) + : context.getDefaultArrow(attrs, SVG_ATTR_MAP[attr]); + el.setAttribute(SVG_ATTR_MAP[attr], "url(#" + id + ")"); + } + else { + el.removeAttribute(SVG_ATTR_MAP[attr]); + } + } + else if (SVG_ATTR_MAP[attr]) { + el.setAttribute(SVG_ATTR_MAP[attr], value); + } + }); + }; + Path.prototype._formatPath = function (value) { + var newValue = value + .map(function (path) { + return path.join(' '); + }) + .join(''); + if (~newValue.indexOf('NaN')) { + return ''; + } + return newValue; + }; + /** + * Get total length of path + * 尽管通过浏览器的 SVGPathElement.getTotalLength() 接口获取的 path 长度， + * 与 Canvas 版本通过数学计算的方式得到的长度有一些细微差异，但最大误差在个位数像素，精度上可以能接受 + * @return {number} length + */ + Path.prototype.getTotalLength = function () { + var el = this.get('el'); + return el ? el.getTotalLength() : null; + }; + /** + * Get point according to ratio + * @param {number} ratio + * @return {Point} point + */ + Path.prototype.getPoint = function (ratio) { + var el = this.get('el'); + var totalLength = this.getTotalLength(); + // @see https://github.com/antvis/g/issues/634 + if (totalLength === 0) { + return null; + } + var point = el ? el.getPointAtLength(ratio * totalLength) : null; + return point + ? { + x: point.x, + y: point.y, + } + : null; + }; + return Path; +}(ShapeBase$1)); +var Path$2 = Path$1; + +var Polygon$1 = /** @class */ (function (_super) { + __extends$e(Polygon, _super); + function Polygon() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.type = 'polygon'; + _this.canFill = true; + _this.canStroke = true; + return _this; + } + Polygon.prototype.createPath = function (context, targetAttrs) { + var attrs = this.attr(); + var el = this.get('el'); + each$2(targetAttrs || attrs, function (value, attr) { + if (attr === 'points' && isArray$n(value) && value.length >= 2) { + el.setAttribute('points', value.map(function (point) { return point[0] + "," + point[1]; }).join(' ')); + } + else if (SVG_ATTR_MAP[attr]) { + el.setAttribute(SVG_ATTR_MAP[attr], value); + } + }); + }; + return Polygon; +}(ShapeBase$1)); +var Polygon$2 = Polygon$1; + +var Polyline = /** @class */ (function (_super) { + __extends$e(Polyline, _super); + function Polyline() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.type = 'polyline'; + _this.canFill = true; + _this.canStroke = true; + return _this; + } + Polyline.prototype.getDefaultAttrs = function () { + var attrs = _super.prototype.getDefaultAttrs.call(this); + return __assign$r(__assign$r({}, attrs), { startArrow: false, endArrow: false }); + }; + // 更新属性时，检测是否更改了 points + Polyline.prototype.onAttrChange = function (name, value, originValue) { + _super.prototype.onAttrChange.call(this, name, value, originValue); + if (['points'].indexOf(name) !== -1) { + this._resetCache(); + } + }; + Polyline.prototype._resetCache = function () { + this.set('totalLength', null); + this.set('tCache', null); + }; + Polyline.prototype.createPath = function (context, targetAttrs) { + var attrs = this.attr(); + var el = this.get('el'); + each$2(targetAttrs || attrs, function (value, attr) { + if (attr === 'points' && isArray$n(value) && value.length >= 2) { + el.setAttribute('points', value.map(function (point) { return point[0] + "," + point[1]; }).join(' ')); + } + else if (SVG_ATTR_MAP[attr]) { + el.setAttribute(SVG_ATTR_MAP[attr], value); + } + }); + }; + /** + * Get length of polyline + * @return {number} length + */ + Polyline.prototype.getTotalLength = function () { + var points = this.attr().points; + // get totalLength from cache + var totalLength = this.get('totalLength'); + if (!isNil(totalLength)) { + return totalLength; + } + this.set('totalLength', PolylineUtil.length(points)); + return this.get('totalLength'); + }; + /** + * Get point according to ratio + * @param {number} ratio + * @return {Point} point + */ + Polyline.prototype.getPoint = function (ratio) { + var points = this.attr().points; + // get tCache from cache + var tCache = this.get('tCache'); + if (!tCache) { + this._setTcache(); + tCache = this.get('tCache'); + } + var subt; + var index; + each$2(tCache, function (v, i) { + if (ratio >= v[0] && ratio <= v[1]) { + subt = (ratio - v[0]) / (v[1] - v[0]); + index = i; + } + }); + return LineUtil.pointAt(points[index][0], points[index][1], points[index + 1][0], points[index + 1][1], subt); + }; + Polyline.prototype._setTcache = function () { + var points = this.attr().points; + if (!points || points.length === 0) { + return; + } + var totalLength = this.getTotalLength(); + if (totalLength <= 0) { + return; + } + var tempLength = 0; + var tCache = []; + var segmentT; + var segmentL; + each$2(points, function (p, i) { + if (points[i + 1]) { + segmentT = []; + segmentT[0] = tempLength / totalLength; + segmentL = LineUtil.length(p[0], p[1], points[i + 1][0], points[i + 1][1]); + tempLength += segmentL; + segmentT[1] = tempLength / totalLength; + tCache.push(segmentT); + } + }); + this.set('tCache', tCache); + }; + /** + * Get start tangent vector + * @return {Array} + */ + Polyline.prototype.getStartTangent = function () { + var points = this.attr().points; + var result = []; + result.push([points[1][0], points[1][1]]); + result.push([points[0][0], points[0][1]]); + return result; + }; + /** + * Get end tangent vector + * @return {Array} + */ + Polyline.prototype.getEndTangent = function () { + var points = this.attr().points; + var l = points.length - 1; + var result = []; + result.push([points[l - 1][0], points[l - 1][1]]); + result.push([points[l][0], points[l][1]]); + return result; + }; + return Polyline; +}(ShapeBase$1)); +var Polyline$1 = Polyline; + +function parseRadius$1(radius) { + var r1 = 0; + var r2 = 0; + var r3 = 0; + var r4 = 0; + if (isArray$n(radius)) { + if (radius.length === 1) { + r1 = r2 = r3 = r4 = radius[0]; + } + else if (radius.length === 2) { + r1 = r3 = radius[0]; + r2 = r4 = radius[1]; + } + else if (radius.length === 3) { + r1 = radius[0]; + r2 = r4 = radius[1]; + r3 = radius[2]; + } + else { + r1 = radius[0]; + r2 = radius[1]; + r3 = radius[2]; + r4 = radius[3]; + } + } + else { + r1 = r2 = r3 = r4 = radius; + } + return { + r1: r1, + r2: r2, + r3: r3, + r4: r4, + }; +} + +/** + * @fileoverview rect + * @author dengfuping_develop@163.com + */ +var Rect$1 = /** @class */ (function (_super) { + __extends$e(Rect, _super); + function Rect() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.type = 'rect'; + _this.canFill = true; + _this.canStroke = true; + return _this; + } + Rect.prototype.getDefaultAttrs = function () { + var attrs = _super.prototype.getDefaultAttrs.call(this); + return __assign$r(__assign$r({}, attrs), { x: 0, y: 0, width: 0, height: 0, radius: 0 }); + }; + Rect.prototype.createPath = function (context, targetAttrs) { + var _this = this; + var attrs = this.attr(); + var el = this.get('el'); + // 加上状态量，用来标记 path 是否已组装 + var completed = false; + // 和组装 path 相关的绘图属性 + var pathRelatedAttrs = ['x', 'y', 'width', 'height', 'radius']; + each$2(targetAttrs || attrs, function (value, attr) { + if (pathRelatedAttrs.indexOf(attr) !== -1 && !completed) { + el.setAttribute('d', _this._assembleRect(attrs)); + completed = true; + } + else if (pathRelatedAttrs.indexOf(attr) === -1 && SVG_ATTR_MAP[attr]) { + el.setAttribute(SVG_ATTR_MAP[attr], value); + } + }); + }; + Rect.prototype._assembleRect = function (attrs) { + var x = attrs.x; + var y = attrs.y; + var w = attrs.width; + var h = attrs.height; + var radius = attrs.radius; + if (!radius) { + return "M " + x + "," + y + " l " + w + ",0 l 0," + h + " l" + -w + " 0 z"; + } + var r = parseRadius$1(radius); + if (isArray$n(radius)) { + if (radius.length === 1) { + r.r1 = r.r2 = r.r3 = r.r4 = radius[0]; + } + else if (radius.length === 2) { + r.r1 = r.r3 = radius[0]; + r.r2 = r.r4 = radius[1]; + } + else if (radius.length === 3) { + r.r1 = radius[0]; + r.r2 = r.r4 = radius[1]; + r.r3 = radius[2]; + } + else { + r.r1 = radius[0]; + r.r2 = radius[1]; + r.r3 = radius[2]; + r.r4 = radius[3]; + } + } + else { + r.r1 = r.r2 = r.r3 = r.r4 = radius; + } + var d = [ + ["M " + (x + r.r1) + "," + y], + ["l " + (w - r.r1 - r.r2) + ",0"], + ["a " + r.r2 + "," + r.r2 + ",0,0,1," + r.r2 + "," + r.r2], + ["l 0," + (h - r.r2 - r.r3)], + ["a " + r.r3 + "," + r.r3 + ",0,0,1," + -r.r3 + "," + r.r3], + ["l " + (r.r3 + r.r4 - w) + ",0"], + ["a " + r.r4 + "," + r.r4 + ",0,0,1," + -r.r4 + "," + -r.r4], + ["l 0," + (r.r4 + r.r1 - h)], + ["a " + r.r1 + "," + r.r1 + ",0,0,1," + r.r1 + "," + -r.r1], + ['z'], + ]; + return d.join(' '); + }; + return Rect; +}(ShapeBase$1)); +var Rect$2 = Rect$1; + +/** + * @fileoverview text + * @author dengfuping_develop@163.com + */ +var LETTER_SPACING = 0.3; +var BASELINE_MAP = { + top: 'before-edge', + middle: 'central', + bottom: 'after-edge', + alphabetic: 'baseline', + hanging: 'hanging', +}; +// for FireFox +var BASELINE_MAP_FOR_FIREFOX = { + top: 'text-before-edge', + middle: 'central', + bottom: 'text-after-edge', + alphabetic: 'alphabetic', + hanging: 'hanging', +}; +var ANCHOR_MAP = { + left: 'left', + start: 'left', + center: 'middle', + right: 'end', + end: 'end', +}; +var Text = /** @class */ (function (_super) { + __extends$e(Text, _super); + function Text() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.type = 'text'; + _this.canFill = true; + _this.canStroke = true; + return _this; + } + Text.prototype.getDefaultAttrs = function () { + var attrs = _super.prototype.getDefaultAttrs.call(this); + return __assign$r(__assign$r({}, attrs), { x: 0, y: 0, text: null, fontSize: 12, fontFamily: 'sans-serif', fontStyle: 'normal', fontWeight: 'normal', fontVariant: 'normal', textAlign: 'start', textBaseline: 'bottom' }); + }; + Text.prototype.createPath = function (context, targetAttrs) { + var _this = this; + var attrs = this.attr(); + var el = this.get('el'); + this._setFont(); + each$2(targetAttrs || attrs, function (value, attr) { + if (attr === 'text') { + _this._setText("" + value); + } + else if (attr === 'matrix' && value) { + setTransform(_this); + } + else if (SVG_ATTR_MAP[attr]) { + el.setAttribute(SVG_ATTR_MAP[attr], value); + } + }); + el.setAttribute('paint-order', 'stroke'); + el.setAttribute('style', 'stroke-linecap:butt; stroke-linejoin:miter;'); + }; + Text.prototype._setFont = function () { + var el = this.get('el'); + var _a = this.attr(), textBaseline = _a.textBaseline, textAlign = _a.textAlign; + var browser = detect(); + if (browser && browser.name === 'firefox') { + // compatible with FireFox browser, ref: https://github.com/antvis/g/issues/119 + el.setAttribute('dominant-baseline', BASELINE_MAP_FOR_FIREFOX[textBaseline] || 'alphabetic'); + } + else { + el.setAttribute('alignment-baseline', BASELINE_MAP[textBaseline] || 'baseline'); + } + el.setAttribute('text-anchor', ANCHOR_MAP[textAlign] || 'left'); + }; + Text.prototype._setText = function (text) { + var el = this.get('el'); + var _a = this.attr(), x = _a.x, _b = _a.textBaseline, baseline = _b === void 0 ? 'bottom' : _b; + if (!text) { + el.innerHTML = ''; + } + else if (~text.indexOf('\n')) { + var textArr = text.split('\n'); + var textLen_1 = textArr.length - 1; + var arr_1 = ''; + each$2(textArr, function (segment, i) { + if (i === 0) { + if (baseline === 'alphabetic') { + arr_1 += "" + segment + ""; + } + else if (baseline === 'top') { + arr_1 += "" + segment + ""; + } + else if (baseline === 'middle') { + arr_1 += "" + segment + ""; + } + else if (baseline === 'bottom') { + arr_1 += "" + segment + ""; + } + else if (baseline === 'hanging') { + arr_1 += "" + segment + ""; + } + } + else { + arr_1 += "" + segment + ""; + } + }); + el.innerHTML = arr_1; + } + else { + el.innerHTML = text; + } + }; + return Text; +}(ShapeBase$1)); +var Text$1 = Text; + +/** + * @fileoverview gradient + * @author dengfuping_develop@163.com + */ +var regexLG = /^l\s*\(\s*([\d.]+)\s*\)\s*(.*)/i; +var regexRG = /^r\s*\(\s*([\d.]+)\s*,\s*([\d.]+)\s*,\s*([\d.]+)\s*\)\s*(.*)/i; +var regexColorStop = /[\d.]+:(#[^\s]+|[^)]+\))/gi; +function addStop(steps) { + var arr = steps.match(regexColorStop); + if (!arr) { + return ''; + } + var stops = ''; + arr.sort(function (a, b) { + a = a.split(':'); + b = b.split(':'); + return Number(a[0]) - Number(b[0]); + }); + each$2(arr, function (item) { + item = item.split(':'); + stops += ""; + }); + return stops; +} +function parseLineGradient(color, el) { + var arr = regexLG.exec(color); + var angle = mod$1(toRadian(parseFloat(arr[1])), Math.PI * 2); + var steps = arr[2]; + var start; + var end; + if (angle >= 0 && angle < 0.5 * Math.PI) { + start = { + x: 0, + y: 0, + }; + end = { + x: 1, + y: 1, + }; + } + else if (0.5 * Math.PI <= angle && angle < Math.PI) { + start = { + x: 1, + y: 0, + }; + end = { + x: 0, + y: 1, + }; + } + else if (Math.PI <= angle && angle < 1.5 * Math.PI) { + start = { + x: 1, + y: 1, + }; + end = { + x: 0, + y: 0, + }; + } + else { + start = { + x: 0, + y: 1, + }; + end = { + x: 1, + y: 0, + }; + } + var tanTheta = Math.tan(angle); + var tanTheta2 = tanTheta * tanTheta; + var x = (end.x - start.x + tanTheta * (end.y - start.y)) / (tanTheta2 + 1) + start.x; + var y = (tanTheta * (end.x - start.x + tanTheta * (end.y - start.y))) / (tanTheta2 + 1) + start.y; + el.setAttribute('x1', start.x); + el.setAttribute('y1', start.y); + el.setAttribute('x2', x); + el.setAttribute('y2', y); + el.innerHTML = addStop(steps); +} +function parseRadialGradient(color, self) { + var arr = regexRG.exec(color); + var cx = parseFloat(arr[1]); + var cy = parseFloat(arr[2]); + var r = parseFloat(arr[3]); + var steps = arr[4]; + self.setAttribute('cx', cx); + self.setAttribute('cy', cy); + self.setAttribute('r', r); + self.innerHTML = addStop(steps); +} +var Gradient = /** @class */ (function () { + function Gradient(cfg) { + this.cfg = {}; + var el = null; + var id = uniqueId$3('gradient_'); + if (cfg.toLowerCase()[0] === 'l') { + el = createSVGElement('linearGradient'); + parseLineGradient(cfg, el); + } + else { + el = createSVGElement('radialGradient'); + parseRadialGradient(cfg, el); + } + el.setAttribute('id', id); + this.el = el; + this.id = id; + this.cfg = cfg; + return this; + } + Gradient.prototype.match = function (type, attr) { + return this.cfg === attr; + }; + return Gradient; +}()); + +/** + * @fileoverview shadow + * @author dengfuping_develop@163.com + */ +var ATTR_MAP = { + shadowColor: 'color', + shadowOpacity: 'opacity', + shadowBlur: 'blur', + shadowOffsetX: 'dx', + shadowOffsetY: 'dy', +}; +var SHADOW_DIMENSION = { + x: '-40%', + y: '-40%', + width: '200%', + height: '200%', +}; +var Shadow = /** @class */ (function () { + function Shadow(cfg) { + this.type = 'filter'; + this.cfg = {}; + this.type = 'filter'; + var el = createSVGElement('filter'); + // expand the filter region to fill in shadows + each$2(SHADOW_DIMENSION, function (v, k) { + el.setAttribute(k, v); + }); + this.el = el; + this.id = uniqueId$3('filter_'); + this.el.id = this.id; + this.cfg = cfg; + this._parseShadow(cfg, el); + return this; + } + Shadow.prototype.match = function (type, cfg) { + if (this.type !== type) { + return false; + } + var flag = true; + var config = this.cfg; + each$2(Object.keys(config), function (attr) { + if (config[attr] !== cfg[attr]) { + flag = false; + return false; + } + }); + return flag; + }; + Shadow.prototype.update = function (name, value) { + var config = this.cfg; + config[ATTR_MAP[name]] = value; + this._parseShadow(config, this.el); + return this; + }; + Shadow.prototype._parseShadow = function (config, el) { + var child = ""; + el.innerHTML = child; + }; + return Shadow; +}()); + +/** + * @fileoverview arrow + * @author dengfuping_develop@163.com + */ +var Arrow$1 = /** @class */ (function () { + function Arrow(attrs, type) { + this.cfg = {}; + var el = createSVGElement('marker'); + var id = uniqueId$3('marker_'); + el.setAttribute('id', id); + var shape = createSVGElement('path'); + shape.setAttribute('stroke', attrs.stroke || 'none'); + shape.setAttribute('fill', attrs.fill || 'none'); + el.appendChild(shape); + el.setAttribute('overflow', 'visible'); + el.setAttribute('orient', 'auto-start-reverse'); + this.el = el; + this.child = shape; + this.id = id; + var cfg = attrs[type === 'marker-start' ? 'startArrow' : 'endArrow']; + this.stroke = attrs.stroke || '#000'; + if (cfg === true) { + this._setDefaultPath(type, shape); + } + else { + this.cfg = cfg; // when arrow config exists + this._setMarker(attrs.lineWidth, shape); + } + return this; + } + Arrow.prototype.match = function () { + return false; + }; + Arrow.prototype._setDefaultPath = function (type, el) { + var parent = this.el; + // 默认箭头的边长为 10，夹角为 60 度 + el.setAttribute('d', "M0,0 L" + 10 * Math.cos(Math.PI / 6) + ",5 L0,10"); + parent.setAttribute('refX', "" + 10 * Math.cos(Math.PI / 6)); + parent.setAttribute('refY', "" + 5); + }; + Arrow.prototype._setMarker = function (r, el) { + var parent = this.el; + var path = this.cfg.path; + var d = this.cfg.d; + if (isArray$n(path)) { + path = path + .map(function (segment) { + return segment.join(' '); + }) + .join(''); + } + el.setAttribute('d', path); + parent.appendChild(el); + if (d) { + parent.setAttribute('refX', "" + d / r); + } + }; + Arrow.prototype.update = function (fill) { + var child = this.child; + if (child.attr) { + child.attr('fill', fill); + } + else { + child.setAttribute('fill', fill); + } + }; + return Arrow; +}()); + +/** + * @fileoverview clip + * @author dengfuping_develop@163.com + */ +var Clip = /** @class */ (function () { + function Clip(cfg) { + this.type = 'clip'; + this.cfg = {}; + var el = createSVGElement('clipPath'); + this.el = el; + this.id = uniqueId$3('clip_'); + el.id = this.id; + var shapeEl = cfg.cfg.el; + el.appendChild(shapeEl); + this.cfg = cfg; + return this; + } + Clip.prototype.match = function () { + return false; + }; + Clip.prototype.remove = function () { + var el = this.el; + el.parentNode.removeChild(el); + }; + return Clip; +}()); + +/** + * @fileoverview pattern + * @author dengfuping_develop@163.com + */ +var regexPR = /^p\s*\(\s*([axyn])\s*\)\s*(.*)/i; +var Pattern = /** @class */ (function () { + function Pattern(cfg) { + this.cfg = {}; + var el = createSVGElement('pattern'); + el.setAttribute('patternUnits', 'userSpaceOnUse'); + var child = createSVGElement('image'); + el.appendChild(child); + var id = uniqueId$3('pattern_'); + el.id = id; + this.el = el; + this.id = id; + this.cfg = cfg; + var arr = regexPR.exec(cfg); + var source = arr[2]; + child.setAttribute('href', source); + var img = new Image(); + if (!source.match(/^data:/i)) { + img.crossOrigin = 'Anonymous'; + } + img.src = source; + function onload() { + el.setAttribute('width', "" + img.width); + el.setAttribute('height', "" + img.height); + } + if (img.complete) { + onload(); + } + else { + img.onload = onload; + // Fix onload() bug in IE9 + img.src = img.src; + } + return this; + } + Pattern.prototype.match = function (type, attr) { + return this.cfg === attr; + }; + return Pattern; +}()); + +/** + * @fileoverview defs + * @author dengfuping_develop@163.com + */ +var Defs = /** @class */ (function () { + function Defs(canvas) { + var el = createSVGElement('defs'); + var id = uniqueId$3('defs_'); + el.id = id; + canvas.appendChild(el); + this.children = []; + this.defaultArrow = {}; + this.el = el; + this.canvas = canvas; + } + Defs.prototype.find = function (type, attr) { + var children = this.children; + var result = null; + for (var i = 0; i < children.length; i++) { + if (children[i].match(type, attr)) { + result = children[i].id; + break; + } + } + return result; + }; + Defs.prototype.findById = function (id) { + var children = this.children; + var flag = null; + for (var i = 0; i < children.length; i++) { + if (children[i].id === id) { + flag = children[i]; + break; + } + } + return flag; + }; + Defs.prototype.add = function (item) { + this.children.push(item); + item.canvas = this.canvas; + item.parent = this; + }; + Defs.prototype.getDefaultArrow = function (attrs, name) { + var stroke = attrs.stroke || attrs.strokeStyle; + if (this.defaultArrow[stroke]) { + return this.defaultArrow[stroke].id; + } + var arrow = new Arrow$1(attrs, name); + this.defaultArrow[stroke] = arrow; + this.el.appendChild(arrow.el); + this.add(arrow); + return arrow.id; + }; + Defs.prototype.addGradient = function (cfg) { + var gradient = new Gradient(cfg); + this.el.appendChild(gradient.el); + this.add(gradient); + return gradient.id; + }; + Defs.prototype.addArrow = function (attrs, name) { + var arrow = new Arrow$1(attrs, name); + this.el.appendChild(arrow.el); + this.add(arrow); + return arrow.id; + }; + Defs.prototype.addShadow = function (cfg) { + var shadow = new Shadow(cfg); + this.el.appendChild(shadow.el); + this.add(shadow); + return shadow.id; + }; + Defs.prototype.addPattern = function (cfg) { + var pattern = new Pattern(cfg); + this.el.appendChild(pattern.el); + this.add(pattern); + return pattern.id; + }; + Defs.prototype.addClip = function (cfg) { + var clip = new Clip(cfg); + this.el.appendChild(clip.el); + this.add(clip); + return clip.id; + }; + return Defs; +}()); + +var Canvas = /** @class */ (function (_super) { + __extends$e(Canvas, _super); + function Canvas(cfg) { + return _super.call(this, __assign$r(__assign$r({}, cfg), { autoDraw: true, + // 设置渲染引擎为 canvas，只读属性 + renderer: 'svg' })) || this; + } + Canvas.prototype.getShapeBase = function () { + return Shape$1; + }; + Canvas.prototype.getGroupBase = function () { + return Group; + }; + // 覆盖 Container 中通过遍历的方式获取 shape 对象的逻辑，直接走 SVG 的 dom 拾取即可 + Canvas.prototype.getShape = function (x, y, ev) { + var target = ev.target || ev.srcElement; + if (!SHAPE_TO_TAGS[target.tagName]) { + var parent_1 = target.parentNode; + while (parent_1 && !SHAPE_TO_TAGS[parent_1.tagName]) { + parent_1 = parent_1.parentNode; + } + target = parent_1; + } + return this.find(function (child) { return child.get('el') === target; }); + }; + // 复写基类的方法生成标签 + Canvas.prototype.createDom = function () { + var element = createSVGElement('svg'); + var context = new Defs(element); + element.setAttribute('width', "" + this.get('width')); + element.setAttribute('height', "" + this.get('height')); + // 缓存 context 对象 + this.set('context', context); + return element; + }; + /** + * 一些方法调用会引起画布变化 + * @param {ChangeType} changeType 改变的类型 + */ + Canvas.prototype.onCanvasChange = function (changeType) { + var context = this.get('context'); + var el = this.get('el'); + if (changeType === 'sort') { + var children_1 = this.get('children'); + if (children_1 && children_1.length) { + sortDom(this, function (a, b) { + return children_1.indexOf(a) - children_1.indexOf(b) ? 1 : 0; + }); + } + } + else if (changeType === 'clear') { + // el maybe null for canvas + if (el) { + // 清空 SVG 元素 + el.innerHTML = ''; + var defsEl = context.el; + // 清空 defs 元素 + defsEl.innerHTML = ''; + // 将清空后的 defs 元素挂载到 el 下 + el.appendChild(defsEl); + } + } + else if (changeType === 'matrix') { + setTransform(this); + } + else if (changeType === 'clip') { + setClip(this, context); + } + else if (changeType === 'changeSize') { + el.setAttribute('width', "" + this.get('width')); + el.setAttribute('height', "" + this.get('height')); + } + }; + // 复写基类的 draw 方法 + Canvas.prototype.draw = function () { + var context = this.get('context'); + var children = this.getChildren(); + setClip(this, context); + if (children.length) { + drawChildren(context, children); + } + }; + return Canvas; +}(Canvas$2)); + +var version$2 = '0.5.6'; + +var SVGEngine = /*#__PURE__*/Object.freeze({ + __proto__: null, + Shape: Shape$1, + version: version$2, + Canvas: Canvas, + Group: Group, + Event: GraphEvent$1, + Base: Base$3, + AbstractCanvas: Canvas$2, + AbstractGroup: AbstractGroup, + AbstractShape: AbstractShape, + getBBoxMethod: getMethod, + getTextHeight: getTextHeight$1, + assembleFont: assembleFont$1, + isAllowCapture: isAllowCapture$1, + multiplyVec2: multiplyVec2$2, + invert: invert$1, + getOffScreenContext: getOffScreenContext$1, + PathUtil: PathUtil$2 +}); + +function isValueEmpty(value) { + if (value) { + return false; + } + return value === null || value === undefined || isNaN(value); +} +function isYNil(point) { + if (isArray$n(point)) { + // 特殊处理 area 的关键点数据，其关键点结构为 [{x: 0, y: 1}, {x: 0, y: 2}] + return isValueEmpty(point[1].y); + } + var value = point.y; + return isArray$n(value) ? isValueEmpty(value[0]) : isValueEmpty(value); +} +/** + * @ignore + * 分割数据，用于处理在一组点数据中，y 对应的数值存在 null/undefined/NaN 的情况 + * 应用于折线图、区域图以及路径图 + * + * ```typescript + * // return [[{x: 1, y: 2}, {x: 3, y: 3}]] + * getPathPoints([{x: 1, y: 2}, {x: 2, y: null}, {x: 3, y: 3}], true); + * // return [[{x: 1, y: 2}], [{x: 3, y: 3}]] + * getPathPoints([{x: 1, y: 2}, {x: 2, y: null}, {x: 3, y: 3}], false); + * // return [[[{ x: 1, y: 10 }, { x: 2, y: 2 }], [{ x: 9, y: 34 }, { x: 1, y: 1 }]]] + * getPathPoints([ + * [{ x: 1, y: 10 }, { x: 2, y: 2 }], + * [{ x: 4, y: 2 }, { x: 8, y: NaN }], + * [{ x: 9, y: 34 }, { x: 1, y: 1 }], + * ], true); + * ``` + * + * @param points 要进行处理点集合 + * @param connectNulls 是否连接空值数据 + * @param showSinglePoint 是否展示孤立点 + * @returns 返回处理后的点集合 + */ +function getPathPoints(points, connectNulls, showSinglePoint) { + if (connectNulls === void 0) { connectNulls = false; } + if (showSinglePoint === void 0) { showSinglePoint = true; } + if (!points.length || (points.length === 1 && !showSinglePoint)) { + // 空或者只有一个点并配置不展示时 + return []; + } + if (connectNulls) { + // 即 y 值为空的场景 + var filtered = []; + for (var i = 0, len = points.length; i < len; i++) { + var point = points[i]; + if (!isYNil(point)) { + filtered.push(point); + } + } + return [filtered]; + } + var result = []; + var tmp = []; + for (var i = 0, len = points.length; i < len; i++) { + var point = points[i]; + if (isYNil(point)) { + if (tmp.length) { + if (!(tmp.length === 1 && !showSinglePoint)) { + // 如果前段数据只有一个字段并且不需要展示时则不加入 + result.push(tmp); + } + tmp = []; + } + } + else { + tmp.push(point); + } + } + if (tmp.length) { + result.push(tmp); + } + return result; +} +/** + * 获取小提琴图的边界 path + * @param points + * @returns + */ +function getViolinPath(points) { + var path = []; + for (var i = 0; i < points.length; i++) { + var point = points[i]; + if (point) { + var action = i === 0 ? 'M' : 'L'; + path.push([action, point.x, point.y]); + } + } + var first = points[0]; + if (first) { + path.push(['L', first.x, first.y]); + path.push(['z']); + } + return path; +} +/** + * 获取小提琴图 平滑的边界 path + * @param points + * @returns + */ +function getSmoothViolinPath(points) { + var half = points.length / 2; + var leftPoints = []; + var rightPoints = []; + for (var i = 0; i < points.length; i++) { + if (i < half) { + leftPoints.push(points[i]); + } + else { + rightPoints.push(points[i]); + } + } + var leftPath = getSplinePath$1(leftPoints, false); + var rightPath = getSplinePath$1(rightPoints, false); + if (rightPoints.length) { + leftPath.push(['L', rightPoints[0].x, rightPoints[0].y]); + } + rightPath.shift(); + var path = leftPath.concat(rightPath); + if (leftPoints.length) { + path.push(['L', leftPoints[0].x, leftPoints[0].y]); + } + path.push(['z']); + return path; +} + +/** + * @ignore + * 获取 Shape 的图形属性 + * @param cfg + * @param isStroke 是否需要描边 + * @param isFill 是否需要填充 + * @param [sizeName] 可选，表示图形大小的属性，lineWidth 或者 r + * @returns + */ +function getStyle$1(cfg, isStroke, isFill, sizeName) { + if (sizeName === void 0) { sizeName = ''; } + var _a = cfg.style, style = _a === void 0 ? {} : _a, defaultStyle = cfg.defaultStyle, color = cfg.color, size = cfg.size; + var attrs = __assign$r(__assign$r({}, defaultStyle), style); + if (color) { + if (isStroke) { + if (!style.stroke) { + // 如果用户在 style() 中配置了 stroke，则以用户配置的为准 + attrs.stroke = color; + } + } + if (isFill) { + if (!style.fill) { + // 如果用户在 style() 中配置了 fill + attrs.fill = color; + } + } + } + if (sizeName && isNil(style[sizeName]) && !isNil(size)) { + // 如果用户在 style() 中配置了 lineWidth 或者 r 属性 + attrs[sizeName] = size; + } + return attrs; +} +/** + * 获取 矩形背景 的样式 + * @param cfg + */ +function getBackgroundRectStyle(cfg) { + return deepMix({}, { + // 默认背景色，copy from active-region + fill: '#CCD6EC', + fillOpacity: 0.3, + }, get$3(cfg, ['background', 'style'])); +} + +/** + * @ignore + * 拆分点数据 + * @example + * // result: [{x: 20, y: 20}, {x: 20, y: 30}] + * splitPoints({x: 20,y: [20, 30]}); + * @example + * // result: [{x: 20, y: 20}, {x: 30, y: 30}] + * splitPoints({x: [20, 30],y: [20, 30]}); + * @param obj + */ +function splitPoints(obj) { + // y 有可能是数组，对应原始数据中 y 为一个区间数据，如 [19, 30]，为了统一也将 x 转换为数组 + var x = obj.x; + var y = isArray$n(obj.y) ? obj.y : [obj.y]; + return y.map(function (eachY, index) { + return { + x: isArray$n(x) ? x[index] : x, + y: eachY, + }; + }); +} + +var LineSymbols = { + line: function (x, y, r) { + return [ + ['M', x - r, y], + ['L', x + r, y], + ]; + }, + dot: function (x, y, r) { + return [ + ['M', x - r, y], + ['L', x + r, y], + ]; + }, + dash: function (x, y, r) { + return [ + ['M', x - r, y], + ['L', x + r, y], + ]; + }, + smooth: function (x, y, r) { + return [ + ['M', x - r, y], + ['A', r / 2, r / 2, 0, 1, 1, x, y], + ['A', r / 2, r / 2, 0, 1, 0, x + r, y], + ]; + }, + hv: function (x, y, r) { + return [ + ['M', x - r - 1, y - 2.5], + ['L', x, y - 2.5], + ['L', x, y + 2.5], + ['L', x + r + 1, y + 2.5], + ]; + }, + vh: function (x, y, r) { + return [ + ['M', x - r - 1, y + 2.5], + ['L', x, y + 2.5], + ['L', x, y - 2.5], + ['L', x + r + 1, y - 2.5], + ]; + }, + hvh: function (x, y, r) { + return [ + ['M', x - (r + 1), y + 2.5], + ['L', x - r / 2, y + 2.5], + ['L', x - r / 2, y - 2.5], + ['L', x + r / 2, y - 2.5], + ['L', x + r / 2, y + 2.5], + ['L', x + r + 1, y + 2.5], + ]; + }, + vhv: function (x, y) { + // 宽 13px，高 8px + return [ + ['M', x - 5, y + 2.5], + ['L', x - 5, y], + ['L', x, y], + ['L', x, y - 3], + ['L', x, y + 3], + ['L', x + 6.5, y + 3], + ]; + }, +}; +/** + * Gets line marker + * @ignore + * @param markerCfg + * @param shapeType + * @returns 返回 Line 的 marker 配置 + */ +function getLineMarker(markerCfg, shapeType) { + var color = markerCfg.color; + return { + symbol: LineSymbols[shapeType], + style: { + lineWidth: 2, + r: 6, + stroke: color, + }, + }; +} + +function getShapeAttrs$1(cfg, smooth, constraint) { + var isStack = cfg.isStack, connectNulls = cfg.connectNulls, isInCircle = cfg.isInCircle, showSinglePoint = cfg.showSinglePoint; + var shapeAttrs = getStyle$1(cfg, true, false, 'lineWidth'); + var points = getPathPoints(cfg.points, connectNulls, showSinglePoint); // 根据 connectNulls 值处理 points + var path = []; + for (var i = 0, len = points.length; i < len; i++) { + var eachLinePoints = points[i]; + path = path.concat(getPath$3(eachLinePoints, isInCircle, isStack, smooth, constraint, shapeAttrs)); + } + shapeAttrs.path = path; + return shapeAttrs; +} +// 单条 path +function getSinglePath(points, isInCircle, smooth, constraint, style) { + if (points.length === 1) { + // 只有一个点时 + return [ + ['M', points[0].x, points[0].y - style.lineWidth / 2], + ['L', points[0].x, points[0].y], + ['L', points[0].x, points[0].y + style.lineWidth / 2], + ]; + } + var path; + if (!smooth) { + path = getLinePath$1(points, false); + if (isInCircle) { + path.push(['Z']); + } + } + else { + // 直角坐标系下绘制曲线时限制最大值、最小值 + if (isInCircle && points.length) { + points.push({ x: points[0].x, y: points[0].y }); + } + path = getSplinePath$1(points, false, constraint); + } + return path; +} +function getRangePath(points, isInCircle, isStack, smooth, constraint, style) { + var topPoints = []; + var bottomPoints = []; + each$2(points, function (point) { + var result = splitPoints(point); + topPoints.push(result[1]); // 上边 + bottomPoints.push(result[0]); // 底边 + }); + var topPath = getSinglePath(topPoints, isInCircle, smooth, constraint, style); + var bottomPath = getSinglePath(bottomPoints, isInCircle, smooth, constraint, style); + if (isStack) { + return topPath; + } + return topPath.concat(bottomPath); +} +function getPath$3(points, isInCircle, isStack, smooth, constraint, style) { + if (points.length) { + var first = points[0]; + return isArray$n(first.y) + ? getRangePath(points, isInCircle, isStack, smooth, constraint, style) + : getSinglePath(points, isInCircle, smooth, constraint, style); + } + return []; +} +registerShapeFactory('line', { + defaultShapeType: 'line', +}); +// 这里因为代码公用，所以直接全部注册 +// 'line' 默认折线；'dot' 点线 ···；'dash' 断线 - - - +each$2(['line', 'dot', 'dash', 'smooth'], function (shapeType) { + registerShape('line', shapeType, { + draw: function (cfg, container) { + var smooth = shapeType === 'smooth'; + var constraint; + if (smooth) { + var _a = this.coordinate, start = _a.start, end = _a.end; + constraint = [ + [start.x, end.y], + [end.x, start.y], + ]; + } + var attrs = getShapeAttrs$1(cfg, smooth, constraint); + var shape = container.addShape({ + type: 'path', + attrs: attrs, + name: 'line', + capture: !smooth, + }); + return shape; + }, + getMarker: function (markerCfg) { + return getLineMarker(markerCfg, shapeType); + }, + }); +}); + +/** + * Path 几何标记。 + * 用于绘制路径图等。 + */ +var Path = /** @class */ (function (_super) { + __extends$e(Path, _super); + function Path(cfg) { + var _this = _super.call(this, cfg) || this; + _this.type = 'path'; + _this.shapeType = 'line'; + var _a = cfg.connectNulls, connectNulls = _a === void 0 ? false : _a, _b = cfg.showSinglePoint, showSinglePoint = _b === void 0 ? true : _b; + _this.connectNulls = connectNulls; + _this.showSinglePoint = showSinglePoint; + return _this; + } + /** + * 创建所有的 Element 实例，对于 Path、Line、Area，一组数据对应一个 Element。 + * @param mappingData + * @param [isUpdate] + * @returns elements + */ + Path.prototype.createElements = function (mappingData, index, isUpdate) { + if (isUpdate === void 0) { isUpdate = false; } + // Path 的每个 element 对应一组数据 + var _a = this, lastElementsMap = _a.lastElementsMap, elementsMap = _a.elementsMap, elements = _a.elements, container = _a.container; + var elementId = this.getElementId(mappingData); + var shapeCfg = this.getShapeInfo(mappingData); + var result = lastElementsMap[elementId]; + if (!result) { + var shapeFactory = this.getShapeFactory(); + result = new Element$2({ + shapeFactory: shapeFactory, + container: container, + offscreenGroup: this.getOffscreenGroup(), + }); + result.geometry = this; + result.animate = this.animateOption; + result.draw(shapeCfg, isUpdate); // 绘制 shape + } + else { + // element 已经创建 + var preShapeCfg = result.getModel(); + if (this.isCoordinateChanged || isModelChange(preShapeCfg, shapeCfg)) { + result.animate = this.animateOption; + // 通过绘制数据的变更来判断是否需要更新，因为用户有可能会修改图形属性映射 + result.update(shapeCfg); // 更新对应的 element + } + delete lastElementsMap[elementId]; + } + elements.push(result); + elementsMap[elementId] = result; + return elements; + }; + /** + * 获取组成一条线（一组数据）的所有点以及数据 + * @param mappingData 映射后的数组 + */ + Path.prototype.getPointsAndData = function (mappingData) { + var points = []; + var data = []; + for (var i = 0, len = mappingData.length; i < len; i++) { + var obj = mappingData[i]; + points.push({ + x: obj.x, + y: obj.y, + }); + data.push(obj[FIELD_ORIGIN]); + } + return { + points: points, + data: data, + }; + }; + Path.prototype.getShapeInfo = function (mappingData) { + var shapeCfg = this.getDrawCfg(mappingData[0]); + var _a = this.getPointsAndData(mappingData), points = _a.points, data = _a.data; + shapeCfg.mappingData = mappingData; + shapeCfg.data = data; + shapeCfg.isStack = !!this.getAdjust('stack'); + shapeCfg.points = points; + shapeCfg.connectNulls = this.connectNulls; + shapeCfg.showSinglePoint = this.showSinglePoint; + return shapeCfg; + }; + return Path; +}(Geometry$2)); + +function getPath$2(points, isInCircle, smooth, registeredShape, constraint) { + var path = []; + if (points.length) { + var topLinePoints_1 = []; // area 区域上部分 + var bottomLinePoints_1 = []; // area 区域下部分 + for (var i = 0, len = points.length; i < len; i++) { + var point = points[i]; + topLinePoints_1.push(point[1]); + bottomLinePoints_1.push(point[0]); + } + bottomLinePoints_1 = bottomLinePoints_1.reverse(); + each$2([topLinePoints_1, bottomLinePoints_1], function (pointsData, index) { + var subPath = []; + var parsedPoints = registeredShape.parsePoints(pointsData); + var p1 = parsedPoints[0]; + if (topLinePoints_1.length === 1 && bottomLinePoints_1.length === 1) { + // 都只有一个点，绘制一条竖线 + subPath = + index === 0 + ? [ + ['M', p1.x - 0.5, p1.y], + ['L', p1.x + 0.5, p1.y], + ] + : [ + ['L', p1.x + 0.5, p1.y], + ['L', p1.x - 0.5, p1.y], + ]; + } + else { + if (isInCircle) { + parsedPoints.push({ x: p1.x, y: p1.y }); + } + if (smooth) { + subPath = getSplinePath$1(parsedPoints, false, constraint); + } + else { + subPath = getLinePath$1(parsedPoints, false); + } + if (index > 0) { + subPath[0][0] = 'L'; + } + } + path = path.concat(subPath); + }); + path.push(['Z']); + } + return path; +} +/** + * @ignore + * Gets shape attrs + * @param cfg + * @param isStroke + * @param smooth + * @param registeredShape + * @param [constraint] + * @returns + */ +function getShapeAttrs(cfg, isStroke, smooth, registeredShape, constraint) { + var attrs = getStyle$1(cfg, isStroke, !isStroke, 'lineWidth'); + var connectNulls = cfg.connectNulls, isInCircle = cfg.isInCircle, points = cfg.points, showSinglePoint = cfg.showSinglePoint; + var pathPoints = getPathPoints(points, connectNulls, showSinglePoint); // 根据 connectNulls 配置获取图形关键点 + var path = []; + for (var i = 0, len = pathPoints.length; i < len; i++) { + var eachPoints = pathPoints[i]; + path = path.concat(getPath$2(eachPoints, isInCircle, smooth, registeredShape, constraint)); + } + attrs.path = path; + return attrs; +} +/** + * @ignore + * Gets constraint + * @param coordinate + * @returns constraint + */ +function getConstraint(coordinate) { + var start = coordinate.start, end = coordinate.end; + return [ + [start.x, end.y], + [end.x, start.y], + ]; +} + +registerShapeFactory('area', { + defaultShapeType: 'area', + getDefaultPoints: function (pointInfo) { + // area 基本标记的绘制需要获取上下两边的顶点 + var x = pointInfo.x, y0 = pointInfo.y0; + var y = isArray$n(pointInfo.y) ? pointInfo.y : [y0, pointInfo.y]; + return y.map(function (yItem) { + return { + x: x, + y: yItem, + }; + }); + }, +}); +// Area 几何标记默认的 shape：填充的区域图 +registerShape('area', 'area', { + draw: function (cfg, container) { + var attrs = getShapeAttrs(cfg, false, false, this); + var shape = container.addShape({ + type: 'path', + attrs: attrs, + name: 'area', + }); + return shape; + }, + getMarker: function (markerCfg) { + var color = markerCfg.color; + return { + symbol: function (x, y, r) { + if (r === void 0) { r = 5.5; } + return [['M', x - r, y - 4], ['L', x + r, y - 4], ['L', x + r, y + 4], ['L', x - r, y + 4], ['Z']]; + }, + style: { + r: 5, + fill: color, + }, + }; + }, +}); + +/** + * Area 几何标记类。 + * 常用于绘制面积图。 + */ +var Area$2 = /** @class */ (function (_super) { + __extends$e(Area, _super); + function Area(cfg) { + var _this = _super.call(this, cfg) || this; + _this.type = 'area'; + _this.shapeType = 'area'; + /** 生成图形关键点 */ + _this.generatePoints = true; + /** + * 面积图是否从 0 基准线开始填充。 + * 1. 默认值为 `true`，表现如下： + * ![image](https://gw.alipayobjects.com/zos/rmsportal/ZQqwUCczalrKqGgagOVp.png) + * 2. 当值为 `false` 时，表现如下： + * ![image](https://gw.alipayobjects.com/zos/rmsportal/yPswkaXvUpCYOdhocGwB.png) + */ + _this.startOnZero = true; + var _a = cfg.startOnZero, startOnZero = _a === void 0 ? true : _a, _b = cfg.sortable, sortable = _b === void 0 ? false : _b, _c = cfg.showSinglePoint, showSinglePoint = _c === void 0 ? false : _c; + _this.startOnZero = startOnZero; // 默认为 true + _this.sortable = sortable; // 关闭默认的 X 轴数据排序 + _this.showSinglePoint = showSinglePoint; + return _this; + } + /** + * 获取图形绘制的关键点以及数据 + * @param mappingData 映射后的数据 + */ + Area.prototype.getPointsAndData = function (mappingData) { + var points = []; + var data = []; + for (var i = 0, len = mappingData.length; i < len; i++) { + var obj = mappingData[i]; + points.push(obj.points); + data.push(obj[FIELD_ORIGIN]); + } + return { + points: points, + data: data, + }; + }; + /** + * 获取 Y 轴上的最小值 + * @returns y 字段最小值 + */ + Area.prototype.getYMinValue = function () { + if (this.startOnZero) { + return _super.prototype.getYMinValue.call(this); + } + var yScale = this.getYScale(); + return yScale.min; + }; + return Area; +}(Path)); + +registerShapeFactory('edge', { + defaultShapeType: 'line', + getDefaultPoints: function (pointInfo) { + return splitPoints(pointInfo); + }, +}); +registerShape('edge', 'line', { + draw: function (cfg, container) { + var style = getStyle$1(cfg, true, false, 'lineWidth'); + var path = getLinePath$1(this.parsePoints(cfg.points), this.coordinate.isPolar); + return container.addShape('path', { + attrs: __assign$r(__assign$r({}, style), { path: path }), + }); + }, + getMarker: function (markerCfg) { + return { + symbol: 'circle', + style: { + r: 4.5, + fill: markerCfg.color, + }, + }; + }, +}); + +/** + * Edge 几何标记，用于绘制关系图中的**边**图形，如： + * 1. 流程图 + * 2. 树 + * 3. 弧长连接图 + * 4. 和弦图 + * 5. 桑基图 + */ +var Edge$2 = /** @class */ (function (_super) { + __extends$e(Edge, _super); + function Edge() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.type = 'edge'; + _this.shapeType = 'edge'; + _this.generatePoints = true; + return _this; + } + return Edge; +}(Geometry$2)); + +/** + * 用于绘制热力图。 + */ +var Heatmap$2 = /** @class */ (function (_super) { + __extends$e(Heatmap, _super); + function Heatmap() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.type = 'heatmap'; + _this.paletteCache = {}; + return _this; + } + Heatmap.prototype.createElements = function (mappingData, index, isUpdate) { + var range = this.prepareRange(mappingData); + var radius = this.prepareSize(); + var blur = get$3(this.styleOption, ['cfg', 'shadowBlur']); + if (!isNumber$4(blur)) { + blur = radius / 2; + } + this.prepareGreyScaleBlurredCircle(radius, blur); + this.drawWithRange(mappingData, range, radius, blur); + return null; + }; + /** 热力图暂时不支持 callback 回调（文档需要说明下） */ + Heatmap.prototype.color = function (field, cfg) { + this.createAttrOption('color', field, typeof cfg !== 'function' ? cfg : ''); + return this; + }; + /** + * clear + */ + Heatmap.prototype.clear = function () { + _super.prototype.clear.call(this); + this.clearShadowCanvasCtx(); + this.paletteCache = {}; + }; + Heatmap.prototype.prepareRange = function (data) { + var colorAttr = this.getAttribute('color'); + var colorField = colorAttr.getFields()[0]; + var min = Infinity; + var max = -Infinity; + data.forEach(function (row) { + var value = row[FIELD_ORIGIN][colorField]; + if (value > max) { + max = value; + } + if (value < min) { + min = value; + } + }); + if (min === max) { + min = max - 1; + } + return [min, max]; + }; + Heatmap.prototype.prepareSize = function () { + var radius = this.getDefaultValue('size'); + if (!isNumber$4(radius)) { + radius = this.getDefaultSize(); + } + return radius; + }; + Heatmap.prototype.prepareGreyScaleBlurredCircle = function (radius, blur) { + var grayScaleBlurredCanvas = this.getGrayScaleBlurredCanvas(); + var r2 = radius + blur; + var ctx = grayScaleBlurredCanvas.getContext('2d'); + grayScaleBlurredCanvas.width = grayScaleBlurredCanvas.height = r2 * 2; + ctx.clearRect(0, 0, grayScaleBlurredCanvas.width, grayScaleBlurredCanvas.height); + ctx.shadowOffsetX = ctx.shadowOffsetY = r2 * 2; + ctx.shadowBlur = blur; + ctx.shadowColor = 'black'; + ctx.beginPath(); + ctx.arc(-r2, -r2, radius, 0, Math.PI * 2, true); + ctx.closePath(); + ctx.fill(); + }; + Heatmap.prototype.drawWithRange = function (data, range, radius, blur) { + // canvas size + var _a = this.coordinate, start = _a.start, end = _a.end; + var width = this.coordinate.getWidth(); + var height = this.coordinate.getHeight(); + // value, range, etc + var colorAttr = this.getAttribute('color'); + var valueField = colorAttr.getFields()[0]; + // prepare shadow canvas context + this.clearShadowCanvasCtx(); + var ctx = this.getShadowCanvasCtx(); + // filter data + if (range) { + data = data.filter(function (row) { + return row[FIELD_ORIGIN][valueField] <= range[1] && row[FIELD_ORIGIN][valueField] >= range[0]; + }); + } + // step1. draw points with shadow + var scale = this.scales[valueField]; + for (var _i = 0, data_1 = data; _i < data_1.length; _i++) { + var obj = data_1[_i]; + var _b = this.getDrawCfg(obj), x = _b.x, y = _b.y; + var alpha = scale.scale(obj[FIELD_ORIGIN][valueField]); + this.drawGrayScaleBlurredCircle(x - start.x, y - end.y, radius + blur, alpha, ctx); + } + // step2. convert pixels + var colored = ctx.getImageData(0, 0, width, height); + this.clearShadowCanvasCtx(); + this.colorize(colored); + ctx.putImageData(colored, 0, 0); + var imageShape = this.getImageShape(); + imageShape.attr('x', start.x); + imageShape.attr('y', end.y); + imageShape.attr('width', width); + imageShape.attr('height', height); + imageShape.attr('img', ctx.canvas); + imageShape.set('origin', this.getShapeInfo(data)); // 存储绘图信息数据 + }; + Heatmap.prototype.getDefaultSize = function () { + var position = this.getAttribute('position'); + var coordinate = this.coordinate; + return Math.min(coordinate.getWidth() / (position.scales[0].ticks.length * 4), coordinate.getHeight() / (position.scales[1].ticks.length * 4)); + }; + Heatmap.prototype.clearShadowCanvasCtx = function () { + var ctx = this.getShadowCanvasCtx(); + ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height); + }; + Heatmap.prototype.getShadowCanvasCtx = function () { + var canvas = this.shadowCanvas; + if (!canvas) { + canvas = document.createElement('canvas'); + this.shadowCanvas = canvas; + } + canvas.width = this.coordinate.getWidth(); + canvas.height = this.coordinate.getHeight(); + return canvas.getContext('2d'); + }; + Heatmap.prototype.getGrayScaleBlurredCanvas = function () { + if (!this.grayScaleBlurredCanvas) { + this.grayScaleBlurredCanvas = document.createElement('canvas'); + } + return this.grayScaleBlurredCanvas; + }; + Heatmap.prototype.drawGrayScaleBlurredCircle = function (x, y, r, alpha, ctx) { + var grayScaleBlurredCanvas = this.getGrayScaleBlurredCanvas(); + ctx.globalAlpha = alpha; + ctx.drawImage(grayScaleBlurredCanvas, x - r, y - r); + }; + Heatmap.prototype.colorize = function (img) { + var colorAttr = this.getAttribute('color'); + var pixels = img.data; + var paletteCache = this.paletteCache; + for (var i = 3; i < pixels.length; i += 4) { + var alpha = pixels[i]; // get gradient color from opacity value + if (isNumber$4(alpha)) { + var palette = paletteCache[alpha] ? paletteCache[alpha] : colorUtil.rgb2arr(colorAttr.gradient(alpha / 256)); + pixels[i - 3] = palette[0]; + pixels[i - 2] = palette[1]; + pixels[i - 1] = palette[2]; + pixels[i] = alpha; + } + } + }; + Heatmap.prototype.getImageShape = function () { + var imageShape = this.imageShape; + if (imageShape) { + return imageShape; + } + var container = this.container; + imageShape = container.addShape({ + type: 'image', + attrs: {}, + }); + this.imageShape = imageShape; + return imageShape; + }; + Heatmap.prototype.getShapeInfo = function (mappingData) { + var shapeCfg = this.getDrawCfg(mappingData[0]); + return __assign$r(__assign$r({}, shapeCfg), { mappingData: mappingData, data: this.getData(mappingData) }); + }; + Heatmap.prototype.getData = function (mappingData) { + return mappingData.map(function (obj) { + return obj[FIELD_ORIGIN]; + }); + }; + return Heatmap; +}(Geometry$2)); + +/** + * @ignore + * 根据数据点生成矩形的四个关键点 + * @param pointInfo 数据点信息 + * @param [isPyramid] 是否为尖底漏斗图 + * @returns rect points 返回矩形四个顶点信息 + */ +function getRectPoints$2(pointInfo) { + var x = pointInfo.x, y = pointInfo.y, y0 = pointInfo.y0, size = pointInfo.size; + // 有 4 种情况， + // 1. x, y 都不是数组 + // 2. y是数组，x不是 + // 3. x是数组，y不是 + // 4. x, y 都是数组 + var yMin; + var yMax; + if (isArray$n(y)) { + yMin = y[0], yMax = y[1]; + } + else { + yMin = y0; + yMax = y; + } + var xMin; + var xMax; + if (isArray$n(x)) { + xMin = x[0], xMax = x[1]; + } + else { + xMin = x - size / 2; + xMax = x + size / 2; + } + var points = [ + { x: xMin, y: yMin }, + { x: xMin, y: yMax }, + ]; + // 矩形的四个关键点，结构如下（左下角顺时针连接） + // 1 ---- 2 + // | | + // 0 ---- 3 + points.push({ x: xMax, y: yMax }, { x: xMax, y: yMin }); + return points; +} +/** + * @ignore + * 根据矩形关键点绘制 path + * @param points 关键点数组 + * @param isClosed path 是否需要闭合 + * @returns 返回矩形的 path + */ +function getRectPath$2(points, isClosed) { + if (isClosed === void 0) { isClosed = true; } + var path = []; + var firstPoint = points[0]; + path.push(['M', firstPoint.x, firstPoint.y]); + for (var i = 1, len = points.length; i < len; i++) { + path.push(['L', points[i].x, points[i].y]); + } + // 对于 shape="line" path 不应该闭合，否则会造成 lineCap 绘图属性失效 + if (isClosed) { + path.push(['L', firstPoint.x, firstPoint.y]); // 需要闭合 + path.push(['z']); + } + return path; +} +/** + * 处理 rect path 的 radius + * @returns 返回矩形 path 的四个角的 arc 半径 + */ +function parseRadius(radius, minLength) { + var r1 = 0; + var r2 = 0; + var r3 = 0; + var r4 = 0; + if (isArray$n(radius)) { + if (radius.length === 1) { + r1 = r2 = r3 = r4 = radius[0]; + } + else if (radius.length === 2) { + r1 = r3 = radius[0]; + r2 = r4 = radius[1]; + } + else if (radius.length === 3) { + r1 = radius[0]; + r2 = r4 = radius[1]; + r3 = radius[2]; + } + else { + r1 = radius[0]; + r2 = radius[1]; + r3 = radius[2]; + r4 = radius[3]; + } + } + else { + r1 = r2 = r3 = r4 = radius; + } + // 处理 边界值 + if (r1 + r2 > minLength) { + r1 = r1 ? minLength / (1 + r2 / r1) : 0; + r2 = minLength - r1; + } + if (r3 + r4 > minLength) { + r3 = r3 ? minLength / (1 + r4 / r3) : 0; + r4 = minLength - r3; + } + return [r1 || 0, r2 || 0, r3 || 0, r4 || 0]; +} +/** + * 获取 interval 矩形背景的 path + * @param cfg 关键点的信息 + * @param points 已转化为画布坐标的 4 个关键点 + * @param coordinate 坐标系 + * @returns 返回矩形背景的 path + */ +function getBackgroundRectPath(cfg, points, coordinate) { + var path = []; + if (coordinate.isRect) { + var p0 = coordinate.isTransposed + ? { x: coordinate.start.x, y: points[0].y } + : { x: points[0].x, y: coordinate.start.y }; + var p1 = coordinate.isTransposed + ? { x: coordinate.end.x, y: points[2].y } + : { x: points[3].x, y: coordinate.end.y }; + // corner radius of background shape works only in 笛卡尔坐标系 + var radius = get$3(cfg, ['background', 'style', 'radius']); + if (radius) { + var width = coordinate.isTransposed ? Math.abs(points[0].y - points[2].y) : points[2].x - points[1].x; + var height = coordinate.isTransposed ? coordinate.getWidth() : coordinate.getHeight(); + var _a = parseRadius(radius, Math.min(width, height)), r1 = _a[0], r2 = _a[1], r3 = _a[2], r4 = _a[3]; + path.push(['M', p0.x, p1.y + r1]); + r1 !== 0 && path.push(['A', r1, r1, 0, 0, 1, p0.x + r1, p1.y]); + path.push(['L', p1.x - r2, p1.y]); + r2 !== 0 && path.push(['A', r2, r2, 0, 0, 1, p1.x, p1.y + r2]); + path.push(['L', p1.x, p0.y - r3]); + r3 !== 0 && path.push(['A', r3, r3, 0, 0, 1, p1.x - r3, p0.y]); + path.push(['L', p0.x + r4, p0.y]); + r4 !== 0 && path.push(['A', r4, r4, 0, 0, 1, p0.x, p0.y - r4]); + } + else { + path.push(['M', p0.x, p0.y]); + path.push(['L', p1.x, p0.y]); + path.push(['L', p1.x, p1.y]); + path.push(['L', p0.x, p1.y]); + path.push(['L', p0.x, p0.y]); + } + path.push(['z']); + } + if (coordinate.isPolar) { + var center = coordinate.getCenter(); + var _b = getAngle$2(cfg, coordinate), startAngle = _b.startAngle, endAngle = _b.endAngle; + if (coordinate.type !== 'theta' && !coordinate.isTransposed) { + // 获取扇形 path + path = getSectorPath(center.x, center.y, coordinate.getRadius(), startAngle, endAngle); + } + else { + var pow = function (v) { return Math.pow(v, 2); }; + var r1 = Math.sqrt(pow(center.x - points[0].x) + pow(center.y - points[0].y)); + var r2 = Math.sqrt(pow(center.x - points[2].x) + pow(center.y - points[2].y)); + // 获取扇形 path（其实是一个圆环，从 coordinate 的起始角度到结束角度） + path = getSectorPath(center.x, center.y, r1, coordinate.startAngle, coordinate.endAngle, r2); + } + } + return path; +} +/** + * @ignore + * 根据矩形关键点绘制 path + * @param points 关键点数组 + * @param lineCap 'round'圆角样式 + * @param coor 坐标 + * @returns 返回矩形的 path + */ +function getIntervalRectPath(points, lineCap, coor) { + var width = coor.getWidth(); + var height = coor.getHeight(); + var isRect = coor.type === 'rect'; + var path = []; + var r = (points[2].x - points[1].x) / 2; + var ry = coor.isTransposed ? (r * height) / width : (r * width) / height; + if (lineCap === 'round') { + if (isRect) { + path.push(['M', points[0].x, points[0].y + ry]); + path.push(['L', points[1].x, points[1].y - ry]); + path.push(['A', r, r, 0, 0, 1, points[2].x, points[2].y - ry]); + path.push(['L', points[3].x, points[3].y + ry]); + path.push(['A', r, r, 0, 0, 1, points[0].x, points[0].y + ry]); + } + else { + path.push(['M', points[0].x, points[0].y]); + path.push(['L', points[1].x, points[1].y]); + path.push(['A', r, r, 0, 0, 1, points[2].x, points[2].y]); + path.push(['L', points[3].x, points[3].y]); + path.push(['A', r, r, 0, 0, 1, points[0].x, points[0].y]); + } + path.push(['z']); + } + else { + path = getRectPath$2(points); + } + return path; +} +/** + * @ignore + * 根据 funnel 关键点绘制漏斗图的 path + * @param points 图形关键点信息 + * @param nextPoints 下一个数据的图形关键点信息 + * @param isPyramid 是否为尖底漏斗图 + * @returns 返回漏斗图的图形 path + */ +function getFunnelPath(points, nextPoints, isPyramid) { + var path = []; + if (!isNil(nextPoints)) { + path.push(['M', points[0].x, points[0].y], ['L', points[1].x, points[1].y], ['L', nextPoints[1].x, nextPoints[1].y], ['L', nextPoints[0].x, nextPoints[0].y], ['Z']); + } + else if (isPyramid) { + // 金字塔最底部 + path.push(['M', points[0].x, points[0].y], ['L', points[1].x, points[1].y], ['L', (points[2].x + points[3].x) / 2, (points[2].y + points[3].y) / 2], ['Z']); + } + else { + // 漏斗图最底部 + path.push(['M', points[0].x, points[0].y], ['L', points[1].x, points[1].y], ['L', points[2].x, points[2].y], ['L', points[3].x, points[3].y], ['Z']); + } + return path; +} +/** + * 获取 倒角 矩形 + * - 目前只适用于笛卡尔坐标系下 + */ +function getRectWithCornerRadius(points, coordinate, radius) { + var _a, _b, _c, _d; + // 获取 四个关键点 + var p0 = points[0], p1 = points[1], p2 = points[2], p3 = points[3]; + var _e = [0, 0, 0, 0], r1 = _e[0], r2 = _e[1], r3 = _e[2], r4 = _e[3]; + /** + * p1 → p2 + * ↑ ↓ + * p0 ← p3 + * + * 负数的情况，关键点会变成下面的形式 + * + * p0 ← p3 + * ↓ ↑ + * p1 → p2 + */ + if (p0.y < p1.y /** 负数情况 */) { + p1 = points[0], p0 = points[1], p3 = points[2], p2 = points[3]; + _a = parseRadius(radius, Math.min(p3.x - p0.x, p0.y - p1.y)), r4 = _a[0], r3 = _a[1], r2 = _a[2], r1 = _a[3]; + } + else { + _b = parseRadius(radius, Math.min(p3.x - p0.x, p0.y - p1.y)), r1 = _b[0], r2 = _b[1], r3 = _b[2], r4 = _b[3]; + } + /** + * 转置前 + * p1 → p2 + * ↑ ↓ + * p0 ← p3 + * + * 转置后(↓ 是 x 轴递增，→ 是 y 轴递增)，从 p0 开始绘制，对应的 radius: [r3, r2, r1, r4] + * p3 ← p2 + * ↓ ↑ + * P0 → p1（points[3]） + * + * 负数的情况，y 轴翻转 + * + * p0 → p1 + * ↑ ↓ + * p3 ← p2 + */ + if (coordinate.isTransposed) { + p0 = points[0], p3 = points[1], p2 = points[2], p1 = points[3]; + if (points[0].x > points[1].x /** 负数情况 */) { + p3 = points[0], p0 = points[1], p1 = points[2], p2 = points[3]; + _c = parseRadius(radius, Math.min(p3.x - p0.x, p0.y - p1.y)), r1 = _c[0], r4 = _c[1], r3 = _c[2], r2 = _c[3]; + } + else { + _d = parseRadius(radius, Math.min(p3.x - p0.x, p0.y - p1.y)), r2 = _d[0], r3 = _d[1], r4 = _d[2], r1 = _d[3]; + } + } + var path = []; + path.push(['M', p1.x, p1.y + r1]); + r1 !== 0 && path.push(['A', r1, r1, 0, 0, 1, p1.x + r1, p1.y]); + path.push(['L', p2.x - r2, p2.y]); + r2 !== 0 && path.push(['A', r2, r2, 0, 0, 1, p2.x, p2.y + r2]); + path.push(['L', p3.x, p3.y - r3]); + r3 !== 0 && path.push(['A', r3, r3, 0, 0, 1, p3.x - r3, p3.y]); + path.push(['L', p0.x + r4, p0.y]); + r4 !== 0 && path.push(['A', r4, r4, 0, 0, 1, p0.x, p0.y - r4]); + path.push(['L', p1.x, p1.y + r1]); + path.push(['z']); + return path; +} + +/** Interval 的 shape 工厂 */ +registerShapeFactory('interval', { + defaultShapeType: 'rect', + getDefaultPoints: function (pointInfo) { + return getRectPoints$2(pointInfo); + }, +}); +/** Inerval 默认 shape，填充的矩形 */ +registerShape('interval', 'rect', { + draw: function (cfg, container) { + var style = getStyle$1(cfg, false, true); + var group = container; + var backgroundCfg = cfg === null || cfg === void 0 ? void 0 : cfg.background; + if (backgroundCfg) { + group = container.addGroup(); + var backgroundStyle = getBackgroundRectStyle(cfg); + var backgroundPath = getBackgroundRectPath(cfg, this.parsePoints(cfg.points), this.coordinate); + group.addShape('path', { + attrs: __assign$r(__assign$r({}, backgroundStyle), { path: backgroundPath }), + zIndex: -1, + name: BACKGROUND_SHAPE, + }); + } + var path; + if (style.radius && this.coordinate.isRect) { + path = getRectWithCornerRadius(this.parsePoints(cfg.points), this.coordinate, style.radius); + } + else { + path = this.parsePath(getIntervalRectPath(cfg.points, style.lineCap, this.coordinate)); + } + var shape = group.addShape('path', { + attrs: __assign$r(__assign$r({}, style), { path: path }), + name: 'interval', + }); + return backgroundCfg ? group : shape; + }, + getMarker: function (markerCfg) { + var color = markerCfg.color, isInPolar = markerCfg.isInPolar; + if (isInPolar) { + return { + symbol: 'circle', + style: { + r: 4.5, + fill: color, + }, + }; + } + return { + symbol: 'square', + style: { + r: 4, + fill: color, + }, + }; + }, +}); + +// 已经排序后的数据查找距离最小的 +function findMinDistance(arr, scale) { + var count = arr.length; + var sourceArr = arr; + if (isString$3(sourceArr[0])) { + // 日期类型的 values 经常上文本类型，所以需要转换一下 + sourceArr = arr.map(function (v) { + return scale.translate(v); + }); + } + var distance = sourceArr[1] - sourceArr[0]; + for (var i = 2; i < count; i++) { + var tmp = sourceArr[i] - sourceArr[i - 1]; + if (distance > tmp) { + distance = tmp; + } + } + return distance; +} +function getDodgeCount(dataArray, dodgeBy) { + if (dodgeBy) { + var mergeData = flatten$2(dataArray); + var values = valuesOfKey(mergeData, dodgeBy); + return values.length; + } + return dataArray.length; +} +/** @ignore */ +function getDefaultSize(geometry) { + var theme = geometry.theme; + var coordinate = geometry.coordinate; + var xScale = geometry.getXScale(); + var xValues = xScale.values; + var dataArray = geometry.beforeMappingData; + var count = xValues.length; + var xDimensionLength = getXDimensionLength(geometry.coordinate); + // 获取柱宽相关配置项 + var intervalPadding = geometry.intervalPadding, dodgePadding = geometry.dodgePadding; + // 兼容theme配置 + var maxColumnWidth = geometry.maxColumnWidth || theme.maxColumnWidth; + var minColumnWidth = geometry.minColumnWidth || theme.minColumnWidth; + var columnWidthRatio = geometry.columnWidthRatio || theme.columnWidthRatio; + var multiplePieWidthRatio = geometry.multiplePieWidthRatio || theme.multiplePieWidthRatio; + var roseWidthRatio = geometry.roseWidthRatio || theme.roseWidthRatio; + // 线性情况下count值 + if (xScale.isLinear && xValues.length > 1) { + // Linear 类型用户有可能设置了 min, max 范围所以需要根据数据最小区间计算 count + xValues.sort(); + var interval = findMinDistance(xValues, xScale); + count = (xScale.max - xScale.min) / interval; + if (xValues.length > count) { + count = xValues.length; + } + } + var range = xScale.range; + var normalizedSize = 1 / count; + var wr = 1; + if (coordinate.isPolar) { + // 极坐标场景 + if (coordinate.isTransposed && count > 1) { + // 极坐标下多层环图 + wr = multiplePieWidthRatio; + } + else { + wr = roseWidthRatio; + } + } + else { + // 非极坐标场景 + if (xScale.isLinear) { + normalizedSize *= range[1] - range[0]; + } + wr = columnWidthRatio; + } + // 基础柱状图 + if (!isNil(intervalPadding) && intervalPadding >= 0) { + // 配置组间距情况 + var normalizedIntervalPadding = intervalPadding / xDimensionLength; + normalizedSize = (1 - (count - 1) * normalizedIntervalPadding) / count; + } + else { + // 默认情况 + normalizedSize *= wr; + } + // 分组柱状图 + if (geometry.getAdjust('dodge')) { + var dodgeAdjust = geometry.getAdjust('dodge'); + var dodgeBy = dodgeAdjust.dodgeBy; + var dodgeCount = getDodgeCount(dataArray, dodgeBy); + if (!isNil(dodgePadding) && dodgePadding >= 0) { + // 仅配置组内间距情况 + var normalizedDodgePadding = dodgePadding / xDimensionLength; + normalizedSize = (normalizedSize - normalizedDodgePadding * (dodgeCount - 1)) / dodgeCount; + } + else if (!isNil(intervalPadding) && intervalPadding >= 0) { + // 设置组间距但未设置组内间距情况，避免组间距过小导致图形重叠，需乘以wr + normalizedSize *= wr; + normalizedSize = normalizedSize / dodgeCount; + } + else { + // 组间距和组内间距均未配置 + normalizedSize = normalizedSize / dodgeCount; + } + normalizedSize = (normalizedSize >= 0) ? normalizedSize : 0; + } + // 最大和最小限制 + if (!isNil(maxColumnWidth) && maxColumnWidth >= 0) { + var normalizedMaxColumnWidth = maxColumnWidth / xDimensionLength; + if (normalizedSize > normalizedMaxColumnWidth) { + normalizedSize = normalizedMaxColumnWidth; + } + } + // minColumnWidth可能设置为0 + if (!isNil(minColumnWidth) && minColumnWidth >= 0) { + var normalizedMinColumnWidth = minColumnWidth / xDimensionLength; + if (normalizedSize < normalizedMinColumnWidth) { + normalizedSize = normalizedMinColumnWidth; + } + } + return normalizedSize; +} + +/** + * Interval 几何标记。 + * 用于绘制柱状图、饼图、条形图、玫瑰图等。 + */ +var Interval = /** @class */ (function (_super) { + __extends$e(Interval, _super); + function Interval(cfg) { + var _this = _super.call(this, cfg) || this; + _this.type = 'interval'; + _this.shapeType = 'interval'; + _this.generatePoints = true; + var background = cfg.background; + _this.background = background; + return _this; + } + /** + * 获取每条数据的 Shape 绘制信息 + * @param obj 经过分组 -> 数字化 -> adjust 调整后的数据记录 + * @returns + */ + Interval.prototype.createShapePointsCfg = function (obj) { + var cfg = _super.prototype.createShapePointsCfg.call(this, obj); + // 计算每个 shape 的 size + var size; + var sizeAttr = this.getAttribute('size'); + if (sizeAttr) { + size = this.getAttributeValues(sizeAttr, obj)[0]; + // 归一化 + var coordinate = this.coordinate; + var coordinateWidth = getXDimensionLength(coordinate); + size = size / coordinateWidth; + } + else { + if (!this.defaultSize) { + this.defaultSize = getDefaultSize(this); + } + size = this.defaultSize; + } + cfg.size = size; + return cfg; + }; + /** + * 调整 y 轴的 scale 范围。 + * 对于 Y 轴为数值轴柱状图，默认从 0 开始 生长。 + */ + Interval.prototype.adjustScale = function () { + _super.prototype.adjustScale.call(this); + var yScale = this.getYScale(); + // 特殊逻辑：饼图需要填充满整个空间 + if (this.coordinate.type === 'theta') { + yScale.change({ + nice: false, + min: 0, + // 发生过 stack 调整，yScale 的 max 被调整过，this.updateStackRange() + max: getMaxScale(yScale), + }); + } + else { + // 柱状图数值轴默认从 0 开始 + var scaleDefs = this.scaleDefs; + var field = yScale.field, min = yScale.min, max = yScale.max, type = yScale.type; + if (type !== 'time') { + // time 类型不做调整 + // 柱状图的 Y 轴要从 0 开始生长，但是如果用户设置了则以用户的为准 + if (min > 0 && !get$3(scaleDefs, [field, 'min'])) { + yScale.change({ + min: 0, + }); + } + // 柱当柱状图全为负值时也需要从 0 开始生长，但是如果用户设置了则以用户的为准 + if (max <= 0 && !get$3(scaleDefs, [field, 'max'])) { + yScale.change({ + max: 0, + }); + } + } + } + }; + /** + * @override + */ + Interval.prototype.getDrawCfg = function (mappingData) { + var shapeCfg = _super.prototype.getDrawCfg.call(this, mappingData); + shapeCfg.background = this.background; + return shapeCfg; + }; + return Interval; +}(Geometry$2)); + +/** + * Line 几何标记。 + * 常用于折线图的绘制。 + */ +var Line$4 = /** @class */ (function (_super) { + __extends$e(Line, _super); + function Line(cfg) { + var _this = _super.call(this, cfg) || this; + _this.type = 'line'; + var _a = cfg.sortable, sortable = _a === void 0 ? false : _a; // 关闭默认的 X 轴数据排序 + _this.sortable = sortable; + return _this; + } + return Line; +}(Path)); + +var SHAPES = ['circle', 'square', 'bowtie', 'diamond', 'hexagon', 'triangle', 'triangle-down']; +var HOLLOW_SHAPES = ['cross', 'tick', 'plus', 'hyphen', 'line']; +/** + * @ignore + * Draws points + * @param shape + * @param cfg + * @param container + * @param shapeName + * @param isStroke + * @returns points + */ +function drawPoints(shape, cfg, container, shapeName, isStroke) { + var style = getStyle$1(cfg, isStroke, !isStroke, 'r'); + var points = shape.parsePoints(cfg.points); + var pointPosition = points[0]; + if (cfg.isStack) { + pointPosition = points[1]; + } + else if (points.length > 1) { + var group = container.addGroup(); + for (var _i = 0, points_1 = points; _i < points_1.length; _i++) { + var point = points_1[_i]; + group.addShape({ + type: 'marker', + attrs: __assign$r(__assign$r(__assign$r({}, style), { symbol: MarkerSymbols[shapeName] || shapeName }), point), + }); + } + return group; + } + return container.addShape({ + type: 'marker', + attrs: __assign$r(__assign$r(__assign$r({}, style), { symbol: MarkerSymbols[shapeName] || shapeName }), pointPosition), + }); +} + +registerShapeFactory('point', { + defaultShapeType: 'hollow-circle', + getDefaultPoints: function (pointInfo) { + return splitPoints(pointInfo); + }, +}); +each$2(SHAPES, function (shapeName) { + // 添加该 shape 对应的 hollow-shape + registerShape('point', "hollow-" + shapeName, { + draw: function (cfg, container) { + return drawPoints(this, cfg, container, shapeName, true); + }, + getMarker: function (markerCfg) { + var color = markerCfg.color; + return { + symbol: MarkerSymbols[shapeName] || shapeName, + style: { + r: 4.5, + stroke: color, + fill: null, + }, + }; + }, + }); +}); + +/** + * Point 几何标记。 + * 常用于绘制点图。 + */ +var Point$1 = /** @class */ (function (_super) { + __extends$e(Point, _super); + function Point() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.type = 'point'; + _this.shapeType = 'point'; + _this.generatePoints = true; + return _this; + } + /** + * 获取一个点的绘制信息。 + * @param mappingDatum + * @returns draw cfg + */ + Point.prototype.getDrawCfg = function (mappingDatum) { + var shapeCfg = _super.prototype.getDrawCfg.call(this, mappingDatum); + return __assign$r(__assign$r({}, shapeCfg), { isStack: !!this.getAdjust('stack') }); + }; + return Point; +}(Geometry$2)); + +function getPath$1(points) { + var flag = points[0]; + var i = 1; + var path = [['M', flag.x, flag.y]]; + while (i < points.length) { + var c = points[i]; + if (c.x !== points[i - 1].x || c.y !== points[i - 1].y) { + path.push(['L', c.x, c.y]); + if (c.x === flag.x && c.y === flag.y && i < points.length - 1) { + flag = points[i + 1]; + path.push(['Z']); + path.push(['M', flag.x, flag.y]); + i++; + } + } + i++; + } + if (!isEqual$2(last$1(path), flag)) { + path.push(['L', flag.x, flag.y]); + } + path.push(['Z']); + return path; +} +registerShapeFactory('polygon', { + defaultShapeType: 'polygon', + getDefaultPoints: function (pointInfo) { + var points = []; + each$2(pointInfo.x, function (subX, index) { + var subY = pointInfo.y[index]; + points.push({ + x: subX, + y: subY, + }); + }); + return points; + }, +}); +registerShape('polygon', 'polygon', { + draw: function (cfg, container) { + if (!isEmpty$1(cfg.points)) { + var shapeAttrs = getStyle$1(cfg, true, true); + var path = this.parsePath(getPath$1(cfg.points)); + return container.addShape('path', { + attrs: __assign$r(__assign$r({}, shapeAttrs), { path: path }), + name: 'polygon', + }); + } + }, + getMarker: function (markerCfg) { + var color = markerCfg.color; + return { + symbol: 'square', + style: { + r: 4, + fill: color, + }, + }; + }, +}); + +/** + * Polygon 几何标记。 + * 常用于绘制色块图、日历图等。 + */ +var Polygon = /** @class */ (function (_super) { + __extends$e(Polygon, _super); + function Polygon() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.type = 'polygon'; + _this.shapeType = 'polygon'; + _this.generatePoints = true; + return _this; + } + /** + * 获取 Shape 的关键点数据。 + * @param obj + * @returns + */ + Polygon.prototype.createShapePointsCfg = function (obj) { + var cfg = _super.prototype.createShapePointsCfg.call(this, obj); + var x = cfg.x; + var y = cfg.y; + var temp; + // x y 都是数组时，不做处理 + if (!(isArray$n(x) && isArray$n(y))) { + var xScale = this.getXScale(); + var yScale = this.getYScale(); + var xCount = xScale.values.length; + var yCount = yScale.values.length; + var xOffset = (0.5 * 1) / xCount; + var yOffset = (0.5 * 1) / yCount; + if (xScale.isCategory && yScale.isCategory) { + // 如果x,y都是分类 + x = [x - xOffset, x - xOffset, x + xOffset, x + xOffset]; + y = [y - yOffset, y + yOffset, y + yOffset, y - yOffset]; + } + else if (isArray$n(x)) { + // x 是数组 + temp = x; + x = [temp[0], temp[0], temp[1], temp[1]]; + y = [y - yOffset / 2, y + yOffset / 2, y + yOffset / 2, y - yOffset / 2]; + } + else if (isArray$n(y)) { + // y 是数组 + temp = y; + y = [temp[0], temp[1], temp[1], temp[0]]; + x = [x - xOffset / 2, x - xOffset / 2, x + xOffset / 2, x + xOffset / 2]; + } + cfg.x = x; + cfg.y = y; + } + return cfg; + }; + return Polygon; +}(Geometry$2)); + +registerShapeFactory('schema', { + defaultShapeType: '', +}); + +/** + * Schema 几何标记，用于一些自定义图形的绘制，比如箱型图、股票图等。 + */ +var Schema = /** @class */ (function (_super) { + __extends$e(Schema, _super); + function Schema() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.type = 'schema'; + _this.shapeType = 'schema'; + _this.generatePoints = true; + return _this; + } + /** + * 获取 Shape 的关键点数据。 + * @param record + * @returns + */ + Schema.prototype.createShapePointsCfg = function (record) { + var cfg = _super.prototype.createShapePointsCfg.call(this, record); + // 计算每个 shape 的 size + var size; + var sizeAttr = this.getAttribute('size'); + if (sizeAttr) { + size = this.getAttributeValues(sizeAttr, record)[0]; + // 归一化 + var coordinate = this.coordinate; + var coordinateWidth = getXDimensionLength(coordinate); + size = size / coordinateWidth; + } + else { + if (!this.defaultSize) { + this.defaultSize = getDefaultSize(this); + } + size = this.defaultSize; + } + cfg.size = size; + return cfg; + }; + return Schema; +}(Geometry$2)); + +function normalizeSize(arr) { + if (!isArray$n(arr)) { + return []; + } + var maxValue = max$7(arr); + return map$4(arr, function (num) { return num / maxValue; }); +} +registerShapeFactory('violin', { + defaultShapeType: 'violin', + getDefaultPoints: function (pointInfo) { + var radius = pointInfo.size / 2; + var points = []; + var sizeArr = normalizeSize(pointInfo._size); + each$2(pointInfo.y, function (y, index) { + var offset = sizeArr[index] * radius; + var isMin = index === 0; + var isMax = index === pointInfo.y.length - 1; + points.push({ + isMin: isMin, + isMax: isMax, + x: pointInfo.x - offset, + y: y, + }); + points.unshift({ + isMin: isMin, + isMax: isMax, + x: pointInfo.x + offset, + y: y, + }); + }); + return points; + }, +}); +registerShape('violin', 'violin', { + draw: function (cfg, container) { + var shapeAttrs = getStyle$1(cfg, true, true); + var path = this.parsePath(getViolinPath(cfg.points)); + return container.addShape('path', { + attrs: __assign$r(__assign$r({}, shapeAttrs), { path: path }), + name: 'violin', + }); + }, + getMarker: function (markerCfg) { + var color = markerCfg.color; + return { + symbol: 'circle', + style: { + r: 4, + fill: color, + }, + }; + }, +}); + +/** + * Violin 几何标记。 + * 用于绘制小提琴图。 + */ +var Violin$2 = /** @class */ (function (_super) { + __extends$e(Violin, _super); + function Violin() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.type = 'violin'; + _this.shapeType = 'violin'; + _this.generatePoints = true; + return _this; + } + /** + * 获取 Shape 的关键点数据。 + * @param record + * @returns + */ + Violin.prototype.createShapePointsCfg = function (record) { + var cfg = _super.prototype.createShapePointsCfg.call(this, record); + // 计算每个 shape 的 size + var size; + var sizeAttr = this.getAttribute('size'); + if (sizeAttr) { + size = this.getAttributeValues(sizeAttr, record)[0]; + // 归一化 + var coordinate = this.coordinate; + var coordinateWidth = getXDimensionLength(coordinate); + size = size / coordinateWidth; + } + else { + if (!this.defaultSize) { + this.defaultSize = getDefaultSize(this); + } + size = this.defaultSize; + } + cfg.size = size; + cfg._size = get$3(record[FIELD_ORIGIN], [this._sizeField]); + return cfg; + }; + /** + * @override + */ + Violin.prototype.initAttributes = function () { + var attributeOption = this.attributeOption; + var sizeField = attributeOption.size + ? attributeOption.size.fields[0] + : this._sizeField + ? this._sizeField + : 'size'; + this._sizeField = sizeField; + // fixme 干啥要删掉 + delete attributeOption.size; + _super.prototype.initAttributes.call(this); + }; + return Violin; +}(Geometry$2)); + +/** + * 描边但不填充的区域图 + */ +registerShape('area', 'line', { + draw: function (cfg, container) { + var attrs = getShapeAttrs(cfg, true, false, this); + var shape = container.addShape({ + type: 'path', + attrs: attrs, + name: 'area', + }); + return shape; + }, + getMarker: function (markerCfg) { + var color = markerCfg.color; + return { + symbol: function (x, y, r) { + if (r === void 0) { r = 5.5; } + return [['M', x - r, y - 4], ['L', x + r, y - 4], ['L', x + r, y + 4], ['L', x - r, y + 4], ['Z']]; + }, + style: { + r: 5, + stroke: color, + fill: null, + }, + }; + }, +}); + +/** + * 填充的平滑曲面图 + */ +registerShape('area', 'smooth', { + draw: function (cfg, container) { + var coordinate = this.coordinate; + var attrs = getShapeAttrs(cfg, false, true, this, getConstraint(coordinate)); + var shape = container.addShape({ + type: 'path', + attrs: attrs, + name: 'area', + }); + return shape; + }, + getMarker: function (markerCfg) { + var color = markerCfg.color; + return { + symbol: function (x, y, r) { + if (r === void 0) { r = 5.5; } + return [['M', x - r, y - 4], ['L', x + r, y - 4], ['L', x + r, y + 4], ['L', x - r, y + 4], ['Z']]; + }, + style: { + r: 5, + fill: color, + }, + }; + }, +}); + +/** 描边的平滑曲面图 */ +registerShape('area', 'smooth-line', { + draw: function (cfg, container) { + var coordinate = this.coordinate; + var attrs = getShapeAttrs(cfg, true, true, this, getConstraint(coordinate)); + var shape = container.addShape({ + type: 'path', + attrs: attrs, + name: 'area', + }); + return shape; + }, + getMarker: function (markerCfg) { + var color = markerCfg.color; + return { + symbol: function (x, y, r) { + if (r === void 0) { r = 5.5; } + return [['M', x - r, y - 4], ['L', x + r, y - 4], ['L', x + r, y + 4], ['L', x - r, y + 4], ['Z']]; + }, + style: { + r: 5, + stroke: color, + fill: null, + }, + }; + }, +}); + +/** + * @ignore + * Gets cpath + * @param from + * @param to + * @returns + */ +function getCPath(from, to) { + return [ + 'C', + (from.x * 1) / 2 + (to.x * 1) / 2, from.y, + (from.x * 1) / 2 + (to.x * 1) / 2, to.y, + to.x, to.y, + ]; +} +/** + * @ignore + * Gets qpath + * @param to + * @param center + * @returns + */ +function getQPath(to, center) { + var points = []; + points.push({ + x: center.x, + y: center.y, + }); + points.push(to); + var sub = ['Q']; + each$2(points, function (point) { + sub.push(point.x, point.y); + }); + return sub; +} + +function getArcShapePath(from, to, center) { + var sub = getQPath(to, center); + var path = [['M', from.x, from.y]]; + path.push(sub); + return path; +} +function getArcShapeWeightPath(points, center) { + var arc1 = getQPath(points[1], center); + var arc2 = getQPath(points[3], center); + var path = [['M', points[0].x, points[0].y]]; + path.push(arc2); + path.push(['L', points[3].x, points[3].y]); + path.push(['L', points[2].x, points[2].y]); + path.push(arc1); + path.push(['L', points[1].x, points[1].y]); + path.push(['L', points[0].x, points[0].y]); + path.push(['Z']); + return path; +} +// 弧线包括笛卡尔坐标系下的半圆弧线、极坐标系下以圆心为控制点的二阶曲线、笛卡尔坐标系下带权重的三阶曲线、极坐标系下带权重的以圆心为控制点的二阶曲线 +registerShape('edge', 'arc', { + draw: function (cfg, container) { + var style = getStyle$1(cfg, true, false, 'lineWidth'); + var points = cfg.points; + var type = points.length > 2 ? 'weight' : 'normal'; + var path; + if (cfg.isInCircle) { + var center = { x: 0, y: 1 }; + if (type === 'normal') { + path = getArcShapePath(points[0], points[1], center); + } + else { + style.fill = style.stroke; + path = getArcShapeWeightPath(points, center); + } + path = this.parsePath(path); + return container.addShape('path', { + attrs: __assign$r(__assign$r({}, style), { path: path }), + }); + } + else { + if (type === 'normal') { + points = this.parsePoints(points); + path = getArcPath((points[1].x + points[0].x) / 2, points[0].y, Math.abs(points[1].x - points[0].x) / 2, Math.PI, Math.PI * 2); + return container.addShape('path', { + attrs: __assign$r(__assign$r({}, style), { path: path }), + }); + } + else { + var c1 = getCPath(points[1], points[3]); + var c2 = getCPath(points[2], points[0]); + path = [ + ['M', points[0].x, points[0].y], + ['L', points[1].x, points[1].y], + c1, + ['L', points[3].x, points[3].y], + ['L', points[2].x, points[2].y], + c2, + ['Z'], + ]; + path = this.parsePath(path); + style.fill = style.stroke; + return container.addShape('path', { + attrs: __assign$r(__assign$r({}, style), { path: path }), + }); + } + } + }, + getMarker: function (markerCfg) { + return { + symbol: 'circle', + style: { + r: 4.5, + fill: markerCfg.color, + }, + }; + }, +}); + +function getSmoothPath(from, to) { + var sub = getCPath(from, to); + var path = [['M', from.x, from.y]]; + path.push(sub); + return path; +} +registerShape('edge', 'smooth', { + draw: function (cfg, container) { + var style = getStyle$1(cfg, true, false, 'lineWidth'); + var points = cfg.points; + var path = this.parsePath(getSmoothPath(points[0], points[1])); + return container.addShape('path', { + attrs: __assign$r(__assign$r({}, style), { path: path }), + }); + }, + getMarker: function (markerCfg) { + return { + symbol: 'circle', + style: { + r: 4.5, + fill: markerCfg.color, + }, + }; + }, +}); + +var CORNER_PERCENT = 1 / 3; +function getVHVPath(from, to) { + var points = []; + points.push({ + x: from.x, + y: from.y * (1 - CORNER_PERCENT) + to.y * CORNER_PERCENT, + }); + points.push({ + x: to.x, + y: from.y * (1 - CORNER_PERCENT) + to.y * CORNER_PERCENT, + }); + points.push(to); + var path = [['M', from.x, from.y]]; + each$2(points, function (point) { + path.push(['L', point.x, point.y]); + }); + return path; +} +registerShape('edge', 'vhv', { + draw: function (cfg, container) { + var style = getStyle$1(cfg, true, false, 'lineWidth'); + var points = cfg.points; + var path = this.parsePath(getVHVPath(points[0], points[1])); + return container.addShape('path', { + attrs: __assign$r(__assign$r({}, style), { path: path }), + }); + }, + getMarker: function (markerCfg) { + return { + symbol: 'circle', + style: { + r: 4.5, + fill: markerCfg.color, + }, + }; + }, +}); + +/** 漏斗图 */ +registerShape('interval', 'funnel', { + getPoints: function (shapePoint) { + shapePoint.size = shapePoint.size * 2; // 漏斗图的 size 是柱状图的两倍 + return getRectPoints$2(shapePoint); + }, + draw: function (cfg, container) { + var style = getStyle$1(cfg, false, true); + var path = this.parsePath(getFunnelPath(cfg.points, cfg.nextPoints, false)); + var shape = container.addShape('path', { + attrs: __assign$r(__assign$r({}, style), { path: path }), + name: 'interval', + }); + return shape; + }, + getMarker: function (markerCfg) { + var color = markerCfg.color; + return { + symbol: 'square', + style: { + r: 4, + fill: color, + }, + }; + }, +}); + +/** 描边柱状图 */ +registerShape('interval', 'hollow-rect', { + draw: function (cfg, container) { + var style = getStyle$1(cfg, true, false); + var group = container; + var backgroundCfg = cfg === null || cfg === void 0 ? void 0 : cfg.background; + if (backgroundCfg) { + group = container.addGroup(); + var backgroundStyle = getBackgroundRectStyle(cfg); + var backgroundPath = getBackgroundRectPath(cfg, this.parsePoints(cfg.points), this.coordinate); + group.addShape('path', { + attrs: __assign$r(__assign$r({}, backgroundStyle), { path: backgroundPath }), + zIndex: -1, + name: BACKGROUND_SHAPE, + }); + } + var path = this.parsePath(getRectPath$2(cfg.points)); + var shape = group.addShape('path', { + attrs: __assign$r(__assign$r({}, style), { path: path }), + name: 'interval', + }); + return backgroundCfg ? group : shape; + }, + getMarker: function (markerCfg) { + var color = markerCfg.color, isInPolar = markerCfg.isInPolar; + if (isInPolar) { + return { + symbol: 'circle', + style: { + r: 4.5, + stroke: color, + fill: null, + }, + }; + } + return { + symbol: 'square', + style: { + r: 4, + stroke: color, + fill: null, + }, + }; + }, +}); + +// 根据数据点生成 Line 的两个关键点 +function getLinePoints(pointInfo) { + var x = pointInfo.x, y = pointInfo.y, y0 = pointInfo.y0; + if (isArray$n(y)) { + return y.map(function (yItem, idx) { + return { + x: isArray$n(x) ? x[idx] : x, + y: yItem, + }; + }); + } + // 起始点从 y0 开始 + return [ + { x: x, y: y0 }, + { x: x, y: y }, + ]; +} +registerShape('interval', 'line', { + getPoints: function (shapePoint) { + return getLinePoints(shapePoint); + }, + draw: function (cfg, container) { + var style = getStyle$1(cfg, true, false, 'lineWidth'); + var newStyle = omit(__assign$r({}, style), ['fill']); + var path = this.parsePath(getRectPath$2(cfg.points, false)); + var shape = container.addShape('path', { + attrs: __assign$r(__assign$r({}, newStyle), { path: path }), + name: 'interval', + }); + return shape; + }, + getMarker: function (markerCfg) { + var color = markerCfg.color; + return { + symbol: function (x, y, r) { + return [ + ['M', x, y - r], + ['L', x, y + r], + ]; + }, + style: { + r: 5, + stroke: color, + }, + }; + }, +}); + +/** 金字塔图，尖底漏斗图 */ +registerShape('interval', 'pyramid', { + getPoints: function (shapePoint) { + shapePoint.size = shapePoint.size * 2; // 漏斗图的 size 是柱状图的两倍 + return getRectPoints$2(shapePoint); + }, + draw: function (cfg, container) { + var style = getStyle$1(cfg, false, true); + var path = this.parsePath(getFunnelPath(cfg.points, cfg.nextPoints, true)); + var shape = container.addShape('path', { + attrs: __assign$r(__assign$r({}, style), { path: path }), + name: 'interval', + }); + return shape; + }, + getMarker: function (markerCfg) { + var color = markerCfg.color; + return { + symbol: 'square', + style: { + r: 4, + fill: color, + }, + }; + }, +}); + +// 根据数据点生成 tick shape 的 6 个关键点 +function getTickPoints(pointInfo) { + var x = pointInfo.x, y = pointInfo.y, y0 = pointInfo.y0, size = pointInfo.size; + var yMin; + var yMax; + if (isArray$n(y)) { + yMin = y[0], yMax = y[1]; + } + else { + yMin = y0; + yMax = y; + } + var xMax = x + size / 2; + var xMin = x - size / 2; + // tick 关键点顺序 + // 4 - 1 - 5 + // | + // 2 - 0 - 3 + return [ + { x: x, y: yMin }, + { x: x, y: yMax }, + { x: xMin, y: yMin }, + { x: xMax, y: yMin }, + { x: xMin, y: yMax }, + { x: xMax, y: yMax }, + ]; +} +// 根据 tick 关键点绘制 path +function getTickPath(points) { + return [ + ['M', points[0].x, points[0].y], + ['L', points[1].x, points[1].y], + ['M', points[2].x, points[2].y], + ['L', points[3].x, points[3].y], + ['M', points[4].x, points[4].y], + ['L', points[5].x, points[5].y], + ]; +} +/** I 形状柱状图，常用于 error bar chart */ +registerShape('interval', 'tick', { + getPoints: function (shapePoint) { + return getTickPoints(shapePoint); + }, + draw: function (cfg, container) { + var style = getStyle$1(cfg, true, false); + var path = this.parsePath(getTickPath(cfg.points)); + var shape = container.addShape('path', { + attrs: __assign$r(__assign$r({}, style), { path: path }), + name: 'interval', + }); + return shape; + }, + getMarker: function (markerCfg) { + var color = markerCfg.color; + return { + symbol: function (x, y, r) { + return [ + ['M', x - r / 2, y - r], + ['L', x + r / 2, y - r], + ['M', x, y - r], + ['L', x, y + r], + ['M', x - r / 2, y + r], + ['L', x + r / 2, y + r], + ]; + }, + style: { + r: 5, + stroke: color, + }, + }; + }, +}); + +var interpolateCallback = function (point, nextPoint, shapeType) { + var x = point.x; + var y = point.y; + var nextX = nextPoint.x; + var nextY = nextPoint.y; + var result; + switch (shapeType) { + case 'hv': + result = [{ x: nextX, y: y }]; + break; + case 'vh': + result = [{ x: x, y: nextY }]; + break; + case 'hvh': + var middleX = (nextX + x) / 2; + result = [ + { x: middleX, y: y }, + { x: middleX, y: nextY }, + ]; + break; + case 'vhv': + var middleY = (y + nextY) / 2; + result = [ + { x: x, y: middleY }, + { x: nextX, y: middleY }, + ]; + break; + } + return result; +}; +function getInterpolatePoints(points, shapeType) { + var result = []; + each$2(points, function (point, index) { + var nextPoint = points[index + 1]; + result.push(point); + if (nextPoint) { + var interpolatePoint = interpolateCallback(point, nextPoint, shapeType); + result = result.concat(interpolatePoint); + } + }); + return result; +} +// 插值的图形path，不考虑null +function getInterpolatePath(points) { + return points.map(function (point, index) { + return index === 0 ? ['M', point.x, point.y] : ['L', point.x, point.y]; + }); +} +// 插值的图形 +function getInterpolateShapeAttrs(cfg, shapeType) { + var points = getPathPoints(cfg.points, cfg.connectNulls, cfg.showSinglePoint); // 根据 connectNulls 值处理 points + var path = []; + each$2(points, function (eachLinePoints) { + var interpolatePoints = getInterpolatePoints(eachLinePoints, shapeType); + path = path.concat(getInterpolatePath(interpolatePoints)); + }); + return __assign$r(__assign$r({}, getStyle$1(cfg, true, false, 'lineWidth')), { path: path }); +} +// step line +each$2(['hv', 'vh', 'hvh', 'vhv'], function (shapeType) { + registerShape('line', shapeType, { + draw: function (cfg, container) { + var attrs = getInterpolateShapeAttrs(cfg, shapeType); + var shape = container.addShape({ + type: 'path', + attrs: attrs, + name: 'line', + }); + return shape; + }, + getMarker: function (markerCfg) { + return getLineMarker(markerCfg, shapeType); + }, + }); +}); + +// 添加 hollowShape +each$2(HOLLOW_SHAPES, function (shapeName) { + registerShape('point', shapeName, { + draw: function (cfg, container) { + return drawPoints(this, cfg, container, shapeName, true); + }, + getMarker: function (markerCfg) { + var color = markerCfg.color; + return { + symbol: MarkerSymbols[shapeName], + style: { + r: 4.5, + stroke: color, + fill: null, + }, + }; + }, + }); +}); + +registerShape('point', 'image', { + draw: function (cfg, container) { + var size = getStyle$1(cfg, false, false, 'r').r; + var points = this.parsePoints(cfg.points); + var pointPosition = points[0]; + if (cfg.isStack) { + pointPosition = points[1]; + } + else if (points.length > 1) { + var group = container.addGroup(); + for (var _i = 0, points_1 = points; _i < points_1.length; _i++) { + var point = points_1[_i]; + group.addShape('image', { + attrs: { + x: point.x - size / 2, + y: point.y - size, + width: size, + height: size, + img: cfg.shape[1], + }, + }); + } + return group; + } + return container.addShape('image', { + attrs: { + x: pointPosition.x - size / 2, + y: pointPosition.y - size, + width: size, + height: size, + img: cfg.shape[1], + }, + }); + }, + getMarker: function (markerCfg) { + var color = markerCfg.color; + return { + symbol: 'circle', + style: { + r: 4.5, + fill: color, + }, + }; + }, +}); + +// 所有的 SHAPES 都注册一下 +each$2(SHAPES, function (shapeName) { + registerShape('point', shapeName, { + draw: function (cfg, container) { + return drawPoints(this, cfg, container, shapeName, false); + }, + getMarker: function (markerCfg) { + var color = markerCfg.color; + return { + symbol: MarkerSymbols[shapeName] || shapeName, + style: { + r: 4.5, + fill: color, + }, + }; + }, + }); +}); + +function parseValue(value) { + var array = !isArray$n(value) ? [value] : value; + var min = array[0]; // 最小值 + var max = array[array.length - 1]; // 最大值 + var min1 = array.length > 1 ? array[1] : min; + var max1 = array.length > 3 ? array[3] : max; + var median = array.length > 2 ? array[2] : min1; + return { + min: min, + max: max, + min1: min1, + max1: max1, + median: median, + }; +} +function getBoxPoints$1(x, y, size) { + var halfSize = size / 2; + var pointsArray; + if (isArray$n(y)) { + // 2维 + var _a = parseValue(y), min = _a.min, max = _a.max, median = _a.median, min1 = _a.min1, max1 = _a.max1; + var minX = x - halfSize; + var maxX = x + halfSize; + pointsArray = [ + [minX, max], + [maxX, max], + [x, max], + [x, max1], + [minX, min1], + [minX, max1], + [maxX, max1], + [maxX, min1], + [x, min1], + [x, min], + [minX, min], + [maxX, min], + [minX, median], + [maxX, median], + ]; + } + else { + // 只有一个维度 + y = isNil(y) ? 0.5 : y; + var _b = parseValue(x), min = _b.min, max = _b.max, median = _b.median, min1 = _b.min1, max1 = _b.max1; + var minY = y - halfSize; + var maxY = y + halfSize; + pointsArray = [ + [min, minY], + [min, maxY], + [min, y], + [min1, y], + [min1, minY], + [min1, maxY], + [max1, maxY], + [max1, minY], + [max1, y], + [max, y], + [max, minY], + [max, maxY], + [median, minY], + [median, maxY], + ]; + } + return pointsArray.map(function (arr) { + return { + x: arr[0], + y: arr[1], + }; + }); +} +function getBoxPath(points) { + return [ + ['M', points[0].x, points[0].y], + ['L', points[1].x, points[1].y], + ['M', points[2].x, points[2].y], + ['L', points[3].x, points[3].y], + ['M', points[4].x, points[4].y], + ['L', points[5].x, points[5].y], + ['L', points[6].x, points[6].y], + ['L', points[7].x, points[7].y], + ['L', points[4].x, points[4].y], + ['Z'], + ['M', points[8].x, points[8].y], + ['L', points[9].x, points[9].y], + ['M', points[10].x, points[10].y], + ['L', points[11].x, points[11].y], + ['M', points[12].x, points[12].y], + ['L', points[13].x, points[13].y], + ]; +} +// box shape +registerShape('schema', 'box', { + getPoints: function (shapePoint) { + var x = shapePoint.x, y = shapePoint.y, size = shapePoint.size; + return getBoxPoints$1(x, y, size); + }, + draw: function (cfg, container) { + var style = getStyle$1(cfg, true, false); + var path = this.parsePath(getBoxPath(cfg.points)); + var shape = container.addShape('path', { + attrs: __assign$r(__assign$r({}, style), { path: path, name: 'schema' }), + }); + return shape; + }, + getMarker: function (markerCfg) { + var color = markerCfg.color; + return { + symbol: function (x, y, r) { + var yValues = [y - 6, y - 3, y, y + 3, y + 6]; + var points = getBoxPoints$1(x, yValues, r); + return [ + ['M', points[0].x + 1, points[0].y], + ['L', points[1].x - 1, points[1].y], + ['M', points[2].x, points[2].y], + ['L', points[3].x, points[3].y], + ['M', points[4].x, points[4].y], + ['L', points[5].x, points[5].y], + ['L', points[6].x, points[6].y], + ['L', points[7].x, points[7].y], + ['L', points[4].x, points[4].y], + ['Z'], + ['M', points[8].x, points[8].y], + ['L', points[9].x, points[9].y], + ['M', points[10].x + 1, points[10].y], + ['L', points[11].x - 1, points[11].y], + ['M', points[12].x, points[12].y], + ['L', points[13].x, points[13].y], + ]; + }, + style: { + r: 6, + lineWidth: 1, + stroke: color, + }, + }; + }, +}); + +function getCandleYValues(value) { + var array = !isArray$n(value) ? [value] : value; + // 从大到小排序 + var sorted = array.sort(function (a, b) { return b - a; }); + return padEnd(sorted, 4, sorted[sorted.length - 1]); +} +// get candle shape's key points +function getCandlePoints(x, y, size) { + var yValues = getCandleYValues(y); + return [ + { x: x, y: yValues[0] }, + { x: x, y: yValues[1] }, + { x: x - size / 2, y: yValues[2] }, + { x: x - size / 2, y: yValues[1] }, + { x: x + size / 2, y: yValues[1] }, + { x: x + size / 2, y: yValues[2] }, + { x: x, y: yValues[2] }, + { x: x, y: yValues[3] }, + ]; +} +function getCandlePath(points) { + return [ + ['M', points[0].x, points[0].y], + ['L', points[1].x, points[1].y], + ['M', points[2].x, points[2].y], + ['L', points[3].x, points[3].y], + ['L', points[4].x, points[4].y], + ['L', points[5].x, points[5].y], + ['Z'], + ['M', points[6].x, points[6].y], + ['L', points[7].x, points[7].y], + ]; +} +// k line shape +registerShape('schema', 'candle', { + getPoints: function (shapePoint) { + var x = shapePoint.x, y = shapePoint.y, size = shapePoint.size; + return getCandlePoints(x, y, size); + }, + draw: function (cfg, container) { + var style = getStyle$1(cfg, true, true); + var path = this.parsePath(getCandlePath(cfg.points)); + var shape = container.addShape('path', { + attrs: __assign$r(__assign$r({}, style), { path: path, name: 'schema' }), + }); + return shape; + }, + getMarker: function (markerCfg) { + var color = markerCfg.color; + return { + symbol: function (x, y, r) { + var yValues = [y + 7.5, y + 3, y - 3, y - 7.5]; + var points = getCandlePoints(x, yValues, r); + return [ + ['M', points[0].x, points[0].y], + ['L', points[1].x, points[1].y], + ['M', points[2].x, points[2].y], + ['L', points[3].x, points[3].y], + ['L', points[4].x, points[4].y], + ['L', points[5].x, points[5].y], + ['Z'], + ['M', points[6].x, points[6].y], + ['L', points[7].x, points[7].y], + ]; + }, + style: { + lineWidth: 1, + stroke: color, + fill: color, + r: 6, + }, + }; + }, +}); + +function getRectAttrs(points, size) { + var width = Math.abs(points[0].x - points[2].x); + var height = Math.abs(points[0].y - points[2].y); + var len = Math.min(width, height); + if (size) { + len = clamp$1(size, 0, Math.min(width, height)); + } + len = len / 2; + var centerX = (points[0].x + points[2].x) / 2; + var centerY = (points[0].y + points[2].y) / 2; + return { + x: centerX - len, + y: centerY - len, + width: len * 2, + height: len * 2, + }; +} +registerShape('polygon', 'square', { + draw: function (cfg, container) { + if (!isEmpty$1(cfg.points)) { + var shapeAttrs = getStyle$1(cfg, true, true); + var points = this.parsePoints(cfg.points); // 转换为画布坐标 + return container.addShape('rect', { + attrs: __assign$r(__assign$r({}, shapeAttrs), getRectAttrs(points, cfg.size)), + name: 'polygon', + }); + } + }, + getMarker: function (markerCfg) { + var color = markerCfg.color; + return { + symbol: 'square', + style: { + r: 4, + fill: color, + }, + }; + }, +}); + +/** + * 平滑边界的小提琴图 + */ +registerShape('violin', 'smooth', { + draw: function (cfg, container) { + var attrs = getStyle$1(cfg, true, true); + var path = this.parsePath(getSmoothViolinPath(cfg.points)); + return container.addShape('path', { + attrs: __assign$r(__assign$r({}, attrs), { path: path }), + }); + }, + getMarker: function (markerCfg) { + var color = markerCfg.color; + return { + symbol: 'circle', + style: { + stroke: null, + r: 4, + fill: color, + }, + }; + }, +}); + +/** + * 空心小提琴图 + */ +registerShape('violin', 'hollow', { + draw: function (cfg, container) { + var attrs = getStyle$1(cfg, true, false); + var path = this.parsePath(getViolinPath(cfg.points)); + return container.addShape('path', { + attrs: __assign$r(__assign$r({}, attrs), { path: path }), + }); + }, + getMarker: function (markerCfg) { + var color = markerCfg.color; + return { + symbol: 'circle', + style: { + r: 4, + fill: null, + stroke: color, + }, + }; + }, +}); +/** + * 平滑边界的空心小提琴图 + */ +registerShape('violin', 'hollow-smooth', { + draw: function (cfg, container) { + var attrs = getStyle$1(cfg, true, false); + var path = this.parsePath(getSmoothViolinPath(cfg.points)); + return container.addShape('path', { + attrs: __assign$r(__assign$r({}, attrs), { path: path }), + }); + }, + getMarker: function (markerCfg) { + var color = markerCfg.color; + return { + symbol: 'circle', + style: { + r: 4, + fill: null, + stroke: color, + }, + }; + }, +}); + +/** + * 柱状图 label + */ +var IntervalLabel = /** @class */ (function (_super) { + __extends$e(IntervalLabel, _super); + function IntervalLabel() { + return _super !== null && _super.apply(this, arguments) || this; + } + /** + * 获取 interval label 的方向，取决于 value 的值是正还是负 + * @param labelCfg + */ + IntervalLabel.prototype.getLabelValueDir = function (mappingData) { + // points 中的 x/y 和 transpose 无关 + var dim = 'y'; + var points = mappingData.points; + return points[0][dim] <= points[2][dim] ? 1 : -1; + }; + /** + * 重载：根据 interval 值的正负来调整 label 偏移量 + * @param labelCfg + * @param index + * @param total + */ + IntervalLabel.prototype.getLabelOffsetPoint = function (labelCfg, index, total) { + var _a; + var point = _super.prototype.getLabelOffsetPoint.call(this, labelCfg, index, total); + var transposed = this.getCoordinate().isTransposed; + var dim = transposed ? 'x' : 'y'; + var dir = this.getLabelValueDir(labelCfg.mappingData); + return __assign$r(__assign$r({}, point), (_a = {}, _a[dim] = point[dim] * dir, _a)); + }; + /** + * 重载：定制 interval label 的默认主题配置 + * @param labelCfg + */ + IntervalLabel.prototype.getThemedLabelCfg = function (labelCfg) { + var geometry = this.geometry; + var defaultLabelCfg = this.getDefaultLabelCfg(); + var theme = geometry.theme; + // 如果 interval label position 设置为 middle，则将主题中的 offset 覆盖为 0 + return deepMix({}, defaultLabelCfg, theme.labels, labelCfg.position === 'middle' ? { offset: 0 } : {}, labelCfg); + }; + IntervalLabel.prototype.setLabelPosition = function (labelPointCfg, mappingData, index, position) { + var coordinate = this.getCoordinate(); + var transposed = coordinate.isTransposed; + var shapePoints = mappingData.points; + var point0 = coordinate.convert(shapePoints[0]); + var point2 = coordinate.convert(shapePoints[2]); + var dir = this.getLabelValueDir(mappingData); + var top; + var right; + var bottom; + var left; + var shape = isArray$n(mappingData.shape) ? mappingData.shape[0] : mappingData.shape; + if (shape === 'funnel' || shape === 'pyramid') { + // 处理漏斗图 + var nextPoints = get$3(mappingData, 'nextPoints'); + var points = get$3(mappingData, 'points'); + if (nextPoints) { + // 非漏斗图底部 + var p0 = coordinate.convert(points[0]); + var p1 = coordinate.convert(points[1]); + var nextP0 = coordinate.convert(nextPoints[0]); + var nextP1 = coordinate.convert(nextPoints[1]); + // TODO: 使用包围盒的计算方法 + if (transposed) { + top = Math.min(nextP0.y, p0.y); + bottom = Math.max(nextP0.y, p0.y); + right = (p1.x + nextP1.x) / 2; + left = (p0.x + nextP0.x) / 2; + } + else { + top = Math.min((p1.y + nextP1.y) / 2, (p0.y + nextP0.y) / 2); + bottom = Math.max((p1.y + nextP1.y) / 2, (p0.y + nextP0.y) / 2); + right = nextP1.x; + left = p0.x; + } + } + else { + top = Math.min(point2.y, point0.y); + bottom = Math.max(point2.y, point0.y); + right = point2.x; + left = point0.x; + } + } + else { + top = Math.min(point2.y, point0.y); + bottom = Math.max(point2.y, point0.y); + right = point2.x; + left = point0.x; + } + switch (position) { + case 'right': + labelPointCfg.x = right; + labelPointCfg.y = (top + bottom) / 2; + labelPointCfg.textAlign = get$3(labelPointCfg, 'textAlign', dir > 0 ? 'left' : 'right'); + break; + case 'left': + labelPointCfg.x = left; + labelPointCfg.y = (top + bottom) / 2; + labelPointCfg.textAlign = get$3(labelPointCfg, 'textAlign', dir > 0 ? 'left' : 'right'); + break; + case 'bottom': + if (transposed) { + labelPointCfg.x = (right + left) / 2; + } + labelPointCfg.y = bottom; + labelPointCfg.textAlign = get$3(labelPointCfg, 'textAlign', 'center'); + labelPointCfg.textBaseline = get$3(labelPointCfg, 'textBaseline', dir > 0 ? 'bottom' : 'top'); + break; + case 'middle': + if (transposed) { + labelPointCfg.x = (right + left) / 2; + } + labelPointCfg.y = (top + bottom) / 2; + labelPointCfg.textAlign = get$3(labelPointCfg, 'textAlign', 'center'); + labelPointCfg.textBaseline = get$3(labelPointCfg, 'textBaseline', 'middle'); + break; + case 'top': + if (transposed) { + labelPointCfg.x = (right + left) / 2; + } + labelPointCfg.y = top; + labelPointCfg.textAlign = get$3(labelPointCfg, 'textAlign', 'center'); + labelPointCfg.textBaseline = get$3(labelPointCfg, 'textBaseline', dir > 0 ? 'bottom' : 'top'); + break; + } + }; + return IntervalLabel; +}(GeometryLabel$1)); + +var HALF_PI = Math.PI / 2; +/** + * 极坐标下的图形 label + */ +var PolarLabel = /** @class */ (function (_super) { + __extends$e(PolarLabel, _super); + function PolarLabel() { + return _super !== null && _super.apply(this, arguments) || this; + } + /** + * @override + * @desc 获取 label offset + * polar & theta coordinate support「string」type, should transform to 「number」 + */ + PolarLabel.prototype.getLabelOffset = function (offset) { + var coordinate = this.getCoordinate(); + var actualOffset = 0; + if (isNumber$4(offset)) { + actualOffset = offset; + } + else if (isString$3(offset) && offset.indexOf('%') !== -1) { + var r = coordinate.getRadius(); + if (coordinate.innerRadius > 0) { + r = r * (1 - coordinate.innerRadius); + } + actualOffset = parseFloat(offset) * 0.01 * r; + } + return actualOffset; + }; + /** + * @override + * 获取 labelItems, 增加切片 percent + * @param mapppingArray + */ + PolarLabel.prototype.getLabelItems = function (mapppingArray) { + var items = _super.prototype.getLabelItems.call(this, mapppingArray); + var yScale = this.geometry.getYScale(); + return map$4(items, function (item) { + if (item && yScale) { + var percent = yScale.scale(get$3(item.data, yScale.field)); + return __assign$r(__assign$r({}, item), { percent: percent }); + } + return item; + }); + }; + /** + * @override + * 获取文本的对齐方式 + * @param point + */ + PolarLabel.prototype.getLabelAlign = function (point) { + var coordinate = this.getCoordinate(); + var align; + if (point.labelEmit) { + align = point.angle <= Math.PI / 2 && point.angle >= -Math.PI / 2 ? 'left' : 'right'; + } + else if (!coordinate.isTransposed) { + align = 'center'; + } + else { + var center = coordinate.getCenter(); + var offset = point.offset; + if (Math.abs(point.x - center.x) < 1) { + align = 'center'; + } + else if (point.angle > Math.PI || point.angle <= 0) { + align = offset > 0 ? 'left' : 'right'; + } + else { + align = offset > 0 ? 'right' : 'left'; + } + } + return align; + }; + /** + * @override + * 获取 label 的位置 + * @param labelCfg + * @param mappingData + * @param index + */ + PolarLabel.prototype.getLabelPoint = function (labelCfg, mappingData, index) { + var factor = 1; + var arcPoint; + var content = labelCfg.content[index]; + if (this.isToMiddle(mappingData)) { + arcPoint = this.getMiddlePoint(mappingData.points); + } + else { + if (labelCfg.content.length === 1 && index === 0) { + index = 1; + } + else if (index === 0) { + factor = -1; + } + arcPoint = this.getArcPoint(mappingData, index); + } + var offset = labelCfg.offset * factor; + var middleAngle = this.getPointAngle(arcPoint); + var isLabelEmit = labelCfg.labelEmit; + var labelPositionCfg = this.getCirclePoint(middleAngle, offset, arcPoint, isLabelEmit); + if (labelPositionCfg.r === 0) { + // 如果文本位置位于圆心，则不展示 + labelPositionCfg.content = ''; + } + else { + labelPositionCfg.content = content; + labelPositionCfg.angle = middleAngle; + labelPositionCfg.color = mappingData.color; + } + labelPositionCfg.rotate = labelCfg.autoRotate + ? this.getLabelRotate(middleAngle, offset, isLabelEmit) + : labelCfg.rotate; + labelPositionCfg.start = { + x: arcPoint.x, + y: arcPoint.y, + }; + return labelPositionCfg; + }; + /** + * 获取圆弧的位置 + */ + PolarLabel.prototype.getArcPoint = function (mappingData, index) { + if (index === void 0) { index = 0; } + if (!isArray$n(mappingData.x) && !isArray$n(mappingData.y)) { + return { + x: mappingData.x, + y: mappingData.y, + }; + } + return { + x: isArray$n(mappingData.x) ? mappingData.x[index] : mappingData.x, + y: isArray$n(mappingData.y) ? mappingData.y[index] : mappingData.y, + }; + }; + /** + * 计算坐标线点在极坐标系下角度 + * @param point + */ + PolarLabel.prototype.getPointAngle = function (point) { + return getAngleByPoint(this.getCoordinate(), point); + }; + /** + * 获取坐标点与圆心形成的圆的位置信息 + * @param angle + * @param offset + * @param point + * @param isLabelEmit + */ + PolarLabel.prototype.getCirclePoint = function (angle, offset, point, isLabelEmit) { + var coordinate = this.getCoordinate(); + var center = coordinate.getCenter(); + var r = getDistanceToCenter(coordinate, point); + if (r === 0) { + return __assign$r(__assign$r({}, center), { r: r }); + } + var labelAngle = angle; + if (coordinate.isTransposed && r > offset && !isLabelEmit) { + var appendAngle = Math.asin(offset / (2 * r)); + labelAngle = angle + appendAngle * 2; + } + else { + r = r + offset; + } + return { + x: center.x + r * Math.cos(labelAngle), + y: center.y + r * Math.sin(labelAngle), + r: r, + }; + }; + /** + * 获取 label 的旋转角度 + * @param angle + * @param offset + * @param isLabelEmit + */ + PolarLabel.prototype.getLabelRotate = function (angle, offset, isLabelEmit) { + var rotate = angle + HALF_PI; + if (isLabelEmit) { + rotate -= HALF_PI; + } + if (rotate) { + if (rotate > HALF_PI) { + rotate = rotate - Math.PI; + } + else if (rotate < -HALF_PI) { + rotate = rotate + Math.PI; + } + } + return rotate; + }; + // 获取中心的位置 + PolarLabel.prototype.getMiddlePoint = function (points) { + var coordinate = this.getCoordinate(); + var count = points.length; + var middlePoint = { + x: 0, + y: 0, + }; + each$2(points, function (point) { + middlePoint.x += point.x; + middlePoint.y += point.y; + }); + middlePoint.x /= count; + middlePoint.y /= count; + middlePoint = coordinate.convert(middlePoint); + return middlePoint; + }; + // 是否居中 + PolarLabel.prototype.isToMiddle = function (mappingData) { + return mappingData.x.length > 2; + }; + return PolarLabel; +}(GeometryLabel$1)); + +/** + * 饼图 label + */ +var PieLabel = /** @class */ (function (_super) { + __extends$e(PieLabel, _super); + function PieLabel() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.defaultLayout = 'distribute'; + return _this; + } + PieLabel.prototype.getDefaultLabelCfg = function (offset, position) { + var cfg = _super.prototype.getDefaultLabelCfg.call(this, offset, position); + return deepMix({}, cfg, get$3(this.geometry.theme, 'pieLabels', {})); + }; + /** @override */ + PieLabel.prototype.getLabelOffset = function (offset) { + return _super.prototype.getLabelOffset.call(this, offset) || 0; + }; + PieLabel.prototype.getLabelRotate = function (angle, offset, isLabelLimit) { + var rotate; + if (offset < 0) { + rotate = angle; + if (rotate > Math.PI / 2) { + rotate = rotate - Math.PI; + } + if (rotate < -Math.PI / 2) { + rotate = rotate + Math.PI; + } + } + return rotate; + }; + PieLabel.prototype.getLabelAlign = function (point) { + var coordinate = this.getCoordinate(); + var center = coordinate.getCenter(); + var align; + if (point.angle <= Math.PI / 2 && point.x >= center.x) { + align = 'left'; + } + else { + align = 'right'; + } + if (point.offset <= 0) { + if (align === 'right') { + align = 'left'; + } + else { + align = 'right'; + } + } + return align; + }; + PieLabel.prototype.getArcPoint = function (point) { + return point; + }; + PieLabel.prototype.getPointAngle = function (point) { + var coordinate = this.getCoordinate(); + var startPoint = { + x: isArray$n(point.x) ? point.x[0] : point.x, + y: point.y[0], + }; + var endPoint = { + x: isArray$n(point.x) ? point.x[1] : point.x, + y: point.y[1], + }; + var angle; + var startAngle = getAngleByPoint(coordinate, startPoint); + if (point.points && point.points[0].y === point.points[1].y) { + angle = startAngle; + } + else { + var endAngle = getAngleByPoint(coordinate, endPoint); + if (startAngle >= endAngle) { + // 100% pie slice + endAngle = endAngle + Math.PI * 2; + } + angle = startAngle + (endAngle - startAngle) / 2; + } + return angle; + }; + /** @override */ + PieLabel.prototype.getCirclePoint = function (angle, offset) { + var coordinate = this.getCoordinate(); + var center = coordinate.getCenter(); + var r = coordinate.getRadius() + offset; + return __assign$r(__assign$r({}, polarToCartesian(center.x, center.y, r, angle)), { angle: angle, + r: r }); + }; + return PieLabel; +}(PolarLabel)); + +/** label text和line距离 4px */ +var MARGIN$1 = 4; +function antiCollision$1(labelShapes, labels, lineHeight, plotRange, center, isRight) { + // adjust y position of labels to avoid overlapping + var overlapping = true; + var start = plotRange.start; + var end = plotRange.end; + var startY = Math.min(start.y, end.y); + var totalHeight = Math.abs(start.y - end.y); + var i; + var maxY = 0; + var minY = Number.MIN_VALUE; + var boxes = labels.map(function (label) { + if (label.y > maxY) { + maxY = label.y; + } + if (label.y < minY) { + minY = label.y; + } + return { + size: lineHeight, + targets: [label.y - startY], + }; + }); + minY -= startY; + if (maxY - startY > totalHeight) { + totalHeight = maxY - startY; + } + while (overlapping) { + /* eslint no-loop-func: 0 */ + boxes.forEach(function (box) { + var target = (Math.min.apply(minY, box.targets) + Math.max.apply(minY, box.targets)) / 2; + box.pos = Math.min(Math.max(minY, target - box.size / 2), totalHeight - box.size); + // box.pos = Math.max(0, target - box.size / 2); + }); + // detect overlapping and join boxes + overlapping = false; + i = boxes.length; + while (i--) { + if (i > 0) { + var previousBox = boxes[i - 1]; + var box = boxes[i]; + if (previousBox.pos + previousBox.size > box.pos) { + // overlapping + previousBox.size += box.size; + previousBox.targets = previousBox.targets.concat(box.targets); + // overflow, shift up + if (previousBox.pos + previousBox.size > totalHeight) { + previousBox.pos = totalHeight - previousBox.size; + } + boxes.splice(i, 1); // removing box + overlapping = true; + } + } + } + } + i = 0; + // step 4: normalize y and adjust x + boxes.forEach(function (b) { + var posInCompositeBox = startY + lineHeight / 2; // middle of the label + b.targets.forEach(function () { + labels[i].y = b.pos + posInCompositeBox; + posInCompositeBox += lineHeight; + i++; + }); + }); + var labelsMap = {}; + for (var _i = 0, labelShapes_1 = labelShapes; _i < labelShapes_1.length; _i++) { + var labelShape = labelShapes_1[_i]; + labelsMap[labelShape.get('id')] = labelShape; + } + // (x - cx)^2 + (y - cy)^2 = totalR^2 + labels.forEach(function (label) { + var rPow2 = label.r * label.r; + var dyPow2 = Math.pow(Math.abs(label.y - center.y), 2); + if (rPow2 < dyPow2) { + label.x = center.x; + } + else { + var dx = Math.sqrt(rPow2 - dyPow2); + if (!isRight) { + // left + label.x = center.x - dx; + } + else { + // right + label.x = center.x + dx; + } + } + // adjust labelShape + var labelShape = labelsMap[label.id]; + labelShape.attr('x', label.x); + labelShape.attr('y', label.y); + // because group could not effect text-shape, should set text-shape position manually + var textShape = find$3(labelShape.getChildren(), function (ele) { return ele.get('type') === 'text'; }); + // @ts-ignore + if (textShape) { + textShape.attr('y', label.y); + textShape.attr('x', label.x); + } + }); +} +function distribute(items, labels, shapes, region) { + if (!items.length || !labels.length) { + return; + } + var offset = items[0] ? items[0].offset : 0; + var coordinate = labels[0].get('coordinate'); + var radius = coordinate.getRadius(); + var center = coordinate.getCenter(); + if (offset > 0) { + // const lineHeight = get(this.geometry.theme, ['pieLabels', 'labelHeight'], 14); + var lineHeight_1 = 14; // TODO + var totalR = radius + offset; + var totalHeight_1 = totalR * 2 + lineHeight_1 * 2; + var plotRange_1 = { + start: coordinate.start, + end: coordinate.end, + }; + // step 1: separate labels + var halves_1 = [ + [], + [], + ]; + items.forEach(function (labelItem) { + if (!labelItem) { + return; + } + if (labelItem.textAlign === 'right') { + // left + halves_1[0].push(labelItem); + } + else { + // right or center will be put on the right side + halves_1[1].push(labelItem); + } + }); + halves_1.forEach(function (half, index) { + // step 2: reduce labels + var maxLabelsCountForOneSide = totalHeight_1 / lineHeight_1; + if (half.length > maxLabelsCountForOneSide) { + half.sort(function (a, b) { + // sort by percentage DESC + return b['..percent'] - a['..percent']; + }); + half.splice(maxLabelsCountForOneSide, half.length - maxLabelsCountForOneSide); + } + // step 3: distribute position (x and y) + half.sort(function (a, b) { + // sort by y ASC + return a.y - b.y; + }); + antiCollision$1(labels, half, lineHeight_1, plotRange_1, center, index); + }); + } + // 配置 labelLine + each$2(items, function (item) { + if (item && item.labelLine) { + var distance = item.offset; + var angle = item.angle; + // 贴近圆周 + var startPoint = polarToCartesian(center.x, center.y, radius, angle); + var innerPoint = polarToCartesian(center.x, center.y, radius + distance / 2, angle); + var itemX = item.x + get$3(item, 'offsetX', 0); + var itemY = item.y + get$3(item, 'offsetY', 0); + var endPoint = { + x: itemX - Math.cos(angle) * MARGIN$1, + y: itemY - Math.sin(angle) * MARGIN$1, + }; + if (!isObject$f(item.labelLine)) { + // labelLine: true + item.labelLine = {}; + } + item.labelLine.path = [ + "M " + startPoint.x, + startPoint.y + " Q" + innerPoint.x, + innerPoint.y + " " + endPoint.x, + endPoint.y, + ].join(','); + } + }); +} + +/** + * 碰撞检测算法 + */ +function antiCollision(items, labelHeight, plotRange) { + var labels = items.filter(function (item) { return !item.invisible; }); + // sorted by y, mutable + labels.sort(function (a, b) { return a.y - b.y; }); + // adjust y position of labels to avoid overlapping + var overlapping = true; + var startY = plotRange.minY; + var endY = plotRange.maxY; + var totalHeight = Math.abs(startY - endY); + var i; + var maxY = 0; + var minY = Number.MIN_VALUE; + var boxes = labels.map(function (label) { + if (label.y > maxY) { + maxY = label.y; + } + if (label.y < minY) { + minY = label.y; + } + return { + content: label.content, + size: labelHeight, + targets: [label.y - startY], + pos: null, + }; + }); + minY -= startY; + if (maxY - startY > totalHeight) { + totalHeight = maxY - startY; + } + while (overlapping) { + /* eslint no-loop-func: 0 */ + boxes.forEach(function (box) { + var target = (Math.min.apply(minY, box.targets) + Math.max.apply(minY, box.targets)) / 2; + box.pos = Math.min(Math.max(minY, target - box.size / 2), totalHeight - box.size); + box.pos = Math.max(0, box.pos); + }); + // detect overlapping and join boxes + overlapping = false; + i = boxes.length; + while (i--) { + if (i > 0) { + var previousBox = boxes[i - 1]; + var box = boxes[i]; + if (previousBox.pos + previousBox.size > box.pos) { + // overlapping + previousBox.size += box.size; + previousBox.targets = previousBox.targets.concat(box.targets); + // overflow, shift up + if (previousBox.pos + previousBox.size > totalHeight) { + previousBox.pos = totalHeight - previousBox.size; + } + boxes.splice(i, 1); // removing box + overlapping = true; + } + } + } + } + i = 0; + // step 4: normalize y and adjust x + boxes.forEach(function (b) { + var posInCompositeBox = startY + labelHeight / 2; // middle of the label + b.targets.forEach(function () { + labels[i].y = b.pos + posInCompositeBox; + posInCompositeBox += labelHeight; + i++; + }); + }); +} + +/** label text和line距离 4px */ +var MARGIN = 4; +/** + * 配置 labelline + * @param item PolarLabelItem + */ +function drawLabelline$1(item /** PolarLabelItem */, coordinate) { + /** 坐标圆心 */ + var center = coordinate.getCenter(); + /** 圆半径 */ + var radius = coordinate.getRadius(); + if (item && item.labelLine) { + var angle = item.angle, labelOffset = item.offset; + // 贴近圆周 + var startPoint = polarToCartesian(center.x, center.y, radius, angle); + var itemX = item.x + get$3(item, 'offsetX', 0) * (Math.cos(angle) > 0 ? 1 : -1); + var itemY = item.y + get$3(item, 'offsetY', 0) * (Math.sin(angle) > 0 ? 1 : -1); + var endPoint = { + x: itemX - Math.cos(angle) * MARGIN, + y: itemY - Math.sin(angle) * MARGIN, + }; + var smoothConnector = item.labelLine.smooth; + var path = []; + var dx = endPoint.x - center.x; + var dy = endPoint.y - center.y; + var endAngle = Math.atan(dy / dx); + // 第三象限 & 第四象限 + if (dx < 0) { + endAngle += Math.PI; + } + // 默认 smooth, undefined 也为 smooth + if (smoothConnector === false) { + if (!isObject$f(item.labelLine)) { + // labelLine: true + item.labelLine = {}; + } + // 表示弧线的方向，0 表示从起点到终点沿逆时针画弧, 1 表示顺时针 + var sweepFlag = 0; + // 第一象限 + if ((angle < 0 && angle > -Math.PI / 2) || angle > Math.PI * 1.5) { + if (endPoint.y > startPoint.y) { + sweepFlag = 1; + } + } + // 第二象限 + if (angle >= 0 && angle < Math.PI / 2) { + if (endPoint.y > startPoint.y) { + sweepFlag = 1; + } + } + // 第三象限 + if (angle >= Math.PI / 2 && angle < Math.PI) { + if (startPoint.y > endPoint.y) { + sweepFlag = 1; + } + } + // 第四象限 + if (angle < -Math.PI / 2 || (angle >= Math.PI && angle < Math.PI * 1.5)) { + if (startPoint.y > endPoint.y) { + sweepFlag = 1; + } + } + var distance = labelOffset / 2 > 4 ? 4 : Math.max(labelOffset / 2 - 1, 0); + var breakPoint = polarToCartesian(center.x, center.y, radius + distance, angle); + // 圆弧的结束点 + var breakPoint3 = polarToCartesian(center.x, center.y, radius + labelOffset / 2, endAngle); + /** + * @example + * M 100 100 L100 90 A 50 50 0 0 0 150 50 + * 移动至 (100, 100), 连接到 (100, 90), 以 (50, 50) 为圆心，绘制圆弧至 (150, 50); + * A 命令的第 4 个参数 large-arc-flag, 决定弧线是大于还是小于 180 度: 0 表示小角度弧，1 表示大角 + * 第 5 个参数: 是否顺时针绘制 + */ + // 默认小弧 + var largeArcFlag = 0; + // step1: 移动至起点 + path.push("M " + startPoint.x + " " + startPoint.y); + // step2: 连接拐点 + path.push("L " + breakPoint.x + " " + breakPoint.y); + // step3: 绘制圆弧 至 结束点 + path.push("A " + center.x + " " + center.y + " 0 " + largeArcFlag + " " + sweepFlag + " " + breakPoint3.x + " " + breakPoint3.y); + // step4: 连接结束点 + path.push("L " + endPoint.x + " " + endPoint.y); + } + else { + var breakPoint = polarToCartesian(center.x, center.y, radius + (labelOffset / 2 > 4 ? 4 : Math.max(labelOffset / 2 - 1, 0)), angle); + // G2 旧的拉线 + // path.push('Q', `${breakPoint.x}`, `${breakPoint.y}`, `${endPoint.x}`, `${endPoint.y}`); + var xSign = startPoint.x < center.x ? 1 : -1; + // step1: 连接结束点 + path.push("M " + endPoint.x + " " + endPoint.y); + var slope1 = (startPoint.y - center.y) / (startPoint.x - center.x); + var slope2 = (endPoint.y - center.y) / (endPoint.x - center.x); + if (Math.abs(slope1 - slope2) > Math.pow(Math.E, -16)) { + // step2: 绘制 curve line (起点 & 结合点与圆心的斜率不等时, 由于存在误差, 使用近似处理) + path.push.apply(path, [ + 'C', + endPoint.x + xSign * 4, + endPoint.y, + 2 * breakPoint.x - startPoint.x, + 2 * breakPoint.y - startPoint.y, + startPoint.x, + startPoint.y, + ]); + } + // step3: 连接至起点 + path.push("L " + startPoint.x + " " + startPoint.y); + } + item.labelLine.path = path.join(' '); + } +} +/** + * 饼图 outer-label 布局, 适用于 type = pie 且 label offset > 0 的标签 + */ +function pieOuterLabelLayout(originalItems, labels, shapes, region) { + var items = filter$1(originalItems, function (item) { return !isNil(item); }); + /** 坐标系 */ + var coordinate = labels[0] && labels[0].get('coordinate'); + if (!coordinate) { + return; + } + /** 坐标圆心 */ + var center = coordinate.getCenter(); + /** 圆半径 */ + var radius = coordinate.getRadius(); + /** label shapes */ + var labelsMap = {}; + for (var _i = 0, labels_1 = labels; _i < labels_1.length; _i++) { + var labelShape = labels_1[_i]; + labelsMap[labelShape.get('id')] = labelShape; + } + // note labelHeight 可以控制 label 的行高 + var labelHeight = get$3(items[0], 'labelHeight', 14); + var labelOffset = get$3(items[0], 'offset', 0); + if (labelOffset <= 0) { + return; + } + var LEFT_HALF_KEY = 'left'; + var RIGHT_HALF_KEY = 'right'; + // step 1: separate labels + var separateLabels = groupBy(items, function (item) { return (item.x < center.x ? LEFT_HALF_KEY : RIGHT_HALF_KEY); }); + var start = coordinate.start, end = coordinate.end; + // step2: calculate totalHeight + var totalHeight = Math.min((radius + labelOffset + labelHeight) * 2, coordinate.getHeight()); + var totalR = totalHeight / 2; + /** labels 容器的范围(后续根据组件的布局设计进行调整) */ + var labelsContainerRange = { + minX: start.x, + maxX: end.x, + minY: center.y - totalR, + maxY: center.y + totalR, + }; + // step 3: antiCollision + each$2(separateLabels, function (half, key) { + var maxLabelsCountForOneSide = Math.floor(totalHeight / labelHeight); + if (half.length > maxLabelsCountForOneSide) { + half.sort(function (a, b) { + // sort by percentage DESC + return b.percent - a.percent; + }); + each$2(half, function (labelItem, idx) { + if (idx + 1 > maxLabelsCountForOneSide) { + labelsMap[labelItem.id].set('visible', false); + labelItem.invisible = true; + } + }); + } + antiCollision(half, labelHeight, labelsContainerRange); + }); + each$2(separateLabels, function (half, key) { + each$2(half, function (item) { + var isRight = key === RIGHT_HALF_KEY; + var labelShape = labelsMap[item.id]; + // because group could not effect content-shape, should set content-shape position manually + var content = labelShape.getChildByIndex(0); + // textShape 发生过调整 + if (content) { + var r = radius + labelOffset; + // (x - cx)^2 + (y - cy)^2 = totalR^2 + var dy = item.y - center.y; + var rPow2 = Math.pow(r, 2); + var dyPow2 = Math.pow(dy, 2); + var dxPow2 = rPow2 - dyPow2 > 0 ? rPow2 - dyPow2 : 0; + var dx = Math.sqrt(dxPow2); + var dx_offset = Math.abs(Math.cos(item.angle) * r); + if (!isRight) { + // left + item.x = center.x - Math.max(dx, dx_offset); + } + else { + // right + item.x = center.x + Math.max(dx, dx_offset); + } + } + // adjust labelShape + if (content) { + content.attr('y', item.y); + content.attr('x', item.x); + } + drawLabelline$1(item, coordinate); + }); + }); +} + +/** 拐点偏移量, 暂不可配置 */ +var INFLECTION_OFFSET = 4; +/** 标签偏移量, distance between label and edge: offsetX */ +var LABEL_OFFSET_X = 4; +/** 标签与牵引线的偏移量 */ +var LABEL_TEXT_LINE_OFFSET = 4; +function drawLabelline(item, coordinate, inRight) { + /** 坐标圆心 */ + var center = coordinate.getCenter(); + /** 圆半径 */ + var radius = coordinate.getRadius(); + var startPoint = { + x: item.x - (inRight ? LABEL_TEXT_LINE_OFFSET : -LABEL_TEXT_LINE_OFFSET), + y: item.y, + }; + var inflectionPoint = polarToCartesian(center.x, center.y, radius + INFLECTION_OFFSET, item.angle); + var p1 = { x: startPoint.x, y: startPoint.y }; + var p2 = { x: inflectionPoint.x, y: inflectionPoint.y }; + var endPoint = polarToCartesian(center.x, center.y, radius, item.angle); + var path = ''; + // 文本被调整下去了，则添加拐点连接线 + if (startPoint.y !== inflectionPoint.y) { + var offset = inRight ? 4 : -4; + p1.y = startPoint.y; + /** 是否在第一象限 */ + if (item.angle < 0 && item.angle >= -Math.PI / 2) { + p1.x = Math.max(inflectionPoint.x, startPoint.x - offset); + if (startPoint.y < inflectionPoint.y) { + p2.y = p1.y; + } + else { + p2.y = inflectionPoint.y; + p2.x = Math.max(p2.x, p1.x - offset); + } + } + /** 是否在 第二象限 */ + if (item.angle > 0 && item.angle < Math.PI / 2) { + p1.x = Math.max(inflectionPoint.x, startPoint.x - offset); + if (startPoint.y > inflectionPoint.y) { + p2.y = p1.y; + } + else { + p2.y = inflectionPoint.y; + p2.x = Math.max(p2.x, p1.x - offset); + } + } + /** 是否在 第三象限 */ + if (item.angle > Math.PI / 2) { + p1.x = Math.min(inflectionPoint.x, startPoint.x - offset); + if (startPoint.y > inflectionPoint.y) { + p2.y = p1.y; + } + else { + p2.y = inflectionPoint.y; + p2.x = Math.min(p2.x, p1.x - offset); + } + } + /** 是否在 第四象限 */ + if (item.angle < -Math.PI / 2) { + p1.x = Math.min(inflectionPoint.x, startPoint.x - offset); + if (startPoint.y < inflectionPoint.y) { + p2.y = p1.y; + } + else { + p2.y = inflectionPoint.y; + p2.x = Math.min(p2.x, p1.x - offset); + } + } + } + path = [ + "M " + startPoint.x + "," + startPoint.y, + "L " + p1.x + "," + p1.y, + "L " + p2.x + "," + p2.y, + "L " + inflectionPoint.x + "," + inflectionPoint.y, + "L " + endPoint.x + "," + endPoint.y, + ].join(' '); + item.labelLine = deepMix({}, item.labelLine, { path: path }); +} +/** + * 饼图标签 spider 布局, 只适用于 pie-spider 的标签类型 + * region 应该是 labelsRenderer 容器的范围限制(便于后续组件间布局) + */ +function pieSpiderLabelLayout(items, labels, shapes, region) { + /** 坐标系 */ + var coordinate = labels[0] && labels[0].get('coordinate'); + if (!coordinate) { + return; + } + /** 坐标圆心 */ + var center = coordinate.getCenter(); + /** 圆半径 */ + var radius = coordinate.getRadius(); + /** label shapes */ + var labelsMap = {}; + for (var _i = 0, labels_1 = labels; _i < labels_1.length; _i++) { + var labelShape = labels_1[_i]; + labelsMap[labelShape.get('id')] = labelShape; + } + var labelHeight = get$3(items[0], 'labelHeight', 14); + var labelOffset = Math.max(get$3(items[0], 'offset', 0), INFLECTION_OFFSET); + // step 1: adjust items to spider + each$2(items, function (item) { + var label = get$3(labelsMap, [item.id]); + if (!label) { + return; + } + var inRight = item.x > center.x || (item.x === center.x && item.y > center.y); + var offsetX = !isNil(item.offsetX) ? item.offsetX : LABEL_OFFSET_X; + var inflectionPoint = polarToCartesian(center.x, center.y, radius + INFLECTION_OFFSET, item.angle); + var totalOffset = labelOffset + offsetX; + item.x = center.x + (inRight ? 1 : -1) * (radius + totalOffset); + item.y = inflectionPoint.y; + }); + var start = coordinate.start, end = coordinate.end; + var LEFT_HALF_KEY = 'left'; + var RIGHT_HALF_KEY = 'right'; + // step 1: separate labels + var seperateLabels = groupBy(items, function (item) { return (item.x < center.x ? LEFT_HALF_KEY : RIGHT_HALF_KEY); }); + // step2: calculate totalHeight + var totalHeight = (radius + labelOffset) * 2 + labelHeight; + each$2(seperateLabels, function (half) { + var halfHeight = half.length * labelHeight; + if (halfHeight > totalHeight) { + totalHeight = Math.min(halfHeight, Math.abs(start.y - end.y)); + } + }); + /** labels 容器的范围(后续根据组件的布局设计进行调整) */ + var labelsContainerRange = { + minX: start.x, + maxX: end.x, + minY: center.y - totalHeight / 2, + maxY: center.y + totalHeight / 2, + }; + // step 3: antiCollision + each$2(seperateLabels, function (half, key) { + var maxLabelsCountForOneSide = totalHeight / labelHeight; + if (half.length > maxLabelsCountForOneSide) { + half.sort(function (a, b) { + // sort by percentage DESC + return b.percent - a.percent; + }); + each$2(half, function (labelItem, idx) { + if (idx > maxLabelsCountForOneSide) { + labelsMap[labelItem.id].set('visible', false); + labelItem.invisible = true; + } + }); + } + antiCollision(half, labelHeight, labelsContainerRange); + }); + var startY = labelsContainerRange.minY; + var endY = labelsContainerRange.maxY; + // step4: applyTo labels and adjust labelLines + each$2(seperateLabels, function (half, key) { + var inRight = key === RIGHT_HALF_KEY; + each$2(half, function (item) { + var label = get$3(labelsMap, item && [item.id]); + if (!label) { + return; + } + // out of range, hidden + if (item.y < startY || item.y > endY) { + label.set('visible', false); + return; + } + var labelContent = label.getChildByIndex(0); + var box = labelContent.getCanvasBBox(); + var originalPos = { x: inRight ? box.x : box.maxX, y: box.y + box.height / 2 /** vertical-align: middle */ }; + translate$1(labelContent, item.x - originalPos.x /** 从 pos.x 移动到 item.x */, item.y - originalPos.y); + // adjust labelLines + if (item.labelLine) { + drawLabelline(item, coordinate, inRight); + } + }); + }); +} + +/** + * @ignore + * 将 label 限制在画布范围内，简单得将超出画布的 label 往画布内调整 + * @param labels + * @param cfg + */ +function limitInCanvas(items, labels, shapes, region) { + each$2(labels, function (label) { + var regionMinX = region.minX, regionMinY = region.minY, regionMaxX = region.maxX, regionMaxY = region.maxY; + var _a = label.getCanvasBBox(), minX = _a.minX, minY = _a.minY, maxX = _a.maxX, maxY = _a.maxY, x = _a.x, y = _a.y, width = _a.width, height = _a.height; + var finalX = x; + var finalY = y; + if (minX < regionMinX || maxX < regionMinX) { + // 超出左侧 + finalX = regionMinX; + } + if (minY < regionMinY || maxY < regionMinY) { + // 超出顶部 + finalY = regionMinY; + } + if (minX > regionMaxX) { + // 整体超出右侧 + finalX = regionMaxX - width; + } + else if (maxX > regionMaxX) { + // 超出右侧 + finalX = finalX - (maxX - regionMaxX); + } + if (minY > regionMaxY) { + // 整体超出顶部 + finalY = regionMaxY - height; + } + else if (maxY > regionMaxY) { + // 超出底部 + finalY = finalY - (maxY - regionMaxY); + } + if (finalX !== x || finalY !== y) { + translate$1(label, finalX - x, finalY - y); + } + }); +} + +/** + * @ignore + * 根据图形元素以及 label 的 bbox 进行调整，如果 label 超出了 shape 的 bbox 则不展示 + */ +function limitInShape(items, labels, shapes, region) { + each$2(labels, function (label, index) { + var labelBBox = label.getCanvasBBox(); // 文本有可能发生旋转 + var shapeBBox = shapes[index].getBBox(); + if (labelBBox.minX < shapeBBox.minX || + labelBBox.minY < shapeBBox.minY || + labelBBox.maxX > shapeBBox.maxX || + labelBBox.maxY > shapeBBox.maxY) { + label.remove(true); // 超出则不展示 + } + }); +} + +var MAX_TIMES = 100; +/** + * @ignore + * Greedy 贪婪算法 + */ +var Greedy = /** @class */ (function () { + function Greedy(cfg) { + if (cfg === void 0) { cfg = {}; } + this.bitmap = {}; + var _a = cfg.xGap, xGap = _a === void 0 ? 1 : _a, _b = cfg.yGap, yGap = _b === void 0 ? 8 : _b; + this.xGap = xGap; + this.yGap = yGap; + } + Greedy.prototype.hasGap = function (bbox) { + var hasGap = true; + var bitmap = this.bitmap; + var minX = Math.round(bbox.minX); + var maxX = Math.round(bbox.maxX); + var minY = Math.round(bbox.minY); + var maxY = Math.round(bbox.maxY); + for (var i = minX; i <= maxX; i += 1) { + if (!bitmap[i]) { + bitmap[i] = {}; + continue; + } + if (i === minX || i === maxX) { + for (var j = minY; j <= maxY; j++) { + if (bitmap[i][j]) { + hasGap = false; + break; + } + } + } + else { + if (bitmap[i][minY] || bitmap[i][maxY]) { + hasGap = false; + break; + } + } + } + return hasGap; + }; + Greedy.prototype.fillGap = function (bbox) { + var bitmap = this.bitmap; + var minX = Math.round(bbox.minX); + var maxX = Math.round(bbox.maxX); + var minY = Math.round(bbox.minY); + var maxY = Math.round(bbox.maxY); + // filling grid + for (var i = minX; i <= maxX; i += 1) { + if (!bitmap[i]) { + bitmap[i] = {}; + } + } + for (var i = minX; i <= maxX; i += this.xGap) { + for (var j = minY; j <= maxY; j += this.yGap) { + bitmap[i][j] = true; + } + bitmap[i][maxY] = true; + } + // filling y edges + if (this.yGap !== 1) { + for (var i = minY; i <= maxY; i += 1) { + bitmap[minX][i] = true; + bitmap[maxX][i] = true; + } + } + // filling x edges + if (this.xGap !== 1) { + for (var i = minX; i <= maxX; i += 1) { + bitmap[i][minY] = true; + bitmap[i][maxY] = true; + } + } + }; + Greedy.prototype.destroy = function () { + this.bitmap = {}; + }; + return Greedy; +}()); +function spiralFill(label, greedy, maxTimes) { + if (maxTimes === void 0) { maxTimes = MAX_TIMES; } + var dt = -1; + var _a = label.attr(), x = _a.x, y = _a.y; + var bbox = label.getCanvasBBox(); + var maxDelta = Math.sqrt(bbox.width * bbox.width + bbox.height * bbox.height); + var dxdy; + var t = -dt; + var dx = 0; + var dy = 0; + var f = function (param) { + var nt = param * 0.1; + return [nt * Math.cos(nt), nt * Math.sin(nt)]; + }; + if (greedy.hasGap(bbox)) { + greedy.fillGap(bbox); + return true; + } + var canFill = false; + var times = 0; + var accessedCache = {}; + while (Math.min(Math.abs(dx), Math.abs(dy)) < maxDelta && times < maxTimes) { + dxdy = f((t += dt)); + dx = ~~dxdy[0]; + dy = ~~dxdy[1]; + if ((!dx && !dy) || accessedCache[dx + "-" + dy]) { + continue; + } + label.attr({ x: x + dx, y: y + dy }); + if (dx + dy < 0) { + label.attr('textAlign', 'right'); + } + times++; + if (greedy.hasGap(label.getCanvasBBox())) { + greedy.fillGap(label.getCanvasBBox()); + canFill = true; + accessedCache[dx + "-" + dy] = true; + break; + } + } + return canFill; +} +/* + * 根据如下规则尝试放置label + * 5 + * ------------------ + * | 1 | 0 | + * 8 —————————4———————— 7 + * | 2 | 3 | + * —————————————————— + * 6 + */ +function adjustLabelPosition(label, x, y, index) { + var _a = label.getCanvasBBox(), width = _a.width, height = _a.height; + var attrs = { + x: x, + y: y, + textAlign: 'center', + }; + switch (index) { + case 0: + attrs.y -= height + 1; + attrs.x += 1; + attrs.textAlign = 'left'; + break; + case 1: + attrs.y -= height + 1; + attrs.x -= 1; + attrs.textAlign = 'right'; + break; + case 2: + attrs.y += height + 1; + attrs.x -= 1; + attrs.textAlign = 'right'; + break; + case 3: + attrs.y += height + 1; + attrs.x += 1; + attrs.textAlign = 'left'; + break; + case 5: + attrs.y -= height * 2 + 2; + break; + case 6: + attrs.y += height * 2 + 2; + break; + case 7: + attrs.x += width + 1; + attrs.textAlign = 'left'; + break; + case 8: + attrs.x -= width + 1; + attrs.textAlign = 'right'; + break; + } + label.attr(attrs); + return label.getCanvasBBox(); +} +/** + * @ignore + * label 防遮挡布局：在不改变 label 位置的情况下对相互重叠的 label 进行调整。 + * 不同于 'overlap' 类型的布局，该布局不会对 label 的位置进行偏移调整。 + * @param labels 参与布局调整的 label 数组集合 + */ +function fixedOverlap(items, labels, shapes, region) { + var greedy = new Greedy(); + each$2(labels, function (label) { + var labelShape = label.find(function (shape) { return shape.get('type') === 'text'; }); + if (!spiralFill(labelShape, greedy)) { + label.remove(true); + } + }); + greedy.destroy(); +} +/** + * @ignore + * label 防遮挡布局：为了防止 label 之间相互覆盖同时保证尽可能多 的 label 展示，通过尝试将 label 向**四周偏移**来剔除放不下的 label + * @param labels 参与布局调整的 label 数组集合 + */ +function overlap(items, labels, shapes, region) { + var greedy = new Greedy(); + each$2(labels, function (label) { + var labelShape = label.find(function (shape) { return shape.get('type') === 'text'; }); + var _a = labelShape.attr(), x = _a.x, y = _a.y; + var canFill = false; + for (var i = 0; i <= 8; i++) { + var bbox = adjustLabelPosition(labelShape, x, y, i); + if (greedy.hasGap(bbox)) { + greedy.fillGap(bbox); + canFill = true; + break; + } + } + if (!canFill) { + label.remove(true); + } + }); + greedy.destroy(); +} + +var dot$2 = dot$3; +/** + * @private + * 1. 获取投影轴 + */ +function getAxes(points /** 多边形的关键点 */) { + // 目前先处理 平行矩形 的场景, 其他多边形不处理 + if (points.length > 4) { + return []; + } + // 获取向量 + var vector = function (start, end) { + return [end.x - start.x, end.y - start.y]; + }; + // 由于 矩形的平行原理，所以只有 2 条投影轴: A -> B, B -> C + var AB = vector(points[0], points[1]); + var BC = vector(points[1], points[2]); + return [AB, BC]; +} +/** + * @private + * 绕指定点顺时针旋转后的点坐标 + * 默认绕原点旋转 + */ +function rotateAtPoint(point, deg, origin) { + if (deg === void 0) { deg = 0; } + if (origin === void 0) { origin = { x: 0, y: 0 }; } + var x = point.x, y = point.y; + return { + x: (x - origin.x) * Math.cos(-deg) + (y - origin.y) * Math.sin(-deg) + origin.x, + y: (origin.x - x) * Math.sin(-deg) + (y - origin.y) * Math.cos(-deg) + origin.y, + }; +} +/** + * @private + * 转化为顶点坐标数组 + * + * @param {Object} box + */ +function getRectPoints$1(box) { + var points = [ + { x: box.x, y: box.y }, + { x: box.x + box.width, y: box.y }, + { x: box.x + box.width, y: box.y + box.height }, + { x: box.x, y: box.y + box.height }, + ]; + var rotation = box.rotation; + if (rotation) { + return [ + rotateAtPoint(points[0], rotation, points[0]), + rotateAtPoint(points[1], rotation, points[0]), + rotateAtPoint(points[2], rotation, points[0]), + rotateAtPoint(points[3], rotation, points[0]), + ]; + } + return points; +} +/** + * @private + * 2. 获取多边形在投影轴上的投影 + * + * 向量的点积的其中一个几何含义是：一个向量在平行于另一个向量方向上的投影的数值乘积。 + * 由于投影轴是单位向量（长度为1），投影的长度为 x1 * x2 + y1 * y2 + */ +function getProjection(points /** 多边形的关键点 */, axis) { + // 目前先处理矩形的场景 + if (points.length > 4) { + return { min: 0, max: 0 }; + } + var scalars = []; + points.forEach(function (point) { + scalars.push(dot$2([point.x, point.y], axis)); + }); + return { min: Math.min.apply(Math, scalars), max: Math.max.apply(Math, scalars) }; +} +function isProjectionOverlap(projection1, projection2) { + return projection1.max > projection2.min && projection1.min < projection2.max; +} +/** + * 快速判断两个无旋转矩形是否遮挡 + */ +function isIntersectRect(box1, box2, margin) { + if (margin === void 0) { margin = 0; } + return !(box2.x > box1.x + box1.width + margin || + box2.x + box2.width < box1.x - margin || + box2.y > box1.y + box1.height + margin || + box2.y + box2.height < box1.y - margin); +} +/** + * detect whether two shape is intersected, useful when shape is been rotated + * 判断两个矩形是否重叠（相交和包含, 是否旋转） + * + * - 原理: 分离轴定律 + */ +function isIntersect(box1, box2) { + // 如果两个矩形没有旋转，使用快速判断 + if (!box1.rotation && !box2.rotation) { + return isIntersectRect(box1, box2); + } + // 分别获取 4 个关键点 + var rect1Points = getRectPoints$1(box1); + var rect2Points = getRectPoints$1(box2); + // 获取所有投影轴 + var axes = __spreadArrays$1(getAxes(rect1Points), getAxes(rect2Points)); + for (var i = 0; i < axes.length; i++) { + var axis = axes[i]; + var projection1 = getProjection(rect1Points, axis); + var projection2 = getProjection(rect2Points, axis); + // 判断投影轴上的投影是否存在重叠，若检测到存在间隙则立刻退出判断，消除不必要的运算。 + if (!isProjectionOverlap(projection1, projection2)) + return false; + } + return true; +} + +/** + * label 防遮挡布局：在不改变 label 位置的情况下对相互重叠的 label 进行隐藏（非移除） + * 不同于 'overlap' 类型的布局，该布局不会对 label 的位置进行偏移调整。 + * @param labels 参与布局调整的 label 数组集合 + */ +function hideOverlap(items, labels, shapes, region) { + // todo 添加 labelrank + // each label will hide the next one because the next one always has lower rank. + // Detect overlapping labels + for (var i = 0; i < labels.length; i++) { + var label1 = labels[i]; + if (labels[i].get('visible')) { + for (var j = i + 1; j < labels.length; j++) { + var label2 = labels[j]; + if (label1 && label2 && label1 !== label2 && label2.get('visible')) { + var box1 = getlLabelBackgroundInfo(label1, items[i], get$3(items[i], 'background.padding')); + var box2 = getlLabelBackgroundInfo(label2, items[j], get$3(items[j], 'background.padding')); + if (isIntersect(box1, box2)) { + labels[j].set('visible', false); + } + } + } + } + } +} + +// 内置的一些特殊设置 +var preset = { + '#5B8FF9': true, +}; +// 根据YIQ亮度判断指定颜色取反色是不是白色 +// http://24ways.org/2010/calculating-color-contrast +// http://www.w3.org/TR/AERT#color-contrast +var isContrastColorWhite = function (color) { + var rgb = colorUtil.toRGB(color).toUpperCase(); + if (preset[rgb]) { + return preset[rgb]; + } + var _a = colorUtil.rgb2arr(rgb), r = _a[0], g = _a[1], b = _a[2]; + var isDark = (r * 299 + g * 587 + b * 114) / 1000 < 128; + return isDark; +}; + +function adjustColor(items, labels, shapes) { + if (shapes.length === 0) { + return; + } + var element = shapes[0].get('element'); + var theme = element.geometry.theme; + var _a = theme.labels || {}, fillColorLight = _a.fillColorLight, fillColorDark = _a.fillColorDark; + shapes.forEach(function (shape, index) { + var label = labels[index]; + var textShape = label.find(function (el) { return el.get('type') === 'text'; }); + var shapeBBox = BBox.fromObject(shape.getBBox()); + var textBBox = BBox.fromObject(textShape.getCanvasBBox()); + var overflow = !shapeBBox.contains(textBBox); + var bgColor = shape.attr('fill'); + var fillWhite = isContrastColorWhite(bgColor); + if (!overflow) { + if (fillWhite) { + if (fillColorLight) { + textShape.attr('fill', fillColorLight); + } + } + else { + if (fillColorDark) { + textShape.attr('fill', fillColorDark); + } + } + } + else { + // 出现溢出直接应用 overflowLabel 样式 + textShape.attr(theme.overflowLabels.style); + } + }); +} + +function shouldInShapeSingle(geometry, label, shape) { + var coordinate = geometry.coordinate; + var textShape = findLabelTextShape(label); + var textBBox = BBox.fromObject(textShape.getCanvasBBox()); + var shapeBBox = BBox.fromObject(shape.getBBox()); + return coordinate.isTransposed ? shapeBBox.height >= textBBox.height : shapeBBox.width >= textBBox.width; +} +function shouldInShape(geometry, labels, shapes) { + var isStack = !!geometry.getAdjust('stack'); + return (isStack || + labels.every(function (label, index) { + var shape = shapes[index]; + return shouldInShapeSingle(geometry, label, shape); + })); +} +function moveInShape(geometry, label, shape) { + var coordinate = geometry.coordinate; + var shapeBBox = BBox.fromObject(shape.getBBox()); + var textShape = findLabelTextShape(label); + if (coordinate.isTransposed) { + // 水平方向：条形图系列 + textShape.attr({ + x: shapeBBox.minX + shapeBBox.width / 2, + textAlign: 'center', + }); + } + else { + // 垂直方向：柱形图系列 + textShape.attr({ + y: shapeBBox.minY + shapeBBox.height / 2, + textBaseline: 'middle', + }); + } +} +/** + * 适用于 interval geometry 的数据标签位置自动调整布局方法 + * @param items + * @param labels + * @param shapes + */ +function intervalAdjustPosition(items, labels, shapes) { + var _a; + if (shapes.length === 0) { + return; + } + var element = (_a = shapes[0]) === null || _a === void 0 ? void 0 : _a.get('element'); + var geometry = element === null || element === void 0 ? void 0 : element.geometry; + if (!geometry || geometry.type !== 'interval') { + return; + } + var inShape = shouldInShape(geometry, labels, shapes); + if (inShape) { + shapes.forEach(function (shape, index) { + var label = labels[index]; + moveInShape(geometry, label, shape); + }); + } +} + +function filterLabel(labels) { + var MAX_CNT = 500; // 最多显示 500 个数据标签 + var filteredLabels = []; + var pages = Math.max(Math.floor(labels.length / MAX_CNT), 1); + each$2(labels, function (label, idx) { + if (idx % pages === 0) { + filteredLabels.push(label); + } + else { + label.set('visible', false); + } + }); + return filteredLabels; +} +/** + * 为 interval geometry 定制的数据标签重叠自动隐藏布局方法 + * @param items + * @param labels + * @param shapes + */ +function intervalHideOverlap(items, labels, shapes) { + var _a; + if (shapes.length === 0) { + return; + } + var element = (_a = shapes[0]) === null || _a === void 0 ? void 0 : _a.get('element'); + var geometry = element === null || element === void 0 ? void 0 : element.geometry; + if (!geometry || geometry.type !== 'interval') { + return; + } + var filteredLabels = filterLabel(labels); + var xField = geometry.getXYFields()[0]; + var dones = []; + var todo = []; + var groupedLabels = groupBy(filteredLabels, function (label) { return label.get('data')[xField]; }); + var xValues = uniq$3(map$4(filteredLabels, function (label) { return label.get('data')[xField]; })); + var xValue; + filteredLabels.forEach(function (label) { + label.set('visible', true); + }); + var addCurrentGroup = function (curItems) { + if (curItems) { + if (curItems.length) { + // 最后一个 + todo.push(curItems.pop()); + } + todo.push.apply(todo, curItems); + } + }; + if (size$1(xValues) > 0) { + // 第一组 + xValue = xValues.shift(); + addCurrentGroup(groupedLabels[xValue]); + } + if (size$1(xValues) > 0) { + // 最后一组 + xValue = xValues.pop(); + addCurrentGroup(groupedLabels[xValue]); + } + each$2(xValues.reverse(), function (val) { + // 其他组 + addCurrentGroup(groupedLabels[val]); + }); + while (todo.length > 0) { + var cur = todo.shift(); + if (cur.get('visible')) { + if (checkShapeOverlap$2(cur, dones)) { + cur.set('visible', false); + } + else { + dones.push(cur); + } + } + } +} + +/** + * 对同一组(相同 xField )的 Label 进行排序：第一个、最后一个、其他... + * @param geometry + * @param labels + */ +function sortLabels$1(geometry, labels) { + var yField = geometry.getXYFields()[1]; + var result = []; + var sortedLabels = labels.sort(function (left, right) { return left.get('data')[yField] - left.get('data')[yField]; }); + if (sortedLabels.length > 0) { + result.push(sortedLabels.shift()); + } + if (sortedLabels.length > 0) { + result.push(sortedLabels.pop()); + } + result.push.apply(result, sortedLabels); + return result; +} +function hasSome$1(dones, current, compare) { + return dones.some(function (done) { return compare(done, current); }); +} +/** + * 计算两个矩形之间的堆叠区域面积 + */ +function getOverlapArea$1(a, b, margin) { + if (margin === void 0) { margin = 0; } + var xOverlap = Math.max(0, Math.min(a.x + a.width + margin, b.x + b.width + margin) - Math.max(a.x - margin, b.x - margin)); + var yOverlap = Math.max(0, Math.min(a.y + a.height + margin, b.y + b.height + margin) - Math.max(a.y - margin, b.y - margin)); + return xOverlap * yOverlap; +} +/** + * 判断新添加的 Label 是否和已存在的发生重叠 + * @param dones + * @param current + */ +function checkShapeOverlap$1(dones, current) { + return hasSome$1(dones, current, function (left, right) { + var leftText = findLabelTextShape(left); + var rightText = findLabelTextShape(right); + return getOverlapArea$1(leftText.getCanvasBBox(), rightText.getCanvasBBox(), 2) > 0; + }); +} +/** + * 适用于 point geometry 的数据标签位置自动调整布局方法 + * @param items + * @param labels + * @param shapes + * @param region + * @param cfg + */ +function pointAdjustPosition(items, labels, shapes, region, cfg) { + var _a, _b; + if (shapes.length === 0) { + return; + } + var element = (_a = shapes[0]) === null || _a === void 0 ? void 0 : _a.get('element'); + var geometry = element === null || element === void 0 ? void 0 : element.geometry; + if (!geometry || geometry.type !== 'point') { + return; + } + var _c = geometry.getXYFields(), xField = _c[0], yField = _c[1]; + var groupedLabels = groupBy(labels, function (label) { return label.get('data')[xField]; }); + var dones = []; + var offset = (cfg && cfg.offset) || ((_b = items[0]) === null || _b === void 0 ? void 0 : _b.offset) || 12; + map$4(keys$8(groupedLabels).reverse(), function (xValue) { + var sortedCollections = sortLabels$1(geometry, groupedLabels[xValue]); + while (sortedCollections.length) { + var current = sortedCollections.shift(); + var textShape = findLabelTextShape(current); + if (hasSome$1(dones, current, function (left, right) { + return left.get('data')[xField] === right.get('data')[xField] && + left.get('data')[yField] === right.get('data')[yField]; + })) { + // 重复位置，直接隐藏 + textShape.set('visible', false); + continue; + } + var upFail = checkShapeOverlap$1(dones, current); + var downFail = false; + if (upFail) { + textShape.attr('y', textShape.attr('y') + 2 * offset); + downFail = checkShapeOverlap$1(dones, current); + } + if (downFail) { + textShape.set('visible', false); + continue; + } + dones.push(current); + } + }); +} + +/** + * 对同一组(相同 xField )的 Label 进行排序：第一个、最后一个、其他... + * @param geometry + * @param labels + */ +function sortLabels(geometry, labels) { + var yField = geometry.getXYFields()[1]; + var result = []; + var sortedLabels = labels.sort(function (left, right) { return left.get('data')[yField] - left.get('data')[yField]; }); + if (sortedLabels.length > 0) { + result.push(sortedLabels.shift()); + } + if (sortedLabels.length > 0) { + result.push(sortedLabels.pop()); + } + result.push.apply(result, sortedLabels); + return result; +} +function hasSome(dones, current, compare) { + return dones.some(function (done) { return compare(done, current); }); +} +/** + * 计算两个矩形之间的堆叠区域面积 + */ +function getOverlapArea(a, b, margin) { + if (margin === void 0) { margin = 0; } + var xOverlap = Math.max(0, Math.min(a.x + a.width + margin, b.x + b.width + margin) - Math.max(a.x - margin, b.x - margin)); + var yOverlap = Math.max(0, Math.min(a.y + a.height + margin, b.y + b.height + margin) - Math.max(a.y - margin, b.y - margin)); + return xOverlap * yOverlap; +} +/** + * 判断新添加的 Label 是否和已存在的发生重叠 + * @param dones + * @param current + */ +function checkShapeOverlap(dones, current) { + return hasSome(dones, current, function (left, right) { + var leftText = findLabelTextShape(left); + var rightText = findLabelTextShape(right); + return getOverlapArea(leftText.getCanvasBBox(), rightText.getCanvasBBox(), 2) > 0; + }); +} +/** + * 适用于 point geometry 的数据标签位置自动调整布局方法 + * @param items + * @param labels + * @param shapes + * @param region + * @param cfg + */ +function pathAdjustPosition(items, labels, shapes, region, cfg) { + var _a, _b; + if (shapes.length === 0) { + return; + } + var element = (_a = shapes[0]) === null || _a === void 0 ? void 0 : _a.get('element'); + var geometry = element === null || element === void 0 ? void 0 : element.geometry; + if (!geometry || ['path', 'line', 'area'].indexOf(geometry.type) < 0) { + return; + } + var _c = geometry.getXYFields(), xField = _c[0], yField = _c[1]; + var groupedLabels = groupBy(labels, function (label) { return label.get('data')[xField]; }); + var dones = []; + var offset = (cfg && cfg.offset) || ((_b = items[0]) === null || _b === void 0 ? void 0 : _b.offset) || 12; + map$4(keys$8(groupedLabels).reverse(), function (xValue) { + var sortedCollections = sortLabels(geometry, groupedLabels[xValue]); + while (sortedCollections.length) { + var current = sortedCollections.shift(); + var textShape = findLabelTextShape(current); + if (hasSome(dones, current, function (left, right) { + return left.get('data')[xField] === right.get('data')[xField] && + left.get('data')[yField] === right.get('data')[yField]; + })) { + // 重复位置，直接隐藏 + textShape.set('visible', false); + continue; + } + var upFail = checkShapeOverlap(dones, current); + var downFail = false; + if (upFail) { + textShape.attr('y', textShape.attr('y') + 2 * offset); + downFail = checkShapeOverlap(dones, current); + } + if (downFail) { + textShape.set('visible', false); + continue; + } + dones.push(current); + } + }); +} + +var ctx$1; +/** + * 获取 canvas context + */ +function getCanvasContext$1() { + if (!ctx$1) { + ctx$1 = document.createElement('canvas').getContext('2d'); + } + return ctx$1; +} + +/** + * 计算文本在画布中的宽度 + */ +var measureTextWidth$1 = memoize$2(function (text, font) { + if (font === void 0) { font = {}; } + var fontSize = font.fontSize, fontFamily = font.fontFamily, fontWeight = font.fontWeight, fontStyle = font.fontStyle, fontVariant = font.fontVariant; + var ctx = getCanvasContext$1(); + ctx.font = [fontStyle, fontVariant, fontWeight, fontSize + "px", fontFamily].join(' '); + return ctx.measureText(isString$3(text) ? text : '').width; +}, function (text, font) { + if (font === void 0) { font = {}; } + return __spreadArrays$1([text], values$1(font)).join(''); +}); +/** + * 获取文本的 ... 文本。 + * 算法（减少每次 measureText 的长度，measureText 的性能跟字符串时间相关）： + * 1. 先通过 STEP 逐步计算，找到最后一个小于 maxWidth 的字符串 + * 2. 然后对最后这个字符串二分计算 + * @param text 需要计算的文本, 由于历史原因 除了支持string，还支持空值,number和数组等 + * @param maxWidth + * @param font + */ +var getEllipsisText = function (text, maxWidth, font) { + var STEP = 16; // 每次 16，调参工程师 + var DOT_WIDTH = measureTextWidth$1('...', font); + var leftText; + if (!isString$3(text)) { + leftText = toString$7(text); + } + else { + leftText = text; + } + var leftWidth = maxWidth; + var r = []; // 最终的分段字符串 + var currentText; + var currentWidth; + if (measureTextWidth$1(text, font) <= maxWidth) { + return text; + } + // 首先通过 step 计算，找出最大的未超出长度的 + while (true) { + // 更新字符串 + currentText = leftText.substr(0, STEP); + // 计算宽度 + currentWidth = measureTextWidth$1(currentText, font); + // 超出剩余宽度，则停止 + if (currentWidth + DOT_WIDTH > leftWidth) { + if (currentWidth > leftWidth) { + break; + } + } + r.push(currentText); + // 没有超出，则计算剩余宽度 + leftWidth -= currentWidth; + leftText = leftText.substr(STEP); + // 字符串整体没有超出 + if (!leftText) { + return r.join(''); + } + } + // 最下的最后一个 STEP，使用 1 递增（用二分效果更高） + while (true) { + // 更新字符串 + currentText = leftText.substr(0, 1); + // 计算宽度 + currentWidth = measureTextWidth$1(currentText, font); + // 超出剩余宽度，则停止 + if (currentWidth + DOT_WIDTH > leftWidth) { + break; + } + r.push(currentText); + // 没有超出，则计算剩余宽度 + leftWidth -= currentWidth; + leftText = leftText.substr(1); + if (!leftText) { + return r.join(''); + } + } + return r.join('') + "..."; +}; + +/** + * @ignore + * 将 label 限制在 Plot 范围内，将超出 Plot 范围的 label 可选择进行隐藏或者移动位置 + * @param labels + * @param cfg + */ +function limitInPlot$3(items, labels, shapes, region, cfg) { + if (labels.length <= 0) { + return; + } + var direction = (cfg === null || cfg === void 0 ? void 0 : cfg.direction) || ['top', 'right', 'bottom', 'left']; + var action = (cfg === null || cfg === void 0 ? void 0 : cfg.action) || 'translate'; + var margin = (cfg === null || cfg === void 0 ? void 0 : cfg.margin) || 0; + var coordinate = labels[0].get('coordinate'); + if (!coordinate) { + return; + } + var _a = getCoordinateBBox(coordinate, margin), regionMinX = _a.minX, regionMinY = _a.minY, regionMaxX = _a.maxX, regionMaxY = _a.maxY; + each$2(labels, function (label) { + var _a = label.getCanvasBBox(), minX = _a.minX, minY = _a.minY, maxX = _a.maxX, maxY = _a.maxY, x = _a.x, y = _a.y, width = _a.width, height = _a.height; + var finalX = x; + var finalY = y; + if (direction.indexOf('left') >= 0 && (minX < regionMinX || maxX < regionMinX)) { + // 超出左侧 + finalX = regionMinX; + } + if (direction.indexOf('top') >= 0 && (minY < regionMinY || maxY < regionMinY)) { + // 超出顶部 + finalY = regionMinY; + } + if (direction.indexOf('right') >= 0) { + if (minX > regionMaxX) { + // 整体超出右侧 + finalX = regionMaxX - width; + } + else if (maxX > regionMaxX) { + // 超出右侧 + finalX = finalX - (maxX - regionMaxX); + } + } + if (direction.indexOf('bottom') >= 0) { + if (minY > regionMaxY) { + // 整体超出底部 + finalY = regionMaxY - height; + } + else if (maxY > regionMaxY) { + // 超出底部 + finalY = finalY - (maxY - regionMaxY); + } + } + if (finalX !== x || finalY !== y) { + var translateX_1 = finalX - x; + if (action === 'translate') { + translate$1(label, translateX_1, finalY - y); + } + else if (action === 'ellipsis') { + var textShapes = label.findAll(function (shape) { return shape.get('type') === 'text'; }); + textShapes.forEach(function (textShape) { + var style = pick$2(textShape.attr(), ['fontSize', 'fontFamily', 'fontWeight', 'fontStyle', 'fontVariant']); + var textBox = textShape.getCanvasBBox(); + var text = getEllipsisText(textShape.attr('text'), textBox.width - Math.abs(translateX_1), style); + textShape.attr('text', text); + }); + } + else { + label.hide(); + } + } + }); +} + +/** + * @ignore + * 单个 shape 动画 + * 渐现动画 + * @param shape 执行动画的图形元素 + * @param animateCfg 动画配置 + * @param cfg 额外信息 + */ +function fadeIn(shape, animateCfg, cfg) { + var endState = { + fillOpacity: isNil(shape.attr('fillOpacity')) ? 1 : shape.attr('fillOpacity'), + strokeOpacity: isNil(shape.attr('strokeOpacity')) ? 1 : shape.attr('strokeOpacity'), + opacity: isNil(shape.attr('opacity')) ? 1 : shape.attr('opacity'), + }; + shape.attr({ + fillOpacity: 0, + strokeOpacity: 0, + opacity: 0, + }); + shape.animate(endState, animateCfg); +} +/** + * @ignore + * 单个 shape 动画 + * 渐隐动画 + * @param shape 执行动画的图形元素 + * @param animateCfg 动画配置 + * @param cfg 额外信息 + */ +function fadeOut(shape, animateCfg, cfg) { + var endState = { + fillOpacity: 0, + strokeOpacity: 0, + opacity: 0, + }; + var easing = animateCfg.easing, duration = animateCfg.duration, delay = animateCfg.delay; + shape.animate(endState, duration, easing, function () { + shape.remove(true); + }, delay); +} + +/** + * @ignore + * 对图形元素进行矩阵变换，同时返回变换前的图形矩阵 + * @param shape 进行矩阵变换的图形 + * @param vector 矩阵变换的中心点 + * @param direct 矩阵变换的类型 + */ +function transformShape(shape, vector, direct) { + var scaledMatrix; + var x = vector[0], y = vector[1]; + shape.applyToMatrix([x, y, 1]); + if (direct === 'x') { + shape.setMatrix(transform$i(shape.getMatrix(), [ + ['t', -x, -y], + ['s', 0.01, 1], + ['t', x, y], + ])); + scaledMatrix = transform$i(shape.getMatrix(), [ + ['t', -x, -y], + ['s', 100, 1], + ['t', x, y], + ]); + } + else if (direct === 'y') { + shape.setMatrix(transform$i(shape.getMatrix(), [ + ['t', -x, -y], + ['s', 1, 0.01], + ['t', x, y], + ])); + scaledMatrix = transform$i(shape.getMatrix(), [ + ['t', -x, -y], + ['s', 1, 100], + ['t', x, y], + ]); + } + else if (direct === 'xy') { + shape.setMatrix(transform$i(shape.getMatrix(), [ + ['t', -x, -y], + ['s', 0.01, 0.01], + ['t', x, y], + ])); + scaledMatrix = transform$i(shape.getMatrix(), [ + ['t', -x, -y], + ['s', 100, 100], + ['t', x, y], + ]); + } + return scaledMatrix; +} +/** + * 对图形元素进行剪切动画 + * @param element 进行动画的图形元素 + * @param animateCfg 动画配置 + * @param coordinate 当前坐标系 + * @param yMinPoint y 轴的最小值对应的图形坐标点 + * @param type 剪切动画的类型 + */ +function doScaleAnimate(element, animateCfg, coordinate, yMinPoint, type) { + var start = coordinate.start, end = coordinate.end; + var width = coordinate.getWidth(); + var height = coordinate.getHeight(); + var x; + var y; + if (type === 'y') { + x = start.x + width / 2; + y = yMinPoint.y < start.y ? yMinPoint.y : start.y; + } + else if (type === 'x') { + x = yMinPoint.x > start.x ? yMinPoint.x : start.x; + y = start.y + height / 2; + } + else if (type === 'xy') { + if (coordinate.isPolar) { + x = coordinate.getCenter().x; + y = coordinate.getCenter().y; + } + else { + x = (start.x + end.x) / 2; + y = (start.y + end.y) / 2; + } + } + var endMatrix = transformShape(element, [x, y], type); + element.animate({ + matrix: endMatrix, + }, animateCfg); +} + +/** + * @ignore + * 入场动画 + * x 方向的生长 + * @param element 执行动画的元素 + * @param animateCfg 动画配置 + * @param cfg 额外信息 + */ +function growInX(element, animateCfg, cfg) { + var coordinate = cfg.coordinate, minYPoint = cfg.minYPoint; + doScaleAnimate(element, animateCfg, coordinate, minYPoint, 'x'); +} +/** + * @ignore + * 入场动画 + * y 轴方向上的生长 + * @param element 执行动画的元素 + * @param animateCfg 动画配置 + * @param cfg 额外信息 + */ +function growInY(element, animateCfg, cfg) { + var coordinate = cfg.coordinate, minYPoint = cfg.minYPoint; + doScaleAnimate(element, animateCfg, coordinate, minYPoint, 'y'); +} +/** + * @ignore + * 入场 + * 中心点的向四周的生长动画 + * @param element 执行动画的元素 + * @param animateCfg 动画配置 + * @param cfg 额外信息 + */ +function growInXY(element, animateCfg, cfg) { + var coordinate = cfg.coordinate, minYPoint = cfg.minYPoint; + doScaleAnimate(element, animateCfg, coordinate, minYPoint, 'xy'); +} + +/** + * @ignore + * 入场动画 + * path 的入场动画 + * @param element 执行动画的元素 + * @param animateCfg 动画配置 + * @param cfg 额外信息 + */ +function pathIn(element, animateCfg, cfg) { + // @ts-ignore + var length = element.getTotalLength(); + // 设置虚线样式 + element.attr('lineDash', [length]); + element.animate(function (ratio) { + return { + // 对虚线偏移量做动画 + lineDashOffset: (1 - ratio) * length, + }; + }, animateCfg); +} + +/** + * @ignore + * 坐标移动动画 + * @param shape 图形 + * @param animateCfg + * @param cfg + */ +function positionUpdate(shape, animateCfg, cfg) { + var toAttrs = cfg.toAttrs; + // @ts-ignore + var x = toAttrs.x; + // @ts-ignore + var y = toAttrs.y; + // @ts-ignore + delete toAttrs.x; + // @ts-ignore + delete toAttrs.y; + shape.attr(toAttrs); + shape.animate({ + x: x, + y: y, + }, animateCfg); +} + +/** + * @ignore + * 沿着 x 方向放大的动画 + * @param shape + * @param animateCfg + * @param shapeModel + */ +function scaleInX(shape, animateCfg, cfg) { + var box = shape.getBBox(); + var mappingData = shape.get('origin').mappingData; + var points = mappingData.points; + // x 数值如果为负值，那么应该从右往左生长 + var x = points[0].y - points[1].y > 0 ? box.maxX : box.minX; + var y = (box.minY + box.maxY) / 2; + shape.applyToMatrix([x, y, 1]); + var matrix = transform$i(shape.getMatrix(), [ + ['t', -x, -y], + ['s', 0.01, 1], + ['t', x, y], + ]); + shape.setMatrix(matrix); + shape.animate({ + matrix: transform$i(shape.getMatrix(), [ + ['t', -x, -y], + ['s', 100, 1], + ['t', x, y], + ]), + }, animateCfg); +} +/** + * @ignore + * 沿着 y 方向放大的动画 + * @param shape + * @param animateCfg + * @param shapeModel + */ +function scaleInY(shape, animateCfg, cfg) { + var box = shape.getBBox(); + var mappingData = shape.get('origin').mappingData; + var x = (box.minX + box.maxX) / 2; + var points = mappingData.points; + // 数值如果为负值，那么应该从上往下生长，通过 shape 的关键点进行判断 + var y = points[0].y - points[1].y <= 0 ? box.maxY : box.minY; + shape.applyToMatrix([x, y, 1]); + var matrix = transform$i(shape.getMatrix(), [ + ['t', -x, -y], + ['s', 1, 0.01], + ['t', x, y], + ]); + shape.setMatrix(matrix); + shape.animate({ + matrix: transform$i(shape.getMatrix(), [ + ['t', -x, -y], + ['s', 1, 100], + ['t', x, y], + ]), + }, animateCfg); +} + +function getAngle$1(startPoint, arcPath) { + var _a; + var _b = getArcParams(startPoint, arcPath), startAngle = _b.startAngle, endAngle = _b.endAngle; + if (!isNumberEqual$1(startAngle, -Math.PI * 0.5) && startAngle < -Math.PI * 0.5) { + startAngle += Math.PI * 2; + } + if (!isNumberEqual$1(endAngle, -Math.PI * 0.5) && endAngle < -Math.PI * 0.5) { + endAngle += Math.PI * 2; + } + if (arcPath[5] === 0) { + // 逆时针，需要将 startAngle 和 endAngle 转置，因为 G2 极坐标系为顺时针方向 + _a = [endAngle, startAngle], startAngle = _a[0], endAngle = _a[1]; + } + if (isNumberEqual$1(startAngle, Math.PI * 1.5)) { + startAngle = Math.PI * -0.5; + } + if (isNumberEqual$1(endAngle, Math.PI * -0.5)) { + endAngle = Math.PI * 1.5; + } + return { + startAngle: startAngle, + endAngle: endAngle, + }; +} +function getArcStartPoint(path) { + var startPoint; + if (path[0] === 'M' || path[0] === 'L') { + startPoint = [path[1], path[2]]; + } + else if (path[0] === 'a' || path[0] === 'A' || path[0] === 'C') { + startPoint = [path[path.length - 2], path[path.length - 1]]; + } + return startPoint; +} +/** + * path 存在以下情况 + * 1. 饼图不为整圆的 path，命令为 M, L, A, L, Z + * 2. 饼图为整圆的 path，命令为 M, M, A, A, M, Z + * 3. 环图不为整圆的 path，命令为 M, A, L, A, L, Z + * 4. 环图为整圆的 path，命令为 M, A, A, M, A, A, M, Z + * 5. radial-line, 不为整圆时的 path, 命令为 M, A, A, Z + * 6. radial-line, 为整圆时的 path，命令为 M, A, A, A, A, Z + * @param path theta 坐标系下圆弧的 path 命令 + */ +function getArcInfo(path) { + var _a; + var startAngle; + var endAngle; + var arcPaths = path.filter(function (command) { + return command[0] === 'A' || command[0] === 'a'; + }); + if (arcPaths.length === 0) { + return { + startAngle: 0, + endAngle: 0, + radius: 0, + innerRadius: 0, + }; + } + var firstArcPathCommand = arcPaths[0]; + var lastArcPathCommand = arcPaths.length > 1 ? arcPaths[1] : arcPaths[0]; + var firstIndex = path.indexOf(firstArcPathCommand); + var lastIndex = path.indexOf(lastArcPathCommand); + var firstStartPoint = getArcStartPoint(path[firstIndex - 1]); + var lastStartPoint = getArcStartPoint(path[lastIndex - 1]); + var _b = getAngle$1(firstStartPoint, firstArcPathCommand), firstStartAngle = _b.startAngle, firstEndAngle = _b.endAngle; + var _c = getAngle$1(lastStartPoint, lastArcPathCommand), lastStartAngle = _c.startAngle, lastEndAngle = _c.endAngle; + if (isNumberEqual$1(firstStartAngle, lastStartAngle) && isNumberEqual$1(firstEndAngle, lastEndAngle)) { + startAngle = firstStartAngle; + endAngle = firstEndAngle; + } + else { + startAngle = Math.min(firstStartAngle, lastStartAngle); + endAngle = Math.max(firstEndAngle, lastEndAngle); + } + var radius = firstArcPathCommand[1]; + var innerRadius = arcPaths[arcPaths.length - 1][1]; + if (radius < innerRadius) { + _a = [innerRadius, radius], radius = _a[0], innerRadius = _a[1]; + } + else if (radius === innerRadius) { + innerRadius = 0; + } + return { + startAngle: startAngle, + endAngle: endAngle, + radius: radius, + innerRadius: innerRadius, + }; +} +/** + * @ignore + * 饼图更新动画 + * @param shape 文本图形 + * @param animateCfg + * @param cfg + */ +function sectorPathUpdate(shape, animateCfg, cfg) { + var toAttrs = cfg.toAttrs, coordinate = cfg.coordinate; + var path = toAttrs.path || []; + var pathCommands = path.map(function (command) { return command[0]; }); + if (path.length < 1) + return; + var _a = getArcInfo(path), curStartAngle = _a.startAngle, curEndAngle = _a.endAngle, radius = _a.radius, innerRadius = _a.innerRadius; + var _b = getArcInfo(shape.attr('path')), preStartAngle = _b.startAngle, preEndAngle = _b.endAngle; + var center = coordinate.getCenter(); + var diffStartAngle = curStartAngle - preStartAngle; + var diffEndAngle = curEndAngle - preEndAngle; + // 没有 diff 时直接返回最终 attrs，不需要额外动画 + if (diffStartAngle === 0 && diffEndAngle === 0) { + shape.attr('path', path); + return; + } + shape.animate(function (ratio) { + var onFrameStartAngle = preStartAngle + ratio * diffStartAngle; + var onFrameEndAngle = preEndAngle + ratio * diffEndAngle; + return __assign$r(__assign$r({}, toAttrs), { path: + // hack, 兼容 /examples/bar/basic/demo/radial-line.ts 动画 + isEqual$2(pathCommands, ['M', 'A', 'A', 'Z']) + ? getArcPath(center.x, center.y, radius, onFrameStartAngle, onFrameEndAngle) + : getSectorPath(center.x, center.y, radius, onFrameStartAngle, onFrameEndAngle, innerRadius) }); + }, __assign$r(__assign$r({}, animateCfg), { callback: function () { + // 将 path 保持原始态，否则会影响 setState() 的动画 + shape.attr('path', path); + } })); +} + +/** + * @ignore + * 整体动画 + * 划入入场动画效果 + * @todo 放两张直角坐标系和极坐标系的图 + * @param element 参与动画的图形元素 + * @param animateCfg 动画配置 + * @param cfg 额外信息 + */ +function waveIn(element, animateCfg, cfg) { + var _a = getCoordinateClipCfg(cfg.coordinate, 20), type = _a.type, startState = _a.startState, endState = _a.endState; // 根据坐标系类型获取整体的剪切区域配置信息 + var clipShape = element.setClip({ + type: type, + attrs: startState, + }); // 为 shape 设置剪切区域 + // 对剪切图形做动画 + clipShape.animate(endState, __assign$r(__assign$r({}, animateCfg), { callback: function () { + if (element && !element.get('destroyed')) { + element.set('clipShape', null); + } + clipShape.remove(true); // 动画结束需要将剪切图形销毁 + } })); +} + +function doShapeZoom(shape, animateCfg, type) { + if (shape.isGroup()) { + each$2(shape.getChildren(), function (child) { + doShapeZoom(child, animateCfg, type); + }); + } + else { + var bbox = shape.getBBox(); + var x = (bbox.minX + bbox.maxX) / 2; + var y = (bbox.minY + bbox.maxY) / 2; + shape.applyToMatrix([x, y, 1]); + if (type === 'zoomIn') { + // 放大 + var matrix = transform$i(shape.getMatrix(), [ + ['t', -x, -y], + ['s', 0.01, 0.01], + ['t', x, y], + ]); + shape.setMatrix(matrix); + shape.animate({ + matrix: transform$i(shape.getMatrix(), [ + ['t', -x, -y], + ['s', 100, 100], + ['t', x, y], + ]), + }, animateCfg); + } + else { + shape.animate({ + matrix: transform$i(shape.getMatrix(), [ + ['t', -x, -y], + ['s', 0.01, 0.01], + ['t', x, y], + ]), + }, __assign$r(__assign$r({}, animateCfg), { callback: function () { + shape.remove(true); + } })); + } + } +} +/** + * @ignore + * 单个 shape 动画 + * shape 以自身中心点逐渐放大的进入动画 + * @param shape 参与动画的图形元素 + * @param animateCfg 动画配置 + * @param cfg 额外信息 + */ +function zoomIn(shape, animateCfg, cfg) { + doShapeZoom(shape, animateCfg, 'zoomIn'); +} +/** + * @ignore + * 单个 shape 动画 + * 消失动画，shape 以自身为中心点的逐渐缩小 + * @param shape 参与动画的图形元素 + * @param animateCfg 动画配置 + * @param cfg 额外信息 + */ +function zoomOut(shape, animateCfg, cfg) { + doShapeZoom(shape, animateCfg, 'zoomOut'); +} + +/** + * @ignore + * 获取 facet title 的最佳默认配置，防止 + */ +function getFactTitleConfig(direction) { + if ([DIRECTION.TOP, DIRECTION.BOTTOM].includes(direction)) { + return { + offsetX: 0, + offsetY: direction === DIRECTION.TOP ? -8 : 8, + style: { + textAlign: 'center', + textBaseline: direction === DIRECTION.TOP ? 'bottom' : 'top', + }, + }; + } + if ([DIRECTION.LEFT, DIRECTION.RIGHT].includes(direction)) { + return { + offsetX: direction === DIRECTION.LEFT ? -8 : 8, + offsetY: 0, + style: { + textAlign: direction === DIRECTION.LEFT ? 'right' : 'left', + textBaseline: 'middle', + rotate: Math.PI / 2, + }, + }; + } + return {}; +} +/** + * @ignore + * 根据角度，获取 ○ 上的点 + * @param center + * @param r + * @param angle + */ +function getAnglePoint(center, r, angle) { + return { + x: center.x + r * Math.cos(angle), + y: center.y + r * Math.sin(angle), + }; +} + +/** + * @ignore + * 镜像分面 + */ +var Circle = /** @class */ (function (_super) { + __extends$e(Circle, _super); + function Circle() { + return _super !== null && _super.apply(this, arguments) || this; + } + Circle.prototype.getDefaultCfg = function () { + return deepMix({}, _super.prototype.getDefaultCfg.call(this), { + type: 'circle', + showTitle: true, + title: _super.prototype.getDefaultTitleCfg.call(this), + }); + }; + Circle.prototype.render = function () { + _super.prototype.render.call(this); + if (this.cfg.showTitle) { + this.renderTitle(); + } + }; + /** + * 根据总数和当前索引，计算分面的 region + * @param count + * @param index + */ + Circle.prototype.getRegion = function (count, index) { + var r = 1 / 2; // 画布半径 + // 画布圆心 + var center = { x: 0.5, y: 0.5 }; + // 每隔分面间隔的弧度 + var avgAngle = (Math.PI * 2) / count; + // 当前分面所在的弧度 + var angle = (-1 * Math.PI) / 2 + avgAngle * index; + // TODO 没看懂 + var facetR = r / (1 + 1 / Math.sin(avgAngle / 2)); + // 分面的中心点 + var middle = getAnglePoint(center, r - facetR, angle); + var startAngle = (Math.PI * 5) / 4; // 右上角 + var endAngle = (Math.PI * 1) / 4; // 左下角 + return { + start: getAnglePoint(middle, facetR, startAngle), + end: getAnglePoint(middle, facetR, endAngle), + }; + }; + Circle.prototype.afterEachView = function (view, facet) { + this.processAxis(view, facet); + }; + Circle.prototype.beforeEachView = function (view, facet) { }; + Circle.prototype.generateFacets = function (data) { + var _this = this; + var _a = this.cfg, fields = _a.fields, type = _a.type; + var field = fields[0]; + if (!field) { + throw new Error('No `fields` specified!'); + } + var values = this.getFieldValues(data, field); + var count = values.length; + var rst = []; + values.forEach(function (value, index) { + var conditions = [{ field: field, value: value, values: values }]; + var facetData = filter$1(data, _this.getFacetDataFilter(conditions)); + var facet = { + type: type, + data: facetData, + region: _this.getRegion(count, index), + columnValue: value, + columnField: field, + columnIndex: index, + columnValuesLength: count, + rowValue: null, + rowField: null, + rowIndex: 0, + rowValuesLength: 1, + }; + rst.push(facet); + }); + return rst; + }; + Circle.prototype.getXAxisOption = function (x, axes, option, facet) { + // 不做任何处理 + return option; + }; + /** + * 设置 y 坐标轴的文本、title 是否显示 + * @param y + * @param axes + * @param option + * @param facet + */ + Circle.prototype.getYAxisOption = function (y, axes, option, facet) { + // 不做任何处理 + return option; + }; + /** + * facet title + */ + Circle.prototype.renderTitle = function () { + var _this = this; + each$2(this.facets, function (facet) { + var columnValue = facet.columnValue, view = facet.view; + var formatter = get$3(_this.cfg.title, 'formatter'); + var config = deepMix({ + position: ['50%', '0%'], + content: formatter ? formatter(columnValue) : columnValue, + }, getFactTitleConfig(DIRECTION.TOP), _this.cfg.title); + view.annotation().text(config); + }); + }; + return Circle; +}(Facet$2)); + +/** + * @ignore + * 镜像分面 + */ +var List$2 = /** @class */ (function (_super) { + __extends$e(List, _super); + function List() { + return _super !== null && _super.apply(this, arguments) || this; + } + List.prototype.getDefaultCfg = function () { + return deepMix({}, _super.prototype.getDefaultCfg.call(this), { + type: 'list', + cols: null, + showTitle: true, + title: _super.prototype.getDefaultTitleCfg.call(this), + }); + }; + List.prototype.render = function () { + _super.prototype.render.call(this); + if (this.cfg.showTitle) { + this.renderTitle(); + } + }; + List.prototype.afterEachView = function (view, facet) { + this.processAxis(view, facet); + }; + List.prototype.beforeEachView = function (view, facet) { }; + List.prototype.generateFacets = function (data) { + var _this = this; + var fields = this.cfg.fields; + var cols = this.cfg.cols; + var columnField = fields[0]; + if (!columnField) { + throw new Error('No `fields` specified!'); + } + var colValues = this.getFieldValues(data, columnField); + var count = colValues.length; + cols = cols || count; // 每行有几列数据 + // 总共有几行 + var rows = this.getPageCount(count, cols); + var rst = []; + colValues.forEach(function (val, index) { + // 当前 index 在那个行列 + var _a = _this.getRowCol(index, cols), row = _a.row, col = _a.col; + var conditions = [{ field: columnField, value: val, values: colValues }]; + var facetData = filter$1(data, _this.getFacetDataFilter(conditions)); + var facet = { + type: _this.cfg.type, + data: facetData, + region: _this.getRegion(rows, cols, col, row), + columnValue: val, + rowValue: val, + columnField: columnField, + rowField: null, + columnIndex: col, + rowIndex: row, + columnValuesLength: cols, + rowValuesLength: rows, + total: count, + }; + rst.push(facet); + }); + return rst; + }; + /** + * 设置 x 坐标轴的文本、title 是否显示 + * @param x + * @param axes + * @param option + * @param facet + */ + List.prototype.getXAxisOption = function (x, axes, option, facet) { + // 当是最后一行或者下面没有 view 时文本不显示 + if (facet.rowIndex !== facet.rowValuesLength - 1 && + facet.columnValuesLength * facet.rowIndex + facet.columnIndex + 1 + facet.columnValuesLength <= facet.total) { + return __assign$r(__assign$r({}, option), { label: null, title: null }); + } + return option; + }; + /** + * 设置 y 坐标轴的文本、title 是否显示 + * @param y + * @param axes + * @param option + * @param facet + */ + List.prototype.getYAxisOption = function (y, axes, option, facet) { + if (facet.columnIndex !== 0) { + return __assign$r(__assign$r({}, option), { title: null, label: null }); + } + return option; + }; + /** + * facet title + */ + List.prototype.renderTitle = function () { + var _this = this; + each$2(this.facets, function (facet) { + var columnValue = facet.columnValue, view = facet.view; + var formatter = get$3(_this.cfg.title, 'formatter'); + var config = deepMix({ + position: ['50%', '0%'], + content: formatter ? formatter(columnValue) : columnValue, + }, getFactTitleConfig(DIRECTION.TOP), _this.cfg.title); + view.annotation().text(config); + }); + }; + /** + * 计算分页数 + * @param total + * @param pageSize + */ + List.prototype.getPageCount = function (total, pageSize) { + return Math.floor((total + pageSize - 1) / pageSize); + }; + /** + * 索引值在哪一页 + * @param index + * @param pageSize + */ + List.prototype.getRowCol = function (index, pageSize) { + var row = Math.floor(index / pageSize); + var col = index % pageSize; + return { row: row, col: col }; + }; + return List; +}(Facet$2)); + +/** + * @ignore + * 镜像分面 + */ +var Matrix$1 = /** @class */ (function (_super) { + __extends$e(Matrix, _super); + function Matrix() { + return _super !== null && _super.apply(this, arguments) || this; + } + Matrix.prototype.getDefaultCfg = function () { + return deepMix({}, _super.prototype.getDefaultCfg.call(this), { + type: 'matrix', + showTitle: false, + columnTitle: __assign$r({}, _super.prototype.getDefaultTitleCfg.call(this)), + rowTitle: __assign$r({}, _super.prototype.getDefaultTitleCfg.call(this)), + }); + }; + Matrix.prototype.render = function () { + _super.prototype.render.call(this); + if (this.cfg.showTitle) { + this.renderTitle(); + } + }; + Matrix.prototype.afterEachView = function (view, facet) { + this.processAxis(view, facet); + }; + Matrix.prototype.beforeEachView = function (view, facet) { }; + Matrix.prototype.generateFacets = function (data) { + var _a = this.cfg, fields = _a.fields, type = _a.type; + // 矩阵中行列相等，等于指定的字段个数 + var rowValuesLength = fields.length; + var columnValuesLength = rowValuesLength; + var rst = []; + for (var i = 0; i < columnValuesLength; i++) { + var columnField = fields[i]; + for (var j = 0; j < rowValuesLength; j++) { + var rowField = fields[j]; + var facet = { + type: type, + data: data, + region: this.getRegion(rowValuesLength, columnValuesLength, i, j), + columnValue: columnField, + rowValue: rowField, + columnField: columnField, + rowField: rowField, + columnIndex: i, + rowIndex: j, + columnValuesLength: columnValuesLength, + rowValuesLength: rowValuesLength, + }; + rst.push(facet); + } + } + return rst; + }; + /** + * 设置 x 坐标轴的文本、title 是否显示 + * @param x + * @param axes + * @param option + * @param facet + */ + Matrix.prototype.getXAxisOption = function (x, axes, option, facet) { + // 最后一行显示 + if (facet.rowIndex !== facet.rowValuesLength - 1) { + return __assign$r(__assign$r({}, option), { label: null, title: null }); + } + return option; + }; + /** + * 设置 y 坐标轴的文本、title 是否显示 + * @param y + * @param axes + * @param option + * @param facet + */ + Matrix.prototype.getYAxisOption = function (y, axes, option, facet) { + // 第一列显示 + if (facet.columnIndex !== 0) { + return __assign$r(__assign$r({}, option), { title: null, label: null }); + } + return option; + }; + /** + * facet title + */ + Matrix.prototype.renderTitle = function () { + var _this = this; + each$2(this.facets, function (facet, facetIndex) { + var columnIndex = facet.columnIndex, rowIndex = facet.rowIndex, columnValuesLength = facet.columnValuesLength; facet.rowValuesLength; var columnValue = facet.columnValue, rowValue = facet.rowValue, view = facet.view; + // top + if (rowIndex === 0) { + var formatter = get$3(_this.cfg.columnTitle, 'formatter'); + var config = deepMix({ + position: ['50%', '0%'], + content: formatter ? formatter(columnValue) : columnValue, + }, getFactTitleConfig(DIRECTION.TOP), _this.cfg.columnTitle); + view.annotation().text(config); + } + // right + if (columnIndex === columnValuesLength - 1) { + var formatter = get$3(_this.cfg.rowTitle, 'formatter'); + var config = deepMix({ + position: ['100%', '50%'], + content: formatter ? formatter(rowValue) : rowValue, + }, getFactTitleConfig(DIRECTION.RIGHT), _this.cfg.rowTitle); + view.annotation().text(config); + } + }); + }; + return Matrix; +}(Facet$2)); + +/** + * @ignore + * 镜像分面 + */ +var Mirror = /** @class */ (function (_super) { + __extends$e(Mirror, _super); + function Mirror() { + return _super !== null && _super.apply(this, arguments) || this; + } + Mirror.prototype.getDefaultCfg = function () { + return deepMix({}, _super.prototype.getDefaultCfg.call(this), { + type: 'mirror', + showTitle: true, + title: _super.prototype.getDefaultTitleCfg.call(this), + transpose: false, + }); + }; + Mirror.prototype.render = function () { + _super.prototype.render.call(this); + if (this.cfg.showTitle) { + this.renderTitle(); + } + }; + Mirror.prototype.beforeEachView = function (view, facet) { + // 做一下坐标系转化 + if (this.cfg.transpose) { + if (facet.columnIndex % 2 === 0) { + view.coordinate().transpose().reflect('x'); + } + else { + view.coordinate().transpose(); + } + } + else { + if (facet.rowIndex % 2 !== 0) { + view.coordinate().reflect('y'); + } + } + }; + Mirror.prototype.afterEachView = function (view, facet) { + this.processAxis(view, facet); + }; + Mirror.prototype.generateFacets = function (data) { + var _this = this; + var f = this.cfg.fields[0]; + var rst = []; + var columnValuesLength = 1; + var rowValuesLength = 1; + var columnValues = ['']; + var rowValues = ['']; + var columnField; + var rowField; + if (this.cfg.transpose) { + columnField = f; + columnValues = this.getFieldValues(data, columnField).slice(0, 2); // 镜像最多两个 + columnValuesLength = columnValues.length; + } + else { + rowField = f; + rowValues = this.getFieldValues(data, rowField).slice(0, 2); // 镜像最多两个 + rowValuesLength = rowValues.length; + } + // 获取每个维度对应的数据配置片段 + columnValues.forEach(function (xVal, xIndex) { + rowValues.forEach(function (yVal, yIndex) { + var conditions = [ + { field: columnField, value: xVal, values: columnValues }, + { field: rowField, value: yVal, values: rowValues }, + ]; + var facetData = filter$1(data, _this.getFacetDataFilter(conditions)); + var facet = { + type: _this.cfg.type, + data: facetData, + region: _this.getRegion(rowValuesLength, columnValuesLength, xIndex, yIndex), + columnValue: xVal, + rowValue: yVal, + columnField: columnField, + rowField: rowField, + columnIndex: xIndex, + rowIndex: yIndex, + columnValuesLength: columnValuesLength, + rowValuesLength: rowValuesLength, + }; + rst.push(facet); + }); + }); + return rst; + }; + /** + * 设置 x 坐标轴的文本、title 是否显示 + * @param x + * @param axes + * @param option + * @param facet + */ + Mirror.prototype.getXAxisOption = function (x, axes, option, facet) { + // 非最后一行 + // 当是最后一行或者下面没有 view 时文本不显示 + if (facet.columnIndex === 1 || facet.rowIndex === 1) { + return __assign$r(__assign$r({}, option), { label: null, title: null }); + } + return option; + }; + /** + * 设置 y 坐标轴的文本、title 是否显示 + * @param y + * @param axes + * @param option + * @param facet + */ + Mirror.prototype.getYAxisOption = function (y, axes, option, facet) { + // do nothing + return option; + }; + Mirror.prototype.renderTitle = function () { + var _this = this; + each$2(this.facets, function (facet, facetIndex) { + var columnValue = facet.columnValue, rowValue = facet.rowValue, view = facet.view; + var formatter = get$3(_this.cfg.title, 'formatter'); + if (_this.cfg.transpose) { + var config = deepMix({ + position: ['50%', '0%'], + content: formatter ? formatter(columnValue) : columnValue, + }, getFactTitleConfig(DIRECTION.TOP), _this.cfg.title); + view.annotation().text(config); + } + else { + var config = deepMix({ + position: ['100%', '50%'], + content: formatter ? formatter(rowValue) : rowValue, + }, getFactTitleConfig(DIRECTION.RIGHT), _this.cfg.title); + view.annotation().text(config); + } + }); + }; + return Mirror; +}(Facet$2)); + +/** + * @ignore + * 矩阵分面 + */ +var Rect = /** @class */ (function (_super) { + __extends$e(Rect, _super); + function Rect() { + return _super !== null && _super.apply(this, arguments) || this; + } + Rect.prototype.afterEachView = function (view, facet) { + this.processAxis(view, facet); + }; + Rect.prototype.beforeEachView = function (view, facet) { + // do nothing + }; + Rect.prototype.getDefaultCfg = function () { + return deepMix({}, _super.prototype.getDefaultCfg.call(this), { + type: 'rect', + columnTitle: __assign$r({}, _super.prototype.getDefaultTitleCfg.call(this)), + rowTitle: __assign$r({}, _super.prototype.getDefaultTitleCfg.call(this)), + }); + }; + Rect.prototype.render = function () { + _super.prototype.render.call(this); + if (this.cfg.showTitle) { + this.renderTitle(); + } + }; + /** + * 生成矩阵分面的分面数据 + * @param data + */ + Rect.prototype.generateFacets = function (data) { + var _this = this; + var _a = this.cfg.fields, columnField = _a[0], rowField = _a[1]; + var rst = []; + var columnValuesLength = 1; + var rowValuesLength = 1; + var columnValues = ['']; + var rowValues = ['']; + if (columnField) { + columnValues = this.getFieldValues(data, columnField); + columnValuesLength = columnValues.length; + } + if (rowField) { + rowValues = this.getFieldValues(data, rowField); + rowValuesLength = rowValues.length; + } + // 获取每个维度对应的数据配置片段 + columnValues.forEach(function (xVal, xIndex) { + rowValues.forEach(function (yVal, yIndex) { + var conditions = [ + { field: columnField, value: xVal, values: columnValues }, + { field: rowField, value: yVal, values: rowValues }, + ]; + var facetData = filter$1(data, _this.getFacetDataFilter(conditions)); + var facet = { + type: _this.cfg.type, + data: facetData, + region: _this.getRegion(rowValuesLength, columnValuesLength, xIndex, yIndex), + columnValue: xVal, + rowValue: yVal, + columnField: columnField, + rowField: rowField, + columnIndex: xIndex, + rowIndex: yIndex, + columnValuesLength: columnValuesLength, + rowValuesLength: rowValuesLength, + }; + rst.push(facet); + }); + }); + return rst; + }; + Rect.prototype.renderTitle = function () { + var _this = this; + each$2(this.facets, function (facet, facetIndex) { + var columnIndex = facet.columnIndex, rowIndex = facet.rowIndex, columnValuesLength = facet.columnValuesLength, columnValue = facet.columnValue, rowValue = facet.rowValue, view = facet.view; + // top + if (rowIndex === 0) { + var formatter = get$3(_this.cfg.columnTitle, 'formatter'); + var config = deepMix({ + position: ['50%', '0%'], + content: formatter ? formatter(columnValue) : columnValue, + }, getFactTitleConfig(DIRECTION.TOP), _this.cfg.columnTitle); + view.annotation().text(config); + } + // right + if (columnIndex === columnValuesLength - 1) { + var formatter = get$3(_this.cfg.rowTitle, 'formatter'); + var config = deepMix({ + position: ['100%', '50%'], + content: formatter ? formatter(rowValue) : rowValue, + }, getFactTitleConfig(DIRECTION.RIGHT), _this.cfg.rowTitle); + view.annotation().text(config); + } + }); + }; + /** + * 设置 x 坐标轴的文本、title 是否显示 + * @param x + * @param axes + * @param option + * @param facet + */ + Rect.prototype.getXAxisOption = function (x, axes, option, facet) { + // 非最后一行 + if (facet.rowIndex !== facet.rowValuesLength - 1) { + return __assign$r(__assign$r({}, option), { title: null, label: null }); + } + else if (facet.columnIndex !== Math.floor((facet.columnValuesLength - 1) / 2)) { + // 不是中间列 + return __assign$r(__assign$r({}, option), { title: null }); + } + return option; + }; + /** + * 设置 y 坐标轴的文本、title 是否显示 + * @param y + * @param axes + * @param option + * @param facet + */ + Rect.prototype.getYAxisOption = function (y, axes, option, facet) { + if (facet.columnIndex !== 0) { + return __assign$r(__assign$r({}, option), { title: null, label: null }); + } + else if (facet.rowIndex !== Math.floor((facet.rowValuesLength - 1) / 2)) { + return __assign$r(__assign$r({}, option), { title: null }); + } + return option; + }; + return Rect; +}(Facet$2)); + +/** + * @ignore + * Tree Facet + */ +var Tree = /** @class */ (function (_super) { + __extends$e(Tree, _super); + function Tree() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.afterChartRender = function () { + if (_this.facets && _this.cfg.line) { + _this.container.clear(); + _this.drawLines(_this.facets); + } + }; + return _this; + } + Tree.prototype.afterEachView = function (view, facet) { + this.processAxis(view, facet); + }; + Tree.prototype.beforeEachView = function (view, facet) { }; + Tree.prototype.init = function () { + _super.prototype.init.call(this); + this.view.on(VIEW_LIFE_CIRCLE.AFTER_RENDER, this.afterChartRender); + }; + Tree.prototype.getDefaultCfg = function () { + return deepMix({}, _super.prototype.getDefaultCfg.call(this), { + type: 'tree', + line: { + style: { + lineWidth: 1, + stroke: '#ddd', + }, + smooth: false, + }, + showTitle: true, + title: _super.prototype.getDefaultTitleCfg.call(this), + }); + }; + Tree.prototype.generateFacets = function (data) { + var fields = this.cfg.fields; + if (!fields.length) { + throw new Error('Please specify for the fields for rootFacet!'); + } + var rst = []; + var rootFacet = { + type: this.cfg.type, + data: data, + region: null, + rowValuesLength: this.getRows(), + columnValuesLength: 1, + rowIndex: 0, + columnIndex: 0, + rowField: '', + columnField: '', + rowValue: '', + columnValue: '', + }; + rst.push(rootFacet); + rootFacet.children = this.getChildFacets(data, 1, rst); + this.setRegion(rst); + return rst; + }; + Tree.prototype.setRegion = function (facets) { + var _this = this; + this.forceColIndex(facets); + facets.forEach(function (facet) { + // @ts-ignore 允许调整 + facet.region = _this.getRegion(facet.rowValuesLength, facet.columnValuesLength, facet.columnIndex, facet.rowIndex); + }); + }; + Tree.prototype.getRegion = function (rows, cols, xIndex, yIndex) { + var xWidth = 1 / cols; // x轴方向的每个分面的偏移 + var yWidth = 1 / rows; // y轴方向的每个分面的偏移 + var start = { + x: xWidth * xIndex, + y: yWidth * yIndex, + }; + var end = { + x: start.x + xWidth, + y: start.y + (yWidth * 2) / 3, + }; + return { + start: start, + end: end, + }; + }; + Tree.prototype.forceColIndex = function (facets) { + var _this = this; + var leafs = []; + var index = 0; + facets.forEach(function (facet) { + if (_this.isLeaf(facet)) { + leafs.push(facet); + // @ts-ignore 允许调整 + facet.columnIndex = index; + index++; + } + }); + leafs.forEach(function (facet) { + // @ts-ignore + facet.columnValuesLength = leafs.length; + }); + var maxLevel = this.cfg.fields.length; + for (var i = maxLevel - 1; i >= 0; i--) { + var levelFacets = this.getFacetsByLevel(facets, i); + // var yIndex = maxLevel - i; + for (var _i = 0, levelFacets_1 = levelFacets; _i < levelFacets_1.length; _i++) { + var facet = levelFacets_1[_i]; + if (!this.isLeaf(facet)) { + facet.originColIndex = facet.columnIndex; + // @ts-ignore + facet.columnIndex = this.getRegionIndex(facet.children); + // @ts-ignore + facet.columnValuesLength = leafs.length; + } + } + } + }; + // get facet use level + Tree.prototype.getFacetsByLevel = function (facets, level) { + var rst = []; + facets.forEach(function (facet) { + if (facet.rowIndex === level) { + rst.push(facet); + } + }); + return rst; + }; + // if the facet has children , make it's column index in the middle of it's children + Tree.prototype.getRegionIndex = function (children) { + var first = children[0]; + var last = children[children.length - 1]; + return (last.columnIndex - first.columnIndex) / 2 + first.columnIndex; + }; + // is a leaf without children + Tree.prototype.isLeaf = function (facet) { + return !facet.children || !facet.children.length; + }; + Tree.prototype.getRows = function () { + return this.cfg.fields.length + 1; + }; + // get child + Tree.prototype.getChildFacets = function (data, level, arr) { + var _this = this; + // [ 'grade', 'class' ] + var fields = this.cfg.fields; + var length = fields.length; + if (length < level) { + return; + } + var rst = []; + // get fist level except root node + var field = fields[level - 1]; + // get field value + var values = this.getFieldValues(data, field); + values.forEach(function (value, index) { + var conditions = [{ field: field, value: value, values: values }]; + var subData = data.filter(_this.getFacetDataFilter(conditions)); + if (subData.length) { + var facet = { + type: _this.cfg.type, + data: subData, + region: null, + columnValue: value, + rowValue: '', + columnField: field, + rowField: '', + columnIndex: index, + rowValuesLength: _this.getRows(), + columnValuesLength: 1, + rowIndex: level, + children: _this.getChildFacets(subData, level + 1, arr), + }; + rst.push(facet); + arr.push(facet); + } + }); + return rst; + }; + Tree.prototype.render = function () { + _super.prototype.render.call(this); + if (this.cfg.showTitle) { + this.renderTitle(); + } + }; + Tree.prototype.renderTitle = function () { + var _this = this; + each$2(this.facets, function (facet) { + var columnValue = facet.columnValue, view = facet.view; + var formatter = get$3(_this.cfg.title, 'formatter'); + var config = deepMix({ + position: ['50%', '0%'], + content: formatter ? formatter(columnValue) : columnValue, + }, getFactTitleConfig(DIRECTION.TOP), _this.cfg.title); + view.annotation().text(config); + }); + }; + Tree.prototype.drawLines = function (facets) { + var _this = this; + facets.forEach(function (facet) { + if (!_this.isLeaf(facet)) { + var children = facet.children; + _this.addFacetLines(facet, children); + } + }); + }; + // add lines with it's children + Tree.prototype.addFacetLines = function (facet, children) { + var _this = this; + var view = facet.view; + var region = view.coordinateBBox; + // top, right, bottom, left + var start = { + x: region.x + region.width / 2, + y: region.y + region.height, + }; + children.forEach(function (subFacet) { + var subRegion = subFacet.view.coordinateBBox; + var end = { + x: subRegion.bl.x + (subRegion.tr.x - subRegion.bl.x) / 2, + y: subRegion.tr.y, + }; + var middle1 = { + x: start.x, + y: start.y + (end.y - start.y) / 2, + }; + var middle2 = { + x: end.x, + y: middle1.y, + }; + _this.drawLine([start, middle1, middle2, end]); + }); + }; + Tree.prototype.getPath = function (points) { + var path = []; + var smooth = this.cfg.line.smooth; + if (smooth) { + path.push(['M', points[0].x, points[0].y]); + path.push(['C', points[1].x, points[1].y, points[2].x, points[2].y, points[3].x, points[3].y]); + } + else { + points.forEach(function (point, index) { + if (index === 0) { + path.push(['M', point.x, point.y]); + } + else { + path.push(['L', point.x, point.y]); + } + }); + } + return path; + }; + // draw line width points + Tree.prototype.drawLine = function (points) { + var path = this.getPath(points); + var line = this.cfg.line.style; + this.container.addShape('path', { + attrs: mix({ + // @ts-ignore + path: path, + }, line), + }); + }; + Tree.prototype.getXAxisOption = function (x, axes, option, facet) { + if (facet.rowIndex !== facet.rowValuesLength - 1) { + return __assign$r(__assign$r({}, option), { title: null, label: null }); + } + return option; + }; + Tree.prototype.getYAxisOption = function (y, axes, option, facet) { + if (facet.originColIndex !== 0 && facet.columnIndex !== 0) { + return __assign$r(__assign$r({}, option), { title: null, label: null }); + } + return option; + }; + return Tree; +}(Facet$2)); + +/** + * 获得中位数 + * @param array + */ +function getMedian(array) { + var arr = __spreadArrays$1(array); + // 先排序 + arr.sort(function (a, b) { + return a - b; + }); + var len = arr.length; + // median + // 0 + if (len === 0) { + return 0; + } + // 奇数 + if (len % 2 === 1) { + return arr[(len - 1) / 2]; + } + // 偶数 + return (arr[len / 2] + arr[len / 2 - 1]) / 2; +} +/** + * 获得平均值 + * @param array + */ +function getMean(array) { + var sum = reduce$1(array, function (r, num) { + return r += (isNaN(num) || !isNumber$4(num) ? 0 : num); + }, 0); + return array.length === 0 ? 0 : sum / array.length; +} + +/** + * parse the value position + * @param val + * @param scale + */ +function getNormalizedValue(val, scale) { + if (!scale) { + return null; + } + var scaled; + switch (val) { + case 'start': + return 0; + case 'end': + return 1; + case 'median': { + scaled = scale.isCategory ? getMedian(scale.values.map(function (_, idx) { return idx; })) : getMedian(scale.values); + break; + } + case 'mean': { + scaled = scale.isCategory ? (scale.values.length - 1) / 2 : getMean(scale.values); + break; + } + case 'min': + scaled = scale.isCategory ? 0 : scale[val]; + break; + case 'max': + scaled = scale.isCategory ? scale.values.length - 1 : scale[val]; + break; + default: + scaled = val; + break; + } + return scale.scale(scaled); +} + +/** 需要在图形绘制完成后才渲染的辅助组件类型列表 */ +var ANNOTATIONS_AFTER_RENDER = ['regionFilter', 'shape']; +/** + * Annotation controller, 主要作用: + * 1. 创建 Annotation: line、text、arc ... + * 2. 生命周期: init、layout、render、clear、destroy + */ +var Annotation = /** @class */ (function (_super) { + __extends$e(Annotation, _super); + function Annotation(view) { + var _this = _super.call(this, view) || this; + /* 组件更新的 cache，组件配置 object : 组件 */ + _this.cache = new Map(); + _this.foregroundContainer = _this.view.getLayer(LAYER.FORE).addGroup(); + _this.backgroundContainer = _this.view.getLayer(LAYER.BG).addGroup(); + _this.option = []; + return _this; + } + Object.defineProperty(Annotation.prototype, "name", { + get: function () { + return 'annotation'; + }, + enumerable: false, + configurable: true + }); + Annotation.prototype.init = function () { }; + /** + * 因为 annotation 需要依赖坐标系信息，所以 render 阶段为空方法，实际的创建逻辑都在 layout 中 + */ + Annotation.prototype.layout = function () { + this.update(); + }; + // 因为 Annotation 不参与布局，但是渲染的位置依赖于坐标系，所以可以将绘制阶段延迟到 layout() 进行 + Annotation.prototype.render = function () { }; + /** + * 更新 + */ + Annotation.prototype.update = function () { + var _this = this; + // 1. 先处理需要在图形渲染之后的辅助组件 需要在 Geometry 完成之后，拿到图形信息 + this.onAfterRender(function () { + var updated = new Map(); + // 先看是否有 regionFilter/shape 要更新 + each$2(_this.option, function (option) { + if (contains(ANNOTATIONS_AFTER_RENDER, option.type)) { + var co = _this.updateOrCreate(option); + // 存储已经处理过的 + if (co) { + updated.set(_this.getCacheKey(option), co); + } + } + }); + // 处理完成之后，更新 cache + // 处理完成之后，销毁删除的 + _this.cache = _this.syncCache(updated); + }); + // 2. 处理非 regionFilter + var updateCache = new Map(); + each$2(this.option, function (option) { + if (!contains(ANNOTATIONS_AFTER_RENDER, option.type)) { + var co = _this.updateOrCreate(option); + // 存储已经处理过的 + if (co) { + updateCache.set(_this.getCacheKey(option), co); + } + } + }); + this.cache = this.syncCache(updateCache); + }; + /** + * 清空 + * @param includeOption 是否清空 option 配置项 + */ + Annotation.prototype.clear = function (includeOption) { + if (includeOption === void 0) { includeOption = false; } + _super.prototype.clear.call(this); + this.clearComponents(); + this.foregroundContainer.clear(); + this.backgroundContainer.clear(); + // clear all option + if (includeOption) { + this.option = []; + } + }; + Annotation.prototype.destroy = function () { + this.clear(true); + this.foregroundContainer.remove(true); + this.backgroundContainer.remove(true); + }; + /** + * 复写基类的方法 + */ + Annotation.prototype.getComponents = function () { + var co = []; + this.cache.forEach(function (value) { + co.push(value); + }); + return co; + }; + /** + * 清除当前的组件 + */ + Annotation.prototype.clearComponents = function () { + this.getComponents().forEach(function (co) { + co.component.destroy(); + }); + this.cache.clear(); + }; + /** + * region filter 比较特殊的渲染时机 + * @param doWhat + */ + Annotation.prototype.onAfterRender = function (doWhat) { + if (this.view.getOptions().animate) { + this.view.geometries.forEach(function (g) { + // 如果 geometry 开启，则监听 + if (g.animateOption) { + g.once(GEOMETRY_LIFE_CIRCLE.AFTER_DRAW_ANIMATE, function () { + doWhat(); + }); + } + }); + } + else { + this.view.getRootView().once(VIEW_LIFE_CIRCLE.AFTER_RENDER, function () { + doWhat(); + }); + } + }; + Annotation.prototype.createAnnotation = function (option) { + var type = option.type; + var Ctor = AnnotationComponent[upperFirst(type)]; + if (Ctor) { + var theme = this.getAnnotationTheme(type); + var cfg = this.getAnnotationCfg(type, option, theme); + var annotation = new Ctor(cfg); + return { + component: annotation, + layer: this.isTop(cfg) ? LAYER.FORE : LAYER.BG, + direction: DIRECTION.NONE, + type: COMPONENT_TYPE.ANNOTATION, + extra: option, + }; + } + }; + // APIs for creating annotation component + Annotation.prototype.annotation = function (option) { + this.option.push(option); + }; + /** + * 创建 Arc + * @param option + * @returns AnnotationController + */ + Annotation.prototype.arc = function (option) { + this.annotation(__assign$r({ type: 'arc' }, option)); + return this; + }; + /** + * 创建 image + * @param option + * @returns AnnotationController + */ + Annotation.prototype.image = function (option) { + this.annotation(__assign$r({ type: 'image' }, option)); + return this; + }; + /** + * 创建 Line + * @param option + * @returns AnnotationController + */ + Annotation.prototype.line = function (option) { + this.annotation(__assign$r({ type: 'line' }, option)); + return this; + }; + /** + * 创建 Region + * @param option + * @returns AnnotationController + */ + Annotation.prototype.region = function (option) { + this.annotation(__assign$r({ type: 'region' }, option)); + return this; + }; + /** + * 创建 Text + * @param option + * @returns AnnotationController + */ + Annotation.prototype.text = function (option) { + this.annotation(__assign$r({ type: 'text' }, option)); + return this; + }; + /** + * 创建 DataMarker + * @param option + * @returns AnnotationController + */ + Annotation.prototype.dataMarker = function (option) { + this.annotation(__assign$r({ type: 'dataMarker' }, option)); + return this; + }; + /** + * 创建 DataRegion + * @param option + * @returns AnnotationController + */ + Annotation.prototype.dataRegion = function (option) { + this.annotation(__assign$r({ type: 'dataRegion' }, option)); + }; + /** + * 创建 RegionFilter + * @param option + * @returns AnnotationController + */ + Annotation.prototype.regionFilter = function (option) { + this.annotation(__assign$r({ type: 'regionFilter' }, option)); + }; + /** + * 创建 ShapeAnnotation + * @param option + */ + Annotation.prototype.shape = function (option) { + this.annotation(__assign$r({ type: 'shape' }, option)); + }; + /** + * 创建 HtmlAnnotation + * @param option + */ + Annotation.prototype.html = function (option) { + this.annotation(__assign$r({ type: 'html' }, option)); + }; + // end API + /** + * parse the point position to [x, y] + * @param p Position + * @returns { x, y } + */ + Annotation.prototype.parsePosition = function (p) { + var xScale = this.view.getXScale(); + // 转成 object + var yScales = this.view.getScalesByDim('y'); + var position = isFunction$6(p) ? p.call(null, xScale, yScales) : p; + var x = 0; + var y = 0; + // 入参是 [24, 24] 这类时 + if (isArray$n(position)) { + var xPos = position[0], yPos = position[1]; + // 如果数据格式是 ['50%', '50%'] 的格式 + // fix: 原始数据中可能会包含 'xxx5%xxx' 这样的数据，需要判断下 https://github.com/antvis/f2/issues/590 + // @ts-ignore + if (isString$3(xPos) && xPos.indexOf('%') !== -1 && !isNaN(xPos.slice(0, -1))) { + return this.parsePercentPosition(position); + } + x = getNormalizedValue(xPos, xScale); + y = getNormalizedValue(yPos, Object.values(yScales)[0]); + } + else if (!isNil(position)) { + // 入参是 object 结构，数据点 + for (var _i = 0, _a = keys$8(position); _i < _a.length; _i++) { + var key = _a[_i]; + var value = position[key]; + if (key === xScale.field) { + x = getNormalizedValue(value, xScale); + } + if (yScales[key]) { + y = getNormalizedValue(value, yScales[key]); + } + } + } + return this.view.getCoordinate().convert({ x: x, y: y }); + }; + /** + * parse all the points between start and end + * @param start + * @param end + * @return Point[] + */ + Annotation.prototype.getRegionPoints = function (start, end) { + var _this = this; + var xScale = this.view.getXScale(); + var yScales = this.view.getScalesByDim('y'); + var yScale = Object.values(yScales)[0]; + var xField = xScale.field; + var viewData = this.view.getData(); + var startXValue = isArray$n(start) ? start[0] : start[xField]; + var endXValue = isArray$n(end) ? end[0] : end[xField]; + var arr = []; + var startIndex; + each$2(viewData, function (item, idx) { + if (item[xField] === startXValue) { + startIndex = idx; + } + if (idx >= startIndex) { + var point = _this.parsePosition([item[xField], item[yScale.field]]); + if (point) { + arr.push(point); + } + } + if (item[xField] === endXValue) { + return false; + } + }); + return arr; + }; + /** + * parse percent position + * @param position + */ + Annotation.prototype.parsePercentPosition = function (position) { + var xPercent = parseFloat(position[0]) / 100; + var yPercent = parseFloat(position[1]) / 100; + var coordinate = this.view.getCoordinate(); + var start = coordinate.start, end = coordinate.end; + var topLeft = { + x: Math.min(start.x, end.x), + y: Math.min(start.y, end.y), + }; + var x = coordinate.getWidth() * xPercent + topLeft.x; + var y = coordinate.getHeight() * yPercent + topLeft.y; + return { x: x, y: y }; + }; + /** + * get coordinate bbox + */ + Annotation.prototype.getCoordinateBBox = function () { + var coordinate = this.view.getCoordinate(); + var start = coordinate.start, end = coordinate.end; + var width = coordinate.getWidth(); + var height = coordinate.getHeight(); + var topLeft = { + x: Math.min(start.x, end.x), + y: Math.min(start.y, end.y), + }; + return { + x: topLeft.x, + y: topLeft.y, + minX: topLeft.x, + minY: topLeft.y, + maxX: topLeft.x + width, + maxY: topLeft.y + height, + width: width, + height: height, + }; + }; + /** + * get annotation component config by different type + * @param type + * @param option 用户的配置 + * @param theme + */ + Annotation.prototype.getAnnotationCfg = function (type, option, theme) { + var _this = this; + var coordinate = this.view.getCoordinate(); + var canvas = this.view.getCanvas(); + var o = {}; + if (isNil(option)) { + return null; + } + if (type === 'arc') { + var _a = option, start = _a.start, end = _a.end; + var sp = this.parsePosition(start); + var ep = this.parsePosition(end); + var startAngle = getAngleByPoint(coordinate, sp); + var endAngle = getAngleByPoint(coordinate, ep); + if (startAngle > endAngle) { + endAngle = Math.PI * 2 + endAngle; + } + o = { + center: coordinate.getCenter(), + radius: getDistanceToCenter(coordinate, sp), + startAngle: startAngle, + endAngle: endAngle, + }; + } + else if (type === 'image') { + var _b = option, start = _b.start, end = _b.end; + o = { + start: this.parsePosition(start), + end: this.parsePosition(end), + src: option.src, + }; + } + else if (type === 'line') { + var _c = option, start = _c.start, end = _c.end; + o = { + start: this.parsePosition(start), + end: this.parsePosition(end), + text: get$3(option, 'text', null), + }; + } + else if (type === 'region') { + var _d = option, start = _d.start, end = _d.end; + o = { + start: this.parsePosition(start), + end: this.parsePosition(end), + }; + } + else if (type === 'text') { + var filteredData = this.view.getData(); + var _e = option, position = _e.position, content = _e.content, rest = __rest$G(_e, ["position", "content"]); + var textContent = content; + if (isFunction$6(content)) { + textContent = content(filteredData); + } + o = __assign$r(__assign$r(__assign$r({}, this.parsePosition(position)), rest), { content: textContent }); + } + else if (type === 'dataMarker') { + var _f = option, position = _f.position, point = _f.point, line = _f.line, text = _f.text, autoAdjust = _f.autoAdjust, direction = _f.direction; + o = __assign$r(__assign$r({}, this.parsePosition(position)), { coordinateBBox: this.getCoordinateBBox(), point: point, + line: line, + text: text, + autoAdjust: autoAdjust, + direction: direction }); + } + else if (type === 'dataRegion') { + var _g = option, start = _g.start, end = _g.end, region = _g.region, text = _g.text, lineLength = _g.lineLength; + o = { + points: this.getRegionPoints(start, end), + region: region, + text: text, + lineLength: lineLength, + }; + } + else if (type === 'regionFilter') { + var _h = option, start = _h.start, end = _h.end, apply_1 = _h.apply, color = _h.color; + var geometries = this.view.geometries; + var shapes_1 = []; + var addShapes_1 = function (item) { + if (!item) { + return; + } + if (item.isGroup()) { + item.getChildren().forEach(function (child) { return addShapes_1(child); }); + } + else { + shapes_1.push(item); + } + }; + each$2(geometries, function (geom) { + if (apply_1) { + if (contains(apply_1, geom.type)) { + each$2(geom.elements, function (elem) { + addShapes_1(elem.shape); + }); + } + } + else { + each$2(geom.elements, function (elem) { + addShapes_1(elem.shape); + }); + } + }); + o = { + color: color, + shapes: shapes_1, + start: this.parsePosition(start), + end: this.parsePosition(end), + }; + } + else if (type === 'shape') { + var _j = option, render_1 = _j.render, restOptions = __rest$G(_j, ["render"]); + var wrappedRender = function (container) { + if (isFunction$6(option.render)) { + return render_1(container, _this.view, { parsePosition: _this.parsePosition.bind(_this) }); + } + }; + o = __assign$r(__assign$r({}, restOptions), { render: wrappedRender }); + } + else if (type === 'html') { + var _k = option, html_1 = _k.html, position = _k.position, restOptions = __rest$G(_k, ["html", "position"]); + var wrappedHtml = function (container) { + if (isFunction$6(html_1)) { + return html_1(container, _this.view); + } + return html_1; + }; + o = __assign$r(__assign$r(__assign$r({}, restOptions), this.parsePosition(position)), { + // html 组件需要指定 parent + parent: canvas.get('el').parentNode, html: wrappedHtml }); + } + // 合并主题，用户配置优先级高于默认主题 + var cfg = deepMix({}, theme, __assign$r(__assign$r({}, o), { top: option.top, style: option.style, offsetX: option.offsetX, offsetY: option.offsetY })); + if (type !== 'html') { + // html 类型不使用 G container + cfg.container = this.getComponentContainer(cfg); + } + cfg.animate = this.view.getOptions().animate && cfg.animate && get$3(option, 'animate', cfg.animate); // 如果 view 关闭动画，则不执行 + cfg.animateOption = deepMix({}, DEFAULT_ANIMATE_CFG, cfg.animateOption, option.animateOption); + return cfg; + }; + /** + * is annotation render on top + * @param option + * @return whethe on top + */ + Annotation.prototype.isTop = function (option) { + return get$3(option, 'top', true); + }; + /** + * get the container by option.top + * default is on top + * @param option + * @returns the container + */ + Annotation.prototype.getComponentContainer = function (option) { + return this.isTop(option) ? this.foregroundContainer : this.backgroundContainer; + }; + Annotation.prototype.getAnnotationTheme = function (type) { + return get$3(this.view.getTheme(), ['components', 'annotation', type], {}); + }; + /** + * 创建或者更新 annotation + * @param option + */ + Annotation.prototype.updateOrCreate = function (option) { + // 拿到缓存的内容 + var co = this.cache.get(this.getCacheKey(option)); + // 存在则更新，不存在在创建 + if (co) { + var type = option.type; + var theme = this.getAnnotationTheme(type); + var cfg = this.getAnnotationCfg(type, option, theme); + // 忽略掉一些配置 + omit(cfg, ['container']); + co.component.update(cfg); + // 对于 regionFilter/shape，因为生命周期的原因，需要额外 render + if (contains(ANNOTATIONS_AFTER_RENDER, option.type)) { + co.component.render(); + } + } + else { + // 不存在，创建 + co = this.createAnnotation(option); + if (co) { + co.component.init(); + // Note：regionFilter/shape 特殊处理，regionFilter/shape 需要取到 Geometry 中的 Shape，需要在 view render 之后处理 + // 其他组件使用外层的统一 render 逻辑 + if (contains(ANNOTATIONS_AFTER_RENDER, option.type)) { + co.component.render(); + } + } + } + return co; + }; + /** + * 更新缓存，以及销毁组件 + * @param updated 更新或者创建的组件 + */ + Annotation.prototype.syncCache = function (updated) { + var _this = this; + var newCache = new Map(this.cache); // clone 一份 + // 将 update 更新到 cache + updated.forEach(function (co, key) { + newCache.set(key, co); + }); + // 另外和 options 进行对比，删除 + newCache.forEach(function (co, key) { + // option 中已经找不到，那么就是删除的 + if (!find$3(_this.option, function (option) { + return key === _this.getCacheKey(option); + })) { + co.component.destroy(); + newCache.delete(key); + } + }); + return newCache; + }; + /** + * 获得缓存组件的 key + * @param option + */ + Annotation.prototype.getCacheKey = function (option) { + // 如果存在 id，则使用 id string，否则直接使用 option 引用作为 key + return option; + // 后续扩展 id 用 + // const id = get(option, 'id'); + // return id ? id : option; + }; + return Annotation; +}(Controller)); + +/** + * @ignore + * get the grid theme by type, will mix the common cfg of axis + * @param theme + * @param direction + * @returns theme object + */ +function getGridThemeCfg(theme, direction) { + var axisTheme = deepMix({}, get$3(theme, ['components', 'axis', 'common']), get$3(theme, ['components', 'axis', direction])); + return get$3(axisTheme, ['grid'], {}); +} +/** + * @ignore + * get axis grid items + * @param coordinate + * @param scale + * @param dim + * @return items + */ +function getLineGridItems(coordinate, scale, dim, alignTick) { + var items = []; + var ticks = scale.getTicks(); + if (coordinate.isPolar) { + // 补全 ticks + ticks.push({ + value: 1, + text: '', + tickValue: '', + }); + } + ticks.reduce(function (preTick, currentTick, currentIndex) { + var currentValue = currentTick.value; + if (alignTick) { + items.push({ + points: [ + coordinate.convert(dim === 'y' ? { x: 0, y: currentValue } : { x: currentValue, y: 0 }), + coordinate.convert(dim === 'y' ? { x: 1, y: currentValue } : { x: currentValue, y: 1 }), + ], + }); + } + else { + if (currentIndex) { + var preValue = preTick.value; + var middleValue = (preValue + currentValue) / 2; + items.push({ + points: [ + coordinate.convert(dim === 'y' ? { x: 0, y: middleValue } : { x: middleValue, y: 0 }), + coordinate.convert(dim === 'y' ? { x: 1, y: middleValue } : { x: middleValue, y: 1 }), + ], + }); + } + } + return currentTick; + }, ticks[0]); + return items; +} +/** + * @ignore + * get + * @param coordinate + * @param xScale + * @param yScale + * @param dim + * @returns items + */ +function getCircleGridItems(coordinate, xScale, yScale, alignTick, dim) { + var count = xScale.values.length; + var items = []; + var ticks = yScale.getTicks(); + ticks.reduce(function (preTick, currentTick) { + var preValue = preTick ? preTick.value : currentTick.value; // 只有一项数据时取当前值 + var currentValue = currentTick.value; + var middleValue = (preValue + currentValue) / 2; + if (dim === 'x') { + // 如果是 x 轴作为半径轴，那么只需要取圆弧收尾两个即可 + items.push({ + points: [ + coordinate.convert({ + x: alignTick ? currentValue : middleValue, + y: 0, + }), + coordinate.convert({ + x: alignTick ? currentValue : middleValue, + y: 1, + }), + ], + }); + } + else { + items.push({ + points: map$4(Array(count + 1), function (__, idx) { + return coordinate.convert({ + x: idx / count, + y: alignTick ? currentValue : middleValue, + }); + }), + }); + } + return currentTick; + }, ticks[0]); + return items; +} +/** + * @ignore + * show grid or not + * @param axisTheme + * @param axisOption + */ +function showGrid(axisTheme, axisOption) { + var userGrid = get$3(axisOption, 'grid'); + if (userGrid === null) { + return false; + } + var themeGrid = get$3(axisTheme, 'grid'); + return !(userGrid === undefined && themeGrid === null); +} + +// update 组件的时候，忽略的数据更新 +var OMIT_CFG = ['container']; +// 坐标轴默认动画配置 +var AXIS_DEFAULT_ANIMATE_CFG = __assign$r(__assign$r({}, DEFAULT_ANIMATE_CFG), { appear: null }); +/** + * @ignore + * G2 Axis controller, will: + * - create component + * - axis + * - grid + * - life circle + */ +var Axis = /** @class */ (function (_super) { + __extends$e(Axis, _super); + function Axis(view) { + var _this = _super.call(this, view) || this; + /** 使用 object 存储组件 */ + _this.cache = new Map(); + // 先创建 gridContainer，将 grid 放到 axis 底层 + _this.gridContainer = _this.view.getLayer(LAYER.BG).addGroup(); + _this.gridForeContainer = _this.view.getLayer(LAYER.FORE).addGroup(); + _this.axisContainer = _this.view.getLayer(LAYER.BG).addGroup(); + _this.axisForeContainer = _this.view.getLayer(LAYER.FORE).addGroup(); + return _this; + } + Object.defineProperty(Axis.prototype, "name", { + get: function () { + return 'axis'; + }, + enumerable: false, + configurable: true + }); + Axis.prototype.init = function () { }; + Axis.prototype.render = function () { + this.update(); + }; + /** + * 更新组件布局，位置大小 + */ + Axis.prototype.layout = function () { + var _this = this; + var coordinate = this.view.getCoordinate(); + each$2(this.getComponents(), function (co) { + var component = co.component, direction = co.direction, type = co.type, extra = co.extra; + var dim = extra.dim, scale = extra.scale, alignTick = extra.alignTick; + var updated; + if (type === COMPONENT_TYPE.AXIS) { + if (coordinate.isPolar) { + if (dim === 'x') { + updated = coordinate.isTransposed + ? getAxisRegion(coordinate, direction) + : getCircleAxisCenterRadius(coordinate); + } + else if (dim === 'y') { + updated = coordinate.isTransposed + ? getCircleAxisCenterRadius(coordinate) + : getAxisRegion(coordinate, direction); + } + } + else { + updated = getAxisRegion(coordinate, direction); + } + } + else if (type === COMPONENT_TYPE.GRID) { + if (coordinate.isPolar) { + var items = void 0; + if (coordinate.isTransposed) { + items = + dim === 'x' + ? getCircleGridItems(coordinate, _this.view.getYScales()[0], scale, alignTick, dim) + : getLineGridItems(coordinate, scale, dim, alignTick); + } + else { + items = + dim === 'x' + ? getLineGridItems(coordinate, scale, dim, alignTick) + : getCircleGridItems(coordinate, _this.view.getXScale(), scale, alignTick, dim); + } + updated = { + items: items, + // coordinate 更新之后，center 也变化了 + center: _this.view.getCoordinate().getCenter(), + }; + } + else { + updated = { items: getLineGridItems(coordinate, scale, dim, alignTick) }; + } + } + component.update(updated); + }); + }; + /** + * 更新 axis 组件 + */ + Axis.prototype.update = function () { + this.option = this.view.getOptions().axes; + var updatedCache = new Map(); + this.updateXAxes(updatedCache); + this.updateYAxes(updatedCache); + // 处理完成之后，销毁删除的 + // 不在处理中的 + var newCache = new Map(); + this.cache.forEach(function (co, key) { + if (updatedCache.has(key)) { + newCache.set(key, co); + } + else { + // 不存在，则是所有需要被销毁的组件 + co.component.destroy(); + } + }); + // 更新缓存 + this.cache = newCache; + }; + Axis.prototype.clear = function () { + _super.prototype.clear.call(this); + this.cache.clear(); + this.gridContainer.clear(); + this.gridForeContainer.clear(); + this.axisContainer.clear(); + this.axisForeContainer.clear(); + }; + Axis.prototype.destroy = function () { + _super.prototype.destroy.call(this); + this.gridContainer.remove(true); + this.gridForeContainer.remove(true); + this.axisContainer.remove(true); + this.axisForeContainer.remove(true); + }; + /** + * @override + */ + Axis.prototype.getComponents = function () { + var co = []; + this.cache.forEach(function (value) { + co.push(value); + }); + return co; + }; + /** + * 更新 x axis + * @param updatedCache + */ + Axis.prototype.updateXAxes = function (updatedCache) { + // x axis + var scale = this.view.getXScale(); + if (!scale || scale.isIdentity) { + return; + } + var xAxisOption = getAxisOption(this.option, scale.field); + if (xAxisOption === false) { + return; + } + var direction = getAxisDirection(xAxisOption, DIRECTION.BOTTOM); + var layer = LAYER.BG; + var dim = 'x'; + var coordinate = this.view.getCoordinate(); + var axisId = this.getId('axis', scale.field); + var gridId = this.getId('grid', scale.field); + if (coordinate.isRect) { + // 1. do axis update + var axis = this.cache.get(axisId); + // 存在则更新 + if (axis) { + var cfg = this.getLineAxisCfg(scale, xAxisOption, direction); + omit(cfg, OMIT_CFG); + axis.component.update(cfg); + updatedCache.set(axisId, axis); + } + else { + // 不存在，则创建 + axis = this.createLineAxis(scale, xAxisOption, layer, direction, dim); + this.cache.set(axisId, axis); + updatedCache.set(axisId, axis); + } + // 2. do grid update + var grid = this.cache.get(gridId); + // 存在则更新 + if (grid) { + var cfg = this.getLineGridCfg(scale, xAxisOption, direction, dim); + omit(cfg, OMIT_CFG); + grid.component.update(cfg); + updatedCache.set(gridId, grid); + } + else { + // 不存在则创建 + grid = this.createLineGrid(scale, xAxisOption, layer, direction, dim); + if (grid) { + this.cache.set(gridId, grid); + updatedCache.set(gridId, grid); + } + } + } + else if (coordinate.isPolar) { + // 1. do axis update + var axis = this.cache.get(axisId); + // 存在则更新 + if (axis) { + var cfg = coordinate.isTransposed + ? this.getLineAxisCfg(scale, xAxisOption, DIRECTION.RADIUS) + : this.getCircleAxisCfg(scale, xAxisOption, direction); + omit(cfg, OMIT_CFG); + axis.component.update(cfg); + updatedCache.set(axisId, axis); + } + else { + // 不存在，则创建 + if (coordinate.isTransposed) { + if (isUndefined$1(xAxisOption)) { + // 默认不渲染转置极坐标下的坐标轴 + return; + } + else { + // 如果用户打开了隐藏的坐标轴 chart.axis(true)/chart.axis('x', true) + // 那么对于转置了的极坐标，半径轴显示的是 x 轴对应的数据 + axis = this.createLineAxis(scale, xAxisOption, layer, DIRECTION.RADIUS, dim); + } + } + else { + axis = this.createCircleAxis(scale, xAxisOption, layer, direction, dim); + } + this.cache.set(axisId, axis); + updatedCache.set(axisId, axis); + } + // 2. do grid update + var grid = this.cache.get(gridId); + // 存在则更新 + if (grid) { + var cfg = coordinate.isTransposed + ? this.getCircleGridCfg(scale, xAxisOption, DIRECTION.RADIUS, dim) + : this.getLineGridCfg(scale, xAxisOption, DIRECTION.CIRCLE, dim); + omit(cfg, OMIT_CFG); + grid.component.update(cfg); + updatedCache.set(gridId, grid); + } + else { + // 不存在则创建 + if (coordinate.isTransposed) { + if (isUndefined$1(xAxisOption)) { + return; + } + else { + grid = this.createCircleGrid(scale, xAxisOption, layer, DIRECTION.RADIUS, dim); + } + } + else { + // grid，极坐标下的 x 轴网格线沿着半径方向绘制 + grid = this.createLineGrid(scale, xAxisOption, layer, DIRECTION.CIRCLE, dim); + } + if (grid) { + this.cache.set(gridId, grid); + updatedCache.set(gridId, grid); + } + } + } + else ; + }; + Axis.prototype.updateYAxes = function (updatedCache) { + var _this = this; + // y axes + var yScales = this.view.getYScales(); + each$2(yScales, function (scale, idx) { + // @ts-ignore + if (!scale || scale.isIdentity) { + return; + } + var field = scale.field; + var yAxisOption = getAxisOption(_this.option, field); + if (yAxisOption !== false) { + var layer = LAYER.BG; + var dim = 'y'; + var axisId = _this.getId('axis', field); + var gridId = _this.getId('grid', field); + var coordinate = _this.view.getCoordinate(); + if (coordinate.isRect) { + var direction = getAxisDirection(yAxisOption, idx === 0 ? DIRECTION.LEFT : DIRECTION.RIGHT); + // 1. do axis update + var axis = _this.cache.get(axisId); + // 存在则更新 + if (axis) { + var cfg = _this.getLineAxisCfg(scale, yAxisOption, direction); + omit(cfg, OMIT_CFG); + axis.component.update(cfg); + updatedCache.set(axisId, axis); + } + else { + // 不存在，则创建 + axis = _this.createLineAxis(scale, yAxisOption, layer, direction, dim); + _this.cache.set(axisId, axis); + updatedCache.set(axisId, axis); + } + // 2. do grid update + var grid = _this.cache.get(gridId); + // 存在则更新 + if (grid) { + var cfg = _this.getLineGridCfg(scale, yAxisOption, direction, dim); + omit(cfg, OMIT_CFG); + grid.component.update(cfg); + updatedCache.set(gridId, grid); + } + else { + // 不存在则创建 + grid = _this.createLineGrid(scale, yAxisOption, layer, direction, dim); + if (grid) { + _this.cache.set(gridId, grid); + updatedCache.set(gridId, grid); + } + } + } + else if (coordinate.isPolar) { + // 1. do axis update + var axis = _this.cache.get(axisId); + // 存在则更新 + if (axis) { + var cfg = coordinate.isTransposed + ? _this.getCircleAxisCfg(scale, yAxisOption, DIRECTION.CIRCLE) + : _this.getLineAxisCfg(scale, yAxisOption, DIRECTION.RADIUS); + // @ts-ignore + omit(cfg, OMIT_CFG); + axis.component.update(cfg); + updatedCache.set(axisId, axis); + } + else { + // 不存在，则创建 + if (coordinate.isTransposed) { + if (isUndefined$1(yAxisOption)) { + return; + } + else { + axis = _this.createCircleAxis(scale, yAxisOption, layer, DIRECTION.CIRCLE, dim); + } + } + else { + axis = _this.createLineAxis(scale, yAxisOption, layer, DIRECTION.RADIUS, dim); + } + _this.cache.set(axisId, axis); + updatedCache.set(axisId, axis); + } + // 2. do grid update + var grid = _this.cache.get(gridId); + // 存在则更新 + if (grid) { + var cfg = coordinate.isTransposed + ? _this.getLineGridCfg(scale, yAxisOption, DIRECTION.CIRCLE, dim) + : _this.getCircleGridCfg(scale, yAxisOption, DIRECTION.RADIUS, dim); + omit(cfg, OMIT_CFG); + grid.component.update(cfg); + updatedCache.set(gridId, grid); + } + else { + // 不存在则创建 + if (coordinate.isTransposed) { + if (isUndefined$1(yAxisOption)) { + return; + } + else { + grid = _this.createLineGrid(scale, yAxisOption, layer, DIRECTION.CIRCLE, dim); + } + } + else { + grid = _this.createCircleGrid(scale, yAxisOption, layer, DIRECTION.RADIUS, dim); + } + if (grid) { + _this.cache.set(gridId, grid); + updatedCache.set(gridId, grid); + } + } + } + else ; + } + }); + }; + /** + * 创建 line axis + * @param scale + * @param option + * @param layer + * @param direction + * @param dim + */ + Axis.prototype.createLineAxis = function (scale, option, layer, direction, dim) { + // axis + var axis = { + component: new LineAxis(this.getLineAxisCfg(scale, option, direction)), + layer: layer, + direction: direction === DIRECTION.RADIUS ? DIRECTION.NONE : direction, + type: COMPONENT_TYPE.AXIS, + extra: { dim: dim, scale: scale }, + }; + axis.component.set('field', scale.field); + axis.component.init(); + return axis; + }; + Axis.prototype.createLineGrid = function (scale, option, layer, direction, dim) { + var cfg = this.getLineGridCfg(scale, option, direction, dim); + if (cfg) { + var grid = { + component: new LineGrid(cfg), + layer: layer, + direction: DIRECTION.NONE, + type: COMPONENT_TYPE.GRID, + extra: { + dim: dim, + scale: scale, + alignTick: get$3(cfg, 'alignTick', true), + }, + }; + grid.component.init(); + return grid; + } + }; + Axis.prototype.createCircleAxis = function (scale, option, layer, direction, dim) { + var axis = { + component: new CircleAxis(this.getCircleAxisCfg(scale, option, direction)), + layer: layer, + direction: direction, + type: COMPONENT_TYPE.AXIS, + extra: { dim: dim, scale: scale }, + }; + axis.component.set('field', scale.field); + axis.component.init(); + return axis; + }; + Axis.prototype.createCircleGrid = function (scale, option, layer, direction, dim) { + var cfg = this.getCircleGridCfg(scale, option, direction, dim); + if (cfg) { + var grid = { + component: new CircleGrid(cfg), + layer: layer, + direction: DIRECTION.NONE, + type: COMPONENT_TYPE.GRID, + extra: { + dim: dim, + scale: scale, + alignTick: get$3(cfg, 'alignTick', true), + }, + }; + grid.component.init(); + return grid; + } + }; + /** + * generate line axis cfg + * @param scale + * @param axisOption + * @param direction + * @return line axis cfg + */ + Axis.prototype.getLineAxisCfg = function (scale, axisOption, direction) { + var container = get$3(axisOption, ['top']) ? this.axisForeContainer : this.axisContainer; + var coordinate = this.view.getCoordinate(); + var region = getAxisRegion(coordinate, direction); + var titleText = getAxisTitleText(scale, axisOption); + var axisThemeCfg = getAxisThemeCfg(this.view.getTheme(), direction); + // the cfg order should be ensure + var optionWithTitle = get$3(axisOption, ['title']) + ? deepMix({ title: { style: { text: titleText } } }, { title: getAxisTitleOptions(this.view.getTheme(), direction, axisOption.title) }, axisOption) + : axisOption; + var cfg = deepMix(__assign$r(__assign$r({ container: container }, region), { ticks: scale.getTicks().map(function (tick) { return ({ id: "" + tick.tickValue, name: tick.text, value: tick.value }); }), verticalFactor: coordinate.isPolar + ? getAxisFactorByRegion(region, coordinate.getCenter()) * -1 + : getAxisFactorByRegion(region, coordinate.getCenter()), theme: axisThemeCfg }), axisThemeCfg, optionWithTitle); + var _a = this.getAnimateCfg(cfg), animate = _a.animate, animateOption = _a.animateOption; + cfg.animateOption = animateOption; + cfg.animate = animate; + // 计算 verticalLimitLength + var isAxisVertical = isVertical(region); + // TODO: 1 / 3 等默认值需要有一个全局的配置的地方 + var verticalLimitLength = get$3(cfg, 'verticalLimitLength', isAxisVertical ? 1 / 3 : 1 / 2); + if (verticalLimitLength <= 1) { + // 配置的相对值，相对于画布 + var canvasWidth = this.view.getCanvas().get('width'); + var canvasHeight = this.view.getCanvas().get('height'); + cfg.verticalLimitLength = verticalLimitLength * (isAxisVertical ? canvasWidth : canvasHeight); + } + return cfg; + }; + /** + * generate line grid cfg + * @param scale + * @param axisOption + * @param direction + * @param dim + * @return line grid cfg + */ + Axis.prototype.getLineGridCfg = function (scale, axisOption, direction, dim) { + if (!showGrid(getAxisThemeCfg(this.view.getTheme(), direction), axisOption)) { + return undefined; + } + var gridThemeCfg = getGridThemeCfg(this.view.getTheme(), direction); + // the cfg order should be ensure + // grid 动画以 axis 为准 + var gridCfg = deepMix({ + container: get$3(axisOption, ['top']) ? this.gridForeContainer : this.gridContainer, + }, gridThemeCfg, get$3(axisOption, 'grid'), this.getAnimateCfg(axisOption)); + gridCfg.items = getLineGridItems(this.view.getCoordinate(), scale, dim, get$3(gridCfg, 'alignTick', true)); + return gridCfg; + }; + /** + * generate circle axis cfg + * @param scale + * @param axisOption + * @param direction + * @return circle axis cfg + */ + Axis.prototype.getCircleAxisCfg = function (scale, axisOption, direction) { + var container = get$3(axisOption, ['top']) ? this.axisForeContainer : this.axisContainer; + var coordinate = this.view.getCoordinate(); + var ticks = scale.getTicks().map(function (tick) { return ({ id: "" + tick.tickValue, name: tick.text, value: tick.value }); }); + if (!scale.isCategory && Math.abs(coordinate.endAngle - coordinate.startAngle) === Math.PI * 2) { + // x 轴对应的值如果是非 cat 类型，在整圆的情况下坐标轴第一个和最后一个文本会重叠，默认只展示第一个文本 + ticks.pop(); + } + var titleText = getAxisTitleText(scale, axisOption); + var axisThemeCfg = getAxisThemeCfg(this.view.getTheme(), DIRECTION.CIRCLE); + // the cfg order should be ensure + var optionWithTitle = get$3(axisOption, ['title']) + ? deepMix({ title: { style: { text: titleText } } }, { title: getAxisTitleOptions(this.view.getTheme(), direction, axisOption.title) }, axisOption) + : axisOption; + var cfg = deepMix(__assign$r(__assign$r({ container: container }, getCircleAxisCenterRadius(this.view.getCoordinate())), { ticks: ticks, verticalFactor: 1, theme: axisThemeCfg }), axisThemeCfg, optionWithTitle); + var _a = this.getAnimateCfg(cfg), animate = _a.animate, animateOption = _a.animateOption; + cfg.animate = animate; + cfg.animateOption = animateOption; + return cfg; + }; + /** + * generate circle grid cfg + * @param scale + * @param axisOption + * @param direction + * @return circle grid cfg + */ + Axis.prototype.getCircleGridCfg = function (scale, axisOption, direction, dim) { + if (!showGrid(getAxisThemeCfg(this.view.getTheme(), direction), axisOption)) { + return undefined; + } + // the cfg order should be ensure + // grid 动画以 axis 为准 + var gridThemeCfg = getGridThemeCfg(this.view.getTheme(), DIRECTION.RADIUS); + var gridCfg = deepMix({ + container: get$3(axisOption, ['top']) ? this.gridForeContainer : this.gridContainer, + center: this.view.getCoordinate().getCenter(), + }, gridThemeCfg, get$3(axisOption, 'grid'), this.getAnimateCfg(axisOption)); + var alignTick = get$3(gridCfg, 'alignTick', true); + var verticalScale = dim === 'x' ? this.view.getYScales()[0] : this.view.getXScale(); + gridCfg.items = getCircleGridItems(this.view.getCoordinate(), verticalScale, scale, alignTick, dim); + // the cfg order should be ensure + // grid 动画以 axis 为准 + return gridCfg; + }; + Axis.prototype.getId = function (name, key) { + var coordinate = this.view.getCoordinate(); + // 坐标系类型也作为组件的 key + return name + "-" + key + "-" + coordinate.type; + }; + Axis.prototype.getAnimateCfg = function (cfg) { + return { + animate: this.view.getOptions().animate && get$3(cfg, 'animate'), + animateOption: cfg && cfg.animateOption ? deepMix({}, AXIS_DEFAULT_ANIMATE_CFG, cfg.animateOption) : AXIS_DEFAULT_ANIMATE_CFG, + }; + }; + return Axis; +}(Controller)); + +/** + * @ignore + * 方位常量转实际的 bbox 位置大小 + * @param parentBBox + * @param bbox + * @param direction + */ +function directionToPosition(parentBBox, bbox, direction) { + if (direction === DIRECTION.TOP) { + return [parentBBox.minX + parentBBox.width / 2 - bbox.width / 2, parentBBox.minY]; + } + if (direction === DIRECTION.BOTTOM) { + return [parentBBox.minX + parentBBox.width / 2 - bbox.width / 2, parentBBox.maxY - bbox.height]; + } + if (direction === DIRECTION.LEFT) { + return [parentBBox.minX, parentBBox.minY + parentBBox.height / 2 - bbox.height / 2]; + } + if (direction === DIRECTION.RIGHT) { + return [parentBBox.maxX - bbox.width, parentBBox.minY + parentBBox.height / 2 - bbox.height / 2]; + } + if (direction === DIRECTION.TOP_LEFT || direction === DIRECTION.LEFT_TOP) { + return [parentBBox.tl.x, parentBBox.tl.y]; + } + if (direction === DIRECTION.TOP_RIGHT || direction === DIRECTION.RIGHT_TOP) { + return [parentBBox.tr.x - bbox.width, parentBBox.tr.y]; + } + if (direction === DIRECTION.BOTTOM_LEFT || direction === DIRECTION.LEFT_BOTTOM) { + return [parentBBox.bl.x, parentBBox.bl.y - bbox.height]; + } + if (direction === DIRECTION.BOTTOM_RIGHT || direction === DIRECTION.RIGHT_BOTTOM) { + return [parentBBox.br.x - bbox.width, parentBBox.br.y - bbox.height]; + } + return [0, 0]; +} + +/** + * 从配置中获取单个字段的 legend 配置 + * @param legends + * @param field + * @returns the option of one legend field + */ +function getLegendOption(legends, field) { + if (isBoolean(legends)) { + return legends === false ? false : {}; + } + return get$3(legends, [field], legends); +} +function getDirection(legendOption) { + return get$3(legendOption, 'position', DIRECTION.BOTTOM); +} +/** + * @ignore + * legend Controller + */ +var Legend = /** @class */ (function (_super) { + __extends$e(Legend, _super); + function Legend(view) { + var _this = _super.call(this, view) || this; + _this.container = _this.view.getLayer(LAYER.FORE).addGroup(); + return _this; + } + Object.defineProperty(Legend.prototype, "name", { + get: function () { + return 'legend'; + }, + enumerable: false, + configurable: true + }); + Legend.prototype.init = function () { }; + /** + * render the legend component by legend options + */ + Legend.prototype.render = function () { + // 和 update 逻辑保持一致 + this.update(); + }; + /** + * layout legend + * 计算出 legend 的 direction 位置 x, y + */ + Legend.prototype.layout = function () { + var _this = this; + this.layoutBBox = this.view.viewBBox; + each$2(this.components, function (co) { + var component = co.component, direction = co.direction; + var layout = getLegendLayout(direction); + var maxWidthRatio = component.get('maxWidthRatio'); + var maxHeightRatio = component.get('maxHeightRatio'); + var maxSize = _this.getCategoryLegendSizeCfg(layout, maxWidthRatio, maxHeightRatio); + var maxWidth = component.get('maxWidth'); + var maxHeight = component.get('maxHeight'); + // 先更新 maxSize，更新 layoutBBox，以便计算正确的 x y + component.update({ + maxWidth: Math.min(maxSize.maxWidth, maxWidth || 0), + maxHeight: Math.min(maxSize.maxHeight, maxHeight || 0), + }); + var padding = component.get('padding'); + var bboxObject = component.getLayoutBBox(); // 这里只需要他的 width、height 信息做位置调整 + var bbox = new BBox(bboxObject.x, bboxObject.y, bboxObject.width, bboxObject.height).expand(padding); + var _a = directionToPosition(_this.view.viewBBox, bbox, direction), x1 = _a[0], y1 = _a[1]; + var _b = directionToPosition(_this.layoutBBox, bbox, direction), x2 = _b[0], y2 = _b[1]; + var x = 0; + var y = 0; + // 因为 legend x y 要和 coordinateBBox 对齐，所以要做一个简单的判断 + if (direction.startsWith('top') || direction.startsWith('bottom')) { + x = x1; + y = y2; + } + else { + x = x2; + y = y1; + } + // 更新位置 + component.setLocation({ x: x + padding[3], y: y + padding[0] }); + _this.layoutBBox = _this.layoutBBox.cut(bbox, direction); + }); + }; + /** + * legend 的更新逻辑 + */ + Legend.prototype.update = function () { + var _this = this; + this.option = this.view.getOptions().legends; + // 已经处理过的 legend + var updated = {}; + var eachLegend = function (geometry, attr, scale) { + var id = _this.getId(scale.field); + var existCo = _this.getComponentById(id); + // 存在则 update + if (existCo) { + var cfg = void 0; + var legendOption = getLegendOption(_this.option, scale.field); + // if the legend option is not false, means legend should be created. + if (legendOption !== false) { + if (get$3(legendOption, 'custom')) { + cfg = _this.getCategoryCfg(geometry, attr, scale, legendOption, true); + } + else { + if (scale.isLinear) { + // linear field, create continuous legend + cfg = _this.getContinuousCfg(geometry, attr, scale, legendOption); + } + else if (scale.isCategory) { + // category field, create category legend + cfg = _this.getCategoryCfg(geometry, attr, scale, legendOption); + } + } + } + // 如果 cfg 为空，则不在 updated 标记，那么会在后面逻辑中删除 + if (cfg) { + // omit 掉一些属性，比如 container 等 + omit(cfg, ['container']); + existCo.direction = getDirection(legendOption); + existCo.component.update(cfg); + // 标记为新的 + updated[id] = true; + } + } + else { + // 不存在则 create + var legend = _this.createFieldLegend(geometry, attr, scale); + if (legend) { + legend.component.init(); + _this.components.push(legend); + // 标记为新的 + updated[id] = true; + } + } + }; + // 全局自定义图例 + if (get$3(this.option, 'custom')) { + var id = 'global-custom'; + var existCo = this.getComponentById(id); + if (existCo) { + var customCfg = this.getCategoryCfg(undefined, undefined, undefined, this.option, true); + omit(customCfg, ['container']); + existCo.component.update(customCfg); + updated[id] = true; + } + else { + var component = this.createCustomLegend(undefined, undefined, undefined, this.option); + if (component) { + component.init(); + var layer = LAYER.FORE; + var direction = getDirection(this.option); + this.components.push({ + id: id, + component: component, + layer: layer, + direction: direction, + type: COMPONENT_TYPE.LEGEND, + extra: undefined, + }); + // 标记为更新 + updated[id] = true; + } + } + } + else { + // 遍历处理每一个创建逻辑 + this.loopLegends(eachLegend); + } + // 处理完成之后，销毁删除的 + // 不在处理中的 + var components = []; + each$2(this.getComponents(), function (co) { + if (updated[co.id]) { + components.push(co); + } + else { + co.component.destroy(); + } + }); + // 更新当前已有的 components + this.components = components; + }; + Legend.prototype.clear = function () { + _super.prototype.clear.call(this); + this.container.clear(); + }; + Legend.prototype.destroy = function () { + _super.prototype.destroy.call(this); + this.container.remove(true); + }; + /** + * 递归获取所有的 Geometry + */ + Legend.prototype.getGeometries = function (view) { + var _this = this; + var geometries = view.geometries; + each$2(view.views, function (v) { + geometries = geometries.concat(_this.getGeometries(v)); + }); + return geometries; + }; + /** + * 遍历 Geometry，处理 legend 逻辑 + * @param doEach 每个 loop 中的处理方法 + */ + Legend.prototype.loopLegends = function (doEach) { + var isRootView = this.view.getRootView() === this.view; + // 非根 view，不处理 legend + if (!isRootView) { + return; + } + // 递归 view 中所有的 Geometry，进行创建 legend + var geometries = this.getGeometries(this.view); + var looped = {}; // 防止一个字段创建两个 legend + each$2(geometries, function (geometry) { + var attributes = geometry.getGroupAttributes(); + each$2(attributes, function (attr) { + var scale = attr.getScale(attr.type); + // 如果在视觉通道上映射常量值，如 size(2) shape('circle') 不创建 legend + if (!scale || scale.type === 'identity' || looped[scale.field]) { + return; + } + doEach(geometry, attr, scale); + looped[scale.field] = true; + }); + }); + }; + /** + * 创建一个 legend + * @param geometry + * @param attr + * @param scale + */ + Legend.prototype.createFieldLegend = function (geometry, attr, scale) { + var component; + var legendOption = getLegendOption(this.option, scale.field); + var layer = LAYER.FORE; + var direction = getDirection(legendOption); + // if the legend option is not false, means legend should be created. + if (legendOption !== false) { + if (get$3(legendOption, 'custom')) { + component = this.createCustomLegend(geometry, attr, scale, legendOption); + } + else { + if (scale.isLinear) { + // linear field, create continuous legend + component = this.createContinuousLegend(geometry, attr, scale, legendOption); + } + else if (scale.isCategory) { + // category field, create category legend + component = this.createCategoryLegend(geometry, attr, scale, legendOption); + } + } + } + if (component) { + component.set('field', scale.field); + return { + id: this.getId(scale.field), + component: component, + layer: layer, + direction: direction, + type: COMPONENT_TYPE.LEGEND, + extra: { scale: scale }, + }; + } + }; + /** + * 自定义图例使用 category 图例去渲染 + * @param geometry + * @param attr + * @param scale + * @param legendOption + */ + Legend.prototype.createCustomLegend = function (geometry, attr, scale, legendOption) { + // 直接使用 分类图例渲染 + var cfg = this.getCategoryCfg(geometry, attr, scale, legendOption, true); + return new CategoryLegend(cfg); + }; + /** + * 创建连续图例 + * @param geometry + * @param attr + * @param scale + * @param legendOption + */ + Legend.prototype.createContinuousLegend = function (geometry, attr, scale, legendOption) { + var cfg = this.getContinuousCfg(geometry, attr, scale, omit(legendOption, ['value'])); + return new ContinuousLegend(cfg); + }; + /** + * 创建分类图例 + * @param geometry + * @param attr + * @param scale + * @param legendOption + */ + Legend.prototype.createCategoryLegend = function (geometry, attr, scale, legendOption) { + var cfg = this.getCategoryCfg(geometry, attr, scale, legendOption); + return new CategoryLegend(cfg); + }; + /** + * 获得连续图例的配置 + * @param geometry + * @param attr + * @param scale + * @param legendOption + */ + Legend.prototype.getContinuousCfg = function (geometry, attr, scale, legendOption) { + var ticks = scale.getTicks(); + var containMin = find$3(ticks, function (tick) { return tick.value === 0; }); + var containMax = find$3(ticks, function (tick) { return tick.value === 1; }); + var items = ticks.map(function (tick) { + var value = tick.value, tickValue = tick.tickValue; + var attrValue = attr.mapping(scale.invert(value)).join(''); + return { + value: tickValue, + attrValue: attrValue, + color: attrValue, + scaleValue: value, + }; + }); + if (!containMin) { + items.push({ + value: scale.min, + attrValue: attr.mapping(scale.invert(0)).join(''), + color: attr.mapping(scale.invert(0)).join(''), + scaleValue: 0, + }); + } + if (!containMax) { + items.push({ + value: scale.max, + attrValue: attr.mapping(scale.invert(1)).join(''), + color: attr.mapping(scale.invert(1)).join(''), + scaleValue: 1, + }); + } + // 排序 + items.sort(function (a, b) { return a.value - b.value; }); + // 跟 attr 相关的配置 + // size color 区别的配置 + var attrLegendCfg = { + min: head(items).value, + max: last$1(items).value, + colors: [], + rail: { + type: attr.type, + }, + track: {}, + }; + if (attr.type === 'size') { + attrLegendCfg.track = { + style: { + // size 的选中前景色，对于 color，则直接使用 color 标识 + // @ts-ignore + fill: attr.type === 'size' ? this.view.getTheme().defaultColor : undefined, + }, + }; + } + if (attr.type === 'color') { + attrLegendCfg.colors = items.map(function (item) { return item.attrValue; }); + } + var container = this.container; + // if position is not set, use top as default + var direction = getDirection(legendOption); + var layout = getLegendLayout(direction); + var title = get$3(legendOption, 'title'); + if (title) { + title = deepMix({ + text: getName(scale), + }, title); + } + // 基础配置，从当前数据中读到的配置 + attrLegendCfg.container = container; + attrLegendCfg.layout = layout; + attrLegendCfg.title = title; + attrLegendCfg.animateOption = DEFAULT_ANIMATE_CFG; + // @ts-ignore + return this.mergeLegendCfg(attrLegendCfg, legendOption, 'continuous'); + }; + /** + * 获取分类图例的配置项 + * @param geometry + * @param attr + * @param scale + * @param custom + * @param legendOption + */ + Legend.prototype.getCategoryCfg = function (geometry, attr, scale, legendOption, custom) { + var container = this.container; + // if position is not set, use top as default + var direction = get$3(legendOption, 'position', DIRECTION.BOTTOM); + var legendTheme = getLegendThemeCfg(this.view.getTheme(), direction); + // the default marker style + var themeMarker = get$3(legendTheme, ['marker']); + var userMarker = get$3(legendOption, 'marker'); + var layout = getLegendLayout(direction); + var themePageNavigator = get$3(legendTheme, ['pageNavigator']); + var userPageNavigator = get$3(legendOption, 'pageNavigator'); + var items = custom + ? getCustomLegendItems(themeMarker, userMarker, legendOption.items) + : getLegendItems(this.view, geometry, attr, themeMarker, userMarker); + var title = get$3(legendOption, 'title'); + if (title) { + title = deepMix({ + text: scale ? getName(scale) : '', + }, title); + } + var maxWidthRatio = get$3(legendOption, 'maxWidthRatio'); + var maxHeightRatio = get$3(legendOption, 'maxHeightRatio'); + var baseCfg = this.getCategoryLegendSizeCfg(layout, maxWidthRatio, maxHeightRatio); + baseCfg.container = container; + baseCfg.layout = layout; + baseCfg.items = items; + baseCfg.title = title; + baseCfg.animateOption = DEFAULT_ANIMATE_CFG; + baseCfg.pageNavigator = deepMix({}, themePageNavigator, userPageNavigator); + var categoryCfg = this.mergeLegendCfg(baseCfg, legendOption, direction); + if (categoryCfg.reversed) { + // 图例项需要逆序 + categoryCfg.items.reverse(); + } + var maxItemWidth = get$3(categoryCfg, 'maxItemWidth'); + if (maxItemWidth && maxItemWidth <= 1) { + // 转换成像素值 + categoryCfg.maxItemWidth = this.view.viewBBox.width * maxItemWidth; + } + return categoryCfg; + }; + /** + * get legend config, use option > suggestion > theme + * @param baseCfg + * @param legendOption + * @param direction + */ + Legend.prototype.mergeLegendCfg = function (baseCfg, legendOption, direction) { + var position = direction.split('-')[0]; + var themeObject = getLegendThemeCfg(this.view.getTheme(), position); + return deepMix({}, themeObject, baseCfg, legendOption); + }; + /** + * 生成 id + * @param key + */ + Legend.prototype.getId = function (key) { + return this.name + "-" + key; + }; + /** + * 根据 id 来获取组件 + * @param id + */ + Legend.prototype.getComponentById = function (id) { + return find$3(this.components, function (co) { return co.id === id; }); + }; + Legend.prototype.getCategoryLegendSizeCfg = function (layout, maxWidthRatio, maxHeightRatio) { + if (maxWidthRatio === void 0) { maxWidthRatio = COMPONENT_MAX_VIEW_PERCENTAGE; } + if (maxHeightRatio === void 0) { maxHeightRatio = COMPONENT_MAX_VIEW_PERCENTAGE; } + var _a = this.view.viewBBox, vw = _a.width, vh = _a.height; + // 目前 legend 的布局是以 viewBBox 为参照 + // const { width: cw, height: ch } = this.view.coordinateBBox; + return layout === 'vertical' + ? { + maxWidth: vw * maxWidthRatio, + maxHeight: vh, + } + : { + maxWidth: vw, + maxHeight: vh * maxHeightRatio, + }; + }; + return Legend; +}(Controller)); + +/** + * @ignore + * slider Controller + */ +var Slider = /** @class */ (function (_super) { + __extends$e(Slider, _super); + function Slider(view) { + var _this = _super.call(this, view) || this; + _this.onChangeFn = noop$3; + /** + * 清除测量 + */ + _this.resetMeasure = function () { + _this.clear(); + }; + /** + * 滑块滑动的时候出发 + * @param v + */ + _this.onValueChange = function (v) { + var min = v[0], max = v[1]; + _this.start = min; + _this.end = max; + _this.changeViewData(min, max); + }; + _this.container = _this.view.getLayer(LAYER.FORE).addGroup(); + _this.onChangeFn = throttle(_this.onValueChange, 20, { + leading: true, + }); + _this.width = 0; + _this.view.on(VIEW_LIFE_CIRCLE.BEFORE_CHANGE_DATA, _this.resetMeasure); + _this.view.on(VIEW_LIFE_CIRCLE.BEFORE_CHANGE_SIZE, _this.resetMeasure); + return _this; + } + Object.defineProperty(Slider.prototype, "name", { + get: function () { + return 'slider'; + }, + enumerable: false, + configurable: true + }); + Slider.prototype.destroy = function () { + _super.prototype.destroy.call(this); + this.view.off(VIEW_LIFE_CIRCLE.BEFORE_CHANGE_DATA, this.resetMeasure); + this.view.off(VIEW_LIFE_CIRCLE.BEFORE_CHANGE_SIZE, this.resetMeasure); + }; + /** + * 初始化 + */ + Slider.prototype.init = function () { }; + /** + * 渲染 + */ + Slider.prototype.render = function () { + this.option = this.view.getOptions().slider; + var _a = this.getSliderCfg(), start = _a.start, end = _a.end; + if (isNil(this.start)) { + this.start = start; + this.end = end; + } + var viewData = this.view.getOptions().data; + if (this.option && !isEmpty$1(viewData)) { + if (this.slider) { + // exist, update + this.slider = this.updateSlider(); + } + else { + // not exist, create + this.slider = this.createSlider(); + // 监听事件，绑定交互 + this.slider.component.on('sliderchange', this.onChangeFn); + } + } + else { + if (this.slider) { + // exist, destroy + this.slider.component.destroy(); + this.slider = undefined; + } + } + }; + /** + * 布局 + */ + Slider.prototype.layout = function () { + var _this = this; + if (this.option && !this.width) { + this.measureSlider(); + setTimeout(function () { + // 初始状态下的 view 数据过滤 + if (!_this.view.destroyed) { + _this.changeViewData(_this.start, _this.end); + } + }, 0); + } + if (this.slider) { + var width = this.view.coordinateBBox.width; + // 获取组件的 layout bbox + var padding = this.slider.component.get('padding'); + var paddingTop = padding[0]; padding[1]; padding[2]; var paddingLeft = padding[3]; + var bboxObject = this.slider.component.getLayoutBBox(); + var bbox = new BBox(bboxObject.x, bboxObject.y, Math.min(bboxObject.width, width), bboxObject.height).expand(padding); + var _a = this.getMinMaxText(this.start, this.end), minText = _a.minText, maxText = _a.maxText; + var _b = directionToPosition(this.view.viewBBox, bbox, DIRECTION.BOTTOM); _b[0]; var y1 = _b[1]; + var _c = directionToPosition(this.view.coordinateBBox, bbox, DIRECTION.BOTTOM), x2 = _c[0]; _c[1]; + // 默认放在 bottom + this.slider.component.update(__assign$r(__assign$r({}, this.getSliderCfg()), { x: x2 + paddingLeft, y: y1 + paddingTop, width: this.width, start: this.start, end: this.end, minText: minText, + maxText: maxText })); + this.view.viewBBox = this.view.viewBBox.cut(bbox, DIRECTION.BOTTOM); + } + }; + /** + * 更新 + */ + Slider.prototype.update = function () { + // 逻辑和 render 保持一致 + this.render(); + }; + /** + * 创建 slider 组件 + */ + Slider.prototype.createSlider = function () { + var cfg = this.getSliderCfg(); + // 添加 slider 组件 + var component = new Slider$1(__assign$r({ container: this.container }, cfg)); + component.init(); + return { + component: component, + layer: LAYER.FORE, + direction: DIRECTION.BOTTOM, + type: COMPONENT_TYPE.SLIDER, + }; + }; + /** + * 更新配置 + */ + Slider.prototype.updateSlider = function () { + var cfg = this.getSliderCfg(); + if (this.width) { + var _a = this.getMinMaxText(this.start, this.end), minText = _a.minText, maxText = _a.maxText; + cfg = __assign$r(__assign$r({}, cfg), { width: this.width, start: this.start, end: this.end, minText: minText, maxText: maxText }); + } + this.slider.component.update(cfg); + return this.slider; + }; + /** + * 进行测量操作 + */ + Slider.prototype.measureSlider = function () { + var width = this.getSliderCfg().width; + this.width = width; + }; + /** + * 生成 slider 配置 + */ + Slider.prototype.getSliderCfg = function () { + var cfg = { + height: 16, + start: 0, + end: 1, + minText: '', + maxText: '', + x: 0, + y: 0, + width: this.view.coordinateBBox.width, + }; + if (isObject$f(this.option)) { + // 用户配置的数据，优先级更高 + var trendCfg = __assign$r({ data: this.getData() }, get$3(this.option, 'trendCfg', {})); + // 因为有样式，所以深层覆盖 + cfg = deepMix({}, cfg, this.getThemeOptions(), this.option); + // trendCfg 因为有数据数组，所以使用浅替换 + cfg = __assign$r(__assign$r({}, cfg), { trendCfg: trendCfg }); + } + cfg.start = clamp$1(Math.min(isNil(cfg.start) ? 0 : cfg.start, isNil(cfg.end) ? 1 : cfg.end), 0, 1); + cfg.end = clamp$1(Math.max(isNil(cfg.start) ? 0 : cfg.start, isNil(cfg.end) ? 1 : cfg.end), 0, 1); + return cfg; + }; + /** + * 从 view 中获取数据，缩略轴使用全量的数据 + */ + Slider.prototype.getData = function () { + var data = this.view.getOptions().data; + var yScale = this.view.getYScales()[0]; + var groupScales = this.view.getGroupScales(); + if (groupScales.length) { + var _a = groupScales[0], field_1 = _a.field, ticks_1 = _a.ticks; + return data.reduce(function (pre, cur) { + if (cur[field_1] === ticks_1[0]) { + pre.push(cur[yScale.field]); + } + return pre; + }, []); + } + return data.map(function (datum) { return datum[yScale.field] || 0; }); + }; + /** + * 获取 slider 的主题配置 + */ + Slider.prototype.getThemeOptions = function () { + var theme = this.view.getTheme(); + return get$3(theme, ['components', 'slider', 'common'], {}); + }; + /** + * 根据 start/end 和当前数据计算出当前的 minText/maxText + * @param min + * @param max + */ + Slider.prototype.getMinMaxText = function (min, max) { + var data = this.view.getOptions().data; + var xScale = this.view.getXScale(); + var values = valuesOfKey(data, xScale.field); + var xValues = values ; + var dataSize = size$1(data); + if (!xScale || !dataSize) { + return {}; // fix: 需要兼容，否则调用方直接取值会报错 + } + var xTickCount = size$1(xValues); + var minIndex = Math.floor(min * (xTickCount - 1)); + var maxIndex = Math.floor(max * (xTickCount - 1)); + var minText = get$3(xValues, [minIndex]); + var maxText = get$3(xValues, [maxIndex]); + var formatter = this.getSliderCfg().formatter; + if (formatter) { + minText = formatter(minText, data[minIndex], minIndex); + maxText = formatter(maxText, data[maxIndex], maxIndex); + } + return { + minText: minText, + maxText: maxText, + }; + }; + /** + * 更新 view 过滤数据 + * @param min + * @param max + */ + Slider.prototype.changeViewData = function (min, max) { + var data = this.view.getOptions().data; + var xScale = this.view.getXScale(); + var dataSize = size$1(data); + if (!xScale || !dataSize) { + return; + } + var values = valuesOfKey(data, xScale.field); + var xValues = values ; + var xTickCount = size$1(xValues); + var minIndex = Math.floor(min * (xTickCount - 1)); + var maxIndex = Math.floor(max * (xTickCount - 1)); + // 增加 x 轴的过滤器 + this.view.filter(xScale.field, function (value, datum) { + var idx = xValues.indexOf(value); + return idx > -1 ? isBetween$2(idx, minIndex, maxIndex) : true; + }); + this.view.render(true); + }; + /** + * 覆写父类方法 + */ + Slider.prototype.getComponents = function () { + return this.slider ? [this.slider] : []; + }; + /** + * 覆盖父类 + */ + Slider.prototype.clear = function () { + if (this.slider) { + this.slider.component.destroy(); + this.slider = undefined; + } + this.width = 0; + this.start = undefined; + this.end = undefined; + }; + return Slider; +}(Controller)); + +var DEFAULT_PADDING = 0; +var DEFAULT_SIZE = 8; +var DEFAULT_CATEGORY_SIZE = 32; +var MIN_THUMB_LENGTH = 20; +var Scrollbar = /** @class */ (function (_super) { + __extends$e(Scrollbar, _super); + function Scrollbar(view) { + var _this = _super.call(this, view) || this; + _this.onChangeFn = noop$3; + _this.resetMeasure = function () { + _this.clear(); + }; + _this.onValueChange = function (_a) { + var ratio = _a.ratio; + var animate = _this.getValidScrollbarCfg().animate; + _this.ratio = clamp$1(ratio, 0, 1); + var originalAnimate = _this.view.getOptions().animate; + if (!animate) { + _this.view.animate(false); + } + _this.changeViewData(_this.getScrollRange(), true); + _this.view.animate(originalAnimate); + }; + _this.container = _this.view.getLayer(LAYER.FORE).addGroup(); + _this.onChangeFn = throttle(_this.onValueChange, 20, { + leading: true, + }); + _this.trackLen = 0; + _this.thumbLen = 0; + _this.ratio = 0; + _this.view.on(VIEW_LIFE_CIRCLE.BEFORE_CHANGE_DATA, _this.resetMeasure); + _this.view.on(VIEW_LIFE_CIRCLE.BEFORE_CHANGE_SIZE, _this.resetMeasure); + return _this; + } + Object.defineProperty(Scrollbar.prototype, "name", { + get: function () { + return 'scrollbar'; + }, + enumerable: false, + configurable: true + }); + Scrollbar.prototype.destroy = function () { + _super.prototype.destroy.call(this); + this.view.off(VIEW_LIFE_CIRCLE.BEFORE_CHANGE_DATA, this.resetMeasure); + this.view.off(VIEW_LIFE_CIRCLE.BEFORE_CHANGE_SIZE, this.resetMeasure); + }; + Scrollbar.prototype.init = function () { }; + /** + * 渲染 + */ + Scrollbar.prototype.render = function () { + this.option = this.view.getOptions().scrollbar; + if (this.option) { + if (this.scrollbar) { + // exist, update + this.scrollbar = this.updateScrollbar(); + } + else { + // not exist, create + this.scrollbar = this.createScrollbar(); + this.scrollbar.component.on('scrollchange', this.onChangeFn); + } + } + else { + if (this.scrollbar) { + // exist, destroy + this.scrollbar.component.destroy(); + this.scrollbar = undefined; + } + } + }; + /** + * 布局 + */ + Scrollbar.prototype.layout = function () { + var _this = this; + if (this.option && !this.trackLen) { + this.measureScrollbar(); + setTimeout(function () { + if (!_this.view.destroyed) { + _this.changeViewData(_this.getScrollRange(), true); + } + }); + } + if (this.scrollbar) { + var width = this.view.coordinateBBox.width; + var padding = this.scrollbar.component.get('padding'); + var bboxObject = this.scrollbar.component.getLayoutBBox(); + var bbox = new BBox(bboxObject.x, bboxObject.y, Math.min(bboxObject.width, width), bboxObject.height).expand(padding); + var cfg = this.getScrollbarComponentCfg(); + var x = void 0; + var y = void 0; + if (cfg.isHorizontal) { + var _a = directionToPosition(this.view.viewBBox, bbox, DIRECTION.BOTTOM); _a[0]; var y1 = _a[1]; + var _b = directionToPosition(this.view.coordinateBBox, bbox, DIRECTION.BOTTOM), x2 = _b[0]; _b[1]; + x = x2; + y = y1; + } + else { + var _c = directionToPosition(this.view.viewBBox, bbox, DIRECTION.RIGHT); _c[0]; var y1 = _c[1]; + var _d = directionToPosition(this.view.viewBBox, bbox, DIRECTION.RIGHT), x2 = _d[0]; _d[1]; + x = x2; + y = y1; + } + x += padding[3]; + y += padding[0]; + // 默认放在 bottom + if (this.trackLen) { + this.scrollbar.component.update(__assign$r(__assign$r({}, cfg), { x: x, + y: y, trackLen: this.trackLen, thumbLen: this.thumbLen, thumbOffset: (this.trackLen - this.thumbLen) * this.ratio })); + } + else { + this.scrollbar.component.update(__assign$r(__assign$r({}, cfg), { x: x, + y: y })); + } + this.view.viewBBox = this.view.viewBBox.cut(bbox, cfg.isHorizontal ? DIRECTION.BOTTOM : DIRECTION.RIGHT); + } + }; + /** + * 更新 + */ + Scrollbar.prototype.update = function () { + // 逻辑和 render 保持一致 + this.render(); + }; + Scrollbar.prototype.getComponents = function () { + return this.scrollbar ? [this.scrollbar] : []; + }; + Scrollbar.prototype.clear = function () { + if (this.scrollbar) { + this.scrollbar.component.destroy(); + this.scrollbar = undefined; + } + this.trackLen = 0; + this.thumbLen = 0; + this.ratio = 0; + this.cnt = 0; + this.step = 0; + this.data = undefined; + this.xScaleCfg = undefined; + this.yScalesCfg = []; + }; + /** + * 获取 scrollbar 的主题配置 + */ + Scrollbar.prototype.getThemeOptions = function () { + var theme = this.view.getTheme(); + return get$3(theme, ['components', 'scrollbar', 'common'], {}); + }; + /** + * 获取 scrollbar 组件的主题样式 + */ + Scrollbar.prototype.getScrollbarTheme = function (style) { + var theme = get$3(this.view.getTheme(), ['components', 'scrollbar']); + var _a = style || {}, thumbHighlightColor = _a.thumbHighlightColor, restStyles = __rest$G(_a, ["thumbHighlightColor"]); + return { + default: deepMix({}, get$3(theme, ['default', 'style'], {}), restStyles), + hover: deepMix({}, get$3(theme, ['hover', 'style'], {}), { thumbColor: thumbHighlightColor }), + }; + }; + Scrollbar.prototype.measureScrollbar = function () { + var xScale = this.view.getXScale(); + var yScales = this.view.getYScales().slice(); + this.data = this.view.getOptions().data; + this.step = this.getStep(); + this.cnt = this.getCnt(); + var _a = this.getScrollbarComponentCfg(), trackLen = _a.trackLen, thumbLen = _a.thumbLen; + this.trackLen = trackLen; + this.thumbLen = thumbLen; + this.xScaleCfg = { + field: xScale.field, + values: xScale.values || [], + }; + this.yScalesCfg = yScales; + }; + Scrollbar.prototype.getScrollRange = function () { + var startIdx = Math.floor((this.cnt - this.step) * clamp$1(this.ratio, 0, 1)); + var endIdx = Math.min(startIdx + this.step - 1, this.cnt - 1); + return [startIdx, endIdx]; + }; + Scrollbar.prototype.changeViewData = function (_a, render) { + var _this = this; + var startIdx = _a[0], endIdx = _a[1]; + var type = this.getValidScrollbarCfg().type; + var isHorizontal = type !== 'vertical'; + var values = valuesOfKey(this.data, this.xScaleCfg.field); + var xValues = isHorizontal ? values : values.reverse(); + this.yScalesCfg.forEach(function (cfg) { + _this.view.scale(cfg.field, { + formatter: cfg.formatter, + type: cfg.type, + min: cfg.min, + max: cfg.max, + }); + }); + this.view.filter(this.xScaleCfg.field, function (val) { + var idx = xValues.indexOf(val); + return idx > -1 ? isBetween$2(idx, startIdx, endIdx) : true; + }); + this.view.render(true); + }; + Scrollbar.prototype.createScrollbar = function () { + var type = this.getValidScrollbarCfg().type; + var isHorizontal = type !== 'vertical'; + var component = new Scrollbar$1(__assign$r(__assign$r({ container: this.container }, this.getScrollbarComponentCfg()), { x: 0, y: 0 })); + component.init(); + return { + component: component, + layer: LAYER.FORE, + direction: isHorizontal ? DIRECTION.BOTTOM : DIRECTION.RIGHT, + type: COMPONENT_TYPE.SCROLLBAR, + }; + }; + Scrollbar.prototype.updateScrollbar = function () { + var config = this.getScrollbarComponentCfg(); + var realConfig = this.trackLen + ? __assign$r(__assign$r({}, config), { trackLen: this.trackLen, thumbLen: this.thumbLen, thumbOffset: (this.trackLen - this.thumbLen) * this.ratio }) : __assign$r({}, config); + this.scrollbar.component.update(realConfig); + return this.scrollbar; + }; + Scrollbar.prototype.getStep = function () { + if (this.step) { + return this.step; + } + var coordinateBBox = this.view.coordinateBBox; + var _a = this.getValidScrollbarCfg(), type = _a.type, categorySize = _a.categorySize; + var isHorizontal = type !== 'vertical'; + return Math.floor((isHorizontal ? coordinateBBox.width : coordinateBBox.height) / categorySize); + }; + Scrollbar.prototype.getCnt = function () { + if (this.cnt) { + return this.cnt; + } + var xScale = this.view.getXScale(); + var data = this.view.getOptions().data; + var values = valuesOfKey(data, xScale.field); + return size$1(values); + }; + Scrollbar.prototype.getScrollbarComponentCfg = function () { + var _a = this.view, coordinateBBox = _a.coordinateBBox, viewBBox = _a.viewBBox; + var _b = this.getValidScrollbarCfg(), type = _b.type, padding = _b.padding, width = _b.width, height = _b.height, style = _b.style; + var isHorizontal = type !== 'vertical'; + var paddingTop = padding[0], paddingRight = padding[1], paddingBottom = padding[2], paddingLeft = padding[3]; + var position = isHorizontal + ? { + x: coordinateBBox.minX + paddingLeft, + y: viewBBox.maxY - height - paddingBottom, + } + : { + x: viewBBox.maxX - width - paddingRight, + y: coordinateBBox.minY + paddingTop, + }; + var step = this.getStep(); + var cnt = this.getCnt(); + var trackLen = isHorizontal + ? coordinateBBox.width - paddingLeft - paddingRight + : coordinateBBox.height - paddingTop - paddingBottom; + var thumbLen = Math.max(trackLen * clamp$1(step / cnt, 0, 1), MIN_THUMB_LENGTH); + return __assign$r(__assign$r({}, this.getThemeOptions()), { x: position.x, y: position.y, size: isHorizontal ? height : width, isHorizontal: isHorizontal, + trackLen: trackLen, + thumbLen: thumbLen, thumbOffset: 0, theme: this.getScrollbarTheme(style) }); + }; + /** + * 填充一些默认的配置项目 + */ + Scrollbar.prototype.getValidScrollbarCfg = function () { + var cfg = { + type: 'horizontal', + categorySize: DEFAULT_CATEGORY_SIZE, + width: DEFAULT_SIZE, + height: DEFAULT_SIZE, + padding: [0, 0, 0, 0], + animate: true, + style: {}, + }; + if (isObject$f(this.option)) { + cfg = __assign$r(__assign$r({}, cfg), this.option); + } + if (!isObject$f(this.option) || !this.option.padding) { + cfg.padding = + cfg.type === 'horizontal' ? [DEFAULT_PADDING, 0, DEFAULT_PADDING, 0] : [0, DEFAULT_PADDING, 0, DEFAULT_PADDING]; + } + return cfg; + }; + return Scrollbar; +}(Controller)); + +var DEFAULT_REGION_PATH_STYLE = { + fill: '#CCD6EC', + opacity: 0.3, +}; +function getItemsOfView(view, point, tooltipCfg) { + var items = findItemsFromViewRecurisive(view, point, tooltipCfg); + if (items.length) { + // 三层 + items = flatten$2(items); + for (var _i = 0, items_1 = items; _i < items_1.length; _i++) { + var itemArr = items_1[_i]; + for (var _a = 0, itemArr_1 = itemArr; _a < itemArr_1.length; _a++) { + var item = itemArr_1[_a]; + var _b = item.mappingData, x = _b.x, y = _b.y; + item.x = isArray$n(x) ? x[x.length - 1] : x; + item.y = isArray$n(y) ? y[y.length - 1] : y; + } + } + var shared = tooltipCfg.shared; + // shared: false 代表只显示当前拾取到的 shape 的数据，但是一个 view 会有多个 Geometry，所以有可能会拾取到多个 shape + if (shared === false && items.length > 1) { + var snapItem = items[0]; + var min = Math.abs(point.y - snapItem[0].y); + for (var _c = 0, items_2 = items; _c < items_2.length; _c++) { + var aItem = items_2[_c]; + var yDistance = Math.abs(point.y - aItem[0].y); + if (yDistance <= min) { + snapItem = aItem; + min = yDistance; + } + } + items = [snapItem]; + } + return uniq$3(flatten$2(items)); + } + return []; +} +/** + * 背景框的 Action. 只作用于 interval 和 schema geometry + * @ignore + */ +var ActiveRegion = /** @class */ (function (_super) { + __extends$e(ActiveRegion, _super); + function ActiveRegion() { + return _super !== null && _super.apply(this, arguments) || this; + } + /** + * 显示 + * @param {ShapeAttrs} style region-path 的样式 + * @param {number} appendRatio 适用于笛卡尔坐标系. 对于 x 轴非 linear 类型: 默认：0.25, x 轴 linear 类型: 默认 0 + * @param {number} appendWidth 适用于笛卡尔坐标系. 像素级别，优先级 > appendRatio + */ + ActiveRegion.prototype.show = function (args) { + var view = this.context.view; + var ev = this.context.event; + var tooltipCfg = view.getController('tooltip').getTooltipCfg(); + var tooltipItems = getItemsOfView(view, { + x: ev.x, + y: ev.y, + }, tooltipCfg); + if (isEqual$2(tooltipItems, this.items)) { + // 如果拾取数据同上次相同，则不重复绘制 + return; + } + this.items = tooltipItems; + if (tooltipItems.length) { + var xField_1 = view.getXScale().field; + var xValue_1 = tooltipItems[0].data[xField_1]; + // 根据 x 对应的值查找 elements + var elements_1 = []; + var geometries = view.geometries; + each$2(geometries, function (geometry) { + if (geometry.type === 'interval' || geometry.type === 'schema') { + var result = geometry.getElementsBy(function (ele) { + var eleData = ele.getData(); + return eleData[xField_1] === xValue_1; + }); + elements_1 = elements_1.concat(result); + } + }); + // 根据 bbox 计算背景框的面积区域 + if (elements_1.length) { + var coordinate_1 = view.getCoordinate(); + var firstBBox_1 = elements_1[0].shape.getCanvasBBox(); + var lastBBox_1 = elements_1[0].shape.getCanvasBBox(); + var groupBBox_1 = firstBBox_1; + each$2(elements_1, function (ele) { + var bbox = ele.shape.getCanvasBBox(); + if (coordinate_1.isTransposed) { + if (bbox.minY < firstBBox_1.minY) { + firstBBox_1 = bbox; + } + if (bbox.maxY > lastBBox_1.maxY) { + lastBBox_1 = bbox; + } + } + else { + if (bbox.minX < firstBBox_1.minX) { + firstBBox_1 = bbox; + } + if (bbox.maxX > lastBBox_1.maxX) { + lastBBox_1 = bbox; + } + } + groupBBox_1.x = Math.min(bbox.minX, groupBBox_1.minX); + groupBBox_1.y = Math.min(bbox.minY, groupBBox_1.minY); + groupBBox_1.width = Math.max(bbox.maxX, groupBBox_1.maxX) - groupBBox_1.x; + groupBBox_1.height = Math.max(bbox.maxY, groupBBox_1.maxY) - groupBBox_1.y; + }); + var backgroundGroup = view.backgroundGroup, coordinateBBox = view.coordinateBBox; + var path = void 0; + if (coordinate_1.isRect) { + var xScale = view.getXScale(); + var _a = args || {}, appendRatio = _a.appendRatio, appendWidth = _a.appendWidth; + if (isNil(appendWidth)) { + appendRatio = isNil(appendRatio) ? (xScale.isLinear ? 0 : 0.25) : appendRatio; // 如果 x 轴是数值类型，如直方图，默认不需要加额外的宽度 + appendWidth = coordinate_1.isTransposed ? appendRatio * lastBBox_1.height : appendRatio * firstBBox_1.width; + } + var minX = void 0; + var minY = void 0; + var width = void 0; + var height = void 0; + if (coordinate_1.isTransposed) { + minX = coordinateBBox.minX; + minY = Math.min(lastBBox_1.minY, firstBBox_1.minY) - appendWidth; + width = coordinateBBox.width; + height = groupBBox_1.height + appendWidth * 2; + } + else { + minX = Math.min(firstBBox_1.minX, lastBBox_1.minX) - appendWidth; + // 直角坐标系 非转置：最小值直接取 坐标系 minY + minY = coordinateBBox.minY; + width = groupBBox_1.width + appendWidth * 2; + height = coordinateBBox.height; + } + path = [ + ['M', minX, minY], + ['L', minX + width, minY], + ['L', minX + width, minY + height], + ['L', minX, minY + height], + ['Z'], + ]; + } + else { + var firstElement = head(elements_1); + var lastElement = last$1(elements_1); + var startAngle = getAngle$2(firstElement.getModel(), coordinate_1).startAngle; + var endAngle = getAngle$2(lastElement.getModel(), coordinate_1).endAngle; + var center = coordinate_1.getCenter(); + var radius = coordinate_1.getRadius(); + var innterRadius = coordinate_1.innerRadius * radius; + path = getSectorPath(center.x, center.y, radius, startAngle, endAngle, innterRadius); + } + if (this.regionPath) { + this.regionPath.attr('path', path); + this.regionPath.show(); + } + else { + var style = get$3(args, 'style', DEFAULT_REGION_PATH_STYLE); + this.regionPath = backgroundGroup.addShape({ + type: 'path', + name: 'active-region', + capture: false, + attrs: __assign$r(__assign$r({}, style), { path: path }), + }); + } + } + } + }; + /** + * 隐藏 + */ + ActiveRegion.prototype.hide = function () { + if (this.regionPath) { + this.regionPath.hide(); + } + // this.regionPath = null; + this.items = null; + }; + /** + * 销毁 + */ + ActiveRegion.prototype.destroy = function () { + this.hide(); + if (this.regionPath) { + this.regionPath.remove(true); + } + _super.prototype.destroy.call(this); + }; + return ActiveRegion; +}(Action$1)); + +/** + * Tooltip 展示隐藏的 Action + * @ignore + */ +var TooltipAction = /** @class */ (function (_super) { + __extends$e(TooltipAction, _super); + function TooltipAction() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.timeStamp = 0; + return _this; + } + /** + * 显示 Tooltip + * @returns + */ + TooltipAction.prototype.show = function () { + var context = this.context; + var ev = context.event; + var view = context.view; + var isTooltipLocked = view.isTooltipLocked(); + if (isTooltipLocked) { + // 锁定时不移动 tooltip + return; + } + var lastTimeStamp = this.timeStamp; + var timeStamp = +new Date(); + // 在 showDelay 毫秒（默认 16ms）内到 tooltip 上可以实现 enterable（调参工程师） + var showDelay = get$3(context.view.getOptions(), 'tooltip.showDelay', 16); + if (timeStamp - lastTimeStamp > showDelay) { + var preLoc = this.location; + var curLoc = { x: ev.x, y: ev.y }; + if (!preLoc || !isEqual$2(preLoc, curLoc)) { + this.showTooltip(view, curLoc); + } + this.timeStamp = timeStamp; + this.location = curLoc; + } + }; + /** + * 隐藏 Tooltip。 + * @returns + */ + TooltipAction.prototype.hide = function () { + var view = this.context.view; + var tooltip = view.getController('tooltip'); + var _a = this.context.event, clientX = _a.clientX, clientY = _a.clientY; + // 如果已经 enterable + 已经在 tooltip 上，那么不隐藏 + if (tooltip.isCursorEntered({ x: clientX, y: clientY })) { + return; + } + // 锁定 tooltip 时不隐藏 + if (view.isTooltipLocked()) { + return; + } + this.hideTooltip(view); + this.location = null; + }; + TooltipAction.prototype.showTooltip = function (view, point) { + // 相同位置不重复展示 + view.showTooltip(point); + }; + TooltipAction.prototype.hideTooltip = function (view) { + view.hideTooltip(); + }; + return TooltipAction; +}(Action$1)); + +/** + * 存在多个 view 时，控制其他 view 上的 tooltip 显示 + * @ignore + */ +var SiblingTooltip = /** @class */ (function (_super) { + __extends$e(SiblingTooltip, _super); + function SiblingTooltip() { + return _super !== null && _super.apply(this, arguments) || this; + } + /** + * 所有同一层级的 tooltip 显示 + * @param view + * @param point + */ + SiblingTooltip.prototype.showTooltip = function (view, point) { + var siblings = getSilbings(view); + each$2(siblings, function (sibling) { + var siblingPoint = getSiblingPoint(view, sibling, point); + sibling.showTooltip(siblingPoint); + }); + }; + /** + * 隐藏同一层级的 tooltip + * @param view + */ + SiblingTooltip.prototype.hideTooltip = function (view) { + var siblings = getSilbings(view); + each$2(siblings, function (sibling) { + sibling.hideTooltip(); + }); + }; + return SiblingTooltip; +}(TooltipAction)); + +/** + * 用于组件文本省略后需要展示完整信息的 Tooltip Action + * @ignore + */ +var EllipsisText = /** @class */ (function (_super) { + __extends$e(EllipsisText, _super); + function EllipsisText() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.timeStamp = 0; + return _this; + } + EllipsisText.prototype.destroy = function () { + _super.prototype.destroy.call(this); + this.tooltip && this.tooltip.destroy(); + }; + /** + * 显示 Tooltip + * @returns + */ + EllipsisText.prototype.show = function () { + var context = this.context; + var ev = context.event; + var lastTimeStamp = this.timeStamp; + var timeStamp = +new Date(); + if (timeStamp - lastTimeStamp > 16) { + var preLoc = this.location; + var curLoc = { x: ev.x, y: ev.y }; + if (!preLoc || !isEqual$2(preLoc, curLoc)) { + this.showTooltip(curLoc); + } + this.timeStamp = timeStamp; + this.location = curLoc; + } + }; + /** + * 隐藏 Tooltip。 + * @returns + */ + EllipsisText.prototype.hide = function () { + this.hideTooltip(); + this.location = null; + }; + EllipsisText.prototype.showTooltip = function (curLoc) { + var context = this.context; + var ev = context.event; + var target = ev.target; + if (target && target.get('tip')) { + if (!this.tooltip) { + this.renderTooltip(); // 延迟生成 + } + var tipContent = target.get('tip'); + // 展示 tooltip + this.tooltip.update(__assign$r({ title: tipContent }, curLoc)); + this.tooltip.show(); + } + }; + EllipsisText.prototype.hideTooltip = function () { + this.tooltip && this.tooltip.hide(); + }; + EllipsisText.prototype.renderTooltip = function () { + var _a; + var view = this.context.view; + var canvas = view.canvas; + var region = { + start: { x: 0, y: 0 }, + end: { x: canvas.get('width'), y: canvas.get('height') }, + }; + var theme = view.getTheme(); + var tooltipStyles = get$3(theme, ['components', 'tooltip', 'domStyles'], {}); // 获取 tooltip 样式 + var tooltip = new HtmlTooltip({ + parent: canvas.get('el').parentNode, + region: region, + visible: false, + crosshairs: null, + domStyles: __assign$r({}, deepMix({}, tooltipStyles, (_a = {}, + // 超长的时候，tooltip tip 最大宽度为 50%，然后可以换行 + _a[CONTAINER_CLASS] = { 'max-width': '50%' }, + _a[TITLE_CLASS] = { 'word-break': 'break-all' }, + _a))), + }); + tooltip.init(); + tooltip.setCapture(false); // 不允许捕获事件 + this.tooltip = tooltip; + }; + return EllipsisText; +}(Action$1)); + +/** + * 状态量 Action 的基类 + * @abstract + * @class + * @ignore + */ +var StateBase = /** @class */ (function (_super) { + __extends$e(StateBase, _super); + function StateBase() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** + * 状态名称 + */ + _this.stateName = ''; + return _this; + } + /** + * 是否具有某个状态 + * @param element 图表 Element 元素 + */ + StateBase.prototype.hasState = function (element) { + return element.hasState(this.stateName); + }; + /** + * 设置状态激活 + * @param enable 状态值 + */ + StateBase.prototype.setElementState = function (element, enable) { + // 防止闪烁 + element.setState(this.stateName, enable); + }; + /** + * 设置状态 + */ + StateBase.prototype.setState = function () { + this.setStateEnable(true); + }; + /** + * 清除所有 Element 的状态 + */ + StateBase.prototype.clear = function () { + var view = this.context.view; + this.clearViewState(view); + }; + StateBase.prototype.clearViewState = function (view) { + var _this = this; + var elements = getElementsByState(view, this.stateName); + each$2(elements, function (el) { + _this.setElementState(el, false); + }); + }; + return StateBase; +}(Action$1)); + +function getItem(shape) { + return get$3(shape.get('delegateObject'), 'item'); +} +/** + * 状态量 Action 的基类，允许多个 Element 同时拥有某个状态 + * @class + * @ignore + */ +var ElementState = /** @class */ (function (_super) { + __extends$e(ElementState, _super); + function ElementState() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.ignoreListItemStates = ['unchecked']; + return _this; + } + // 是否忽略触发的列表项 + ElementState.prototype.isItemIgnore = function (item, list) { + var states = this.ignoreListItemStates; + var filtered = states.filter(function (state) { + return list.hasState(item, state); + }); + return !!filtered.length; + }; + // 设置由组件选项导致的状态变化 + ElementState.prototype.setStateByComponent = function (component, item, enable) { + var view = this.context.view; + var field = component.get('field'); + var elements = getElements(view); + this.setElementsStateByItem(elements, field, item, enable); + }; + // 处理触发源由 element 导致的状态变化 + ElementState.prototype.setStateByElement = function (element, enable) { + this.setElementState(element, enable); + }; + /** 组件的选项是否同 element 匹配 */ + ElementState.prototype.isMathItem = function (element, field, item) { + var view = this.context.view; + var scale = getScaleByField(view, field); + var value = getElementValue$1(element, field); + return !isNil(value) && item.name === scale.getText(value); + }; + ElementState.prototype.setElementsStateByItem = function (elements, field, item, enable) { + var _this = this; + each$2(elements, function (el) { + if (_this.isMathItem(el, field, item)) { + el.setState(_this.stateName, enable); + } + }); + }; + /** 设置状态是否激活 */ + ElementState.prototype.setStateEnable = function (enable) { + var element = getCurrentElement(this.context); + if (element) { + // 触发源由于 element 导致 + if (isElementChange(this.context)) { + this.setStateByElement(element, enable); + } + } + else { + // 触发源由组件导致 + var delegateObject = getDelegationObject(this.context); + // 如果触发源时列表，图例、坐标轴 + if (isList(delegateObject)) { + var item = delegateObject.item, component = delegateObject.component; + if (item && component && !this.isItemIgnore(item, component)) { + var event_1 = this.context.event.gEvent; + // 防止闪烁 + if (event_1 && event_1.fromShape && event_1.toShape && getItem(event_1.fromShape) === getItem(event_1.toShape)) { + return; + } + this.setStateByComponent(component, item, enable); + } + } + } + }; + /** + * 切换状态 + */ + ElementState.prototype.toggle = function () { + var element = getCurrentElement(this.context); + if (element) { + var hasState = element.hasState(this.stateName); + this.setElementState(element, !hasState); + } + }; + /** + * 取消当前时间影响的状态 + */ + ElementState.prototype.reset = function () { + this.setStateEnable(false); + }; + return ElementState; +}(StateBase)); + +/** + * 元素 active 的 Action，允许多个元素同时 active + * @class + * @ignore + */ +var ElementActive = /** @class */ (function (_super) { + __extends$e(ElementActive, _super); + function ElementActive() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.stateName = 'active'; + return _this; + } + /** + * Active Element + */ + ElementActive.prototype.active = function () { + this.setState(); + }; + return ElementActive; +}(ElementState)); + +/** + * Link Elements by color + * + * public 方法是对外可用的反馈交互。使用方式，如：element-link-by-color:link, element-link-by-color:unlink, element-link-by-color:clear + */ +var LinkByColor = /** @class */ (function (_super) { + __extends$e(LinkByColor, _super); + function LinkByColor() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.cache = {}; + return _this; + } + // 获取颜色对应的 scale + LinkByColor.prototype.getColorScale = function (view, element) { + var colorAttr = element.geometry.getAttribute('color'); + if (!colorAttr) { + return null; + } + var scale = view.getScaleByField(colorAttr.getFields()[0]); + return scale; + }; + // 获取连接的 path + LinkByColor.prototype.getLinkPath = function (element, nextElement) { + var view = this.context.view; + var isTransposed = view.getCoordinate().isTransposed; + var bbox = element.shape.getCanvasBBox(); + var nextBBox = nextElement.shape.getCanvasBBox(); + var path = isTransposed + ? [ + ['M', bbox.minX, bbox.minY], + ['L', nextBBox.minX, nextBBox.maxY], + ['L', nextBBox.maxX, nextBBox.maxY], + ['L', bbox.maxX, bbox.minY], + ['Z'], + ] + : [ + ['M', bbox.maxX, bbox.minY], + ['L', nextBBox.minX, nextBBox.minY], + ['L', nextBBox.minX, nextBBox.maxY], + ['L', bbox.maxX, bbox.maxY], + ['Z'], + ]; + return path; + }; + // 添加连接的图形 + LinkByColor.prototype.addLinkShape = function (group, element, nextElement, activeStyle) { + var style = { + opacity: 0.4, + fill: element.shape.attr('fill'), + }; + group.addShape({ + type: 'path', + attrs: __assign$r(__assign$r({}, deepMix({}, style, isFunction$6(activeStyle) ? activeStyle(style, element) : activeStyle)), { path: this.getLinkPath(element, nextElement) }), + }); + }; + // 使用图形连接 + LinkByColor.prototype.linkByElement = function (element, activeStyle) { + var _this = this; + var view = this.context.view; + var scale = this.getColorScale(view, element); + if (!scale) { + return; + } + var value = getElementValue$1(element, scale.field); + if (!this.cache[value]) { + var elements_1 = getElementsByField(view, scale.field, value); + var linkGroup = this.linkGroup; + var group_1 = linkGroup.addGroup(); + this.cache[value] = group_1; // 缓存 + var count_1 = elements_1.length; + each$2(elements_1, function (el, index) { + if (index < count_1 - 1) { + var nextEl = elements_1[index + 1]; + _this.addLinkShape(group_1, el, nextEl, activeStyle); + } + }); + } + }; + // 移除连接 + LinkByColor.prototype.removeLink = function (element) { + var scale = this.getColorScale(this.context.view, element); + if (!scale) { + return; + } + var value = getElementValue$1(element, scale.field); + if (this.cache[value]) { + this.cache[value].remove(); + this.cache[value] = null; + } + }; + /** + * 连接 elements + * + * @usage + * registerInteraction('xxx', { + * start: [ + * { + * trigger: 'interval:mouseenter', + * action: 'element-link-by-color:link', + * arg: { + * // style: { fill: 'red' } + * style: (style, element) => ({ fill: 'red' }) + * }, + * }, + * ], + * }); + */ + LinkByColor.prototype.link = function (args) { + var context = this.context; + if (!this.linkGroup) { + // 不允许被拾取 + this.linkGroup = context.view.foregroundGroup.addGroup({ + id: 'link-by-color-group', + capture: false, + }); + } + var element = getCurrentElement(context); + if (element) { + this.linkByElement(element, args === null || args === void 0 ? void 0 : args.style); + } + }; + /** + * 取消连接 elements + */ + LinkByColor.prototype.unlink = function () { + var element = getCurrentElement(this.context); + if (element) { + this.removeLink(element); + } + }; + /** + * 清除所有连接 + */ + LinkByColor.prototype.clear = function () { + if (this.linkGroup) { + this.linkGroup.clear(); + } + this.cache = {}; + }; + /** + * 销毁 + */ + LinkByColor.prototype.destroy = function () { + _super.prototype.destroy.call(this); + if (this.linkGroup) { + this.linkGroup.remove(); + } + }; + return LinkByColor; +}(Action$1)); + +/** + * @ignore + * 区域设置状态的基础 Action + */ +var ElementRangeState = /** @class */ (function (_super) { + __extends$e(ElementRangeState, _super); + function ElementRangeState() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.startPoint = null; + _this.endPoint = null; + _this.isStarted = false; + /** + * 是否作用于当前 view 的 siblings，默认是 false 仅作用于自己 + */ + _this.effectSiblings = false; + /** + * 是否受 element 的数据影响，还是受包围盒的影响 + */ + _this.effectByRecord = false; + return _this; + } + // 获取当前的位置 + ElementRangeState.prototype.getCurrentPoint = function () { + var event = this.context.event; + return { + x: event.x, + y: event.y, + }; + }; + /** + * 开始，记录开始选中的位置 + */ + ElementRangeState.prototype.start = function () { + this.clear(); // 开始的时候清理之前的状态 + this.startPoint = this.getCurrentPoint(); + this.isStarted = true; + }; + ElementRangeState.prototype.getIntersectElements = function () { + var elements = null; + if (isMask(this.context)) { + elements = getMaskedElements(this.context, 10); + } + else { + var startPoint = this.startPoint; + var endPoint = this.isStarted ? this.getCurrentPoint() : this.endPoint; + // 如果没有开始，则不允许范围设置状态，保护性质 + if (!startPoint || !endPoint) { + return; + } + // 计算框选区域 + var box = { + minX: Math.min(startPoint.x, endPoint.x), + minY: Math.min(startPoint.y, endPoint.y), + maxX: Math.max(startPoint.x, endPoint.x), + maxY: Math.max(startPoint.y, endPoint.y), + }; + // this.clear(); // 不全部清理，会导致闪烁 + var view = this.context.view; + elements = getIntersectElements(view, box); + } + return elements; + }; + /** + * 选中 + */ + ElementRangeState.prototype.setStateEnable = function (enable) { + if (this.effectSiblings && !this.effectByRecord) { + this.setSiblingsState(enable); + } + else { + var allElements = getElements(this.context.view); + var elements = this.getIntersectElements(); + if (elements && elements.length) { + if (this.effectByRecord) { + this.setSiblingsStateByRecord(elements, enable); + } + else { + this.setElementsState(elements, enable, allElements); + } + } + else { + this.clear(); + } + } + }; + // 根据选中的 element 的数据进行设置状态 + ElementRangeState.prototype.setSiblingsStateByRecord = function (elements, enable) { + var _this = this; + var view = this.context.view; + var siblings = getSilbings(view); + var records = elements.map(function (el) { + return el.getModel().data; + }); + var xFiled = view.getXScale().field; + var yField = view.getYScales()[0].field; + each$2(siblings, function (sibling) { + var allElements = getElements(sibling); + var effectElements = allElements.filter(function (el) { + var record = el.getModel().data; + return isInRecords(records, record, xFiled, yField); + }); + _this.setElementsState(effectElements, enable, allElements); + }); + }; + // 设置兄弟 view 的状态 + ElementRangeState.prototype.setSiblingsState = function (enable) { + var _this = this; + var view = this.context.view; + var siblings = getSilbings(view); + if (isMask(this.context)) { + // 受 mask 影响 + each$2(siblings, function (sibling) { + var allElements = getElements(sibling); + var effectElements = getSiblingMaskElements(_this.context, sibling, 10); + if (effectElements && effectElements.length) { + _this.setElementsState(effectElements, enable, allElements); + } + else { + _this.clearViewState(sibling); + } + }); + } + }; + ElementRangeState.prototype.setElementsState = function (elements, enable, allElements) { + var _this = this; + each$2(allElements, function (el) { + if (!elements.includes(el)) { + _this.setElementState(el, false); + } + else { + _this.setElementState(el, enable); + } + }); + }; + /** + * 结束 + */ + ElementRangeState.prototype.end = function () { + this.isStarted = false; + this.endPoint = this.getCurrentPoint(); + }; + // 复写 clear + ElementRangeState.prototype.clear = function () { + var _this = this; + var view = this.context.view; + // 判断是否影响 siblings + if (this.effectSiblings) { + var siblings = getSilbings(view); + each$2(siblings, function (sibling) { + _this.clearViewState(sibling); + }); + } + else { + this.clearViewState(view); + } + }; + return ElementRangeState; +}(StateBase)); + +/** + * @ignore + * 图表元素区域 Active 的 Action + */ +var ElementRangeActive = /** @class */ (function (_super) { + __extends$e(ElementRangeActive, _super); + function ElementRangeActive() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.stateName = 'active'; + return _this; + } + /** + * 图表元素 Active + */ + ElementRangeActive.prototype.active = function () { + this.setState(); + }; + return ElementRangeActive; +}(ElementRangeState)); + +/** + * 单状态量的 Action 基类 + * @class + * @ignore + */ +var ElementSingleState = /** @class */ (function (_super) { + __extends$e(ElementSingleState, _super); + function ElementSingleState() { + return _super !== null && _super.apply(this, arguments) || this; + } + ElementSingleState.prototype.setStateEnable = function (enable) { + var element = getCurrentElement(this.context); + if (element) { + // 在同一个 element 内部移动，忽视 label 和 shape 之间 + if (!isElementChange(this.context)) { + return; + } + // 仅支持单个状态量的元素，只能由 element 触发 + if (enable) { + this.clear(); + this.setElementState(element, true); + } + else if (this.hasState(element)) { + this.setElementState(element, false); + } + } + }; + /** + * 切换选中，只允许选中一个 + */ + ElementSingleState.prototype.toggle = function () { + var element = getCurrentElement(this.context); + if (element) { + var hasState = this.hasState(element); // 提前获取状态 + if (!hasState) { + this.clear(); + } + this.setElementState(element, !hasState); + } + }; + /** + * 取消当前时间影响的状态 + */ + ElementSingleState.prototype.reset = function () { + this.setStateEnable(false); + }; + return ElementSingleState; +}(StateBase)); + +/** + * @ignore + * 仅允许单个 Element Active 的 Action + */ +var ElementSingleActive = /** @class */ (function (_super) { + __extends$e(ElementSingleActive, _super); + function ElementSingleActive() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.stateName = 'active'; + return _this; + } + /** + * 当前事件相关的 Element Active + */ + ElementSingleActive.prototype.active = function () { + this.setState(); + }; + return ElementSingleActive; +}(ElementSingleState)); + +var STATUS_UNACTIVE$3 = 'inactive'; +var STATUS_ACTIVE$3 = 'active'; +/** + * @ignore + * 清理 highlight 效果 + * @param view View 或者 Chart + */ +function clearHighlight$1(view) { + var elements = getElements(view); + each$2(elements, function (el) { + if (el.hasState(STATUS_ACTIVE$3)) { + el.setState(STATUS_ACTIVE$3, false); + } + if (el.hasState(STATUS_UNACTIVE$3)) { + el.setState(STATUS_UNACTIVE$3, false); + } + }); +} +/** + * @ignore + * 设置多个元素的 highlight + * @param elements 元素集合 + * @param callback 设置回调函数 + * @param enable 设置或者取消 + */ +function setHighlightBy(elements, callback, enable) { + each$2(elements, function (el) { + // 需要处理 active 和 unactive 的互斥 + if (callback(el)) { + if (el.hasState(STATUS_UNACTIVE$3)) { + el.setState(STATUS_UNACTIVE$3, false); + } + el.setState(STATUS_ACTIVE$3, enable); + } + else { + if (el.hasState(STATUS_ACTIVE$3)) { + el.setState(STATUS_ACTIVE$3, false); + } + el.setState(STATUS_UNACTIVE$3, enable); + } + }); +} + +var STATUS_UNACTIVE$2 = ELEMENT_STATE.INACTIVE; +var STATUS_ACTIVE$2 = ELEMENT_STATE.ACTIVE; +/** + * @ignore + * highlight，指定图形高亮，其他图形变暗 + */ +var ElementHighlight = /** @class */ (function (_super) { + __extends$e(ElementHighlight, _super); + function ElementHighlight() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.stateName = STATUS_ACTIVE$2; + return _this; + } + // 多个元素设置、取消 highlight + ElementHighlight.prototype.setElementsStateByItem = function (elements, field, item, enable) { + var _this = this; + var callback = function (el) { return _this.isMathItem(el, field, item); }; + this.setHighlightBy(elements, callback, enable); + }; + // 设置元素的 highlight + ElementHighlight.prototype.setElementHighlight = function (el, callback) { + if (callback(el)) { + if (el.hasState(STATUS_UNACTIVE$2)) { + el.setState(STATUS_UNACTIVE$2, false); + } + el.setState(STATUS_ACTIVE$2, true); + } + else if (!el.hasState(STATUS_ACTIVE$2)) { + el.setState(STATUS_UNACTIVE$2, true); + } + }; + ElementHighlight.prototype.setHighlightBy = function (elements, callback, enable) { + var _this = this; + if (enable) { + // 如果是设置 highlight ，则将匹配的 element 设置成 active， + // 其他如果不是 active，则设置成 unactive + each$2(elements, function (el) { + _this.setElementHighlight(el, callback); + }); + } + else { + // 如果取消 highlight，则要检测是否全部取消 highlight + var activeElements = getElementsByState(this.context.view, STATUS_ACTIVE$2); + var allCancel_1 = true; + // 检测所有 activeElements 都要取消 highlight + each$2(activeElements, function (el) { + if (!callback(el)) { + allCancel_1 = false; + return false; + } + }); + if (allCancel_1) { + // 都要取消，则取消所有的 active，unactive 状态 + this.clear(); + } + else { + // 如果不是都要取消 highlight, 则设置匹配的 element 的状态为 unactive + // 其他 element 状态不变 + each$2(elements, function (el) { + if (callback(el)) { + if (el.hasState(STATUS_ACTIVE$2)) { + el.setState(STATUS_ACTIVE$2, false); + } + el.setState(STATUS_UNACTIVE$2, true); + } + }); + } + } + }; + // 单个元素设置和取消 highlight + ElementHighlight.prototype.setElementState = function (element, enable) { + var view = this.context.view; + var elements = getElements(view); + this.setHighlightBy(elements, function (el) { return element === el; }, enable); + }; + ElementHighlight.prototype.highlight = function () { + this.setState(); + }; + // 清理掉所有的 active， unactive 状态 + ElementHighlight.prototype.clear = function () { + var view = this.context.view; + clearHighlight$1(view); + }; + return ElementHighlight; +}(ElementState)); + +/** + * Highlight color + * @ignore + */ +var HighlightColor = /** @class */ (function (_super) { + __extends$e(HighlightColor, _super); + function HighlightColor() { + return _super !== null && _super.apply(this, arguments) || this; + } + HighlightColor.prototype.setStateByElement = function (element, enable) { + var view = this.context.view; + var colorAttr = element.geometry.getAttribute('color'); + if (!colorAttr) { + return; + } + var scale = view.getScaleByField(colorAttr.getFields()[0]); + var value = getElementValue$1(element, scale.field); + var elements = getElements(view); + var highlightElements = elements.filter(function (el) { + return getElementValue$1(el, scale.field) === value; + }); + this.setHighlightBy(elements, function (el) { return highlightElements.includes(el); }, enable); + }; + return HighlightColor; +}(ElementHighlight)); + +/** + * Highlight x + * @ignore + */ +var HighlightX = /** @class */ (function (_super) { + __extends$e(HighlightX, _super); + function HighlightX() { + return _super !== null && _super.apply(this, arguments) || this; + } + // 不允许多选 + HighlightX.prototype.setElementHighlight = function (el, callback) { + if (callback(el)) { + if (el.hasState(STATUS_UNACTIVE$2)) { + el.setState(STATUS_UNACTIVE$2, false); + } + el.setState(STATUS_ACTIVE$2, true); + } + else { + el.setState(STATUS_UNACTIVE$2, true); + if (el.hasState(STATUS_ACTIVE$2)) { + el.setState(STATUS_ACTIVE$2, false); + } + } + }; + HighlightX.prototype.setStateByElement = function (element, enable) { + var view = this.context.view; + var scale = view.getXScale(); + var value = getElementValue$1(element, scale.field); + var elements = getElements(view); + var highlightElements = elements.filter(function (el) { + return getElementValue$1(el, scale.field) === value; + }); + this.setHighlightBy(elements, function (el) { return highlightElements.includes(el); }, enable); + }; + /** + * 切换状态 + */ + HighlightX.prototype.toggle = function () { + var element = getCurrentElement(this.context); + if (element) { + var hasState = element.hasState(this.stateName); + this.setStateByElement(element, !hasState); + } + }; + return HighlightX; +}(ElementHighlight)); + +var EVENTS$1; +(function (EVENTS) { + EVENTS["BEFORE_HIGHLIGHT"] = "element-range-highlight:beforehighlight"; + EVENTS["AFTER_HIGHLIGHT"] = "element-range-highlight:afterhighlight"; + EVENTS["BEFORE_CLEAR"] = "element-range-highlight:beforeclear"; + EVENTS["AFTER_CLEAR"] = "element-range-highlight:afterclear"; +})(EVENTS$1 || (EVENTS$1 = {})); +/** + * @ignore + * 区域 highlight 的 Action + */ +var ElementRangeHighlight = /** @class */ (function (_super) { + __extends$e(ElementRangeHighlight, _super); + function ElementRangeHighlight() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.stateName = 'active'; + return _this; + } + // 清理掉所有的 active， unactive 状态 + ElementRangeHighlight.prototype.clearViewState = function (view) { + clearHighlight$1(view); + }; + /** + * 设置 highlight + */ + ElementRangeHighlight.prototype.highlight = function () { + var _a = this.context, view = _a.view, event = _a.event; + var elements = this.getIntersectElements(); + var payload = { view: view, event: event, highlightElements: elements }; + view.emit(EVENTS$1.BEFORE_HIGHLIGHT, Event$1.fromData(view, EVENTS$1.BEFORE_HIGHLIGHT, payload)); + this.setState(); + view.emit(EVENTS$1.AFTER_HIGHLIGHT, Event$1.fromData(view, EVENTS$1.AFTER_HIGHLIGHT, payload)); + }; + /** + * @overrider 添加事件 + */ + ElementRangeHighlight.prototype.clear = function () { + var view = this.context.view; + view.emit(EVENTS$1.BEFORE_CLEAR, Event$1.fromData(view, EVENTS$1.BEFORE_CLEAR, {})); + _super.prototype.clear.call(this); + view.emit(EVENTS$1.AFTER_CLEAR, Event$1.fromData(view, EVENTS$1.AFTER_CLEAR, {})); + }; + ElementRangeHighlight.prototype.setElementsState = function (elements, enable, allElements) { + setHighlightBy(allElements, function (el) { return elements.indexOf(el) >= 0; }, enable); + }; + return ElementRangeHighlight; +}(ElementRangeState)); + +/** + * @ignore + * 单个 Element Highlight 的 Action + */ +var ElementSingleHighlight = /** @class */ (function (_super) { + __extends$e(ElementSingleHighlight, _super); + function ElementSingleHighlight() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.stateName = 'active'; + return _this; + } + /** + * Element Highlight + */ + ElementSingleHighlight.prototype.highlight = function () { + this.setState(); + }; + ElementSingleHighlight.prototype.setElementState = function (element, enable) { + var view = this.context.view; + var elements = getElements(view); + setHighlightBy(elements, function (el) { return element === el; }, enable); + }; + // 清理掉所有的 active， unactive 状态 + ElementSingleHighlight.prototype.clear = function () { + var view = this.context.view; + clearHighlight$1(view); + }; + return ElementSingleHighlight; +}(ElementSingleState)); + +/** + * @ignore + * 区域选中的 Action + */ +var ElementRangeSelected = /** @class */ (function (_super) { + __extends$e(ElementRangeSelected, _super); + function ElementRangeSelected() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.stateName = 'selected'; + return _this; + } + /** + * 选中 + */ + ElementRangeSelected.prototype.selected = function () { + this.setState(); + }; + return ElementRangeSelected; +}(ElementRangeState)); + +/** + * @ignore + * 允许多选的 Action + * @class + */ +var ElementMultipleSelected = /** @class */ (function (_super) { + __extends$e(ElementMultipleSelected, _super); + function ElementMultipleSelected() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.stateName = 'selected'; + return _this; + } + /** + * 选中节点，允许多选 + */ + ElementMultipleSelected.prototype.selected = function () { + this.setState(); + }; + return ElementMultipleSelected; +}(ElementState)); + +/** + * @ignore + * 单选的 Action + */ +var ElementSingleSelected = /** @class */ (function (_super) { + __extends$e(ElementSingleSelected, _super); + function ElementSingleSelected() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.stateName = 'selected'; + return _this; + } + /** + * 选中 + */ + ElementSingleSelected.prototype.selected = function () { + this.setState(); + }; + return ElementSingleSelected; +}(ElementSingleState)); + +/** + * 列表项状态 Action 的基础类 + * @class + * @ignore + */ +var ListState = /** @class */ (function (_super) { + __extends$e(ListState, _super); + function ListState() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.stateName = ''; + _this.ignoreItemStates = []; + return _this; + } + /** 获取触发的列表组件 */ + ListState.prototype.getTriggerListInfo = function () { + var delegateObject = getDelegationObject(this.context); + var info = null; + if (isList(delegateObject)) { + info = { + item: delegateObject.item, + list: delegateObject.component, + }; + } + return info; + }; + // 获取所有允许执行 Action 的组件 + ListState.prototype.getAllowComponents = function () { + var _this = this; + var view = this.context.view; + var components = getComponents(view); + var rst = []; + each$2(components, function (component) { + if (component.isList() && _this.allowSetStateByElement(component)) { + rst.push(component); + } + }); + return rst; + }; + /** 是否存在指定的状态 */ + ListState.prototype.hasState = function (list, item) { + return list.hasState(item, this.stateName); + }; + /** 清理组件的状态 */ + ListState.prototype.clearAllComponentsState = function () { + var _this = this; + var components = this.getAllowComponents(); + each$2(components, function (component) { + component.clearItemsState(_this.stateName); + }); + }; + // 不是所有的 component 都能进行 active，目前仅支持分类 scale 对应的组件 + ListState.prototype.allowSetStateByElement = function (component) { + var field = component.get('field'); + if (!field) { + return false; + } + if (this.cfg && this.cfg.componentNames) { + var name_1 = component.get('name'); + // 如果配置了限制的 component name，则要进行检测 + if (this.cfg.componentNames.indexOf(name_1) === -1) { + return false; + } + } + var view = this.context.view; + var scale = getScaleByField(view, field); + return scale && scale.isCategory; + }; + // 检测是否允许触发对应的状态改变事件 + ListState.prototype.allowSetStateByItem = function (item, list) { + var ignoreStates = this.ignoreItemStates; + if (ignoreStates.length) { + var filterStates = ignoreStates.filter(function (state) { + return list.hasState(item, state); + }); + return filterStates.length === 0; + } + return true; // 没有定义忽略的状态时，允许 + }; + // 设置组件的 item active + ListState.prototype.setStateByElement = function (component, element, enable) { + var field = component.get('field'); + var view = this.context.view; + var scale = getScaleByField(view, field); + var value = getElementValue$1(element, field); + var text = scale.getText(value); + this.setItemsState(component, text, enable); + }; + // 设置状态 + ListState.prototype.setStateEnable = function (enable) { + var _this = this; + var element = getCurrentElement(this.context); + if (element) { + // trigger by element + var components = this.getAllowComponents(); + each$2(components, function (component) { + _this.setStateByElement(component, element, enable); + }); + } + else { + // 被组件触发 + var delegateObject = getDelegationObject(this.context); + if (isList(delegateObject)) { + var item = delegateObject.item, component = delegateObject.component; + if (this.allowSetStateByElement(component) && this.allowSetStateByItem(item, component)) { + this.setItemState(component, item, enable); + } + } + } + }; + // 多个 item 设置状态 + ListState.prototype.setItemsState = function (list, name, enable) { + var _this = this; + var items = list.getItems(); + each$2(items, function (item) { + if (item.name === name) { + _this.setItemState(list, item, enable); + } + }); + }; + // 单个 item 设置状态 + ListState.prototype.setItemState = function (list, item, enable) { + list.setItemState(item, this.stateName, enable); + }; + /** + * 设置状态 + */ + ListState.prototype.setState = function () { + this.setStateEnable(true); + }; + /** + * 取消状态 + */ + ListState.prototype.reset = function () { + this.setStateEnable(false); + }; + /** + * 切换状态 + */ + ListState.prototype.toggle = function () { + var triggerInfo = this.getTriggerListInfo(); + if (triggerInfo && triggerInfo.item) { + var list = triggerInfo.list, item = triggerInfo.item; + var enable = this.hasState(list, item); + this.setItemState(list, item, !enable); + } + }; + /** + * 取消状态 + */ + ListState.prototype.clear = function () { + var triggerInfo = this.getTriggerListInfo(); + if (triggerInfo) { + triggerInfo.list.clearItemsState(this.stateName); + } + else { + this.clearAllComponentsState(); + } + }; + return ListState; +}(Action$1)); + +/** + * 列表项（图例项、坐标轴文本）激活的 Action + * @class + * @ignore + */ +var ListActive = /** @class */ (function (_super) { + __extends$e(ListActive, _super); + function ListActive() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.stateName = 'active'; + return _this; + } + /** + * 激活选项 + */ + ListActive.prototype.active = function () { + this.setState(); + }; + return ListActive; +}(ListState)); + +var STATUS_UNACTIVE$1 = 'inactive'; +var STATUS_ACTIVE$1 = 'active'; +/** + * 清理图例的 Highlight 效果 + * @param list 列表组件，图例或者坐标轴 + * @ignore + */ +function clearList(list) { + var items = list.getItems(); + each$2(items, function (item) { + if (list.hasState(item, STATUS_ACTIVE$1)) { + list.setItemState(item, STATUS_ACTIVE$1, false); + } + if (list.hasState(item, STATUS_UNACTIVE$1)) { + list.setItemState(item, STATUS_UNACTIVE$1, false); + } + }); +} + +var STATUS_UNACTIVE = 'inactive'; +var STATUS_ACTIVE = 'active'; +/** + * highlight Action 的效果是 active 和 inactive 两个状态的组合 + * @class + * @ignore + */ +var ListHighlight = /** @class */ (function (_super) { + __extends$e(ListHighlight, _super); + function ListHighlight() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.stateName = STATUS_ACTIVE; + _this.ignoreItemStates = ['unchecked']; // 当存在 unchecked 状态时不触发 + return _this; + } + // 如果 item.name 匹配，则设置 highlight 以及取消 + ListHighlight.prototype.setItemsState = function (list, name, enable) { + this.setHighlightBy(list, function (item) { return item.name === name; }, enable); + }; + // 单个 item 设置状态 + ListHighlight.prototype.setItemState = function (list, item, enable) { + list.getItems(); + this.setHighlightBy(list, function (el) { return el === item; }, enable); + }; + // 根据条件设置 highlight + ListHighlight.prototype.setHighlightBy = function (list, callback, enable) { + var items = list.getItems(); + if (enable) { + // 设置 highlight 时，保留之前已经 Highlight 的项 + each$2(items, function (item) { + if (callback(item)) { + if (list.hasState(item, STATUS_UNACTIVE)) { + list.setItemState(item, STATUS_UNACTIVE, false); + } + list.setItemState(item, STATUS_ACTIVE, true); + } + else if (!list.hasState(item, STATUS_ACTIVE)) { + list.setItemState(item, STATUS_UNACTIVE, true); + } + }); + } + else { + var activeItems = list.getItemsByState(STATUS_ACTIVE); + var allCancel_1 = true; + // 检测 activeItems 是否要全部取消 + each$2(activeItems, function (item) { + if (!callback(item)) { + allCancel_1 = false; + return false; + } + }); + if (allCancel_1) { + this.clear(); + } + else { + // 如果不是都要取消 highlight, 则设置匹配的 element 的状态为 unactive + // 其他 element 状态不变 + each$2(items, function (item) { + if (callback(item)) { + if (list.hasState(item, STATUS_ACTIVE)) { + list.setItemState(item, STATUS_ACTIVE, false); + } + list.setItemState(item, STATUS_UNACTIVE, true); + } + }); + } + } + }; + /** + * highlight 图例项（坐标轴文本） + */ + ListHighlight.prototype.highlight = function () { + this.setState(); + }; + // 需要全部清理 active 和 unactive + ListHighlight.prototype.clear = function () { + var triggerInfo = this.getTriggerListInfo(); + if (triggerInfo) { + clearList(triggerInfo.list); + } + else { + // 如果不是 component 的事件触发，则所有满足触发条件的组件都清除该状态 + var components = this.getAllowComponents(); + each$2(components, function (component) { + component.clearItemsState(STATUS_ACTIVE); + component.clearItemsState(STATUS_UNACTIVE); + }); + } + }; + return ListHighlight; +}(ListState)); + +/** + * 图例项和坐标轴文本选中的 Action + * @ignore + */ +var ListSelected = /** @class */ (function (_super) { + __extends$e(ListSelected, _super); + function ListSelected() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.stateName = 'selected'; + return _this; + } + ListSelected.prototype.selected = function () { + this.setState(); + }; + return ListSelected; +}(ListState)); + +/** + * 图例项取消勾选的 Action + * @ignore + */ +var ListUnchecked = /** @class */ (function (_super) { + __extends$e(ListUnchecked, _super); + function ListUnchecked() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.stateName = 'unchecked'; + return _this; + } + /** + * 取消勾选 + */ + ListUnchecked.prototype.unchecked = function () { + this.setState(); + }; + return ListUnchecked; +}(ListState)); + +var STATUS_UNCHECKED = 'unchecked'; +var STATUS_CHECKED = 'checked'; +/** + * checked Action + * 提供三个对外方法 + * 1. toggle 切换状态 + * 2. checked 选中 + * 3. reset 清除重置 + */ +var ListChecked = /** @class */ (function (_super) { + __extends$e(ListChecked, _super); + function ListChecked() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.stateName = STATUS_CHECKED; + return _this; + } + // 单个 item 设置状态 + ListChecked.prototype.setItemState = function (list, item, enable) { + this.setCheckedBy(list, function (el) { return el === item; }, enable); + }; + // 根据条件设置 checked + ListChecked.prototype.setCheckedBy = function (list, callback, enable) { + var items = list.getItems(); + if (enable) { + // 设置 checked 时，保留之前已经 checked 的项 + each$2(items, function (item) { + if (callback(item)) { + if (list.hasState(item, STATUS_UNCHECKED)) { + list.setItemState(item, STATUS_UNCHECKED, false); + } + list.setItemState(item, STATUS_CHECKED, true); + } + else if (!list.hasState(item, STATUS_CHECKED)) { + list.setItemState(item, STATUS_UNCHECKED, true); + } + }); + } + }; + /** + * 切换状态. + * 1. 当全部选中的时候 或者 当前 item 未选中时，进行激活操作 + * 2. 否则，重置 + * @override + */ + ListChecked.prototype.toggle = function () { + var triggerInfo = this.getTriggerListInfo(); + if (triggerInfo && triggerInfo.item) { + var list_1 = triggerInfo.list, item = triggerInfo.item; + // 不知道 🤷‍♀️ 只认 unchecked status + var allChecked = !some(list_1.getItems(), function (t) { return list_1.hasState(t, STATUS_UNCHECKED); }); + // + if (allChecked || list_1.hasState(item, STATUS_UNCHECKED)) { + this.setItemState(list_1, item, true); + } + else { + this.reset(); + } + } + }; + /** + * checked 图例项 + */ + ListChecked.prototype.checked = function () { + this.setState(); + }; + /** + * 重置，需要全部清理 checked 和 unchecked + */ + ListChecked.prototype.reset = function () { + var components = this.getAllowComponents(); + each$2(components, function (component) { + component.clearItemsState(STATUS_CHECKED); + component.clearItemsState(STATUS_UNCHECKED); + }); + }; + return ListChecked; +}(ListState)); + +/** + * @ignore + * 辅助框 Action 的基类 + */ +var MaskBase = /** @class */ (function (_super) { + __extends$e(MaskBase, _super); + function MaskBase() { + var _this = _super !== null && _super.apply(this, arguments) || this; + // mask 图形 + _this.maskShape = null; + // 组成 mask 的各个点 + _this.points = []; + // 开始 mask 的标记 + _this.starting = false; + // 开始移动的标记 + _this.moving = false; + _this.preMovePoint = null; + _this.shapeType = 'path'; + return _this; + } + // 获取当前的位置 + MaskBase.prototype.getCurrentPoint = function () { + var event = this.context.event; + return { + x: event.x, + y: event.y, + }; + }; + // 触发 mask 的事件 + MaskBase.prototype.emitEvent = function (type) { + var eventName = "mask:" + type; + var view = this.context.view; + var event = this.context.event; + view.emit(eventName, { + target: this.maskShape, + shape: this.maskShape, + points: this.points, + x: event.x, + y: event.y, + }); + }; + // 创建 mask + MaskBase.prototype.createMask = function () { + var view = this.context.view; + var maskAttrs = this.getMaskAttrs(); + var maskShape = view.foregroundGroup.addShape({ + type: this.shapeType, + name: 'mask', + draggable: true, + attrs: __assign$r({ fill: '#C5D4EB', opacity: 0.3 }, maskAttrs), + }); + return maskShape; + }; + // 生成 mask 的路径 + MaskBase.prototype.getMaskPath = function () { + return []; + }; + /** + * 显示 + */ + MaskBase.prototype.show = function () { + if (this.maskShape) { + this.maskShape.show(); + this.emitEvent('show'); + } + }; + /** + * 开始 + */ + MaskBase.prototype.start = function (arg) { + this.starting = true; + // 开始时，保证移动结束 + this.moving = false; + this.points = [this.getCurrentPoint()]; + if (!this.maskShape) { + this.maskShape = this.createMask(); + // 开始时设置 capture: false，可以避免创建、resize 时触发事件 + this.maskShape.set('capture', false); + } + this.updateMask(arg === null || arg === void 0 ? void 0 : arg.maskStyle); + this.emitEvent('start'); + }; + /** + * 开始移动 + */ + MaskBase.prototype.moveStart = function () { + this.moving = true; + this.preMovePoint = this.getCurrentPoint(); + }; + /** + * 移动 mask + */ + MaskBase.prototype.move = function () { + if (!this.moving || !this.maskShape) { + return; + } + var currentPoint = this.getCurrentPoint(); + var preMovePoint = this.preMovePoint; + var dx = currentPoint.x - preMovePoint.x; + var dy = currentPoint.y - preMovePoint.y; + var points = this.points; + each$2(points, function (point) { + point.x += dx; + point.y += dy; + }); + this.updateMask(); + this.emitEvent('change'); + this.preMovePoint = currentPoint; + }; + MaskBase.prototype.updateMask = function (maskStyle) { + var attrs = deepMix({}, this.getMaskAttrs(), maskStyle); + this.maskShape.attr(attrs); + }; + /** + * 结束移动 + */ + MaskBase.prototype.moveEnd = function () { + this.moving = false; + this.preMovePoint = null; + }; + /** + * 结束 + */ + MaskBase.prototype.end = function () { + this.starting = false; + this.emitEvent('end'); + if (this.maskShape) { + this.maskShape.set('capture', true); + } + }; + /** + * 隐藏 + */ + MaskBase.prototype.hide = function () { + if (this.maskShape) { + this.maskShape.hide(); + this.emitEvent('hide'); + } + }; + /** + * 大小变化 + */ + MaskBase.prototype.resize = function () { + // 只有进行中，才会允许大小变化 + if (this.starting && this.maskShape) { + this.points.push(this.getCurrentPoint()); + this.updateMask(); + this.emitEvent('change'); + } + }; + /** + * 销毁 + */ + MaskBase.prototype.destroy = function () { + this.points = []; + if (this.maskShape) { + this.maskShape.remove(); + } + this.maskShape = null; + this.preMovePoint = null; + _super.prototype.destroy.call(this); + }; + return MaskBase; +}(Action$1)); + +/** + * @ignore + * 圆形辅助框 Action + */ +var CircleMask = /** @class */ (function (_super) { + __extends$e(CircleMask, _super); + function CircleMask() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.shapeType = 'circle'; + return _this; + } + CircleMask.prototype.getMaskAttrs = function () { + var points = this.points; + var currentPoint = last$1(this.points); + var r = 0; + var x = 0; + var y = 0; + if (points.length) { + var first = points[0]; + r = distance$6(first, currentPoint) / 2; + x = (currentPoint.x + first.x) / 2; + y = (currentPoint.y + first.y) / 2; + } + return { + x: x, + y: y, + r: r, + }; + }; + return CircleMask; +}(MaskBase)); + +/** + * @ignore + * 矩形的辅助框 Action + */ +var RectMask = /** @class */ (function (_super) { + __extends$e(RectMask, _super); + function RectMask() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.shapeType = 'rect'; + return _this; + } + RectMask.prototype.getRegion = function () { + var points = this.points; + return { + start: head(points), + end: last$1(points), + }; + }; + // 添加图形 + RectMask.prototype.getMaskAttrs = function () { + var _a = this.getRegion(), start = _a.start, end = _a.end; + var x = Math.min(start.x, end.x); + var y = Math.min(start.y, end.y); + var width = Math.abs(end.x - start.x); + var height = Math.abs(end.y - start.y); + return { + x: x, + y: y, + width: width, + height: height, + }; + }; + return RectMask; +}(MaskBase)); + +function clampPoint(point) { + point.x = clamp$1(point.x, 0, 1); + point.y = clamp$1(point.y, 0, 1); +} +/** + * @ignore + */ +var DimRect = /** @class */ (function (_super) { + __extends$e(DimRect, _super); + function DimRect() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.dim = 'x'; + _this.inPlot = true; + return _this; + } + DimRect.prototype.getRegion = function () { + var start = null; + var end = null; + var points = this.points; + var dim = this.dim; + var coord = this.context.view.getCoordinate(); + var normalStart = coord.invert(head(points)); + var normalEnd = coord.invert(last$1(points)); + if (this.inPlot) { + // 约束到 0 - 1 范围内 + clampPoint(normalStart); + clampPoint(normalEnd); + } + if (dim === 'x') { + // x 轴方向扩展, y 轴方向占满全部 + start = coord.convert({ + x: normalStart.x, + y: 0, + }); + end = coord.convert({ + x: normalEnd.x, + y: 1, + }); + } + else { + // y 轴方向扩展, x 轴方向占满全部 + start = coord.convert({ + x: 0, + y: normalStart.y, + }); + end = coord.convert({ + x: 1, + y: normalEnd.y, + }); + } + return { + start: start, + end: end, + }; + }; + return DimRect; +}(RectMask)); + +/** + * @ignore + * 多个点构成的 Path 辅助框 Action + */ +var PathMask = /** @class */ (function (_super) { + __extends$e(PathMask, _super); + function PathMask() { + return _super !== null && _super.apply(this, arguments) || this; + } + // 生成 mask 的路径 + PathMask.prototype.getMaskPath = function () { + var points = this.points; + var path = []; + if (points.length) { + each$2(points, function (point, index) { + if (index === 0) { + path.push(['M', point.x, point.y]); + } + else { + path.push(['L', point.x, point.y]); + } + }); + path.push(['L', points[0].x, points[0].y]); + } + return path; + }; + PathMask.prototype.getMaskAttrs = function () { + return { + path: this.getMaskPath(), + }; + }; + /** + * 添加一个点 + */ + PathMask.prototype.addPoint = function () { + this.resize(); + }; + return PathMask; +}(MaskBase)); + +/** + * Smooth path mask + * @ignore + */ +var SmoothPathMask = /** @class */ (function (_super) { + __extends$e(SmoothPathMask, _super); + function SmoothPathMask() { + return _super !== null && _super.apply(this, arguments) || this; + } + // 生成 mask 的路径 + SmoothPathMask.prototype.getMaskPath = function () { + var points = this.points; + return getSpline$1(points, true); + }; + return SmoothPathMask; +}(PathMask)); + +/** + * 鼠标形状的 Action + * @ignore + */ +var CursorAction = /** @class */ (function (_super) { + __extends$e(CursorAction, _super); + function CursorAction() { + return _super !== null && _super.apply(this, arguments) || this; + } + CursorAction.prototype.setCursor = function (cursor) { + var view = this.context.view; + view.getCanvas().setCursor(cursor); + }; + /** + * 默认光标（通常是一个箭头） + */ + CursorAction.prototype.default = function () { + this.setCursor('default'); + }; + /** 光标呈现为指示链接的指针（一只手） */ + CursorAction.prototype.pointer = function () { + this.setCursor('pointer'); + }; + /** 此光标指示某对象可被移动。 */ + CursorAction.prototype.move = function () { + this.setCursor('move'); + }; + /** 光标呈现为十字线。 */ + CursorAction.prototype.crosshair = function () { + this.setCursor('crosshair'); + }; + /** 此光标指示程序正忙（通常是一只表或沙漏）。 */ + CursorAction.prototype.wait = function () { + this.setCursor('wait'); + }; + /** 此光标指示可用的帮助（通常是一个问号或一个气球）。 */ + CursorAction.prototype.help = function () { + this.setCursor('help'); + }; + /** 此光标指示文本。 */ + CursorAction.prototype.text = function () { + this.setCursor('text'); + }; + /** + * 此光标指示矩形框的边缘可被向右（东）移动。 + */ + CursorAction.prototype.eResize = function () { + this.setCursor('e-resize'); + }; + /** + * 此光标指示矩形框的边缘可被向左（西）移动。 + */ + CursorAction.prototype.wResize = function () { + this.setCursor('w-resize'); + }; + /** + * 此光标指示矩形框的边缘可被向上（北）移动。 + */ + CursorAction.prototype.nResize = function () { + this.setCursor('n-resize'); + }; + /** + * 此光标指示矩形框的边缘可被向下（南）移动。 + */ + CursorAction.prototype.sResize = function () { + this.setCursor('s-resize'); + }; + /** + * 光标指示可移动的方向 右上方（东北） + */ + CursorAction.prototype.neResize = function () { + this.setCursor('ne-resize'); + }; + /** + * 光标指示可移动的方向 左上方（西北） + */ + CursorAction.prototype.nwResize = function () { + this.setCursor('nw-resize'); + }; + /** + * 光标指示可移动的方向右下方（东南） + */ + CursorAction.prototype.seResize = function () { + this.setCursor('se-resize'); + }; + /** + * 光标指示可移动的方向左下方（西南） + */ + CursorAction.prototype.swResize = function () { + this.setCursor('sw-resize'); + }; + /** + * 光标指示可以在上下方向移动 + */ + CursorAction.prototype.nsResize = function () { + this.setCursor('ns-resize'); + }; + /** + * 光标指示可以在左右方向移动 + */ + CursorAction.prototype.ewResize = function () { + this.setCursor('ew-resize'); + }; + return CursorAction; +}(Action$1)); + +/** + * 数据过滤。 + * @ignore + */ +var DataFilter = /** @class */ (function (_super) { + __extends$e(DataFilter, _super); + function DataFilter() { + return _super !== null && _super.apply(this, arguments) || this; + } + DataFilter.prototype.filterView = function (view, field, filter) { + var _this = this; + // 只有存在这个 scale 时才生效 + if (view.getScaleByField(field)) { + view.filter(field, filter); + } + if (view.views && view.views.length) { + each$2(view.views, function (subView) { + _this.filterView(subView, field, filter); + }); + } + }; + /** + * 过滤数据 + */ + DataFilter.prototype.filter = function () { + var delegateObject = getDelegationObject(this.context); + if (delegateObject) { + var view = this.context.view; + var component = delegateObject.component; + var field = component.get('field'); + // 列表类的组件能够触发 + if (isList(delegateObject)) { + if (field) { + var unCheckedItems = component.getItemsByState('unchecked'); + var scale_1 = getScaleByField(view, field); + var names_1 = unCheckedItems.map(function (item) { return item.name; }); + if (names_1.length) { + this.filterView(view, field, function (value) { + var text = scale_1.getText(value); + return !names_1.includes(text); + }); + } + else { + this.filterView(view, field, null); + } + view.render(true); + } + } + else if (isSlider(delegateObject)) { + var range = component.getValue(); + var min_1 = range[0], max_1 = range[1]; + this.filterView(view, field, function (value) { + return value >= min_1 && value <= max_1; + }); + view.render(true); + } + } + }; + return DataFilter; +}(Action$1)); + +// 获取对应的 scale +function getFilter(scale, dim, point1, point2) { + var min = Math.min(point1[dim], point2[dim]); + var max = Math.max(point1[dim], point2[dim]); + var _a = scale.range, rangeMin = _a[0], rangeMax = _a[1]; + // 约束值在 scale 的 range 之间 + if (min < rangeMin) { + min = rangeMin; + } + if (max > rangeMax) { + max = rangeMax; + } + // 范围大于整个 view 的范围，则返回 null + if (min === rangeMax && max === rangeMax) { + return null; + } + var minValue = scale.invert(min); + var maxValue = scale.invert(max); + if (scale.isCategory) { + var minIndex = scale.values.indexOf(minValue); + var maxIndex = scale.values.indexOf(maxValue); + var arr_1 = scale.values.slice(minIndex, maxIndex + 1); + return function (value) { + return arr_1.includes(value); + }; + } + else { + return function (value) { + return value >= minValue && value <= maxValue; + }; + } +} +/** range-filter 只用于：brush-filter, brush-x-filter, brush-y-filter */ +var EVENTS; +(function (EVENTS) { + EVENTS["FILTER"] = "brush-filter-processing"; + EVENTS["RESET"] = "brush-filter-reset"; + EVENTS["BEFORE_FILTER"] = "brush-filter:beforefilter"; + EVENTS["AFTER_FILTER"] = "brush-filter:afterfilter"; + EVENTS["BEFORE_RESET"] = "brush-filter:beforereset"; + EVENTS["AFTER_RESET"] = "brush-filter:afterreset"; +})(EVENTS || (EVENTS = {})); +/** + * 范围过滤的 Action + * @ignore + */ +var RangeFilter = /** @class */ (function (_super) { + __extends$e(RangeFilter, _super); + function RangeFilter() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** + * 范围过滤生效的字段/维度，可以是 x, y + */ + _this.dims = ['x', 'y']; + /** 起始点 */ + _this.startPoint = null; + _this.isStarted = false; + return _this; + } + // x,y 是否生效 + RangeFilter.prototype.hasDim = function (dim) { + return this.dims.includes(dim); + }; + /** + * 开始范围过滤，记录范围过滤的起点 + */ + RangeFilter.prototype.start = function () { + var context = this.context; + this.isStarted = true; + this.startPoint = context.getCurrentPoint(); + }; + /** + * 过滤，以开始的点和当前点对数据进行过滤 + */ + RangeFilter.prototype.filter = function () { + var startPoint; + var currentPoint; + if (isMask(this.context)) { + var maskShape = this.context.event.target; + var bbox = maskShape.getCanvasBBox(); + startPoint = { x: bbox.x, y: bbox.y }; + currentPoint = { x: bbox.maxX, y: bbox.maxY }; + } + else { + if (!this.isStarted) { + // 如果没有开始，则不执行过滤 + return; + } + startPoint = this.startPoint; + currentPoint = this.context.getCurrentPoint(); + } + if (Math.abs(startPoint.x - currentPoint.x) < 5 || Math.abs(startPoint.x - currentPoint.y) < 5) { + // 距离过小也不生效 + return; + } + var _a = this.context, view = _a.view, event = _a.event; + var payload = { view: view, event: event, dims: this.dims }; + view.emit(EVENTS.BEFORE_FILTER, Event$1.fromData(view, EVENTS.BEFORE_FILTER, payload)); + var coord = view.getCoordinate(); + var normalCurrent = coord.invert(currentPoint); + var normalStart = coord.invert(startPoint); + // 设置 x 方向的 filter + if (this.hasDim('x')) { + var xScale = view.getXScale(); + var filter = getFilter(xScale, 'x', normalCurrent, normalStart); + this.filterView(view, xScale.field, filter); + } + // 设置 y 方向的 filter + if (this.hasDim('y')) { + var yScale = view.getYScales()[0]; + var filter = getFilter(yScale, 'y', normalCurrent, normalStart); + this.filterView(view, yScale.field, filter); + } + this.reRender(view, { source: EVENTS.FILTER }); + view.emit(EVENTS.AFTER_FILTER, Event$1.fromData(view, EVENTS.AFTER_FILTER, payload)); + }; + /** + * 结束 + */ + RangeFilter.prototype.end = function () { + this.isStarted = false; + }; + /** + * 取消同当前 Action 相关的过滤，指定的 x,y + */ + RangeFilter.prototype.reset = function () { + var view = this.context.view; + view.emit(EVENTS.BEFORE_RESET, Event$1.fromData(view, EVENTS.BEFORE_RESET, {})); + this.isStarted = false; + if (this.hasDim('x')) { + var xScale = view.getXScale(); + this.filterView(view, xScale.field, null); // 取消过滤 + } + if (this.hasDim('y')) { + // y 轴过滤仅取第一个 yScale + var yScale = view.getYScales()[0]; + this.filterView(view, yScale.field, null); // 取消过滤 + } + this.reRender(view, { source: EVENTS.RESET }); + view.emit(EVENTS.AFTER_RESET, Event$1.fromData(view, EVENTS.AFTER_RESET, {})); + }; + /** + * 对 view 进行过滤 + */ + RangeFilter.prototype.filterView = function (view, field, filter) { + view.filter(field, filter); + }; + /** + * 重新渲染 + * @param view + */ + RangeFilter.prototype.reRender = function (view, payload) { + view.render(true, payload); + }; + return RangeFilter; +}(Action$1)); + +/** + * 数据范围过滤，但不在当前的 view 上生效，而在当前的 view 同一层级的其他 views 上生效，用于实现联动过滤。 + * @ignore + */ +var SiblingFilter$1 = /** @class */ (function (_super) { + __extends$e(SiblingFilter, _super); + function SiblingFilter() { + return _super !== null && _super.apply(this, arguments) || this; + } + /** + * 对 view 进行过滤 + * @param view + * @param field + * @param filter + */ + SiblingFilter.prototype.filterView = function (view, field, filter) { + var siblings = getSilbings(view); + each$2(siblings, function (sibling) { + sibling.filter(field, filter); + }); + }; + /** + * 重新渲染 + * @param view + */ + SiblingFilter.prototype.reRender = function (view) { + var siblings = getSilbings(view); + each$2(siblings, function (sibling) { + sibling.render(true); + }); + }; + return SiblingFilter; +}(RangeFilter)); + +/** + * 元素过滤的 Action，控制元素的显示隐藏 + * @ignore + */ +var ElementFilter = /** @class */ (function (_super) { + __extends$e(ElementFilter, _super); + function ElementFilter() { + return _super !== null && _super.apply(this, arguments) || this; + } + /** + * 过滤 + */ + ElementFilter.prototype.filter = function () { + var delegateObject = getDelegationObject(this.context); + var view = this.context.view; + var elements = getElements(view); + if (isMask(this.context)) { + var maskElements_1 = getMaskedElements(this.context, 10); + if (maskElements_1) { + each$2(elements, function (el) { + if (maskElements_1.includes(el)) { + el.show(); + } + else { + el.hide(); + } + }); + } + } + else if (delegateObject) { + var component = delegateObject.component; + var field_1 = component.get('field'); + // 列表类的组件能够触发 + if (isList(delegateObject)) { + if (field_1) { + var unCheckedItems = component.getItemsByState('unchecked'); + var scale_1 = getScaleByField(view, field_1); + var names_1 = unCheckedItems.map(function (item) { return item.name; }); + // 直接控制显示、隐藏 + each$2(elements, function (el) { + var value = getElementValue$1(el, field_1); + var text = scale_1.getText(value); + if (names_1.indexOf(text) >= 0) { + el.hide(); + } + else { + el.show(); + } + }); + } + } + else if (isSlider(delegateObject)) { + var range = component.getValue(); + var min_1 = range[0], max_1 = range[1]; + each$2(elements, function (el) { + var value = getElementValue$1(el, field_1); + if (value >= min_1 && value <= max_1) { + el.show(); + } + else { + el.hide(); + } + }); + } + } + }; + /** + * 清除过滤 + */ + ElementFilter.prototype.clear = function () { + var elements = getElements(this.context.view); + each$2(elements, function (el) { + el.show(); + }); + }; + /** + * 恢复发生的过滤，保持同 data-filter 命名的一致 + */ + ElementFilter.prototype.reset = function () { + this.clear(); + }; + return ElementFilter; +}(Action$1)); + +/** + * Sibling filter + * @ignore + */ +var SiblingFilter = /** @class */ (function (_super) { + __extends$e(SiblingFilter, _super); + function SiblingFilter() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.byRecord = false; + return _this; + } + /** + * 过滤隐藏图形 + */ + SiblingFilter.prototype.filter = function () { + // 仅考虑 mask 导致的过滤 + if (isMask(this.context)) { + if (this.byRecord) { + this.filterByRecord(); + } + else { + this.filterByBBox(); + } + } + }; + // 根据框选的记录来做过滤 + SiblingFilter.prototype.filterByRecord = function () { + var view = this.context.view; + var maskElements = getMaskedElements(this.context, 10); + if (!maskElements) { + return; + } + var xFiled = view.getXScale().field; + var yField = view.getYScales()[0].field; + var records = maskElements.map(function (el) { + return el.getModel().data; + }); + var siblings = getSilbings(view); + each$2(siblings, function (sibling) { + var elements = getElements(sibling); + each$2(elements, function (el) { + var record = el.getModel().data; + // records.includes(record) 不生效，应该是数据的引用被改了 + if (isInRecords(records, record, xFiled, yField)) { + el.show(); + } + else { + el.hide(); + } + }); + }); + }; + // 根据被框选的包围盒做过滤 + SiblingFilter.prototype.filterByBBox = function () { + var _this = this; + var view = this.context.view; + var siblings = getSilbings(view); + each$2(siblings, function (sibling) { + var maskElements = getSiblingMaskElements(_this.context, sibling, 10); + var elements = getElements(sibling); + if (maskElements) { + // mask 过小时返回为 null，不能是空数组，否则同未框选到混淆 + each$2(elements, function (el) { + if (maskElements.includes(el)) { + el.show(); + } + else { + el.hide(); + } + }); + } + }); + }; + /** + * 清理所有隐藏的图形 + */ + SiblingFilter.prototype.reset = function () { + var siblings = getSilbings(this.context.view); + each$2(siblings, function (sibling) { + var elements = getElements(sibling); + each$2(elements, function (el) { + el.show(); + }); + }); + }; + return SiblingFilter; +}(Action$1)); + +var PADDING_RIGHT$1 = 10; +var PADDING_TOP$2 = 5; +/** + * Button action + * @ignore + */ +var ButtonAction$1 = /** @class */ (function (_super) { + __extends$e(ButtonAction, _super); + function ButtonAction() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.buttonGroup = null; + _this.buttonCfg = { + name: 'button', + text: 'button', + textStyle: { + x: 0, + y: 0, + fontSize: 12, + fill: '#333333', + cursor: 'pointer', + }, + padding: [8, 10], + style: { + fill: '#f7f7f7', + stroke: '#cccccc', + cursor: 'pointer', + }, + activeStyle: { + fill: '#e6e6e6', + }, + }; + return _this; + } + // mix 默认的配置和用户配置 + ButtonAction.prototype.getButtonCfg = function () { + return deepMix(this.buttonCfg, this.cfg); + }; + // 绘制 Button 和 文本 + ButtonAction.prototype.drawButton = function () { + var config = this.getButtonCfg(); + var group = this.context.view.foregroundGroup.addGroup({ + name: config.name, + }); + // 添加文本 + var textShape = group.addShape({ + type: 'text', + name: 'button-text', + attrs: __assign$r({ text: config.text }, config.textStyle), + }); + var textBBox = textShape.getBBox(); + var padding = parsePadding(config.padding); + // 添加背景按钮 + var buttonShape = group.addShape({ + type: 'rect', + name: 'button-rect', + attrs: __assign$r({ x: textBBox.x - padding[3], y: textBBox.y - padding[0], width: textBBox.width + padding[1] + padding[3], height: textBBox.height + padding[0] + padding[2] }, config.style), + }); + buttonShape.toBack(); // 在后面 + // active 效果内置 + group.on('mouseenter', function () { + buttonShape.attr(config.activeStyle); + }); + group.on('mouseleave', function () { + buttonShape.attr(config.style); + }); + this.buttonGroup = group; + }; + // 重置位置 + ButtonAction.prototype.resetPosition = function () { + var view = this.context.view; + var coord = view.getCoordinate(); + var point = coord.convert({ x: 1, y: 1 }); // 后面直接改成左上角 + var buttonGroup = this.buttonGroup; + var bbox = buttonGroup.getBBox(); + var matrix = transform$i(null, [ + ['t', point.x - bbox.width - PADDING_RIGHT$1, point.y + bbox.height + PADDING_TOP$2], + ]); + buttonGroup.setMatrix(matrix); + }; + /** + * 显示 + */ + ButtonAction.prototype.show = function () { + if (!this.buttonGroup) { + this.drawButton(); + } + this.resetPosition(); + this.buttonGroup.show(); + }; + /** + * 隐藏 + */ + ButtonAction.prototype.hide = function () { + if (this.buttonGroup) { + this.buttonGroup.hide(); + } + }; + /** + * 销毁 + */ + ButtonAction.prototype.destroy = function () { + var buttonGroup = this.buttonGroup; + if (buttonGroup) { + buttonGroup.remove(); + } + _super.prototype.destroy.call(this); + }; + return ButtonAction; +}(Action$1)); + +var DISTANCE = 4; // 移动的最小距离 +/** + * @ignore + * View 支持 Drag 的 Action + */ +var Drag = /** @class */ (function (_super) { + __extends$e(Drag, _super); + function Drag() { + var _this = _super !== null && _super.apply(this, arguments) || this; + // Action 开始，不等同于 拖拽开始，需要判定移动的范围 + _this.starting = false; + // 拖拽开始 + _this.dragStart = false; + return _this; + } + /** + * 开始 + */ + Drag.prototype.start = function () { + this.starting = true; + this.startPoint = this.context.getCurrentPoint(); + }; + /** + * 拖拽 + */ + Drag.prototype.drag = function () { + if (!this.startPoint) { + return; + } + var current = this.context.getCurrentPoint(); + var view = this.context.view; + var event = this.context.event; + if (!this.dragStart) { + if (distance$6(current, this.startPoint) > DISTANCE) { + view.emit('dragstart', { + target: event.target, + x: event.x, + y: event.y, + }); + this.dragStart = true; + } + } + else { + view.emit('drag', { + target: event.target, + x: event.x, + y: event.y, + }); + } + }; + /** + * 结束 + */ + Drag.prototype.end = function () { + if (this.dragStart) { + var view = this.context.view; + var event_1 = this.context.event; + view.emit('dragend', { + target: event_1.target, + x: event_1.x, + y: event_1.y, + }); + } + this.starting = false; + this.dragStart = false; + }; + return Drag; +}(Action$1)); + +var MIN_DISTANCE = 5; +/** + * @ignore + * View 移动的 Action + */ +var Move = /** @class */ (function (_super) { + __extends$e(Move, _super); + function Move() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.starting = false; + _this.isMoving = false; + // private cacheRange = null; + _this.startPoint = null; + _this.startMatrix = null; + return _this; + } + /** + * 开始移动 + */ + Move.prototype.start = function () { + this.starting = true; + this.startPoint = this.context.getCurrentPoint(); + // 缓存开始时的矩阵，防止反复拖拽 + this.startMatrix = this.context.view.middleGroup.getMatrix(); + }; + /** + * 移动 + */ + Move.prototype.move = function () { + if (!this.starting) { + return; + } + var startPoint = this.startPoint; + var currentPoint = this.context.getCurrentPoint(); + var d = distance$6(startPoint, currentPoint); + if (d > MIN_DISTANCE && !this.isMoving) { + this.isMoving = true; + } + if (this.isMoving) { + var view = this.context.view; + var matrix = transform$i(this.startMatrix, [ + ['t', currentPoint.x - startPoint.x, currentPoint.y - startPoint.y], + ]); + view.backgroundGroup.setMatrix(matrix); + view.foregroundGroup.setMatrix(matrix); + view.middleGroup.setMatrix(matrix); + } + }; + /** + * 结束移动 + */ + Move.prototype.end = function () { + if (this.isMoving) { + this.isMoving = false; + } + this.startMatrix = null; + this.starting = false; + this.startPoint = null; + }; + /** + * 回滚 + */ + Move.prototype.reset = function () { + this.starting = false; + this.startPoint = null; + this.isMoving = false; + var view = this.context.view; + view.backgroundGroup.resetMatrix(); + view.foregroundGroup.resetMatrix(); + view.middleGroup.resetMatrix(); + this.isMoving = false; + }; + return Move; +}(Action$1)); + +var DIM_X = 'x'; +var DIM_Y = 'y'; +/** + * Scale translate + * @ignore + */ +var ScaleTranslate$2 = /** @class */ (function (_super) { + __extends$e(ScaleTranslate, _super); + function ScaleTranslate() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.dims = [DIM_X, DIM_Y]; + _this.cfgFields = ['dims']; + _this.cacheScaleDefs = {}; + return _this; + } + // 是否支持对应字段的平移 + ScaleTranslate.prototype.hasDim = function (dim) { + return this.dims.includes(dim); + }; + ScaleTranslate.prototype.getScale = function (dim) { + var view = this.context.view; + if (dim === 'x') { + return view.getXScale(); + } + else { + return view.getYScales()[0]; + } + }; + ScaleTranslate.prototype.resetDim = function (dim) { + var view = this.context.view; + if (this.hasDim(dim) && this.cacheScaleDefs[dim]) { + var scale = this.getScale(dim); + view.scale(scale.field, this.cacheScaleDefs[dim]); + this.cacheScaleDefs[dim] = null; + } + }; + /** + * 回滚 + */ + ScaleTranslate.prototype.reset = function () { + this.resetDim(DIM_X); + this.resetDim(DIM_Y); + var view = this.context.view; + view.render(true); + }; + return ScaleTranslate; +}(Action$1)); + +/** + * 拖拽 Scale 的 Action + * @ignore + */ +var ScaleTranslate$1 = /** @class */ (function (_super) { + __extends$e(ScaleTranslate, _super); + function ScaleTranslate() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.startPoint = null; + _this.starting = false; + _this.startCache = {}; + return _this; + } + /** + * 开始 + */ + ScaleTranslate.prototype.start = function () { + var _this = this; + this.startPoint = this.context.getCurrentPoint(); + this.starting = true; + var dims = this.dims; + each$2(dims, function (dim) { + var scale = _this.getScale(dim); + var min = scale.min, max = scale.max, values = scale.values; + _this.startCache[dim] = { min: min, max: max, values: values }; + }); + }; + // 平移分类的度量 + // private translateCategory(dim, scale, normalPoint) { + // } + /** + * 结束 + */ + ScaleTranslate.prototype.end = function () { + this.startPoint = null; + this.starting = false; + this.startCache = {}; + }; + /** + * 平移 + */ + ScaleTranslate.prototype.translate = function () { + var _this = this; + if (!this.starting) { + return; + } + var startPoint = this.startPoint; + var coord = this.context.view.getCoordinate(); + var currentPoint = this.context.getCurrentPoint(); + var normalStart = coord.invert(startPoint); + var noramlCurrent = coord.invert(currentPoint); + var dx = noramlCurrent.x - normalStart.x; + var dy = noramlCurrent.y - normalStart.y; + var view = this.context.view; + var dims = this.dims; + each$2(dims, function (dim) { + _this.translateDim(dim, { x: dx * -1, y: dy * -1 }); + }); + view.render(true); + }; + // 平移度量 + ScaleTranslate.prototype.translateDim = function (dim, normalPoint) { + if (this.hasDim(dim)) { + var scale = this.getScale(dim); + if (scale.isLinear) { + this.translateLinear(dim, scale, normalPoint); + } + // else { // 暂时仅处理连续字段 + // this.translateCategory(dim, scale, normalPoint); + // } + } + }; + // linear 度量平移 + ScaleTranslate.prototype.translateLinear = function (dim, scale, normalPoint) { + var view = this.context.view; + var _a = this.startCache[dim], min = _a.min, max = _a.max; + var range = max - min; + var d = normalPoint[dim] * range; + // 只有第一次缓存，否则无法回滚 + if (!this.cacheScaleDefs[dim]) { + this.cacheScaleDefs[dim] = { + // @ts-ignore + nice: scale.nice, + min: min, + max: max, + }; + } + view.scale(scale.field, { + // @ts-ignore + nice: false, + min: min + d, + max: max + d, + }); + }; + // 平移分类的度量 + // private translateCategory(dim, scale, normalPoint) { + // } + /** + * 回滚 + */ + ScaleTranslate.prototype.reset = function () { + _super.prototype.reset.call(this); + this.startPoint = null; + this.starting = false; + }; + return ScaleTranslate; +}(ScaleTranslate$2)); + +/** + * 缩放 Scale 的 Action + * @ignore + */ +var ScaleTranslate = /** @class */ (function (_super) { + __extends$e(ScaleTranslate, _super); + function ScaleTranslate() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.zoomRatio = 0.05; + return _this; + // 平移分类的度量 + // private translateCategory(dim, scale, normalPoint) { + // } + } + /** + * 缩小 + */ + ScaleTranslate.prototype.zoomIn = function () { + this.zoom(this.zoomRatio); + }; + ScaleTranslate.prototype.zoom = function (scale) { + var _this = this; + var dims = this.dims; + each$2(dims, function (dim) { + _this.zoomDim(dim, scale); + }); + this.context.view.render(true); + }; + /** + * 放大 + */ + ScaleTranslate.prototype.zoomOut = function () { + this.zoom(-1 * this.zoomRatio); + }; + // 缩放度量 + ScaleTranslate.prototype.zoomDim = function (dim, dRatio) { + if (this.hasDim(dim)) { + var scale = this.getScale(dim); + if (scale.isLinear) { + this.zoomLinear(dim, scale, dRatio); + } + // else { // 暂时仅处理连续字段 + // this.zoomCategory(dim, scale, normalPoint); + // } + } + }; + // linear 度量平移 + ScaleTranslate.prototype.zoomLinear = function (dim, scale, dRatio) { + var view = this.context.view; + // 只有第一次缓存，否则无法回滚 + if (!this.cacheScaleDefs[dim]) { + this.cacheScaleDefs[dim] = { + // @ts-ignore + nice: scale.nice, + min: scale.min, + max: scale.max, + }; + } + // 使用使用原始度量作为缩放标准 + var scaleDef = this.cacheScaleDefs[dim]; + var range = scaleDef.max - scaleDef.min; + var min = scale.min, max = scale.max; + var d = dRatio * range; + var toMin = min - d; + var toMax = max + d; + var curRange = toMax - toMin; + var scaled = curRange / range; + if (toMax > toMin && scaled < 100 && scaled > 0.01) { + view.scale(scale.field, { + // @ts-ignore + nice: false, + min: min - d, + max: max + d, + }); + } + }; + return ScaleTranslate; +}(ScaleTranslate$2)); + +// 注册黑暗主题 +registerTheme('dark', createThemeByStyleSheet(antvDark)); +registerEngine('canvas', CanvasEngine); +registerEngine('svg', SVGEngine); +registerGeometry('Polygon', Polygon); +registerGeometry('Interval', Interval); +registerGeometry('Schema', Schema); +registerGeometry('Path', Path); +registerGeometry('Point', Point$1); +registerGeometry('Line', Line$4); +registerGeometry('Area', Area$2); +registerGeometry('Edge', Edge$2); +registerGeometry('Heatmap', Heatmap$2); +registerGeometry('Violin', Violin$2); +registerGeometryLabel('base', GeometryLabel$1); +registerGeometryLabel('interval', IntervalLabel); +registerGeometryLabel('pie', PieLabel); +registerGeometryLabel('polar', PolarLabel); +registerGeometryLabelLayout('overlap', overlap); +registerGeometryLabelLayout('distribute', distribute); +registerGeometryLabelLayout('fixed-overlap', fixedOverlap); +registerGeometryLabelLayout('hide-overlap', hideOverlap); +registerGeometryLabelLayout('limit-in-shape', limitInShape); +registerGeometryLabelLayout('limit-in-canvas', limitInCanvas); +registerGeometryLabelLayout('limit-in-plot', limitInPlot$3); +registerGeometryLabelLayout('pie-outer', pieOuterLabelLayout); +registerGeometryLabelLayout('adjust-color', adjustColor); +registerGeometryLabelLayout('interval-adjust-position', intervalAdjustPosition); +registerGeometryLabelLayout('interval-hide-overlap', intervalHideOverlap); +registerGeometryLabelLayout('point-adjust-position', pointAdjustPosition); +registerGeometryLabelLayout('pie-spider', pieSpiderLabelLayout); +registerGeometryLabelLayout('path-adjust-position', pathAdjustPosition); +registerAnimation('fade-in', fadeIn); +registerAnimation('fade-out', fadeOut); +registerAnimation('grow-in-x', growInX); +registerAnimation('grow-in-xy', growInXY); +registerAnimation('grow-in-y', growInY); +registerAnimation('scale-in-x', scaleInX); +registerAnimation('scale-in-y', scaleInY); +registerAnimation('wave-in', waveIn); +registerAnimation('zoom-in', zoomIn); +registerAnimation('zoom-out', zoomOut); +registerAnimation('position-update', positionUpdate); +registerAnimation('sector-path-update', sectorPathUpdate); +registerAnimation('path-in', pathIn); +registerFacet('rect', Rect); +registerFacet('mirror', Mirror); +registerFacet('list', List$2); +registerFacet('matrix', Matrix$1); +registerFacet('circle', Circle); +registerFacet('tree', Tree); +// register build-in components +registerComponentController('axis', Axis); +registerComponentController('legend', Legend); +registerComponentController('tooltip', TooltipController); +registerComponentController('annotation', Annotation); +registerComponentController('slider', Slider); +registerComponentController('scrollbar', Scrollbar); +registerAction('tooltip', TooltipAction); +registerAction('sibling-tooltip', SiblingTooltip); +registerAction('ellipsis-text', EllipsisText); +registerAction('element-active', ElementActive); +registerAction('element-single-active', ElementSingleActive); +registerAction('element-range-active', ElementRangeActive); +registerAction('element-highlight', ElementHighlight); +registerAction('element-highlight-by-x', HighlightX); +registerAction('element-highlight-by-color', HighlightColor); +registerAction('element-single-highlight', ElementSingleHighlight); +registerAction('element-range-highlight', ElementRangeHighlight); +registerAction('element-sibling-highlight', ElementRangeHighlight, { + effectSiblings: true, + effectByRecord: true, +}); +registerAction('element-selected', ElementMultipleSelected); +registerAction('element-single-selected', ElementSingleSelected); +registerAction('element-range-selected', ElementRangeSelected); +registerAction('element-link-by-color', LinkByColor); +registerAction('active-region', ActiveRegion); +registerAction('list-active', ListActive); +registerAction('list-selected', ListSelected); +registerAction('list-highlight', ListHighlight); +registerAction('list-unchecked', ListUnchecked); +registerAction('list-checked', ListChecked); +registerAction('legend-item-highlight', ListHighlight, { + componentNames: ['legend'], +}); +registerAction('axis-label-highlight', ListHighlight, { + componentNames: ['axis'], +}); +registerAction('rect-mask', RectMask); +registerAction('x-rect-mask', DimRect, { dim: 'x' }); +registerAction('y-rect-mask', DimRect, { dim: 'y' }); +registerAction('circle-mask', CircleMask); +registerAction('path-mask', PathMask); +registerAction('smooth-path-mask', SmoothPathMask); +registerAction('cursor', CursorAction); +registerAction('data-filter', DataFilter); +registerAction('brush', RangeFilter); +registerAction('brush-x', RangeFilter, { dims: ['x'] }); +registerAction('brush-y', RangeFilter, { dims: ['y'] }); +registerAction('sibling-filter', SiblingFilter$1); +registerAction('sibling-x-filter', SiblingFilter$1); +registerAction('sibling-y-filter', SiblingFilter$1); +registerAction('element-filter', ElementFilter); +registerAction('element-sibling-filter', SiblingFilter); +registerAction('element-sibling-filter-record', SiblingFilter, { byRecord: true }); +registerAction('view-drag', Drag); +registerAction('view-move', Move); +registerAction('scale-translate', ScaleTranslate$1); +registerAction('scale-zoom', ScaleTranslate); +registerAction('reset-button', ButtonAction$1, { + name: 'reset-button', + text: 'reset', +}); +function isPointInView$1(context) { + return context.isInPlot(); +} +// 注册 tooltip 的 interaction +registerInteraction('tooltip', { + start: [ + { trigger: 'plot:mousemove', action: 'tooltip:show', throttle: { wait: 50, leading: true, trailing: false } }, + { trigger: 'plot:touchmove', action: 'tooltip:show', throttle: { wait: 50, leading: true, trailing: false } }, + ], + end: [ + { trigger: 'plot:mouseleave', action: 'tooltip:hide' }, + { trigger: 'plot:leave', action: 'tooltip:hide' }, + { trigger: 'plot:touchend', action: 'tooltip:hide' }, + ], +}); +registerInteraction('ellipsis-text', { + start: [ + { + trigger: 'legend-item-name:mousemove', + action: 'ellipsis-text:show', + throttle: { wait: 50, leading: true, trailing: false }, + }, + { + trigger: 'legend-item-name:touchstart', + action: 'ellipsis-text:show', + throttle: { wait: 50, leading: true, trailing: false }, + }, + { + trigger: 'axis-label:mousemove', + action: 'ellipsis-text:show', + throttle: { wait: 50, leading: true, trailing: false }, + }, + { + trigger: 'axis-label:touchstart', + action: 'ellipsis-text:show', + throttle: { wait: 50, leading: true, trailing: false }, + }, + ], + end: [ + { trigger: 'legend-item-name:mouseleave', action: 'ellipsis-text:hide' }, + { trigger: 'legend-item-name:touchend', action: 'ellipsis-text:hide' }, + { trigger: 'axis-label:mouseleave', action: 'ellipsis-text:hide' }, + { trigger: 'axis-label:touchend', action: 'ellipsis-text:hide' }, + ], +}); +// 移动到 element 上 active +registerInteraction('element-active', { + start: [{ trigger: 'element:mouseenter', action: 'element-active:active' }], + end: [{ trigger: 'element:mouseleave', action: 'element-active:reset' }], +}); +// 点击选中，允许取消 +registerInteraction('element-selected', { + start: [{ trigger: 'element:click', action: 'element-selected:toggle' }], +}); +// hover highlight，允许取消 +registerInteraction('element-highlight', { + start: [{ trigger: 'element:mouseenter', action: 'element-highlight:highlight' }], + end: [{ trigger: 'element:mouseleave', action: 'element-highlight:reset' }], +}); +// hover highlight by x，允许取消 +registerInteraction('element-highlight-by-x', { + start: [{ trigger: 'element:mouseenter', action: 'element-highlight-by-x:highlight' }], + end: [{ trigger: 'element:mouseleave', action: 'element-highlight-by-x:reset' }], +}); +// hover highlight by y，允许取消 +registerInteraction('element-highlight-by-color', { + start: [{ trigger: 'element:mouseenter', action: 'element-highlight-by-color:highlight' }], + end: [{ trigger: 'element:mouseleave', action: 'element-highlight-by-color:reset' }], +}); +// legend hover，element active +registerInteraction('legend-active', { + start: [{ trigger: 'legend-item:mouseenter', action: ['list-active:active', 'element-active:active'] }], + end: [{ trigger: 'legend-item:mouseleave', action: ['list-active:reset', 'element-active:reset'] }], +}); +// legend hover，element active +registerInteraction('legend-highlight', { + start: [ + { trigger: 'legend-item:mouseenter', action: ['legend-item-highlight:highlight', 'element-highlight:highlight'] }, + ], + end: [{ trigger: 'legend-item:mouseleave', action: ['legend-item-highlight:reset', 'element-highlight:reset'] }], +}); +// legend hover，element active +registerInteraction('axis-label-highlight', { + start: [ + { trigger: 'axis-label:mouseenter', action: ['axis-label-highlight:highlight', 'element-highlight:highlight'] }, + ], + end: [{ trigger: 'axis-label:mouseleave', action: ['axis-label-highlight:reset', 'element-highlight:reset'] }], +}); +// legend hover，element active +registerInteraction('element-list-highlight', { + start: [{ trigger: 'element:mouseenter', action: ['list-highlight:highlight', 'element-highlight:highlight'] }], + end: [{ trigger: 'element:mouseleave', action: ['list-highlight:reset', 'element-highlight:reset'] }], +}); +// 框选 +registerInteraction('element-range-highlight', { + showEnable: [ + { trigger: 'plot:mouseenter', action: 'cursor:crosshair' }, + { trigger: 'mask:mouseenter', action: 'cursor:move' }, + { trigger: 'plot:mouseleave', action: 'cursor:default' }, + { trigger: 'mask:mouseleave', action: 'cursor:crosshair' }, + ], + start: [ + { + trigger: 'plot:mousedown', + isEnable: function (context) { + // 不要点击在 mask 上重新开始 + return !context.isInShape('mask'); + }, + action: ['rect-mask:start', 'rect-mask:show'], + }, + { + trigger: 'mask:dragstart', + action: ['rect-mask:moveStart'], + }, + ], + processing: [ + { + trigger: 'plot:mousemove', + action: ['rect-mask:resize'], + }, + { + trigger: 'mask:drag', + action: ['rect-mask:move'], + }, + { + trigger: 'mask:change', + action: ['element-range-highlight:highlight'], + }, + ], + end: [ + { trigger: 'plot:mouseup', action: ['rect-mask:end'] }, + { trigger: 'mask:dragend', action: ['rect-mask:moveEnd'] }, + { + trigger: 'document:mouseup', + isEnable: function (context) { + return !context.isInPlot(); + }, + action: ['element-range-highlight:clear', 'rect-mask:end', 'rect-mask:hide'], + }, + ], + rollback: [{ trigger: 'dblclick', action: ['element-range-highlight:clear', 'rect-mask:hide'] }], +}); +registerInteraction('brush', { + showEnable: [ + { trigger: 'plot:mouseenter', action: 'cursor:crosshair' }, + { trigger: 'plot:mouseleave', action: 'cursor:default' }, + ], + start: [ + { + trigger: 'mousedown', + isEnable: isPointInView$1, + action: ['brush:start', 'rect-mask:start', 'rect-mask:show'], + }, + ], + processing: [ + { + trigger: 'mousemove', + isEnable: isPointInView$1, + action: ['rect-mask:resize'], + }, + ], + end: [ + { + trigger: 'mouseup', + isEnable: isPointInView$1, + action: ['brush:filter', 'brush:end', 'rect-mask:end', 'rect-mask:hide', 'reset-button:show'], + }, + ], + rollback: [{ trigger: 'reset-button:click', action: ['brush:reset', 'reset-button:hide', 'cursor:crosshair'] }], +}); +registerInteraction('brush-visible', { + showEnable: [ + { trigger: 'plot:mouseenter', action: 'cursor:crosshair' }, + { trigger: 'plot:mouseleave', action: 'cursor:default' }, + ], + start: [ + { + trigger: 'plot:mousedown', + action: ['rect-mask:start', 'rect-mask:show'], + }, + ], + processing: [ + { + trigger: 'plot:mousemove', + action: ['rect-mask:resize'], + }, + { trigger: 'mask:change', action: ['element-range-highlight:highlight'] }, + ], + end: [ + { + trigger: 'plot:mouseup', + action: ['rect-mask:end', 'rect-mask:hide', 'element-filter:filter', 'element-range-highlight:clear'], + }, + ], + rollback: [ + { + trigger: 'dblclick', + action: ['element-filter:clear'], + }, + ], +}); +registerInteraction('brush-x', { + showEnable: [ + { trigger: 'plot:mouseenter', action: 'cursor:crosshair' }, + { trigger: 'plot:mouseleave', action: 'cursor:default' }, + ], + start: [ + { + trigger: 'mousedown', + isEnable: isPointInView$1, + action: ['brush-x:start', 'x-rect-mask:start', 'x-rect-mask:show'], + }, + ], + processing: [ + { + trigger: 'mousemove', + isEnable: isPointInView$1, + action: ['x-rect-mask:resize'], + }, + ], + end: [ + { + trigger: 'mouseup', + isEnable: isPointInView$1, + action: ['brush-x:filter', 'brush-x:end', 'x-rect-mask:end', 'x-rect-mask:hide'], + }, + ], + rollback: [{ trigger: 'dblclick', action: ['brush-x:reset'] }], +}); +registerInteraction('element-path-highlight', { + showEnable: [ + { trigger: 'plot:mouseenter', action: 'cursor:crosshair' }, + { trigger: 'plot:mouseleave', action: 'cursor:default' }, + ], + start: [ + { trigger: 'mousedown', isEnable: isPointInView$1, action: 'path-mask:start' }, + { trigger: 'mousedown', isEnable: isPointInView$1, action: 'path-mask:show' }, + ], + processing: [{ trigger: 'mousemove', action: 'path-mask:addPoint' }], + end: [{ trigger: 'mouseup', action: 'path-mask:end' }], + rollback: [{ trigger: 'dblclick', action: 'path-mask:hide' }], +}); +// 点击选中，允许取消 +registerInteraction('element-single-selected', { + start: [{ trigger: 'element:click', action: 'element-single-selected:toggle' }], +}); +// 筛选数据 +registerInteraction('legend-filter', { + showEnable: [ + { trigger: 'legend-item:mouseenter', action: 'cursor:pointer' }, + { trigger: 'legend-item:mouseleave', action: 'cursor:default' }, + ], + start: [{ trigger: 'legend-item:click', action: ['list-unchecked:toggle', 'data-filter:filter'] }], +}); +// 筛选数据 +registerInteraction('continuous-filter', { + start: [{ trigger: 'legend:valuechanged', action: 'data-filter:filter' }], +}); +// 筛选数据 +registerInteraction('continuous-visible-filter', { + start: [{ trigger: 'legend:valuechanged', action: 'element-filter:filter' }], +}); +// 筛选图形 +registerInteraction('legend-visible-filter', { + showEnable: [ + { trigger: 'legend-item:mouseenter', action: 'cursor:pointer' }, + { trigger: 'legend-item:mouseleave', action: 'cursor:default' }, + ], + start: [{ trigger: 'legend-item:click', action: ['list-unchecked:toggle', 'element-filter:filter'] }], +}); +// 出现背景框 +registerInteraction('active-region', { + start: [{ trigger: 'plot:mousemove', action: 'active-region:show' }], + end: [{ trigger: 'plot:mouseleave', action: 'active-region:hide' }], +}); +function isWheelDown(event) { + event.gEvent.preventDefault(); + return event.gEvent.originalEvent.deltaY > 0; +} +registerInteraction('view-zoom', { + start: [ + { + trigger: 'plot:mousewheel', + isEnable: function (context) { + return isWheelDown(context.event); + }, + action: 'scale-zoom:zoomOut', + throttle: { wait: 100, leading: true, trailing: false }, + }, + { + trigger: 'plot:mousewheel', + isEnable: function (context) { + return !isWheelDown(context.event); + }, + action: 'scale-zoom:zoomIn', + throttle: { wait: 100, leading: true, trailing: false }, + }, + ], +}); +registerInteraction('sibling-tooltip', { + start: [{ trigger: 'plot:mousemove', action: 'sibling-tooltip:show' }], + end: [{ trigger: 'plot:mouseleave', action: 'sibling-tooltip:hide' }], +}); + +var G2 = /*#__PURE__*/Object.freeze({ + __proto__: null, + get BRUSH_FILTER_EVENTS () { return EVENTS; }, + get ELEMENT_RANGE_HIGHLIGHT_EVENTS () { return EVENTS$1; }, + get VIEW_LIFE_CIRCLE () { return VIEW_LIFE_CIRCLE; }, + Chart: Chart$2, + View: View$2, + Event: Event$1, + ComponentController: Controller, + TooltipController: TooltipController, + Geometry: Geometry$2, + Element: Element$2, + GeometryLabel: GeometryLabel$1, + Interaction: Interaction$1, + Action: Action$1, + Facet: Facet$2, + InteractionAction: Action$1, + registerComponentController: registerComponentController, + registerGeometry: registerGeometry, + registerShape: registerShape, + registerShapeFactory: registerShapeFactory, + getShapeFactory: getShapeFactory, + registerGeometryLabel: registerGeometryLabel, + registerGeometryLabelLayout: registerGeometryLabelLayout, + getGeometryLabel: getGeometryLabel, + getGeometryLabelLayout: getGeometryLabelLayout, + getInteraction: getInteraction, + registerInteraction: registerInteraction, + registerAction: registerAction, + getActionClass: getActionClass, + getFacet: getFacet, + registerFacet: registerFacet, + getTheme: getTheme, + registerTheme: registerTheme, + registerEngine: registerEngine, + getEngine: getEngine, + registerAnimation: registerAnimation, + getAnimation: getAnimation, + get LAYER () { return LAYER; }, + get DIRECTION () { return DIRECTION; }, + Coordinate: Coordinate$1, + Scale: Base$2, + VERSION: VERSION, + Util: Util$1 +}); + +/** + * 类似 lodash.flow 的方法 + * @param flows + */ +function flow() { + var flows = []; + for (var _i = 0; _i < arguments.length; _i++) { + flows[_i] = arguments[_i]; + } + return function (param) { + return flows.reduce(function (result, f) { + return f(result); + }, param); + }; +} + +/** + * 类似 lodash.pick 的方法 + * @param obj + * @param keys + */ +function pick$1(obj, keys) { + var r = {}; + if (obj !== null && typeof obj === 'object') { + keys.forEach(function (key) { + var v = obj[key]; + if (v !== undefined) { + r[key] = v; + } + }); + } + return r; +} + +/** + * 简单的模板引擎，使用方式如下（空格自动忽略）： + * template('hello, {name}', { name: 'AntV' }); // hello, AntV + * @param string + * @param options + */ +function template(source, data) { + if (!data) { + return source; + } + return reduce$1( + // @ts-ignore + data, function (r, v, k) { return r.replace(new RegExp("{\\s*" + k + "\\s*}", 'g'), v); }, source); +} + +/** + * Simplified from https://github.com/zertosh/invariant. + */ +var LEVEL; +(function (LEVEL) { + LEVEL["ERROR"] = "error"; + LEVEL["WARN"] = "warn"; + LEVEL["INFO"] = "log"; +})(LEVEL || (LEVEL = {})); +var BRAND = 'AntV/G2Plot'; +/** + * 获取错误消息 + * @param format + * @param args + */ +function getMessage(format) { + var args = []; + for (var _i = 1; _i < arguments.length; _i++) { + args[_i - 1] = arguments[_i]; + } + var argIndex = 0; + return BRAND + ": " + format.replace(/%s/g, function () { return "" + args[argIndex++]; }); +} +/** + * 打印语句 + * @param level + * @param condition + * @param format + * @param args + */ +function log(level, condition, format) { + var args = []; + for (var _i = 3; _i < arguments.length; _i++) { + args[_i - 3] = arguments[_i]; + } + if (!condition) { + console[level](getMessage.apply(void 0, __spreadArrays$1([format], args))); + } +} + +/** + * get the element's bounding size + * @param ele dom element + * @returns the element width and height + */ +function getContainerSize(ele) { + if (!ele) { + return { width: 0, height: 0 }; + } + var style = getComputedStyle(ele); + return { + width: (ele.clientWidth || parseInt(style.width, 10)) - + parseInt(style.paddingLeft, 10) - + parseInt(style.paddingRight, 10), + height: (ele.clientHeight || parseInt(style.height, 10)) - + parseInt(style.paddingTop, 10) - + parseInt(style.paddingBottom, 10), + }; +} + +/** + * 在 View 中查找第一个指定 type 类型的 geometry + * @param view + * @param type + */ +function findGeometry(view, type) { + return view.geometries.find(function (g) { return g.type === type; }); +} +/** + * 获取 View 的 所有 elements + */ +function getAllElements(view) { + return reduce$1(view.geometries, function (r, geometry) { + return r.concat(geometry.elements); + }, []); +} +/** + * 递归获取 View 的 所有 elements, 包括 View 的子 View + */ +function getAllElementsRecursively(view) { + if (get$3(view, ['views', 'length'], 0) <= 0) { + return getAllElements(view); + } + return reduce$1(view.views, function (ele, subView) { + return ele.concat(getAllElementsRecursively(subView)); + }, getAllElements(view)); +} +/** + * 递归获取 View 的 所有 geometries, 包括 View 的子 View + */ +function getAllGeometriesRecursively(view) { + if (get$3(view, ['views', 'length'], 0) <= 0) { + return view.geometries; + } + return reduce$1(view.views, function (ele, subView) { + return ele.concat(subView.geometries); + }, view.geometries); +} + +/** + * 在 Chart 中查找特定 id 的子 View + * @param chart + * @param id + */ +function findViewById(chart, id) { + return chart.views.find(function (view) { return view.id === id; }); +} +/** + * 获取同 view 同一级的所有 views + * @param view 当前 view + * @returns 同一级的 views + * @ignore + */ +function getViews(view) { + var parent = view.parent; + return parent ? parent.views : []; +} +/** + * 获取同 view 同一级的 views，不包括自身 + * @param view 当前 view + * @returns 同一级的 views + * @ignore + */ +function getSiblingViews(view) { + return getViews(view).filter(function (sub) { return sub !== view; }); +} + +/** + * 兼容 v1 label formatter + * @param labelOptions + */ +function transformLabel(labelOptions) { + if (!isType$3(labelOptions, 'Object')) { + return labelOptions; + } + var label = __assign$r({}, labelOptions); + if (label.formatter && !label.content) { + label.content = label.formatter; + } + return label; +} + +function points2Path(points, isInCircle) { + var path = []; + if (points.length) { + path.push(['M', points[0].x, points[0].y]); + for (var i = 1, length_1 = points.length; i < length_1; i += 1) { + var item = points[i]; + path.push(['L', item.x, item.y]); + } + if (isInCircle) { + path.push(['Z']); + } + } + return path; +} +/** + * @ignore + * 计算光滑的贝塞尔曲线 + */ +var smoothBezier = function (points, smooth, isLoop, constraint) { + var cps = []; + var prevPoint; + var nextPoint; + var hasConstraint = !!constraint; + var min; + var max; + if (hasConstraint) { + min = [Infinity, Infinity]; + max = [-Infinity, -Infinity]; + for (var i = 0, l = points.length; i < l; i++) { + var point = points[i]; + min = min$5([0, 0], min, point); + max = max$6([0, 0], max, point); + } + min = min$5([0, 0], min, constraint[0]); + max = max$6([0, 0], max, constraint[1]); + } + for (var i = 0, len = points.length; i < len; i++) { + var point = points[i]; + if (isLoop) { + prevPoint = points[i ? i - 1 : len - 1]; + nextPoint = points[(i + 1) % len]; + } + else { + if (i === 0 || i === len - 1) { + cps.push(point); + continue; + } + else { + prevPoint = points[i - 1]; + nextPoint = points[i + 1]; + } + } + var v = [0, 0]; + v = sub$1(v, nextPoint, prevPoint); + v = scale$4(v, v, smooth); + var d0 = distance$a(point, prevPoint); + var d1 = distance$a(point, nextPoint); + var sum = d0 + d1; + if (sum !== 0) { + d0 /= sum; + d1 /= sum; + } + var v1 = scale$4([0, 0], v, -d0); + var v2 = scale$4([0, 0], v, d1); + var cp0 = add$3([0, 0], point, v1); + var cp1 = add$3([0, 0], point, v2); + if (hasConstraint) { + cp0 = max$6([0, 0], cp0, min); + cp0 = min$5([0, 0], cp0, max); + cp1 = max$6([0, 0], cp1, min); + cp1 = min$5([0, 0], cp1, max); + } + cps.push(cp0); + cps.push(cp1); + } + if (isLoop) { + cps.push(cps.shift()); + } + return cps; +}; +/** + * @ignore + * 贝塞尔曲线 + */ +function catmullRom2bezier(crp, z, constraint) { + var isLoop = !!z; + var pointList = []; + for (var i = 0, l = crp.length; i < l; i += 2) { + pointList.push([crp[i], crp[i + 1]]); + } + var controlPointList = smoothBezier(pointList, 0.4, isLoop, constraint); + var len = pointList.length; + var d1 = []; + var cp1; + var cp2; + var p; + for (var i = 0; i < len - 1; i++) { + cp1 = controlPointList[i * 2]; + cp2 = controlPointList[i * 2 + 1]; + p = pointList[i + 1]; + d1.push(['C', cp1[0], cp1[1], cp2[0], cp2[1], p[0], p[1]]); + } + if (isLoop) { + cp1 = controlPointList[len]; + cp2 = controlPointList[len + 1]; + p = pointList[0]; + d1.push(['C', cp1[0], cp1[1], cp2[0], cp2[1], p[0], p[1]]); + } + return d1; +} +/** + * @ignore + * 根据关键点获取限定了范围的平滑线 + */ +function getSplinePath(points, isInCircle, constaint) { + var data = []; + var first = points[0]; + var prePoint = null; + if (points.length <= 2) { + // 两点以内直接绘制成路径 + return points2Path(points, isInCircle); + } + for (var i = 0, len = points.length; i < len; i++) { + var point = points[i]; + if (!prePoint || !(prePoint.x === point.x && prePoint.y === point.y)) { + data.push(point.x); + data.push(point.y); + prePoint = point; + } + } + var constraint = constaint || [ + // 范围 + [0, 0], + [1, 1], + ]; + var splinePath = catmullRom2bezier(data, isInCircle, constraint); + splinePath.unshift(['M', first.x, first.y]); + return splinePath; +} + +var MAX_MIX_LEVEL = 5; // 最大比对层级 +var toString$5 = {}.toString; +// 类型检测 +var isType$2 = function (value, type) { return toString$5.call(value) === '[object ' + type + ']'; }; +var isArray$m = function (value) { + return isType$2(value, 'Array'); +}; +var isObjectLike$e = function (value) { + /** + * isObjectLike({}) => true + * isObjectLike([1, 2, 3]) => true + * isObjectLike(Function) => false + */ + return typeof value === 'object' && value !== null; +}; +var isPlainObject$2 = function (value) { + /** + * isObjectLike(new Foo) => false + * isObjectLike([1, 2, 3]) => false + * isObjectLike({ x: 0, y: 0 }) => true + */ + if (!isObjectLike$e(value) || !isType$2(value, 'Object')) { + return false; + } + var proto = value; + while (Object.getPrototypeOf(proto) !== null) { + proto = Object.getPrototypeOf(proto); + } + return Object.getPrototypeOf(value) === proto; +}; +/*** + * @param {any} dist + * @param {any} src + * @param {number} level 当前层级 + * @param {number} maxLevel 最大层级 + */ +var deep = function (dist, src, level, maxLevel) { + level = level || 0; + maxLevel = maxLevel || MAX_MIX_LEVEL; + for (var key in src) { + if (Object.prototype.hasOwnProperty.call(src, key)) { + var value = src[key]; + if (!value) { + // null 、 undefined 等情况直接赋值 + dist[key] = value; + } + else { + if (isPlainObject$2(value)) { + if (!isPlainObject$2(dist[key])) { + dist[key] = {}; + } + if (level < maxLevel) { + deep(dist[key], value, level + 1, maxLevel); + } + else { + // 层级过深直接赋值，性能问题 + dist[key] = src[key]; + } + } + else if (isArray$m(value)) { + dist[key] = []; + dist[key] = dist[key].concat(value); + } + else { + dist[key] = value; + } + } + } + } +}; +/** + * deepAssign 功能类似 deepMix + * 不同点在于 deepAssign 会将 null undefined 等类型直接覆盖给 source + * 详细参考： __tests__/unit/utils/deep-assign-spec.ts + */ +var deepAssign = function (rst) { + var args = []; + for (var _i = 1; _i < arguments.length; _i++) { + args[_i - 1] = arguments[_i]; + } + for (var i = 0; i < args.length; i += 1) { + deep(rst, args[i]); + } + return rst; +}; + +/** + * @desc simple kebabCase like lodash + * + * kebabCase('fooBar'); => 'foo-bar' + */ +function kebabCase(word) { + if (!word) { + return word; + } + var result = word.match(/(([A-Z]{0,1}[a-z]*[^A-Z])|([A-Z]{1}))/g); + return result.map(function (s) { return s.toLowerCase(); }).join('-'); +} + +/** + * @desc 生成 html-statistic 的 style 字符串 (兼容 canvas 的 shapeStyle 到 css样式上) + * + * @param width + * @param style + */ +function adapteStyle(style) { + var styleObject = { + overflow: 'hidden', + 'white-space': 'nowrap', + 'text-overflow': 'ellipsis', + display: 'flex', + justifyContent: 'center', + alignItems: 'center', + }; + var shapeStyleKeys = [ + 'stroke', + 'lineWidth', + 'shadowColor', + 'strokeOpacity', + 'shadowBlur', + 'shadowOffsetX', + 'shadowOffsetY', + 'fill', + ]; + // 兼容 shapeStyle 设置 · start + if (get$3(style, 'fill')) { + styleObject['color'] = style['fill']; + } + var _a = pick$1(style, shapeStyleKeys), shadowColor = _a.shadowColor, _b = _a.shadowBlur, shadowBlur = _b === void 0 ? 0 : _b, _c = _a.shadowOffsetX, shadowOffsetX = _c === void 0 ? 0 : _c, _d = _a.shadowOffsetY, shadowOffsetY = _d === void 0 ? 0 : _d; + styleObject['text-shadow'] = "" + [shadowColor, shadowOffsetX + "px", shadowOffsetY + "px", shadowBlur + "px"].join(' '); + var _e = pick$1(style, shapeStyleKeys), stroke = _e.stroke, _f = _e.lineWidth, lineWidth = _f === void 0 ? 0 : _f; + styleObject['-webkit-text-stroke'] = "" + [lineWidth + "px", stroke].join(' '); + // 兼容 shapeStyle 设置 · end + each$2(style, function (v, k) { + // 兼容 shapeStyle 的 fontSize 没有单位 + if (['fontSize'].includes(k) && isNumber$4(v)) { + styleObject[kebabCase(k)] = v + "px"; + } + else if (k && !shapeStyleKeys.includes(k)) { + styleObject[kebabCase(k)] = "" + v; + } + }); + return styleObject; +} +/** + * @desc 设置 html-statistic 容器的默认样式 + * + * - 默认事件穿透 + */ +function setStatisticContainerStyle(container, style) { + container.style['pointer-events'] = 'none'; + each$2(style, function (v, k) { + if (k && v) { + container.style[k] = v; + } + }); +} +/** + * 渲染环图 html-annotation（默认 position 居中 [50%, 50%]） + * @param chart + * @param options + * @param meta 字段元信息 + * @param {optional} datum 当前的元数据 + */ +var renderStatistic = function (chart, options, datum) { + var statistic = options.statistic, plotType = options.plotType; + var titleOpt = statistic.title, contentOpt = statistic.content; + [titleOpt, contentOpt].forEach(function (option, idx) { + if (!option) { + return; + } + var transform = ''; + if (idx === 0) { + transform = contentOpt ? 'translate(-50%, -100%)' : 'translate(-50%, -50%)'; + } + else { + transform = titleOpt ? 'translate(-50%, 0)' : 'translate(-50%, -50%)'; + } + var style = isFunction$6(option.style) ? option.style(datum) : option.style; + chart.annotation().html(__assign$r({ position: ['50%', '50%'], html: function (container, view) { + var coordinate = view.getCoordinate(); + var containerW = 0; + if (plotType === 'pie' || plotType === 'ring-progress') { + containerW = coordinate.getRadius() * coordinate.innerRadius * 2; + } + else if (plotType === 'liquid') { + var liquidShape = get$3(view.geometries, [0, 'elements', 0, 'shape']); + if (liquidShape) { + // 获取到水波图边框大小 + var path = liquidShape.find(function (t) { return t.get('name') === 'wrap'; }); + var width = path.getCanvasBBox().width; + containerW = width; + } + } + else if (!containerW) { + // 保底方案 + containerW = coordinate.getWidth(); + } + setStatisticContainerStyle(container, __assign$r({ width: containerW + "px", transform: transform }, adapteStyle(style))); + var filteredData = view.getData(); + if (option.customHtml) { + return option.customHtml(container, view, datum, filteredData); + } + var text = option.content; + if (option.formatter) { + text = option.formatter(datum, filteredData); + } + // todo G2 层修复可以返回空字符串 & G2 层修复允许返回非字符串的内容，比如数值 number + return text ? (isString$3(text) ? text : "" + text) : '
    '; + }, + // @ts-ignore + key: (idx === 0 ? 'top' : 'bottom') + "-statistic" }, pick$1(option, ['offsetX', 'offsetY', 'rotate', 'style', 'formatter']) /** 透传配置 */)); + }); +}; +/** + * 渲染 html-annotation for gauge (等不规则 plot), 默认 position 居中居底 [50%, 100%]） + * @param chart + * @param options + * @param meta 字段元信息 + * @param {optional} datum 当前的元数据 + */ +var renderGaugeStatistic = function (chart, options, datum) { + var statistic = options.statistic; + var titleOpt = statistic.title, contentOpt = statistic.content; + [titleOpt, contentOpt].forEach(function (option) { + if (!option) { + return; + } + var style = isFunction$6(option.style) ? option.style(datum) : option.style; + chart.annotation().html(__assign$r({ position: ['50%', '100%'], html: function (container, view) { + var coordinate = view.getCoordinate(); + // 弧形的坐标 + var polarCoord = view.views[0].getCoordinate(); + var polarCenter = polarCoord.getCenter(); + var polarRadius = polarCoord.getRadius(); + var polarMaxY = Math.max(Math.sin(polarCoord.startAngle), Math.sin(polarCoord.endAngle)) * polarRadius; + var offsetY = polarCenter.y + polarMaxY - coordinate.y.start - parseFloat(get$3(style, 'fontSize', 0)); + var containerWidth = coordinate.getRadius() * coordinate.innerRadius * 2; + setStatisticContainerStyle(container, __assign$r({ width: containerWidth + "px", transform: "translate(-50%, " + offsetY + "px)" }, adapteStyle(style))); + var filteredData = view.getData(); + if (option.customHtml) { + return option.customHtml(container, view, datum, filteredData); + } + var text = option.content; + if (option.formatter) { + text = option.formatter(datum, filteredData); + } + // todo G2 层修复可以返回空字符串 & G2 层修复允许返回非字符串的内容，比如数值 number + return text ? (isString$3(text) ? text : "" + text) : '
    '; + } }, pick$1(option, ['offsetX', 'offsetY', 'rotate', 'style', 'formatter']) /** 透传配置 */)); + }); +}; + +var ctx; +/** + * 获取 canvas context + */ +function getCanvasContext() { + if (!ctx) { + ctx = document.createElement('canvas').getContext('2d'); + } + return ctx; +} + +/** + * 计算文本在画布中的宽度 + * @param text 文本 + * @param font 字体 + */ +var measureTextWidth = memoize$2(function (text, font) { + if (font === void 0) { font = {}; } + var fontSize = font.fontSize, _a = font.fontFamily, fontFamily = _a === void 0 ? 'sans-serif' : _a, fontWeight = font.fontWeight, fontStyle = font.fontStyle, fontVariant = font.fontVariant; + var ctx = getCanvasContext(); + // @see https://developer.mozilla.org/zh-CN/docs/Web/CSS/font + ctx.font = [fontStyle, fontWeight, fontVariant, fontSize + "px", fontFamily].join(' '); + var metrics = ctx.measureText(isString$3(text) ? text : ''); + return metrics.width; +}, function (text, font) { + if (font === void 0) { font = {}; } + return __spreadArrays$1([text], values$1(font)).join(''); +}); + +/** + * 是否真实的是数字 + * @param v + */ +function isRealNumber(v) { + return typeof v === 'number' && !isNaN(v); +} +/** + * @ignore + * Determines whether between is + * @param value + * @param start + * @param end + * @returns true if between + */ +function isBetween$1(value, start, end) { + var min = Math.min(start, end); + var max = Math.max(start, end); + return value >= min && value <= max; +} + +/** + * 查看数据是否是全负数、或者全正数 + * @param data + * @param field + */ +function adjustYMetaByZero(data, field) { + // 过滤出数字数据 + var numberData = data.filter(function (datum) { + var v = get$3(datum, [field]); + return isNumber$4(v) && !isNaN(v); + }); + var gtZero = numberData.every(function (datum) { return get$3(datum, [field]) >= 0; }); + var ltZero = numberData.every(function (datum) { return get$3(datum, [field]) <= 0; }); + // 目前是增量更新，对 { min: 0, max: undefined } 进行 update({ max: 0 }) 会得到 { min: 0, max: 0 } + if (gtZero) { + return { min: 0 }; + } + if (ltZero) { + return { max: 0 }; + } + return {}; +} +/** + * 转换数据格式为带有节点与边的数据格式 + * @param data + * @param sourceField + * @param targetField + * @param weightField + * @param rawFields 存放一些原数据 + */ +function transformDataToNodeLinkData(data, sourceField, targetField, weightField, rawFields) { + if (rawFields === void 0) { rawFields = []; } + if (!Array.isArray(data)) { + return { + nodes: [], + links: [], + }; + } + // const nodes = []; + var links = []; + // 先使用对象方式存储 + var nodesMap = {}; + var nodesIndex = -1; + // 数组变换成 chord layout 的数据结构 + data.forEach(function (datum) { + var source = datum[sourceField]; + var target = datum[targetField]; + var weight = datum[weightField]; + var rawData = pick$1(datum, rawFields); + // source node + if (!nodesMap[source]) { + nodesMap[source] = __assign$r({ id: ++nodesIndex, name: source }, rawData); + } + if (!nodesMap[target]) { + nodesMap[target] = __assign$r({ id: ++nodesIndex, name: target }, rawData); + } + // links + links.push(__assign$r({ source: nodesMap[source].id, target: nodesMap[target].id, + // sourceName: source, + // targetName: target, + value: weight }, rawData)); + }); + return { + nodes: Object.values(nodesMap), + links: links, + }; +} +/** + * 处理不合法的数据(过滤 非数值型 和 NaN，保留 null) + * @param data + * @param angleField + */ +function processIllegalData(data, field) { + var processData = filter$1(data, function (d) { + var v = d[field]; + return v === null || (typeof v === 'number' && !isNaN(v)); + }); + // 打印异常数据情况 + log(LEVEL.WARN, processData.length === data.length, 'illegal data existed in chart data.'); + return processData; +} + +/** + * 把 padding 转换成统一的数组写法 + * @param padding + */ +function normalPadding(padding) { + if (isNumber$4(padding)) { + return [padding, padding, padding, padding]; + } + if (isArray$n(padding)) { + var length_1 = padding.length; + if (length_1 === 1) { + return [padding[0], padding[0], padding[0], padding[0]]; + } + if (length_1 === 2) { + return [padding[0], padding[1], padding[0], padding[1]]; + } + if (length_1 === 3) { + return [padding[0], padding[1], padding[2], padding[1]]; + } + if (length_1 === 4) { + return padding; + } + } + return [0, 0, 0, 0]; +} +/** + * 获取调整的 appendPadding + */ +function getAdjustAppendPadding(padding, position, append) { + if (position === void 0) { position = 'bottom'; } + if (append === void 0) { append = 25; } + var currentAppendPadding = normalPadding(padding); + var PADDING = [ + position.startsWith('top') ? append : 0, + position.startsWith('right') ? append : 0, + position.startsWith('bottom') ? append : 0, + position.startsWith('left') ? append : 0, + ]; + return [ + currentAppendPadding[0] + PADDING[0], + currentAppendPadding[1] + PADDING[1], + currentAppendPadding[2] + PADDING[2], + currentAppendPadding[3] + PADDING[3], + ]; +} +/** + * 根据图表的 padding 和 appendPadding 计算出图表的最终 padding + * @param array + */ +function resolveAllPadding(paddings) { + // 先把数组里的 padding 全部转换成 normal + var normalPaddings = paddings.map(function (item) { return normalPadding(item); }); + var finalPadding = [0, 0, 0, 0]; + if (normalPaddings.length > 0) { + finalPadding = finalPadding.map(function (item, index) { + // 有几个 padding 数组就遍历几次，累加 + normalPaddings.forEach(function (d, i) { + item += normalPaddings[i][index]; + }); + return item; + }); + } + return finalPadding; +} + +/** + * @file 全局的一些变量定义：含国际化、主题... + */ +var GLOBAL = { + /** 全局语言 */ + locale: 'en-US', +}; + +var LocaleMap = {}; +/** + * register a locale + * @param locale + * @param localeObj + */ +function registerLocale(locale, localeObj) { + LocaleMap[locale] = localeObj; +} +/** + * get locale of specific language + * @param lang + * @returns + */ +function getLocale(locale) { + return { + get: function (key, obj) { + return template(get$3(LocaleMap[locale], key) || get$3(LocaleMap[GLOBAL.locale], key) || get$3(LocaleMap['en-US'], key) || key, obj); + }, + }; +} + +var EN_US_LOCALE = { + locale: 'en-US', + // General + general: { + increase: 'Increase', + decrease: 'Decrease', + root: 'Root', + }, + // Plot Components + /** statistic text component */ + statistic: { + total: 'Total', + }, + /** conversionTag component */ + conversionTag: { + label: 'Rate', + }, + legend: {}, + tooltip: {}, + slider: {}, + scrollbar: {}, + // Plots + waterfall: { + total: 'Total', + }, +}; + +var ZH_CN_LOCALE = { + locale: 'zh-CN', + // 通用 + general: { + increase: '增加', + decrease: '减少', + root: '初始', + }, + // 按照图表组件 + /** 中心文本 */ + statistic: { + total: '总计', + }, + /** 转化率组件 */ + conversionTag: { + label: '转化率', + }, + legend: {}, + tooltip: {}, + slider: {}, + scrollbar: {}, + // 按照图表类型 + waterfall: { + total: '总计', + }, +}; + +var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {}; + +function getDefaultExportFromCjs (x) { + return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x; +} + +function getAugmentedNamespace(n) { + if (n.__esModule) return n; + var a = Object.defineProperty({}, '__esModule', {value: true}); + Object.keys(n).forEach(function (k) { + var d = Object.getOwnPropertyDescriptor(n, k); + Object.defineProperty(a, k, d.get ? d : { + enumerable: true, + get: function () { + return n[k]; + } + }); + }); + return a; +} + +function commonjsRequire (path) { + throw new Error('Could not dynamically require "' + path + '". Please configure the dynamicRequireTargets or/and ignoreDynamicRequires option of @rollup/plugin-commonjs appropriately for this require call to work.'); +} + +var lib$3 = {}; + +var sensorPool = {}; + +var id$2 = {}; + +(function (exports) { + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports["default"] = void 0; + +/** + * Created by hustcc on 18/6/9. + * Contract: i@hust.cc + */ +var id = 1; +/** + * generate unique id in application + * @return {string} + */ + +var _default = function _default() { + return "".concat(id++); +}; + +exports["default"] = _default; +}(id$2)); + +var sensors = {}; + +var object = {}; + +var debounce = {}; + +(function (exports) { + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports["default"] = void 0; + +/** + * Created by hustcc on 18/6/9. + * Contract: i@hust.cc + */ +var _default = function _default(fn) { + var delay = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 60; + var timer = null; + return function () { + var _this = this; + + for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { + args[_key] = arguments[_key]; + } + + clearTimeout(timer); + timer = setTimeout(function () { + fn.apply(_this, args); + }, delay); + }; +}; + +exports["default"] = _default; +}(debounce)); + +var constant$5 = {}; + +Object.defineProperty(constant$5, "__esModule", { + value: true +}); +constant$5.SensorTabIndex = constant$5.SensorClassName = constant$5.SizeSensorId = void 0; + +/** + * Created by hustcc on 18/6/9. + * Contract: i@hust.cc + */ +var SizeSensorId = 'size-sensor-id'; +constant$5.SizeSensorId = SizeSensorId; +var SensorClassName = 'size-sensor-object'; +constant$5.SensorClassName = SensorClassName; +var SensorTabIndex = '-1'; +constant$5.SensorTabIndex = SensorTabIndex; + +Object.defineProperty(object, "__esModule", { + value: true +}); +object.createSensor = void 0; + +var _debounce$1 = _interopRequireDefault$2(debounce); + +var _constant$1 = constant$5; + +function _interopRequireDefault$2(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } + +/** + * Created by hustcc on 18/6/9. + * Contract: i@hust.cc + */ +var createSensor$2 = function createSensor(element) { + var sensor = undefined; // callback + + var listeners = []; + /** + * create object DOM of sensor + * @returns {HTMLObjectElement} + */ + + var newSensor = function newSensor() { + // adjust style + if (getComputedStyle(element).position === 'static') { + element.style.position = 'relative'; + } + + var obj = document.createElement('object'); + + obj.onload = function () { + obj.contentDocument.defaultView.addEventListener('resize', resizeListener); // 直接触发一次 resize + + resizeListener(); + }; + + obj.style.display = 'block'; + obj.style.position = 'absolute'; + obj.style.top = '0'; + obj.style.left = '0'; + obj.style.height = '100%'; + obj.style.width = '100%'; + obj.style.overflow = 'hidden'; + obj.style.pointerEvents = 'none'; + obj.style.zIndex = '-1'; + obj.style.opacity = '0'; + obj.setAttribute('class', _constant$1.SensorClassName); + obj.setAttribute('tabindex', _constant$1.SensorTabIndex); + obj.type = 'text/html'; // append into dom + + element.appendChild(obj); // for ie, should set data attribute delay, or will be white screen + + obj.data = 'about:blank'; + return obj; + }; + /** + * trigger listeners + */ + + + var resizeListener = (0, _debounce$1["default"])(function () { + // trigger all listener + listeners.forEach(function (listener) { + listener(element); + }); + }); + /** + * listen with one callback function + * @param cb + */ + + var bind = function bind(cb) { + // if not exist sensor, then create one + if (!sensor) { + sensor = newSensor(); + } + + if (listeners.indexOf(cb) === -1) { + listeners.push(cb); + } + }; + /** + * destroy all + */ + + + var destroy = function destroy() { + if (sensor && sensor.parentNode) { + if (sensor.contentDocument) { + // remote event + sensor.contentDocument.defaultView.removeEventListener('resize', resizeListener); + } // remove dom + + + sensor.parentNode.removeChild(sensor); // initial variable + + sensor = undefined; + listeners = []; + } + }; + /** + * cancel listener bind + * @param cb + */ + + + var unbind = function unbind(cb) { + var idx = listeners.indexOf(cb); + + if (idx !== -1) { + listeners.splice(idx, 1); + } // no listener, and sensor is exist + // then destroy the sensor + + + if (listeners.length === 0 && sensor) { + destroy(); + } + }; + + return { + element: element, + bind: bind, + destroy: destroy, + unbind: unbind + }; +}; + +object.createSensor = createSensor$2; + +var resizeObserver = {}; + +Object.defineProperty(resizeObserver, "__esModule", { + value: true +}); +resizeObserver.createSensor = void 0; + +var _debounce = _interopRequireDefault$1(debounce); + +function _interopRequireDefault$1(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } + +/** + * Created by hustcc on 18/7/5. + * Contract: i@hust.cc + */ +var createSensor$1 = function createSensor(element) { + var sensor = undefined; // callback + + var listeners = []; + /** + * trigger listeners + */ + + var resizeListener = (0, _debounce["default"])(function () { + // trigger all + listeners.forEach(function (listener) { + listener(element); + }); + }); + /** + * create ResizeObserver sensor + * @returns + */ + + var newSensor = function newSensor() { + var s = new ResizeObserver(resizeListener); // listen element + + s.observe(element); // trigger once + + resizeListener(); + return s; + }; + /** + * listen with callback + * @param cb + */ + + + var bind = function bind(cb) { + if (!sensor) { + sensor = newSensor(); + } + + if (listeners.indexOf(cb) === -1) { + listeners.push(cb); + } + }; + /** + * destroy + */ + + + var destroy = function destroy() { + sensor.disconnect(); + listeners = []; + sensor = undefined; + }; + /** + * cancel bind + * @param cb + */ + + + var unbind = function unbind(cb) { + var idx = listeners.indexOf(cb); + + if (idx !== -1) { + listeners.splice(idx, 1); + } // no listener, and sensor is exist + // then destroy the sensor + + + if (listeners.length === 0 && sensor) { + destroy(); + } + }; + + return { + element: element, + bind: bind, + destroy: destroy, + unbind: unbind + }; +}; + +resizeObserver.createSensor = createSensor$1; + +Object.defineProperty(sensors, "__esModule", { + value: true +}); +sensors.createSensor = void 0; + +var _object = object; + +var _resizeObserver = resizeObserver; + +/** + * Created by hustcc on 18/7/5. + * Contract: i@hust.cc + */ + +/** + * sensor strategies + */ +// export const createSensor = createObjectSensor; +var createSensor = typeof ResizeObserver !== 'undefined' ? _resizeObserver.createSensor : _object.createSensor; +sensors.createSensor = createSensor; + +Object.defineProperty(sensorPool, "__esModule", { + value: true +}); +sensorPool.removeSensor = sensorPool.getSensor = void 0; + +var _id = _interopRequireDefault(id$2); + +var _sensors = sensors; + +var _constant = constant$5; + +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } + +/** + * Created by hustcc on 18/6/9. + * Contract: i@hust.cc + */ + +/** + * all the sensor objects. + * sensor pool + */ +var Sensors = {}; +/** + * get one sensor + * @param element + * @returns {*} + */ + +var getSensor = function getSensor(element) { + var sensorId = element.getAttribute(_constant.SizeSensorId); // 1. if the sensor exists, then use it + + if (sensorId && Sensors[sensorId]) { + return Sensors[sensorId]; + } // 2. not exist, then create one + + + var newId = (0, _id["default"])(); + element.setAttribute(_constant.SizeSensorId, newId); + var sensor = (0, _sensors.createSensor)(element); // add sensor into pool + + Sensors[newId] = sensor; + return sensor; +}; +/** + * 移除 sensor + * @param sensor + */ + + +sensorPool.getSensor = getSensor; + +var removeSensor = function removeSensor(sensor) { + var sensorId = sensor.element.getAttribute(_constant.SizeSensorId); // remove attribute + + sensor.element.removeAttribute(_constant.SizeSensorId); // remove event, dom of the sensor used + + sensor.destroy(); // exist, then remove from pool + + if (sensorId && Sensors[sensorId]) { + delete Sensors[sensorId]; + } +}; + +sensorPool.removeSensor = removeSensor; + +Object.defineProperty(lib$3, "__esModule", { + value: true +}); +lib$3.ver = lib$3.clear = bind_1 = lib$3.bind = void 0; + +var _sensorPool = sensorPool; + +/** + * Created by hustcc on 18/6/9.[高考时间] + * Contract: i@hust.cc + */ + +/** + * bind an element with resize callback function + * @param {*} element + * @param {*} cb + */ +var bind = function bind(element, cb) { + var sensor = (0, _sensorPool.getSensor)(element); // listen with callback + + sensor.bind(cb); // return unbind function + + return function () { + sensor.unbind(cb); + }; +}; +/** + * clear all the listener and sensor of an element + * @param element + */ + + +var bind_1 = lib$3.bind = bind; + +var clear = function clear(element) { + var sensor = (0, _sensorPool.getSensor)(element); + (0, _sensorPool.removeSensor)(sensor); +}; + +lib$3.clear = clear; +var ver = "1.0.1"; +lib$3.ver = ver; + +var SOURCE_ATTRIBUTE_NAME = 'data-chart-source-type'; +/** plot 图表容器的配置 */ +var PLOT_CONTAINER_OPTIONS = [ + 'padding', + 'appendPadding', + 'renderer', + 'pixelRatio', + 'syncViewPadding', + 'supportCSSTransform', + 'limitInPlot', +]; +/** + * 所有 plot 的基类 + */ +var Plot = /** @class */ (function (_super) { + __extends$e(Plot, _super); + function Plot(container, options) { + var _this = _super.call(this) || this; + _this.container = typeof container === 'string' ? document.getElementById(container) : container; + _this.options = deepAssign({}, _this.getDefaultOptions(), options); + _this.createG2(); + _this.bindEvents(); + return _this; + } + /** + * 获取默认的 options 配置项 + * 每个组件都可以复写 + */ + Plot.getDefaultOptions = function () { + return { + renderer: 'canvas', + xAxis: { + nice: true, + label: { + autoRotate: false, + autoHide: { type: 'equidistance', cfg: { minGap: 6 } }, + }, + }, + yAxis: { + nice: true, + label: { + autoHide: true, + autoRotate: false, + }, + }, + animation: true, + }; + }; + /** + * 创建 G2 实例 + */ + Plot.prototype.createG2 = function () { + var _a = this.options, width = _a.width, height = _a.height; + this.chart = new Chart$2(__assign$r(__assign$r(__assign$r({ container: this.container, autoFit: false }, this.getChartSize(width, height)), { localRefresh: false }), pick$1(this.options, PLOT_CONTAINER_OPTIONS))); + // 给容器增加标识，知道图表的来源区别于 G2 + this.container.setAttribute(SOURCE_ATTRIBUTE_NAME, 'G2Plot'); + }; + /** + * 计算默认的 chart 大小。逻辑简化：如果存在 width 或 height，则直接使用，否则使用容器大小 + * @param width + * @param height + */ + Plot.prototype.getChartSize = function (width, height) { + var chartSize = getContainerSize(this.container); + return { width: width || chartSize.width || 400, height: height || chartSize.height || 400 }; + }; + /** + * 绑定代理所有 G2 的事件 + */ + Plot.prototype.bindEvents = function () { + var _this = this; + if (this.chart) { + this.chart.on('*', function (e) { + if (e === null || e === void 0 ? void 0 : e.type) { + _this.emit(e.type, e); + } + }); + } + }; + /** + * 获取默认的 options 配置项 + * 每个组件都可以复写 + */ + Plot.prototype.getDefaultOptions = function () { + return Plot.getDefaultOptions(); + }; + /** + * 绘制 + */ + Plot.prototype.render = function () { + // 暴力处理，先清空再渲染，需要 G2 层自行做好更新渲染 + this.chart.clear(); + // 因为子 view 会继承父 view 的 options 配置（包括 legend，所以会导致 legend 重复创建） + // 所以这里给 chart 实例的 options 配置清空 + // 最好的解法是在 G2 view.clear 方法的时候，重置 options 配置。或者提供方法去 resetOptions + // #1684 理论上在多 view 图形上，只要存在 custom legend，都存在类似问题（子弹图、双轴图） + // @ts-ignore + this.chart.options = { + data: [], + animate: true, + }; + this.chart.views = []; // 删除已有的 views + // 执行 adaptor + this.execAdaptor(); + // 渲染 + this.chart.render(); + // 绑定 + this.bindSizeSensor(); + }; + /** + * 更新: 更新配置且重新渲染 + * @param options + */ + Plot.prototype.update = function (options) { + this.updateOption(options); + this.render(); + }; + /** + * 更新配置 + * @param options + */ + Plot.prototype.updateOption = function (options) { + this.options = deepAssign({}, this.options, options); + }; + /** + * 设置状态 + * @param type 状态类型，支持 'active' | 'inactive' | 'selected' 三种 + * @param conditions 条件，支持数组 + * @param status 是否激活，默认 true + */ + Plot.prototype.setState = function (type, condition, status) { + if (status === void 0) { status = true; } + var elements = getAllElementsRecursively(this.chart); + each$2(elements, function (ele) { + if (condition(ele.getData())) { + ele.setState(type, status); + } + }); + }; + /** + * 获取状态 + */ + Plot.prototype.getStates = function () { + var elements = getAllElementsRecursively(this.chart); + var stateObjects = []; + each$2(elements, function (element) { + var data = element.getData(); + var states = element.getStates(); + each$2(states, function (state) { + stateObjects.push({ data: data, state: state, geometry: element.geometry, element: element }); + }); + }); + return stateObjects; + }; + /** + * 更新数据 + * @override + * @param options + */ + Plot.prototype.changeData = function (data) { + // @ts-ignore + this.update({ data: data }); + // TODO: 临时方案，最好使用下面的方式去更新数据 + // this.chart.changeData(data); + }; + /** + * 修改画布大小 + * @param width + * @param height + */ + Plot.prototype.changeSize = function (width, height) { + this.chart.changeSize(width, height); + }; + /** + * 增加图表标注。通过 id 标识，如果匹配到，就做更新 + */ + Plot.prototype.addAnnotations = function (annotations) { + var incoming = __spreadArrays$1(annotations); + var controller = this.chart.getController('annotation'); + var current = controller.getComponents().map(function (co) { return co.extra; }); + controller.clear(true); + var _loop_1 = function (i) { + var annotation = current[i]; + var findIndex = incoming.findIndex(function (item) { return item.id && item.id === annotation.id; }); + if (findIndex !== -1) { + annotation = deepAssign({}, annotation, incoming[findIndex]); + incoming.splice(findIndex, 1); + } + controller.annotation(annotation); + }; + for (var i = 0; i < current.length; i++) { + _loop_1(i); + } + incoming.forEach(function (annotation) { return controller.annotation(annotation); }); + this.chart.render(true); + }; + /** + * 删除图表标注。通过 id 标识，如果匹配到，就做删除 + */ + Plot.prototype.removeAnnotations = function (annotations) { + var controller = this.chart.getController('annotation'); + var current = controller.getComponents().map(function (co) { return co.extra; }); + controller.clear(true); + var _loop_2 = function (i) { + var annotation = current[i]; + if (!annotations.find(function (item) { return item.id && item.id === annotation.id; })) { + controller.annotation(annotation); + } + }; + for (var i = 0; i < current.length; i++) { + _loop_2(i); + } + this.chart.render(true); + }; + /** + * 销毁 + */ + Plot.prototype.destroy = function () { + // 取消 size-sensor 的绑定 + this.unbindSizeSensor(); + // G2 的销毁 + this.chart.destroy(); + // 清空已经绑定的事件 + this.off(); + this.container.removeAttribute(SOURCE_ATTRIBUTE_NAME); + }; + /** + * 执行 adaptor 操作 + */ + Plot.prototype.execAdaptor = function () { + var adaptor = this.getSchemaAdaptor(); + var _a = this.options, padding = _a.padding, appendPadding = _a.appendPadding; + // 更新 padding + this.chart.padding = padding; + // 更新 appendPadding + this.chart.appendPadding = appendPadding; + // 转化成 G2 API + adaptor({ + chart: this.chart, + options: this.options, + }); + }; + /** + * 当图表容器大小变化的时候，执行的函数 + */ + Plot.prototype.triggerResize = function () { + this.chart.forceFit(); + }; + /** + * 绑定 dom 容器大小变化的事件 + */ + Plot.prototype.bindSizeSensor = function () { + var _this = this; + if (this.unbind) { + return; + } + var _a = this.options.autoFit, autoFit = _a === void 0 ? true : _a; + if (autoFit) { + this.unbind = bind_1(this.container, function () { + // 获取最新的宽高信息 + var _a = getContainerSize(_this.container), width = _a.width, height = _a.height; + // 主要是防止绑定的时候触发 resize 回调 + if (width !== _this.chart.width || height !== _this.chart.height) { + _this.triggerResize(); + } + }); + } + }; + /** + * 取消绑定 + */ + Plot.prototype.unbindSizeSensor = function () { + if (this.unbind) { + this.unbind(); + this.unbind = undefined; + } + }; + return Plot; +}(EventEmitter)); + +/** + * 需要从轴配置中提取出来作为 meta 的属性 key 列表 + */ +var AXIS_META_CONFIG_KEYS = [ + 'type', + 'alias', + 'tickCount', + 'tickInterval', + 'min', + 'max', + 'nice', + 'minLimit', + 'maxLimit', + // 坐标轴的范围 + 'range', + 'tickMethod', + // type: 'log' 的底 + 'base', + // type: 'exp' 的指数 + 'exponent', + // time 类型的格式化 + 'mask', + // 是否同步 + 'sync', +]; + +/** + * 获取设备像素比 + */ +function getPixelRatio() { + return typeof window === 'object' ? window === null || window === void 0 ? void 0 : window.devicePixelRatio : 2; +} +/** + * 初始化 cavnas，设置宽高等 + */ +function initCanvas(width, height) { + if (height === void 0) { height = width; } + var canvas = document.createElement('canvas'); + var pixelRatio = getPixelRatio(); + // 画布尺寸 + canvas.width = width * pixelRatio; + canvas.height = height * pixelRatio; + // 显示尺寸 + canvas.style.width = width + "px"; + canvas.style.height = height + "px"; + var ctx = canvas.getContext('2d'); + ctx.scale(pixelRatio, pixelRatio); + return canvas; +} +/** + * 绘制背景 + * + * @param context + * @param cfg + * @param width + * @param height + */ +function drawBackground(context, cfg, width, height) { + if (height === void 0) { height = width; } + var backgroundColor = cfg.backgroundColor, opacity = cfg.opacity; + context.globalAlpha = opacity; + context.fillStyle = backgroundColor; + context.beginPath(); + context.fillRect(0, 0, width, height); + context.closePath(); +} +/** + * 计算贴图单元大小 + * + * @param size 元素大小 + * @param padding 圆点间隔 + * @param isStagger 是否交错 + * @reutrn 返回贴图单元大小 + */ +function getUnitPatternSize(size, padding, isStagger) { + // 如果交错, unitSize 放大两倍 + var unitSize = size + padding; + return isStagger ? unitSize * 2 : unitSize; +} +/** + * 计算有交错情况的元素坐标 + * + * @param unitSize 贴图单元大小 + * @param isStagger 是否交错 + * @reutrn 元素中心坐标 x,y 数组集合 + */ +function getSymbolsPosition(unitSize, isStagger) { + // 如果交错, 交错绘制 dot + var symbolsPos = isStagger + ? [ + [unitSize * (1 / 4), unitSize * (1 / 4)], + [unitSize * (3 / 4), unitSize * (3 / 4)], + ] + : [[unitSize * (1 / 2), unitSize * (1 / 2)]]; + return symbolsPos; +} +/** + * 给整个 pattern贴图 做变换, 目前支持旋转 + * + * @param pattern 整个贴图 + * @param dpr 设备像素比 + * @param rotation 旋转角度 + */ +function transformMatrix(dpr, rotation) { + var radian = (rotation * Math.PI) / 180; + var matrix = { + a: Math.cos(radian) * (1 / dpr), + b: Math.sin(radian) * (1 / dpr), + c: -Math.sin(radian) * (1 / dpr), + d: Math.cos(radian) * (1 / dpr), + e: 0, + f: 0, + }; + return matrix; +} + +/** + * dotPattern的默认配置 + */ +var defaultDotPatternCfg = { + size: 6, + padding: 2, + backgroundColor: 'transparent', + opacity: 1, + rotation: 0, + fill: '#fff', + fillOpacity: 0.5, + stroke: 'transparent', + lineWidth: 0, + isStagger: true, +}; +/** + * 绘制圆点 + * + * @param context + * @param cfg + * @param x 圆点中心坐标x + * @param y 圆点中心坐标y + */ +function drawDot(context, cfg, x, y) { + var size = cfg.size, fill = cfg.fill, lineWidth = cfg.lineWidth, stroke = cfg.stroke, fillOpacity = cfg.fillOpacity; + context.beginPath(); + context.globalAlpha = fillOpacity; + context.fillStyle = fill; + context.strokeStyle = stroke; + context.lineWidth = lineWidth; + context.arc(x, y, size / 2, 0, 2 * Math.PI, false); + context.fill(); + if (lineWidth) { + context.stroke(); + } + context.closePath(); +} +/** + * 创建 dot pattern，返回 HTMLCanvasElement + * + * @param cfg + * @returns HTMLCanvasElement + */ +function createDotPattern(cfg) { + var dotCfg = deepAssign({}, defaultDotPatternCfg, cfg); + var size = dotCfg.size, padding = dotCfg.padding, isStagger = dotCfg.isStagger, rotation = dotCfg.rotation; + // 计算 画布大小，dots的位置 + var unitSize = getUnitPatternSize(size, padding, isStagger); + var dots = getSymbolsPosition(unitSize, isStagger); + // 初始化 patternCanvas + var canvas = initCanvas(unitSize, unitSize); + var ctx = canvas.getContext('2d'); + // 绘制 background，dots + drawBackground(ctx, dotCfg, unitSize); + for (var _i = 0, dots_1 = dots; _i < dots_1.length; _i++) { + var _a = dots_1[_i], x = _a[0], y = _a[1]; + drawDot(ctx, dotCfg, x, y); + } + var pattern = ctx.createPattern(canvas, 'repeat'); + if (pattern) { + var dpr = getPixelRatio(); + var matrix = transformMatrix(dpr, rotation); + pattern.setTransform(matrix); + } + return pattern; +} + +/** + * linePattern 的 默认配置 + */ +var defaultLinePatternCfg = { + rotation: 45, + spacing: 5, + opacity: 1, + backgroundColor: 'transparent', + strokeOpacity: 0.5, + stroke: '#fff', + lineWidth: 2, +}; +/** + * 绘制line + * + * @param context canvasContext + * @param cfg linePattern 的配置 + * @param d 绘制 path 所需的 d + */ +function drawLine(context, cfg, d) { + var stroke = cfg.stroke, lineWidth = cfg.lineWidth, strokeOpacity = cfg.strokeOpacity; + var path = new Path2D(d); + context.globalAlpha = strokeOpacity; + context.lineCap = 'square'; + context.strokeStyle = lineWidth ? stroke : 'transparent'; + context.lineWidth = lineWidth; + context.stroke(path); +} +/** + * 创建 linePattern + */ +function createLinePattern(cfg) { + var lineCfg = deepAssign({}, defaultLinePatternCfg, cfg); + var spacing = lineCfg.spacing, rotation = lineCfg.rotation, lineWidth = lineCfg.lineWidth; + // 计算 pattern 画布的大小， path 所需的 d + var width = spacing + lineWidth || 1; + var height = spacing + lineWidth || 1; + var d = "\n M 0 0 L " + width + " 0\n M 0 " + height + " L " + width + " " + height + "\n "; + // 初始化 patternCanvas + var canvas = initCanvas(width, height); + var ctx = canvas.getContext('2d'); + // 绘制 background，line + drawBackground(ctx, lineCfg, width, height); + drawLine(ctx, lineCfg, d); + var pattern = ctx.createPattern(canvas, 'repeat'); + if (pattern) { + var dpr = getPixelRatio(); + var matrix = transformMatrix(dpr, rotation); + pattern.setTransform(matrix); + } + // 返回 Pattern 对象 + return pattern; +} + +/** + * squarePattern 的 默认配置 + */ +var defaultSquarePatternCfg = { + size: 6, + padding: 1, + isStagger: true, + backgroundColor: 'transparent', + opacity: 1, + rotation: 0, + fill: '#fff', + fillOpacity: 0.5, + stroke: 'transparent', + lineWidth: 0, +}; +/** + * 绘制square + * + * @param context canvasContext + * @param cfg squarePattern 的配置 + * @param x和y square的中心位置 + */ +function drawSquare(context, cfg, x, y) { + var stroke = cfg.stroke, size = cfg.size, fill = cfg.fill, lineWidth = cfg.lineWidth, fillOpacity = cfg.fillOpacity; + context.globalAlpha = fillOpacity; + context.strokeStyle = stroke; + context.lineWidth = lineWidth; + context.fillStyle = fill; + // 因为正方形绘制从左上角开始，所以x，y做个偏移 + context.strokeRect(x - size / 2, y - size / 2, size, size); + context.fillRect(x - size / 2, y - size / 2, size, size); +} +/** + * 创建 squarePattern + */ +function createSquarePattern(cfg) { + var squareCfg = deepAssign({}, defaultSquarePatternCfg, cfg); + var size = squareCfg.size, padding = squareCfg.padding, isStagger = squareCfg.isStagger, rotation = squareCfg.rotation; + // 计算 画布大小，squares的位置 + var unitSize = getUnitPatternSize(size, padding, isStagger); + var squares = getSymbolsPosition(unitSize, isStagger); // 计算方法与 dots 一样 + // 初始化 patternCanvas + var canvas = initCanvas(unitSize, unitSize); + var ctx = canvas.getContext('2d'); + // 绘制 background，squares + drawBackground(ctx, squareCfg, unitSize); + for (var _i = 0, squares_1 = squares; _i < squares_1.length; _i++) { + var _a = squares_1[_i], x = _a[0], y = _a[1]; + drawSquare(ctx, squareCfg, x, y); + } + var pattern = ctx.createPattern(canvas, 'repeat'); + if (pattern) { + var dpr = getPixelRatio(); + var matrix = transformMatrix(dpr, rotation); + pattern.setTransform(matrix); + } + return pattern; +} + +/** + * 获取内置的 CanvasPattern 方法 + * @param options + * @returns + */ +function getCanvasPattern(options) { + var type = options.type, cfg = options.cfg; + var pattern; + switch (type) { + case 'dot': + pattern = createDotPattern(cfg); + break; + case 'line': + pattern = createLinePattern(cfg); + break; + case 'square': + pattern = createSquarePattern(cfg); + break; + } + return pattern; +} + +/** + * Pattern 通道，处理图案填充 + * 🚀 目前支持图表类型：饼图、柱状图、条形图、玉珏图等（不支持在多 view 图表中，后续按需扩展） + * + * @param key key of style property + * @returns + */ +function pattern(key) { + var _this = this; + return function (params) { + var _a; + var options = params.options, chart = params.chart; + var patternOption = options.pattern; + // 没有 pattern 配置，则直接返回 + if (!patternOption) { + return params; + } + /** ~~~~~~~ 进行贴图图案处理 ~~~~~~~ */ + var style = function (datum) { + var _a, _b, _c; + var args = []; + for (var _i = 1; _i < arguments.length; _i++) { + args[_i - 1] = arguments[_i]; + } + var defaultColor = chart.getTheme().defaultColor; + var color = defaultColor; + var colorAttribute = (_b = (_a = chart.geometries) === null || _a === void 0 ? void 0 : _a[0]) === null || _b === void 0 ? void 0 : _b.getAttribute('color'); + if (colorAttribute) { + var colorField = colorAttribute.getFields()[0]; + var seriesValue = get$3(datum, colorField); + color = Util$1.getMappingValue(colorAttribute, seriesValue, ((_c = colorAttribute.values) === null || _c === void 0 ? void 0 : _c[0]) || defaultColor); + } + var pattern = patternOption; + // 1. 如果 patternOption 是一个回调，则获取回调结果。`(datum: Datum, color: string) => CanvasPattern` + if (typeof patternOption === 'function') { + pattern = patternOption.call(_this, datum, color); + } + // 2. 如果 pattern 不是 CanvasPattern，则进一步处理，否则直接赋予给 fill + if (pattern instanceof CanvasPattern === false) { + // 通过 createPattern(PatternStyle) 转换为 CanvasPattern + pattern = getCanvasPattern(deepAssign({}, { cfg: { backgroundColor: color } }, pattern)); + } + var styleOption = options[key]; + return __assign$r(__assign$r({}, (typeof styleOption === 'function' ? styleOption.call.apply(styleOption, __spreadArrays$1([_this, datum], args)) : styleOption || {})), { fill: pattern || color }); + }; + return deepAssign({}, params, { options: (_a = {}, _a[key] = style, _a) }); + }; +} + +/** + * 通用 legend 配置, 适用于带 colorField 或 seriesField 的图表 + * @param params + */ +function legend$f(params) { + var chart = params.chart, options = params.options; + var legend = options.legend, colorField = options.colorField, seriesField = options.seriesField; + if (legend === false) { + chart.legend(false); + } + else if (colorField || seriesField) { + chart.legend(colorField || seriesField, legend); + } + return params; +} +/** + * 通用 tooltip 配置 + * @param params + */ +function tooltip$8(params) { + var chart = params.chart, options = params.options; + var tooltip = options.tooltip; + if (tooltip !== undefined) { + chart.tooltip(tooltip); + } + return params; +} +/** + * Interaction 配置 + * @param params + */ +function interaction$6(params) { + var chart = params.chart, options = params.options; + var interactions = options.interactions; + each$2(interactions, function (i) { + if (i.enable === false) { + chart.removeInteraction(i.type); + } + else { + chart.interaction(i.type, i.cfg || {}); + } + }); + return params; +} +/** + * 动画 + * @param params + */ +function animation$5(params) { + var chart = params.chart, options = params.options; + var animation = options.animation; + // 同时设置整个 view 动画选项 + if (typeof animation === 'boolean') { + chart.animate(animation); + } + else { + chart.animate(true); + } + // 所有的 Geometry 都使用同一动画（各个图形如有区别，自行覆盖） + each$2(chart.geometries, function (g) { + g.animate(animation); + }); + return params; +} +/** + * 设置全局主题配置 + * @param params + */ +function theme$2(params) { + var chart = params.chart, options = params.options; + var theme = options.theme; + // 存在主题才设置主题 + if (theme) { + chart.theme(theme); + } + return params; +} +/** + * 状态 state 配置 + * @param params + */ +function state(params) { + var chart = params.chart, options = params.options; + var state = options.state; + if (state) { + each$2(chart.geometries, function (geometry) { + geometry.state(state); + }); + } + return params; +} +/** + * 处理缩略轴的 adaptor + * @param params + */ +function slider$1(params) { + var chart = params.chart, options = params.options; + var slider = options.slider; + chart.option('slider', slider); + return params; +} +/** + * 处理缩略轴的 adaptor + * @param params + */ +function scrollbar(params) { + var chart = params.chart, options = params.options; + var scrollbar = options.scrollbar; + chart.option('scrollbar', scrollbar); + return params; +} +/** + * scale 的 adaptor + * @param axes + */ +function scale$3(axes, meta) { + return function (params) { + var chart = params.chart, options = params.options; + // 1. 轴配置中的 scale 信息 + var scales = {}; + each$2(axes, function (axis, field) { + scales[field] = pick$1(axis, AXIS_META_CONFIG_KEYS); + }); + // 2. meta 直接是 scale 的信息 + scales = deepAssign({}, meta, options.meta, scales); + chart.scale(scales); + return params; + }; +} +/** + * annotation 配置 + * @param params + */ +function annotation$2(annotationOptions) { + return function (params) { + var chart = params.chart, options = params.options; + var annotationController = chart.getController('annotation'); + /** 自定义 annotation */ + each$2(__spreadArrays$1((options.annotations || []), (annotationOptions || [])), function (annotationOption) { + // @ts-ignore + annotationController.annotation(annotationOption); + }); + return params; + }; +} +/** + * 自动设置 limitInPlot + * @param params + */ +function limitInPlot$2(params) { + var chart = params.chart, options = params.options; + var yAxis = options.yAxis, limitInPlot = options.limitInPlot; + var value = limitInPlot; + // 用户没有设置 limitInPlot，则自动根据 yAxis 是否有 min/max 来设置 limitInPlot + if (isObject$f(yAxis) && isNil(limitInPlot)) { + if (Object.values(pick$1(yAxis, ['min', 'max', 'minLimit', 'maxLimit'])).some(function (value) { return !isNil(value); })) { + value = true; + } + else { + value = false; + } + } + chart.limitInPlot = value; + return params; +} + +/** + * 获得 tooltip 的映射信息 + * @param tooltip + * @param defaultFields + */ +function getTooltipMapping(tooltip, defaultFields) { + if (tooltip === false) { + return { + fields: false, + }; + } + var fields = get$3(tooltip, 'fields'); + var formatter = get$3(tooltip, 'formatter'); + if (formatter && !fields) { + fields = defaultFields; + } + return { + fields: fields, + formatter: formatter, + }; +} + +/** + * 获得映射的字段列表 + * @param options + * @param field + */ +function getMappingField(o, field) { + var type = o.type, xField = o.xField, yField = o.yField, colorField = o.colorField, shapeField = o.shapeField, sizeField = o.sizeField, styleField = o.styleField, _a = o.rawFields, rawFields = _a === void 0 ? [] : _a; + var fields = []; + // 因为 color 会影响到数据分组，以及最后的图形映射。所以导致 bar 图中的 widthRatio 设置不生效 + // 所以对于 color 字段，仅仅保留 colorField 好了！ + rawFields + // shape, size 同理 + if (field === 'color') { + fields = __spreadArrays$1([colorField || xField], rawFields); + } + else if (field === 'shape') { + fields = __spreadArrays$1([shapeField || xField], rawFields); + } + else if (field === 'size') { + fields = __spreadArrays$1([sizeField || xField], rawFields); + } + else { + fields = __spreadArrays$1([xField, yField, colorField, shapeField, sizeField, styleField], rawFields); + // 一定能找到的！ + var idx = ['x', 'y', 'color', 'shape', 'size', 'style'].indexOf(field); + var f = fields[idx]; + // 删除当前字段 + fields.splice(idx, 1); + // 插入到第一个 + fields.unshift(f); + } + var mappingFields = uniq$3(fields.filter(function (f) { return !!f; })); + /** + * 修复 line geometry 无拆分时 color 回调错误 + * eg: + * geometry.color(xField, ()=> '#f24') + */ + var tileMappingField = type === 'line' && [xField, yField].includes(mappingFields.join('*')) ? '' : mappingFields.join('*'); + return { + mappingFields: mappingFields, + tileMappingField: tileMappingField, + }; +} +/** + * 获得映射函数 + * @param mappingFields + * @param func + */ +function getMappingFunction(mappingFields, func) { + if (!func) + return undefined; + // 返回函数 + return function () { + var args = []; + for (var _i = 0; _i < arguments.length; _i++) { + args[_i] = arguments[_i]; + } + var params = {}; + mappingFields.forEach(function (f, idx) { + params[f] = args[idx]; + }); + // 删除 undefined + delete params['undefined']; + return func(params); + }; +} +/** + * 通用 geometry 的配置处理的 adaptor + * @param params + */ +function geometry$w(params) { + var chart = params.chart, options = params.options; + var type = options.type, args = options.args, mapping = options.mapping, xField = options.xField, yField = options.yField, colorField = options.colorField, shapeField = options.shapeField, sizeField = options.sizeField, tooltipFields = options.tooltipFields, label = options.label, state = options.state; + // 如果没有 mapping 信息，那么直接返回 + if (!mapping) { + return params; + } + var color = mapping.color, shape = mapping.shape, size = mapping.size, style = mapping.style, tooltip = mapping.tooltip; + // 创建 geometry + var geometry = chart[type](args).position(xField + "*" + yField); + /** + * color 的几种情况 + * g.color('red'); + * g.color('color', ['red', 'blue']); + * g.color('x', (x, y) => 'red'); + * g.color('color', (color, x, y) => 'red'); + */ + if (isString$3(color)) { + colorField ? geometry.color(colorField, color) : geometry.color(color); + } + else if (isFunction$6(color)) { + var _a = getMappingField(options, 'color'), mappingFields = _a.mappingFields, tileMappingField = _a.tileMappingField; + geometry.color(tileMappingField, getMappingFunction(mappingFields, color)); + } + else { + colorField && geometry.color(colorField, color); + } + /** + * shape 的几种情况 + * g.shape('rect'); + * g.shape('shape', ['rect', 'circle']); + * g.shape('x*y', (x, y) => 'rect'); + * g.shape('shape*x*y', (shape, x, y) => 'rect'); + */ + if (isString$3(shape)) { + shapeField ? geometry.shape(shapeField, [shape]) : geometry.shape(shape); // [shape] 需要在 G2 做掉 + } + else if (isFunction$6(shape)) { + var _b = getMappingField(options, 'shape'), mappingFields = _b.mappingFields, tileMappingField = _b.tileMappingField; + geometry.shape(tileMappingField, getMappingFunction(mappingFields, shape)); + } + else { + shapeField && geometry.shape(shapeField, shape); + } + /** + * size 的几种情况 + * g.size(10); + * g.size('size', [10, 20]); + * g.size('x*y', (x, y) => 10); + * g.color('size*x*y', (size, x, y) => 1-); + */ + if (isNumber$4(size)) { + sizeField ? geometry.size(sizeField, size) : geometry.size(size); + } + else if (isFunction$6(size)) { + var _c = getMappingField(options, 'size'), mappingFields = _c.mappingFields, tileMappingField = _c.tileMappingField; + geometry.size(tileMappingField, getMappingFunction(mappingFields, size)); + } + else { + sizeField && geometry.size(sizeField, size); + } + /** + * style 的几种情况 + * g.style({ fill: 'red' }); + * g.style('x*y*color', (x, y, color) => ({ fill: 'red' })); + */ + if (isFunction$6(style)) { + var _d = getMappingField(options, 'style'), mappingFields = _d.mappingFields, tileMappingField = _d.tileMappingField; + geometry.style(tileMappingField, getMappingFunction(mappingFields, style)); + } + else if (isObject$f(style)) { + geometry.style(style); + } + /** + * tooltip 的 API + * g.tooltip('x*y*color', (x, y, color) => ({ name, value })); + * g.tooltip(false); + */ + if (tooltipFields === false) { + geometry.tooltip(false); + } + else if (!isEmpty$1(tooltipFields)) { + geometry.tooltip(tooltipFields.join('*'), getMappingFunction(tooltipFields, tooltip)); + } + /** + * label 的映射 + */ + if (label === false) { + geometry.label(false); + } + else if (label) { + var callback = label.callback, fields = label.fields, cfg = __rest$G(label, ["callback", "fields"]); + geometry.label({ + fields: fields || [yField], + callback: callback, + cfg: transformLabel(cfg), + }); + } + /** + * state 状态样式 + */ + if (state) { + geometry.state(state); + } + // 防止因为 x y 字段做了通道映射，导致生成图例 + [xField, yField] + .filter(function (f) { return f !== colorField; }) + .forEach(function (f) { + chart.legend(f, false); + }); + return __assign$r(__assign$r({}, params), { + // geometry adaptor 额外需要做的事情，就是将创建好的 geometry 返回到下一层 adaptor，防止通过 type 查询的时候容易误判 + ext: { geometry: geometry } }); +} + +/** + * area geometry 的配置处理 + * @param params + */ +function area(params) { + var options = params.options; + var area = options.area, xField = options.xField, yField = options.yField, seriesField = options.seriesField, smooth = options.smooth, tooltip = options.tooltip; + var _a = getTooltipMapping(tooltip, [xField, yField, seriesField]), fields = _a.fields, formatter = _a.formatter; + // 如果存在才处理 + return area + ? geometry$w(deepAssign({}, params, { + options: { + type: 'area', + colorField: seriesField, + tooltipFields: fields, + mapping: __assign$r({ shape: smooth ? 'smooth' : 'area', tooltip: formatter }, area), + }, + })) + : params; +} + +/** + * line 辅助点的配置处理 + * @param params + */ +function line(params) { + var options = params.options; + var line = options.line, stepType = options.stepType, xField = options.xField, yField = options.yField, seriesField = options.seriesField, smooth = options.smooth, connectNulls = options.connectNulls, tooltip = options.tooltip; + var _a = getTooltipMapping(tooltip, [xField, yField, seriesField]), fields = _a.fields, formatter = _a.formatter; + // 如果存在才处理 + return line + ? geometry$w(deepAssign({}, params, { + options: { + type: 'line', + colorField: seriesField, + tooltipFields: fields, + mapping: deepMix({ + shape: stepType || (smooth ? 'smooth' : 'line'), + tooltip: formatter, + }, line), + args: { connectNulls: connectNulls }, + }, + })) + : params; +} + +/** + * point 辅助点的配置处理 + * @param params + */ +function point(params) { + var options = params.options; + var point = options.point, xField = options.xField, yField = options.yField, seriesField = options.seriesField, sizeField = options.sizeField, shapeField = options.shapeField, tooltip = options.tooltip; + var _a = getTooltipMapping(tooltip, [xField, yField, seriesField, sizeField, shapeField]), fields = _a.fields, formatter = _a.formatter; + return point + ? geometry$w(deepAssign({}, params, { + options: { + type: 'point', + colorField: seriesField, + shapeField: shapeField, + tooltipFields: fields, + mapping: __assign$r({ tooltip: formatter }, point), + }, + })) + : params; +} + +/** + * 柱形图其他的 adaptor + * @param params + */ +function otherAdaptor(params) { + var chart = params.chart, options = params.options, ext = params.ext; + var seriesField = options.seriesField, isGroup = options.isGroup, isStack = options.isStack, marginRatio = options.marginRatio, widthRatio = options.widthRatio, groupField = options.groupField, theme = options.theme; + /** + * adjust + */ + var adjust = []; + if (seriesField) { + // group + if (isGroup) { + adjust.push({ + type: 'dodge', + dodgeBy: groupField || seriesField, + marginRatio: marginRatio, + }); + } + // stack + if (isStack) { + adjust.push({ + type: 'stack', + marginRatio: marginRatio, + }); + } + } + if (adjust.length && (ext === null || ext === void 0 ? void 0 : ext.geometry)) { + var g = ext === null || ext === void 0 ? void 0 : ext.geometry; + g.adjust(adjust); + } + // widthRatio + if (!isNil(widthRatio)) { + chart.theme(deepAssign({}, isObject$f(theme) ? theme : getTheme(theme), { + // columWidthRatio 配置覆盖 theme 中的配置 + columnWidthRatio: widthRatio, + })); + } + return params; +} +function interval(params) { + var options = params.options; + var xField = options.xField, yField = options.yField, interval = options.interval, seriesField = options.seriesField, tooltip = options.tooltip, minColumnWidth = options.minColumnWidth, maxColumnWidth = options.maxColumnWidth, columnBackground = options.columnBackground, dodgePadding = options.dodgePadding, intervalPadding = options.intervalPadding; + var _a = getTooltipMapping(tooltip, [xField, yField, seriesField]), fields = _a.fields, formatter = _a.formatter; + // 保障一定要存在 interval 映射 + var ext = (interval + ? geometry$w(deepAssign({}, params, { + options: { + type: 'interval', + colorField: seriesField, + tooltipFields: fields, + mapping: __assign$r({ tooltip: formatter }, interval), + args: { dodgePadding: dodgePadding, intervalPadding: intervalPadding, minColumnWidth: minColumnWidth, maxColumnWidth: maxColumnWidth, background: columnBackground }, + }, + })) + : params).ext; + return otherAdaptor(__assign$r(__assign$r({}, params), { ext: ext })); +} + +/** + * polygon 的配置处理 + * @param params + */ +function polygon(params) { + var options = params.options; + var polygon = options.polygon, xField = options.xField, yField = options.yField, seriesField = options.seriesField, tooltip = options.tooltip; + var _a = getTooltipMapping(tooltip, [xField, yField, seriesField]), fields = _a.fields, formatter = _a.formatter; + return polygon + ? geometry$w(deepAssign({}, params, { + options: { + type: 'polygon', + colorField: seriesField, + tooltipFields: fields, + mapping: __assign$r({ tooltip: formatter }, polygon), + }, + })) + : params; +} + +/** + * edge 的配置处理 + * @param params + */ +function edge(params) { + var options = params.options; + var edge = options.edge, xField = options.xField, yField = options.yField, seriesField = options.seriesField, tooltip = options.tooltip; + var _a = getTooltipMapping(tooltip, [xField, yField, seriesField]), fields = _a.fields, formatter = _a.formatter; + return edge + ? geometry$w(deepAssign({}, params, { + options: { + type: 'edge', + colorField: seriesField, + tooltipFields: fields, + mapping: __assign$r({ tooltip: formatter }, edge), + }, + })) + : params; +} + +/** + * schema 的配置处理 + * @param params + */ +function schema(params) { + var options = params.options; + var schema = options.schema, xField = options.xField, yField = options.yField, seriesField = options.seriesField, tooltip = options.tooltip; + var _a = getTooltipMapping(tooltip, [xField, yField, seriesField]), fields = _a.fields, formatter = _a.formatter; + return schema + ? geometry$w(deepAssign({}, params, { + options: { + type: 'schema', + colorField: seriesField, + tooltipFields: fields, + mapping: __assign$r({ tooltip: formatter }, schema), + }, + })) + : params; +} + +/** + * violin 辅助点的配置处理 + * @param params + */ +function violin(params) { + var options = params.options; + var violin = options.violin, xField = options.xField, yField = options.yField, seriesField = options.seriesField, sizeField = options.sizeField, tooltip = options.tooltip; + var _a = getTooltipMapping(tooltip, [xField, yField, seriesField, sizeField]), fields = _a.fields, formatter = _a.formatter; + return violin + ? geometry$w(deepAssign({}, params, { + options: { + type: 'violin', + colorField: seriesField, + tooltipFields: fields, + mapping: __assign$r({ tooltip: formatter }, violin), + }, + })) + : params; +} + +/** + * geometry 配置处理 + * @param params + */ +function geometry$v(params) { + var chart = params.chart, options = params.options; + var data = options.data, color = options.color, lineStyle = options.lineStyle, lineShape = options.lineShape, pointMapping = options.point, seriesField = options.seriesField; + var pointState = pointMapping === null || pointMapping === void 0 ? void 0 : pointMapping.state; + chart.data(data); + // line geometry 处理 + var primary = deepAssign({}, params, { + options: { + shapeField: seriesField, + line: { + color: color, + style: lineStyle, + shape: lineShape, + }, + // 颜色保持一致，因为如果颜色不一致，会导致 tooltip 中元素重复。 + // 如果存在，才设置，否则为空 + point: pointMapping && __assign$r({ color: color, shape: 'circle' }, pointMapping), + // label 不传递给各个 geometry adaptor，由 label adaptor 处理 + label: undefined, + }, + }); + var second = deepAssign({}, primary, { options: { tooltip: false, state: pointState } }); + line(primary); + point(second); + return params; +} +/** + * meta 配置 + * @param params + */ +function meta$l(params) { + var _a, _b; + var options = params.options; + var xAxis = options.xAxis, yAxis = options.yAxis, xField = options.xField, yField = options.yField, data = options.data; + return flow(scale$3((_a = {}, + _a[xField] = xAxis, + _a[yField] = yAxis, + _a), (_b = {}, + _b[xField] = { + type: 'cat', + }, + _b[yField] = adjustYMetaByZero(data, yField), + _b)))(params); +} +/** + * axis 配置 + * @param params + */ +function axis$k(params) { + var chart = params.chart, options = params.options; + var xAxis = options.xAxis, yAxis = options.yAxis, xField = options.xField, yField = options.yField; + // 为 false 则是不显示轴 + if (xAxis === false) { + chart.axis(xField, false); + } + else { + chart.axis(xField, xAxis); + } + if (yAxis === false) { + chart.axis(yField, false); + } + else { + chart.axis(yField, yAxis); + } + return params; +} +/** + * legend 配置 + * @param params + */ +function legend$e(params) { + var chart = params.chart, options = params.options; + var legend = options.legend, seriesField = options.seriesField; + if (legend && seriesField) { + chart.legend(seriesField, legend); + } + else if (legend === false) { + chart.legend(false); + } + return params; +} +/** + * 数据标签 + * @param params + */ +function label$d(params) { + var chart = params.chart, options = params.options; + var label = options.label, yField = options.yField; + var lineGeometry = findGeometry(chart, 'line'); + // label 为 false, 空 则不显示 label + if (!label) { + lineGeometry.label(false); + } + else { + var callback = label.callback, cfg = __rest$G(label, ["callback"]); + lineGeometry.label({ + fields: [yField], + callback: callback, + cfg: __assign$r({ layout: [ + { type: 'limit-in-plot' }, + { type: 'path-adjust-position' }, + { type: 'point-adjust-position' }, + { type: 'limit-in-plot', cfg: { action: 'hide' } }, + ] }, transformLabel(cfg)), + }); + } + return params; +} +/** + * 统一处理 adjust + * @param params + */ +function adjust$2(params) { + var chart = params.chart, options = params.options; + var isStack = options.isStack; + if (isStack) { + each$2(chart.geometries, function (g) { + g.adjust('stack'); + }); + } + return params; +} +/** + * 折线图适配器 + * @param chart + * @param options + */ +function adaptor$y(params) { + // flow 的方式处理所有的配置到 G2 API + return flow(geometry$v, meta$l, adjust$2, theme$2, axis$k, legend$e, tooltip$8, label$d, slider$1, interaction$6, animation$5, annotation$2(), limitInPlot$2)(params); +} + +/** + * 折线图默认配置项 + */ +var DEFAULT_OPTIONS$z = deepAssign({}, Plot.getDefaultOptions(), { + tooltip: { + shared: true, + showMarkers: true, + showCrosshairs: true, + crosshairs: { + type: 'x', + }, + }, + legend: { + position: 'top-left', + }, + isStack: false, +}); + +var MarkerActiveAction = /** @class */ (function (_super) { + __extends$e(MarkerActiveAction, _super); + function MarkerActiveAction() { + return _super !== null && _super.apply(this, arguments) || this; + } + MarkerActiveAction.prototype.active = function () { + var view = this.getView(); + var evt = this.context.event; + if (evt.data) { + // items: 数组对象，当前 tooltip 显示的每条内容 + var items_1 = evt.data.items; + var points = view.geometries.filter(function (geom) { return geom.type === 'point'; }); + each$2(points, function (point) { + each$2(point.elements, function (element) { + var active = findIndex$2(items_1, function (item) { return item.data === element.data; }) !== -1; + // @ts-ignore + element.setState('active', active); + }); + }); + } + }; + MarkerActiveAction.prototype.getView = function () { + return this.context.view; + }; + return MarkerActiveAction; +}(Action$1)); + +registerAction('marker-active', MarkerActiveAction); +registerInteraction('marker-active', { + start: [ + { + trigger: 'tooltip:show', + action: 'marker-active:active', + }, + ], +}); + +var Line$3 = /** @class */ (function (_super) { + __extends$e(Line, _super); + function Line() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'line'; + return _this; + } + /** + * 获取 折线图 默认配置项 + * 供外部使用 + */ + Line.getDefaultOptions = function () { + return DEFAULT_OPTIONS$z; + }; + /** + * @override + * @param data + */ + Line.prototype.changeData = function (data) { + this.updateOption({ data: data }); + var _a = this, chart = _a.chart, options = _a.options; + meta$l({ chart: chart, options: options }); + this.chart.changeData(data); + }; + /** + * 获取 折线图 默认配置 + */ + Line.prototype.getDefaultOptions = function () { + return Line.getDefaultOptions(); + }; + /** + * 获取 折线图 的适配器 + */ + Line.prototype.getSchemaAdaptor = function () { + return adaptor$y; + }; + return Line; +}(Plot)); + +/** + * 对数据进行百分比化 + * @param data + * @param measure + * @param groupField + * @param as + */ +function percent(data, measure, groupField, as) { + // 1. 先计算每一个分组的 max 值 + var sumMap = reduce$1(data, function (map, datum) { + var groupValue = datum[groupField]; + var sum = map.has(groupValue) ? map.get(groupValue) : 0; + var v = datum[measure]; + sum = isRealNumber(v) ? sum + v : sum; + map.set(groupValue, sum); + return map; + }, new Map()); + // 2. 循环数组，计算占比 + return map$4(data, function (datum) { + var _a; + var v = datum[measure]; + var groupValue = datum[groupField]; + var percentage = isRealNumber(v) ? v / sumMap.get(groupValue) : 0; + return __assign$r(__assign$r({}, datum), (_a = {}, _a[as] = percentage, _a)); + }); +} +/** + * 对数据进行深层百分比化 + * @param data + * @param measure // 数值 + * @param fields // 需要分组的 field值 + * @param as // 存储percent 百分比的值 + */ +function getDeepPercent(data, measure, fields, percent) { + var sumMap = reduce$1(data, function (map, datum) { + // 获取分组得到的枚举key值 + var groupValue = reduce$1(fields, function (value, field) { return "" + value + datum[field]; }, ''); + var sum = map.has(groupValue) ? map.get(groupValue) : 0; + var v = datum[measure]; + sum = isRealNumber(v) ? sum + v : sum; + map.set(groupValue, sum); + return map; + }, new Map()); + // 2. 循环数组，计算占比 + return map$4(data, function (datum) { + var _a; + var v = datum[measure]; + // 获取分组得到的枚举key值 + var groupValue = reduce$1(fields, function (value, field) { return "" + value + datum[field]; }, ''); + var percentage = isRealNumber(v) ? v / sumMap.get(groupValue) : 0; + return __assign$r(__assign$r({}, datum), (_a = {}, _a[percent] = percentage, _a)); + }); +} +/** + * 获取数据，如果是百分比，进行数据转换 (适用于面积图、柱状图、条形图) + * @param isPercent 是否百分比 + */ +function getDataWhetherPecentage(data, yField, groupField, asField, isPercent) { + return !isPercent ? data : percent(data, yField, groupField, asField); +} + +/** + * geometry 处理 + * @param params + */ +function geometry$u(params) { + var chart = params.chart, options = params.options; + var data = options.data, areaStyle = options.areaStyle, color = options.color, pointMapping = options.point, lineMapping = options.line, isPercent = options.isPercent, xField = options.xField, yField = options.yField, tooltip = options.tooltip, seriesField = options.seriesField, startOnZero = options.startOnZero; + var pointState = pointMapping === null || pointMapping === void 0 ? void 0 : pointMapping.state; + var chartData = getDataWhetherPecentage(data, yField, xField, yField, isPercent); + chart.data(chartData); + // 百分比堆积图，默认会给一个 % 格式化逻辑, 用户可自定义 + var tooltipOptions = isPercent + ? __assign$r({ formatter: function (datum) { return ({ + name: datum[seriesField] || datum[xField], + value: (Number(datum[yField]) * 100).toFixed(2) + '%', + }); } }, tooltip) : tooltip; + var primary = deepAssign({}, params, { + options: { + area: { color: color, style: areaStyle }, + // 颜色保持一致，因为如果颜色不一致，会导致 tooltip 中元素重复。 + // 如果存在，才设置，否则为空 + line: lineMapping && __assign$r({ color: color }, lineMapping), + point: pointMapping && __assign$r({ color: color }, pointMapping), + tooltip: tooltipOptions, + // label 不传递给各个 geometry adaptor，由 label adaptor 处理 + label: undefined, + args: { + startOnZero: startOnZero, + }, + }, + }); + var second = deepAssign({}, primary, { options: { tooltip: false } }); + var pointParams = deepAssign({}, primary, { options: { tooltip: false, state: pointState } }); + // area geometry 处理 + area(primary); + line(second); + point(pointParams); + return params; +} +/** + * 数据标签 + * @param params + */ +function label$c(params) { + var chart = params.chart, options = params.options; + var label = options.label, yField = options.yField; + var areaGeometry = findGeometry(chart, 'area'); + // label 为 false, 空 则不显示 label + if (!label) { + areaGeometry.label(false); + } + else { + var callback = label.callback, cfg = __rest$G(label, ["callback"]); + areaGeometry.label({ + fields: [yField], + callback: callback, + cfg: __assign$r({ layout: [ + { type: 'limit-in-plot' }, + { type: 'path-adjust-position' }, + { type: 'point-adjust-position' }, + { type: 'limit-in-plot', cfg: { action: 'hide' } }, + ] }, transformLabel(cfg)), + }); + } + return params; +} +/** + * 处理 adjust + * @param params + */ +function adjust$1(params) { + var chart = params.chart, options = params.options; + var isStack = options.isStack, isPercent = options.isPercent, seriesField = options.seriesField; + if ((isPercent || isStack) && seriesField) { + each$2(chart.geometries, function (g) { + g.adjust('stack'); + }); + } + return params; +} +/** + * 折线图适配器 + * @param chart + * @param options + */ +function adaptor$x(params) { + // flow 的方式处理所有的配置到 G2 API + return flow(theme$2, pattern('areaStyle'), geometry$u, meta$l, adjust$1, axis$k, legend$e, tooltip$8, label$c, slider$1, annotation$2(), interaction$6, animation$5, limitInPlot$2)(params); +} + +/** + * 面积图默认配置项 + */ +var DEFAULT_OPTIONS$y = deepAssign({}, Plot.getDefaultOptions(), { + tooltip: { + shared: true, + showMarkers: true, + showCrosshairs: true, + crosshairs: { + type: 'x', + }, + }, + isStack: true, + // 默认开启 + line: {}, + legend: { + position: 'top-left', + }, +}); + +var Area$1 = /** @class */ (function (_super) { + __extends$e(Area, _super); + function Area() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'area'; + return _this; + } + /** + * 获取 面积图 默认配置项 + * 供外部使用 + */ + Area.getDefaultOptions = function () { + return DEFAULT_OPTIONS$y; + }; + /** + * 获取 面积图 默认配置 + */ + Area.prototype.getDefaultOptions = function () { + return Area.getDefaultOptions(); + }; + /** + * @override + * @param data + */ + Area.prototype.changeData = function (data) { + this.updateOption({ data: data }); + var _a = this.options, isPercent = _a.isPercent, xField = _a.xField, yField = _a.yField; + var _b = this, chart = _b.chart, options = _b.options; + meta$l({ chart: chart, options: options }); + this.chart.changeData(getDataWhetherPecentage(data, yField, xField, yField, isPercent)); + }; + /** + * 获取 面积图 的适配器 + */ + Area.prototype.getSchemaAdaptor = function () { + return adaptor$x; + }; + return Area; +}(Plot)); + +/** + * 转化率的计算方式 + * @param prev + * @param next + */ +function conversionTagFormatter(prev, next) { + if (!isNumber$4(prev) || !isNumber$4(next)) { + return '-'; + } + if (prev === next) { + return '100%'; + } + if (prev === 0) { + return '∞'; + } + if (next === 0) { + return '-∞'; + } + return ((100 * next) / prev).toFixed(2) + "%"; +} + +function getConversionTagOptionsWithDefaults(options, horizontal) { + return deepAssign({ + size: horizontal ? 32 : 80, + spacing: horizontal ? 8 : 12, + offset: horizontal ? 32 : 0, + arrow: options.arrow !== false && { + headSize: 12, + style: { + fill: 'rgba(0, 0, 0, 0.05)', + }, + }, + text: options.text !== false && { + style: { + fontSize: 12, + fill: 'rgba(0, 0, 0, 0.85)', + textAlign: 'center', + textBaseline: 'middle', + }, + formatter: conversionTagFormatter, + }, + }, options); +} +function parsePoints(coordinate, element) { + // @ts-ignore + return map$4(element.getModel().points, function (point) { return coordinate.convertPoint(point); }); +} +function renderArrowTag(config, elemPrev, elemNext) { + var view = config.view, geometry = config.geometry, group = config.group, options = config.options, horizontal = config.horizontal; + var offset = options.offset, size = options.size, arrow = options.arrow; + var coordinate = view.getCoordinate(); + var pointPrev = parsePoints(coordinate, elemPrev)[horizontal ? 3 : 0]; + var pointNext = parsePoints(coordinate, elemNext)[horizontal ? 0 : 3]; + var totalHeight = pointNext.y - pointPrev.y; + var totalWidth = pointNext.x - pointPrev.x; + if (typeof arrow === 'boolean') { + return; + } + var headSize = arrow.headSize; + var spacing = options.spacing; + var points; + if (horizontal) { + if ((totalWidth - headSize) / 2 < spacing) { + // 当柱间距不足容纳箭头尖与间隔时，画三角并挤占间隔 + spacing = Math.max(1, (totalWidth - headSize) / 2); + points = [ + [pointPrev.x + spacing, pointPrev.y - offset], + [pointPrev.x + spacing, pointPrev.y - offset - size], + [pointNext.x - spacing, pointNext.y - offset - size / 2], + ]; + } + else { + // 当柱间距足够时，画完整图形并留出间隔。 + points = [ + [pointPrev.x + spacing, pointPrev.y - offset], + [pointPrev.x + spacing, pointPrev.y - offset - size], + [pointNext.x - spacing - headSize, pointNext.y - offset - size], + [pointNext.x - spacing, pointNext.y - offset - size / 2], + [pointNext.x - spacing - headSize, pointNext.y - offset], + ]; + } + } + else { + if ((totalHeight - headSize) / 2 < spacing) { + // 当柱间距不足容纳箭头尖与间隔时，画三角并挤占间隔 + spacing = Math.max(1, (totalHeight - headSize) / 2); + points = [ + [pointPrev.x + offset, pointPrev.y + spacing], + [pointPrev.x + offset + size, pointPrev.y + spacing], + [pointNext.x + offset + size / 2, pointNext.y - spacing], + ]; + } + else { + // 当柱间距足够时，画完整图形并留出间隔。 + points = [ + [pointPrev.x + offset, pointPrev.y + spacing], + [pointPrev.x + offset + size, pointPrev.y + spacing], + [pointNext.x + offset + size, pointNext.y - spacing - headSize], + [pointNext.x + offset + size / 2, pointNext.y - spacing], + [pointNext.x + offset, pointNext.y - spacing - headSize], + ]; + } + } + group.addShape('polygon', { + id: view.id + "-conversion-tag-arrow-" + geometry.getElementId(elemPrev.getModel().mappingData), + name: 'conversion-tag-arrow', + origin: { + element: elemPrev, + nextElement: elemNext, + }, + attrs: __assign$r(__assign$r({}, (arrow.style || {})), { points: points }), + }); +} +function renderTextTag(config, elemPrev, elemNext) { + var _a, _b, _c; + var view = config.view, geometry = config.geometry, group = config.group, options = config.options, field = config.field, horizontal = config.horizontal; + var offset = options.offset, size = options.size; + if (typeof options.text === 'boolean') { + return; + } + var coordinate = view.getCoordinate(); + var text = ((_a = options.text) === null || _a === void 0 ? void 0 : _a.formatter) && ((_b = options.text) === null || _b === void 0 ? void 0 : _b.formatter(elemPrev.getData()[field], elemNext.getData()[field])); + var pointPrev = parsePoints(coordinate, elemPrev)[horizontal ? 3 : 0]; + var pointNext = parsePoints(coordinate, elemNext)[horizontal ? 0 : 3]; + var textShape = group.addShape('text', { + id: view.id + "-conversion-tag-text-" + geometry.getElementId(elemPrev.getModel().mappingData), + name: 'conversion-tag-text', + origin: { + element: elemPrev, + nextElement: elemNext, + }, + attrs: __assign$r(__assign$r({}, (((_c = options.text) === null || _c === void 0 ? void 0 : _c.style) || {})), { text: text, x: horizontal ? (pointPrev.x + pointNext.x) / 2 : pointPrev.x + offset + size / 2, y: horizontal ? pointPrev.y - offset - size / 2 : (pointPrev.y + pointNext.y) / 2 }), + }); + if (horizontal) { + var totalWidth = pointNext.x - pointPrev.x; + var textWidth = textShape.getBBox().width; + if (textWidth > totalWidth) { + var cWidth = textWidth / text.length; + var cEnd = Math.max(1, Math.ceil(totalWidth / cWidth) - 1); + var textAdjusted = text.slice(0, cEnd) + "..."; + textShape.attr('text', textAdjusted); + } + } +} +function renderTag(options, elemPrev, elemNext) { + renderArrowTag(options, elemPrev, elemNext); + renderTextTag(options, elemPrev, elemNext); +} +/** + * 返回支持转化率组件的 adaptor，适用于柱形图/条形图 + * @param field 用户转化率计算的字段 + * @param horizontal 是否水平方向的转化率 + * @param disabled 是否禁用 + */ +function conversionTag$3(field, horizontal, disabled) { + if (horizontal === void 0) { horizontal = true; } + if (disabled === void 0) { disabled = false; } + return function (params) { + var options = params.options, chart = params.chart; + var conversionTag = options.conversionTag, theme = options.theme; + if (conversionTag && !disabled) { + // 有转化率组件时，柱子宽度占比自动为 1/3 + chart.theme(deepAssign({}, isObject$f(theme) ? theme : getTheme(theme), { + columnWidthRatio: 1 / 3, + })); + // 使用 shape annotation 绘制转化率组件 + chart.annotation().shape({ + render: function (container, view) { + var group = container.addGroup({ + id: chart.id + "-conversion-tag-group", + name: 'conversion-tag-group', + }); + var interval = find$3(chart.geometries, function (geom) { return geom.type === 'interval'; }); + var config = { + view: view, + geometry: interval, + group: group, + field: field, + horizontal: horizontal, + options: getConversionTagOptionsWithDefaults(conversionTag, horizontal), + }; + var elements = horizontal ? interval.elements : interval.elements.slice().reverse(); + each$2(elements, function (elem, idx) { + if (idx > 0) { + renderTag(config, elements[idx - 1], elem); + } + }); + }, + }); + } + return params; + }; +} + +var INTERACTION_MAP = { + hover: '__interval-connected-area-hover__', + click: '__interval-connected-area-click__', +}; +var getStartStages = function (trigger, style) { + if (trigger === 'hover') { + return [ + { + trigger: "interval:mouseenter", + action: ['element-highlight-by-color:highlight', 'element-link-by-color:link'], + arg: [null, { style: style }], + }, + ]; + } + return [ + { + trigger: "interval:click", + action: [ + 'element-highlight-by-color:clear', + 'element-highlight-by-color:highlight', + 'element-link-by-color:clear', + 'element-link-by-color:unlink', + 'element-link-by-color:link', + ], + arg: [null, null, null, null, { style: style }], + }, + ]; +}; +/** hover 触发的连通区域交互 */ +registerInteraction(INTERACTION_MAP.hover, { + start: getStartStages(INTERACTION_MAP.hover), + end: [ + { + trigger: 'interval:mouseleave', + action: ['element-highlight-by-color:reset', 'element-link-by-color:unlink'], + }, + ], +}); +/** click 触发的联通区域交互 */ +registerInteraction(INTERACTION_MAP.click, { + start: getStartStages(INTERACTION_MAP.click), + end: [ + { + trigger: 'document:mousedown', + action: ['element-highlight-by-color:clear', 'element-link-by-color:clear'], + }, + ], +}); +/** + * 返回支持联通区域组件交互的 adaptor，适用于堆叠柱形图/堆叠条形图 + * @param disable + */ +function connectedArea(disable) { + if (disable === void 0) { disable = false; } + return function (params) { + var chart = params.chart, options = params.options; + var connectedArea = options.connectedArea; + var clear = function () { + chart.removeInteraction(INTERACTION_MAP.hover); + chart.removeInteraction(INTERACTION_MAP.click); + }; + if (!disable && connectedArea) { + var trigger = connectedArea.trigger || 'hover'; + clear(); + chart.interaction(INTERACTION_MAP[trigger], { + start: getStartStages(trigger, connectedArea.style), + }); + } + else { + clear(); + } + return params; + }; +} + +var PADDING_RIGHT = 10; +var PADDING_TOP$1 = 5; +/** + * Action 中的 Button 按钮配置 + * + * 可能的使用场景：brush filter + */ +var BUTTON_ACTION_CONFIG = { + padding: [8, 10], + text: 'reset', + textStyle: { + default: { + x: 0, + y: 0, + fontSize: 12, + fill: '#333333', + cursor: 'pointer', + }, + }, + buttonStyle: { + default: { + fill: '#f7f7f7', + stroke: '#cccccc', + cursor: 'pointer', + }, + active: { + fill: '#e6e6e6', + }, + }, +}; +/** + * @override 复写 G2 Button Action, 后续直接使用 GUI + */ +var ButtonAction = /** @class */ (function (_super) { + __extends$e(ButtonAction, _super); + function ButtonAction() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.buttonGroup = null; + _this.buttonCfg = __assign$r({ name: 'button' }, BUTTON_ACTION_CONFIG); + return _this; + } + /** + * 获取 mix 默认的配置和用户配置 + */ + ButtonAction.prototype.getButtonCfg = function () { + var view = this.context.view; + var buttonCfg = get$3(view, ['interactions', 'filter-action', 'cfg', 'buttonConfig']); + return deepAssign(this.buttonCfg, buttonCfg, this.cfg); + }; + /** + * 绘制 Button 和 文本 + */ + ButtonAction.prototype.drawButton = function () { + var config = this.getButtonCfg(); + var group = this.context.view.foregroundGroup.addGroup({ + name: config.name, + }); + var textShape = this.drawText(group); + this.drawBackground(group, textShape.getBBox()); + this.buttonGroup = group; + }; + /** + * 绘制文本 + */ + ButtonAction.prototype.drawText = function (group) { + var _a; + var config = this.getButtonCfg(); + // 添加文本 + return group.addShape({ + type: 'text', + name: 'button-text', + attrs: __assign$r({ text: config.text }, (_a = config.textStyle) === null || _a === void 0 ? void 0 : _a.default), + }); + }; + ButtonAction.prototype.drawBackground = function (group, bbox) { + var _a; + var config = this.getButtonCfg(); + var padding = normalPadding(config.padding); + // 添加背景按钮 + var buttonShape = group.addShape({ + type: 'rect', + name: 'button-rect', + attrs: __assign$r({ x: bbox.x - padding[3], y: bbox.y - padding[0], width: bbox.width + padding[1] + padding[3], height: bbox.height + padding[0] + padding[2] }, (_a = config.buttonStyle) === null || _a === void 0 ? void 0 : _a.default), + }); + buttonShape.toBack(); // 在后面 + // active 效果内置 + group.on('mouseenter', function () { + var _a; + buttonShape.attr((_a = config.buttonStyle) === null || _a === void 0 ? void 0 : _a.active); + }); + group.on('mouseleave', function () { + var _a; + buttonShape.attr((_a = config.buttonStyle) === null || _a === void 0 ? void 0 : _a.default); + }); + return buttonShape; + }; + // 重置位置 + ButtonAction.prototype.resetPosition = function () { + var view = this.context.view; + var coord = view.getCoordinate(); + var point = coord.convert({ x: 1, y: 1 }); // 后面直接改成左上角 + var buttonGroup = this.buttonGroup; + var bbox = buttonGroup.getBBox(); + var matrix = Util$1.transform(null, [ + ['t', point.x - bbox.width - PADDING_RIGHT, point.y + bbox.height + PADDING_TOP$1], + ]); + buttonGroup.setMatrix(matrix); + }; + /** + * 显示 + */ + ButtonAction.prototype.show = function () { + if (!this.buttonGroup) { + this.drawButton(); + } + this.resetPosition(); + this.buttonGroup.show(); + }; + /** + * 隐藏 + */ + ButtonAction.prototype.hide = function () { + if (this.buttonGroup) { + this.buttonGroup.hide(); + } + }; + /** + * 销毁 + */ + ButtonAction.prototype.destroy = function () { + var buttonGroup = this.buttonGroup; + if (buttonGroup) { + buttonGroup.remove(); + } + _super.prototype.destroy.call(this); + }; + return ButtonAction; +}(Action$1)); + +registerAction('brush-reset-button', ButtonAction, { + name: 'brush-reset-button', +}); +registerInteraction('filter-action', {}); +/** + * G2 已经内置了 brush、brush-x、brush-y 等交互，其它： + * + * 1. element-range-highlight 是否可用重命名为 brush-highlight？(mask 可以移动) + * 2. brush-visible 与 brush 的区别是？ + */ +function isPointInView(context) { + return context.isInPlot(); +} +/** + * 获取 交互 start 阶段的相关配置 + */ +function getInteractionCfg(interactionType, brushType, mask) { + var maskType = brushType || 'rect'; + switch (interactionType) { + case 'brush': + return { + showEnable: [ + { trigger: 'plot:mouseenter', action: 'cursor:crosshair' }, + { trigger: 'plot:mouseleave', action: 'cursor:default' }, + ], + start: [ + { + trigger: 'mousedown', + isEnable: isPointInView, + action: ['brush:start', maskType + "-mask:start", maskType + "-mask:show"], + // 对应第二个action的参数 + arg: [null, { maskStyle: mask === null || mask === void 0 ? void 0 : mask.style }], + }, + ], + processing: [ + { + trigger: 'mousemove', + isEnable: isPointInView, + action: [maskType + "-mask:resize"], + }, + ], + end: [ + { + trigger: 'mouseup', + isEnable: isPointInView, + action: [ + 'brush:filter', + 'brush:end', + maskType + "-mask:end", + maskType + "-mask:hide", + 'brush-reset-button:show', + ], + }, + ], + rollback: [ + { + trigger: 'brush-reset-button:click', + action: ['brush:reset', 'brush-reset-button:hide', 'cursor:crosshair'], + }, + ], + }; + case 'brush-highlight': + return { + showEnable: [ + { trigger: 'plot:mouseenter', action: 'cursor:crosshair' }, + { trigger: 'mask:mouseenter', action: 'cursor:move' }, + { trigger: 'plot:mouseleave', action: 'cursor:default' }, + { trigger: 'mask:mouseleave', action: 'cursor:crosshair' }, + ], + start: [ + { + trigger: 'plot:mousedown', + isEnable: function (context) { + // 不要点击在 mask 上重新开始 + return !context.isInShape('mask'); + }, + action: [maskType + "-mask:start", maskType + "-mask:show"], + // 对应第 1 个action的参数 + arg: [{ maskStyle: mask === null || mask === void 0 ? void 0 : mask.style }], + }, + { + trigger: 'mask:dragstart', + action: [maskType + "-mask:moveStart"], + }, + ], + processing: [ + { + trigger: 'plot:mousemove', + action: [maskType + "-mask:resize"], + }, + { + trigger: 'mask:drag', + action: [maskType + "-mask:move"], + }, + { + trigger: 'mask:change', + action: ['element-range-highlight:highlight'], + }, + ], + end: [ + { trigger: 'plot:mouseup', action: [maskType + "-mask:end"] }, + { trigger: 'mask:dragend', action: [maskType + "-mask:moveEnd"] }, + { + trigger: 'document:mouseup', + isEnable: function (context) { + return !context.isInPlot(); + }, + action: ['element-range-highlight:clear', maskType + "-mask:end", maskType + "-mask:hide"], + }, + ], + rollback: [{ trigger: 'dblclick', action: ['element-range-highlight:clear', maskType + "-mask:hide"] }], + }; + case 'brush-x': + return { + showEnable: [ + { trigger: 'plot:mouseenter', action: 'cursor:crosshair' }, + { trigger: 'plot:mouseleave', action: 'cursor:default' }, + ], + start: [ + { + trigger: 'mousedown', + isEnable: isPointInView, + action: ['brush-x:start', maskType + "-mask:start", maskType + "-mask:show"], + // 对应第二个action的参数 + arg: [null, { maskStyle: mask === null || mask === void 0 ? void 0 : mask.style }], + }, + ], + processing: [ + { + trigger: 'mousemove', + isEnable: isPointInView, + action: [maskType + "-mask:resize"], + }, + ], + end: [ + { + trigger: 'mouseup', + isEnable: isPointInView, + action: ['brush-x:filter', 'brush-x:end', maskType + "-mask:end", maskType + "-mask:hide"], + }, + ], + rollback: [{ trigger: 'dblclick', action: ['brush-x:reset'] }], + }; + case 'brush-x-highlight': + return { + showEnable: [ + { trigger: 'plot:mouseenter', action: 'cursor:crosshair' }, + { trigger: 'mask:mouseenter', action: 'cursor:move' }, + { trigger: 'plot:mouseleave', action: 'cursor:default' }, + { trigger: 'mask:mouseleave', action: 'cursor:crosshair' }, + ], + start: [ + { + trigger: 'plot:mousedown', + isEnable: function (context) { + // 不要点击在 mask 上重新开始 + return !context.isInShape('mask'); + }, + action: [maskType + "-mask:start", maskType + "-mask:show"], + // 对应第 1 个action的参数 + arg: [{ maskStyle: mask === null || mask === void 0 ? void 0 : mask.style }], + }, + { + trigger: 'mask:dragstart', + action: [maskType + "-mask:moveStart"], + }, + ], + processing: [ + { + trigger: 'plot:mousemove', + action: [maskType + "-mask:resize"], + }, + { + trigger: 'mask:drag', + action: [maskType + "-mask:move"], + }, + { + trigger: 'mask:change', + action: ['element-range-highlight:highlight'], + }, + ], + end: [ + { trigger: 'plot:mouseup', action: [maskType + "-mask:end"] }, + { trigger: 'mask:dragend', action: [maskType + "-mask:moveEnd"] }, + { + trigger: 'document:mouseup', + isEnable: function (context) { + return !context.isInPlot(); + }, + action: ['element-range-highlight:clear', maskType + "-mask:end", maskType + "-mask:hide"], + }, + ], + rollback: [{ trigger: 'dblclick', action: ['element-range-highlight:clear', maskType + "-mask:hide"] }], + }; + case 'brush-y': + return { + showEnable: [ + { trigger: 'plot:mouseenter', action: 'cursor:crosshair' }, + { trigger: 'plot:mouseleave', action: 'cursor:default' }, + ], + start: [ + { + trigger: 'mousedown', + isEnable: isPointInView, + action: ['brush-y:start', maskType + "-mask:start", maskType + "-mask:show"], + // 对应第二个action的参数 + arg: [null, { maskStyle: mask === null || mask === void 0 ? void 0 : mask.style }], + }, + ], + processing: [ + { + trigger: 'mousemove', + isEnable: isPointInView, + action: [maskType + "-mask:resize"], + }, + ], + end: [ + { + trigger: 'mouseup', + isEnable: isPointInView, + action: ['brush-y:filter', 'brush-y:end', maskType + "-mask:end", maskType + "-mask:hide"], + }, + ], + rollback: [{ trigger: 'dblclick', action: ['brush-y:reset'] }], + }; + case 'brush-y-highlight': + return { + showEnable: [ + { trigger: 'plot:mouseenter', action: 'cursor:crosshair' }, + { trigger: 'mask:mouseenter', action: 'cursor:move' }, + { trigger: 'plot:mouseleave', action: 'cursor:default' }, + { trigger: 'mask:mouseleave', action: 'cursor:crosshair' }, + ], + start: [ + { + trigger: 'plot:mousedown', + isEnable: function (context) { + // 不要点击在 mask 上重新开始 + return !context.isInShape('mask'); + }, + action: [maskType + "-mask:start", maskType + "-mask:show"], + // 对应第 1 个action的参数 + arg: [{ maskStyle: mask === null || mask === void 0 ? void 0 : mask.style }], + }, + { + trigger: 'mask:dragstart', + action: [maskType + "-mask:moveStart"], + }, + ], + processing: [ + { + trigger: 'plot:mousemove', + action: [maskType + "-mask:resize"], + }, + { + trigger: 'mask:drag', + action: [maskType + "-mask:move"], + }, + { + trigger: 'mask:change', + action: ['element-range-highlight:highlight'], + }, + ], + end: [ + { trigger: 'plot:mouseup', action: [maskType + "-mask:end"] }, + { trigger: 'mask:dragend', action: [maskType + "-mask:moveEnd"] }, + { + trigger: 'document:mouseup', + isEnable: function (context) { + return !context.isInPlot(); + }, + action: ['element-range-highlight:clear', maskType + "-mask:end", maskType + "-mask:hide"], + }, + ], + rollback: [{ trigger: 'dblclick', action: ['element-range-highlight:clear', maskType + "-mask:hide"] }], + }; + default: + return {}; + } +} +// 直接拷贝过来的 +registerInteraction('brush', getInteractionCfg('brush')); +// 复写 element-range-highlight interaction +registerInteraction('brush-highlight', getInteractionCfg('brush-highlight')); +// 复写 +registerInteraction('brush-x', getInteractionCfg('brush-x', 'x-rect')); +// 复写 +registerInteraction('brush-y', getInteractionCfg('brush-y', 'y-rect')); +// 新增, x 框选高亮 +registerInteraction('brush-x-highlight', getInteractionCfg('brush-x-highlight', 'x-rect')); +// 新增, y 框选高亮 +registerInteraction('brush-y-highlight', getInteractionCfg('brush-y-highlight', 'y-rect')); + +var BRUSH_TYPES = ['brush', 'brush-x', 'brush-y', 'brush-highlight', 'brush-x-highlight', 'brush-y-highlight']; +/** + * brush 交互 + */ +function brushInteraction(params) { + var options = params.options; + var brush = options.brush; + // 先过滤掉 brush 等交互 + var interactions = filter$1(options.interactions || [], function (i) { return BRUSH_TYPES.indexOf(i.type) === -1; }); + // 设置 brush 交互 + if (brush === null || brush === void 0 ? void 0 : brush.enabled) { + BRUSH_TYPES.forEach(function (type) { + var _a; + var enable = false; + switch (brush.type) { + case 'x-rect': + enable = type === (brush.action === 'highlight' ? 'brush-x-highlight' : 'brush-x'); + break; + case 'y-rect': + enable = type === (brush.action === 'highlight' ? 'brush-y-highlight' : 'brush-y'); + break; + default: + enable = type === (brush.action === 'highlight' ? 'brush-highlight' : 'brush'); + break; + } + var obj = { type: type, enable: enable }; + if (((_a = brush.mask) === null || _a === void 0 ? void 0 : _a.style) || brush.type) { + obj.cfg = getInteractionCfg(type, brush.type, brush.mask); + } + interactions.push(obj); + }); + // 塞入 button 配置 (G2Plot 的封装) + if ((brush === null || brush === void 0 ? void 0 : brush.action) !== 'highlight') { + interactions.push({ + type: 'filter-action', + cfg: { + buttonConfig: brush.button, + }, + }); + } + } + return deepAssign({}, params, { options: { interactions: interactions } }); +} + +/** + * defaultOptions + * @param params + */ +function defaultOptions$5(params) { + var options = params.options; + // 默认 legend 位置 + var legend = options.legend; + var seriesField = options.seriesField, isStack = options.isStack; + if (seriesField) { + if (legend !== false) { + legend = __assign$r({ position: isStack ? 'right-top' : 'top-left' }, legend); + } + } + else { + legend = false; + } + // @ts-ignore 直接改值 + params.options.legend = legend; + return params; +} +/** + * 字段 + * @param params + */ +function geometry$t(params) { + var chart = params.chart, options = params.options; + var data = options.data, columnStyle = options.columnStyle, color = options.color, columnWidthRatio = options.columnWidthRatio, isPercent = options.isPercent, isGroup = options.isGroup, isStack = options.isStack, xField = options.xField, yField = options.yField, seriesField = options.seriesField, groupField = options.groupField, tooltip = options.tooltip; + var percentData = isPercent && isGroup && isStack + ? getDeepPercent(data, yField, [xField, groupField], yField) + : getDataWhetherPecentage(data, yField, xField, yField, isPercent); + var chartData = []; + // 存在堆叠,并且存在堆叠seriesField分类，并且不存在分组的时候 进行堆叠 + if (isStack && seriesField && !isGroup) { + percentData.forEach(function (item) { + var stackedItem = chartData.find(function (v) { return v[xField] === item[xField] && v[seriesField] === item[seriesField]; }); + if (stackedItem) { + stackedItem[yField] += item[yField] || 0; + } + else { + chartData.push(__assign$r({}, item)); + } + }); + } + else { + chartData = percentData; + } + chart.data(chartData); + // 百分比堆积图，默认会给一个 % 格式化逻辑, 用户可自定义 + var tooltipOptions = isPercent + ? __assign$r({ formatter: function (datum) { return ({ + name: isGroup && isStack ? datum[seriesField] + " - " + datum[groupField] : datum[seriesField] || datum[xField], + value: (Number(datum[yField]) * 100).toFixed(2) + '%', + }); } }, tooltip) : tooltip; + var p = deepAssign({}, params, { + options: { + data: chartData, + widthRatio: columnWidthRatio, + tooltip: tooltipOptions, + interval: { + style: columnStyle, + color: color, + }, + }, + }); + interval(p); + return p; +} +/** + * meta 配置 + * @param params + */ +function meta$k(params) { + var _a, _b; + var options = params.options; + var xAxis = options.xAxis, yAxis = options.yAxis, xField = options.xField, yField = options.yField, data = options.data, isPercent = options.isPercent; + var percentYMeta = isPercent ? { max: 1, min: 0, minLimit: 0, maxLimit: 1 } : {}; + return flow(scale$3((_a = {}, + _a[xField] = xAxis, + _a[yField] = yAxis, + _a), (_b = {}, + _b[xField] = { + type: 'cat', + }, + _b[yField] = __assign$r(__assign$r({}, adjustYMetaByZero(data, yField)), percentYMeta), + _b)))(params); +} +/** + * axis 配置 + * @param params + */ +function axis$j(params) { + var chart = params.chart, options = params.options; + var xAxis = options.xAxis, yAxis = options.yAxis, xField = options.xField, yField = options.yField; + // 为 false 则是不显示轴 + if (xAxis === false) { + chart.axis(xField, false); + } + else { + chart.axis(xField, xAxis); + } + if (yAxis === false) { + chart.axis(yField, false); + } + else { + chart.axis(yField, yAxis); + } + return params; +} +/** + * legend 配置 + * @param params + */ +function legend$d(params) { + var chart = params.chart, options = params.options; + var legend = options.legend, seriesField = options.seriesField; + if (legend && seriesField) { + chart.legend(seriesField, legend); + } + else if (legend === false) { + chart.legend(false); + } + return params; +} +/** + * 数据标签 + * @param params + */ +function label$b(params) { + var chart = params.chart, options = params.options; + var label = options.label, yField = options.yField, isRange = options.isRange; + var geometry = findGeometry(chart, 'interval'); + if (!label) { + geometry.label(false); + } + else { + var callback = label.callback, cfg = __rest$G(label, ["callback"]); + geometry.label({ + fields: [yField], + callback: callback, + cfg: __assign$r({ + // 配置默认的 label layout： 如果用户没有指定 layout 和 position， 则自动配置 layout + layout: (cfg === null || cfg === void 0 ? void 0 : cfg.position) ? undefined + : [ + { type: 'interval-adjust-position' }, + { type: 'interval-hide-overlap' }, + { type: 'adjust-color' }, + { type: 'limit-in-plot', cfg: { action: 'hide' } }, + ] }, transformLabel(isRange + ? __assign$r({ content: function (item) { + var _a; + return (_a = item[yField]) === null || _a === void 0 ? void 0 : _a.join('-'); + } }, cfg) : cfg)), + }); + } + return params; +} +/** + * 柱形图 tooltip 配置 (对堆叠、分组做特殊处理) + * @param params + */ +function columnTooltip(params) { + var chart = params.chart, options = params.options; + var tooltip = options.tooltip, isGroup = options.isGroup, isStack = options.isStack, groupField = options.groupField, data = options.data, xField = options.xField, yField = options.yField, seriesField = options.seriesField; + if (tooltip === false) { + chart.tooltip(false); + } + else { + var tooltipOptions = tooltip; + // fix: https://github.com/antvis/G2Plot/issues/2572 + if (isGroup && isStack) { + var tooltipFormatter_1 = (tooltipOptions === null || tooltipOptions === void 0 ? void 0 : tooltipOptions.formatter) || + (function (datum) { return ({ name: datum[seriesField] + " - " + datum[groupField], value: datum[yField] }); }); + tooltipOptions = __assign$r(__assign$r({}, tooltipOptions), { customItems: function (originalItems) { + var items = []; + each$2(originalItems, function (item) { + // Find datas in same cluster + var datas = filter$1(data, function (d) { return isMatch(d, pick$1(item.data, [xField, seriesField])); }); + datas.forEach(function (datum) { + items.push(__assign$r(__assign$r(__assign$r({}, item), { value: datum[yField], data: datum, mappingData: { _origin: datum } }), tooltipFormatter_1(datum))); + }); + }); + return items; + } }); + } + chart.tooltip(tooltipOptions); + } + return params; +} +/** + * 柱形图适配器 + * @param params + */ +function adaptor$w(params, isBar) { + if (isBar === void 0) { isBar = false; } + var options = params.options; + var seriesField = options.seriesField; + return flow(defaultOptions$5, // 处理默认配置 + theme$2, // theme 需要在 geometry 之前 + pattern('columnStyle'), state, geometry$t, meta$k, axis$j, legend$d, columnTooltip, slider$1, scrollbar, label$b, brushInteraction, interaction$6, animation$5, annotation$2(), conversionTag$3(options.yField, !isBar, !!seriesField), // 有拆分的时候禁用转化率 + connectedArea(!options.isStack), limitInPlot$2)(params); +} + +/** + * 柱形图默认配置项 + */ +var DEFAULT_OPTIONS$x = deepAssign({}, Plot.getDefaultOptions(), { + columnWidthRatio: 0.6, + marginRatio: 1 / 32, + tooltip: { + shared: true, + showMarkers: false, + offset: 20, + }, + interactions: [{ type: 'active-region' }], +}); + +/** + * 柱形图 + */ +var Column$1 = /** @class */ (function (_super) { + __extends$e(Column, _super); + function Column() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'column'; + return _this; + } + /** + * 获取 柱形图 默认配置项 + * 供外部使用 + */ + Column.getDefaultOptions = function () { + return DEFAULT_OPTIONS$x; + }; + /** + * @override + */ + Column.prototype.changeData = function (data) { + this.updateOption({ data: data }); + var _a = this.options, yField = _a.yField, xField = _a.xField, isPercent = _a.isPercent; + var _b = this, chart = _b.chart, options = _b.options; + meta$k({ chart: chart, options: options }); + this.chart.changeData(getDataWhetherPecentage(data, yField, xField, yField, isPercent)); + }; + /** + * 获取 柱形图 默认配置 + */ + Column.prototype.getDefaultOptions = function () { + return Column.getDefaultOptions(); + }; + /** + * 获取 柱形图 的适配器 + */ + Column.prototype.getSchemaAdaptor = function () { + return adaptor$w; + }; + return Column; +}(Plot)); + +/** + * 条形图数据需要进行反转 + * @param data + */ +function transformBarData(data) { + return data ? data.slice().reverse() : data; +} + +/** + * 柱形图适配器 + * @param params + */ +function adaptor$v(params) { + var chart = params.chart, options = params.options; + var xField = options.xField, yField = options.yField, xAxis = options.xAxis, yAxis = options.yAxis, barStyle = options.barStyle, barWidthRatio = options.barWidthRatio, label = options.label, data = options.data, seriesField = options.seriesField, isStack = options.isStack, minBarWidth = options.minBarWidth, maxBarWidth = options.maxBarWidth; + // label of bar charts default position is left, if plot has label + if (label && !label.position) { + label.position = 'left'; + // 配置默认的 label layout： 如果用户没有指定 layout 和 position， 则自动配置 layout + if (!label.layout) { + label.layout = [ + { type: 'interval-adjust-position' }, + { type: 'interval-hide-overlap' }, + { type: 'adjust-color' }, + { type: 'limit-in-plot', cfg: { action: 'hide' } }, + ]; + } + } + // 默认 legend 位置 + var legend = options.legend; + if (seriesField) { + if (legend !== false) { + legend = __assign$r({ position: isStack ? 'top-left' : 'right-top', reversed: isStack ? false : true }, (legend || {})); + } + } + else { + legend = false; + } + // @ts-ignore 直接改值 + params.options.legend = legend; + // 默认 tooltip 配置 + var tooltip = options.tooltip; + if (seriesField) { + if (tooltip !== false) { + tooltip = __assign$r({ reversed: isStack ? false : true }, (tooltip || {})); + } + } + // @ts-ignore 直接改值 + params.options.tooltip = tooltip; + // transpose column to bar + chart.coordinate().transpose(); + return adaptor$w({ + chart: chart, + options: __assign$r(__assign$r({}, options), { label: label, + // switch xField and yField + xField: yField, yField: xField, xAxis: yAxis, yAxis: xAxis, + // rename attrs as column + columnStyle: barStyle, columnWidthRatio: barWidthRatio, minColumnWidth: minBarWidth, maxColumnWidth: maxBarWidth, columnBackground: options.barBackground, + // bar 调整数据顺序 + data: transformBarData(data) }), + }, true); +} + +/** + * 条形图默认配置项 + */ +var DEFAULT_OPTIONS$w = deepAssign({}, Plot.getDefaultOptions(), { + barWidthRatio: 0.6, + marginRatio: 1 / 32, + tooltip: { + shared: true, + showMarkers: false, + offset: 20, + }, + interactions: [{ type: 'active-region' }], +}); + +/** + * 条形图 + */ +var Bar$1 = /** @class */ (function (_super) { + __extends$e(Bar, _super); + function Bar() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'bar'; + return _this; + } + /** + * 获取 条形图 默认配置项 + * 供外部使用 + */ + Bar.getDefaultOptions = function () { + return DEFAULT_OPTIONS$w; + }; + /** + * @override + */ + Bar.prototype.changeData = function (data) { + this.updateOption({ data: data }); + var _a = this, chart = _a.chart, options = _a.options; + var xField = options.xField, yField = options.yField, isPercent = options.isPercent; + var switchedFieldOptions = __assign$r(__assign$r({}, options), { xField: yField, yField: xField }); + meta$k({ chart: chart, options: switchedFieldOptions }); + chart.changeData(getDataWhetherPecentage(transformBarData(data), xField, yField, xField, isPercent)); + }; + /** + * 获取 条形图 默认配置 + */ + Bar.prototype.getDefaultOptions = function () { + return Bar.getDefaultOptions(); + }; + /** + * 获取 条形图 的适配器 + */ + Bar.prototype.getSchemaAdaptor = function () { + return adaptor$v; + }; + return Bar; +}(Plot)); + +/** + * 饼图默认配置项 + */ +var DEFAULT_OPTIONS$v = deepAssign({}, Plot.getDefaultOptions(), { + legend: { + position: 'right', + }, + tooltip: { + shared: false, + showTitle: false, + showMarkers: false, + }, + label: { + layout: { type: 'limit-in-plot', cfg: { action: 'ellipsis' } }, + }, + /** 饼图样式, 不影响暗黑主题 */ + pieStyle: { + stroke: 'white', + lineWidth: 1, + }, + /** 饼图中心文本默认样式 */ + statistic: { + title: { + style: { fontWeight: 300, color: '#4B535E', textAlign: 'center', fontSize: '20px', lineHeight: 1 }, + }, + content: { + style: { + fontWeight: 'bold', + color: 'rgba(44,53,66,0.85)', + textAlign: 'center', + fontSize: '32px', + lineHeight: 1, + }, + }, + }, + /** 默认关闭 text-annotation 动画 */ + theme: { + components: { + annotation: { + text: { + animate: false, + }, + }, + }, + }, +}); + +/** + * 获取总计值 + * @param data + * @param field + */ +function getTotalValue(data, field) { + var total = null; + each$2(data, function (item) { + if (typeof item[field] === 'number') { + total += item[field]; + } + }); + return total; +} +/** + * pie label offset adaptor + */ +function adaptOffset(type, offset) { + var defaultOffset; + switch (type) { + case 'inner': + defaultOffset = '-30%'; + if (isString$3(offset) && offset.endsWith('%')) { + return parseFloat(offset) * 0.01 > 0 ? defaultOffset : offset; + } + return offset < 0 ? offset : defaultOffset; + case 'outer': + defaultOffset = 12; + if (isString$3(offset) && offset.endsWith('%')) { + return parseFloat(offset) * 0.01 < 0 ? defaultOffset : offset; + } + return offset > 0 ? offset : defaultOffset; + default: + return offset; + } +} +/** + * 判断数据是否全部为 0 + * @param data + * @param angleField + */ +function isAllZero(data, angleField) { + return every(processIllegalData(data, angleField), function (d) { return d[angleField] === 0; }); +} + +var ORIGIN_MATRIX = [1, 0, 0, 0, 1, 0, 0, 0, 1]; +/** + * 矩阵变换 + * @param actions + * @param matrix + */ +function transform$d(actions, matrix) { + var ulMatrix = matrix ? __spreadArrays$1(matrix) : __spreadArrays$1(ORIGIN_MATRIX); + return Util$1.transform(ulMatrix, actions); +} + +/** + * 饼图 图例激活 action + */ +var PieLegendAction = /** @class */ (function (_super) { + __extends$e(PieLegendAction, _super); + function PieLegendAction() { + return _super !== null && _super.apply(this, arguments) || this; + } + /** + * 获取激活的图形元素 + */ + PieLegendAction.prototype.getActiveElements = function () { + var delegateObject = Util$1.getDelegationObject(this.context); + if (delegateObject) { + var view = this.context.view; + var component = delegateObject.component, item_1 = delegateObject.item; + var field_1 = component.get('field'); + if (field_1) { + var elements = view.geometries[0].elements; + return elements.filter(function (ele) { return ele.getModel().data[field_1] === item_1.value; }); + } + } + return []; + }; + /** + * 获取激活的标签 + */ + PieLegendAction.prototype.getActiveElementLabels = function () { + var view = this.context.view; + var elements = this.getActiveElements(); + var labels = view.geometries[0].labelsContainer.getChildren(); + return labels.filter(function (label) { return elements.find(function (ele) { return isEqual$2(ele.getData(), label.get('data')); }); }); + }; + PieLegendAction.prototype.transfrom = function (offset) { + if (offset === void 0) { offset = 7.5; } + var elements = this.getActiveElements(); + var elementLabels = this.getActiveElementLabels(); + elements.forEach(function (element, idx) { + var labelShape = elementLabels[idx]; + var coordinate = element.geometry.coordinate; + if (coordinate.isPolar && coordinate.isTransposed) { + var _a = Util$1.getAngle(element.getModel(), coordinate), startAngle = _a.startAngle, endAngle = _a.endAngle; + var middleAngle = (startAngle + endAngle) / 2; + var r = offset; + var x = r * Math.cos(middleAngle); + var y = r * Math.sin(middleAngle); + element.shape.setMatrix(transform$d([['t', x, y]])); + labelShape.setMatrix(transform$d([['t', x, y]])); + } + }); + }; + PieLegendAction.prototype.active = function () { + this.transfrom(); + }; + /** + * 激活态还原 + */ + PieLegendAction.prototype.reset = function () { + this.transfrom(0); + }; + return PieLegendAction; +}(Action$1)); + +/** + * Pie 中心文本事件的 Action + */ +var StatisticAction = /** @class */ (function (_super) { + __extends$e(StatisticAction, _super); + function StatisticAction() { + return _super !== null && _super.apply(this, arguments) || this; + } + StatisticAction.prototype.getAnnotations = function (_view) { + var view = _view || this.context.view; + // @ts-ignore + return view.getController('annotation').option; + }; + StatisticAction.prototype.getInitialAnnotation = function () { + return this.initialAnnotation; + }; + StatisticAction.prototype.init = function () { + var _this = this; + var view = this.context.view; + view.removeInteraction('tooltip'); + view.on('afterchangesize', function () { + var annotations = _this.getAnnotations(view); + _this.initialAnnotation = annotations; + }); + }; + StatisticAction.prototype.change = function (arg) { + var _a = this.context, view = _a.view, event = _a.event; + if (!this.initialAnnotation) { + this.initialAnnotation = this.getAnnotations(); + } + var data = get$3(event, ['data', 'data']); + if (event.type.match('legend-item')) { + var delegateObject = Util$1.getDelegationObject(this.context); + // @ts-ignore + var colorField_1 = view.getGroupedFields()[0]; + if (delegateObject && colorField_1) { + var item_1 = delegateObject.item; + data = view.getData().find(function (d) { return d[colorField_1] === item_1.value; }); + } + } + if (data) { + var annotations = get$3(arg, 'annotations', []); + var statistic = get$3(arg, 'statistic', {}); + // 先清空标注，再重新渲染 + view.getController('annotation').clear(true); + // 先进行其他 annotations，再去渲染统计文本 + each$2(annotations, function (annotation) { + if (typeof annotation === 'object') { + view.annotation()[annotation.type](annotation); + } + }); + renderStatistic(view, { statistic: statistic, plotType: 'pie' }, data); + view.render(true); + } + }; + StatisticAction.prototype.reset = function () { + var view = this.context.view; + var annotationController = view.getController('annotation'); + annotationController.clear(true); + var initialStatistic = this.getInitialAnnotation(); + each$2(initialStatistic, function (a) { + view.annotation()[a.type](a); + }); + view.render(true); + }; + return StatisticAction; +}(Action$1)); + +var PIE_STATISTIC = 'pie-statistic'; +registerAction(PIE_STATISTIC, StatisticAction); +registerInteraction('pie-statistic-active', { + start: [{ trigger: 'element:mouseenter', action: 'pie-statistic:change' }], + end: [{ trigger: 'element:mouseleave', action: 'pie-statistic:reset' }], +}); +registerAction('pie-legend', PieLegendAction); +registerInteraction('pie-legend-active', { + start: [{ trigger: 'legend-item:mouseenter', action: 'pie-legend:active' }], + end: [{ trigger: 'legend-item:mouseleave', action: 'pie-legend:reset' }], +}); + +/** + * 字段 + * @param params + */ +function geometry$s(params) { + var chart = params.chart, options = params.options; + var data = options.data, angleField = options.angleField, colorField = options.colorField, color = options.color, pieStyle = options.pieStyle; + // 处理不合法的数据 + var processData = processIllegalData(data, angleField); + if (isAllZero(processData, angleField)) { + // 数据全 0 处理，调整 position 映射 + var percentageField_1 = '$$percentage$$'; + processData = processData.map(function (d) { + var _a; + return (__assign$r(__assign$r({}, d), (_a = {}, _a[percentageField_1] = 1 / processData.length, _a))); + }); + chart.data(processData); + var p = deepAssign({}, params, { + options: { + xField: '1', + yField: percentageField_1, + seriesField: colorField, + isStack: true, + interval: { + color: color, + style: pieStyle, + }, + args: { + zIndexReversed: true, + }, + }, + }); + interval(p); + } + else { + chart.data(processData); + var p = deepAssign({}, params, { + options: { + xField: '1', + yField: angleField, + seriesField: colorField, + isStack: true, + interval: { + color: color, + style: pieStyle, + }, + args: { + zIndexReversed: true, + }, + }, + }); + interval(p); + } + return params; +} +/** + * meta 配置 + * @param params + */ +function meta$j(params) { + var _a; + var chart = params.chart, options = params.options; + var meta = options.meta, colorField = options.colorField; + // meta 直接是 scale 的信息 + var scales = deepAssign({}, meta); + chart.scale(scales, (_a = {}, + _a[colorField] = { type: 'cat' }, + _a)); + return params; +} +/** + * coord 配置 + * @param params + */ +function coordinate$7(params) { + var chart = params.chart, options = params.options; + var radius = options.radius, innerRadius = options.innerRadius, startAngle = options.startAngle, endAngle = options.endAngle; + chart.coordinate({ + type: 'theta', + cfg: { + radius: radius, + innerRadius: innerRadius, + startAngle: startAngle, + endAngle: endAngle, + }, + }); + return params; +} +/** + * label 配置 + * @param params + */ +function label$a(params) { + var chart = params.chart, options = params.options; + var label = options.label, colorField = options.colorField, angleField = options.angleField; + var geometry = chart.geometries[0]; + // label 为 false, 空 则不显示 label + if (!label) { + geometry.label(false); + } + else { + var callback = label.callback, cfg = __rest$G(label, ["callback"]); + var labelCfg = transformLabel(cfg); + // ① 提供模板字符串的 label content 配置 + if (labelCfg.content) { + var content_1 = labelCfg.content; + labelCfg.content = function (data, dataum, index) { + var name = data[colorField]; + var value = data[angleField]; + // dymatic get scale, scale is ready this time + var angleScale = chart.getScaleByField(angleField); + var percent = angleScale === null || angleScale === void 0 ? void 0 : angleScale.scale(value); + return isFunction$6(content_1) + ? // append pecent (number) to data, users can get origin data from `dataum._origin` + content_1(__assign$r(__assign$r({}, data), { percent: percent }), dataum, index) + : isString$3(content_1) + ? template(content_1, { + value: value, + name: name, + // percentage (string), default keep 2 + percentage: isNumber$4(percent) && !isNil(value) ? (percent * 100).toFixed(2) + "%" : null, + }) + : content_1; + }; + } + var LABEL_LAYOUT_TYPE_MAP = { + inner: '', + outer: 'pie-outer', + spider: 'pie-spider', + }; + var labelLayoutType = labelCfg.type ? LABEL_LAYOUT_TYPE_MAP[labelCfg.type] : 'pie-outer'; + var labelLayoutCfg = labelCfg.layout ? (!isArray$n(labelCfg.layout) ? [labelCfg.layout] : labelCfg.layout) : []; + labelCfg.layout = (labelLayoutType ? [{ type: labelLayoutType }] : []).concat(labelLayoutCfg); + geometry.label({ + // fix: could not create scale, when field is undefined（attributes 中的 fields 定义都会被用来创建 scale） + fields: colorField ? [angleField, colorField] : [angleField], + callback: callback, + cfg: __assign$r(__assign$r({}, labelCfg), { offset: adaptOffset(labelCfg.type, labelCfg.offset), type: 'pie' }), + }); + } + return params; +} +/** + * statistic options 处理 + * 1. 默认继承 default options 的样式 + * 2. 默认使用 meta 的 formatter + */ +function transformStatisticOptions(options) { + var innerRadius = options.innerRadius, statistic = options.statistic, angleField = options.angleField, colorField = options.colorField, meta = options.meta, locale = options.locale; + var i18n = getLocale(locale); + if (innerRadius && statistic) { + var _a = deepAssign({}, DEFAULT_OPTIONS$v.statistic, statistic), titleOpt_1 = _a.title, contentOpt_1 = _a.content; + if (titleOpt_1 !== false) { + titleOpt_1 = deepAssign({}, { + formatter: function (datum) { + // 交互中 + if (datum) { + return datum[colorField]; + } + return !isNil(titleOpt_1.content) ? titleOpt_1.content : i18n.get(['statistic', 'total']); + }, + }, titleOpt_1); + } + if (contentOpt_1 !== false) { + contentOpt_1 = deepAssign({}, { + formatter: function (datum, data) { + var dataValue = datum ? datum[angleField] : getTotalValue(data, angleField); + var metaFormatter = get$3(meta, [angleField, 'formatter']) || (function (v) { return v; }); + // 交互中 + if (datum) { + return metaFormatter(dataValue); + } + return !isNil(contentOpt_1.content) ? contentOpt_1.content : metaFormatter(dataValue); + }, + }, contentOpt_1); + } + return deepAssign({}, { statistic: { title: titleOpt_1, content: contentOpt_1 } }, options); + } + return options; +} +/** + * statistic 中心文本配置 + * @param params + */ +function pieAnnotation(params) { + var chart = params.chart, options = params.options; + var _a = transformStatisticOptions(options), innerRadius = _a.innerRadius, statistic = _a.statistic; + // 先清空标注，再重新渲染 + chart.getController('annotation').clear(true); + // 先进行其他 annotations，再去渲染统计文本 + flow(annotation$2())(params); + /** 中心文本 指标卡 */ + if (innerRadius && statistic) { + renderStatistic(chart, { statistic: statistic, plotType: 'pie' }); + } + return params; +} +/** + * 饼图 tooltip 配置 + * 1. 强制 tooltip.shared 为 false + * @param params + */ +function tooltip$7(params) { + var chart = params.chart, options = params.options; + var tooltip = options.tooltip, colorField = options.colorField, angleField = options.angleField, data = options.data; + if (tooltip === false) { + chart.tooltip(tooltip); + } + else { + chart.tooltip(deepAssign({}, tooltip, { shared: false })); + // 主要解决 all zero， 对于非 all zero 不再适用 + if (isAllZero(data, angleField)) { + var fields = get$3(tooltip, 'fields'); + var formatter = get$3(tooltip, 'formatter'); + if (isEmpty$1(get$3(tooltip, 'fields'))) { + fields = [colorField, angleField]; + formatter = formatter || (function (datum) { return ({ name: datum[colorField], value: toString$7(datum[angleField]) }); }); + } + chart.geometries[0].tooltip(fields.join('*'), getMappingFunction(fields, formatter)); + } + } + return params; +} +/** + * Interaction 配置 (饼图特殊的 interaction, 中心文本变更的时候，需要将一些配置参数传进去） + * @param params + */ +function interaction$5(params) { + var chart = params.chart, options = params.options; + var _a = transformStatisticOptions(options), interactions = _a.interactions, statistic = _a.statistic, annotations = _a.annotations; + each$2(interactions, function (i) { + var _a, _b; + if (i.enable === false) { + chart.removeInteraction(i.type); + } + else if (i.type === 'pie-statistic-active') { + // 只针对 start 阶段的配置，进行添加参数信息 + var startStages_1 = []; + if (!((_a = i.cfg) === null || _a === void 0 ? void 0 : _a.start)) { + startStages_1 = [ + { + trigger: 'element:mouseenter', + action: PIE_STATISTIC + ":change", + arg: { statistic: statistic, annotations: annotations }, + }, + ]; + } + each$2((_b = i.cfg) === null || _b === void 0 ? void 0 : _b.start, function (stage) { + startStages_1.push(__assign$r(__assign$r({}, stage), { arg: { statistic: statistic, annotations: annotations } })); + }); + chart.interaction(i.type, deepAssign({}, i.cfg, { start: startStages_1 })); + } + else { + chart.interaction(i.type, i.cfg || {}); + } + }); + return params; +} +/** + * 饼图适配器 + * @param chart + * @param options + */ +function adaptor$u(params) { + // flow 的方式处理所有的配置到 G2 API + return flow(pattern('pieStyle'), geometry$s, meta$j, theme$2, coordinate$7, legend$f, tooltip$7, label$a, state, + /** 指标卡中心文本 放在下层 */ + pieAnnotation, interaction$5, animation$5)(params); +} + +var Pie$1 = /** @class */ (function (_super) { + __extends$e(Pie, _super); + function Pie() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'pie'; + return _this; + } + /** + * 获取 饼图 默认配置项 + * 供外部使用 + */ + Pie.getDefaultOptions = function () { + return DEFAULT_OPTIONS$v; + }; + /** + * 更新数据 + * @param data + */ + Pie.prototype.changeData = function (data) { + this.chart.emit(VIEW_LIFE_CIRCLE.BEFORE_CHANGE_DATA, Event$1.fromData(this.chart, VIEW_LIFE_CIRCLE.BEFORE_CHANGE_DATA, null)); + var prevOptions = this.options; + var angleField = this.options.angleField; + var prevData = processIllegalData(prevOptions.data, angleField); + var curData = processIllegalData(data, angleField); + // 如果上一次或当前数据全为 0，则重新渲染 + if (isAllZero(prevData, angleField) || isAllZero(curData, angleField)) { + this.update({ data: data }); + } + else { + this.updateOption({ data: data }); + this.chart.data(curData); + // todo 后续让 G2 层在 afterrender 之后，来重绘 annotations + pieAnnotation({ chart: this.chart, options: this.options }); + this.chart.render(true); + } + this.chart.emit(VIEW_LIFE_CIRCLE.AFTER_CHANGE_DATA, Event$1.fromData(this.chart, VIEW_LIFE_CIRCLE.AFTER_CHANGE_DATA, null)); + }; + /** + * 获取 饼图 默认配置项, 供 base 获取 + */ + Pie.prototype.getDefaultOptions = function () { + return Pie.getDefaultOptions(); + }; + /** + * 获取 饼图 的适配器 + */ + Pie.prototype.getSchemaAdaptor = function () { + return adaptor$u; + }; + return Pie; +}(Plot)); + +/** + * geometry 配置处理 + * @param params + */ +function geometry$r(params) { + var chart = params.chart, options = params.options; + var data = options.data, sectorStyle = options.sectorStyle, color = options.color; + // 装载数据 + chart.data(data); + flow(interval)(deepAssign({}, params, { + options: { + marginRatio: 1, + interval: { + style: sectorStyle, + color: color, + }, + }, + })); + return params; +} +/** + * label 配置 + * @param params + */ +function label$9(params) { + var chart = params.chart, options = params.options; + var label = options.label, xField = options.xField; + var geometry = findGeometry(chart, 'interval'); + // label 为 false 不显示 label + if (label === false) { + geometry.label(false); + } + else if (isObject$f(label)) { + var callback = label.callback, fields = label.fields, cfg = __rest$G(label, ["callback", "fields"]); + var offset = cfg.offset; + var layout = cfg.layout; + // 当 label 在 shape 外部显示时，设置 'limit-in-shape' 会 + // 造成 label 不显示。 + if (offset === undefined || offset >= 0) { + layout = layout ? (isArray$n(layout) ? layout : [layout]) : []; + cfg.layout = filter$1(layout, function (v) { return v.type !== 'limit-in-shape'; }); + cfg.layout.length || delete cfg.layout; + } + geometry.label({ + fields: fields || [xField], + callback: callback, + cfg: transformLabel(cfg), + }); + } + else { + log(LEVEL.WARN, label === null, 'the label option must be an Object.'); + geometry.label({ fields: [xField] }); + } + return params; +} +/** + * legend 配置 + * @param params + */ +function legend$c(params) { + var chart = params.chart, options = params.options; + var legend = options.legend, seriesField = options.seriesField; + if (legend === false) { + chart.legend(false); + } + else if (seriesField) { + chart.legend(seriesField, legend); + } + return params; +} +/** + * coord 配置 + * @param params + */ +function coordinate$6(params) { + var chart = params.chart, options = params.options; + var radius = options.radius, innerRadius = options.innerRadius, startAngle = options.startAngle, endAngle = options.endAngle; + chart.coordinate({ + type: 'polar', + cfg: { + radius: radius, + innerRadius: innerRadius, + startAngle: startAngle, + endAngle: endAngle, + }, + }); + return params; +} +/** + * meta 配置 + * @param params + */ +function meta$i(params) { + var _a; + var options = params.options; + var xAxis = options.xAxis, yAxis = options.yAxis, xField = options.xField, yField = options.yField; + return flow(scale$3((_a = {}, + _a[xField] = xAxis, + _a[yField] = yAxis, + _a)))(params); +} +/** + * axis 配置 + * @param params + */ +function axis$i(params) { + var chart = params.chart, options = params.options; + var xAxis = options.xAxis, yAxis = options.yAxis, xField = options.xField, yField = options.yField; + // 为 falsy 则是不显示轴 + if (!xAxis) { + chart.axis(xField, false); + } + else { + chart.axis(xField, xAxis); + } + if (!yAxis) { + chart.axis(yField, false); + } + else { + chart.axis(yField, yAxis); + } + return params; +} +/** + * 玫瑰图适配器 + * @param chart + * @param options + */ +function adaptor$t(params) { + // flow 的方式处理所有的配置到 G2 API + flow(pattern('sectorStyle'), geometry$r, meta$i, label$9, coordinate$6, axis$i, legend$c, tooltip$8, interaction$6, animation$5, theme$2, annotation$2(), state)(params); +} + +/** + * 玫瑰图 默认配置项 + */ +var DEFAULT_OPTIONS$u = deepAssign({}, Plot.getDefaultOptions(), { + xAxis: false, + yAxis: false, + legend: { + position: 'right', + }, + sectorStyle: { + stroke: '#fff', + lineWidth: 1, + }, + label: { + layout: { + type: 'limit-in-shape', + }, + }, + tooltip: { + shared: true, + showMarkers: false, + }, + interactions: [{ type: 'active-region' }], +}); + +var Rose$1 = /** @class */ (function (_super) { + __extends$e(Rose, _super); + function Rose() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 玫瑰图 */ + _this.type = 'rose'; + return _this; + } + /** + * 获取 玫瑰图 默认配置项 + * 供外部使用 + */ + Rose.getDefaultOptions = function () { + return DEFAULT_OPTIONS$u; + }; + /** + * @override + * @param data + */ + Rose.prototype.changeData = function (data) { + this.updateOption({ data: data }); + this.chart.changeData(data); + }; + /** + * 获取默认的 options 配置项 + */ + Rose.prototype.getDefaultOptions = function () { + return Rose.getDefaultOptions(); + }; + /** + * 获取 玫瑰图 的适配器 + */ + Rose.prototype.getSchemaAdaptor = function () { + return adaptor$t; + }; + return Rose; +}(Plot)); + +var DEFAULT_OPTIONS$t = { + font: function () { return 'serif'; }, + padding: 1, + size: [500, 500], + spiral: 'archimedean', + // timeInterval: Infinity // max execute time + timeInterval: 3000, +}; +/** + * 根据对应的数据对象，计算每个 + * 词语在画布中的渲染位置，并返回 + * 计算后的数据对象 + * @param words + * @param options + */ +function wordCloud(words, options) { + // 混入默认配置 + options = mix({}, DEFAULT_OPTIONS$t, options); + return transform$c(words, options); +} +/** + * 抛出没有混入默认配置的方法，用于测试。 + * @param words + * @param options + */ +function transform$c(words, options) { + // 布局对象 + var layout = tagCloud(); + ['font', 'fontSize', 'fontWeight', 'padding', 'rotate', 'size', 'spiral', 'timeInterval', 'random'].forEach(function (key) { + if (!isNil(options[key])) { + layout[key](options[key]); + } + }); + layout.words(words); + if (options.imageMask) { + layout.createMask(options.imageMask); + } + var result = layout.start(); + var tags = result._tags; + tags.forEach(function (tag) { + tag.x += options.size[0] / 2; + tag.y += options.size[1] / 2; + }); + var _a = options.size, w = _a[0], h = _a[1]; + // 添加两个参照数据，分别表示左上角和右下角。 + // 不添加的话不会按照真实的坐标渲染，而是以 + // 数据中的边界坐标为边界进行拉伸，以铺满画布。 + // 这样的后果会导致词语之间的重叠。 + tags.push({ + text: '', + value: 0, + x: 0, + y: 0, + opacity: 0, + }); + tags.push({ + text: '', + value: 0, + x: w, + y: h, + opacity: 0, + }); + return tags; +} +var cloudRadians = Math.PI / 180, cw = (1 << 11) >> 5, ch = 1 << 11; +function cloudText(d) { + return d.text; +} +function cloudFont() { + return 'serif'; +} +function cloudFontNormal() { + return 'normal'; +} +function cloudFontSize(d) { + return d.value; +} +function cloudRotate() { + return ~~(Math.random() * 2) * 90; +} +function cloudPadding() { + return 1; +} +// Fetches a monochrome sprite bitmap for the specified text. +// Load in batches for speed. +function cloudSprite(contextAndRatio, d, data, di) { + if (d.sprite) + return; + var c = contextAndRatio.context, ratio = contextAndRatio.ratio; + c.clearRect(0, 0, (cw << 5) / ratio, ch / ratio); + var x = 0, y = 0, maxh = 0; + var n = data.length; + --di; + while (++di < n) { + d = data[di]; + c.save(); + c.font = d.style + ' ' + d.weight + ' ' + ~~((d.size + 1) / ratio) + 'px ' + d.font; + var w = c.measureText(d.text + 'm').width * ratio, h = d.size << 1; + if (d.rotate) { + var sr = Math.sin(d.rotate * cloudRadians), cr = Math.cos(d.rotate * cloudRadians), wcr = w * cr, wsr = w * sr, hcr = h * cr, hsr = h * sr; + w = ((Math.max(Math.abs(wcr + hsr), Math.abs(wcr - hsr)) + 0x1f) >> 5) << 5; + h = ~~Math.max(Math.abs(wsr + hcr), Math.abs(wsr - hcr)); + } + else { + w = ((w + 0x1f) >> 5) << 5; + } + if (h > maxh) + maxh = h; + if (x + w >= cw << 5) { + x = 0; + y += maxh; + maxh = 0; + } + if (y + h >= ch) + break; + c.translate((x + (w >> 1)) / ratio, (y + (h >> 1)) / ratio); + if (d.rotate) + c.rotate(d.rotate * cloudRadians); + c.fillText(d.text, 0, 0); + if (d.padding) { + c.lineWidth = 2 * d.padding; + c.strokeText(d.text, 0, 0); + } + c.restore(); + d.width = w; + d.height = h; + d.xoff = x; + d.yoff = y; + d.x1 = w >> 1; + d.y1 = h >> 1; + d.x0 = -d.x1; + d.y0 = -d.y1; + d.hasText = true; + x += w; + } + var pixels = c.getImageData(0, 0, (cw << 5) / ratio, ch / ratio).data, sprite = []; + while (--di >= 0) { + d = data[di]; + if (!d.hasText) + continue; + var w = d.width, w32 = w >> 5; + var h = d.y1 - d.y0; + // Zero the buffer + for (var i = 0; i < h * w32; i++) + sprite[i] = 0; + x = d.xoff; + if (x == null) + return; + y = d.yoff; + var seen = 0, seenRow = -1; + for (var j = 0; j < h; j++) { + for (var i = 0; i < w; i++) { + var k = w32 * j + (i >> 5), m = pixels[((y + j) * (cw << 5) + (x + i)) << 2] ? 1 << (31 - (i % 32)) : 0; + sprite[k] |= m; + seen |= m; + } + if (seen) + seenRow = j; + else { + d.y0++; + h--; + j--; + y++; + } + } + d.y1 = d.y0 + seenRow; + d.sprite = sprite.slice(0, (d.y1 - d.y0) * w32); + } +} +// Use mask-based collision detection. +function cloudCollide(tag, board, sw) { + sw >>= 5; + var sprite = tag.sprite, w = tag.width >> 5, lx = tag.x - (w << 4), sx = lx & 0x7f, msx = 32 - sx, h = tag.y1 - tag.y0; + var x = (tag.y + tag.y0) * sw + (lx >> 5), last; + for (var j = 0; j < h; j++) { + last = 0; + for (var i = 0; i <= w; i++) { + if (((last << msx) | (i < w ? (last = sprite[j * w + i]) >>> sx : 0)) & board[x + i]) + return true; + } + x += sw; + } + return false; +} +function cloudBounds(bounds, d) { + var b0 = bounds[0], b1 = bounds[1]; + if (d.x + d.x0 < b0.x) + b0.x = d.x + d.x0; + if (d.y + d.y0 < b0.y) + b0.y = d.y + d.y0; + if (d.x + d.x1 > b1.x) + b1.x = d.x + d.x1; + if (d.y + d.y1 > b1.y) + b1.y = d.y + d.y1; +} +function collideRects(a, b) { + return a.x + a.x1 > b[0].x && a.x + a.x0 < b[1].x && a.y + a.y1 > b[0].y && a.y + a.y0 < b[1].y; +} +function archimedeanSpiral(size) { + var e = size[0] / size[1]; + return function (t) { + return [e * (t *= 0.1) * Math.cos(t), t * Math.sin(t)]; + }; +} +function rectangularSpiral(size) { + var dy = 4, dx = (dy * size[0]) / size[1]; + var x = 0, y = 0; + return function (t) { + var sign = t < 0 ? -1 : 1; + // See triangular numbers: T_n = n * (n + 1) / 2. + switch ((Math.sqrt(1 + 4 * sign * t) - sign) & 3) { + case 0: + x += dx; + break; + case 1: + y += dy; + break; + case 2: + x -= dx; + break; + default: + y -= dy; + break; + } + return [x, y]; + }; +} +// TODO reuse arrays? +function zeroArray$1(n) { + var a = []; + var i = -1; + while (++i < n) + a[i] = 0; + return a; +} +function cloudCanvas() { + return document.createElement('canvas'); +} +function functor(d) { + return isFunction$6(d) + ? d + : function () { + return d; + }; +} +var spirals = { + archimedean: archimedeanSpiral, + rectangular: rectangularSpiral, +}; +function tagCloud() { + var size = [256, 256], font = cloudFont, fontSize = cloudFontSize, fontWeight = cloudFontNormal, rotate = cloudRotate, padding = cloudPadding, spiral = archimedeanSpiral, random = Math.random, words = [], timeInterval = Infinity; + var text = cloudText; + var fontStyle = cloudFontNormal; + var canvas = cloudCanvas; + var cloud = {}; + cloud.start = function () { + var width = size[0], height = size[1]; + var contextAndRatio = getContext(canvas()), board = cloud.board ? cloud.board : zeroArray$1((size[0] >> 5) * size[1]), n = words.length, tags = [], data = words + .map(function (d, i, data) { + d.text = text.call(this, d, i, data); + d.font = font.call(this, d, i, data); + d.style = fontStyle.call(this, d, i, data); + d.weight = fontWeight.call(this, d, i, data); + d.rotate = rotate.call(this, d, i, data); + d.size = ~~fontSize.call(this, d, i, data); + d.padding = padding.call(this, d, i, data); + return d; + }) + .sort(function (a, b) { + return b.size - a.size; + }); + var i = -1, bounds = !cloud.board + ? null + : [ + { + x: 0, + y: 0, + }, + { + x: width, + y: height, + }, + ]; + step(); + function step() { + var start = Date.now(); + while (Date.now() - start < timeInterval && ++i < n) { + var d = data[i]; + d.x = (width * (random() + 0.5)) >> 1; + d.y = (height * (random() + 0.5)) >> 1; + cloudSprite(contextAndRatio, d, data, i); + if (d.hasText && place(board, d, bounds)) { + tags.push(d); + if (bounds) { + if (!cloud.hasImage) { + // update bounds if image mask not set + cloudBounds(bounds, d); + } + } + else { + bounds = [ + { x: d.x + d.x0, y: d.y + d.y0 }, + { x: d.x + d.x1, y: d.y + d.y1 }, + ]; + } + // Temporary hack + d.x -= size[0] >> 1; + d.y -= size[1] >> 1; + } + } + cloud._tags = tags; + cloud._bounds = bounds; + } + return cloud; + }; + function getContext(canvas) { + canvas.width = canvas.height = 1; + var ratio = Math.sqrt(canvas.getContext('2d').getImageData(0, 0, 1, 1).data.length >> 2); + canvas.width = (cw << 5) / ratio; + canvas.height = ch / ratio; + var context = canvas.getContext('2d'); + context.fillStyle = context.strokeStyle = 'red'; + context.textAlign = 'center'; + return { context: context, ratio: ratio }; + } + function place(board, tag, bounds) { + // const perimeter = [{ x: 0, y: 0 }, { x: size[0], y: size[1] }], + var startX = tag.x, startY = tag.y, maxDelta = Math.sqrt(size[0] * size[0] + size[1] * size[1]), s = spiral(size), dt = random() < 0.5 ? 1 : -1; + var dxdy, t = -dt, dx, dy; + while ((dxdy = s((t += dt)))) { + dx = ~~dxdy[0]; + dy = ~~dxdy[1]; + if (Math.min(Math.abs(dx), Math.abs(dy)) >= maxDelta) + break; + tag.x = startX + dx; + tag.y = startY + dy; + if (tag.x + tag.x0 < 0 || tag.y + tag.y0 < 0 || tag.x + tag.x1 > size[0] || tag.y + tag.y1 > size[1]) + continue; + // TODO only check for collisions within current bounds. + if (!bounds || !cloudCollide(tag, board, size[0])) { + if (!bounds || collideRects(tag, bounds)) { + var sprite = tag.sprite, w = tag.width >> 5, sw = size[0] >> 5, lx = tag.x - (w << 4), sx = lx & 0x7f, msx = 32 - sx, h = tag.y1 - tag.y0; + var last = void 0, x = (tag.y + tag.y0) * sw + (lx >> 5); + for (var j = 0; j < h; j++) { + last = 0; + for (var i = 0; i <= w; i++) { + board[x + i] |= (last << msx) | (i < w ? (last = sprite[j * w + i]) >>> sx : 0); + } + x += sw; + } + delete tag.sprite; + return true; + } + } + } + return false; + } + cloud.createMask = function (img) { + var can = document.createElement('canvas'); + var width = size[0], height = size[1]; + // 当 width 或 height 为 0 时，调用 cxt.getImageData 会报错 + if (!width || !height) { + return; + } + var w32 = width >> 5; + var board = zeroArray$1((width >> 5) * height); + can.width = width; + can.height = height; + var cxt = can.getContext('2d'); + cxt.drawImage(img, 0, 0, img.width, img.height, 0, 0, width, height); + var imageData = cxt.getImageData(0, 0, width, height).data; + for (var j = 0; j < height; j++) { + for (var i = 0; i < width; i++) { + var k = w32 * j + (i >> 5); + var tmp = (j * width + i) << 2; + var flag = imageData[tmp] >= 250 && imageData[tmp + 1] >= 250 && imageData[tmp + 2] >= 250; + var m = flag ? 1 << (31 - (i % 32)) : 0; + board[k] |= m; + } + } + cloud.board = board; + cloud.hasImage = true; + }; + cloud.timeInterval = function (_) { + timeInterval = _ == null ? Infinity : _; + }; + cloud.words = function (_) { + words = _; + }; + cloud.size = function (_) { + size = [+_[0], +_[1]]; + }; + cloud.font = function (_) { + font = functor(_); + }; + cloud.fontWeight = function (_) { + fontWeight = functor(_); + }; + cloud.rotate = function (_) { + rotate = functor(_); + }; + cloud.spiral = function (_) { + spiral = spirals[_] || _; + }; + cloud.fontSize = function (_) { + fontSize = functor(_); + }; + cloud.padding = function (_) { + padding = functor(_); + }; + cloud.random = function (_) { + random = functor(_); + }; + return cloud; +} + +/** + * 用 DataSet 转换词云图数据 + * @param params + */ +function transform$b(params) { + var rawOptions = params.options, chart = params.chart; + var _a = chart, width = _a.width, height = _a.height, chartPadding = _a.padding, appendPadding = _a.appendPadding, ele = _a.ele; + var data = rawOptions.data, imageMask = rawOptions.imageMask, wordField = rawOptions.wordField, weightField = rawOptions.weightField, colorField = rawOptions.colorField, wordStyle = rawOptions.wordStyle, timeInterval = rawOptions.timeInterval, random = rawOptions.random, spiral = rawOptions.spiral, _b = rawOptions.autoFit, autoFit = _b === void 0 ? true : _b, placementStrategy = rawOptions.placementStrategy; + if (!data || !data.length) { + return []; + } + var fontFamily = wordStyle.fontFamily, fontWeight = wordStyle.fontWeight, padding = wordStyle.padding, fontSize = wordStyle.fontSize; + var arr = getSingleKeyValues(data, weightField); + var range = [min$4(arr), max$5(arr)]; + // 变换出 text 和 value 字段 + var words = data.map(function (datum) { return ({ + text: datum[wordField], + value: datum[weightField], + color: datum[colorField], + datum: datum, + }); }); + var options = { + imageMask: imageMask, + font: fontFamily, + fontSize: getFontSizeMapping(fontSize, range), + fontWeight: fontWeight, + // 图表宽高减去 padding 之后的宽高 + size: getSize$1({ + width: width, + height: height, + padding: chartPadding, + appendPadding: appendPadding, + autoFit: autoFit, + container: ele, + }), + padding: padding, + timeInterval: timeInterval, + random: random, + spiral: spiral, + rotate: getRotate(rawOptions), + }; + // 自定义布局函数 + if (isFunction$6(placementStrategy)) { + var result = words.map(function (word, index, words) { return (__assign$r(__assign$r(__assign$r({}, word), { hasText: !!word.text, font: functor(options.font)(word, index, words), weight: functor(options.fontWeight)(word, index, words), rotate: functor(options.rotate)(word, index, words), size: functor(options.fontSize)(word, index, words), style: 'normal' }), placementStrategy.call(chart, word, index, words))); }); + // 添加两个参照数据，分别表示左上角和右下角 + result.push({ + text: '', + value: 0, + x: 0, + y: 0, + opacity: 0, + }); + result.push({ + text: '', + value: 0, + x: options.size[0], + y: options.size[1], + opacity: 0, + }); + return result; + } + // 数据准备在外部做，wordCloud 单纯就是做布局 + return wordCloud(words, options); +} +/** + * 获取最终的实际绘图尺寸：[width, height] + * @param chart + */ +function getSize$1(options) { + var width = options.width, height = options.height; + var container = options.container, autoFit = options.autoFit, padding = options.padding, appendPadding = options.appendPadding; + // 由于词云图每个词语的坐标都是先通过 DataSet 根据图表宽高计算出来的， + // 也就是说，如果一开始提供给 DataSet 的宽高信息和最终显示的宽高不相同， + // 那么就会出现布局错乱的情况，所以这里处理的目的就是让一开始提供给 DataSet 的 + // 宽高信息与最终显示的宽高信息相同，避免显示错乱。 + if (autoFit) { + var containerSize = getContainerSize(container); + width = containerSize.width; + height = containerSize.height; + } + // 宽高不能为 0，否则会造成死循环 + width = width || 400; + height = height || 400; + var _a = resolvePadding({ padding: padding, appendPadding: appendPadding }), top = _a[0], right = _a[1], bottom = _a[2], left = _a[3]; + var result = [width - (left + right), height - (top + bottom)]; + return result; +} +/** + * 根据图表的 padding 和 appendPadding 计算出图表的最终 padding + * @param chart + */ +function resolvePadding(options) { + var padding = normalPadding(options.padding); + var appendPadding = normalPadding(options.appendPadding); + var top = padding[0] + appendPadding[0]; + var right = padding[1] + appendPadding[1]; + var bottom = padding[2] + appendPadding[2]; + var left = padding[3] + appendPadding[3]; + return [top, right, bottom, left]; +} +/** + * 处理 imageMask 可能为 url 字符串的情况 + * @param {HTMLImageElement | string} img + * @return {Promise} + */ +function processImageMask(img) { + return new Promise(function (res, rej) { + if (img instanceof HTMLImageElement) { + res(img); + return; + } + if (isString$3(img)) { + var image_1 = new Image(); + image_1.crossOrigin = 'anonymous'; + image_1.src = img; + image_1.onload = function () { + res(image_1); + }; + image_1.onerror = function () { + log(LEVEL.ERROR, false, 'image %s load failed !!!', img); + rej(); + }; + return; + } + log(LEVEL.WARN, img === undefined, 'The type of imageMask option must be String or HTMLImageElement.'); + rej(); + }); +} +/** + * 把用户提供的 fontSize 值转换成符合 DataSet 要求的值 + * @param options + * @param range + */ +function getFontSizeMapping(fontSize, range) { + if (isFunction$6(fontSize)) { + return fontSize; + } + if (isArray$n(fontSize)) { + var fMin_1 = fontSize[0], fMax_1 = fontSize[1]; + if (!range) { + return function () { return (fMax_1 + fMin_1) / 2; }; + } + var min_1 = range[0], max_1 = range[1]; + if (max_1 === min_1) { + return function () { return (fMax_1 + fMin_1) / 2; }; + } + return function fontSize(_a) { + var value = _a.value; + return ((fMax_1 - fMin_1) / (max_1 - min_1)) * (value - min_1) + fMin_1; + }; + } + return function () { return fontSize; }; +} +function getSingleKeyValues(data, key) { + return data + .map(function (v) { return v[key]; }) + .filter(function (v) { + // 过滤非 number + if (typeof v === 'number' && !isNaN(v)) + return true; + return false; + }); +} +/** + * 把用户提供的关于旋转角度的字段值转换成符合 DataSet 要求的值 + * @param options + */ +function getRotate(options) { + var _a = resolveRotate(options), rotation = _a.rotation, rotationSteps = _a.rotationSteps; + if (!isArray$n(rotation)) + return rotation; + var min = rotation[0]; + var max = rotation[1]; + // 等于 1 时不旋转，所以把每份大小设为 0 + var perSize = rotationSteps === 1 ? 0 : (max - min) / (rotationSteps - 1); + return function rotate() { + if (max === min) + return max; + return Math.floor(Math.random() * rotationSteps) * perSize; + }; +} +/** + * 确保值在要求范围内 + * @param options + */ +function resolveRotate(options) { + var rotationSteps = options.wordStyle.rotationSteps; + if (rotationSteps < 1) { + log(LEVEL.WARN, false, 'The rotationSteps option must be greater than or equal to 1.'); + rotationSteps = 1; + } + return { + rotation: options.wordStyle.rotation, + rotationSteps: rotationSteps, + }; +} +/** + * 传入一个元素为数字的数组， + * 返回该数组中值最小的数字。 + * @param numbers + */ +function min$4(numbers) { + return Math.min.apply(Math, numbers); +} +/** + * 传入一个元素为数字的数组， + * 返回该数组中值最大的数字。 + * @param numbers + */ +function max$5(numbers) { + return Math.max.apply(Math, numbers); +} + +/** 词云图 color 通道映射字段 */ +var WORD_CLOUD_COLOR_FIELD = 'color'; +/** + * 词云图 默认配置项 + */ +var DEFAULT_OPTIONS$s = deepAssign({}, Plot.getDefaultOptions(), { + timeInterval: 2000, + legend: false, + tooltip: { + showTitle: false, + showMarkers: false, + showCrosshairs: false, + fields: ['text', 'value', WORD_CLOUD_COLOR_FIELD], + formatter: function (datum) { + return { name: datum.text, value: datum.value }; + }, + }, + wordStyle: { + fontFamily: 'Verdana', + fontWeight: 'normal', + padding: 1, + fontSize: [12, 60], + rotation: [0, 90], + rotationSteps: 2, + rotateRatio: 0.5, + }, +}); + +/** + * geometry 配置处理 + * @param params + */ +function geometry$q(params) { + var chart = params.chart, options = params.options; + var colorField = options.colorField, color = options.color; + var data = transform$b(params); + chart.data(data); + var p = deepAssign({}, params, { + options: { + xField: 'x', + yField: 'y', + seriesField: colorField && WORD_CLOUD_COLOR_FIELD, + rawFields: isFunction$6(color) && __spreadArrays$1(get$3(options, 'rawFields', []), ['datum']), + point: { + color: color, + shape: 'word-cloud', + }, + }, + }); + var ext = point(p).ext; + ext.geometry.label(false); + chart.coordinate().reflect('y'); + chart.axis(false); + return params; +} +/** + * meta 配置 + * @param params + */ +function meta$h(params) { + return flow(scale$3({ + x: { nice: false }, + y: { nice: false }, + }))(params); +} +/** + * 词云图 legend 配置 + * @param params + */ +function legend$b(params) { + var chart = params.chart, options = params.options; + var legend = options.legend, colorField = options.colorField; + if (legend === false) { + chart.legend(false); + } + else if (colorField) { + chart.legend(WORD_CLOUD_COLOR_FIELD, legend); + } + return params; +} +/** + * 词云图适配器 + * @param chart + * @param options + */ +function adaptor$s(params) { + // flow 的方式处理所有的配置到 G2 API + flow(geometry$q, meta$h, tooltip$8, legend$b, interaction$6, animation$5, theme$2, state)(params); +} + +registerShape('point', 'word-cloud', { + draw: function (cfg, group) { + var cx = cfg.x; + var cy = cfg.y; + var shape = group.addShape('text', { + attrs: __assign$r(__assign$r({}, getTextAttrs(cfg)), { x: cx, y: cy }), + }); + var rotate = cfg.data.rotate; + if (typeof rotate === 'number') { + Util$1.rotate(shape, (rotate * Math.PI) / 180); + } + return shape; + }, +}); +function getTextAttrs(cfg) { + return { + fontSize: cfg.data.size, + text: cfg.data.text, + textAlign: 'center', + fontFamily: cfg.data.font, + fontWeight: cfg.data.weight, + fill: cfg.color || cfg.defaultStyle.stroke, + textBaseline: 'alphabetic', + }; +} + +var WordCloud$1 = /** @class */ (function (_super) { + __extends$e(WordCloud, _super); + function WordCloud() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 词云图 */ + _this.type = 'word-cloud'; + return _this; + } + /** + * 获取 词云图 默认配置项 + * 供外部使用 + */ + WordCloud.getDefaultOptions = function () { + return DEFAULT_OPTIONS$s; + }; + /** + * @override + * @param data + */ + WordCloud.prototype.changeData = function (data) { + this.updateOption({ data: data }); + if (this.options.imageMask) { + this.render(); + } + else { + this.chart.changeData(transform$b({ chart: this.chart, options: this.options })); + } + }; + /** + * 获取默认的 options 配置项 + */ + WordCloud.prototype.getDefaultOptions = function () { + return WordCloud.getDefaultOptions(); + }; + /** + * 覆写父类方法，词云图需要加载图片资源，所以需要异步渲染 + */ + WordCloud.prototype.render = function () { + var _this = this; + return new Promise(function (res) { + var imageMask = _this.options.imageMask; + if (!imageMask) { + // 调用父类渲染函数 + _super.prototype.render.call(_this); + res(); + return; + } + var handler = function (img) { + _this.options = __assign$r(__assign$r({}, _this.options), { imageMask: img || null }); + // 调用父类渲染函数 + _super.prototype.render.call(_this); + res(); + }; + processImageMask(imageMask).then(handler).catch(handler); + }); + }; + /** + * 获取 词云图 的适配器 + */ + WordCloud.prototype.getSchemaAdaptor = function () { + return adaptor$s; + }; + /** + * 覆写父类的方法，因为词云图使用 单独的函数 进行布局，原理上有些不一样 + */ + WordCloud.prototype.triggerResize = function () { + var _this = this; + if (!this.chart.destroyed) { + // 当整个词云图图表的宽高信息发生变化时，每个词语的坐标 + // 需要重新执行 adaptor，不然会出现布局错乱， + // 如相邻词语重叠的情况。 + this.execAdaptor(); + // 延迟执行，有利于动画更流畅 + // TODO: 在多次更改画布尺寸时，动画会越来越卡顿，原因未知 + window.setTimeout(function () { + // 执行父类的方法 + _super.prototype.triggerResize.call(_this); + }); + } + }; + return WordCloud; +}(Plot)); + +var d3Regression = {exports: {}}; + +(function (module, exports) { +// https://github.com/HarryStevens/d3-regression#readme Version 1.3.9. Copyright 2021 Harry Stevens. +(function (global, factory) { + factory(exports) ; +}(commonjsGlobal, (function (exports) { + function _slicedToArray(arr, i) { + return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); + } + + function _arrayWithHoles(arr) { + if (Array.isArray(arr)) return arr; + } + + function _iterableToArrayLimit(arr, i) { + var _arr = []; + var _n = true; + var _d = false; + var _e = undefined; + + try { + for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { + _arr.push(_s.value); + + if (i && _arr.length === i) break; + } + } catch (err) { + _d = true; + _e = err; + } finally { + try { + if (!_n && _i["return"] != null) _i["return"](); + } finally { + if (_d) throw _e; + } + } + + return _arr; + } + + function _nonIterableRest() { + throw new TypeError("Invalid attempt to destructure non-iterable instance"); + } + + // Adapted from vega-statistics by Jeffrey Heer + // License: https://github.com/vega/vega/blob/f058b099decad9db78301405dd0d2e9d8ba3d51a/LICENSE + // Source: https://github.com/vega/vega/blob/f058b099decad9db78301405dd0d2e9d8ba3d51a/packages/vega-statistics/src/regression/points.js + function points(data, x, y, sort) { + data = data.filter(function (d, i) { + var u = x(d, i), + v = y(d, i); + return u != null && isFinite(u) && v != null && isFinite(v); + }); + + if (sort) { + data.sort(function (a, b) { + return x(a) - x(b); + }); + } + + var n = data.length, + X = new Float64Array(n), + Y = new Float64Array(n); // extract values, calculate means + + var ux = 0, + uy = 0, + xv, + yv, + d; + + for (var i = 0; i < n;) { + d = data[i]; + X[i] = xv = +x(d, i, data); + Y[i] = yv = +y(d, i, data); + ++i; + ux += (xv - ux) / i; + uy += (yv - uy) / i; + } // mean center the data + + + for (var _i = 0; _i < n; ++_i) { + X[_i] -= ux; + Y[_i] -= uy; + } + + return [X, Y, ux, uy]; + } + function visitPoints(data, x, y, cb) { + var iterations = 0; + + for (var i = 0, n = data.length; i < n; i++) { + var d = data[i], + dx = +x(d, i, data), + dy = +y(d, i, data); + + if (dx != null && isFinite(dx) && dy != null && isFinite(dy)) { + cb(dx, dy, iterations++); + } + } + } + + // return the coefficient of determination, or R squared. + + function determination(data, x, y, uY, predict) { + var SSE = 0, + SST = 0; + visitPoints(data, x, y, function (dx, dy) { + var sse = dy - predict(dx), + sst = dy - uY; + SSE += sse * sse; + SST += sst * sst; + }); + return 1 - SSE / SST; + } + + // Returns the angle of a line in degrees. + function angle(line) { + return Math.atan2(line[1][1] - line[0][1], line[1][0] - line[0][0]) * 180 / Math.PI; + } // Returns the midpoint of a line. + + function midpoint(line) { + return [(line[0][0] + line[1][0]) / 2, (line[0][1] + line[1][1]) / 2]; + } + + // returns a smooth line. + + function interpose(xmin, xmax, predict) { + var l = Math.log(xmax - xmin) * Math.LOG10E + 1 | 0; + var precision = 1 * Math.pow(10, -l / 2 - 1), + maxIter = 1e4; + var points = [px(xmin), px(xmax)], + iter = 0; + + while (find(points) && iter < maxIter) { + } + + return points; + + function px(x) { + return [x, predict(x)]; + } + + function find(points) { + iter++; + var n = points.length; + var found = false; + + for (var i = 0; i < n - 1; i++) { + var p0 = points[i], + p1 = points[i + 1], + m = midpoint([p0, p1]), + mp = px(m[0]), + a0 = angle([p0, m]), + a1 = angle([p0, mp]), + a = Math.abs(a0 - a1); + + if (a > precision) { + points.splice(i + 1, 0, mp); + found = true; + } + } + + return found; + } + } + + // Ordinary Least Squares from vega-statistics by Jeffrey Heer + // License: https://github.com/vega/vega/blob/f058b099decad9db78301405dd0d2e9d8ba3d51a/LICENSE + // Source: https://github.com/vega/vega/blob/f058b099decad9db78301405dd0d2e9d8ba3d51a/packages/vega-statistics/src/regression/ols.js + function ols(uX, uY, uXY, uX2) { + var delta = uX2 - uX * uX, + slope = Math.abs(delta) < 1e-24 ? 0 : (uXY - uX * uY) / delta, + intercept = uY - slope * uX; + return [intercept, slope]; + } + + function exponential () { + var x = function x(d) { + return d[0]; + }, + y = function y(d) { + return d[1]; + }, + domain; + + function exponential(data) { + var n = 0, + Y = 0, + YL = 0, + XY = 0, + XYL = 0, + X2Y = 0, + xmin = domain ? +domain[0] : Infinity, + xmax = domain ? +domain[1] : -Infinity; + visitPoints(data, x, y, function (dx, dy) { + var ly = Math.log(dy), + xy = dx * dy; + ++n; + Y += (dy - Y) / n; + XY += (xy - XY) / n; + X2Y += (dx * xy - X2Y) / n; + YL += (dy * ly - YL) / n; + XYL += (xy * ly - XYL) / n; + + if (!domain) { + if (dx < xmin) xmin = dx; + if (dx > xmax) xmax = dx; + } + }); + + var _ols = ols(XY / Y, YL / Y, XYL / Y, X2Y / Y), + _ols2 = _slicedToArray(_ols, 2), + a = _ols2[0], + b = _ols2[1]; + + a = Math.exp(a); + + var fn = function fn(x) { + return a * Math.exp(b * x); + }, + out = interpose(xmin, xmax, fn); + + out.a = a; + out.b = b; + out.predict = fn; + out.rSquared = determination(data, x, y, Y, fn); + return out; + } + + exponential.domain = function (arr) { + return arguments.length ? (domain = arr, exponential) : domain; + }; + + exponential.x = function (fn) { + return arguments.length ? (x = fn, exponential) : x; + }; + + exponential.y = function (fn) { + return arguments.length ? (y = fn, exponential) : y; + }; + + return exponential; + } + + function linear () { + var x = function x(d) { + return d[0]; + }, + y = function y(d) { + return d[1]; + }, + domain; + + function linear(data) { + var n = 0, + X = 0, + // sum of x + Y = 0, + // sum of y + XY = 0, + // sum of x * y + X2 = 0, + // sum of x * x + xmin = domain ? +domain[0] : Infinity, + xmax = domain ? +domain[1] : -Infinity; + visitPoints(data, x, y, function (dx, dy) { + ++n; + X += (dx - X) / n; + Y += (dy - Y) / n; + XY += (dx * dy - XY) / n; + X2 += (dx * dx - X2) / n; + + if (!domain) { + if (dx < xmin) xmin = dx; + if (dx > xmax) xmax = dx; + } + }); + + var _ols = ols(X, Y, XY, X2), + _ols2 = _slicedToArray(_ols, 2), + intercept = _ols2[0], + slope = _ols2[1], + fn = function fn(x) { + return slope * x + intercept; + }, + out = [[xmin, fn(xmin)], [xmax, fn(xmax)]]; + + out.a = slope; + out.b = intercept; + out.predict = fn; + out.rSquared = determination(data, x, y, Y, fn); + return out; + } + + linear.domain = function (arr) { + return arguments.length ? (domain = arr, linear) : domain; + }; + + linear.x = function (fn) { + return arguments.length ? (x = fn, linear) : x; + }; + + linear.y = function (fn) { + return arguments.length ? (y = fn, linear) : y; + }; + + return linear; + } + + // Returns the medium value of an array of numbers. + function median(arr) { + arr.sort(function (a, b) { + return a - b; + }); + var i = arr.length / 2; + return i % 1 === 0 ? (arr[i - 1] + arr[i]) / 2 : arr[Math.floor(i)]; + } + + var maxiters = 2, + epsilon = 1e-12; + function loess () { + var x = function x(d) { + return d[0]; + }, + y = function y(d) { + return d[1]; + }, + bandwidth = .3; + + function loess(data) { + var _points = points(data, x, y, true), + _points2 = _slicedToArray(_points, 4), + xv = _points2[0], + yv = _points2[1], + ux = _points2[2], + uy = _points2[3], + n = xv.length, + bw = Math.max(2, ~~(bandwidth * n)), + yhat = new Float64Array(n), + residuals = new Float64Array(n), + robustWeights = new Float64Array(n).fill(1); + + for (var iter = -1; ++iter <= maxiters;) { + var interval = [0, bw - 1]; + + for (var i = 0; i < n; ++i) { + var dx = xv[i], + i0 = interval[0], + i1 = interval[1], + edge = dx - xv[i0] > xv[i1] - dx ? i0 : i1; + var W = 0, + X = 0, + Y = 0, + XY = 0, + X2 = 0, + denom = 1 / Math.abs(xv[edge] - dx || 1); // Avoid singularity + + for (var k = i0; k <= i1; ++k) { + var xk = xv[k], + yk = yv[k], + w = tricube(Math.abs(dx - xk) * denom) * robustWeights[k], + xkw = xk * w; + W += w; + X += xkw; + Y += yk * w; + XY += yk * xkw; + X2 += xk * xkw; + } // Linear regression fit + + + var _ols = ols(X / W, Y / W, XY / W, X2 / W), + _ols2 = _slicedToArray(_ols, 2), + a = _ols2[0], + b = _ols2[1]; + + yhat[i] = a + b * dx; + residuals[i] = Math.abs(yv[i] - yhat[i]); + updateInterval(xv, i + 1, interval); + } + + if (iter === maxiters) { + break; + } + + var medianResidual = median(residuals); + if (Math.abs(medianResidual) < epsilon) break; + + for (var _i = 0, arg, _w; _i < n; ++_i) { + arg = residuals[_i] / (6 * medianResidual); // Default to epsilon (rather than zero) for large deviations + // Keeping weights tiny but non-zero prevents singularites + + robustWeights[_i] = arg >= 1 ? epsilon : (_w = 1 - arg * arg) * _w; + } + } + + return output(xv, yhat, ux, uy); + } + + loess.bandwidth = function (bw) { + return arguments.length ? (bandwidth = bw, loess) : bandwidth; + }; + + loess.x = function (fn) { + return arguments.length ? (x = fn, loess) : x; + }; + + loess.y = function (fn) { + return arguments.length ? (y = fn, loess) : y; + }; + + return loess; + } // Weighting kernel for local regression + + function tricube(x) { + return (x = 1 - x * x * x) * x * x; + } // Advance sliding window interval of nearest neighbors + + + function updateInterval(xv, i, interval) { + var val = xv[i], + left = interval[0], + right = interval[1] + 1; + if (right >= xv.length) return; // Step right if distance to new right edge is <= distance to old left edge + // Step when distance is equal to ensure movement over duplicate x values + + while (i > left && xv[right] - val <= val - xv[left]) { + interval[0] = ++left; + interval[1] = right; + ++right; + } + } // Generate smoothed output points + // Average points with repeated x values + + + function output(xv, yhat, ux, uy) { + var n = xv.length, + out = []; + var i = 0, + cnt = 0, + prev = [], + v; + + for (; i < n; ++i) { + v = xv[i] + ux; + + if (prev[0] === v) { + // Average output values via online update + prev[1] += (yhat[i] - prev[1]) / ++cnt; + } else { + // Add new output point + cnt = 0; + prev[1] += uy; + prev = [v, yhat[i]]; + out.push(prev); + } + } + + prev[1] += uy; + return out; + } + + function logarithmic () { + var x = function x(d) { + return d[0]; + }, + y = function y(d) { + return d[1]; + }, + base = Math.E, + domain; + + function logarithmic(data) { + var n = 0, + X = 0, + Y = 0, + XY = 0, + X2 = 0, + xmin = domain ? +domain[0] : Infinity, + xmax = domain ? +domain[1] : -Infinity, + lb = Math.log(base); + visitPoints(data, x, y, function (dx, dy) { + var lx = Math.log(dx) / lb; + ++n; + X += (lx - X) / n; + Y += (dy - Y) / n; + XY += (lx * dy - XY) / n; + X2 += (lx * lx - X2) / n; + + if (!domain) { + if (dx < xmin) xmin = dx; + if (dx > xmax) xmax = dx; + } + }); + + var _ols = ols(X, Y, XY, X2), + _ols2 = _slicedToArray(_ols, 2), + intercept = _ols2[0], + slope = _ols2[1], + fn = function fn(x) { + return slope * Math.log(x) / lb + intercept; + }, + out = interpose(xmin, xmax, fn); + + out.a = slope; + out.b = intercept; + out.predict = fn; + out.rSquared = determination(data, x, y, Y, fn); + return out; + } + + logarithmic.domain = function (arr) { + return arguments.length ? (domain = arr, logarithmic) : domain; + }; + + logarithmic.x = function (fn) { + return arguments.length ? (x = fn, logarithmic) : x; + }; + + logarithmic.y = function (fn) { + return arguments.length ? (y = fn, logarithmic) : y; + }; + + logarithmic.base = function (n) { + return arguments.length ? (base = n, logarithmic) : base; + }; + + return logarithmic; + } + + function quad () { + var x = function x(d) { + return d[0]; + }, + y = function y(d) { + return d[1]; + }, + domain; + + function quadratic(data) { + var _points = points(data, x, y), + _points2 = _slicedToArray(_points, 4), + xv = _points2[0], + yv = _points2[1], + ux = _points2[2], + uy = _points2[3], + n = xv.length; + + var X2 = 0, + X3 = 0, + X4 = 0, + XY = 0, + X2Y = 0, + i, + dx, + dy, + x2; + + for (i = 0; i < n;) { + dx = xv[i]; + dy = yv[i++]; + x2 = dx * dx; + X2 += (x2 - X2) / i; + X3 += (x2 * dx - X3) / i; + X4 += (x2 * x2 - X4) / i; + XY += (dx * dy - XY) / i; + X2Y += (x2 * dy - X2Y) / i; + } + + var Y = 0, + n0 = 0, + xmin = domain ? +domain[0] : Infinity, + xmax = domain ? +domain[1] : -Infinity; + visitPoints(data, x, y, function (dx, dy) { + n0++; + Y += (dy - Y) / n0; + + if (!domain) { + if (dx < xmin) xmin = dx; + if (dx > xmax) xmax = dx; + } + }); + + var X2X2 = X4 - X2 * X2, + d = X2 * X2X2 - X3 * X3, + a = (X2Y * X2 - XY * X3) / d, + b = (XY * X2X2 - X2Y * X3) / d, + c = -a * X2, + fn = function fn(x) { + x = x - ux; + return a * x * x + b * x + c + uy; + }; + + var out = interpose(xmin, xmax, fn); + out.a = a; + out.b = b - 2 * a * ux; + out.c = c - b * ux + a * ux * ux + uy; + out.predict = fn; + out.rSquared = determination(data, x, y, Y, fn); + return out; + } + + quadratic.domain = function (arr) { + return arguments.length ? (domain = arr, quadratic) : domain; + }; + + quadratic.x = function (fn) { + return arguments.length ? (x = fn, quadratic) : x; + }; + + quadratic.y = function (fn) { + return arguments.length ? (y = fn, quadratic) : y; + }; + + return quadratic; + } + + // Source: https://github.com/Tom-Alexander/regression-js/blob/master/src/regression.js#L246 + // License: https://github.com/Tom-Alexander/regression-js/blob/master/LICENSE + // ...with ideas from vega-statistics by Jeffrey Heer + // Source: https://github.com/vega/vega/blob/f21cb8792b4e0cbe2b1a3fd44b0f5db370dbaadb/packages/vega-statistics/src/regression/poly.js + // License: https://github.com/vega/vega/blob/f058b099decad9db78301405dd0d2e9d8ba3d51a/LICENSE + + function polynomial () { + var x = function x(d) { + return d[0]; + }, + y = function y(d) { + return d[1]; + }, + order = 3, + domain; + + function polynomial(data) { + // Use more efficient methods for lower orders + if (order === 1) { + var o = linear().x(x).y(y).domain(domain)(data); + o.coefficients = [o.b, o.a]; + delete o.a; + delete o.b; + return o; + } + + if (order === 2) { + var _o = quad().x(x).y(y).domain(domain)(data); + + _o.coefficients = [_o.c, _o.b, _o.a]; + delete _o.a; + delete _o.b; + delete _o.c; + return _o; + } + + var _points = points(data, x, y), + _points2 = _slicedToArray(_points, 4), + xv = _points2[0], + yv = _points2[1], + ux = _points2[2], + uy = _points2[3], + n = xv.length, + lhs = [], + rhs = [], + k = order + 1; + + var Y = 0, + n0 = 0, + xmin = domain ? +domain[0] : Infinity, + xmax = domain ? +domain[1] : -Infinity; + visitPoints(data, x, y, function (dx, dy) { + ++n0; + Y += (dy - Y) / n0; + + if (!domain) { + if (dx < xmin) xmin = dx; + if (dx > xmax) xmax = dx; + } + }); + var i, j, l, v, c; + + for (i = 0; i < k; ++i) { + for (l = 0, v = 0; l < n; ++l) { + v += Math.pow(xv[l], i) * yv[l]; + } + + lhs.push(v); + c = new Float64Array(k); + + for (j = 0; j < k; ++j) { + for (l = 0, v = 0; l < n; ++l) { + v += Math.pow(xv[l], i + j); + } + + c[j] = v; + } + + rhs.push(c); + } + + rhs.push(lhs); + + var coef = gaussianElimination(rhs), + fn = function fn(x) { + x -= ux; + var y = uy + coef[0] + coef[1] * x + coef[2] * x * x; + + for (i = 3; i < k; ++i) { + y += coef[i] * Math.pow(x, i); + } + + return y; + }, + out = interpose(xmin, xmax, fn); + + out.coefficients = uncenter(k, coef, -ux, uy); + out.predict = fn; + out.rSquared = determination(data, x, y, Y, fn); + return out; + } + + polynomial.domain = function (arr) { + return arguments.length ? (domain = arr, polynomial) : domain; + }; + + polynomial.x = function (fn) { + return arguments.length ? (x = fn, polynomial) : x; + }; + + polynomial.y = function (fn) { + return arguments.length ? (y = fn, polynomial) : y; + }; + + polynomial.order = function (n) { + return arguments.length ? (order = n, polynomial) : order; + }; + + return polynomial; + } + + function uncenter(k, a, x, y) { + var z = Array(k); + var i, j, v, c; // initialize to zero + + for (i = 0; i < k; ++i) { + z[i] = 0; + } // polynomial expansion + + + for (i = k - 1; i >= 0; --i) { + v = a[i]; + c = 1; + z[i] += v; + + for (j = 1; j <= i; ++j) { + c *= (i + 1 - j) / j; // binomial coefficent + + z[i - j] += v * Math.pow(x, j) * c; + } + } // bias term + + + z[0] += y; + return z; + } // Given an array for a two-dimensional matrix and the polynomial order, + // solve A * x = b using Gaussian elimination. + + + function gaussianElimination(matrix) { + var n = matrix.length - 1, + coef = []; + var i, j, k, r, t; + + for (i = 0; i < n; ++i) { + r = i; // max row + + for (j = i + 1; j < n; ++j) { + if (Math.abs(matrix[i][j]) > Math.abs(matrix[i][r])) { + r = j; + } + } + + for (k = i; k < n + 1; ++k) { + t = matrix[k][i]; + matrix[k][i] = matrix[k][r]; + matrix[k][r] = t; + } + + for (j = i + 1; j < n; ++j) { + for (k = n; k >= i; k--) { + matrix[k][j] -= matrix[k][i] * matrix[i][j] / matrix[i][i]; + } + } + } + + for (j = n - 1; j >= 0; --j) { + t = 0; + + for (k = j + 1; k < n; ++k) { + t += matrix[k][j] * coef[k]; + } + + coef[j] = (matrix[n][j] - t) / matrix[j][j]; + } + + return coef; + } + + function power () { + var x = function x(d) { + return d[0]; + }, + y = function y(d) { + return d[1]; + }, + domain; + + function power(data) { + var n = 0, + X = 0, + Y = 0, + XY = 0, + X2 = 0, + YS = 0, + xmin = domain ? +domain[0] : Infinity, + xmax = domain ? +domain[1] : -Infinity; + visitPoints(data, x, y, function (dx, dy) { + var lx = Math.log(dx), + ly = Math.log(dy); + ++n; + X += (lx - X) / n; + Y += (ly - Y) / n; + XY += (lx * ly - XY) / n; + X2 += (lx * lx - X2) / n; + YS += (dy - YS) / n; + + if (!domain) { + if (dx < xmin) xmin = dx; + if (dx > xmax) xmax = dx; + } + }); + + var _ols = ols(X, Y, XY, X2), + _ols2 = _slicedToArray(_ols, 2), + a = _ols2[0], + b = _ols2[1]; + + a = Math.exp(a); + + var fn = function fn(x) { + return a * Math.pow(x, b); + }, + out = interpose(xmin, xmax, fn); + + out.a = a; + out.b = b; + out.predict = fn; + out.rSquared = determination(data, x, y, YS, fn); + return out; + } + + power.domain = function (arr) { + return arguments.length ? (domain = arr, power) : domain; + }; + + power.x = function (fn) { + return arguments.length ? (x = fn, power) : x; + }; + + power.y = function (fn) { + return arguments.length ? (y = fn, power) : y; + }; + + return power; + } + + exports.regressionExp = exponential; + exports.regressionLinear = linear; + exports.regressionLoess = loess; + exports.regressionLog = logarithmic; + exports.regressionPoly = polynomial; + exports.regressionPow = power; + exports.regressionQuad = quad; + + Object.defineProperty(exports, '__esModule', { value: true }); + +}))); +}(d3Regression, d3Regression.exports)); + +var REGRESSION_MAP = { + exp: d3Regression.exports.regressionExp, + linear: d3Regression.exports.regressionLinear, + loess: d3Regression.exports.regressionLoess, + log: d3Regression.exports.regressionLog, + poly: d3Regression.exports.regressionPoly, + pow: d3Regression.exports.regressionPow, + quad: d3Regression.exports.regressionQuad, +}; +/** + * 获取四象限默认配置 + * @param {number} xBaseline + * @param {number} yBaseline + */ +function getQuadrantDefaultConfig(xBaseline, yBaseline) { + // 文本便宜距离 + var textOffset = 10; + // 四象限默认样式 + var defaultConfig = { + regionStyle: [ + { + position: { + start: [xBaseline, 'max'], + end: ['max', yBaseline], + }, + style: { + fill: '#d8d0c0', + opacity: 0.4, + }, + }, + { + position: { + start: ['min', 'max'], + end: [xBaseline, yBaseline], + }, + style: { + fill: '#a3dda1', + opacity: 0.4, + }, + }, + { + position: { + start: ['min', yBaseline], + end: [xBaseline, 'min'], + }, + style: { + fill: '#d8d0c0', + opacity: 0.4, + }, + }, + { + position: { + start: [xBaseline, yBaseline], + end: ['max', 'min'], + }, + style: { + fill: '#a3dda1', + opacity: 0.4, + }, + }, + ], + lineStyle: { + stroke: '#9ba29a', + lineWidth: 1, + }, + labelStyle: [ + { + position: ['max', yBaseline], + offsetX: -textOffset, + offsetY: -textOffset, + style: { + textAlign: 'right', + textBaseline: 'bottom', + fontSize: 14, + fill: '#ccc', + }, + }, + { + position: ['min', yBaseline], + offsetX: textOffset, + offsetY: -textOffset, + style: { + textAlign: 'left', + textBaseline: 'bottom', + fontSize: 14, + fill: '#ccc', + }, + }, + { + position: ['min', yBaseline], + offsetX: textOffset, + offsetY: textOffset, + style: { + textAlign: 'left', + textBaseline: 'top', + fontSize: 14, + fill: '#ccc', + }, + }, + { + position: ['max', yBaseline], + offsetX: -textOffset, + offsetY: textOffset, + style: { + textAlign: 'right', + textBaseline: 'top', + fontSize: 14, + fill: '#ccc', + }, + }, + ], + }; + return defaultConfig; +} +var splinePath = function (data, config) { + var view = config.view, _a = config.options, xField = _a.xField, yField = _a.yField; + var xScaleView = view.getScaleByField(xField); + var yScaleView = view.getScaleByField(yField); + var pathData = data.map(function (d) { + return view.getCoordinate().convert({ x: xScaleView.scale(d[0]), y: yScaleView.scale(d[1]) }); + }); + return getSplinePath(pathData, false); +}; +var getPath = function (config) { + var options = config.options; + var xField = options.xField, yField = options.yField, data = options.data, regressionLine = options.regressionLine; + var _a = regressionLine.type, type = _a === void 0 ? 'linear' : _a, algorithm = regressionLine.algorithm; + var pathData; + if (algorithm) { + pathData = isArray$n(algorithm) ? algorithm : algorithm(data); + } + else { + var reg = REGRESSION_MAP[type]() + .x(function (d) { return d[xField]; }) + .y(function (d) { return d[yField]; }); + pathData = reg(data); + } + return splinePath(pathData, config); +}; +/** + * 调整散点图 meta: { min, max } ① data.length === 1 ② 所有数据 y 值相等 ③ 所有数据 x 值相等 + * @param options + * @returns + */ +var getMeta = function (options) { + var _a; + var _b = options.meta, meta = _b === void 0 ? {} : _b, xField = options.xField, yField = options.yField, data = options.data; + var xFieldValue = data[0][xField]; + var yFieldValue = data[0][yField]; + var xIsPositiveNumber = xFieldValue > 0; + var yIsPositiveNumber = yFieldValue > 0; + /** + * 获得对应字段的 min max scale 配置 + */ + function getMetaMinMax(field, axis) { + var fieldMeta = get$3(meta, [field]); + function getCustomValue(type) { + return get$3(fieldMeta, type); + } + var range = {}; + if (axis === 'x') { + if (isNumber$4(xFieldValue)) { + if (!isNumber$4(getCustomValue('min'))) { + range['min'] = xIsPositiveNumber ? 0 : xFieldValue * 2; + } + if (!isNumber$4(getCustomValue('max'))) { + range['max'] = xIsPositiveNumber ? xFieldValue * 2 : 0; + } + } + return range; + } + if (isNumber$4(yFieldValue)) { + if (!isNumber$4(getCustomValue('min'))) { + range['min'] = yIsPositiveNumber ? 0 : yFieldValue * 2; + } + if (!isNumber$4(getCustomValue('max'))) { + range['max'] = yIsPositiveNumber ? yFieldValue * 2 : 0; + } + } + return range; + } + return __assign$r(__assign$r({}, meta), (_a = {}, _a[xField] = __assign$r(__assign$r({}, meta[xField]), getMetaMinMax(xField, 'x')), _a[yField] = __assign$r(__assign$r({}, meta[yField]), getMetaMinMax(yField, 'y')), _a)); +}; + +/** + * 散点图默认美观 + * ① data.length === 1 ② 所有数据 y 值相等 ③ 所有数据 x 值相等 + * @param params + * @returns params + */ +function transformOptions$1(options) { + var _a = options.data, data = _a === void 0 ? [] : _a, xField = options.xField, yField = options.yField; + if (data.length) { + // x y 字段知否只有一个值，如果只有一个值，则进行优化 + var isOneX = true; + var isOneY = true; + var prev = data[0]; + var curr = void 0; + for (var i = 1; i < data.length; i++) { + curr = data[i]; + if (prev[xField] !== curr[xField]) { + isOneX = false; + } + if (prev[yField] !== curr[yField]) { + isOneY = false; + } + // 如果都不是 oneValue，那么可提前跳出循环 + if (!isOneX && !isOneY) { + break; + } + prev = curr; + } + var keys = []; + isOneX && keys.push(xField); + isOneY && keys.push(yField); + var meta_1 = pick$1(getMeta(options), keys); + return deepAssign({}, options, { meta: meta_1 }); + } + return options; +} +/** + * 字段 + * @param params + */ +function geometry$p(params) { + var chart = params.chart, options = params.options; + var data = options.data, type = options.type, color = options.color, shape = options.shape, pointStyle = options.pointStyle, shapeField = options.shapeField, colorField = options.colorField, xField = options.xField, yField = options.yField, sizeField = options.sizeField; + var size = options.size; + var tooltip = options.tooltip; + if (sizeField) { + if (!size) { + size = [2, 8]; + } + if (isNumber$4(size)) { + size = [size, size]; + } + } + if (tooltip && !tooltip.fields) { + tooltip = __assign$r(__assign$r({}, tooltip), { fields: [xField, yField, colorField, sizeField, shapeField] }); + } + // 数据 + chart.data(data); + // geometry + point(deepAssign({}, params, { + options: { + seriesField: colorField, + point: { + color: color, + shape: shape, + size: size, + style: pointStyle, + }, + tooltip: tooltip, + }, + })); + var geometry = findGeometry(chart, 'point'); + // 数据调整 + if (type) { + geometry.adjust(type); + } + return params; +} +/** + * meta 配置 + * @param params + */ +function meta$g(params) { + var _a; + var options = params.options; + var xAxis = options.xAxis, yAxis = options.yAxis, xField = options.xField, yField = options.yField; + var newOptions = transformOptions$1(options); + return flow(scale$3((_a = {}, + _a[xField] = xAxis, + _a[yField] = yAxis, + _a)))(deepAssign({}, params, { options: newOptions })); +} +/** + * axis 配置 + * @param params + */ +function axis$h(params) { + var chart = params.chart, options = params.options; + var xAxis = options.xAxis, yAxis = options.yAxis, xField = options.xField, yField = options.yField; + chart.axis(xField, xAxis); + chart.axis(yField, yAxis); + return params; +} +/** + * legend 配置 + * @param params + */ +function legend$a(params) { + var chart = params.chart, options = params.options; + var legend = options.legend, colorField = options.colorField, shapeField = options.shapeField, sizeField = options.sizeField, shapeLegend = options.shapeLegend, sizeLegend = options.sizeLegend; + /** legend 不为 false, 则展示图例, 优先展示 color 分类图例 */ + var showLegend = legend !== false; + if (colorField) { + chart.legend(colorField, showLegend ? legend : false); + } + // 优先取 shapeLegend, 否则取 legend + if (shapeField) { + if (shapeLegend) { + chart.legend(shapeField, shapeLegend); + } + else { + chart.legend(shapeField, shapeLegend === false ? false : legend); + } + } + if (sizeField) { + chart.legend(sizeField, sizeLegend ? sizeLegend : false); + } + /** 默认不展示 shape 图例，当 shapeLegend 为 undefined 也不展示图例 */ + /** 默认没有 sizeField，则隐藏连续图例 */ + if (!showLegend && !shapeLegend && !sizeLegend) { + chart.legend(false); + } + return params; +} +/** + * 数据标签 + * @param params + */ +function label$8(params) { + var chart = params.chart, options = params.options; + var label = options.label, yField = options.yField; + var scatterGeometry = findGeometry(chart, 'point'); + // label 为 false, 空 则不显示 label + if (!label) { + scatterGeometry.label(false); + } + else { + var callback = label.callback, cfg = __rest$G(label, ["callback"]); + scatterGeometry.label({ + fields: [yField], + callback: callback, + cfg: transformLabel(cfg), + }); + } + return params; +} +/** + * annotation 配置 + * - 特殊 annotation: quadrant(四象限) + * @param params + */ +function scatterAnnotation(params) { + var options = params.options; + var quadrant = options.quadrant; + var annotationOptions = []; + if (quadrant) { + var _a = quadrant.xBaseline, xBaseline = _a === void 0 ? 0 : _a, _b = quadrant.yBaseline, yBaseline = _b === void 0 ? 0 : _b, labels_1 = quadrant.labels, regionStyle_1 = quadrant.regionStyle, lineStyle = quadrant.lineStyle; + var defaultConfig_1 = getQuadrantDefaultConfig(xBaseline, yBaseline); + // 仅支持四象限 + var quadrants = new Array(4).join(',').split(','); + quadrants.forEach(function (_, index) { + annotationOptions.push(__assign$r(__assign$r({ type: 'region', top: false }, defaultConfig_1.regionStyle[index].position), { style: deepAssign({}, defaultConfig_1.regionStyle[index].style, regionStyle_1 === null || regionStyle_1 === void 0 ? void 0 : regionStyle_1[index]) }), __assign$r({ type: 'text', top: true }, deepAssign({}, defaultConfig_1.labelStyle[index], labels_1 === null || labels_1 === void 0 ? void 0 : labels_1[index]))); + }); + // 生成坐标轴 + annotationOptions.push({ + type: 'line', + top: false, + start: ['min', yBaseline], + end: ['max', yBaseline], + style: deepAssign({}, defaultConfig_1.lineStyle, lineStyle), + }, { + type: 'line', + top: false, + start: [xBaseline, 'min'], + end: [xBaseline, 'max'], + style: deepAssign({}, defaultConfig_1.lineStyle, lineStyle), + }); + } + return flow(annotation$2(annotationOptions))(params); +} +// 趋势线 +function regressionLine(params) { + var options = params.options, chart = params.chart; + var regressionLine = options.regressionLine; + if (regressionLine) { + var style_1 = regressionLine.style, _a = regressionLine.top, top_1 = _a === void 0 ? false : _a; + var defaultStyle_1 = { + stroke: '#9ba29a', + lineWidth: 2, + opacity: 0.5, + }; + chart.annotation().shape({ + top: top_1, + render: function (container, view) { + var group = container.addGroup({ + id: chart.id + "-regression-line", + name: 'regression-line-group', + }); + var path = getPath({ + view: view, + options: options, + }); + group.addShape('path', { + name: 'regression-line', + attrs: __assign$r(__assign$r({ path: path }, defaultStyle_1), style_1), + }); + }, + }); + } + return params; +} +/** + * tooltip 配置 + * @param params + */ +function tooltip$6(params) { + var chart = params.chart, options = params.options; + var tooltip = options.tooltip; + if (tooltip) { + chart.tooltip(tooltip); + } + else if (tooltip === false) { + chart.tooltip(false); + } + return params; +} +/** + * 散点图适配器 + * @param chart + * @param options + */ +function adaptor$r(params) { + // flow 的方式处理所有的配置到 G2 API + return flow(geometry$p, meta$g, axis$h, legend$a, tooltip$6, label$8, + // 需要在 interaction 前面 + brushInteraction, interaction$6, scatterAnnotation, animation$5, theme$2, regressionLine)(params); +} + +/** + * 散点图 默认配置项 + */ +var DEFAULT_OPTIONS$r = deepAssign({}, Plot.getDefaultOptions(), { + size: 4, + tooltip: { + showTitle: false, + showMarkers: false, + showCrosshairs: true, + crosshairs: { + type: 'xy', + }, + }, +}); + +registerInteraction('drag-move', { + start: [{ trigger: 'plot:mousedown', action: 'scale-translate:start' }], + processing: [ + { + trigger: 'plot:mousemove', + action: 'scale-translate:translate', + throttle: { wait: 100, leading: true, trailing: false }, + }, + ], + end: [{ trigger: 'plot:mouseup', action: 'scale-translate:end' }], +}); + +var Scatter$1 = /** @class */ (function (_super) { + __extends$e(Scatter, _super); + function Scatter(container, options) { + var _this = _super.call(this, container, options) || this; + /** 图表类型 */ + _this.type = 'scatter'; + // 监听 brush 事件，处理 meta + _this.on(VIEW_LIFE_CIRCLE.BEFORE_RENDER, function (evt) { + var _a, _b; + // 运行时，读取 option + var _c = _this, options = _c.options, chart = _c.chart; + if (((_a = evt.data) === null || _a === void 0 ? void 0 : _a.source) === EVENTS.FILTER) { + var filteredData = _this.chart.filterData(_this.chart.getData()); + meta$g({ chart: chart, options: __assign$r(__assign$r({}, options), { data: filteredData }) }); + } + if (((_b = evt.data) === null || _b === void 0 ? void 0 : _b.source) === EVENTS.RESET) { + meta$g({ chart: chart, options: options }); + } + }); + return _this; + } + /** + * 获取 散点图 默认配置项 + * 供外部使用 + */ + Scatter.getDefaultOptions = function () { + return DEFAULT_OPTIONS$r; + }; + /** + * @override + * @param data + */ + Scatter.prototype.changeData = function (data) { + this.updateOption(transformOptions$1(deepAssign({}, this.options, { data: data }))); + var _a = this, options = _a.options, chart = _a.chart; + meta$g({ chart: chart, options: options }); + this.chart.changeData(data); + }; + /** + * 获取 散点图 的适配器 + */ + Scatter.prototype.getSchemaAdaptor = function () { + return adaptor$r; + }; + Scatter.prototype.getDefaultOptions = function () { + return Scatter.getDefaultOptions(); + }; + return Scatter; +}(Plot)); + +/** + * geometry 配置处理 + * @param params + */ +function geometry$o(params) { + var chart = params.chart, options = params.options; + var data = options.data, lineStyle = options.lineStyle, color = options.color, pointOptions = options.point, areaOptions = options.area; + chart.data(data); + // 雷达图 主 geometry + var primary = deepAssign({}, params, { + options: { + line: { + style: lineStyle, + color: color, + }, + point: pointOptions + ? __assign$r({ color: color }, pointOptions) : pointOptions, + area: areaOptions + ? __assign$r({ color: color }, areaOptions) : areaOptions, + // label 不传递给各个 geometry adaptor，由 label adaptor 处理 + label: undefined, + }, + }); + // 副 Geometry + var second = deepAssign({}, primary, { + options: { + tooltip: false, + }, + }); + // 优先使用 point.state, 其次取主元素的 state 状态样式配置 + var pointState = (pointOptions === null || pointOptions === void 0 ? void 0 : pointOptions.state) || options.state; + var pointParams = deepAssign({}, primary, { options: { tooltip: false, state: pointState } }); + line(primary); + point(pointParams); + area(second); + return params; +} +/** + * meta 配置 + * @param params + */ +function meta$f(params) { + var _a; + var options = params.options; + var xAxis = options.xAxis, yAxis = options.yAxis, xField = options.xField, yField = options.yField; + return flow(scale$3((_a = {}, + _a[xField] = xAxis, + _a[yField] = yAxis, + _a)))(params); +} +/** + * coord 配置 + * @param params + */ +function coord(params) { + var chart = params.chart, options = params.options; + var radius = options.radius, startAngle = options.startAngle, endAngle = options.endAngle; + chart.coordinate('polar', { + radius: radius, + startAngle: startAngle, + endAngle: endAngle, + }); + return params; +} +/** + * axis 配置 + * @param params + */ +function axis$g(params) { + var chart = params.chart, options = params.options; + var xField = options.xField, xAxis = options.xAxis, yField = options.yField, yAxis = options.yAxis; + chart.axis(xField, xAxis); + chart.axis(yField, yAxis); + return params; +} +/** + * label 配置 + * @param params + */ +function label$7(params) { + var chart = params.chart, options = params.options; + var label = options.label, yField = options.yField; + var geometry = findGeometry(chart, 'line'); + if (!label) { + geometry.label(false); + } + else { + var callback = label.callback, cfg = __rest$G(label, ["callback"]); + geometry.label({ + fields: [yField], + callback: callback, + cfg: transformLabel(cfg), + }); + } + return params; +} +/** + * 雷达图适配器 + * @param chart + * @param options + */ +function adaptor$q(params) { + // flow 的方式处理所有的配置到 G2 API + return flow(geometry$o, meta$f, theme$2, coord, axis$g, legend$f, tooltip$8, label$7, interaction$6, animation$5, annotation$2())(params); +} + +var RadarTooltipController = /** @class */ (function (_super) { + __extends$e(RadarTooltipController, _super); + function RadarTooltipController() { + return _super !== null && _super.apply(this, arguments) || this; + } + Object.defineProperty(RadarTooltipController.prototype, "name", { + get: function () { + return 'radar-tooltip'; + }, + enumerable: false, + configurable: true + }); + RadarTooltipController.prototype.getTooltipItems = function (point) { + var _a = this.getTooltipCfg(), shared = _a.shared, cfgTitle = _a.title; + var hintItems = _super.prototype.getTooltipItems.call(this, point); + if (hintItems.length > 0) { + var geometry_1 = this.view.geometries[0]; + var dataArray = geometry_1.dataArray; + var title_1 = hintItems[0].name; + var result_1 = []; + dataArray.forEach(function (mappingData) { + mappingData.forEach(function (d) { + var items = Util$1.getTooltipItems(d, geometry_1); + var item = items[0]; + if (!shared && item && item.name === title_1) { + var displayTitle = isNil(cfgTitle) ? title_1 : cfgTitle; + result_1.push(__assign$r(__assign$r({}, item), { name: item.title, title: displayTitle })); + } + else if (shared && item) { + var displayTitle = isNil(cfgTitle) ? item.name || title_1 : cfgTitle; + result_1.push(__assign$r(__assign$r({}, item), { name: item.title, title: displayTitle })); + } + }); + }); + return result_1; + } + return []; + }; + return RadarTooltipController; +}(TooltipController)); +registerComponentController('radar-tooltip', RadarTooltipController); +/** + * 雷达图 tooltip 激活 action + */ +var RadarTooltipAction = /** @class */ (function (_super) { + __extends$e(RadarTooltipAction, _super); + function RadarTooltipAction() { + return _super !== null && _super.apply(this, arguments) || this; + } + RadarTooltipAction.prototype.init = function () { + var view = this.context.view; + view.removeInteraction('tooltip'); + }; + RadarTooltipAction.prototype.show = function () { + var event = this.context.event; + var controller = this.getTooltipController(); + controller.showTooltip({ x: event.x, y: event.y }); + }; + RadarTooltipAction.prototype.hide = function () { + var controller = this.getTooltipController(); + controller.hideTooltip(); + }; + RadarTooltipAction.prototype.getTooltipController = function () { + var view = this.context.view; + return view.getController('radar-tooltip'); + }; + return RadarTooltipAction; +}(Action$1)); + +registerAction('radar-tooltip', RadarTooltipAction); +registerInteraction('radar-tooltip', { + start: [{ trigger: 'plot:mousemove', action: 'radar-tooltip:show' }], + end: [{ trigger: 'plot:mouseleave', action: 'radar-tooltip:hide' }], +}); + +var Radar$1 = /** @class */ (function (_super) { + __extends$e(Radar, _super); + function Radar() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'radar'; + return _this; + } + /** + * @override + * @param data + */ + Radar.prototype.changeData = function (data) { + this.updateOption({ data: data }); + this.chart.changeData(data); + }; + /** + * 获取 雷达图 默认配置 + */ + Radar.prototype.getDefaultOptions = function () { + return deepAssign({}, _super.prototype.getDefaultOptions.call(this), { + xAxis: { + label: { + offset: 15, + }, + grid: { + line: { + type: 'line', + }, + }, + }, + yAxis: { + grid: { + line: { + type: 'circle', + }, + }, + }, + legend: { + position: 'top', + }, + tooltip: { + shared: true, + showCrosshairs: true, + showMarkers: true, + crosshairs: { + type: 'xy', + line: { + style: { + stroke: '#565656', + lineDash: [4], + }, + }, + follow: true, + }, + }, + }); + }; + /** + * 获取 雷达图 的适配器 + */ + Radar.prototype.getSchemaAdaptor = function () { + return adaptor$q; + }; + return Radar; +}(Plot)); + +var AxisType; +(function (AxisType) { + AxisType["Left"] = "Left"; + AxisType["Right"] = "Right"; +})(AxisType || (AxisType = {})); +var DualAxesGeometry; +(function (DualAxesGeometry) { + DualAxesGeometry["Line"] = "line"; + DualAxesGeometry["Column"] = "column"; +})(DualAxesGeometry || (DualAxesGeometry = {})); + +var LEFT_AXES_VIEW = 'left-axes-view'; +var RIGHT_AXES_VIEW = 'right-axes-view'; +var DEFAULT_YAXIS_CONFIG = { + nice: true, + label: { + autoHide: true, + autoRotate: false, + }, +}; +var DEFAULT_LEFT_YAXIS_CONFIG = __assign$r(__assign$r({}, DEFAULT_YAXIS_CONFIG), { position: 'left' }); +var DEFAULT_RIGHT_YAXIS_CONFIG = __assign$r(__assign$r({}, DEFAULT_YAXIS_CONFIG), { position: 'right', grid: null }); + +/** + * 根据 GeometryOption 判断 geometry 是否为 line + */ +function isLine(geometryOption) { + return get$3(geometryOption, 'geometry') === DualAxesGeometry.Line; +} +/** + * 根据 GeometryOption 判断 geometry 是否为 Column + */ +function isColumn(geometryOption) { + return get$3(geometryOption, 'geometry') === DualAxesGeometry.Column; +} +/** + * 获取 GeometryOption + * @param geometryOption + * @param axis + */ +function getGeometryOption(xField, yField, geometryOption) { + // 空默认为线 + return isColumn(geometryOption) + ? deepAssign({}, { + geometry: DualAxesGeometry.Column, + label: geometryOption.label && geometryOption.isRange + ? { + content: function (item) { + var _a; + return (_a = item[yField]) === null || _a === void 0 ? void 0 : _a.join('-'); + }, + } + : undefined, + }, geometryOption) + : __assign$r({ geometry: DualAxesGeometry.Line }, geometryOption); +} +/** + * 兼容一些属性 为 arr 和 obj 的两种情况， 如 yAxis，annotations + * 为了防止左右 yField 相同，导致变成 object 之后被覆盖，所以都转变成数组的形式 + * @param yField + * @param transformAttribute + */ +function transformObjectToArray(yField, transformAttribute) { + var y1 = yField[0], y2 = yField[1]; + if (isArray$n(transformAttribute)) { + // 将数组补齐为两个 + var a1_1 = transformAttribute[0], a2_1 = transformAttribute[1]; + return [a1_1, a2_1]; + } + var a1 = get$3(transformAttribute, y1); + var a2 = get$3(transformAttribute, y2); + return [a1, a2]; +} +/** + * 获取默认值 + * @param yAxis + * @param axisType + */ +function getYAxisWithDefault(yAxis, axisType) { + if (axisType === AxisType.Left) { + return yAxis === false ? false : deepAssign({}, DEFAULT_LEFT_YAXIS_CONFIG, yAxis); + } + else if (axisType === AxisType.Right) { + return yAxis === false ? false : deepAssign({}, DEFAULT_RIGHT_YAXIS_CONFIG, yAxis); + } + return yAxis; +} + +/** + * 获取 view 的 legendItem，供存在不含有 seriesField 的图形使用 + * @param params + */ +function getViewLegendItems(params) { + var view = params.view, geometryOption = params.geometryOption, yField = params.yField, legend = params.legend; + var userMarker = get$3(legend, 'marker'); + var geometry = findGeometry(view, isLine(geometryOption) ? 'line' : 'interval'); + if (!geometryOption.seriesField) { + var legendItemName = get$3(view, "options.scales." + yField + ".alias") || yField; + // 返回 g2 设置的图例 + var colorAttribute = geometry.getAttribute('color'); + var color = view.getTheme().defaultColor; + if (colorAttribute) { + color = Util$1.getMappingValue(colorAttribute, legendItemName, get$3(colorAttribute, ['values', 0], color)); + } + var marker = (isFunction$6(userMarker) + ? userMarker + : !isEmpty$1(userMarker) && + deepAssign({}, { + style: { + stroke: color, + fill: color, + }, + }, userMarker)) || + (isLine(geometryOption) + ? { + symbol: function (x, y, r) { + return [ + ['M', x - r, y], + ['L', x + r, y], + ]; + }, + style: { + lineWidth: 2, + r: 6, + stroke: color, + }, + } + : { + symbol: 'square', + style: { + fill: color, + }, + }); + return [ + { + value: yField, + name: legendItemName, + marker: marker, + isGeometry: true, + viewId: view.id, + }, + ]; + } + var attributes = geometry.getGroupAttributes(); + return reduce$1(attributes, function (items, attr) { + var attrItems = Util$1.getLegendItems(view, geometry, attr, view.getTheme(), userMarker); + return items.concat(attrItems); + }, []); +} + +/** + * 绘制单个图形 + * @param params + */ +function drawSingleGeometry(params) { + var options = params.options, chart = params.chart; + var geometryOption = options.geometryOption; + var isStack = geometryOption.isStack, color = geometryOption.color, seriesField = geometryOption.seriesField, groupField = geometryOption.groupField, isGroup = geometryOption.isGroup; + var FIELD_KEY = ['xField', 'yField']; + if (isLine(geometryOption)) { + // 绘制线 + line(deepAssign({}, params, { + options: __assign$r(__assign$r(__assign$r({}, pick$1(options, FIELD_KEY)), geometryOption), { line: { + color: geometryOption.color, + style: geometryOption.lineStyle, + } }), + })); + // 绘制点 + point(deepAssign({}, params, { + options: __assign$r(__assign$r(__assign$r({}, pick$1(options, FIELD_KEY)), geometryOption), { point: geometryOption.point && __assign$r({ color: color, shape: 'circle' }, geometryOption.point) }), + })); + // adjust + var adjust_1 = []; + if (isGroup) { + adjust_1.push({ + type: 'dodge', + dodgeBy: groupField || seriesField, + customOffset: 0, + }); + } + if (isStack) { + adjust_1.push({ + type: 'stack', + }); + } + if (adjust_1.length) { + each$2(chart.geometries, function (g) { + g.adjust(adjust_1); + }); + } + } + if (isColumn(geometryOption)) { + adaptor$w(deepAssign({}, params, { + options: __assign$r(__assign$r(__assign$r({}, pick$1(options, FIELD_KEY)), geometryOption), { widthRatio: geometryOption.columnWidthRatio, interval: __assign$r(__assign$r({}, pick$1(geometryOption, ['color'])), { style: geometryOption.columnStyle }) }), + })); + } + return params; +} + +/** + * 右侧 View 进行 slider 过滤 + * 由于双轴图是多 View , 需要监听左侧 Slider 的 change 事件来同步右侧 View + * @param { View } view 右侧视图 + * @param { number[] } sliderValue 滑块当前值 + * @returns void + */ +var doSliderFilter = function (view, sliderValue) { + var min = sliderValue[0], max = sliderValue[1]; + var data = view.getOptions().data; + var xScale = view.getXScale(); + var dataSize = size$1(data); + if (!xScale || !dataSize) { + return; + } + var values = valuesOfKey(data, xScale.field); + var xValues = values ; + var xTickCount = size$1(xValues); + var minIndex = Math.floor(min * (xTickCount - 1)); + var maxIndex = Math.floor(max * (xTickCount - 1)); + // 增加 x 轴的过滤器 + view.filter(xScale.field, function (value) { + var idx = xValues.indexOf(value); + return idx > -1 ? isBetween$1(idx, minIndex, maxIndex) : true; + }); + view.render(true); +}; + +/** + * transformOptions，双轴图整体的取参逻辑如下 + * 1. get index getOptions: 对应的是默认的图表参数，如 appendPadding，syncView 等 + * 2. get adpator transformOption: 对应的是双轴图的默认参数，deepAssign 优先级从低到高如下 + * 2.1 defaultoption，如 tooltip，legend + * 2.2 用户填写 options + * 2.3 根据用户填写的 options 补充的数组型 options，如 yaxis，GeometryOption，因为 deepAssign 无法 assign 数组 + * + * @param params + */ +function transformOptions(params) { + var _a; + var options = params.options; + var _b = options.geometryOptions, geometryOptions = _b === void 0 ? [] : _b, xField = options.xField, yField = options.yField; + var allLine = every(geometryOptions, function (_a) { + var geometry = _a.geometry; + return geometry === DualAxesGeometry.Line || geometry === undefined; + }); + return deepAssign({}, { + options: { + geometryOptions: [], + meta: (_a = {}, + _a[xField] = { + // 默认为 cat 类型 + type: 'cat', + // x 轴一定是同步 scale 的 + sync: true, + // 如果有没有柱子，则 + range: allLine ? [0, 1] : undefined, + }, + _a), + tooltip: { + showMarkers: allLine, + // 存在柱状图，不显示 crosshairs + showCrosshairs: allLine, + shared: true, + crosshairs: { + type: 'x', + }, + }, + interactions: !allLine + ? [{ type: 'legend-visible-filter' }, { type: 'active-region' }] + : [{ type: 'legend-visible-filter' }], + legend: { + position: 'top-left', + }, + }, + }, params, { + options: { + // yAxis + yAxis: transformObjectToArray(yField, options.yAxis), + // geometryOptions + geometryOptions: [ + getGeometryOption(xField, yField[0], geometryOptions[0]), + getGeometryOption(xField, yField[1], geometryOptions[1]), + ], + // annotations + annotations: transformObjectToArray(yField, options.annotations), + }, + }); +} +/** + * 创建 双轴图 中绘制图形的 view，提前创建是因为 theme 适配器的需要 + * @param params + */ +function createViews(params) { + var _a, _b; + var chart = params.chart, options = params.options; + var geometryOptions = options.geometryOptions; + var SORT_MAP = { line: 0, column: 1 }; + // 包含配置，id，数据的结构 + var geometries = [ + { type: (_a = geometryOptions[0]) === null || _a === void 0 ? void 0 : _a.geometry, id: LEFT_AXES_VIEW }, + { type: (_b = geometryOptions[1]) === null || _b === void 0 ? void 0 : _b.geometry, id: RIGHT_AXES_VIEW }, + ]; + // 将线的 view 放置在更上一层，防止线柱遮挡。先柱后先 + geometries.sort(function (a, b) { return -SORT_MAP[a.type] + SORT_MAP[b.type]; }).forEach(function (g) { return chart.createView({ id: g.id }); }); + return params; +} +/** + * 绘制图形 + * @param params + */ +function geometry$n(params) { + var chart = params.chart, options = params.options; + var xField = options.xField, yField = options.yField, geometryOptions = options.geometryOptions, data = options.data, tooltip = options.tooltip; + // 包含配置，id，数据的结构 + var geometries = [ + __assign$r(__assign$r({}, geometryOptions[0]), { id: LEFT_AXES_VIEW, data: data[0], yField: yField[0] }), + __assign$r(__assign$r({}, geometryOptions[1]), { id: RIGHT_AXES_VIEW, data: data[1], yField: yField[1] }), + ]; + geometries.forEach(function (geometry) { + var id = geometry.id, data = geometry.data, yField = geometry.yField; + // 百分比柱状图需要额外处理一次数据 + var isPercent = isColumn(geometry) && geometry.isPercent; + var formatData = isPercent ? percent(data, yField, xField, yField) : data; + var view = findViewById(chart, id).data(formatData); + var tooltipOptions = isPercent + ? __assign$r({ formatter: function (datum) { return ({ + name: datum[geometry.seriesField] || yField, + value: (Number(datum[yField]) * 100).toFixed(2) + '%', + }); } }, tooltip) : tooltip; + // 绘制图形 + drawSingleGeometry({ + chart: view, + options: { + xField: xField, + yField: yField, + tooltip: tooltipOptions, + geometryOption: geometry, + }, + }); + }); + return params; +} +function color$1(params) { + var _a; + var chart = params.chart, options = params.options; + var geometryOptions = options.geometryOptions; + var themeColor = ((_a = chart.getTheme()) === null || _a === void 0 ? void 0 : _a.colors10) || []; + var start = 0; + /* 为 geometry 添加默认 color。 + * 1. 若 geometryOptions 存在 color，则在 drawGeometry 时已处理 + * 2. 若 不存在 color，获取 Geometry group scales个数，在 theme color 10 中提取 + * 3. 为防止 group 过多导致右色板无值或值很少，右 view 面板在依次提取剩下的 N 个 后再 concat 一次 themeColor + * 4. 为简便获取 Geometry group scales个数，在绘制完后再执行 color + * 5. 考虑之后将不同 view 使用同一个色板的需求沉淀到 g2 + */ + chart.once('beforepaint', function () { + each$2(geometryOptions, function (geometryOption, index) { + var view = findViewById(chart, index === 0 ? LEFT_AXES_VIEW : RIGHT_AXES_VIEW); + if (geometryOption.color) + return; + var groupScale = view.getGroupScales(); + var count = get$3(groupScale, [0, 'values', 'length'], 1); + var color = themeColor.slice(start, start + count).concat(index === 0 ? [] : themeColor); + view.geometries.forEach(function (geometry) { + if (geometryOption.seriesField) { + geometry.color(geometryOption.seriesField, color); + } + else { + geometry.color(color[0]); + } + }); + start += count; + }); + chart.render(true); + }); + return params; +} +/** + * meta 配置 + * @param params + */ +function meta$e(params) { + var _a, _b; + var chart = params.chart, options = params.options; + var xAxis = options.xAxis, yAxis = options.yAxis, xField = options.xField, yField = options.yField; + scale$3((_a = {}, + _a[xField] = xAxis, + _a[yField[0]] = yAxis[0], + _a))(deepAssign({}, params, { chart: findViewById(chart, LEFT_AXES_VIEW) })); + scale$3((_b = {}, + _b[xField] = xAxis, + _b[yField[1]] = yAxis[1], + _b))(deepAssign({}, params, { chart: findViewById(chart, RIGHT_AXES_VIEW) })); + return params; +} +/** + * axis 配置 + * @param params + */ +function axis$f(params) { + var chart = params.chart, options = params.options; + var leftView = findViewById(chart, LEFT_AXES_VIEW); + var rightView = findViewById(chart, RIGHT_AXES_VIEW); + var xField = options.xField, yField = options.yField, xAxis = options.xAxis, yAxis = options.yAxis; + chart.axis(xField, false); + chart.axis(yField[0], false); + chart.axis(yField[1], false); + // 左 View + leftView.axis(xField, xAxis); + leftView.axis(yField[0], getYAxisWithDefault(yAxis[0], AxisType.Left)); + // 右 Y 轴 + rightView.axis(xField, false); + rightView.axis(yField[1], getYAxisWithDefault(yAxis[1], AxisType.Right)); + return params; +} +/** + * tooltip 配置 + * @param params + */ +function tooltip$5(params) { + var chart = params.chart, options = params.options; + var tooltip = options.tooltip; + var leftView = findViewById(chart, LEFT_AXES_VIEW); + var rightView = findViewById(chart, RIGHT_AXES_VIEW); + // tooltip 经过 getDefaultOption 处理后，一定不为 undefined + chart.tooltip(tooltip); + // 在 view 上添加 tooltip，使得 shared 和 interaction active-region 起作用 + // view 应该继承 chart 里的 shared，但是从表现看来，继承有点问题 + leftView.tooltip({ + shared: true, + }); + rightView.tooltip({ + shared: true, + }); + return params; +} +/** + * interaction 配置 + * @param params + */ +function interaction$4(params) { + var chart = params.chart; + interaction$6(deepAssign({}, params, { chart: findViewById(chart, LEFT_AXES_VIEW) })); + interaction$6(deepAssign({}, params, { chart: findViewById(chart, RIGHT_AXES_VIEW) })); + return params; +} +/** + * annotation 配置 + * @param params + */ +function annotation$1(params) { + var chart = params.chart, options = params.options; + var annotations = options.annotations; + var a1 = get$3(annotations, [0]); + var a2 = get$3(annotations, [1]); + annotation$2(a1)(deepAssign({}, params, { + chart: findViewById(chart, LEFT_AXES_VIEW), + options: { + annotations: a1, + }, + })); + annotation$2(a2)(deepAssign({}, params, { + chart: findViewById(chart, RIGHT_AXES_VIEW), + options: { + annotations: a2, + }, + })); + return params; +} +function theme$1(params) { + var chart = params.chart; + /* + * 双轴图中，部分组件是绘制在子 view 层（例如 axis，line），部分组件是绘制在 chart （例如 legend) + * 为 chart 和 子 view 均注册 theme，使其自行遵循 G2 theme geometry > view > chart 进行渲染。 + */ + theme$2(deepAssign({}, params, { chart: findViewById(chart, LEFT_AXES_VIEW) })); + theme$2(deepAssign({}, params, { chart: findViewById(chart, RIGHT_AXES_VIEW) })); + theme$2(params); + return params; +} +function animation$4(params) { + var chart = params.chart; + animation$5(deepAssign({}, params, { chart: findViewById(chart, LEFT_AXES_VIEW) })); + animation$5(deepAssign({}, params, { chart: findViewById(chart, RIGHT_AXES_VIEW) })); + return params; +} +/** + * 双轴图 limitInPlot + * @param params + */ +function limitInPlot$1(params) { + var chart = params.chart, options = params.options; + var yAxis = options.yAxis; + limitInPlot$2(deepAssign({}, params, { + chart: findViewById(chart, LEFT_AXES_VIEW), + options: { + yAxis: yAxis[0], + }, + })); + limitInPlot$2(deepAssign({}, params, { + chart: findViewById(chart, RIGHT_AXES_VIEW), + options: { + yAxis: yAxis[1], + }, + })); + return params; +} +/** + * legend 配置 + * 使用 custom，便于和类似于分组柱状图-单折线图的逻辑统一 + * @param params + */ +function legend$9(params) { + var chart = params.chart, options = params.options; + var legend = options.legend, geometryOptions = options.geometryOptions, yField = options.yField, data = options.data; + var leftView = findViewById(chart, LEFT_AXES_VIEW); + var rightView = findViewById(chart, RIGHT_AXES_VIEW); + if (legend === false) { + chart.legend(false); + } + else if (isObject$f(legend) && legend.custom === true) { + chart.legend(legend); + } + else { + var leftLegend_1 = get$3(geometryOptions, [0, 'legend'], legend); + var rightLegend_1 = get$3(geometryOptions, [1, 'legend'], legend); + // 均使用自定义图例 + chart.once('beforepaint', function () { + var leftItems = data[0].length + ? getViewLegendItems({ + view: leftView, + geometryOption: geometryOptions[0], + yField: yField[0], + legend: leftLegend_1, + }) + : []; + var rightItems = data[1].length + ? getViewLegendItems({ + view: rightView, + geometryOption: geometryOptions[1], + yField: yField[1], + legend: rightLegend_1, + }) + : []; + chart.legend(deepAssign({}, legend, { + custom: true, + // todo 修改类型定义 + // @ts-ignore + items: leftItems.concat(rightItems), + })); + }); + if (geometryOptions[0].seriesField) { + leftView.legend(geometryOptions[0].seriesField, leftLegend_1); + } + if (geometryOptions[1].seriesField) { + rightView.legend(geometryOptions[1].seriesField, rightLegend_1); + } + // 自定义图例交互 + chart.on('legend-item:click', function (evt) { + var delegateObject = get$3(evt, 'gEvent.delegateObject', {}); + if (delegateObject && delegateObject.item) { + var _a = delegateObject.item, field_1 = _a.value, isGeometry = _a.isGeometry, viewId = _a.viewId; + // geometry 的时候，直接使用 view.changeVisible + if (isGeometry) { + var idx = findIndex$2(yField, function (yF) { return yF === field_1; }); + if (idx > -1) { + var geometries = get$3(findViewById(chart, viewId), 'geometries'); + each$2(geometries, function (g) { + g.changeVisible(!delegateObject.item.unchecked); + }); + } + } + else { + var legendItem_1 = get$3(chart.getController('legend'), 'option.items', []); + // 分组柱线图 + each$2(chart.views, function (view) { + // 单折柱图 + var groupScale = view.getGroupScales(); + each$2(groupScale, function (scale) { + if (scale.values && scale.values.indexOf(field_1) > -1) { + view.filter(scale.field, function (value) { + var curLegendItem = find$3(legendItem_1, function (item) { return item.value === value; }); + // 使用 legend 中的 unchecked 来判断，使得支持关闭多个图例 + return !curLegendItem.unchecked; + }); + } + }); + chart.render(true); + }); + } + } + }); + } + return params; +} +/** + * 双轴图 slider 适配器 + * @param params + */ +function slider(params) { + var chart = params.chart, options = params.options; + var slider = options.slider; + var leftView = findViewById(chart, LEFT_AXES_VIEW); + var rightView = findViewById(chart, RIGHT_AXES_VIEW); + if (slider) { + // 左 View + leftView.option('slider', slider); + // 监听左侧 slider 改变事件， 同步右侧 View 视图 + leftView.on('slider:valuechanged', function (evt) { + var _a = evt.event, value = _a.value, originValue = _a.originValue; + if (isEqual$2(value, originValue)) { + return; + } + doSliderFilter(rightView, value); + }); + chart.once('afterpaint', function () { + // 初始化数据，配置默认值时需要同步 + if (!isBoolean(slider)) { + var start = slider.start, end = slider.end; + if (start || end) { + doSliderFilter(rightView, [start, end]); + } + } + }); + } + return params; +} +/** + * 双折线图适配器 + * @param chart + * @param options + */ +function adaptor$p(params) { + // transformOptions 一定在最前面处理；color legend 使用了 beforepaint，为便于理解放在最后面 + return flow(transformOptions, createViews, + // 主题靠前设置，作为最低优先级 + theme$1, geometry$n, meta$e, axis$f, limitInPlot$1, tooltip$5, interaction$4, annotation$1, animation$4, color$1, legend$9, slider)(params); +} + +var DualAxes$1 = /** @class */ (function (_super) { + __extends$e(DualAxes, _super); + function DualAxes() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型: 双轴图 */ + _this.type = 'dual-axes'; + return _this; + } + /** + * 获取 双轴图 默认配置 + */ + DualAxes.prototype.getDefaultOptions = function () { + return deepAssign({}, _super.prototype.getDefaultOptions.call(this), { + yAxis: [], + syncViewPadding: true, + }); + }; + /** + * 获取双轴图的适配器 + */ + DualAxes.prototype.getSchemaAdaptor = function () { + return adaptor$p; + }; + return DualAxes; +}(Plot)); + +var X_FIELD$3 = 'x'; +var Y_FIELD$4 = 'y'; +var DEFAULT_TOOLTIP_OPTIONS$2 = { + showTitle: false, + shared: true, + showMarkers: false, + customContent: function (x, data) { return "" + get$3(data, [0, 'data', 'y'], 0); }, + containerTpl: '
    ', + itemTpl: '{value}', + domStyles: { + 'g2-tooltip': { + padding: '2px 4px', + fontSize: '10px', + }, + }, + showCrosshairs: true, + crosshairs: { + type: 'x', + }, +}; +/** + * 默认配置项 + */ +var DEFAULT_OPTIONS$q = { + appendPadding: 2, + tooltip: __assign$r({}, DEFAULT_TOOLTIP_OPTIONS$2), + animation: {}, +}; + +function getTinyData(data) { + return map$4(data || [], function (y, x) { return ({ x: "" + x, y: y }); }); +} + +/** + * 字段 + * @param params + */ +function geometry$m(params) { + var chart = params.chart, options = params.options; + var data = options.data, color = options.color, areaStyle = options.areaStyle, pointOptions = options.point, lineOptions = options.line; + var pointState = pointOptions === null || pointOptions === void 0 ? void 0 : pointOptions.state; + var seriesData = getTinyData(data); + chart.data(seriesData); + var primary = deepAssign({}, params, { + options: { + xField: X_FIELD$3, + yField: Y_FIELD$4, + area: { color: color, style: areaStyle }, + line: lineOptions, + point: pointOptions, + }, + }); + var second = deepAssign({}, primary, { options: { tooltip: false } }); + var pointParams = deepAssign({}, primary, { options: { tooltip: false, state: pointState } }); + // area geometry 处理 + area(primary); + line(second); + point(pointParams); + chart.axis(false); + chart.legend(false); + return params; +} +/** + * meta 配置 + * @param params + */ +function meta$d(params) { + var _a, _b; + var options = params.options; + var xAxis = options.xAxis, yAxis = options.yAxis, data = options.data; + var seriesData = getTinyData(data); + return flow(scale$3((_a = {}, + _a[X_FIELD$3] = xAxis, + _a[Y_FIELD$4] = yAxis, + _a), (_b = {}, + _b[X_FIELD$3] = { + type: 'cat', + }, + _b[Y_FIELD$4] = adjustYMetaByZero(seriesData, Y_FIELD$4), + _b)))(params); +} +/** + * 迷你面积图适配器 + * @param chart + * @param options + */ +function adaptor$o(params) { + return flow(pattern('areaStyle'), geometry$m, meta$d, tooltip$8, theme$2, animation$5, annotation$2())(params); +} + +/** + * 字段 + * @param params + */ +function geometry$l(params) { + var chart = params.chart, options = params.options; + var data = options.data, color = options.color, lineStyle = options.lineStyle, pointMapping = options.point; + var pointState = pointMapping === null || pointMapping === void 0 ? void 0 : pointMapping.state; + var seriesData = getTinyData(data); + chart.data(seriesData); + // line geometry 处理 + var primary = deepAssign({}, params, { + options: { + xField: X_FIELD$3, + yField: Y_FIELD$4, + line: { + color: color, + style: lineStyle, + }, + point: pointMapping, + }, + }); + var pointParams = deepAssign({}, primary, { options: { tooltip: false, state: pointState } }); + line(primary); + point(pointParams); + chart.axis(false); + chart.legend(false); + return params; +} +/** + * 迷你折线图适配器 + * @param chart + * @param options + */ +function adaptor$n(params) { + return flow(geometry$l, meta$d, theme$2, tooltip$8, animation$5, annotation$2())(params); +} + +var TinyLine$1 = /** @class */ (function (_super) { + __extends$e(TinyLine, _super); + function TinyLine() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'tiny-line'; + return _this; + } + /** + * 获取默认配置项 + * 供外部使用 + */ + TinyLine.getDefaultOptions = function () { + return DEFAULT_OPTIONS$q; + }; + /** + * @override + * @param data + */ + TinyLine.prototype.changeData = function (data) { + this.updateOption({ data: data }); + var _a = this, chart = _a.chart, options = _a.options; + meta$d({ chart: chart, options: options }); + chart.changeData(getTinyData(data)); + }; + TinyLine.prototype.getDefaultOptions = function () { + return TinyLine.getDefaultOptions(); + }; + /** + * 获取 迷你折线图 的适配器 + */ + TinyLine.prototype.getSchemaAdaptor = function () { + return adaptor$n; + }; + return TinyLine; +}(Plot)); + +/** + * 字段 + * @param params + */ +function geometry$k(params) { + var chart = params.chart, options = params.options; + var data = options.data, color = options.color, columnStyle = options.columnStyle, columnWidthRatio = options.columnWidthRatio; + var seriesData = getTinyData(data); + chart.data(seriesData); + var p = deepAssign({}, params, { + options: { + xField: X_FIELD$3, + yField: Y_FIELD$4, + widthRatio: columnWidthRatio, + interval: { + style: columnStyle, + color: color, + }, + }, + }); + interval(p); + chart.axis(false); + chart.legend(false); + chart.interaction('element-active'); + return params; +} +/** + * 迷你柱形图适配器 + * @param chart + * @param options + */ +function adaptor$m(params) { + return flow(theme$2, pattern('columnStyle'), geometry$k, meta$d, tooltip$8, animation$5, annotation$2())(params); +} + +var DEFAULT_TOOLTIP_OPTIONS$1 = { + showTitle: false, + shared: true, + showMarkers: false, + customContent: function (x, data) { return "" + get$3(data, [0, 'data', 'y'], 0); }, + containerTpl: '
    ', + itemTpl: '{value}', + domStyles: { + 'g2-tooltip': { + padding: '2px 4px', + fontSize: '10px', + }, + }, +}; +/** + * 默认配置项 + */ +var DEFAULT_OPTIONS$p = { + appendPadding: 2, + tooltip: __assign$r({}, DEFAULT_TOOLTIP_OPTIONS$1), + animation: {}, +}; + +var TinyColumn$1 = /** @class */ (function (_super) { + __extends$e(TinyColumn, _super); + function TinyColumn() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'tiny-column'; + return _this; + } + /** + * 获取默认配置项 + * 供外部使用 + */ + TinyColumn.getDefaultOptions = function () { + return DEFAULT_OPTIONS$p; + }; + /** + * @override + * @param data + */ + TinyColumn.prototype.changeData = function (data) { + this.updateOption({ data: data }); + var _a = this, chart = _a.chart, options = _a.options; + meta$d({ chart: chart, options: options }); + chart.changeData(getTinyData(data)); + }; + TinyColumn.prototype.getDefaultOptions = function () { + return TinyColumn.getDefaultOptions(); + }; + /** + * 获取 迷你柱形图 的适配器 + */ + TinyColumn.prototype.getSchemaAdaptor = function () { + return adaptor$m; + }; + return TinyColumn; +}(Plot)); + +/** + * 默认配置项 + */ +var DEFAULT_OPTIONS$o = { + appendPadding: 2, + tooltip: __assign$r({}, DEFAULT_TOOLTIP_OPTIONS$2), + // 默认样式 + color: 'l(90) 0:#E5EDFE 1:#ffffff', + areaStyle: { + fillOpacity: 0.6, + }, + line: { + size: 1, + color: '#5B8FF9', + }, + animation: {}, +}; + +var TinyArea$1 = /** @class */ (function (_super) { + __extends$e(TinyArea, _super); + function TinyArea() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'tiny-area'; + return _this; + } + /** + * 获取默认配置项 + * 供外部使用 + */ + TinyArea.getDefaultOptions = function () { + return DEFAULT_OPTIONS$o; + }; + /** + * @override + * @param data + */ + TinyArea.prototype.changeData = function (data) { + this.updateOption({ data: data }); + var _a = this, chart = _a.chart, options = _a.options; + meta$d({ chart: chart, options: options }); + chart.changeData(getTinyData(data)); + }; + TinyArea.prototype.getDefaultOptions = function () { + return TinyArea.getDefaultOptions(); + }; + /** + * 获取 迷你面积图 的适配器 + */ + TinyArea.prototype.getSchemaAdaptor = function () { + return adaptor$o; + }; + return TinyArea; +}(Plot)); + +// 进行转换得到值所在的 range +function getBinKey(value, binWidth, binNumber) { + // 做一点特殊处理 + if (binNumber === 1) { + return [0, binWidth]; + } + var index = Math.floor(value / binWidth); + return [binWidth * index, binWidth * (index + 1)]; +} +// 默认 sturges 转换 +function sturges(values) { + return Math.ceil(Math.log(values.length) / Math.LN2) + 1; +} +/** + * 对数据进行百分比化 + * @param data + * @param binField + * @param binWidth + * @param binNumber + * @param stackField + */ +function binHistogram(data, binField, binWidth, binNumber, stackField) { + var originData_copy = clone$7(data); + // 根据 binField 对源数据进行排序 + sortBy$1(originData_copy, binField); + // 获取源数据 binField 的 range + var values = valuesOfKey(originData_copy, binField); + var range = getRange(values); + var rangeWidth = range.max - range.min; + // 计算分箱，直方图分箱的计算基于 binWidth，如配置了 binNumber 则将其转为 binWidth 进行计算 + var _binWidth = binWidth; + if (!binWidth && binNumber) { + _binWidth = binNumber > 1 ? rangeWidth / (binNumber - 1) : range.max; + } + // 当 binWidth 和 binNumber 都没有指定的情况，采用 Sturges formula 自动生成 binWidth + if (!binWidth && !binNumber) { + var _defaultBinNumber = sturges(values); + _binWidth = rangeWidth / _defaultBinNumber; + } + // 构建 key - StatisticData 结构 + var bins = {}; + var groups = groupBy(originData_copy, stackField); + // 判断分组是否为空，如果为空，说明没有 stackField 字段 + if (isEmpty$1(groups)) { + each$2(originData_copy, function (data) { + var value = data[binField]; + var bin = getBinKey(value, _binWidth, binNumber); + var binKey = bin[0] + "-" + bin[1]; + if (!has$1(bins, binKey)) { + bins[binKey] = { range: bin, count: 0 }; + } + bins[binKey].count += 1; + }); + } + else { + Object.keys(groups).forEach(function (groupKey) { + each$2(groups[groupKey], function (data) { + var value = data[binField]; + var bin = getBinKey(value, _binWidth, binNumber); + var binKey = bin[0] + "-" + bin[1]; + var groupKeyBinKey = binKey + "-" + groupKey; + if (!has$1(bins, groupKeyBinKey)) { + bins[groupKeyBinKey] = { range: bin, count: 0 }; + bins[groupKeyBinKey][stackField] = groupKey; + } + bins[groupKeyBinKey].count += 1; + }); + }); + } + // 将分箱数据转换为 plotData 才是图表所需要的 + var plotData = []; + each$2(bins, function (bin) { + plotData.push(bin); + }); + return plotData; +} + +/** 直方图 xField */ +var HISTOGRAM_X_FIELD = 'range'; +/** 直方图 yField */ +var HISTOGRAM_Y_FIELD = 'count'; +/** + * 默认配置项 + */ +var DEFAULT_OPTIONS$n = deepAssign({}, Plot.getDefaultOptions(), { + columnStyle: { + stroke: '#FFFFFF', + }, + tooltip: { + shared: true, + showMarkers: false, + }, + interactions: [{ type: 'active-region' }], +}); + +/** + * geometry 处理 + * @param params + */ +function geometry$j(params) { + var chart = params.chart, options = params.options; + var data = options.data, binField = options.binField, binNumber = options.binNumber, binWidth = options.binWidth, color = options.color, stackField = options.stackField, legend = options.legend, columnStyle = options.columnStyle; + // 处理数据 + var plotData = binHistogram(data, binField, binWidth, binNumber, stackField); + chart.data(plotData); + var p = deepAssign({}, params, { + options: { + xField: HISTOGRAM_X_FIELD, + yField: HISTOGRAM_Y_FIELD, + seriesField: stackField, + isStack: true, + interval: { + color: color, + style: columnStyle, + }, + }, + }); + interval(p); + // 图例 + if (legend && stackField) { + chart.legend(stackField, legend); + } + return params; +} +/** + * meta 配置 + * @param params + */ +function meta$c(params) { + var _a; + var options = params.options; + var xAxis = options.xAxis, yAxis = options.yAxis; + return flow(scale$3((_a = {}, + _a[HISTOGRAM_X_FIELD] = xAxis, + _a[HISTOGRAM_Y_FIELD] = yAxis, + _a)))(params); +} +/** + * axis 配置 + * @param params + */ +function axis$e(params) { + var chart = params.chart, options = params.options; + var xAxis = options.xAxis, yAxis = options.yAxis; + // 为 false 则是不显示轴 + if (xAxis === false) { + chart.axis(HISTOGRAM_X_FIELD, false); + } + else { + chart.axis(HISTOGRAM_X_FIELD, xAxis); + } + if (yAxis === false) { + chart.axis(HISTOGRAM_Y_FIELD, false); + } + else { + chart.axis(HISTOGRAM_Y_FIELD, yAxis); + } + return params; +} +/** + * label 配置 + * @param params + */ +function label$6(params) { + var chart = params.chart, options = params.options; + var label = options.label; + var geometry = findGeometry(chart, 'interval'); + if (!label) { + geometry.label(false); + } + else { + var callback = label.callback, cfg = __rest$G(label, ["callback"]); + geometry.label({ + fields: [HISTOGRAM_Y_FIELD], + callback: callback, + cfg: transformLabel(cfg), + }); + } + return params; +} +/** + * 直方图适配器 + * @param chart + * @param options + */ +function adaptor$l(params) { + // flow 的方式处理所有的配置到 G2 API + return flow(theme$2, pattern('columnStyle'), geometry$j, meta$c, axis$e, state, label$6, tooltip$8, interaction$6, animation$5)(params); +} + +var Histogram$1 = /** @class */ (function (_super) { + __extends$e(Histogram, _super); + function Histogram() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'histogram'; + return _this; + } + /** + * 获取 默认配置项 + * 供外部使用 + */ + Histogram.getDefaultOptions = function () { + return DEFAULT_OPTIONS$n; + }; + Histogram.prototype.changeData = function (data) { + this.updateOption({ data: data }); + var _a = this.options, binField = _a.binField, binNumber = _a.binNumber, binWidth = _a.binWidth, stackField = _a.stackField; + this.chart.changeData(binHistogram(data, binField, binWidth, binNumber, stackField)); + }; + /** + * 获取直方图的适配器 + */ + Histogram.prototype.getDefaultOptions = function () { + return Histogram.getDefaultOptions(); + }; + /** + * 获取直方图的适配器 + */ + Histogram.prototype.getSchemaAdaptor = function () { + return adaptor$l; + }; + return Histogram; +}(Plot)); + +var DEFAULT_COLOR$1 = ['#FAAD14', '#E8EDF3']; +/** + * 默认配置项 + */ +var DEFAULT_OPTIONS$m = { + percent: 0.2, + color: DEFAULT_COLOR$1, + animation: {}, +}; + +/** + * 获取进度条数据 + */ +function getProgressData(percent) { + var clampPercent = clamp$1(isRealNumber(percent) ? percent : 0, 0, 1); + return [ + { + type: 'current', + percent: clampPercent, + }, + { + type: 'target', + percent: 1 - clampPercent, + }, + ]; +} + +/** + * 字段 + * @param params + */ +function geometry$i(params) { + var chart = params.chart, options = params.options; + var percent = options.percent, progressStyle = options.progressStyle, color = options.color, barWidthRatio = options.barWidthRatio; + chart.data(getProgressData(percent)); + var p = deepAssign({}, params, { + options: { + xField: '1', + yField: 'percent', + seriesField: 'type', + isStack: true, + widthRatio: barWidthRatio, + interval: { + style: progressStyle, + color: isString$3(color) ? [color, DEFAULT_COLOR$1[1]] : color, + }, + args: { + zIndexReversed: true, + }, + }, + }); + interval(p); + // 关闭组件 + chart.tooltip(false); + chart.axis(false); + chart.legend(false); + return params; +} +/** + * other 配置 + * @param params + */ +function coordinate$5(params) { + var chart = params.chart; + chart.coordinate('rect').transpose(); + return params; +} +/** + * 进度图适配器 + * @param chart + * @param options + */ +function adaptor$k(params) { + // @ts-ignore + return flow(geometry$i, scale$3({}), coordinate$5, animation$5, theme$2, annotation$2())(params); +} + +var Progress$1 = /** @class */ (function (_super) { + __extends$e(Progress, _super); + function Progress() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'process'; + return _this; + } + /** + * 获取 仪表盘 默认配置项 + * 供外部使用 + */ + Progress.getDefaultOptions = function () { + return DEFAULT_OPTIONS$m; + }; + /** + * 更新数据 + * @param percent + */ + Progress.prototype.changeData = function (percent) { + this.updateOption({ percent: percent }); + this.chart.changeData(getProgressData(percent)); + }; + Progress.prototype.getDefaultOptions = function () { + return Progress.getDefaultOptions(); + }; + /** + * 获取 进度图 的适配器 + */ + Progress.prototype.getSchemaAdaptor = function () { + return adaptor$k; + }; + return Progress; +}(Plot)); + +/** + * coordinate 配置 + * @param params + */ +function coordinate$4(params) { + var chart = params.chart, options = params.options; + var innerRadius = options.innerRadius, radius = options.radius; + // coordinate + chart.coordinate('theta', { + innerRadius: innerRadius, + radius: radius, + }); + return params; +} +/** + * statistic 配置 + * @param params + */ +function statistic$2(params, updated) { + var chart = params.chart, options = params.options; + var innerRadius = options.innerRadius, statistic = options.statistic, percent = options.percent, meta = options.meta; + // 先清空标注，再重新渲染 + chart.getController('annotation').clear(true); + /** 中心文本 指标卡 */ + if (innerRadius && statistic) { + var metaFormatter = get$3(meta, ['percent', 'formatter']) || (function (v) { return (v * 100).toFixed(2) + "%"; }); + var contentOpt = statistic.content; + if (contentOpt) { + contentOpt = deepAssign({}, contentOpt, { + content: !isNil(contentOpt.content) ? contentOpt.content : metaFormatter(percent), + }); + } + renderStatistic(chart, { statistic: __assign$r(__assign$r({}, statistic), { content: contentOpt }), plotType: 'ring-progress' }, { percent: percent }); + } + if (updated) { + chart.render(true); + } + return params; +} +/** + * 环形进度图适配器 + * @param chart + * @param options + */ +function adaptor$j(params) { + return flow(geometry$i, scale$3({}), coordinate$4, statistic$2, animation$5, theme$2, annotation$2())(params); +} + +/** + * 仪表盘默认配置项 + */ +var DEFAULT_OPTIONS$l = { + percent: 0.2, + innerRadius: 0.8, + radius: 0.98, + color: ['#FAAD14', '#E8EDF3'], + statistic: { + title: false, + content: { + style: { + fontSize: '14px', + fontWeight: 300, + fill: '#4D4D4D', + textAlign: 'center', + textBaseline: 'middle', + }, + }, + }, + animation: {}, +}; + +var RingProgress$1 = /** @class */ (function (_super) { + __extends$e(RingProgress, _super); + function RingProgress() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'ring-process'; + return _this; + } + /** + * 获取默认配置项 + * 供外部使用 + */ + RingProgress.getDefaultOptions = function () { + return DEFAULT_OPTIONS$l; + }; + /** + * 更新数据 + * @param percent + */ + RingProgress.prototype.changeData = function (percent) { + this.chart.emit(VIEW_LIFE_CIRCLE.BEFORE_CHANGE_DATA, Event$1.fromData(this.chart, VIEW_LIFE_CIRCLE.BEFORE_CHANGE_DATA, null)); + this.updateOption({ percent: percent }); + this.chart.data(getProgressData(percent)); + // todo 后续让 G2 层在 afterrender 之后，来重绘 annotations + statistic$2({ chart: this.chart, options: this.options }, true); + this.chart.emit(VIEW_LIFE_CIRCLE.AFTER_CHANGE_DATA, Event$1.fromData(this.chart, VIEW_LIFE_CIRCLE.AFTER_CHANGE_DATA, null)); + }; + RingProgress.prototype.getDefaultOptions = function () { + return RingProgress.getDefaultOptions(); + }; + /** + * 获取 环形进度图 的适配器 + */ + RingProgress.prototype.getSchemaAdaptor = function () { + return adaptor$j; + }; + return RingProgress; +}(Plot)); + +function geometry$h(params) { + var chart = params.chart, options = params.options; + var data = options.data, type = options.type, xField = options.xField, yField = options.yField, colorField = options.colorField, sizeField = options.sizeField, sizeRatio = options.sizeRatio, shape = options.shape, color = options.color, tooltip = options.tooltip, heatmapStyle = options.heatmapStyle; + chart.data(data); + var geometryType = 'polygon'; + if (type === 'density') { + geometryType = 'heatmap'; + } + var _a = getTooltipMapping(tooltip, [xField, yField, colorField]), fields = _a.fields, formatter = _a.formatter; + /** + * The ratio between the actual size and the max available size, must be in range `[0,1]`. + * + * If the `sizeRatio` attribute is undefined or it exceeds the range, + * `checkedSizeRatio` would be set to 1 as default. + */ + var checkedSizeRatio = 1; + if (sizeRatio || sizeRatio === 0) { + if (!shape && !sizeField) { + console.warn('sizeRatio is not in effect: Must define shape or sizeField first'); + } + else if (sizeRatio < 0 || sizeRatio > 1) { + console.warn('sizeRatio is not in effect: It must be a number in [0,1]'); + } + else { + checkedSizeRatio = sizeRatio; + } + } + geometry$w(deepAssign({}, params, { + options: { + type: geometryType, + colorField: colorField, + tooltipFields: fields, + shapeField: sizeField || '', + label: undefined, + mapping: { + tooltip: formatter, + shape: shape && + (sizeField + ? function (dautm) { + var field = data.map(function (row) { return row[sizeField]; }); + var min = Math.min.apply(Math, field); + var max = Math.max.apply(Math, field); + return [shape, (get$3(dautm, sizeField) - min) / (max - min), checkedSizeRatio]; + } + : function () { return [shape, 1, checkedSizeRatio]; }), + color: color || (colorField && chart.getTheme().sequenceColors.join('-')), + style: heatmapStyle, + }, + }, + })); + return params; +} +/** + * meta 配置 + * @param params + */ +function meta$b(params) { + var _a; + var options = params.options; + var xAxis = options.xAxis, yAxis = options.yAxis, xField = options.xField, yField = options.yField; + return flow(scale$3((_a = {}, + _a[xField] = xAxis, + _a[yField] = yAxis, + _a)))(params); +} +/** + * axis 配置 + * @param params + */ +function axis$d(params) { + var chart = params.chart, options = params.options; + var xAxis = options.xAxis, yAxis = options.yAxis, xField = options.xField, yField = options.yField; + // 为 false 则是不显示轴 + if (xAxis === false) { + chart.axis(xField, false); + } + else { + chart.axis(xField, xAxis); + } + if (yAxis === false) { + chart.axis(yField, false); + } + else { + chart.axis(yField, yAxis); + } + return params; +} +/** + * fixme 后续确认下，数据标签的逻辑为啥和通用的不一致 + * 数据标签 + * @param params + */ +function label$5(params) { + var chart = params.chart, options = params.options; + var label = options.label, colorField = options.colorField, type = options.type; + var geometry = findGeometry(chart, type === 'density' ? 'heatmap' : 'polygon'); + if (!label) { + geometry.label(false); + } + else if (colorField) { + var callback = label.callback, cfg = __rest$G(label, ["callback"]); + geometry.label({ + fields: [colorField], + callback: callback, + cfg: transformLabel(cfg), + }); + } + return params; +} +/** + * 极坐标 + * @param params + */ +function coordinate$3(params) { + var chart = params.chart, options = params.options; + var coordinate = options.coordinate, reflect = options.reflect; + if (coordinate) { + chart.coordinate({ + type: coordinate.type || 'rect', + cfg: coordinate.cfg, + }); + } + if (reflect) { + chart.coordinate().reflect(reflect); + } + return params; +} +/** + * 热力图适配器 + * @param chart + * @param options + */ +function adaptor$i(params) { + // flow 的方式处理所有的配置到 G2 API + return flow(theme$2, pattern('heatmapStyle'), meta$b, coordinate$3, geometry$h, axis$d, legend$f, tooltip$8, label$5, annotation$2(), interaction$6, animation$5, state)(params); +} + +/** + * 色块图默认配置项 + */ +var DEFAULT_OPTIONS$k = deepAssign({}, Plot.getDefaultOptions(), { + type: 'polygon', + legend: false, + coordinate: { + type: 'rect', + }, + xAxis: { + tickLine: null, + line: null, + grid: { + alignTick: false, + line: { + style: { + lineWidth: 1, + lineDash: null, + stroke: '#f0f0f0', + }, + }, + }, + }, + yAxis: { + grid: { + alignTick: false, + line: { + style: { + lineWidth: 1, + lineDash: null, + stroke: '#f0f0f0', + }, + }, + }, + }, +}); + +registerShape('polygon', 'circle', { + draw: function (cfg, group) { + var _a, _b; + var cx = cfg.x; + var cy = cfg.y; + var points = this.parsePoints(cfg.points); + var width = Math.abs(points[2].x - points[1].x); + var height = Math.abs(points[1].y - points[0].y); + var maxRadius = Math.min(width, height) / 2; + var value = Number(cfg.shape[1]); + var sizeRatio = Number(cfg.shape[2]); + var radiusRatio = Math.sqrt(sizeRatio); + var radius = maxRadius * radiusRatio * Math.sqrt(value); + var fill = ((_a = cfg.style) === null || _a === void 0 ? void 0 : _a.fill) || cfg.color || ((_b = cfg.defaultStyle) === null || _b === void 0 ? void 0 : _b.fill); + var polygon = group.addShape('circle', { + attrs: __assign$r(__assign$r(__assign$r({ x: cx, y: cy, r: radius }, cfg.defaultStyle), cfg.style), { fill: fill }), + }); + return polygon; + }, +}); + +registerShape('polygon', 'square', { + draw: function (cfg, group) { + var _a, _b; + var cx = cfg.x; + var cy = cfg.y; + var points = this.parsePoints(cfg.points); + var width = Math.abs(points[2].x - points[1].x); + var height = Math.abs(points[1].y - points[0].y); + var maxSideLength = Math.min(width, height); + var value = Number(cfg.shape[1]); + var sizeRatio = Number(cfg.shape[2]); + var lenRatio = Math.sqrt(sizeRatio); + var sideLength = maxSideLength * lenRatio * Math.sqrt(value); + var fill = ((_a = cfg.style) === null || _a === void 0 ? void 0 : _a.fill) || cfg.color || ((_b = cfg.defaultStyle) === null || _b === void 0 ? void 0 : _b.fill); + var polygon = group.addShape('rect', { + attrs: __assign$r(__assign$r(__assign$r({ x: cx - sideLength / 2, y: cy - sideLength / 2, width: sideLength, height: sideLength }, cfg.defaultStyle), cfg.style), { fill: fill }), + }); + return polygon; + }, +}); + +var Heatmap$1 = /** @class */ (function (_super) { + __extends$e(Heatmap, _super); + function Heatmap() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'heatmap'; + return _this; + } + /** + * 获取 柱形图 默认配置项 + * 供外部使用 + */ + Heatmap.getDefaultOptions = function () { + return DEFAULT_OPTIONS$k; + }; + /** + * 获取直方图的适配器 + */ + Heatmap.prototype.getSchemaAdaptor = function () { + return adaptor$i; + }; + /** + * 获取 色块图 默认配置 + */ + Heatmap.prototype.getDefaultOptions = function () { + return Heatmap.getDefaultOptions(); + }; + return Heatmap; +}(Plot)); + +var _a$2; +var BOX_RANGE = '$$range$$'; +var BOX_RANGE_ALIAS = 'low-q1-median-q3-high'; +var BOX_SYNC_NAME = '$$y_outliers$$'; +var OUTLIERS_VIEW_ID = 'outliers_view'; +/** + * 面积图默认配置项 + */ +var DEFAULT_OPTIONS$j = deepAssign({}, Plot.getDefaultOptions(), { + meta: (_a$2 = {}, + _a$2[BOX_RANGE] = { min: 0, alias: BOX_RANGE_ALIAS }, + _a$2), + // 默认区域交互 + interactions: [{ type: 'active-region' }], + // 默认 tooltips 共享，不显示 markers + tooltip: { + showMarkers: false, + shared: true, + }, + boxStyle: { + lineWidth: 1, + }, +}); + +/** + * @desc 将数据转换为 box 需要的的图表数据,如果yField为数组,从data中解构出对应数组值并写入data,否则直接返回data + * @param data + * @param yField + */ +var transformData$8 = function (data, yField) { + var newData = data; + // formate data when `yField` is Array + if (Array.isArray(yField)) { + var low_1 = yField[0], q1_1 = yField[1], median_1 = yField[2], q3_1 = yField[3], high_1 = yField[4]; + newData = map$4(data, function (obj) { + obj[BOX_RANGE] = [obj[low_1], obj[q1_1], obj[median_1], obj[q3_1], obj[high_1]]; + return obj; + }); + } + return newData; +}; + +/** + * 字段 + * @param params + */ +function field$4(params) { + var chart = params.chart, options = params.options; + var xField = options.xField, yField = options.yField, groupField = options.groupField, color = options.color, tooltip = options.tooltip, boxStyle = options.boxStyle; + chart.data(transformData$8(options.data, yField)); + var yFieldName = isArray$n(yField) ? BOX_RANGE : yField; + var rawFields = yField ? (isArray$n(yField) ? yField : [yField]) : []; + var tooltipOptions = tooltip; + if (tooltipOptions !== false) { + tooltipOptions = deepAssign({}, { fields: isArray$n(yField) ? yField : [] }, tooltipOptions); + } + var ext = schema(deepAssign({}, params, { + options: { + xField: xField, + yField: yFieldName, + seriesField: groupField, + tooltip: tooltipOptions, + rawFields: rawFields, + schema: { + shape: 'box', + color: color, + style: boxStyle, + }, + }, + })).ext; + if (groupField) { + ext.geometry.adjust('dodge'); + } + return params; +} +function outliersPoint(params) { + var chart = params.chart, options = params.options; + var xField = options.xField, data = options.data, outliersField = options.outliersField, outliersStyle = options.outliersStyle, padding = options.padding; + if (!outliersField) + return params; + var outliersView = chart.createView({ padding: padding, id: OUTLIERS_VIEW_ID }); + outliersView.data(data); + point({ + chart: outliersView, + options: { + xField: xField, + yField: outliersField, + point: { shape: 'circle', style: outliersStyle }, + }, + }); + outliersView.axis(false); + return params; +} +/** + * meta 配置 + * @param params + */ +function meta$a(params) { + var _a, _b; + var chart = params.chart, options = params.options; + var meta = options.meta, xAxis = options.xAxis, yAxis = options.yAxis, xField = options.xField, yField = options.yField, outliersField = options.outliersField; + var yFieldName = Array.isArray(yField) ? BOX_RANGE : yField; + var baseMeta = {}; + // make yField and outliersField share y mate + if (outliersField) { + var syncName = BOX_SYNC_NAME; + baseMeta = (_a = {}, + _a[outliersField] = { sync: syncName, nice: true }, + _a[yFieldName] = { sync: syncName, nice: true }, + _a); + } + var scales = deepAssign(baseMeta, meta, (_b = {}, + _b[xField] = pick$1(xAxis, AXIS_META_CONFIG_KEYS), + _b[yFieldName] = pick$1(yAxis, AXIS_META_CONFIG_KEYS), + _b)); + chart.scale(scales); + return params; +} +/** + * axis 配置 + * @param params + */ +function axis$c(params) { + var chart = params.chart, options = params.options; + var xAxis = options.xAxis, yAxis = options.yAxis, xField = options.xField, yField = options.yField; + var yFieldName = Array.isArray(yField) ? BOX_RANGE : yField; + // 为 false 则是不显示轴 + if (xAxis === false) { + chart.axis(xField, false); + } + else { + chart.axis(xField, xAxis); + } + if (yAxis === false) { + chart.axis(BOX_RANGE, false); + } + else { + chart.axis(yFieldName, yAxis); + } + return params; +} +/** + * legend 配置 + * @param params + */ +function legend$8(params) { + var chart = params.chart, options = params.options; + var legend = options.legend, groupField = options.groupField; + if (groupField) { + if (legend) { + chart.legend(groupField, legend); + } + else { + // Grouped Box Chart default has legend, and it's position is `bottom` + chart.legend(groupField, { position: 'bottom' }); + } + } + else { + chart.legend(false); + } + return params; +} +/** + * 箱型图适配器 + * @param params + */ +function adaptor$h(params) { + return flow(field$4, outliersPoint, meta$a, axis$c, legend$8, tooltip$8, interaction$6, animation$5, theme$2)(params); +} + +var Box$2 = /** @class */ (function (_super) { + __extends$e(Box, _super); + function Box() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'box'; + return _this; + } + /** + * 获取 默认配置项 + * 供外部使用 + */ + Box.getDefaultOptions = function () { + return DEFAULT_OPTIONS$j; + }; + /** + * @override + * @param data + */ + Box.prototype.changeData = function (data) { + this.updateOption({ data: data }); + var yField = this.options.yField; + var outliersView = this.chart.views.find(function (v) { return v.id === OUTLIERS_VIEW_ID; }); + if (outliersView) { + outliersView.data(data); + } + this.chart.changeData(transformData$8(data, yField)); + }; + /** + * 获取 箱型图 默认配置项 + */ + Box.prototype.getDefaultOptions = function () { + return Box.getDefaultOptions(); + }; + /** + * 获取 箱型图 的适配器 + */ + Box.prototype.getSchemaAdaptor = function () { + return adaptor$h; + }; + return Box; +}(Plot)); + +var src = {exports: {}}; + +var helper$1 = {exports: {}}; + +(function (module) { + +var self = module.exports; + +module.exports.isNumber = function (x) { + return (typeof x === 'number'); +}; + +module.exports.findMin = function (arr) { + if (arr.length === 0) { + return Infinity; + } + + var curr = arr[0]; + for (var i = 1; i < arr.length; i++) { + curr = Math.min(curr, arr[i]); + } + return curr; +}; + +module.exports.findMax = function (arr) { + if (arr.length === 0) { + return -Infinity; + } + + var curr = arr[0]; + for (var i = 1; i < arr.length; i++) { + curr = Math.max(curr, arr[i]); + } + return curr; +}; + +module.exports.findMinMulti = function (arr) { + var curr = self.findMin(arr[0]); + for (var i = 1; i < arr.length; i++) { + curr = Math.min(curr, self.findMin(arr[i])); + } + return curr; +}; + +module.exports.findMaxMulti = function (arr) { + var curr = self.findMax(arr[0]); + for (var i = 1; i < arr.length; i++) { + curr = Math.max(curr, self.findMax(arr[i])); + } + return curr; +}; + +module.exports.inside = function (min, max, x) { + return (min <= x) && (x <= max); +}; +}(helper$1)); + +(function (module) { + +var DEFAULT_SIZE = 50; +var DEFAULT_WIDTH = 2; + +var LN_2 = Math.log(2); +var self = module.exports; + +var helper = helper$1.exports; + +// Triangle +function kernel(x) { + return 1 - Math.abs(x); +} + +/** + * Get min and max value for the pdf, covering all arr data range while respecting options' data + * @param arr + * @param options + * @returns {*} + */ +module.exports.getUnifiedMinMax = function (arr, options) { + return self.getUnifiedMinMaxMulti([arr], options); +}; + +module.exports.getUnifiedMinMaxMulti = function (arrMulti, options) { + options = options || {}; + + var relaxMin = false; + var relaxMax = false; + + var width = helper.isNumber(options.width) ? options.width : DEFAULT_WIDTH; + var size = helper.isNumber(options.size) ? options.size : DEFAULT_SIZE; + var min = helper.isNumber(options.min) ? options.min : (relaxMin = true, helper.findMinMulti(arrMulti)); + var max = helper.isNumber(options.max) ? options.max : (relaxMax = true, helper.findMaxMulti(arrMulti)); + + var range = max - min; + var step = range / (size - 1); + + // Relax? + if (relaxMin) { + min = min - 2 * width * step; + } + if (relaxMax) { + max = max + 2 * width * step; + } + + return { + min: min, + max: max + }; +}; + +module.exports.create = function (arr, options) { + options = options || {}; + + if (!arr || (arr.length === 0)) { + return []; + } + + var size = helper.isNumber(options.size) ? options.size : DEFAULT_SIZE; + var width = helper.isNumber(options.width) ? options.width : DEFAULT_WIDTH; + var normalizedMinMax = self.getUnifiedMinMax(arr, { + size: size, + width: width, + min: options.min, + max: options.max + }); + + var min = normalizedMinMax.min; + var max = normalizedMinMax.max; + + var range = max - min; + var step = range / (size - 1); + if (range === 0) { + // Special case... + return [{x: min, y: 1}]; + } + + // Good to go + + var buckets = []; + for (var i = 0; i < size; i++) { + buckets.push({ + x: min + i * step, + y: 0 + }); + } + + var xToBucket = function (x) { + return Math.floor((x - min) / step); + }; + + var partialArea = generatePartialAreas(kernel, width); + var fullArea = partialArea[width]; + var c = partialArea[width-1] - partialArea[width-2]; + + var initalValue = 0; + arr.forEach(function (x) { + var bucket = xToBucket(x); + + // Totally outside? + if ((bucket + width < 0) || (bucket - width >= buckets.length)) { + return; + } + + var start = Math.max(bucket - width, 0); + var mid = bucket; + var end = Math.min(bucket + width, buckets.length - 1); + + var leftBlockCount = start - (bucket - width); + var rightBlockCount = (bucket + width) - end; + var spilledAreaLeft = partialArea[-width-1 + leftBlockCount] || 0; + var spilledAreaRight = partialArea[-width-1 + rightBlockCount] || 0; + var weight = fullArea / (fullArea - spilledAreaLeft - spilledAreaRight); + + if (leftBlockCount > 0) { + initalValue += weight * (leftBlockCount - 1) * c; + } + + // Add grads + var startGradPos = Math.max(0, bucket-width+1); + if (helper.inside(0, buckets.length-1, startGradPos)) { + buckets[startGradPos].y += weight * 1 * c; + } + if (helper.inside(0, buckets.length-1, mid + 1)) { + buckets[mid + 1].y -= weight * 2 * c; + } + if (helper.inside(0, buckets.length-1, end + 1)) { + buckets[end + 1].y += weight * 1 * c; + } + }); + + var accumulator = initalValue; + var gradAccumulator = 0; + var area = 0; + buckets.forEach(function (bucket) { + gradAccumulator += bucket.y; + accumulator += gradAccumulator; + + bucket.y = accumulator; + area += accumulator; + }); + + // Normalize + if (area > 0) { + buckets.forEach(function (bucket) { + bucket.y /= area; + }); + } + + return buckets; +}; + +function generatePartialAreas(kernel, width) { + var partialAreas = {}; + + var accumulator = 0; + for (var i = -width; i <= width; i++) { + accumulator += kernel(i/width); + partialAreas[i] = accumulator; + } + + return partialAreas; +} + +module.exports.getExpectedValueFromPdf = function (pdf) { + if (!pdf || (pdf.length === 0)) { + return undefined; + } + + var expected = 0; + + pdf.forEach(function (obj) { + expected += obj.x * obj.y; + }); + + return expected; +}; + +module.exports.getXWithLeftTailArea = function (pdf, area) { + if (!pdf || (pdf.length === 0)) { + return undefined; + } + + var accumulator = 0; + var last = 0; + for (var i = 0; i < pdf.length; i++) { + last = i; + accumulator += pdf[i].y; + + if (accumulator >= area) { + break; + } + } + + return pdf[last].x; +}; + +module.exports.getPerplexity = function (pdf) { + if (!pdf || (pdf.length === 0)) { + return undefined; + } + + var entropy = 0; + pdf.forEach(function (obj) { + var ln = Math.log(obj.y); + + if (isFinite(ln)) { + entropy += obj.y * ln; + } + }); + entropy = -entropy / LN_2; + + return Math.pow(2, entropy); +}; +}(src)); + +var pdf = src.exports; + +// from https://github.com/simple-statistics +/** + * This is the internal implementation of quantiles: when you know + * that the order is sorted, you don't need to re-sort it, and the computations + * are faster. + * + * @param {Array} x sample of one or more data points + * @param {number} p desired quantile: a number between 0 to 1, inclusive + * @returns {number} quantile value + * @throws {Error} if p ix outside of the range from 0 to 1 + * @throws {Error} if x is empty + * @example + * quantileSorted([3, 6, 7, 8, 8, 9, 10, 13, 15, 16, 20], 0.5); // => 9 + */ +function quantileSorted(x, p) { + var idx = x.length * p; + if (x.length === 0) { + throw new Error('quantile requires at least one data point.'); + } + else if (p < 0 || p > 1) { + throw new Error('quantiles must be between 0 and 1'); + } + else if (p === 1) { + // If p is 1, directly return the last element + return x[x.length - 1]; + } + else if (p === 0) { + // If p is 0, directly return the first element + return x[0]; + } + else if (idx % 1 !== 0) { + // If p is not integer, return the next element in array + return x[Math.ceil(idx) - 1]; + } + else if (x.length % 2 === 0) { + // If the list has even-length, we'll take the average of this number + // and the next value, if there is one + return (x[idx - 1] + x[idx]) / 2; + } + else { + // Finally, in the simple case of an integer value + // with an odd-length list, return the x value at the index. + return x[idx]; + } +} +/** + * 交换数组位置 + * @param arr T[] + * @param i number + * @param j number + */ +function swap(arr, i, j) { + var tmp = arr[i]; + arr[i] = arr[j]; + arr[j] = tmp; +} +/** + * Rearrange items in `arr` so that all items in `[left, k]` range are the smallest. + * The `k`-th element will have the `(k - left + 1)`-th smallest value in `[left, right]`. + * + * Implements Floyd-Rivest selection algorithm https://en.wikipedia.org/wiki/Floyd-Rivest_algorithm + * + * @param {Array} arr input array + * @param {number} k pivot index + * @param {number} [left] left index + * @param {number} [right] right index + * @returns {void} mutates input array + * @example + * var arr = [65, 28, 59, 33, 21, 56, 22, 95, 50, 12, 90, 53, 28, 77, 39]; + * quickselect(arr, 8); + * // = [39, 28, 28, 33, 21, 12, 22, 50, 53, 56, 59, 65, 90, 77, 95] + */ +function quickselect(arr, k, left, right) { + left = left || 0; + right = right || arr.length - 1; + while (right > left) { + // 600 and 0.5 are arbitrary constants chosen in the original paper to minimize execution time + if (right - left > 600) { + var n = right - left + 1; + var m = k - left + 1; + var z = Math.log(n); + var s = 0.5 * Math.exp((2 * z) / 3); + var sd = 0.5 * Math.sqrt((z * s * (n - s)) / n); + if (m - n / 2 < 0) + sd *= -1; + var newLeft = Math.max(left, Math.floor(k - (m * s) / n + sd)); + var newRight = Math.min(right, Math.floor(k + ((n - m) * s) / n + sd)); + quickselect(arr, k, newLeft, newRight); + } + var t = arr[k]; + var i = left; + var j = right; + swap(arr, left, k); + if (arr[right] > t) + swap(arr, left, right); + while (i < j) { + swap(arr, i, j); + i++; + j--; + while (arr[i] < t) + i++; + while (arr[j] > t) + j--; + } + if (arr[left] === t) + swap(arr, left, j); + else { + j++; + swap(arr, j, right); + } + if (j <= k) + left = j + 1; + if (k <= j) + right = j - 1; + } +} +function quantile(x, p) { + var copy = x.slice(); + if (Array.isArray(p)) { + // rearrange elements so that each element corresponding to a requested + // quantile is on a place it would be if the array was fully sorted + multiQuantileSelect(copy, p); + // Initialize the result array + var results = []; + // For each requested quantile + for (var i = 0; i < p.length; i++) { + results[i] = quantileSorted(copy, p[i]); + } + return results; + } + else { + var idx = quantileIndex(copy.length, p); + quantileSelect(copy, idx, 0, copy.length - 1); + return quantileSorted(copy, p); + } +} +function quantileSelect(arr, k, left, right) { + if (k % 1 === 0) { + quickselect(arr, k, left, right); + } + else { + k = Math.floor(k); + quickselect(arr, k, left, right); + quickselect(arr, k + 1, k + 1, right); + } +} +function multiQuantileSelect(arr, p) { + var indices = [0]; + for (var i = 0; i < p.length; i++) { + indices.push(quantileIndex(arr.length, p[i])); + } + indices.push(arr.length - 1); + indices.sort(compare$1); + var stack = [0, indices.length - 1]; + while (stack.length) { + var r = Math.ceil(stack.pop()); + var l = Math.floor(stack.pop()); + if (r - l <= 1) + continue; + var m = Math.floor((l + r) / 2); + quantileSelect(arr, indices[m], Math.floor(indices[l]), Math.ceil(indices[r])); + stack.push(l, m, m, r); + } +} +function compare$1(a, b) { + return a - b; +} +function quantileIndex(len, p) { + var idx = len * p; + if (p === 1) { + // If p is 1, directly return the last index + return len - 1; + } + else if (p === 0) { + // If p is 0, directly return the first index + return 0; + } + else if (idx % 1 !== 0) { + // If index is not integer, return the next index in array + return Math.ceil(idx) - 1; + } + else if (len % 2 === 0) { + // If the list has even-length, we'll return the middle of two indices + // around quantile to indicate that we need an average value of the two + return idx - 0.5; + } + else { + // Finally, in the simple case of an integer index + // with an odd-length list, return the index + return idx; + } +} + +var toBoxValue = function (values) { + return { + low: min$6(values), + high: max$7(values), + q1: quantile(values, 0.25), + q3: quantile(values, 0.75), + median: quantile(values, [0.5]), + minMax: [min$6(values), max$7(values)], + quantile: [quantile(values, 0.25), quantile(values, 0.75)], + }; +}; +var toViolinValue = function (values, pdfOptions) { + var pdfResults = pdf.create(values, pdfOptions); + return { + violinSize: pdfResults.map(function (result) { return result.y; }), + violinY: pdfResults.map(function (result) { return result.x; }), + }; +}; +var transformViolinData = function (options) { + var xField = options.xField, yField = options.yField, seriesField = options.seriesField, data = options.data, kde = options.kde; + /** 生成概率密度函数的配置 */ + var pdfOptions = { + min: kde.min, + max: kde.max, + size: kde.sampleSize, + width: kde.width, + }; + // 无拆分 + if (!seriesField) { + var group_1 = groupBy(data, xField); + return Object.keys(group_1).map(function (x) { + var records = group_1[x]; + var values = records.map(function (record) { return record[yField]; }); + return __assign$r(__assign$r({ x: x }, toViolinValue(values, pdfOptions)), toBoxValue(values)); + }); + } + // 有拆分 + var resultList = []; + var seriesGroup = groupBy(data, seriesField); + Object.keys(seriesGroup).forEach(function (series) { + var group = groupBy(seriesGroup[series], xField); + return Object.keys(group).forEach(function (key) { + var _a; + var records = group[key]; + var values = records.map(function (record) { return record[yField]; }); + resultList.push(__assign$r(__assign$r((_a = { x: key }, _a[seriesField] = series, _a), toViolinValue(values, pdfOptions)), toBoxValue(values))); + }); + }); + return resultList; +}; + +var X_FIELD$2 = 'x'; +var VIOLIN_Y_FIELD = 'violinY'; +var VIOLIN_SIZE_FIELD = 'violinSize'; +var MIN_MAX_FIELD = 'minMax'; +var QUANTILE_FIELD = 'quantile'; +var MEDIAN_FIELD = 'median'; +var VIOLIN_VIEW_ID = 'violin_view'; +var MIN_MAX_VIEW_ID = 'min_max_view'; +var QUANTILE_VIEW_ID = 'quantile_view'; +var MEDIAN_VIEW_ID = 'median_view'; +var DEFAULT_OPTIONS$i = deepAssign({}, Plot.getDefaultOptions(), { + // 多 view 组成，一定要设置 view padding 同步 + syncViewPadding: true, + // 默认核函数 + kde: { + type: 'triangular', + sampleSize: 32, + width: 3, + }, + // 默认小提琴轮廓样式 + violinStyle: { + lineWidth: 1, + fillOpacity: 0.3, + strokeOpacity: 0.75, + }, + // 坐标轴 + xAxis: { + grid: { + line: null, + }, + tickLine: { + alignTick: false, + }, + }, + yAxis: { + grid: { + line: { + style: { + lineWidth: 0.5, + lineDash: [4, 4], + }, + }, + }, + }, + // 图例 + legend: { + position: 'top-left', + }, + // Tooltip + tooltip: { + showMarkers: false, + }, +}); + +var TOOLTIP_FIELDS = ['low', 'high', 'q1', 'q3', 'median']; +var adjustCfg = [ + { + type: 'dodge', + marginRatio: 1 / 32, + }, +]; +/** 处理数据 */ +function data(params) { + var chart = params.chart, options = params.options; + chart.data(transformViolinData(options)); + return params; +} +/** 小提琴轮廓 */ +function violinView(params) { + var chart = params.chart, options = params.options; + var seriesField = options.seriesField, color = options.color, _a = options.shape, shape = _a === void 0 ? 'violin' : _a, violinStyle = options.violinStyle, tooltip = options.tooltip, state = options.state; + var view = chart.createView({ id: VIOLIN_VIEW_ID }); + violin({ + chart: view, + options: { + xField: X_FIELD$2, + yField: VIOLIN_Y_FIELD, + seriesField: seriesField ? seriesField : X_FIELD$2, + sizeField: VIOLIN_SIZE_FIELD, + tooltip: __assign$r({ fields: TOOLTIP_FIELDS }, tooltip), + violin: { + style: violinStyle, + color: color, + shape: shape, + }, + state: state, + }, + }); + view.geometries[0].adjust(adjustCfg); + return params; +} +/** 箱线 */ +function boxView(params) { + var chart = params.chart, options = params.options; + var seriesField = options.seriesField, color = options.color, tooltip = options.tooltip, box = options.box; + // 如果配置 `box` 为 false ，不渲染内部箱线图 + if (box === false) + return params; + // 边缘线 + var minMaxView = chart.createView({ id: MIN_MAX_VIEW_ID }); + interval({ + chart: minMaxView, + options: { + xField: X_FIELD$2, + yField: MIN_MAX_FIELD, + seriesField: seriesField ? seriesField : X_FIELD$2, + tooltip: __assign$r({ fields: TOOLTIP_FIELDS }, tooltip), + state: typeof box === 'object' ? box.state : {}, + interval: { + color: color, + size: 1, + style: { + lineWidth: 0, + }, + }, + }, + }); + minMaxView.geometries[0].adjust(adjustCfg); + // 四分点位 + var quantileView = chart.createView({ id: QUANTILE_VIEW_ID }); + interval({ + chart: quantileView, + options: { + xField: X_FIELD$2, + yField: QUANTILE_FIELD, + seriesField: seriesField ? seriesField : X_FIELD$2, + tooltip: __assign$r({ fields: TOOLTIP_FIELDS }, tooltip), + state: typeof box === 'object' ? box.state : {}, + interval: { + color: color, + size: 8, + style: { + fillOpacity: 1, + }, + }, + }, + }); + quantileView.geometries[0].adjust(adjustCfg); + // 中位值 + var medianView = chart.createView({ id: MEDIAN_VIEW_ID }); + point({ + chart: medianView, + options: { + xField: X_FIELD$2, + yField: MEDIAN_FIELD, + seriesField: seriesField ? seriesField : X_FIELD$2, + tooltip: __assign$r({ fields: TOOLTIP_FIELDS }, tooltip), + state: typeof box === 'object' ? box.state : {}, + point: { + color: color, + size: 1, + style: { + fill: 'white', + lineWidth: 0, + }, + }, + }, + }); + medianView.geometries[0].adjust(adjustCfg); + // 关闭辅助 view 的轴 + quantileView.axis(false); + minMaxView.axis(false); + medianView.axis(false); + // 关闭辅助 view 的图例 + medianView.legend(false); + minMaxView.legend(false); + quantileView.legend(false); + return params; +} +/** + * meta 配置 + */ +function meta$9(params) { + var _a; + var chart = params.chart, options = params.options; + var meta = options.meta, xAxis = options.xAxis, yAxis = options.yAxis; + var baseMeta = {}; + var scales = deepAssign(baseMeta, meta, (_a = {}, + _a[X_FIELD$2] = __assign$r(__assign$r({ sync: true }, pick$1(xAxis, AXIS_META_CONFIG_KEYS)), { + // fix: dodge is not support linear attribute, please use category attribute! + // 强制 x 轴类型为分类类型 + type: 'cat' }), + _a[VIOLIN_Y_FIELD] = __assign$r({ sync: true }, pick$1(yAxis, AXIS_META_CONFIG_KEYS)), + _a[MIN_MAX_FIELD] = __assign$r({ sync: VIOLIN_Y_FIELD }, pick$1(yAxis, AXIS_META_CONFIG_KEYS)), + _a[QUANTILE_FIELD] = __assign$r({ sync: VIOLIN_Y_FIELD }, pick$1(yAxis, AXIS_META_CONFIG_KEYS)), + _a[MEDIAN_FIELD] = __assign$r({ sync: VIOLIN_Y_FIELD }, pick$1(yAxis, AXIS_META_CONFIG_KEYS)), + _a)); + chart.scale(scales); + return params; +} +/** + * axis 配置 + */ +function axis$b(params) { + var chart = params.chart, options = params.options; + var xAxis = options.xAxis, yAxis = options.yAxis; + var view = findViewById(chart, VIOLIN_VIEW_ID); + // 为 false 则是不显示轴 + if (xAxis === false) { + view.axis(X_FIELD$2, false); + } + else { + view.axis(X_FIELD$2, xAxis); + } + if (yAxis === false) { + view.axis(VIOLIN_Y_FIELD, false); + } + else { + view.axis(VIOLIN_Y_FIELD, yAxis); + } + chart.axis(false); + return params; +} +/** + * + * @param params + * @returns + */ +function legend$7(params) { + var chart = params.chart, options = params.options; + var legend = options.legend, seriesField = options.seriesField, shape = options.shape; + if (legend === false) { + chart.legend(false); + } + else { + var legendField_1 = seriesField ? seriesField : X_FIELD$2; + // fixme 暂不明为啥有描边 + var legendOptions = omit$1(legend, ['selected']); + if (!shape || !shape.startsWith('hollow')) { + if (!get$3(legendOptions, ['marker', 'style', 'lineWidth'])) { + set$5(legendOptions, ['marker', 'style', 'lineWidth'], 0); + } + } + chart.legend(legendField_1, legendOptions); + // 特殊的处理 fixme G2 层得解决这个问题 + if (get$3(legend, 'selected')) { + each$2(chart.views, function (view) { return view.legend(legendField_1, legend); }); + } + } + return params; +} +/** + * annotation, apply to violin view. + * @param params + * @returns + */ +function annotation(params) { + var chart = params.chart; + var violinView = findViewById(chart, VIOLIN_VIEW_ID); + annotation$2()(__assign$r(__assign$r({}, params), { chart: violinView })); + return params; +} +/** + * 动画 + * @param params + */ +function animation$3(params) { + var chart = params.chart, options = params.options; + var animation = options.animation; + // 所有的 Geometry 都使用同一动画（各个图形如有区别，自行覆盖） + each$2(chart.views, function (view) { + // 同时设置整个 view 动画选项 + if (typeof animation === 'boolean') { + view.animate(animation); + } + else { + view.animate(true); + } + each$2(view.geometries, function (g) { + g.animate(animation); + }); + }); + return params; +} +/** + * 小提琴图适配器 + * @param params + */ +function adaptor$g(params) { + return flow(theme$2, data, violinView, boxView, meta$9, tooltip$8, axis$b, legend$7, interaction$6, annotation, animation$3)(params); +} + +var Violin$1 = /** @class */ (function (_super) { + __extends$e(Violin, _super); + function Violin() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'violin'; + return _this; + } + /** + * 获取 默认配置项 + * 供外部使用 + */ + Violin.getDefaultOptions = function () { + return DEFAULT_OPTIONS$i; + }; + /** + * @override + */ + Violin.prototype.changeData = function (data) { + this.updateOption({ data: data }); + this.chart.changeData(transformViolinData(this.options)); + }; + /** + * 获取 小提琴图 默认配置项 + */ + Violin.prototype.getDefaultOptions = function () { + return Violin.getDefaultOptions(); + }; + /** + * 获取 小提琴图 的适配器 + */ + Violin.prototype.getSchemaAdaptor = function () { + return adaptor$g; + }; + return Violin; +}(Plot)); + +/* + * interpolates between a set of colors uzing a bezier spline + * blend mode formulas taken from http://www.venture-ware.com/kevin/coding/lets-learn-math-photoshop-blend-modes/ + */ +var each$1 = function (f) { + return function (c0, c1) { + var out = []; + out[0] = f(c0[0], c1[0]); + out[1] = f(c0[1], c1[1]); + out[2] = f(c0[2], c1[2]); + return out; + }; +}; +/** + * 混合方法集合 + */ +var blendObject = { + normal: function (a) { return a; }, + multiply: function (a, b) { return (a * b) / 255; }, + screen: function (a, b) { return 255 * (1 - (1 - a / 255) * (1 - b / 255)); }, + overlay: function (a, b) { return (b < 128 ? (2 * a * b) / 255 : 255 * (1 - 2 * (1 - a / 255) * (1 - b / 255))); }, + darken: function (a, b) { return (a > b ? b : a); }, + lighten: function (a, b) { return (a > b ? a : b); }, + dodge: function (a, b) { + if (a === 255) + return 255; + a = (255 * (b / 255)) / (1 - a / 255); + return a > 255 ? 255 : a; + }, + burn: function (a, b) { + // 参考 w3c 的写法，考虑除数为 0 的情况 + if (b === 255) + return 255; + else if (a === 0) + return 0; + else + return 255 * (1 - Math.min(1, (1 - b / 255) / (a / 255))); + }, +}; +/** + * 获取混合方法 + */ +var innerBlend = function (mode) { + if (!blendObject[mode]) { + throw new Error('unknown blend mode ' + mode); + } + return blendObject[mode]; +}; +/** + * 混合颜色，并处理透明度情况 + * 参考：https://www.w3.org/TR/compositing/#blending + * @param c0 + * @param c1 + * @param mode 混合模式 + * @return rbga + */ +function blend(c0, c1, mode) { + if (mode === void 0) { mode = 'normal'; } + // blendRgbArr: 生成不考虑透明度的 blend color: [r, g, b] + var blendRgbArr = each$1(innerBlend(mode))(colorToArr(c0), colorToArr(c1)); + var _a = colorToArr(c0), r0 = _a[0], g0 = _a[1], b0 = _a[2], a0 = _a[3]; + var _b = colorToArr(c1), r1 = _b[0], g1 = _b[1], b1 = _b[2], a1 = _b[3]; + var a = Number((a0 + a1 * (1 - a0)).toFixed(2)); + var r = Math.round(((a0 * (1 - a1) * (r0 / 255) + a0 * a1 * (blendRgbArr[0] / 255) + (1 - a0) * a1 * (r1 / 255)) / a) * 255); + var g = Math.round(((a0 * (1 - a1) * (g0 / 255) + a0 * a1 * (blendRgbArr[1] / 255) + (1 - a0) * a1 * (g1 / 255)) / a) * 255); + var b = Math.round(((a0 * (1 - a1) * (b0 / 255) + a0 * a1 * (blendRgbArr[2] / 255) + (1 - a0) * a1 * (b1 / 255)) / a) * 255); + return "rgba(" + r + ", " + g + ", " + b + ", " + a + ")"; +} +/** + * 统一颜色输入的格式 [r, g, b, a] + * 参考：https://www.w3.org/TR/compositing/#blending + * @param c color + * @return [r, g, b, a] + */ +function colorToArr(c) { + var color = c.replace('/s+/g', ''); // 去除所有空格 + var rgbaArr; + // 'red' -> [r, g, b, 1] + if (typeof color === 'string' && !color.startsWith('rgba') && !color.startsWith('#')) { + return (rgbaArr = colorUtil.rgb2arr(colorUtil.toRGB(color)).concat([1])); + } + // rgba(255, 200, 125, 0.5) -> [r, g, b, a] + if (color.startsWith('rgba')) + rgbaArr = color.replace('rgba(', '').replace(')', '').split(','); + // '#fff000' -> [r, g, b, 1] + if (color.startsWith('#')) + rgbaArr = colorUtil.rgb2arr(color).concat([1]); // 如果是 16 进制（6 位数），默认透明度 1 + // [r, g, b, a] 前三位取整 + return rgbaArr.map(function (item, index) { return (index === 3 ? Number(item) : item | 0); }); +} + +var fmin = {exports: {}}; + +(function (module, exports) { +(function (global, factory) { + factory(exports) ; +}(commonjsGlobal, function (exports) { + /** finds the zeros of a function, given two starting points (which must + * have opposite signs */ + function bisect(f, a, b, parameters) { + parameters = parameters || {}; + var maxIterations = parameters.maxIterations || 100, + tolerance = parameters.tolerance || 1e-10, + fA = f(a), + fB = f(b), + delta = b - a; + + if (fA * fB > 0) { + throw "Initial bisect points must have opposite signs"; + } + + if (fA === 0) return a; + if (fB === 0) return b; + + for (var i = 0; i < maxIterations; ++i) { + delta /= 2; + var mid = a + delta, + fMid = f(mid); + + if (fMid * fA >= 0) { + a = mid; + } + + if ((Math.abs(delta) < tolerance) || (fMid === 0)) { + return mid; + } + } + return a + delta; + } + + // need some basic operations on vectors, rather than adding a dependency, + // just define here + function zeros(x) { var r = new Array(x); for (var i = 0; i < x; ++i) { r[i] = 0; } return r; } + function zerosM(x,y) { return zeros(x).map(function() { return zeros(y); }); } + + function dot(a, b) { + var ret = 0; + for (var i = 0; i < a.length; ++i) { + ret += a[i] * b[i]; + } + return ret; + } + + function norm2(a) { + return Math.sqrt(dot(a, a)); + } + + function scale(ret, value, c) { + for (var i = 0; i < value.length; ++i) { + ret[i] = value[i] * c; + } + } + + function weightedSum(ret, w1, v1, w2, v2) { + for (var j = 0; j < ret.length; ++j) { + ret[j] = w1 * v1[j] + w2 * v2[j]; + } + } + + /** minimizes a function using the downhill simplex method */ + function nelderMead(f, x0, parameters) { + parameters = parameters || {}; + + var maxIterations = parameters.maxIterations || x0.length * 200, + nonZeroDelta = parameters.nonZeroDelta || 1.05, + zeroDelta = parameters.zeroDelta || 0.001, + minErrorDelta = parameters.minErrorDelta || 1e-6, + minTolerance = parameters.minErrorDelta || 1e-5, + rho = (parameters.rho !== undefined) ? parameters.rho : 1, + chi = (parameters.chi !== undefined) ? parameters.chi : 2, + psi = (parameters.psi !== undefined) ? parameters.psi : -0.5, + sigma = (parameters.sigma !== undefined) ? parameters.sigma : 0.5, + maxDiff; + + // initialize simplex. + var N = x0.length, + simplex = new Array(N + 1); + simplex[0] = x0; + simplex[0].fx = f(x0); + simplex[0].id = 0; + for (var i = 0; i < N; ++i) { + var point = x0.slice(); + point[i] = point[i] ? point[i] * nonZeroDelta : zeroDelta; + simplex[i+1] = point; + simplex[i+1].fx = f(point); + simplex[i+1].id = i+1; + } + + function updateSimplex(value) { + for (var i = 0; i < value.length; i++) { + simplex[N][i] = value[i]; + } + simplex[N].fx = value.fx; + } + + var sortOrder = function(a, b) { return a.fx - b.fx; }; + + var centroid = x0.slice(), + reflected = x0.slice(), + contracted = x0.slice(), + expanded = x0.slice(); + + for (var iteration = 0; iteration < maxIterations; ++iteration) { + simplex.sort(sortOrder); + + if (parameters.history) { + // copy the simplex (since later iterations will mutate) and + // sort it to have a consistent order between iterations + var sortedSimplex = simplex.map(function (x) { + var state = x.slice(); + state.fx = x.fx; + state.id = x.id; + return state; + }); + sortedSimplex.sort(function(a,b) { return a.id - b.id; }); + + parameters.history.push({x: simplex[0].slice(), + fx: simplex[0].fx, + simplex: sortedSimplex}); + } + + maxDiff = 0; + for (i = 0; i < N; ++i) { + maxDiff = Math.max(maxDiff, Math.abs(simplex[0][i] - simplex[1][i])); + } + + if ((Math.abs(simplex[0].fx - simplex[N].fx) < minErrorDelta) && + (maxDiff < minTolerance)) { + break; + } + + // compute the centroid of all but the worst point in the simplex + for (i = 0; i < N; ++i) { + centroid[i] = 0; + for (var j = 0; j < N; ++j) { + centroid[i] += simplex[j][i]; + } + centroid[i] /= N; + } + + // reflect the worst point past the centroid and compute loss at reflected + // point + var worst = simplex[N]; + weightedSum(reflected, 1+rho, centroid, -rho, worst); + reflected.fx = f(reflected); + + // if the reflected point is the best seen, then possibly expand + if (reflected.fx < simplex[0].fx) { + weightedSum(expanded, 1+chi, centroid, -chi, worst); + expanded.fx = f(expanded); + if (expanded.fx < reflected.fx) { + updateSimplex(expanded); + } else { + updateSimplex(reflected); + } + } + + // if the reflected point is worse than the second worst, we need to + // contract + else if (reflected.fx >= simplex[N-1].fx) { + var shouldReduce = false; + + if (reflected.fx > worst.fx) { + // do an inside contraction + weightedSum(contracted, 1+psi, centroid, -psi, worst); + contracted.fx = f(contracted); + if (contracted.fx < worst.fx) { + updateSimplex(contracted); + } else { + shouldReduce = true; + } + } else { + // do an outside contraction + weightedSum(contracted, 1-psi * rho, centroid, psi*rho, worst); + contracted.fx = f(contracted); + if (contracted.fx < reflected.fx) { + updateSimplex(contracted); + } else { + shouldReduce = true; + } + } + + if (shouldReduce) { + // if we don't contract here, we're done + if (sigma >= 1) break; + + // do a reduction + for (i = 1; i < simplex.length; ++i) { + weightedSum(simplex[i], 1 - sigma, simplex[0], sigma, simplex[i]); + simplex[i].fx = f(simplex[i]); + } + } + } else { + updateSimplex(reflected); + } + } + + simplex.sort(sortOrder); + return {fx : simplex[0].fx, + x : simplex[0]}; + } + + /// searches along line 'pk' for a point that satifies the wolfe conditions + /// See 'Numerical Optimization' by Nocedal and Wright p59-60 + /// f : objective function + /// pk : search direction + /// current: object containing current gradient/loss + /// next: output: contains next gradient/loss + /// returns a: step size taken + function wolfeLineSearch(f, pk, current, next, a, c1, c2) { + var phi0 = current.fx, phiPrime0 = dot(current.fxprime, pk), + phi = phi0, phi_old = phi0, + phiPrime = phiPrime0, + a0 = 0; + + a = a || 1; + c1 = c1 || 1e-6; + c2 = c2 || 0.1; + + function zoom(a_lo, a_high, phi_lo) { + for (var iteration = 0; iteration < 16; ++iteration) { + a = (a_lo + a_high)/2; + weightedSum(next.x, 1.0, current.x, a, pk); + phi = next.fx = f(next.x, next.fxprime); + phiPrime = dot(next.fxprime, pk); + + if ((phi > (phi0 + c1 * a * phiPrime0)) || + (phi >= phi_lo)) { + a_high = a; + + } else { + if (Math.abs(phiPrime) <= -c2 * phiPrime0) { + return a; + } + + if (phiPrime * (a_high - a_lo) >=0) { + a_high = a_lo; + } + + a_lo = a; + phi_lo = phi; + } + } + + return 0; + } + + for (var iteration = 0; iteration < 10; ++iteration) { + weightedSum(next.x, 1.0, current.x, a, pk); + phi = next.fx = f(next.x, next.fxprime); + phiPrime = dot(next.fxprime, pk); + if ((phi > (phi0 + c1 * a * phiPrime0)) || + (iteration && (phi >= phi_old))) { + return zoom(a0, a, phi_old); + } + + if (Math.abs(phiPrime) <= -c2 * phiPrime0) { + return a; + } + + if (phiPrime >= 0 ) { + return zoom(a, a0, phi); + } + + phi_old = phi; + a0 = a; + a *= 2; + } + + return a; + } + + function conjugateGradient(f, initial, params) { + // allocate all memory up front here, keep out of the loop for perfomance + // reasons + var current = {x: initial.slice(), fx: 0, fxprime: initial.slice()}, + next = {x: initial.slice(), fx: 0, fxprime: initial.slice()}, + yk = initial.slice(), + pk, temp, + a = 1, + maxIterations; + + params = params || {}; + maxIterations = params.maxIterations || initial.length * 20; + + current.fx = f(current.x, current.fxprime); + pk = current.fxprime.slice(); + scale(pk, current.fxprime,-1); + + for (var i = 0; i < maxIterations; ++i) { + a = wolfeLineSearch(f, pk, current, next, a); + + // todo: history in wrong spot? + if (params.history) { + params.history.push({x: current.x.slice(), + fx: current.fx, + fxprime: current.fxprime.slice(), + alpha: a}); + } + + if (!a) { + // faiiled to find point that satifies wolfe conditions. + // reset direction for next iteration + scale(pk, current.fxprime, -1); + + } else { + // update direction using Polak–Ribiere CG method + weightedSum(yk, 1, next.fxprime, -1, current.fxprime); + + var delta_k = dot(current.fxprime, current.fxprime), + beta_k = Math.max(0, dot(yk, next.fxprime) / delta_k); + + weightedSum(pk, beta_k, pk, -1, next.fxprime); + + temp = current; + current = next; + next = temp; + } + + if (norm2(current.fxprime) <= 1e-5) { + break; + } + } + + if (params.history) { + params.history.push({x: current.x.slice(), + fx: current.fx, + fxprime: current.fxprime.slice(), + alpha: a}); + } + + return current; + } + + function gradientDescent(f, initial, params) { + params = params || {}; + var maxIterations = params.maxIterations || initial.length * 100, + learnRate = params.learnRate || 0.001, + current = {x: initial.slice(), fx: 0, fxprime: initial.slice()}; + + for (var i = 0; i < maxIterations; ++i) { + current.fx = f(current.x, current.fxprime); + if (params.history) { + params.history.push({x: current.x.slice(), + fx: current.fx, + fxprime: current.fxprime.slice()}); + } + + weightedSum(current.x, 1, current.x, -learnRate, current.fxprime); + if (norm2(current.fxprime) <= 1e-5) { + break; + } + } + + return current; + } + + function gradientDescentLineSearch(f, initial, params) { + params = params || {}; + var current = {x: initial.slice(), fx: 0, fxprime: initial.slice()}, + next = {x: initial.slice(), fx: 0, fxprime: initial.slice()}, + maxIterations = params.maxIterations || initial.length * 100, + learnRate = params.learnRate || 1, + pk = initial.slice(), + c1 = params.c1 || 1e-3, + c2 = params.c2 || 0.1, + temp, + functionCalls = []; + + if (params.history) { + // wrap the function call to track linesearch samples + var inner = f; + f = function(x, fxprime) { + functionCalls.push(x.slice()); + return inner(x, fxprime); + }; + } + + current.fx = f(current.x, current.fxprime); + for (var i = 0; i < maxIterations; ++i) { + scale(pk, current.fxprime, -1); + learnRate = wolfeLineSearch(f, pk, current, next, learnRate, c1, c2); + + if (params.history) { + params.history.push({x: current.x.slice(), + fx: current.fx, + fxprime: current.fxprime.slice(), + functionCalls: functionCalls, + learnRate: learnRate, + alpha: learnRate}); + functionCalls = []; + } + + + temp = current; + current = next; + next = temp; + + if ((learnRate === 0) || (norm2(current.fxprime) < 1e-5)) break; + } + + return current; + } + + exports.bisect = bisect; + exports.nelderMead = nelderMead; + exports.conjugateGradient = conjugateGradient; + exports.gradientDescent = gradientDescent; + exports.gradientDescentLineSearch = gradientDescentLineSearch; + exports.zeros = zeros; + exports.zerosM = zerosM; + exports.norm2 = norm2; + exports.weightedSum = weightedSum; + exports.scale = scale; + +})); +}(fmin, fmin.exports)); + +var SMALL$1 = 1e-10; +/** Returns the intersection area of a bunch of circles (where each circle + is an object having an x,y and radius property) */ +function intersectionArea(circles, stats) { + // get all the intersection points of the circles + var intersectionPoints = getIntersectionPoints(circles); + // filter out points that aren't included in all the circles + var innerPoints = intersectionPoints.filter(function (p) { + return containedInCircles(p, circles); + }); + var arcArea = 0, polygonArea = 0, i; + var arcs = []; + // if we have intersection points that are within all the circles, + // then figure out the area contained by them + if (innerPoints.length > 1) { + // sort the points by angle from the center of the polygon, which lets + // us just iterate over points to get the edges + var center = getCenter(innerPoints); + for (i = 0; i < innerPoints.length; ++i) { + var p = innerPoints[i]; + p.angle = Math.atan2(p.x - center.x, p.y - center.y); + } + innerPoints.sort(function (a, b) { + return b.angle - a.angle; + }); + // iterate over all points, get arc between the points + // and update the areas + var p2 = innerPoints[innerPoints.length - 1]; + for (i = 0; i < innerPoints.length; ++i) { + var p1 = innerPoints[i]; + // polygon area updates easily ... + polygonArea += (p2.x + p1.x) * (p1.y - p2.y); + // updating the arc area is a little more involved + var midPoint = { x: (p1.x + p2.x) / 2, y: (p1.y + p2.y) / 2 }; + var arc = null; + for (var j = 0; j < p1.parentIndex.length; ++j) { + if (p2.parentIndex.indexOf(p1.parentIndex[j]) > -1) { + // figure out the angle halfway between the two points + // on the current circle + var circle = circles[p1.parentIndex[j]], a1 = Math.atan2(p1.x - circle.x, p1.y - circle.y), a2 = Math.atan2(p2.x - circle.x, p2.y - circle.y); + var angleDiff = a2 - a1; + if (angleDiff < 0) { + angleDiff += 2 * Math.PI; + } + // and use that angle to figure out the width of the + // arc + var a = a2 - angleDiff / 2; + var width = distance$4(midPoint, { + x: circle.x + circle.radius * Math.sin(a), + y: circle.y + circle.radius * Math.cos(a), + }); + // clamp the width to the largest is can actually be + // (sometimes slightly overflows because of FP errors) + if (width > circle.radius * 2) { + width = circle.radius * 2; + } + // pick the circle whose arc has the smallest width + if (arc === null || arc.width > width) { + arc = { circle: circle, width: width, p1: p1, p2: p2 }; + } + } + } + if (arc !== null) { + arcs.push(arc); + arcArea += circleArea(arc.circle.radius, arc.width); + p2 = p1; + } + } + } + else { + // no intersection points, is either disjoint - or is completely + // overlapped. figure out which by examining the smallest circle + var smallest = circles[0]; + for (i = 1; i < circles.length; ++i) { + if (circles[i].radius < smallest.radius) { + smallest = circles[i]; + } + } + // make sure the smallest circle is completely contained in all + // the other circles + var disjoint = false; + for (i = 0; i < circles.length; ++i) { + if (distance$4(circles[i], smallest) > Math.abs(smallest.radius - circles[i].radius)) { + disjoint = true; + break; + } + } + if (disjoint) { + arcArea = polygonArea = 0; + } + else { + arcArea = smallest.radius * smallest.radius * Math.PI; + arcs.push({ + circle: smallest, + p1: { x: smallest.x, y: smallest.y + smallest.radius }, + p2: { x: smallest.x - SMALL$1, y: smallest.y + smallest.radius }, + width: smallest.radius * 2, + }); + } + } + polygonArea /= 2; + if (stats) { + stats.area = arcArea + polygonArea; + stats.arcArea = arcArea; + stats.polygonArea = polygonArea; + stats.arcs = arcs; + stats.innerPoints = innerPoints; + stats.intersectionPoints = intersectionPoints; + } + return arcArea + polygonArea; +} +/** returns whether a point is contained by all of a list of circles */ +function containedInCircles(point, circles) { + for (var i = 0; i < circles.length; ++i) { + if (distance$4(point, circles[i]) > circles[i].radius + SMALL$1) { + return false; + } + } + return true; +} +/** Gets all intersection points between a bunch of circles */ +function getIntersectionPoints(circles) { + var ret = []; + for (var i = 0; i < circles.length; ++i) { + for (var j = i + 1; j < circles.length; ++j) { + var intersect = circleCircleIntersection(circles[i], circles[j]); + for (var k = 0; k < intersect.length; ++k) { + var p = intersect[k]; + p.parentIndex = [i, j]; + ret.push(p); + } + } + } + return ret; +} +/** Circular segment area calculation. See http://mathworld.wolfram.com/CircularSegment.html */ +function circleArea(r, width) { + return r * r * Math.acos(1 - width / r) - (r - width) * Math.sqrt(width * (2 * r - width)); +} +/** euclidean distance between two points */ +function distance$4(p1, p2) { + return Math.sqrt((p1.x - p2.x) * (p1.x - p2.x) + (p1.y - p2.y) * (p1.y - p2.y)); +} +/** Returns the overlap area of two circles of radius r1 and r2 - that +have their centers separated by distance d. Simpler faster +circle intersection for only two circles */ +function circleOverlap(r1, r2, d) { + // no overlap + if (d >= r1 + r2) { + return 0; + } + // completely overlapped + if (d <= Math.abs(r1 - r2)) { + return Math.PI * Math.min(r1, r2) * Math.min(r1, r2); + } + var w1 = r1 - (d * d - r2 * r2 + r1 * r1) / (2 * d), w2 = r2 - (d * d - r1 * r1 + r2 * r2) / (2 * d); + return circleArea(r1, w1) + circleArea(r2, w2); +} +/** Given two circles (containing a x/y/radius attributes), +returns the intersecting points if possible. +note: doesn't handle cases where there are infinitely many +intersection points (circles are equivalent):, or only one intersection point*/ +function circleCircleIntersection(p1, p2) { + var d = distance$4(p1, p2), r1 = p1.radius, r2 = p2.radius; + // if to far away, or self contained - can't be done + if (d >= r1 + r2 || d <= Math.abs(r1 - r2)) { + return []; + } + var a = (r1 * r1 - r2 * r2 + d * d) / (2 * d), h = Math.sqrt(r1 * r1 - a * a), x0 = p1.x + (a * (p2.x - p1.x)) / d, y0 = p1.y + (a * (p2.y - p1.y)) / d, rx = -(p2.y - p1.y) * (h / d), ry = -(p2.x - p1.x) * (h / d); + return [ + { x: x0 + rx, y: y0 - ry }, + { x: x0 - rx, y: y0 + ry }, + ]; +} +/** Returns the center of a bunch of points */ +function getCenter(points) { + var center = { x: 0, y: 0 }; + for (var i = 0; i < points.length; ++i) { + center.x += points[i].x; + center.y += points[i].y; + } + center.x /= points.length; + center.y /= points.length; + return center; +} + +/** given a list of set objects, and their corresponding overlaps. +updates the (x, y, radius) attribute on each set such that their positions +roughly correspond to the desired overlaps */ +function venn(areas, parameters) { + parameters = parameters || {}; + parameters.maxIterations = parameters.maxIterations || 500; + var initialLayout = parameters.initialLayout || bestInitialLayout; + var loss = parameters.lossFunction || lossFunction; + // add in missing pairwise areas as having 0 size + areas = addMissingAreas(areas); + // initial layout is done greedily + var circles = initialLayout(areas, parameters); + // transform x/y coordinates to a vector to optimize + var initial = [], setids = []; + var setid; + for (setid in circles) { + // eslint-disable-next-line + if (circles.hasOwnProperty(setid)) { + initial.push(circles[setid].x); + initial.push(circles[setid].y); + setids.push(setid); + } + } + // optimize initial layout from our loss function + var solution = fmin.exports.nelderMead(function (values) { + var current = {}; + for (var i = 0; i < setids.length; ++i) { + var setid_1 = setids[i]; + current[setid_1] = { + x: values[2 * i], + y: values[2 * i + 1], + radius: circles[setid_1].radius, + }; + } + return loss(current, areas); + }, initial, parameters); + // transform solution vector back to x/y points + var positions = solution.x; + for (var i = 0; i < setids.length; ++i) { + setid = setids[i]; + circles[setid].x = positions[2 * i]; + circles[setid].y = positions[2 * i + 1]; + } + return circles; +} +var SMALL = 1e-10; +/** Returns the distance necessary for two circles of radius r1 + r2 to +have the overlap area 'overlap' */ +function distanceFromIntersectArea(r1, r2, overlap) { + // handle complete overlapped circles + if (Math.min(r1, r2) * Math.min(r1, r2) * Math.PI <= overlap + SMALL) { + return Math.abs(r1 - r2); + } + return fmin.exports.bisect(function (distance) { + return circleOverlap(r1, r2, distance) - overlap; + }, 0, r1 + r2); +} +/** Missing pair-wise intersection area data can cause problems: + treating as an unknown means that sets will be laid out overlapping, + which isn't what people expect. To reflect that we want disjoint sets + here, set the overlap to 0 for all missing pairwise set intersections */ +function addMissingAreas(areas) { + areas = areas.slice(); + // two circle intersections that aren't defined + var ids = [], pairs = {}; + var i, j, a, b; + for (i = 0; i < areas.length; ++i) { + var area = areas[i]; + if (area.sets.length == 1) { + ids.push(area.sets[0]); + } + else if (area.sets.length == 2) { + a = area.sets[0]; + b = area.sets[1]; + // @ts-ignore + pairs[[a, b]] = true; + // @ts-ignore + pairs[[b, a]] = true; + } + } + ids.sort(function (a, b) { + return a > b ? 1 : -1; + }); + for (i = 0; i < ids.length; ++i) { + a = ids[i]; + for (j = i + 1; j < ids.length; ++j) { + b = ids[j]; + // @ts-ignore + if (!([a, b] in pairs)) { + areas.push({ sets: [a, b], size: 0 }); + } + } + } + return areas; +} +/// Returns two matrices, one of the euclidean distances between the sets +/// and the other indicating if there are subset or disjoint set relationships +function getDistanceMatrices(areas, sets, setids) { + // initialize an empty distance matrix between all the points + var distances = fmin.exports.zerosM(sets.length, sets.length), constraints = fmin.exports.zerosM(sets.length, sets.length); + // compute required distances between all the sets such that + // the areas match + areas + .filter(function (x) { + return x.sets.length == 2; + }) + .map(function (current) { + var left = setids[current.sets[0]], right = setids[current.sets[1]], r1 = Math.sqrt(sets[left].size / Math.PI), r2 = Math.sqrt(sets[right].size / Math.PI), distance = distanceFromIntersectArea(r1, r2, current.size); + distances[left][right] = distances[right][left] = distance; + // also update constraints to indicate if its a subset or disjoint + // relationship + var c = 0; + if (current.size + 1e-10 >= Math.min(sets[left].size, sets[right].size)) { + c = 1; + } + else if (current.size <= 1e-10) { + c = -1; + } + constraints[left][right] = constraints[right][left] = c; + }); + return { distances: distances, constraints: constraints }; +} +/// computes the gradient and loss simulatenously for our constrained MDS optimizer +function constrainedMDSGradient(x, fxprime, distances, constraints) { + var loss = 0, i; + for (i = 0; i < fxprime.length; ++i) { + fxprime[i] = 0; + } + for (i = 0; i < distances.length; ++i) { + var xi = x[2 * i], yi = x[2 * i + 1]; + for (var j = i + 1; j < distances.length; ++j) { + var xj = x[2 * j], yj = x[2 * j + 1], dij = distances[i][j], constraint = constraints[i][j]; + var squaredDistance = (xj - xi) * (xj - xi) + (yj - yi) * (yj - yi), distance_1 = Math.sqrt(squaredDistance), delta = squaredDistance - dij * dij; + if ((constraint > 0 && distance_1 <= dij) || (constraint < 0 && distance_1 >= dij)) { + continue; + } + loss += 2 * delta * delta; + fxprime[2 * i] += 4 * delta * (xi - xj); + fxprime[2 * i + 1] += 4 * delta * (yi - yj); + fxprime[2 * j] += 4 * delta * (xj - xi); + fxprime[2 * j + 1] += 4 * delta * (yj - yi); + } + } + return loss; +} +/// takes the best working variant of either constrained MDS or greedy +function bestInitialLayout(areas, params) { + var initial = greedyLayout(areas, params); + var loss = params.lossFunction || lossFunction; + // greedylayout is sufficient for all 2/3 circle cases. try out + // constrained MDS for higher order problems, take its output + // if it outperforms. (greedy is aesthetically better on 2/3 circles + // since it axis aligns) + if (areas.length >= 8) { + var constrained = constrainedMDSLayout(areas, params), constrainedLoss = loss(constrained, areas), greedyLoss = loss(initial, areas); + if (constrainedLoss + 1e-8 < greedyLoss) { + initial = constrained; + } + } + return initial; +} +/// use the constrained MDS variant to generate an initial layout +function constrainedMDSLayout(areas, params) { + params = params || {}; + var restarts = params.restarts || 10; + // bidirectionally map sets to a rowid (so we can create a matrix) + var sets = [], setids = {}; + var i; + for (i = 0; i < areas.length; ++i) { + var area = areas[i]; + if (area.sets.length == 1) { + setids[area.sets[0]] = sets.length; + sets.push(area); + } + } + var matrices = getDistanceMatrices(areas, sets, setids); + var distances = matrices.distances; + var constraints = matrices.constraints; + // keep distances bounded, things get messed up otherwise. + // TODO: proper preconditioner? + var norm = fmin.exports.norm2(distances.map(fmin.exports.norm2)) / distances.length; + distances = distances.map(function (row) { + return row.map(function (value) { + return value / norm; + }); + }); + var obj = function (x, fxprime) { + return constrainedMDSGradient(x, fxprime, distances, constraints); + }; + var best, current; + for (i = 0; i < restarts; ++i) { + var initial = fmin.exports.zeros(distances.length * 2).map(Math.random); + current = fmin.exports.conjugateGradient(obj, initial, params); + if (!best || current.fx < best.fx) { + best = current; + } + } + var positions = best.x; + // translate rows back to (x,y,radius) coordinates + var circles = {}; + for (i = 0; i < sets.length; ++i) { + var set = sets[i]; + circles[set.sets[0]] = { + x: positions[2 * i] * norm, + y: positions[2 * i + 1] * norm, + radius: Math.sqrt(set.size / Math.PI), + }; + } + if (params.history) { + for (i = 0; i < params.history.length; ++i) { + fmin.exports.scale(params.history[i].x, norm); + } + } + return circles; +} +/** Lays out a Venn diagram greedily, going from most overlapped sets to +least overlapped, attempting to position each new set such that the +overlapping areas to already positioned sets are basically right */ +function greedyLayout(areas, params) { + var loss = params && params.lossFunction ? params.lossFunction : lossFunction; + // define a circle for each set + var circles = {}, setOverlaps = {}; + var set; + for (var i = 0; i < areas.length; ++i) { + var area = areas[i]; + if (area.sets.length == 1) { + set = area.sets[0]; + circles[set] = { + x: 1e10, + y: 1e10, + // rowid: circles.length, // fix to -> + rowid: Object.keys(circles).length, + size: area.size, + radius: Math.sqrt(area.size / Math.PI), + }; + setOverlaps[set] = []; + } + } + areas = areas.filter(function (a) { + return a.sets.length == 2; + }); + // map each set to a list of all the other sets that overlap it + for (var i = 0; i < areas.length; ++i) { + var current = areas[i]; + // eslint-disable-next-line + var weight = current.hasOwnProperty('weight') ? current.weight : 1.0; + var left = current.sets[0], right = current.sets[1]; + // completely overlapped circles shouldn't be positioned early here + if (current.size + SMALL >= Math.min(circles[left].size, circles[right].size)) { + weight = 0; + } + setOverlaps[left].push({ set: right, size: current.size, weight: weight }); + setOverlaps[right].push({ set: left, size: current.size, weight: weight }); + } + // get list of most overlapped sets + var mostOverlapped = []; + for (set in setOverlaps) { + // eslint-disable-next-line + if (setOverlaps.hasOwnProperty(set)) { + var size = 0; + for (var i = 0; i < setOverlaps[set].length; ++i) { + size += setOverlaps[set][i].size * setOverlaps[set][i].weight; + } + mostOverlapped.push({ set: set, size: size }); + } + } + // sort by size desc + function sortOrder(a, b) { + return b.size - a.size; + } + mostOverlapped.sort(sortOrder); + // keep track of what sets have been laid out + var positioned = {}; + function isPositioned(element) { + return element.set in positioned; + } + // adds a point to the output + function positionSet(point, index) { + circles[index].x = point.x; + circles[index].y = point.y; + positioned[index] = true; + } + // add most overlapped set at (0,0) + positionSet({ x: 0, y: 0 }, mostOverlapped[0].set); + // get distances between all points. TODO, necessary? + // answer: probably not + // var distances = venn.getDistanceMatrices(circles, areas).distances; + for (var i = 1; i < mostOverlapped.length; ++i) { + var setIndex = mostOverlapped[i].set, overlap = setOverlaps[setIndex].filter(isPositioned); + set = circles[setIndex]; + overlap.sort(sortOrder); + if (overlap.length === 0) { + // this shouldn't happen anymore with addMissingAreas + throw 'ERROR: missing pairwise overlap information'; + } + var points = []; + for (var j = 0; j < overlap.length; ++j) { + // get appropriate distance from most overlapped already added set + var p1 = circles[overlap[j].set], d1 = distanceFromIntersectArea(set.radius, p1.radius, overlap[j].size); + // sample positions at 90 degrees for maximum aesthetics + points.push({ x: p1.x + d1, y: p1.y }); + points.push({ x: p1.x - d1, y: p1.y }); + points.push({ y: p1.y + d1, x: p1.x }); + points.push({ y: p1.y - d1, x: p1.x }); + // if we have at least 2 overlaps, then figure out where the + // set should be positioned analytically and try those too + for (var k = j + 1; k < overlap.length; ++k) { + var p2 = circles[overlap[k].set], d2 = distanceFromIntersectArea(set.radius, p2.radius, overlap[k].size); + var extraPoints = circleCircleIntersection({ x: p1.x, y: p1.y, radius: d1 }, { x: p2.x, y: p2.y, radius: d2 }); + for (var l = 0; l < extraPoints.length; ++l) { + points.push(extraPoints[l]); + } + } + } + // we have some candidate positions for the set, examine loss + // at each position to figure out where to put it at + var bestLoss = 1e50, bestPoint = points[0]; + for (var j = 0; j < points.length; ++j) { + circles[setIndex].x = points[j].x; + circles[setIndex].y = points[j].y; + var localLoss = loss(circles, areas); + if (localLoss < bestLoss) { + bestLoss = localLoss; + bestPoint = points[j]; + } + } + positionSet(bestPoint, setIndex); + } + return circles; +} +/** Given a bunch of sets, and the desired overlaps between these sets - computes +the distance from the actual overlaps to the desired overlaps. Note that +this method ignores overlaps of more than 2 circles */ +function lossFunction(sets, overlaps) { + var output = 0; + function getCircles(indices) { + return indices.map(function (i) { + return sets[i]; + }); + } + for (var i = 0; i < overlaps.length; ++i) { + var area = overlaps[i]; + var overlap = void 0; + if (area.sets.length == 1) { + continue; + } + else if (area.sets.length == 2) { + var left = sets[area.sets[0]], right = sets[area.sets[1]]; + overlap = circleOverlap(left.radius, right.radius, distance$4(left, right)); + } + else { + overlap = intersectionArea(getCircles(area.sets)); + } + // eslint-disable-next-line + var weight = area.hasOwnProperty('weight') ? area.weight : 1.0; + output += weight * (overlap - area.size) * (overlap - area.size); + } + return output; +} +function getBoundingBox(circles) { + var minMax = function (d) { + var hi = Math.max.apply(null, circles.map(function (c) { + return c[d] + c.radius; + })), lo = Math.min.apply(null, circles.map(function (c) { + return c[d] - c.radius; + })); + return { max: hi, min: lo }; + }; + return { xRange: minMax('x'), yRange: minMax('y') }; +} +/** Scales a solution from venn.venn or venn.greedyLayout such that it fits in +a rectangle of width/height - with padding around the borders. also +centers the diagram in the available space at the same time */ +function scaleSolution(solution, width, height, padding) { + var circles = [], setids = []; + for (var setid in solution) { + // eslint-disable-next-line + if (solution.hasOwnProperty(setid)) { + setids.push(setid); + circles.push(solution[setid]); + } + } + width -= 2 * padding; + height -= 2 * padding; + var bounds = getBoundingBox(circles), xRange = bounds.xRange, yRange = bounds.yRange; + if (xRange.max == xRange.min || yRange.max == yRange.min) { + console.log('not scaling solution: zero size detected'); + return solution; + } + var xScaling = width / (xRange.max - xRange.min), yScaling = height / (yRange.max - yRange.min), scaling = Math.min(yScaling, xScaling), + // while we're at it, center the diagram too + xOffset = (width - (xRange.max - xRange.min) * scaling) / 2, yOffset = (height - (yRange.max - yRange.min) * scaling) / 2; + var scaled = {}; + for (var i = 0; i < circles.length; ++i) { + var circle = circles[i]; + scaled[setids[i]] = { + radius: scaling * circle.radius, + x: padding + xOffset + (circle.x - xRange.min) * scaling, + y: padding + yOffset + (circle.y - yRange.min) * scaling, + }; + } + return scaled; +} + +function circleMargin(current, interior, exterior) { + var margin = interior[0].radius - distance$4(interior[0], current), i, m; + for (i = 1; i < interior.length; ++i) { + m = interior[i].radius - distance$4(interior[i], current); + if (m <= margin) { + margin = m; + } + } + for (i = 0; i < exterior.length; ++i) { + m = distance$4(exterior[i], current) - exterior[i].radius; + if (m <= margin) { + margin = m; + } + } + return margin; +} +// compute the center of some circles by maximizing the margin of +// the center point relative to the circles (interior) after subtracting +// nearby circles (exterior) +function computeTextCentre(interior, exterior) { + // get an initial estimate by sampling around the interior circles + // and taking the point with the biggest margin + var points = []; + var i; + for (i = 0; i < interior.length; ++i) { + var c = interior[i]; + points.push({ x: c.x, y: c.y }); + points.push({ x: c.x + c.radius / 2, y: c.y }); + points.push({ x: c.x - c.radius / 2, y: c.y }); + points.push({ x: c.x, y: c.y + c.radius / 2 }); + points.push({ x: c.x, y: c.y - c.radius / 2 }); + } + var initial = points[0], margin = circleMargin(points[0], interior, exterior); + for (i = 1; i < points.length; ++i) { + var m = circleMargin(points[i], interior, exterior); + if (m >= margin) { + initial = points[i]; + margin = m; + } + } + // maximize the margin numerically + var solution = fmin.exports.nelderMead(function (p) { + return -1 * circleMargin({ x: p[0], y: p[1] }, interior, exterior); + }, [initial.x, initial.y], { maxIterations: 500, minErrorDelta: 1e-10 }).x; + var ret = { x: solution[0], y: solution[1] }; + // check solution, fallback as needed (happens if fully overlapped + // etc) + var valid = true; + for (i = 0; i < interior.length; ++i) { + if (distance$4(ret, interior[i]) > interior[i].radius) { + valid = false; + break; + } + } + for (i = 0; i < exterior.length; ++i) { + if (distance$4(ret, exterior[i]) < exterior[i].radius) { + valid = false; + break; + } + } + if (!valid) { + if (interior.length == 1) { + ret = { x: interior[0].x, y: interior[0].y }; + } + else { + var areaStats = {}; + intersectionArea(interior, areaStats); + if (areaStats.arcs.length === 0) { + ret = { x: 0, y: -1000, disjoint: true }; + } + else if (areaStats.arcs.length == 1) { + ret = { x: areaStats.arcs[0].circle.x, y: areaStats.arcs[0].circle.y }; + } + else if (exterior.length) { + // try again without other circles + ret = computeTextCentre(interior, []); + } + else { + // take average of all the points in the intersection + // polygon. this should basically never happen + // and has some issues: + // https://github.com/benfred/venn.js/issues/48#issuecomment-146069777 + ret = getCenter(areaStats.arcs.map(function (a) { + return a.p1; + })); + } + } + } + return ret; +} +// given a dictionary of {setid : circle}, returns +// a dictionary of setid to list of circles that completely overlap it +function getOverlappingCircles(circles) { + var ret = {}, circleids = []; + for (var circleid in circles) { + circleids.push(circleid); + ret[circleid] = []; + } + for (var i = 0; i < circleids.length; i++) { + var a = circles[circleids[i]]; + for (var j = i + 1; j < circleids.length; ++j) { + var b = circles[circleids[j]], d = distance$4(a, b); + if (d + b.radius <= a.radius + 1e-10) { + ret[circleids[j]].push(circleids[i]); + } + else if (d + a.radius <= b.radius + 1e-10) { + ret[circleids[i]].push(circleids[j]); + } + } + } + return ret; +} +function computeTextCentres(circles, areas) { + var ret = {}, overlapped = getOverlappingCircles(circles); + for (var i = 0; i < areas.length; ++i) { + var area = areas[i].sets, areaids = {}, exclude = {}; + for (var j = 0; j < area.length; ++j) { + areaids[area[j]] = true; + var overlaps = overlapped[area[j]]; + // keep track of any circles that overlap this area, + // and don't consider for purposes of computing the text + // centre + for (var k = 0; k < overlaps.length; ++k) { + exclude[overlaps[k]] = true; + } + } + var interior = [], exterior = []; + for (var setid in circles) { + if (setid in areaids) { + interior.push(circles[setid]); + } + else if (!(setid in exclude)) { + exterior.push(circles[setid]); + } + } + var centre = computeTextCentre(interior, exterior); + ret[area] = centre; + if (centre.disjoint && areas[i].size > 0) { + console.log('WARNING: area ' + area + ' not represented on screen'); + } + } + return ret; +} +/** + * 根据圆心(x, y) 半径 r 返回圆的绘制 path + * @param x 圆心点 x + * @param y 圆心点 y + * @param r 圆的半径 + * @returns 圆的 path + */ +function circlePath(x, y, r) { + var ret = []; + // ret.push('\nM', x, y); + // ret.push('\nm', -r, 0); + // ret.push('\na', r, r, 0, 1, 0, r * 2, 0); + // ret.push('\na', r, r, 0, 1, 0, -r * 2, 0); + var x0 = x - r; + var y0 = y; + ret.push('M', x0, y0); + ret.push('A', r, r, 0, 1, 0, x0 + 2 * r, y0); + ret.push('A', r, r, 0, 1, 0, x0, y0); + return ret.join(' '); +} +/** returns a svg path of the intersection area of a bunch of circles */ +function intersectionAreaPath(circles) { + var stats = {}; + intersectionArea(circles, stats); + var arcs = stats.arcs; + if (arcs.length === 0) { + return 'M 0 0'; + } + else if (arcs.length == 1) { + var circle = arcs[0].circle; + return circlePath(circle.x, circle.y, circle.radius); + } + else { + // draw path around arcs + var ret = ['\nM', arcs[0].p2.x, arcs[0].p2.y]; + for (var i = 0; i < arcs.length; ++i) { + var arc = arcs[i], r = arc.circle.radius, wide = arc.width > r; + ret.push('\nA', r, r, 0, wide ? 1 : 0, 1, arc.p1.x, arc.p1.y); + } + return ret.join(' '); + } +} + +// 一些字段常量定义，需要在文档初告知用户 +var ID_FIELD = 'id'; +var PATH_FIELD = 'path'; +/** + * 韦恩图 默认配置项 + */ +var DEFAULT_OPTIONS$h = { + appendPadding: [10, 0, 20, 0], + blendMode: 'multiply', + tooltip: { + showTitle: false, + showMarkers: false, + fields: ['id', 'size'], + formatter: function (datum) { + return { name: datum.id, value: datum.size }; + }, + }, + legend: { position: 'top-left' }, + label: { + offsetY: 6, + style: { + textAlign: 'center', + fill: '#fff', + }, + }, + // 默认不开启 图例筛选交互 + interactions: [ + { type: 'legend-filter', enable: false }, + // hover 激活的时候，元素的层级展示不太好 先移除该交互 + { type: 'legend-highlight', enable: false }, + { type: 'legend-active', enable: false }, + ], +}; + +/** + * 获取 颜色映射 + * @usage colorMap.get(id) => color + * + * @returns Map + */ +var getColorMap = memoize$2(function (colorPalette, data, options) { + var blendMode = options.blendMode, setsField = options.setsField; + var colorMap = new Map(); + var colorPaletteLen = colorPalette.length; + data.forEach(function (d, idx) { + if (d[setsField].length === 1) { + colorMap.set(d[ID_FIELD], colorPalette[(idx + colorPaletteLen) % colorPaletteLen]); + } + else { + /** 一般都是可以获取到颜色的，如果不正确 就是输入了非法数据 */ + var colorArr = d[setsField].map(function (id) { return colorMap.get(id); }); + colorMap.set(d[ID_FIELD], colorArr.slice(1).reduce(function (a, b) { return blend(a, b, blendMode); }, colorArr[0])); + } + }); + return colorMap; +}, function () { + var params = []; + for (var _i = 0; _i < arguments.length; _i++) { + params[_i] = arguments[_i]; + } + return JSON.stringify(params); +}); +/** + * 给韦恩图数据进行布局 + * + * @param data + * @param width + * @param height + * @param padding + * @returns 韦恩图数据 + */ +function layoutVennData(options, width, height, padding) { + if (padding === void 0) { padding = 0; } + var data = options.data, setsField = options.setsField, sizeField = options.sizeField; + var vennData = data.map(function (d) { + var _a; + return (__assign$r(__assign$r({}, d), (_a = { sets: d[setsField] || [], size: d[sizeField] }, _a[PATH_FIELD] = '', _a[ID_FIELD] = '', _a))); + }); + // 1. 进行排序，避免图形元素遮挡 + vennData.sort(function (a, b) { return a.sets.length - b.sets.length; }); + // todo 2. 可以在这里处理下非法数据输入，避免直接 crash + var solution = venn(vennData); + var circles = scaleSolution(solution, width, height, padding); + var textCenters = computeTextCentres(circles, vennData); + vennData.forEach(function (row) { + var sets = row.sets; + var id = sets.join(','); + row[ID_FIELD] = id; + if (sets.length === 1) { + var circle = circles[id]; + row[PATH_FIELD] = circlePath(circle.x, circle.y, circle.radius); + mix(row, circle); + } + else { + var setCircles = sets.map(function (set) { return circles[set]; }); + var path = intersectionAreaPath(setCircles); + if (!/[zZ]$/.test(path)) { + path += ' Z'; + } + row[PATH_FIELD] = path; + var center = textCenters[id] || { x: 0, y: 0 }; + mix(row, center); + } + }); + return vennData; +} + +/** + * 获取填充属性 + * @param cfg 图形绘制数据 + */ +function getFillAttrs$2(cfg) { + // style.fill 优先级更高 + return deepAssign({}, cfg.defaultStyle, { fill: cfg.color }, cfg.style); +} +registerShape('schema', 'venn', { + draw: function (cfg, container) { + var data = cfg.data; + var segments = parsePathString$1(data[PATH_FIELD]); + var fillAttrs = getFillAttrs$2(cfg); + var group = container.addGroup({ name: 'venn-shape' }); + group.addShape('path', { + attrs: __assign$r(__assign$r({}, fillAttrs), { path: segments }), + name: 'venn-path', + }); + var _a = cfg.customInfo, offsetX = _a.offsetX, offsetY = _a.offsetY, label = _a.label; + if (label !== false) { + var formatter = get$3(label, 'formatter'); + var offsetX_1 = get$3(label, 'offsetX', 0); + var offsetY_1 = get$3(label, 'offsetY', 0); + group.addShape('text', { + attrs: __assign$r(__assign$r(__assign$r({}, label), get$3(label, 'style', { textAlign: 'center', fill: '#fff' })), { x: data.x + offsetX_1, y: data.y + offsetY_1, text: formatter ? formatter(data) : data.id + ": " + data.size }), + name: 'venn-label', + }); + } + var matrix = Util$1.transform(null, [['t', offsetX, offsetY]]); + group.setMatrix(matrix); + return group; + }, + getMarker: function (markerCfg) { + var color = markerCfg.color; + return { + symbol: 'circle', + style: { + lineWidth: 0, + stroke: color, + fill: color, + r: 4, + }, + }; + }, +}); + +/** 图例默认预留空间 */ +var LEGEND_SPACE = 40; +/** + * color options 转换 + */ +function transformColor(params, data) { + var chart = params.chart, options = params.options; + var color = options.color, setsField = options.setsField; + if (typeof color !== 'function') { + var colorPalette_1 = typeof color === 'string' ? [color] : color; + if (!isArray$n(colorPalette_1)) { + var _a = chart.getTheme(), colors10 = _a.colors10, colors20 = _a.colors20; + colorPalette_1 = data.filter(function (d) { return d[setsField].length === 1; }).length <= 10 ? colors10 : colors20; + } + var colorMap_1 = getColorMap(colorPalette_1, data, options); + return function (datum) { return colorMap_1.get(datum[ID_FIELD]) || colorPalette_1[0]; }; + } + return color; +} +/** + * 处理 padding + */ +function padding$1(params) { + var chart = params.chart, options = params.options; + var legend = options.legend, appendPadding = options.appendPadding, padding = options.padding; + // 处理 legend 的位置. 默认预留 40px, 业务上可以通过 appendPadding 增加 + var tempPadding = normalPadding(appendPadding); + if (legend !== false) { + tempPadding = getAdjustAppendPadding(appendPadding, get$3(legend, 'position'), LEGEND_SPACE); + } + chart.appendPadding = resolveAllPadding([tempPadding, padding]); + return params; +} +/** + * geometry 处理 + * @param params + */ +function geometry$g(params) { + var chart = params.chart, options = params.options; + var pointStyle = options.pointStyle, label = options.label, setsField = options.setsField, sizeField = options.sizeField; + // 获取容器大小 + var _a = normalPadding(chart.appendPadding), t = _a[0], r = _a[1], b = _a[2], l = _a[3]; + // 处理 legend 的位置. 默认预留 40px, 业务上可以通过 appendPadding 增加 + var customInfo = { offsetX: l, offsetY: t, label: label }; + // coordinateBBox + appendPadding = viewBBox, 不需要再计算 appendPadding 部分，因此直接使用 viewBBox + var _b = chart.viewBBox, width = _b.width, height = _b.height; + var vennData = layoutVennData(options, width - (r + l), height - (t + b), 0); + chart.data(vennData); + var ext = schema(deepAssign({}, params, { + options: { + xField: 'x', + yField: 'y', + sizeField: sizeField, + seriesField: ID_FIELD, + rawFields: [setsField, sizeField], + // 不使用 G2 的label，直接在自定义 shape 中实现 + label: false, + schema: { + shape: 'venn', + style: pointStyle, + color: transformColor(params, vennData), + }, + }, + })).ext; + var geometry = ext.geometry; + geometry.customInfo(customInfo); + return params; +} +/** + * legend 配置 + * @param params + */ +function legend$6(params) { + var chart = params.chart, options = params.options; + var legend = options.legend, sizeField = options.sizeField; + chart.legend(ID_FIELD, legend); + // 强制不开启 连续图例 + chart.legend(sizeField, false); + return params; +} +/** + * 默认关闭坐标轴 + * @param params + */ +function axis$a(params) { + var chart = params.chart; + chart.axis(false); + return params; +} +/** + * 图适配器 + * @param chart + * @param options + */ +function adaptor$f(params) { + // flow 的方式处理所有的配置到 G2 API + return flow(padding$1, theme$2, geometry$g, scale$3({}), legend$6, axis$a, tooltip$8, interaction$6, animation$5 + // ... 其他的 adaptor flow + )(params); +} + +/** + * 这个是一个图表开发的 模板代码！ + */ +var Venn$1 = /** @class */ (function (_super) { + __extends$e(Venn, _super); + function Venn() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'venn'; + return _this; + } + Venn.getDefaultOptions = function () { + return DEFAULT_OPTIONS$h; + }; + /** + * 获取 韦恩图 默认配置 + */ + Venn.prototype.getDefaultOptions = function () { + return Venn.getDefaultOptions(); + }; + /** + * 获取适配器 + */ + Venn.prototype.getSchemaAdaptor = function () { + return adaptor$f; + }; + /** + * 覆写父类的方法 + */ + Venn.prototype.triggerResize = function () { + if (!this.chart.destroyed) { + // 首先自适应容器的宽高 + this.chart.forceFit(); // g2 内部执行 changeSize，changeSize 中执行 render(true) + this.chart.clear(); + this.execAdaptor(); // 核心：宽高更新之后计算布局 + // 渲染 + this.chart.render(true); + } + }; + return Venn; +}(Plot)); + +var Y_FIELD$3 = '$$stock-range$$'; +var TREND_FIELD = 'trend'; +var TREND_UP = 'up'; +var TREND_DOWN = 'down'; +/** tooltip 配置 */ +var DEFAULT_TOOLTIP_OPTIONS = { + showMarkers: false, + showCrosshairs: true, + shared: true, + crosshairs: { + type: 'xy', + follow: true, + text: function (type, defaultContent, items) { + var textContent; + if (type === 'x') { + var item = items[0]; + textContent = item ? item.title : defaultContent; + } + else { + textContent = defaultContent; + } + return { + position: type === 'y' ? 'start' : 'end', + content: textContent, + style: { + fill: '#dfdfdf', + }, + }; + }, + // 自定义 crosshairs textBackground 样式 + textBackground: { + padding: [2, 4], + style: { + fill: '#666', + }, + }, + }, +}; +/** + * 散点图 默认配置项 + */ +var DEFAULT_OPTIONS$g = deepAssign({}, Plot.getDefaultOptions(), { + // 设置默认图表 tooltips + tooltip: DEFAULT_TOOLTIP_OPTIONS, + interactions: [{ type: 'tooltip' }], + legend: { + position: 'top-left', + }, + risingFill: '#ef5350', + fallingFill: '#26a69a', +}); + +/** + * @desc 股票图数据处理 + * @param data + * @param yField + */ +function getStockData(data, yField) { + return map$4(data, function (obj) { + if (isArray$n(yField)) { + var open_1 = yField[0], close_1 = yField[1], high = yField[2], low = yField[3]; + obj[TREND_FIELD] = obj[open_1] <= obj[close_1] ? TREND_UP : TREND_DOWN; + obj[Y_FIELD$3] = [obj[open_1], obj[close_1], obj[high], obj[low]]; + } + return obj; + }); +} + +/** + * 图表配置处理 + * @param params + */ +function geometry$f(params) { + var chart = params.chart, options = params.options; + var yField = options.yField; + var data = options.data, risingFill = options.risingFill, fallingFill = options.fallingFill, tooltip = options.tooltip, stockStyle = options.stockStyle; + chart.data(getStockData(data, yField)); + var tooltipOptions = tooltip; + if (tooltipOptions !== false) { + tooltipOptions = deepAssign({}, { fields: yField }, tooltipOptions); + } + schema(deepAssign({}, params, { + options: { + schema: { + shape: 'candle', + color: [risingFill, fallingFill], + style: stockStyle, + }, + yField: Y_FIELD$3, + seriesField: TREND_FIELD, + rawFields: yField, + tooltip: tooltipOptions, + }, + })); + return params; +} +/** + * meta 配置 + * @param params + */ +function meta$8(params) { + var _a, _b; + var chart = params.chart, options = params.options; + var meta = options.meta, xAxis = options.xAxis, yAxis = options.yAxis, xField = options.xField; + var baseMeta = (_a = {}, + _a[xField] = { + type: 'timeCat', + tickCount: 6, + }, + _a[TREND_FIELD] = { + values: [TREND_UP, TREND_DOWN], + }, + _a); + var scales = deepAssign(baseMeta, meta, (_b = {}, + _b[xField] = pick$1(xAxis, AXIS_META_CONFIG_KEYS), + _b[Y_FIELD$3] = pick$1(yAxis, AXIS_META_CONFIG_KEYS), + _b)); + chart.scale(scales); + return params; +} +/** + * axis 配置 + * @param params + */ +function axis$9(params) { + var chart = params.chart, options = params.options; + var xAxis = options.xAxis, yAxis = options.yAxis, xField = options.xField; + // 为 false 则是不显示轴 + if (xAxis === false) { + chart.axis(xField, false); + } + else { + chart.axis(xField, xAxis); + } + if (yAxis === false) { + chart.axis(Y_FIELD$3, false); + } + else { + chart.axis(Y_FIELD$3, yAxis); + } + return params; +} +/** + * tooltip 配置 + * @param params + */ +function tooltip$4(params) { + var chart = params.chart, options = params.options; + var tooltip = options.tooltip; + if (tooltip !== false) { + chart.tooltip(tooltip); + } + else { + chart.tooltip(false); + } + return params; +} +/** + * legend 配置 + * @param params + */ +function legend$5(params) { + var chart = params.chart, options = params.options; + var legend = options.legend; + if (legend) { + chart.legend(TREND_FIELD, legend); + } + else if (legend === false) { + chart.legend(false); + } + return params; +} +/** + * K线图适配器 + * @param chart + * @param options + */ +function adaptor$e(params) { + // flow 的方式处理所有的配置到 G2 API + flow(theme$2, geometry$f, meta$8, axis$9, tooltip$4, legend$5, interaction$6, animation$5, annotation$2(), slider$1)(params); +} + +var Stock$1 = /** @class */ (function (_super) { + __extends$e(Stock, _super); + function Stock() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'stock'; + return _this; + } + /** + * 获取 散点图 默认配置项 + * 供外部使用 + */ + Stock.getDefaultOptions = function () { + return DEFAULT_OPTIONS$g; + }; + /** + * 默认配置 + * g2/g2plot默 认 配 置 --> 图 表 默 认 配 置 --> 开 发 者 自 定 义 配 置 --> 最 终 绘 图 配 置 + */ + Stock.prototype.getDefaultOptions = function () { + return Stock.getDefaultOptions(); + }; + /** + * 获取 蜡烛图 的适配器 + */ + Stock.prototype.getSchemaAdaptor = function () { + return adaptor$e; + }; + /** + * @override + * @param data + */ + Stock.prototype.changeData = function (data) { + this.updateOption({ data: data }); + var yField = this.options.yField; + this.chart.changeData(getStockData(data, yField)); + }; + return Stock; +}(Plot)); + +var _a$1; +// 漏斗占比: data[n][yField] / data[0][yField] +var FUNNEL_PERCENT = '$$percentage$$'; +// 漏斗映射值 +var FUNNEL_MAPPING_VALUE = '$$mappingValue$$'; +// 漏斗转化率: data[n][yField] / data[n-1][yField]; +var FUNNEL_CONVERSATION = '$$conversion$$'; +// 漏斗单项占总体和的百分比，用于动态漏斗图计算高度： +// data[n][yField] / sum(data[0-n][yField]) +var FUNNEL_TOTAL_PERCENT = '$$totalPercentage$$'; +// 漏斗多边型 x 坐标 +var PLOYGON_X = '$$x$$'; +var PLOYGON_Y = '$$y$$'; +/** + * 漏斗图 默认配置项 + */ +var DEFAULT_OPTIONS$f = { + appendPadding: [0, 80], + minSize: 0, + maxSize: 1, + meta: (_a$1 = {}, + _a$1[FUNNEL_MAPPING_VALUE] = { + min: 0, + max: 1, + nice: false, + }, + _a$1), + label: { + style: { + fill: '#fff', + fontSize: 12, + }, + }, + tooltip: { + showTitle: false, + showMarkers: false, + shared: false, + }, + conversionTag: { + offsetX: 10, + offsetY: 0, + style: { + fontSize: 12, + fill: 'rgba(0,0,0,0.45)', + }, + }, +}; + +/** + * 漏斗图 transform + * @param geometry + */ +function transformData$7(data, originData, options) { + var formatData = []; + var yField = options.yField, maxSize = options.maxSize, minSize = options.minSize; + var maxYFieldValue = get$3(maxBy(originData, yField), [yField]); + var max = isNumber$4(maxSize) ? maxSize : 1; + var min = isNumber$4(minSize) ? minSize : 0; + // format 数据 + formatData = map$4(data, function (row, index) { + var percent = (row[yField] || 0) / maxYFieldValue; + row[FUNNEL_PERCENT] = percent; + row[FUNNEL_MAPPING_VALUE] = (max - min) * percent + min; + // 转化率数据存储前后数据 + row[FUNNEL_CONVERSATION] = [get$3(data, [index - 1, yField]), row[yField]]; + return row; + }); + return formatData; +} +/** + * 漏斗图通用转化率组件 + * @param getLineCoordinate 用于获取特定的 line 的位置及配置 + */ +function conversionTagComponent(getLineCoordinate) { + return function (params) { + var chart = params.chart, options = params.options; + var conversionTag = options.conversionTag; + var data = chart.getOptions().data; + if (conversionTag) { + var formatter_1 = conversionTag.formatter; + data.forEach(function (obj, index) { + if (index <= 0) + return; + var lineOption = getLineCoordinate(obj, index, data, { + top: true, + text: { + content: isFunction$6(formatter_1) ? formatter_1(obj, data) : formatter_1, + offsetX: conversionTag.offsetX, + offsetY: conversionTag.offsetY, + position: 'end', + autoRotate: false, + style: __assign$r({ textAlign: 'start', textBaseline: 'middle' }, conversionTag.style), + }, + }); + chart.annotation().line(lineOption); + }); + } + return params; + }; +} + +/** + * 处理字段数据 + * @param params + */ +function field$3(params) { + var chart = params.chart, options = params.options; + var _a = options.data, data = _a === void 0 ? [] : _a, yField = options.yField, maxSize = options.maxSize, minSize = options.minSize; + var formatData = transformData$7(data, data, { + yField: yField, + maxSize: maxSize, + minSize: minSize, + }); + // 绘制漏斗图 + chart.data(formatData); + return params; +} +/** + * geometry处理 + * @param params + */ +function geometry$e(params) { + var chart = params.chart, options = params.options; + var xField = options.xField, yField = options.yField, color = options.color, tooltip = options.tooltip, label = options.label, _a = options.shape, shape = _a === void 0 ? 'funnel' : _a, funnelStyle = options.funnelStyle, state = options.state; + var _b = getTooltipMapping(tooltip, [xField, yField]), fields = _b.fields, formatter = _b.formatter; + geometry$w({ + chart: chart, + options: { + type: 'interval', + xField: xField, + yField: FUNNEL_MAPPING_VALUE, + colorField: xField, + tooltipFields: isArray$n(fields) && fields.concat([FUNNEL_PERCENT, FUNNEL_CONVERSATION]), + mapping: { + shape: shape, + tooltip: formatter, + color: color, + style: funnelStyle, + }, + label: label, + state: state, + }, + }); + var geo = findGeometry(params.chart, 'interval'); + geo.adjust('symmetric'); + return params; +} +/** + * 转置处理 + * @param params + */ +function transpose$1(params) { + var chart = params.chart, options = params.options; + var isTransposed = options.isTransposed; + chart.coordinate({ + type: 'rect', + actions: !isTransposed ? [['transpose'], ['scale', 1, -1]] : [], + }); + return params; +} +/** + * 转化率组件 + * @param params + */ +function conversionTag$2(params) { + var options = params.options; + var maxSize = options.maxSize; + var getLineCoordinate = function (datum, datumIndex, data, initLineOption) { + var percent = maxSize - (maxSize - datum[FUNNEL_MAPPING_VALUE]) / 2; + return __assign$r(__assign$r({}, initLineOption), { start: [datumIndex - 0.5, percent], end: [datumIndex - 0.5, percent + 0.05] }); + }; + conversionTagComponent(getLineCoordinate)(params); + return params; +} +/** + * 基础漏斗 + * @param chart + * @param options + */ +function basicFunnel(params) { + return flow(field$3, geometry$e, transpose$1, conversionTag$2)(params); +} + +/** + * 处理字段数据 + * @param params + */ +function field$2(params) { + var _a; + var chart = params.chart, options = params.options; + var _b = options.data, data = _b === void 0 ? [] : _b, yField = options.yField; + // 绘制漏斗图 + chart.data(data); + chart.scale((_a = {}, + _a[yField] = { + sync: true, + }, + _a)); + return params; +} +/** + * geometry处理 + * @param params + */ +function geometry$d(params) { + var chart = params.chart, options = params.options; + var data = options.data, xField = options.xField, yField = options.yField, color = options.color, compareField = options.compareField, isTransposed = options.isTransposed, tooltip = options.tooltip, maxSize = options.maxSize, minSize = options.minSize, label = options.label, funnelStyle = options.funnelStyle, state = options.state; + chart.facet('mirror', { + fields: [compareField], + // 漏斗图的转置规则与分面相反，默认是垂直布局 + transpose: !isTransposed, + padding: isTransposed ? 0 : [32, 0, 0, 0], + eachView: function (view, facet) { + var index = isTransposed ? facet.rowIndex : facet.columnIndex; + if (!isTransposed) { + view.coordinate({ + type: 'rect', + actions: [['transpose'], ['scale', index === 0 ? -1 : 1, -1]], + }); + } + var formatterData = transformData$7(facet.data, data, { + yField: yField, + maxSize: maxSize, + minSize: minSize, + }); + view.data(formatterData); + // 绘制图形 + var _a = getTooltipMapping(tooltip, [xField, yField, compareField]), fields = _a.fields, formatter = _a.formatter; + var defaultFacetLabel = isTransposed + ? { + offset: index === 0 ? 10 : -23, + position: (index === 0 ? 'bottom' : 'top'), + } + : { + offset: 10, + position: 'left', + style: { + textAlign: index === 0 ? 'end' : 'start', + }, + }; + geometry$w({ + chart: view, + options: { + type: 'interval', + xField: xField, + yField: FUNNEL_MAPPING_VALUE, + colorField: xField, + tooltipFields: isArray$n(fields) && fields.concat([FUNNEL_PERCENT, FUNNEL_CONVERSATION]), + mapping: { + // todo 暂时不提供 金字塔 shape，后续需要自定义下形状 + shape: 'funnel', + tooltip: formatter, + color: color, + style: funnelStyle, + }, + label: label === false ? false : deepAssign({}, defaultFacetLabel, label), + state: state, + }, + }); + }, + }); + return params; +} +/** + * 转化率组件 + * @param params + */ +function conversionTag$1(params) { + var chart = params.chart, options = params.options; + var conversionTag = options.conversionTag, isTransposed = options.isTransposed; + // @ts-ignore + chart.once('beforepaint', function () { + chart.views.forEach(function (view, viewIndex) { + var getLineCoordinate = function (datum, datumIndex, data, initLineOption) { + var ratio = viewIndex === 0 ? -1 : 1; + return deepAssign({}, initLineOption, { + start: [datumIndex - 0.5, datum[FUNNEL_MAPPING_VALUE]], + end: [datumIndex - 0.5, datum[FUNNEL_MAPPING_VALUE] + 0.05], + text: isTransposed + ? { + style: { + textAlign: 'start', + }, + } + : { + offsetX: conversionTag !== false ? ratio * conversionTag.offsetX : 0, + style: { + textAlign: viewIndex === 0 ? 'end' : 'start', + }, + }, + }); + }; + conversionTagComponent(getLineCoordinate)(deepAssign({}, { + chart: view, + options: options, + })); + }); + }); + return params; +} +/** + * 对比漏斗 + * @param chart + * @param options + */ +function compareFunnel(params) { + return flow(field$2, geometry$d, conversionTag$1)(params); +} + +/** + * 处理字段数据 + * @param params + */ +function field$1(params) { + var _a; + var chart = params.chart, options = params.options; + var _b = options.data, data = _b === void 0 ? [] : _b, yField = options.yField; + // 绘制漏斗图 + chart.data(data); + chart.scale((_a = {}, + _a[yField] = { + sync: true, + }, + _a)); + return params; +} +/** + * geometry处理 + * @param params + */ +function geometry$c(params) { + var chart = params.chart, options = params.options; + var seriesField = options.seriesField, isTransposed = options.isTransposed; + chart.facet('rect', { + fields: [seriesField], + padding: [isTransposed ? 0 : 32, 10, 0, 10], + eachView: function (view, facet) { + basicFunnel(deepAssign({}, params, { + chart: view, + options: { + data: facet.data, + }, + })); + }, + }); + return params; +} +/** + * 分面漏斗 + * @param chart + * @param options + */ +function facetFunnel(params) { + return flow(field$1, geometry$c)(params); +} + +/** + * 动态高度漏斗图 + * @param params + * 需求: 每个漏斗项的高度根据 yfield 等比生成。漏斗上下宽度比为2，即斜率为 2。 + * 实现方式: 使用 g2 多边形，data -> 点坐标 -> 绘制 + * 以漏斗底部中心点为坐标轴原点，漏斗在 -0.5 <= x <= 0.5, 0 <= y <= 1 的正方形中绘制 + * 先计算第一象限的点, 第二象限的点即为镜像 x 轴取反。 + * 第一象限共需计算 data.length + 1 个点，在 y = 4x - 1 上。首尾分别是[0.5, 1], [0.25, 0]。根据 data 计算出 y 值，从而得到 y 值 + */ +/** + * 处理数据 + * @param params + */ +function field(params) { + var chart = params.chart, options = params.options; + var _a = options.data, data = _a === void 0 ? [] : _a, yField = options.yField; + // 计算各数据项所占高度 + var sum = reduce$1(data, function (total, item) { + return total + (item[yField] || 0); + }, 0); + var max = maxBy(data, yField)[yField]; + var formatData = map$4(data, function (row, index) { + // 储存四个点 x，y 坐标，方向为顺时针，即 [左上, 右上，右下，左下] + var x = []; + var y = []; + row[FUNNEL_TOTAL_PERCENT] = (row[yField] || 0) / sum; + // 获取左上角，右上角坐标 + if (index) { + var preItemX = data[index - 1][PLOYGON_X]; + var preItemY = data[index - 1][PLOYGON_Y]; + x[0] = preItemX[3]; + y[0] = preItemY[3]; + x[1] = preItemX[2]; + y[1] = preItemY[2]; + } + else { + x[0] = -0.5; + y[0] = 1; + x[1] = 0.5; + y[1] = 1; + } + // 获取右下角坐标 + y[2] = y[1] - row[FUNNEL_TOTAL_PERCENT]; + x[2] = (y[2] + 1) / 4; + y[3] = y[2]; + x[3] = -x[2]; + // 赋值 + row[PLOYGON_X] = x; + row[PLOYGON_Y] = y; + row[FUNNEL_PERCENT] = (row[yField] || 0) / max; + row[FUNNEL_CONVERSATION] = [get$3(data, [index - 1, yField]), row[yField]]; + return row; + }); + chart.data(formatData); + return params; +} +/** + * geometry处理 + * @param params + */ +function geometry$b(params) { + var chart = params.chart, options = params.options; + var xField = options.xField, yField = options.yField, color = options.color, tooltip = options.tooltip, label = options.label, funnelStyle = options.funnelStyle, state = options.state; + var _a = getTooltipMapping(tooltip, [xField, yField]), fields = _a.fields, formatter = _a.formatter; + // 绘制漏斗图 + geometry$w({ + chart: chart, + options: { + type: 'polygon', + xField: PLOYGON_X, + yField: PLOYGON_Y, + colorField: xField, + tooltipFields: isArray$n(fields) && fields.concat([FUNNEL_PERCENT, FUNNEL_CONVERSATION]), + label: label, + state: state, + mapping: { + tooltip: formatter, + color: color, + style: funnelStyle, + }, + }, + }); + return params; +} +/** + * 转置处理 + * @param params + */ +function transpose(params) { + var chart = params.chart, options = params.options; + var isTransposed = options.isTransposed; + chart.coordinate({ + type: 'rect', + actions: isTransposed ? [['transpose'], ['reflect', 'x']] : [], + }); + return params; +} +/** + * 转化率组件 + * @param params + */ +function conversionTag(params) { + var getLineCoordinate = function (datum, datumIndex, data, initLineOption) { + return __assign$r(__assign$r({}, initLineOption), { start: [datum[PLOYGON_X][1], datum[PLOYGON_Y][1]], end: [datum[PLOYGON_X][1] + 0.05, datum[PLOYGON_Y][1]] }); + }; + conversionTagComponent(getLineCoordinate)(params); + return params; +} +/** + * 动态高度漏斗 + * @param chart + * @param options + */ +function dynamicHeightFunnel(params) { + return flow(field, geometry$b, transpose, conversionTag)(params); +} + +/** + * + * 各式漏斗图geometry实现细节有较大不同, + * 1. 普通漏斗图：interval.shape('funnel') + * 2. 对比漏斗图：分面 + * 3. 动态高度漏斗图：polypon + * 4. 分面漏斗图：普通 + list 分面 +* / + +/** + * options 处理 + * @param params + */ +function defaultOptions$4(params) { + var options = params.options; + var compareField = options.compareField, xField = options.xField, yField = options.yField, locale = options.locale, funnelStyle = options.funnelStyle; + var i18n = getLocale(locale); + var defaultOption = { + label: compareField + ? { + fields: [xField, yField, compareField, FUNNEL_PERCENT, FUNNEL_CONVERSATION], + formatter: function (datum) { return "" + datum[yField]; }, + } + : { + fields: [xField, yField, FUNNEL_PERCENT, FUNNEL_CONVERSATION], + offset: 0, + position: 'middle', + formatter: function (datum) { return datum[xField] + " " + datum[yField]; }, + }, + tooltip: { + title: xField, + formatter: function (datum) { + return { name: datum[xField], value: datum[yField] }; + }, + }, + conversionTag: { + // conversionTag 的计算和显示逻辑统一保持一致 + formatter: function (datum) { + return i18n.get(['conversionTag', 'label']) + ": " + conversionTagFormatter.apply(void 0, datum[FUNNEL_CONVERSATION]); + }, + }, + }; + // 漏斗图样式 + var style; + if (compareField || funnelStyle) { + style = function (datum) { + return deepAssign({}, + // 对比漏斗图默认描边 + compareField && { lineWidth: 1, stroke: '#fff' }, isFunction$6(funnelStyle) ? funnelStyle(datum) : funnelStyle); + }; + } + return deepAssign({ options: defaultOption }, params, { options: { funnelStyle: style } }); +} +/** + * geometry处理 + * @param params + */ +function geometry$a(params) { + var options = params.options; + var compareField = options.compareField, dynamicHeight = options.dynamicHeight, seriesField = options.seriesField; + if (seriesField) { + return facetFunnel(params); + } + if (compareField) { + return compareFunnel(params); + } + if (dynamicHeight) { + return dynamicHeightFunnel(params); + } + return basicFunnel(params); +} +/** + * meta 配置 + * @param params + */ +function meta$7(params) { + var _a; + var options = params.options; + var xAxis = options.xAxis, yAxis = options.yAxis, xField = options.xField, yField = options.yField; + return flow(scale$3((_a = {}, + _a[xField] = xAxis, + _a[yField] = yAxis, + _a)))(params); +} +/** + * 坐标轴 + * @param params + */ +function axis$8(params) { + var chart = params.chart; + chart.axis(false); + return params; +} +/** + * legend 配置 + * @param params + */ +function legend$4(params) { + var chart = params.chart, options = params.options; + var legend = options.legend; + if (legend === false) { + chart.legend(false); + } + else { + chart.legend(legend); + // TODO FIX: legend-click 时间和转化率组件之间的关联 + } + return params; +} +/** + * 漏斗图适配器 + * @param chart + * @param options + */ +function adaptor$d(params) { + return flow(defaultOptions$4, geometry$a, meta$7, axis$8, tooltip$8, interaction$6, legend$4, animation$5, theme$2, annotation$2())(params); +} + +var Funnel$1 = /** @class */ (function (_super) { + __extends$e(Funnel, _super); + function Funnel() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'funnel'; + return _this; + } + Funnel.getDefaultOptions = function () { + return DEFAULT_OPTIONS$f; + }; + /** + * 获取 漏斗图 默认配置项 + */ + Funnel.prototype.getDefaultOptions = function () { + // 由于不同漏斗图 defaultOption 有部分逻辑不同，此处仅处理 core.getDefaultOptions 覆盖范围，funnel 的 defaulOption 为不分散逻辑统一写到 adaptor 的 defaultOption 中 + return Funnel.getDefaultOptions(); + }; + /** + * 获取 漏斗图 的适配器 + */ + Funnel.prototype.getSchemaAdaptor = function () { + return adaptor$d; + }; + /** + * 设置状态 + * @param type 状态类型，支持 'active' | 'inactive' | 'selected' 三种 + * @param conditions 条件，支持数组 + * @param status 是否激活，默认 true + */ + Funnel.prototype.setState = function (type, condition, status) { + if (status === void 0) { status = true; } + var elements = getAllElementsRecursively(this.chart); + each$2(elements, function (ele) { + if (condition(ele.getData())) { + ele.setState(type, status); + } + }); + }; + /** + * 获取状态 + */ + Funnel.prototype.getStates = function () { + var elements = getAllElementsRecursively(this.chart); + var stateObjects = []; + each$2(elements, function (element) { + var data = element.getData(); + var states = element.getStates(); + each$2(states, function (state) { + stateObjects.push({ data: data, state: state, geometry: element.geometry, element: element }); + }); + }); + return stateObjects; + }; + // 内部变量 + /** 漏斗 转化率 字段 */ + Funnel.CONVERSATION_FIELD = FUNNEL_CONVERSATION; + /** 漏斗 百分比 字段 */ + Funnel.PERCENT_FIELD = FUNNEL_PERCENT; + /** 漏斗 总转换率百分比 字段 */ + Funnel.TOTAL_PERCENT_FIELD = FUNNEL_TOTAL_PERCENT; + return Funnel; +}(Plot)); + +var CAT_VALUE = 'liquid'; +/** + * 获取水波图数据 + */ +function getLiquidData(percent) { + return [{ percent: percent, type: CAT_VALUE }]; +} + +/** + * geometry 处理 + * @param params + */ +function geometry$9(params) { + var chart = params.chart, options = params.options; + var percent = options.percent, liquidStyle = options.liquidStyle, radius = options.radius, outline = options.outline, wave = options.wave, shape = options.shape; + chart.scale({ + percent: { + min: 0, + max: 1, + }, + }); + chart.data(getLiquidData(percent)); + var color = options.color || chart.getTheme().defaultColor; + var p = deepAssign({}, params, { + options: { + xField: 'type', + yField: 'percent', + // radius 放到 columnWidthRatio 中。 + // 保证横向的大小是根据 radius 生成的 + widthRatio: radius, + interval: { + color: color, + style: liquidStyle, + shape: 'liquid-fill-gauge', + }, + }, + }); + var ext = interval(p).ext; + var geometry = ext.geometry; + var background = chart.getTheme().background; + var customInfo = { + radius: radius, + outline: outline, + wave: wave, + shape: shape, + background: background, + }; + // 将 radius 传入到自定义 shape 中 + geometry.customInfo(customInfo); + // 关闭组件 + chart.legend(false); + chart.axis(false); + chart.tooltip(false); + return params; +} +/** + * 统计指标文档 + * @param params + */ +function statistic$1(params, updated) { + var chart = params.chart, options = params.options; + var statistic = options.statistic, percent = options.percent, meta = options.meta; + // 先清空标注，再重新渲染 + chart.getController('annotation').clear(true); + var metaFormatter = get$3(meta, ['percent', 'formatter']) || (function (v) { return (v * 100).toFixed(2) + "%"; }); + var contentOpt = statistic.content; + if (contentOpt) { + contentOpt = deepAssign({}, contentOpt, { + content: !isNil(contentOpt.content) ? contentOpt.content : metaFormatter(percent), + }); + } + renderStatistic(chart, { statistic: __assign$r(__assign$r({}, statistic), { content: contentOpt }), plotType: 'liquid' }, { percent: percent }); + if (updated) { + chart.render(true); + } + return params; +} +/** + * 水波图适配器 + * @param chart + * @param options + */ +function adaptor$c(params) { + // flow 的方式处理所有的配置到 G2 API (主题前置，会影响绘制的取色) + return flow(theme$2, pattern('liquidStyle'), geometry$9, statistic$1, scale$3({}), animation$5, interaction$6)(params); +} + +/** + * 水波图默认配置项 + */ +var DEFAULT_OPTIONS$e = { + radius: 0.9, + statistic: { + title: false, + content: { + style: { + opacity: 0.75, + fontSize: '30px', + lineHeight: '30px', + textAlign: 'center', + }, + }, + }, + outline: { + border: 2, + distance: 0, + }, + wave: { + count: 3, + length: 192, + }, + shape: 'circle', +}; + +var DURATION = 5000; +/** + * 一个线性映射的函数 + * @param min + * @param max + * @param factor + */ +function lerp$1(min, max, factor) { + return min + (max - min) * factor; +} +/** + * 波浪的 attrs + * @param cfg + */ +function getFillAttrs$1(cfg) { + var attrs = __assign$r({ opacity: 1 }, cfg.style); + if (cfg.color && !attrs.fill) { + attrs.fill = cfg.color; + } + return attrs; +} +/** + * shape 的 attrs + * @param cfg + */ +function getLineAttrs(cfg) { + var defaultAttrs = { + fill: '#fff', + fillOpacity: 0, + lineWidth: 4, + }; + var attrs = mix({}, defaultAttrs, cfg.style); + if (cfg.color && !attrs.stroke) { + attrs.stroke = cfg.color; + } + if (isNumber$4(cfg.opacity)) { + attrs.opacity = attrs.strokeOpacity = cfg.opacity; + } + return attrs; +} +/** + * 用贝塞尔曲线模拟正弦波 + * Using Bezier curves to fit sine wave. + * There is 4 control points for each curve of wave, + * which is at 1/4 wave length of the sine wave. + * + * The control points for a wave from (a) to (d) are a-b-c-d: + * c *----* d + * b * + * | + * ... a * .................. + * + * whose positions are a: (0, 0), b: (0.5, 0.5), c: (1, 1), d: (PI / 2, 1) + * + * @param x x position of the left-most point (a) + * @param stage 0-3, stating which part of the wave it is + * @param waveLength wave length of the sine wave + * @param amplitude wave amplitude + * @return 正弦片段曲线 + */ +function getWaterWavePositions(x, stage, waveLength, amplitude) { + if (stage === 0) { + return [ + [x + ((1 / 2) * waveLength) / Math.PI / 2, amplitude / 2], + [x + ((1 / 2) * waveLength) / Math.PI, amplitude], + [x + waveLength / 4, amplitude], + ]; + } + if (stage === 1) { + return [ + [x + (((1 / 2) * waveLength) / Math.PI / 2) * (Math.PI - 2), amplitude], + [x + (((1 / 2) * waveLength) / Math.PI / 2) * (Math.PI - 1), amplitude / 2], + [x + waveLength / 4, 0], + ]; + } + if (stage === 2) { + return [ + [x + ((1 / 2) * waveLength) / Math.PI / 2, -amplitude / 2], + [x + ((1 / 2) * waveLength) / Math.PI, -amplitude], + [x + waveLength / 4, -amplitude], + ]; + } + return [ + [x + (((1 / 2) * waveLength) / Math.PI / 2) * (Math.PI - 2), -amplitude], + [x + (((1 / 2) * waveLength) / Math.PI / 2) * (Math.PI - 1), -amplitude / 2], + [x + waveLength / 4, 0], + ]; +} +/** + * 获取水波路径 + * @param radius 半径 + * @param waterLevel 水位 + * @param waveLength 波长 + * @param phase 相位 + * @param amplitude 震幅 + * @param cx 圆心x + * @param cy 圆心y + * @return path 路径 + * @reference http://gitlab.alipay-inc.com/datavis/g6/blob/1.2.0/src/graph/utils/path.js#L135 + */ +function getWaterWavePath(radius, waterLevel, waveLength, phase, amplitude, cx, cy) { + var curves = Math.ceil(((2 * radius) / waveLength) * 4) * 4; + var path = []; + var _phase = phase; + // map phase to [-Math.PI * 2, 0] + while (_phase < -Math.PI * 2) { + _phase += Math.PI * 2; + } + while (_phase > 0) { + _phase -= Math.PI * 2; + } + _phase = (_phase / Math.PI / 2) * waveLength; + var left = cx - radius + _phase - radius * 2; + /** + * top-left corner as start point + * + * draws this point + * | + * \|/ + * ~~~~~~~~ + * | | + * +------+ + */ + path.push(['M', left, waterLevel]); + /** + * top wave + * + * ~~~~~~~~ <- draws this sine wave + * | | + * +------+ + */ + var waveRight = 0; + for (var c = 0; c < curves; ++c) { + var stage = c % 4; + var pos = getWaterWavePositions((c * waveLength) / 4, stage, waveLength, amplitude); + path.push([ + 'C', + pos[0][0] + left, + -pos[0][1] + waterLevel, + pos[1][0] + left, + -pos[1][1] + waterLevel, + pos[2][0] + left, + -pos[2][1] + waterLevel, + ]); + if (c === curves - 1) { + waveRight = pos[2][0]; + } + } + /** + * top-right corner + * + * ~~~~~~~~ + * 3. draws this line -> | | <- 1. draws this line + * +------+ + * ^ + * | + * 2. draws this line + */ + path.push(['L', waveRight + left, cy + radius]); + path.push(['L', left, cy + radius]); + path.push(['Z']); + // path.push(['L', left, waterLevel]); + return path; +} +/** + * 添加水波 + * @param x 中心x + * @param y 中心y + * @param level 水位等级 0～1 + * @param waveCount 水波数 + * @param waveAttrs 色值 + * @param group 图组 + * @param clip 用于剪切的图形 + * @param radius 绘制图形的高度 + * @param waveLength 波的长度 + */ +function addWaterWave(x, y, level, waveCount, waveAttrs, group, clip, radius, waveLength) { + var fill = waveAttrs.fill, opacity = waveAttrs.opacity; + var bbox = clip.getBBox(); + var width = bbox.maxX - bbox.minX; + var height = bbox.maxY - bbox.minY; + for (var idx = 0; idx < waveCount; idx++) { + var factor = waveCount <= 1 ? 0 : idx / (waveCount - 1); + var wave = group.addShape('path', { + name: "waterwave-path", + attrs: { + path: getWaterWavePath(radius, bbox.minY + height * level, waveLength, 0, width / 32, // 波幅高度 + x, y), + fill: fill, + opacity: lerp$1(0.2, 0.9, factor) * opacity, + }, + }); + try { + var matrix = transform$d([['t', waveLength, 0]]); + wave.stopAnimate(); + wave.animate({ matrix: matrix }, { + duration: lerp$1(0.5 * DURATION, DURATION, factor), + repeat: true, + }); + } + catch (e) { + // TODO off-screen canvas 中动画会找不到 canvas + console.warn('off-screen group animate error!'); + } + } +} +/** + * + * @param x 中心 x + * @param y 中心 y + * @param width 外接矩形的宽 + * @param height 外接矩形的高 + */ +function pin(x, y, width, height) { + var w = (width * 2) / 3; + var h = Math.max(w, height); + var r = w / 2; + // attrs of the upper circle + var cx = x; + var cy = r + y - h / 2; + var theta = Math.asin(r / ((h - r) * 0.85)); + var dy = Math.sin(theta) * r; + var dx = Math.cos(theta) * r; + // the start point of the path + var x0 = cx - dx; + var y0 = cy + dy; + // control point + var cpX = x; + var cpY = cy + r / Math.sin(theta); + return "\n M " + x0 + " " + y0 + "\n A " + r + " " + r + " 0 1 1 " + (x0 + dx * 2) + " " + y0 + "\n Q " + cpX + " " + cpY + " " + x + " " + (y + h / 2) + "\n Q " + cpX + " " + cpY + " " + x0 + " " + y0 + "\n Z \n "; +} +/** + * + * @param x 中心 x + * @param y 中心 y + * @param width 外接矩形的宽 + * @param height 外接矩形的高 + */ +function circle(x, y, width, height) { + var rx = width / 2; + var ry = height / 2; + return "\n M " + x + " " + (y - ry) + " \n a " + rx + " " + ry + " 0 1 0 0 " + ry * 2 + "\n a " + rx + " " + ry + " 0 1 0 0 " + -ry * 2 + "\n Z\n "; +} +/** + * + * @param x 中心 x + * @param y 中心 y + * @param width 外接矩形的宽 + * @param height 外接矩形的高 + */ +function diamond(x, y, width, height) { + var h = height / 2; + var w = width / 2; + return "\n M " + x + " " + (y - h) + "\n L " + (x + w) + " " + y + "\n L " + x + " " + (y + h) + "\n L " + (x - w) + " " + y + "\n Z\n "; +} +/** + * + * @param x 中心 x + * @param y 中心 y + * @param width 外接矩形的宽 + * @param height 外接矩形的高 + */ +function triangle(x, y, width, height) { + var h = height / 2; + var w = width / 2; + return "\n M " + x + " " + (y - h) + "\n L " + (x + w) + " " + (y + h) + "\n L " + (x - w) + " " + (y + h) + "\n Z\n "; +} +/** + * + * @param x 中心 x + * @param y 中心 y + * @param width 外接矩形的宽 + * @param height 外接矩形的高 + */ +function rect(x, y, width, height) { + var GOLDEN_SECTION_RATIO = 0.618; + var h = height / 2; + var w = (width / 2) * GOLDEN_SECTION_RATIO; + return "\n M " + (x - w) + " " + (y - h) + "\n L " + (x + w) + " " + (y - h) + "\n L " + (x + w) + " " + (y + h) + "\n L " + (x - w) + " " + (y + h) + "\n Z\n "; +} +registerShape('interval', 'liquid-fill-gauge', { + draw: function (cfg, container) { + var cx = 0.5; + var cy = 0.5; + var customInfo = cfg.customInfo; + var _a = customInfo, radio = _a.radius, shape = _a.shape, background = _a.background; + var outline = customInfo.outline; + var wave = customInfo.wave; + var border = outline.border, distance = outline.distance; + var waveCount = wave.count, waveLength = wave.length; + // 获取最小 minX + var minX = reduce$1(cfg.points, function (r, p) { + return Math.min(r, p.x); + }, Infinity); + var center = this.parsePoint({ x: cx, y: cy }); + var minXPoint = this.parsePoint({ x: minX, y: cy }); + var halfWidth = center.x - minXPoint.x; + // 保证半径是 画布宽高最小值的 radius 值 + var radius = Math.min(halfWidth, minXPoint.y * radio); + var waveAttrs = getFillAttrs$1(cfg); + var outlineAttrs = getLineAttrs(mix({}, cfg, outline)); + var innerRadius = radius - border / 2; + var builtInShapeByName = { + pin: pin, + circle: circle, + diamond: diamond, + triangle: triangle, + rect: rect, + }; + var buildPath = typeof shape === 'function' ? shape : builtInShapeByName[shape] || builtInShapeByName['circle']; + var shapePath = buildPath(center.x, center.y, innerRadius * 2, innerRadius * 2); + // 1. 绘制一个波 + var waves = container.addGroup({ + name: 'waves', + }); + // 3. 波对应的 clip 裁剪形状 + var clipPath = waves.setClip({ + type: 'path', + attrs: { + path: shapePath, + }, + }); + // 4. 绘制波形 + addWaterWave(center.x, center.y, 1 - cfg.points[1].y, waveCount, waveAttrs, waves, clipPath, radius * 2, waveLength); + // 2. 绘制一个 distance 宽的 border + container.addShape('path', { + name: 'distance', + attrs: { + path: shapePath, + fill: 'transparent', + lineWidth: border + distance * 2, + stroke: background === 'transparent' ? '#fff' : background, + }, + }); + // 3. 绘制一个 border 宽的 border + container.addShape('path', { + name: 'wrap', + attrs: mix(outlineAttrs, { + path: shapePath, + fill: 'transparent', + lineWidth: border, + }), + }); + return container; + }, +}); + +/** + * 传说中的水波图 + */ +var Liquid$1 = /** @class */ (function (_super) { + __extends$e(Liquid, _super); + function Liquid() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'liquid'; + return _this; + } + /** + * 获取 饼图 默认配置项 + * 供外部使用 + */ + Liquid.getDefaultOptions = function () { + return DEFAULT_OPTIONS$e; + }; + /** + * 获取 水波图 默认配置项, 供 base 获取 + */ + Liquid.prototype.getDefaultOptions = function () { + return Liquid.getDefaultOptions(); + }; + /** + * 更新数据 + * @param percent + */ + Liquid.prototype.changeData = function (percent) { + this.chart.emit(VIEW_LIFE_CIRCLE.BEFORE_CHANGE_DATA, Event$1.fromData(this.chart, VIEW_LIFE_CIRCLE.BEFORE_CHANGE_DATA, null)); + this.updateOption({ percent: percent }); + this.chart.data(getLiquidData(percent)); + statistic$1({ chart: this.chart, options: this.options }, true); + this.chart.emit(VIEW_LIFE_CIRCLE.AFTER_CHANGE_DATA, Event$1.fromData(this.chart, VIEW_LIFE_CIRCLE.AFTER_CHANGE_DATA, null)); + }; + /** + * 获取适配器 + */ + Liquid.prototype.getSchemaAdaptor = function () { + return adaptor$c; + }; + return Liquid; +}(Plot)); + +/** + * bullet 处理数据 + * @param options + */ +function transformData$6(options) { + var data = options.data, xField = options.xField, measureField = options.measureField, rangeField = options.rangeField, targetField = options.targetField, layout = options.layout; + var ds = []; + var scales = []; + data.forEach(function (item, index) { + var _a; + // 构建 title * range + item[rangeField].sort(function (a, b) { return a - b; }); + item[rangeField].forEach(function (d, i) { + var _a; + var range = i === 0 ? d : item[rangeField][i] - item[rangeField][i - 1]; + ds.push((_a = { + rKey: rangeField + "_" + i + }, + _a[xField] = xField ? item[xField] : String(index), + _a[rangeField] = range, + _a)); + }); + // 构建 title * measure + item[measureField].forEach(function (d, i) { + var _a; + ds.push((_a = { + mKey: item[measureField].length > 1 ? measureField + "_" + i : "" + measureField + }, + _a[xField] = xField ? item[xField] : String(index), + _a[measureField] = d, + _a)); + }); + // 构建 title * target + ds.push((_a = { + tKey: "" + targetField + }, + _a[xField] = xField ? item[xField] : String(index), + _a[targetField] = item[targetField], + _a)); + // 为了取最大值和最小值，先存储 + scales.push(item[rangeField], item[measureField], item[targetField]); + }); + // scales 是嵌套的需要拍平 + var min = Math.min.apply(Math, scales.flat(Infinity)); + var max = Math.max.apply(Math, scales.flat(Infinity)); + // min 大于 0 从 0 开始 + min = min > 0 ? 0 : min; + // 垂直情况，需要反转数据 + if (layout === 'vertical') { + ds.reverse(); + } + return { min: min, max: max, ds: ds }; +} + +/** + * geometry 处理 + * @param params + */ +function geometry$8(params) { + var chart = params.chart, options = params.options; + var bulletStyle = options.bulletStyle, targetField = options.targetField, rangeField = options.rangeField, measureField = options.measureField, xField = options.xField, color = options.color, layout = options.layout, size = options.size, label = options.label; + // 处理数据 + var _a = transformData$6(options), min = _a.min, max = _a.max, ds = _a.ds; + chart.data(ds); + // rangeGeometry + var r = deepAssign({}, params, { + options: { + xField: xField, + yField: rangeField, + seriesField: 'rKey', + isStack: true, + label: get$3(label, 'range'), + interval: { + color: get$3(color, 'range'), + style: get$3(bulletStyle, 'range'), + size: get$3(size, 'range'), + }, + }, + }); + interval(r); + // 范围值的 tooltip 隐藏掉 + chart.geometries[0].tooltip(false); + // measureGeometry + var m = deepAssign({}, params, { + options: { + xField: xField, + yField: measureField, + seriesField: 'mKey', + isStack: true, + label: get$3(label, 'measure'), + interval: { + color: get$3(color, 'measure'), + style: get$3(bulletStyle, 'measure'), + size: get$3(size, 'measure'), + }, + }, + }); + interval(m); + // targetGeometry + var t = deepAssign({}, params, { + options: { + xField: xField, + yField: targetField, + seriesField: 'tKey', + label: get$3(label, 'target'), + point: { + color: get$3(color, 'target'), + style: get$3(bulletStyle, 'target'), + size: isFunction$6(get$3(size, 'target')) + ? function (data) { return get$3(size, 'target')(data) / 2; } + : get$3(size, 'target') / 2, + shape: layout === 'horizontal' ? 'line' : 'hyphen', + }, + }, + }); + point(t); + // 水平的时候，要转换坐标轴 + if (layout === 'horizontal') { + chart.coordinate().transpose(); + } + return __assign$r(__assign$r({}, params), { ext: { data: { min: min, max: max } } }); +} +/** + * meta 配置 + * @param params + */ +function meta$6(params) { + var _a, _b; + var options = params.options, ext = params.ext; + var xAxis = options.xAxis, yAxis = options.yAxis, targetField = options.targetField, rangeField = options.rangeField, measureField = options.measureField, xField = options.xField; + var extData = ext.data; + return flow(scale$3((_a = {}, + _a[xField] = xAxis, + _a[measureField] = yAxis, + _a), (_b = {}, + _b[measureField] = { min: extData === null || extData === void 0 ? void 0 : extData.min, max: extData === null || extData === void 0 ? void 0 : extData.max, sync: true }, + _b[targetField] = { + sync: "" + measureField, + }, + _b[rangeField] = { + sync: "" + measureField, + }, + _b)))(params); +} +/** + * axis 配置 + * @param params + */ +function axis$7(params) { + var chart = params.chart, options = params.options; + var xAxis = options.xAxis, yAxis = options.yAxis, xField = options.xField, measureField = options.measureField, rangeField = options.rangeField, targetField = options.targetField; + chart.axis("" + rangeField, false); + chart.axis("" + targetField, false); + // 为 false 则是不显示轴 + if (xAxis === false) { + chart.axis("" + xField, false); + } + else { + chart.axis("" + xField, xAxis); + } + if (yAxis === false) { + chart.axis("" + measureField, false); + } + else { + chart.axis("" + measureField, yAxis); + } + return params; +} +/** + * legend 配置 + * @param params + */ +function legend$3(params) { + var chart = params.chart, options = params.options; + var legend = options.legend; + chart.removeInteraction('legend-filter'); + // @TODO 后续看是否内部自定义一个 legend + chart.legend(legend); + // 默认关闭掉所在 color 字段的 legend, 从而不影响自定义的legend + chart.legend('rKey', false); + chart.legend('mKey', false); + chart.legend('tKey', false); + return params; +} +/** + * label 配置 + * @param params + */ +function label$4(params) { + var chart = params.chart, options = params.options; + var label = options.label, measureField = options.measureField, targetField = options.targetField, rangeField = options.rangeField; + var _a = chart.geometries, rangeGeometry = _a[0], measureGeometry = _a[1], targetGeometry = _a[2]; + if (get$3(label, 'range')) { + rangeGeometry.label("" + rangeField, __assign$r({ layout: [{ type: 'limit-in-plot' }] }, transformLabel(label.range))); + } + else { + rangeGeometry.label(false); + } + if (get$3(label, 'measure')) { + measureGeometry.label("" + measureField, __assign$r({ layout: [{ type: 'limit-in-plot' }] }, transformLabel(label.measure))); + } + else { + measureGeometry.label(false); + } + if (get$3(label, 'target')) { + targetGeometry.label("" + targetField, __assign$r({ layout: [{ type: 'limit-in-plot' }] }, transformLabel(label.target))); + } + else { + targetGeometry.label(false); + } + return params; +} +/** + * 子弹图适配器 + * @param chart + * @param options + */ +function adaptor$b(params) { + // flow 的方式处理所有的配置到 G2 API + flow(geometry$8, meta$6, axis$7, legend$3, theme$2, label$4, tooltip$8, interaction$6, animation$5)(params); +} + +/** + * 默认配置项 + */ +var DEFAULT_OPTIONS$d = deepAssign({}, Plot.getDefaultOptions(), { + layout: 'horizontal', + size: { + range: 30, + measure: 20, + target: 20, + }, + xAxis: { + tickLine: false, + line: null, + }, + bulletStyle: { + range: { + fillOpacity: 0.5, + }, + }, + label: { + measure: { + position: 'right', + }, + }, + tooltip: { + // 默认关闭 + showMarkers: false, + }, +}); + +var Bullet$1 = /** @class */ (function (_super) { + __extends$e(Bullet, _super); + function Bullet() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'bullet'; + return _this; + } + /** + * 获取 子弹图 默认配置项 + * 供外部使用 + */ + Bullet.getDefaultOptions = function () { + return DEFAULT_OPTIONS$d; + }; + Bullet.prototype.changeData = function (data) { + this.updateOption({ data: data }); + var _a = transformData$6(this.options), min = _a.min, max = _a.max, ds = _a.ds; + // 处理scale + meta$6({ options: this.options, ext: { data: { min: min, max: max } }, chart: this.chart }); + this.chart.changeData(ds); + }; + /** + * 获取子弹图的适配器 + */ + Bullet.prototype.getSchemaAdaptor = function () { + return adaptor$b; + }; + /** + * 获取 子弹图 默认配置 + */ + Bullet.prototype.getDefaultOptions = function () { + return Bullet.getDefaultOptions(); + }; + return Bullet; +}(Plot)); + +/** export 一些字段常量 */ +/** 在同层级，同一父节点下的节点索引顺序 */ +var NODE_INDEX_FIELD = 'nodeIndex'; +/** child 节点数量 */ +var CHILD_NODE_COUNT = 'childNodeCount'; +/** 节点的祖先节点 */ +var NODE_ANCESTORS_FIELD = 'nodeAncestor'; +var INVALID_FIELD_ERR_MSG = 'Invalid field: it must be a string!'; +function getField(options, defaultField) { + var field = options.field, fields = options.fields; + if (isString$3(field)) { + return field; + } + if (isArray$n(field)) { + console.warn(INVALID_FIELD_ERR_MSG); + return field[0]; + } + console.warn(INVALID_FIELD_ERR_MSG + " will try to get fields instead."); + if (isString$3(fields)) { + return fields; + } + if (isArray$n(fields) && fields.length) { + return fields[0]; + } + if (defaultField) { + return defaultField; + } + throw new TypeError(INVALID_FIELD_ERR_MSG); +} +function getAllNodes(root) { + var nodes = []; + if (root && root.each) { + var parent_1; + var index_1; + // d3-hierarchy: Invokes the specified function for node and each descendant in **breadth-first order** + root.each(function (node) { + var _a, _b; + if (node.parent !== parent_1) { + parent_1 = node.parent; + index_1 = 0; + } + else { + index_1 += 1; + } + var ancestors = filter$1((((_a = node.ancestors) === null || _a === void 0 ? void 0 : _a.call(node)) || []).map(function (d) { return nodes.find(function (n) { return n.name === d.name; }) || d; }), function (_a) { + var depth = _a.depth; + return depth > 0 && depth < node.depth; + }); + node[NODE_ANCESTORS_FIELD] = ancestors; + node[CHILD_NODE_COUNT] = ((_b = node.children) === null || _b === void 0 ? void 0 : _b.length) || 0; + node[NODE_INDEX_FIELD] = index_1; + nodes.push(node); + }); + } + else if (root && root.eachNode) { + // @antv/hierarchy + root.eachNode(function (node) { + nodes.push(node); + }); + } + return nodes; +} + +/** + * 祖先节点，非 root 根节点 + */ +var SUNBURST_ANCESTOR_FIELD = 'ancestor-node'; +var SUNBURST_Y_FIELD = 'value'; +var SUNBURST_PATH_FIELD = 'path'; +/** 默认的源字段 */ +var RAW_FIELDS$1 = [ + SUNBURST_PATH_FIELD, + NODE_INDEX_FIELD, + NODE_ANCESTORS_FIELD, + CHILD_NODE_COUNT, + 'name', + 'depth', + 'height', +]; +/** + * 旭日图 默认配置项 + */ +var DEFAULT_OPTIONS$c = deepAssign({}, Plot.getDefaultOptions(), { + innerRadius: 0, + radius: 0.85, + // 分层配置 + hierarchyConfig: { + // 数值字段，默认是 value（可配置） + field: 'value', + }, + // 组件 + tooltip: { + shared: true, + showMarkers: false, + offset: 20, + showTitle: false, + }, + // 样式设置 + sunburstStyle: { + lineWidth: 0.5, + stroke: '#FFF', + }, + // 默认开启交互 + drilldown: { enabled: true }, +}); + +// 面包屑文字和分割符'/'之间的距离 +var PADDING = 4; +// 面包屑位置距离树图的距离 +var PADDING_LEFT = 0; +// 面包屑位置距离树图的顶部距离 +var PADDING_TOP = 5; +/** Group name of breadCrumb: 面包屑 */ +var BREAD_CRUMB_NAME = 'drilldown-bread-crumb'; +// 面包屑默认配置 +var DEFAULT_BREAD_CRUMB_CONFIG = { + /** 位置，默认：左上角 */ + position: 'top-left', + dividerText: '/', + textStyle: { + fontSize: 12, + fill: 'rgba(0, 0, 0, 0.65)', + cursor: 'pointer', + }, + activeTextStyle: { + fill: '#87B5FF', + }, +}; +/** + * hierarchy 数据转换的参数 + */ +var HIERARCHY_DATA_TRANSFORM_PARAMS = 'hierarchy-data-transform-params'; +/** + * @description 下钻交互的 action + * @author liuzhenying + * + * 适用于：hierarchy plot + */ +var DrillDownAction = /** @class */ (function (_super) { + __extends$e(DrillDownAction, _super); + function DrillDownAction() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** Action name */ + _this.name = 'drill-down'; + // 存储历史下钻数据 + _this.historyCache = []; + // 面包屑 group + _this.breadCrumbGroup = null; + // 面包屑基础配置 + _this.breadCrumbCfg = DEFAULT_BREAD_CRUMB_CONFIG; + return _this; + } + /** + * 点击事件, 下钻数据，并绘制面包屑 + */ + DrillDownAction.prototype.click = function () { + var data = get$3(this.context, ['event', 'data', 'data']); + if (!data) + return false; + this.drill(data); + this.drawBreadCrumb(); + }; + /** + * 重置位置，初始化及触发 chart afterchangesize 回调时使用 + */ + DrillDownAction.prototype.resetPosition = function () { + // 当在第一层级未绘制面包屑，此时 changedata 触发 resetPosition 函数，需判断 this.breadCrumbGroup 是否存在 + if (!this.breadCrumbGroup) + return; + var coordinate = this.context.view.getCoordinate(); + var breadCrumbGroup = this.breadCrumbGroup; + var bbox = breadCrumbGroup.getBBox(); + var position = this.getButtonCfg().position; + // @todo 后续抽取一个函数来处理，以及增加 margin 或者 padding 的设置 + // 非 polar 的，需要使用 coordinate，除却图表组件 + var point = { x: coordinate.start.x, y: coordinate.end.y - (bbox.height + PADDING_TOP * 2) }; + if (coordinate.isPolar) { + // 默认，左上角直接出发 + point = { x: 0, y: 0 }; + } + if (position === 'bottom-left') { + // 涉及到坐标反转的问题 + point = { x: coordinate.start.x, y: coordinate.start.y }; + } + /** PADDING_LEFT, PADDING_TOP 与画布边缘的距离 */ + var matrix = Util$1.transform(null, [['t', point.x + PADDING_LEFT, point.y + bbox.height + PADDING_TOP]]); + breadCrumbGroup.setMatrix(matrix); + }; + /** + * 重置 + */ + DrillDownAction.prototype.reset = function () { + if (this.historyCache[0]) { + this.back(this.historyCache.slice(0, 1)); + } + // 清空 + this.historyCache = []; + this.hideCrumbGroup(); + }; + /** + * 下钻数据并更新 view 显示层 + * @param nodeInfo 下钻数据 + */ + DrillDownAction.prototype.drill = function (nodeInfo) { + var view = this.context.view; + var transformData = get$3(view, ['interactions', 'drill-down', 'cfg', 'transformData'], function (v) { return v; }); + // 重新 update 数据 + var drillData = transformData(__assign$r({ data: nodeInfo.data }, nodeInfo[HIERARCHY_DATA_TRANSFORM_PARAMS])); + view.changeData(drillData); + // 存储历史记录 + var historyCache = []; + var node = nodeInfo; + while (node) { + var nodeData = node.data; + historyCache.unshift({ + id: nodeData.name + "_" + node.height + "_" + node.depth, + name: nodeData.name, + // children 是实际数据 + children: transformData(__assign$r({ data: nodeData }, nodeInfo[HIERARCHY_DATA_TRANSFORM_PARAMS])), + }); + node = node.parent; + } + this.historyCache = (this.historyCache || []).slice(0, -1).concat(historyCache); + }; + /** + * 回退事件，点击面包屑时触发 + * @param historyCache 当前要回退到的历史 + */ + DrillDownAction.prototype.back = function (historyCache) { + if (!historyCache || historyCache.length <= 0) { + return; + } + var view = this.context.view; + var data = last$1(historyCache).children; // 处理后的数组 + view.changeData(data); + if (historyCache.length > 1) { + this.historyCache = historyCache; + this.drawBreadCrumb(); + } + else { + // 清空 + this.historyCache = []; + this.hideCrumbGroup(); + } + }; + /** + * 获取 mix 默认的配置和用户配置 + */ + DrillDownAction.prototype.getButtonCfg = function () { + var view = this.context.view; + var drillDownConfig = get$3(view, ['interactions', 'drill-down', 'cfg', 'drillDownConfig']); + return deepAssign(this.breadCrumbCfg, drillDownConfig === null || drillDownConfig === void 0 ? void 0 : drillDownConfig.breadCrumb, this.cfg); + }; + /** + * 显示面包屑 + */ + DrillDownAction.prototype.drawBreadCrumb = function () { + this.drawBreadCrumbGroup(); + this.resetPosition(); + this.breadCrumbGroup.show(); + }; + /** + * 绘制 Button 和 文本 + */ + DrillDownAction.prototype.drawBreadCrumbGroup = function () { + var _this = this; + var config = this.getButtonCfg(); + var cache = this.historyCache; + // 初始化面包屑 group + if (!this.breadCrumbGroup) { + this.breadCrumbGroup = this.context.view.foregroundGroup.addGroup({ + name: BREAD_CRUMB_NAME, + }); + } + else { + this.breadCrumbGroup.clear(); + } + // 绘制面包屑 + var left = 0; + cache.forEach(function (record, index) { + // 添加文本 + var textShape = _this.breadCrumbGroup.addShape({ + type: 'text', + id: record.id, + name: BREAD_CRUMB_NAME + "_" + record.name + "_text", + attrs: __assign$r(__assign$r({ text: index === 0 && !isNil(config.rootText) ? config.rootText : record.name }, config.textStyle), { x: left, y: 0 }), + }); + var textShapeBox = textShape.getBBox(); + left += textShapeBox.width + PADDING; + // 增加文本事件 + textShape.on('click', function (event) { + var _a; + var targetId = event.target.get('id'); + if (targetId !== ((_a = last$1(cache)) === null || _a === void 0 ? void 0 : _a.id)) { + var newHistoryCache = cache.slice(0, cache.findIndex(function (d) { return d.id === targetId; }) + 1); + _this.back(newHistoryCache); + } + }); + // active 效果内置 + textShape.on('mouseenter', function (event) { + var _a; + var targetId = event.target.get('id'); + if (targetId !== ((_a = last$1(cache)) === null || _a === void 0 ? void 0 : _a.id)) { + textShape.attr(config.activeTextStyle); + } + else { + textShape.attr({ cursor: 'default' }); + } + }); + textShape.on('mouseleave', function () { + textShape.attr(config.textStyle); + }); + if (index < cache.length - 1) { + // 添加反斜杠 + var dividerShape = _this.breadCrumbGroup.addShape({ + type: 'text', + name: config.name + "_" + record.name + "_divider", + attrs: __assign$r(__assign$r({ text: config.dividerText }, config.textStyle), { x: left, y: 0 }), + }); + var dividerBox = dividerShape.getBBox(); + left += dividerBox.width + PADDING; + } + }); + }; + /** + * 隐藏面包屑 + */ + DrillDownAction.prototype.hideCrumbGroup = function () { + if (this.breadCrumbGroup) { + this.breadCrumbGroup.hide(); + } + }; + /** + * @override + * destroy: 销毁资源 + */ + DrillDownAction.prototype.destroy = function () { + if (this.breadCrumbGroup) { + this.breadCrumbGroup.remove(); + } + _super.prototype.destroy.call(this); + }; + return DrillDownAction; +}(Action$1)); + +function defaultSeparation$1(a, b) { + return a.parent === b.parent ? 1 : 2; +} + +function meanX(children) { + return children.reduce(meanXReduce, 0) / children.length; +} + +function meanXReduce(x, c) { + return x + c.x; +} + +function maxY(children) { + return 1 + children.reduce(maxYReduce, 0); +} + +function maxYReduce(y, c) { + return Math.max(y, c.y); +} + +function leafLeft(node) { + var children; + while (children = node.children) node = children[0]; + return node; +} + +function leafRight(node) { + var children; + while (children = node.children) node = children[children.length - 1]; + return node; +} + +function cluster() { + var separation = defaultSeparation$1, + dx = 1, + dy = 1, + nodeSize = false; + + function cluster(root) { + var previousNode, + x = 0; + + // First walk, computing the initial x & y values. + root.eachAfter(function(node) { + var children = node.children; + if (children) { + node.x = meanX(children); + node.y = maxY(children); + } else { + node.x = previousNode ? x += separation(node, previousNode) : 0; + node.y = 0; + previousNode = node; + } + }); + + var left = leafLeft(root), + right = leafRight(root), + x0 = left.x - separation(left, right) / 2, + x1 = right.x + separation(right, left) / 2; + + // Second walk, normalizing x & y to the desired size. + return root.eachAfter(nodeSize ? function(node) { + node.x = (node.x - root.x) * dx; + node.y = (root.y - node.y) * dy; + } : function(node) { + node.x = (node.x - x0) / (x1 - x0) * dx; + node.y = (1 - (root.y ? node.y / root.y : 1)) * dy; + }); + } + + cluster.separation = function(x) { + return arguments.length ? (separation = x, cluster) : separation; + }; + + cluster.size = function(x) { + return arguments.length ? (nodeSize = false, dx = +x[0], dy = +x[1], cluster) : (nodeSize ? null : [dx, dy]); + }; + + cluster.nodeSize = function(x) { + return arguments.length ? (nodeSize = true, dx = +x[0], dy = +x[1], cluster) : (nodeSize ? [dx, dy] : null); + }; + + return cluster; +} + +function count(node) { + var sum = 0, + children = node.children, + i = children && children.length; + if (!i) sum = 1; + else while (--i >= 0) sum += children[i].value; + node.value = sum; +} + +function node_count() { + return this.eachAfter(count); +} + +function node_each(callback, that) { + let index = -1; + for (const node of this) { + callback.call(that, node, ++index, this); + } + return this; +} + +function node_eachBefore(callback, that) { + var node = this, nodes = [node], children, i, index = -1; + while (node = nodes.pop()) { + callback.call(that, node, ++index, this); + if (children = node.children) { + for (i = children.length - 1; i >= 0; --i) { + nodes.push(children[i]); + } + } + } + return this; +} + +function node_eachAfter(callback, that) { + var node = this, nodes = [node], next = [], children, i, n, index = -1; + while (node = nodes.pop()) { + next.push(node); + if (children = node.children) { + for (i = 0, n = children.length; i < n; ++i) { + nodes.push(children[i]); + } + } + } + while (node = next.pop()) { + callback.call(that, node, ++index, this); + } + return this; +} + +function node_find(callback, that) { + let index = -1; + for (const node of this) { + if (callback.call(that, node, ++index, this)) { + return node; + } + } +} + +function node_sum(value) { + return this.eachAfter(function(node) { + var sum = +value(node.data) || 0, + children = node.children, + i = children && children.length; + while (--i >= 0) sum += children[i].value; + node.value = sum; + }); +} + +function node_sort(compare) { + return this.eachBefore(function(node) { + if (node.children) { + node.children.sort(compare); + } + }); +} + +function node_path(end) { + var start = this, + ancestor = leastCommonAncestor(start, end), + nodes = [start]; + while (start !== ancestor) { + start = start.parent; + nodes.push(start); + } + var k = nodes.length; + while (end !== ancestor) { + nodes.splice(k, 0, end); + end = end.parent; + } + return nodes; +} + +function leastCommonAncestor(a, b) { + if (a === b) return a; + var aNodes = a.ancestors(), + bNodes = b.ancestors(), + c = null; + a = aNodes.pop(); + b = bNodes.pop(); + while (a === b) { + c = a; + a = aNodes.pop(); + b = bNodes.pop(); + } + return c; +} + +function node_ancestors() { + var node = this, nodes = [node]; + while (node = node.parent) { + nodes.push(node); + } + return nodes; +} + +function node_descendants() { + return Array.from(this); +} + +function node_leaves() { + var leaves = []; + this.eachBefore(function(node) { + if (!node.children) { + leaves.push(node); + } + }); + return leaves; +} + +function node_links() { + var root = this, links = []; + root.each(function(node) { + if (node !== root) { // Don’t include the root’s parent, if any. + links.push({source: node.parent, target: node}); + } + }); + return links; +} + +function* node_iterator() { + var node = this, current, next = [node], children, i, n; + do { + current = next.reverse(), next = []; + while (node = current.pop()) { + yield node; + if (children = node.children) { + for (i = 0, n = children.length; i < n; ++i) { + next.push(children[i]); + } + } + } + } while (next.length); +} + +function hierarchy$1(data, children) { + if (data instanceof Map) { + data = [undefined, data]; + if (children === undefined) children = mapChildren; + } else if (children === undefined) { + children = objectChildren; + } + + var root = new Node$3(data), + node, + nodes = [root], + child, + childs, + i, + n; + + while (node = nodes.pop()) { + if ((childs = children(node.data)) && (n = (childs = Array.from(childs)).length)) { + node.children = childs; + for (i = n - 1; i >= 0; --i) { + nodes.push(child = childs[i] = new Node$3(childs[i])); + child.parent = node; + child.depth = node.depth + 1; + } + } + } + + return root.eachBefore(computeHeight); +} + +function node_copy() { + return hierarchy$1(this).eachBefore(copyData); +} + +function objectChildren(d) { + return d.children; +} + +function mapChildren(d) { + return Array.isArray(d) ? d[1] : null; +} + +function copyData(node) { + if (node.data.value !== undefined) node.value = node.data.value; + node.data = node.data.data; +} + +function computeHeight(node) { + var height = 0; + do node.height = height; + while ((node = node.parent) && (node.height < ++height)); +} + +function Node$3(data) { + this.data = data; + this.depth = + this.height = 0; + this.parent = null; +} + +Node$3.prototype = hierarchy$1.prototype = { + constructor: Node$3, + count: node_count, + each: node_each, + eachAfter: node_eachAfter, + eachBefore: node_eachBefore, + find: node_find, + sum: node_sum, + sort: node_sort, + path: node_path, + ancestors: node_ancestors, + descendants: node_descendants, + leaves: node_leaves, + links: node_links, + copy: node_copy, + [Symbol.iterator]: node_iterator +}; + +function array(x) { + return typeof x === "object" && "length" in x + ? x // Array, TypedArray, NodeList, array-like + : Array.from(x); // Map, Set, iterable, string, or anything else +} + +function shuffle(array) { + var m = array.length, + t, + i; + + while (m) { + i = Math.random() * m-- | 0; + t = array[m]; + array[m] = array[i]; + array[i] = t; + } + + return array; +} + +function enclose(circles) { + var i = 0, n = (circles = shuffle(Array.from(circles))).length, B = [], p, e; + + while (i < n) { + p = circles[i]; + if (e && enclosesWeak(e, p)) ++i; + else e = encloseBasis(B = extendBasis(B, p)), i = 0; + } + + return e; +} + +function extendBasis(B, p) { + var i, j; + + if (enclosesWeakAll(p, B)) return [p]; + + // If we get here then B must have at least one element. + for (i = 0; i < B.length; ++i) { + if (enclosesNot(p, B[i]) + && enclosesWeakAll(encloseBasis2(B[i], p), B)) { + return [B[i], p]; + } + } + + // If we get here then B must have at least two elements. + for (i = 0; i < B.length - 1; ++i) { + for (j = i + 1; j < B.length; ++j) { + if (enclosesNot(encloseBasis2(B[i], B[j]), p) + && enclosesNot(encloseBasis2(B[i], p), B[j]) + && enclosesNot(encloseBasis2(B[j], p), B[i]) + && enclosesWeakAll(encloseBasis3(B[i], B[j], p), B)) { + return [B[i], B[j], p]; + } + } + } + + // If we get here then something is very wrong. + throw new Error; +} + +function enclosesNot(a, b) { + var dr = a.r - b.r, dx = b.x - a.x, dy = b.y - a.y; + return dr < 0 || dr * dr < dx * dx + dy * dy; +} + +function enclosesWeak(a, b) { + var dr = a.r - b.r + Math.max(a.r, b.r, 1) * 1e-9, dx = b.x - a.x, dy = b.y - a.y; + return dr > 0 && dr * dr > dx * dx + dy * dy; +} + +function enclosesWeakAll(a, B) { + for (var i = 0; i < B.length; ++i) { + if (!enclosesWeak(a, B[i])) { + return false; + } + } + return true; +} + +function encloseBasis(B) { + switch (B.length) { + case 1: return encloseBasis1(B[0]); + case 2: return encloseBasis2(B[0], B[1]); + case 3: return encloseBasis3(B[0], B[1], B[2]); + } +} + +function encloseBasis1(a) { + return { + x: a.x, + y: a.y, + r: a.r + }; +} + +function encloseBasis2(a, b) { + var x1 = a.x, y1 = a.y, r1 = a.r, + x2 = b.x, y2 = b.y, r2 = b.r, + x21 = x2 - x1, y21 = y2 - y1, r21 = r2 - r1, + l = Math.sqrt(x21 * x21 + y21 * y21); + return { + x: (x1 + x2 + x21 / l * r21) / 2, + y: (y1 + y2 + y21 / l * r21) / 2, + r: (l + r1 + r2) / 2 + }; +} + +function encloseBasis3(a, b, c) { + var x1 = a.x, y1 = a.y, r1 = a.r, + x2 = b.x, y2 = b.y, r2 = b.r, + x3 = c.x, y3 = c.y, r3 = c.r, + a2 = x1 - x2, + a3 = x1 - x3, + b2 = y1 - y2, + b3 = y1 - y3, + c2 = r2 - r1, + c3 = r3 - r1, + d1 = x1 * x1 + y1 * y1 - r1 * r1, + d2 = d1 - x2 * x2 - y2 * y2 + r2 * r2, + d3 = d1 - x3 * x3 - y3 * y3 + r3 * r3, + ab = a3 * b2 - a2 * b3, + xa = (b2 * d3 - b3 * d2) / (ab * 2) - x1, + xb = (b3 * c2 - b2 * c3) / ab, + ya = (a3 * d2 - a2 * d3) / (ab * 2) - y1, + yb = (a2 * c3 - a3 * c2) / ab, + A = xb * xb + yb * yb - 1, + B = 2 * (r1 + xa * xb + ya * yb), + C = xa * xa + ya * ya - r1 * r1, + r = -(A ? (B + Math.sqrt(B * B - 4 * A * C)) / (2 * A) : C / B); + return { + x: x1 + xa + xb * r, + y: y1 + ya + yb * r, + r: r + }; +} + +function place(b, a, c) { + var dx = b.x - a.x, x, a2, + dy = b.y - a.y, y, b2, + d2 = dx * dx + dy * dy; + if (d2) { + a2 = a.r + c.r, a2 *= a2; + b2 = b.r + c.r, b2 *= b2; + if (a2 > b2) { + x = (d2 + b2 - a2) / (2 * d2); + y = Math.sqrt(Math.max(0, b2 / d2 - x * x)); + c.x = b.x - x * dx - y * dy; + c.y = b.y - x * dy + y * dx; + } else { + x = (d2 + a2 - b2) / (2 * d2); + y = Math.sqrt(Math.max(0, a2 / d2 - x * x)); + c.x = a.x + x * dx - y * dy; + c.y = a.y + x * dy + y * dx; + } + } else { + c.x = a.x + c.r; + c.y = a.y; + } +} + +function intersects(a, b) { + var dr = a.r + b.r - 1e-6, dx = b.x - a.x, dy = b.y - a.y; + return dr > 0 && dr * dr > dx * dx + dy * dy; +} + +function score(node) { + var a = node._, + b = node.next._, + ab = a.r + b.r, + dx = (a.x * b.r + b.x * a.r) / ab, + dy = (a.y * b.r + b.y * a.r) / ab; + return dx * dx + dy * dy; +} + +function Node$2(circle) { + this._ = circle; + this.next = null; + this.previous = null; +} + +function packEnclose(circles) { + if (!(n = (circles = array(circles)).length)) return 0; + + var a, b, c, n, aa, ca, i, j, k, sj, sk; + + // Place the first circle. + a = circles[0], a.x = 0, a.y = 0; + if (!(n > 1)) return a.r; + + // Place the second circle. + b = circles[1], a.x = -b.r, b.x = a.r, b.y = 0; + if (!(n > 2)) return a.r + b.r; + + // Place the third circle. + place(b, a, c = circles[2]); + + // Initialize the front-chain using the first three circles a, b and c. + a = new Node$2(a), b = new Node$2(b), c = new Node$2(c); + a.next = c.previous = b; + b.next = a.previous = c; + c.next = b.previous = a; + + // Attempt to place each remaining circle… + pack: for (i = 3; i < n; ++i) { + place(a._, b._, c = circles[i]), c = new Node$2(c); + + // Find the closest intersecting circle on the front-chain, if any. + // “Closeness” is determined by linear distance along the front-chain. + // “Ahead” or “behind” is likewise determined by linear distance. + j = b.next, k = a.previous, sj = b._.r, sk = a._.r; + do { + if (sj <= sk) { + if (intersects(j._, c._)) { + b = j, a.next = b, b.previous = a, --i; + continue pack; + } + sj += j._.r, j = j.next; + } else { + if (intersects(k._, c._)) { + a = k, a.next = b, b.previous = a, --i; + continue pack; + } + sk += k._.r, k = k.previous; + } + } while (j !== k.next); + + // Success! Insert the new circle c between a and b. + c.previous = a, c.next = b, a.next = b.previous = b = c; + + // Compute the new closest circle pair to the centroid. + aa = score(a); + while ((c = c.next) !== b) { + if ((ca = score(c)) < aa) { + a = c, aa = ca; + } + } + b = a.next; + } + + // Compute the enclosing circle of the front chain. + a = [b._], c = b; while ((c = c.next) !== b) a.push(c._); c = enclose(a); + + // Translate the circles to put the enclosing circle around the origin. + for (i = 0; i < n; ++i) a = circles[i], a.x -= c.x, a.y -= c.y; + + return c.r; +} + +function siblings(circles) { + packEnclose(circles); + return circles; +} + +function optional$2(f) { + return f == null ? null : required(f); +} + +function required(f) { + if (typeof f !== "function") throw new Error; + return f; +} + +function constantZero() { + return 0; +} + +function constant$4(x) { + return function() { + return x; + }; +} + +function defaultRadius(d) { + return Math.sqrt(d.value); +} + +function index$3() { + var radius = null, + dx = 1, + dy = 1, + padding = constantZero; + + function pack(root) { + root.x = dx / 2, root.y = dy / 2; + if (radius) { + root.eachBefore(radiusLeaf(radius)) + .eachAfter(packChildren(padding, 0.5)) + .eachBefore(translateChild(1)); + } else { + root.eachBefore(radiusLeaf(defaultRadius)) + .eachAfter(packChildren(constantZero, 1)) + .eachAfter(packChildren(padding, root.r / Math.min(dx, dy))) + .eachBefore(translateChild(Math.min(dx, dy) / (2 * root.r))); + } + return root; + } + + pack.radius = function(x) { + return arguments.length ? (radius = optional$2(x), pack) : radius; + }; + + pack.size = function(x) { + return arguments.length ? (dx = +x[0], dy = +x[1], pack) : [dx, dy]; + }; + + pack.padding = function(x) { + return arguments.length ? (padding = typeof x === "function" ? x : constant$4(+x), pack) : padding; + }; + + return pack; +} + +function radiusLeaf(radius) { + return function(node) { + if (!node.children) { + node.r = Math.max(0, +radius(node) || 0); + } + }; +} + +function packChildren(padding, k) { + return function(node) { + if (children = node.children) { + var children, + i, + n = children.length, + r = padding(node) * k || 0, + e; + + if (r) for (i = 0; i < n; ++i) children[i].r += r; + e = packEnclose(children); + if (r) for (i = 0; i < n; ++i) children[i].r -= r; + node.r = e + r; + } + }; +} + +function translateChild(k) { + return function(node) { + var parent = node.parent; + node.r *= k; + if (parent) { + node.x = parent.x + k * node.x; + node.y = parent.y + k * node.y; + } + }; +} + +function roundNode(node) { + node.x0 = Math.round(node.x0); + node.y0 = Math.round(node.y0); + node.x1 = Math.round(node.x1); + node.y1 = Math.round(node.y1); +} + +function treemapDice(parent, x0, y0, x1, y1) { + var nodes = parent.children, + node, + i = -1, + n = nodes.length, + k = parent.value && (x1 - x0) / parent.value; + + while (++i < n) { + node = nodes[i], node.y0 = y0, node.y1 = y1; + node.x0 = x0, node.x1 = x0 += node.value * k; + } +} + +function partition$2() { + var dx = 1, + dy = 1, + padding = 0, + round = false; + + function partition(root) { + var n = root.height + 1; + root.x0 = + root.y0 = padding; + root.x1 = dx; + root.y1 = dy / n; + root.eachBefore(positionNode(dy, n)); + if (round) root.eachBefore(roundNode); + return root; + } + + function positionNode(dy, n) { + return function(node) { + if (node.children) { + treemapDice(node, node.x0, dy * (node.depth + 1) / n, node.x1, dy * (node.depth + 2) / n); + } + var x0 = node.x0, + y0 = node.y0, + x1 = node.x1 - padding, + y1 = node.y1 - padding; + if (x1 < x0) x0 = x1 = (x0 + x1) / 2; + if (y1 < y0) y0 = y1 = (y0 + y1) / 2; + node.x0 = x0; + node.y0 = y0; + node.x1 = x1; + node.y1 = y1; + }; + } + + partition.round = function(x) { + return arguments.length ? (round = !!x, partition) : round; + }; + + partition.size = function(x) { + return arguments.length ? (dx = +x[0], dy = +x[1], partition) : [dx, dy]; + }; + + partition.padding = function(x) { + return arguments.length ? (padding = +x, partition) : padding; + }; + + return partition; +} + +var preroot = {depth: -1}, + ambiguous = {}; + +function defaultId$1(d) { + return d.id; +} + +function defaultParentId(d) { + return d.parentId; +} + +function stratify() { + var id = defaultId$1, + parentId = defaultParentId; + + function stratify(data) { + var nodes = Array.from(data), + n = nodes.length, + d, + i, + root, + parent, + node, + nodeId, + nodeKey, + nodeByKey = new Map; + + for (i = 0; i < n; ++i) { + d = nodes[i], node = nodes[i] = new Node$3(d); + if ((nodeId = id(d, i, data)) != null && (nodeId += "")) { + nodeKey = node.id = nodeId; + nodeByKey.set(nodeKey, nodeByKey.has(nodeKey) ? ambiguous : node); + } + if ((nodeId = parentId(d, i, data)) != null && (nodeId += "")) { + node.parent = nodeId; + } + } + + for (i = 0; i < n; ++i) { + node = nodes[i]; + if (nodeId = node.parent) { + parent = nodeByKey.get(nodeId); + if (!parent) throw new Error("missing: " + nodeId); + if (parent === ambiguous) throw new Error("ambiguous: " + nodeId); + if (parent.children) parent.children.push(node); + else parent.children = [node]; + node.parent = parent; + } else { + if (root) throw new Error("multiple roots"); + root = node; + } + } + + if (!root) throw new Error("no root"); + root.parent = preroot; + root.eachBefore(function(node) { node.depth = node.parent.depth + 1; --n; }).eachBefore(computeHeight); + root.parent = null; + if (n > 0) throw new Error("cycle"); + + return root; + } + + stratify.id = function(x) { + return arguments.length ? (id = required(x), stratify) : id; + }; + + stratify.parentId = function(x) { + return arguments.length ? (parentId = required(x), stratify) : parentId; + }; + + return stratify; +} + +function defaultSeparation(a, b) { + return a.parent === b.parent ? 1 : 2; +} + +// function radialSeparation(a, b) { +// return (a.parent === b.parent ? 1 : 2) / a.depth; +// } + +// This function is used to traverse the left contour of a subtree (or +// subforest). It returns the successor of v on this contour. This successor is +// either given by the leftmost child of v or by the thread of v. The function +// returns null if and only if v is on the highest level of its subtree. +function nextLeft(v) { + var children = v.children; + return children ? children[0] : v.t; +} + +// This function works analogously to nextLeft. +function nextRight(v) { + var children = v.children; + return children ? children[children.length - 1] : v.t; +} + +// Shifts the current subtree rooted at w+. This is done by increasing +// prelim(w+) and mod(w+) by shift. +function moveSubtree(wm, wp, shift) { + var change = shift / (wp.i - wm.i); + wp.c -= change; + wp.s += shift; + wm.c += change; + wp.z += shift; + wp.m += shift; +} + +// All other shifts, applied to the smaller subtrees between w- and w+, are +// performed by this function. To prepare the shifts, we have to adjust +// change(w+), shift(w+), and change(w-). +function executeShifts(v) { + var shift = 0, + change = 0, + children = v.children, + i = children.length, + w; + while (--i >= 0) { + w = children[i]; + w.z += shift; + w.m += shift; + shift += w.s + (change += w.c); + } +} + +// If vi-’s ancestor is a sibling of v, returns vi-’s ancestor. Otherwise, +// returns the specified (default) ancestor. +function nextAncestor(vim, v, ancestor) { + return vim.a.parent === v.parent ? vim.a : ancestor; +} + +function TreeNode(node, i) { + this._ = node; + this.parent = null; + this.children = null; + this.A = null; // default ancestor + this.a = this; // ancestor + this.z = 0; // prelim + this.m = 0; // mod + this.c = 0; // change + this.s = 0; // shift + this.t = null; // thread + this.i = i; // number +} + +TreeNode.prototype = Object.create(Node$3.prototype); + +function treeRoot(root) { + var tree = new TreeNode(root, 0), + node, + nodes = [tree], + child, + children, + i, + n; + + while (node = nodes.pop()) { + if (children = node._.children) { + node.children = new Array(n = children.length); + for (i = n - 1; i >= 0; --i) { + nodes.push(child = node.children[i] = new TreeNode(children[i], i)); + child.parent = node; + } + } + } + + (tree.parent = new TreeNode(null, 0)).children = [tree]; + return tree; +} + +// Node-link tree diagram using the Reingold-Tilford "tidy" algorithm +function tree() { + var separation = defaultSeparation, + dx = 1, + dy = 1, + nodeSize = null; + + function tree(root) { + var t = treeRoot(root); + + // Compute the layout using Buchheim et al.’s algorithm. + t.eachAfter(firstWalk), t.parent.m = -t.z; + t.eachBefore(secondWalk); + + // If a fixed node size is specified, scale x and y. + if (nodeSize) root.eachBefore(sizeNode); + + // If a fixed tree size is specified, scale x and y based on the extent. + // Compute the left-most, right-most, and depth-most nodes for extents. + else { + var left = root, + right = root, + bottom = root; + root.eachBefore(function(node) { + if (node.x < left.x) left = node; + if (node.x > right.x) right = node; + if (node.depth > bottom.depth) bottom = node; + }); + var s = left === right ? 1 : separation(left, right) / 2, + tx = s - left.x, + kx = dx / (right.x + s + tx), + ky = dy / (bottom.depth || 1); + root.eachBefore(function(node) { + node.x = (node.x + tx) * kx; + node.y = node.depth * ky; + }); + } + + return root; + } + + // Computes a preliminary x-coordinate for v. Before that, FIRST WALK is + // applied recursively to the children of v, as well as the function + // APPORTION. After spacing out the children by calling EXECUTE SHIFTS, the + // node v is placed to the midpoint of its outermost children. + function firstWalk(v) { + var children = v.children, + siblings = v.parent.children, + w = v.i ? siblings[v.i - 1] : null; + if (children) { + executeShifts(v); + var midpoint = (children[0].z + children[children.length - 1].z) / 2; + if (w) { + v.z = w.z + separation(v._, w._); + v.m = v.z - midpoint; + } else { + v.z = midpoint; + } + } else if (w) { + v.z = w.z + separation(v._, w._); + } + v.parent.A = apportion(v, w, v.parent.A || siblings[0]); + } + + // Computes all real x-coordinates by summing up the modifiers recursively. + function secondWalk(v) { + v._.x = v.z + v.parent.m; + v.m += v.parent.m; + } + + // The core of the algorithm. Here, a new subtree is combined with the + // previous subtrees. Threads are used to traverse the inside and outside + // contours of the left and right subtree up to the highest common level. The + // vertices used for the traversals are vi+, vi-, vo-, and vo+, where the + // superscript o means outside and i means inside, the subscript - means left + // subtree and + means right subtree. For summing up the modifiers along the + // contour, we use respective variables si+, si-, so-, and so+. Whenever two + // nodes of the inside contours conflict, we compute the left one of the + // greatest uncommon ancestors using the function ANCESTOR and call MOVE + // SUBTREE to shift the subtree and prepare the shifts of smaller subtrees. + // Finally, we add a new thread (if necessary). + function apportion(v, w, ancestor) { + if (w) { + var vip = v, + vop = v, + vim = w, + vom = vip.parent.children[0], + sip = vip.m, + sop = vop.m, + sim = vim.m, + som = vom.m, + shift; + while (vim = nextRight(vim), vip = nextLeft(vip), vim && vip) { + vom = nextLeft(vom); + vop = nextRight(vop); + vop.a = v; + shift = vim.z + sim - vip.z - sip + separation(vim._, vip._); + if (shift > 0) { + moveSubtree(nextAncestor(vim, v, ancestor), v, shift); + sip += shift; + sop += shift; + } + sim += vim.m; + sip += vip.m; + som += vom.m; + sop += vop.m; + } + if (vim && !nextRight(vop)) { + vop.t = vim; + vop.m += sim - sop; + } + if (vip && !nextLeft(vom)) { + vom.t = vip; + vom.m += sip - som; + ancestor = v; + } + } + return ancestor; + } + + function sizeNode(node) { + node.x *= dx; + node.y = node.depth * dy; + } + + tree.separation = function(x) { + return arguments.length ? (separation = x, tree) : separation; + }; + + tree.size = function(x) { + return arguments.length ? (nodeSize = false, dx = +x[0], dy = +x[1], tree) : (nodeSize ? null : [dx, dy]); + }; + + tree.nodeSize = function(x) { + return arguments.length ? (nodeSize = true, dx = +x[0], dy = +x[1], tree) : (nodeSize ? [dx, dy] : null); + }; + + return tree; +} + +function treemapSlice(parent, x0, y0, x1, y1) { + var nodes = parent.children, + node, + i = -1, + n = nodes.length, + k = parent.value && (y1 - y0) / parent.value; + + while (++i < n) { + node = nodes[i], node.x0 = x0, node.x1 = x1; + node.y0 = y0, node.y1 = y0 += node.value * k; + } +} + +var phi = (1 + Math.sqrt(5)) / 2; + +function squarifyRatio(ratio, parent, x0, y0, x1, y1) { + var rows = [], + nodes = parent.children, + row, + nodeValue, + i0 = 0, + i1 = 0, + n = nodes.length, + dx, dy, + value = parent.value, + sumValue, + minValue, + maxValue, + newRatio, + minRatio, + alpha, + beta; + + while (i0 < n) { + dx = x1 - x0, dy = y1 - y0; + + // Find the next non-empty node. + do sumValue = nodes[i1++].value; while (!sumValue && i1 < n); + minValue = maxValue = sumValue; + alpha = Math.max(dy / dx, dx / dy) / (value * ratio); + beta = sumValue * sumValue * alpha; + minRatio = Math.max(maxValue / beta, beta / minValue); + + // Keep adding nodes while the aspect ratio maintains or improves. + for (; i1 < n; ++i1) { + sumValue += nodeValue = nodes[i1].value; + if (nodeValue < minValue) minValue = nodeValue; + if (nodeValue > maxValue) maxValue = nodeValue; + beta = sumValue * sumValue * alpha; + newRatio = Math.max(maxValue / beta, beta / minValue); + if (newRatio > minRatio) { sumValue -= nodeValue; break; } + minRatio = newRatio; + } + + // Position and record the row orientation. + rows.push(row = {value: sumValue, dice: dx < dy, children: nodes.slice(i0, i1)}); + if (row.dice) treemapDice(row, x0, y0, x1, value ? y0 += dy * sumValue / value : y1); + else treemapSlice(row, x0, y0, value ? x0 += dx * sumValue / value : x1, y1); + value -= sumValue, i0 = i1; + } + + return rows; +} + +var squarify = (function custom(ratio) { + + function squarify(parent, x0, y0, x1, y1) { + squarifyRatio(ratio, parent, x0, y0, x1, y1); + } + + squarify.ratio = function(x) { + return custom((x = +x) > 1 ? x : 1); + }; + + return squarify; +})(phi); + +function index$2() { + var tile = squarify, + round = false, + dx = 1, + dy = 1, + paddingStack = [0], + paddingInner = constantZero, + paddingTop = constantZero, + paddingRight = constantZero, + paddingBottom = constantZero, + paddingLeft = constantZero; + + function treemap(root) { + root.x0 = + root.y0 = 0; + root.x1 = dx; + root.y1 = dy; + root.eachBefore(positionNode); + paddingStack = [0]; + if (round) root.eachBefore(roundNode); + return root; + } + + function positionNode(node) { + var p = paddingStack[node.depth], + x0 = node.x0 + p, + y0 = node.y0 + p, + x1 = node.x1 - p, + y1 = node.y1 - p; + if (x1 < x0) x0 = x1 = (x0 + x1) / 2; + if (y1 < y0) y0 = y1 = (y0 + y1) / 2; + node.x0 = x0; + node.y0 = y0; + node.x1 = x1; + node.y1 = y1; + if (node.children) { + p = paddingStack[node.depth + 1] = paddingInner(node) / 2; + x0 += paddingLeft(node) - p; + y0 += paddingTop(node) - p; + x1 -= paddingRight(node) - p; + y1 -= paddingBottom(node) - p; + if (x1 < x0) x0 = x1 = (x0 + x1) / 2; + if (y1 < y0) y0 = y1 = (y0 + y1) / 2; + tile(node, x0, y0, x1, y1); + } + } + + treemap.round = function(x) { + return arguments.length ? (round = !!x, treemap) : round; + }; + + treemap.size = function(x) { + return arguments.length ? (dx = +x[0], dy = +x[1], treemap) : [dx, dy]; + }; + + treemap.tile = function(x) { + return arguments.length ? (tile = required(x), treemap) : tile; + }; + + treemap.padding = function(x) { + return arguments.length ? treemap.paddingInner(x).paddingOuter(x) : treemap.paddingInner(); + }; + + treemap.paddingInner = function(x) { + return arguments.length ? (paddingInner = typeof x === "function" ? x : constant$4(+x), treemap) : paddingInner; + }; + + treemap.paddingOuter = function(x) { + return arguments.length ? treemap.paddingTop(x).paddingRight(x).paddingBottom(x).paddingLeft(x) : treemap.paddingTop(); + }; + + treemap.paddingTop = function(x) { + return arguments.length ? (paddingTop = typeof x === "function" ? x : constant$4(+x), treemap) : paddingTop; + }; + + treemap.paddingRight = function(x) { + return arguments.length ? (paddingRight = typeof x === "function" ? x : constant$4(+x), treemap) : paddingRight; + }; + + treemap.paddingBottom = function(x) { + return arguments.length ? (paddingBottom = typeof x === "function" ? x : constant$4(+x), treemap) : paddingBottom; + }; + + treemap.paddingLeft = function(x) { + return arguments.length ? (paddingLeft = typeof x === "function" ? x : constant$4(+x), treemap) : paddingLeft; + }; + + return treemap; +} + +function binary(parent, x0, y0, x1, y1) { + var nodes = parent.children, + i, n = nodes.length, + sum, sums = new Array(n + 1); + + for (sums[0] = sum = i = 0; i < n; ++i) { + sums[i + 1] = sum += nodes[i].value; + } + + partition(0, n, parent.value, x0, y0, x1, y1); + + function partition(i, j, value, x0, y0, x1, y1) { + if (i >= j - 1) { + var node = nodes[i]; + node.x0 = x0, node.y0 = y0; + node.x1 = x1, node.y1 = y1; + return; + } + + var valueOffset = sums[i], + valueTarget = (value / 2) + valueOffset, + k = i + 1, + hi = j - 1; + + while (k < hi) { + var mid = k + hi >>> 1; + if (sums[mid] < valueTarget) k = mid + 1; + else hi = mid; + } + + if ((valueTarget - sums[k - 1]) < (sums[k] - valueTarget) && i + 1 < k) --k; + + var valueLeft = sums[k] - valueOffset, + valueRight = value - valueLeft; + + if ((x1 - x0) > (y1 - y0)) { + var xk = value ? (x0 * valueRight + x1 * valueLeft) / value : x1; + partition(i, k, valueLeft, x0, y0, xk, y1); + partition(k, j, valueRight, xk, y0, x1, y1); + } else { + var yk = value ? (y0 * valueRight + y1 * valueLeft) / value : y1; + partition(i, k, valueLeft, x0, y0, x1, yk); + partition(k, j, valueRight, x0, yk, x1, y1); + } + } +} + +function sliceDice(parent, x0, y0, x1, y1) { + (parent.depth & 1 ? treemapSlice : treemapDice)(parent, x0, y0, x1, y1); +} + +var resquarify = (function custom(ratio) { + + function resquarify(parent, x0, y0, x1, y1) { + if ((rows = parent._squarify) && (rows.ratio === ratio)) { + var rows, + row, + nodes, + i, + j = -1, + n, + m = rows.length, + value = parent.value; + + while (++j < m) { + row = rows[j], nodes = row.children; + for (i = row.value = 0, n = nodes.length; i < n; ++i) row.value += nodes[i].value; + if (row.dice) treemapDice(row, x0, y0, x1, value ? y0 += (y1 - y0) * row.value / value : y1); + else treemapSlice(row, x0, y0, value ? x0 += (x1 - x0) * row.value / value : x1, y1); + value -= row.value; + } + } else { + parent._squarify = rows = squarifyRatio(ratio, parent, x0, y0, x1, y1); + rows.ratio = ratio; + } + } + + resquarify.ratio = function(x) { + return custom((x = +x) > 1 ? x : 1); + }; + + return resquarify; +})(phi); + +var d3Hierarchy = /*#__PURE__*/Object.freeze({ + __proto__: null, + cluster: cluster, + hierarchy: hierarchy$1, + pack: index$3, + packSiblings: siblings, + packEnclose: enclose, + partition: partition$2, + stratify: stratify, + tree: tree, + treemap: index$2, + treemapBinary: binary, + treemapDice: treemapDice, + treemapSlice: treemapSlice, + treemapSliceDice: sliceDice, + treemapSquarify: squarify, + treemapResquarify: resquarify +}); + +var DEFAULT_OPTIONS$b = { + field: 'value', + size: [1, 1], + round: false, + padding: 0, + // 默认降序 + sort: function (a, b) { return b.value - a.value; }, + as: ['x', 'y'], + // 是否忽略 parentValue, 当设置为 true 时，父节点的权重由子元素决定 + ignoreParentValue: true, +}; +function partition$1(data, options) { + options = mix({}, DEFAULT_OPTIONS$b, options); + var as = options.as; + if (!isArray$n(as) || as.length !== 2) { + throw new TypeError('Invalid as: it must be an array with 2 strings (e.g. [ "x", "y" ])!'); + } + var field; + try { + field = getField(options); + } + catch (e) { + console.warn(e); + } + var partition = function (data) { + return partition$2().size(options.size).round(options.round).padding(options.padding)( + /** + * d3Hierarchy 布局中需指定 sum 函数计算 node 值，规则是：从当前 node 开始以 post-order traversal 的次序为当前节点以及每个后代节点调用指定的 value 函数，并返回当前 node。 + * for example: + * { node: 'parent', value: 10, children: [{node: 'child1', value: 5}, {node: 'child2', value: 5}, ]} + * parent 所得的计算值是 sum(node(parent)) + sum(node(child1)) + sum(node(child2)) + * sum 函数中，d 为用户传入的 data, children 为保留字段 + */ + hierarchy$1(data) + .sum(function (d) { + return size$1(d.children) + ? options.ignoreParentValue + ? 0 + : d[field] - reduce$1(d.children, function (a, b) { return a + b[field]; }, 0) + : d[field]; + }) + .sort(options.sort)); + }; + var root = partition(data); + /* + * points: + * 3 2 + * 0 1 + */ + var x = as[0]; + var y = as[1]; + root.each(function (node) { + var _a, _b; + node[x] = [node.x0, node.x1, node.x1, node.x0]; + node[y] = [node.y1, node.y1, node.y0, node.y0]; + // 旭日图兼容下 旧版本 + node.name = node.name || ((_a = node.data) === null || _a === void 0 ? void 0 : _a.name) || ((_b = node.data) === null || _b === void 0 ? void 0 : _b.label); + node.data.name = node.name; + ['x0', 'x1', 'y0', 'y1'].forEach(function (prop) { + if (as.indexOf(prop) === -1) { + delete node[prop]; + } + }); + }); + return getAllNodes(root); +} + +var DEFAULT_OPTIONS$a = { + field: 'value', + tile: 'treemapSquarify', + size: [1, 1], + round: false, + ignoreParentValue: true, + padding: 0, + paddingInner: 0, + paddingOuter: 0, + paddingTop: 0, + paddingRight: 0, + paddingBottom: 0, + paddingLeft: 0, + as: ['x', 'y'], + // 默认降序 + sort: function (a, b) { return b.value - a.value; }, + // 纵横比, treemapSquarify 布局时可用，默认黄金分割比例 + ratio: 0.5 * (1 + Math.sqrt(5)), +}; +function getTileMethod(tile, ratio) { + return tile === 'treemapSquarify' ? d3Hierarchy[tile].ratio(ratio) : d3Hierarchy[tile]; +} +function treemap(data, options) { + options = mix({}, DEFAULT_OPTIONS$a, options); + var as = options.as; + if (!isArray$n(as) || as.length !== 2) { + throw new TypeError('Invalid as: it must be an array with 2 strings (e.g. [ "x", "y" ])!'); + } + var field; + try { + field = getField(options); + } + catch (e) { + console.warn(e); + } + var tileMethod = getTileMethod(options.tile, options.ratio); + var partition = function (data) { + return index$2() + .tile(tileMethod) + .size(options.size) + .round(options.round) + .padding(options.padding) + .paddingInner(options.paddingInner) + .paddingOuter(options.paddingOuter) + .paddingTop(options.paddingTop) + .paddingRight(options.paddingRight) + .paddingBottom(options.paddingBottom) + .paddingLeft(options.paddingLeft)( + /** + * d3Hierarchy 布局中需指定 sum 函数计算 node 值，规则是：从当前 node 开始以 post-order traversal 的次序为当前节点以及每个后代节点调用指定的 value 函数，并返回当前 node。 + * for example: + * { node: 'parent', value: 10, children: [{node: 'child1', value: 5}, {node: 'child2', value: 5}, ]} + * parent 所得的计算值是 sum(node(parent)) + sum(node(child1)) + sum(node(child2)) + * ignoreParentValue 为 true(默认) 时，父元素的值由子元素累加而来，该值为 0 + 5 + 5 = 10 + * ignoreParentValue 为 false 时，父元素的值由当前节点 及子元素累加而来，该值为 10 + 5 + 5 = 20 + * sum 函数中，d 为用户传入的 data, children 为保留字段 + */ + hierarchy$1(data) + .sum(function (d) { return (options.ignoreParentValue && d.children ? 0 : d[field]); }) + .sort(options.sort)); + }; + var root = partition(data); + /* + * points: + * 3 2 + * 0 1 + */ + var x = as[0]; + var y = as[1]; + root.each(function (node) { + node[x] = [node.x0, node.x1, node.x1, node.x0]; + node[y] = [node.y1, node.y1, node.y0, node.y0]; + ['x0', 'x1', 'y0', 'y1'].forEach(function (prop) { + if (as.indexOf(prop) === -1) { + delete node[prop]; + } + }); + }); + return getAllNodes(root); +} + +/** + * sunburst 处理数据 + * @param options + */ +function transformData$5(options) { + var data = options.data, colorField = options.colorField, rawFields = options.rawFields, _a = options.hierarchyConfig, hierarchyConfig = _a === void 0 ? {} : _a; + var transform = { + partition: partition$1, + treemap: treemap, + }; + // @ts-ignore 兼容旧版本，支持 seriesField 来作为 hierarchyConfig.field + var seriesField = options.seriesField; + // @ts-ignore 兼容旧版本，支持矩阵树图形状的旭日图 + var type = options.type || 'partition'; + var nodes = transform[type](data, __assign$r(__assign$r({ field: seriesField || 'value' }, hierarchyConfig), { + // @ts-ignore + type: "hierarchy." + type, as: ['x', 'y'] })); + var result = []; + nodes.forEach(function (node) { + var _a; + var _b, _c, _d, _e, _f; + if (node.depth === 0) { + return null; + } + var path = node.data.name; + var ancestorNode = __assign$r({}, node); + while (ancestorNode.depth > 1) { + path = ((_b = ancestorNode.parent.data) === null || _b === void 0 ? void 0 : _b.name) + " / " + path; + ancestorNode = ancestorNode.parent; + } + var nodeInfo = __assign$r(__assign$r(__assign$r({}, pick$1(node.data, __spreadArrays$1((rawFields || []), [hierarchyConfig.field]))), (_a = {}, _a[SUNBURST_PATH_FIELD] = path, _a[SUNBURST_ANCESTOR_FIELD] = ancestorNode.data.name, _a)), node); + // note: 兼容旧版本 + if (seriesField) { + nodeInfo[seriesField] = node.data[seriesField] || ((_d = (_c = node.parent) === null || _c === void 0 ? void 0 : _c.data) === null || _d === void 0 ? void 0 : _d[seriesField]); + } + if (colorField) { + nodeInfo[colorField] = node.data[colorField] || ((_f = (_e = node.parent) === null || _e === void 0 ? void 0 : _e.data) === null || _f === void 0 ? void 0 : _f[colorField]); + } + nodeInfo.ext = hierarchyConfig; + nodeInfo[HIERARCHY_DATA_TRANSFORM_PARAMS] = { hierarchyConfig: hierarchyConfig, colorField: colorField, rawFields: rawFields }; + result.push(nodeInfo); + }); + return result; +} + +/** + * geometry 配置处理 + * @param params + */ +function geometry$7(params) { + var chart = params.chart, options = params.options; + var color = options.color, _a = options.colorField, colorField = _a === void 0 ? SUNBURST_ANCESTOR_FIELD : _a, sunburstStyle = options.sunburstStyle, _b = options.rawFields, rawFields = _b === void 0 ? [] : _b; + var data = transformData$5(options); + chart.data(data); + // 特殊处理下样式，如果没有设置 fillOpacity 的时候，默认根据层级进行填充透明度 + var style; + if (sunburstStyle) { + style = function (datum) { + return deepAssign({}, { + fillOpacity: Math.pow(0.85, datum.depth), + }, isFunction$6(sunburstStyle) ? sunburstStyle(datum) : sunburstStyle); + }; + } + // geometry + polygon(deepAssign({}, params, { + options: { + xField: 'x', + yField: 'y', + seriesField: colorField, + rawFields: uniq$3(__spreadArrays$1(RAW_FIELDS$1, rawFields)), + polygon: { + color: color, + style: style, + }, + }, + })); + return params; +} +/** + * axis 配置 + * @param params + */ +function axis$6(params) { + var chart = params.chart; + chart.axis(false); + return params; +} +/** + * legend 配置（旭日图暂时不支持图例，后续需要支持的话，得自定义数据筛选） + * @param params + * @returns + */ +function legend$2(params) { + var chart = params.chart; + chart.legend(false); + return params; +} +/** + * 数据标签 + * @param params + */ +function label$3(params) { + var chart = params.chart, options = params.options; + var label = options.label; + var geometry = findGeometry(chart, 'polygon'); + // 默认不展示，undefined 也不展示 + if (!label) { + geometry.label(false); + } + else { + var _a = label.fields, fields = _a === void 0 ? ['name'] : _a, callback = label.callback, cfg = __rest$G(label, ["fields", "callback"]); + geometry.label({ + fields: fields, + callback: callback, + cfg: transformLabel(cfg), + }); + } + return params; +} +/** + * coord 配置 + * @param params + */ +function coordinate$2(params) { + var chart = params.chart, options = params.options; + var innerRadius = options.innerRadius, radius = options.radius, reflect = options.reflect; + var coord = chart.coordinate({ + type: 'polar', + cfg: { + innerRadius: innerRadius, + radius: radius, + }, + }); + if (reflect) { + coord.reflect(reflect); + } + return params; +} +/** + * meta 配置 + * @param params + */ +function meta$5(params) { + var _a; + var options = params.options; + var hierarchyConfig = options.hierarchyConfig, meta = options.meta; + return flow(scale$3({}, (_a = {}, + _a[SUNBURST_Y_FIELD] = get$3(meta, get$3(hierarchyConfig, ['field'], 'value')), + _a)))(params); +} +/** + * tooltip 配置 + * @param params + */ +function tooltip$3(params) { + var chart = params.chart, options = params.options; + var tooltip = options.tooltip; + if (tooltip === false) { + chart.tooltip(false); + } + else { + var tooltipOptions = tooltip; + // 设置了 fields，就不进行 customItems 了; 设置 formatter 时，需要搭配 fields + if (!get$3(tooltip, 'fields')) { + tooltipOptions = deepAssign({}, { + customItems: function (items) { + return items.map(function (item) { + var scales = get$3(chart.getOptions(), 'scales'); + var pathFormatter = get$3(scales, [SUNBURST_PATH_FIELD, 'formatter'], function (v) { return v; }); + var valueFormatter = get$3(scales, [SUNBURST_Y_FIELD, 'formatter'], function (v) { return v; }); + return __assign$r(__assign$r({}, item), { name: pathFormatter(item.data[SUNBURST_PATH_FIELD]), value: valueFormatter(item.data.value) }); + }); + }, + }, tooltipOptions); + } + chart.tooltip(tooltipOptions); + } + return params; +} +function adaptorInteraction$2(options) { + var drilldown = options.drilldown, _a = options.interactions, interactions = _a === void 0 ? [] : _a; + if (drilldown === null || drilldown === void 0 ? void 0 : drilldown.enabled) { + return deepAssign({}, options, { + interactions: __spreadArrays$1(interactions, [ + { + type: 'drill-down', + cfg: { drillDownConfig: drilldown, transformData: transformData$5 }, + }, + ]), + }); + } + return options; +} +/** + * 交互配置 + * @param params + * @returns + */ +function interaction$3(params) { + var chart = params.chart, options = params.options; + var drilldown = options.drilldown; + interaction$6({ + chart: chart, + options: adaptorInteraction$2(options), + }); + // 适应下钻交互面包屑 + if (drilldown === null || drilldown === void 0 ? void 0 : drilldown.enabled) { + // 为面包屑留出 25px 的空间 + chart.appendPadding = getAdjustAppendPadding(chart.appendPadding, get$3(drilldown, ['breadCrumb', 'position'])); + } + return params; +} +/** + * 旭日图适配器 + * @param chart + * @param options + */ +function adaptor$a(params) { + // flow 的方式处理所有的配置到 G2 API + return flow(theme$2, pattern('sunburstStyle'), geometry$7, axis$6, meta$5, legend$2, coordinate$2, tooltip$3, label$3, interaction$3, animation$5, annotation$2())(params); +} + +/** + * 判断是否为父节点 + */ +function isParentNode(context) { + var data = get$3(context, ['event', 'data', 'data'], {}); + return isArray$n(data.children) && data.children.length > 0; +} +registerAction('drill-down-action', DrillDownAction); +registerInteraction('drill-down', { + showEnable: [ + { trigger: 'element:mouseenter', action: 'cursor:pointer', isEnable: isParentNode }, + { trigger: 'element:mouseleave', action: 'cursor:default' }, + ], + start: [ + { + trigger: 'element:click', + isEnable: isParentNode, + action: ['drill-down-action:click'], + }, + { + trigger: 'afterchangesize', + action: ['drill-down-action:resetPosition'], + }, + ], +}); + +var Sunburst$1 = /** @class */ (function (_super) { + __extends$e(Sunburst, _super); + function Sunburst() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'sunburst'; + return _this; + } + /** + * 获取 旭日图 默认配置项 + * 供外部使用 + */ + Sunburst.getDefaultOptions = function () { + return DEFAULT_OPTIONS$c; + }; + /** + * 获取 旭日图 默认配置 + */ + Sunburst.prototype.getDefaultOptions = function () { + return Sunburst.getDefaultOptions(); + }; + /** + * 获取旭日图的适配器 + */ + Sunburst.prototype.getSchemaAdaptor = function () { + return adaptor$a; + }; + /** 旭日图 节点的祖先节点 */ + Sunburst.SUNBURST_ANCESTOR_FIELD = SUNBURST_ANCESTOR_FIELD; + /** 旭日图 节点的路径 */ + Sunburst.SUNBURST_PATH_FIELD = SUNBURST_PATH_FIELD; + /** 节点的祖先节点 */ + Sunburst.NODE_ANCESTORS_FIELD = NODE_ANCESTORS_FIELD; + return Sunburst; +}(Plot)); + +var _a; +var RANGE_VALUE = 'range'; +var RANGE_TYPE = 'type'; +var PERCENT = 'percent'; +var DEFAULT_COLOR = '#f0f0f0'; +/** 仪表盘由 指针和表盘 组成 */ +var INDICATEOR_VIEW_ID = 'indicator-view'; +var RANGE_VIEW_ID = 'range-view'; +/** meter 类型的仪表盘 带 mask 的 view */ +var MASK_VIEW_ID = 'range-mask-view'; +/** + * 仪表盘默认配置项 + */ +var DEFAULT_OPTIONS$9 = { + percent: 0, + range: { + ticks: [], + }, + innerRadius: 0.9, + radius: 0.95, + startAngle: (-7 / 6) * Math.PI, + endAngle: (1 / 6) * Math.PI, + syncViewPadding: true, + axis: { + line: null, + label: { + offset: -24, + style: { + textAlign: 'center', + textBaseline: 'middle', + }, + }, + subTickLine: { + length: -8, + }, + tickLine: { + length: -12, + }, + grid: null, + }, + indicator: { + pointer: { + style: { + lineWidth: 5, + lineCap: 'round', + }, + }, + pin: { + style: { + r: 9.75, + lineWidth: 4.5, + fill: '#fff', + }, + }, + }, + statistic: { + title: false, + }, + meta: (_a = {}, + // 两个 view 的 scale 同步到 v 上 + _a[RANGE_VALUE] = { + sync: 'v', + }, + _a[PERCENT] = { + sync: 'v', + tickCount: 5, + tickInterval: 0.2, + }, + _a), + animation: false, +}; + +/** + * 将 range 生成为 data 数据 + * @param range + * @param key + * @returns {GaugeRangeData} + */ +function processRangeData(range, percent) { + return (range + // 映射为 stack 的数据 + .map(function (r, idx) { + var _a; + return _a = {}, _a[RANGE_VALUE] = r - (range[idx - 1] || 0), _a[RANGE_TYPE] = "" + idx, _a[PERCENT] = percent, _a; + }) + // 去掉 0 的数据 + .filter(function (d) { return !!d[RANGE_VALUE]; })); +} +/** + * 获取 仪表盘 指针数据 + * @param percent + */ +function getIndicatorData(percent) { + var _a; + return [(_a = {}, _a[PERCENT] = clamp$1(percent, 0, 1), _a)]; +} +/** + * 获取仪表盘 表盘弧形数据 + * @param percent + * @param range + */ +function getRangeData(percent, range) { + var ticks = get$3(range, ['ticks'], []); + var clampTicks = size$1(ticks) ? ticks : [0, clamp$1(percent, 0, 1), 1]; + return processRangeData(clampTicks, percent); +} + +/** + * geometry 处理 + * @param params + */ +function geometry$6(params) { + var chart = params.chart, options = params.options; + var percent = options.percent, range = options.range, radius = options.radius, innerRadius = options.innerRadius, startAngle = options.startAngle, endAngle = options.endAngle, axis = options.axis, indicator = options.indicator, gaugeStyle = options.gaugeStyle; + var color = range.color, rangeWidth = range.width; + // 指标 & 指针 + // 如果开启在应用 + if (indicator) { + var indicatorData = getIndicatorData(percent); + var v1 = chart.createView({ id: INDICATEOR_VIEW_ID }); + v1.data(indicatorData); + v1.point() + .position(PERCENT + "*1") + .shape('gauge-indicator') + // 传入指针的样式到自定义 shape 中 + .customInfo({ + defaultColor: chart.getTheme().defaultColor, + indicator: indicator, + }); + v1.coordinate('polar', { + startAngle: startAngle, + endAngle: endAngle, + radius: innerRadius * radius, + }); + v1.axis(PERCENT, axis); + // 一部分应用到 scale 中 + v1.scale(PERCENT, pick$1(axis, AXIS_META_CONFIG_KEYS)); + } + // 辅助 range + // [{ range: 1, type: '0', percent: 原始进度百分比 }] + var rangeData = getRangeData(percent, options.range); + var v2 = chart.createView({ id: RANGE_VIEW_ID }); + v2.data(rangeData); + var rangeColor = isString$3(color) ? [color, DEFAULT_COLOR] : color; + interval({ + chart: v2, + options: { + xField: '1', + yField: RANGE_VALUE, + seriesField: RANGE_TYPE, + rawFields: [PERCENT], + isStack: true, + interval: { + color: rangeColor, + style: gaugeStyle, + }, + args: { + zIndexReversed: true, + }, + minColumnWidth: rangeWidth, + maxColumnWidth: rangeWidth, + }, + }); + v2.coordinate('polar', { + innerRadius: innerRadius, + radius: radius, + startAngle: startAngle, + endAngle: endAngle, + }).transpose(); + return params; +} +/** + * meter 类型的仪表盘 有一层 mask + * @param params + */ +function meterView(params) { + var _a; + var chart = params.chart, options = params.options; + var type = options.type, meter = options.meter; + if (type === 'meter') { + var innerRadius = options.innerRadius, radius = options.radius, startAngle = options.startAngle, endAngle = options.endAngle, range = options.range; + var minColumnWidth = range === null || range === void 0 ? void 0 : range.width; + var maxColumnWidth = range === null || range === void 0 ? void 0 : range.width; + var background = chart.getTheme().background; + var color = background; + if (!color || color === 'transparent') { + color = '#fff'; + } + var v3 = chart.createView({ id: MASK_VIEW_ID }); + v3.data([(_a = {}, _a[RANGE_TYPE] = '1', _a[RANGE_VALUE] = 1, _a)]); + var customInfo = { meter: meter }; + v3.interval({ minColumnWidth: minColumnWidth, maxColumnWidth: maxColumnWidth }) + .position("1*" + RANGE_VALUE) + .color(color) + .adjust('stack') + .shape('meter-gauge') + .customInfo(customInfo); + v3.coordinate('polar', { innerRadius: innerRadius, radius: radius, startAngle: startAngle, endAngle: endAngle }).transpose(); + } + return params; +} +/** + * meta 配置 + * @param params + */ +function meta$4(params) { + var _a; + return flow(scale$3((_a = { + range: { + min: 0, + max: 1, + maxLimit: 1, + minLimit: 0, + } + }, + _a[PERCENT] = {}, + _a)))(params); +} +/** + * 统计指标文档 + * @param params + */ +function statistic(params, updated) { + var chart = params.chart, options = params.options; + var statistic = options.statistic, percent = options.percent; + // 先清空标注，再重新渲染 + chart.getController('annotation').clear(true); + if (statistic) { + var contentOption = statistic.content; + var transformContent = void 0; + // 当设置 content 的时候，设置默认样式 + if (contentOption) { + transformContent = deepAssign({}, { + content: (percent * 100).toFixed(2) + "%", + style: { + opacity: 0.75, + fontSize: '30px', + lineHeight: 1, + textAlign: 'center', + color: 'rgba(44,53,66,0.85)', + }, + }, contentOption); + } + renderGaugeStatistic(chart, { statistic: __assign$r(__assign$r({}, statistic), { content: transformContent }) }, { percent: percent }); + } + if (updated) { + chart.render(true); + } + return params; +} +/** + * other 配置 + * @param params + */ +function other(params) { + var chart = params.chart; + chart.legend(false); + chart.tooltip(false); + return params; +} +/** + * 图适配器 + * @param chart + * @param options + */ +function adaptor$9(params) { + // flow 的方式处理所有的配置到 G2 API + return flow(theme$2, + // animation 配置必须在 createView 之前，不然无法让子 View 生效 + animation$5, geometry$6, meta$4, statistic, interaction$6, + // meterView 需要放到主题之后 + meterView, annotation$2(), other + // ... 其他的 adaptor flow + )(params); +} + +// 自定义Shape 部分 +registerShape('point', 'gauge-indicator', { + draw: function (cfg, container) { + // 使用 customInfo 传递参数 + var _a = cfg.customInfo, indicator = _a.indicator, defaultColor = _a.defaultColor; + var _b = indicator, pointer = _b.pointer, pin = _b.pin; + var group = container.addGroup(); + // 获取极坐标系下画布中心点 + var center = this.parsePoint({ x: 0, y: 0 }); + // 绘制指针 + if (pointer) { + // pointer + group.addShape('line', { + name: 'pointer', + attrs: __assign$r({ x1: center.x, y1: center.y, x2: cfg.x, y2: cfg.y, stroke: defaultColor }, pointer.style), + }); + } + // pin + if (pin) { + group.addShape('circle', { + name: 'pin', + attrs: __assign$r({ x: center.x, y: center.y, stroke: defaultColor }, pin.style), + }); + } + return group; + }, +}); + +// 自定义Shape 部分 +registerShape('interval', 'meter-gauge', { + draw: function (cfg, container) { + // 使用 customInfo 传递参数 + var _a = cfg.customInfo.meter, meter = _a === void 0 ? {} : _a; + var _b = meter.steps, STEP = _b === void 0 ? 50 : _b, _c = meter.stepRatio, stepRatio = _c === void 0 ? 0.5 : _c; + var total = this.coordinate.endAngle - this.coordinate.startAngle; + var interval = total / STEP; + var gap = 0; + /** + * stepRatio 取值范围: (0, 1] + * 1: interval : gap = stepRatio : (1 - stepRatio) + * 2: interval * STEP + stepRatio * (STEP - 1) = total + */ + if (stepRatio > 0 && stepRatio <= 1) { + interval = total / (((1 - stepRatio) / stepRatio) * (STEP - 1) + STEP); + gap = (interval * (1 - stepRatio)) / stepRatio; + } + var group = container.addGroup(); + // 绘制 gap + if (gap > 0) { + var center = this.coordinate.getCenter(); + var radius = this.coordinate.getRadius(); + var _d = Util$1.getAngle(cfg, this.coordinate), startAngle = _d.startAngle, endAngle = _d.endAngle; + for (var i = startAngle, j = 0; i < endAngle && j < 2 * STEP - 1; j++) { + var drawn = j % 2; + if (drawn) { + var path = Util$1.getSectorPath(center.x, center.y, radius, i, Math.min(i + gap, endAngle), radius * this.coordinate.innerRadius); + group.addShape('path', { + name: 'meter-gauge-mask', + attrs: { + path: path, + fill: cfg.color, + stroke: cfg.color, + lineWidth: 0.5, + }, + // mask 不需要捕捉事件 + capture: false, + }); + } + i += drawn ? gap : interval; + } + } + return group; + }, +}); + +/** + * 仪表盘 + */ +var Gauge$1 = /** @class */ (function (_super) { + __extends$e(Gauge, _super); + function Gauge() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'gauge'; + return _this; + } + /** + * 获取 仪表盘 默认配置项 + * 供外部使用 + */ + Gauge.getDefaultOptions = function () { + return DEFAULT_OPTIONS$9; + }; + /** + * 更新数据 + * @param percent + */ + Gauge.prototype.changeData = function (percent) { + this.chart.emit(VIEW_LIFE_CIRCLE.BEFORE_CHANGE_DATA, Event$1.fromData(this.chart, VIEW_LIFE_CIRCLE.BEFORE_CHANGE_DATA, null)); + this.updateOption({ percent: percent }); + var indicatorView = this.chart.views.find(function (v) { return v.id === INDICATEOR_VIEW_ID; }); + if (indicatorView) { + indicatorView.data(getIndicatorData(percent)); + } + var rangeView = this.chart.views.find(function (v) { return v.id === RANGE_VIEW_ID; }); + if (rangeView) { + rangeView.data(getRangeData(percent, this.options.range)); + } + // todo 后续让 G2 层在 afterrender 之后，来重绘 annotations + statistic({ chart: this.chart, options: this.options }, true); + this.chart.emit(VIEW_LIFE_CIRCLE.AFTER_CHANGE_DATA, Event$1.fromData(this.chart, VIEW_LIFE_CIRCLE.AFTER_CHANGE_DATA, null)); + }; + /** + * 获取默认配置 + * 供 base 使用 + */ + Gauge.prototype.getDefaultOptions = function () { + return Gauge.getDefaultOptions(); + }; + /** + * 获取适配器 + */ + Gauge.prototype.getSchemaAdaptor = function () { + return adaptor$9; + }; + return Gauge; +}(Plot)); + +var Y_FIELD$2 = '$$yField$$'; +var DIFF_FIELD = '$$diffField$$'; +var ABSOLUTE_FIELD = '$$absoluteField$$'; +var IS_TOTAL = '$$isTotal$$'; +/** + * 瀑布图 默认配置项 + */ +var DEFAULT_OPTIONS$8 = { + /** default: show label */ + label: {}, + /** default: show leaderLine */ + leaderLine: { + style: { + lineWidth: 1, + stroke: '#8c8c8c', + lineDash: [4, 2], + }, + }, + /** default: show total */ + total: { + style: { + fill: 'rgba(0, 0, 0, 0.25)', + }, + }, + interactions: [{ type: 'element-active' }], + risingFill: '#f4664a', + fallingFill: '#30bf78', + waterfallStyle: { + fill: 'rgba(0, 0, 0, 0.25)', + }, + yAxis: { + grid: { + line: { + style: { + lineDash: [4, 2], + }, + }, + }, + }, +}; + +/** + * @desc 数据处理函数，统一将数据处理成[start, end] + * @param data + * @param xField + * @param yField + * @param totalLabel + */ +function processData(data, xField, yField, newYField, total) { + var _a; + var newData = []; + reduce$1(data, function (r, d) { + var _a; + // 校验数据合法性 + log(LEVEL.WARN, isNumber$4(d[yField]), d[yField] + " is not a valid number"); + var value = isUndefined$1(d[yField]) ? null : d[yField]; + newData.push(__assign$r(__assign$r({}, d), (_a = {}, _a[newYField] = [r, r + value], _a))); + return r + value; + }, 0); + // 如果需要展示总和 + if (newData.length && total) { + var sum = get$3(newData, [[data.length - 1], newYField, [1]]); + newData.push((_a = {}, + _a[xField] = total.label, + _a[yField] = sum, + _a[newYField] = [0, sum], + _a)); + } + return newData; +} +/** + * 处理为 瀑布图 数据 + */ +function transformData$4(data, xField, yField, total) { + var processed = processData(data, xField, yField, Y_FIELD$2, total); + return processed.map(function (d, dIdx) { + var _a; + if (!isObject$f(d)) { + return d; + } + return __assign$r(__assign$r({}, d), (_a = {}, _a[ABSOLUTE_FIELD] = d[Y_FIELD$2][1], _a[DIFF_FIELD] = d[Y_FIELD$2][1] - d[Y_FIELD$2][0], _a[IS_TOTAL] = dIdx === data.length, _a)); + }); +} + +/** + * 获取柱子 path + * @param points + */ +function getRectPath$1(points) { + var path = []; + for (var i = 0; i < points.length; i++) { + var point = points[i]; + if (point) { + var action = i === 0 ? 'M' : 'L'; + path.push([action, point.x, point.y]); + } + } + var first = points[0]; + path.push(['L', first.x, first.y]); + path.push(['z']); + return path; +} +/** + * 获取填充属性 + * @param cfg 图形绘制数据 + */ +function getFillAttrs(cfg) { + return deepAssign({}, cfg.defaultStyle, cfg.style, { fill: cfg.color }); +} +registerShape('interval', 'waterfall', { + draw: function (cfg, container) { + var customInfo = cfg.customInfo, points = cfg.points, nextPoints = cfg.nextPoints; + var group = container.addGroup(); + // ① 绘制柱体 + var rectPath = this.parsePath(getRectPath$1(points)); + var fillAttrs = getFillAttrs(cfg); + group.addShape('path', { + attrs: __assign$r(__assign$r({}, fillAttrs), { path: rectPath }), + }); + // ② 绘制连接线 + var leaderLineCfg = get$3(customInfo, 'leaderLine'); + if (leaderLineCfg && nextPoints) { + var linkPath = [ + ['M', points[2].x, points[2].y], + ['L', nextPoints[0].x, nextPoints[0].y], + ]; + if (points[2].y === nextPoints[1].y) { + linkPath[1] = ['L', nextPoints[1].x, nextPoints[1].y]; + } + linkPath = this.parsePath(linkPath); + group.addShape('path', { + attrs: __assign$r({ path: linkPath }, (leaderLineCfg.style || {})), + }); + } + return group; + }, +}); + +/** + * 处理默认配置项 + * @param params + * @returns + */ +function defaultOptions$3(params) { + var _a = params.options, locale = _a.locale, total = _a.total; + var localeTotalLabel = getLocale(locale).get(['waterfall', 'total']); + if (total && typeof total.label !== 'string' && localeTotalLabel) { + // @ts-ignore + params.options.total.label = localeTotalLabel; + } + return params; +} +/** + * 字段 + * @param params + */ +function geometry$5(params) { + var chart = params.chart, options = params.options; + var data = options.data, xField = options.xField, yField = options.yField, total = options.total, leaderLine = options.leaderLine, columnWidthRatio = options.columnWidthRatio, waterfallStyle = options.waterfallStyle, risingFill = options.risingFill, fallingFill = options.fallingFill, color = options.color; + // 数据处理 + chart.data(transformData$4(data, xField, yField, total)); + // 瀑布图自带的 colorMapping + var colorMapping = color || + function (datum) { + if (get$3(datum, [IS_TOTAL])) { + return get$3(total, ['style', 'fill'], ''); + } + return get$3(datum, [Y_FIELD$2, 1]) - get$3(datum, [Y_FIELD$2, 0]) > 0 ? risingFill : fallingFill; + }; + var p = deepAssign({}, params, { + options: { + xField: xField, + yField: Y_FIELD$2, + seriesField: xField, + rawFields: [yField, DIFF_FIELD, IS_TOTAL, Y_FIELD$2], + widthRatio: columnWidthRatio, + interval: { + style: waterfallStyle, + shape: 'waterfall', + color: colorMapping, + }, + }, + }); + var ext = interval(p).ext; + var geometry = ext.geometry; + // 将 waterfall leaderLineCfg 传入到自定义 shape 中 + geometry.customInfo({ leaderLine: leaderLine }); + return params; +} +/** + * meta 配置 + * @param params + */ +function meta$3(params) { + var _a, _b; + var options = params.options; + var xAxis = options.xAxis, yAxis = options.yAxis, xField = options.xField, yField = options.yField, meta = options.meta; + var Y_FIELD_META = deepAssign({}, { alias: yField }, get$3(meta, yField)); + return flow(scale$3((_a = {}, + _a[xField] = xAxis, + _a[yField] = yAxis, + _a[Y_FIELD$2] = yAxis, + _a), deepAssign({}, meta, (_b = {}, _b[Y_FIELD$2] = Y_FIELD_META, _b[DIFF_FIELD] = Y_FIELD_META, _b[ABSOLUTE_FIELD] = Y_FIELD_META, _b))))(params); +} +/** + * axis 配置 + * @param params + */ +function axis$5(params) { + var chart = params.chart, options = params.options; + var xAxis = options.xAxis, yAxis = options.yAxis, xField = options.xField, yField = options.yField; + // 为 false 则是不显示轴 + if (xAxis === false) { + chart.axis(xField, false); + } + else { + chart.axis(xField, xAxis); + } + if (yAxis === false) { + chart.axis(yField, false); + chart.axis(Y_FIELD$2, false); + } + else { + chart.axis(yField, yAxis); + chart.axis(Y_FIELD$2, yAxis); + } + return params; +} +/** + * legend 配置 todo 添加 hover 交互 + * @param params + */ +function legend$1(params) { + var chart = params.chart, options = params.options; + var legend = options.legend, total = options.total, risingFill = options.risingFill, fallingFill = options.fallingFill, locale = options.locale; + var i18n = getLocale(locale); + if (legend === false) { + chart.legend(false); + } + else { + var items = [ + { + name: i18n.get(['general', 'increase']), + value: 'increase', + marker: { symbol: 'square', style: { r: 5, fill: risingFill } }, + }, + { + name: i18n.get(['general', 'decrease']), + value: 'decrease', + marker: { symbol: 'square', style: { r: 5, fill: fallingFill } }, + }, + ]; + if (total) { + items.push({ + name: total.label || '', + value: 'total', + marker: { + symbol: 'square', + style: deepAssign({}, { r: 5 }, get$3(total, 'style')), + }, + }); + } + chart.legend(deepAssign({}, { + custom: true, + position: 'top', + items: items, + }, legend)); + chart.removeInteraction('legend-filter'); + } + return params; +} +/** + * 数据标签 + * @param params + */ +function label$2(params) { + var chart = params.chart, options = params.options; + var label = options.label, labelMode = options.labelMode, xField = options.xField; + var geometry = findGeometry(chart, 'interval'); + if (!label) { + geometry.label(false); + } + else { + var callback = label.callback, cfg = __rest$G(label, ["callback"]); + geometry.label({ + fields: labelMode === 'absolute' ? [ABSOLUTE_FIELD, xField] : [DIFF_FIELD, xField], + callback: callback, + cfg: transformLabel(cfg), + }); + } + return params; +} +/** + * tooltip 配置 + * @param params + */ +function tooltip$2(params) { + var chart = params.chart, options = params.options; + var tooltip = options.tooltip, xField = options.xField, yField = options.yField; + if (tooltip !== false) { + chart.tooltip(__assign$r({ showCrosshairs: false, showMarkers: false, shared: true, + // tooltip 默认展示 y 字段值 + fields: [yField] }, tooltip)); + // 瀑布图默认以 yField 作为 tooltip 内容 + var geometry_1 = chart.geometries[0]; + (tooltip === null || tooltip === void 0 ? void 0 : tooltip.formatter) ? geometry_1.tooltip(xField + "*" + yField, tooltip.formatter) : geometry_1.tooltip(yField); + } + else { + chart.tooltip(false); + } + return params; +} +/** + * 瀑布图适配器 + * @param params + */ +function adaptor$8(params) { + return flow(defaultOptions$3, theme$2, geometry$5, meta$3, axis$5, legend$1, tooltip$2, label$2, state, interaction$6, animation$5, annotation$2())(params); +} + +/** + * 瀑布图 + */ +var Waterfall$1 = /** @class */ (function (_super) { + __extends$e(Waterfall, _super); + function Waterfall() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'waterfall'; + return _this; + } + /** + * 获取 瀑布图 默认配置项 + * 供外部使用 + */ + Waterfall.getDefaultOptions = function () { + return DEFAULT_OPTIONS$8; + }; + /** + * @override + * @param data + */ + Waterfall.prototype.changeData = function (data) { + var _a = this.options, xField = _a.xField, yField = _a.yField, total = _a.total; + this.updateOption({ data: data }); + this.chart.changeData(transformData$4(data, xField, yField, total)); + }; + /** + * 获取 瀑布图 的适配器 + */ + Waterfall.prototype.getSchemaAdaptor = function () { + return adaptor$8; + }; + /** + * 获取 瀑布图 的默认配置 + */ + Waterfall.prototype.getDefaultOptions = function () { + return Waterfall.getDefaultOptions(); + }; + return Waterfall; +}(Plot)); + +function getScaleMax(maxAngle, yField, data) { + var yData = data.map(function (item) { return item[yField]; }).filter(function (v) { return v !== undefined; }); + var maxValue = yData.length > 0 ? Math.max.apply(Math, yData) : 0; + var formatRadian = Math.abs(maxAngle) % 360; + if (!formatRadian) { + return maxValue; + } + return (maxValue * 360) / formatRadian; +} +/** + * 获取堆叠之后的数据 + */ +function getStackedData(data, xField, yField) { + var stackedData = []; + data.forEach(function (item) { + var valueItem = stackedData.find(function (v) { return v[xField] === item[xField]; }); + if (valueItem) { + valueItem[yField] += item[yField] || null; + } + else { + stackedData.push(__assign$r({}, item)); + } + }); + return stackedData; +} + +/** + * geometry 处理 + * @param params + */ +function geometry$4(params) { + var chart = params.chart, options = params.options; + var style = options.barStyle, color = options.color, tooltip = options.tooltip, colorField = options.colorField, type = options.type, xField = options.xField, yField = options.yField, data = options.data; + // 处理不合法的数据 + var processData = processIllegalData(data, yField); + chart.data(processData); + var p = deepAssign({}, params, { + options: { + tooltip: tooltip, + seriesField: colorField, + interval: { + style: style, + color: color, + shape: type === 'line' ? 'line' : 'intervel', + }, + // 柱子的一些样式设置：柱子最小宽度、柱子最大宽度、柱子背景 + minColumnWidth: options.minBarWidth, + maxColumnWidth: options.maxBarWidth, + columnBackground: options.barBackground, + }, + }); + interval(p); + if (type === 'line') { + point({ + chart: chart, + options: { xField: xField, yField: yField, seriesField: colorField, point: { shape: 'circle', color: color } }, + }); + } + return params; +} +/** + * meta 配置 + * @param params + */ +function meta$2(params) { + var _a; + var options = params.options; + var yField = options.yField, xField = options.xField, data = options.data, isStack = options.isStack, isGroup = options.isGroup, colorField = options.colorField, maxAngle = options.maxAngle; + var actualData = isStack && !isGroup && colorField ? getStackedData(data, xField, yField) : data; + var processData = processIllegalData(actualData, yField); + return flow(scale$3((_a = {}, + _a[yField] = { + min: 0, + max: getScaleMax(maxAngle, yField, processData), + }, + _a)))(params); +} +/** + * coordinate 配置 + * @param params + */ +function coordinate$1(params) { + var chart = params.chart, options = params.options; + var radius = options.radius, innerRadius = options.innerRadius, startAngle = options.startAngle, endAngle = options.endAngle; + chart + .coordinate({ + type: 'polar', + cfg: { + radius: radius, + innerRadius: innerRadius, + startAngle: startAngle, + endAngle: endAngle, + }, + }) + .transpose(); + return params; +} +/** + * axis 配置 + * @param params + */ +function axis$4(params) { + var chart = params.chart, options = params.options; + var xField = options.xField, xAxis = options.xAxis; + chart.axis(xField, xAxis); + return params; +} +/** + * 数据标签 + * @param params + */ +function label$1(params) { + var chart = params.chart, options = params.options; + var label = options.label, yField = options.yField; + var intervalGeometry = findGeometry(chart, 'interval'); + // label 为 false, 空 则不显示 label + if (!label) { + intervalGeometry.label(false); + } + else { + var callback = label.callback, cfg = __rest$G(label, ["callback"]); + intervalGeometry.label({ + fields: [yField], + callback: callback, + cfg: __assign$r(__assign$r({}, transformLabel(cfg)), { type: 'polar' }), + }); + } + return params; +} +/** + * 图适配器 + * @param chart + * @param options + */ +function adaptor$7(params) { + return flow(pattern('barStyle'), geometry$4, meta$2, axis$4, coordinate$1, interaction$6, animation$5, theme$2, tooltip$8, legend$f, annotation$2(), label$1)(params); +} + +/** + * 玉珏图 默认配置项 + */ +var DEFAULT_OPTIONS$7 = deepAssign({}, Plot.getDefaultOptions(), { + interactions: [{ type: 'element-active' }], + legend: false, + tooltip: { + showMarkers: false, + }, + xAxis: { + grid: null, + tickLine: null, + line: null, + }, + maxAngle: 240, +}); + +/** + * 玉珏图 + */ +var RadialBar$1 = /** @class */ (function (_super) { + __extends$e(RadialBar, _super); + function RadialBar() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'radial-bar'; + return _this; + } + RadialBar.getDefaultOptions = function () { + return DEFAULT_OPTIONS$7; + }; + /** + * @override + * @param data + */ + RadialBar.prototype.changeData = function (data) { + this.updateOption({ data: data }); + // 更新玉珏图的 scale + meta$2({ chart: this.chart, options: this.options }); + this.chart.changeData(data); + }; + /** + * 获取默认配置 + */ + RadialBar.prototype.getDefaultOptions = function () { + return RadialBar.getDefaultOptions(); + }; + /** + * 获取适配器 + */ + RadialBar.prototype.getSchemaAdaptor = function () { + return adaptor$7; + }; + return RadialBar; +}(Plot)); + +var FIRST_AXES_VIEW = 'first-axes-view'; +var SECOND_AXES_VIEW = 'second-axes-view'; +/** 对称条形图的分组 key 值 */ +var SERIES_FIELD_KEY = 'series-field-key'; + +/** + * bidirectional-bar 处理数据, 通过 SERIES_FIELD_KEY 字段分成左右数据 + * @param xField + * @param yField + * @param data + */ +function transformData$3(xField, yField, seriesField, data, reverse) { + var hopeData = []; + yField.forEach(function (d) { + data.forEach(function (k) { + var _a; + var obj = (_a = {}, + _a[xField] = k[xField], + _a[seriesField] = d, + _a[d] = k[d], + _a); + hopeData.push(obj); + }); + }); + var groupData = Object.values(groupBy(hopeData, seriesField)); + var _a = groupData[0], data1 = _a === void 0 ? [] : _a, _b = groupData[1], data2 = _b === void 0 ? [] : _b; + return reverse ? [data1.reverse(), data2.reverse()] : [data1, data2]; +} +/** + * 是否横向，默认空为横向 + * @param layout + */ +function isHorizontal(layout) { + return layout !== 'vertical'; +} +/** + * 多 view 进行同步 padding 的自定义逻辑 + * @param chart + * @param views + * @param p + */ +function syncViewPadding(chart, views, p) { + var v1 = views[0], v2 = views[1]; + var p1 = v1.autoPadding; + var p2 = v2.autoPadding; + var _a = chart.__axisPosition, layout = _a.layout, position = _a.position; + // 目前只能根据布局的比例来判断 layout + if (isHorizontal(layout) && position === 'top') { + /** + * 保证 v1 的 left 和 v2 right 的间隔相等，因为 v1 有轴 + * position top 即为 v1 左边，中间间距设置就为 0 + */ + v1.autoPadding = p.instance(p1.top, 0, p1.bottom, p1.left); + v2.autoPadding = p.instance(p2.top, p1.left, p2.bottom, 0); + } + if (isHorizontal(layout) && position === 'bottom') { + /** + * 保证 v1 的 left 和 v2 right 的间隔相等，因为 v1 有轴 + * position bottom 即为 v1 的右边，v1 right = right / 2 v2 left = right / 2 + * + 5 是为了 让那个轴不要太贴近了，更好看 + */ + v1.autoPadding = p.instance(p1.top, p1.right / 2 + 5, p1.bottom, p1.left); + v2.autoPadding = p.instance(p2.top, p2.right, p2.bottom, p1.right / 2 + 5); + } + if (!isHorizontal(layout) && position === 'bottom') { + /** + * 保证 v1 的 left 和 v2 left 的间隔相等 left 取最大值 + * position bottom 即为 v1 下边，v1 bottom = bottom / 2 v2 top = bottom / 2 + * + 5 是为了 让那个轴不要太贴近了，更好看 + */ + var left = p1.left >= p2.left ? p1.left : p2.left; + v1.autoPadding = p.instance(p1.top, p1.right, p1.bottom / 2 + 5, left); + v2.autoPadding = p.instance(p1.bottom / 2 + 5, p2.right, p2.bottom, left); + } + // 垂直状态，不建议设置position 为 top， 还是做个兼容处理 + if (!isHorizontal(layout) && position === 'top') { + var left = p1.left >= p2.left ? p1.left : p2.left; + v1.autoPadding = p.instance(p1.top, p1.right, 0, left); + v2.autoPadding = p.instance(0, p2.right, p1.top, left); + } +} + +/** + * geometry 处理 + * @param params + */ +function geometry$3(params) { + var chart = params.chart, options = params.options; + var data = options.data, xField = options.xField, yField = options.yField, color = options.color, barStyle = options.barStyle, widthRatio = options.widthRatio, legend = options.legend, layout = options.layout; + // 处理数据 + var groupData = transformData$3(xField, yField, SERIES_FIELD_KEY, data, isHorizontal(layout)); + // 在创建子 view 执行后不行，需要在前面处理 legend + if (legend) { + chart.legend(SERIES_FIELD_KEY, legend); + } + else if (legend === false) { + chart.legend(false); + } + // 创建 view + var firstView; + var secondView; + var firstViewData = groupData[0], secondViewData = groupData[1]; + // 横向 + if (isHorizontal(layout)) { + firstView = chart.createView({ + region: { + start: { x: 0, y: 0 }, + end: { x: 0.5, y: 1 }, + }, + id: FIRST_AXES_VIEW, + }); + firstView.coordinate().transpose().reflect('x'); + secondView = chart.createView({ + region: { + start: { x: 0.5, y: 0 }, + end: { x: 1, y: 1 }, + }, + id: SECOND_AXES_VIEW, + }); + secondView.coordinate().transpose(); + // @说明: 测试发现，横向因为轴的反转，需要数据也反转，不然会图形渲染是反的(翻转操作进入到 transform 中处理) + firstView.data(firstViewData); + secondView.data(secondViewData); + } + else { + // 纵向 + firstView = chart.createView({ + region: { + start: { x: 0, y: 0 }, + end: { x: 1, y: 0.5 }, + }, + id: FIRST_AXES_VIEW, + }); + secondView = chart.createView({ + region: { + start: { x: 0, y: 0.5 }, + end: { x: 1, y: 1 }, + }, + id: SECOND_AXES_VIEW, + }); + secondView + .coordinate() + .reflect('y') + .rotate(Math.PI * 0); // 旋转 + firstView.data(firstViewData); + secondView.data(secondViewData); + } + var left = deepAssign({}, params, { + chart: firstView, + options: { + widthRatio: widthRatio, + xField: xField, + yField: yField[0], + seriesField: SERIES_FIELD_KEY, + interval: { + color: color, + style: barStyle, + }, + }, + }); + interval(left); + var right = deepAssign({}, params, { + chart: secondView, + options: { + xField: xField, + yField: yField[1], + seriesField: SERIES_FIELD_KEY, + widthRatio: widthRatio, + interval: { + color: color, + style: barStyle, + }, + }, + }); + interval(right); + return params; +} +/** + * meta 配置 + * - 对称条形图对数据进行了处理，通过 SERIES_FIELD_KEY 来对两条 yField 数据进行分类 + * @param params + */ +function meta$1(params) { + var _a, _b, _c; + var options = params.options, chart = params.chart; + var xAxis = options.xAxis, yAxis = options.yAxis, xField = options.xField, yField = options.yField; + var firstView = findViewById(chart, FIRST_AXES_VIEW); + var secondView = findViewById(chart, SECOND_AXES_VIEW); + var aliasMap = {}; + keys$8((options === null || options === void 0 ? void 0 : options.meta) || {}).map(function (metaKey) { + if (get$3(options === null || options === void 0 ? void 0 : options.meta, [metaKey, 'alias'])) { + aliasMap[metaKey] = options.meta[metaKey].alias; + } + }); + chart.scale((_a = {}, + _a[SERIES_FIELD_KEY] = { + sync: true, + formatter: function (v) { + return get$3(aliasMap, v, v); + }, + }, + _a)); + scale$3((_b = {}, + _b[xField] = xAxis, + _b[yField[0]] = yAxis[yField[0]], + _b))(deepAssign({}, params, { chart: firstView })); + scale$3((_c = {}, + _c[xField] = xAxis, + _c[yField[1]] = yAxis[yField[1]], + _c))(deepAssign({}, params, { chart: secondView })); + return params; +} +/** + * axis 配置 + * @param params + */ +function axis$3(params) { + var chart = params.chart, options = params.options; + var xAxis = options.xAxis, yAxis = options.yAxis, xField = options.xField, yField = options.yField, layout = options.layout; + var firstView = findViewById(chart, FIRST_AXES_VIEW); + var secondView = findViewById(chart, SECOND_AXES_VIEW); + // 第二个 view axis 始终隐藏; 注意 bottom 的时候，只隐藏 label，其他共用配置 + // @ts-ignore + if ((xAxis === null || xAxis === void 0 ? void 0 : xAxis.position) === 'bottom') { + // fixme 直接设置 label: null 会导致 tickLine 无法显示 + secondView.axis(xField, __assign$r(__assign$r({}, xAxis), { label: { formatter: function () { return ''; } } })); + } + else { + secondView.axis(xField, false); + } + // 为 false 则是不显示 firstView 轴 + if (xAxis === false) { + firstView.axis(xField, false); + } + else { + firstView.axis(xField, __assign$r({ + // 不同布局 firstView 的坐标轴显示位置 + position: isHorizontal(layout) ? 'top' : 'bottom' }, xAxis)); + } + if (yAxis === false) { + firstView.axis(yField[0], false); + secondView.axis(yField[1], false); + } + else { + firstView.axis(yField[0], yAxis[yField[0]]); + secondView.axis(yField[1], yAxis[yField[1]]); + } + /** + * 这个注入，主要是在syncViewPadding时候拿到相对应的配置：布局和轴的位置 + * TODO 之后希望 g2 View 对象可以开放 setter 可以设置一些需要的东西 + */ + //@ts-ignore + chart.__axisPosition = { + position: firstView.getOptions().axes[xField].position, + layout: layout, + }; + return params; +} +/** + * interaction 配置 + * @param params + */ +function interaction$2(params) { + var chart = params.chart; + interaction$6(deepAssign({}, params, { chart: findViewById(chart, FIRST_AXES_VIEW) })); + interaction$6(deepAssign({}, params, { chart: findViewById(chart, SECOND_AXES_VIEW) })); + return params; +} +/** + * limitInPlot + * @param params + */ +function limitInPlot(params) { + var chart = params.chart, options = params.options; + var yField = options.yField, yAxis = options.yAxis; + limitInPlot$2(deepAssign({}, params, { + chart: findViewById(chart, FIRST_AXES_VIEW), + options: { + yAxis: yAxis[yField[0]], + }, + })); + limitInPlot$2(deepAssign({}, params, { + chart: findViewById(chart, SECOND_AXES_VIEW), + options: { + yAxis: yAxis[yField[1]], + }, + })); + return params; +} +/** + * theme + * @param params + */ +function theme(params) { + var chart = params.chart; + theme$2(deepAssign({}, params, { chart: findViewById(chart, FIRST_AXES_VIEW) })); + theme$2(deepAssign({}, params, { chart: findViewById(chart, SECOND_AXES_VIEW) })); + return params; +} +/** + * animation + * @param params + */ +function animation$2(params) { + var chart = params.chart; + animation$5(deepAssign({}, params, { chart: findViewById(chart, FIRST_AXES_VIEW) })); + animation$5(deepAssign({}, params, { chart: findViewById(chart, SECOND_AXES_VIEW) })); + return params; +} +/** + * label 配置 + * @param params + */ +function label(params) { + var chart = params.chart, options = params.options; + var label = options.label, yField = options.yField; + var firstView = findViewById(chart, FIRST_AXES_VIEW); + var secondView = findViewById(chart, SECOND_AXES_VIEW); + var leftGeometry = findGeometry(firstView, 'interval'); + var rightGeometry = findGeometry(secondView, 'interval'); + if (!label) { + leftGeometry.label(false); + rightGeometry.label(false); + } + else { + var callback = label.callback, cfg = __rest$G(label, ["callback"]); + leftGeometry.label({ + fields: [yField[0]], + callback: callback, + cfg: transformLabel(cfg), + }); + rightGeometry.label({ + fields: [yField[1]], + callback: callback, + cfg: transformLabel(cfg), + }); + } + return params; +} +/** + * 对称条形图适配器 + * @param chart + * @param options + */ +function adaptor$6(params) { + // flow 的方式处理所有的配置到 G2 API + return flow(geometry$3, meta$1, axis$3, limitInPlot, theme, label, tooltip$8, interaction$2, animation$2)(params); +} + +var BidirectionalBar$1 = /** @class */ (function (_super) { + __extends$e(BidirectionalBar, _super); + function BidirectionalBar() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'bidirectional-bar'; + return _this; + } + /** + * 获取 默认配置项 + * 供外部使用 + */ + BidirectionalBar.getDefaultOptions = function () { + return deepAssign({}, _super.getDefaultOptions.call(this), { + syncViewPadding: syncViewPadding, + }); + }; + /** + * @override + */ + BidirectionalBar.prototype.changeData = function (data) { + if (data === void 0) { data = []; } + this.chart.emit(VIEW_LIFE_CIRCLE.BEFORE_CHANGE_DATA, Event$1.fromData(this.chart, VIEW_LIFE_CIRCLE.BEFORE_CHANGE_DATA, null)); + // 更新options + this.updateOption({ data: data }); + var _a = this.options, xField = _a.xField, yField = _a.yField, layout = _a.layout; + // 处理数据 + var groupData = transformData$3(xField, yField, SERIES_FIELD_KEY, data, isHorizontal(layout)); + var firstViewData = groupData[0], secondViewData = groupData[1]; + var firstView = findViewById(this.chart, FIRST_AXES_VIEW); + var secondView = findViewById(this.chart, SECOND_AXES_VIEW); + // 更新对应view的data + firstView.data(firstViewData); + secondView.data(secondViewData); + // 重新渲染 + this.chart.render(true); + this.chart.emit(VIEW_LIFE_CIRCLE.AFTER_CHANGE_DATA, Event$1.fromData(this.chart, VIEW_LIFE_CIRCLE.AFTER_CHANGE_DATA, null)); + }; + BidirectionalBar.prototype.getDefaultOptions = function () { + return BidirectionalBar.getDefaultOptions(); + }; + /** + * 获取对称条形图的适配器 + */ + BidirectionalBar.prototype.getSchemaAdaptor = function () { + return adaptor$6; + }; + return BidirectionalBar; +}(Plot)); + +function findInteraction(interactions, interactionType) { + if (!isArray$n(interactions)) + return undefined; + return interactions.find(function (i) { return i.type === interactionType; }); +} +function enableInteraction(interactions, interactionType) { + var interaction = findInteraction(interactions, interactionType); + return interaction && interaction.enable !== false; +} +/** + * 是否允许下钻交互 + * @param interactions + * @param interactionType + * @returns + */ +function enableDrillInteraction(options) { + var interactions = options.interactions, drilldown = options.drilldown; + // 兼容旧版本, treemap-drill-down + return get$3(drilldown, 'enabled') || enableInteraction(interactions, 'treemap-drill-down'); +} +function resetDrillDown(chart) { + var drillDownInteraction = chart.interactions['drill-down']; + if (!drillDownInteraction) + return; + // @ts-ignore + var drillDownAction = drillDownInteraction.context.actions.find(function (i) { return i.name === 'drill-down-action'; }); + drillDownAction.reset(); +} +function transformData$2(options) { + var data = options.data, colorField = options.colorField, enableDrillDown = options.enableDrillDown, hierarchyConfig = options.hierarchyConfig; + var nodes = treemap(data, __assign$r(__assign$r({}, hierarchyConfig), { + // @ts-ignore + type: 'hierarchy.treemap', field: 'value', as: ['x', 'y'] })); + var result = []; + nodes.forEach(function (node) { + if (node.depth === 0) { + return null; + } + // 开启下钻，仅加载 depth === 1 的数据 + if (enableDrillDown && node.depth !== 1) { + return null; + } + // 不开启下钻，加载所有叶子节点 + if (!enableDrillDown && node.children) { + return null; + } + // path 信息仅挑选必要祖先元素属性，因为在有些属性是不必要(x, y), 或是不准确的(下钻时的 depth)，不对外透出 + var curPath = node.ancestors().map(function (n) { return ({ + data: n.data, + height: n.height, + value: n.value, + }); }); + // 在下钻树图中，每次绘制的是当前层级信息，将父元素的层级信息（data.path) 做一层拼接。 + var path = enableDrillDown && isArray$n(data.path) ? curPath.concat(data.path.slice(1)) : curPath; + var nodeInfo = Object.assign({}, node.data, __assign$r({ x: node.x, y: node.y, depth: node.depth, value: node.value, path: path }, node)); + if (!node.data[colorField] && node.parent) { + var ancestorNode = node.ancestors().find(function (n) { return n.data[colorField]; }); + nodeInfo[colorField] = ancestorNode === null || ancestorNode === void 0 ? void 0 : ancestorNode.data[colorField]; + } + else { + nodeInfo[colorField] = node.data[colorField]; + } + nodeInfo[HIERARCHY_DATA_TRANSFORM_PARAMS] = { hierarchyConfig: hierarchyConfig, colorField: colorField, enableDrillDown: enableDrillDown }; + result.push(nodeInfo); + }); + return result; +} + +/** + * 获取默认 option + * @param params + */ +function defaultOptions$2(params) { + var options = params.options; + var colorField = options.colorField; + return deepAssign({ + options: { + rawFields: ['value'], + tooltip: { + fields: ['name', 'value', colorField, 'path'], + formatter: function (data) { + return { + name: data.name, + value: data.value, + }; + }, + }, + }, + }, params); +} +/** + * 字段 + * @param params + */ +function geometry$2(params) { + var chart = params.chart, options = params.options; + var color = options.color, colorField = options.colorField, rectStyle = options.rectStyle, hierarchyConfig = options.hierarchyConfig, rawFields = options.rawFields; + var data = transformData$2({ + data: options.data, + colorField: options.colorField, + enableDrillDown: enableDrillInteraction(options), + hierarchyConfig: hierarchyConfig, + }); + chart.data(data); + // geometry + polygon(deepAssign({}, params, { + options: { + xField: 'x', + yField: 'y', + seriesField: colorField, + rawFields: rawFields, + polygon: { + color: color, + style: rectStyle, + }, + }, + })); + // 做一个反转，这样配合排序，可以将最大值放到左上角，最小值放到右下角 + chart.coordinate().reflect('y'); + return params; +} +/** + * 坐标轴 + * @param params + */ +function axis$2(params) { + var chart = params.chart; + chart.axis(false); + return params; +} +function adaptorInteraction$1(options) { + var drilldown = options.drilldown, _a = options.interactions, interactions = _a === void 0 ? [] : _a; + var enableDrillDown = enableDrillInteraction(options); + if (enableDrillDown) { + return deepAssign({}, options, { + interactions: __spreadArrays$1(interactions, [ + { + type: 'drill-down', + // 🚓 这不是一个规范的 API，后续会变更。慎重参考 + cfg: { drillDownConfig: drilldown, transformData: transformData$2 }, + }, + ]), + }); + } + return options; +} +/** + * Interaction 配置 + * @param params + */ +function interaction$1(params) { + var chart = params.chart, options = params.options; + var interactions = options.interactions, drilldown = options.drilldown; + interaction$6({ + chart: chart, + options: adaptorInteraction$1(options), + }); + // 适配 view-zoom + var viewZoomInteraction = findInteraction(interactions, 'view-zoom'); + if (viewZoomInteraction) { + // 开启缩放 interaction 后，则阻止默认滚动事件，避免整个窗口的滚动 + if (viewZoomInteraction.enable !== false) { + chart.getCanvas().on('mousewheel', function (ev) { + ev.preventDefault(); + }); + } + else { + // 手动关闭后，清除。仅对声明 viewZoomInteraction 的清除。 + chart.getCanvas().off('mousewheel'); + } + } + // 适应下钻交互面包屑 + var enableDrillDown = enableDrillInteraction(options); + if (enableDrillDown) { + // 为面包屑在底部留出 25px 的空间 + chart.appendPadding = getAdjustAppendPadding(chart.appendPadding, get$3(drilldown, ['breadCrumb', 'position'])); + } + return params; +} +/** + * 矩形树图 + * @param chart + * @param options + */ +function adaptor$5(params) { + return flow(defaultOptions$2, theme$2, pattern('rectStyle'), geometry$2, axis$2, legend$f, tooltip$8, interaction$1, animation$5, annotation$2())(params); +} + +var DEFAULT_OPTIONS$6 = { + // 默认按照 name 字段对颜色进行分类 + colorField: 'name', + rectStyle: { + lineWidth: 1, + stroke: '#fff', + }, + hierarchyConfig: { + tile: 'treemapSquarify', + }, + label: { + fields: ['name'], + layout: { + type: 'limit-in-shape', + }, + }, + tooltip: { + showMarkers: false, + showTitle: false, + }, + // 下钻交互配置，默认不开启 + drilldown: { + enabled: false, + breadCrumb: { + position: 'bottom-left', + rootText: '初始', + dividerText: '/', + textStyle: { + fontSize: 12, + fill: 'rgba(0, 0, 0, 0.65)', + cursor: 'pointer', + }, + activeTextStyle: { + fill: '#87B5FF', + }, + }, + }, +}; + +var Treemap$1 = /** @class */ (function (_super) { + __extends$e(Treemap, _super); + function Treemap() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'treemap'; + return _this; + } + /** + * 获取 矩阵树图 默认配置项 + * 供外部使用 + */ + Treemap.getDefaultOptions = function () { + return DEFAULT_OPTIONS$6; + }; + /** + * changeData + */ + Treemap.prototype.changeData = function (data) { + var _a = this.options, colorField = _a.colorField, interactions = _a.interactions, hierarchyConfig = _a.hierarchyConfig; + this.updateOption({ data: data }); + var transData = transformData$2({ + data: data, + colorField: colorField, + enableDrillDown: enableInteraction(interactions, 'treemap-drill-down'), + hierarchyConfig: hierarchyConfig, + }); + this.chart.changeData(transData); + resetDrillDown(this.chart); + }; + /** + * 获取 矩阵树图 默认配置 + */ + Treemap.prototype.getDefaultOptions = function () { + return Treemap.getDefaultOptions(); + }; + Treemap.prototype.getSchemaAdaptor = function () { + return adaptor$5; + }; + return Treemap; +}(Plot)); + +function targetDepth(d) { + return d.target.depth; +} +function left(node) { + return node.depth; +} +function right(node, n) { + return n - 1 - node.height; +} +function justify(node, n) { + return node.sourceLinks.length ? node.depth : n - 1; +} +function center$1(node) { + return node.targetLinks.length ? node.depth : node.sourceLinks.length ? minBy$1(node.sourceLinks, targetDepth) - 1 : 0; +} + +function constant$3(x) { + return function () { + return x; + }; +} +function sumBy(arr, func) { + var r = 0; + for (var i = 0; i < arr.length; i++) { + r += func(arr[i]); + } + return r; +} +/** + * 计算最大值 + * @param arr + * @param func + */ +function maxValueBy(arr, func) { + var r = -Infinity; + for (var i = 0; i < arr.length; i++) { + r = Math.max(func(arr[i]), r); + } + return r; +} +/** + * 计算最小值 + * @param arr + * @param func + */ +function minValueBy(arr, func) { + var r = Infinity; + for (var i = 0; i < arr.length; i++) { + r = Math.min(func(arr[i]), r); + } + return r; +} + +function ascendingSourceBreadth(a, b) { + return ascendingBreadth(a.source, b.source) || a.index - b.index; +} +function ascendingTargetBreadth(a, b) { + return ascendingBreadth(a.target, b.target) || a.index - b.index; +} +function ascendingBreadth(a, b) { + return a.y0 - b.y0; +} +function value(d) { + return d.value; +} +function defaultId(d) { + return d.index; +} +function defaultNodes(graph) { + return graph.nodes; +} +function defaultLinks(graph) { + return graph.links; +} +function find$2(nodeById, id) { + var node = nodeById.get(id); + if (!node) + throw new Error('missing: ' + id); + return node; +} +function computeLinkBreadths(_a) { + var nodes = _a.nodes; + for (var _i = 0, nodes_1 = nodes; _i < nodes_1.length; _i++) { + var node = nodes_1[_i]; + var y0 = node.y0; + var y1 = y0; + for (var _b = 0, _c = node.sourceLinks; _b < _c.length; _b++) { + var link = _c[_b]; + link.y0 = y0 + link.width / 2; + y0 += link.width; + } + for (var _d = 0, _e = node.targetLinks; _d < _e.length; _d++) { + var link = _e[_d]; + link.y1 = y1 + link.width / 2; + y1 += link.width; + } + } +} +function Sankey$2() { + var x0 = 0, y0 = 0, x1 = 1, y1 = 1; // extent + var dx = 24; // nodeWidth + var dy = 8, py; // nodePadding + var id = defaultId; + var align = justify; + var depth; + var sort; + var linkSort; + var nodes = defaultNodes; + var links = defaultLinks; + var iterations = 6; + function sankey(arg) { + var graph = { + nodes: nodes(arg), + links: links(arg), + }; + computeNodeLinks(graph); + computeNodeValues(graph); + computeNodeDepths(graph); + computeNodeHeights(graph); + computeNodeBreadths(graph); + computeLinkBreadths(graph); + return graph; + } + sankey.update = function (graph) { + computeLinkBreadths(graph); + return graph; + }; + sankey.nodeId = function (_) { + return arguments.length ? ((id = typeof _ === 'function' ? _ : constant$3(_)), sankey) : id; + }; + sankey.nodeAlign = function (_) { + return arguments.length ? ((align = typeof _ === 'function' ? _ : constant$3(_)), sankey) : align; + }; + sankey.nodeDepth = function (_) { + return arguments.length ? ((depth = typeof _ === 'function' ? _ : _), sankey) : depth; + }; + sankey.nodeSort = function (_) { + return arguments.length ? ((sort = _), sankey) : sort; + }; + sankey.nodeWidth = function (_) { + return arguments.length ? ((dx = +_), sankey) : dx; + }; + sankey.nodePadding = function (_) { + return arguments.length ? ((dy = py = +_), sankey) : dy; + }; + sankey.nodes = function (_) { + return arguments.length ? ((nodes = typeof _ === 'function' ? _ : constant$3(_)), sankey) : nodes; + }; + sankey.links = function (_) { + return arguments.length ? ((links = typeof _ === 'function' ? _ : constant$3(_)), sankey) : links; + }; + sankey.linkSort = function (_) { + return arguments.length ? ((linkSort = _), sankey) : linkSort; + }; + sankey.size = function (_) { + return arguments.length ? ((x0 = y0 = 0), (x1 = +_[0]), (y1 = +_[1]), sankey) : [x1 - x0, y1 - y0]; + }; + sankey.extent = function (_) { + return arguments.length + ? ((x0 = +_[0][0]), (x1 = +_[1][0]), (y0 = +_[0][1]), (y1 = +_[1][1]), sankey) + : [ + [x0, y0], + [x1, y1], + ]; + }; + sankey.iterations = function (_) { + return arguments.length ? ((iterations = +_), sankey) : iterations; + }; + function computeNodeLinks(_a) { + var nodes = _a.nodes, links = _a.links; + nodes.forEach(function (node, idx) { + node.index = idx; + node.sourceLinks = []; + node.targetLinks = []; + }); + var nodeById = new Map(nodes.map(function (d) { return [id(d), d]; })); + links.forEach(function (link, idx) { + link.index = idx; + var source = link.source, target = link.target; + if (typeof source !== 'object') + source = link.source = find$2(nodeById, source); + if (typeof target !== 'object') + target = link.target = find$2(nodeById, target); + source.sourceLinks.push(link); + target.targetLinks.push(link); + }); + if (linkSort != null) { + for (var _i = 0, nodes_2 = nodes; _i < nodes_2.length; _i++) { + var _b = nodes_2[_i], sourceLinks = _b.sourceLinks, targetLinks = _b.targetLinks; + sourceLinks.sort(linkSort); + targetLinks.sort(linkSort); + } + } + } + function computeNodeValues(_a) { + var nodes = _a.nodes; + for (var _i = 0, nodes_3 = nodes; _i < nodes_3.length; _i++) { + var node = nodes_3[_i]; + node.value = + node.fixedValue === undefined + ? Math.max(sumBy(node.sourceLinks, value), sumBy(node.targetLinks, value)) + : node.fixedValue; + } + } + function computeNodeDepths(_a) { + var nodes = _a.nodes; + var n = nodes.length; + var current = new Set(nodes); + var next = new Set(); + var x = 0; + while (current.size) { + current.forEach(function (node) { + node.depth = x; + for (var _i = 0, _a = node.sourceLinks; _i < _a.length; _i++) { + var target = _a[_i].target; + next.add(target); + } + }); + if (++x > n) + throw new Error('circular link'); + current = next; + next = new Set(); + } + // 如果配置了 depth，则设置自定义 depth + if (depth) { + var maxDepth = Math.max(maxValueBy(nodes, function (d) { return d.depth; }) + 1, 0); + var node = void 0; + for (var i = 0; i < nodes.length; i++) { + node = nodes[i]; + node.depth = depth.call(null, node, maxDepth); + } + } + } + function computeNodeHeights(_a) { + var nodes = _a.nodes; + var n = nodes.length; + var current = new Set(nodes); + var next = new Set(); + var x = 0; + while (current.size) { + current.forEach(function (node) { + node.height = x; + for (var _i = 0, _a = node.targetLinks; _i < _a.length; _i++) { + var source = _a[_i].source; + next.add(source); + } + }); + if (++x > n) + throw new Error('circular link'); + current = next; + next = new Set(); + } + } + function computeNodeLayers(_a) { + var nodes = _a.nodes; + var x = Math.max(maxValueBy(nodes, function (d) { return d.depth; }) + 1, 0); + var kx = (x1 - x0 - dx) / (x - 1); + var columns = new Array(x).fill(0).map(function () { return []; }); + for (var _i = 0, nodes_4 = nodes; _i < nodes_4.length; _i++) { + var node = nodes_4[_i]; + var i = Math.max(0, Math.min(x - 1, Math.floor(align.call(null, node, x)))); + node.layer = i; + node.x0 = x0 + i * kx; + node.x1 = node.x0 + dx; + if (columns[i]) + columns[i].push(node); + else + columns[i] = [node]; + } + if (sort) + for (var _b = 0, columns_1 = columns; _b < columns_1.length; _b++) { + var column = columns_1[_b]; + column.sort(sort); + } + return columns; + } + function initializeNodeBreadths(columns) { + var ky = minValueBy(columns, function (c) { return (y1 - y0 - (c.length - 1) * py) / sumBy(c, value); }); + for (var _i = 0, columns_2 = columns; _i < columns_2.length; _i++) { + var nodes_6 = columns_2[_i]; + var y = y0; + for (var _a = 0, nodes_5 = nodes_6; _a < nodes_5.length; _a++) { + var node = nodes_5[_a]; + node.y0 = y; + node.y1 = y + node.value * ky; + y = node.y1 + py; + for (var _b = 0, _c = node.sourceLinks; _b < _c.length; _b++) { + var link = _c[_b]; + link.width = link.value * ky; + } + } + y = (y1 - y + py) / (nodes_6.length + 1); + for (var i = 0; i < nodes_6.length; ++i) { + var node = nodes_6[i]; + node.y0 += y * (i + 1); + node.y1 += y * (i + 1); + } + reorderLinks(nodes_6); + } + } + function computeNodeBreadths(graph) { + var columns = computeNodeLayers(graph); + py = Math.min(dy, (y1 - y0) / (maxValueBy(columns, function (c) { return c.length; }) - 1)); + initializeNodeBreadths(columns); + for (var i = 0; i < iterations; ++i) { + var alpha = Math.pow(0.99, i); + var beta = Math.max(1 - alpha, (i + 1) / iterations); + relaxRightToLeft(columns, alpha, beta); + relaxLeftToRight(columns, alpha, beta); + } + } + // Reposition each node based on its incoming (target) links. + function relaxLeftToRight(columns, alpha, beta) { + for (var i = 1, n = columns.length; i < n; ++i) { + var column = columns[i]; + for (var _i = 0, column_1 = column; _i < column_1.length; _i++) { + var target = column_1[_i]; + var y = 0; + var w = 0; + for (var _a = 0, _b = target.targetLinks; _a < _b.length; _a++) { + var _c = _b[_a], source = _c.source, value_1 = _c.value; + var v = value_1 * (target.layer - source.layer); + y += targetTop(source, target) * v; + w += v; + } + if (!(w > 0)) + continue; + var dy_1 = (y / w - target.y0) * alpha; + target.y0 += dy_1; + target.y1 += dy_1; + reorderNodeLinks(target); + } + if (sort === undefined) + column.sort(ascendingBreadth); + if (column.length) + resolveCollisions(column, beta); + } + } + // Reposition each node based on its outgoing (source) links. + function relaxRightToLeft(columns, alpha, beta) { + for (var n = columns.length, i = n - 2; i >= 0; --i) { + var column = columns[i]; + for (var _i = 0, column_2 = column; _i < column_2.length; _i++) { + var source = column_2[_i]; + var y = 0; + var w = 0; + for (var _a = 0, _b = source.sourceLinks; _a < _b.length; _a++) { + var _c = _b[_a], target = _c.target, value_2 = _c.value; + var v = value_2 * (target.layer - source.layer); + y += sourceTop(source, target) * v; + w += v; + } + if (!(w > 0)) + continue; + var dy_2 = (y / w - source.y0) * alpha; + source.y0 += dy_2; + source.y1 += dy_2; + reorderNodeLinks(source); + } + if (sort === undefined) + column.sort(ascendingBreadth); + if (column.length) + resolveCollisions(column, beta); + } + } + function resolveCollisions(nodes, alpha) { + var i = nodes.length >> 1; + var subject = nodes[i]; + resolveCollisionsBottomToTop(nodes, subject.y0 - py, i - 1, alpha); + resolveCollisionsTopToBottom(nodes, subject.y1 + py, i + 1, alpha); + resolveCollisionsBottomToTop(nodes, y1, nodes.length - 1, alpha); + resolveCollisionsTopToBottom(nodes, y0, 0, alpha); + } + // Push any overlapping nodes down. + function resolveCollisionsTopToBottom(nodes, y, i, alpha) { + for (; i < nodes.length; ++i) { + var node = nodes[i]; + var dy_3 = (y - node.y0) * alpha; + if (dy_3 > 1e-6) + (node.y0 += dy_3), (node.y1 += dy_3); + y = node.y1 + py; + } + } + // Push any overlapping nodes up. + function resolveCollisionsBottomToTop(nodes, y, i, alpha) { + for (; i >= 0; --i) { + var node = nodes[i]; + var dy_4 = (node.y1 - y) * alpha; + if (dy_4 > 1e-6) + (node.y0 -= dy_4), (node.y1 -= dy_4); + y = node.y0 - py; + } + } + function reorderNodeLinks(_a) { + var sourceLinks = _a.sourceLinks, targetLinks = _a.targetLinks; + if (linkSort === undefined) { + for (var _i = 0, targetLinks_1 = targetLinks; _i < targetLinks_1.length; _i++) { + var sourceLinks_2 = targetLinks_1[_i].source.sourceLinks; + sourceLinks_2.sort(ascendingTargetBreadth); + } + for (var _b = 0, sourceLinks_1 = sourceLinks; _b < sourceLinks_1.length; _b++) { + var targetLinks_2 = sourceLinks_1[_b].target.targetLinks; + targetLinks_2.sort(ascendingSourceBreadth); + } + } + } + function reorderLinks(nodes) { + if (linkSort === undefined) { + for (var _i = 0, nodes_7 = nodes; _i < nodes_7.length; _i++) { + var _a = nodes_7[_i], sourceLinks = _a.sourceLinks, targetLinks = _a.targetLinks; + sourceLinks.sort(ascendingTargetBreadth); + targetLinks.sort(ascendingSourceBreadth); + } + } + } + // Returns the target.y0 that would produce an ideal link from source to target. + function targetTop(source, target) { + var y = source.y0 - ((source.sourceLinks.length - 1) * py) / 2; + for (var _i = 0, _a = source.sourceLinks; _i < _a.length; _i++) { + var _b = _a[_i], node = _b.target, width = _b.width; + if (node === target) + break; + y += width + py; + } + for (var _c = 0, _d = target.targetLinks; _c < _d.length; _c++) { + var _e = _d[_c], node = _e.source, width = _e.width; + if (node === source) + break; + y -= width; + } + return y; + } + // Returns the source.y0 that would produce an ideal link from source to target. + function sourceTop(source, target) { + var y = target.y0 - ((target.targetLinks.length - 1) * py) / 2; + for (var _i = 0, _a = target.targetLinks; _i < _a.length; _i++) { + var _b = _a[_i], node = _b.source, width = _b.width; + if (node === source) + break; + y += width + py; + } + for (var _c = 0, _d = source.sourceLinks; _c < _d.length; _c++) { + var _e = _d[_c], node = _e.target, width = _e.width; + if (node === target) + break; + y -= width; + } + return y; + } + return sankey; +} + +var ALIGN_METHOD = { + left: left, + right: right, + center: center$1, + justify: justify, +}; +/** + * 默认值 + */ +var DEFAULT_OPTIONS$5 = { + nodeId: function (node) { return node.index; }, + nodeAlign: 'justify', + nodeWidth: 0.008, + nodePadding: 0.03, + nodeSort: undefined, +}; +/** + * 获得 align function + * @param nodeAlign + * @param nodeDepth + */ +function getNodeAlignFunction(nodeAlign) { + var func = isString$3(nodeAlign) ? ALIGN_METHOD[nodeAlign] : isFunction$6(nodeAlign) ? nodeAlign : null; + return func || justify; +} +function getDefaultOptions$1(sankeyLayoutOptions) { + return mix({}, DEFAULT_OPTIONS$5, sankeyLayoutOptions); +} +/** + * 桑基图利用数据进行布局的函数，最终返回节点、边的位置（0 - 1 的信息） + * 将会修改 data 数据 + * @param sankeyLayoutOptions + * @param data + */ +function sankeyLayout(sankeyLayoutOptions, data) { + var options = getDefaultOptions$1(sankeyLayoutOptions); + var nodeId = options.nodeId, nodeSort = options.nodeSort, nodeAlign = options.nodeAlign, nodeWidth = options.nodeWidth, nodePadding = options.nodePadding, nodeDepth = options.nodeDepth; + var sankeyProcessor = Sankey$2() + // .links((d: any) => d.links) + // .nodes((d: any) => d.nodes) + .nodeSort(nodeSort) + .nodeWidth(nodeWidth) + .nodePadding(nodePadding) + .nodeDepth(nodeDepth) + .nodeAlign(getNodeAlignFunction(nodeAlign)) + .extent([ + [0, 0], + [1, 1], + ]) + .nodeId(nodeId); + // 进行桑基图布局处理 + var layoutData = sankeyProcessor(data); + // post process (x, y), etc. + layoutData.nodes.forEach(function (node) { + var x0 = node.x0, x1 = node.x1, y0 = node.y0, y1 = node.y1; + /* points + * 3---2 + * | | + * 0---1 + */ + node.x = [x0, x1, x1, x0]; + node.y = [y0, y0, y1, y1]; + }); + layoutData.links.forEach(function (edge) { + var source = edge.source, target = edge.target; + var sx = source.x1; + var tx = target.x0; + edge.x = [sx, sx, tx, tx]; + var offset = edge.width / 2; + edge.y = [edge.y0 + offset, edge.y0 - offset, edge.y1 + offset, edge.y1 - offset]; + }); + return layoutData; +} + +/** + * 根据 edges 获取对应的 node 结构 + */ +function getNodes(edges, sourceField, targetField) { + var nodes = []; + edges.forEach(function (e) { + var source = e[sourceField]; + var target = e[targetField]; + if (!nodes.includes(source)) { + nodes.push(source); + } + if (!nodes.includes(target)) { + nodes.push(target); + } + }); + return nodes; +} +/** + * 根据 edges 获取对应的 dfs 邻接矩阵 + */ +function getMatrix(edges, nodes, sourceField, targetField) { + var graphMatrix = {}; + nodes.forEach(function (pre) { + graphMatrix[pre] = {}; + nodes.forEach(function (next) { + graphMatrix[pre][next] = 0; + }); + }); + edges.forEach(function (edge) { + graphMatrix[edge[sourceField]][edge[targetField]] = 1; + }); + return graphMatrix; +} +/** + * 使用 DFS 思路切断桑基图数据中的环（会丢失数据），保证顺序 + * @param data + * @param sourceField + * @param targetField + */ +function cutoffCircle(edges, sourceField, targetField) { + if (!isArray$n(edges)) + return []; + // 待删除的环状结构 + var removedData = []; + // 获取所有的节点 + var nodes = getNodes(edges, sourceField, targetField); + // 获取节点与边的邻接矩阵 + var graphMatrix = getMatrix(edges, nodes, sourceField, targetField); + // visited：标记节点访问状态, 0：未访问,1：访问中, -1：已访问 + var visited = {}; + // 初始化visited + nodes.forEach(function (node) { + visited[node] = 0; + }); + // 图的深度遍历函数 + function DFS(dfsNode) { + // 节点状态置为正在访问 + visited[dfsNode] = 1; + nodes.forEach(function (node) { + if (graphMatrix[dfsNode][node] != 0) { + // 当前节点在访问中，再次被访问，证明有环，移动到 removeData + if (visited[node] == 1) { + // 拼接为字符串，方便最后过滤 + removedData.push(dfsNode + "_" + node); + } + else if (visited[node] == -1) { + // 当前结点及后边的结点都被访问过，直接跳至下一个结点 + return; + } + else { + DFS(node); // 否则递归访问 + } + } + }); + //遍历过所有相连的结点后，把本节点标记为-1 + visited[dfsNode] = -1; + } + // 对每个节点执行 dfs 操作 + nodes.forEach(function (node) { + //该结点后边的结点都被访问过了，跳过它 + if (visited[node] == -1) { + return; + } + DFS(node); + }); + if (removedData.length !== 0) { + console.warn("sankey data contains circle, " + removedData.length + " records removed.", removedData); + } + // 过滤 remove 路径 + return edges.filter(function (edge) { return removedData.findIndex(function (i) { return i === edge[sourceField] + "_" + edge[targetField]; }) < 0; }); +} + +function getNodeWidthRatio(nodeWidth, nodeWidthRatio, width) { + return isRealNumber(nodeWidth) ? nodeWidth / width : nodeWidthRatio; +} +function getNodePaddingRatio(nodePadding, nodePaddingRatio, height) { + return isRealNumber(nodePadding) ? nodePadding / height : nodePaddingRatio; +} +/** + * 将桑基图配置经过 layout，生成最终的 view 数据 + * @param options + * @param width + * @param height + */ +function transformToViewsData(options, width, height) { + var data = options.data, sourceField = options.sourceField, targetField = options.targetField, weightField = options.weightField, nodeAlign = options.nodeAlign, nodeSort = options.nodeSort, nodePadding = options.nodePadding, nodePaddingRatio = options.nodePaddingRatio, nodeWidth = options.nodeWidth, nodeWidthRatio = options.nodeWidthRatio, nodeDepth = options.nodeDepth, _a = options.rawFields, rawFields = _a === void 0 ? [] : _a; + var sankeyLayoutInputData = transformDataToNodeLinkData(cutoffCircle(data, sourceField, targetField), sourceField, targetField, weightField, rawFields); + // 3. layout 之后的数据 + var _b = sankeyLayout({ + nodeAlign: nodeAlign, + nodePadding: getNodePaddingRatio(nodePadding, nodePaddingRatio, height), + nodeWidth: getNodeWidthRatio(nodeWidth, nodeWidthRatio, width), + nodeSort: nodeSort, + nodeDepth: nodeDepth, + }, sankeyLayoutInputData), nodes = _b.nodes, links = _b.links; + // 4. 生成绘图数据 + return { + nodes: nodes.map(function (node) { + return __assign$r(__assign$r({}, pick$1(node, __spreadArrays$1(['x', 'y', 'name'], rawFields))), { isNode: true }); + }), + edges: links.map(function (link) { + return __assign$r(__assign$r({ source: link.source.name, target: link.target.name, name: link.source.name || link.target.name }, pick$1(link, __spreadArrays$1(['x', 'y', 'value'], rawFields))), { isNode: false }); + }), + }; +} + +var X_FIELD$1 = 'x'; +var Y_FIELD$1 = 'y'; +var COLOR_FIELD = 'name'; +var NODES_VIEW_ID = 'nodes'; +var EDGES_VIEW_ID = 'edges'; + +/** + * 默认配置项 处理 + * @param params + */ +function defaultOptions$1(params) { + var options = params.options; + var _a = options.rawFields, rawFields = _a === void 0 ? [] : _a; + return deepAssign({}, { + options: { + tooltip: { + fields: uniq$3(__spreadArrays$1(['name', 'source', 'target', 'value', 'isNode'], rawFields)), + }, + label: { + fields: uniq$3(__spreadArrays$1(['x', 'name'], rawFields)), + }, + }, + }, params); +} +/** + * geometry 处理 + * @param params + */ +function geometry$1(params) { + var chart = params.chart, options = params.options; + var color = options.color, nodeStyle = options.nodeStyle, edgeStyle = options.edgeStyle, label = options.label, tooltip = options.tooltip, nodeState = options.nodeState, edgeState = options.edgeState; + // 1. 组件，优先设置，因为子 view 会继承配置 + chart.legend(false); + chart.tooltip(tooltip); + chart.axis(false); + // y 镜像一下，防止图形顺序和数据顺序反了 + chart.coordinate().reflect('y'); + // 2. node edge views + // @ts-ignore + var _a = transformToViewsData(options, chart.width, chart.height), nodes = _a.nodes, edges = _a.edges; + // edge view + var edgeView = chart.createView({ id: EDGES_VIEW_ID }); + edgeView.data(edges); + edge({ + chart: edgeView, + // @ts-ignore + options: { + xField: X_FIELD$1, + yField: Y_FIELD$1, + seriesField: COLOR_FIELD, + edge: { + color: color, + style: edgeStyle, + shape: 'arc', + }, + tooltip: tooltip, + state: edgeState, + }, + }); + var nodeView = chart.createView({ id: NODES_VIEW_ID }); + nodeView.data(nodes); + polygon({ + chart: nodeView, + options: { + xField: X_FIELD$1, + yField: Y_FIELD$1, + seriesField: COLOR_FIELD, + polygon: { + color: color, + style: nodeStyle, + }, + label: label, + tooltip: tooltip, + state: nodeState, + }, + }); + chart.interaction('element-active'); + // scale + chart.scale({ + x: { sync: true, nice: true, min: 0, max: 1, minLimit: 0, maxLimit: 1 }, + y: { sync: true, nice: true, min: 0, max: 1, minLimit: 0, maxLimit: 1 }, + name: { sync: 'color', type: 'cat' }, + }); + return params; +} +/** + * 动画 + * @param params + */ +function animation$1(params) { + var chart = params.chart, options = params.options; + var animation = options.animation; + // 同时设置整个 view 动画选项 + if (typeof animation === 'boolean') { + chart.animate(animation); + } + else { + chart.animate(true); + } + var geometries = __spreadArrays$1(chart.views[0].geometries, chart.views[1].geometries); + // 所有的 Geometry 都使用同一动画（各个图形如有区别，自行覆盖） + geometries.forEach(function (g) { + g.animate(animation); + }); + return params; +} +/** + * 节点拖动 + * @param params + */ +function nodeDraggable(params) { + var chart = params.chart, options = params.options; + var nodeDraggable = options.nodeDraggable; + var DRAG_INTERACTION = 'sankey-node-draggable'; + if (nodeDraggable) { + chart.interaction(DRAG_INTERACTION); + } + else { + chart.removeInteraction(DRAG_INTERACTION); + } + return params; +} +/** + * 图适配器 + * @param chart + * @param options + */ +function adaptor$4(params) { + // flow 的方式处理所有的配置到 G2 API + return flow(defaultOptions$1, geometry$1, interaction$6, nodeDraggable, animation$1, theme$2 + // ... 其他的 adaptor flow + )(params); +} + +var SankeyNodeDragAction = /** @class */ (function (_super) { + __extends$e(SankeyNodeDragAction, _super); + function SankeyNodeDragAction() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** + * 是否在拖拽中的标记 + */ + _this.isDragging = false; + return _this; + } + /** + * 当前操作的是否是 element + */ + SankeyNodeDragAction.prototype.isNodeElement = function () { + var shape = get$3(this.context, 'event.target'); + if (shape) { + var element = shape.get('element'); + return element && element.getModel().data.isNode; + } + return false; + }; + SankeyNodeDragAction.prototype.getNodeView = function () { + return findViewById(this.context.view, NODES_VIEW_ID); + }; + SankeyNodeDragAction.prototype.getEdgeView = function () { + return findViewById(this.context.view, EDGES_VIEW_ID); + }; + /** + * 获取当前操作的 index + * @param element + */ + SankeyNodeDragAction.prototype.getCurrentDatumIdx = function (element) { + return this.getNodeView().geometries[0].elements.indexOf(element); + }; + /** + * 点击下去，开始 + */ + SankeyNodeDragAction.prototype.start = function () { + // 记录开始了的状态 + if (this.isNodeElement()) { + this.prevPoint = { + x: get$3(this.context, 'event.x'), + y: get$3(this.context, 'event.y'), + }; + var element = this.context.event.target.get('element'); + var idx = this.getCurrentDatumIdx(element); + if (idx === -1) { + return; + } + this.currentElementIdx = idx; + this.context.isDragging = true; + this.isDragging = true; + // 关闭动画并暂存配置 + this.prevNodeAnimateCfg = this.getNodeView().getOptions().animate; + this.prevEdgeAnimateCfg = this.getEdgeView().getOptions().animate; + this.getNodeView().animate(false); + this.getEdgeView().animate(false); + } + }; + /** + * 移动过程中，平移 + */ + SankeyNodeDragAction.prototype.translate = function () { + if (this.isDragging) { + var chart = this.context.view; + var currentPoint = { + x: get$3(this.context, 'event.x'), + y: get$3(this.context, 'event.y'), + }; + var x = currentPoint.x - this.prevPoint.x; + var y = currentPoint.y - this.prevPoint.y; + var nodeView = this.getNodeView(); + var element = nodeView.geometries[0].elements[this.currentElementIdx]; + // 修改数据 + if (element && element.getModel()) { + var prevDatum = element.getModel().data; + var data = nodeView.getOptions().data; + var coordinate = nodeView.getCoordinate(); + var datumGap_1 = { + x: x / coordinate.getWidth(), + y: y / coordinate.getHeight(), + }; + var nextDatum = __assign$r(__assign$r({}, prevDatum), { x: prevDatum.x.map(function (x) { return (x += datumGap_1.x); }), y: prevDatum.y.map(function (y) { return (y += datumGap_1.y); }) }); + // 处理一下在 [0, 1] 范围 + // 1. 更新 node 数据 + var newData = __spreadArrays$1(data); + newData[this.currentElementIdx] = nextDatum; + nodeView.data(newData); + // 2. 更新 edge 数据 + var name_1 = prevDatum.name; + var edgeView = this.getEdgeView(); + var edgeData = edgeView.getOptions().data; + edgeData.forEach(function (datum) { + // 2.1 以该 node 为 source 的边，修改 [x0, x1, x2, x3] 中的 x0, x1 + if (datum.source === name_1) { + datum.x[0] += datumGap_1.x; + datum.x[1] += datumGap_1.x; + datum.y[0] += datumGap_1.y; + datum.y[1] += datumGap_1.y; + } + // 2.2 以该 node 为 target 的边，修改 [x0, x1, x2, x3] 中的 x2, x3 + if (datum.target === name_1) { + datum.x[2] += datumGap_1.x; + datum.x[3] += datumGap_1.x; + datum.y[2] += datumGap_1.y; + datum.y[3] += datumGap_1.y; + } + }); + edgeView.data(edgeData); + // 3. 更新最新位置 + this.prevPoint = currentPoint; + // node edge 都改变了，所以要从底层 render + chart.render(true); + } + } + }; + /** + * 结论，清除状态 + */ + SankeyNodeDragAction.prototype.end = function () { + this.isDragging = false; + this.context.isDragging = false; + this.prevPoint = null; + this.currentElementIdx = null; + // 还原动画 + this.getNodeView().animate(this.prevNodeAnimateCfg); + this.getEdgeView().animate(this.prevEdgeAnimateCfg); + }; + return SankeyNodeDragAction; +}(Action$1)); + +registerAction('sankey-node-drag', SankeyNodeDragAction); +registerInteraction('sankey-node-draggable', { + showEnable: [ + { trigger: 'polygon:mouseenter', action: 'cursor:pointer' }, + { trigger: 'polygon:mouseleave', action: 'cursor:default' }, + ], + start: [{ trigger: 'polygon:mousedown', action: 'sankey-node-drag:start' }], + processing: [ + { trigger: 'plot:mousemove', action: 'sankey-node-drag:translate' }, + { isEnable: function (context) { return context.isDragging; }, trigger: 'plot:mousemove', action: 'cursor:move' }, + ], + end: [{ trigger: 'plot:mouseup', action: 'sankey-node-drag:end' }], +}); + +/** + * 桑基图 Sankey + */ +var Sankey$1 = /** @class */ (function (_super) { + __extends$e(Sankey, _super); + function Sankey() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'sankey'; + return _this; + } + Sankey.getDefaultOptions = function () { + return { + appendPadding: 8, + syncViewPadding: true, + nodeStyle: { + opacity: 1, + fillOpacity: 1, + lineWidth: 1, + }, + edgeStyle: { + opacity: 0.3, + lineWidth: 0, + }, + edgeState: { + active: { + style: { + opacity: 0.8, + lineWidth: 0, + }, + }, + }, + label: { + formatter: function (_a) { + var name = _a.name; + return name; + }, + callback: function (x) { + var isLast = x[1] === 1; // 最后一列靠边的节点 + return { + style: { + fill: '#545454', + textAlign: isLast ? 'end' : 'start', + }, + offsetX: isLast ? -8 : 8, + }; + }, + layout: [ + { + type: 'hide-overlap', + }, + ], + }, + tooltip: { + showTitle: false, + showMarkers: false, + shared: false, + // 内置：node 不显示 tooltip，edge 显示 tooltip + showContent: function (items) { + return !get$3(items, [0, 'data', 'isNode']); + }, + formatter: function (datum) { + var source = datum.source, target = datum.target, value = datum.value; + return { + name: source + ' -> ' + target, + value: value, + }; + }, + }, + nodeWidthRatio: 0.008, + nodePaddingRatio: 0.01, + animation: { + appear: { + animation: 'wave-in', + }, + enter: { + animation: 'wave-in', + }, + }, + }; + }; + /** + * @override + * @param data + */ + Sankey.prototype.changeData = function (data) { + this.updateOption({ data: data }); + var _a = transformToViewsData(this.options, this.chart.width, this.chart.height), nodes = _a.nodes, edges = _a.edges; + var nodesView = findViewById(this.chart, NODES_VIEW_ID); + var edgesView = findViewById(this.chart, EDGES_VIEW_ID); + nodesView.changeData(nodes); + edgesView.changeData(edges); + }; + /** + * 获取适配器 + */ + Sankey.prototype.getSchemaAdaptor = function () { + return adaptor$4; + }; + /** + * 获取 条形图 默认配置 + */ + Sankey.prototype.getDefaultOptions = function () { + return Sankey.getDefaultOptions(); + }; + return Sankey; +}(Plot)); + +/* + * for Arc Diagram (edges without weight) / Chord Diagram (edges with source and target weight) + * graph data required (nodes, edges) + */ +var DEFAULT_OPTIONS$4 = { + y: 0, + nodeWidthRatio: 0.05, + weight: false, + nodePaddingRatio: 0.1, + id: function (node) { return node.id; }, + source: function (edge) { return edge.source; }, + target: function (edge) { return edge.target; }, + sourceWeight: function (edge) { return edge.value || 1; }, + targetWeight: function (edge) { return edge.value || 1; }, + sortBy: null, +}; +/** + * 处理节点的value、edges + * @param nodeById + * @param edges + * @param options + */ +function processGraph(nodeById, edges, options) { + each$2(nodeById, function (node, id) { + // in edges, out edges + node.inEdges = edges.filter(function (edge) { return "" + options.target(edge) === "" + id; }); + node.outEdges = edges.filter(function (edge) { return "" + options.source(edge) === "" + id; }); + // frequency + node.edges = node.outEdges.concat(node.inEdges); + node.frequency = node.edges.length; + // weight + node.value = 0; + node.inEdges.forEach(function (edge) { + node.value += options.targetWeight(edge); + }); + node.outEdges.forEach(function (edge) { + node.value += options.sourceWeight(edge); + }); + }); +} +/** + * 节点排序 + * @param nodes + * @param options + */ +function sortNodes(nodes, options) { + var sortMethods = { + weight: function (a, b) { return b.value - a.value; }, + frequency: function (a, b) { return b.frequency - a.frequency; }, + id: function (a, b) { return ("" + options.id(a)).localeCompare("" + options.id(b)); }, + }; + var method = sortMethods[options.sortBy]; + if (!method && isFunction$6(options.sortBy)) { + method = options.sortBy; + } + if (method) { + nodes.sort(method); + } +} +function layoutNodes(nodes, options) { + var len = nodes.length; + if (!len) { + throw new TypeError("Invalid nodes: it's empty!"); + } + if (options.weight) { + var nodePaddingRatio_1 = options.nodePaddingRatio; + if (nodePaddingRatio_1 < 0 || nodePaddingRatio_1 >= 1) { + throw new TypeError('Invalid nodePaddingRatio: it must be in range [0, 1)!'); + } + var margin_1 = nodePaddingRatio_1 / (2 * len); + var nodeWidthRatio_1 = options.nodeWidthRatio; + if (nodeWidthRatio_1 <= 0 || nodeWidthRatio_1 >= 1) { + throw new TypeError('Invalid nodeWidthRatio: it must be in range (0, 1)!'); + } + var totalValue_1 = 0; + nodes.forEach(function (node) { + totalValue_1 += node.value; + }); + nodes.forEach(function (node) { + node.weight = node.value / totalValue_1; + node.width = node.weight * (1 - nodePaddingRatio_1); + node.height = nodeWidthRatio_1; + }); + nodes.forEach(function (node, index) { + // x + var deltaX = 0; + for (var i = index - 1; i >= 0; i--) { + deltaX += nodes[i].width + 2 * margin_1; + } + var minX = (node.minX = margin_1 + deltaX); + var maxX = (node.maxX = node.minX + node.width); + var minY = (node.minY = options.y - nodeWidthRatio_1 / 2); + var maxY = (node.maxY = minY + nodeWidthRatio_1); + node.x = [minX, maxX, maxX, minX]; + node.y = [minY, minY, maxY, maxY]; + /* points + * 3---2 + * | | + * 0---1 + */ + // node.x = minX + 0.5 * node.width; + // node.y = options.y; + }); + } + else { + var deltaX_1 = 1 / len; + nodes.forEach(function (node, index) { + node.x = (index + 0.5) * deltaX_1; + node.y = options.y; + }); + } + return nodes; +} +function locatingEdges(nodeById, edges, options) { + if (options.weight) { + var valueById_1 = {}; + each$2(nodeById, function (node, id) { + valueById_1[id] = node.value; + }); + edges.forEach(function (edge) { + var sId = options.source(edge); + var tId = options.target(edge); + var sNode = nodeById[sId]; + var tNode = nodeById[tId]; + if (sNode && tNode) { + var sValue = valueById_1[sId]; + var currentSValue = options.sourceWeight(edge); + var sStart = sNode.minX + ((sNode.value - sValue) / sNode.value) * sNode.width; + var sEnd = sStart + (currentSValue / sNode.value) * sNode.width; + valueById_1[sId] -= currentSValue; + var tValue = valueById_1[tId]; + var currentTValue = options.targetWeight(edge); + var tStart = tNode.minX + ((tNode.value - tValue) / tNode.value) * tNode.width; + var tEnd = tStart + (currentTValue / tNode.value) * tNode.width; + valueById_1[tId] -= currentTValue; + var y = options.y; + edge.x = [sStart, sEnd, tStart, tEnd]; + edge.y = [y, y, y, y]; + // 将edge的source与target的id换为 sourceNode与targetNode + edge.source = sNode; + edge.target = tNode; + } + }); + } + else { + edges.forEach(function (edge) { + var sNode = nodeById[options.source(edge)]; + var tNode = nodeById[options.target(edge)]; + if (sNode && tNode) { + edge.x = [sNode.x, tNode.x]; + edge.y = [sNode.y, tNode.y]; + // 将edge的source与target的id换为 sourceNode与targetNode + edge.source = sNode; + edge.target = tNode; + } + }); + } + return edges; +} +function getDefaultOptions(options) { + return mix({}, DEFAULT_OPTIONS$4, options); +} +function chordLayout(chordLayoutOptions, chordLayoutInputData) { + var options = getDefaultOptions(chordLayoutOptions); + var nodeById = {}; + var nodes = chordLayoutInputData.nodes; + var links = chordLayoutInputData.links; + nodes.forEach(function (node) { + var id = options.id(node); + nodeById[id] = node; + }); + processGraph(nodeById, links, options); + sortNodes(nodes, options); + var outputNodes = layoutNodes(nodes, options); + var outputLinks = locatingEdges(nodeById, links, options); + return { + nodes: outputNodes, + links: outputLinks, + }; +} + +var X_FIELD = 'x'; +var Y_FIELD = 'y'; +var NODE_COLOR_FIELD = 'name'; +var EDGE_COLOR_FIELD = 'source'; +var DEFAULT_OPTIONS$3 = { + nodeStyle: { + opacity: 1, + fillOpacity: 1, + lineWidth: 1, + }, + edgeStyle: { + opacity: 0.5, + lineWidth: 2, + }, + label: { + fields: ['x', 'name'], + callback: function (x, name) { + var centerX = (x[0] + x[1]) / 2; + var offsetX = centerX > 0.5 ? -4 : 4; + return { + labelEmit: true, + style: { + fill: '#8c8c8c', + }, + offsetX: offsetX, + content: name, + }; + }, + }, + tooltip: { + showTitle: false, + showMarkers: false, + fields: ['source', 'target', 'value', 'isNode'], + // 内置：node 不显示 tooltip (业务层自行处理)，edge 显示 tooltip + showContent: function (items) { + return !get$3(items, [0, 'data', 'isNode']); + }, + formatter: function (datum) { + var source = datum.source, target = datum.target, value = datum.value; + return { + name: source + " -> " + target, + value: value, + }; + }, + }, + interactions: [ + { + type: 'element-active', + }, + ], + weight: true, + nodePaddingRatio: 0.1, + nodeWidthRatio: 0.05, +}; + +function transformData$1(params) { + // 将弦图数据放到ext中，nodeGeometry edgeGeometry使用 + var options = params.options; + var data = options.data, sourceField = options.sourceField, targetField = options.targetField, weightField = options.weightField, nodePaddingRatio = options.nodePaddingRatio, nodeWidthRatio = options.nodeWidthRatio, _a = options.rawFields, rawFields = _a === void 0 ? [] : _a; + // 将数据转换为node link格式 + var chordLayoutInputData = transformDataToNodeLinkData(data, sourceField, targetField, weightField); + var _b = chordLayout({ weight: true, nodePaddingRatio: nodePaddingRatio, nodeWidthRatio: nodeWidthRatio }, chordLayoutInputData), nodes = _b.nodes, links = _b.links; + // 1. 生成绘制node使用数据 + var nodesData = nodes.map(function (node) { + return __assign$r(__assign$r({}, pick$1(node, __spreadArrays$1(['id', 'x', 'y', 'name'], rawFields))), { isNode: true }); + }); + // 2. 生成 edge 使用数据 （同桑基图） + var edgesData = links.map(function (link) { + return __assign$r(__assign$r({ source: link.source.name, target: link.target.name, name: link.source.name || link.target.name }, pick$1(link, __spreadArrays$1(['x', 'y', 'value'], rawFields))), { isNode: false }); + }); + return __assign$r(__assign$r({}, params), { ext: __assign$r(__assign$r({}, params.ext), { + // 将chordData放到ext中，方便下面的geometry使用 + chordData: { nodesData: nodesData, edgesData: edgesData } }) }); +} +/** + * scale配置 + * @param params 参数 + */ +function scale$2(params) { + var _a; + var chart = params.chart; + chart.scale((_a = { + x: { sync: true, nice: true }, + y: { sync: true, nice: true, max: 1 } + }, + _a[NODE_COLOR_FIELD] = { sync: 'color' }, + _a[EDGE_COLOR_FIELD] = { sync: 'color' }, + _a)); + return params; +} +/** + * axis配置 + * @param params 参数 + */ +function axis$1(params) { + var chart = params.chart; + chart.axis(false); + return params; +} +/** + * legend配置 + * @param params 参数 + */ +function legend(params) { + var chart = params.chart; + chart.legend(false); + return params; +} +/** + * tooltip配置 + * @param params 参数 + */ +function tooltip$1(params) { + var chart = params.chart, options = params.options; + var tooltip = options.tooltip; + chart.tooltip(tooltip); + return params; +} +/** + * coordinate配置 + * @param params 参数 + */ +function coordinate(params) { + var chart = params.chart; + chart.coordinate('polar').reflect('y'); + return params; +} +/** + * nodeGeometry配置 + * @param params 参数 + */ +function nodeGeometry(params) { + // node view + var chart = params.chart, options = params.options; + var nodesData = params.ext.chordData.nodesData; + var nodeStyle = options.nodeStyle, label = options.label, tooltip = options.tooltip; + var nodeView = chart.createView(); + nodeView.data(nodesData); + // 面 + polygon({ + chart: nodeView, + options: { + xField: X_FIELD, + yField: Y_FIELD, + seriesField: NODE_COLOR_FIELD, + polygon: { + style: nodeStyle, + }, + label: label, + tooltip: tooltip, + }, + }); + return params; +} +/** + * edgeGeometry配置 + * @param params 参数 + */ +function edgeGeometry(params) { + var chart = params.chart, options = params.options; + var edgesData = params.ext.chordData.edgesData; + var edgeStyle = options.edgeStyle, tooltip = options.tooltip; + var edgeView = chart.createView(); + edgeView.data(edgesData); + // edge + var edgeOptions = { + xField: X_FIELD, + yField: Y_FIELD, + seriesField: EDGE_COLOR_FIELD, + edge: { + style: edgeStyle, + shape: 'arc', + }, + tooltip: tooltip, + }; + edge({ + chart: edgeView, + options: edgeOptions, + }); + return params; +} +function animation(params) { + var chart = params.chart, options = params.options; + var animation = options.animation; + // 同时设置整个 view 动画选项 + if (typeof animation === 'boolean') { + chart.animate(animation); + } + else { + chart.animate(true); + } + // 所有的 Geometry 都使用同一动画（各个图形如有区别，自行覆盖） + each$2(getAllGeometriesRecursively(chart), function (g) { + g.animate(animation); + }); + return params; +} +/** + * 弦图适配器 + * @param chart + * @param options + */ +function adaptor$3(params) { + // flow 的方式处理所有的配置到 G2 API + return flow(theme$2, transformData$1, coordinate, scale$2, axis$1, legend, tooltip$1, edgeGeometry, nodeGeometry, interaction$6, state, animation)(params); +} + +/** + * 弦图 Chord + */ +var Chord$1 = /** @class */ (function (_super) { + __extends$e(Chord, _super); + function Chord() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'chord'; + return _this; + } + /** + * 获取 面积图 默认配置项 + * 供外部使用 + */ + Chord.getDefaultOptions = function () { + return DEFAULT_OPTIONS$3; + }; + Chord.prototype.getDefaultOptions = function () { + return Chord.getDefaultOptions(); + }; + /** + * 获取适配器 + */ + Chord.prototype.getSchemaAdaptor = function () { + return adaptor$3; + }; + return Chord; +}(Plot)); + +var DEFAULT_OPTIONS$2 = { + field: 'value', + as: ['x', 'y', 'r'], + // 默认降序 + sort: function (a, b) { return b.value - a.value; }, +}; +function pack(data, options) { + options = mix({}, DEFAULT_OPTIONS$2, options); + var as = options.as; + if (!isArray$n(as) || as.length !== 3) { + throw new TypeError('Invalid as: it must be an array with 3 strings (e.g. [ "x", "y", "r" ])!'); + } + var field; + try { + field = getField(options); + } + catch (e) { + console.warn(e); + } + var packLayout = function (data) { + return index$3().size(options.size).padding(options.padding)(hierarchy$1(data) + .sum(function (d) { return d[field]; }) + .sort(options.sort)); + }; + var root = packLayout(data); + var x = as[0]; + var y = as[1]; + var r = as[2]; + root.each(function (node) { + node[x] = node.x; + node[y] = node.y; + node[r] = node.r; + }); + return getAllNodes(root); +} + +/** + * circle-packing 数据转换 + * @param options + */ +function transformData(options) { + var data = options.data, hierarchyConfig = options.hierarchyConfig, _a = options.rawFields, rawFields = _a === void 0 ? [] : _a, enableDrillDown = options.enableDrillDown; + var nodes = pack(data, __assign$r(__assign$r({}, hierarchyConfig), { field: 'value', as: ['x', 'y', 'r'] })); + var result = []; + nodes.forEach(function (node) { + var _a; + var path = node.data.name; + var ancestorNode = __assign$r({}, node); + while (ancestorNode.depth > 1) { + path = ((_a = ancestorNode.parent.data) === null || _a === void 0 ? void 0 : _a.name) + " / " + path; + ancestorNode = ancestorNode.parent; + } + // 开启下钻，仅加载 depth <= 2 的数据 (加载两层) + if (enableDrillDown && node.depth > 2) { + return null; + } + var nodeInfo = deepAssign({}, node.data, __assign$r(__assign$r(__assign$r({}, pick$1(node.data, rawFields)), { path: path }), node)); + nodeInfo.ext = hierarchyConfig; + nodeInfo[HIERARCHY_DATA_TRANSFORM_PARAMS] = { hierarchyConfig: hierarchyConfig, rawFields: rawFields, enableDrillDown: enableDrillDown }; + result.push(nodeInfo); + }); + return result; +} +/** + * 根据传入的 padding 和 现有的 画布大小， 输出针对圆形视图布局需要的 finalPadding 以及 finalSize + * @param params + */ +function resolvePaddingForCircle(padding, appendPadding, containerSize) { + var tempPadding = resolveAllPadding([padding, appendPadding]); + var top = tempPadding[0], right = tempPadding[1], bottom = tempPadding[2], left = tempPadding[3]; // 没设定，默认是 [0, 0, 0, 0] + var width = containerSize.width, height = containerSize.height; + // 有了 tempPadding 介入以后，计算出coordinate范围宽高的最小值 minSize = circle-packing的直径 + var wSize = width - (left + right); + var hSize = height - (top + bottom); + var minSize = Math.min(wSize, hSize); // circle-packing的直径 + // 得到居中后各方向剩余的 padding + var restWidthPadding = (wSize - minSize) / 2; + var restHeightPadding = (hSize - minSize) / 2; + var finalTop = top + restHeightPadding; + var finalRight = right + restWidthPadding; + var finalBottom = bottom + restHeightPadding; + var finalLeft = left + restWidthPadding; + var finalPadding = [finalTop, finalRight, finalBottom, finalLeft]; + var finalSize = minSize < 0 ? 0 : minSize; // 防止为负数 + return { finalPadding: finalPadding, finalSize: finalSize }; +} + +/** 默认的源字段 */ +var RAW_FIELDS = ['x', 'y', 'r', 'name', 'value', 'path', 'depth']; +var DEFAULT_OPTIONS$1 = { + // 默认按照 name 字段对颜色进行分类 + colorField: 'name', + autoFit: true, + pointStyle: { + lineWidth: 0, + stroke: '#fff', + }, + // 默认不开启图例 + legend: false, + hierarchyConfig: { + size: [1, 1], + padding: 0, + }, + label: { + fields: ['name'], + layout: { + type: 'limit-in-shape', + }, + }, + tooltip: { + showMarkers: false, + showTitle: false, + }, + // 默认不可以下钻 + drilldown: { enabled: false }, +}; + +/** + * 获取默认 option + * @param params + */ +function defaultOptions(params) { + var chart = params.chart; + var diameter = Math.min(chart.viewBBox.width, chart.viewBBox.height); + return deepAssign({ + options: { + size: function (_a) { + var r = _a.r; + return r * diameter; + }, + }, + }, params); +} +/** + * padding 配置 + * @param params + */ +function padding(params) { + var options = params.options, chart = params.chart; + // 通过改变 padding，修改 coordinate 的绘制区域 + var containerSize = chart.viewBBox; + var padding = options.padding, appendPadding = options.appendPadding, drilldown = options.drilldown; + var tempAppendPadding = appendPadding; + if (drilldown === null || drilldown === void 0 ? void 0 : drilldown.enabled) { + var appendPaddingByDrilldown = getAdjustAppendPadding(chart.appendPadding, get$3(drilldown, ['breadCrumb', 'position'])); + tempAppendPadding = resolveAllPadding([appendPaddingByDrilldown, appendPadding]); + } + var finalPadding = resolvePaddingForCircle(padding, tempAppendPadding, containerSize).finalPadding; + chart.padding = finalPadding; + chart.appendPadding = 0; + return params; +} +/** + * 字段 + * @param params + */ +function geometry(params) { + var chart = params.chart, options = params.options; + var padding = chart.padding, appendPadding = chart.appendPadding; + var color = options.color, colorField = options.colorField, pointStyle = options.pointStyle, hierarchyConfig = options.hierarchyConfig, sizeField = options.sizeField, _a = options.rawFields, rawFields = _a === void 0 ? [] : _a, drilldown = options.drilldown; + var data = transformData({ + data: options.data, + hierarchyConfig: hierarchyConfig, + enableDrillDown: drilldown === null || drilldown === void 0 ? void 0 : drilldown.enabled, + rawFields: rawFields, + }); + chart.data(data); + var containerSize = chart.viewBBox; + var finalSize = resolvePaddingForCircle(padding, appendPadding, containerSize).finalSize; + // 有sizeField的时候，例如 value ，可以选择映射 size 函数，自己计算出映射的半径 + var circleSize = function (_a) { + var r = _a.r; + return r * finalSize; + }; // 默认配置 + if (sizeField) { + circleSize = function (d) { return d[sizeField] * finalSize; }; // 目前只有 r 通道映射效果会正常 + } + // geometry + point(deepAssign({}, params, { + options: { + xField: 'x', + yField: 'y', + seriesField: colorField, + sizeField: sizeField, + rawFields: __spreadArrays$1(RAW_FIELDS, rawFields), + point: { + color: color, + style: pointStyle, + shape: 'circle', + size: circleSize, + }, + }, + })); + return params; +} +/** + * meta 配置 + * @param params + */ +function meta(params) { + return flow(scale$3({}, { + // 必须强制为 nice + x: { min: 0, max: 1, minLimit: 0, maxLimit: 1, nice: true }, + y: { min: 0, max: 1, minLimit: 0, maxLimit: 1, nice: true }, + }))(params); +} +/** + * tooltip 配置 + * @param params + */ +function tooltip(params) { + var chart = params.chart, options = params.options; + var tooltip = options.tooltip; + if (tooltip === false) { + chart.tooltip(false); + } + else { + var tooltipOptions = tooltip; + // 设置了 fields，就不进行 customItems 了; 设置 formatter 时，需要搭配 fields + if (!get$3(tooltip, 'fields')) { + tooltipOptions = deepAssign({}, { + customItems: function (items) { + return items.map(function (item) { + var scales = get$3(chart.getOptions(), 'scales'); + var nameFormatter = get$3(scales, ['name', 'formatter'], function (v) { return v; }); + var valueFormatter = get$3(scales, ['value', 'formatter'], function (v) { return v; }); + return __assign$r(__assign$r({}, item), { name: nameFormatter(item.data.name), value: valueFormatter(item.data.value) }); + }); + }, + }, tooltipOptions); + } + chart.tooltip(tooltipOptions); + } + return params; +} +/** + * 坐标轴, 默认关闭 + * @param params + */ +function axis(params) { + var chart = params.chart; + chart.axis(false); + return params; +} +function adaptorInteraction(options) { + var drilldown = options.drilldown, _a = options.interactions, interactions = _a === void 0 ? [] : _a; + if (drilldown === null || drilldown === void 0 ? void 0 : drilldown.enabled) { + return deepAssign({}, options, { + interactions: __spreadArrays$1(interactions, [ + { + type: 'drill-down', + cfg: { drillDownConfig: drilldown, transformData: transformData, enableDrillDown: true }, + }, + ]), + }); + } + return options; +} +/** + * 交互配置 + * @param params + * @returns + */ +function interaction(params) { + var chart = params.chart, options = params.options; + interaction$6({ + chart: chart, + options: adaptorInteraction(options), + }); + return params; +} +/** + * 矩形树图 + * @param chart + * @param options + */ +function adaptor$2(params) { + return flow(pattern('pointStyle'), defaultOptions, padding, theme$2, meta, geometry, axis, legend$f, tooltip, interaction, animation$5, annotation$2())(params); +} + +/** + * CirclePacking + * @usage hierarchy, proportions + */ +/** @class */ ((function (_super) { + __extends$e(CirclePacking, _super); + function CirclePacking() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'circle-packing'; + return _this; + } + /** + * 获取 面积图 默认配置项 + * 供外部使用 + */ + CirclePacking.getDefaultOptions = function () { + return DEFAULT_OPTIONS$1; + }; + CirclePacking.prototype.getDefaultOptions = function () { + return CirclePacking.getDefaultOptions(); + }; + /** + * 获取适配器 + */ + CirclePacking.prototype.getSchemaAdaptor = function () { + return adaptor$2; + }; + /** + * 覆写父类的方法 + */ + CirclePacking.prototype.triggerResize = function () { + if (!this.chart.destroyed) { + // 首先自适应容器的宽高 + this.chart.forceFit(); // g2 内部执行 changeSize，changeSize 中执行 render(true) + this.chart.clear(); + this.execAdaptor(); // 核心：宽高更新之后计算padding + // 渲染 + this.chart.render(true); + } + }; + return CirclePacking; +})(Plot)); + +/** + * 给 G2Plot 提供非常简单的开放开发的机制。目的是能够让社区和业务上自己基于 G2Plot 开发自己的定制图表库。主要分成几类图表： + * 1. 领域专业的图表，内部同学因为没有场景，不一定能做的完善。 + * 2. 定制业务的图表，不具备通用性 + * 3. 趣味性的可视化组件 + * 然后官方可以根据社区的情况，可以进行一些官方推荐和采纳。 + * + * 如果使用？ + * + * ```ts + * import { P } from '@antv/g2plot'; + * import { GeoWorldMap, GeoWorldMapOptions } from 'g2plot-geo-world-map'; + * + * const plot = new P('container', { + * geoJson: '', + * longitude: '', + * latitude: '', + * }, GeoWorldMap, defaultOptions); + * + * plot.render(); + * ``` + */ +/** @class */ ((function (_super) { + __extends$e(P, _super); + /** + * 相比普通图表增加 adaptor 参数。 + * @param container + * @param options + * @param adaptor + * @param defaultOptions + */ + function P(container, options, adaptor, defaultOptions) { + var _this = _super.call(this, container, deepAssign({}, defaultOptions, options)) || this; + /** 统一为 any plot */ + _this.type = 'g2-plot'; + _this.defaultOptions = defaultOptions; + _this.adaptor = adaptor; + return _this; + } + /** + * 实现父类方法，直接使用传入的 + */ + P.prototype.getDefaultOptions = function () { + return this.defaultOptions; + }; + /** + * 实现父类方法，直接使用传入的 + */ + P.prototype.getSchemaAdaptor = function () { + return this.adaptor; + }; + return P; +})(Plot)); + +/** + * 可在 multi-view 中使用的 plots + */ +var PLOT_ADAPTORS = { + line: adaptor$y, + pie: adaptor$u, + column: adaptor$w, + bar: adaptor$v, + area: adaptor$x, + gauge: adaptor$9, + 'tiny-line': adaptor$n, + 'tiny-column': adaptor$m, + 'tiny-area': adaptor$o, + 'ring-progress': adaptor$j, + progress: adaptor$k, + scatter: adaptor$r, + histogram: adaptor$l, + funnel: adaptor$d, +}; +/** + * 获取指定 plot 的 class contructor + * @param {string} plot + */ +var PLOT_CONSTRUCTOR = { + line: Line$3, + pie: Pie$1, + column: Column$1, + bar: Bar$1, + area: Area$1, + gauge: Gauge$1, + 'tiny-line': TinyLine$1, + 'tiny-column': TinyColumn$1, + 'tiny-area': TinyArea$1, + 'ring-progress': RingProgress$1, + progress: Progress$1, + scatter: Scatter$1, + histogram: Histogram$1, + funnel: Funnel$1, +}; +/** + * 在 mix 图表以及 facet 图表中，defaultOptions 进行复写简化 + */ +var DEFAULT_OPTIONS_MAP = { + pie: { label: false }, + column: { tooltip: { showMarkers: false } }, + bar: { tooltip: { showMarkers: false } }, +}; +/** + * 执行 plot 的 adaptor, 默认都带上 defaultOptions + * @param {string} plot + */ +function execPlotAdaptor(plot, view, options) { + var cls = PLOT_CONSTRUCTOR[plot]; + if (!cls) { + console.error("could not find " + plot + " plot"); + return; + } + var module = PLOT_ADAPTORS[plot]; + module({ + chart: view, + options: deepAssign({}, cls.getDefaultOptions(), get$3(DEFAULT_OPTIONS_MAP, plot, {}), options), + }); +} + +/** + * geometry 处理 + * @param params + */ +function multiView(params) { + var chart = params.chart, options = params.options; + var views = options.views, legend = options.legend; + each$2(views, function (v) { + var region = v.region, data = v.data, meta = v.meta, axes = v.axes, coordinate = v.coordinate, interactions = v.interactions, annotations = v.annotations, tooltip = v.tooltip, geometries = v.geometries; + // 1. 创建 view + var viewOfG2 = chart.createView({ + region: region, + }); + // 2. data + viewOfG2.data(data); + // 3. meta + var scales = {}; + if (axes) { + each$2(axes, function (axis, field) { + scales[field] = pick$1(axis, AXIS_META_CONFIG_KEYS); + }); + } + scales = deepAssign({}, meta, scales); + viewOfG2.scale(scales); + // 4. x y axis + if (!axes) { + viewOfG2.axis(false); + } + else { + each$2(axes, function (axis, field) { + viewOfG2.axis(field, axis); + }); + } + // 5. coordinate + viewOfG2.coordinate(coordinate); + // 6. geometry + each$2(geometries, function (geometry) { + var ext = geometry$w({ + chart: viewOfG2, + options: geometry, + }).ext; + // adjust + var adjust = geometry.adjust; + if (adjust) { + ext.geometry.adjust(adjust); + } + }); + // 7. interactions + each$2(interactions, function (interaction) { + if (interaction.enable === false) { + viewOfG2.removeInteraction(interaction.type); + } + else { + viewOfG2.interaction(interaction.type, interaction.cfg); + } + }); + // 8. annotations + each$2(annotations, function (annotation) { + viewOfG2.annotation()[annotation.type](__assign$r({}, annotation)); + }); + // 9. animation (先做动画) + if (typeof v.animation === 'boolean') { + viewOfG2.animate(false); + } + else { + viewOfG2.animate(true); + // 9.1 所有的 Geometry 都使用同一动画（各个图形如有区别，todo 自行覆盖） + each$2(viewOfG2.geometries, function (g) { + g.animate(v.animation); + }); + } + if (tooltip) { + // 10. tooltip + viewOfG2.interaction('tooltip'); + viewOfG2.tooltip(tooltip); + } + }); + // legend + if (!legend) { + chart.legend(false); + } + else { + each$2(legend, function (l, field) { + chart.legend(field, l); + }); + } + // tooltip + chart.tooltip(options.tooltip); + return params; +} +/** + * 支持嵌套使用 g2plot 内置图表 + * @param params + */ +function multiPlot(params) { + var chart = params.chart, options = params.options; + var plots = options.plots; + each$2(plots, function (plot) { + var type = plot.type, region = plot.region, _a = plot.options, options = _a === void 0 ? {} : _a; + var tooltip = options.tooltip; + var viewOfG2 = chart.createView(__assign$r({ region: region }, pick$1(options, PLOT_CONTAINER_OPTIONS))); + if (tooltip) { + // 配置 tooltip 交互 + viewOfG2.interaction('tooltip'); + } + execPlotAdaptor(type, viewOfG2, options); + }); + return params; +} +/** + * 图适配器 + * @param chart + * @param options + */ +function adaptor$1(params) { + return flow(animation$5, // 多 view 的图，动画配置放到最前面 + multiView, multiPlot, interaction$6, animation$5, theme$2, tooltip$8 + // ... 其他的 adaptor flow + )(params); +} + +/** + * 获取图表元素对应字段的值 + * @param element 图表元素 + * @param field 字段名 + * @ignore + */ +function getElementValue(element, field) { + var model = element.getModel(); + var record = model.data; + var value; + if (isArray$n(record)) { + value = record[0][field]; + } + else { + value = record[field]; + } + return value; +} +/** + * @ignore + * 清理 highlight 效果 + * @param view View 或者 Chart + */ +function clearHighlight(view) { + var elements = getAllElements(view); + each$2(elements, function (el) { + if (el.hasState('active')) { + el.setState('active', false); + } + if (el.hasState('selected')) { + el.setState('selected', false); + } + if (el.hasState('inactive')) { + el.setState('inactive', false); + } + }); +} + +/** + * 存在多个 view 时，view 之间的联动交互 + * + * 提供四个反馈 action，均接受参数：linkField 关联字段，dim 维度 + * 1. showTooltip + * 2. active + * 3. highlight + * 4. selected + * + * 附加，两个结束反馈 action： + * 1. hidetooltip + * 2. reset 清除激活和高亮状态 + */ +var Association = /** @class */ (function (_super) { + __extends$e(Association, _super); + function Association() { + return _super !== null && _super.apply(this, arguments) || this; + } + /** + * 获取关联的 elements + * + * - 如果 dim 参数存在，根据 dim 获取相应的 field。与 linkField 不匹配则 return + * - 否则 dim 参数不存在，且 linkField 存在，则作为关联字段 + * - 否则若 linkField 不存在，则获取第一个分类字段 + * @returns EventItem[] + */ + Association.prototype.getAssociationItems = function (views, params) { + var _a; + var event = this.context.event; + var _b = params || {}, linkField = _b.linkField, dim = _b.dim; + var items = []; + if ((_a = event.data) === null || _a === void 0 ? void 0 : _a.data) { + var data_1 = event.data.data; + each$2(views, function (v) { + var _a, _b; + var field = linkField; + if (dim === 'x') { + field = v.getXScale().field; + } + else if (dim === 'y') { + field = (_a = v.getYScales().find(function (s) { return s.field === field; })) === null || _a === void 0 ? void 0 : _a.field; + } + else if (!field) { + field = (_b = v.getGroupScales()[0]) === null || _b === void 0 ? void 0 : _b.field; + } + if (!field) { + return; + } + var elements = map$4(getAllElements(v), function (ele) { + var active = false; + var inactive = false; + var dataValue = isArray$n(data_1) ? get$3(data_1[0], field) : get$3(data_1, field); + if (getElementValue(ele, field) === dataValue) { + active = true; + } + else { + inactive = true; + } + return { element: ele, view: v, active: active, inactive: inactive }; + }); + items.push.apply(items, elements); + }); + } + return items; + }; + /** + * 所有同一层级的 tooltip 显示 + */ + Association.prototype.showTooltip = function (params) { + var siblings = getSiblingViews(this.context.view); + var elements = this.getAssociationItems(siblings, params); + each$2(elements, function (ele) { + if (ele.active) { + var box = ele.element.shape.getCanvasBBox(); + ele.view.showTooltip({ x: box.minX + box.width / 2, y: box.minY + box.height / 2 }); + } + }); + }; + /** + * 隐藏同一层级的 tooltip + */ + Association.prototype.hideTooltip = function () { + var siblings = getSiblingViews(this.context.view); + each$2(siblings, function (sibling) { + sibling.hideTooltip(); + }); + }; + /** + * 设置 active 状态 + */ + Association.prototype.active = function (params) { + var views = getViews(this.context.view); + var items = this.getAssociationItems(views, params); + each$2(items, function (item) { + var active = item.active, element = item.element; + if (active) { + element.setState('active', true); + } + }); + }; + /** + * 设置 selected 状态 + */ + Association.prototype.selected = function (params) { + var views = getViews(this.context.view); + var items = this.getAssociationItems(views, params); + each$2(items, function (item) { + var active = item.active, element = item.element; + if (active) { + element.setState('selected', true); + } + }); + }; + /** + * 进行高亮 => 设置 inactive 状态 + */ + Association.prototype.highlight = function (params) { + var views = getViews(this.context.view); + var items = this.getAssociationItems(views, params); + each$2(items, function (item) { + var inactive = item.inactive, element = item.element; + if (inactive) { + element.setState('inactive', true); + } + }); + }; + Association.prototype.reset = function () { + var views = getViews(this.context.view); + each$2(views, function (v) { + clearHighlight(v); + }); + }; + return Association; +}(Action$1)); +registerAction('association', Association); +/** + * 相邻 view 的 active 联动（相同维值的 tooltip 联动） + */ +registerInteraction('association-active', { + start: [{ trigger: 'element:mouseenter', action: 'association:active' }], + end: [{ trigger: 'element:mouseleave', action: 'association:reset' }], +}); +/** + * 相邻 view 的 active 联动（相同维值的 tooltip 联动） + */ +registerInteraction('association-selected', { + start: [{ trigger: 'element:mouseenter', action: 'association:selected' }], + end: [{ trigger: 'element:mouseleave', action: 'association:reset' }], +}); +/** + * 相邻 view 的 highlight 联动, 突出当前 element + */ +registerInteraction('association-highlight', { + start: [{ trigger: 'element:mouseenter', action: 'association:highlight' }], + end: [{ trigger: 'element:mouseleave', action: 'association:reset' }], +}); +/** + * 相邻 view 的 tooltip 联动，根据 groupField 进行关联（相同维值的 tooltip 联动） + */ +registerInteraction('association-tooltip', { + start: [{ trigger: 'element:mousemove', action: 'association:showTooltip' }], + end: [{ trigger: 'element:mouseleave', action: 'association:hideTooltip' }], +}); + +/** + * 多图层图形，释放 G2 80% 的功能，可以用来做： + * 1. 图层叠加的图： + * - 折线 + 置信度区间迭代 + * - 嵌套饼图 + * - ... + * 2. 图层划分的图 + * - 多维图 + * - 柱饼组合图 + * - ... + */ +var Mix$1 = /** @class */ (function (_super) { + __extends$e(Mix, _super); + function Mix() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'mix'; + return _this; + } + /** + * 获取适配器 + */ + Mix.prototype.getSchemaAdaptor = function () { + return adaptor$1; + }; + return Mix; +}(Plot)); + +/** + * + * @param params 分面图 参数 + * @returns facet eachView 的回调设置每个 view 的展示 + */ +function execViewAdaptor(viewOfG2, options) { + var data = options.data, coordinate = options.coordinate, interactions = options.interactions, annotations = options.annotations, animation = options.animation, tooltip = options.tooltip, axes = options.axes, meta = options.meta, geometries = options.geometries; + // 1. data, optional + if (data) { + viewOfG2.data(data); + } + // 2. meta 配置 + var scales = {}; + if (axes) { + each$2(axes, function (axis, field) { + scales[field] = pick$1(axis, AXIS_META_CONFIG_KEYS); + }); + } + scales = deepAssign({}, meta, scales); + viewOfG2.scale(scales); + // 3. coordinate 配置 (默认由顶层决定) + if (coordinate) { + viewOfG2.coordinate(coordinate); + } + // 4. axis 轴配置 (默认由顶层决定，但可以通过 false 强制关闭) + if (axes === false) { + viewOfG2.axis(false); + } + else { + each$2(axes, function (axis, field) { + viewOfG2.axis(field, axis); + }); + } + each$2(geometries, function (geometry) { + // Geometry + var ext = geometry$w({ + chart: viewOfG2, + options: geometry, + }).ext; + // Geometry adjust + var adjust = geometry.adjust; + if (adjust) { + ext.geometry.adjust(adjust); + } + }); + // 5. interactions + each$2(interactions, function (interaction) { + if (interaction.enable === false) { + viewOfG2.removeInteraction(interaction.type); + } + else { + viewOfG2.interaction(interaction.type, interaction.cfg); + } + }); + // 6. annotations + each$2(annotations, function (annotation) { + viewOfG2.annotation()[annotation.type](__assign$r({}, annotation)); + }); + // 7. animation (先做动画) + if (typeof animation === 'boolean') { + viewOfG2.animate(false); + } + else { + viewOfG2.animate(true); + // 所有的 Geometry 都使用同一动画（各个图形如有区别，todo 自行覆盖） + each$2(viewOfG2.geometries, function (g) { + g.animate(animation); + }); + } + if (tooltip) { + // 8. tooltip + viewOfG2.interaction('tooltip'); + viewOfG2.tooltip(tooltip); + } + else if (tooltip === false) { + viewOfG2.removeInteraction('tooltip'); + } +} + +function facetAdaptor(params) { + var chart = params.chart, options = params.options; + var facetType = options.type, data = options.data, fields = options.fields, eachView = options.eachView; + var restFacetCfg = omit$1(options, [ + 'type', + 'data', + 'fields', + 'eachView', + 'axes', + 'meta', + 'tooltip', + 'coordinate', + 'theme', + 'legend', + 'interactions', + 'annotations', + ]); + // 1. data + chart.data(data); + // 2. facet + chart.facet(facetType, __assign$r(__assign$r({}, restFacetCfg), { fields: fields, eachView: function (viewOfG2, facet) { + var viewOptions = eachView(viewOfG2, facet); + if (viewOptions.geometries) { + execViewAdaptor(viewOfG2, viewOptions); + } + else { + var plot = viewOptions; + var plotOptions = plot.options; + // @ts-ignore 仪表盘没 tooltip + if (plotOptions.tooltip) { + // 配置 tooltip 交互 + viewOfG2.interaction('tooltip'); + } + execPlotAdaptor(plot.type, viewOfG2, plotOptions); + } + } })); + return params; +} +function component(params) { + var chart = params.chart, options = params.options; + var axes = options.axes, meta = options.meta, tooltip = options.tooltip, coordinate = options.coordinate, theme = options.theme, legend = options.legend, interactions = options.interactions, annotations = options.annotations; + // 3. meta 配置 + var scales = {}; + if (axes) { + each$2(axes, function (axis, field) { + scales[field] = pick$1(axis, AXIS_META_CONFIG_KEYS); + }); + } + scales = deepAssign({}, meta, scales); + chart.scale(scales); + // 4. coordinate 配置 + chart.coordinate(coordinate); + // 5. axis 轴配置 (默认不展示) + if (!axes) { + chart.axis(false); + } + else { + each$2(axes, function (axis, field) { + chart.axis(field, axis); + }); + } + // 6. tooltip 配置 + if (tooltip) { + chart.interaction('tooltip'); + chart.tooltip(tooltip); + } + else if (tooltip === false) { + chart.removeInteraction('tooltip'); + } + // 7. legend 配置（默认展示） + chart.legend(legend); + // theme 配置 + if (theme) { + chart.theme(theme); + } + // 8. interactions + each$2(interactions, function (interaction) { + if (interaction.enable === false) { + chart.removeInteraction(interaction.type); + } + else { + chart.interaction(interaction.type, interaction.cfg); + } + }); + // 9. annotations + each$2(annotations, function (annotation) { + chart.annotation()[annotation.type](__assign$r({}, annotation)); + }); + return params; +} +/** + * 分面图适配器 + * @param chart + * @param options + */ +function adaptor(params) { + // flow 的方式处理所有的配置到 G2 API + return flow(theme$2, facetAdaptor, component)(params); +} + +/** + * 分面图 默认配置项 + */ +var DEFAULT_OPTIONS = { + title: { + style: { + fontSize: 12, + fill: 'rgba(0,0,0,0.65)', + }, + }, + rowTitle: { + style: { + fontSize: 12, + fill: 'rgba(0,0,0,0.65)', + }, + }, + columnTitle: { + style: { + fontSize: 12, + fill: 'rgba(0,0,0,0.65)', + }, + }, +}; + +var Facet$1 = /** @class */ (function (_super) { + __extends$e(Facet, _super); + function Facet() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** 图表类型 */ + _this.type = 'area'; + return _this; + } + /** + * 获取 分面图 默认配置项 + * 供外部使用 + */ + Facet.getDefaultOptions = function () { + return DEFAULT_OPTIONS; + }; + /** + * 获取 分面图 默认配置 + */ + Facet.prototype.getDefaultOptions = function () { + return Facet.getDefaultOptions(); + }; + /** + * 获取 分面图 的适配器 + */ + Facet.prototype.getSchemaAdaptor = function () { + return adaptor; + }; + return Facet; +}(Plot)); + +/** 实验室图表所处的阶段 */ +var Stage; +(function (Stage) { + Stage["DEV"] = "DEV"; + Stage["BETA"] = "BETA"; + Stage["STABLE"] = "STABLE"; +})(Stage || (Stage = {})); +/** + * 不同阶段打印一些消息给开发者 + * @param stage + */ +function notice(stage, plotType) { + console.warn(stage === Stage.DEV + ? "Plot '" + plotType + "' is in DEV stage, just give us issues." + : stage === Stage.BETA + ? "Plot '" + plotType + "' is in BETA stage, DO NOT use it in production env." + : stage === Stage.STABLE + ? "Plot '" + plotType + "' is in STABLE stage, import it by \"import { " + plotType + " } from '@antv/g2plot'\"." + : 'invalid Stage type.'); +} +/** + * 实验室图表，实验室中的图表分成不同的阶段。 + */ +/** @class */ ((function () { + function Lab() { + } + Object.defineProperty(Lab, "MultiView", { + get: function () { + notice(Stage.STABLE, 'MultiView'); + return Mix$1; + }, + enumerable: false, + configurable: true + }); + return Lab; +})()); + +/** default locale register */ +registerLocale('en-US', EN_US_LOCALE); +registerLocale('zh-CN', ZH_CN_LOCALE); +var adaptors = { scale: scale$3, legend: legend$f, tooltip: tooltip$8, annotation: annotation$2, interaction: interaction$6, theme: theme$2, animation: animation$5 }; + +// @ts-ignore +var createNode = function (children, type) { + var mountPoint = document.createElement('div'); + if (type === 'tooltip') { + mountPoint.className = 'g2-tooltip'; + } + React.render(children, mountPoint); + return mountPoint; +}; +var createNode$1 = createNode; + +/* eslint-disable no-restricted-syntax */ +// 类型检测 +var isType$1 = function (value, type) { + var toString = {}.toString; + return toString.call(value) === "[object " + type + "]"; +}; +var clone$3 = function (source) { + if (!source) { + return source; + } + var target = {}; + // eslint-disable-next-line guard-for-in + for (var k in source) { + target[k] = source[k]; + } + return target; +}; +var getType = function (n) { + return Object.prototype.toString.call(n).slice(8, -1); +}; +/** + * 深克隆 + * @param source 要深克隆的目标对象 + */ +var deepClone = function (source) { + if (!source) { + return source; + } + // @ts-ignore + var target = new source.constructor(); + for (var key in source) { + if (source.hasOwnProperty(key)) { + target[key] = + getType(source[key]) === 'Object' || getType(source[key]) === 'Array' + ? deepClone(source[key]) + : source[key]; + } + } + return target; +}; +/** + * 存在时返回路径值，不存在时返回 undefined + */ +var hasPath$3 = function (source, path) { + var current = source; + for (var i = 0; i < path.length; i += 1) { + if (current === null || current === void 0 ? void 0 : current[path[i]]) { + current = current[path[i]]; + } + else { + current = undefined; + break; + } + } + return current; +}; +/** + * 内部指定 params ，不考虑复杂情况 + */ +var setPath = function (source, path, value) { + if (!source) { + return source; + } + var o = source; + path.forEach(function (key, idx) { + // 不是最后一个 + if (idx < path.length - 1) { + o = o[key]; + } + else { + o[key] = value; + } + }); + return source; +}; + +/** + * 获取或者绑定图表实例 + */ +var getChart = function (chartRef, chart) { + if (!chartRef) { + return; + } + if (isFunction$6(chartRef)) { + chartRef(chart); + } + else { + chartRef.current = chart; + } +}; + +var __assign$p = (undefined && undefined.__assign) || function () { + __assign$p = Object.assign || function(t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) + t[p] = s[p]; + } + return t; + }; + return __assign$p.apply(this, arguments); +}; +var __rest$F = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +function useInit(ChartClass, config) { + var chart = s(); + var chartOptions = s(); + var container = s(null); + var onReady = config.onReady, onEvent = config.onEvent, chartRef = config.chartRef; + /** + * Get data base64 + * @param {string} type A DOMString indicating the image format. The default format type is image/png. + * @param {number} encoderOptions A Number between 0 and 1 indicating the image quality + */ + var toDataURL = function (type, encoderOptions) { + var _a; + if (type === void 0) { type = 'image/png'; } + return (_a = chart.current) === null || _a === void 0 ? void 0 : _a.chart.canvas.cfg.el.toDataURL(type, encoderOptions); + }; + /** + * Download Iamge + * @param {string} name A name of image + * @param {string} type A DOMString indicating the image format. The default format type is image/png. + * @param {number} encoderOptions A Number between 0 and 1 indicating the image quality + */ + var downloadImage = function (name, type, encoderOptions) { + var _a; + if (name === void 0) { name = 'download'; } + if (type === void 0) { type = 'image/png'; } + var imageName = name; + if (name.indexOf('.') === -1) { + imageName = name + "." + type.split('/')[1]; + } + var base64 = (_a = chart.current) === null || _a === void 0 ? void 0 : _a.chart.canvas.cfg.el.toDataURL(type, encoderOptions); + var a = document.createElement('a'); + a.href = base64; + a.download = imageName; + document.body.appendChild(a); + a.click(); + document.body.removeChild(a); + a = null; + return imageName; + }; + var reactDomToString = function (source, path, type) { + var statisticCustomHtml = hasPath$3(source, path); + setPath(source, path, function () { + var arg = []; + for (var _i = 0; _i < arguments.length; _i++) { + arg[_i] = arguments[_i]; + } + var statisticDom = isType$1(statisticCustomHtml, 'Function') + ? statisticCustomHtml.apply(void 0, arg) : statisticCustomHtml; + if (isType$1(statisticDom, 'String') || + isType$1(statisticDom, 'Number') || + isType$1(statisticDom, 'HTMLDivElement')) { + return statisticDom; + } + return createNode$1(statisticDom, type); + }); + }; + var processConfig = function () { + // statistic + if (hasPath$3(config, ['statistic', 'content', 'customHtml'])) { + reactDomToString(config, ['statistic', 'content', 'customHtml']); + } + if (hasPath$3(config, ['statistic', 'title', 'customHtml'])) { + reactDomToString(config, ['statistic', 'title', 'customHtml']); + } + // tooltip + if (typeof config.tooltip === 'object') { + if (hasPath$3(config, ['tooltip', 'container'])) { + reactDomToString(config, ['tooltip', 'container'], 'tooltip'); + } + if (hasPath$3(config, ['tooltip', 'customContent'])) { + reactDomToString(config, ['tooltip', 'customContent'], 'tooltip'); + } + } + }; + y$3(function () { + if (chart.current && !isEqual$2(chartOptions.current, config)) { + var changeData = false; + if (chartOptions.current) { + // 从 options 里面取出 data 、value 、 percent 进行比对，判断是否仅数值发生改变 + var _a = chartOptions.current; _a.data; _a.value; _a.percent; var currentConfig = __rest$F(_a, ["data", "value", "percent"]); + config.data; config.value; config.percent; var inputConfig = __rest$F(config, ["data", "value", "percent"]); + changeData = isEqual$2(currentConfig, inputConfig); + } + if (changeData) { + var changeType_1 = 'data'; + var typeMaps = ['percent']; // 特殊类型的图表 data 字段，例如 RingProgress + var currentKeys_1 = Object.keys(config); + typeMaps.forEach(function (type) { + if (currentKeys_1.includes(type)) { + changeType_1 = type; + } + }); + chart.current.changeData((config === null || config === void 0 ? void 0 : config[changeType_1]) || []); + } + else { + processConfig(); + chart.current.update(config); + } + chartOptions.current = deepClone(config); + } + }, [config]); + y$3(function () { + if (!container.current) { + return function () { return null; }; + } + processConfig(); + var chartInstance = new ChartClass(container.current, __assign$p({}, config)); + ChartClass.prototype.toDataURL = function (type, encoderOptions) { + return toDataURL(type, encoderOptions); + }; + ChartClass.prototype.downloadImage = function (name, type, encoderOptions) { + return downloadImage(name, type, encoderOptions); + }; + chartInstance.render(); + if (!chartOptions.current) { + chartOptions.current = deepClone(config); + } + chart.current = clone$3(chartInstance); + if (onReady) { + onReady(chartInstance); + } + getChart(chartRef, chart.current); + var handler = function (event) { + if (onEvent) { + onEvent(chartInstance, event); + } + }; + chartInstance.on('*', handler); + // 组件销毁时销毁图表 + return function () { + if (chart.current) { + chart.current.destroy(); + chart.current.off('*', handler); + chart.current = undefined; + } + }; + }, []); + return { + chart: chart, + container: container, + }; +} + +var __extends$b = (undefined && undefined.__extends) || (function () { + var extendStatics = function (d, b) { + extendStatics = Object.setPrototypeOf || + ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) || + function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; }; + return extendStatics(d, b); + }; + return function (d, b) { + if (typeof b !== "function" && b !== null) + throw new TypeError("Class extends value " + String(b) + " is not a constructor or null"); + extendStatics(d, b); + function __() { this.constructor = d; } + d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); + }; +})(); +var ErrorBoundary$1 = /** @class */ (function (_super) { + __extends$b(ErrorBoundary, _super); + function ErrorBoundary() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.state = { + hasError: false, + }; + _this.renderError = function (e) { + var errorTemplate = _this.props.errorTemplate; + switch (e) { + default: + // fallback + return errorTemplate && typeof errorTemplate === 'function' ? (errorTemplate(e)) : (React.createElement("h5", null, + "\u7EC4\u4EF6\u51FA\u9519\u4E86\uFF0C\u8BF7\u6838\u67E5\u540E\u91CD\u8BD5\uFF1A ", + e.message)); + } + }; + return _this; + } + ErrorBoundary.getDerivedStateFromError = function (error) { + return { hasError: true, error: error }; + }; + ErrorBoundary.getDerivedStateFromProps = function (nextProps, state) { + if (state.children !== nextProps.children) { + return { + children: nextProps.children, + hasError: false, + error: undefined, + }; + } + return null; + }; + ErrorBoundary.prototype.render = function () { + if (this.state.hasError) { + return this.renderError(this.state.error); + } + return React.createElement(d$1, null, this.props.children); + }; + return ErrorBoundary; +}(React.Component)); +var ErrorBoundary$2 = ErrorBoundary$1; + +/*! ***************************************************************************** +Copyright (c) Microsoft Corporation. All rights reserved. +Licensed under the Apache License, Version 2.0 (the "License"); you may not use +this file except in compliance with the License. You may obtain a copy of the +License at http://www.apache.org/licenses/LICENSE-2.0 + +THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED +WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE, +MERCHANTABLITY OR NON-INFRINGEMENT. + +See the Apache Version 2.0 License for specific language governing permissions +and limitations under the License. +***************************************************************************** */ + +var __assign$o = function() { + __assign$o = Object.assign || function __assign(t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; + } + return t; + }; + return __assign$o.apply(this, arguments); +}; + +function __rest$E(s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +} + +var uid = (function () { + return Math.random() + .toString(36) + .substring(6); +}); + +var SVG$2 = function (_a) { + var animate = _a.animate, backgroundColor = _a.backgroundColor, backgroundOpacity = _a.backgroundOpacity, baseUrl = _a.baseUrl, children = _a.children, foregroundColor = _a.foregroundColor, foregroundOpacity = _a.foregroundOpacity, gradientRatio = _a.gradientRatio, uniqueKey = _a.uniqueKey, interval = _a.interval, rtl = _a.rtl, speed = _a.speed, style = _a.style, title = _a.title, props = __rest$E(_a, ["animate", "backgroundColor", "backgroundOpacity", "baseUrl", "children", "foregroundColor", "foregroundOpacity", "gradientRatio", "uniqueKey", "interval", "rtl", "speed", "style", "title"]); + var fixedId = uniqueKey || uid(); + var idClip = fixedId + "-diff"; + var idGradient = fixedId + "-animated-diff"; + var idAria = fixedId + "-aria"; + var rtlStyle = rtl ? { transform: 'scaleX(-1)' } : null; + var keyTimes = "0; " + interval + "; 1"; + var dur = speed + "s"; + return (v$1("svg", __assign$o({ "aria-labelledby": idAria, role: "img", style: __assign$o(__assign$o({}, style), rtlStyle) }, props), + title ? v$1("title", { id: idAria }, title) : null, + v$1("rect", { role: "presentation", x: "0", y: "0", width: "100%", height: "100%", clipPath: "url(" + baseUrl + "#" + idClip + ")", style: { fill: "url(" + baseUrl + "#" + idGradient + ")" } }), + v$1("defs", { role: "presentation" }, + v$1("clipPath", { id: idClip }, children), + v$1("linearGradient", { id: idGradient }, + v$1("stop", { offset: "0%", stopColor: backgroundColor, stopOpacity: backgroundOpacity }, animate && (v$1("animate", { attributeName: "offset", values: -gradientRatio + "; " + -gradientRatio + "; 1", keyTimes: keyTimes, dur: dur, repeatCount: "indefinite" }))), + v$1("stop", { offset: "50%", stopColor: foregroundColor, stopOpacity: foregroundOpacity }, animate && (v$1("animate", { attributeName: "offset", values: -gradientRatio / 2 + "; " + -gradientRatio / 2 + "; " + (1 + + gradientRatio / 2), keyTimes: keyTimes, dur: dur, repeatCount: "indefinite" }))), + v$1("stop", { offset: "100%", stopColor: backgroundColor, stopOpacity: backgroundOpacity }, animate && (v$1("animate", { attributeName: "offset", values: "0; 0; " + (1 + gradientRatio), keyTimes: keyTimes, dur: dur, repeatCount: "indefinite" }))))))); +}; +SVG$2.defaultProps = { + animate: true, + backgroundColor: '#f5f6f7', + backgroundOpacity: 1, + baseUrl: '', + foregroundColor: '#eee', + foregroundOpacity: 1, + gradientRatio: 2, + id: null, + interval: 0.25, + rtl: false, + speed: 1.2, + style: {}, + title: 'Loading...', +}; + +var ContentLoader = function (props) { + return props.children ? v$1(SVG$2, __assign$o({}, props)) : v$1(ReactContentLoaderFacebook, __assign$o({}, props)); +}; + +var ReactContentLoaderFacebook = function (props) { return (v$1(ContentLoader, __assign$o({ viewBox: "0 0 476 124" }, props), + v$1("rect", { x: "48", y: "8", width: "88", height: "6", rx: "3" }), + v$1("rect", { x: "48", y: "26", width: "52", height: "6", rx: "3" }), + v$1("rect", { x: "0", y: "56", width: "410", height: "6", rx: "3" }), + v$1("rect", { x: "0", y: "72", width: "380", height: "6", rx: "3" }), + v$1("rect", { x: "0", y: "88", width: "178", height: "6", rx: "3" }), + v$1("circle", { cx: "20", cy: "20", r: "20" }))); }; + +var ContentLoader$1 = ContentLoader; + +var ChartLoading = function (_a) { + var loadingTemplate = _a.loadingTemplate; + var renderLoading = function () { + if (loadingTemplate) { + return loadingTemplate; + } + return (React.createElement(ContentLoader$1, { viewBox: "0 0 400 180", width: 200, height: 90, speed: 1 }, + React.createElement("rect", { x: "20", y: "5", rx: "0", ry: "0", width: "1", height: "170" }), + React.createElement("rect", { x: "20", y: "175", rx: "0", ry: "0", width: "360", height: "1" }), + React.createElement("rect", { x: "40", y: "75", rx: "0", ry: "0", width: "35", height: "100" }), + React.createElement("rect", { x: "80", y: "125", rx: "0", ry: "0", width: "35", height: "50" }), + React.createElement("rect", { x: "120", y: "105", rx: "0", ry: "0", width: "35", height: "70" }), + React.createElement("rect", { x: "160", y: "35", rx: "0", ry: "0", width: "35", height: "140" }), + React.createElement("rect", { x: "200", y: "55", rx: "0", ry: "0", width: "35", height: "120" }), + React.createElement("rect", { x: "240", y: "15", rx: "0", ry: "0", width: "35", height: "160" }), + React.createElement("rect", { x: "280", y: "135", rx: "0", ry: "0", width: "35", height: "40" }), + React.createElement("rect", { x: "320", y: "85", rx: "0", ry: "0", width: "35", height: "90" }))); + }; + return (React.createElement("div", { style: { + position: 'absolute', + width: '100%', + height: '100%', + display: 'flex', + alignItems: 'center', + justifyContent: 'center', + left: 0, + top: 0, + zIndex: 99, + backgroundColor: '#fff', + } }, renderLoading())); +}; +var ChartLoading$1 = ChartLoading; + +var __rest$D = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var AreaChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$D(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(Area$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var Area = AreaChart; + +var __rest$C = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var BarChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$C(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(Bar$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var Bar = BarChart; + +var __rest$B = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var BulletChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$B(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(Bullet$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var Bullet = BulletChart; + +var __rest$A = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var ColumnChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$A(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(Column$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var Column = ColumnChart; + +var __rest$z = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var FunnelChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$z(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(Funnel$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var Funnel = FunnelChart; + +var __rest$y = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var HistogramChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$y(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(Histogram$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var Histogram = HistogramChart; + +var __rest$x = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var LineChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$x(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(Line$3, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var Line$2 = LineChart; + +var __rest$w = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var BoxChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$w(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(Box$2, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var Box$1 = BoxChart; + +var __rest$v = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var LiquidChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$v(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(Liquid$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var Liquid = LiquidChart; + +var __rest$u = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var HeatmapChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$u(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(Heatmap$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var Heatmap = HeatmapChart; + +var __rest$t = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var PieChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$t(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(Pie$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var Pie = PieChart; + +var __rest$s = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var GaugeChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$s(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(Gauge$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var Gauge = GaugeChart; + +var __rest$r = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var ProgressChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$r(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(Progress$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var Progress = ProgressChart; + +var __rest$q = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var RadarChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$q(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(Radar$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var Radar = RadarChart; + +var __rest$p = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var RingProgressChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$p(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(RingProgress$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var RingProgress = RingProgressChart; + +var __rest$o = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var RoseChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$o(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(Rose$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var Rose = RoseChart; + +var __rest$n = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var ChordChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$n(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(Chord$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var Chord = ChordChart; + +var __rest$m = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var ScatterChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$m(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(Scatter$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var Scatter = ScatterChart; + +var __rest$l = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var TinyAreaChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$l(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(TinyArea$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var TinyArea = TinyAreaChart; + +var __rest$k = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var TinyColumnChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$k(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(TinyColumn$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var TinyColumn = TinyColumnChart; + +var __rest$j = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var DualAxesChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$j(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + // @ts-ignore annotations 类型特殊 + var _b = useInit(DualAxes$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var DualAxes = DualAxesChart; + +var __rest$i = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var TinyLineChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$i(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(TinyLine$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var TinyLine = TinyLineChart; + +var __rest$h = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var WaterfallChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$h(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(Waterfall$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var Waterfall = WaterfallChart; + +var __rest$g = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var WordCloudChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$g(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(WordCloud$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var WordCloud = WordCloudChart; + +var __rest$f = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var SunburstChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$f(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(Sunburst$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var Sunburst = SunburstChart; + +var __rest$e = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var StockChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$e(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(Stock$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var Stock = StockChart; + +var __rest$d = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var RadialBarChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$d(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(RadialBar$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var RadialBar = RadialBarChart; + +var __rest$c = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var SankeyChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$c(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(Sankey$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var Sankey = SankeyChart; + +var __rest$b = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var TreemapChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$b(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(Treemap$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var Treemap = TreemapChart; + +var __rest$a = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var ViolinChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$a(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(Violin$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var Violin = ViolinChart; + +var __rest$9 = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var FacetChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$9(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(Facet$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var Facet = FacetChart; + +var __rest$8 = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var MultiViewChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$8(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(Mix$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var Mix = MultiViewChart; + +var __rest$7 = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var VennChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$7(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(Venn$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var Venn = VennChart; + +var __rest$6 = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var BidirectionalBarChart = x$3(function (props, ref) { + var _a = props.style, style = _a === void 0 ? { + height: 'inherit', + } : _a, className = props.className, loading = props.loading, loadingTemplate = props.loadingTemplate, errorTemplate = props.errorTemplate, rest = __rest$6(props, ["style", "className", "loading", "loadingTemplate", "errorTemplate"]); + var _b = useInit(BidirectionalBar$1, rest), chart = _b.chart, container = _b.container; + _$A(ref, function () { return ({ + getChart: function () { return chart.current; }, + }); }); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}); +var BidirectionalBar = BidirectionalBarChart; + +var behaviorOption = { + getDefaultCfg: function getDefaultCfg() { + return {}; + }, + + /** + * register event handler, behavior will auto bind events + * for example: + * return { + * click: 'onClick' + * } + */ + getEvents: function getEvents() { + return {}; + }, + updateCfg: function updateCfg(cfg) { + Object.assign(this, cfg); + return true; + }, + shouldBegin: function shouldBegin() { + return true; + }, + shouldUpdate: function shouldUpdate() { + return true; + }, + shouldEnd: function shouldEnd() { + return true; + }, + + /** + * auto bind events when register behavior + * @param graph Graph instance + */ + bind: function bind(graph) { + var _this = this; + + var events = this.events; + this.graph = graph; + + if (this.type === 'drag-canvas' || this.type === 'brush-select' || this.type === 'lasso-select') { + graph.get('canvas').set('draggable', true); + } + + each$2(events, function (handler, event) { + graph.on(event, handler); + }); // To avoid the tabs switching makes the keydown related behaviors disable + + document.addEventListener('visibilitychange', function () { + _this.keydown = false; + }); + }, + unbind: function unbind(graph) { + var events = this.events; + + if (this.type === 'drag-canvas' || this.type === 'brush-select' || this.type === 'lasso-select') { + graph.get('canvas').set('draggable', false); + } + + each$2(events, function (handler, event) { + graph.off(event, handler); + }); + }, + get: function get(val) { + return this[val]; + }, + set: function set(key, val) { + this[key] = val; + return this; + } +}; + +var Behavior = +/** @class */ +function () { + function Behavior() {} + /** + * 自定义 Behavior + * @param type Behavior 名称 + * @param behavior Behavior 定义的方法集合 + */ + + + Behavior.registerBehavior = function (type, behavior) { + if (!behavior) { + throw new Error("please specify handler for this behavior: " + type); + } + + var prototype = clone$7(behaviorOption); + Object.assign(prototype, behavior); // eslint-disable-next-line func-names + + var base = function base(cfg) { + var _this = this; + + Object.assign(this, this.getDefaultCfg(), cfg); + var events = this.getEvents(); + this.events = null; + var eventsToBind = {}; + + if (events) { + each$2(events, function (handle, event) { + eventsToBind[event] = wrapBehavior(_this, handle); + }); + this.events = eventsToBind; + } + }; + + base.prototype = prototype; + Behavior.types[type] = base; + }; + + Behavior.hasBehavior = function (type) { + return !!Behavior.types[type]; + }; + + Behavior.getBehavior = function (type) { + return Behavior.types[type]; + }; // 所有自定义的 Behavior 的实例 + + + Behavior.types = {}; + return Behavior; +}(); + +var adjMatrix = function adjMatrix(graphData, directed) { + var nodes = graphData.nodes, + edges = graphData.edges; + var matrix = []; // map node with index in data.nodes + + var nodeMap = {}; + + if (!nodes) { + throw new Error("invalid nodes data!"); + } + + if (nodes) { + nodes.forEach(function (node, i) { + nodeMap[node.id] = i; + var row = []; + matrix.push(row); + }); + } + + if (edges) { + edges.forEach(function (edge) { + var source = edge.source, + target = edge.target; + var sIndex = nodeMap[source]; + var tIndex = nodeMap[target]; + if (!sIndex && sIndex !== 0 || !tIndex && tIndex !== 0) return; + matrix[sIndex][tIndex] = 1; + + if (!directed) { + matrix[tIndex][sIndex] = 1; + } + }); + } + + return matrix; +}; + +var defaultComparator = function defaultComparator(a, b) { + if (a === b) { + return true; + } + + return false; +}; +/** + * 链表中单个元素节点 + */ + + +var LinkedListNode = function () { + function LinkedListNode(value, next) { + if (next === void 0) { + next = null; + } + + this.value = value; + this.next = next; + } + + LinkedListNode.prototype.toString = function (callback) { + return callback ? callback(this.value) : "" + this.value; + }; + + return LinkedListNode; +}(); + +var LinkedList = function () { + function LinkedList(comparator) { + if (comparator === void 0) { + comparator = defaultComparator; + } + + this.head = null; + this.tail = null; + this.compare = comparator; + } + /** + * 将指定元素添加到链表头部 + * @param value + */ + + + LinkedList.prototype.prepend = function (value) { + // 在头部添加一个节点 + var newNode = new LinkedListNode(value, this.head); + this.head = newNode; + + if (!this.tail) { + this.tail = newNode; + } + + return this; + }; + /** + * 将指定元素添加到链表中 + * @param value + */ + + + LinkedList.prototype.append = function (value) { + var newNode = new LinkedListNode(value); // 如果不存在头节点，则将创建的新节点作为头节点 + + if (!this.head) { + this.head = newNode; + this.tail = newNode; + return this; + } // 将新节点附加到链表末尾 + + + this.tail.next = newNode; + this.tail = newNode; + return this; + }; + /** + * 删除指定元素 + * @param value 要删除的元素 + */ + + + LinkedList.prototype.delete = function (value) { + if (!this.head) { + return null; + } + + var deleteNode = null; // 如果删除的是头部元素，则将next作为头元素 + + while (this.head && this.compare(this.head.value, value)) { + deleteNode = this.head; + this.head = this.head.next; + } + + var currentNode = this.head; + + if (currentNode !== null) { + // 如果删除了节点以后，将next节点前移 + while (currentNode.next) { + if (this.compare(currentNode.next.value, value)) { + deleteNode = currentNode.next; + currentNode.next = currentNode.next.next; + } else { + currentNode = currentNode.next; + } + } + } // 检查尾部节点是否被删除 + + + if (this.compare(this.tail.value, value)) { + this.tail = currentNode; + } + + return deleteNode; + }; + /** + * 查找指定的元素 + * @param param0 + */ + + + LinkedList.prototype.find = function (_a) { + var _b = _a.value, + value = _b === void 0 ? undefined : _b, + _c = _a.callback, + callback = _c === void 0 ? undefined : _c; + + if (!this.head) { + return null; + } + + var currentNode = this.head; + + while (currentNode) { + // 如果指定了 callback，则按指定的 callback 查找 + if (callback && callback(currentNode.value)) { + return currentNode; + } // 如果指定了 value，则按 value 查找 + + + if (value !== undefined && this.compare(currentNode.value, value)) { + return currentNode; + } + + currentNode = currentNode.next; + } + + return null; + }; + /** + * 删除尾部节点 + */ + + + LinkedList.prototype.deleteTail = function () { + var deletedTail = this.tail; + + if (this.head === this.tail) { + // 链表中只有一个元素 + this.head = null; + this.tail = null; + return deletedTail; + } + + var currentNode = this.head; + + while (currentNode.next) { + if (!currentNode.next.next) { + currentNode.next = null; + } else { + currentNode = currentNode.next; + } + } + + this.tail = currentNode; + return deletedTail; + }; + /** + * 删除头部节点 + */ + + + LinkedList.prototype.deleteHead = function () { + if (!this.head) { + return null; + } + + var deletedHead = this.head; + + if (this.head.next) { + this.head = this.head.next; + } else { + this.head = null; + this.tail = null; + } + + return deletedHead; + }; + /** + * 将一组元素转成链表中的节点 + * @param values 链表中的元素 + */ + + + LinkedList.prototype.fromArray = function (values) { + var _this = this; + + values.forEach(function (value) { + return _this.append(value); + }); + return this; + }; + /** + * 将链表中的节点转成数组元素 + */ + + + LinkedList.prototype.toArray = function () { + var nodes = []; + var currentNode = this.head; + + while (currentNode) { + nodes.push(currentNode); + currentNode = currentNode.next; + } + + return nodes; + }; + /** + * 反转链表中的元素节点 + */ + + + LinkedList.prototype.reverse = function () { + var currentNode = this.head; + var prevNode = null; + var nextNode = null; + + while (currentNode) { + // 存储下一个元素节点 + nextNode = currentNode.next; // 更改当前节点的下一个节点，以便将它连接到上一个节点上 + + currentNode.next = prevNode; // 将 prevNode 和 currentNode 向前移动一步 + + prevNode = currentNode; + currentNode = nextNode; + } + + this.tail = this.head; + this.head = prevNode; + }; + + LinkedList.prototype.toString = function (callback) { + if (callback === void 0) { + callback = undefined; + } + + return this.toArray().map(function (node) { + return node.toString(callback); + }).toString(); + }; + + return LinkedList; +}(); + +var Queue = function () { + function Queue() { + this.linkedList = new LinkedList(); + } + /** + * 队列是否为空 + */ + + + Queue.prototype.isEmpty = function () { + return !this.linkedList.head; + }; + /** + * 读取队列头部的元素， 不删除队列中的元素 + */ + + + Queue.prototype.peek = function () { + if (!this.linkedList.head) { + return null; + } + + return this.linkedList.head.value; + }; + /** + * 在队列的尾部新增一个元素 + * @param value + */ + + + Queue.prototype.enqueue = function (value) { + this.linkedList.append(value); + }; + /** + * 删除队列中的头部元素，如果队列为空，则返回 null + */ + + + Queue.prototype.dequeue = function () { + var removeHead = this.linkedList.deleteHead(); + return removeHead ? removeHead.value : null; + }; + + Queue.prototype.toString = function (callback) { + return this.linkedList.toString(callback); + }; + + return Queue; +}(); + +/** + * 获取指定节点的所有邻居 + * @param nodeId 节点 ID + * @param edges 图中的所有边数据 + * @param type 邻居类型 + */ +var getNeighbors = function getNeighbors(nodeId, edges, type) { + if (edges === void 0) { + edges = []; + } + + var currentEdges = edges.filter(function (edge) { + return edge.source === nodeId || edge.target === nodeId; + }); + + if (type === 'target') { + // 当前节点为 source，它所指向的目标节点 + var neighhborsConverter_1 = function neighhborsConverter_1(edge) { + return edge.source === nodeId; + }; + + return currentEdges.filter(neighhborsConverter_1).map(function (edge) { + return edge.target; + }); + } + + if (type === 'source') { + // 当前节点为 target，它所指向的源节点 + var neighhborsConverter_2 = function neighhborsConverter_2(edge) { + return edge.target === nodeId; + }; + + return currentEdges.filter(neighhborsConverter_2).map(function (edge) { + return edge.source; + }); + } // 若未指定 type ，则返回所有邻居 + + + var neighhborsConverter = function neighhborsConverter(edge) { + return edge.source === nodeId ? edge.target : edge.source; + }; + + return currentEdges.map(neighhborsConverter); +}; +/** + * 获取指定节点的出边 + * @param nodeId 节点 ID + * @param edges 图中的所有边数据 + */ + +var getOutEdgesNodeId = function getOutEdgesNodeId(nodeId, edges) { + return edges.filter(function (edge) { + return edge.source === nodeId; + }); +}; +/** + * 获取指定节点的边，包括出边和入边 + * @param nodeId 节点 ID + * @param edges 图中的所有边数据 + */ + +var getEdgesByNodeId = function getEdgesByNodeId(nodeId, edges) { + return edges.filter(function (edge) { + return edge.source === nodeId || edge.target === nodeId; + }); +}; +/** + * 生成唯一的 ID，规则是序号 + 时间戳 + * @param index 序号 + */ + +var uniqueId$2 = function uniqueId(index) { + if (index === void 0) { + index = 0; + } + + var random1 = ("" + Math.random()).split('.')[1].substr(0, 5); + var random2 = ("" + Math.random()).split('.')[1].substr(0, 5); + return index + "-" + random1 + random2; +}; + +/** + * + * @param callbacks + * allowTraversal: 确定 BFS 是否从顶点沿着边遍历到其邻居，默认情况下，同一个节点只能遍历一次 + * enterNode: 当 BFS 访问某个节点时调用 + * leaveNode: 当 BFS 访问访问结束某个节点时调用 + */ + +function initCallbacks$1(callbacks) { + if (callbacks === void 0) { + callbacks = {}; + } + + var initiatedCallback = callbacks; + + var stubCallback = function stubCallback() {}; + + var allowTraversalCallback = function () { + var seen = {}; + return function (_a) { + var next = _a.next; + var id = next; + + if (!seen[id]) { + seen[id] = true; + return true; + } + + return false; + }; + }(); + + initiatedCallback.allowTraversal = callbacks.allowTraversal || allowTraversalCallback; + initiatedCallback.enter = callbacks.enter || stubCallback; + initiatedCallback.leave = callbacks.leave || stubCallback; + return initiatedCallback; +} +/** + * 广度优先遍历图 + * @param graph Graph 图实例 + * @param startNode 开始遍历的节点 + * @param originalCallbacks 回调 + */ + + +var breadthFirstSearch = function breadthFirstSearch(graphData, startNodeId, originalCallbacks) { + var callbacks = initCallbacks$1(originalCallbacks); + var nodeQueue = new Queue(); + var _a = graphData.edges, + edges = _a === void 0 ? [] : _a; // 初始化队列元素 + + nodeQueue.enqueue(startNodeId); + var previousNode = ''; + + var _loop_1 = function _loop_1() { + var currentNode = nodeQueue.dequeue(); + callbacks.enter({ + current: currentNode, + previous: previousNode + }); // 将所有邻居添加到队列中以便遍历 + + getNeighbors(currentNode, edges, 'target').forEach(function (nextNode) { + if (callbacks.allowTraversal({ + previous: previousNode, + current: currentNode, + next: nextNode + })) { + nodeQueue.enqueue(nextNode); + } + }); + callbacks.leave({ + current: currentNode, + previous: previousNode + }); // 下一次循环之前存储当前顶点 + + previousNode = currentNode; + }; // 遍历队列中的所有顶点 + + + while (!nodeQueue.isEmpty()) { + _loop_1(); + } +}; + +/** + * Generate all connected components for an undirected graph + * @param graph + */ + +var detectConnectedComponents = function detectConnectedComponents(graphData) { + var _a = graphData.nodes, + nodes = _a === void 0 ? [] : _a, + _b = graphData.edges, + edges = _b === void 0 ? [] : _b; + var allComponents = []; + var visited = {}; + var nodeStack = []; + + var getComponent = function getComponent(node) { + nodeStack.push(node); + visited[node.id] = true; + var neighbors = getNeighbors(node.id, edges); + + var _loop_1 = function _loop_1(i) { + var neighbor = neighbors[i]; + + if (!visited[neighbor]) { + var targetNode = nodes.filter(function (node) { + return node.id === neighbor; + }); + + if (targetNode.length > 0) { + getComponent(targetNode[0]); + } + } + }; + + for (var i = 0; i < neighbors.length; ++i) { + _loop_1(i); + } + }; + + for (var i = 0; i < nodes.length; i++) { + var node = nodes[i]; + + if (!visited[node.id]) { + // 对于无向图进行dfs遍历，每一次调用后都得到一个连通分量 + getComponent(node); + var component = []; + + while (nodeStack.length > 0) { + component.push(nodeStack.pop()); + } + + allComponents.push(component); + } + } + + return allComponents; +}; +/** + * Tarjan's Algorithm 复杂度 O(|V|+|E|) + * For directed graph only + * a directed graph is said to be strongly connected if "every vertex is reachable from every other vertex". + * refer: http://en.wikipedia.org/wiki/Tarjan%27s_strongly_connected_components_algorithm + * @param graph + * @return a list of strongly connected components + */ + +var detectStrongConnectComponents = function detectStrongConnectComponents(graphData) { + var _a = graphData.nodes, + nodes = _a === void 0 ? [] : _a, + _b = graphData.edges, + edges = _b === void 0 ? [] : _b; + var nodeStack = []; + var inStack = {}; // 辅助判断是否已经在stack中，减少查找开销 + + var indices = {}; + var lowLink = {}; + var allComponents = []; + var index = 0; + + var getComponent = function getComponent(node) { + // Set the depth index for v to the smallest unused index + indices[node.id] = index; + lowLink[node.id] = index; + index += 1; + nodeStack.push(node); + inStack[node.id] = true; // 考虑每个邻接点 + + var neighbors = getNeighbors(node.id, edges, 'target').filter(function (n) { + return nodes.map(function (node) { + return node.id; + }).indexOf(n) > -1; + }); + + var _loop_2 = function _loop_2(i) { + var targetNodeID = neighbors[i]; + + if (!indices[targetNodeID] && indices[targetNodeID] !== 0) { + var targetNode = nodes.filter(function (node) { + return node.id === targetNodeID; + }); + + if (targetNode.length > 0) { + getComponent(targetNode[0]); + } // tree edge + + + lowLink[node.id] = Math.min(lowLink[node.id], lowLink[targetNodeID]); + } else if (inStack[targetNodeID]) { + // back edge, target node is in the current SCC + lowLink[node.id] = Math.min(lowLink[node.id], indices[targetNodeID]); + } + }; + + for (var i = 0; i < neighbors.length; i++) { + _loop_2(i); + } // If node is a root node, generate an SCC + + + if (lowLink[node.id] === indices[node.id]) { + var component = []; + + while (nodeStack.length > 0) { + var tmpNode = nodeStack.pop(); + inStack[tmpNode.id] = false; + component.push(tmpNode); + if (tmpNode === node) break; + } + + if (component.length > 0) { + allComponents.push(component); + } + } + }; + + for (var _i = 0, nodes_1 = nodes; _i < nodes_1.length; _i++) { + var node = nodes_1[_i]; + + if (!indices[node.id] && indices[node.id] !== 0) { + getComponent(node); + } + } + + return allComponents; +}; +function getConnectedComponents(graphData, directed) { + if (directed) return detectStrongConnectComponents(graphData); + return detectConnectedComponents(graphData); +} + +var degree = function degree(graphData) { + var degrees = {}; + var _a = graphData.nodes, + nodes = _a === void 0 ? [] : _a, + _b = graphData.edges, + edges = _b === void 0 ? [] : _b; + nodes.forEach(function (node) { + degrees[node.id] = { + degree: 0, + inDegree: 0, + outDegree: 0 + }; + }); + edges.forEach(function (edge) { + degrees[edge.source].degree++; + degrees[edge.source].outDegree++; + degrees[edge.target].degree++; + degrees[edge.target].inDegree++; + }); + return degrees; +}; +/** + * 获取指定节点的入度 + * @param graphData 图数据 + * @param nodeId 节点ID + */ + +var getInDegree = function getInDegree(graphData, nodeId) { + var nodeDegree = degree(graphData); + + if (nodeDegree[nodeId]) { + return degree(graphData)[nodeId].inDegree; + } + + return 0; +}; +/** + * 获取指定节点的出度 + * @param graphData 图数据 + * @param nodeId 节点ID + */ + +var getOutDegree = function getOutDegree(graphData, nodeId) { + var nodeDegree = degree(graphData); + + if (nodeDegree[nodeId]) { + return degree(graphData)[nodeId].outDegree; + } + + return 0; +}; + +function initCallbacks(callbacks) { + if (callbacks === void 0) { + callbacks = {}; + } + + var initiatedCallback = callbacks; + + var stubCallback = function stubCallback() {}; + + var allowTraversalCallback = function () { + var seen = {}; + return function (_a) { + var next = _a.next; + + if (!seen[next]) { + seen[next] = true; + return true; + } + + return false; + }; + }(); + + initiatedCallback.allowTraversal = callbacks.allowTraversal || allowTraversalCallback; + initiatedCallback.enter = callbacks.enter || stubCallback; + initiatedCallback.leave = callbacks.leave || stubCallback; + return initiatedCallback; +} +/** + * @param {Graph} graph + * @param {GraphNode} currentNode + * @param {GraphNode} previousNode + * @param {Callbacks} callbacks + */ + + +function depthFirstSearchRecursive(graphData, currentNode, previousNode, callbacks) { + callbacks.enter({ + current: currentNode, + previous: previousNode + }); + var _a = graphData.edges, + edges = _a === void 0 ? [] : _a; + getNeighbors(currentNode, edges, 'target').forEach(function (nextNode) { + if (callbacks.allowTraversal({ + previous: previousNode, + current: currentNode, + next: nextNode + })) { + depthFirstSearchRecursive(graphData, nextNode, currentNode, callbacks); + } + }); + callbacks.leave({ + current: currentNode, + previous: previousNode + }); +} +/** + * 深度优先遍历图 + * @param data GraphData 图数据 + * @param startNodeId 开始遍历的节点的 ID + * @param originalCallbacks 回调 + */ + + +function depthFirstSearch(graphData, startNodeId, callbacks) { + depthFirstSearchRecursive(graphData, startNodeId, '', initCallbacks(callbacks)); +} + +var detectDirectedCycle$1 = function detectDirectedCycle(graphData) { + var cycle = null; + var _a = graphData.nodes, + nodes = _a === void 0 ? [] : _a; + var dfsParentMap = {}; // 所有没有被访问的节点集合 + + var unvisitedSet = {}; // 正在被访问的节点集合 + + var visitingSet = {}; // 所有已经被访问过的节点集合 + + var visitedSet = {}; // 初始化 unvisitedSet + + nodes.forEach(function (node) { + unvisitedSet[node.id] = node; + }); + var callbacks = { + enter: function enter(_a) { + var currentNode = _a.current, + previousNode = _a.previous; + + if (visitingSet[currentNode]) { + // 如果当前节点正在访问中，则说明检测到环路了 + cycle = {}; + var currentCycleNode = currentNode; + var previousCycleNode = previousNode; + + while (previousCycleNode !== currentNode) { + cycle[currentCycleNode] = previousCycleNode; + currentCycleNode = previousCycleNode; + previousCycleNode = dfsParentMap[previousCycleNode]; + } + + cycle[currentCycleNode] = previousCycleNode; + } else { + // 如果不存在正在访问集合中，则将其放入正在访问集合，并从未访问集合中删除 + visitingSet[currentNode] = currentNode; + delete unvisitedSet[currentNode]; // 更新 DSF parents 列表 + + dfsParentMap[currentNode] = previousNode; + } + }, + leave: function leave(_a) { + var currentNode = _a.current; // 如果所有的节点的子节点都已经访问过了，则从正在访问集合中删除掉，并将其移入到已访问集合中， + // 同时也意味着当前节点的所有邻居节点都被访问过了 + + visitedSet[currentNode] = currentNode; + delete visitingSet[currentNode]; + }, + allowTraversal: function allowTraversal(_a) { + var nextNode = _a.next; // 如果检测到环路则需要终止所有进一步的遍历，否则会导致无限循环遍历 + + if (cycle) { + return false; + } // 仅允许遍历没有访问的节点，visitedSet 中的都已经访问过了 + + + return !visitedSet[nextNode]; + } + }; // 开始遍历节点 + + while (Object.keys(unvisitedSet).length) { + // 从第一个节点开始进行 DFS 遍历 + var firsetUnVisitedKey = Object.keys(unvisitedSet)[0]; + depthFirstSearch(graphData, firsetUnVisitedKey, callbacks); + } + + return cycle; +}; +/** + * 检测无向图中的所有Base cycles + * refer: https://www.codeproject.com/Articles/1158232/Enumerating-All-Cycles-in-an-Undirected-Graph + * @param graph + * @param nodeIds 节点 ID 的数组 + * @param include 包含或排除指定的节点 + * @return [{[key: string]: INode}] 返回一组base cycles + */ + + +var detectAllUndirectedCycle = function detectAllUndirectedCycle(graphData, nodeIds, include) { + var _a, _b; + + if (include === void 0) { + include = true; + } + + var allCycles = []; + var components = getConnectedComponents(graphData, false); // loop through all connected components + + for (var _i = 0, components_1 = components; _i < components_1.length; _i++) { + var component = components_1[_i]; + if (!component.length) continue; + var root = component[0]; + var rootId = root.id; + var stack = [root]; + var parent_1 = (_a = {}, _a[rootId] = root, _a); + var used = (_b = {}, _b[rootId] = new Set(), _b); // walk a spanning tree to find cycles + + while (stack.length > 0) { + var curNode = stack.pop(); + var curNodeId = curNode.id; + var neighbors = getNeighbors(curNodeId, graphData.edges); + + var _loop_1 = function _loop_1(i) { + var _c; + + var neighborId = neighbors[i]; + var neighbor = graphData.nodes.find(function (node) { + return node.id === neighborId; + }); // const neighborId = neighbor.get('id'); + + if (neighborId === curNodeId) { + // 自环 + allCycles.push((_c = {}, _c[neighborId] = curNode, _c)); + } else if (!(neighborId in used)) { + // visit a new node + parent_1[neighborId] = curNode; + stack.push(neighbor); + used[neighborId] = new Set([curNode]); + } else if (!used[curNodeId].has(neighbor)) { + // a cycle found + var cycleValid = true; + var cyclePath = [neighbor, curNode]; + var p = parent_1[curNodeId]; + + while (used[neighborId].size && !used[neighborId].has(p)) { + cyclePath.push(p); + if (p === parent_1[p.id]) break;else p = parent_1[p.id]; + } + + cyclePath.push(p); + + if (nodeIds && include) { + // 如果有指定包含的节点 + cycleValid = false; + + if (cyclePath.findIndex(function (node) { + return nodeIds.indexOf(node.id) > -1; + }) > -1) { + cycleValid = true; + } + } else if (nodeIds && !include) { + // 如果有指定不包含的节点 + if (cyclePath.findIndex(function (node) { + return nodeIds.indexOf(node.id) > -1; + }) > -1) { + cycleValid = false; + } + } // 把 node list 形式转换为 cycle 的格式 + + + if (cycleValid) { + var cycle = {}; + + for (var index = 1; index < cyclePath.length; index += 1) { + cycle[cyclePath[index - 1].id] = cyclePath[index]; + } + + if (cyclePath.length) { + cycle[cyclePath[cyclePath.length - 1].id] = cyclePath[0]; + } + + allCycles.push(cycle); + } + + used[neighborId].add(curNode); + } + }; + + for (var i = 0; i < neighbors.length; i += 1) { + _loop_1(i); + } + } + } + + return allCycles; +}; +/** + * Johnson's algorithm, 时间复杂度 O((V + E)(C + 1))$ and space bounded by O(V + E) + * refer: https://www.cs.tufts.edu/comp/150GA/homeworks/hw1/Johnson%2075.PDF + * refer: https://networkx.github.io/documentation/stable/_modules/networkx/algorithms/cycles.html#simple_cycles + * @param graph + * @param nodeIds 节点 ID 的数组 + * @param include 包含或排除指定的节点 + * @return [{[key: string]: INode}] 返回所有的 simple cycles + */ + +var detectAllDirectedCycle = function detectAllDirectedCycle(graphData, nodeIds, include) { + if (include === void 0) { + include = true; + } + + var path = []; // stack of nodes in current path + + var blocked = new Set(); + var B = []; // remember portions of the graph that yield no elementary circuit + + var allCycles = []; + var idx2Node = {}; + var node2Idx = {}; // 辅助函数： unblock all blocked nodes + + var unblock = function unblock(thisNode) { + var stack = [thisNode]; + + while (stack.length > 0) { + var node = stack.pop(); + + if (blocked.has(node)) { + blocked.delete(node); + B[node.id].forEach(function (n) { + stack.push(n); + }); + B[node.id].clear(); + } + } + }; + + var circuit = function circuit(node, start, adjList) { + var closed = false; // whether a path is closed + + if (nodeIds && include === false && nodeIds.indexOf(node.id) > -1) return closed; + path.push(node); + blocked.add(node); + var neighbors = adjList[node.id]; + + for (var i = 0; i < neighbors.length; i += 1) { + var neighbor = idx2Node[neighbors[i]]; + + if (neighbor === start) { + var cycle = {}; + + for (var index = 1; index < path.length; index += 1) { + cycle[path[index - 1].id] = path[index]; + } + + if (path.length) { + cycle[path[path.length - 1].id] = path[0]; + } + + allCycles.push(cycle); + closed = true; + } else if (!blocked.has(neighbor)) { + if (circuit(neighbor, start, adjList)) { + closed = true; + } + } + } + + if (closed) { + unblock(node); + } else { + for (var i = 0; i < neighbors.length; i += 1) { + var neighbor = idx2Node[neighbors[i]]; + + if (!B[neighbor.id].has(node)) { + B[neighbor.id].add(node); + } + } + } + + path.pop(); + return closed; + }; + + var _a = graphData.nodes, + nodes = _a === void 0 ? [] : _a; // Johnson's algorithm 要求给节点赋顺序，先按节点在数组中的顺序 + + for (var i = 0; i < nodes.length; i += 1) { + var node = nodes[i]; + var nodeId = node.id; + node2Idx[nodeId] = i; + idx2Node[i] = node; + } // 如果有指定包含的节点，则把指定节点排序在前，以便提早结束搜索 + + + if (nodeIds && include) { + var _loop_2 = function _loop_2(i) { + var nodeId = nodeIds[i]; + node2Idx[nodes[i].id] = node2Idx[nodeId]; + node2Idx[nodeId] = 0; + idx2Node[0] = nodes.find(function (node) { + return node.id === nodeId; + }); + idx2Node[node2Idx[nodes[i].id]] = nodes[i]; + }; + + for (var i = 0; i < nodeIds.length; i++) { + _loop_2(i); + } + } // 返回 节点顺序 >= nodeOrder 的强连通分量的adjList + + + var getMinComponentAdj = function getMinComponentAdj(components) { + var _a; + + var minCompIdx; + var minIdx = Infinity; // Find least component and the lowest node + + for (var i = 0; i < components.length; i += 1) { + var comp = components[i]; + + for (var j = 0; j < comp.length; j++) { + var nodeIdx_1 = node2Idx[comp[j].id]; + + if (nodeIdx_1 < minIdx) { + minIdx = nodeIdx_1; + minCompIdx = i; + } + } + } + + var component = components[minCompIdx]; + var adjList = []; + + for (var i = 0; i < component.length; i += 1) { + var node = component[i]; + adjList[node.id] = []; + + for (var _i = 0, _b = getNeighbors(node.id, graphData.edges, 'target').filter(function (n) { + return component.map(function (c) { + return c.id; + }).indexOf(n) > -1; + }); _i < _b.length; _i++) { + var neighbor = _b[_i]; // 对自环情况 (点连向自身) 特殊处理：记录自环，但不加入adjList + + if (neighbor === node.id && !(include === false && nodeIds.indexOf(node.id) > -1)) { + allCycles.push((_a = {}, _a[node.id] = node, _a)); + } else { + adjList[node.id].push(node2Idx[neighbor]); + } + } + } + + return { + component: component, + adjList: adjList, + minIdx: minIdx + }; + }; + + var nodeIdx = 0; + + while (nodeIdx < nodes.length) { + var subgraphNodes = nodes.filter(function (n) { + return node2Idx[n.id] >= nodeIdx; + }); + var sccs = detectStrongConnectComponents({ + nodes: subgraphNodes, + edges: graphData.edges + }).filter(function (component) { + return component.length > 1; + }); + if (sccs.length === 0) break; + var scc = getMinComponentAdj(sccs); + var minIdx = scc.minIdx, + adjList = scc.adjList, + component = scc.component; + + if (component.length > 1) { + component.forEach(function (node) { + B[node.id] = new Set(); + }); + var startNode = idx2Node[minIdx]; // startNode 不在指定要包含的节点中，提前结束搜索 + + if (nodeIds && include && nodeIds.indexOf(startNode.id) === -1) return allCycles; + circuit(startNode, startNode, adjList); + nodeIdx = minIdx + 1; + } else { + break; + } + } + + return allCycles; +}; +/** + * 查找图中所有满足要求的圈 + * @param graph + * @param directed 是否为有向图 + * @param nodeIds 节点 ID 的数组，若不指定，则返回图中所有的圈 + * @param include 包含或排除指定的节点 + * @return [{[key: string]: Node}] 包含所有环的数组，每个环用一个Object表示，其中key为节点id，value为该节点在环中指向的下一个节点 + */ + +var detectAllCycles = function detectAllCycles(graphData, directed, nodeIds, include) { + if (include === void 0) { + include = true; + } + + if (directed) return detectAllDirectedCycle(graphData, nodeIds, include); + return detectAllUndirectedCycle(graphData, nodeIds, include); +}; + +var minVertex = function minVertex(D, nodes, marks) { + // 找出最小的点 + var minDis = Infinity; + var minNode; + + for (var i = 0; i < nodes.length; i++) { + var nodeId = nodes[i].id; + + if (!marks[nodeId] && D[nodeId] <= minDis) { + minDis = D[nodeId]; + minNode = nodes[i]; + } + } + + return minNode; +}; + +var dijkstra$2 = function dijkstra(graphData, source, directed, weightPropertyName) { + var _a = graphData.nodes, + nodes = _a === void 0 ? [] : _a, + _b = graphData.edges, + edges = _b === void 0 ? [] : _b; + var marks = {}; + var D = {}; + var prevs = {}; // key: 顶点, value: 顶点的前驱点数组（可能有多条等长的最短路径） + + nodes.forEach(function (node, i) { + var id = node.id; + D[id] = Infinity; + if (id === source) D[id] = 0; + }); + var nodeNum = nodes.length; + + var _loop_1 = function _loop_1(i) { + // Process the vertices + var minNode = minVertex(D, nodes, marks); + var minNodeId = minNode.id; + marks[minNodeId] = true; + if (D[minNodeId] === Infinity) return "continue"; // Unreachable vertices cannot be the intermediate point + + var relatedEdges = []; + if (directed) relatedEdges = getOutEdgesNodeId(minNodeId, edges);else relatedEdges = getEdgesByNodeId(minNodeId, edges); + relatedEdges.forEach(function (edge) { + var edgeTarget = edge.target; + var edgeSource = edge.source; + var w = edgeTarget === minNodeId ? edgeSource : edgeTarget; + var weight = weightPropertyName && edge[weightPropertyName] ? edge[weightPropertyName] : 1; + + if (D[w] > D[minNode.id] + weight) { + D[w] = D[minNode.id] + weight; + prevs[w] = [minNode.id]; + } else if (D[w] === D[minNode.id] + weight) { + prevs[w].push(minNode.id); + } + }); + }; + + for (var i = 0; i < nodeNum; i++) { + _loop_1(); + } + + prevs[source] = [source]; // 每个节点存可能存在多条最短路径 + + var paths = {}; + + for (var target in D) { + if (D[target] !== Infinity) { + findAllPaths(source, target, prevs, paths); + } + } // 兼容之前单路径 + + + var path = {}; + + for (var target in paths) { + path[target] = paths[target][0]; + } + + return { + length: D, + path: path, + allPath: paths + }; +}; + +function findAllPaths(source, target, prevs, foundPaths) { + if (source === target) { + return [source]; + } + + if (foundPaths[target]) { + return foundPaths[target]; + } + + var paths = []; + + for (var _i = 0, _a = prevs[target]; _i < _a.length; _i++) { + var prev = _a[_i]; + var prevPaths = findAllPaths(source, prev, prevs, foundPaths); + if (!prevPaths) return; + + for (var _b = 0, prevPaths_1 = prevPaths; _b < prevPaths_1.length; _b++) { + var prePath = prevPaths_1[_b]; + if (isArray$n(prePath)) paths.push(__spreadArray$3(__spreadArray$3([], prePath), [target]));else paths.push([prePath, target]); + } + } + + foundPaths[target] = paths; + return foundPaths[target]; +} + +var findShortestPath = function findShortestPath(graphData, start, end, directed, weightPropertyName) { + var _a = dijkstra$2(graphData, start, directed, weightPropertyName), + length = _a.length, + path = _a.path, + allPath = _a.allPath; + + return { + length: length[end], + path: path[end], + allPath: allPath[end] + }; +}; +var findAllPath = function findAllPath(graphData, start, end, directed) { + var _a; + + if (start === end) return [[start]]; + var _b = graphData.edges, + edges = _b === void 0 ? [] : _b; + var visited = [start]; + var isVisited = (_a = {}, _a[start] = true, _a); + var stack = []; // 辅助栈，用于存储访问过的节点的邻居节点 + + var allPath = []; + var neighbors = directed ? getNeighbors(start, edges, 'target') : getNeighbors(start, edges); + stack.push(neighbors); + + while (visited.length > 0 && stack.length > 0) { + var children = stack[stack.length - 1]; + + if (children.length) { + var child = children.shift(); + + if (child) { + visited.push(child); + isVisited[child] = true; + neighbors = directed ? getNeighbors(child, edges, 'target') : getNeighbors(child, edges); + stack.push(neighbors.filter(function (neighbor) { + return !isVisited[neighbor]; + })); + } + } else { + var node = visited.pop(); + isVisited[node] = false; + stack.pop(); + continue; + } + + if (visited[visited.length - 1] === end) { + var path = visited.map(function (node) { + return node; + }); + allPath.push(path); + var node = visited.pop(); + isVisited[node] = false; + stack.pop(); + } + } + + return allPath; +}; + +var floydWarshall$3 = function floydWarshall(graphData, directed) { + var adjacentMatrix = adjMatrix(graphData, directed); + var dist = []; + var size = adjacentMatrix.length; + + for (var i = 0; i < size; i += 1) { + dist[i] = []; + + for (var j = 0; j < size; j += 1) { + if (i === j) { + dist[i][j] = 0; + } else if (adjacentMatrix[i][j] === 0 || !adjacentMatrix[i][j]) { + dist[i][j] = Infinity; + } else { + dist[i][j] = adjacentMatrix[i][j]; + } + } + } // floyd + + + for (var k = 0; k < size; k += 1) { + for (var i = 0; i < size; i += 1) { + for (var j = 0; j < size; j += 1) { + if (dist[i][j] > dist[i][k] + dist[k][j]) { + dist[i][j] = dist[i][k] + dist[k][j]; + } + } + } + } + + return dist; +}; + +/** + * 标签传播算法 + * @param graphData 图数据 + * @param directed 是否有向图，默认为 false + * @param weightPropertyName 权重的属性字段 + * @param maxIteration 最大迭代次数 + */ + +var labelPropagation = function labelPropagation(graphData, directed, weightPropertyName, maxIteration) { + if (directed === void 0) { + directed = false; + } + + if (weightPropertyName === void 0) { + weightPropertyName = 'weight'; + } + + if (maxIteration === void 0) { + maxIteration = 1000; + } // the origin data + + + var _a = graphData.nodes, + nodes = _a === void 0 ? [] : _a, + _b = graphData.edges, + edges = _b === void 0 ? [] : _b; + var clusters = {}; + var nodeMap = {}; // init the clusters and nodeMap + + nodes.forEach(function (node, i) { + var cid = uniqueId$2(); + node.clusterId = cid; + clusters[cid] = { + id: cid, + nodes: [node] + }; + nodeMap[node.id] = { + node: node, + idx: i + }; + }); // the adjacent matrix of calNodes inside clusters + + var adjMatrix$1 = adjMatrix(graphData, directed); // the sum of each row in adjacent matrix + /** + * neighbor nodes (id for key and weight for value) for each node + * neighbors = { + * id(node_id): { id(neighbor_1_id): weight(weight of the edge), id(neighbor_2_id): weight(weight of the edge), ... }, + * ... + * } + */ + + var neighbors = {}; + adjMatrix$1.forEach(function (row, i) { + var iid = nodes[i].id; + neighbors[iid] = {}; + row.forEach(function (entry, j) { + if (!entry) return; + var jid = nodes[j].id; + neighbors[iid][jid] = entry; + }); + }); + var iter = 0; + + var _loop_1 = function _loop_1() { + var changed = false; + nodes.forEach(function (node) { + var neighborClusters = {}; + Object.keys(neighbors[node.id]).forEach(function (neighborId) { + var neighborWeight = neighbors[node.id][neighborId]; + var neighborNode = nodeMap[neighborId].node; + var neighborClusterId = neighborNode.clusterId; + if (!neighborClusters[neighborClusterId]) neighborClusters[neighborClusterId] = 0; + neighborClusters[neighborClusterId] += neighborWeight; + }); // find the cluster with max weight + + var maxWeight = -Infinity; + var bestClusterIds = []; + Object.keys(neighborClusters).forEach(function (clusterId) { + if (maxWeight < neighborClusters[clusterId]) { + maxWeight = neighborClusters[clusterId]; + bestClusterIds = [clusterId]; + } else if (maxWeight === neighborClusters[clusterId]) { + bestClusterIds.push(clusterId); + } + }); + if (bestClusterIds.length === 1 && bestClusterIds[0] === node.clusterId) return; + var selfClusterIdx = bestClusterIds.indexOf(node.clusterId); + if (selfClusterIdx >= 0) bestClusterIds.splice(selfClusterIdx, 1); + + if (bestClusterIds && bestClusterIds.length) { + changed = true; // remove from origin cluster + + var selfCluster = clusters[node.clusterId]; + var nodeInSelfClusterIdx = selfCluster.nodes.indexOf(node); + selfCluster.nodes.splice(nodeInSelfClusterIdx, 1); // move the node to the best cluster + + var randomIdx = Math.floor(Math.random() * bestClusterIds.length); + var bestCluster = clusters[bestClusterIds[randomIdx]]; + bestCluster.nodes.push(node); + node.clusterId = bestCluster.id; + } + }); + if (!changed) return "break"; + iter++; + }; + + while (iter < maxIteration) { + var state_1 = _loop_1(); + + if (state_1 === "break") break; + } // delete the empty clusters + + + Object.keys(clusters).forEach(function (clusterId) { + var cluster = clusters[clusterId]; + + if (!cluster.nodes || !cluster.nodes.length) { + delete clusters[clusterId]; + } + }); // get the cluster edges + + var clusterEdges = []; + var clusterEdgeMap = {}; + edges.forEach(function (edge) { + var source = edge.source, + target = edge.target; + var weight = edge[weightPropertyName] || 1; + var sourceClusterId = nodeMap[source].node.clusterId; + var targetClusterId = nodeMap[target].node.clusterId; + var newEdgeId = sourceClusterId + "---" + targetClusterId; + + if (clusterEdgeMap[newEdgeId]) { + clusterEdgeMap[newEdgeId].weight += weight; + clusterEdgeMap[newEdgeId].count++; + } else { + var newEdge = { + source: sourceClusterId, + target: targetClusterId, + weight: weight, + count: 1 + }; + clusterEdgeMap[newEdgeId] = newEdge; + clusterEdges.push(newEdge); + } + }); + var clustersArray = []; + Object.keys(clusters).forEach(function (clusterId) { + clustersArray.push(clusters[clusterId]); + }); + return { + clusters: clustersArray, + clusterEdges: clusterEdges + }; +}; + +var getModularity = function getModularity(nodes, adjMatrix, ks, m) { + var length = adjMatrix.length; + var param = 2 * m; + var modularity = 0; + + for (var i = 0; i < length; i++) { + var clusteri = nodes[i].clusterId; + + for (var j = 0; j < length; j++) { + var clusterj = nodes[j].clusterId; + if (clusteri !== clusterj) continue; + var entry = adjMatrix[i][j] || 0; + var ki = ks[i] || 0; + var kj = ks[j] || 0; + modularity += entry - ki * kj / param; + } + } + + modularity *= 1 / param; + return modularity; +}; +/** + * 社区发现 louvain 算法 + * @param graphData 图数据 + * @param directed 是否有向图，默认为 false + * @param weightPropertyName 权重的属性字段 + * @param threshold + */ + + +var louvain = function louvain(graphData, directed, weightPropertyName, threshold) { + if (directed === void 0) { + directed = false; + } + + if (weightPropertyName === void 0) { + weightPropertyName = 'weight'; + } + + if (threshold === void 0) { + threshold = 0.0001; + } // the origin data + + + var _a = graphData.nodes, + nodes = _a === void 0 ? [] : _a, + _b = graphData.edges, + edges = _b === void 0 ? [] : _b; + var uniqueId = 1; + var clusters = {}; + var nodeMap = {}; // init the clusters and nodeMap + + nodes.forEach(function (node, i) { + var cid = String(uniqueId++); + node.clusterId = cid; + clusters[cid] = { + id: cid, + nodes: [node] + }; + nodeMap[node.id] = { + node: node, + idx: i + }; + }); // the adjacent matrix of calNodes inside clusters + + var adjMatrix$1 = adjMatrix(graphData, directed); // the sum of each row in adjacent matrix + + var ks = []; + /** + * neighbor nodes (id for key and weight for value) for each node + * neighbors = { + * id(node_id): { id(neighbor_1_id): weight(weight of the edge), id(neighbor_2_id): weight(weight of the edge), ... }, + * ... + * } + */ + + var neighbors = {}; // the sum of the weights of all edges in the graph + + var m = 0; + adjMatrix$1.forEach(function (row, i) { + var k = 0; + var iid = nodes[i].id; + neighbors[iid] = {}; + row.forEach(function (entry, j) { + if (!entry) return; + k += entry; + var jid = nodes[j].id; + neighbors[iid][jid] = entry; + m += entry; + }); + ks.push(k); + }); + m /= 2; + var totalModularity = Infinity; + var previousModularity = Infinity; + var iter = 0; + + while (true) { + // whether to terminate the iterations + totalModularity = getModularity(nodes, adjMatrix$1, ks, m); + if (Math.abs(totalModularity - previousModularity) < threshold || iter > 100) break; + previousModularity = totalModularity; + iter++; // pre compute some values for current clusters + + Object.keys(clusters).forEach(function (clusterId) { + // sum of weights of edges to nodes in cluster + var sumTot = 0; + edges.forEach(function (edge) { + var source = edge.source, + target = edge.target; + var sourceClusterId = nodeMap[source].node.clusterId; + var targetClusterId = nodeMap[target].node.clusterId; + + if (sourceClusterId === clusterId && targetClusterId !== clusterId || targetClusterId === clusterId && sourceClusterId !== clusterId) { + sumTot = sumTot + (edge[weightPropertyName] || 1); + } + }); + clusters[clusterId].sumTot = sumTot; + }); // move the nodes to increase the delta modularity + + nodes.forEach(function (node, i) { + var selfCluster = clusters[node.clusterId]; + var bestIncrease = 0; + var bestCluster; + var commonParam = ks[i] / (2 * m); // sum of weights of edges from node to nodes in cluster + + var kiin = 0; + var selfClusterNodes = selfCluster.nodes; + selfClusterNodes.forEach(function (scNode) { + var scNodeIdx = nodeMap[scNode.id].idx; + kiin += adjMatrix$1[i][scNodeIdx] || 0; + }); // the modurarity for **removing** the node i from the origin cluster of node i + + var removeModurarity = kiin - selfCluster.sumTot * commonParam; // the neightbors of the node + + var nodeNeighborIds = neighbors[node.id]; + Object.keys(nodeNeighborIds).forEach(function (neighborNodeId) { + var neighborNode = nodeMap[neighborNodeId].node; + var neighborClusterId = neighborNode.clusterId; // if the node and the neighbor of node are in the same cluster, reutrn + + if (neighborClusterId === node.clusterId) return; + var neighborCluster = clusters[neighborClusterId]; + var clusterNodes = neighborCluster.nodes; // if the cluster is empty, remove the cluster and return + + if (!clusterNodes || !clusterNodes.length) return; // sum of weights of edges from node to nodes in cluster + + var neighborClusterKiin = 0; + clusterNodes.forEach(function (cNode) { + var cNodeIdx = nodeMap[cNode.id].idx; + neighborClusterKiin += adjMatrix$1[i][cNodeIdx] || 0; + }); // modurarity for **adding** node i into this neighbor cluster + + var addModurarity = neighborClusterKiin - neighborCluster.sumTot * commonParam; // the increase modurarity is the difference between addModurarity and removeModurarity + + var increase = addModurarity - removeModurarity; // find the best cluster to move node i into + + if (increase > bestIncrease) { + bestIncrease = increase; + bestCluster = neighborCluster; + } + }); // if found a best cluster to move into + + if (bestIncrease > 0) { + bestCluster.nodes.push(node); + var previousClusterId_1 = node.clusterId; + node.clusterId = bestCluster.id; // move the node to the best cluster + + var nodeInSelfClusterIdx = selfCluster.nodes.indexOf(node); // remove from origin cluster + + selfCluster.nodes.splice(nodeInSelfClusterIdx, 1); // update sumTot for clusters + // sum of weights of edges to nodes in cluster + + var neighborClusterSumTot_1 = 0; + var selfClusterSumTot_1 = 0; + edges.forEach(function (edge) { + var source = edge.source, + target = edge.target; + var sourceClusterId = nodeMap[source].node.clusterId; + var targetClusterId = nodeMap[target].node.clusterId; + + if (sourceClusterId === bestCluster.id && targetClusterId !== bestCluster.id || targetClusterId === bestCluster.id && sourceClusterId !== bestCluster.id) { + neighborClusterSumTot_1 = neighborClusterSumTot_1 + (edge[weightPropertyName] || 1); + } + + if (sourceClusterId === previousClusterId_1 && targetClusterId !== previousClusterId_1 || targetClusterId === previousClusterId_1 && sourceClusterId !== previousClusterId_1) { + selfClusterSumTot_1 = selfClusterSumTot_1 + (edge[weightPropertyName] || 1); + } + }); // the nodes of the clusters to move into and remove are changed, update their sumTot + + bestCluster.sumTot = neighborClusterSumTot_1; + selfCluster.sumTot = selfClusterSumTot_1; + } + }); + } // delete the empty clusters, assign increasing clusterId + + + var newClusterIdMap = {}; + var clusterIdx = 0; + Object.keys(clusters).forEach(function (clusterId) { + var cluster = clusters[clusterId]; + + if (!cluster.nodes || !cluster.nodes.length) { + delete clusters[clusterId]; + return; + } + + var newId = String(clusterIdx + 1); + + if (newId === clusterId) { + return; + } + + cluster.id = newId; + cluster.nodes = cluster.nodes.map(function (item) { + return { + id: item.id, + clusterId: newId + }; + }); + clusters[newId] = cluster; + newClusterIdMap[clusterId] = newId; + delete clusters[clusterId]; + clusterIdx++; + }); + nodes.forEach(function (node) { + if (node.clusterId && newClusterIdMap[node.clusterId]) node.clusterId = newClusterIdMap[node.clusterId]; + }); // get the cluster edges + + var clusterEdges = []; + var clusterEdgeMap = {}; + edges.forEach(function (edge) { + var source = edge.source, + target = edge.target; + var weight = edge[weightPropertyName] || 1; + var sourceClusterId = nodeMap[source].node.clusterId; + var targetClusterId = nodeMap[target].node.clusterId; + var newEdgeId = sourceClusterId + "---" + targetClusterId; + + if (clusterEdgeMap[newEdgeId]) { + clusterEdgeMap[newEdgeId].weight += weight; + clusterEdgeMap[newEdgeId].count++; + } else { + var newEdge = { + source: sourceClusterId, + target: targetClusterId, + weight: weight, + count: 1 + }; + clusterEdgeMap[newEdgeId] = newEdge; + clusterEdges.push(newEdge); + } + }); + var clustersArray = []; + Object.keys(clusters).forEach(function (clusterId) { + clustersArray.push(clusters[clusterId]); + }); + return { + clusters: clustersArray, + clusterEdges: clusterEdges + }; +}; + +/** + * 并查集 Disjoint set to support quick union + */ +var UnionFind = function () { + function UnionFind(items) { + this.count = items.length; + this.parent = {}; + + for (var _i = 0, items_1 = items; _i < items_1.length; _i++) { + var i = items_1[_i]; + this.parent[i] = i; + } + } // find the root of the item + + + UnionFind.prototype.find = function (item) { + while (this.parent[item] !== item) { + item = this.parent[item]; + } + + return item; + }; + + UnionFind.prototype.union = function (a, b) { + var rootA = this.find(a); + var rootB = this.find(b); + if (rootA === rootB) return; // make the element with smaller root the parent + + if (rootA < rootB) { + if (this.parent[b] !== b) this.union(this.parent[b], a); + this.parent[b] = this.parent[a]; + } else { + if (this.parent[a] !== a) this.union(this.parent[a], b); + this.parent[a] = this.parent[b]; + } + }; // whether a and b are connected, i.e. a and b have the same root + + + UnionFind.prototype.connected = function (a, b) { + return this.find(a) === this.find(b); + }; + + return UnionFind; +}(); + +var defaultCompare = function defaultCompare(a, b) { + return a - b; +}; + +var MinBinaryHeap = function () { + function MinBinaryHeap(compareFn) { + if (compareFn === void 0) { + compareFn = defaultCompare; + } + + this.compareFn = compareFn; + this.list = []; + } + + MinBinaryHeap.prototype.getLeft = function (index) { + return 2 * index + 1; + }; + + MinBinaryHeap.prototype.getRight = function (index) { + return 2 * index + 2; + }; + + MinBinaryHeap.prototype.getParent = function (index) { + if (index === 0) { + return null; + } + + return Math.floor((index - 1) / 2); + }; + + MinBinaryHeap.prototype.isEmpty = function () { + return this.list.length <= 0; + }; + + MinBinaryHeap.prototype.top = function () { + return this.isEmpty() ? undefined : this.list[0]; + }; + + MinBinaryHeap.prototype.delMin = function () { + var top = this.top(); + var bottom = this.list.pop(); + + if (this.list.length > 0) { + this.list[0] = bottom; + this.moveDown(0); + } + + return top; + }; + + MinBinaryHeap.prototype.insert = function (value) { + if (value !== null) { + this.list.push(value); + var index = this.list.length - 1; + this.moveUp(index); + return true; + } + + return false; + }; + + MinBinaryHeap.prototype.moveUp = function (index) { + var parent = this.getParent(index); + + while (index && index > 0 && this.compareFn(this.list[parent], this.list[index]) > 0) { + // swap + var tmp = this.list[parent]; + this.list[parent] = this.list[index]; + this.list[index] = tmp; // [this.list[index], this.list[parent]] = [this.list[parent], this.list[index]] + + index = parent; + parent = this.getParent(index); + } + }; + + MinBinaryHeap.prototype.moveDown = function (index) { + var _a; + + var element = index; + var left = this.getLeft(index); + var right = this.getRight(index); + var size = this.list.length; + + if (left !== null && left < size && this.compareFn(this.list[element], this.list[left]) > 0) { + element = left; + } else if (right !== null && right < size && this.compareFn(this.list[element], this.list[right]) > 0) { + element = right; + } + + if (index !== element) { + _a = [this.list[element], this.list[index]], this.list[index] = _a[0], this.list[element] = _a[1]; + this.moveDown(element); + } + }; + + return MinBinaryHeap; +}(); + +/** + * Prim algorithm，use priority queue，复杂度 O(E+V*logV), V: 节点数量，E: 边的数量 + * refer: https://en.wikipedia.org/wiki/Prim%27s_algorithm + * @param graph + * @param weight 指定用于作为边权重的属性，若不指定，则认为所有边权重一致 + */ + +var primMST = function primMST(graphData, weight) { + var selectedEdges = []; + var _a = graphData.nodes, + nodes = _a === void 0 ? [] : _a, + _b = graphData.edges, + edges = _b === void 0 ? [] : _b; + + if (nodes.length === 0) { + return selectedEdges; + } // 从nodes[0]开始 + + + var currNode = nodes[0]; + var visited = new Set(); + visited.add(currNode); // 用二叉堆维护距已加入节点的其他节点的边的权值 + + var compareWeight = function compareWeight(a, b) { + if (weight) { + return a.weight - b.weight; + } + + return 0; + }; + + var edgeQueue = new MinBinaryHeap(compareWeight); + getEdgesByNodeId(currNode.id, edges).forEach(function (edge) { + edgeQueue.insert(edge); + }); + + while (!edgeQueue.isEmpty()) { + // 选取与已加入的结点之间边权最小的结点 + var currEdge = edgeQueue.delMin(); + var source = currEdge.source; + var target = currEdge.target; + if (visited.has(source) && visited.has(target)) continue; + selectedEdges.push(currEdge); + + if (!visited.has(source)) { + visited.add(source); + getEdgesByNodeId(source, edges).forEach(function (edge) { + edgeQueue.insert(edge); + }); + } + + if (!visited.has(target)) { + visited.add(target); + getEdgesByNodeId(target, edges).forEach(function (edge) { + edgeQueue.insert(edge); + }); + } + } + + return selectedEdges; +}; +/** + * Kruskal algorithm，复杂度 O(E*logE), E: 边的数量 + * refer: https://en.wikipedia.org/wiki/Kruskal%27s_algorithm + * @param graph + * @param weight 指定用于作为边权重的属性，若不指定，则认为所有边权重一致 + * @return IEdge[] 返回构成MST的边的数组 + */ + + +var kruskalMST = function kruskalMST(graphData, weight) { + var selectedEdges = []; + var _a = graphData.nodes, + nodes = _a === void 0 ? [] : _a, + _b = graphData.edges, + edges = _b === void 0 ? [] : _b; + + if (nodes.length === 0) { + return selectedEdges; + } // 若指定weight，则将所有的边按权值从小到大排序 + + + var weightEdges = edges.map(function (edge) { + return edge; + }); + + if (weight) { + weightEdges.sort(function (a, b) { + return a.weight - b.weight; + }); + } + + var disjointSet = new UnionFind(nodes.map(function (n) { + return n.id; + })); // 从权值最小的边开始，如果这条边连接的两个节点于图G中不在同一个连通分量中，则添加这条边 + // 直到遍历完所有点或边 + + while (weightEdges.length > 0) { + var curEdge = weightEdges.shift(); + var source = curEdge.source; + var target = curEdge.target; + + if (!disjointSet.connected(source, target)) { + selectedEdges.push(curEdge); + disjointSet.union(source, target); + } + } + + return selectedEdges; +}; +/** + * 最小生成树 + * refer: https://en.wikipedia.org/wiki/Kruskal%27s_algorithm + * @param graph + * @param weight 指定用于作为边权重的属性，若不指定，则认为所有边权重一致 + * @param algo 'prim' | 'kruskal' 算法类型 + * @return EdgeConfig[] 返回构成MST的边的数组 + */ + + +var minimumSpanningTree = function minimumSpanningTree(graphData, weight, algo) { + var algos = { + prim: primMST, + kruskal: kruskalMST + }; + if (!algo) return kruskalMST(graphData, weight); + return algos[algo](graphData, weight); +}; + +/** + * PageRank https://en.wikipedia.org/wiki/PageRank + * refer: https://github.com/anvaka/ngraph.pagerank + * @param graph + * @param epsilon 判断是否收敛的精度值，默认 0.000001 + * @param linkProb 阻尼系数（dumping factor），指任意时刻，用户访问到某节点后继续访问该节点链接的下一个节点的概率，经验值 0.85 + */ + +var pageRank = function pageRank(graphData, epsilon, linkProb) { + if (typeof epsilon !== 'number') epsilon = 0.000001; + if (typeof linkProb !== 'number') linkProb = 0.85; + var distance = 1; + var leakedRank = 0; + var maxIterations = 1000; + var _a = graphData.nodes, + nodes = _a === void 0 ? [] : _a, + _b = graphData.edges, + edges = _b === void 0 ? [] : _b; + var nodesCount = nodes.length; + var currentRank; + var curRanks = {}; + var prevRanks = {}; // Initialize pageranks 初始化 + + for (var j = 0; j < nodesCount; ++j) { + var node = nodes[j]; + var nodeId = node.id; + curRanks[nodeId] = 1 / nodesCount; + prevRanks[nodeId] = 1 / nodesCount; + } + + var nodeDegree = degree(graphData); + + while (maxIterations > 0 && distance > epsilon) { + leakedRank = 0; + + for (var j = 0; j < nodesCount; ++j) { + var node = nodes[j]; + var nodeId = node.id; + currentRank = 0; + + if (nodeDegree[node.id].inDegree === 0) { + curRanks[nodeId] = 0; + } else { + var neighbors = getNeighbors(nodeId, edges, 'source'); + + for (var i = 0; i < neighbors.length; ++i) { + var neighbor = neighbors[i]; + var outDegree = nodeDegree[neighbor].outDegree; + if (outDegree > 0) currentRank += prevRanks[neighbor] / outDegree; + } + + curRanks[nodeId] = linkProb * currentRank; + leakedRank += curRanks[nodeId]; + } + } + + leakedRank = (1 - leakedRank) / nodesCount; + distance = 0; + + for (var j = 0; j < nodesCount; ++j) { + var node = nodes[j]; + var nodeId = node.id; + currentRank = curRanks[nodeId] + leakedRank; + distance += Math.abs(currentRank - prevRanks[nodeId]); + prevRanks[nodeId] = currentRank; + } + + maxIterations -= 1; + } + + return prevRanks; +}; + +var VACANT_EDGE_ID = -1; +var VACANT_NODE_ID = -1; +var VACANT_EDGE_LABEL = "-1"; +var VACANT_NODE_LABEL = "-1"; +var VACANT_GRAPH_ID = -1; + +var Edge$1 = function () { + function Edge(id, from, to, label) { + if (id === void 0) { + id = VACANT_EDGE_ID; + } + + if (from === void 0) { + from = VACANT_NODE_ID; + } + + if (to === void 0) { + to = VACANT_NODE_ID; + } + + if (label === void 0) { + label = VACANT_EDGE_LABEL; + } + + this.id = id; + this.from = from; + this.to = to; + this.label = label; + } + + return Edge; +}(); + +var Node$1 = function () { + function Node(id, label) { + if (id === void 0) { + id = VACANT_NODE_ID; + } + + if (label === void 0) { + label = VACANT_NODE_LABEL; + } + + this.id = id; + this.label = label; + this.edges = []; + this.edgeMap = {}; + } + + Node.prototype.addEdge = function (edge) { + this.edges.push(edge); + this.edgeMap[edge.id] = edge; + }; + + return Node; +}(); + +var Graph$c = function () { + function Graph(id, edgeIdAutoIncrease, directed) { + if (id === void 0) { + id = VACANT_NODE_ID; + } + + if (edgeIdAutoIncrease === void 0) { + edgeIdAutoIncrease = true; + } + + if (directed === void 0) { + directed = false; + } + + this.id = id; + this.edgeIdAutoIncrease = edgeIdAutoIncrease; + this.edges = []; + this.nodes = []; + this.nodeMap = {}; + this.edgeMap = {}; + this.nodeLabelMap = {}; + this.edgeLabelMap = {}; + this.counter = 0; + this.directed = directed; + } + + Graph.prototype.getNodeNum = function () { + return this.nodes.length; + }; + + Graph.prototype.addNode = function (id, label) { + if (this.nodeMap[id]) return; + var node = new Node$1(id, label); + this.nodes.push(node); + this.nodeMap[id] = node; + if (!this.nodeLabelMap[label]) this.nodeLabelMap[label] = []; + this.nodeLabelMap[label].push(id); + }; + + Graph.prototype.addEdge = function (id, from, to, label) { + if (this.edgeIdAutoIncrease || id === undefined) id = this.counter++; + if (this.nodeMap[from] && this.nodeMap[to] && this.nodeMap[to].edgeMap[id]) return; + var edge = new Edge$1(id, from, to, label); + this.edges.push(edge); + this.edgeMap[id] = edge; + this.nodeMap[from].addEdge(edge); + if (!this.edgeLabelMap[label]) this.edgeLabelMap[label] = []; + this.edgeLabelMap[label].push(edge); + + if (!this.directed) { + var rEdge = new Edge$1(id, to, from, label); + this.nodeMap[to].addEdge(rEdge); + this.edgeLabelMap[label].push(rEdge); + } + }; + + return Graph; +}(); + +var DFSedge = function () { + function DFSedge(fromNode, toNode, fromNodeLabel, edgeLabel, toNodeLabel) { + this.fromNode = fromNode; + this.toNode = toNode; + this.nodeEdgeNodeLabel = { + nodeLabel1: fromNodeLabel || VACANT_NODE_LABEL, + edgeLabel: edgeLabel || VACANT_EDGE_LABEL, + nodeLabel2: toNodeLabel || VACANT_NODE_LABEL + }; + } + + DFSedge.prototype.equalTo = function (other) { + return this.fromNode === other.formNode && this.toNode === other.toNode && this.nodeEdgeNodeLabel === other.nodeEdgeNodeLabel; + }; + + DFSedge.prototype.notEqualTo = function (other) { + return !this.equalTo(other); + }; + + return DFSedge; +}(); // DFScode 是 DESedge 的数组 + + +var DFScode = function () { + function DFScode() { + this.rmpath = []; + this.dfsEdgeList = []; + } + + DFScode.prototype.equalTo = function (other) { + var aLength = this.dfsEdgeList.length; + var bLength = other.length; + if (aLength !== bLength) return false; + + for (var i = 0; i < aLength; i++) { + if (this.dfsEdgeList[i] !== other[i]) return false; + } + + return true; + }; + + DFScode.prototype.notEqualTo = function (other) { + return !this.equalTo(other); + }; + /** 增加一条 edge 到 DFScode */ + + + DFScode.prototype.pushBack = function (fromNode, toNode, fromNodeLabel, edgeLabel, toNodeLabel) { + this.dfsEdgeList.push(new DFSedge(fromNode, toNode, fromNodeLabel, edgeLabel, toNodeLabel)); + return this.dfsEdgeList; + }; + /** 根据 dfs 构建图 */ + + + DFScode.prototype.toGraph = function (graphId, directed) { + if (graphId === void 0) { + graphId = VACANT_GRAPH_ID; + } + + if (directed === void 0) { + directed = false; + } + + var graph = new Graph$c(graphId, true, directed); + this.dfsEdgeList.forEach(function (dfsEdge) { + var fromNodeId = dfsEdge.fromNode; + var toNodeId = dfsEdge.toNode; + var _a = dfsEdge.nodeEdgeNodeLabel, + nodeLabel1 = _a.nodeLabel1, + edgeLabel = _a.edgeLabel, + nodeLabel2 = _a.nodeLabel2; + if (nodeLabel1 !== VACANT_NODE_LABEL) graph.addNode(fromNodeId, nodeLabel1); + if (nodeLabel2 !== VACANT_NODE_LABEL) graph.addNode(toNodeId, nodeLabel2); + graph.addEdge(undefined, fromNodeId, toNodeId, edgeLabel); + }); + return graph; + }; // 建立 rightmost path + + + DFScode.prototype.buildRmpath = function () { + this.rmpath = []; + var oldFrom = undefined; + var selfLength = this.dfsEdgeList.length; + + for (var i = selfLength - 1; i >= 0; i--) { + var dfsEdge = this.dfsEdgeList[i]; + var fromNodeIdx = dfsEdge.fromNode; + var toNodeIdx = dfsEdge.toNode; + + if (fromNodeIdx < toNodeIdx && (oldFrom === undefined || toNodeIdx === oldFrom)) { + this.rmpath.push(i); + oldFrom = fromNodeIdx; + } + } + + return this.rmpath; + }; + + DFScode.prototype.getNodeNum = function () { + var nodeMap = {}; + this.dfsEdgeList.forEach(function (dfsEdge) { + if (!nodeMap[dfsEdge.fromNode]) nodeMap[dfsEdge.fromNode] = true; + if (!nodeMap[dfsEdge.toNode]) nodeMap[dfsEdge.toNode] = true; + }); + return Object.keys(nodeMap).length; + }; + + return DFScode; +}(); + +var History = function () { + function History(pdfs) { + this.his = {}; + this.nodesUsed = {}; + this.edgesUsed = {}; + this.edges = []; + if (!pdfs) return; + + while (pdfs) { + var e = pdfs.edge; + this.edges.push(e); + this.nodesUsed[e.from] = 1; + this.nodesUsed[e.to] = 1; + this.edgesUsed[e.id] = 1; + pdfs = pdfs.preNode; + } // 倒序 + + + this.edges = this.edges.reverse(); + } + + History.prototype.hasNode = function (node) { + return this.nodesUsed[node.id] === 1; + }; + + History.prototype.hasEdge = function (edge) { + return this.edgesUsed[edge.id] === 1; + }; + + return History; +}(); + +var GSpan = function () { + function GSpan(_a) { + var graphs = _a.graphs, + _b = _a.minSupport, + minSupport = _b === void 0 ? 2 : _b, + _c = _a.minNodeNum, + minNodeNum = _c === void 0 ? 1 : _c, + _d = _a.maxNodeNum, + maxNodeNum = _d === void 0 ? 4 : _d, + _e = _a.top, + top = _e === void 0 ? 10 : _e, + _f = _a.directed, + directed = _f === void 0 ? false : _f, + _g = _a.verbose, + verbose = _g === void 0 ? false : _g; // -------- 第零步，初始化------- + + this.graphs = graphs; + this.dfsCode = new DFScode(); + this.support = 0; + this.frequentSize1Subgraphs = []; + this.frequentSubgraphs = []; + this.minSupport = minSupport; + this.top = top; + this.directed = directed; + this.counter = 0; // TODO? timestamp = {} + + this.maxNodeNum = maxNodeNum; + this.minNodeNum = minNodeNum; + this.verbose = verbose; + if (this.maxNodeNum < this.minNodeNum) this.maxNodeNum = this.minNodeNum; + this.reportDF = []; // matrix + } // Line 352 + + + GSpan.prototype.findForwardRootEdges = function (graph, fromNode) { + var _this = this; + + var result = []; + var nodeMap = graph.nodeMap; + fromNode.edges.forEach(function (edge) { + if (_this.directed || fromNode.label <= nodeMap[edge.to].label) result.push(edge); + }); + return result; + }; + + GSpan.prototype.findBackwardEdge = function (graph, edge1, edge2, history) { + if (!this.directed && edge1 === edge2) return null; + var nodeMap = graph.nodeMap; + var edge2To = nodeMap[edge2.to]; + var edge2ToEdges = edge2To.edges; + var edgeLength = edge2ToEdges.length; + + for (var i = 0; i < edgeLength; i++) { + var edge = edge2ToEdges[i]; + if (history.hasEdge(edge) || edge.to !== edge1.from) continue; + + if (!this.directed) { + if (edge1.label < edge.label || edge1.label === edge.label && nodeMap[edge1.to].label <= nodeMap[edge2.to].label) { + return edge; + } + } else { + if (nodeMap[edge1.from].label < nodeMap[edge2.to].label || nodeMap[edge1.from].label === nodeMap[edge2.to].label && edge1.label <= edge.label) { + return edge; + } + } + } + + return null; + }; + + GSpan.prototype.findForwardPureEdges = function (graph, rightmostEdge, minNodeLabel, history) { + var result = []; + var rightmostEdgeToId = rightmostEdge.to; + var edges = graph.nodeMap[rightmostEdgeToId].edges; + var edgeLength = edges.length; + + for (var i = 0; i < edgeLength; i++) { + var edge = edges[i]; + var toNode = graph.nodeMap[edge.to]; + + if (minNodeLabel <= toNode.label && !history.hasNode(toNode)) { + result.push(edge); + } + } + + return result; + }; + + GSpan.prototype.findForwardRmpathEdges = function (graph, rightmostEdge, minNodeLabel, history) { + var result = []; + var nodeMap = graph.nodeMap; + var toNodeLabel = nodeMap[rightmostEdge.to].label; + var fromNode = nodeMap[rightmostEdge.from]; + var edges = fromNode.edges; + var edgeLength = edges.length; + + for (var i = 0; i < edgeLength; i++) { + var edge = edges[i]; + var newToNodeLabel = nodeMap[edge.to].label; + + if (rightmostEdge.to === edge.to || minNodeLabel > newToNodeLabel || history.hasNode(nodeMap[edge.to])) { + continue; + } + + if (rightmostEdge.label < edge.label || rightmostEdge.label === edge.label && toNodeLabel <= newToNodeLabel) { + result.push(edge); + } + } + + return result; + }; + + GSpan.prototype.getSupport = function (projected) { + var graphMap = {}; + projected.forEach(function (pro) { + if (!graphMap[pro.graphId]) graphMap[pro.graphId] = true; + }); + return Object.keys(graphMap).length; + }; + + GSpan.prototype.findMinLabel = function (obj) { + var minLabel = undefined; + Object.keys(obj).forEach(function (nodeEdgeNodeLabel) { + var _a = obj[nodeEdgeNodeLabel], + nodeLabel1 = _a.nodeLabel1, + edgeLabel = _a.edgeLabel, + nodeLabel2 = _a.nodeLabel2; + + if (!minLabel) { + minLabel = { + nodeLabel1: nodeLabel1, + edgeLabel: edgeLabel, + nodeLabel2: nodeLabel2 + }; + return; + } + + if (nodeLabel1 < minLabel.nodeLabel1 || nodeLabel1 === minLabel.nodeLabel1 && edgeLabel < minLabel.edgeLabel || nodeLabel1 === minLabel.nodeLabel1 && edgeLabel === minLabel.edgeLabel && nodeLabel2 < minLabel.nodeLabel2) { + minLabel = { + nodeLabel1: nodeLabel1, + edgeLabel: edgeLabel, + nodeLabel2: nodeLabel2 + }; + } + }); + return minLabel; + }; + + GSpan.prototype.isMin = function () { + var _this = this; + + var dfsCode = this.dfsCode; + if (this.verbose) console.log("isMin checking", dfsCode); + if (dfsCode.dfsEdgeList.length === 1) return true; + var directed = this.directed; + var graph = dfsCode.toGraph(VACANT_GRAPH_ID, directed); + var nodeMap = graph.nodeMap; + var dfsCodeMin = new DFScode(); + var root = {}; + graph.nodes.forEach(function (node) { + var forwardEdges = _this.findForwardRootEdges(graph, node); + + forwardEdges.forEach(function (edge) { + var otherNode = nodeMap[edge.to]; + var nodeEdgeNodeLabel = node.label + "-" + edge.label + "-" + otherNode.label; + if (!root[nodeEdgeNodeLabel]) root[nodeEdgeNodeLabel] = { + projected: [], + nodeLabel1: node.label, + edgeLabel: edge.label, + nodeLabel2: otherNode.label + }; + var pdfs = { + graphId: graph.id, + edge: edge, + preNode: null + }; + root[nodeEdgeNodeLabel].projected.push(pdfs); + }); + }); // 比较 root 中每一项的 nodeEdgeNodeLabel 大小，按照 nodeLabel1、edgeLabe、nodeLabel2 的顺序比较 + + var minLabel = this.findMinLabel(root); // line 419 + + dfsCodeMin.dfsEdgeList.push(new DFSedge(0, 1, minLabel.nodeLabel1, minLabel.edgeLabel, minLabel.nodeLabel2)); // line 423 + + var projectIsMin = function projectIsMin(projected) { + // right most path + var rmpath = dfsCodeMin.buildRmpath(); + var minNodeLabel = dfsCodeMin.dfsEdgeList[0].nodeEdgeNodeLabel.nodeLabel1; + var maxToC = dfsCodeMin.dfsEdgeList[rmpath[0]].toNode; // node id + + var backwardRoot = {}; + var flag = false, + newTo = 0; + var end = directed ? -1 : 0; // 遍历到 1 还是到 0 + + var _loop_1 = function _loop_1(i) { + if (flag) return "break"; // line 435 + + projected.forEach(function (p) { + var history = new History(p); + + var backwardEdge = _this.findBackwardEdge(graph, history.edges[rmpath[i]], history.edges[rmpath[0]], history); + + if (backwardEdge) { + // Line 441 + if (!backwardRoot[backwardEdge.label]) { + backwardRoot[backwardEdge.label] = { + projected: [], + edgeLabel: backwardEdge.label + }; + } + + backwardRoot[backwardEdge.label].projected.push({ + graphId: graph.id, + edge: backwardRoot, + preNode: p + }); + newTo = dfsCodeMin.dfsEdgeList[rmpath[i]].fromNode; + flag = true; + } + }); + }; + + for (var i = rmpath.length - 1; i > end; i--) { + var state_1 = _loop_1(i); + + if (state_1 === "break") break; + } + + if (flag) { + var minBackwardEdgeLabel = _this.findMinLabel(backwardRoot); + + dfsCodeMin.dfsEdgeList.push(new DFSedge(maxToC, newTo, VACANT_NODE_LABEL, minBackwardEdgeLabel.edgeLabel, VACANT_NODE_LABEL)); + var idx_1 = dfsCodeMin.dfsEdgeList.length - 1; + if (_this.dfsCode.dfsEdgeList[idx_1] !== dfsCodeMin.dfsEdgeList[idx_1]) return false; + return projectIsMin(backwardRoot[minBackwardEdgeLabel.edgeLabel].projected); + } + + var forwardRoot = {}; + flag = false; + var newFrom = 0; + projected.forEach(function (p) { + var history = new History(p); + + var forwardPureEdges = _this.findForwardPureEdges(graph, history.edges[rmpath[0]], minNodeLabel, history); + + if (forwardPureEdges.length > 0) { + flag = true; + newFrom = maxToC; + forwardPureEdges.forEach(function (edge) { + var key = edge.label + "-" + nodeMap[edge.to].label; + if (!forwardRoot[key]) forwardRoot[key] = { + projected: [], + edgeLabel: edge.label, + nodeLabel2: nodeMap[edge.to].label + }; + forwardRoot[key].projected.push({ + graphId: graph.id, + edge: edge, + preNode: p + }); + }); + } + }); + var pathLength = rmpath.length; + + var _loop_2 = function _loop_2(i) { + if (flag) return "break"; + var value = rmpath[i]; + projected.forEach(function (p) { + var history = new History(p); + + var forwardRmpathEdges = _this.findForwardRmpathEdges(graph, history.edges[value], minNodeLabel, history); + + if (forwardRmpathEdges.length > 0) { + flag = true; + newFrom = dfsCodeMin.dfsEdgeList[value].fromNode; + forwardRmpathEdges.forEach(function (edge) { + var key = edge.label + "-" + nodeMap[edge.to].label; + if (!forwardRoot[key]) forwardRoot[key] = { + projected: [], + edgeLabel: edge.label, + nodeLabel2: nodeMap[edge.to].label + }; + forwardRoot[key].projected.push({ + graphId: graph.id, + edge: edge, + preNode: p + }); + }); + } + }); + }; + + for (var i = 0; i < pathLength; i++) { + var state_2 = _loop_2(i); + + if (state_2 === "break") break; + } + + if (!flag) return true; + + var forwardMinEdgeNodeLabel = _this.findMinLabel(forwardRoot); + + dfsCodeMin.dfsEdgeList.push(new DFSedge(newFrom, maxToC + 1, VACANT_NODE_LABEL, forwardMinEdgeNodeLabel.edgeLabel, forwardMinEdgeNodeLabel.nodeLabel2)); + var idx = dfsCodeMin.dfsEdgeList.length - 1; + if (dfsCode.dfsEdgeList[idx] !== dfsCodeMin.dfsEdgeList[idx]) return false; + return projectIsMin(forwardRoot[forwardMinEdgeNodeLabel.edgeLabel + "-" + forwardMinEdgeNodeLabel.nodeLabel2].projected); + }; + + var key = minLabel.nodeLabel1 + "-" + minLabel.edgeLabel + "-" + minLabel.nodeLabel2; + return projectIsMin(root[key].projected); + }; + + GSpan.prototype.report = function () { + if (this.dfsCode.getNodeNum() < this.minNodeNum) return; + this.counter++; + var graph = this.dfsCode.toGraph(this.counter, this.directed); + this.frequentSubgraphs.push(clone$7(graph)); + }; + + GSpan.prototype.subGraphMining = function (projected) { + var _this = this; + + var support = this.getSupport(projected); + if (support < this.minSupport) return; + if (!this.isMin()) return; + this.report(); + var nodeNum = this.dfsCode.getNodeNum(); + var rmpath = this.dfsCode.buildRmpath(); + var maxToC = this.dfsCode.dfsEdgeList[rmpath[0]].toNode; + var minNodeLabel = this.dfsCode.dfsEdgeList[0].nodeEdgeNodeLabel.nodeLabel1; + var forwardRoot = {}; + var backwardRoot = {}; + projected.forEach(function (p) { + var graph = _this.graphs[p.graphId]; + var nodeMap = graph.nodeMap; + var history = new History(p); // backward Line 526 + + for (var i = rmpath.length - 1; i >= 0; i--) { + var backwardEdge = _this.findBackwardEdge(graph, history.edges[rmpath[i]], history.edges[rmpath[0]], history); + + if (backwardEdge) { + var key = _this.dfsCode.dfsEdgeList[rmpath[i]].fromNode + "-" + backwardEdge.label; + if (!backwardRoot[key]) backwardRoot[key] = { + projected: [], + toNodeId: _this.dfsCode.dfsEdgeList[rmpath[i]].fromNode, + edgeLabel: backwardEdge.label + }; + backwardRoot[key].projected.push({ + graphId: p.graphId, + edge: backwardEdge, + preNode: p + }); + } + } // pure forward + + + if (nodeNum >= _this.maxNodeNum) return; + + var forwardPureEdges = _this.findForwardPureEdges(graph, history.edges[rmpath[0]], minNodeLabel, history); + + forwardPureEdges.forEach(function (edge) { + var key = maxToC + "-" + edge.label + "-" + nodeMap[edge.to].label; + if (!forwardRoot[key]) forwardRoot[key] = { + projected: [], + fromNodeId: maxToC, + edgeLabel: edge.label, + nodeLabel2: nodeMap[edge.to].label + }; + forwardRoot[key].projected.push({ + graphId: p.graphId, + edge: edge, + preNode: p + }); + }); + + var _loop_3 = function _loop_3(i) { + var forwardRmpathEdges = _this.findForwardRmpathEdges(graph, history.edges[rmpath[i]], minNodeLabel, history); + + forwardRmpathEdges.forEach(function (edge) { + var key = _this.dfsCode.dfsEdgeList[rmpath[i]].fromNode + "-" + edge.label + "-" + nodeMap[edge.to].label; + if (!forwardRoot[key]) forwardRoot[key] = { + projected: [], + fromNodeId: _this.dfsCode.dfsEdgeList[rmpath[i]].fromNode, + edgeLabel: edge.label, + nodeLabel2: nodeMap[edge.to].label + }; + forwardRoot[key].projected.push({ + graphId: p.graphId, + edge: edge, + preNode: p + }); + }); + }; // rmpath forward + + + for (var i = 0; i < rmpath.length; i++) { + _loop_3(i); + } + }); // backward + + Object.keys(backwardRoot).forEach(function (key) { + var _a = backwardRoot[key], + toNodeId = _a.toNodeId, + edgeLabel = _a.edgeLabel; + + _this.dfsCode.dfsEdgeList.push(new DFSedge(maxToC, toNodeId, "-1", edgeLabel, "-1")); + + _this.subGraphMining(backwardRoot[key].projected); + + _this.dfsCode.dfsEdgeList.pop(); + }); // forward + + Object.keys(forwardRoot).forEach(function (key) { + var _a = forwardRoot[key], + fromNodeId = _a.fromNodeId, + edgeLabel = _a.edgeLabel, + nodeLabel2 = _a.nodeLabel2; + + _this.dfsCode.dfsEdgeList.push(new DFSedge(fromNodeId, maxToC + 1, VACANT_NODE_LABEL, edgeLabel, nodeLabel2)); + + _this.subGraphMining(forwardRoot[key].projected); + + _this.dfsCode.dfsEdgeList.pop(); + }); + }; + + GSpan.prototype.generate1EdgeFrequentSubGraphs = function () { + var graphs = this.graphs; + var directed = this.directed; + var minSupport = this.minSupport; + var frequentSize1Subgraphs = this.frequentSize1Subgraphs; + var nodeLabelCounter = {}, + nodeEdgeNodeCounter = {}; // 保存各个图和各自节点的关系 map，key 格式为 graphKey-node类型 + + var nodeLableCounted = {}; // 保存各个图和各自边的关系 map，key 格式为 graphKey-fromNode类型-edge类型-toNode类型 + + var nodeEdgeNodeLabelCounted = {}; + Object.keys(graphs).forEach(function (key) { + // Line 271 + var graph = graphs[key]; + var nodeMap = graph.nodeMap; // 遍历节点，记录对应图 与 每个节点的 label 到 nodeLableCounted + + graph.nodes.forEach(function (node, i) { + // Line 272 + var nodeLabel = node.label; + var graphNodeKey = key + "-" + nodeLabel; + + if (!nodeLableCounted[graphNodeKey]) { + var counter = nodeLabelCounter[nodeLabel] || 0; + counter++; + nodeLabelCounter[nodeLabel] = counter; + } + + nodeLableCounted[graphNodeKey] = { + graphKey: key, + label: nodeLabel + }; // 遍历该节点的所有边，记录各个图和各自边的关系到 nodeEdgeNodeLabelCounted. Line 276 + + node.edges.forEach(function (edge) { + var nodeLabel1 = nodeLabel; + var nodeLabel2 = nodeMap[edge.to].label; + + if (!directed && nodeLabel1 > nodeLabel2) { + var tmp = nodeLabel2; + nodeLabel2 = nodeLabel1; + nodeLabel1 = tmp; + } + + var edgeLabel = edge.label; + var graphNodeEdgeNodeKey = key + "-" + nodeLabel1 + "-" + edgeLabel + "-" + nodeLabel2; + var nodeEdgeNodeKey = nodeLabel1 + "-" + edgeLabel + "-" + nodeLabel2; + + if (!nodeEdgeNodeCounter[nodeEdgeNodeKey]) { + var counter = nodeEdgeNodeCounter[nodeEdgeNodeKey] || 0; + counter++; + nodeEdgeNodeCounter[nodeEdgeNodeKey] = counter; // Line281 + } + + nodeEdgeNodeLabelCounted[graphNodeEdgeNodeKey] = { + graphId: key, + nodeLabel1: nodeLabel1, + edgeLabel: edgeLabel, + nodeLabel2: nodeLabel2 + }; + }); + }); + }); // 计算频繁的节点 + + Object.keys(nodeLabelCounter).forEach(function (label) { + var count = nodeLabelCounter[label]; + if (count < minSupport) return; + var g = { + nodes: [], + edges: [] + }; + g.nodes.push({ + id: "0", + label: label + }); + frequentSize1Subgraphs.push(g); // if (minNodeNum <= 1) reportSize1 TODO + }); + return frequentSize1Subgraphs; + }; + + GSpan.prototype.run = function () { + var _this = this; // -------- 第一步, _generate_1edge_frequent_subgraphs：频繁的单个节点------- + + + this.frequentSize1Subgraphs = this.generate1EdgeFrequentSubGraphs(); + if (this.maxNodeNum < 2) return; + var graphs = this.graphs; + this.directed; // PDFS 数组的 map Line 304 + + var root = {}; + Object.keys(graphs).forEach(function (graphId) { + var graph = graphs[graphId]; + var nodeMap = graph.nodeMap; // Line 306 + + graph.nodes.forEach(function (node) { + var forwardRootEdges = _this.findForwardRootEdges(graph, node); // Line 308 + + + forwardRootEdges.forEach(function (edge) { + var toNode = nodeMap[edge.to]; + var nodeEdgeNodeLabel = node.label + "-" + edge.label + "-" + toNode.label; + if (!root[nodeEdgeNodeLabel]) root[nodeEdgeNodeLabel] = { + projected: [], + nodeLabel1: node.label, + edgeLabel: edge.label, + nodeLabel2: toNode.label + }; + var pdfs = { + graphId: graphId, + edge: edge, + preNode: null + }; + root[nodeEdgeNodeLabel].projected.push(pdfs); + }); + }); + }); // Line 313 + + Object.keys(root).forEach(function (nodeEdgeNodeLabel) { + var _a = root[nodeEdgeNodeLabel], + projected = _a.projected, + nodeLabel1 = _a.nodeLabel1, + edgeLabel = _a.edgeLabel, + nodeLabel2 = _a.nodeLabel2; + + _this.dfsCode.dfsEdgeList.push(new DFSedge(0, 1, nodeLabel1, edgeLabel, nodeLabel2)); + + _this.subGraphMining(projected); + + _this.dfsCode.dfsEdgeList.pop(); + }); + }; + + return GSpan; +}(); + +var formatGraphs = function formatGraphs(graphs, directed, nodeLabelProp, edgeLabelProp) { + var result = {}; + Object.keys(graphs).forEach(function (key, i) { + var graph = graphs[key]; + var fGraph = new Graph$c(i, true, directed); + var nodeIdxMap = {}; + graph.nodes.forEach(function (node, j) { + fGraph.addNode(j, node[nodeLabelProp]); + nodeIdxMap[node.id] = j; + }); + graph.edges.forEach(function (edge, k) { + var sourceIdx = nodeIdxMap[edge.source]; + var targetIdx = nodeIdxMap[edge.target]; + fGraph.addEdge(-1, sourceIdx, targetIdx, edge[edgeLabelProp]); + }); + if (fGraph && fGraph.getNodeNum()) result[fGraph.id] = fGraph; + }); + return result; +}; + +var toGraphDatas = function toGraphDatas(graphs, nodeLabelProp, edgeLabelProp) { + var result = []; + graphs.forEach(function (graph) { + var graphData = { + nodes: [], + edges: [] + }; + graph.nodes.forEach(function (node) { + var _a; + + graphData.nodes.push((_a = { + id: "" + node.id + }, _a[nodeLabelProp] = node.label, _a)); + }); + graph.edges.forEach(function (edge) { + var _a; + + graphData.edges.push((_a = { + source: "" + edge.from, + target: "" + edge.to + }, _a[edgeLabelProp] = edge.label, _a)); + }); + result.push(graphData); + }); + return result; +}; + +var DEFAULT_LABEL_NAME = "cluster"; +/** + * gSpan 频繁子图计算算法（frequent graph mining） + * @param params 参数 + */ + +var gSpan = function gSpan(params) { + // ------- 将图数据 GraphData 的 map 转换为格式 ------- + var graphs = params.graphs, + _a = params.directed, + directed = _a === void 0 ? false : _a, + _b = params.nodeLabelProp, + nodeLabelProp = _b === void 0 ? DEFAULT_LABEL_NAME : _b, + _c = params.edgeLabelProp, + edgeLabelProp = _c === void 0 ? DEFAULT_LABEL_NAME : _c; + var formattedGraphs = formatGraphs(graphs, directed, nodeLabelProp, edgeLabelProp); + var minSupport = params.minSupport, + maxNodeNum = params.maxNodeNum, + minNodeNum = params.minNodeNum, + verbose = params.verbose, + top = params.top; // ------- 初始化与执行算法 ------- + + var algoParams = { + graphs: formattedGraphs, + minSupport: minSupport, + maxNodeNum: maxNodeNum, + minNodeNum: minNodeNum, + top: top, + verbose: verbose, + directed: directed + }; + var calculator = new GSpan(algoParams); + calculator.run(); + var result = toGraphDatas(calculator.frequentSubgraphs, nodeLabelProp, edgeLabelProp); + return result; +}; + +/** + * 为 graphData 中每个节点生成邻居单元数组 + * @param graphData + * @param spm + * @param nodeLabelProp + * @param k k-近邻 + */ + +var findKNeighborUnits = function findKNeighborUnits(graphData, spm, nodeLabelProp, k) { + if (nodeLabelProp === void 0) { + nodeLabelProp = 'cluster'; + } + + if (k === void 0) { + k = 2; + } + + var units = []; + var nodes = graphData.nodes; + spm.forEach(function (row, i) { + units.push(findKNeighborUnit(nodes, row, i, nodeLabelProp, k)); + }); + return units; +}; + +var findKNeighborUnit = function findKNeighborUnit(nodes, row, i, nodeLabelProp, k) { + var unitNodeIdxs = [i]; + var neighbors = []; + var labelCountMap = {}; + row.forEach(function (v, j) { + if (v <= k && i !== j) { + unitNodeIdxs.push(j); + neighbors.push(nodes[j]); + var label = nodes[j][nodeLabelProp]; + if (!labelCountMap[label]) labelCountMap[label] = { + count: 1, + dists: [v] + };else { + labelCountMap[label].count++; + labelCountMap[label].dists.push(v); + } + } + }); // 将 labelCountMap 中的 dists 按照从小到大排序，方便后面使用 + + Object.keys(labelCountMap).forEach(function (label) { + labelCountMap[label].dists = labelCountMap[label].dists.sort(function (a, b) { + return a - b; + }); + }); + return { + nodeIdx: i, + nodeId: nodes[i].id, + nodeIdxs: unitNodeIdxs, + neighbors: neighbors, + neighborNum: unitNodeIdxs.length - 1, + nodeLabelCountMap: labelCountMap + }; +}; +/** + * 随机寻找点对，满足距离小于 k + * @param k 参数 k，表示 k-近邻 + * @param nodeNum 参数 length + * @param maxNodePairNum 寻找点对的数量不超过 maxNodePairNum + * @param spm 最短路径矩阵 + */ + + +var findNodePairsRandomly = function findNodePairsRandomly(k, nodeNum, maxNodePairNum, kNeighborUnits, spm) { + // 每个节点需要随机找出的点对数 + var nodePairNumEachNode = Math.ceil(maxNodePairNum / nodeNum); + var nodePairMap = {}; + var foundNodePairCount = 0; // 遍历节点，为每个节点随机找出 nodePairNumEachNode 个点对，满足距离小于 k。找到的点对数量超过 maxNodePairNum 或所有节点遍历结束时终止 + + kNeighborUnits.forEach(function (unit, i) { + // 若未达到 nodePairNumEachNode，或循环次数小于最大循环次数(2 * nodeNum)，继续循环 + var nodePairForICount = 0; + var outerLoopCount = 0; + var neighbors = unit.nodeIdxs; // the first one is the center node + + var neighborNum = unit.neighborNum - 1; + + while (nodePairForICount < nodePairNumEachNode) { + // 另一端节点在节点数组中的的 index + var oidx = neighbors[1 + Math.floor(Math.random() * neighborNum)]; + var innerLoopCount = 0; // 若随机得到的另一端 idx 不符合条件，则继续 random。条件是不是同一个节点、这个点对没有被记录过、距离小于 k + + while (nodePairMap[i + "-" + oidx] || nodePairMap[oidx + "-" + i]) { + oidx = Math.floor(Math.random() * nodeNum); + innerLoopCount++; + if (innerLoopCount > 2 * nodeNum) break; // 循环次数大于最大循环次数(2 * nodeNum)跳出循环，避免死循环 + } + + if (innerLoopCount < 2 * nodeNum) { + // 未达到最大循环次数，说明找到了合适的另一端 + nodePairMap[i + "-" + oidx] = { + start: i, + end: oidx, + distance: spm[i][oidx] + }; + nodePairForICount++; + foundNodePairCount++; // 如果当前找到的点对数量达到了上限，返回结果 + + if (foundNodePairCount >= maxNodePairNum) return nodePairMap; + } + + outerLoopCount++; + if (outerLoopCount > 2 * nodeNum) break; // 循环次数大于最大循环次数(2 * nodeNum)跳出循环，避免死循环 + } // 这个节点没有找到足够 nodePairNumEachNode 的点对。更新 nodePairNumEachNode，让后续节点找更多的点对 + + + if (nodePairForICount < nodePairNumEachNode) { + var gap = nodePairNumEachNode - nodePairForICount; + nodePairNumEachNode = (nodePairNumEachNode + gap) / (nodeNum - i - 1); + } + }); + return nodePairMap; +}; +/** + * 计算所有 nodePairMap 中节点对的相交邻居诱导子图 + * @param nodePairMap 节点对 map，key 为 node1.id-node2.id，value 为 { startNodeIdx, endNodeIdx, distance } + * @param neighborUnits 每个节点的邻居元数组 + * @param graphData 原图数据 + * @param edgeMap 边的 map，方便检索 + * @param cachedInducedGraphMap 缓存的结果，下次进入该函数将继续更新该缓存，若 key 在缓存中存在则不需要重复计算 + */ + + +var getIntersectNeighborInducedGraph = function getIntersectNeighborInducedGraph(nodePairMap, neighborUnits, graphData, cachedInducedGraphMap) { + var nodes = graphData.nodes; + if (!cachedInducedGraphMap) cachedInducedGraphMap = {}; + Object.keys(nodePairMap).forEach(function (key) { + var _a, _b; + + if (cachedInducedGraphMap && cachedInducedGraphMap[key]) return; + cachedInducedGraphMap[key] = { + nodes: [], + edges: [] + }; + var pair = nodePairMap[key]; + var startUnitNodeIds = (_a = neighborUnits[pair.start]) === null || _a === void 0 ? void 0 : _a.nodeIdxs; + var endUnitNodeIds = (_b = neighborUnits[pair.end]) === null || _b === void 0 ? void 0 : _b.nodeIdxs; + if (!startUnitNodeIds || !endUnitNodeIds) return; // 不存在邻元，返回空图 + + var endSet = new Set(endUnitNodeIds); + var intersect = startUnitNodeIds.filter(function (x) { + return endSet.has(x); + }); // 可能会爆栈（在 1580 + 6 nodes full-connected 时出现） + + if (!intersect || !intersect.length) return; // 没有交集，返回空图 + + var intersectIdMap = {}; + var intersectLength = intersect.length; + + for (var i = 0; i < intersectLength; i++) { + var node = nodes[intersect[i]]; + cachedInducedGraphMap[key].nodes.push(node); // 将交集中的点加入诱导子图 + + intersectIdMap[node.id] = true; + } // 遍历所有边数据，如果边的两端都在交集中，将该边加入诱导子图 + + + graphData.edges.forEach(function (edge) { + if (intersectIdMap[edge.source] && intersectIdMap[edge.target]) cachedInducedGraphMap[key].edges.push(edge); + }); + }); + return cachedInducedGraphMap; +}; +/** + * 计算 strcutre 在 graph 上的匹配数量 + * @param graph 图数据 + * @param structure 目前支持只有两个节点一条边的最简单结构 + * @param nodeLabelProp 节点类型字段名 + * @param edgeLabelProp 边类型字段名 + */ + + +var getMatchedCount = function getMatchedCount(graph, structure, nodeLabelProp, edgeLabelProp) { + var nodeMap = {}; + graph.nodes.forEach(function (node) { + nodeMap[node.id] = node; + }); + var count = 0; + graph.edges.forEach(function (e) { + var sourceLabel = nodeMap[e.source][nodeLabelProp]; + var targetLabel = nodeMap[e.target][nodeLabelProp]; + var strNodeLabel1 = structure === null || structure === void 0 ? void 0 : structure.nodes[0][nodeLabelProp]; + var strNodeLabel2 = structure === null || structure === void 0 ? void 0 : structure.nodes[1][nodeLabelProp]; + var strEdgeLabel = structure === null || structure === void 0 ? void 0 : structure.edges[0][edgeLabelProp]; + if (e[edgeLabelProp] !== strEdgeLabel) return; + + if (sourceLabel === strNodeLabel1 && targetLabel === strNodeLabel2 || sourceLabel === strNodeLabel2 && targetLabel === strNodeLabel1) { + count++; + } + }); + return count; +}; +/** + * structures 中寻找最具有代表性的一个。这个结构是使得 matchedCountMap 的分组方式类内间距最小，类间间距最大 + * @param matchedCountMap 每个 structure 分类后的各图匹配数量，格式 { [strcture.idx]: { [interInducedGraphKey]: count } } + * @param structureNum strcuture 个数，与 matchedCountMap.length 对应 + * @param structures + */ + + +var findRepresentStructure = function findRepresentStructure(matchedCountMap, structureNum, structures) { + var maxOffset = Infinity, + representClusterType = 0; + + var _loop_1 = function _loop_1(i) { + // 一种分组的 map，key 是 intGraph 的 key，value 是 structures[i] 的匹配个数 + var countMapI = matchedCountMap[i]; // 按照 value 为该组排序，生成 keys 的数组： + + var sortedGraphKeys = Object.keys(countMapI).sort(function (a, b) { + return countMapI[a] - countMapI[b]; + }); // 共 100 个 graphKeys，将 graphKeys 按顺序分为 groupNum 组 + + var groupNum = 10; + var clusters = []; // 总共有 groupNum 个项 + + sortedGraphKeys.forEach(function (key, j) { + if (!clusters[j % groupNum]) clusters[j % groupNum] = { + graphs: [], + totalCount: 0, + aveCount: 0 + }; + clusters[j % groupNum].graphs.push(key); + clusters[j % groupNum].totalCount += countMapI[key]; + }); // 计算 cluster 与 cluster 之间的距离 innerDist，每个 cluster 内部的距离 intraDist + + var aveIntraDist = 0; // 该类的类内平均值 + + var aveCounts = []; // 类内平均匹配数量，将用于计算类间距离 + + clusters.forEach(function (graphsInCluster) { + // 类内均值 + var aveCount = graphsInCluster.totalCount / graphsInCluster.graphs.length; + graphsInCluster.aveCount = aveCount; + aveCounts.push(aveCount); // 对于每类，计算类内间距平均值 + + var aveIntraPerCluster = 0; + var graphsNum = graphsInCluster.length; + graphsInCluster.graphs.forEach(function (graphKey1, j) { + var graph1Count = countMapI[graphKey1]; + graphsInCluster.graphs.forEach(function (graphKey2, k) { + if (j === k) return; + aveIntraPerCluster += Math.abs(graph1Count - countMapI[graphKey2]); + }); + }); + aveIntraPerCluster /= graphsNum * (graphsNum - 1) / 2; + aveIntraDist += aveIntraPerCluster; + }); + aveIntraDist /= clusters.length; // 用类内均值计算类间距 + + var aveInterDist = 0; // 类间间距平均值 + + aveCounts.forEach(function (aveCount1, j) { + aveCounts.forEach(function (aveCount2, k) { + if (j === k) return; + aveInterDist += Math.abs(aveCount1 - aveCount2); + }); + aveInterDist /= aveCounts.length * (aveCounts.length - 1) / 2; + }); // 寻找 (类间间距均值-类内间距均值) 最大的一种分组方式（对应的 structure 就是最终要找的唯一 DS(G)） + + var offset = aveInterDist - aveIntraDist; + + if (maxOffset < offset) { + maxOffset = offset; + representClusterType = i; + } + }; + + for (var i = 0; i < structureNum; i++) { + _loop_1(i); + } + + return { + structure: structures[representClusterType], + structureCountMap: matchedCountMap[representClusterType] + }; +}; + +var getNodeMaps = function getNodeMaps(nodes, nodeLabelProp) { + var nodeMap = {}, + nodeLabelMap = {}; + nodes.forEach(function (node, i) { + nodeMap[node.id] = { + idx: i, + node: node, + degree: 0, + inDegree: 0, + outDegree: 0 + }; + var label = node[nodeLabelProp]; + if (!nodeLabelMap[label]) nodeLabelMap[label] = []; + nodeLabelMap[label].push(node); + }); + return { + nodeMap: nodeMap, + nodeLabelMap: nodeLabelMap + }; +}; + +var getEdgeMaps = function getEdgeMaps(edges, edgeLabelProp, nodeMap) { + var edgeMap = {}, + edgeLabelMap = {}; + edges.forEach(function (edge, i) { + edgeMap["" + uniqueId$2] = { + idx: i, + edge: edge + }; + var label = edge[edgeLabelProp]; + if (!edgeLabelMap[label]) edgeLabelMap[label] = []; + edgeLabelMap[label].push(edge); + var sourceNode = nodeMap[edge.source]; + + if (sourceNode) { + sourceNode.degree++; + sourceNode.outDegree++; + } + + var targetNode = nodeMap[edge.target]; + + if (targetNode) { + targetNode.degree++; + targetNode.inDegree++; + } + }); + return { + edgeMap: edgeMap, + edgeLabelMap: edgeLabelMap + }; +}; +/** + * 输出最短路径的 map，key 为 sourceNode.id-targetNode.id，value 为这两个节点的最短路径长度 + * @param nodes + * @param spm + * @param directed + */ + + +var getSpmMap = function getSpmMap(nodes, spm, directed) { + var length = spm.length; + var map = {}; + spm.forEach(function (row, i) { + var start = directed ? 0 : i + 1; + var iId = nodes[i].id; + + for (var j = start; j < length; j++) { + if (i === j) continue; + var jId = nodes[j].id; + var dist = row[j]; + map[iId + "-" + jId] = dist; + if (!directed) map[jId + "-" + iId] = dist; + } + }); + return map; +}; +/** + * 计算一对节点（node1，node2）的 NDS 距离 + * @param graph 原图数据 + * @param node1 + * @param node2 + */ + + +var getNDSDist = function getNDSDist(graph, node1, node2, nodeMap, spDist, kNeighborUnits, structure, nodeLabelProp, edgeLabelProp, cachedNDSMap, cachedInterInducedGraph) { + var _a; + + var key = node1.id + "-" + node2.id; + if (cachedNDSMap && cachedNDSMap[key]) return cachedNDSMap[key]; + var interInducedGraph = cachedInterInducedGraph ? cachedInterInducedGraph[key] : undefined; // 若没有缓存相交邻居诱导子图，计算 + + if (!interInducedGraph) { + var pairMap = (_a = {}, _a[key] = { + start: nodeMap[node1.id].idx, + end: nodeMap[node2.id].idx, + distance: spDist + }, _a); + cachedInterInducedGraph = getIntersectNeighborInducedGraph(pairMap, kNeighborUnits, graph, cachedInterInducedGraph); + interInducedGraph = cachedInterInducedGraph[key]; + } + + return getMatchedCount(interInducedGraph, structure, nodeLabelProp, edgeLabelProp); +}; +/** + * 计算 pattern 上绩点的度数并存储到 minPatternNodeLabelDegreeMap + */ + + +var stashPatternNodeLabelDegreeMap = function stashPatternNodeLabelDegreeMap(minPatternNodeLabelDegreeMap, neighborLabel, patternNodeMap, patternNodeLabelMap) { + var _a, _b, _c; + + var minPatternNodeLabelDegree = (_a = minPatternNodeLabelDegreeMap[neighborLabel]) === null || _a === void 0 ? void 0 : _a.degree; + var minPatternNodeLabelInDegree = (_b = minPatternNodeLabelDegreeMap[neighborLabel]) === null || _b === void 0 ? void 0 : _b.inDegree; + var minPatternNodeLabelOutDegree = (_c = minPatternNodeLabelDegreeMap[neighborLabel]) === null || _c === void 0 ? void 0 : _c.outDegree; + + if (minPatternNodeLabelDegreeMap[neighborLabel] === undefined) { + minPatternNodeLabelDegree = Infinity; + minPatternNodeLabelInDegree = Infinity; + minPatternNodeLabelOutDegree = Infinity; + patternNodeLabelMap[neighborLabel].forEach(function (patternNodeWithLabel) { + var patternNodeDegree = patternNodeMap[patternNodeWithLabel.id].degree; + if (minPatternNodeLabelDegree > patternNodeDegree) minPatternNodeLabelDegree = patternNodeDegree; + var patternNodeInDegree = patternNodeMap[patternNodeWithLabel.id].inDegree; + if (minPatternNodeLabelInDegree > patternNodeInDegree) minPatternNodeLabelInDegree = patternNodeInDegree; + var patternNodeOutDegree = patternNodeMap[patternNodeWithLabel.id].outDegree; + if (minPatternNodeLabelOutDegree > patternNodeOutDegree) minPatternNodeLabelOutDegree = patternNodeOutDegree; + }); + minPatternNodeLabelDegreeMap[neighborLabel] = { + degree: minPatternNodeLabelDegree, + inDegree: minPatternNodeLabelInDegree, + outDegree: minPatternNodeLabelOutDegree + }; + } + + return { + minPatternNodeLabelDegree: minPatternNodeLabelDegree, + minPatternNodeLabelInDegree: minPatternNodeLabelInDegree, + minPatternNodeLabelOutDegree: minPatternNodeLabelOutDegree + }; +}; +/** + * GADDI 模式匹配 + * @param graphData 原图数据 + * @param pattern 搜索图（需要在原图上搜索的模式）数据 + * @param directed 是否计算有向图，默认 false + * @param k 参数 k，表示 k-近邻 + * @param length 参数 length + * @param nodeLabelProp 节点数据中代表节点标签（分类信息）的属性名。默认为 cluster + * @param edgeLabelProp 边数据中代表边标签（分类信息）的属性名。默认为 cluster + */ + + +var GADDI = function GADDI(graphData, pattern, directed, k, length, nodeLabelProp, edgeLabelProp) { + if (directed === void 0) { + directed = false; + } + + if (nodeLabelProp === void 0) { + nodeLabelProp = 'cluster'; + } + + if (edgeLabelProp === void 0) { + edgeLabelProp = 'cluster'; + } + + if (!graphData || !graphData.nodes) return; // 分为三步： + // 0. 预计算：节点/边数，邻接矩阵、最短路径矩阵 + // 1. 处理原图 graphData。再分为 1~5 小步 + // 2. 匹配 + // console.log("----- stage-pre: preprocessing -------"); + // -------- 第零步，预计算：节点/边数，邻接矩阵、最短路径矩阵------- + + var nodeNum = graphData.nodes.length; + if (!nodeNum) return; // console.log("----- stage-pre.1: calc shortest path matrix for graph -------"); + + var spm = floydWarshall$3(graphData, directed); // console.log( + // "----- stage-pre.2: calc shortest path matrix for pattern -------" + // ); + + var patternSpm = floydWarshall$3(pattern, directed); // console.log( + // "----- stage-pre.3: calc shortest path matrix map for graph -------" + // ); + + var spmMap = getSpmMap(graphData.nodes, spm, directed); // console.log( + // "----- stage-pre.4: calc shortest path matrix map for pattern -------" + // ); + + var patternSpmMap = getSpmMap(pattern.nodes, patternSpm, directed); // console.log("----- stage-pre.5: establish maps -------"); + // 节点的 map，以 id 为 id 映射，方便后续快速检索 + + var _a = getNodeMaps(graphData.nodes, nodeLabelProp), + nodeMap = _a.nodeMap, + nodeLabelMap = _a.nodeLabelMap; + + var _b = getNodeMaps(pattern.nodes, nodeLabelProp), + patternNodeMap = _b.nodeMap, + patternNodeLabelMap = _b.nodeLabelMap; // 计算节点度数 + + + getEdgeMaps(graphData.edges, edgeLabelProp, nodeMap); + var patternEdgeLabelMap = getEdgeMaps(pattern.edges, edgeLabelProp, patternNodeMap).edgeLabelMap; // 若未指定 length，自动计算 pattern 半径（最短路径最大值） + + if (!length) length = Math.max.apply(Math, __spreadArray$3(__spreadArray$3([], patternSpm[0]), [2])); + if (!k) k = length; // console.log("params", directed, length, k); + // console.log("----- stage-pre.6: calc k neighbor units -------"); + // 计算每个节点的 k 邻元集合 + + var kNeighborUnits = findKNeighborUnits(graphData, spm, nodeLabelProp, k); + var patternKNeighborUnits = findKNeighborUnits(pattern, patternSpm, nodeLabelProp, k); // console.log( + // "----- stage0: going to processing graph and find intersect neighbor induced graphs -------" + // ); + // console.log("----- stage0.1: going to select random node pairs -------"); + // -------- 第一步，处理原图 graphData------- + // 1.1. 随机选择最多 100 个点对，满足距离小于 Length 和 k + // 当 graphData 少于 20 个节点，则不能找出 100 个点对，只找出不多于 n(n-1)/2 个点对 + + var maxNodePairNum = Math.min(100, nodeNum * (nodeNum - 1) / 2); + var nodePairsMap = findNodePairsRandomly(k, nodeNum, maxNodePairNum, patternKNeighborUnits, spm); // console.log( + // "----- stage0.2: going to calculate intersect neighbor induced graphs -------" + // ); + // 1.2. 生成上面节点对的相应相交邻居诱导子图。格式为 {'beginNodeIdx-endNodeIdx': {nodes: [], edges: []}} + + var intGMap = getIntersectNeighborInducedGraph(nodePairsMap, kNeighborUnits, graphData); // 1.3. 使用 gSpan 算法（frequent graph mining）计算 ISIntG 的前 10 个频率最高的子结构（3-4条边） + + var top = 10, + minSupport = 1, + minNodeNum = 1, + maxNodeNum = 4; + var params = { + graphs: intGMap, + nodeLabelProp: nodeLabelProp, + edgeLabelProp: edgeLabelProp, + minSupport: minSupport, + minNodeNum: minNodeNum, + maxNodeNum: maxNodeNum, + directed: directed + }; // console.log( + // "----- stage1: (gSpan) going to find frequent structure dsG -------" + // ); + // console.log("----- stage1.1: going to run gSpan -------"); + // 暂时假设生成的 sub structure 都只有一条边 + + var freStructures = gSpan(params).slice(0, top); // structureNum 可能小于 top + + var structureNum = freStructures.length; // 1.4. 计算上述 10 个子结构在 intGMap 中每个诱导子图的匹配个数 + + var matchedCountMap = []; + freStructures.forEach(function (structure, i) { + matchedCountMap[i] = {}; + Object.keys(intGMap).forEach(function (key) { + var graph = intGMap[key]; + var subStructureCount = getMatchedCount(graph, structure, nodeLabelProp, edgeLabelProp); + matchedCountMap[i][key] = subStructureCount; + }); + }); // console.log( + // "----- stage1.1: going to find the most represent strucutre -------" + // ); + // 1.5. 对于每个子结构，根据匹配个数为 intGMap 中的诱导子图分组，生成 structureNum 种分组 + // 计算每种分组的类间距和类内间距，找到类间距最大、类内间距最小的一种分组，这种分组对应的子结构被选为唯一代表性子结构 DS(G) + + var _c = findRepresentStructure(matchedCountMap, structureNum, freStructures), + dsG = _c.structure, + ndsDist = _c.structureCountMap; // -------- 第二步，匹配------- + // 2.1 从 Q 中的第一个标签的第一个节点开始，寻找 G 中的匹配 + + + var beginPNode = pattern.nodes[0]; + var label = beginPNode[nodeLabelProp]; // 2.1.1 找到 G 中标签与之相同的节点 + + var candidates = nodeLabelMap[label]; // console.log("----- stage2: going to find candidates -------"); + // 全局缓存，避免重复计算 + + var minPatternNodeLabelDegreeMap = {}; // key 是 label，value 是该 label 节点的最小度数 + + var patternIntGraphMap = {}, + patternNDSDist = {}, + // key 为 node.id-node.id + patternNDSDistMap = {}; // key 为 node.id-label2，value nds距离值数组（按从大到小排序，无需关心具体对应哪个 node2） + // 2.2.2 对于 Q 中的另一个标签的 k 个节点，计算它们到 node 的最短路径以及 NDS 距离 + + var patternSpDist = {}; + var patternSpDistBack = {}; + Object.keys(patternNodeLabelMap).forEach(function (label2, j) { + patternSpDist[label2] = []; + + if (directed) { + patternSpDistBack[label2] = []; + } + var patternNodesWithLabel2 = patternNodeLabelMap[label2]; + var patternNodePairMap = {}; + patternNodesWithLabel2.forEach(function (nodeWithLabel2) { + var dist = patternSpmMap[beginPNode.id + "-" + nodeWithLabel2.id]; + dist && patternSpDist[label2].push(dist); + patternNodePairMap[beginPNode.id + "-" + nodeWithLabel2.id] = { + start: 0, + end: patternNodeMap[nodeWithLabel2.id].idx, + distance: dist + }; + + if (directed) { + var distBack = patternSpmMap[nodeWithLabel2.id + "-" + beginPNode.id]; + distBack && patternSpDistBack[label2].push(distBack); + } + }); // spDist[label2] 按照从小到大排序 + + patternSpDist[label2] = patternSpDist[label2].sort(function (a, b) { + return a - b; + }); + if (directed) patternSpDistBack[label2] = patternSpDistBack[label2].sort(function (a, b) { + return a - b; + }); // 计算 Q 中所有 label2 节点到 beginPNode 的 NDS 距离 + // 所有 label2 节点到 beginPNode 的邻居相交诱导子图： + // key: node1.id-node2.id + + patternIntGraphMap = getIntersectNeighborInducedGraph(patternNodePairMap, patternKNeighborUnits, pattern, patternIntGraphMap); // pattern 中 beginNode 到当前 label2 节点 的 NDS 距离（数组，无需关心具体对应到哪个节点） + + var currentPatternNDSDistArray = []; + Object.keys(patternNodePairMap).forEach(function (key) { + if (patternNDSDist[key]) { + currentPatternNDSDistArray.push(patternNDSDist[key]); + return; // 缓存过则不需要再次计算 + } + + var patternIntGraph = patternIntGraphMap[key]; + patternNDSDist[key] = getMatchedCount(patternIntGraph, dsG, nodeLabelProp, edgeLabelProp); + currentPatternNDSDistArray.push(patternNDSDist[key]); + }); // 根据值为 currentPatternNDSDist 从大到小排序 + + currentPatternNDSDistArray = currentPatternNDSDistArray.sort(function (a, b) { + return b - a; + }); + patternNDSDistMap[beginPNode.id + "-" + label2] = currentPatternNDSDistArray; + if (label2 === label) return; + var candidatesNum = candidates.length; + + var _loop_4 = function _loop_4(m) { + var cNode = candidates[m]; // prune1：若 candidates 中节点 cNode 的 kNeighborUnits 中标签为 label2 的节点个数少于 pattern 中 label2 个数，删去它 + + var graphNeighborUnit = kNeighborUnits[nodeMap[cNode.id].idx]; + var graphNeighborUnitCountMap = graphNeighborUnit.nodeLabelCountMap[label2]; + var patternLabel2Num = patternNodeLabelMap[label2].length; + + if (!graphNeighborUnitCountMap || graphNeighborUnitCountMap.count < patternLabel2Num) { + candidates.splice(m, 1); + return "continue"; + } // prune2：若 candidates 中节点 cNode 到 kNeighborUnits 中标签为 label2 的节点最短路径大于 patternSpDist[label2]，删去它 + // (prune2 规则即：candidate 相关的最短路径的最大 spDist[label2].length 个，按照大小顺序依次和 patternSpDist[label2] 中的值比较，只要遇到一个是 G > Q 的，就删去这个 candidate) + + + var prune2Invalid = false; + + for (var n = 0; n < patternLabel2Num; n++) { + if (graphNeighborUnitCountMap.dists[n] > patternSpDist[label2][n]) { + prune2Invalid = true; + break; + } + } + + if (prune2Invalid) { + candidates.splice(m, 1); + return "continue"; + } // prune3：若 candidates 中节点 cNode 到 kNeighborUnits 中标签为 label2 的节点 NDS 距离小于 patternNDSDist[beginNode.id-label2]，删去它 + // TODO：prune3，currentPatternNDSDistArray 与 currentNDSDist 的比较 + // 计算 G 中所有 label2 节点到 cNode 的 NDS 距离 + // 所有 label2 节点到 cNode 的邻居相交诱导子图： + + + var cNodePairMap = {}; + graphNeighborUnit.neighbors.forEach(function (neighborNode) { + var dist = spmMap[cNode.id + "-" + neighborNode.id]; + cNodePairMap[cNode.id + "-" + neighborNode.id] = { + start: nodeMap[cNode.id].idx, + end: nodeMap[neighborNode.id].idx, + distance: dist + }; + }); // 更新 intGMap + + intGMap = getIntersectNeighborInducedGraph(cNodePairMap, kNeighborUnits, graphData, intGMap); // candidate 到它周围 label2 节点的 NDS 距离, key 是 node.id-node.id + + var currentNDSDistArray = []; + Object.keys(cNodePairMap).forEach(function (key) { + if (ndsDist[key]) { + currentNDSDistArray.push(ndsDist[key]); + return; // 缓存过则不需要再次计算 + } + + var intGraph = intGMap[key]; + ndsDist[key] = getMatchedCount(intGraph, dsG, nodeLabelProp, edgeLabelProp); + currentNDSDistArray.push(ndsDist[key]); + }); // 根据值为 currentNDSDistArray 从大到小排序 + + currentNDSDistArray = currentNDSDistArray.sort(function (a, b) { + return b - a; + }); + var prune3Invalid = false; + + for (var n = 0; n < patternLabel2Num; n++) { + if (currentNDSDistArray[n] < currentPatternNDSDistArray[n]) { + prune3Invalid = true; + break; + } + } + + if (prune3Invalid) { + candidates.splice(m, 1); + return "continue"; + } + }; + + for (var m = candidatesNum - 1; m >= 0; m--) { + _loop_4(m); + } + }); + var candidateGraphs = []; // console.log( + // "----- stage3: going to splice neighbors for each candidate graph -------" + // ); + // candidates 经过筛选后，以每个 candidate 为中心，生成 Length-neighbor 的邻居诱导子图 + // 并在诱导子图中去除不可能在 Q 上找到匹配的点：在 Q 上不存在的 label，其他 label 到 candidate 的最大最短距离符合 Q、NDS 距离符合 Q + + candidates.forEach(function (candidate) { + var nodeIdx = nodeMap[candidate.id].idx; + var lengthNeighborUnit = findKNeighborUnit(graphData.nodes, spm[nodeIdx], nodeIdx, nodeLabelProp, length); + var neighborNodes = lengthNeighborUnit.neighbors; // 删除不可能找到匹配的邻居点 + + var neighborNum = neighborNodes.length; + var unmatched = false; + + for (var i = neighborNum - 1; i >= 0; i--) { + // 如果通过裁剪，符合条件的节点数量已过少，说明不能匹配这个 candidate 相关的图 + if (neighborNodes.length + 1 < pattern.nodes.length) { + unmatched = true; + return; + } + + var neighborNode = neighborNodes[i]; + var neighborLabel = neighborNode[nodeLabelProp]; // prune1: 若该邻居点的 label 不存在于 pattern 中，移除这个点 + + if (!patternNodeLabelMap[neighborLabel] || !patternNodeLabelMap[neighborLabel].length) { + neighborNodes.splice(i, 1); + continue; + } // prune2: 若该邻居点到 candidate 的最短路径比和它有相同 label 的节点到 beginPNode 的最大最短路径长度长，移除这个点 + // prune2.1: 如果没有这个标签到 beginPNode 的距离记录，说明 pattern 上（可能 beginPNode 是这个 label）没有其他这个 label 的节点 + + + if (!patternSpDist[neighborLabel] || !patternSpDist[neighborLabel].length) { + neighborNodes.splice(i, 1); + continue; + } + + var key = candidate.id + "-" + neighborNode.id; // prune2.2 + + var distToCandidate = spmMap[key]; + var idx = patternSpDist[neighborLabel].length - 1; + var maxDistWithLabelInPattern = patternSpDist[neighborLabel][idx]; // patternSpDist[neighborLabel] 已经按照从小到大排序 + + if (distToCandidate > maxDistWithLabelInPattern) { + neighborNodes.splice(i, 1); + continue; + } + + if (directed) { + var keyBack = neighborNode.id + "-" + candidate.id; + var distFromCandidate = spmMap[keyBack]; + idx = patternSpDistBack[neighborLabel].length - 1; + var maxBackDistWithLabelInPattern = patternSpDistBack[neighborLabel][idx]; + + if (distFromCandidate > maxBackDistWithLabelInPattern) { + neighborNodes.splice(i, 1); + continue; + } + } // prune3: 若该邻居点到 candidate 的 NDS 距离比和它有相同 label 的节点到 beginPNode 的最小 NDS 距离小，移除这个点 + + + var ndsToCandidate = ndsDist[key] ? ndsDist[key] : getNDSDist(graphData, candidate, neighborNode, nodeMap, distToCandidate, kNeighborUnits, dsG, nodeLabelProp, edgeLabelProp, ndsDist, intGMap); + var patternKey = beginPNode.id + "-" + neighborLabel; + var minNdsWithLabelInPattern = patternNDSDistMap[patternKey][patternNDSDistMap[patternKey].length - 1]; // patternNDSDist[key] 一定存在 + + if (ndsToCandidate < minNdsWithLabelInPattern) { + neighborNodes.splice(i, 1); + continue; + } // prune4: 若该邻居点的度数小于 pattern 同 label 节点最小度数，删去该点 + + + var _a = stashPatternNodeLabelDegreeMap(minPatternNodeLabelDegreeMap, neighborLabel, patternNodeMap, patternNodeLabelMap), + minPatternNodeLabelDegree = _a.minPatternNodeLabelDegree; + _a.minPatternNodeLabelInDegree; + _a.minPatternNodeLabelOutDegree; + + if (nodeMap[neighborNode.id].degree < minPatternNodeLabelDegree) { + neighborNodes.splice(i, 1); + continue; + } + } // 节点在个数上符合匹配（不少于 pattern 的节点个数），现在筛选相关边 + + + if (!unmatched) { + candidateGraphs.push({ + nodes: [candidate].concat(neighborNodes) + }); + } + }); // console.log( + // "----- stage4: going to splice edges and neighbors for each candidate graph -------" + // ); + + var undirectedLengthsToBeginPNode = dijkstra$2(pattern, beginPNode.id, false).length; + var undirectedLengthsToBeginPNodeLabelMap = {}; + + if (directed) { + Object.keys(undirectedLengthsToBeginPNode).forEach(function (nodeId) { + var nodeLabel = patternNodeMap[nodeId].node[nodeLabelProp]; + if (!undirectedLengthsToBeginPNodeLabelMap[nodeLabel]) undirectedLengthsToBeginPNodeLabelMap[nodeLabel] = [undirectedLengthsToBeginPNode[nodeId]];else undirectedLengthsToBeginPNodeLabelMap[nodeLabel].push(undirectedLengthsToBeginPNode[nodeId]); + }); + Object.keys(undirectedLengthsToBeginPNodeLabelMap).forEach(function (pLabel) { + undirectedLengthsToBeginPNodeLabelMap[pLabel].sort(function (a, b) { + return a - b; + }); + }); + } else { + undirectedLengthsToBeginPNodeLabelMap = patternSpDist; + } // 现在 candidateGraphs 里面只有节点，进行边的筛选 + + + var candidateGraphNum = candidateGraphs.length; + + var _loop_2 = function _loop_2(i) { + var candidateGraph = candidateGraphs[i]; + var candidate = candidateGraph.nodes[0]; + var candidateNodeLabelCountMap = {}; + var candidateNodeMap = {}; + candidateGraph.nodes.forEach(function (node, q) { + candidateNodeMap[node.id] = { + idx: q, + node: node, + degree: 0, + inDegree: 0, + outDegree: 0 + }; + var cNodeLabel = node[nodeLabelProp]; + if (!candidateNodeLabelCountMap[cNodeLabel]) candidateNodeLabelCountMap[cNodeLabel] = 1;else candidateNodeLabelCountMap[cNodeLabel]++; + }); // 根据 candidate 和 neighborNodes 中的节点生成 G 的诱导子图 + // 即，将 graphData 上两端都在 candidateGraph.nodes 中的边放入 candidateEdges + + var candidateEdges = []; + var edgeLabelCountMap = {}; + graphData.edges.forEach(function (edge) { + if (candidateNodeMap[edge.source] && candidateNodeMap[edge.target]) { + candidateEdges.push(edge); + if (!edgeLabelCountMap[edge[edgeLabelProp]]) edgeLabelCountMap[edge[edgeLabelProp]] = 1;else edgeLabelCountMap[edge[edgeLabelProp]]++; + candidateNodeMap[edge.source].degree++; + candidateNodeMap[edge.target].degree++; + candidateNodeMap[edge.source].outDegree++; + candidateNodeMap[edge.target].inDegree++; + } + }); // prune：若有一个 edgeLabel 在 candidateGraph 上的个数少于 pattern，去除该图 + + var pattenrEdgeLabelNum = Object.keys(patternEdgeLabelMap).length; + var prunedByEdgeLabel = false; + + for (var e = 0; e < pattenrEdgeLabelNum; e++) { + var label_1 = Object.keys(patternEdgeLabelMap)[e]; + + if (!edgeLabelCountMap[label_1] || edgeLabelCountMap[label_1] < patternEdgeLabelMap[label_1].length) { + prunedByEdgeLabel = true; + break; + } + } + + if (prunedByEdgeLabel) { + candidateGraphs.splice(i, 1); + return "continue"; + } // 遍历 candidateEdges，进行边的筛选 + + + var candidateEdgeNum = candidateEdges.length; // prune：若边数过少，去除该图 + + if (candidateEdgeNum < pattern.edges.length) { + candidateGraphs.splice(i, 1); + return "break"; + } + + var candidateGraphInvalid = false; + + var _loop_5 = function _loop_5(e) { + var edge = candidateEdges[e]; + var edgeLabel = edge[edgeLabelProp]; + var patternEdgesWithLabel = patternEdgeLabelMap[edgeLabel]; // prune 1: 若边的 label 不存在于 pattern 边 label 中，去除该边 + + if (!patternEdgesWithLabel || !patternEdgesWithLabel.length) { + edgeLabelCountMap[edgeLabel]--; // 若这个 label 的 count 减少之后，该 label 的边数不足，去除该图 + + if (patternEdgesWithLabel && edgeLabelCountMap[edgeLabel] < patternEdgesWithLabel.length) { + candidateGraphInvalid = true; + return "break"; + } + + candidateEdges.splice(e, 1); + candidateNodeMap[edge.source].degree--; + candidateNodeMap[edge.target].degree--; + candidateNodeMap[edge.source].outDegree--; + candidateNodeMap[edge.target].inDegree--; + return "continue"; + } // prune 2: 若边的 label +两端 label 的三元组关系不能在 pattern 中找到，去除该边 + + + var sourceLabel = candidateNodeMap[edge.source].node[nodeLabelProp]; + var targetLabel = candidateNodeMap[edge.target].node[nodeLabelProp]; + var edgeMatched = false; + patternEdgesWithLabel.forEach(function (patternEdge) { + var patternSource = patternNodeMap[patternEdge.source].node; + var patternTarget = patternNodeMap[patternEdge.target].node; + if (patternSource[nodeLabelProp] === sourceLabel && patternTarget[nodeLabelProp] === targetLabel) edgeMatched = true; + if (!directed && patternSource[nodeLabelProp] === targetLabel && patternTarget[nodeLabelProp] === sourceLabel) edgeMatched = true; + }); + + if (!edgeMatched) { + edgeLabelCountMap[edgeLabel]--; // 若这个 label 的 count 减少之后，该 label 的边数不足，去除该图 + + if (patternEdgesWithLabel && edgeLabelCountMap[edgeLabel] < patternEdgesWithLabel.length) { + candidateGraphInvalid = true; + return "break"; + } + + candidateEdges.splice(e, 1); + candidateNodeMap[edge.source].degree--; + candidateNodeMap[edge.target].degree--; + candidateNodeMap[edge.source].outDegree--; + candidateNodeMap[edge.target].inDegree--; + return "continue"; + } + }; + + for (var e = candidateEdgeNum - 1; e >= 0; e--) { + var state_2 = _loop_5(e); + + if (state_2 === "break") break; + } // prune2: 删除边的过程中，发现边数过少/边 label 数过少时，去除该图 + + + if (candidateGraphInvalid) { + candidateGraphs.splice(i, 1); + return "continue"; + } + + candidateGraph.edges = candidateEdges; + var lengthsToCandidate = dijkstra$2(candidateGraph, candidateGraph.nodes[0].id, false).length; + Object.keys(lengthsToCandidate).reverse().forEach(function (targetId) { + if (targetId === candidateGraph.nodes[0].id || candidateGraphInvalid) return; // prune4: 通过上述裁剪，可能导致该邻居子图变为不连通。裁剪掉目前在这个邻居子图中和 candidate（第一个节点）不连通的节点 + + if (lengthsToCandidate[targetId] === Infinity) { + var targetNodeLabel = candidateNodeMap[targetId].node[nodeLabelProp]; + candidateNodeLabelCountMap[targetNodeLabel]--; + + if (candidateNodeLabelCountMap[targetNodeLabel] < patternNodeLabelMap[targetNodeLabel].length) { + candidateGraphInvalid = true; + return; + } + + var idx = candidateGraph.nodes.indexOf(candidateNodeMap[targetId].node); + candidateGraph.nodes.splice(idx, 1); + candidateNodeMap[targetId] = undefined; + return; + } // prune5: 经过边裁剪后，可能又出现了最短路径过长的节点 （比 pattern 中同 label 的节点到 beginNode 最大最短距离远），删去这些节点 + + + var nLabel = nodeMap[targetId].node[nodeLabelProp]; + + if (!undirectedLengthsToBeginPNodeLabelMap[nLabel] || !undirectedLengthsToBeginPNodeLabelMap[nLabel].length || lengthsToCandidate[targetId] > undirectedLengthsToBeginPNodeLabelMap[nLabel][undirectedLengthsToBeginPNodeLabelMap[nLabel].length - 1]) { + var targetNodeLabel = candidateNodeMap[targetId].node[nodeLabelProp]; + candidateNodeLabelCountMap[targetNodeLabel]--; + + if (candidateNodeLabelCountMap[targetNodeLabel] < patternNodeLabelMap[targetNodeLabel].length) { + candidateGraphInvalid = true; + return; + } + + var idx = candidateGraph.nodes.indexOf(candidateNodeMap[targetId].node); + candidateGraph.nodes.splice(idx, 1); + candidateNodeMap[targetId] = undefined; + } + }); + + if (candidateGraphInvalid) { + candidateGraphs.splice(i, 1); + return "continue"; + } + + var degreeChanged = true; + var loopCount = 0; + + while (degreeChanged && !candidateGraphInvalid) { + degreeChanged = false; // candidate 度数不足，删去该图 + + var condition = directed ? candidateNodeMap[candidate.id].degree < patternNodeMap[beginPNode.id].degree || candidateNodeMap[candidate.id].inDegree < patternNodeMap[beginPNode.id].inDegree || candidateNodeMap[candidate.id].outDegree < patternNodeMap[beginPNode.id].outDegree : candidateNodeMap[candidate.id].degree < patternNodeMap[beginPNode.id].degree; + + if (condition) { + candidateGraphInvalid = true; + break; + } // candidate label 个数不足，删去该图 + + + if (candidateNodeLabelCountMap[candidate[nodeLabelProp]] < patternNodeLabelMap[candidate[nodeLabelProp]].length) { + candidateGraphInvalid = true; + break; + } // prune6：去除度数过小的节点 + + + var currentCandidateNodeNum = candidateGraph.nodes.length; + + for (var o = currentCandidateNodeNum - 1; o >= 0; o--) { + var cgNode = candidateGraph.nodes[o]; + var nodeDegree = candidateNodeMap[cgNode.id].degree; + var nodeInDegree = candidateNodeMap[cgNode.id].inDegree; + var nodeOutDegree = candidateNodeMap[cgNode.id].outDegree; + var cNodeLabel = cgNode[nodeLabelProp]; + + var _d = stashPatternNodeLabelDegreeMap(minPatternNodeLabelDegreeMap, cNodeLabel, patternNodeMap, patternNodeLabelMap), + minPatternNodeLabelDegree = _d.minPatternNodeLabelDegree, + minPatternNodeLabelInDegree = _d.minPatternNodeLabelInDegree, + minPatternNodeLabelOutDegree = _d.minPatternNodeLabelOutDegree; + + var deleteCondition = directed ? nodeDegree < minPatternNodeLabelDegree || nodeInDegree < minPatternNodeLabelInDegree || nodeOutDegree < minPatternNodeLabelOutDegree : nodeDegree < minPatternNodeLabelDegree; + + if (deleteCondition) { + candidateNodeLabelCountMap[cgNode[nodeLabelProp]]--; // 节点 label 个数不足 + + if (candidateNodeLabelCountMap[cgNode[nodeLabelProp]] < patternNodeLabelMap[cgNode[nodeLabelProp]].length) { + candidateGraphInvalid = true; + break; + } + + candidateGraph.nodes.splice(o, 1); + candidateNodeMap[cgNode.id] = undefined; + degreeChanged = true; + } + } + + if (candidateGraphInvalid || !degreeChanged && loopCount !== 0) break; // 经过 prune5 节点裁剪，删去端点已经不在 candidateGraph 中的边 + + candidateEdgeNum = candidateEdges.length; + + for (var y = candidateEdgeNum - 1; y >= 0; y--) { + var cedge = candidateEdges[y]; + + if (!candidateNodeMap[cedge.source] || !candidateNodeMap[cedge.target]) { + candidateEdges.splice(y, 1); + var edgeLabel = cedge[edgeLabelProp]; + edgeLabelCountMap[edgeLabel]--; + + if (candidateNodeMap[cedge.source]) { + candidateNodeMap[cedge.source].degree--; + candidateNodeMap[cedge.source].outDegree--; + } + + if (candidateNodeMap[cedge.target]) { + candidateNodeMap[cedge.target].degree--; + candidateNodeMap[cedge.target].inDegree--; + } // 边 label 数量不足 + + + if (patternEdgeLabelMap[edgeLabel] && edgeLabelCountMap[edgeLabel] < patternEdgeLabelMap[edgeLabel].length) { + candidateGraphInvalid = true; + break; + } + + degreeChanged = true; + } + } + + loopCount++; + } + + if (candidateGraphInvalid) { + candidateGraphs.splice(i, 1); + return "continue"; + } // prune: 若节点/边数过少，节点/边 label 过少，去掉这个图 + + + if (candidateGraphInvalid || candidateGraph.nodes.length < pattern.nodes.length || candidateEdges.length < pattern.edges.length) { + candidateGraphs.splice(i, 1); + return "continue"; + } + }; + + for (var i = candidateGraphNum - 1; i >= 0; i--) { + var state_1 = _loop_2(i); + + if (state_1 === "break") break; + } // 此时已经生成的多个 candidateGraphs，可能有重复 + // console.log( + // "----- stage5: going to splice dulplicated candidate graphs -------" + // ); + // 删去 candidateGraphs 中一模一样的子图，通过边的 node-node-edgeLabel 作为 key，这类边个数作为 value，进行匹配 + + + var currentLength = candidateGraphs.length; + + var _loop_3 = function _loop_3(i) { + var cg1 = candidateGraphs[i]; + var cg1EdgeMap = {}; // [node1.id-node2.id-edge.label]: count + + cg1.edges.forEach(function (edge) { + var key = edge.source + "-" + edge.target + "-" + edge.label; + if (!cg1EdgeMap[key]) cg1EdgeMap[key] = 1;else cg1EdgeMap[key]++; + }); + + var _loop_6 = function _loop_6(j) { + var cg2 = candidateGraphs[j]; + var cg2EdgeMap = {}; // [node1.id-node2.id-edge.label]: count + + cg2.edges.forEach(function (edge) { + var key = edge.source + "-" + edge.target + "-" + edge.label; + if (!cg2EdgeMap[key]) cg2EdgeMap[key] = 1;else cg2EdgeMap[key]++; + }); + var same = true; + + if (Object.keys(cg2EdgeMap).length !== Object.keys(cg1EdgeMap).length) { + same = false; + } else { + Object.keys(cg1EdgeMap).forEach(function (key) { + if (cg2EdgeMap[key] !== cg1EdgeMap[key]) same = false; + }); + } + + if (same) { + candidateGraphs.splice(j, 1); + } + }; + + for (var j = currentLength - 1; j > i; j--) { + _loop_6(j); + } + + currentLength = candidateGraphs.length; + }; + + for (var i = 0; i <= currentLength - 1; i++) { + _loop_3(i); + } + + return candidateGraphs; +}; + +var Stack$5 = function () { + function Stack(maxStep) { + if (maxStep === void 0) { + maxStep = 10; + } + + this.linkedList = new LinkedList(); + this.maxStep = maxStep; + } + + Object.defineProperty(Stack.prototype, "length", { + get: function get() { + return this.linkedList.toArray().length; + }, + enumerable: false, + configurable: true + }); + /** + * 判断栈是否为空，如果链表中没有头部元素，则栈为空 + */ + + Stack.prototype.isEmpty = function () { + return !this.linkedList.head; + }; + /** + * 是否到定义的栈的最大长度，如果达到最大长度后，不再允许入栈 + */ + + + Stack.prototype.isMaxStack = function () { + return this.toArray().length >= this.maxStep; + }; + /** + * 访问顶端元素 + */ + + + Stack.prototype.peek = function () { + if (this.isEmpty()) { + return null; + } // 返回头部元素，不删除元素 + + + return this.linkedList.head.value; + }; + + Stack.prototype.push = function (value) { + this.linkedList.prepend(value); + + if (this.length > this.maxStep) { + this.linkedList.deleteTail(); + } + }; + + Stack.prototype.pop = function () { + var removeHead = this.linkedList.deleteHead(); + return removeHead ? removeHead.value : null; + }; + + Stack.prototype.toArray = function () { + return this.linkedList.toArray().map(function (node) { + return node.value; + }); + }; + + Stack.prototype.clear = function () { + while (!this.isEmpty()) { + this.pop(); + } + }; + + return Stack; +}(); + +var detectDirectedCycle = detectDirectedCycle$1; +var index$1 = { + getAdjMatrix: adjMatrix, + breadthFirstSearch: breadthFirstSearch, + connectedComponent: getConnectedComponents, + getDegree: degree, + getInDegree: getInDegree, + getOutDegree: getOutDegree, + detectCycle: detectDirectedCycle$1, + detectDirectedCycle: detectDirectedCycle, + detectAllCycles: detectAllCycles, + detectAllDirectedCycle: detectAllDirectedCycle, + detectAllUndirectedCycle: detectAllUndirectedCycle, + depthFirstSearch: depthFirstSearch, + dijkstra: dijkstra$2, + findAllPath: findAllPath, + findShortestPath: findShortestPath, + floydWarshall: floydWarshall$3, + labelPropagation: labelPropagation, + louvain: louvain, + minimumSpanningTree: minimumSpanningTree, + pageRank: pageRank, + getNeighbors: getNeighbors, + Stack: Stack$5, + GADDI: GADDI +}; + +var Algorithm = /*#__PURE__*/Object.freeze({ + __proto__: null, + getAdjMatrix: adjMatrix, + breadthFirstSearch: breadthFirstSearch, + connectedComponent: getConnectedComponents, + getDegree: degree, + getInDegree: getInDegree, + getOutDegree: getOutDegree, + detectCycle: detectDirectedCycle$1, + detectDirectedCycle: detectDirectedCycle, + detectAllCycles: detectAllCycles, + detectAllDirectedCycle: detectAllDirectedCycle, + detectAllUndirectedCycle: detectAllUndirectedCycle, + depthFirstSearch: depthFirstSearch, + dijkstra: dijkstra$2, + findAllPath: findAllPath, + findShortestPath: findShortestPath, + floydWarshall: floydWarshall$3, + labelPropagation: labelPropagation, + louvain: louvain, + minimumSpanningTree: minimumSpanningTree, + pageRank: pageRank, + getNeighbors: getNeighbors, + Stack: Stack$5, + GADDI: GADDI, + 'default': index$1 +}); + +var transform$a = transform$i; +/** + * 对比对象，用于对象数组排序 + * @param {string} attributeName 排序依据的字段名称 + * @param {number} min 最小值 + * @param {number} max 最大值 + * @return {boolean} bool 布尔 + */ + +var compare = function compare(attributeName) { + return function (m, n) { + return m[attributeName] - n[attributeName]; + }; +}; +/** + * 是否在区间内 + * @param {number} value 值 + * @param {number} min 最小值 + * @param {number} max 最大值 + * @return {boolean} bool 布尔 + */ + +var isBetween = function isBetween(value, min, max) { + return value >= min && value <= max; +}; +/** + * 获取两条线段的交点 + * @param {Point} p0 第一条线段起点 + * @param {Point} p1 第一条线段终点 + * @param {Point} p2 第二条线段起点 + * @param {Point} p3 第二条线段终点 + * @return {Point} 交点 + */ + + +var getLineIntersect = function getLineIntersect(p0, p1, p2, p3) { + var tolerance = 0.0001; + var E = { + x: p2.x - p0.x, + y: p2.y - p0.y + }; + var D0 = { + x: p1.x - p0.x, + y: p1.y - p0.y + }; + var D1 = { + x: p3.x - p2.x, + y: p3.y - p2.y + }; + var kross = D0.x * D1.y - D0.y * D1.x; + var sqrKross = kross * kross; + var invertKross = 1 / kross; + var sqrLen0 = D0.x * D0.x + D0.y * D0.y; + var sqrLen1 = D1.x * D1.x + D1.y * D1.y; + + if (sqrKross > tolerance * sqrLen0 * sqrLen1) { + var s = (E.x * D1.y - E.y * D1.x) * invertKross; + var t = (E.x * D0.y - E.y * D0.x) * invertKross; + if (!isBetween(s, 0, 1) || !isBetween(t, 0, 1)) return null; + return { + x: p0.x + s * D0.x, + y: p0.y + s * D0.y + }; + } + + return null; +}; +/** + * point and rectangular intersection point + * @param {IRect} rect rect + * @param {Point} point point + * @return {PointPoint} rst; + */ + +var getRectIntersectByPoint = function getRectIntersectByPoint(rect, point) { + var x = rect.x, + y = rect.y, + width = rect.width, + height = rect.height; + var cx = x + width / 2; + var cy = y + height / 2; + var points = []; + var center = { + x: cx, + y: cy + }; + points.push({ + x: x, + y: y + }); + points.push({ + x: x + width, + y: y + }); + points.push({ + x: x + width, + y: y + height + }); + points.push({ + x: x, + y: y + height + }); + points.push({ + x: x, + y: y + }); + var rst = null; + + for (var i = 1; i < points.length; i++) { + rst = getLineIntersect(points[i - 1], points[i], center, point); + + if (rst) { + break; + } + } + + return rst; +}; +/** + * get point and circle inIntersect + * @param {ICircle} circle 圆点，x,y,r + * @param {Point} point 点 x,y + * @return {Point} applied point + */ + +var getCircleIntersectByPoint = function getCircleIntersectByPoint(circle, point) { + var cx = circle.x, + cy = circle.y, + r = circle.r; + var x = point.x, + y = point.y; + var dx = x - cx; + var dy = y - cy; + var d = Math.sqrt(dx * dx + dy * dy); + + if (d < r) { + return null; + } + + var signX = Math.sign(dx); + var signY = Math.sign(dy); + var angle = Math.atan(dy / dx); + return { + x: cx + Math.abs(r * Math.cos(angle)) * signX, + y: cy + Math.abs(r * Math.sin(angle)) * signY + }; +}; +/** + * get point and ellipse inIntersect + * @param {Object} ellipse 椭圆 x,y,rx,ry + * @param {Object} point 点 x,y + * @return {object} applied point + */ + +var getEllipseIntersectByPoint = function getEllipseIntersectByPoint(ellipse, point) { + var a = ellipse.rx; + var b = ellipse.ry; + var cx = ellipse.x; + var cy = ellipse.y; + var dx = point.x - cx; + var dy = point.y - cy; // 直接通过 x,y 求夹角，求出来的范围是 -PI, PI + + var angle = Math.atan2(dy / b, dx / a); + + if (angle < 0) { + angle += 2 * Math.PI; // 转换到 0，2PI + } + + return { + x: cx + a * Math.cos(angle), + y: cy + b * Math.sin(angle) + }; +}; +/** + * coordinate matrix transformation + * @param {number} point coordinate + * @param {Matrix} matrix matrix + * @param {number} tag could be 0 or 1 + * @return {Point} transformed point + */ + +var applyMatrix$1 = function applyMatrix(point, matrix, tag) { + if (tag === void 0) { + tag = 1; + } + + var vector = [point.x, point.y, tag]; + + if (!matrix || isNaN(matrix[0])) { + matrix = [1, 0, 0, 0, 1, 0, 0, 0, 1]; + } + + transformMat3$2(vector, vector, matrix); + return { + x: vector[0], + y: vector[1] + }; +}; +/** + * coordinate matrix invert transformation + * @param {number} point coordinate + * @param {number} matrix matrix + * @param {number} tag could be 0 or 1 + * @return {object} transformed point + */ + +var invertMatrix = function invertMatrix(point, matrix, tag) { + if (tag === void 0) { + tag = 1; + } + + if (!matrix || isNaN(matrix[0])) { + matrix = [1, 0, 0, 0, 1, 0, 0, 0, 1]; + } + + var inversedMatrix = invert$4([1, 0, 0, 0, 1, 0, 0, 0, 1], matrix); + + if (!inversedMatrix) { + inversedMatrix = [1, 0, 0, 0, 1, 0, 0, 0, 1]; + } + + var vector = [point.x, point.y, tag]; + transformMat3$2(vector, vector, inversedMatrix); + return { + x: vector[0], + y: vector[1] + }; +}; +/** + * + * @param p1 First coordinate + * @param p2 second coordinate + * @param p3 three coordinate + */ + +var getCircleCenterByPoints = function getCircleCenterByPoints(p1, p2, p3) { + var a = p1.x - p2.x; + var b = p1.y - p2.y; + var c = p1.x - p3.x; + var d = p1.y - p3.y; + var e = (p1.x * p1.x - p2.x * p2.x - p2.y * p2.y + p1.y * p1.y) / 2; + var f = (p1.x * p1.x - p3.x * p3.x - p3.y * p3.y + p1.y * p1.y) / 2; + var denominator = b * c - a * d; + return { + x: -(d * e - b * f) / denominator, + y: -(a * f - c * e) / denominator + }; +}; +/** + * get distance by two points + * @param p1 first point + * @param p2 second point + */ + +var distance$3 = function distance(p1, p2) { + var vx = p1.x - p2.x; + var vy = p1.y - p2.y; + return Math.sqrt(vx * vx + vy * vy); +}; +/** + * scale matrix + * @param matrix [ [], [], [] ] + * @param ratio + */ + +var scaleMatrix$1 = function scaleMatrix(matrix, ratio) { + var result = []; + matrix.forEach(function (row) { + var newRow = []; + row.forEach(function (v) { + newRow.push(v * ratio); + }); + result.push(newRow); + }); + return result; +}; +/** + * Floyd Warshall algorithm for shortest path distances matrix + * @param {array} adjMatrix adjacency matrix + * @return {array} distances shortest path distances matrix + */ + +var floydWarshall$2 = function floydWarshall(adjMatrix) { + // initialize + var dist = []; + var size = adjMatrix.length; + + for (var i = 0; i < size; i += 1) { + dist[i] = []; + + for (var j = 0; j < size; j += 1) { + if (i === j) { + dist[i][j] = 0; + } else if (adjMatrix[i][j] === 0 || !adjMatrix[i][j]) { + dist[i][j] = Infinity; + } else { + dist[i][j] = adjMatrix[i][j]; + } + } + } // floyd + + + for (var k = 0; k < size; k += 1) { + for (var i = 0; i < size; i += 1) { + for (var j = 0; j < size; j += 1) { + if (dist[i][j] > dist[i][k] + dist[k][j]) { + dist[i][j] = dist[i][k] + dist[k][j]; + } + } + } + } + + return dist; +}; +/** + * get adjacency matrix + * @param data graph data + * @param directed whether it's a directed graph + */ + +var getAdjMatrix$1 = function getAdjMatrix(data, directed) { + var nodes = data.nodes, + edges = data.edges; + var matrix = []; // map node with index in data.nodes + + var nodeMap = {}; + + if (!nodes) { + throw new Error('invalid nodes data!'); + } + + if (nodes) { + nodes.forEach(function (node, i) { + nodeMap[node.id] = i; + var row = []; + matrix.push(row); + }); + } + + if (edges) { + edges.forEach(function (e) { + var source = e.source, + target = e.target; + var sIndex = nodeMap[source]; + var tIndex = nodeMap[target]; + matrix[sIndex][tIndex] = 1; + + if (!directed) { + matrix[tIndex][sIndex] = 1; + } + }); + } + + return matrix; +}; +/** + * 平移group + * @param group Group 实例 + * @param vec 移动向量 + */ + +var translate = function translate(group, vec) { + group.translate(vec.x, vec.y); +}; +/** + * 移动到指定坐标点 + * @param group Group 实例 + * @param point 移动到的坐标点 + */ + +var move = function move(group, point) { + var matrix = group.getMatrix(); + + if (!matrix) { + matrix = [1, 0, 0, 0, 1, 0, 0, 0, 1]; + } + + var bbox = group.getCanvasBBox(); + var vx = point.x - bbox.minX; + var vy = point.y - bbox.minY; + var movedMatrix = transform$a(matrix, [['t', vx, vy]]); + group.setMatrix(movedMatrix); +}; +/** + * 缩放 group + * @param group Group 实例 + * @param point 在x 和 y 方向上的缩放比例 + */ + +var scale$1 = function scale(group, ratio) { + var matrix = group.getMatrix(); + + if (!matrix) { + matrix = [1, 0, 0, 0, 1, 0, 0, 0, 1]; + } + + var scaleXY = ratio; + + if (!isArray$n(ratio)) { + scaleXY = [ratio, ratio]; + } + + if (isArray$n(ratio) && ratio.length === 1) { + scaleXY = [ratio[0], ratio[0]]; + } + + matrix = transform$a(matrix, [['s', scaleXY[0], scaleXY[1]]]); + group.setMatrix(matrix); +}; +/** + * + * @param group Group 实例 + * @param ratio 选择角度 + */ + +var rotate$1 = function rotate(group, angle) { + var matrix = group.getMatrix(); + + if (!matrix) { + matrix = [1, 0, 0, 0, 1, 0, 0, 0, 1]; + } + + matrix = transform$a(matrix, [['r', angle]]); + group.setMatrix(matrix); +}; +var getDegree$1 = function getDegree(n, nodeIdxMap, edges) { + var degrees = []; + + for (var i = 0; i < n; i++) { + degrees[i] = 0; + } + + edges.forEach(function (e) { + if (e.source) { + degrees[nodeIdxMap[e.source]] += 1; + } + + if (e.target) { + degrees[nodeIdxMap[e.target]] += 1; + } + }); + return degrees; +}; // 判断点Q是否在p1和p2的线段上 + +function onSegment(p1, p2, q) { + if ((q[0] - p1[0]) * (p2[1] - p1[1]) === (p2[0] - p1[0]) * (q[1] - p1[1]) && Math.min(p1[0], p2[0]) <= q[0] && q[0] <= Math.max(p1[0], p2[0]) && Math.min(p1[1], p2[1]) <= q[1] && q[1] <= Math.max(p1[1], p2[1])) { + return true; + } + + return false; +} +/** + * 判断点P在多边形内-射线法. Borrow from https://github.com/antvis/util/blob/master/packages/path-util/src/point-in-polygon.ts + * @param points + * @param x + * @param y + */ + + +var isPointInPolygon = function isPointInPolygon(points, x, y) { + var isHit = false; + var n = points.length; // 判断两个double在eps精度下的大小关系 + + var tolerance = 1e-6; + + function dcmp(xValue) { + if (Math.abs(xValue) < tolerance) { + return 0; + } + + return xValue < 0 ? -1 : 1; + } + + if (n <= 2) { + // svg 中点小于 3 个时，不显示，也无法被拾取 + return false; + } + + for (var i = 0; i < n; i++) { + var p1 = points[i]; + var p2 = points[(i + 1) % n]; + + if (onSegment(p1, p2, [x, y])) { + // 点在多边形一条边上 + return true; + } // 前一个判断min(p1[1],p2[1]) 0 !== dcmp(p2[1] - y) > 0 && dcmp(x - (y - p1[1]) * (p1[0] - p2[0]) / (p1[1] - p2[1]) - p1[0]) < 0) { + isHit = !isHit; + } + } + + return isHit; +}; // 判断两个BBox是否相交 + +var intersectBBox = function intersectBBox(box1, box2) { + return !(box2.minX > box1.maxX || box2.maxX < box1.minX || box2.minY > box1.maxY || box2.maxY < box1.minY); +}; + +var lineIntersectPolygon = function lineIntersectPolygon(lines, line) { + var isIntersect = false; + each$2(lines, function (l) { + if (getLineIntersect(l.from, l.to, line.from, line.to)) { + isIntersect = true; + return false; + } + }); + return isIntersect; +}; +/** + * 判断两个polygon是否相交。 + * borrow from @antv/path-util + * @param points1 polygon1的顶点数组 + * @param points2 polygon2的顶点数组 + */ + + +var isPolygonsIntersect$1 = function isPolygonsIntersect(points1, points2) { + var getBBox = function getBBox(points) { + var xArr = points.map(function (p) { + return p[0]; + }); + var yArr = points.map(function (p) { + return p[1]; + }); + return { + minX: Math.min.apply(null, xArr), + maxX: Math.max.apply(null, xArr), + minY: Math.min.apply(null, yArr), + maxY: Math.max.apply(null, yArr) + }; + }; + + var parseToLines = function parseToLines(points) { + var lines = []; + var count = points.length; + + for (var i = 0; i < count - 1; i++) { + var point = points[i]; + var next = points[i + 1]; + lines.push({ + from: { + x: point[0], + y: point[1] + }, + to: { + x: next[0], + y: next[1] + } + }); + } + + if (lines.length > 1) { + var first = points[0]; + var last = points[count - 1]; + lines.push({ + from: { + x: last[0], + y: last[1] + }, + to: { + x: first[0], + y: first[1] + } + }); + } + + return lines; + }; // 空数组，或者一个点返回 false + + + if (points1.length < 2 || points2.length < 2) { + return false; + } + + var bbox1 = getBBox(points1); + var bbox2 = getBBox(points2); // 判定包围盒是否相交，比判定点是否在多边形内要快的多，可以筛选掉大多数情况 + + if (!intersectBBox(bbox1, bbox2)) { + return false; + } + + var isIn = false; // 判定点是否在多边形内部，一旦有一个点在另一个多边形内，则返回 + + each$2(points2, function (point) { + if (isPointInPolygon(points1, point[0], point[1])) { + isIn = true; + return false; + } + }); + + if (isIn) { + return true; + } + + each$2(points1, function (point) { + if (isPointInPolygon(points2, point[0], point[1])) { + isIn = true; + return false; + } + }); + + if (isIn) { + return true; + } + + var lines1 = parseToLines(points1); + var lines2 = parseToLines(points2); + var isIntersect = false; + each$2(lines2, function (line) { + if (lineIntersectPolygon(lines1, line)) { + isIntersect = true; + return false; + } + }); + return isIntersect; +}; + +var Line$1 = +/** @class */ +function () { + function Line(x1, y1, x2, y2) { + this.x1 = x1; + this.y1 = y1; + this.x2 = x2; + this.y2 = y2; + } + + Line.prototype.getBBox = function () { + var minX = Math.min(this.x1, this.x2); + var minY = Math.min(this.y1, this.y2); + var maxX = Math.max(this.x1, this.x2); + var maxY = Math.max(this.y1, this.y2); + var res = { + x: minX, + y: minY, + minX: minX, + minY: minY, + maxX: maxX, + maxY: maxY, + width: maxX - minX, + height: maxY - minY + }; + return res; + }; + + return Line; +}(); +var getBBoxBoundLine = function getBBoxBoundLine(bbox, direction) { + var bounds = { + top: [bbox.minX, bbox.minY, bbox.maxX, bbox.minY], + left: [bbox.minX, bbox.minY, bbox.minX, bbox.maxY], + bottom: [bbox.minX, bbox.maxY, bbox.maxX, bbox.maxY], + right: [bbox.maxX, bbox.minY, bbox.maxX, bbox.maxY] + }; + return bounds[direction]; +}; +/** + * 计算两条线段相交时，相交点对第一条线段上的分割比例 + */ + +var fractionAlongLineA = function fractionAlongLineA(la, lb) { + var uaT = (lb.x2 - lb.x1) * (la.y1 - lb.y1) - (lb.y2 - lb.y1) * (la.x1 - lb.x1); + var ubT = (la.x2 - la.x1) * (la.y1 - lb.y1) - (la.y2 - la.y1) * (la.x1 - lb.x1); + var uB = (lb.y2 - lb.y1) * (la.x2 - la.x1) - (lb.x2 - lb.x1) * (la.y2 - la.y1); + + if (uB) { + var ua = uaT / uB; + var ub = ubT / uB; + + if (ua >= 0 && ua <= 1 && ub >= 0 && ub <= 1) { + return ua; + } + } + + return Number.POSITIVE_INFINITY; +}; + +var itemIntersectByLine = function itemIntersectByLine(item, line) { + var directions = ['top', 'left', 'bottom', 'right']; + var bbox = item.getBBox(); + var countIntersections = 0; + var intersections = []; + + for (var i = 0; i < 4; i++) { + var _a = getBBoxBoundLine(bbox, directions[i]), + x1 = _a[0], + y1 = _a[1], + x2 = _a[2], + y2 = _a[3]; + + intersections[i] = getLineIntersect({ + x: line.x1, + y: line.y1 + }, { + x: line.x2, + y: line.y2 + }, { + x: x1, + y: y1 + }, { + x: x2, + y: y2 + }); + + if (intersections[i]) { + countIntersections += 1; + } + } + + return [intersections, countIntersections]; +}; +var fractionToLine = function fractionToLine(item, line) { + var directions = ['top', 'left', 'bottom', 'right']; + var bbox = item.getBBox(); + var minDistance = Number.POSITIVE_INFINITY; + var countIntersections = 0; + + for (var i = 0; i < 4; i++) { + var _a = getBBoxBoundLine(bbox, directions[i]), + x1 = _a[0], + y1 = _a[1], + x2 = _a[2], + y2 = _a[3]; + + var testDistance = fractionAlongLineA(line, new Line$1(x1, y1, x2, y2)); + testDistance = Math.abs(testDistance - 0.5); + + if (testDistance >= 0 && testDistance <= 1) { + countIntersections += 1; + minDistance = testDistance < minDistance ? testDistance : minDistance; + } + } + + if (countIntersections === 0) return -1; + return minDistance; +}; +var getPointsCenter = function getPointsCenter(points) { + var centerX = 0; + var centerY = 0; + + if (points.length > 0) { + for (var _i = 0, points_1 = points; _i < points_1.length; _i++) { + var point = points_1[_i]; + centerX += point.x; + centerY += point.y; + } + + centerX /= points.length; + centerY /= points.length; + } + + return { + x: centerX, + y: centerY + }; +}; +var squareDist = function squareDist(a, b) { + return Math.pow(a.x - b.x, 2) + Math.pow(a.y - b.y, 2); +}; +var pointLineSquareDist = function pointLineSquareDist(point, line) { + var x1 = line.x1; + var y1 = line.y1; + var x2 = line.x2 - x1; + var y2 = line.y2 - y1; + var px = point.x - x1; + var py = point.y - y1; + var dotprod = px * x2 + py * y2; + var projlenSq; + + if (dotprod <= 0) { + projlenSq = 0; + } else { + px = x2 - px; + py = y2 - py; + dotprod = px * x2 + py * y2; + + if (dotprod <= 0) { + projlenSq = 0; + } else { + projlenSq = dotprod * dotprod / (x2 * x2 + y2 * y2); + } + } + + var lenSq = px * px + py * py - projlenSq; + + if (lenSq < 0) { + lenSq = 0; + } + + return lenSq; +}; +var isPointsOverlap = function isPointsOverlap(p1, p2, e) { + if (e === void 0) { + e = 1e-3; + } + + return Math.pow(p1.x - p2.x, 2) + Math.pow(p1.y - p2.y, 2) < Math.pow(e, 2); +}; +/** + * 点到矩形的距离的平方：矩形内部点视作距离为0，外部的点若投影落在矩形边上则为点到矩形边的最近的垂直距离，否则为点到矩形顶点的距离， + * @param point IPoint + * @param rect IRect + */ + +var pointRectSquareDist = function pointRectSquareDist(point, rect) { + var isLeft = point.x < rect.x; + var isRight = point.x > rect.x + rect.width; + var isTop = point.y > rect.y + rect.height; + var isBottom = point.y < rect.y; + var isPointOutside = isLeft || isRight || isTop || isBottom; + + if (!isPointOutside) { + return 0; + } + + if (isTop && !isLeft && !isRight) { + return Math.pow(rect.y + rect.height - point.y, 2); + } + + if (isBottom && !isLeft && !isRight) { + return Math.pow(point.y - rect.y, 2); + } + + if (isLeft && !isTop && !isBottom) { + return Math.pow(rect.x - point.x, 2); + } + + if (isRight && !isTop && !isBottom) { + return Math.pow(rect.x + rect.width - point.x, 2); + } + + var dx = Math.min(Math.abs(rect.x - point.x), Math.abs(rect.x + rect.width - point.x)); + var dy = Math.min(Math.abs(rect.y - point.y), Math.abs(rect.y + rect.height - point.y)); + return dx * dx + dy * dy; +}; + +var MathUtil = /*#__PURE__*/Object.freeze({ + __proto__: null, + compare: compare, + getLineIntersect: getLineIntersect, + getRectIntersectByPoint: getRectIntersectByPoint, + getCircleIntersectByPoint: getCircleIntersectByPoint, + getEllipseIntersectByPoint: getEllipseIntersectByPoint, + applyMatrix: applyMatrix$1, + invertMatrix: invertMatrix, + getCircleCenterByPoints: getCircleCenterByPoints, + distance: distance$3, + scaleMatrix: scaleMatrix$1, + floydWarshall: floydWarshall$2, + getAdjMatrix: getAdjMatrix$1, + translate: translate, + move: move, + scale: scale$1, + rotate: rotate$1, + getDegree: getDegree$1, + isPointInPolygon: isPointInPolygon, + intersectBBox: intersectBBox, + isPolygonsIntersect: isPolygonsIntersect$1, + Line: Line$1, + getBBoxBoundLine: getBBoxBoundLine, + itemIntersectByLine: itemIntersectByLine, + fractionToLine: fractionToLine, + getPointsCenter: getPointsCenter, + squareDist: squareDist, + pointLineSquareDist: pointLineSquareDist, + isPointsOverlap: isPointsOverlap, + pointRectSquareDist: pointRectSquareDist +}); + +var subjectColor$1 = 'rgb(95, 149, 255)'; +var backColor$1 = 'rgb(255, 255, 255)'; +var textColor$1 = 'rgb(0, 0, 0)'; +var activeFill = 'rgb(247, 250, 255)'; +var nodeMainFill = 'rgb(239, 244, 255)'; +var comboFill = 'rgb(253, 253, 253)'; +var disabledFill = 'rgb(250, 250, 250)'; +var edgeMainStroke = 'rgb(224, 224, 224)'; +var edgeInactiveStroke = 'rgb(234, 234, 234)'; +var edgeDisablesStroke = 'rgb(245, 245, 245)'; +var inactiveStroke = 'rgb(191, 213, 255)'; +var highlightStroke = '#4572d9'; +var highlightFill = 'rgb(223, 234, 255)'; +var colorSet$1 = { + // for nodes + mainStroke: subjectColor$1, + mainFill: nodeMainFill, + activeStroke: subjectColor$1, + activeFill: activeFill, + inactiveStroke: inactiveStroke, + inactiveFill: activeFill, + selectedStroke: subjectColor$1, + selectedFill: backColor$1, + highlightStroke: highlightStroke, + highlightFill: highlightFill, + disableStroke: edgeMainStroke, + disableFill: disabledFill, + // for edges + edgeMainStroke: edgeMainStroke, + edgeActiveStroke: subjectColor$1, + edgeInactiveStroke: edgeInactiveStroke, + edgeSelectedStroke: subjectColor$1, + edgeHighlightStroke: subjectColor$1, + edgeDisableStroke: edgeDisablesStroke, + // for combos + comboMainStroke: edgeMainStroke, + comboMainFill: comboFill, + comboActiveStroke: subjectColor$1, + comboActiveFill: activeFill, + comboInactiveStroke: edgeMainStroke, + comboInactiveFill: comboFill, + comboSelectedStroke: subjectColor$1, + comboSelectedFill: comboFill, + comboHighlightStroke: highlightStroke, + comboHighlightFill: comboFill, + comboDisableStroke: edgeInactiveStroke, + comboDisableFill: disabledFill +}; +var Global$1 = { + version: '0.2.4', + rootContainerClassName: 'root-container', + nodeContainerClassName: 'node-container', + edgeContainerClassName: 'edge-container', + comboContainerClassName: 'combo-container', + delegateContainerClassName: 'delegate-container', + defaultLoopPosition: 'top', + nodeLabel: { + style: { + fill: '#000', + fontSize: 12, + textAlign: 'center', + textBaseline: 'middle' + }, + offset: 4 // 节点的默认文本不居中时的偏移量 + + }, + defaultNode: { + type: 'circle', + style: { + lineWidth: 1, + stroke: colorSet$1.mainStroke, + fill: nodeMainFill + }, + size: 20, + color: colorSet$1.mainStroke, + linkPoints: { + size: 8, + lineWidth: 1, + fill: colorSet$1.activeFill, + stroke: colorSet$1.activeStroke + } + }, + // 节点应用状态后的样式，默认仅提供 active、selected、highlight、inactive、disable，用户可以自己扩展 + nodeStateStyles: { + active: { + fill: colorSet$1.activeFill, + stroke: colorSet$1.activeStroke, + lineWidth: 2, + shadowColor: colorSet$1.mainStroke, + shadowBlur: 10 + }, + selected: { + fill: colorSet$1.selectedFill, + stroke: colorSet$1.selectedStroke, + lineWidth: 4, + shadowColor: colorSet$1.selectedStroke, + shadowBlur: 10, + 'text-shape': { + fontWeight: 500 + } + }, + highlight: { + fill: colorSet$1.highlightFill, + stroke: colorSet$1.highlightStroke, + lineWidth: 2, + 'text-shape': { + fontWeight: 500 + } + }, + inactive: { + fill: colorSet$1.inactiveFill, + stroke: colorSet$1.inactiveStroke, + lineWidth: 1 + }, + disable: { + fill: colorSet$1.disableFill, + stroke: colorSet$1.disableStroke, + lineWidth: 1 + } + }, + edgeLabel: { + style: { + fill: textColor$1, + textAlign: 'center', + textBaseline: 'middle', + fontSize: 12 + } + }, + defaultEdge: { + type: 'line', + size: 1, + style: { + stroke: colorSet$1.edgeMainStroke, + lineAppendWidth: 2 + }, + color: colorSet$1.edgeMainStroke + }, + // 边应用状态后的样式，默认仅提供 active、selected、highlight、inactive、disable，用户可以自己扩展 + edgeStateStyles: { + active: { + stroke: colorSet$1.edgeActiveStroke, + lineWidth: 1 + }, + selected: { + stroke: colorSet$1.edgeSelectedStroke, + lineWidth: 2, + shadowColor: colorSet$1.edgeSelectedStroke, + shadowBlur: 10, + 'text-shape': { + fontWeight: 500 + } + }, + highlight: { + stroke: colorSet$1.edgeHighlightStroke, + lineWidth: 2, + 'text-shape': { + fontWeight: 500 + } + }, + inactive: { + stroke: colorSet$1.edgeInactiveStroke, + lineWidth: 1 + }, + disable: { + stroke: colorSet$1.edgeDisableStroke, + lineWidth: 1 + } + }, + comboLabel: { + style: { + fill: textColor$1, + // textAlign: 'center', + textBaseline: 'middle', + fontSize: 12 + }, + refY: 10, + refX: 10 // Combo 的默认文本不居中时的偏移量 + + }, + defaultCombo: { + type: 'circle', + style: { + fill: colorSet$1.comboMainFill, + lineWidth: 1, + stroke: colorSet$1.comboMainStroke, + r: 5, + width: 20, + height: 10 + }, + size: [20, 5], + color: colorSet$1.comboMainStroke, + padding: [25, 20, 15, 20] + }, + // combo 应用状态后的样式，默认仅提供 active、selected、highlight、inactive、disable，用户可以自己扩展 + comboStateStyles: { + active: { + stroke: colorSet$1.comboActiveStroke, + lineWidth: 1, + fill: colorSet$1.comboActiveFill + }, + selected: { + stroke: colorSet$1.comboSelectedStroke, + lineWidth: 2, + fill: colorSet$1.comboSelectedFill, + shadowColor: colorSet$1.comboSelectedStroke, + shadowBlur: 10, + 'text-shape': { + fontWeight: 500 + } + }, + highlight: { + stroke: colorSet$1.comboHighlightStroke, + lineWidth: 2, + fill: colorSet$1.comboHighlightFill, + 'text-shape': { + fontWeight: 500 + } + }, + inactive: { + stroke: colorSet$1.comboInactiveStroke, + fill: colorSet$1.comboInactiveFill, + lineWidth: 1 + }, + disable: { + stroke: colorSet$1.comboDisableStroke, + fill: colorSet$1.comboDisableFill, + lineWidth: 1 + } + }, + delegateStyle: { + fill: '#F3F9FF', + fillOpacity: 0.5, + stroke: '#1890FF', + strokeOpacity: 0.9, + lineDash: [5, 5] + } +}; + +var ModeController = +/** @class */ +function () { + function ModeController(graph) { + this.graph = graph; + this.destroyed = false; + this.modes = graph.get('modes') || { + default: [] + }; + this.formatModes(); + this.mode = graph.get('defaultMode') || 'default'; + this.currentBehaves = []; + this.setMode(this.mode); + } + + ModeController.prototype.formatModes = function () { + var modes = this.modes; + each$2(modes, function (mode) { + each$2(mode, function (behavior, i) { + if (isString$3(behavior)) { + mode[i] = { + type: behavior + }; + } + }); + }); + }; + + ModeController.prototype.setBehaviors = function (mode) { + var graph = this.graph; + var behaviors = this.modes[mode]; + var behaves = []; + var behave; + each$2(behaviors || [], function (behavior) { + var BehaviorInstance = Behavior.getBehavior(behavior.type || behavior); + + if (!BehaviorInstance) { + return; + } + + behave = new BehaviorInstance(behavior); + + if (behave) { + behave.bind(graph); + behaves.push(behave); + } + }); + this.currentBehaves = behaves; + }; + + ModeController.mergeBehaviors = function (modeBehaviors, behaviors) { + each$2(behaviors, function (behavior) { + if (modeBehaviors.indexOf(behavior) < 0) { + if (isString$3(behavior)) { + behavior = { + type: behavior + }; + } + + modeBehaviors.push(behavior); + } + }); + return modeBehaviors; + }; + + ModeController.filterBehaviors = function (modeBehaviors, behaviors) { + var result = []; + modeBehaviors.forEach(function (behavior) { + var type = ''; + + if (isString$3(behavior)) { + type = behavior; + } else { + // eslint-disable-next-line prefer-destructuring + type = behavior.type; + } + + if (behaviors.indexOf(type) < 0) { + result.push(behavior); + } + }); + return result; + }; + + ModeController.prototype.setMode = function (mode) { + var _a = this, + modes = _a.modes, + graph = _a.graph; + + var current = mode; + var behaviors = modes[current]; + + if (!behaviors) { + return; + } + + graph.emit('beforemodechange', { + mode: mode + }); + each$2(this.currentBehaves, function (behave) { + if (behave.delegate) behave.delegate.remove(); + behave.unbind(graph); + }); + this.setBehaviors(current); + graph.emit('aftermodechange', { + mode: mode + }); + this.mode = mode; + }; + + ModeController.prototype.getMode = function () { + return this.mode; + }; + /** + * 动态增加或删除 Behavior + * + * @param {ModeType[]} behaviors + * @param {(ModeType[] | ModeType)} modes + * @param {boolean} isAdd + * @returns {Mode} + * @memberof Mode + */ + + + ModeController.prototype.manipulateBehaviors = function (behaviors, modes, isAdd) { + var _this = this; + + var behaves; + + if (!isArray$n(behaviors)) { + behaves = [behaviors]; + } else { + behaves = behaviors; + } + + if (isArray$n(modes)) { + each$2(modes, function (mode) { + if (!_this.modes[mode]) { + if (isAdd) { + _this.modes[mode] = behaves; + } + } else if (isAdd) { + _this.modes[mode] = ModeController.mergeBehaviors(_this.modes[mode] || [], behaves); + } else { + _this.modes[mode] = ModeController.filterBehaviors(_this.modes[mode] || [], behaves); + } + }); + return this; + } + + var currentMode = modes; + + if (!modes) { + currentMode = this.mode; // isString(this.mode) ? this.mode : this.mode.type + } + + if (!this.modes[currentMode]) { + if (isAdd) { + this.modes[currentMode] = behaves; + } + } + + if (isAdd) { + this.modes[currentMode] = ModeController.mergeBehaviors(this.modes[currentMode] || [], behaves); + } else { + this.modes[currentMode] = ModeController.filterBehaviors(this.modes[currentMode] || [], behaves); + } + + this.setMode(this.mode); + return this; + }; + /** + * 更新行为参数 + * @param {string | ModeOption | ModeType} behavior 需要更新的行为 + * @param {string | string[]} modes 指定的模式中的行为，不指定则为 default + * @return {Graph} Graph + */ + + + ModeController.prototype.updateBehavior = function (behavior, newCfg, mode) { + if (isString$3(behavior)) { + behavior = { + type: behavior + }; + } + + var behaviorSet = []; + + if (!mode || mode === this.mode || mode === 'default') { + behaviorSet = this.currentBehaves; + + if (!behaviorSet || !behaviorSet.length) { + console.warn('Update behavior failed! There is no behaviors in this mode on the graph.'); + return this; + } + + var length_1 = behaviorSet.length; + + for (var i = 0; i < length_1; i++) { + var behave = behaviorSet[i]; + + if (behave.type === behavior.type) { + behave.updateCfg(newCfg); + return this; + } + + if (i === length_1 - 1) console.warn('Update behavior failed! There is no such behavior in the mode'); + } + } else { + behaviorSet = this.modes[mode]; + + if (!behaviorSet || !behaviorSet.length) { + console.warn('Update behavior failed! There is no behaviors in this mode on the graph.'); + return this; + } + + var length_2 = behaviorSet.length; + + for (var i = 0; i < length_2; i++) { + var behave = behaviorSet[i]; + + if (behave.type === behavior.type || behave === behavior.type) { + if (behave === behavior.type) behave = { + type: behave + }; + Object.assign(behave, newCfg); + behaviorSet[i] = behave; + return this; + } + + if (i === length_2 - 1) console.warn('Update behavior failed! There is no such behavior in the mode'); + } + } + + return this; + }; + + ModeController.prototype.destroy = function () { + this.graph = null; + this.modes = null; + this.currentBehaves = null; + this.destroyed = true; + }; + + return ModeController; +}(); + +var G6GraphEvent = +/** @class */ +function (_super) { + __extends$e(G6GraphEvent, _super); + + function G6GraphEvent(type, event) { + var _this = _super.call(this, type, event) || this; + + _this.item = event.item; + _this.canvasX = event.canvasX; + _this.canvasY = event.canvasY; + _this.wheelDelta = event.wheelDelta; + _this.detail = event.detail; + return _this; + } + + return G6GraphEvent; +}(GraphEvent$1); + +var uniqueId$1 = function uniqueId(type) { + return type + "-" + Math.random() + Date.now(); +}; +/** + * turn padding into [top, right, bottom, right] + * @param {Number|Array} padding input padding + * @return {array} output + */ + +var formatPadding = function formatPadding(padding) { + var top = 0; + var left = 0; + var right = 0; + var bottom = 0; + + if (isNumber$4(padding)) { + top = left = right = bottom = padding; + } else if (isString$3(padding)) { + var intPadding = parseInt(padding, 10); + top = left = right = bottom = intPadding; + } else if (isArray$n(padding)) { + top = padding[0]; + right = !isNil(padding[1]) ? padding[1] : padding[0]; + bottom = !isNil(padding[2]) ? padding[2] : padding[0]; + left = !isNil(padding[3]) ? padding[3] : right; + } + + return [top, right, bottom, left]; +}; +/** + * clone event + * @param e + */ + +var cloneEvent$2 = function cloneEvent(e) { + var event = new G6GraphEvent(e.type, e); + event.clientX = e.clientX; + event.clientY = e.clientY; + event.x = e.x; + event.y = e.y; + event.target = e.target; + event.currentTarget = e.currentTarget; + event.bubbles = true; + event.item = e.item; + return event; +}; +/** + * 判断 viewport 是否改变，通过和单位矩阵对比 + * @param matrix Viewport 的 Matrix + */ + +var isViewportChanged$1 = function isViewportChanged(matrix) { + // matrix 为 null， 则说明没有变化 + if (!matrix) { + return false; + } + + var MATRIX_LEN = 9; + var ORIGIN_MATRIX = [1, 0, 0, 0, 1, 0, 0, 0, 1]; + + for (var i = 0; i < MATRIX_LEN; i++) { + if (matrix[i] !== ORIGIN_MATRIX[i]) { + return true; + } + } + + return false; +}; +var isNaN$3 = function isNaN(input) { + return Number.isNaN(Number(input)); +}; +/** + * 计算一组 Item 的 BBox + * @param items 选中的一组Item，可以是 node 或 combo + */ + +var calculationItemsBBox$1 = function calculationItemsBBox(items) { + var minx = Infinity; + var maxx = -Infinity; + var miny = Infinity; + var maxy = -Infinity; // 获取已节点的所有最大最小x y值 + + for (var i = 0; i < items.length; i++) { + var element = items[i]; + var bbox = element.getBBox(); + var minX = bbox.minX, + minY = bbox.minY, + maxX = bbox.maxX, + maxY = bbox.maxY; + + if (minX < minx) { + minx = minX; + } + + if (minY < miny) { + miny = minY; + } + + if (maxX > maxx) { + maxx = maxX; + } + + if (maxY > maxy) { + maxy = maxY; + } + } + + var x = Math.floor(minx); + var y = Math.floor(miny); + var width = Math.ceil(maxx) - Math.floor(minx); + var height = Math.ceil(maxy) - Math.floor(miny); + return { + x: x, + y: y, + width: width, + height: height, + minX: minx, + minY: miny, + maxX: maxx, + maxY: maxy + }; +}; +/** + * 若 edges 中存在两端点相同的边，使用 quadratic 边并自动计算 curveOffset 使它们不相互重叠 + * 文档: https://g6.antv.vision/en/docs/api/Util + * @param edges 边数据集合 + * @param offsetDiff 相邻两边的 offset 之差 + * @param multiEdgeType + * @param singleEdgeType + * @param loopEdgeType + */ + +var processParallelEdges = function processParallelEdges(edges, offsetDiff, multiEdgeType, singleEdgeType, loopEdgeType) { + if (offsetDiff === void 0) { + offsetDiff = 15; + } + + if (multiEdgeType === void 0) { + multiEdgeType = 'quadratic'; + } + + if (singleEdgeType === void 0) { + singleEdgeType = undefined; + } + + if (loopEdgeType === void 0) { + loopEdgeType = undefined; + } + + var len = edges.length; + var cod = offsetDiff * 2; + var loopPosition = ['top', 'top-right', 'right', 'bottom-right', 'bottom', 'bottom-left', 'left', 'top-left']; + var edgeMap = {}; + var tags = []; + var reverses = {}; + + for (var i = 0; i < len; i++) { + var edge = edges[i]; + var source = edge.source, + target = edge.target; + var sourceTarget = source + "-" + target; + if (tags[i]) continue; + + if (!edgeMap[sourceTarget]) { + edgeMap[sourceTarget] = []; + } + + tags[i] = true; + edgeMap[sourceTarget].push(edge); + + for (var j = 0; j < len; j++) { + if (i === j) continue; + var sedge = edges[j]; + var src = sedge.source; + var dst = sedge.target; // 两个节点之间共同的边 + // 第一条的source = 第二条的target + // 第一条的target = 第二条的source + + if (!tags[j]) { + if (source === dst && target === src) { + edgeMap[sourceTarget].push(sedge); + tags[j] = true; + reverses[src + "|" + dst + "|" + (edgeMap[sourceTarget].length - 1)] = true; + } else if (source === src && target === dst) { + edgeMap[sourceTarget].push(sedge); + tags[j] = true; + } + } + } + } + + for (var key in edgeMap) { + var arcEdges = edgeMap[key]; + var length_1 = arcEdges.length; + + for (var k = 0; k < length_1; k++) { + var current = arcEdges[k]; + + if (current.source === current.target) { + if (loopEdgeType) current.type = loopEdgeType; // 超过8条自环边，则需要重新处理 + + current.loopCfg = { + position: loopPosition[k % 8], + dist: Math.floor(k / 8) * 20 + 50 + }; + continue; + } + + if (length_1 === 1 && singleEdgeType && current.source !== current.target) { + current.type = singleEdgeType; + continue; + } + + current.type = multiEdgeType; + var sign = (k % 2 === 0 ? 1 : -1) * (reverses[current.source + "|" + current.target + "|" + k] ? -1 : 1); + + if (length_1 % 2 === 1) { + current.curveOffset = sign * Math.ceil(k / 2) * cod; + } else { + current.curveOffset = sign * (Math.floor(k / 2) * cod + offsetDiff); + } + } + } + + return edges; +}; + +var BaseUtil = /*#__PURE__*/Object.freeze({ + __proto__: null, + uniqueId: uniqueId$1, + formatPadding: formatPadding, + cloneEvent: cloneEvent$2, + isViewportChanged: isViewportChanged$1, + isNaN: isNaN$3, + calculationItemsBBox: calculationItemsBBox$1, + processParallelEdges: processParallelEdges +}); + +var ViewController = +/** @class */ +function () { + function ViewController(graph) { + this.destroyed = false; + this.graph = graph; + this.destroyed = false; + } // get view center coordinate + + + ViewController.prototype.getViewCenter = function () { + var padding = this.getFormatPadding(); + var graph = this.graph; + var width = this.graph.get('width'); + var height = graph.get('height'); + return { + x: (width - padding[1] - padding[3]) / 2 + padding[3], + y: (height - padding[0] - padding[2]) / 2 + padding[0] + }; + }; + + ViewController.prototype.fitCenter = function () { + var graph = this.graph; + var group = graph.get('group'); + group.resetMatrix(); + var bbox = group.getCanvasBBox(); + if (bbox.width === 0 || bbox.height === 0) return; + var viewCenter = this.getViewCenter(); + var groupCenter = { + x: bbox.x + bbox.width / 2, + y: bbox.y + bbox.height / 2 + }; + graph.translate(viewCenter.x - groupCenter.x, viewCenter.y - groupCenter.y); + }; // fit view graph + + + ViewController.prototype.fitView = function () { + var graph = this.graph; + var padding = this.getFormatPadding(); + var width = graph.get('width'); + var height = graph.get('height'); + var group = graph.get('group'); + group.resetMatrix(); + var bbox = group.getCanvasBBox(); + if (bbox.width === 0 || bbox.height === 0) return; + var viewCenter = this.getViewCenter(); + var groupCenter = { + x: bbox.x + bbox.width / 2, + y: bbox.y + bbox.height / 2 + }; + graph.translate(viewCenter.x - groupCenter.x, viewCenter.y - groupCenter.y); + var w = (width - padding[1] - padding[3]) / bbox.width; + var h = (height - padding[0] - padding[2]) / bbox.height; + var ratio = w; + + if (w > h) { + ratio = h; + } + + graph.zoom(ratio, viewCenter); + }; + + ViewController.prototype.getFormatPadding = function () { + var padding = this.graph.get('fitViewPadding'); + return formatPadding(padding); + }; + + ViewController.prototype.focusPoint = function (point, animate, animateCfg) { + var _this = this; + + var viewCenter = this.getViewCenter(); + var modelCenter = this.getPointByCanvas(viewCenter.x, viewCenter.y); + var viewportMatrix = this.graph.get('group').getMatrix(); + if (!viewportMatrix) viewportMatrix = [1, 0, 0, 0, 1, 0, 0, 0, 1]; + + if (animate) { + var dx_1 = (modelCenter.x - point.x) * viewportMatrix[0]; + var dy_1 = (modelCenter.y - point.y) * viewportMatrix[4]; + var lastX_1 = 0; + var lastY_1 = 0; + var newX_1 = 0; + var newY_1 = 0; // 动画每次平移一点，直到目标位置 + + this.graph.get('canvas').animate(function (ratio) { + newX_1 = dx_1 * ratio; + newY_1 = dy_1 * ratio; + + _this.graph.translate(newX_1 - lastX_1, newY_1 - lastY_1); + + lastX_1 = newX_1; + lastY_1 = newY_1; + }, __assign$r({}, animateCfg)); + } else { + this.graph.translate((modelCenter.x - point.x) * viewportMatrix[0], (modelCenter.y - point.y) * viewportMatrix[4]); + } + }; + /** + * 将 Canvas 坐标转成视口坐标 + * @param canvasX canvas x 坐标 + * @param canvasY canvas y 坐标 + */ + + + ViewController.prototype.getPointByCanvas = function (canvasX, canvasY) { + var viewportMatrix = this.graph.get('group').getMatrix(); + + if (!viewportMatrix) { + viewportMatrix = [1, 0, 0, 0, 1, 0, 0, 0, 1]; + } + + var point = invertMatrix({ + x: canvasX, + y: canvasY + }, viewportMatrix); + return point; + }; + /** + * 将页面坐标转成视口坐标 + * @param clientX 页面 x 坐标 + * @param clientY 页面 y 坐标 + */ + + + ViewController.prototype.getPointByClient = function (clientX, clientY) { + var canvas = this.graph.get('canvas'); + var canvasPoint = canvas.getPointByClient(clientX, clientY); + return this.getPointByCanvas(canvasPoint.x, canvasPoint.y); + }; + /** + * 将视口坐标转成页面坐标 + * @param x 视口 x 坐标 + * @param y 视口 y 坐标 + */ + + + ViewController.prototype.getClientByPoint = function (x, y) { + var canvas = this.graph.get('canvas'); + var canvasPoint = this.getCanvasByPoint(x, y); + var point = canvas.getClientByPoint(canvasPoint.x, canvasPoint.y); + return { + x: point.x, + y: point.y + }; + }; + /** + * 将视口坐标转成 Canvas 坐标 + * @param x 视口 x 坐标 + * @param y 视口 y 坐标 + */ + + + ViewController.prototype.getCanvasByPoint = function (x, y) { + var viewportMatrix = this.graph.get('group').getMatrix(); + + if (!viewportMatrix) { + viewportMatrix = [1, 0, 0, 0, 1, 0, 0, 0, 1]; + } + + return applyMatrix$1({ + x: x, + y: y + }, viewportMatrix); + }; + /** + * 将元素移动到画布中心 + * @param item Item 实例或 id + * @param {boolean} animate 是否带有动画地移动 + * @param {GraphAnimateConfig} animateCfg 若带有动画，动画的配置项 + */ + + + ViewController.prototype.focus = function (item, animate, animateCfg) { + if (isString$3(item)) { + item = this.graph.findById(item); + } + + var group = item.get('group'); + var matrix = group.getMatrix(); + if (!matrix) matrix = [1, 0, 0, 0, 1, 0, 0, 0, 1]; + + if (item) { + // 用实际位置而不是model中的x,y,防止由于拖拽等的交互导致model的x,y并不是当前的x,y + this.focusPoint({ + x: matrix[6], + y: matrix[7] + }, animate, animateCfg); + } + }; + /** + * 改变 canvas 画布的宽度和高度 + * @param width canvas 宽度 + * @param height canvas 高度 + */ + + + ViewController.prototype.changeSize = function (width, height) { + var graph = this.graph; + + if (!isNumber$4(width) || !isNumber$4(height)) { + throw Error('invalid canvas width & height, please make sure width & height type is number'); + } + + graph.set({ + width: width, + height: height + }); + var canvas = graph.get('canvas'); + canvas.changeSize(width, height); // change the size of grid plugin if it exists on graph + + var plugins = graph.get('plugins'); + plugins.forEach(function (plugin) { + if (plugin.get('gridContainer')) { + var minZoom = graph.get('minZoom'); + modifyCSS(plugin.get('container'), { + width: width + "px", + height: height + "px" + }); + modifyCSS(plugin.get('gridContainer'), { + width: width / minZoom + "px", + height: height / minZoom + "px", + left: 0, + top: 0 + }); + } + }); + }; + + ViewController.prototype.destroy = function () { + this.graph = null; + this.destroyed = false; + }; + + return ViewController; +}(); + +var letterAspectRatio = { + ' ': 0.3329986572265625, + a: 0.5589996337890625, + A: 0.6569992065429687, + b: 0.58599853515625, + B: 0.6769989013671875, + c: 0.5469985961914062, + C: 0.7279998779296875, + d: 0.58599853515625, + D: 0.705999755859375, + e: 0.554998779296875, + E: 0.63699951171875, + f: 0.37299957275390627, + F: 0.5769989013671875, + g: 0.5909988403320312, + G: 0.7479995727539063, + h: 0.555999755859375, + H: 0.7199996948242188, + i: 0.255999755859375, + I: 0.23699951171875, + j: 0.26699981689453123, + J: 0.5169998168945312, + k: 0.5289993286132812, + K: 0.6899993896484375, + l: 0.23499908447265624, + L: 0.5879989624023437, + m: 0.854998779296875, + M: 0.8819992065429687, + n: 0.5589996337890625, + N: 0.7189987182617188, + o: 0.58599853515625, + O: 0.7669998168945312, + p: 0.58599853515625, + P: 0.6419998168945312, + q: 0.58599853515625, + Q: 0.7669998168945312, + r: 0.3649993896484375, + R: 0.6759994506835938, + s: 0.504998779296875, + S: 0.6319992065429687, + t: 0.354998779296875, + T: 0.6189987182617187, + u: 0.5599990844726562, + U: 0.7139999389648437, + v: 0.48199920654296874, + V: 0.6389999389648438, + w: 0.754998779296875, + W: 0.929998779296875, + x: 0.5089996337890625, + X: 0.63699951171875, + y: 0.4959991455078125, + Y: 0.66199951171875, + z: 0.48699951171875, + Z: 0.6239990234375, + '0': 0.6, + '1': 0.40099945068359377, + '2': 0.6, + '3': 0.6, + '4': 0.6, + '5': 0.6, + '6': 0.6, + '7': 0.5469985961914062, + '8': 0.6, + '9': 0.6, + '[': 0.3329986572265625, + ']': 0.3329986572265625, + ',': 0.26399993896484375, + '.': 0.26399993896484375, + ';': 0.26399993896484375, + ':': 0.26399993896484375, + '{': 0.3329986572265625, + '}': 0.3329986572265625, + '\\': 0.5, + '|': 0.19499969482421875, + '=': 0.604998779296875, + '+': 0.604998779296875, + '-': 0.604998779296875, + _: 0.5, + '`': 0.3329986572265625, + ' ~': 0.8329986572265625, + '!': 0.3329986572265625, + '@': 0.8579986572265625, + '#': 0.6, + $: 0.6, + '%': 0.9699996948242188, + '^': 0.517999267578125, + '&': 0.7259994506835937, + '*': 0.505999755859375, + '(': 0.3329986572265625, + ')': 0.3329986572265625, + '<': 0.604998779296875, + '>': 0.604998779296875, + '/': 0.5, + '?': 0.53699951171875 +}; + +var PI = Math.PI, + sin = Math.sin, + cos = Math.cos; // 一共支持8个方向的自环，每个环占的角度是45度，在计算时再二分，为22.5度 + +var SELF_LINK_SIN = sin(PI / 8); +var SELF_LINK_COS = cos(PI / 8); +var getBBox$1 = function getBBox(element, group) { + var bbox = element.getBBox(); + var leftTop = { + x: bbox.minX, + y: bbox.minY + }; + var rightBottom = { + x: bbox.maxX, + y: bbox.maxY + }; // 根据父元素变换矩阵 + + if (group) { + var matrix = group.getMatrix(); + + if (!matrix) { + matrix = [1, 0, 0, 0, 1, 0, 0, 0, 1]; + } + + leftTop = applyMatrix$1(leftTop, matrix); + rightBottom = applyMatrix$1(rightBottom, matrix); + } + + var lx = leftTop.x, + ly = leftTop.y; + var rx = rightBottom.x, + ry = rightBottom.y; + return { + x: lx, + y: ly, + minX: lx, + minY: ly, + maxX: rx, + maxY: ry, + width: rx - lx, + height: ry - ly + }; +}; +/** + * get loop edge config + * @param cfg edge config + */ + +var getLoopCfgs = function getLoopCfgs(cfg) { + var item = cfg.sourceNode || cfg.targetNode; + var container = item.get('group'); + var containerMatrix = container.getMatrix(); + if (!containerMatrix) containerMatrix = [1, 0, 0, 0, 1, 0, 0, 0, 1]; + var keyShape = item.getKeyShape(); + var bbox = keyShape.getBBox(); + var loopCfg = cfg.loopCfg || {}; // 距离keyShape边的最高距离 + + var dist = loopCfg.dist || Math.max(bbox.width, bbox.height) * 2; // 自环边与keyShape的相对位置关系 + + var position = loopCfg.position || Global$1.defaultLoopPosition; // 中心取group上真实位置 + + var center = [containerMatrix[6], containerMatrix[7]]; + var startPoint = [cfg.startPoint.x, cfg.startPoint.y]; + var endPoint = [cfg.endPoint.x, cfg.endPoint.y]; + var rstart = bbox.height / 2; + var rend = bbox.height / 2; + var sinDeltaStart = rstart * SELF_LINK_SIN; + var cosDeltaStart = rstart * SELF_LINK_COS; + var sinDeltaEnd = rend * SELF_LINK_SIN; + var cosDeltaEnd = rend * SELF_LINK_COS; // 如果定义了锚点的，直接用锚点坐标，否则，根据自环的 cfg 计算 + + if (startPoint[0] === endPoint[0] && startPoint[1] === endPoint[1]) { + switch (position) { + case 'top': + startPoint = [center[0] - sinDeltaStart, center[1] - cosDeltaStart]; + endPoint = [center[0] + sinDeltaEnd, center[1] - cosDeltaEnd]; + break; + + case 'top-right': + rstart = bbox.height / 2; + rend = bbox.width / 2; + sinDeltaStart = rstart * SELF_LINK_SIN; + cosDeltaStart = rstart * SELF_LINK_COS; + sinDeltaEnd = rend * SELF_LINK_SIN; + cosDeltaEnd = rend * SELF_LINK_COS; + startPoint = [center[0] + sinDeltaStart, center[1] - cosDeltaStart]; + endPoint = [center[0] + cosDeltaEnd, center[1] - sinDeltaEnd]; + break; + + case 'right': + rstart = bbox.width / 2; + rend = bbox.width / 2; + sinDeltaStart = rstart * SELF_LINK_SIN; + cosDeltaStart = rstart * SELF_LINK_COS; + sinDeltaEnd = rend * SELF_LINK_SIN; + cosDeltaEnd = rend * SELF_LINK_COS; + startPoint = [center[0] + cosDeltaStart, center[1] - sinDeltaStart]; + endPoint = [center[0] + cosDeltaEnd, center[1] + sinDeltaEnd]; + break; + + case 'bottom-right': + rstart = bbox.width / 2; + rend = bbox.height / 2; + sinDeltaStart = rstart * SELF_LINK_SIN; + cosDeltaStart = rstart * SELF_LINK_COS; + sinDeltaEnd = rend * SELF_LINK_SIN; + cosDeltaEnd = rend * SELF_LINK_COS; + startPoint = [center[0] + cosDeltaStart, center[1] + sinDeltaStart]; + endPoint = [center[0] + sinDeltaEnd, center[1] + cosDeltaEnd]; + break; + + case 'bottom': + rstart = bbox.height / 2; + rend = bbox.height / 2; + sinDeltaStart = rstart * SELF_LINK_SIN; + cosDeltaStart = rstart * SELF_LINK_COS; + sinDeltaEnd = rend * SELF_LINK_SIN; + cosDeltaEnd = rend * SELF_LINK_COS; + startPoint = [center[0] + sinDeltaStart, center[1] + cosDeltaStart]; + endPoint = [center[0] - sinDeltaEnd, center[1] + cosDeltaEnd]; + break; + + case 'bottom-left': + rstart = bbox.height / 2; + rend = bbox.width / 2; + sinDeltaStart = rstart * SELF_LINK_SIN; + cosDeltaStart = rstart * SELF_LINK_COS; + sinDeltaEnd = rend * SELF_LINK_SIN; + cosDeltaEnd = rend * SELF_LINK_COS; + startPoint = [center[0] - sinDeltaStart, center[1] + cosDeltaStart]; + endPoint = [center[0] - cosDeltaEnd, center[1] + sinDeltaEnd]; + break; + + case 'left': + rstart = bbox.width / 2; + rend = bbox.width / 2; + sinDeltaStart = rstart * SELF_LINK_SIN; + cosDeltaStart = rstart * SELF_LINK_COS; + sinDeltaEnd = rend * SELF_LINK_SIN; + cosDeltaEnd = rend * SELF_LINK_COS; + startPoint = [center[0] - cosDeltaStart, center[1] + sinDeltaStart]; + endPoint = [center[0] - cosDeltaEnd, center[1] - sinDeltaEnd]; + break; + + case 'top-left': + rstart = bbox.width / 2; + rend = bbox.height / 2; + sinDeltaStart = rstart * SELF_LINK_SIN; + cosDeltaStart = rstart * SELF_LINK_COS; + sinDeltaEnd = rend * SELF_LINK_SIN; + cosDeltaEnd = rend * SELF_LINK_COS; + startPoint = [center[0] - cosDeltaStart, center[1] - sinDeltaStart]; + endPoint = [center[0] - sinDeltaEnd, center[1] - cosDeltaEnd]; + break; + + default: + rstart = bbox.width / 2; + rend = bbox.width / 2; + sinDeltaStart = rstart * SELF_LINK_SIN; + cosDeltaStart = rstart * SELF_LINK_COS; + sinDeltaEnd = rend * SELF_LINK_SIN; + cosDeltaEnd = rend * SELF_LINK_COS; + startPoint = [center[0] - sinDeltaStart, center[1] - cosDeltaStart]; + endPoint = [center[0] + sinDeltaEnd, center[1] - cosDeltaEnd]; + } // 如果逆时针画，交换起点和终点 + + + if (loopCfg.clockwise === false) { + var swap = [startPoint[0], startPoint[1]]; + startPoint = [endPoint[0], endPoint[1]]; + endPoint = [swap[0], swap[1]]; + } + } + + var startVec = [startPoint[0] - center[0], startPoint[1] - center[1]]; + var scaleRateStart = (rstart + dist) / rstart; + var scaleRateEnd = (rend + dist) / rend; + + if (loopCfg.clockwise === false) { + scaleRateStart = (rend + dist) / rend; + scaleRateEnd = (rstart + dist) / rstart; + } + + var startExtendVec = scale$4([0, 0], startVec, scaleRateStart); + var controlPoint1 = [center[0] + startExtendVec[0], center[1] + startExtendVec[1]]; + var endVec = [endPoint[0] - center[0], endPoint[1] - center[1]]; + var endExtendVec = scale$4([0, 0], endVec, scaleRateEnd); + var controlPoint2 = [center[0] + endExtendVec[0], center[1] + endExtendVec[1]]; + cfg.startPoint = { + x: startPoint[0], + y: startPoint[1] + }; + cfg.endPoint = { + x: endPoint[0], + y: endPoint[1] + }; + cfg.controlPoints = [{ + x: controlPoint1[0], + y: controlPoint1[1] + }, { + x: controlPoint2[0], + y: controlPoint2[1] + }]; + return cfg; +}; +/** + * 根据 label 所在线条的位置百分比，计算 label 坐标 + * @param {object} pathShape G 的 path 实例，一般是 Edge 实例的 keyShape + * @param {number} percent 范围 0 - 1 的线条百分比 + * @param {number} refX x 轴正方向为基准的 label 偏移 + * @param {number} refY y 轴正方向为基准的 label 偏移 + * @param {boolean} rotate 是否根据线条斜率旋转文本 + * @return {object} 文本的 x, y, 文本的旋转角度 + */ + +var getLabelPosition = function getLabelPosition(pathShape, percent, refX, refY, rotate) { + var TAN_OFFSET = 0.0001; + var vector = []; + var point = pathShape.getPoint(percent); + + if (point === null) { + return { + x: 0, + y: 0, + angle: 0 + }; + } // 头尾最可能，放在最前面，使用 g path 上封装的方法 + + + if (percent < TAN_OFFSET) { + vector = pathShape.getStartTangent().reverse(); + } else if (percent > 1 - TAN_OFFSET) { + vector = pathShape.getEndTangent(); + } else { + // 否则取指定位置的点,与少量偏移的点，做微分向量 + var offsetPoint = pathShape.getPoint(percent + TAN_OFFSET); + vector.push([point.x, point.y]); + vector.push([offsetPoint.x, offsetPoint.y]); + } + + var rad = Math.atan2(vector[1][1] - vector[0][1], vector[1][0] - vector[0][0]); + + if (rad < 0) { + rad += PI * 2; + } + + if (refX) { + point.x += cos(rad) * refX; + point.y += sin(rad) * refX; + } + + if (refY) { + // 默认方向是 x 轴正方向，法线是 求出角度 - 90° + var normal = rad - PI / 2; // 若法线角度在 y 轴负方向，切到正方向，保证 refY 相对于 y 轴正方向 + + if (rad > 1 / 2 * PI && rad < 3 * 1 / 2 * PI) { + normal -= PI; + } + + point.x += cos(normal) * refY; + point.y += sin(normal) * refY; + } + + var result = { + x: point.x, + y: point.y, + angle: rad + }; + + if (rotate) { + if (rad > 1 / 2 * PI && rad < 3 * 1 / 2 * PI) { + rad -= PI; + } + + return __assign$r({ + rotate: rad + }, result); + } + + return result; +}; +/** + * depth first traverse, from root to leaves, children in inverse order + * if the fn returns false, terminate the traverse + */ + +var traverse = function traverse(data, fn) { + if (fn(data) === false) { + return false; + } + + if (data && data.children) { + for (var i = data.children.length - 1; i >= 0; i--) { + if (!traverse(data.children[i], fn)) return false; + } + } + + return true; +}; +/** + * depth first traverse, from leaves to root, children in inverse order + * if the fn returns false, terminate the traverse + */ + + +var traverseUp$1 = function traverseUp(data, fn) { + if (data && data.children) { + for (var i = data.children.length - 1; i >= 0; i--) { + if (!traverseUp(data.children[i], fn)) return; + } + } + + if (fn(data) === false) { + return false; + } + + return true; +}; +/** + * depth first traverse, from root to leaves, children in inverse order + * if the fn returns false, terminate the traverse + */ + + +var traverseTree$2 = function traverseTree(data, fn) { + if (typeof fn !== 'function') { + return; + } + + traverse(data, fn); +}; +/** + * depth first traverse, from leaves to root, children in inverse order + * if the fn returns false, terminate the traverse + */ + +var traverseTreeUp$1 = function traverseTreeUp(data, fn) { + if (typeof fn !== 'function') { + return; + } + + traverseUp$1(data, fn); +}; +/** + * + * @param letter the letter + * @param fontSize + * @return the letter's width + */ + +var getLetterWidth = function getLetterWidth(letter, fontSize) { + return fontSize * (letterAspectRatio[letter] || 1); +}; +/** + * + * @param text the text + * @param fontSize + * @return the text's size + */ + +var getTextSize = function getTextSize(text, fontSize) { + var width = 0; + var pattern = new RegExp("[\u4E00-\u9FA5]+"); + text.split('').forEach(function (letter) { + if (pattern.test(letter)) { + // 中文字符 + width += fontSize; + } else { + width += getLetterWidth(letter, fontSize); + } + }); + return [width, fontSize]; +}; +/** + * construct the trees from combos data + * @param array the combos array + * @param nodes the nodes array + * @return the tree + */ + +var plainCombosToTrees = function plainCombosToTrees(array, nodes) { + var result = []; + var addedMap = {}; + var modelMap = {}; + array.forEach(function (d) { + modelMap[d.id] = d; + }); + array.forEach(function (d, i) { + var cd = clone$7(d); + cd.itemType = 'combo'; + cd.children = undefined; + + if (cd.parentId === cd.id) { + console.warn("The parentId for combo " + cd.id + " can not be the same as the combo's id"); + delete cd.parentId; + } else if (cd.parentId && !modelMap[cd.parentId]) { + console.warn("The parent combo for combo " + cd.id + " does not exist!"); + delete cd.parentId; + } + + var mappedObj = addedMap[cd.id]; + + if (mappedObj) { + cd.children = mappedObj.children; + addedMap[cd.id] = cd; + mappedObj = cd; + + if (!mappedObj.parentId) { + result.push(mappedObj); + return; + } + + var mappedParent = addedMap[mappedObj.parentId]; + + if (mappedParent) { + if (mappedParent.children) mappedParent.children.push(cd);else mappedParent.children = [cd]; + } else { + var parent_1 = { + id: mappedObj.parentId, + children: [mappedObj] + }; + addedMap[mappedObj.parentId] = parent_1; + addedMap[cd.id] = cd; + } + + return; + } + + if (isString$3(d.parentId)) { + var parent_2 = addedMap[d.parentId]; + + if (parent_2) { + if (parent_2.children) parent_2.children.push(cd);else parent_2.children = [cd]; + addedMap[cd.id] = cd; + } else { + var pa = { + id: d.parentId, + children: [cd] + }; + addedMap[pa.id] = pa; + addedMap[cd.id] = cd; + } + } else { + result.push(cd); + addedMap[cd.id] = cd; + } + }); // proccess the nodes + + var nodeMap = {}; + (nodes || []).forEach(function (node) { + nodeMap[node.id] = node; + var combo = addedMap[node.comboId]; + + if (combo) { + var cnode = { + id: node.id, + comboId: node.comboId + }; + if (combo.children) combo.children.push(cnode);else combo.children = [cnode]; + cnode.itemType = 'node'; + addedMap[node.id] = cnode; + } + }); // assign the depth for each element + + var maxDepth = 0; + result.forEach(function (tree) { + tree.depth = maxDepth + 10; + traverse(tree, function (child) { + var parent; + var itemType = addedMap[child.id].itemType; + + if (itemType === 'node') { + parent = addedMap[child.comboId]; + } else { + parent = addedMap[child.parentId]; + } + + if (parent) { + if (itemType === 'node') child.depth = maxDepth + 1;else child.depth = maxDepth + 10; + } else { + child.depth = maxDepth + 10; + } + + if (maxDepth < child.depth) maxDepth = child.depth; + var oriNodeModel = nodeMap[child.id]; + + if (oriNodeModel) { + oriNodeModel.depth = child.depth; + } + + return true; + }); + }); + return result; +}; +var reconstructTree = function reconstructTree(trees, subtreeId, newParentId) { + var brothers = trees; + var subtree; + var comboChildsMap = { + root: { + children: trees + } + }; + var foundSubTree = false; + var oldParentId = 'root'; + (trees || []).forEach(function (tree) { + if (foundSubTree) return; + + if (tree.id === subtreeId) { + subtree = tree; + + if (tree.itemType === 'combo') { + subtree.parentId = newParentId; + } else { + subtree.comboId = newParentId; + } + + foundSubTree = true; + return; + } + + traverseTree$2(tree, function (child) { + comboChildsMap[child.id] = { + children: child.children + }; // store the old parent id to delete the subtree from the old parent's children in next recursion + + brothers = comboChildsMap[child.parentId || child.comboId || 'root'].children; + + if (child && (child.removed || subtreeId === child.id) && brothers) { + oldParentId = child.parentId || child.comboId || 'root'; + subtree = child; // re-assign the parentId or comboId for the moved subtree + + if (child.itemType === 'combo') { + subtree.parentId = newParentId; + } else { + subtree.comboId = newParentId; + } + + foundSubTree = true; + return false; + } + + return true; + }); + }); + brothers = comboChildsMap[oldParentId].children; + var index = brothers ? brothers.indexOf(subtree) : -1; + if (index > -1) brothers.splice(index, 1); // 如果遍历完整棵树还没有找到，说明之前就不在树中 + + if (!foundSubTree) { + subtree = { + id: subtreeId, + itemType: 'node', + comboId: newParentId + }; + comboChildsMap[subtreeId] = { + children: undefined + }; + } // append to new parent + + + if (subtreeId) { + var found_1 = false; // newParentId is undefined means the subtree will have no parent + + if (newParentId) { + var newParentDepth_1 = 0; + (trees || []).forEach(function (tree) { + if (found_1) return; // terminate + + traverseTree$2(tree, function (child) { + // append subtree to the new parent ans assign the depth to the subtree + if (newParentId === child.id) { + found_1 = true; + if (child.children) child.children.push(subtree);else child.children = [subtree]; + newParentDepth_1 = child.depth; + if (subtree.itemType === 'node') subtree.depth = newParentDepth_1 + 2;else subtree.depth = newParentDepth_1 + 1; + return false; // terminate + } + + return true; + }); + }); + } else if ((!newParentId || !found_1) && subtree.itemType !== 'node') { + // if the newParentId is undefined or it is not found in the tree, add the subTree to the root + trees.push(subtree); + } // update the depth of the subtree and its children from the subtree + + + var currentDepth_1 = subtree.depth; + traverseTree$2(subtree, function (child) { + if (child.itemType === 'node') currentDepth_1 += 2;else currentDepth_1 += 1; + child.depth = currentDepth_1; + return true; + }); + } + + return trees; +}; +var getComboBBox = function getComboBBox(children, graph) { + var comboBBox = { + minX: Infinity, + minY: Infinity, + maxX: -Infinity, + maxY: -Infinity, + x: undefined, + y: undefined, + width: undefined, + height: undefined, + centerX: undefined, + centerY: undefined + }; + + if (!children || children.length === 0) { + return comboBBox; + } + + children.forEach(function (child) { + var childItem = graph.findById(child.id); + if (!childItem || !childItem.isVisible()) return; // ignore hidden children + + childItem.set('bboxCanvasCache', undefined); + var childBBox = childItem.getCanvasBBox(); + if (childBBox.x && comboBBox.minX > childBBox.minX) comboBBox.minX = childBBox.minX; + if (childBBox.y && comboBBox.minY > childBBox.minY) comboBBox.minY = childBBox.minY; + if (childBBox.x && comboBBox.maxX < childBBox.maxX) comboBBox.maxX = childBBox.maxX; + if (childBBox.y && comboBBox.maxY < childBBox.maxY) comboBBox.maxY = childBBox.maxY; + }); + comboBBox.x = (comboBBox.minX + comboBBox.maxX) / 2; + comboBBox.y = (comboBBox.minY + comboBBox.maxY) / 2; + comboBBox.width = comboBBox.maxX - comboBBox.minX; + comboBBox.height = comboBBox.maxY - comboBBox.minY; + comboBBox.centerX = (comboBBox.minX + comboBBox.maxX) / 2; + comboBBox.centerY = (comboBBox.minY + comboBBox.maxY) / 2; + Object.keys(comboBBox).forEach(function (key) { + if (comboBBox[key] === Infinity || comboBBox[key] === -Infinity) { + comboBBox[key] = undefined; + } + }); + return comboBBox; +}; +var shouldRefreshEdge = function shouldRefreshEdge(cfg) { + var refreshEdge = isNumber$4(cfg.x) || isNumber$4(cfg.y) || cfg.type || cfg.anchorPoints || cfg.size; + if (cfg.style) refreshEdge = refreshEdge || isNumber$4(cfg.style.r) || isNumber$4(cfg.style.width) || isNumber$4(cfg.style.height) || isNumber$4(cfg.style.rx) || isNumber$4(cfg.style.ry); + return refreshEdge; +}; +var cloneBesidesImg$1 = function cloneBesidesImg(obj) { + var clonedObj = {}; + Object.keys(obj).forEach(function (key1) { + var obj2 = obj[key1]; + + if (isObject$f(obj2)) { + var clonedObj2_1 = {}; + Object.keys(obj2).forEach(function (key2) { + var v = obj2[key2]; + if (key2 === 'img' && !isString$3(v)) return; + clonedObj2_1[key2] = clone$7(v); + }); + clonedObj[key1] = clonedObj2_1; + } else { + clonedObj[key1] = clone$7(obj2); + } + }); + return clonedObj; +}; + +var GraphicUtil = /*#__PURE__*/Object.freeze({ + __proto__: null, + getBBox: getBBox$1, + getLoopCfgs: getLoopCfgs, + getLabelPosition: getLabelPosition, + traverseTree: traverseTree$2, + traverseTreeUp: traverseTreeUp$1, + getLetterWidth: getLetterWidth, + getTextSize: getTextSize, + plainCombosToTrees: plainCombosToTrees, + reconstructTree: reconstructTree, + getComboBBox: getComboBBox, + shouldRefreshEdge: shouldRefreshEdge, + cloneBesidesImg: cloneBesidesImg$1 +}); + +function _typeof$3(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof$3 = function _typeof(obj) { return typeof obj; }; } else { _typeof$3 = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof$3(obj); } +/** + * 一种更宽松的JSON 解析，如果遇到不符合规范的字段会直接转为字符串 + * @param text json 内容 + */ + +function looseJSONParse(text) { + if (typeof text !== 'string') { + return text; + } + + var safeParse = function safeParse(str) { + if (typeof str !== 'string') { + return str; + } + + try { + return JSON.parse(str.trim()); + } catch (e) { + return str.trim(); + } + }; + + var firstAttempt = safeParse(text); + + if (typeof firstAttempt !== 'string') { + return firstAttempt; + } + + var tail = function tail(arr) { + return arr[arr.length - 1]; + }; + + var str = text.trim(); + var objectStack = []; + var syntaxStack = []; + + var isLastPair = function isLastPair() { + var syntaxes = []; + + for (var _i = 0; _i < arguments.length; _i++) { + syntaxes[_i] = arguments[_i]; + } + + return syntaxes.some(function (syntax) { + return tail(syntaxStack) === syntax; + }); + }; + + var getValueStore = function getValueStore() { + return tail(objectStack); + }; + + var rst = null; + var i = 0; + var temp = ''; + + while (i < str.length) { + var nowChar = str[i]; + var isInString = isLastPair('"', "'"); + + if (!isInString && !nowChar.trim()) { + i += 1; + continue; + } + + var isLastTranslate = str[i - 1] === '\\'; + var isInObject = isLastPair('}'); + var isInArray = isLastPair(']'); + var isWaitingValue = isLastPair(','); + var tempArr = getValueStore(); + + if (isInString) { + if (tail(syntaxStack) === nowChar && !isLastTranslate) { + syntaxStack.pop(); + var value = safeParse(temp); + tempArr.push(value); + rst = value; + temp = ''; + } else { + temp += nowChar; + } + } else if (isInArray && nowChar === ',') { + if (temp) { + tempArr.push(safeParse(temp)); + temp = ''; + } + } else if (isInObject && nowChar === ':') { + syntaxStack.push(','); + + if (temp) { + tempArr.push(temp); + temp = ''; + } + } else if (isWaitingValue && nowChar === ',') { + if (temp) { + tempArr.push(safeParse(temp)); + temp = ''; + } + + syntaxStack.pop(); + } else if (nowChar === '}' && (isInObject || isWaitingValue)) { + if (temp) { + tempArr.push(safeParse(temp)); + temp = ''; + } + + if (isWaitingValue) { + syntaxStack.pop(); + } + + var obj = {}; + + for (var c = 1; c < tempArr.length; c += 2) { + obj[tempArr[c - 1]] = tempArr[c]; + } + + objectStack.pop(); + + if (objectStack.length) { + tail(objectStack).push(obj); + } + + syntaxStack.pop(); + rst = obj; + } else if (nowChar === ']' && isInArray) { + if (temp) { + tempArr.push(safeParse(temp)); + temp = ''; + } + + objectStack.pop(); + + if (objectStack.length) { + tail(objectStack).push(tempArr); + } + + syntaxStack.pop(); + rst = tempArr; + } else if (nowChar === '{') { + objectStack.push([]); + syntaxStack.push('}'); + } else if (nowChar === '[') { + objectStack.push([]); + syntaxStack.push(']'); + } else if (nowChar === '"') { + syntaxStack.push('"'); + } else if (nowChar === "'") { + syntaxStack.push("'"); + } else { + temp += nowChar; + } + + i += 1; + } + + return rst || temp; +} + +var keyConvert = function keyConvert(str) { + return str.split('-').reduce(function (a, b) { + return a + b.charAt(0).toUpperCase() + b.slice(1); + }); +}; +/** + * 简单的一个{{}}模板渲染，不包含任何复杂语法 + * @param xml + */ + + +var xmlDataRenderer = function xmlDataRenderer(xml) { + return function (data) { + var len = xml.length; + var arr = []; + var i = 0; + var tmp = ''; + + while (i < len) { + if (xml[i] === '{' && xml[i + 1] === '{') { + arr.push(tmp); + tmp = ''; + i += 2; + } else if (xml[i] === '}' && xml[i + 1] === '}') { + if (arr.length) { + var last = arr.pop(); + tmp = get$3(data, tmp, last.endsWith('=') ? "\"{" + tmp + "}\"" : tmp); + arr.push(last + tmp); + } + + i += 2; + tmp = ''; + } else { + tmp += xml[i]; + i += 1; + } + } + + arr.push(tmp); + return arr.map(function (e, index) { + return arr[index - 1] && arr[index - 1].endsWith('=') ? "\"{" + e + "}\"" : e; + }).join(''); + }; +}; +/** + * 解析XML，并转化为相应的JSON结构 + * @param xml xml解析后的节点 + */ + +function parseXML(xml, cfg) { + var attrs = {}; + var keys = xml.getAttributeNames && xml.getAttributeNames() || []; + var children = xml.children && Array.from(xml.children).map(function (e) { + return parseXML(e, cfg); + }); + var rst = {}; + var tagName = xml.tagName ? xml.tagName.toLowerCase() : 'group'; + + if (tagName === 'text') { + attrs.text = xml.innerText; + } + + rst.type = tagName; + + if (tagName === 'img') { + rst.type = 'image'; + } + + Array.from(keys).forEach(function (k) { + var key = keyConvert(k); + var val = xml.getAttribute(k); + + try { + if (key === 'style' || key === 'attrs') { + var style = looseJSONParse(val); + attrs = __assign$r(__assign$r({}, attrs), style); + } else { + rst[key] = looseJSONParse(val); + } + } catch (e) { + if (key === 'style') { + throw e; + } + + rst[key] = val; + } + }); + rst.attrs = attrs; + + if (cfg && cfg.style && rst.name && _typeof$3(cfg.style[rst.name]) === 'object') { + rst.attrs = __assign$r(__assign$r({}, rst.attrs), cfg.style[rst.name]); + } + + if (cfg && cfg.style && rst.keyshape) { + rst.attrs = __assign$r(__assign$r({}, rst.attrs), cfg.style); + } + + if (children.length) { + rst.children = children; + } + + return rst; +} +/** + * 根据偏移量和内部节点最终的bounding box来得出该shape最终的bbox + */ + +function getBBox(node, offset, chilrenBBox) { + var _a = node.attrs, + attrs = _a === void 0 ? {} : _a; + var bbox = { + x: offset.x || 0, + y: offset.y || 0, + width: chilrenBBox.width || 0, + height: chilrenBBox.height || 0 + }; + var shapeHeight, shapeWidth; + + switch (node.type) { + case 'maker': + case 'circle': + if (attrs.r) { + shapeWidth = 2 * attrs.r; + shapeHeight = 2 * attrs.r; + } + + break; + + case 'text': + if (attrs.text) { + shapeWidth = getTextSize(attrs.text, attrs.fontSize || 12)[0]; + shapeHeight = 16; + bbox.y += shapeHeight; + bbox.height = shapeHeight; + bbox.width = shapeWidth; + node.attrs = __assign$r({ + fontSize: 12, + fill: '#000' + }, attrs); + } + + break; + + default: + if (attrs.width) { + shapeWidth = attrs.width; + } + + if (attrs.height) { + shapeHeight = attrs.height; + } + + } + + if (shapeHeight >= 0) { + bbox.height = shapeHeight; + } + + if (shapeWidth >= 0) { + bbox.width = shapeWidth; + } + + if (attrs.marginTop) { + bbox.y += attrs.marginTop; + } + + if (attrs.marginLeft) { + bbox.x += attrs.marginLeft; + } + + return bbox; +} +/** + * 把从xml计算出的结构填上位置信息，补全attrs + * @param target + * @param lastOffset + */ + +function generateTarget(target, lastOffset) { + var _a; + + if (lastOffset === void 0) { + lastOffset = { + x: 0, + y: 0 + }; + } + + var defaultBbox = __assign$r({ + x: 0, + y: 0, + width: 0, + height: 0 + }, lastOffset); + + if ((_a = target.children) === null || _a === void 0 ? void 0 : _a.length) { + var _b = target.attrs, + attrs = _b === void 0 ? {} : _b; + var marginTop = attrs.marginTop; + + var offset = __assign$r({}, lastOffset); + + if (marginTop) { + offset.y += marginTop; + } + + for (var index = 0; index < target.children.length; index++) { + target.children[index].attrs.key = (attrs.key || 'root') + " -" + index + " "; + var node = generateTarget(target.children[index], offset); + + if (node.bbox) { + var bbox = node.bbox; + + if (node.attrs.next === 'inline') { + offset.x += node.bbox.width; + } else { + offset.y += node.bbox.height; + } + + if (bbox.width + bbox.x > defaultBbox.width) { + defaultBbox.width = bbox.width + bbox.x; + } + + if (bbox.height + bbox.y > defaultBbox.height) { + defaultBbox.height = bbox.height + bbox.y; + } + } + } + } + + target.bbox = getBBox(target, lastOffset, defaultBbox); + target.attrs = __assign$r(__assign$r({}, target.attrs), target.bbox); + return target; +} +/** + * 对比前后两个最终计算出来的node，并对比出最小改动, + * 动作： 'add' 添加节点 ｜ ’delete‘ 删除节点 ｜ ’change‘ 改变节点attrs ｜ 'restructure' 重构节点 + * @param nowTarget + * @param formerTarget + */ + +function compareTwoTarget(nowTarget, formerTarget) { + var _a, _b, _c, _d; + + var type = (nowTarget || {}).type; + var key = ((formerTarget === null || formerTarget === void 0 ? void 0 : formerTarget.attrs) || {}).key; + + if (key && nowTarget) { + nowTarget.attrs.key = key; + } + + if (!nowTarget && formerTarget) { + return { + action: 'delete', + val: formerTarget, + type: type, + key: key + }; + } + + if (nowTarget && !formerTarget) { + return { + action: 'add', + val: nowTarget, + type: type + }; + } + + if (!nowTarget && !formerTarget) { + return { + action: 'same', + type: type + }; + } + + var children = []; + + if (((_a = nowTarget.children) === null || _a === void 0 ? void 0 : _a.length) > 0 || ((_b = formerTarget.children) === null || _b === void 0 ? void 0 : _b.length) > 0) { + var length_1 = Math.max((_c = nowTarget.children) === null || _c === void 0 ? void 0 : _c.length, (_d = formerTarget.children) === null || _d === void 0 ? void 0 : _d.length); + var formerChilren = formerTarget.children || []; + var nowChilren = nowTarget.children || []; + + for (var index = 0; index < length_1; index += 1) { + children.push(compareTwoTarget(nowChilren[index], formerChilren[index])); + } + } + + var formerKeys = Object.keys(formerTarget.attrs); + var nowKeys = Object.keys(nowTarget.attrs); + + if (formerTarget.type !== nowTarget.type) { + return { + action: 'restructure', + nowTarget: nowTarget, + formerTarget: formerTarget, + key: key, + children: children + }; + } + + if (formerKeys.filter(function (e) { + return e !== 'children'; + }).some(function (e) { + return nowTarget.attrs[e] !== formerTarget.attrs[e] || !nowKeys.includes(e); + })) { + return { + action: 'change', + val: nowTarget, + children: children, + type: type, + key: key + }; + } + + return { + action: 'same', + children: children, + type: type, + key: key + }; +} +/** + * 根据xml或者返回xml的函数构建自定义节点的结构 + * @param gen + */ + +function createNodeFromXML(gen) { + var structures = {}; + + var compileXML = function compileXML(cfg) { + var rawStr = typeof gen === 'function' ? gen(cfg) : gen; + var target = xmlDataRenderer(rawStr)(cfg); + var xmlParser = document.createElement('div'); + xmlParser.innerHTML = target; + var xml = xmlParser.children[0]; + var result = generateTarget(parseXML(xml, cfg)); + xmlParser.remove(); + return result; + }; + + return { + draw: function draw(cfg, group) { + var resultTarget = compileXML(cfg); + var keyshape = group; + + var renderTarget = function renderTarget(target) { + var _a = target.attrs, + attrs = _a === void 0 ? {} : _a, + bbox = target.bbox, + type = target.type, + children = target.children, + rest = __rest$G(target, ["attrs", "bbox", "type", "children"]); + + if (target.type !== 'group') { + var shape = group.addShape(target.type, __assign$r({ + attrs: attrs, + origin: { + bbox: bbox, + type: type, + children: children + } + }, rest)); + + if (target.keyshape) { + keyshape = shape; + } + } + + if (target.children) { + target.children.forEach(function (n) { + return renderTarget(n); + }); + } + }; + + renderTarget(resultTarget); + structures[cfg.id] = [resultTarget]; + return keyshape; + }, + update: function update(cfg, node) { + if (!structures[cfg.id]) { + structures[cfg.id] = []; + } + + var container = node.getContainer(); + var children = container.get('children'); + var newTarget = compileXML(cfg); + var lastTarget = structures[cfg.id].pop(); + var diffResult = compareTwoTarget(newTarget, lastTarget); + + var addShape = function addShape(shape) { + var _a; + + if (shape.type !== 'group') { + container.addShape(shape.type, { + attrs: shape.attrs + }); + } + + if ((_a = shape.children) === null || _a === void 0 ? void 0 : _a.length) { + shape.children.map(function (e) { + return addShape(e); + }); + } + }; + + var delShape = function delShape(shape) { + var _a; + + var targetShape = children.find(function (e) { + return e.attrs.key === shape.attrs.key; + }); + + if (targetShape) { + container.removeChild(targetShape); + } + + if ((_a = shape.children) === null || _a === void 0 ? void 0 : _a.length) { + shape.children.map(function (e) { + return delShape(e); + }); + } + }; + + var updateTarget = function updateTarget(target) { + var key = target.key; + + if (target.type !== 'group') { + var targetShape = children.find(function (e) { + return e.attrs.key === key; + }); + + switch (target.action) { + case 'change': + if (targetShape) { + var originAttr = target.val.keyshape ? node.getOriginStyle() : {}; + targetShape.attr(__assign$r(__assign$r({}, originAttr), target.val.attrs)); + } + + break; + + case 'add': + addShape(target.val); + break; + + case 'delete': + delShape(target.val); + break; + + case 'restructure': + delShape(target.formerTarget); + addShape(target.nowTarget); + break; + } + } + + if (target.children) { + target.children.forEach(function (n) { + return updateTarget(n); + }); + } + }; + + updateTarget(diffResult); + structures[cfg.id].push(newTarget); + }, + getAnchorPoints: function getAnchorPoints() { + return [[0, 0.5], [1, 0.5], [0.5, 1], [0.5, 0]]; + } + }; +} + +var cache = {}; // ucfirst 开销过大，进行缓存 +// 首字母大写 + +function ucfirst(str) { + if (!cache[str]) { + cache[str] = upperFirst(str); + } + + return cache[str]; +} +/** + * 工厂方法的基类 + * @type Shape.FactoryBase + */ + + +var ShapeFactoryBase = { + /** + * 默认的形状，当没有指定/匹配 shapeType 时，使用默认的 + * @type {String} + */ + defaultShapeType: 'defaultType', + + /** + * 形状的 className，用于搜索 + * @type {String} + */ + className: null, + + /** + * 获取绘制 Shape 的工具类，无状态 + * @param {String} type 类型 + * @return {Shape} 工具类 + */ + getShape: function getShape(type) { + var self = this; + var shape = self[type] || self[self.defaultShapeType] || self['simple-circle']; + return shape; + }, + + /** + * 绘制图形 + * @param {String} type 类型 + * @param {Object} cfg 配置项 + * @param {G.Group} group 图形的分组 + * @return {IShape} 图形对象 + */ + draw: function draw(type, cfg, group) { + var shape = this.getShape(type); + var rst = shape.draw(cfg, group); + + if (shape.afterDraw) { + shape.afterDraw(cfg, group, rst); + } + + return rst; + }, + + /** + * 更新 + * @param {String} type 类型 + * @param {Object} cfg 配置项 + * @param {G6.Item} item 节点、边、分组等 + */ + baseUpdate: function baseUpdate(type, cfg, item) { + var shape = this.getShape(type); + + if (shape.update) { + // 防止没定义 update 函数 + shape.update(cfg, item); + } + + if (shape.afterUpdate) { + shape.afterUpdate(cfg, item); + } + }, + + /** + * 设置状态 + * @param {String} type 类型 + * @param {String} name 状态名 + * @param {String | Boolean} value 状态值 + * @param {G6.Item} item 节点、边、分组等 + */ + setState: function setState(type, name, value, item) { + var shape = this.getShape(type); // 调用 shape/shapeBase.ts 中的 setState 方法 + + shape.setState(name, value, item); + }, + + /** + * 是否允许更新，不重新绘制图形 + * @param {String} type 类型 + * @return {Boolean} 是否允许使用更新 + */ + shouldUpdate: function shouldUpdate(type) { + var shape = this.getShape(type); + return !!shape.update; + }, + getControlPoints: function getControlPoints(type, cfg) { + var shape = this.getShape(type); + return shape.getControlPoints(cfg); + }, + + /** + * 获取控制点 + * @param {String} type 节点、边类型 + * @param {Object} cfg 节点、边的配置项 + * @return {Array|null} 控制点的数组,如果为 null，则没有控制点 + */ + getAnchorPoints: function getAnchorPoints(type, cfg) { + var shape = this.getShape(type); + return shape.getAnchorPoints(cfg); + } +}; +/** + * 元素的框架 + */ + +var ShapeFramework = { + // 默认样式及配置 + options: {}, + + /** + * 绘制 + */ + draw: function draw(cfg, group) { + return this.drawShape(cfg, group); + }, + + /** + * 绘制 + */ + drawShape: function drawShape() + /* cfg, group */ + {}, + + /** + * 绘制完成后的操作，便于用户继承现有的节点、边 + */ + afterDraw: function afterDraw() + /* cfg, group */ + {}, + // update(cfg, item) // 默认不定义 + afterUpdate: function afterUpdate() + /* cfg, item */ + {}, + + /** + * 设置节点、边状态 + */ + setState: function setState() + /* name, value, item */ + {}, + + /** + * 获取控制点 + * @param {Object} cfg 节点、边的配置项 + * @return {Array|null} 控制点的数组,如果为 null，则没有控制点 + */ + getControlPoints: function getControlPoints(cfg) { + return cfg.controlPoints; + }, + + /** + * 获取控制点 + * @param {Object} cfg 节点、边的配置项 + * @return {Array|null} 控制点的数组,如果为 null，则没有控制点 + */ + getAnchorPoints: function getAnchorPoints(cfg) { + var defaultAnchorPoints = this.options.anchorPoints; + var anchorPoints = cfg.anchorPoints || defaultAnchorPoints; + return anchorPoints; + } + /* 如果没定义 update 方法，每次都调用 draw 方法 + update(cfg, item) { + } + */ + +}; + +var Shape = +/** @class */ +function () { + function Shape() {} + + Shape.registerFactory = function (factoryType, cfg) { + var className = ucfirst(factoryType); + var factoryBase = ShapeFactoryBase; + + var shapeFactory = __assign$r(__assign$r({}, factoryBase), cfg); + + Shape[className] = shapeFactory; + shapeFactory.className = className; + return shapeFactory; + }; + + Shape.getFactory = function (factoryType) { + var className = ucfirst(factoryType); + return Shape[className]; + }; + + Shape.registerNode = function (shapeType, nodeDefinition, extendShapeType) { + var shapeFactory = Shape.Node; + var shapeObj; + + if (typeof nodeDefinition === 'string' || typeof nodeDefinition === 'function') { + var autoNodeDefinition = createNodeFromXML(nodeDefinition); + shapeObj = __assign$r(__assign$r({}, shapeFactory.getShape('single-node')), autoNodeDefinition); + } else if (nodeDefinition.jsx) { + var jsx = nodeDefinition.jsx; + var autoNodeDefinition = createNodeFromXML(jsx); + shapeObj = __assign$r(__assign$r(__assign$r({}, shapeFactory.getShape('single-node')), autoNodeDefinition), nodeDefinition); + } else { + shapeFactory.getShape(extendShapeType); + var extendShape = extendShapeType ? shapeFactory.getShape(extendShapeType) : ShapeFramework; + shapeObj = __assign$r(__assign$r({}, extendShape), nodeDefinition); + } + + shapeObj.type = shapeType; + shapeObj.itemType = 'node'; + shapeFactory[shapeType] = shapeObj; + return shapeObj; + }; + + Shape.registerEdge = function (shapeType, edgeDefinition, extendShapeType) { + var shapeFactory = Shape.Edge; + var extendShape = extendShapeType ? shapeFactory.getShape(extendShapeType) : ShapeFramework; + + var shapeObj = __assign$r(__assign$r({}, extendShape), edgeDefinition); + + shapeObj.type = shapeType; + shapeObj.itemType = 'edge'; + shapeFactory[shapeType] = shapeObj; + return shapeObj; + }; + + Shape.registerCombo = function (shapeType, comboDefinition, extendShapeType) { + var shapeFactory = Shape.Combo; + var extendShape = extendShapeType ? shapeFactory.getShape(extendShapeType) : ShapeFramework; + + var shapeObj = __assign$r(__assign$r({}, extendShape), comboDefinition); + + shapeObj.type = shapeType; + shapeObj.itemType = 'combo'; + shapeFactory[shapeType] = shapeObj; + return shapeObj; + }; + + return Shape; +}(); + +Shape.registerFactory('node', { + defaultShapeType: 'circle' +}); // 注册 Edge 的工厂方法 + +Shape.registerFactory('edge', { + defaultShapeType: 'line' +}); // 注册 Combo 的工厂方法 + +Shape.registerFactory('combo', { + defaultShapeType: 'circle' +}); + +var CACHE_BBOX$2 = 'bboxCache'; +var CACHE_CANVAS_BBOX$1 = 'bboxCanvasCache'; + +var ItemBase = +/** @class */ +function () { + function ItemBase(cfg) { + this._cfg = {}; + this.destroyed = false; + var defaultCfg = { + /** + * id + * @type {string} + */ + id: undefined, + + /** + * 类型 + * @type {string} + */ + type: 'item', + + /** + * data model + * @type {object} + */ + model: {}, + + /** + * g group + * @type {G.Group} + */ + group: undefined, + + /** + * is open animate + * @type {boolean} + */ + animate: false, + + /** + * visible - not group visible + * @type {boolean} + */ + visible: true, + + /** + * locked - lock node + * @type {boolean} + */ + locked: false, + + /** + * capture event + * @type {boolean} + */ + event: true, + + /** + * key shape to calculate item's bbox + * @type object + */ + keyShape: undefined, + + /** + * item's states, such as selected or active + * @type Array + */ + states: [] + }; + this._cfg = Object.assign(defaultCfg, this.getDefaultCfg(), cfg); + var model = this.get('model'); + var id = model.id; + var itemType = this.get('type'); + + if (!id) { + id = uniqueId$1(itemType); + this.get('model').id = id; + } + + this.set('id', id); + var group = cfg.group; + + if (group) { + group.set('item', this); + group.set('id', id); + } + + this.init(); + this.draw(); + var shapeType = model.shape || model.type || (itemType === 'edge' ? 'line' : 'circle'); + var shapeFactory = this.get('shapeFactory'); + + if (shapeFactory && shapeFactory[shapeType]) { + var options = shapeFactory[shapeType].options; // merge the stateStyles from item and shape + + if (options && options.stateStyles) { + var styles = this.get('styles') || model.stateStyles; + styles = deepMix({}, options.stateStyles, styles); + this.set('styles', styles); + } + } + } + /** + * 根据 keyshape 计算包围盒 + */ + + + ItemBase.prototype.calculateBBox = function () { + var keyShape = this.get('keyShape'); + var group = this.get('group'); // 因为 group 可能会移动，所以必须通过父元素计算才能计算出正确的包围盒 + + var bbox = getBBox$1(keyShape, group); + bbox.x = bbox.minX; + bbox.y = bbox.minY; + bbox.width = bbox.maxX - bbox.minX; + bbox.height = bbox.maxY - bbox.minY; + bbox.centerX = (bbox.minX + bbox.maxX) / 2; + bbox.centerY = (bbox.minY + bbox.maxY) / 2; + return bbox; + }; + /** + * 根据 keyshape 计算包围盒 + */ + + + ItemBase.prototype.calculateCanvasBBox = function () { + var keyShape = this.get('keyShape'); + var group = this.get('group'); // 因为 group 可能会移动，所以必须通过父元素计算才能计算出正确的包围盒 + + var bbox = getBBox$1(keyShape, group); + bbox.x = bbox.minX; + bbox.y = bbox.minY; + bbox.width = bbox.maxX - bbox.minX; + bbox.height = bbox.maxY - bbox.minY; + bbox.centerX = (bbox.minX + bbox.maxX) / 2; + bbox.centerY = (bbox.minY + bbox.maxY) / 2; + return bbox; + }; + /** + * draw shape + */ + + + ItemBase.prototype.drawInner = function () { + var self = this; + var shapeFactory = self.get('shapeFactory'); + var group = self.get('group'); + var model = self.get('model'); + group.clear(); + var visible = model.visible; + if (visible !== undefined && !visible) self.changeVisibility(visible); + + if (!shapeFactory) { + return; + } + + self.updatePosition(model); + var cfg = self.getShapeCfg(model); // 可能会附加额外信息 + + var shapeType = cfg.type; + var keyShape = shapeFactory.draw(shapeType, cfg, group); + + if (keyShape) { + self.set('keyShape', keyShape); + keyShape.set('isKeyShape', true); + keyShape.set('draggable', true); + } + + this.setOriginStyle(); // 防止由于用户外部修改 model 中的 shape 导致 shape 不更新 + + this.set('currentShape', shapeType); + this.restoreStates(shapeFactory, shapeType); + }; + /** + * 设置图元素原始样式 + * @param keyShape 图元素 keyShape + * @param group Group 容器 + */ + + + ItemBase.prototype.setOriginStyle = function (cfg) { + var group = this.get('group'); + var children = group.get('children'); + var keyShape = this.getKeyShape(); + var self = this; + var keyShapeName = keyShape.get('name'); + + if (!this.get('originStyle')) { + // 第一次 set originStyle，直接拿首次渲染所有图形的 attrs + var originStyles_1 = {}; + each$2(children, function (child) { + var shapeType = child.get('type'); + var name = child.get('name'); + + if (name && name !== keyShapeName) { + originStyles_1[name] = shapeType !== 'image' ? clone$7(child.attr()) : self.getShapeStyleByName(name); + } else { + // !name || name === keyShape + var keyShapeStyle = self.getShapeStyleByName(); // 可优化，需要去除 child.attr 中其他 shape 名的对象 + + if (keyShapeStyle.path) delete keyShapeStyle.path; + if (keyShapeStyle.matrix) delete keyShapeStyle.matrix; + + if (!keyShapeName) { + Object.assign(originStyles_1, keyShapeStyle); + } else { + // 若 keyShape 有 name 且 !name，这个图形不是 keyShape，给这个图形一个 name + if (!name) { + var shapeName = uniqueId$1('shape'); + child.set('name', shapeName); + originStyles_1[shapeName] = shapeType !== 'image' ? clone$7(child.attr()) : self.getShapeStyleByName(name); + } else originStyles_1[keyShapeName] = keyShapeStyle; + } + } + }); + self.set('originStyle', originStyles_1); + } else { + // 第二次 set originStyles，需要找到不是 stateStyles 的样式，更新到 originStyles 中 + // 上一次设置的 originStyle，是初始的 shape attrs + var styles_1 = this.getOriginStyle(); // let styles: ShapeStyle = {}; + + if (keyShapeName && !styles_1[keyShapeName]) styles_1[keyShapeName] = {}; // 获取当前状态样式 + + var currentStatesStyle_1 = this.getCurrentStatesStyle(); // 遍历当前所有图形的 attrs，找到不是 stateStyles 的样式更新到 originStyles 中 + + each$2(children, function (child) { + var name = child.get('name'); + var shapeAttrs = child.attr(); + + if (name && name !== keyShapeName) { + // 有 name 的非 keyShape 图形 + var shapeStateStyle_1 = currentStatesStyle_1[name]; + if (!styles_1[name]) styles_1[name] = {}; + + if (shapeStateStyle_1) { + Object.keys(shapeAttrs).forEach(function (key) { + var value = shapeAttrs[key]; + if (value !== shapeStateStyle_1[key]) styles_1[name][key] = value; + }); + } else { + styles_1[name] = child.get('type') !== 'image' ? clone$7(shapeAttrs) : self.getShapeStyleByName(name); + } + } else { + var shapeAttrs_1 = child.attr(); + + var keyShapeStateStyles_1 = __assign$r(__assign$r({}, currentStatesStyle_1), currentStatesStyle_1[keyShapeName]); + + Object.keys(shapeAttrs_1).forEach(function (key) { + var value = shapeAttrs_1[key]; // 如果是对象且不是 arrow，则是其他 shape 的样式 + // if (isPlainObject(value) && ARROWS.indexOf(name) === -1) return; + + if (keyShapeStateStyles_1[key] !== value) { + if (keyShapeName) styles_1[keyShapeName][key] = value;else styles_1[key] = value; + } + }); + } + }); + if (styles_1.path) delete styles_1.path; + if (styles_1.matrix) delete styles_1.matrix; + if (styles_1.x) delete styles_1.x; + if (styles_1.y) delete styles_1.y; + if (styles_1[keyShapeName] && styles_1[keyShapeName].x) delete styles_1[keyShapeName].x; + if (styles_1[keyShapeName] && styles_1[keyShapeName].y) delete styles_1[keyShapeName].y; + self.set('originStyle', styles_1); + } + }; + /** + * restore shape states + * @param shapeFactory + * @param shapeType + */ + + + ItemBase.prototype.restoreStates = function (shapeFactory, shapeType) { + var self = this; + var states = self.get('states'); + each$2(states, function (state) { + shapeFactory.setState(shapeType, state, true, self); + }); + }; + + ItemBase.prototype.init = function () { + var shapeFactory = Shape.getFactory(this.get('type')); + this.set('shapeFactory', shapeFactory); + }; + /** + * 获取属性 + * @internal 仅内部类使用 + * @param {String} key 属性名 + * @return {object | string | number} 属性值 + */ + + + ItemBase.prototype.get = function (key) { + return this._cfg[key]; + }; + /** + * 设置属性 + * @internal 仅内部类使用 + * @param {String|Object} key 属性名，也可以是对象 + * @param {object | string | number} val 属性值 + */ + + + ItemBase.prototype.set = function (key, val) { + if (isPlainObject$3(key)) { + this._cfg = __assign$r(__assign$r({}, this._cfg), key); + } else { + this._cfg[key] = val; + } + }; + + ItemBase.prototype.getDefaultCfg = function () { + return {}; + }; + /** + * 更新/刷新等操作后，清除 cache + */ + + + ItemBase.prototype.clearCache = function () { + this.set(CACHE_BBOX$2, null); + this.set(CACHE_CANVAS_BBOX$1, null); + }; + /** + * 渲染前的逻辑，提供给子类复写 + */ + + + ItemBase.prototype.beforeDraw = function () {}; + /** + * 渲染后的逻辑，提供给子类复写 + */ + + + ItemBase.prototype.afterDraw = function () {}; + /** + * 更新后做一些工作 + */ + + + ItemBase.prototype.afterUpdate = function () {}; + /** + * draw shape + */ + + + ItemBase.prototype.draw = function () { + this.beforeDraw(); + this.drawInner(); + this.afterDraw(); + }; + + ItemBase.prototype.getShapeStyleByName = function (name) { + var group = this.get('group'); + var currentShape; + + if (name) { + currentShape = group.find(function (element) { + return element.get('name') === name; + }); + } else { + currentShape = this.getKeyShape(); + } + + if (currentShape) { + var styles_2 = {}; + each$2(currentShape.attr(), function (val, key) { + // 修改 img 通过 updateItem 实现 + if (key !== 'img') { + styles_2[key] = val; + } + }); + return styles_2; + } + + return {}; + }; + + ItemBase.prototype.getShapeCfg = function (model) { + var styles = this.get('styles'); + + if (styles) { + // merge graph的item样式与数据模型中的样式 + var newModel = model; + newModel.style = __assign$r(__assign$r({}, styles), model.style); + return newModel; + } + + return model; + }; + /** + * 获取指定状态的样式，去除了全局样式 + * @param state 状态名称 + */ + + + ItemBase.prototype.getStateStyle = function (state) { + var styles = this.get('styles'); + var stateStyle = styles && styles[state]; + return stateStyle; + }; + /** + * get keyshape style + */ + + + ItemBase.prototype.getOriginStyle = function () { + return this.get('originStyle'); + }; + + ItemBase.prototype.getCurrentStatesStyle = function () { + var self = this; + var styles = {}; + var states = self.getStates(); + + if (!states || !states.length) { + return this.getOriginStyle(); + } + + each$2(self.getStates(), function (state) { + styles = Object.assign(styles, self.getStateStyle(state)); + }); + return styles; + }; + /** + * 更改元素状态， visible 不属于这个范畴 + * @internal 仅提供内部类 graph 使用 + * @param {String} state 状态名 + * @param {Boolean} value 节点状态值 + */ + + + ItemBase.prototype.setState = function (state, value) { + var states = this.get('states'); + var shapeFactory = this.get('shapeFactory'); + var stateName = state; + var filterStateName = state; + + if (isString$3(value)) { + stateName = state + ":" + value; + filterStateName = state + ":"; + } + + var newStates = states; + + if (isBoolean(value)) { + var index = states.indexOf(filterStateName); + + if (value) { + if (index > -1) { + return; + } + + states.push(stateName); + } else if (index > -1) { + states.splice(index, 1); + } + } else if (isString$3(value)) { + // 过滤掉 states 中 filterStateName 相关的状态 + var filterStates = states.filter(function (name) { + return name.includes(filterStateName); + }); + + if (filterStates.length > 0) { + this.clearStates(filterStates); + } + + newStates = newStates.filter(function (name) { + return !name.includes(filterStateName); + }); + newStates.push(stateName); + this.set('states', newStates); + } + + if (shapeFactory) { + var model = this.get('model'); + var type = model.type; // 调用 shape/shape.ts 中的 setState + + shapeFactory.setState(type, state, value, this); + } + }; + /** + * 清除指定的状态，如果参数为空，则不做任务处理 + * @param states 状态名称 + */ + + + ItemBase.prototype.clearStates = function (states) { + var self = this; + var originStates = self.getStates(); + var shapeFactory = self.get('shapeFactory'); + var model = self.get('model'); + var shape = model.type; + + if (!states) { + states = originStates; + } + + if (isString$3(states)) { + states = [states]; + } + + var newStates = originStates.filter(function (state) { + return states.indexOf(state) === -1; + }); + self.set('states', newStates); + states.forEach(function (state) { + shapeFactory.setState(shape, state, false, self); + }); + }; + /** + * 节点的图形容器 + * @return {G.Group} 图形容器 + */ + + + ItemBase.prototype.getContainer = function () { + return this.get('group'); + }; + /** + * 节点的关键形状，用于计算节点大小，连线截距等 + * @return {IShapeBase} 关键形状 + */ + + + ItemBase.prototype.getKeyShape = function () { + return this.get('keyShape'); + }; + /** + * 节点数据模型 + * @return {Object} 数据模型 + */ + + + ItemBase.prototype.getModel = function () { + return this.get('model'); + }; + /** + * 节点类型 + * @return {string} 节点的类型 + */ + + + ItemBase.prototype.getType = function () { + return this.get('type'); + }; + /** + * 获取 Item 的ID + */ + + + ItemBase.prototype.getID = function () { + return this.get('id'); + }; + /** + * 是否是 Item 对象，悬空边情况下进行判定 + */ + + + ItemBase.prototype.isItem = function () { + return true; + }; + /** + * 获取当前元素的所有状态 + * @return {Array} 元素的所有状态 + */ + + + ItemBase.prototype.getStates = function () { + return this.get('states'); + }; + /** + * 当前元素是否处于某状态 + * @param {String} state 状态名 + * @return {Boolean} 是否处于某状态 + */ + + + ItemBase.prototype.hasState = function (state) { + var states = this.getStates(); + return states.indexOf(state) >= 0; + }; + /** + * 刷新一般用于处理几种情况 + * 1. item model 在外部被改变 + * 2. 边的节点位置发生改变，需要重新计算边 + * + * 因为数据从外部被修改无法判断一些属性是否被修改，直接走位置和 shape 的更新 + */ + + + ItemBase.prototype.refresh = function () { + var model = this.get('model'); // 更新元素位置 + + this.updatePosition(model); // 更新元素内容，样式 + + this.updateShape(); // 做一些更新之后的操作 + + this.afterUpdate(); // 清除缓存 + + this.clearCache(); + }; + + ItemBase.prototype.isOnlyMove = function (cfg) { + return false; + }; + /** + * 将更新应用到 model 上，刷新属性 + * @internal 仅提供给 Graph 使用，外部直接调用 graph.update 接口 + * @param {Object} cfg 配置项，可以是增量信息 + */ + + + ItemBase.prototype.update = function (cfg, onlyMove) { + if (onlyMove === void 0) { + onlyMove = false; + } + + var model = this.get('model'); + var oriVisible = model.visible; + var cfgVisible = cfg.visible; + if (oriVisible !== cfgVisible && cfgVisible !== undefined) this.changeVisibility(cfgVisible); + var originPosition = { + x: model.x, + y: model.y + }; + cfg.x = isNaN(cfg.x) ? model.x : cfg.x; + cfg.y = isNaN(cfg.y) ? model.y : cfg.y; + var styles = this.get('styles'); + + if (cfg.stateStyles) { + // 更新 item 时更新 this.get('styles') 中的值 + var stateStyles = cfg.stateStyles; + mix(styles, stateStyles); + delete cfg.stateStyles; + } // 直接将更新合到原数据模型上，可以保证用户在外部修改源数据然后刷新时的样式符合期待。 + + + Object.assign(model, cfg); // isOnlyMove 仅用于node + // const onlyMove = this.isOnlyMove(cfg); + // 仅仅移动位置时，既不更新，也不重绘 + + if (onlyMove) { + this.updatePosition(cfg); + } else { + // 如果 x,y 有变化，先重置位置 + if (originPosition.x !== cfg.x || originPosition.y !== cfg.y) { + this.updatePosition(cfg); + } + + this.updateShape(); + } + + this.afterUpdate(); + this.clearCache(); + }; + /** + * 更新元素内容，样式 + */ + + + ItemBase.prototype.updateShape = function () { + var shapeFactory = this.get('shapeFactory'); + var model = this.get('model'); + var shape = model.type; // 判定是否允许更新 + // 1. 注册的节点允许更新 + // 2. 更新后的 shape 等于原先的 shape + + if (shapeFactory.shouldUpdate(shape) && shape === this.get('currentShape')) { + var updateCfg = this.getShapeCfg(model); + shapeFactory.baseUpdate(shape, updateCfg, this); + } else { + // 如果不满足上面两种状态，重新绘制 + this.draw(); + } // 更新完以后重新设置原始样式 + + + this.setOriginStyle(model); // 更新后重置节点状态 + + this.restoreStates(shapeFactory, shape); + }; + /** + * 更新位置，避免整体重绘 + * @param {object} cfg 待更新数据 + */ + + + ItemBase.prototype.updatePosition = function (cfg) { + var model = this.get('model'); + var x = isNil(cfg.x) ? model.x : cfg.x; + var y = isNil(cfg.y) ? model.y : cfg.y; + var group = this.get('group'); + + if (isNil(x) || isNil(y)) { + return false; + } + + model.x = x; + model.y = y; + var matrix = group.getMatrix(); + if (matrix && matrix[6] === x && matrix[7] === y) return false; + group.resetMatrix(); // G 4.0 element 中移除了矩阵相关方法，详见https://www.yuque.com/antv/blog/kxzk9g#4rMMV + + translate(group, { + x: x, + y: y + }); + this.clearCache(); // 位置更新后需要清除缓存 + + return true; + }; + /** + * 获取 item 的包围盒，这个包围盒是相对于 item 自己，不会将 matrix 计算在内 + * @return {Object} 包含 x,y,width,height, centerX, centerY + */ + + + ItemBase.prototype.getBBox = function () { + // 计算 bbox 开销有些大，缓存 + var bbox = this.get(CACHE_BBOX$2); + + if (!bbox) { + bbox = this.calculateBBox(); + this.set(CACHE_BBOX$2, bbox); + } + + return bbox; + }; + /** + * 获取 item 相对于画布的包围盒，会将从顶层到当前元素的 matrix 都计算在内 + * @return {Object} 包含 x,y,width,height, centerX, centerY + */ + + + ItemBase.prototype.getCanvasBBox = function () { + // 计算 bbox 开销有些大，缓存 + var bbox = this.get(CACHE_CANVAS_BBOX$1); + + if (!bbox) { + bbox = this.calculateCanvasBBox(); + this.set(CACHE_CANVAS_BBOX$1, bbox); + } + + return bbox; + }; + /** + * 将元素放到最前面 + */ + + + ItemBase.prototype.toFront = function () { + var group = this.get('group'); + group.toFront(); + }; + /** + * 将元素放到最后面 + */ + + + ItemBase.prototype.toBack = function () { + var group = this.get('group'); + group.toBack(); + }; + /** + * 显示元素 + */ + + + ItemBase.prototype.show = function () { + this.changeVisibility(true); + }; + /** + * 隐藏元素 + */ + + + ItemBase.prototype.hide = function () { + this.changeVisibility(false); + }; + /** + * 更改是否显示 + * @param {Boolean} visible 是否显示 + */ + + + ItemBase.prototype.changeVisibility = function (visible) { + var group = this.get('group'); + + if (visible) { + group.show(); + } else { + group.hide(); + } + + this.set('visible', visible); + }; + /** + * 元素是否可见 + * @return {Boolean} 返回该元素是否可见 + */ + + + ItemBase.prototype.isVisible = function () { + return this.get('visible'); + }; + /** + * 是否拾取及出发该元素的交互事件 + * @param {Boolean} enable 标识位 + */ + + + ItemBase.prototype.enableCapture = function (enable) { + var group = this.get('group'); + + if (group) { + group.set('capture', enable); + } + }; + + ItemBase.prototype.destroy = function () { + if (!this.destroyed) { + var animate = this.get('animate'); + var group = this.get('group'); + + if (animate) { + group.stopAnimate(); + } + + this.clearCache(); + group.remove(); + this._cfg = null; + this.destroyed = true; + } + }; + + return ItemBase; +}(); + +var END_MAP = { + source: 'start', + target: 'end' +}; +var ITEM_NAME_SUFFIX = 'Node'; // 端点的后缀，如 sourceNode, targetNode + +var POINT_NAME_SUFFIX = 'Point'; // 起点或者结束点的后缀，如 startPoint, endPoint + +var ANCHOR_NAME_SUFFIX = 'Anchor'; + +var Edge = +/** @class */ +function (_super) { + __extends$e(Edge, _super); + + function Edge() { + return _super !== null && _super.apply(this, arguments) || this; + } + + Edge.prototype.getDefaultCfg = function () { + return { + type: 'edge', + sourceNode: null, + targetNode: null, + startPoint: null, + endPoint: null, + linkCenter: false + }; + }; + + Edge.prototype.setEnd = function (name, value) { + var pointName = END_MAP[name] + POINT_NAME_SUFFIX; + var itemName = name + ITEM_NAME_SUFFIX; + var preItem = this.get(itemName); + + if (preItem && !preItem.destroyed) { + // 如果之前存在节点，则移除掉边 + preItem.removeEdge(this); + } + + if (isPlainObject$3(value)) { + // 如果设置成具体的点，则清理节点 + this.set(pointName, value); + this.set(itemName, null); + } else { + value.addEdge(this); + this.set(itemName, value); + this.set(pointName, null); + } + }; + /** + * 获取连接点的坐标 + * @param name source | target + * @param model 边的数据模型 + * @param controlPoints 控制点 + */ + + + Edge.prototype.getLinkPoint = function (name, model, controlPoints) { + var pointName = END_MAP[name] + POINT_NAME_SUFFIX; + var itemName = name + ITEM_NAME_SUFFIX; + var point = this.get(pointName); + + if (!point) { + var item = this.get(itemName); + var anchorName = name + ANCHOR_NAME_SUFFIX; + var prePoint = this.getPrePoint(name, controlPoints); + var anchorIndex = model[anchorName]; + + if (!isNil(anchorIndex)) { + // 如果有锚点，则使用锚点索引获取连接点 + point = item.getLinkPointByAnchor(anchorIndex); + } // 如果锚点没有对应的点或者没有锚点，则直接计算连接点 + + + point = point || item.getLinkPoint(prePoint); + + if (!isNil(point.index)) { + this.set(name + "AnchorIndex", point.index); + } + } + + return point; + }; + /** + * 获取同端点进行连接的点，计算交汇点 + * @param name + * @param controlPoints + */ + + + Edge.prototype.getPrePoint = function (name, controlPoints) { + if (controlPoints && controlPoints.length) { + var index = name === 'source' ? 0 : controlPoints.length - 1; + return controlPoints[index]; + } + + var oppositeName = name === 'source' ? 'target' : 'source'; // 取另一个节点的位置 + + return this.getEndPoint(oppositeName); + }; + /** + * 获取端点的位置 + * @param name + */ + + + Edge.prototype.getEndPoint = function (name) { + var itemName = name + ITEM_NAME_SUFFIX; + var pointName = END_MAP[name] + POINT_NAME_SUFFIX; + var item = this.get(itemName); // 如果有端点，直接使用 model + + if (item) { + return item.get('model'); + } // 否则直接使用点 + + + return this.get(pointName); + }; + /** + * 通过端点的中心获取控制点 + * @param model + */ + + + Edge.prototype.getControlPointsByCenter = function (model) { + var sourcePoint = this.getEndPoint('source'); + var targetPoint = this.getEndPoint('target'); + var shapeFactory = this.get('shapeFactory'); + var type = model.type; + return shapeFactory.getControlPoints(type, { + startPoint: sourcePoint, + endPoint: targetPoint + }); + }; + + Edge.prototype.getEndCenter = function (name) { + var itemName = name + ITEM_NAME_SUFFIX; + var pointName = END_MAP[name] + POINT_NAME_SUFFIX; + var item = this.get(itemName); // 如果有端点，直接使用 model + + if (item) { + var bbox = item.getBBox(); + return { + x: bbox.centerX, + y: bbox.centerY + }; + } // 否则直接使用点 + + + return this.get(pointName); + }; + + Edge.prototype.init = function () { + _super.prototype.init.call(this); // 初始化两个端点 + + + this.setSource(this.get('source')); + this.setTarget(this.get('target')); + }; + + Edge.prototype.getShapeCfg = function (model) { + var self = this; + var linkCenter = self.get('linkCenter'); // 如果连接到中心，忽视锚点、忽视控制点 + + var cfg = _super.prototype.getShapeCfg.call(this, model); + + if (linkCenter) { + cfg.startPoint = self.getEndCenter('source'); + cfg.endPoint = self.getEndCenter('target'); + } else { + var controlPoints = cfg.controlPoints || self.getControlPointsByCenter(cfg); + cfg.startPoint = self.getLinkPoint('source', model, controlPoints); + cfg.endPoint = self.getLinkPoint('target', model, controlPoints); + } + + cfg.sourceNode = self.get('sourceNode'); + cfg.targetNode = self.get('targetNode'); + return cfg; + }; + /** + * 获取边的数据模型 + */ + + + Edge.prototype.getModel = function () { + var out = this.get('model'); + var sourceItem = this.get("source" + ITEM_NAME_SUFFIX); + var targetItem = this.get("target" + ITEM_NAME_SUFFIX); + + if (sourceItem) { + delete out["source" + ITEM_NAME_SUFFIX]; + } else { + out.source = this.get("start" + POINT_NAME_SUFFIX); + } + + if (targetItem) { + delete out["target" + ITEM_NAME_SUFFIX]; + } else { + out.target = this.get("end" + POINT_NAME_SUFFIX); + } + + if (!isString$3(out.source) && !isPlainObject$3(out.source)) { + out.source = out.source.getID(); + } + + if (!isString$3(out.target) && !isPlainObject$3(out.target)) { + out.target = out.target.getID(); + } + + return out; + }; + + Edge.prototype.setSource = function (source) { + this.setEnd('source', source); + this.set('source', source); + }; + + Edge.prototype.setTarget = function (target) { + this.setEnd('target', target); + this.set('target', target); + }; + + Edge.prototype.getSource = function () { + return this.get('source'); + }; + + Edge.prototype.getTarget = function () { + return this.get('target'); + }; + + Edge.prototype.updatePosition = function () { + return false; + }; + /** + * 边不需要重计算容器位置，直接重新计算 path 位置 + * @param {object} cfg 待更新数据 + */ + + + Edge.prototype.update = function (cfg, onlyMove) { + + var model = this.get('model'); + var oriVisible = model.visible; + var cfgVisible = cfg.visible; + if (oriVisible !== cfgVisible && cfgVisible !== undefined) this.changeVisibility(cfgVisible); + var styles = this.get('styles'); + + if (cfg.stateStyles) { + // 更新 item 时更新 this.get('styles') 中的值 + var stateStyles = cfg.stateStyles; + mix(styles, stateStyles); + delete cfg.stateStyles; + } + + Object.assign(model, cfg); + this.updateShape(); + this.afterUpdate(); + this.clearCache(); + }; + + Edge.prototype.destroy = function () { + var sourceItem = this.get("source" + ITEM_NAME_SUFFIX); + var targetItem = this.get("target" + ITEM_NAME_SUFFIX); + + if (sourceItem && !sourceItem.destroyed) { + sourceItem.removeEdge(this); + } + + if (targetItem && !targetItem.destroyed) { + targetItem.removeEdge(this); + } + + _super.prototype.destroy.call(this); + }; + + return Edge; +}(ItemBase); + +var CACHE_ANCHOR_POINTS$1 = 'anchorPointsCache'; +var CACHE_BBOX$1 = 'bboxCache'; + +var Node = +/** @class */ +function (_super) { + __extends$e(Node, _super); + + function Node() { + return _super !== null && _super.apply(this, arguments) || this; + } + + Node.prototype.getNearestPoint = function (points, curPoint) { + var index = 0; + var nearestPoint = points[0]; + var minDistance = distance$3(points[0], curPoint); + + for (var i = 0; i < points.length; i++) { + var point = points[i]; + var dis = distance$3(point, curPoint); + + if (dis < minDistance) { + nearestPoint = point; + minDistance = dis; + index = i; + } + } + + nearestPoint.anchorIndex = index; + return nearestPoint; + }; + + Node.prototype.getDefaultCfg = function () { + return { + type: 'node', + edges: [] + }; + }; + /** + * 获取从节点关联的所有边 + */ + + + Node.prototype.getEdges = function () { + return this.get('edges'); + }; + /** + * 获取所有的入边 + */ + + + Node.prototype.getInEdges = function () { + var self = this; + return this.get('edges').filter(function (edge) { + return edge.get('target') === self; + }); + }; + /** + * 获取所有的出边 + */ + + + Node.prototype.getOutEdges = function () { + var self = this; + return this.get('edges').filter(function (edge) { + return edge.get('source') === self; + }); + }; + /** + * 获取节点的邻居节点 + * + * @returns {INode[]} + * @memberof Node + */ + + + Node.prototype.getNeighbors = function (type) { + var _this = this; + + var edges = this.get('edges'); + + if (type === 'target') { + // 当前节点为 source，它所指向的目标节点 + var neighhborsConverter_1 = function neighhborsConverter_1(edge) { + return edge.getSource() === _this; + }; + + return edges.filter(neighhborsConverter_1).map(function (edge) { + return edge.getTarget(); + }); + } + + if (type === 'source') { + // 当前节点为 target，它所指向的源节点 + var neighhborsConverter_2 = function neighhborsConverter_2(edge) { + return edge.getTarget() === _this; + }; + + return edges.filter(neighhborsConverter_2).map(function (edge) { + return edge.getSource(); + }); + } // 若未指定 type ，则返回所有邻居 + + + var neighhborsConverter = function neighhborsConverter(edge) { + return edge.getSource() === _this ? edge.getTarget() : edge.getSource(); + }; + + return edges.map(neighhborsConverter); + }; + /** + * 根据锚点的索引获取连接点 + * @param {Number} index 索引 + */ + + + Node.prototype.getLinkPointByAnchor = function (index) { + var anchorPoints = this.getAnchorPoints(); + return anchorPoints[index]; + }; + /** + * 获取连接点 + * @param point + */ + + + Node.prototype.getLinkPoint = function (point) { + var keyShape = this.get('keyShape'); + var type = keyShape.get('type'); + var itemType = this.get('type'); + var centerX; + var centerY; + var bbox = this.getBBox(); + + if (itemType === 'combo') { + centerX = bbox.centerX || (bbox.maxX + bbox.minX) / 2; + centerY = bbox.centerY || (bbox.maxY + bbox.minY) / 2; + } else { + centerX = bbox.centerX; + centerY = bbox.centerY; + } + + var anchorPoints = this.getAnchorPoints(); + var intersectPoint; + + switch (type) { + case 'circle': + intersectPoint = getCircleIntersectByPoint({ + x: centerX, + y: centerY, + r: bbox.width / 2 + }, point); + break; + + case 'ellipse': + intersectPoint = getEllipseIntersectByPoint({ + x: centerX, + y: centerY, + rx: bbox.width / 2, + ry: bbox.height / 2 + }, point); + break; + + default: + intersectPoint = getRectIntersectByPoint(bbox, point); + } + + var linkPoint = intersectPoint; // 如果存在锚点，则使用交点计算最近的锚点 + + if (anchorPoints.length) { + if (!linkPoint) { + // 如果计算不出交点 + linkPoint = point; + } + + linkPoint = this.getNearestPoint(anchorPoints, linkPoint); + } + + if (!linkPoint) { + // 如果最终依然没法找到锚点和连接点，直接返回中心点 + linkPoint = { + x: centerX, + y: centerY + }; + } + + return linkPoint; + }; + /** + * 获取锚点的定义 + * @return {array} anchorPoints + */ + + + Node.prototype.getAnchorPoints = function () { + var anchorPoints = this.get(CACHE_ANCHOR_POINTS$1); + + if (!anchorPoints) { + anchorPoints = []; + var shapeFactory = this.get('shapeFactory'); + var bbox_1 = this.getBBox(); + var model = this.get('model'); + var shapeCfg = this.getShapeCfg(model); + var type = model.type; + var points = shapeFactory.getAnchorPoints(type, shapeCfg) || []; + each$2(points, function (pointArr, index) { + var point = { + x: bbox_1.minX + pointArr[0] * bbox_1.width, + y: bbox_1.minY + pointArr[1] * bbox_1.height, + anchorIndex: index + }; + anchorPoints.push(point); + }); + this.set(CACHE_ANCHOR_POINTS$1, anchorPoints); + } + + return anchorPoints; + }; + /** + * add edge + * @param edge Edge instance + */ + + + Node.prototype.addEdge = function (edge) { + this.get('edges').push(edge); + }; + /** + * 锁定节点 + */ + + + Node.prototype.lock = function () { + this.set('locked', true); + }; + /** + * 解锁锁定的节点 + */ + + + Node.prototype.unlock = function () { + this.set('locked', false); + }; + + Node.prototype.hasLocked = function () { + return this.get('locked'); + }; + /** + * 移除边 + * @param {Edge} edge 边 + */ + + + Node.prototype.removeEdge = function (edge) { + var edges = this.getEdges(); + var index = edges.indexOf(edge); + + if (index > -1) { + edges.splice(index, 1); + } + }; + + Node.prototype.clearCache = function () { + this.set(CACHE_BBOX$1, null); // 清理缓存的 bbox + + this.set(CACHE_ANCHOR_POINTS$1, null); + }; + /** + * 是否仅仅移动节点，其他属性没变化 + * @param cfg 节点数据模型 + */ + + + Node.prototype.isOnlyMove = function (cfg) { + if (!cfg) { + return false; + } + + var existX = !isNil(cfg.x); + var existY = !isNil(cfg.y); + var keys = Object.keys(cfg); // 仅有一个字段，包含 x 或者 包含 y + // 两个字段，同时有 x，同时有 y + + return keys.length === 1 && (existX || existY) || keys.length === 2 && existX && existY; + }; + + return Node; +}(ItemBase); + +var CACHE_BBOX = 'bboxCache'; +var CACHE_CANVAS_BBOX = 'bboxCanvasCache'; +var CACHE_SIZE = 'sizeCache'; +var CACHE_ANCHOR_POINTS = 'anchorPointsCache'; + +var Combo = +/** @class */ +function (_super) { + __extends$e(Combo, _super); + + function Combo() { + return _super !== null && _super.apply(this, arguments) || this; + } + + Combo.prototype.getDefaultCfg = function () { + return { + type: 'combo', + nodes: [], + edges: [], + combos: [] + }; + }; + + Combo.prototype.getShapeCfg = function (model) { + var styles = this.get('styles'); + var bbox = this.get('bbox'); + + if (styles && bbox) { + // merge graph的item样式与数据模型中的样式 + var newModel = model; + var size = { + r: Math.hypot(bbox.height, bbox.width) / 2 || Global$1.defaultCombo.size[0] / 2, + width: bbox.width || Global$1.defaultCombo.size[0], + height: bbox.height || Global$1.defaultCombo.size[1] + }; + newModel.style = __assign$r(__assign$r(__assign$r({}, styles), model.style), size); + var padding = model.padding || Global$1.defaultCombo.padding; + + if (isNumber$4(padding)) { + size.r += padding; + size.width += padding * 2; + size.height += padding * 2; + } else { + size.r += padding[0]; + size.width += padding[1] + padding[3] || padding[1] * 2; + size.height += padding[0] + padding[2] || padding[0] * 2; + } + + this.set(CACHE_SIZE, size); + return newModel; + } + + return model; + }; + /** + * 根据 keyshape 计算包围盒 + */ + + + Combo.prototype.calculateCanvasBBox = function () { + if (this.destroyed) return; + var keyShape = this.get('keyShape'); + var group = this.get('group'); // 因为 group 可能会移动，所以必须通过父元素计算才能计算出正确的包围盒 + + var bbox = getBBox$1(keyShape, group); + bbox.centerX = (bbox.minX + bbox.maxX) / 2; + bbox.centerY = (bbox.minY + bbox.maxY) / 2; + var cacheSize = this.get(CACHE_SIZE); + var cacheBBox = this.get(CACHE_BBOX) || {}; + var oriX = cacheBBox.x; + var oriY = cacheBBox.x; + + if (cacheSize) { + cacheSize.width = Math.max(cacheSize.width, bbox.width); + cacheSize.height = Math.max(cacheSize.height, bbox.height); + var type = keyShape.get('type'); + + if (type === 'circle') { + bbox.width = cacheSize.r * 2; + bbox.height = cacheSize.r * 2; + } else { + bbox.width = cacheSize.width; + bbox.height = cacheSize.height; + } + + bbox.minX = bbox.centerX - bbox.width / 2; + bbox.minY = bbox.centerY - bbox.height / 2; + bbox.maxX = bbox.centerX + bbox.width / 2; + bbox.maxY = bbox.centerY + bbox.height / 2; + } else { + bbox.width = bbox.maxX - bbox.minX; + bbox.height = bbox.maxY - bbox.minY; + bbox.centerX = (bbox.minX + bbox.maxX) / 2; + bbox.centerY = (bbox.minY + bbox.maxY) / 2; + } + + bbox.x = bbox.minX; + bbox.y = bbox.minY; + if (bbox.x !== oriX || bbox.y !== oriY) this.set(CACHE_ANCHOR_POINTS, null); + return bbox; + }; + /** + * 获取 Combo 中所有的子元素，包括 Combo、Node 及 Edge + */ + + + Combo.prototype.getChildren = function () { + var self = this; + return { + nodes: self.getNodes(), + combos: self.getCombos() + }; + }; + /** + * 获取 Combo 中所有子节点 + */ + + + Combo.prototype.getNodes = function () { + var self = this; + return self.get('nodes'); + }; + /** + * 获取 Combo 中所有子 combo + */ + + + Combo.prototype.getCombos = function () { + var self = this; + return self.get('combos'); + }; + /** + * 向 Combo 中增加子 combo 或 node + * @param item Combo 或节点实例 + * @return boolean 添加成功返回 true，否则返回 false + */ + + + Combo.prototype.addChild = function (item) { + var self = this; + var itemType = item.getType(); + + switch (itemType) { + case 'node': + self.addNode(item); + break; + + case 'combo': + self.addCombo(item); + break; + + default: + console.warn('Only node or combo items are allowed to be added into a combo'); + return false; + } + + return true; + }; + /** + * 向 Combo 中增加 combo + * @param combo Combo 实例 + * @return boolean 添加成功返回 true，否则返回 false + */ + + + Combo.prototype.addCombo = function (combo) { + var self = this; + self.get('combos').push(combo); + return true; + }; + /** + * 向 Combo 中添加节点 + * @param node 节点实例 + * @return boolean 添加成功返回 true，否则返回 false + */ + + + Combo.prototype.addNode = function (node) { + var self = this; + self.get('nodes').push(node); + return true; + }; + /** + * 向 Combo 中增加子 combo 或 node + * @param item Combo 或节点实例 + * @return boolean 添加成功返回 true，否则返回 false + */ + + + Combo.prototype.removeChild = function (item) { + var self = this; + var itemType = item.getType(); + + switch (itemType) { + case 'node': + self.removeNode(item); + break; + + case 'combo': + self.removeCombo(item); + break; + + default: + console.warn('Only node or combo items are allowed to be added into a combo'); + return false; + } + + return true; + }; + /** + * 从 Combo 中移除指定的 combo + * @param combo Combo 实例 + * @return boolean 移除成功返回 true，否则返回 false + */ + + + Combo.prototype.removeCombo = function (combo) { + if (!combo) return; + var combos = this.getCombos(); + var index = combos.indexOf(combo); + + if (index > -1) { + combos.splice(index, 1); + return true; + } + + return false; + }; + /** + * 向 Combo 中移除指定的节点 + * @param node 节点实例 + * @return boolean 移除成功返回 true，否则返回 false + */ + + + Combo.prototype.removeNode = function (node) { + if (!node) return; + var nodes = this.getNodes(); + var index = nodes.indexOf(node); + + if (index > -1) { + nodes.splice(index, 1); + return true; + } + + return false; + }; + + Combo.prototype.isOnlyMove = function (cfg) { + return false; + }; + /** + * 获取 item 的包围盒，这个包围盒是相对于 item 自己，不会将 matrix 计算在内 + * @return {Object} 包含 x,y,width,height, centerX, centerY + */ + + + Combo.prototype.getBBox = function () { + this.set(CACHE_CANVAS_BBOX, null); + var bbox = this.calculateCanvasBBox(); + return bbox; + }; + + Combo.prototype.clearCache = function () { + this.set(CACHE_BBOX, null); // 清理缓存的 bbox + + this.set(CACHE_CANVAS_BBOX, null); + this.set(CACHE_ANCHOR_POINTS, null); + }; + + Combo.prototype.destroy = function () { + if (!this.destroyed) { + var animate = this.get('animate'); + var group = this.get('group'); + + if (animate) { + group.stopAnimate(); + } + + this.clearCache(); + this.set(CACHE_SIZE, null); + this.set('bbox', null); + group.remove(); + this._cfg = null; + this.destroyed = true; + } + }; + + return Combo; +}(Node); + +var NODE$1 = 'node'; +var EDGE = 'edge'; +var VEDGE = 'vedge'; +var COMBO = 'combo'; +var CFG_PREFIX = 'default'; +var MAPPER_SUFFIX = 'Mapper'; +var STATE_SUFFIX = 'stateStyles'; + +var ItemController = +/** @class */ +function () { + function ItemController(graph) { + this.graph = graph; + this.destroyed = false; + } + /** + * 增加 Item 实例 + * + * @param {ITEM_TYPE} type 实例类型，node 或 edge + * @param {(NodeConfig & EdgeConfig)} model 数据模型 + * @returns {(Item)} + * @memberof ItemController + */ + + + ItemController.prototype.addItem = function (type, model) { + var _this = this; + + var graph = this.graph; + var vType = type === VEDGE ? EDGE : type; + var parent = graph.get(vType + "Group") || graph.get('group'); + var upperType = upperFirst(vType); + var item = null; // 获取 this.get('styles') 中的值 + + var styles = graph.get(vType + upperFirst(STATE_SUFFIX)) || {}; + var defaultModel = graph.get(CFG_PREFIX + upperType); + + if (model[STATE_SUFFIX]) { + // 设置 this.get('styles') 中的值 + styles = model[STATE_SUFFIX]; + } + + if (defaultModel) { + // 很多布局会直接修改原数据模型，所以不能用 merge 的形式，逐个写入原 model 中 + each$2(defaultModel, function (val, cfg) { + if (isObject$f(val) && !isArray$n(val)) { + model[cfg] = deepMix({}, val, model[cfg]); + } else if (isArray$n(val)) { + model[cfg] = model[cfg] || clone$7(defaultModel[cfg]); + } else { + model[cfg] = model[cfg] || defaultModel[cfg]; + } + }); + } + + var mapper = graph.get(vType + MAPPER_SUFFIX); + + if (mapper) { + var mappedModel_1 = mapper(model); + + if (mappedModel_1[STATE_SUFFIX]) { + // 设置 this.get('styles') 中的值 + styles = mappedModel_1[STATE_SUFFIX]; + delete mappedModel_1[STATE_SUFFIX]; + } // 如果配置了 defaultEdge 或 defaultNode，则将默认配置的数据也合并进去 + + + each$2(mappedModel_1, function (val, cfg) { + if (isObject$f(val) && !isArray$n(val)) { + model[cfg] = deepMix({}, model[cfg], val); + } else { + model[cfg] = mappedModel_1[cfg] || model[cfg]; + } + }); + } + + graph.emit('beforeadditem', { + type: type, + model: model + }); + + if (type === EDGE || type === VEDGE) { + var source = void 0; + var target = void 0; + source = model.source; // eslint-disable-line prefer-destructuring + + target = model.target; // eslint-disable-line prefer-destructuring + + if (source && isString$3(source)) { + source = graph.findById(source); + } + + if (target && isString$3(target)) { + target = graph.findById(target); + } + + if (!source || !target) { + console.warn("The source or target node of edge " + model.id + " does not exist!"); + return; + } + + if (source.getType && source.getType() === 'combo') { + model.isComboEdge = true; // graph.updateCombo(source as ICombo); + } + + if (target.getType && target.getType() === 'combo') { + model.isComboEdge = true; // graph.updateCombo(target as ICombo); + } + + item = new Edge({ + model: model, + source: source, + target: target, + styles: styles, + linkCenter: graph.get('linkCenter'), + group: parent.addGroup() + }); + } else if (type === NODE$1) { + item = new Node({ + model: model, + styles: styles, + group: parent.addGroup() + }); + } else if (type === COMBO) { + var children = model.children; + var comboBBox = getComboBBox(children, graph); + model.x = comboBBox.x || model.x || Math.random() * 100; + model.y = comboBBox.y || model.y || Math.random() * 100; + var comboGroup = parent.addGroup(); + comboGroup.setZIndex(model.depth); + item = new Combo({ + model: model, + styles: styles, + bbox: comboBBox, + group: comboGroup + }); + var comboModel_1 = item.getModel(); + (children || []).forEach(function (child) { + var childItem = graph.findById(child.id); + item.addChild(childItem); + child.depth = comboModel_1.depth + 2; + }); // collapse the combo if the collapsed is true in the model + + if (model.collapsed) { + setTimeout(function () { + graph.collapseCombo(item); + + _this.updateCombo(item, []); + }, 250); + } + } + + if (item) { + graph.get(type + "s").push(item); + graph.get('itemMap')[item.get('id')] = item; + graph.emit('afteradditem', { + item: item, + model: model + }); // eslint-disable-next-line consistent-return + + return item; + } + }; + /** + * 更新节点或边 + * + * @param {Item} item ID 或 实例 + * @param {(EdgeConfig | Partial)} cfg 数据模型 + * @returns + * @memberof ItemController + */ + + + ItemController.prototype.updateItem = function (item, cfg) { + var _a, _b; + + var graph = this.graph; + + if (isString$3(item)) { + item = graph.findById(item); + } + + if (!item || item.destroyed) { + return; + } // 更新的 item 的类型 + + + var type = ''; + if (item.getType) type = item.getType(); + var mapper = graph.get(type + MAPPER_SUFFIX); + var model = item.getModel(); + var isOnlyMove = item.isOnlyMove(cfg); + + if (mapper) { + var result = deepMix({}, model, cfg); + var mappedModel = mapper(result); // 将 update 时候用户传入的参数与mapperModel做deepMix，以便复用之前设置的参数值 + + var newModel = deepMix({}, model, mappedModel, cfg); + + if (mappedModel[STATE_SUFFIX]) { + item.set('styles', newModel[STATE_SUFFIX]); + delete newModel[STATE_SUFFIX]; + } + + each$2(newModel, function (val, key) { + cfg[key] = val; + }); + } else { + // merge update传进来的对象参数，model中没有的数据不做处理，对象和字符串值也不做处理，直接替换原来的 + each$2(cfg, function (val, key) { + if (model[key]) { + if (isObject$f(val) && !isArray$n(val)) { + cfg[key] = __assign$r(__assign$r({}, model[key]), cfg[key]); + } + } + }); + } // emit beforeupdateitem 事件 + + + graph.emit('beforeupdateitem', { + item: item, + cfg: cfg + }); + + if (type === EDGE) { + // 若是边要更新source || target, 为了不影响示例内部model，并且重新计算startPoint和endPoint，手动设置 + if (cfg.source) { + var source = cfg.source; + + if (isString$3(source)) { + source = graph.findById(source); + } + + item.setSource(source); + } + + if (cfg.target) { + var target = cfg.target; + + if (isString$3(target)) { + target = graph.findById(target); + } + + item.setTarget(target); + } + + item.update(cfg); + } // item.update(cfg); + + + if (type === NODE$1 || type === COMBO) { + item.update(cfg, isOnlyMove); + var edges_1 = item.getEdges(); + var refreshEdge = shouldRefreshEdge(cfg); + if (refreshEdge && type === NODE$1) each$2(edges_1, function (edge) { + edge.refresh(); + });else if (refreshEdge && type === COMBO) { + var shapeFactory = item.get('shapeFactory'); + var shapeType = model.type || 'circle'; + var comboAnimate = model.animate === undefined || cfg.animate === undefined ? (_b = (_a = shapeFactory[shapeType]) === null || _a === void 0 ? void 0 : _a.options) === null || _b === void 0 ? void 0 : _b.animate : model.animate || cfg.animate; + + if (comboAnimate) { + setTimeout(function () { + if (!item || item.destroyed) return; + var keyShape = item.getKeyShape(); + if (!keyShape || keyShape.destroyed) return; + each$2(edges_1, function (edge) { + if (edge && !edge.destroyed) edge.refresh(); + }); + }, 201); + } else { + each$2(edges_1, function (edge) { + edge.refresh(); + }); + } + } + } + + graph.emit('afterupdateitem', { + item: item, + cfg: cfg + }); + }; + /** + * 根据 combo 的子元素更新 combo 的位置及大小 + * + * @param {ICombo} combo ID 或 实例 + * @returns + * @memberof ItemController + */ + + + ItemController.prototype.updateCombo = function (combo, children) { + var _a, _b; + + var graph = this.graph; + + if (isString$3(combo)) { + combo = graph.findById(combo); + } + + if (!combo || combo.destroyed) { + return; + } + + var comboBBox = getComboBBox(children, graph); + combo.set('bbox', comboBBox); + combo.update({ + x: comboBBox.x, + y: comboBBox.y + }); + var combEdges = combo.getEdges() || []; + var length = combEdges.length; + var model = combo.getModel(); + var shapeFactory = combo.get('shapeFactory'); + var shapeType = model.type || 'circle'; + var comboAnimate = model.animate === undefined ? (_b = (_a = shapeFactory[shapeType]) === null || _a === void 0 ? void 0 : _a.options) === null || _b === void 0 ? void 0 : _b.animate : model.animate; + + if (comboAnimate) { + setTimeout(function () { + if (!combo || combo.destroyed) return; + var keyShape = combo.getKeyShape(); + if (!keyShape || keyShape.destroyed) return; + + for (var i = 0; i < length; i++) { + var edge = combEdges[i]; + if (edge && !edge.destroyed) edge.refresh(); + } + }, 201); + } else { + for (var i = 0; i < length; i++) { + var edge = combEdges[i]; + if (edge && !edge.destroyed) edge.refresh(); + } + } + }; + /** + * 收起 combo，隐藏相关元素 + */ + + + ItemController.prototype.collapseCombo = function (combo) { + var graph = this.graph; + + if (isString$3(combo)) { + combo = graph.findById(combo); + } + + var children = combo.getChildren(); + children.nodes.forEach(function (node) { + graph.hideItem(node); + }); + children.combos.forEach(function (c) { + graph.hideItem(c); + }); + }; + /** + * 展开 combo，相关元素出现 + * 若子 combo 原先是收起状态，则保持它的收起状态 + */ + + + ItemController.prototype.expandCombo = function (combo) { + var graph = this.graph; + + if (isString$3(combo)) { + combo = graph.findById(combo); + } + + var children = combo.getChildren(); + children.nodes.forEach(function (node) { + graph.showItem(node); + }); + children.combos.forEach(function (c) { + if (c.getModel().collapsed) { + c.show(); + } else { + graph.showItem(c); + } + }); + }; + /** + * 删除指定的节点或边 + * + * @param {Item} item item ID 或实例 + * @returns {void} + * @memberof ItemController + */ + + + ItemController.prototype.removeItem = function (item) { + var _this = this; + + var graph = this.graph; + + if (isString$3(item)) { + item = graph.findById(item); + } + + if (!item || item.destroyed) { + return; + } + + var itemModel = clone$7(item.getModel()); + graph.emit('beforeremoveitem', { + item: itemModel + }); + var type = ''; + if (item.getType) type = item.getType(); + var items = graph.get(type + "s"); + var index = items.indexOf(item); + if (index > -1) items.splice(index, 1); + + if (type === EDGE) { + var vitems = graph.get("v" + type + "s"); + var vindex = vitems.indexOf(item); + if (vindex > -1) vitems.splice(vindex, 1); + } + + var itemId = item.get('id'); + var itemMap = graph.get('itemMap'); + delete itemMap[itemId]; + var comboTrees = graph.get('comboTrees'); + var id = item.get('id'); + + if (type === NODE$1) { + var comboId = item.getModel().comboId; + + if (comboTrees && comboId) { + var brothers_1 = comboTrees; + var found_1 = false; // the flag to terminate the forEach circulation + // remove the node from the children array of its parent fromt he tree + + comboTrees.forEach(function (ctree) { + if (found_1) return; + traverseTree$2(ctree, function (combo) { + if (combo.id === id && brothers_1) { + var bidx = brothers_1.indexOf(combo); + brothers_1.splice(bidx, 1); + found_1 = true; + return false; // terminate the traverse + } + + brothers_1 = combo.children; + return true; + }); + }); + } // 若移除的是节点，需要将与之相连的边一同删除 + + + var edges = item.getEdges(); + + for (var i = edges.length - 1; i >= 0; i--) { + graph.removeItem(edges[i], false); + } + + if (comboId) graph.updateCombo(comboId); + } else if (type === COMBO) { + var parentId = item.getModel().parentId; + var comboInTree_1; // find the subtree rooted at the item to be removed + + var found_2 = false; // the flag to terminate the forEach circulation + + (comboTrees || []).forEach(function (ctree) { + if (found_2) return; + traverseTree$2(ctree, function (combo) { + if (combo.id === id) { + comboInTree_1 = combo; + found_2 = true; + return false; // terminate the traverse + } + + return true; + }); + }); + comboInTree_1.removed = true; + + if (comboInTree_1 && comboInTree_1.children) { + comboInTree_1.children.forEach(function (child) { + _this.removeItem(child.id); + }); + } // 若移除的是 combo，需要将与之相连的边一同删除 + + + var edges = item.getEdges(); + + for (var i = edges.length; i >= 0; i--) { + graph.removeItem(edges[i], false); + } + + if (parentId) graph.updateCombo(parentId); + } + + item.destroy(); + graph.emit('afterremoveitem', { + item: itemModel + }); + }; + /** + * 更新 item 状态 + * + * @param {Item} item Item 实例 + * @param {string} state 状态名称 + * @param {boolean} value 是否启用状态或状态值 + * @returns {void} + * @memberof ItemController + */ + + + ItemController.prototype.setItemState = function (item, state, value) { + var graph = this.graph; + var stateName = state; + + if (isString$3(value)) { + stateName = state + ":" + value; + } // 已经存在要设置的 state，或不存在 state 的样式为 undefined + + + if (item.hasState(stateName) === value && value || // 当该状态已经存在且现在需要设置为 true 时，不需要继续。当该状态不存在，且设置为 false 时，需要继续 + isString$3(value) && item.hasState(stateName)) { + // 当该状态 value 是字符串，且已经存在该状态，不需要继续 + return; + } + + graph.emit('beforeitemstatechange', { + item: item, + state: stateName, + enabled: value + }); + item.setState(state, value); + graph.autoPaint(); + graph.emit('afteritemstatechange', { + item: item, + state: stateName, + enabled: value + }); + }; + /** + * 将指定状态的优先级提升为最高优先级 + * @param {Item} item 元素id或元素实例 + * @param state 状态名称 + */ + + + ItemController.prototype.priorityState = function (item, state) { + var graph = this.graph; + var currentItem = item; + + if (isString$3(item)) { + currentItem = graph.findById(item); + } // 先取消已有的 state + + + this.setItemState(currentItem, state, false); // 再设置state，则此时该优先级为最高 + + this.setItemState(currentItem, state, true); + }; + /** + * 清除所有指定的状态 + * + * @param {Item} item Item 实例 + * @param {string[]} states 状态名称集合 + * @memberof ItemController + */ + + + ItemController.prototype.clearItemStates = function (item, states) { + var graph = this.graph; + + if (isString$3(item)) { + item = graph.findById(item); + } + + graph.emit('beforeitemstatesclear', { + item: item, + states: states + }); + item.clearStates(states); + graph.emit('afteritemstatesclear', { + item: item, + states: states + }); + }; + /** + * 刷新指定的 Item + * + * @param {Item} item Item ID 或 实例 + * @memberof ItemController + */ + + + ItemController.prototype.refreshItem = function (item) { + var graph = this.graph; + + if (isString$3(item)) { + item = graph.findById(item); + } + + graph.emit('beforeitemrefresh', { + item: item + }); // 调用 Item 的 refresh 方法，实现刷新功能 + + item.refresh(); + graph.emit('afteritemrefresh', { + item: item + }); + }; + /** + * 根据 graph 上用 combos 数据生成的 comboTree 来增加所有 combos + * + * @param {ComboTree[]} comboTrees graph 上用 combos 数据生成的 comboTree + * @param {ComboConfig[]} comboModels combos 数据 + * @memberof ItemController + */ + + + ItemController.prototype.addCombos = function (comboTrees, comboModels) { + var _this = this; + + var graph = this.graph; + (comboTrees || []).forEach(function (ctree) { + traverseTreeUp$1(ctree, function (child) { + var comboModel; + comboModels.forEach(function (model) { + if (model.id === child.id) { + model.children = child.children; + model.depth = child.depth; + comboModel = model; + } + }); + + if (comboModel) { + _this.addItem('combo', comboModel); + } + + return true; + }); + }); + var comboGroup = graph.get('comboGroup'); + if (comboGroup) comboGroup.sort(); + }; + /** + * 改变Item的显示状态 + * + * @param {Item} item Item ID 或 实例 + * @param {boolean} visible 是否显示 + * @memberof ItemController + */ + + + ItemController.prototype.changeItemVisibility = function (item, visible) { + var _this = this; + + var graph = this.graph; + + if (isString$3(item)) { + item = graph.findById(item); + } + + if (!item) { + console.warn('The item to be shown or hidden does not exist!'); + return; + } + + graph.emit('beforeitemvisibilitychange', { + item: item, + visible: visible + }); + item.changeVisibility(visible); + + if (item.getType && item.getType() === NODE$1) { + var edges = item.getEdges(); + each$2(edges, function (edge) { + // 若隐藏节点，则将与之关联的边也隐藏 + // 若显示节点，则将与之关联的边也显示，但是需要判断边两端的节点都是可见的 + if (visible && !(edge.get('source').isVisible() && edge.get('target').isVisible())) { + return; + } + + _this.changeItemVisibility(edge, visible); + }); + } else if (item.getType && item.getType() === COMBO) { + var comboTrees = graph.get('comboTrees'); + var id_1 = item.get('id'); + var children_1 = []; + var found_3 = false; // flag the terminate the forEach + + (comboTrees || []).forEach(function (ctree) { + if (found_3) return; + if (!ctree.children || ctree.children.length === 0) return; + traverseTree$2(ctree, function (combo) { + if (combo.id === id_1) { + children_1 = combo.children; + found_3 = true; + return false; // terminate the traverse + } + + return true; + }); + }); + + if (children_1) { + children_1.forEach(function (child) { + var childItem = graph.findById(child.id); + + _this.changeItemVisibility(childItem, visible); + }); + } + + var edges = item.getEdges(); + each$2(edges, function (edge) { + // 若隐藏 combo，则将与 combo 本身关联的边也隐藏 + // 若显示 combo，则将与 combo 本身关联的边也显示，但是需要判断边两端的节点都是可见的 + if (visible && !(edge.get('source').isVisible() && edge.get('target').isVisible())) { + return; + } + + _this.changeItemVisibility(edge, visible); + }); + } + + graph.emit('afteritemvisibilitychange', { + item: item, + visible: visible + }); + return item; + }; + + ItemController.prototype.destroy = function () { + this.graph = null; + this.destroyed = true; + }; + + return ItemController; +}(); + +var timer = null; + +var StateController = +/** @class */ +function () { + function StateController(graph) { + this.graph = graph; + /** + * this.cachedStates = { + * enabled: { + * hover: [Node] + * }, + * disabled: {} + * } + */ + + this.cachedStates = { + enabled: {}, + disabled: {} + }; + this.destroyed = false; + } + /** + * 检查 cache 的可用性 + * + * @private + * @param {Item} item + * @param {string} state + * @param {object} cache + * @returns + * @memberof State + */ + + + StateController.checkCache = function (item, state, cache) { + if (!cache[state]) { + return; + } + + var index = cache[state].indexOf(item); + + if (index >= 0) { + cache[state].splice(index, 1); + } + }; + /** + * 缓存 state + * + * @private + * @param {Item} item Item 实例 + * @param {string} state 状态名称 + * @param {object} states + * @memberof State + */ + + + StateController.cacheState = function (item, state, states) { + if (!states[state]) { + states[state] = []; + } + + states[state].push(item); + }; + /** + * 更新 Item 的状态 + * + * @param {Item} item Item实例 + * @param {string} state 状态名称 + * @param {boolean} enabled 状态是否可用 + * @memberof State + */ + + + StateController.prototype.updateState = function (item, state, enabled) { + var _this = this; + + var checkCache = StateController.checkCache, + cacheState = StateController.cacheState; + + if (item.destroyed) { + return; + } + + var cachedStates = this.cachedStates; + var enabledStates = cachedStates.enabled; + var disabledStates = cachedStates.disabled; + + if (enabled) { + checkCache(item, state, disabledStates); + cacheState(item, state, enabledStates); + } else { + checkCache(item, state, enabledStates); + cacheState(item, state, disabledStates); + } + + if (timer) { + clearTimeout(timer); + } + + timer = setTimeout(function () { + timer = null; + + _this.updateGraphStates(); + }, 16); + }; + /** + * 批量更新 states，兼容 updateState，支持更新一个 state + * + * @param {Item} item + * @param {(string | string[])} states + * @param {boolean} enabled + * @memberof State + */ + + + StateController.prototype.updateStates = function (item, states, enabled) { + var _this = this; + + if (isString$3(states)) { + this.updateState(item, states, enabled); + } else { + states.forEach(function (state) { + _this.updateState(item, state, enabled); + }); + } + }; + /** + * 更新 states + * + * @memberof State + */ + + + StateController.prototype.updateGraphStates = function () { + var states = this.graph.get('states'); + var cachedStates = this.cachedStates; + each$2(cachedStates.disabled, function (val, key) { + if (states[key]) { + states[key] = states[key].filter(function (item) { + return val.indexOf(item) < 0 && !val.destroyed; + }); + } + }); + each$2(cachedStates.enabled, function (val, key) { + if (!states[key]) { + states[key] = val; + } else { + var map_1 = {}; + states[key].forEach(function (item) { + if (!item.destroyed) { + map_1[item.get('id')] = true; + } + }); + val.forEach(function (item) { + if (!item.destroyed) { + var id = item.get('id'); + + if (!map_1[id]) { + map_1[id] = true; + states[key].push(item); + } + } + }); + } + }); + this.graph.emit('graphstatechange', { + states: states + }); + this.cachedStates = { + enabled: {}, + disabled: {} + }; + }; + + StateController.prototype.destroy = function () { + this.graph = null; + this.cachedStates = null; + + if (timer) { + clearTimeout(timer); + } + + timer = null; + this.destroyed = true; + }; + + return StateController; +}(); + +/** + * 替换字符串中的字段 + * @param {String} str 模版字符串 + * @param {Object} o json data + */ + +var substitute = function substitute(str, o) { + if (!str || !o) { + return str; + } + + return str.replace(/\\?\{([^{}]+)\}/g, function (match, name) { + if (match.charAt(0) === '\\') { + return match.slice(1); + } + + var res = o[name]; + if (res === 0) res = '0'; + return res || ''; + }); +}; +/** + * 给定坐标获取三次贝塞尔曲线的 M 及 C 值 + * @param points coordinate set + */ + + +var getSpline = function getSpline(points) { + var data = []; + + if (points.length < 2) { + throw new Error("point length must largn than 2, now it's " + points.length); + } + + for (var _i = 0, points_1 = points; _i < points_1.length; _i++) { + var point = points_1[_i]; + var x = point.x, + y = point.y; + data.push(x); + data.push(y); + } + + var spliePath = catmullRom2Bezier(data); + spliePath.unshift(['M', points[0].x, points[0].y]); + return spliePath; +}; +/** + * 根据起始点、相对位置、偏移量计算控制点 + * @param {IPoint} startPoint 起始点，包含 x,y + * @param {IPoint} endPoint 结束点, 包含 x,y + * @param {Number} percent 相对位置,范围 0-1 + * @param {Number} offset 偏移量 + * @return {IPoint} 控制点，包含 x,y + */ + +var getControlPoint = function getControlPoint(startPoint, endPoint, percent, offset) { + if (percent === void 0) { + percent = 0; + } + + if (offset === void 0) { + offset = 0; + } + + var point = { + x: (1 - percent) * startPoint.x + percent * endPoint.x, + y: (1 - percent) * startPoint.y + percent * endPoint.y + }; + var tangent = [0, 0]; + normalize$4(tangent, [endPoint.x - startPoint.x, endPoint.y - startPoint.y]); + + if (!tangent || !tangent[0] && !tangent[1]) { + tangent = [0, 0]; + } + + var perpendicular = [-tangent[1] * offset, tangent[0] * offset]; // 垂直向量 + + point.x += perpendicular[0]; + point.y += perpendicular[1]; + return point; +}; +/** + * 点集转化为Path多边形 + * @param {Array} points 点集 + * @param {Boolen} z 是否封闭 + * @return {Array} Path + */ + +var pointsToPolygon = function pointsToPolygon(points, z) { + var length = points.length; + + if (!length) { + return ''; + } + + var path = ''; + var str = ''; + + for (var i = 0; i < length; i++) { + var item = points[i]; + + if (i === 0) { + str = 'M{x} {y}'; + } else { + str = 'L{x} {y}'; + } + + path += substitute(str, item); + } + + if (z) { + path += 'Z'; + } + + return path; +}; +var pathToPoints$1 = function pathToPoints(path) { + var points = []; + path.forEach(function (seg) { + var command = seg[0]; + + if (command !== 'A') { + for (var i = 1; i < seg.length; i = i + 2) { + points.push([seg[i], seg[i + 1]]); + } + } else { + var length_1 = seg.length; + points.push([seg[length_1 - 2], seg[length_1 - 1]]); + } + }); + return points; +}; +/** + * 生成平滑的闭合曲线 + * @param points + */ + +var getClosedSpline = function getClosedSpline(points) { + if (points.length < 2) { + throw new Error("point length must largn than 2, now it's " + points.length); + } + + var first = points[0]; + var second = points[1]; + var last = points[points.length - 1]; + var lastSecond = points[points.length - 2]; + points.unshift(last); + points.unshift(lastSecond); + points.push(first); + points.push(second); + var closedPath = []; + + for (var i = 1; i < points.length - 2; i += 1) { + var x0 = points[i - 1].x; + var y0 = points[i - 1].y; + var x1 = points[i].x; + var y1 = points[i].y; + var x2 = points[i + 1].x; + var y2 = points[i + 1].y; + var x3 = i !== points.length - 2 ? points[i + 2].x : x2; + var y3 = i !== points.length - 2 ? points[i + 2].y : y2; + var cp1x = x1 + (x2 - x0) / 6; + var cp1y = y1 + (y2 - y0) / 6; + var cp2x = x2 - (x3 - x1) / 6; + var cp2y = y2 - (y3 - y1) / 6; + closedPath.push(['C', cp1x, cp1y, cp2x, cp2y, x2, y2]); + } + + closedPath.unshift(['M', last.x, last.y]); + return closedPath; +}; + +var vecScaleTo = function vecScaleTo(v, length) { + // Vector with direction of v with specified length + return scale$4([0, 0], normalize$4([0, 0], v), length); +}; + +var unitNormal = function unitNormal(p0, p1) { + // Returns the unit normal to the line segment from p0 to p1. + var n = [p0[1] - p1[1], p1[0] - p0[0]]; + var nLength = Math.sqrt(n[0] * n[0] + n[1] * n[1]); + + if (nLength === 0) { + throw new Error('p0 should not be equal to p1'); + } + + return [n[0] / nLength, n[1] / nLength]; +}; + +var vecFrom = function vecFrom(p0, p1) { + // Vector from p0 to p1 + return [p1[0] - p0[0], p1[1] - p0[1]]; +}; +/** + * 传入的节点作为多边形顶点，生成有圆角的多边形 + * @param polyPoints 多边形顶点 + * @param padding 在原多边形基础上增加最终轮廓和原多边形的空白间隔 + */ + + +function roundedHull(polyPoints, padding) { + // The rounded hull path around a single point + var roundedHull1 = function roundedHull1(points) { + var p1 = [points[0][0], points[0][1] - padding]; + var p2 = [points[0][0], points[0][1] + padding]; + return "M " + p1 + " A " + padding + "," + padding + ",0,0,0," + p2 + " A " + padding + "," + padding + ",0,0,0," + p1; + }; // The rounded hull path around two points + + + var roundedHull2 = function roundedHull2(points) { + var offsetVector = scale$4([0, 0], unitNormal(points[0], points[1]), padding); + var invOffsetVector = scale$4([0, 0], offsetVector, -1); + var p0 = add$3([0, 0], points[0], offsetVector); + var p1 = add$3([0, 0], points[1], offsetVector); + var p2 = add$3([0, 0], points[1], invOffsetVector); + var p3 = add$3([0, 0], points[0], invOffsetVector); + return "M " + p0 + " L " + p1 + " A " + [padding, padding, '0,0,0', p2].join(',') + " L " + p3 + " A " + [padding, padding, '0,0,0', p0].join(','); + }; // 特殊情况处理：节点数小于等于2 + + + if (!polyPoints || polyPoints.length < 1) return ''; + if (polyPoints.length === 1) return roundedHull1(polyPoints); + if (polyPoints.length === 2) return roundedHull2(polyPoints); + var segments = new Array(polyPoints.length); // Calculate each offset (outwards) segment of the convex hull. + + for (var segmentIndex = 0; segmentIndex < segments.length; ++segmentIndex) { + var p0 = segmentIndex === 0 ? polyPoints[polyPoints.length - 1] : polyPoints[segmentIndex - 1]; + var p1 = polyPoints[segmentIndex]; // Compute the offset vector for the line segment, with length = padding. + + var offset = scale$4([0, 0], unitNormal(p0, p1), padding); + segments[segmentIndex] = [add$3([0, 0], p0, offset), add$3([0, 0], p1, offset)]; + } + + var arcData = "A " + [padding, padding, '0,0,0,'].join(','); + segments = segments.map(function (segment, index) { + var pathFragment = ''; + + if (index === 0) { + pathFragment = "M " + segments[segments.length - 1][1] + " "; + } + + pathFragment += arcData + segment[0] + " L " + segment[1]; + return pathFragment; + }); + return segments.join(' '); +} +/** + * 传入的节点作为多边形顶点，生成平滑的闭合多边形 + * @param polyPoints + * @param padding + */ + +function paddedHull(polyPoints, padding) { + var pointCount = polyPoints.length; + + var smoothHull1 = function smoothHull1(points) { + // Returns the path for a circular hull around a single point. + var p1 = [points[0][0], points[0][1] - padding]; + var p2 = [points[0][0], points[0][1] + padding]; + return "M " + p1 + " A " + [padding, padding, '0,0,0', p2].join(',') + " A " + [padding, padding, '0,0,0', p1].join(','); + }; // Returns the path for a rounded hull around two points. + + + var smoothHull2 = function smoothHull2(points) { + var v = vecFrom(points[0], points[1]); + var extensionVec = vecScaleTo(v, padding); + var extension0 = add$3([0, 0], points[0], scale$4([0, 0], extensionVec, -1)); + var extension1 = add$3([0, 0], points[1], extensionVec); + var tangentHalfLength = 1.2 * padding; + var controlDelta = vecScaleTo(normalize$4([0, 0], v), tangentHalfLength); + var invControlDelta = scale$4([0, 0], controlDelta, -1); + var control0 = add$3([0, 0], extension0, invControlDelta); + var control1 = add$3([0, 0], extension1, invControlDelta); + var control3 = add$3([0, 0], extension0, controlDelta); // return [ + // ['M', extension0[0], extension0[1]], + // ['C', control0, control1, extension1], + // ['S', control3, extension0], + // 'Z', + // ]; + + return "M " + extension0 + " C " + [control0, control1, extension1].join(',') + " S " + [control3, extension0].join(',') + " Z"; + }; // Handle special cases + + + if (!polyPoints || pointCount < 1) return ''; + if (pointCount === 1) return smoothHull1(polyPoints); + if (pointCount === 2) return smoothHull2(polyPoints); + var hullPoints = polyPoints.map(function (point, index) { + var pNext = polyPoints[(index + 1) % pointCount]; + return { + p: point, + v: normalize$4([0, 0], vecFrom(point, pNext)) + }; + }); // Compute the expanded hull points, and the nearest prior control point for each. + + for (var i = 0; i < hullPoints.length; ++i) { + var priorIndex = i > 0 ? i - 1 : pointCount - 1; + var extensionVec = normalize$4([0, 0], add$3([0, 0], hullPoints[priorIndex].v, scale$4([0, 0], hullPoints[i].v, -1))); + hullPoints[i].p = add$3([0, 0], hullPoints[i].p, scale$4([0, 0], extensionVec, padding)); + } + + return hullPoints.map(function (obj) { + var point = obj.p; + return { + x: point[0], + y: point[1] + }; + }); +} + +var PathUtil = /*#__PURE__*/Object.freeze({ + __proto__: null, + getSpline: getSpline, + getControlPoint: getControlPoint, + pointsToPolygon: pointsToPolygon, + pathToPoints: pathToPoints$1, + getClosedSpline: getClosedSpline, + roundedHull: roundedHull, + paddedHull: paddedHull +}); + +/** + * Use cross product to judge the direction of the turn. + * Returns a positive value, if OAB makes a clockwise turn, + * negative for counter-clockwise turn, and zero if the points are collinear. + */ +var cross$1 = function cross(a, b, o) { + return (a.y - o.y) * (b.x - o.x) - (a.x - o.x) * (b.y - o.y); +}; +/** + * Generate a convex hull of given points. Andrew's monotone chain algorithm. + * @param points An array of [x, y] representing the coordinates of points. + * @return a list of vertices of the convex hull in counter-clockwise order, + */ + +var genConvexHull = function genConvexHull(items) { + var points = items.map(function (item) { + return { + x: item.getModel().x, + y: item.getModel().y + }; + }); + points.sort(function (a, b) { + return a.x === b.x ? a.y - b.y : a.x - b.x; + }); + + if (points.length === 1) { + return points; + } // build the lower hull + + + var lower = []; + + for (var i = 0; i < points.length; i++) { + while (lower.length >= 2 && cross$1(lower[lower.length - 2], lower[lower.length - 1], points[i]) <= 0) { + lower.pop(); + } + + lower.push(points[i]); + } // build the upper hull + + + var upper = []; + + for (var i = points.length - 1; i >= 0; i--) { + while (upper.length >= 2 && cross$1(upper[upper.length - 2], upper[upper.length - 1], points[i]) <= 0) { + upper.pop(); + } + + upper.push(points[i]); + } + + upper.pop(); + lower.pop(); + var strictHull = lower.concat(upper); + return strictHull; +}; + +var defaultOps = { + maxRoutingIterations: 100, + maxMarchingIterations: 100, + pixelGroupSize: 2, + edgeR0: 10, + edgeR1: 10, + nodeR0: 5, + nodeR1: 10, + morphBuffer: 5, + threshold: 0.001, + skip: 16, + nodeInfluenceFactor: 1, + edgeInfluenceFactor: 1, + negativeNodeInfluenceFactor: -0.5 +}; +/** + * Marching square algorithm for traching the contour of a pixel group + * https://www.emanueleferonato.com/2013/03/01/using-marching-squares-algorithm-to-trace-the-contour-of-an-image/ + * @param potentialArea + * @param threshold + */ + +function MarchingSquares(contour, potentialArea, threshold) { + var marched = false; + + var getVal = function getVal(x, y) { + return potentialArea.cells[x + y * potentialArea.width]; + }; + + var getState = function getState(x, y) { + var squareVal = 0; + + if (getVal(x - 1, y - 1) >= threshold) { + squareVal += 1; + } + + if (getVal(x, y - 1) > threshold) { + squareVal += 2; + } + + if (getVal(x - 1, y) > threshold) { + squareVal += 4; + } + + if (getVal(x, y) > threshold) { + squareVal += 8; + } + + return squareVal; + }; + + var doMarch = function doMarch(xPos, yPos) { + var x = xPos; + var y = yPos; + var prevX; + var prevY; + + for (var i = 0; i < potentialArea.width * potentialArea.height; i++) { + prevX = x; + prevY = y; + + if (contour.findIndex(function (item) { + return item.x === x && item.y === y; + }) > -1) { + if (contour[0].x !== x || contour[0].y !== y) ; else { + return true; + } + } else { + contour.push({ + x: x, + y: y + }); + } + + var state = getState(x, y); // assign the move direction according to state of the square + + switch (state) { + case -1: + console.warn('Marched out of bounds'); + return true; + + case 0: + case 3: + case 2: + case 7: + x++; // go right + + break; + + case 12: + case 14: + case 4: + x--; // go left + + break; + + case 6: + // go left if come from up else go right + if (prevX === 0) { + if (prevY === -1) { + x -= 1; + } else { + x += 1; + } + } + + break; + + case 1: + case 13: + case 5: + y--; // go up + + break; + + case 9: + // go up if come from right else go down + if (prevX === 1) { + if (prevY === 0) { + y -= 1; + } else { + y += 1; + } + } + + break; + + case 10: + case 8: + case 11: + y++; // go down + + break; + + default: + console.warn("Marching squares invalid state: " + state); + return true; + } + } + }; + + this.march = function () { + for (var x = 0; x < potentialArea.width && !marched; x += 1) { + for (var y = 0; y < potentialArea.height && !marched; y += 1) { + if (getVal(x, y) > threshold && getState(x, y) !== 15) { + marched = doMarch(x, y); + } + } + } + + return marched; + }; +} +/** + * Space partition & assign value to each cell + * @param points + */ + + +var initGridCells = function initGridCells(width, height, pixelGroupSize) { + var scaleWidth = Math.ceil(width / pixelGroupSize); + var scaleHeight = Math.ceil(height / pixelGroupSize); + var gridCells = new Float32Array(Math.max(0, scaleWidth * scaleHeight)).fill(0); + return { + cells: gridCells, + width: scaleWidth, + height: scaleHeight + }; +}; +/** + * Find the optimal already visited member to item; + Optimal: minimize cost(j) = distance(i,j) ∗ countObstacles(i,j) + * @param item + * @param visited + */ + + +var pickBestNeighbor = function pickBestNeighbor(item, visited, nonMembers) { + var closestNeighbour = null; + var minCost = Number.POSITIVE_INFINITY; + visited.forEach(function (neighbourItem) { + var itemP = { + x: item.getModel().x, + y: item.getModel().y + }; + var neighbourItemP = { + x: neighbourItem.getModel().x, + y: neighbourItem.getModel().y + }; + var dist = squareDist(itemP, neighbourItemP); + var directLine = new Line$1(itemP.x, itemP.y, neighbourItemP.x, neighbourItemP.y); + var numberObstacles = nonMembers.reduce(function (count, _item) { + if (fractionToLine(_item, directLine) > 0) { + return count + 1; + } + + return count; + }, 0); + + if (dist * Math.pow(numberObstacles + 1, 2) < minCost) { + closestNeighbour = neighbourItem; + minCost = dist * Math.pow(numberObstacles + 1, 2); + } + }); + return closestNeighbour; +}; +/** + * 返回和线相交的item中，离边的起点最近的item + * @param items + * @param line + */ + + +var getIntersectItem = function getIntersectItem(items, line) { + var minDistance = Number.POSITIVE_INFINITY; + var closestItem = null; + items.forEach(function (item) { + var distance = fractionToLine(item, line); // find closest intersection + + if (distance >= 0 && distance < minDistance) { + closestItem = item; + minDistance = distance; + } + }); + return closestItem; +}; +/** + * Modify the directLine and Route virtual edges around obstacles + */ + + +var computeRoute = function computeRoute(directLine, nonMembers, maxRoutingIterations, morphBuffer) { + var checkedLines = []; + var linesToCheck = []; + linesToCheck.push(directLine); + var hasIntersection = true; + var iterations = 0; + + var pointExists = function pointExists(point, lines) { + var flag = false; + lines.forEach(function (line) { + if (flag) return; + + if (isPointsOverlap(point, { + x: line.x1, + y: line.y1 + }) || isPointsOverlap(point, { + x: line.x2, + y: line.y2 + })) { + flag = true; + } + }); + return flag; + }; + + var isPointInNonMembers = function isPointInNonMembers(point, _nonMembers) { + for (var _i = 0, _nonMembers_1 = _nonMembers; _i < _nonMembers_1.length; _i++) { + var item = _nonMembers_1[_i]; + var bbox = item.getBBox(); + var itemContour = [[bbox.x, bbox.y], [bbox.x + bbox.width, bbox.y], [bbox.x, bbox.y + bbox.height], [bbox.x + bbox.width, bbox.y + bbox.height]]; + + if (isPointInPolygon(itemContour, point.x, point.y)) { + return true; + } + } + + return false; + }; // outer loop end when no more intersections or out of iterations + + + while (hasIntersection && iterations < maxRoutingIterations) { + hasIntersection = false; + + var _loop_1 = function _loop_1() { + var line = linesToCheck.pop(); + var closestItem = getIntersectItem(nonMembers, line); + + if (closestItem) { + var _a = itemIntersectByLine(closestItem, line), + intersections_1 = _a[0], + countIntersections = _a[1]; // if line passes through item + + + if (countIntersections === 2) { + var testReroute = function testReroute(isFirst) { + var tempMorphBuffer = morphBuffer; + var virtualNode = rerouteLine(closestItem, tempMorphBuffer, intersections_1, isFirst); // test the virtualNode already exists + + var exist = pointExists(virtualNode, linesToCheck) || pointExists(virtualNode, checkedLines); + var pointInside = isPointInNonMembers(virtualNode, nonMembers); + + while (!exist && pointInside && tempMorphBuffer >= 1) { + // try a smaller buffer + tempMorphBuffer /= 1.5; + virtualNode = rerouteLine(closestItem, tempMorphBuffer, intersections_1, isFirst); + exist = pointExists(virtualNode, linesToCheck) || pointExists(virtualNode, checkedLines); + pointInside = isPointInNonMembers(virtualNode, nonMembers); + } // 第二次route时不要求pointInside + + + if (virtualNode && !exist && (!isFirst || !pointInside)) { + // add 2 rerouted lines to check + linesToCheck.push(new Line$1(line.x1, line.y1, virtualNode.x, virtualNode.y)); + linesToCheck.push(new Line$1(virtualNode.x, virtualNode.y, line.x2, line.y2)); + hasIntersection = true; + } + }; + + testReroute(true); + + if (!hasIntersection) { + // if we didn't find a valid point around the first corner, try the second + testReroute(false); + } + } + } // no intersection found, mark this line as completed + + + if (!hasIntersection) { + checkedLines.push(line); + } + + iterations += 1; + }; // inner loop end when out of lines or found an intersection + + + while (!hasIntersection && linesToCheck.length) { + _loop_1(); + } + } // 加入剩余的线 + + + while (linesToCheck.length) { + checkedLines.push(linesToCheck.pop()); + } + + return checkedLines; +}; +/** + * Connect item with visited members using direct line or virtual edges + */ + + +function getRoute(item, nonMembers, visited, maxRoutingIterations, morphBuffer) { + var optimalNeighbor = pickBestNeighbor(item, visited, nonMembers); + + if (optimalNeighbor === null) { + return []; + } // merge the consecutive lines + + + var mergeLines = function mergeLines(checkedLines) { + var finalRoute = []; + + while (checkedLines.length > 0) { + var line1 = checkedLines.pop(); + + if (checkedLines.length === 0) { + finalRoute.push(line1); + break; + } + + var line2 = checkedLines.pop(); + var mergeLine = new Line$1(line1.x1, line1.y1, line2.x2, line2.y2); + var closestItem = getIntersectItem(nonMembers, mergeLine); // merge most recent line and previous line + + if (!closestItem) { + checkedLines.push(mergeLine); + } else { + finalRoute.push(line1); + checkedLines.push(line2); + } + } + + return finalRoute; + }; + + var directLine = new Line$1(item.getModel().x, item.getModel().y, optimalNeighbor.getModel().x, optimalNeighbor.getModel().y); + var checkedLines = computeRoute(directLine, nonMembers, maxRoutingIterations, morphBuffer); + var finalRoute = mergeLines(checkedLines); + return finalRoute; +} +/** + * Calculate the countor that includes the selected items and exclues the non-selected items + * @param graph + * @param members + * @param nonMembers + * @param options + */ + + +var genBubbleSet = function genBubbleSet(members, nonMembers, ops) { + // eslint-disable-next-line no-redeclare + var options = Object.assign(defaultOps, ops); + var centroid = getPointsCenter(members.map(function (item) { + return { + x: item.getModel().x, + y: item.getModel().y + }; + })); // 按照到中心距离远近排序 + + members = members.sort(function (a, b) { + return squareDist({ + x: a.getModel().x, + y: a.getModel().y + }, centroid) - squareDist({ + x: b.getModel().x, + y: b.getModel().y + }, centroid); + }); + var visited = []; + var virtualEdges = []; + members.forEach(function (item) { + var lines = getRoute(item, nonMembers, visited, options.maxRoutingIterations, options.morphBuffer); + lines.forEach(function (l) { + virtualEdges.push(l); + }); + visited.push(item); + }); // 由于edge也可以作为member和nonMember传入，暂时不考虑把edges作为参数传入genBubbleSet + // edges && edges.forEach(e => { + // virtualEdges.push(new Line(e.getSource().getModel().x, e.getSource().getModel().y, e.getTarget().getModel().x, e.getTarget().getModel().y)); + // }); + + var activeRegion = getActiveRregion(members, virtualEdges, options.nodeR0); + var potentialArea = initGridCells(activeRegion.width, activeRegion.height, options.pixelGroupSize); // Use march squares to generate contour + + var contour = []; + var hull = []; + + for (var iterations = 0; iterations < options.maxMarchingIterations; iterations++) { + fillPotentialArea(members, nonMembers, virtualEdges, activeRegion, potentialArea, options); + contour = []; + hull = []; + if (!new MarchingSquares(contour, potentialArea, options.threshold).march()) continue; + var marchedPath = contour.map(function (point) { + return { + x: Math.round(point.x * options.pixelGroupSize + activeRegion.minX), + y: Math.round(point.y * options.pixelGroupSize + activeRegion.minY) + }; + }); // const marchedPath = marchingSquares(potentialArea, options.threshold).map(point => ({ x: Math.round(point.x * options.pixelGroupSize + activeRegion.minX), y: Math.round(point.y * options.pixelGroupSize + activeRegion.minY) })) + + if (marchedPath) { + var size = marchedPath.length; + + if (options.skip > 1) { + size = Math.floor(marchedPath.length / options.skip); // if we reduced too much (fewer than three points in reduced surface) reduce skip and try again + + while (size < 3 && options.skip > 1) { + options.skip -= 1; + size = Math.floor(marchedPath.length / options.skip); + } + } // copy hull values + + + for (var i = 0, j = 0; j < size; j += 1, i += options.skip) { + hull.push({ + x: marchedPath[i].x, + y: marchedPath[i].y + }); + } + } + + var isContourValid = function isContourValid() { + for (var _i = 0, members_1 = members; _i < members_1.length; _i++) { + var item = members_1[_i]; + var hullPoints = hull.map(function (point) { + return [point.x, point.y]; + }); + if (!isPointInPolygon(hullPoints, item.getBBox().centerX, item.getBBox().centerY)) return false; + } // 不强制要求所有nonMembers都没有包含在内 + // for (const item of nonMembers) { + // if (isPointInPolygon({ x: item.getBBox().centerX, y: item.getBBox().centerY }, contour)) return false + // } + + + return true; + }; + + if (hull && isContourValid()) { + return hull; + } // update parameters for next iteraction + + + options.threshold *= 0.9; + + if (iterations <= options.maxMarchingIterations * 0.5) { + options.memberInfluenceFactor *= 1.2; + options.edgeInfluenceFactor *= 1.2; + } else if (options.nonMemberInfluenceFactor !== 0 && nonMembers.length > 0) { + // after half the iterations, start increasing positive energy and lowering the threshold + options.nonMemberInfluenceFactor *= 0.8; + } else { + break; + } + } + + return hull; +}; +/** + * unionboundingbox + * @param members + * @param edges + */ + +function getActiveRregion(members, edges, offset) { + var activeRegion = { + minX: Number.POSITIVE_INFINITY, + minY: Number.POSITIVE_INFINITY, + maxX: Number.NEGATIVE_INFINITY, + maxY: Number.NEGATIVE_INFINITY, + width: 0, + height: 0, + x: 0, + y: 0 + }; + var bboxes = []; + members.forEach(function (item) { + bboxes.push(item.getBBox()); + }); + edges.forEach(function (l) { + bboxes.push(l.getBBox()); + }); + + for (var _i = 0, bboxes_1 = bboxes; _i < bboxes_1.length; _i++) { + var bbox = bboxes_1[_i]; + activeRegion.minX = (bbox.minX < activeRegion.minX ? bbox.minX : activeRegion.minX) - offset; + activeRegion.minY = (bbox.minY < activeRegion.minY ? bbox.minY : activeRegion.minY) - offset; + activeRegion.maxX = (bbox.maxX > activeRegion.maxX ? bbox.maxX : activeRegion.maxX) + offset; + activeRegion.maxY = (bbox.maxY > activeRegion.maxY ? bbox.maxY : activeRegion.maxY) + offset; + } + + activeRegion.width = activeRegion.maxX - activeRegion.minX; + activeRegion.height = activeRegion.maxY - activeRegion.minY; + activeRegion.x = activeRegion.minX; + activeRegion.y = activeRegion.minY; + return activeRegion; +} + +function fillPotentialArea(members, nonMembers, edges, activeRegion, potentialArea, options) { + function pos2GridIx(x, offset) { + var gridIx = Math.floor((x - offset) / options.pixelGroupSize); + return gridIx < 0 ? 0 : gridIx; + } + + function gridIx2Pos(x, offset) { + return x * options.pixelGroupSize + offset; + } // using inverse a for numerical stability + + + var nodeInfA = (options.nodeR0 - options.nodeR1) * (options.nodeR0 - options.nodeR1); + var edgeInfA = (options.edgeR0 - options.edgeR1) * (options.edgeR0 - options.edgeR1); + + var getAffectedRegion = function getAffectedRegion(bbox, thresholdR) { + var startX = Math.min(pos2GridIx(bbox.minX, thresholdR + activeRegion.minX), potentialArea.width); + var startY = Math.min(pos2GridIx(bbox.minY, thresholdR + activeRegion.minY), potentialArea.height); + var endX = Math.min(pos2GridIx(bbox.maxX, -thresholdR + activeRegion.minX), potentialArea.width); + var endY = Math.min(pos2GridIx(bbox.maxY, -thresholdR + activeRegion.minY), potentialArea.height); + return [startX, startY, endX, endY]; + }; + + var addItemInfluence = function addItemInfluence(item, influenceFactor) { + var bbox = item.getBBox(); + + var _a = getAffectedRegion(bbox, options.nodeR1), + startX = _a[0], + startY = _a[1], + endX = _a[2], + endY = _a[3]; // calculate item influence for each cell + + + for (var y = startY; y < endY; y += 1) { + for (var x = startX; x < endX; x += 1) { + if (influenceFactor < 0 && potentialArea[x + y * potentialArea.width] <= 0) { + continue; + } + + var tempX = gridIx2Pos(x, activeRegion.minX); + var tempY = gridIx2Pos(y, activeRegion.minY); + var distanceSq = pointRectSquareDist({ + x: tempX, + y: tempY + }, { + x: bbox.minX, + y: bbox.minY, + width: bbox.width, + height: bbox.height + }); + + if (distanceSq < Math.pow(options.nodeR1, 2)) { + var dr = Math.sqrt(distanceSq) - options.nodeR1; + potentialArea.cells[x + y * potentialArea.width] += influenceFactor * dr * dr; + } + } + } + }; + + var addEdgeInfluence = function addEdgeInfluence(line, influenceFactor) { + var bbox = line.getBBox(); + + var _a = getAffectedRegion(bbox, options.edgeR1), + startX = _a[0], + startY = _a[1], + endX = _a[2], + endY = _a[3]; // for every point in active part of potentialArea, calculate distance to nearest point on line and add influence + + + for (var y = startY; y < endY; y += 1) { + for (var x = startX; x < endX; x += 1) { + if (influenceFactor < 0 && potentialArea.cells[x + y * potentialArea.width] <= 0) { + continue; + } + + var tempX = gridIx2Pos(x, activeRegion.minX); + var tempY = gridIx2Pos(y, activeRegion.minY); + var minDistanceSq = pointLineSquareDist({ + x: tempX, + y: tempY + }, line); // only influence if less than r1 + + if (minDistanceSq < Math.pow(options.edgeR1, 2)) { + var mdr = Math.sqrt(minDistanceSq) - options.edgeR1; + potentialArea.cells[x + y * potentialArea.width] += influenceFactor * mdr * mdr; + } + } + } + }; + + if (options.nodeInfluenceFactor) { + members.forEach(function (item) { + addItemInfluence(item, options.nodeInfluenceFactor / nodeInfA); + }); + } + + if (options.edgeInfluenceFactor) { + edges.forEach(function (edge) { + addEdgeInfluence(edge, options.edgeInfluenceFactor / edgeInfA); + }); + } + + if (options.negativeNodeInfluenceFactor) { + nonMembers.forEach(function (item) { + addItemInfluence(item, options.negativeNodeInfluenceFactor / nodeInfA); + }); + } +} + +function rerouteLine(item, buffer, intersections, wrapNormal) { + var bbox = item.getBBox(); + var topIntersect = intersections[0], + leftIntersect = intersections[1], + bottomIntersect = intersections[2], + rightIntersect = intersections[3]; + var cornerPos = { + topLeft: { + x: bbox.minX - buffer, + y: bbox.minY - buffer + }, + topRight: { + x: bbox.maxX + buffer, + y: bbox.minY - buffer + }, + bottomLeft: { + x: bbox.minX - buffer, + y: bbox.maxY + buffer + }, + bottomRight: { + x: bbox.maxX + buffer, + y: bbox.maxY + buffer + } + }; + var totalArea = bbox.height * bbox.width; + + function calcHalfArea(intersect1, intersect2) { + return bbox.width * ((intersect1.y - bbox.minY + (intersect2.y - bbox.minY)) * 0.5); + } // 根据线和boundingbox相交的情况，确定control point的位置 + + + if (leftIntersect) { + // 相交区域有三角形 + if (topIntersect) return wrapNormal ? cornerPos.topLeft : cornerPos.bottomRight; + if (bottomIntersect) return wrapNormal ? cornerPos.bottomLeft : cornerPos.topRight; // 相交区域分成上下两个梯形，比较面积 + + var topArea = calcHalfArea(leftIntersect, rightIntersect); + + if (topArea < totalArea * 0.5) { + if (leftIntersect.y > rightIntersect.y) return wrapNormal ? cornerPos.topLeft : cornerPos.bottomRight; + return wrapNormal ? cornerPos.topRight : cornerPos.bottomLeft; + } + + if (leftIntersect.y < rightIntersect.y) return wrapNormal ? cornerPos.bottomLeft : cornerPos.topRight; + return wrapNormal ? cornerPos.bottomRight : cornerPos.topLeft; + } + + if (rightIntersect) { + if (topIntersect) return wrapNormal ? cornerPos.topRight : cornerPos.bottomLeft; + if (bottomIntersect) return wrapNormal ? cornerPos.bottomRight : cornerPos.topLeft; + } // 相交区域分成左右两个梯形 + + + var leftArea = calcHalfArea(topIntersect, bottomIntersect); + + if (leftArea < totalArea * 0.5) { + if (topIntersect.x > bottomIntersect.x) return wrapNormal ? cornerPos.topLeft : cornerPos.bottomRight; + return wrapNormal ? cornerPos.bottomLeft : cornerPos.topRight; + } + + if (topIntersect.x < bottomIntersect.x) return wrapNormal ? cornerPos.topRight : cornerPos.bottomLeft; + return wrapNormal ? cornerPos.bottomRight : cornerPos.topLeft; +} + +/** + * 用于包裹内部的成员的轮廓。 + * convex hull(凸包)：http://geomalgorithms.com/a10-_hull-1.html#Monotone%20Chain + * bubble: 使用 bubbleset算法，refer: http://vialab.science.uoit.ca/wp-content/papercite-data/pdf/col2009c.pdf + * 通过配置 padding 可以调节包裹轮廓对节点的松紧程度 + */ + +var Hull = +/** @class */ +function () { + function Hull(graph, cfg) { + this.cfg = deepMix(this.getDefaultCfg(), cfg); + this.graph = graph; + this.id = this.cfg.id; + this.group = this.cfg.group; + this.members = this.cfg.members.map(function (item) { + return isString$3(item) ? graph.findById(item) : item; + }); + this.nonMembers = this.cfg.nonMembers.map(function (item) { + return isString$3(item) ? graph.findById(item) : item; + }); + this.setPadding(); + this.setType(); + this.path = this.calcPath(this.members, this.nonMembers); + this.render(); + } + + Hull.prototype.getDefaultCfg = function () { + return { + id: 'g6-hull', + type: 'round-convex', + members: [], + nonMembers: [], + style: { + fill: 'lightblue', + stroke: 'blue', + opacity: 0.2 + }, + padding: 10 + }; + }; + + Hull.prototype.setPadding = function () { + var nodeSize = this.members.length && this.members[0].getKeyShape().getCanvasBBox().width / 2; + this.padding = this.cfg.padding > 0 ? this.cfg.padding + nodeSize : 10 + nodeSize; + this.cfg.bubbleCfg = { + nodeR0: this.padding - nodeSize, + nodeR1: this.padding - nodeSize, + morphBuffer: this.padding - nodeSize + }; + }; + + Hull.prototype.setType = function () { + this.type = this.cfg.type; + + if (this.members.length < 3) { + this.type = 'round-convex'; + } + + if (this.type !== 'round-convex' && this.type !== 'smooth-convex' && this.type !== 'bubble') { + console.warn('The hull type should be either round-convex, smooth-convex or bubble, round-convex is used by default.'); + this.type = 'round-convex'; + } + }; + + Hull.prototype.calcPath = function (members, nonMembers) { + var contour, path, hull; + + switch (this.type) { + case 'round-convex': + contour = genConvexHull(members); + hull = roundedHull(contour.map(function (p) { + return [p.x, p.y]; + }), this.padding); + path = parsePathString$1(hull); + break; + + case 'smooth-convex': + contour = genConvexHull(members); + + if (contour.length === 2) { + hull = roundedHull(contour.map(function (p) { + return [p.x, p.y]; + }), this.padding); + path = parsePathString$1(hull); + } else if (contour.length > 2) { + hull = paddedHull(contour.map(function (p) { + return [p.x, p.y]; + }), this.padding); + path = getClosedSpline(hull); + } + + break; + + case 'bubble': + contour = genBubbleSet(members, nonMembers, this.cfg.bubbleCfg); + path = contour.length >= 2 && getClosedSpline(contour); + break; + } + + return path; + }; + + Hull.prototype.render = function () { + this.group.addShape('path', { + attrs: __assign$r({ + path: this.path + }, this.cfg.style), + id: this.id, + name: this.cfg.id + }); + this.group.toBack(); + }; + /** + * 增加hull的成员，同时如果该成员原先在nonMembers中，则从nonMembers中去掉 + * @param item 节点实例 + * @return boolean 添加成功返回 true，否则返回 false + */ + + + Hull.prototype.addMember = function (item) { + if (!item) return; + if (isString$3(item)) item = this.graph.findById(item); + this.members.push(item); + var index = this.nonMembers.indexOf(item); + + if (index > -1) { + this.nonMembers.splice(index, 1); + } + + this.updateData(this.members, this.nonMembers); + return true; + }; + /** + * 增加hull需要排除的节点，同时如果该成员原先在members中，则从members中去掉 + * @param item 节点实例 + * @return boolean 添加成功返回 true，否则返回 false + */ + + + Hull.prototype.addNonMember = function (item) { + if (!item) return; + if (isString$3(item)) item = this.graph.findById(item); + this.nonMembers.push(item); + var index = this.members.indexOf(item); + + if (index > -1) { + this.members.splice(index, 1); + } + + this.updateData(this.members, this.nonMembers); + return true; + }; + /** + * 移除hull中的成员 + * @param node 节点实例 + * @return boolean 移除成功返回 true，否则返回 false + */ + + + Hull.prototype.removeMember = function (item) { + if (!item) return; + if (isString$3(item)) item = this.graph.findById(item); + var index = this.members.indexOf(item); + + if (index > -1) { + this.members.splice(index, 1); + this.updateData(this.members, this.nonMembers); + return true; + } + + return false; + }; + /** + * @param node 节点实例 + * @return boolean 移除成功返回 true，否则返回 false + */ + + + Hull.prototype.removeNonMember = function (item) { + if (!item) return; + if (isString$3(item)) item = this.graph.findById(item); + var index = this.nonMembers.indexOf(item); + + if (index > -1) { + this.nonMembers.splice(index, 1); + this.updateData(this.members, this.nonMembers); + return true; + } + + return false; + }; + + Hull.prototype.updateData = function (members, nonMembers) { + var _this = this; + + this.group.findById(this.id).remove(); + if (members) this.members = members.map(function (item) { + return isString$3(item) ? _this.graph.findById(item) : item; + }); + if (nonMembers) this.nonMembers = nonMembers.map(function (item) { + return isString$3(item) ? _this.graph.findById(item) : item; + }); + this.path = this.calcPath(this.members, this.nonMembers); + this.render(); + }; + + Hull.prototype.updateStyle = function (cfg) { + var path = this.group.findById(this.id); + path.attr(__assign$r({}, cfg)); + }; + /** + * 更新 hull + * @param cfg hull 配置项 + */ + + + Hull.prototype.updateCfg = function (cfg) { + var _this = this; + + this.cfg = deepMix(this.cfg, cfg); + this.id = this.cfg.id; + this.group = this.cfg.group; + + if (cfg.members) { + this.members = this.cfg.members.map(function (item) { + return isString$3(item) ? _this.graph.findById(item) : item; + }); + } + + if (cfg.nonMembers) { + this.nonMembers = this.cfg.nonMembers.map(function (item) { + return isString$3(item) ? _this.graph.findById(item) : item; + }); + } // TODO padding 设置太大，会影响到 contain 结果 + + + this.setPadding(); + this.setType(); + this.path = this.calcPath(this.members, this.nonMembers); + this.render(); + }; + /** + * 判断是否在hull内部 + * @param item + */ + + + Hull.prototype.contain = function (item) { + var _this = this; + + var nodeItem; + + if (isString$3(item)) { + nodeItem = this.graph.findById(item); + } else { + nodeItem = item; + } + + var shapePoints; + var shape = nodeItem.getKeyShape(); + + if (nodeItem.get('type') === 'path') { + shapePoints = pathToPoints$1(shape.attr('path')); + } else { + var shapeBBox = shape.getCanvasBBox(); + shapePoints = [[shapeBBox.minX, shapeBBox.minY], [shapeBBox.maxX, shapeBBox.minY], [shapeBBox.maxX, shapeBBox.maxY], [shapeBBox.minX, shapeBBox.maxY]]; + } + + shapePoints = shapePoints.map(function (canvasPoint) { + var point = _this.graph.getPointByCanvas(canvasPoint[0], canvasPoint[1]); + + return [point.x, point.y]; + }); + return isPolygonsIntersect$1(shapePoints, pathToPoints$1(this.path)); + }; + + Hull.prototype.destroy = function () { + this.group.remove(); + this.cfg = null; + }; + + return Hull; +}(); + +var transform$9 = transform$i; +var NODE = 'node'; + +var AbstractGraph = +/** @class */ +function (_super) { + __extends$e(AbstractGraph, _super); + + function AbstractGraph(cfg) { + var _this = _super.call(this) || this; + + _this.cfg = deepMix(_this.getDefaultCfg(), cfg); + + _this.init(); + + _this.animating = false; + _this.destroyed = false; // 启用 stack 后，实例化 undoStack 和 redoStack + + if (_this.cfg.enabledStack) { + // 实例化 undo 和 redo 栈 + _this.undoStack = new Stack$5(_this.cfg.maxStep); + _this.redoStack = new Stack$5(_this.cfg.maxStep); + } + + return _this; + } + + AbstractGraph.prototype.init = function () { + this.initCanvas(); // instance controller + + var viewController = new ViewController(this); + var modeController = new ModeController(this); + var itemController = new ItemController(this); + var stateController = new StateController(this); + this.set({ + viewController: viewController, + modeController: modeController, + itemController: itemController, + stateController: stateController + }); // 初始化布局机制 + + this.initLayoutController(); // 初始化事件机制 + + this.initEventController(); + this.initGroups(); + /** 初始化插件 */ + + this.initPlugins(); + }; // 初始化所有 Group + + + AbstractGraph.prototype.initGroups = function () { + var canvas = this.get('canvas'); + var el = this.get('canvas').get('el'); + var id = el.id; + var group = canvas.addGroup({ + id: id + "-root", + className: Global$1.rootContainerClassName + }); + + if (this.get('groupByTypes')) { + var edgeGroup = group.addGroup({ + id: id + "-edge", + className: Global$1.edgeContainerClassName + }); + var nodeGroup = group.addGroup({ + id: id + "-node", + className: Global$1.nodeContainerClassName + }); + var comboGroup = group.addGroup({ + id: id + "-combo", + className: Global$1.comboContainerClassName + }); // 用于存储自定义的群组 + + comboGroup.toBack(); + this.set({ + nodeGroup: nodeGroup, + edgeGroup: edgeGroup, + comboGroup: comboGroup + }); + } + + var delegateGroup = group.addGroup({ + id: id + "-delegate", + className: Global$1.delegateContainerClassName + }); + this.set({ + delegateGroup: delegateGroup + }); + this.set('group', group); + }; // eslint-disable-next-line class-methods-use-this + + + AbstractGraph.prototype.getDefaultCfg = function () { + return { + /** + * Container could be dom object or dom id + */ + container: undefined, + + /** + * Canvas width + * unit pixel if undefined force fit width + */ + width: undefined, + + /** + * Canvas height + * unit pixel if undefined force fit height + */ + height: undefined, + + /** + * renderer canvas or svg + * @type {string} + */ + renderer: 'canvas', + + /** + * control graph behaviors + */ + modes: {}, + + /** + * 注册插件 + */ + plugins: [], + + /** + * source data + */ + data: {}, + + /** + * Fit view padding (client scale) + */ + fitViewPadding: 10, + + /** + * Minimum scale size + */ + minZoom: 0.2, + + /** + * Maxmum scale size + */ + maxZoom: 10, + + /** + * capture events + */ + event: true, + + /** + * group node & edges into different graphic groups + */ + groupByTypes: true, + + /** + * determine if it's a directed graph + */ + directed: false, + + /** + * when data or shape changed, should canvas draw automatically + */ + autoPaint: true, + + /** + * store all the node instances + */ + nodes: [], + + /** + * store all the edge instances + */ + edges: [], + + /** + * store all the combo instances + */ + combos: [], + + /** + * store all the edge instances which are virtual edges related to collapsed combo + */ + vedges: [], + + /** + * all the instances indexed by id + */ + itemMap: {}, + + /** + * 边直接连接到节点的中心，不再考虑锚点 + */ + linkCenter: false, + + /** + * 默认的节点配置，data 上定义的配置会覆盖这些配置。例如： + * defaultNode: { + * type: 'rect', + * size: [60, 40], + * style: { + * //... 样式配置项 + * } + * } + * 若数据项为 { id: 'node', x: 100, y: 100 } + * 实际创建的节点模型是 { id: 'node', x: 100, y: 100， type: 'rect', size: [60, 40] } + * 若数据项为 { id: 'node', x: 100, y: 100, type: 'circle' } + * 实际创建的节点模型是 { id: 'node', x: 100, y: 100， type: 'circle', size: [60, 40] } + */ + defaultNode: {}, + + /** + * 默认边配置，data 上定义的配置会覆盖这些配置。用法同 defaultNode + */ + defaultEdge: {}, + + /** + * 节点默认样式，也可以添加状态样式 + * 例如： + * const graph = new G6.Graph({ + * nodeStateStyles: { + * selected: { fill: '#ccc', stroke: '#666' }, + * active: { lineWidth: 2 } + * }, + * ... + * }); + * + */ + nodeStateStyles: {}, + + /** + * 边默认样式，用法同nodeStateStyle + */ + edgeStateStyles: {}, + + /** + * graph 状态 + */ + states: {}, + + /** + * 是否启用全局动画 + */ + animate: false, + + /** + * 动画设置,仅在 animate 为 true 时有效 + */ + animateCfg: { + /** + * 帧回调函数，用于自定义节点运动路径，为空时线性运动 + */ + onFrame: undefined, + + /** + * 动画时长(ms) + */ + duration: 500, + + /** + * 指定动画动效 + */ + easing: 'easeLinear' + }, + callback: undefined, + // 默认不启用 undo & redo 功能 + enabledStack: false, + // 只有当 enabledStack 为 true 时才起作用 + maxStep: 10, + // 存储图上的 tooltip dom，方便销毁 + tooltips: [] + }; + }; + /** + * 将值设置到 this.cfg 变量上面 + * @param key 键 或 对象值 + * @param val 值 + */ + + + AbstractGraph.prototype.set = function (key, val) { + if (isPlainObject$3(key)) { + this.cfg = __assign$r(__assign$r({}, this.cfg), key); + } else { + this.cfg[key] = val; + } + + return this; + }; + /** + * 获取 this.cfg 中的值 + * @param key 键 + */ + + + AbstractGraph.prototype.get = function (key) { + return this.cfg[key]; + }; + /** + * 获取 graph 的根图形分组 + * @return 根 group + */ + + + AbstractGraph.prototype.getGroup = function () { + return this.get('group'); + }; + /** + * 获取 graph 的 DOM 容器 + * @return DOM 容器 + */ + + + AbstractGraph.prototype.getContainer = function () { + return this.get('container'); + }; + /** + * 获取 graph 的最小缩放比例 + * @return minZoom + */ + + + AbstractGraph.prototype.getMinZoom = function () { + return this.get('minZoom'); + }; + /** + * 设置 graph 的最小缩放比例 + * @return minZoom + */ + + + AbstractGraph.prototype.setMinZoom = function (ratio) { + return this.set('minZoom', ratio); + }; + /** + * 获取 graph 的最大缩放比例 + * @param maxZoom + */ + + + AbstractGraph.prototype.getMaxZoom = function () { + return this.get('maxZoom'); + }; + /** + * 设置 graph 的最大缩放比例 + * @param maxZoom + */ + + + AbstractGraph.prototype.setMaxZoom = function (ratio) { + return this.set('maxZoom', ratio); + }; + /** + * 获取 graph 的宽度 + * @return width + */ + + + AbstractGraph.prototype.getWidth = function () { + return this.get('width'); + }; + /** + * 获取 graph 的高度 + * @return width + */ + + + AbstractGraph.prototype.getHeight = function () { + return this.get('height'); + }; + /** + * 清理元素多个状态 + * @param {string|Item} item 元素id或元素实例 + * @param {string[]} states 状态 + */ + + + AbstractGraph.prototype.clearItemStates = function (item, states) { + if (isString$3(item)) { + item = this.findById(item); + } + + var itemController = this.get('itemController'); + + if (!states) { + states = item.get('states'); + } + + itemController.clearItemStates(item, states); + var stateController = this.get('stateController'); + stateController.updateStates(item, states, false); + }; + /** + * 设置各个节点样式，以及在各种状态下节点 keyShape 的样式。 + * 若是自定义节点切在各种状态下 + * graph.node(node => { + * return { + * type: 'rect', + * label: node.id, + * style: { fill: '#666' }, + * stateStyles: { + * selected: { fill: 'blue' }, + * custom: { fill: 'green' } + * } + * } + * }); + * @param {function} nodeFn 指定每个节点样式 + */ + + + AbstractGraph.prototype.node = function (nodeFn) { + if (typeof nodeFn === 'function') { + this.set('nodeMapper', nodeFn); + } + }; + /** + * 设置各个边样式 + * @param {function} edgeFn 指定每个边的样式,用法同 node + */ + + + AbstractGraph.prototype.edge = function (edgeFn) { + if (typeof edgeFn === 'function') { + this.set('edgeMapper', edgeFn); + } + }; + /** + * 设置各个 combo 的配置 + * @param comboFn + */ + + + AbstractGraph.prototype.combo = function (comboFn) { + if (typeof comboFn === 'function') { + this.set('comboMapper', comboFn); + } + }; + /** + * 根据 ID 查询图元素实例 + * @param id 图元素 ID + */ + + + AbstractGraph.prototype.findById = function (id) { + return this.get('itemMap')[id]; + }; + /** + * 根据对应规则查找单个元素 + * @param {ITEM_TYPE} type 元素类型(node | edge | group) + * @param {(item: T, index: number) => T} fn 指定规则 + * @return {T} 元素实例 + */ + + + AbstractGraph.prototype.find = function (type, fn) { + var result; + var items = this.get(type + "s"); // eslint-disable-next-line consistent-return + + each$2(items, function (item, i) { + if (fn(item, i)) { + result = item; + return result; + } + }); + return result; + }; + /** + * 查找所有满足规则的元素 + * @param {string} type 元素类型(node|edge) + * @param {string} fn 指定规则 + * @return {array} 元素实例 + */ + + + AbstractGraph.prototype.findAll = function (type, fn) { + var result = []; + each$2(this.get(type + "s"), function (item, i) { + if (fn(item, i)) { + result.push(item); + } + }); + return result; + }; + /** + * 查找所有处于指定状态的元素 + * @param {string} type 元素类型(node|edge) + * @param {string} state 状态 + * @return {object} 元素实例 + */ + + + AbstractGraph.prototype.findAllByState = function (type, state) { + return this.findAll(type, function (item) { + return item.hasState(state); + }); + }; + /** + * 平移画布 + * @param dx 水平方向位移 + * @param dy 垂直方向位移 + */ + + + AbstractGraph.prototype.translate = function (dx, dy) { + var group = this.get('group'); + var matrix = clone$7(group.getMatrix()); + + if (!matrix) { + matrix = [1, 0, 0, 0, 1, 0, 0, 0, 1]; + } + + matrix = transform$9(matrix, [['t', dx, dy]]); + group.setMatrix(matrix); + this.emit('viewportchange', { + action: 'translate', + matrix: group.getMatrix() + }); + this.autoPaint(); + }; + /** + * 平移画布到某点 + * @param {number} x 水平坐标 + * @param {number} y 垂直坐标 + */ + + + AbstractGraph.prototype.moveTo = function (x, y) { + var group = this.get('group'); + move(group, { + x: x, + y: y + }); + this.emit('viewportchange', { + action: 'move', + matrix: group.getMatrix() + }); + }; + /** + * 调整视口适应视图 + * @param {object} padding 四周围边距 + */ + + + AbstractGraph.prototype.fitView = function (padding) { + if (padding) { + this.set('fitViewPadding', padding); + } + + var viewController = this.get('viewController'); + viewController.fitView(); + this.autoPaint(); + }; + /** + * 调整视口适应视图，不缩放，仅将图 bbox 中心对齐到画布中心 + */ + + + AbstractGraph.prototype.fitCenter = function () { + var viewController = this.get('viewController'); + viewController.fitCenter(); + this.autoPaint(); + }; + /** + * 新增行为 + * @param {string | ModeOption | ModeType[]} behaviors 添加的行为 + * @param {string | string[]} modes 添加到对应的模式 + * @return {Graph} Graph + */ + + + AbstractGraph.prototype.addBehaviors = function (behaviors, modes) { + var modeController = this.get('modeController'); + modeController.manipulateBehaviors(behaviors, modes, true); + return this; + }; + /** + * 移除行为 + * @param {string | ModeOption | ModeType[]} behaviors 移除的行为 + * @param {string | string[]} modes 从指定的模式中移除 + * @return {Graph} Graph + */ + + + AbstractGraph.prototype.removeBehaviors = function (behaviors, modes) { + var modeController = this.get('modeController'); + modeController.manipulateBehaviors(behaviors, modes, false); + return this; + }; + /** + * 更新行为参数 + * @param {string | ModeOption | ModeType} behavior 需要更新的行为 + * @param {string | string[]} modes 指定的模式中的行为，不指定则为 default + * @return {Graph} Graph + */ + + + AbstractGraph.prototype.updateBehavior = function (behavior, newCfg, mode) { + var modeController = this.get('modeController'); + modeController.updateBehavior(behavior, newCfg, mode); + return this; + }; + /** + * 伸缩窗口 + * @param ratio 伸缩比例 + * @param center 以center的x, y坐标为中心缩放 + */ + + + AbstractGraph.prototype.zoom = function (ratio, center) { + var group = this.get('group'); + var matrix = clone$7(group.getMatrix()); + var minZoom = this.get('minZoom'); + var maxZoom = this.get('maxZoom'); + + if (!matrix) { + matrix = [1, 0, 0, 0, 1, 0, 0, 0, 1]; + } + + if (center) { + matrix = transform$9(matrix, [['t', -center.x, -center.y], ['s', ratio, ratio], ['t', center.x, center.y]]); + } else { + matrix = transform$9(matrix, [['s', ratio, ratio]]); + } + + if (minZoom && matrix[0] < minZoom || maxZoom && matrix[0] > maxZoom) { + return; + } // matrix = [2, 0, 0, 0, 2, 0, -125, -125, 1]; + + + group.setMatrix(matrix); + this.emit('viewportchange', { + action: 'zoom', + matrix: matrix + }); + this.autoPaint(); + }; + /** + * 伸缩视口到一固定比例 + * @param {number} toRatio 伸缩比例 + * @param {Point} center 以center的x, y坐标为中心缩放 + */ + + + AbstractGraph.prototype.zoomTo = function (toRatio, center) { + var ratio = toRatio / this.getZoom(); + this.zoom(ratio, center); + }; + /** + * 将元素移动到视口中心 + * @param {Item} item 指定元素 + * @param {boolean} animate 是否带有动画地移动 + * @param {GraphAnimateConfig} animateCfg 若带有动画，动画的配置项 + */ + + + AbstractGraph.prototype.focusItem = function (item, animate, animateCfg) { + var viewController = this.get('viewController'); + var isAnimate = false; + if (animate) isAnimate = true;else if (animate === undefined) isAnimate = this.get('animate'); + var curAniamteCfg = {}; + if (animateCfg) curAniamteCfg = animateCfg;else if (animateCfg === undefined) curAniamteCfg = this.get('animateCfg'); + viewController.focus(item, isAnimate, curAniamteCfg); + this.autoPaint(); + }; + /** + * 自动重绘 + * @internal 仅供内部更新机制调用，外部根据需求调用 render 或 paint 接口 + */ + + + AbstractGraph.prototype.autoPaint = function () { + if (this.get('autoPaint')) { + this.paint(); + } + }; + /** + * 仅画布重新绘制 + */ + + + AbstractGraph.prototype.paint = function () { + this.emit('beforepaint'); + this.get('canvas').draw(); + this.emit('afterpaint'); + }; + /** + * 将屏幕坐标转换为视口坐标 + * @param {number} clientX 屏幕x坐标 + * @param {number} clientY 屏幕y坐标 + * @return {Point} 视口坐标 + */ + + + AbstractGraph.prototype.getPointByClient = function (clientX, clientY) { + var viewController = this.get('viewController'); + return viewController.getPointByClient(clientX, clientY); + }; + /** + * 将绘制坐标转换为屏幕坐标 + * @param {number} x 绘制坐标 x + * @param {number} y 绘制坐标 y + * @return {Point} 绘制坐标 + */ + + + AbstractGraph.prototype.getClientByPoint = function (x, y) { + var viewController = this.get('viewController'); + return viewController.getClientByPoint(x, y); + }; + /** + * 将画布坐标转换为绘制坐标 + * @param {number} canvasX 画布 x 坐标 + * @param {number} canvasY 画布 y 坐标 + * @return {object} 绘制坐标 + */ + + + AbstractGraph.prototype.getPointByCanvas = function (canvasX, canvasY) { + var viewController = this.get('viewController'); + return viewController.getPointByCanvas(canvasX, canvasY); + }; + /** + * 将绘制坐标转换为画布坐标 + * @param {number} x 绘制坐标 x + * @param {number} y 绘制坐标 y + * @return {object} 画布坐标 + */ + + + AbstractGraph.prototype.getCanvasByPoint = function (x, y) { + var viewController = this.get('viewController'); + return viewController.getCanvasByPoint(x, y); + }; + /** + * 获取图内容的中心绘制坐标 + * @return {object} 中心绘制坐标 + */ + + + AbstractGraph.prototype.getGraphCenterPoint = function () { + var bbox = this.get('group').getCanvasBBox(); + return { + x: (bbox.minX + bbox.maxX) / 2, + y: (bbox.minY + bbox.maxY) / 2 + }; + }; + /** + * 获取视口中心绘制坐标 + * @return {object} 视口中心绘制坐标 + */ + + + AbstractGraph.prototype.getViewPortCenterPoint = function () { + return this.getPointByCanvas(this.get('width') / 2, this.get('height') / 2); + }; + /** + * 显示元素 + * @param {Item} item 指定元素 + * @param {boolean} stack 本次操作是否入栈，默认为 true + */ + + + AbstractGraph.prototype.showItem = function (item, stack) { + if (stack === void 0) { + stack = true; + } + + var itemController = this.get('itemController'); + var object = itemController.changeItemVisibility(item, true); + + if (stack && this.get('enabledStack')) { + var id = object.getID(); + var type = object.getType(); + var before = {}; + var after = {}; + + switch (type) { + case 'node': + before.nodes = [{ + id: id, + visible: false + }]; + after.nodes = [{ + id: id, + visible: true + }]; + break; + + case 'edge': + before.nodes = [{ + id: id, + visible: false + }]; + after.edges = [{ + id: id, + visible: true + }]; + break; + + case 'combo': + before.nodes = [{ + id: id, + visible: false + }]; + after.combos = [{ + id: id, + visible: true + }]; + break; + } + + this.pushStack('visible', { + before: before, + after: after + }); + } + }; + /** + * 隐藏元素 + * @param {Item} item 指定元素 + * @param {boolean} stack 本次操作是否入栈，默认为 true + */ + + + AbstractGraph.prototype.hideItem = function (item, stack) { + if (stack === void 0) { + stack = true; + } + + var itemController = this.get('itemController'); + var object = itemController.changeItemVisibility(item, false); + + if (stack && this.get('enabledStack')) { + var id = object.getID(); + var type = object.getType(); + var before = {}; + var after = {}; + + switch (type) { + case 'node': + before.nodes = [{ + id: id, + visible: true + }]; + after.nodes = [{ + id: id, + visible: false + }]; + break; + + case 'edge': + before.nodes = [{ + id: id, + visible: true + }]; + after.edges = [{ + id: id, + visible: false + }]; + break; + + case 'combo': + before.nodes = [{ + id: id, + visible: true + }]; + after.combos = [{ + id: id, + visible: false + }]; + break; + } + + this.pushStack('visible', { + before: before, + after: after + }); + } + }; + /** + * 刷新元素 + * @param {string|object} item 元素id或元素实例 + */ + + + AbstractGraph.prototype.refreshItem = function (item) { + var itemController = this.get('itemController'); + itemController.refreshItem(item); + }; + /** + * 设置是否在更新/刷新后自动重绘 + * @param {boolean} auto 自动重绘 + */ + + + AbstractGraph.prototype.setAutoPaint = function (auto) { + var self = this; + self.set('autoPaint', auto); + var canvas = self.get('canvas'); + canvas.set('autoDraw', auto); + }; + /** + * 删除元素 + * @param {Item} item 元素id或元素实例 + * @param {boolean} stack 本次操作是否入栈，默认为 true + */ + + + AbstractGraph.prototype.remove = function (item, stack) { + if (stack === void 0) { + stack = true; + } + + this.removeItem(item, stack); + }; + /** + * 删除元素 + * @param {Item} item 元素id或元素实例 + * @param {boolean} stack 本次操作是否入栈，默认为 true + */ + + + AbstractGraph.prototype.removeItem = function (item, stack) { + if (stack === void 0) { + stack = true; + } + + var nodeItem = item; + if (isString$3(item)) nodeItem = this.findById(item); + + if (!nodeItem && isString$3(item)) { + console.warn('The item to be removed does not exist!'); + } else if (nodeItem) { + var type = ''; + if (nodeItem.getType) type = nodeItem.getType(); // 将删除的元素入栈 + + if (stack && this.get('enabledStack')) { + var deletedModel = __assign$r(__assign$r({}, nodeItem.getModel()), { + itemType: type + }); + + var before = {}; + + switch (type) { + case 'node': + { + before.nodes = [deletedModel]; + before.edges = []; + var edges = nodeItem.getEdges(); + + for (var i = edges.length - 1; i >= 0; i--) { + before.edges.push(__assign$r(__assign$r({}, edges[i].getModel()), { + itemType: 'edge' + })); + } + + break; + } + + case 'edge': + before.edges = [deletedModel]; + break; + + case 'combo': + before.combos = [deletedModel]; + break; + } + + this.pushStack('delete', { + before: before, + after: {} + }); + } + + if (type === 'node') { + var model = nodeItem.getModel(); // 如果删除的是节点，且该节点存在于某个 Combo 中，则需要先将 node 从 combo 中移除，否则删除节点后，操作 combo 会出错 + + if (model.comboId) { + this.updateComboTree(nodeItem); + } + } + + var itemController = this.get('itemController'); + itemController.removeItem(nodeItem); + + if (type === 'combo') { + var newComboTrees = reconstructTree(this.get('comboTrees')); + this.set('comboTrees', newComboTrees); + } + } + }; + /** + * 新增元素 + * @param {ITEM_TYPE} type 元素类型(node | edge) + * @param {ModelConfig} model 元素数据模型 + * @param {boolean} stack 本次操作是否入栈，默认为 true + * @param {boolean} sortCombo 本次操作是否需要更新 combo 层级顺序，内部参数，用户在外部使用 addItem 时始终时需要更新 + * @return {Item} 元素实例 + */ + + + AbstractGraph.prototype.addItem = function (type, model, stack, sortCombo) { + if (stack === void 0) { + stack = true; + } + + if (sortCombo === void 0) { + sortCombo = true; + } + + var currentComboSorted = this.get('comboSorted'); + this.set('comboSorted', currentComboSorted && !sortCombo); + var itemController = this.get('itemController'); + + if (model.id && this.findById(model.id)) { + console.warn("This item exists already. Be sure the id %c" + model.id + "%c is unique.", 'font-size: 20px; color: red;', ''); + return; + } + + var item; + var comboTrees = this.get('comboTrees'); + if (!comboTrees) comboTrees = []; + + if (type === 'combo') { + var itemMap_1 = this.get('itemMap'); + var foundParent_1 = false; + comboTrees.forEach(function (ctree) { + if (foundParent_1) return; // terminate the forEach after the tree containing the item is done + + traverseTreeUp$1(ctree, function (child) { + // find the parent + if (model.parentId === child.id) { + foundParent_1 = true; + + var newCombo = __assign$r({ + id: model.id, + depth: child.depth + 2 + }, model); + + if (child.children) child.children.push(newCombo);else child.children = [newCombo]; + model.depth = newCombo.depth; + item = itemController.addItem(type, model); + } + + var childItem = itemMap_1[child.id]; // after the parent is found, update all the ancestors + + if (foundParent_1 && childItem && childItem.getType && childItem.getType() === 'combo') { + itemController.updateCombo(childItem, child.children); + } + + return true; + }); + }); // if the parent is not found, add it to the root + + if (!foundParent_1) { + var newCombo = __assign$r({ + id: model.id, + depth: 0 + }, model); + + model.depth = newCombo.depth; + comboTrees.push(newCombo); + item = itemController.addItem(type, model); + } + + this.set('comboTrees', comboTrees); + } else if (type === 'node' && isString$3(model.comboId) && comboTrees) { + var parentCombo = this.findById(model.comboId); + + if (parentCombo && parentCombo.getType && parentCombo.getType() !== 'combo') { + console.warn("'" + model.comboId + "' is not a id of a combo in the graph, the node will be added without combo."); + } + + item = itemController.addItem(type, model); + var itemMap_2 = this.get('itemMap'); + var foundParent_2 = false, + foundNode_1 = false; + (comboTrees || []).forEach(function (ctree) { + if (foundNode_1 || foundParent_2) return; // terminate the forEach + + traverseTreeUp$1(ctree, function (child) { + if (child.id === model.id) { + // if the item exists in the tree already, terminate + foundNode_1 = true; + return false; + } + + if (model.comboId === child.id && !foundNode_1) { + // found the parent, add the item to the children of its parent in the tree + foundParent_2 = true; + var cloneNode = clone$7(model); + cloneNode.itemType = 'node'; + if (child.children) child.children.push(cloneNode);else child.children = [cloneNode]; + model.depth = child.depth + 1; + } // update the size of all the ancestors + + + if (foundParent_2 && itemMap_2[child.id].getType && itemMap_2[child.id].getType() === 'combo') { + itemController.updateCombo(itemMap_2[child.id], child.children); + } + + return true; + }); + }); + } else { + item = itemController.addItem(type, model); + } + + if (type === 'node' && model.comboId || type === 'combo' && model.parentId) { + // add the combo to the parent's children array + var parentCombo = this.findById(model.comboId || model.parentId); + if (parentCombo && parentCombo.getType && parentCombo.getType() === 'combo') parentCombo.addChild(item); + } + + var combos = this.get('combos'); + + if (combos && combos.length > 0) { + this.sortCombos(); + } + + this.autoPaint(); + + if (stack && this.get('enabledStack')) { + var addedModel = __assign$r(__assign$r({}, item.getModel()), { + itemType: type + }); + + var after = {}; + + switch (type) { + case 'node': + after.nodes = [addedModel]; + break; + + case 'edge': + after.edges = [addedModel]; + break; + + case 'combo': + after.combos = [addedModel]; + break; + } + + this.pushStack('add', { + before: {}, + after: after + }); + } + + return item; + }; + /** + * 新增元素 + * @param {ITEM_TYPE} type 元素类型(node | edge) + * @param {ModelConfig} model 元素数据模型 + * @param {boolean} stack 本次操作是否入栈，默认为 true + * @return {Item} 元素实例 + */ + + + AbstractGraph.prototype.add = function (type, model, stack, sortCombo) { + if (stack === void 0) { + stack = true; + } + + if (sortCombo === void 0) { + sortCombo = true; + } + + return this.addItem(type, model, stack, sortCombo); + }; + /** + * 更新元素 + * @param {Item} item 元素id或元素实例 + * @param {Partial | EdgeConfig} cfg 需要更新的数据 + */ + + + AbstractGraph.prototype.updateItem = function (item, cfg, stack) { + var _this = this; + + if (stack === void 0) { + stack = true; + } + + var itemController = this.get('itemController'); + var currentItem; + + if (isString$3(item)) { + currentItem = this.findById(item); + } else { + currentItem = item; + } + + var UnupdateModel = clone$7(currentItem.getModel()); + var type = ''; + if (currentItem.getType) type = currentItem.getType(); + + var states = __spreadArray$3([], currentItem.getStates()); + + if (type === 'combo') { + each$2(states, function (state) { + return _this.setItemState(currentItem, state, false); + }); + } + + itemController.updateItem(currentItem, cfg); + + if (type === 'combo') { + each$2(states, function (state) { + return _this.setItemState(currentItem, state, true); + }); + } + + if (stack && this.get('enabledStack')) { + var before = { + nodes: [], + edges: [], + combos: [] + }; + var after = { + nodes: [], + edges: [], + combos: [] + }; + + var afterModel = __assign$r({ + id: UnupdateModel.id + }, cfg); + + switch (type) { + case 'node': + before.nodes.push(UnupdateModel); + after.nodes.push(afterModel); + break; + + case 'edge': + before.edges.push(UnupdateModel); + after.edges.push(afterModel); + break; + + case 'combo': + before.combos.push(UnupdateModel); + after.combos.push(afterModel); + break; + } + + if (type === 'node') { + before.nodes.push(UnupdateModel); + } + + this.pushStack('update', { + before: before, + after: after + }); + } + }; + /** + * 更新元素 + * @param {Item} item 元素id或元素实例 + * @param {Partial | EdgeConfig} cfg 需要更新的数据 + * @param {boolean} stack 本次操作是否入栈，默认为 true + */ + + + AbstractGraph.prototype.update = function (item, cfg, stack) { + if (stack === void 0) { + stack = true; + } + + this.updateItem(item, cfg, stack); + }; + /** + * 设置元素状态 + * @param {Item} item 元素id或元素实例 + * @param {string} state 状态名称 + * @param {string | boolean} value 是否启用状态 或 状态值 + */ + + + AbstractGraph.prototype.setItemState = function (item, state, value) { + if (isString$3(item)) { + item = this.findById(item); + } + + var itemController = this.get('itemController'); + itemController.setItemState(item, state, value); + var stateController = this.get('stateController'); + + if (isString$3(value)) { + stateController.updateState(item, state + ":" + value, true); + } else { + stateController.updateState(item, state, value); + } + }; + /** + * 将指定状态的优先级提升为最高优先级 + * @param {Item} item 元素id或元素实例 + * @param state 状态名称 + */ + + + AbstractGraph.prototype.priorityState = function (item, state) { + var itemController = this.get('itemController'); + itemController.priorityState(item, state); + }; + /** + * 设置视图初始化数据 + * @param {GraphData} data 初始化数据 + */ + + + AbstractGraph.prototype.data = function (data) { + this.set('data', data); + }; + /** + * 根据data接口的数据渲染视图 + */ + + + AbstractGraph.prototype.render = function () { + var self = this; + this.set('comboSorted', false); + var data = this.get('data'); + + if (this.get('enabledStack')) { + // render 之前清空 redo 和 undo 栈 + this.clearStack(); + } + + if (!data) { + throw new Error('data must be defined first'); + } + + var _a = data.nodes, + nodes = _a === void 0 ? [] : _a, + _b = data.edges, + edges = _b === void 0 ? [] : _b, + _c = data.combos, + combos = _c === void 0 ? [] : _c; + this.clear(true); + this.emit('beforerender'); + each$2(nodes, function (node) { + self.add('node', node, false, false); + }); // process the data to tree structure + + if (combos && combos.length !== 0) { + var comboTrees = plainCombosToTrees(combos, nodes); + this.set('comboTrees', comboTrees); // add combos + + self.addCombos(combos); + } + + each$2(edges, function (edge) { + self.add('edge', edge, false, false); + }); + var animate = self.get('animate'); + + if (self.get('fitView') || self.get('fitCenter')) { + self.set('animate', false); + } // layout + + + var layoutController = self.get('layoutController'); + + if (layoutController) { + layoutController.layout(success); + if (this.destroyed) return; + } else { + if (self.get('fitView')) { + self.fitView(); + } + + if (self.get('fitCenter')) { + self.fitCenter(); + } + + self.emit('afterrender'); + self.set('animate', animate); + } // 将在 onLayoutEnd 中被调用 + + + function success() { + // fitView 与 fitCenter 共存时，fitView 优先，fitCenter 不再执行 + if (self.get('fitView')) { + self.fitView(); + } else if (self.get('fitCenter')) { + self.fitCenter(); + } + + self.autoPaint(); + self.emit('afterrender'); + + if (self.get('fitView') || self.get('fitCenter')) { + self.set('animate', animate); + } + } + + if (!this.get('groupByTypes')) { + if (combos && combos.length !== 0) { + this.sortCombos(); + } else { + // 为提升性能，选择数量少的进行操作 + if (data.nodes && data.edges && data.nodes.length < data.edges.length) { + var nodesArr = this.getNodes(); // 遍历节点实例，将所有节点提前。 + + nodesArr.forEach(function (node) { + node.toFront(); + }); + } else { + var edgesArr = this.getEdges(); // 遍历节点实例，将所有节点提前。 + + edgesArr.forEach(function (edge) { + edge.toBack(); + }); + } + } + } + + if (this.get('enabledStack')) { + this.pushStack('render'); + } + }; + /** + * 接收数据进行渲染 + * @Param {Object} data 初始化数据 + */ + + + AbstractGraph.prototype.read = function (data) { + this.data(data); + this.render(); + }; // 比较item + + + AbstractGraph.prototype.diffItems = function (type, items, models) { + var self = this; + var item; + var itemMap = this.get('itemMap'); + each$2(models, function (model) { + item = itemMap[model.id]; + + if (item) { + if (self.get('animate') && type === NODE) { + var containerMatrix = item.getContainer().getMatrix(); + if (!containerMatrix) containerMatrix = [1, 0, 0, 0, 1, 0, 0, 0, 1]; + item.set('originAttrs', { + x: containerMatrix[6], + y: containerMatrix[7] + }); + } + + self.updateItem(item, model, false); + } else { + item = self.addItem(type, model, false); + } + + if (item) items[type + "s"].push(item); + }); + }; + /** + * 更改源数据，根据新数据重新渲染视图 + * @param {GraphData | TreeGraphData} data 源数据 + * @param {boolean} 是否入栈，默认为true + * @return {object} this + */ + + + AbstractGraph.prototype.changeData = function (data, stack) { + if (stack === void 0) { + stack = true; + } + + var self = this; + + if (!data) { + return this; + } + + if (stack && this.get('enabledStack')) { + this.pushStack('changedata', { + before: self.save(), + after: data + }); + } + + this.set('comboSorted', false); // 删除 hulls + + this.removeHulls(); // 更改数据源后，取消所有状态 + + this.getNodes().map(function (node) { + return self.clearItemStates(node); + }); + this.getEdges().map(function (edge) { + return self.clearItemStates(edge); + }); + var canvas = this.get('canvas'); + var localRefresh = canvas.get('localRefresh'); + canvas.set('localRefresh', false); + + if (!self.get('data')) { + self.data(data); + self.render(); + } + + var itemMap = this.get('itemMap'); + var items = { + nodes: [], + edges: [] + }; + var combosData = data.combos; + + if (combosData) { + var comboTrees = plainCombosToTrees(combosData, data.nodes); + this.set('comboTrees', comboTrees); + } + + this.diffItems('node', items, data.nodes); + each$2(itemMap, function (item, id) { + itemMap[id].getModel().depth = 0; + if (item.getType && item.getType() === 'edge') return; + + if (item.getType && item.getType() === 'combo') { + delete itemMap[id]; + item.destroy(); + } else if (items.nodes.indexOf(item) < 0) { + delete itemMap[id]; + self.remove(item, false); + } + }); // clear the destroyed combos here to avoid removing sub nodes before removing the parent combo + + var comboItems = this.getCombos(); + var combosLength = comboItems.length; + + for (var i = combosLength - 1; i >= 0; i--) { + if (comboItems[i].destroyed) { + comboItems.splice(i, 1); + } + } // process the data to tree structure + + + if (combosData) { + // add combos + self.addCombos(combosData); + + if (!this.get('groupByTypes')) { + this.sortCombos(); + } + } + + this.diffItems('edge', items, data.edges); + each$2(itemMap, function (item, id) { + if (item.getType && (item.getType() === 'node' || item.getType() === 'combo')) return; + + if (items.edges.indexOf(item) < 0) { + delete itemMap[id]; + self.remove(item, false); + } + }); + this.set({ + nodes: items.nodes, + edges: items.edges + }); + var layoutController = this.get('layoutController'); + + if (layoutController) { + layoutController.changeData(); + + if (self.get('animate') && !layoutController.getLayoutType()) { + // 如果没有指定布局 + self.positionsAnimate(); + } else { + self.autoPaint(); + } + } + + setTimeout(function () { + canvas.set('localRefresh', localRefresh); + }, 16); + return this; + }; + /** + * 私有方法，在 render 和 changeData 的时候批量添加数据中所有平铺的 combos + * @param {ComboConfig[]} combos 平铺的 combos 数据 + */ + + + AbstractGraph.prototype.addCombos = function (combos) { + var self = this; + var comboTrees = self.get('comboTrees'); + var itemController = this.get('itemController'); + itemController.addCombos(comboTrees, combos); + }; + /** + * 根据已经存在的节点或 combo 创建新的 combo + * @param combo combo ID 或 Combo 配置 + * @param children 添加到 Combo 中的元素，包括节点和 combo + */ + + + AbstractGraph.prototype.createCombo = function (combo, children) { + var _this = this; + + this.set('comboSorted', false); // step 1: 创建新的 Combo + + var comboId = ''; + var comboConfig; + if (!combo) return; + + if (isString$3(combo)) { + comboId = combo; + comboConfig = { + id: combo + }; + } else { + comboId = combo.id; + + if (!comboId) { + console.warn('Create combo failed. Please assign a unique string id for the adding combo.'); + return; + } + + comboConfig = combo; + } + + var trees = children.map(function (elementId) { + var item = _this.findById(elementId); + + var type = ''; + if (item.getType) type = item.getType(); + var cItem = { + id: item.getID(), + itemType: type + }; + + if (type === 'combo') { + cItem.parentId = comboId; + } else if (type === 'node') { + cItem.comboId = comboId; + } + + return cItem; + }); + comboConfig.children = trees; // step 2: 添加 Combo，addItem 时会将子将元素添加到 Combo 中 + + this.addItem('combo', comboConfig, false); + this.set('comboSorted', false); // step3: 更新 comboTrees 结构 + + var comboTrees = this.get('comboTrees'); + (comboTrees || []).forEach(function (ctree) { + traverseTreeUp$1(ctree, function (child) { + if (child.id === comboId) { + child.itemType = 'combo'; + child.children = trees; + return false; + } + + return true; + }); + }); + + if (comboTrees) { + this.sortCombos(); + } + }; + /** + * 解散 combo + * @param {String | INode | ICombo} combo 需要被解散的 Combo item 或 id + */ + + + AbstractGraph.prototype.uncombo = function (combo) { + var _this = this; + + var self = this; + var comboItem = combo; + + if (isString$3(combo)) { + comboItem = this.findById(combo); + } + + if (!comboItem || comboItem.getType && comboItem.getType() !== 'combo') { + console.warn('The item is not a combo!'); + return; + } + + var parentId = comboItem.getModel().parentId; + var comboTrees = self.get('comboTrees'); + if (!comboTrees) comboTrees = []; + var itemMap = this.get('itemMap'); + var comboId = comboItem.get('id'); + var treeToBeUncombo; + var brothers = []; + var comboItems = this.get('combos'); + var parentItem = this.findById(parentId); + comboTrees.forEach(function (ctree) { + if (treeToBeUncombo) return; // terminate the forEach + + traverseTreeUp$1(ctree, function (subtree) { + // find the combo to be uncomboed, delete the combo from map and cache + if (subtree.id === comboId) { + treeToBeUncombo = subtree; // delete the related edges + + var edges = comboItem.getEdges(); + edges.forEach(function (edge) { + _this.removeItem(edge, false); + }); + var index = comboItems.indexOf(combo); + comboItems.splice(index, 1); + delete itemMap[comboId]; + comboItem.destroy(); + } // find the parent to remove the combo from the combo's brothers array and add the combo's children to the combo's brothers array in the tree + + + if (parentId && treeToBeUncombo && subtree.id === parentId) { + parentItem.removeCombo(comboItem); + brothers = subtree.children; // the combo's brothers + // remove the combo from its brothers array + + var index = brothers.indexOf(treeToBeUncombo); + + if (index !== -1) { + brothers.splice(index, 1); + } // append the combo's children to the combo's brothers array + + + treeToBeUncombo.children.forEach(function (child) { + var item = _this.findById(child.id); + + var childModel = item.getModel(); + + if (item.getType && item.getType() === 'combo') { + child.parentId = parentId; + delete child.comboId; + childModel.parentId = parentId; // update the parentId of the model + + delete childModel.comboId; + } else if (item.getType && item.getType() === 'node') { + child.comboId = parentId; + childModel.comboId = parentId; // update the parentId of the model + } + + parentItem.addChild(item); + brothers.push(child); + }); + return false; + } + + return true; + }); + }); // if the parentId is not found, remove the combo from the roots + + if (!parentId && treeToBeUncombo) { + var index = comboTrees.indexOf(treeToBeUncombo); + comboTrees.splice(index, 1); // modify the parentId of the children + + treeToBeUncombo.children.forEach(function (child) { + child.parentId = undefined; + + var childModel = _this.findById(child.id).getModel(); + + childModel.parentId = undefined; // update the parentId of the model + + if (child.itemType !== 'node') comboTrees.push(child); + }); + } + }; + /** + * 根据节点的 bbox 更新所有 combos 的绘制，包括 combos 的位置和范围 + */ + + + AbstractGraph.prototype.updateCombos = function () { + var _this = this; + + var self = this; + var comboTrees = this.get('comboTrees'); + var itemController = self.get('itemController'); + var itemMap = self.get('itemMap'); + (comboTrees || []).forEach(function (ctree) { + traverseTreeUp$1(ctree, function (child) { + if (!child) { + return true; + } + + var childItem = itemMap[child.id]; + + if (childItem && childItem.getType && childItem.getType() === 'combo') { + // 更新具体的 Combo 之前先清除所有的已有状态，以免将 state 中的样式更新为 Combo 的样式 + var states = __spreadArray$3([], childItem.getStates()); + + each$2(states, function (state) { + return _this.setItemState(childItem, state, false); + }); // 更新具体的 Combo + + itemController.updateCombo(childItem, child.children); // 更新 Combo 后，还原已有的状态 + + each$2(states, function (state) { + return _this.setItemState(childItem, state, true); + }); + } + + return true; + }); + }); + self.sortCombos(); + }; + /** + * 根据节点的 bbox 更新 combo 及其祖先 combos 的绘制，包括 combos 的位置和范围 + * @param {String | ICombo} combo 需要被更新的 Combo 或 id，若指定，则该 Combo 及所有祖先 Combod 都会被更新 + */ + + + AbstractGraph.prototype.updateCombo = function (combo) { + var _this = this; + + var self = this; + var comboItem = combo; + var comboId; + + if (isString$3(combo)) { + comboItem = this.findById(combo); + } + + if (!comboItem || comboItem.getType && comboItem.getType() !== 'combo') { + console.warn('The item to be updated is not a combo!'); + return; + } + + comboId = comboItem.get('id'); + var comboTrees = this.get('comboTrees'); + var itemController = self.get('itemController'); + var itemMap = self.get('itemMap'); + (comboTrees || []).forEach(function (ctree) { + traverseTreeUp$1(ctree, function (child) { + if (!child) { + return true; + } + + var childItem = itemMap[child.id]; + + if (comboId === child.id && childItem && childItem.getType && childItem.getType() === 'combo') { + // 更新具体的 Combo 之前先清除所有的已有状态，以免将 state 中的样式更新为 Combo 的样式 + var states = __spreadArray$3([], childItem.getStates()); // || !item.getStateStyle(stateName) + + + each$2(states, function (state) { + if (childItem.getStateStyle(state)) { + _this.setItemState(childItem, state, false); + } + }); // 更新具体的 Combo + + itemController.updateCombo(childItem, child.children); // 更新 Combo 后，还原已有的状态 + + each$2(states, function (state) { + if (childItem.getStateStyle(state)) { + _this.setItemState(childItem, state, true); + } + }); + if (comboId) comboId = child.parentId; + } + + return true; + }); + }); + }; + /** + * 更新树结构，例如移动子树等 + * @param {String | INode | ICombo} item 需要被更新的 Combo 或 节点 id + * @param {string | undefined} parentId 新的父 combo id，undefined 代表没有父 combo + */ + + + AbstractGraph.prototype.updateComboTree = function (item, parentId, stack) { + if (stack === void 0) { + stack = true; + } + + var self = this; + this.set('comboSorted', false); + var uItem; + + if (isString$3(item)) { + uItem = self.findById(item); + } else { + uItem = item; + } + + var model = uItem.getModel(); + var oldParentId = model.comboId || model.parentId; + var type = ''; + if (uItem.getType) type = uItem.getType(); // 若 item 是 Combo，且 parentId 是其子孙 combo 的 id，则警告并终止 + + if (parentId && type === 'combo') { + var comboTrees = this.get('comboTrees'); + var valid_1 = true; + var itemSubTree_1; + (comboTrees || []).forEach(function (ctree) { + if (itemSubTree_1) return; + traverseTree$2(ctree, function (subTree) { + if (itemSubTree_1) return; // 找到从 item 开始的子树 + + if (subTree.id === uItem.getID()) { + itemSubTree_1 = subTree; + } + + return true; + }); + }); // 在以 item 为根的子树中寻找与 parentId 相同的后继元素 + + traverseTree$2(itemSubTree_1, function (subTree) { + if (subTree.id === parentId) { + valid_1 = false; + return false; + } + + return true; + }); // parentId 是 item 的一个后继元素，不能进行更新 + + if (!valid_1) { + console.warn('Failed to update the combo tree! The parentId points to a descendant of the combo!'); + return; + } + } + + if (stack && this.get('enabledStack')) { + var beforeData = {}, + afterData = {}; + + if (type === 'combo') { + beforeData.combos = [{ + id: model.id, + parentId: model.parentId + }]; + afterData.combos = [{ + id: model.id, + parentId: parentId + }]; + } else if (type === 'node') { + beforeData.nodes = [{ + id: model.id, + parentId: model.comboId + }]; + afterData.nodes = [{ + id: model.id, + parentId: parentId + }]; + } + + this.pushStack('updateComboTree', { + before: beforeData, + after: afterData + }); + } // 当 combo 存在 parentId 或 comboId 时，才将其移除 + + + if (model.parentId || model.comboId) { + var combo = this.findById(model.parentId || model.comboId); + + if (combo) { + combo.removeChild(uItem); + } + } + + if (type === 'combo') { + model.parentId = parentId; + } else if (type === 'node') { + model.comboId = parentId; + } // 只有当移入到指定 combo 时才添加 + + + if (parentId) { + var parentCombo = this.findById(parentId); + + if (parentCombo) { + // 将元素添加到 parentCombo 中 + parentCombo.addChild(uItem); + } + } // 如果原先有父亲 combo，则从原父 combo 的子元素数组中删除 + + + if (oldParentId) { + var parentCombo = this.findById(oldParentId); + + if (parentCombo) { + // 将元素从 parentCombo 中移除 + parentCombo.removeChild(uItem); + } + } + + var newComboTrees = reconstructTree(this.get('comboTrees'), model.id, parentId); + this.set('comboTrees', newComboTrees); + this.updateCombos(); + }; + /** + * 导出图数据 + * @return {object} data + */ + + + AbstractGraph.prototype.save = function () { + var nodes = []; + var edges = []; + var combos = []; + each$2(this.get('nodes'), function (node) { + nodes.push(node.getModel()); + }); + each$2(this.get('edges'), function (edge) { + edges.push(edge.getModel()); + }); + each$2(this.get('combos'), function (combo) { + combos.push(combo.getModel()); + }); + return { + nodes: nodes, + edges: edges, + combos: combos + }; + }; + /** + * 改变画布大小 + * @param {number} width 画布宽度 + * @param {number} height 画布高度 + * @return {object} this + */ + + + AbstractGraph.prototype.changeSize = function (width, height) { + var viewController = this.get('viewController'); + viewController.changeSize(width, height); + return this; + }; + /** + * 当源数据在外部发生变更时，根据新数据刷新视图。但是不刷新节点位置 + */ + + + AbstractGraph.prototype.refresh = function () { + var self = this; + self.emit('beforegraphrefresh'); + + if (self.get('animate')) { + self.positionsAnimate(); + } else { + var nodes = self.get('nodes'); + var edges = self.get('edges'); + var vedges = self.get('edges'); + each$2(nodes, function (node) { + node.refresh(); + }); + each$2(edges, function (edge) { + edge.refresh(); + }); + each$2(vedges, function (vedge) { + vedge.refresh(); + }); + } + + self.emit('aftergraphrefresh'); + self.autoPaint(); + }; + /** + * 获取当前图中所有节点的item实例 + * @return {INode} item数组 + */ + + + AbstractGraph.prototype.getNodes = function () { + return this.get('nodes'); + }; + /** + * 获取当前图中所有边的item实例 + * @return {IEdge} item数组 + */ + + + AbstractGraph.prototype.getEdges = function () { + return this.get('edges'); + }; + /** + * 获取图中所有的 combo 实例 + */ + + + AbstractGraph.prototype.getCombos = function () { + return this.get('combos'); + }; + /** + * 获取指定 Combo 中所有的节点 + * @param comboId combo ID + */ + + + AbstractGraph.prototype.getComboChildren = function (combo) { + if (isString$3(combo)) { + combo = this.findById(combo); + } + + if (!combo || combo.getType && combo.getType() !== 'combo') { + console.warn('The combo does not exist!'); + return; + } + + return combo.getChildren(); + }; + /** + * 根据 graph 上的 animateCfg 进行视图中节点位置动画接口 + */ + + + AbstractGraph.prototype.positionsAnimate = function () { + var self = this; + self.emit('beforeanimate'); + var animateCfg = self.get('animateCfg'); + var onFrame = animateCfg.onFrame; + var nodes = self.getNodes(); + var toNodes = nodes.map(function (node) { + var model = node.getModel(); + return { + id: model.id, + x: model.x, + y: model.y + }; + }); + + if (self.isAnimating()) { + self.stopAnimate(); + } + + var canvas = self.get('canvas'); + canvas.animate(function (ratio) { + each$2(toNodes, function (data) { + var node = self.findById(data.id); + + if (!node || node.destroyed) { + return; + } + + var originAttrs = node.get('originAttrs'); + var model = node.get('model'); + + if (!originAttrs) { + var containerMatrix = node.getContainer().getMatrix(); + if (!containerMatrix) containerMatrix = [1, 0, 0, 0, 1, 0, 0, 0, 1]; + originAttrs = { + x: containerMatrix[6], + y: containerMatrix[7] + }; + node.set('originAttrs', originAttrs); + } + + if (onFrame) { + var attrs = onFrame(node, ratio, data, originAttrs); + node.set('model', Object.assign(model, attrs)); + } else { + model.x = originAttrs.x + (data.x - originAttrs.x) * ratio; + model.y = originAttrs.y + (data.y - originAttrs.y) * ratio; + } + }); + self.refreshPositions(); + }, { + duration: animateCfg.duration, + easing: animateCfg.easing, + callback: function callback() { + each$2(nodes, function (node) { + node.set('originAttrs', null); + }); + + if (animateCfg.callback) { + animateCfg.callback(); + } + + self.emit('afteranimate'); + self.animating = false; + } + }); + }; + /** + * 当节点位置在外部发生改变时，刷新所有节点位置，重计算边 + */ + + + AbstractGraph.prototype.refreshPositions = function () { + var self = this; + self.emit('beforegraphrefreshposition'); + var nodes = self.get('nodes'); + var edges = self.get('edges'); + var vedges = self.get('vedges'); + var combos = self.get('combos'); + var model; + var updatedNodes = {}; + each$2(nodes, function (node) { + model = node.getModel(); + var originAttrs = node.get('originAttrs'); + + if (originAttrs && model.x === originAttrs.x && model.y === originAttrs.y) { + return; + } + + var changed = node.updatePosition({ + x: model.x, + y: model.y + }); + updatedNodes[model.id] = changed; + if (model.comboId) updatedNodes[model.comboId] = updatedNodes[model.comboId] || changed; + }); + + if (combos && combos.length !== 0) { + self.updateCombos(); + } + + each$2(edges, function (edge) { + var sourceModel = edge.getSource().getModel(); + var targetModel = edge.getTarget().getModel(); + + if (updatedNodes[sourceModel.id] || updatedNodes[targetModel.id] || edge.getModel().isComboEdge) { + edge.refresh(); + } + }); + each$2(vedges, function (vedge) { + vedge.refresh(); + }); + self.emit('aftergraphrefreshposition'); + self.autoPaint(); + }; + + AbstractGraph.prototype.stopAnimate = function () { + this.get('canvas').stopAnimate(); + }; + + AbstractGraph.prototype.isAnimating = function () { + return this.animating; + }; + /** + * 获取当前视口伸缩比例 + * @return {number} 比例 + */ + + + AbstractGraph.prototype.getZoom = function () { + var matrix = this.get('group').getMatrix(); + return matrix ? matrix[0] : 1; + }; + /** + * 获取当前的行为模式 + * @return {string} 当前行为模式 + */ + + + AbstractGraph.prototype.getCurrentMode = function () { + var modeController = this.get('modeController'); + return modeController.getMode(); + }; + /** + * 切换行为模式 + * @param {string} mode 指定模式 + * @return {object} this + */ + + + AbstractGraph.prototype.setMode = function (mode) { + var modeController = this.get('modeController'); + modeController.setMode(mode); + return this; + }; + /** + * 清除画布元素 + * @return {object} this + */ + + + AbstractGraph.prototype.clear = function (avoidEmit) { + if (avoidEmit === void 0) { + avoidEmit = false; + } + + var canvas = this.get('canvas'); + canvas.clear(); + this.initGroups(); // 清空画布时同时清除数据 + + this.set({ + itemMap: {}, + nodes: [], + edges: [], + groups: [], + combos: [], + comboTrees: [] + }); + if (!avoidEmit) this.emit('afterrender'); + return this; + }; + /** + * 更换布局配置项 + * @param {object} cfg 新布局配置项 + * 若 cfg 含有 type 字段或为 String 类型，且与现有布局方法不同，则更换布局 + * 若 cfg 不包括 type ，则保持原有布局方法，仅更新布局配置项 + */ + + + AbstractGraph.prototype.updateLayout = function (cfg) { + var layoutController = this.get('layoutController'); + + if (isString$3(cfg)) { + cfg = { + type: cfg + }; + } + + var oriLayoutCfg = this.get('layout'); + var layoutCfg = {}; + Object.assign(layoutCfg, oriLayoutCfg, cfg); + this.set('layout', layoutCfg); + + if (layoutController.isLayoutTypeSame(layoutCfg) && layoutCfg.gpuEnabled === oriLayoutCfg.gpuEnabled) { + // no type or same type, or switch the gpu and cpu, update layout + layoutController.updateLayoutCfg(layoutCfg); + } else { + // has different type, change layout + layoutController.changeLayout(layoutCfg); + } + }; + /** + * 销毁布局，changeData 时不会再使用原来的布局方法对新数据进行布局 + */ + + + AbstractGraph.prototype.destroyLayout = function () { + var layoutController = this.get('layoutController'); + layoutController.destroyLayout(); + }; + /** + * 重新以当前示例中配置的属性进行一次布局 + */ + + + AbstractGraph.prototype.layout = function () { + var layoutController = this.get('layoutController'); + var layoutCfg = this.get('layout'); + if (!layoutCfg || !layoutController) return; + + if (layoutCfg.workerEnabled) { + // 如果使用web worker布局 + layoutController.layout(); + return; + } + + if (layoutController.layoutMethod) { + layoutController.relayout(true); + } else { + layoutController.layout(); + } + }; + /** + * 收起指定的 combo + * @param {string | ICombo} combo combo ID 或 combo item + */ + + + AbstractGraph.prototype.collapseCombo = function (combo) { + var _this = this; + + if (isString$3(combo)) { + combo = this.findById(combo); + } + + if (!combo) { + console.warn('The combo to be collapsed does not exist!'); + return; + } + + this.emit('beforecollapseexpandcombo', { + action: 'expand', + item: combo + }); + var comboModel = combo.getModel(); + var itemController = this.get('itemController'); + itemController.collapseCombo(combo); + comboModel.collapsed = true; // add virtual edges + + var edges = this.getEdges().concat(this.get('vedges')); // find all the descendant nodes and combos + + var cnodes = []; + var ccombos = []; + var comboTrees = this.get('comboTrees'); + var found = false; + var brothers = {}; + (comboTrees || []).forEach(function (ctree) { + brothers[ctree.id] = ctree; + }); + (comboTrees || []).forEach(function (ctree) { + if (found) return; // if the combo is found, terminate the forEach + + traverseTree$2(ctree, function (subTree) { + // if the combo is found and the it is traversing the other brothers, terminate + if (found && brothers[subTree.id]) return false; + + if (comboModel.parentId === subTree.id) { + // if the parent is found, store the brothers + brothers = {}; + subTree.children.forEach(function (child) { + brothers[child.id] = child; + }); + } else if (comboModel.id === subTree.id) { + // if the combo is found + found = true; + } + + if (found) { + // if the combo is found, concat the descendant nodes and combos + var item = _this.findById(subTree.id); + + if (item && item.getType && item.getType() === 'combo') { + cnodes = cnodes.concat(item.getNodes()); + ccombos = ccombos.concat(item.getCombos()); + } + } + + return true; + }); + }); + var edgeWeightMap = {}; + var addedVEdges = []; + edges.forEach(function (edge) { + if (edge.isVisible() && !edge.getModel().isVEdge) return; + var source = edge.getSource(); + var target = edge.getTarget(); + + if ((cnodes.includes(source) || ccombos.includes(source)) && !cnodes.includes(target) && !ccombos.includes(target) || source.getModel().id === comboModel.id) { + var edgeModel = edge.getModel(); + + if (edgeModel.isVEdge) { + _this.removeItem(edge, false); + + return; + } + + var targetModel = target.getModel(); + + while (!target.isVisible()) { + target = _this.findById(targetModel.parentId || targetModel.comboId); + if (!target || !targetModel.parentId && !targetModel.comboId) return; // all the ancestors are hidden, then ignore the edge + + targetModel = target.getModel(); + } + + var targetId = targetModel.id; + + if (edgeWeightMap[comboModel.id + "-" + targetId]) { + edgeWeightMap[comboModel.id + "-" + targetId] += edgeModel.size || 1; + return; + } // the source is in the combo, the target is not + + + var vedge = _this.addItem('vedge', { + source: comboModel.id, + target: targetId, + isVEdge: true + }, false); + + edgeWeightMap[comboModel.id + "-" + targetId] = edgeModel.size || 1; + addedVEdges.push(vedge); + } else if (!cnodes.includes(source) && !ccombos.includes(source) && (cnodes.includes(target) || ccombos.includes(target)) || target.getModel().id === comboModel.id) { + var edgeModel = edge.getModel(); + + if (edgeModel.isVEdge) { + _this.removeItem(edge, false); + + return; + } + + var sourceModel = source.getModel(); + + while (!source.isVisible()) { + source = _this.findById(sourceModel.parentId || sourceModel.comboId); + if (!source || !sourceModel.parentId && !sourceModel.comboId) return; // all the ancestors are hidden, then ignore the edge + + sourceModel = source.getModel(); + } + + var sourceId = sourceModel.id; + + if (edgeWeightMap[sourceId + "-" + comboModel.id]) { + edgeWeightMap[sourceId + "-" + comboModel.id] += edgeModel.size || 1; + return; + } // the target is in the combo, the source is not + + + var vedge = _this.addItem('vedge', { + target: comboModel.id, + source: sourceId, + isVEdge: true + }, false); + + edgeWeightMap[sourceId + "-" + comboModel.id] = edgeModel.size || 1; + addedVEdges.push(vedge); + } + }); // update the width of the virtual edges, which is the sum of merged actual edges + // be attention that the actual edges with same endpoints but different directions will be represented by two different virtual edges + + addedVEdges.forEach(function (vedge) { + var vedgeModel = vedge.getModel(); + + _this.updateItem(vedge, { + size: edgeWeightMap[vedgeModel.source + "-" + vedgeModel.target] + }, false); + }); + this.emit('aftercollapseexpandcombo', { + action: 'collapse', + item: combo + }); + }; + /** + * 展开指定的 combo + * @param {string | ICombo} combo combo ID 或 combo item + */ + + + AbstractGraph.prototype.expandCombo = function (combo) { + var _this = this; + + if (isString$3(combo)) { + combo = this.findById(combo); + } + + if (!combo || combo.getType && combo.getType() !== 'combo') { + console.warn('The combo to be collapsed does not exist!'); + return; + } + + this.emit('beforecollapseexpandcombo', { + action: 'expand', + item: combo + }); + var comboModel = combo.getModel(); + var itemController = this.get('itemController'); + itemController.expandCombo(combo); + comboModel.collapsed = false; // add virtual edges + + var edges = this.getEdges().concat(this.get('vedges')); // find all the descendant nodes and combos + + var cnodes = []; + var ccombos = []; + var comboTrees = this.get('comboTrees'); + var found = false; + var brothers = {}; + (comboTrees || []).forEach(function (ctree) { + brothers[ctree.id] = ctree; + }); + (comboTrees || []).forEach(function (ctree) { + if (found) return; // if the combo is found, terminate + + traverseTree$2(ctree, function (subTree) { + if (found && brothers[subTree.id]) { + return false; + } + + if (comboModel.parentId === subTree.id) { + brothers = {}; + subTree.children.forEach(function (child) { + brothers[child.id] = child; + }); + } else if (comboModel.id === subTree.id) { + found = true; + } + + if (found) { + var item = _this.findById(subTree.id); + + if (item && item.getType && item.getType() === 'combo') { + cnodes = cnodes.concat(item.getNodes()); + ccombos = ccombos.concat(item.getCombos()); + } + } + + return true; + }); + }); + var edgeWeightMap = {}; + var addedVEdges = {}; + edges.forEach(function (edge) { + if (edge.isVisible() && !edge.getModel().isVEdge) return; + var source = edge.getSource(); + var target = edge.getTarget(); + var sourceId = source.get('id'); + var targetId = target.get('id'); + + if ((cnodes.includes(source) || ccombos.includes(source)) && !cnodes.includes(target) && !ccombos.includes(target) || sourceId === comboModel.id) { + // the source is in the combo, the target is not + // ignore the virtual edges + if (edge.getModel().isVEdge) { + _this.removeItem(edge, false); + + return; + } + + var targetModel = target.getModel(); // find the nearest visible ancestor + + while (!target.isVisible()) { + target = _this.findById(targetModel.comboId || targetModel.parentId); + + if (!target || !targetModel.parentId && !targetModel.comboId) { + return; // if all the ancestors of the oppsite are all hidden, ignore the edge + } + + targetModel = target.getModel(); + } + + targetId = targetModel.id; + var sourceModel = source.getModel(); // find the nearest visible ancestor + + while (!source.isVisible()) { + source = _this.findById(sourceModel.comboId || sourceModel.parentId); + + if (!source || !sourceModel.parentId && !sourceModel.comboId) { + return; // if all the ancestors of the oppsite are all hidden, ignore the edge + } + + if (sourceModel.comboId === comboModel.id || sourceModel.parentId === comboModel.id) { + break; // if the next ancestor is the combo, break the while + } + + sourceModel = source.getModel(); + } + + sourceId = sourceModel.id; + + if (targetId) { + var vedgeId = sourceId + "-" + targetId; // update the width of the virtual edges, which is the sum of merged actual edges + // be attention that the actual edges with same endpoints but different directions will be represented by two different virtual edges + + if (edgeWeightMap[vedgeId]) { + edgeWeightMap[vedgeId] += edge.getModel().size || 1; + + _this.updateItem(addedVEdges[vedgeId], { + size: edgeWeightMap[vedgeId] + }, false); + + return; + } + + var vedge = _this.addItem('vedge', { + source: sourceId, + target: targetId, + isVEdge: true + }, false); + + edgeWeightMap[vedgeId] = edge.getModel().size || 1; + addedVEdges[vedgeId] = vedge; + } + } else if (!cnodes.includes(source) && !ccombos.includes(source) && (cnodes.includes(target) || ccombos.includes(target)) || targetId === comboModel.id) { + // the target is in the combo, the source is not + // ignore the virtual edges + if (edge.getModel().isVEdge) { + _this.removeItem(edge, false); + + return; + } + + var sourceModel = source.getModel(); // find the nearest visible ancestor + + while (!source.isVisible()) { + source = _this.findById(sourceModel.comboId || sourceModel.parentId); + + if (!source || !sourceModel.parentId && !sourceModel.comboId) { + return; // if all the ancestors of the oppsite are all hidden, ignore the edge + } + + sourceModel = source.getModel(); + } + + sourceId = sourceModel.id; + var targetModel = target.getModel(); // find the nearest visible ancestor + + while (!target.isVisible()) { + target = _this.findById(targetModel.comboId || targetModel.parentId); + + if (!target || !targetModel.parentId && !targetModel.comboId) { + return; // if all the ancestors of the oppsite are all hidden, ignore the edge + } + + if (targetModel.comboId === comboModel.id || targetModel.parentId === comboModel.id) { + break; // if the next ancestor is the combo, break the while + } + + targetModel = target.getModel(); + } + + targetId = targetModel.id; + + if (sourceId) { + var vedgeId = sourceId + "-" + targetId; // update the width of the virtual edges, which is the sum of merged actual edges + // be attention that the actual edges with same endpoints but different directions will be represented by two different virtual edges + + if (edgeWeightMap[vedgeId]) { + edgeWeightMap[vedgeId] += edge.getModel().size || 1; + + _this.updateItem(addedVEdges[vedgeId], { + size: edgeWeightMap[vedgeId] + }, false); + + return; + } + + var vedge = _this.addItem('vedge', { + target: targetId, + source: sourceId, + isVEdge: true + }, false); + + edgeWeightMap[vedgeId] = edge.getModel().size || 1; + addedVEdges[vedgeId] = vedge; + } + } else if ((cnodes.includes(source) || ccombos.includes(source)) && (cnodes.includes(target) || ccombos.includes(target))) { + // both source and target are in the combo, if the target and source are both visible, show the edge + if (source.isVisible() && target.isVisible()) { + edge.show(); + } + } + }); + this.emit('aftercollapseexpandcombo', { + action: 'expand', + item: combo + }); + }; + + AbstractGraph.prototype.collapseExpandCombo = function (combo) { + if (isString$3(combo)) { + combo = this.findById(combo); + } + + if (combo.getType && combo.getType() !== 'combo') return; + var comboModel = combo.getModel(); // if one ancestor combo of the combo is collapsed, it should not be collapsed or expanded + + var parentItem = this.findById(comboModel.parentId); + + while (parentItem) { + var parentModel = parentItem.getModel(); + + if (parentModel.collapsed) { + console.warn("Fail to expand the combo since it's ancestor combo is collapsed."); + parentItem = undefined; + return; + } + + parentItem = this.findById(parentModel.parentId); + } + + var collapsed = comboModel.collapsed; // 该群组已经处于收起状态，需要展开 + + if (collapsed) { + this.expandCombo(combo); + } else { + this.collapseCombo(combo); + } + + this.updateCombo(combo); + }; + /** + * 根据 comboTree 结构整理 Combo 相关的图形绘制层级，包括 Combo 本身、节点、边 + * @param {GraphData} data 数据 + */ + + + AbstractGraph.prototype.sortCombos = function () { + var _this = this; + + var comboSorted = this.get('comboSorted'); + if (comboSorted) return; + this.set('comboSorted', true); + var depthMap = []; + var dataDepthMap = {}; + var comboTrees = this.get('comboTrees'); + (comboTrees || []).forEach(function (cTree) { + traverseTree$2(cTree, function (child) { + if (depthMap[child.depth]) depthMap[child.depth].push(child.id);else depthMap[child.depth] = [child.id]; + dataDepthMap[child.id] = child.depth; + return true; + }); + }); + var edges = this.getEdges().concat(this.get('vedges')); + (edges || []).forEach(function (edgeItem) { + var edge = edgeItem.getModel(); + var sourceDepth = dataDepthMap[edge.source] || 0; + var targetDepth = dataDepthMap[edge.target] || 0; + var depth = Math.max(sourceDepth, targetDepth); + if (depthMap[depth]) depthMap[depth].push(edge.id);else depthMap[depth] = [edge.id]; + }); + depthMap.forEach(function (array) { + if (!array || !array.length) return; + + for (var i = array.length - 1; i >= 0; i--) { + var item = _this.findById(array[i]); + + if (item) item.toFront(); + } + }); + }; + /** + * 获取节点所有的邻居节点 + * + * @param {(string | INode)} node 节点 ID 或实例 + * @returns {INode[]} + * @memberof IAbstractGraph + */ + + + AbstractGraph.prototype.getNeighbors = function (node, type) { + var item = node; + + if (isString$3(node)) { + item = this.findById(node); + } + + return item.getNeighbors(type); + }; + /** + * 获取 node 的度数 + * + * @param {(string | INode)} node 节点 ID 或实例 + * @param {('in' | 'out' | 'total' | 'all' | undefined)} 度数类型，in 入度，out 出度，total 总度数，all 返回三种类型度数的对象 + * @returns {Number | Object} 该节点的度数 + * @memberof IAbstractGraph + */ + + + AbstractGraph.prototype.getNodeDegree = function (node, type, refresh) { + if (type === void 0) { + type = undefined; + } + + if (refresh === void 0) { + refresh = false; + } + + var item = node; + + if (isString$3(node)) { + item = this.findById(node); + } + + var degrees = this.get('degrees'); + + if (!degrees || refresh) { + degrees = degree(this.save()); + this.set('degrees', degrees); + } + + var nodeDegrees = degrees[item.getID()]; + var res = 0; // 如果是通过 addItem 后面新增加的节点，此时它的所有度数都为 0 + + if (!nodeDegrees) { + return 0; + } + + switch (type) { + case 'in': + res = nodeDegrees.inDegree; + break; + + case 'out': + res = nodeDegrees.outDegree; + break; + + case 'all': + res = nodeDegrees; + break; + + default: + res = nodeDegrees.degree; + break; + } + + return res; + }; + + AbstractGraph.prototype.getUndoStack = function () { + return this.undoStack; + }; + + AbstractGraph.prototype.getRedoStack = function () { + return this.redoStack; + }; + /** + * 获取 undo 和 redo 栈的数据 + */ + + + AbstractGraph.prototype.getStackData = function () { + if (!this.get('enabledStack')) { + return null; + } + + return { + undoStack: this.undoStack.toArray(), + redoStack: this.redoStack.toArray() + }; + }; + /** + * 清空 undo stack & redo stack + */ + + + AbstractGraph.prototype.clearStack = function () { + if (this.get('enabledStack')) { + this.undoStack.clear(); + this.redoStack.clear(); + } + }; + /** + * 将操作类型和操作数据入栈 + * @param action 操作类型 + * @param data 入栈的数据 + * @param stackType 栈的类型 + */ + + + AbstractGraph.prototype.pushStack = function (action, data, stackType) { + if (action === void 0) { + action = 'update'; + } + + if (stackType === void 0) { + stackType = 'undo'; + } + + if (!this.get('enabledStack')) { + console.warn('请先启用 undo & redo 功能，在实例化 Graph 时候配置 enabledStack: true !'); + return; + } + + var stackData = data ? clone$7(data) : { + before: {}, + after: clone$7(this.save()) + }; + + if (stackType === 'redo') { + this.redoStack.push({ + action: action, + data: stackData + }); + } else { + this.undoStack.push({ + action: action, + data: stackData + }); + } + + this.emit('stackchange', { + undoStack: this.undoStack, + redoStack: this.redoStack + }); + }; + /** + * 获取邻接矩阵 + * + * @param {boolean} cache 是否使用缓存的 + * @param {boolean} directed 是否是有向图，默认取 graph.directed + * @returns {Matrix} 邻接矩阵 + * @memberof IAbstractGraph + */ + + + AbstractGraph.prototype.getAdjMatrix = function (cache, directed) { + if (cache === void 0) { + cache = true; + } + + if (directed === undefined) directed = this.get('directed'); + var currentAdjMatrix = this.get('adjMatrix'); + + if (!currentAdjMatrix || !cache) { + currentAdjMatrix = adjMatrix(this.save(), directed); + this.set('adjMatrix', currentAdjMatrix); + } + + return currentAdjMatrix; + }; + /** + * 获取最短路径矩阵 + * + * @param {boolean} cache 是否使用缓存的 + * @param {boolean} directed 是否是有向图，默认取 graph.directed + * @returns {Matrix} 最短路径矩阵 + * @memberof IAbstractGraph + */ + + + AbstractGraph.prototype.getShortestPathMatrix = function (cache, directed) { + if (cache === void 0) { + cache = true; + } + + if (directed === undefined) directed = this.get('directed'); + var currentAdjMatrix = this.get('adjMatrix'); + var currentShourtestPathMatrix = this.get('shortestPathMatrix'); + + if (!currentAdjMatrix || !cache) { + currentAdjMatrix = adjMatrix(this.save(), directed); + this.set('adjMatrix', currentAdjMatrix); + } + + if (!currentShourtestPathMatrix || !cache) { + currentShourtestPathMatrix = floydWarshall$3(this.save(), directed); + this.set('shortestPathMatrix', currentShourtestPathMatrix); + } + + return currentShourtestPathMatrix; + }; + /** + * 重新定义监听函数，复写参数类型 + */ + + + AbstractGraph.prototype.on = function (eventName, callback, once) { + return _super.prototype.on.call(this, eventName, callback, once); + }; + /** + * 销毁画布 + */ + + + AbstractGraph.prototype.destroy = function () { + this.clear(); // 清空栈数据 + + this.clearStack(); + this.get('itemController').destroy(); + this.get('modeController').destroy(); + this.get('viewController').destroy(); + this.get('stateController').destroy(); + this.get('canvas').destroy(); + this.cfg = null; + this.destroyed = true; + this.redoStack = null; + this.undoStack = null; + }; + /** + * 创建凸包或凹包轮廓 + * @param cfg HullCfg 轮廓配置项 + */ + + + AbstractGraph.prototype.createHull = function (cfg) { + if (!cfg.members || cfg.members.length < 1) { + console.warn('Create hull failed! The members is empty.'); + return; + } + + var parent = this.get('hullGroup'); + var hullMap = this.get('hullMap'); + + if (!hullMap) { + hullMap = {}; + this.set('hullMap', hullMap); + } + + if (!parent || parent.get('destroyed')) { + parent = this.get('group').addGroup({ + id: 'hullGroup' + }); + parent.toBack(); + this.set('hullGroup', parent); + } + + if (hullMap[cfg.id]) { + console.warn('Existed hull id.'); + return hullMap[cfg.id]; + } + + var group = parent.addGroup({ + id: cfg.id + "-container" + }); + var hull = new Hull(this, __assign$r(__assign$r({}, cfg), { + group: group + })); + var hullId = hull.id; + hullMap[hullId] = hull; + return hull; + }; + /** + * 获取当前 graph 中存在的包裹轮廓 + * @return {[key: string]: Hull} Hull 的 map，hullId 对应的 hull 实例 + */ + + + AbstractGraph.prototype.getHulls = function () { + return this.get('hullMap'); + }; + /** + * 根据 hullId 获取对应的 hull + * @return Hull + */ + + + AbstractGraph.prototype.getHullById = function (hullId) { + return this.get('hullMap')[hullId]; + }; + + AbstractGraph.prototype.removeHull = function (hull) { + var hullInstance; + + if (isString$3(hull)) { + hullInstance = this.getHullById(hull); + } else { + hullInstance = hull; + } + + var hullMap = this.get('hullMap'); + delete hullMap[hullInstance.id]; + hullInstance.destroy(); + }; + + AbstractGraph.prototype.removeHulls = function () { + var hulls = this.getHulls(); + if (!hulls || !Object.keys(hulls).length) return; + Object.keys(hulls).forEach(function (key) { + var hull = hulls[key]; + hull.destroy(); + }); + this.set('hullMap', {}); + }; + + return AbstractGraph; +}(EventEmitter); + +function _typeof$2(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof$2 = function _typeof(obj) { return typeof obj; }; } else { _typeof$2 = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof$2(obj); } +var transform$8 = transform$i; +var CLS_SHAPE_SUFFIX = '-shape'; +var CLS_LABEL_SUFFIX = '-label'; +var ARROWS = ['startArrow', 'endArrow']; +var SHAPE_DEFAULT_ATTRS = { + lineWidth: 1, + stroke: undefined, + fill: undefined, + lineAppendWidth: 1, + opacity: undefined, + strokeOpacity: undefined, + fillOpacity: undefined, + x: 0, + y: 0, + r: 10, + width: 20, + height: 20, + shadowColor: undefined, + shadowBlur: 0, + shadowOffsetX: 0, + shadowOffsetY: 0 +}; +var PATH_SHAPE_DEFAULT_ATTRS = { + lineWidth: 1, + stroke: '#000', + lineDash: undefined, + startArrow: false, + endArrow: false, + opacity: undefined, + strokeOpacity: undefined, + fillOpacity: undefined, + shadowColor: undefined, + shadowBlur: 0, + shadowOffsetX: 0, + shadowOffsetY: 0 +}; +var SHAPES_DEFAULT_ATTRS = { + edge: PATH_SHAPE_DEFAULT_ATTRS, + node: SHAPE_DEFAULT_ATTRS, + combo: SHAPE_DEFAULT_ATTRS +}; +var CLS_LABEL_BG_SUFFIX = '-label-bg'; // 单个 shape 带有一个 label，共用这段代码 + +var shapeBase = { + // 默认样式及配置 + options: {}, + itemType: '', + + /** + * 形状的类型，例如 circle，ellipse，polyline... + */ + type: '', + getCustomConfig: function getCustomConfig(cfg) { + return {}; + }, + getOptions: function getOptions(cfg) { + return deepMix({ + // 解决局部渲染导致的文字移动残影问题 + labelCfg: { + style: { + fontFamily: typeof window !== 'undefined' ? window.getComputedStyle(document.body, null).getPropertyValue('font-family') || 'Arial, sans-serif' : 'Arial, sans-serif' + } + }, + descriptionCfg: { + style: { + fontFamily: typeof window !== 'undefined' ? window.getComputedStyle(document.body, null).getPropertyValue('font-family') || 'Arial, sans-serif' : 'Arial, sans-serif' + } + } + }, this.options, this.getCustomConfig(cfg) || {}, cfg); + }, + + /** + * 绘制节点/边，包含文本 + * @override + * @param {Object} cfg 节点的配置项 + * @param {G.Group} group 节点的容器 + * @return {IShape} 绘制的图形 + */ + draw: function draw(cfg, group) { + var shape = this.drawShape(cfg, group); + shape.set('className', this.itemType + CLS_SHAPE_SUFFIX); + + if (cfg.label) { + var label = this.drawLabel(cfg, group); + label.set('className', this.itemType + CLS_LABEL_SUFFIX); + } + + return shape; + }, + + /** + * 绘制完成后的操作，便于用户继承现有的节点、边 + * @param cfg + * @param group + * @param keyShape + */ + afterDraw: function afterDraw(cfg, group, keyShape) {}, + drawShape: function drawShape(cfg, group) { + return null; + }, + drawLabel: function drawLabel(cfg, group) { + var defaultLabelCfg = this.getOptions(cfg).labelCfg; // image的情况下有可能为null + + var labelCfg = defaultLabelCfg || {}; + var labelStyle = this.getLabelStyle(cfg, labelCfg, group); + var rotate = labelStyle.rotate; + delete labelStyle.rotate; + var label = group.addShape('text', { + attrs: labelStyle, + draggable: true, + className: 'text-shape', + name: 'text-shape' + }); + + if (rotate) { + var labelBBox = label.getBBox(); + var labelMatrix = label.getMatrix(); + + if (!labelMatrix) { + labelMatrix = [1, 0, 0, 0, 1, 0, 0, 0, 1]; + } + + if (labelStyle.rotateCenter) { + switch (labelStyle.rotateCenter) { + case 'center': + labelMatrix = transform$8(labelMatrix, [['t', -labelBBox.width / 2, -labelBBox.height / 2], ['r', rotate], ['t', labelBBox.width / 2, labelBBox.height / 2]]); + break; + + case 'lefttop': + labelMatrix = transform$8(labelMatrix, [['t', -labelStyle.x, -labelStyle.y], ['r', rotate], ['t', labelStyle.x, labelStyle.y]]); + break; + + case 'leftcenter': + labelMatrix = transform$8(labelMatrix, [['t', -labelStyle.x, -labelStyle.y - labelBBox.height / 2], ['r', rotate], ['t', labelStyle.x, labelStyle.y + labelBBox.height / 2]]); + break; + + default: + labelMatrix = transform$8(labelMatrix, [['t', -labelBBox.width / 2, -labelBBox.height / 2], ['r', rotate], ['t', labelBBox.width / 2, labelBBox.height / 2]]); + break; + } + } else { + labelMatrix = transform$8(labelMatrix, [['t', -labelStyle.x, -labelStyle.y - labelBBox.height / 2], ['r', rotate], ['t', labelStyle.x, labelStyle.y + labelBBox.height / 2]]); + } + + label.setMatrix(labelMatrix); + } + + if (labelStyle.background) { + var rect = this.drawLabelBg(cfg, group, label); + var labelBgClassname = this.itemType + CLS_LABEL_BG_SUFFIX; + rect.set('classname', labelBgClassname); + label.toFront(); + } + + return label; + }, + drawLabelBg: function drawLabelBg(cfg, group, label) { + var defaultLabelCfg = this.options.labelCfg; + var labelCfg = mix({}, defaultLabelCfg, cfg.labelCfg); + var style = this.getLabelBgStyleByPosition(label, cfg, labelCfg, group); + var rect = group.addShape('rect', { + name: 'text-bg-shape', + attrs: style + }); + return rect; + }, + getLabelStyleByPosition: function getLabelStyleByPosition(cfg, labelCfg, group) { + return { + text: cfg.label + }; + }, + getLabelBgStyleByPosition: function getLabelBgStyleByPosition(label, cfg, labelCfg, group) { + return {}; + }, + + /** + * 获取文本的配置项 + * @param cfg 节点的配置项 + * @param labelCfg 文本的配置项 + * @param group 父容器，label 的定位可能与图形相关 + */ + getLabelStyle: function getLabelStyle(cfg, labelCfg, group) { + var calculateStyle = this.getLabelStyleByPosition(cfg, labelCfg, group); + var attrName = this.itemType + "Label"; // 取 nodeLabel，edgeLabel 的配置项 + + var defaultStyle = Global$1[attrName] ? Global$1[attrName].style : null; + + var labelStyle = __assign$r(__assign$r(__assign$r({}, defaultStyle), calculateStyle), labelCfg.style); + + return labelStyle; + }, + + /** + * 获取图形的配置项 + * @param cfg + */ + getShapeStyle: function getShapeStyle(cfg) { + return cfg.style; + }, + + /** + * 更新节点，包含文本 + * @override + * @param {Object} cfg 节点/边的配置项 + * @param {G6.Item} item 节点/边 + */ + update: function update(cfg, item) { + this.updateShapeStyle(cfg, item); + this.updateLabel(cfg, item); + }, + updateShapeStyle: function updateShapeStyle(cfg, item) { + var group = item.getContainer(); + var shape = item.getKeyShape(); + var shapeStyle = mix({}, shape.attr(), cfg.style); + + var _loop_1 = function _loop_1(key) { + var _a; + + var style = shapeStyle[key]; + + if (isPlainObject$3(style)) { + // 更新图元素样式，支持更新子元素 + var subShape = group.find(function (element) { + return element.get('name') === key; + }); + + if (subShape) { + subShape.attr(style); + } + } else { + shape.attr((_a = {}, _a[key] = style, _a)); + } + }; + + for (var key in shapeStyle) { + _loop_1(key); + } + }, + updateLabel: function updateLabel(cfg, item) { + var group = item.getContainer(); + var defaultLabelCfg = this.getOptions({}).labelCfg; + var labelClassName = this.itemType + CLS_LABEL_SUFFIX; + var label = group.find(function (element) { + return element.get('className') === labelClassName; + }); + var labelBgClassname = this.itemType + CLS_LABEL_BG_SUFFIX; + var labelBg = group.find(function (element) { + return element.get('classname') === labelBgClassname; + }); // 防止 cfg.label = "" 的情况 + + if (cfg.label || cfg.label === '') { + // 若传入的新配置中有 label，（用户没传入但原先有 label，label 也会有值） + if (!label) { + // 若原先不存在 label，则绘制一个新的 label + var newLabel = this.drawLabel(cfg, group); + newLabel.set('className', labelClassName); + } else { + // 若原先存在 label，则更新样式。与 getLabelStyle 不同在于这里需要融合当前 label 的样式 + // 用于融合 style 以外的属性：position, offset, ... + var currentLabelCfg = {}; + + if (item.getModel) { + currentLabelCfg = item.getModel().labelCfg; + } // 这里不能去掉 + + + var labelCfg = deepMix({}, defaultLabelCfg, currentLabelCfg, cfg.labelCfg); // 获取位置信息 + + var calculateStyle = this.getLabelStyleByPosition(cfg, labelCfg, group); // 取 nodeLabel，edgeLabel 的配置项 + + var cfgStyle = cfg.labelCfg ? cfg.labelCfg.style : undefined; + var cfgBgStyle = labelCfg.style && labelCfg.style.background; // 需要融合当前 label 的样式 label.attr()。不再需要全局/默认样式，因为已经应用在当前的 label 上 + + var labelStyle = __assign$r(__assign$r(__assign$r({}, label.attr()), calculateStyle), cfgStyle); + + var rotate = labelStyle.rotate; + delete labelStyle.rotate; // 计算 label 的旋转矩阵 + + if (rotate) { + // if G 4.x define the rotateAtStart, use it directly instead of using the following codes + var rotateMatrix = [1, 0, 0, 0, 1, 0, 0, 0, 1]; + rotateMatrix = transform$8(rotateMatrix, [['t', -labelStyle.x, -labelStyle.y], ['r', rotate], ['t', labelStyle.x, labelStyle.y]]); + label.resetMatrix(); + label.attr(__assign$r(__assign$r({}, labelStyle), { + matrix: rotateMatrix + })); + } else { + label.resetMatrix(); + label.attr(labelStyle); + } + + if (!labelBg) { + if (labelStyle.background) { + labelBg = this.drawLabelBg(cfg, group, label); + labelBg.set('classname', labelBgClassname); + label.toFront(); + } + } else if (labelStyle.background) { + var calculateBgStyle = this.getLabelBgStyleByPosition(label, cfg, labelCfg, group); + + var labelBgStyle = __assign$r(__assign$r({}, calculateBgStyle), cfgBgStyle); + + labelBg.resetMatrix(); + + if (rotate) { + var bgRotateMatrix = [1, 0, 0, 0, 1, 0, 0, 0, 1]; + bgRotateMatrix = transform$8(bgRotateMatrix, [['t', -labelBgStyle.x, -labelBgStyle.y], ['r', rotate], ['t', labelBgStyle.x, labelBgStyle.y]]); + labelBgStyle.matrix = bgRotateMatrix; + } + + labelBg.attr(labelBgStyle); + } else { + group.removeChild(labelBg); + } + } + } + }, + // update(cfg, item) // 默认不定义 + afterUpdate: function afterUpdate(cfg, item) {}, + + /** + * 设置节点的状态，主要是交互状态，业务状态请在 draw 方法中实现 + * 单图形的节点仅考虑 selected、active 状态，有其他状态需求的用户自己复写这个方法 + * @override + * @param {String} name 状态名称 + * @param {String | Boolean} value 状态值 + * @param {G6.Item} item 节点 + */ + setState: function setState(name, value, item) { + var _a, _b; + + var shape = item.get('keyShape'); + + if (!shape) { + return; + } + + var type = item.getType(); + var stateName = isBoolean(value) ? name : name + ":" + value; + var shapeStateStyle = this.getStateStyle(stateName, item); + var itemStateStyle = item.getStateStyle(stateName); // const originStyle = item.getOriginStyle(); + // 不允许设置一个不存在的状态 + + if (!itemStateStyle && !shapeStateStyle) { + return; + } // 要设置或取消的状态的样式 + // 当没有 state 状态时，默认使用 model.stateStyles 中的样式 + + + var styles = mix({}, itemStateStyle || shapeStateStyle); + var group = item.getContainer(); // 从图元素现有的样式中删除本次要取消的 states 中存在的属性值。使用对象检索更快 + + var keptAttrs = { + x: 1, + y: 1, + cx: 1, + cy: 1 + }; + + if (type === 'combo') { + keptAttrs.r = 1; + keptAttrs.width = 1; + keptAttrs.height = 1; + } + + if (value) { + var _loop_2 = function _loop_2(key) { + var _c; + + var style = styles[key]; + + if (isPlainObject$3(style) && !ARROWS.includes(key)) { + var subShape = group.find(function (element) { + return element.get('name') === key; + }); + + if (subShape) { + subShape.attr(style); + } + } else { + // 非纯对象，则认为是设置到 keyShape 上面的 + shape.attr((_c = {}, _c[key] = style, _c)); + } + }; // style 为要设置的状态的样式 + + + for (var key in styles) { + _loop_2(key); + } + } else { + // 所有生效的 state 的样式 + var enableStatesStyle = cloneBesidesImg$1(item.getCurrentStatesStyle()); + var model = item.getModel(); // 原始样式 + + var originStyle_1 = mix({}, model.style, cloneBesidesImg$1(item.getOriginStyle())); + var keyShapeName_1 = shape.get('name'); // cloning shape.attr(), keys.forEach to avoid cloning the img attr, which leads to maximum clone heap #2383 + // const keyShapeStyles = clone(shape.attr()) + + var shapeAttrs_1 = shape.attr(); + var keyShapeStyles_1 = {}; + Object.keys(shapeAttrs_1).forEach(function (key) { + if (key === 'img') return; + var attr = shapeAttrs_1[key]; + + if (attr && _typeof$2(attr) === 'object') { + keyShapeStyles_1[key] = clone$7(attr); + } else { + keyShapeStyles_1[key] = attr; + } + }); // 已有样式 - 要取消的状态的样式 + + var filtetDisableStatesStyle = {}; + + var _loop_3 = function _loop_3(p) { + var style = styles[p]; + + if (isPlainObject$3(style) && !ARROWS.includes(p)) { + var subShape_1 = group.find(function (element) { + return element.get('name') === p; + }); + + if (subShape_1) { + var subShapeStyles_1 = clone$7(subShape_1.attr()); + each$2(style, function (v, key) { + if (p === keyShapeName_1 && keyShapeStyles_1[key] && !keptAttrs[key]) { + delete keyShapeStyles_1[key]; + var value_1 = originStyle_1[p][key] || SHAPES_DEFAULT_ATTRS[type][key]; + shape.attr(key, value_1); + } else if (subShapeStyles_1[key] || subShapeStyles_1[key] === 0) { + delete subShapeStyles_1[key]; + var value_2 = originStyle_1[p][key] || SHAPES_DEFAULT_ATTRS[type][key]; + subShape_1.attr(key, value_2); + } + }); + filtetDisableStatesStyle[p] = subShapeStyles_1; + } + } else { + if (keyShapeStyles_1[p] && !keptAttrs[p]) { + delete keyShapeStyles_1[p]; + var value_3 = originStyle_1[p] || (originStyle_1[keyShapeName_1] ? originStyle_1[keyShapeName_1][p] : undefined) || SHAPES_DEFAULT_ATTRS[type][p]; + shape.attr(p, value_3); + } + } + }; // styles 为要取消的状态的样式 + + + for (var p in styles) { + _loop_3(p); + } // 从图元素现有的样式中删除本次要取消的 states 中存在的属性值后， + // 如果 keyShape 有 name 属性，则 filtetDisableStatesStyle 的格式为 { keyShapeName: {} } + // 否则为普通对象 + + + if (!keyShapeName_1) { + mix(filtetDisableStatesStyle, keyShapeStyles_1); + } else { + filtetDisableStatesStyle[keyShapeName_1] = keyShapeStyles_1; + } + + for (var key in enableStatesStyle) { + if (keptAttrs[key]) continue; + var enableStyle = enableStatesStyle[key]; + + if (!isPlainObject$3(enableStyle) || ARROWS.includes(key)) { + // 把样式属性merge到keyShape中 + if (!keyShapeName_1) { + mix(originStyle_1, (_a = {}, _a[key] = enableStyle, _a)); + } else { + mix(originStyle_1[keyShapeName_1], (_b = {}, _b[key] = enableStyle, _b)); + delete originStyle_1[key]; + } + + delete enableStatesStyle[key]; + } + } + + var originstyles = {}; + deepMix(originstyles, originStyle_1, filtetDisableStatesStyle, enableStatesStyle); + var keyShapeSetted = false; + + var _loop_4 = function _loop_4(originKey) { + var _d, _e; + + var style = originstyles[originKey]; + + if (isPlainObject$3(style) && !ARROWS.includes(originKey)) { + var subShape = group.find(function (element) { + return element.get('name') === originKey; + }); + + if (subShape) { + if (originKey === keyShapeName_1) { + if (type === 'combo') { + delete style.r; + delete style.width; + delete style.height; + } + + keyShapeSetted = true; + } + + subShape.attr(style); + } + } else if (!keyShapeSetted) { + var value_4 = style || SHAPES_DEFAULT_ATTRS[type][originKey]; // 当更新 combo 状态时，当不存在 keyShapeName 时候，则认为是设置到 keyShape 上面的 + + if (type === 'combo') { + if (!keyShapeName_1) { + shape.attr((_d = {}, _d[originKey] = value_4, _d)); + } + } else { + shape.attr((_e = {}, _e[originKey] = value_4, _e)); + } + } + }; + + for (var originKey in originstyles) { + _loop_4(originKey); + } + } + }, + + /** + * 获取不同状态下的样式 + * + * @param {string} name 状态名称 + * @param {Item} item Node或Edge的实例 + * @return {object} 样式 + */ + getStateStyle: function getStateStyle(name, item) { + var model = item.getModel(); + var type = item.getType(); + + var _a = this.getOptions(model), + stateStyles = _a.stateStyles, + _b = _a.style, + style = _b === void 0 ? {} : _b; + + var modelStateStyle = model.stateStyles ? model.stateStyles[name] : stateStyles && stateStyles[name]; + + if (type === 'combo') { + return clone$7(modelStateStyle); + } + + return mix({}, style, modelStateStyle); + }, + + /** + * 获取控制点 + * @param {Object} cfg 节点、边的配置项 + * @return {Array|null} 控制点的数组,如果为 null，则没有控制点 + */ + getControlPoints: function getControlPoints(cfg) { + return cfg.controlPoints; + }, + + /** + * 获取控制点 + * @param {Object} cfg 节点、边的配置项 + * @return {Array|null} 锚点的数组,如果为 null，则没有锚点 + */ + getAnchorPoints: function getAnchorPoints(cfg) { + var anchorPoints = this.getOptions(cfg).anchorPoints; + return anchorPoints; + } +}; + +var singleNode = { + itemType: 'node', + // 单个图形的类型 + shapeType: 'single-node', + + /** + * 文本相对图形的位置，默认以中心点 + * 位置包括： top, bottom, left, right, center + * @type {String} + */ + labelPosition: 'center', + + /** + * 文本相对偏移，当 labelPosition 不为 center 时有效 + * @type {Number} + */ + offset: Global$1.nodeLabel.offset, + + /** + * 获取节点宽高 + * @internal 返回节点的大小，以 [width, height] 的方式维护 + * @param {Object} cfg 节点的配置项 + * @return {Array} 宽高 + */ + getSize: function getSize(cfg) { + var size = cfg.size || this.getOptions({}).size || Global$1.defaultNode.size; // size 是数组，但长度为1，则补长度为2 + + if (isArray$n(size) && size.length === 1) { + size = [size[0], size[0]]; + } // size 为数字，则转换为数组 + + + if (!isArray$n(size)) { + size = [size, size]; + } + + return size; + }, + // 私有方法，不希望扩展的节点复写这个方法 + getLabelStyleByPosition: function getLabelStyleByPosition(cfg, labelCfg) { + var labelPosition = labelCfg.position || this.labelPosition; // 默认的位置（最可能的情形），所以放在最上面 + + if (labelPosition === 'center') { + return { + x: 0, + y: 0, + text: cfg.label + }; + } + + var offset = labelCfg.offset; + + if (isNil(offset)) { + // 考虑 offset = 0 的场景，不用用 labelCfg.offset || Global.nodeLabel.offset + offset = this.offset; // 不居中时的偏移量 + } + + var size = this.getSize(cfg); + var width = size[0]; + var height = size[1]; + var style; + + switch (labelPosition) { + case 'top': + style = { + x: 0, + y: 0 - height / 2 - offset, + textBaseline: 'bottom' // 文本在图形的上面 + + }; + break; + + case 'bottom': + style = { + x: 0, + y: height / 2 + offset, + textBaseline: 'top' + }; + break; + + case 'left': + style = { + x: 0 - width / 2 - offset, + y: 0, + textAlign: 'right' + }; + break; + + default: + style = { + x: width / 2 + offset, + y: 0, + textAlign: 'left' + }; + break; + } + + style.text = cfg.label; + return style; + }, + getLabelBgStyleByPosition: function getLabelBgStyleByPosition(label, cfg, labelCfg, group) { + if (!label) { + return {}; + } + + var bbox = label.getBBox(); + var backgroundStyle = labelCfg.style && labelCfg.style.background; + + if (!backgroundStyle) { + return {}; + } + + var padding = formatPadding(backgroundStyle.padding); + var backgroundWidth = bbox.width + padding[1] + padding[3]; + var backgroundHeight = bbox.height + padding[0] + padding[2]; + labelCfg.offset; + + var style; + style = { + x: bbox.minX - padding[3], + y: bbox.minY - padding[0] + }; + style = __assign$r(__assign$r(__assign$r({}, style), backgroundStyle), { + width: backgroundWidth, + height: backgroundHeight + }); + return style; + }, + drawShape: function drawShape(cfg, group) { + var shapeType = this.shapeType; // || this.type，都已经加了 shapeType + + var style = this.getShapeStyle(cfg); + var shape = group.addShape(shapeType, { + attrs: style, + draggable: true, + name: 'node-shape' + }); + return shape; + }, + + /** + * 更新linkPoints + * @param {Object} cfg 节点数据配置项 + * @param {Group} group Item所在的group + */ + updateLinkPoints: function updateLinkPoints(cfg, group) { + var defaultLinkPoints = this.getOptions(cfg).linkPoints; + var markLeft = group.find(function (element) { + return element.get('className') === 'link-point-left'; + }); + var markRight = group.find(function (element) { + return element.get('className') === 'link-point-right'; + }); + var markTop = group.find(function (element) { + return element.get('className') === 'link-point-top'; + }); + var markBottom = group.find(function (element) { + return element.get('className') === 'link-point-bottom'; + }); + var currentLinkPoints; + + if (markLeft) { + currentLinkPoints = markLeft.attr(); + } + + if (markRight && !currentLinkPoints) { + currentLinkPoints = markRight.attr(); + } + + if (markTop && !currentLinkPoints) { + currentLinkPoints = markTop.attr(); + } + + if (markBottom && !currentLinkPoints) { + currentLinkPoints = markBottom.attr(); + } + + if (!currentLinkPoints) currentLinkPoints = defaultLinkPoints; + var linkPoints = mix({}, currentLinkPoints, cfg.linkPoints); + var markFill = linkPoints.fill, + markStroke = linkPoints.stroke, + borderWidth = linkPoints.lineWidth; + var markSize = linkPoints.size / 2; + if (!markSize) markSize = linkPoints.r; + + var _a = cfg.linkPoints ? cfg.linkPoints : { + left: undefined, + right: undefined, + top: undefined, + bottom: undefined + }, + left = _a.left, + right = _a.right, + top = _a.top, + bottom = _a.bottom; + + var size = this.getSize(cfg); + var width = size[0]; + var height = size[1]; + var styles = { + r: markSize, + fill: markFill, + stroke: markStroke, + lineWidth: borderWidth + }; + + if (markLeft) { + if (!left && left !== undefined) { + markLeft.remove(); + } else { + markLeft.attr(__assign$r(__assign$r({}, styles), { + x: -width / 2, + y: 0 + })); + } + } else if (left) { + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, styles), { + x: -width / 2, + y: 0 + }), + className: 'link-point-left', + name: 'link-point-left', + isAnchorPoint: true + }); + } + + if (markRight) { + if (!right && right !== undefined) { + markRight.remove(); + } + + markRight.attr(__assign$r(__assign$r({}, styles), { + x: width / 2, + y: 0 + })); + } else if (right) { + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, styles), { + x: width / 2, + y: 0 + }), + className: 'link-point-right', + name: 'link-point-right', + isAnchorPoint: true + }); + } + + if (markTop) { + if (!top && top !== undefined) { + markTop.remove(); + } + + markTop.attr(__assign$r(__assign$r({}, styles), { + x: 0, + y: -height / 2 + })); + } else if (top) { + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, styles), { + x: 0, + y: -height / 2 + }), + className: 'link-point-top', + name: 'link-point-top', + isAnchorPoint: true + }); + } + + if (markBottom) { + if (!bottom && bottom !== undefined) { + markBottom.remove(); + } else { + markBottom.attr(__assign$r(__assign$r({}, styles), { + x: 0, + y: height / 2 + })); + } + } else if (bottom) { + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, styles), { + x: 0, + y: height / 2 + }), + className: 'link-point-bottom', + name: 'link-point-bottom', + isAnchorPoint: true + }); + } + }, + updateShape: function updateShape(cfg, item, keyShapeStyle, hasIcon) { + var keyShape = item.get('keyShape'); + keyShape.attr(__assign$r({}, keyShapeStyle)); + this.updateLabel(cfg, item); // special for some types of nodes + + if (hasIcon) { + this.updateIcon(cfg, item); + } + }, + updateIcon: function updateIcon(cfg, item) { + var _this = this; + + var group = item.getContainer(); + var icon = this.getOptions(cfg).icon; + var show = (cfg.icon ? cfg.icon : { + show: undefined + }).show; + var iconShape = group.find(function (element) { + return element.get('className') === _this.type + "-icon"; + }); + + if (iconShape) { + // 若原先存在 icon + if (show || show === undefined) { + // 若传入 show: true, 或没有设置，则更新原有的 icon 样式 + var iconConfig = mix({}, iconShape.attr(), icon); + var w = iconConfig.width, + h = iconConfig.height; + iconShape.attr(__assign$r(__assign$r({}, iconConfig), { + x: -w / 2, + y: -h / 2 + })); + } else { + // 若传入了 show: false 则删除原先的 icon + iconShape.remove(); + } + } else if (show) { + // 如果原先不存在 icon，但传入了 show: true，则新增 icon + var w = icon.width, + h = icon.height; + group.addShape('image', { + attrs: __assign$r(__assign$r({}, icon), { + x: -w / 2, + y: -h / 2 + }), + className: this.type + "-icon", + name: this.type + "-icon" + }); // to ensure the label is on the top of all the shapes + + var labelShape = group.find(function (element) { + return element.get('className') === "node-label"; + }); + + if (labelShape) { + labelShape.toFront(); + } + } + } +}; + +var singleNodeDef = __assign$r(__assign$r({}, shapeBase), singleNode); + +Shape.registerNode('single-node', singleNodeDef); + +/** + * @fileOverview 自定义边 + * @description 自定义边中有大量逻辑同自定义节点重复，虽然可以提取成为 mixin ，但是考虑到代码的可读性，还是单独实现。 + */ +var CLS_SHAPE = 'edge-shape'; // start,end 倒置，center 不变 + +function revertAlign(labelPosition) { + var textAlign = labelPosition; + + if (labelPosition === 'start') { + textAlign = 'end'; + } else if (labelPosition === 'end') { + textAlign = 'start'; + } + + return textAlign; +} + +var singleEdge = { + itemType: 'edge', + + /** + * 文本的位置 + * @type {String} + */ + labelPosition: 'center', + + /** + * 文本的 x 偏移 + * @type {Number} + */ + refX: 0, + + /** + * 文本的 y 偏移 + * @type {Number} + */ + refY: 0, + + /** + * 文本是否跟着线自动旋转，默认 false + * @type {Boolean} + */ + labelAutoRotate: false, + // 自定义边时的配置 + options: { + size: Global$1.defaultEdge.size, + style: { + x: 0, + y: 0, + stroke: Global$1.defaultEdge.style.stroke, + lineAppendWidth: Global$1.defaultEdge.style.lineAppendWidth + }, + labelCfg: { + style: { + fill: Global$1.edgeLabel.style.fill, + fontSize: Global$1.edgeLabel.style.fontSize + } + }, + stateStyles: __assign$r({}, Global$1.edgeStateStyles) + }, + + /** + * 获取边的 path + * @internal 供扩展的边覆盖 + * @param {Array} points 构成边的点的集合 + * @return {Array} 构成 path 的数组 + */ + getPath: function getPath(points) { + var path = []; + each$2(points, function (point, index) { + if (index === 0) { + path.push(['M', point.x, point.y]); + } else { + path.push(['L', point.x, point.y]); + } + }); + return path; + }, + getShapeStyle: function getShapeStyle(cfg) { + var defaultStyle = this.options.style; + var strokeStyle = { + stroke: cfg.color + }; // 如果设置了color，则覆盖默认的stroke属性 + + var style = mix({}, defaultStyle, strokeStyle, cfg.style); + var size = cfg.size || Global$1.defaultEdge.size; + cfg = this.getPathPoints(cfg); + var startPoint = cfg.startPoint, + endPoint = cfg.endPoint; + var controlPoints = this.getControlPoints(cfg); + var points = [startPoint]; // 添加起始点 + // 添加控制点 + + if (controlPoints) { + points = points.concat(controlPoints); + } // 添加结束点 + + + points.push(endPoint); + var path = this.getPath(points); + var styles = mix({}, Global$1.defaultEdge.style, { + stroke: Global$1.defaultEdge.color, + lineWidth: size, + path: path + }, style); + return styles; + }, + updateShapeStyle: function updateShapeStyle(cfg, item) { + var group = item.getContainer(); + var strokeStyle = { + stroke: cfg.color + }; + var shape = group.find(function (element) { + return element.get('className') === 'edge-shape'; + }) || item.getKeyShape(); + var size = cfg.size; + cfg = this.getPathPoints(cfg); + var startPoint = cfg.startPoint, + endPoint = cfg.endPoint; + var controlPoints = this.getControlPoints(cfg); // || cfg.controlPoints; + + var points = [startPoint]; // 添加起始点 + // 添加控制点 + + if (controlPoints) { + points = points.concat(controlPoints); + } // 添加结束点 + + + points.push(endPoint); + var currentAttr = shape.attr(); + var previousStyle = mix({}, strokeStyle, currentAttr, cfg.style); + var source = cfg.sourceNode; + var target = cfg.targetNode; + var routeCfg = { + radius: previousStyle.radius + }; + + if (!controlPoints) { + routeCfg = { + source: source, + target: target, + offset: previousStyle.offset, + radius: previousStyle.radius + }; + } + + if (currentAttr.endArrow && previousStyle.endArrow === false) { + cfg.style.endArrow = { + path: '' + }; + } + + if (currentAttr.startArrow && previousStyle.startArrow === false) ; + + var path = this.getPath(points, routeCfg); + var style = mix(strokeStyle, shape.attr(), { + lineWidth: size, + path: path + }, cfg.style); + + if (shape) { + shape.attr(style); + } + }, + getLabelStyleByPosition: function getLabelStyleByPosition(cfg, labelCfg, group) { + var labelPosition = labelCfg.position || this.labelPosition; // 文本的位置用户可以传入 + + var style = {}; + var pathShape = group && group.find(function (element) { + return element.get('className') === CLS_SHAPE; + }); // 不对 pathShape 进行判空，如果线不存在，说明有问题了 + + var pointPercent; + + if (labelPosition === 'start') { + pointPercent = 0; + } else if (labelPosition === 'end') { + pointPercent = 1; + } else { + pointPercent = 0.5; + } // 偏移量 + + + var offsetX = labelCfg.refX || this.refX; + var offsetY = labelCfg.refY || this.refY; // 如果两个节点重叠，线就变成了一个点，这时候label的位置，就是这个点 + 绝对偏移 + + if (cfg.startPoint.x === cfg.endPoint.x && cfg.startPoint.y === cfg.endPoint.y) { + style.x = cfg.startPoint.x + offsetX; + style.y = cfg.startPoint.y + offsetY; + style.text = cfg.label; + return style; + } + + var autoRotate; + if (isNil(labelCfg.autoRotate)) autoRotate = this.labelAutoRotate;else autoRotate = labelCfg.autoRotate; + var offsetStyle = getLabelPosition(pathShape, pointPercent, offsetX, offsetY, autoRotate); + style.x = offsetStyle.x; + style.y = offsetStyle.y; + style.rotate = offsetStyle.rotate; + style.textAlign = this._getTextAlign(labelPosition, offsetStyle.angle); + style.text = cfg.label; + return style; + }, + getLabelBgStyleByPosition: function getLabelBgStyleByPosition(label, cfg, labelCfg, group) { + if (!label) { + return {}; + } + + var bbox = label.getBBox(); + var backgroundStyle = labelCfg.style && labelCfg.style.background; + + if (!backgroundStyle) { + return {}; + } + + var padding = backgroundStyle.padding; + var backgroundWidth = bbox.width + padding[1] + padding[3]; + var backgroundHeight = bbox.height + padding[0] + padding[2]; + var labelPosition = labelCfg.position || this.labelPosition; + + var style = __assign$r(__assign$r({}, backgroundStyle), { + width: backgroundWidth, + height: backgroundHeight, + x: bbox.minX - padding[2], + y: bbox.minY - padding[0], + rotate: 0 + }); + + var autoRotate; + if (isNil(labelCfg.autoRotate)) autoRotate = this.labelAutoRotate;else autoRotate = labelCfg.autoRotate; + var pathShape = group && group.find(function (element) { + return element.get('className') === CLS_SHAPE; + }); // 不对 pathShape 进行判空，如果线不存在，说明有问题了 + + var pointPercent; + + if (labelPosition === 'start') { + pointPercent = 0; + } else if (labelPosition === 'end') { + pointPercent = 1; + } else { + pointPercent = 0.5; + } // 偏移量 + + + var offsetX = labelCfg.refX || this.refX; + var offsetY = labelCfg.refY || this.refY; // // 如果两个节点重叠，线就变成了一个点，这时候label的位置，就是这个点 + 绝对偏移 + + if (cfg.startPoint.x === cfg.endPoint.x && cfg.startPoint.y === cfg.endPoint.y) { + style.x = cfg.startPoint.x + offsetX - backgroundWidth / 2; + style.y = cfg.startPoint.y + offsetY - backgroundHeight / 2; + return style; + } + + var offsetStyle = getLabelPosition(pathShape, pointPercent, offsetX - backgroundWidth / 2, offsetY + backgroundHeight / 2, autoRotate); + var rad = offsetStyle.angle; + + if (rad > 1 / 2 * Math.PI && rad < 3 * 1 / 2 * Math.PI) { + offsetStyle = getLabelPosition(pathShape, pointPercent, offsetX + backgroundWidth / 2, offsetY + backgroundHeight / 2, autoRotate); + } + + if (autoRotate) { + style.x = offsetStyle.x; + style.y = offsetStyle.y; + } + + style.rotate = offsetStyle.rotate; + return style; + }, + // 获取文本对齐方式 + _getTextAlign: function _getTextAlign(labelPosition, angle) { + var textAlign = 'center'; + + if (!angle) { + return labelPosition; + } + + angle = angle % (Math.PI * 2); // 取模 + + if (labelPosition !== 'center') { + if (angle >= 0 && angle <= Math.PI / 2 || angle >= 3 / 2 * Math.PI && angle < 2 * Math.PI) { + textAlign = labelPosition; + } else { + textAlign = revertAlign(labelPosition); + } + } + + return textAlign; + }, + + /** + * @internal 获取边的控制点 + * @param {Object} cfg 边的配置项 + * @return {Array} 控制点的数组 + */ + getControlPoints: function getControlPoints(cfg) { + return cfg.controlPoints; + }, + + /** + * @internal 处理需要重计算点和边的情况 + * @param {Object} cfg 边的配置项 + * @return {Object} 边的配置项 + */ + getPathPoints: function getPathPoints(cfg) { + return cfg; + }, + + /** + * 绘制边 + * @override + * @param {Object} cfg 边的配置项 + * @param {G.Group} group 边的容器 + * @return {IShape} 图形 + */ + drawShape: function drawShape(cfg, group) { + var shapeStyle = this.getShapeStyle(cfg); + var shape = group.addShape('path', { + className: CLS_SHAPE, + name: CLS_SHAPE, + attrs: shapeStyle + }); + return shape; + }, + drawLabel: function drawLabel(cfg, group) { + var defaultLabelCfg = this.options.labelCfg; + var defaultFontFamily; + if (typeof window !== 'undefined') defaultFontFamily = window.getComputedStyle(document.body, null).getPropertyValue('font-family') || 'Arial, sans-serif';else defaultFontFamily = 'Arial, sans-serif'; + var labelCfg = deepMix({ + fontFamily: defaultFontFamily + }, defaultLabelCfg, cfg.labelCfg); + var labelStyle = this.getLabelStyle(cfg, labelCfg, group); + var rotate = labelStyle.rotate; + delete labelStyle.rotate; + var label = group.addShape('text', { + attrs: labelStyle, + name: 'text-shape' + }); + + if (rotate) { + label.rotateAtStart(rotate); + } + + if (labelStyle.background) { + var rect = this.drawLabelBg(cfg, group, label); + var labelBgClassname = this.itemType + CLS_LABEL_BG_SUFFIX; + rect.set('classname', labelBgClassname); + label.toFront(); + } + + return label; + }, + drawLabelBg: function drawLabelBg(cfg, group, label) { + var defaultLabelCfg = this.options.labelCfg; + var labelCfg = deepMix({}, defaultLabelCfg, cfg.labelCfg); + var labelStyle = this.getLabelStyle(cfg, labelCfg, group); + var rotate = labelStyle.rotate; + var style = this.getLabelBgStyleByPosition(label, cfg, labelCfg, group); + delete style.rotate; + var rect = group.addShape('rect', { + name: 'text-bg-shape', + attrs: style + }); + if (rotate) rect.rotateAtStart(rotate); + return rect; + } +}; + +var singleEdgeDef = __assign$r(__assign$r({}, shapeBase), singleEdge); + +Shape.registerEdge('single-edge', singleEdgeDef); // 直线, 不支持控制点 + +Shape.registerEdge('line', { + // 控制点不生效 + getControlPoints: function getControlPoints() { + return undefined; + } +}, 'single-edge'); // 直线 + +Shape.registerEdge('spline', { + getPath: function getPath(points) { + var path = getSpline(points); + return path; + } +}, 'single-edge'); +Shape.registerEdge('arc', { + curveOffset: 20, + clockwise: 1, + getControlPoints: function getControlPoints(cfg) { + var startPoint = cfg.startPoint, + endPoint = cfg.endPoint; + var midPoint = { + x: (startPoint.x + endPoint.x) / 2, + y: (startPoint.y + endPoint.y) / 2 + }; + var center; + var arcPoint; // 根据给定点计算圆弧 + + if (cfg.controlPoints !== undefined) { + arcPoint = cfg.controlPoints[0]; + center = getCircleCenterByPoints(startPoint, arcPoint, endPoint); // 根据控制点和直线关系决定 clockwise值 + + if (startPoint.x <= endPoint.x && startPoint.y > endPoint.y) { + this.clockwise = center.x > arcPoint.x ? 0 : 1; + } else if (startPoint.x <= endPoint.x && startPoint.y < endPoint.y) { + this.clockwise = center.x > arcPoint.x ? 1 : 0; + } else if (startPoint.x > endPoint.x && startPoint.y <= endPoint.y) { + this.clockwise = center.y < arcPoint.y ? 0 : 1; + } else { + this.clockwise = center.y < arcPoint.y ? 1 : 0; + } // 若给定点和两端点共线，无法生成圆弧，绘制直线 + + + if ((arcPoint.x - startPoint.x) / (arcPoint.y - startPoint.y) === (endPoint.x - startPoint.x) / (endPoint.y - startPoint.y)) { + return []; + } + } else { + // 根据直线连线中点的的偏移计算圆弧 + // 若用户给定偏移量则根据其计算，否则按照默认偏移值计算 + if (cfg.curveOffset === undefined) { + cfg.curveOffset = this.curveOffset; + } + + if (isArray$n(cfg.curveOffset)) { + cfg.curveOffset = cfg.curveOffset[0]; + } + + if (cfg.curveOffset < 0) { + this.clockwise = 0; + } else { + this.clockwise = 1; + } + + var vec = { + x: endPoint.x - startPoint.x, + y: endPoint.y - startPoint.y + }; + var edgeAngle = Math.atan2(vec.y, vec.x); + arcPoint = { + x: cfg.curveOffset * Math.cos(-Math.PI / 2 + edgeAngle) + midPoint.x, + y: cfg.curveOffset * Math.sin(-Math.PI / 2 + edgeAngle) + midPoint.y + }; + center = getCircleCenterByPoints(startPoint, arcPoint, endPoint); + } + + var radius = distance$3(startPoint, center); + var controlPoints = [{ + x: radius, + y: radius + }]; + return controlPoints; + }, + getPath: function getPath(points) { + var path = []; + path.push(['M', points[0].x, points[0].y]); // 控制点与端点共线 + + if (points.length === 2) { + path.push(['L', points[1].x, points[1].y]); + } else { + path.push(['A', points[1].x, points[1].y, 0, 0, this.clockwise, points[2].x, points[2].y]); + } + + return path; + } +}, 'single-edge'); +Shape.registerEdge('quadratic', { + curvePosition: 0.5, + curveOffset: -20, + getControlPoints: function getControlPoints(cfg) { + var controlPoints = cfg.controlPoints; // 指定controlPoints + + if (!controlPoints || !controlPoints.length) { + var startPoint = cfg.startPoint, + endPoint = cfg.endPoint; + if (cfg.curveOffset === undefined) cfg.curveOffset = this.curveOffset; + if (cfg.curvePosition === undefined) cfg.curvePosition = this.curvePosition; + if (isArray$n(this.curveOffset)) cfg.curveOffset = cfg.curveOffset[0]; + if (isArray$n(this.curvePosition)) cfg.curvePosition = cfg.curveOffset[0]; + var innerPoint = getControlPoint(startPoint, endPoint, cfg.curvePosition, cfg.curveOffset); + controlPoints = [innerPoint]; + } + + return controlPoints; + }, + getPath: function getPath(points) { + var path = []; + path.push(['M', points[0].x, points[0].y]); + path.push(['Q', points[1].x, points[1].y, points[2].x, points[2].y]); + return path; + } +}, 'single-edge'); +Shape.registerEdge('cubic', { + curvePosition: [1 / 2, 1 / 2], + curveOffset: [-20, 20], + getControlPoints: function getControlPoints(cfg) { + var controlPoints = cfg.controlPoints; // 指定controlPoints + + if (cfg.curveOffset === undefined) cfg.curveOffset = this.curveOffset; + if (cfg.curvePosition === undefined) cfg.curvePosition = this.curvePosition; + if (isNumber$4(cfg.curveOffset)) cfg.curveOffset = [cfg.curveOffset, -cfg.curveOffset]; + if (isNumber$4(cfg.curvePosition)) cfg.curvePosition = [cfg.curvePosition, 1 - cfg.curvePosition]; + + if (!controlPoints || !controlPoints.length || controlPoints.length < 2) { + var startPoint = cfg.startPoint, + endPoint = cfg.endPoint; + var innerPoint1 = getControlPoint(startPoint, endPoint, cfg.curvePosition[0], cfg.curveOffset[0]); + var innerPoint2 = getControlPoint(startPoint, endPoint, cfg.curvePosition[1], cfg.curveOffset[1]); + controlPoints = [innerPoint1, innerPoint2]; + } + + return controlPoints; + }, + getPath: function getPath(points) { + var path = []; + path.push(['M', points[0].x, points[0].y]); + path.push(['C', points[1].x, points[1].y, points[2].x, points[2].y, points[3].x, points[3].y]); + return path; + } +}, 'single-edge'); // 垂直方向的三阶贝塞尔曲线，不再考虑用户外部传入的控制点 + +Shape.registerEdge('cubic-vertical', { + curvePosition: [1 / 2, 1 / 2], + minCurveOffset: [0, 0], + curveOffset: undefined, + getControlPoints: function getControlPoints(cfg) { + var startPoint = cfg.startPoint, + endPoint = cfg.endPoint; + if (cfg.curvePosition === undefined) cfg.curvePosition = this.curvePosition; + if (cfg.curveOffset === undefined) cfg.curveOffset = this.curveOffset; + if (cfg.minCurveOffset === undefined) cfg.minCurveOffset = this.minCurveOffset; + if (isNumber$4(cfg.curveOffset)) cfg.curveOffset = [cfg.curveOffset, -cfg.curveOffset]; + if (isNumber$4(cfg.minCurveOffset)) cfg.minCurveOffset = [cfg.minCurveOffset, -cfg.minCurveOffset]; + if (isNumber$4(cfg.curvePosition)) cfg.curvePosition = [cfg.curvePosition, 1 - cfg.curvePosition]; + var yDist = endPoint.y - startPoint.y; + var curveOffset = [0, 0]; + + if (cfg.curveOffset) { + curveOffset = cfg.curveOffset; + } else if (Math.abs(yDist) < Math.abs(cfg.minCurveOffset[0])) { + curveOffset = cfg.minCurveOffset; + } + + var innerPoint1 = { + x: startPoint.x, + y: startPoint.y + yDist * this.curvePosition[0] + curveOffset[0] + }; + var innerPoint2 = { + x: endPoint.x, + y: endPoint.y - yDist * this.curvePosition[1] + curveOffset[1] + }; + return [innerPoint1, innerPoint2]; + } +}, 'cubic'); // 水平方向的三阶贝塞尔曲线，不再考虑用户外部传入的控制点 + +Shape.registerEdge('cubic-horizontal', { + curvePosition: [1 / 2, 1 / 2], + minCurveOffset: [0, 0], + curveOffset: undefined, + getControlPoints: function getControlPoints(cfg) { + var startPoint = cfg.startPoint, + endPoint = cfg.endPoint; + if (cfg.curvePosition === undefined) cfg.curvePosition = this.curvePosition; + if (cfg.curveOffset === undefined) cfg.curveOffset = this.curveOffset; + if (cfg.minCurveOffset === undefined) cfg.minCurveOffset = this.minCurveOffset; + if (isNumber$4(cfg.curveOffset)) cfg.curveOffset = [cfg.curveOffset, -cfg.curveOffset]; + if (isNumber$4(cfg.minCurveOffset)) cfg.minCurveOffset = [cfg.minCurveOffset, -cfg.minCurveOffset]; + if (isNumber$4(cfg.curvePosition)) cfg.curvePosition = [cfg.curvePosition, 1 - cfg.curvePosition]; + var xDist = endPoint.x - startPoint.x; + var curveOffset = [0, 0]; + + if (cfg.curveOffset) { + curveOffset = cfg.curveOffset; + } else if (Math.abs(xDist) < Math.abs(cfg.minCurveOffset[0])) { + curveOffset = cfg.minCurveOffset; + } + + var innerPoint1 = { + x: startPoint.x + xDist * this.curvePosition[0] + curveOffset[0], + y: startPoint.y + }; + var innerPoint2 = { + x: endPoint.x - xDist * this.curvePosition[1] + curveOffset[1], + y: endPoint.y + }; + var controlPoints = [innerPoint1, innerPoint2]; + return controlPoints; + } +}, 'cubic'); +Shape.registerEdge('loop', { + getPathPoints: function getPathPoints(cfg) { + return getLoopCfgs(cfg); + }, + getControlPoints: function getControlPoints(cfg) { + return cfg.controlPoints; + }, + afterDraw: function afterDraw(cfg) { + cfg.controlPoints = undefined; + }, + afterUpdate: function afterUpdate(cfg) { + cfg.controlPoints = undefined; + } +}, 'cubic'); + +var singleCombo = { + itemType: 'combo', + // 单个图形的类型 + shapeType: 'single-combo', + + /** + * Combo 标题文本相对图形的位置，默认为 top + * 位置包括： top, bottom, left, right, center + * @type {String} + */ + labelPosition: 'top', + + /** + * 标题文本相对偏移，当 labelPosition 不为 center 时有效 + * @type {Number} + */ + refX: Global$1.comboLabel.refX, + refY: Global$1.comboLabel.refY, + options: { + style: { + stroke: Global$1.defaultCombo.style.stroke, + fill: Global$1.defaultCombo.style.fill, + lineWidth: Global$1.defaultCombo.style.lineWidth + }, + labelCfg: { + style: { + fill: Global$1.comboLabel.style.fill, + fontSize: Global$1.comboLabel.style.fontSize + } + }, + stateStyles: __assign$r({}, Global$1.comboStateStyles) + }, + + /** + * 获取 Combo 宽高 + * @internal 返回 Combo 的大小，以 [width, height] 的方式维护 + * @param {Object} cfg Combo 的配置项 + * @return {Array} 宽高 + */ + getSize: function getSize(cfg) { + var size = clone$7(cfg.size || this.options.size || Global$1.defaultCombo.size); // size 是数组，若长度为 1，则补长度为 2 + + if (isArray$n(size) && size.length === 1) { + size = [size[0], size[0]]; + } // size 为数字，则转换为数组 + + + if (!isArray$n(size)) { + size = [size, size]; + } + + return size; + }, + // 私有方法，不希望扩展的 Combo 复写这个方法 + getLabelStyleByPosition: function getLabelStyleByPosition(cfg, labelCfg) { + var labelPosition = labelCfg.position || this.labelPosition; + var cfgStyle = cfg.style; + var padding = cfg.padding || this.options.padding; + if (isArray$n(padding)) padding = padding[0]; + var refX = labelCfg.refX, + refY = labelCfg.refY; // 考虑 refX 和 refY = 0 的场景，不用用 labelCfg.refX || Global.nodeLabel.refX + + if (isNil(refX)) { + refX = this.refX; // 不居中时的偏移量 + } + + if (isNil(refY)) { + refY = this.refY; // 不居中时的偏移量 + } + + var size = this.getSize(cfg); + var r = Math.max(cfgStyle.r, size[0] / 2) || size[0] / 2; + var dis = r + padding; + var style; + + switch (labelPosition) { + case 'top': + style = { + x: 0, + y: -dis - refY, + textBaseline: 'bottom', + textAlign: 'center' + }; + break; + + case 'bottom': + style = { + x: 0, + y: dis + refY, + textBaseline: 'bottom', + textAlign: 'center' + }; + break; + + case 'left': + style = { + x: -dis + refX, + y: 0, + textAlign: 'left' + }; + break; + + case 'center': + style = { + x: 0, + y: 0, + text: cfg.label, + textAlign: 'center' + }; + break; + + default: + style = { + x: dis + refX, + y: 0, + textAlign: 'right' + }; + break; + } + + style.text = cfg.label; + return style; + }, + drawShape: function drawShape(cfg, group) { + var shapeType = this.shapeType; // || this.type，都已经加了 shapeType + + var style = this.getShapeStyle(cfg); + var shape = group.addShape(shapeType, { + attrs: style, + draggable: true, + name: 'combo-shape' + }); + return shape; + }, + updateShape: function updateShape(cfg, item, keyShapeStyle) { + var keyShape = item.get('keyShape'); + var animate = cfg.animate === undefined ? this.options.animate : cfg.animate; + + if (animate && keyShape.animate) { + keyShape.animate(keyShapeStyle, { + duration: 200, + easing: 'easeLinear' + }); + } else { + keyShape.attr(__assign$r({}, keyShapeStyle)); + } + + this.updateLabel(cfg, item); // special for some types of nodes + } +}; + +var singleComboDef = __assign$r(__assign$r({}, shapeBase), singleCombo); + +Shape.registerCombo('single-combo', singleComboDef); + +Shape.registerCombo('circle', { + // 自定义节点时的配置 + options: { + size: [Global$1.defaultCombo.size[0], Global$1.defaultCombo.size[0]], + padding: Global$1.defaultCombo.padding[0], + animate: true, + style: { + stroke: Global$1.defaultCombo.style.stroke, + fill: Global$1.defaultCombo.style.fill, + lineWidth: Global$1.defaultCombo.style.lineWidth + }, + labelCfg: { + style: { + fill: Global$1.comboLabel.style.fill, + fontSize: Global$1.comboLabel.style.fontSize + }, + refX: 0, + refY: 0 + }, + stateStyles: __assign$r({}, Global$1.comboStateStyles) + }, + shapeType: 'circle', + // 文本位置 + labelPosition: 'top', + drawShape: function drawShape(cfg, group) { + var style = this.getShapeStyle(cfg); + delete style.height; + delete style.width; + var keyShape = group.addShape('circle', { + attrs: style, + className: 'circle-combo', + name: 'circle-combo', + draggable: true + }); + return keyShape; + }, + + /** + * 获取 Combo 的样式，供基于该 Combo 自定义时使用 + * @param {Object} cfg Combo 数据模型 + * @return {Object} Combo 的样式 + */ + getShapeStyle: function getShapeStyle(cfg) { + var defaultStyle = this.options.style; + var padding = cfg.padding || this.options.padding; + if (isArray$n(padding)) padding = padding[0]; + var strokeStyle = { + stroke: cfg.color + }; // 如果设置了color，则覆盖默认的stroke属性 + + var style = mix({}, defaultStyle, strokeStyle, cfg.style); + var r; + + if (cfg.fixSize) { + r = isNumber$4(cfg.fixSize) ? cfg.fixSize : cfg.fixSize[0]; + } else { + var size = this.getSize(cfg); + if (!isNumber$4(style.r) || isNaN(style.r)) r = size[0] / 2 || Global$1.defaultCombo.style.r;else r = Math.max(style.r, size[0] / 2) || size[0] / 2; + } + + style.r = r + padding; + + var styles = __assign$r({ + x: 0, + y: 0 + }, style); + + if (cfg.style) cfg.style.r = r;else { + cfg.style = { + r: r + }; + } + return styles; + }, + update: function update(cfg, item) { + var size = this.getSize(cfg); + var padding = cfg.padding || this.options.padding; + if (isArray$n(padding)) padding = padding[0]; + var cfgStyle = clone$7(cfg.style); + var r; + + if (cfg.fixSize) { + r = isNumber$4(cfg.fixSize) ? cfg.fixSize : cfg.fixSize[0]; + } else { + r = Math.max(cfgStyle.r, size[0] / 2) || size[0] / 2; + } + + cfgStyle.r = r + padding; + var itemCacheSize = item.get('sizeCache'); + + if (itemCacheSize) { + itemCacheSize.r = cfgStyle.r; + } // 下面这些属性需要覆盖默认样式与目前样式，但若在 cfg 中有指定则应该被 cfg 的相应配置覆盖。 + + + var strokeStyle = { + stroke: cfg.color + }; // 与 getShapeStyle 不同在于，update 时需要获取到当前的 style 进行融合。即新传入的配置项中没有涉及的属性，保留当前的配置。 + + var keyShape = item.get('keyShape'); + var style = mix({}, keyShape.attr(), strokeStyle, cfgStyle); + if (cfg.style) cfg.style.r = r;else { + cfg.style = { + r: r + }; + } + this.updateShape(cfg, item, style, true); + } +}, 'single-combo'); + +Shape.registerCombo('rect', { + // 自定义 Combo 时的配置 + options: { + size: [40, 5], + padding: [25, 20, 15, 20], + animate: true, + style: { + radius: 0, + stroke: Global$1.defaultCombo.style.stroke, + fill: Global$1.defaultCombo.style.fill, + lineWidth: Global$1.defaultCombo.style.lineWidth + }, + // 文本样式配置 + labelCfg: { + style: { + fill: Global$1.comboLabel.style.fill, + fontSize: Global$1.comboLabel.style.fontSize + } + }, + // 连接点，默认为左右 + anchorPoints: [[0, 0.5], [1, 0.5]], + stateStyles: __assign$r({}, Global$1.comboStateStyles) + }, + shapeType: 'rect', + labelPosition: 'top', + drawShape: function drawShape(cfg, group) { + var style = this.getShapeStyle(cfg); + var keyShape = group.addShape('rect', { + attrs: style, + className: 'rect-combo', + name: 'rect-combo', + draggable: true + }); + return keyShape; + }, + // 私有方法，不希望扩展的 Combo 复写这个方法 + getLabelStyleByPosition: function getLabelStyleByPosition(cfg, labelCfg) { + var labelPosition = labelCfg.position || this.labelPosition; + var cfgStyle = cfg.style; + var padding = cfg.padding || this.options.padding; + if (isNumber$4(padding)) padding = [padding, padding, padding, padding]; + var refX = labelCfg.refX, + refY = labelCfg.refY; // 考虑 refX 和 refY = 0 的场景，不用用 labelCfg.refX || Global.nodeLabel.refY + + if (isNil(refX)) { + refX = this.refX; // 不居中时的偏移量 + } + + if (isNil(refY)) { + refY = this.refY; // 不居中时的偏移量 + } + + var leftDis = cfgStyle.width / 2 + padding[3]; + var topDis = cfgStyle.height / 2 + padding[0]; + var style; + + switch (labelPosition) { + case 'top': + style = { + x: 0 - leftDis + refX, + y: 0 - topDis + refY, + textBaseline: 'top', + textAlign: 'left' + }; + break; + + case 'bottom': + style = { + x: 0, + y: topDis + refY, + textBaseline: 'bottom', + textAlign: 'center' + }; + break; + + case 'left': + style = { + x: 0 - leftDis + refY, + y: 0, + textAlign: 'left' + }; + break; + + case 'center': + style = { + x: 0, + y: 0, + text: cfg.label, + textAlign: 'center' + }; + break; + + default: + style = { + x: leftDis + refX, + y: 0, + textAlign: 'right' + }; + break; + } + + style.text = cfg.label; + return style; + }, + + /** + * 获取节点的样式，供基于该节点自定义时使用 + * @param {Object} cfg 节点数据模型 + * @return {Object} 节点的样式 + */ + getShapeStyle: function getShapeStyle(cfg) { + var defaultStyle = this.options.style; + var padding = cfg.padding || this.options.padding; + if (isNumber$4(padding)) padding = [padding, padding, padding, padding]; + var strokeStyle = { + stroke: cfg.color + }; // 如果设置了color，则覆盖默认的stroke属性 + + var style = mix({}, defaultStyle, strokeStyle, cfg.style); + var size = this.getSize(cfg); + var width; + var height; + var fixSize = cfg.collapsed && cfg.fixCollapseSize ? cfg.fixCollapseSize : cfg.fixSize; + + if (fixSize) { + if (isNumber$4(fixSize)) { + width = fixSize; + height = fixSize; + } else { + width = fixSize[0]; + height = fixSize[1]; + } + } else { + if (!isNumber$4(style.width) || isNaN(style.width)) width = size[0] || Global$1.defaultCombo.style.width;else width = Math.max(style.width, size[0]) || size[0]; + if (!isNumber$4(style.height) || isNaN(style.height)) height = size[1] || Global$1.defaultCombo.style.height;else height = Math.max(style.height, size[1]) || size[1]; + } + + var x = -width / 2 - padding[3]; + var y = -height / 2 - padding[0]; + style.width = width + padding[1] + padding[3]; + style.height = height + padding[0] + padding[2]; + + var styles = __assign$r({ + x: x, + y: y + }, style); + + if (!cfg.style) { + cfg.style = { + width: width, + height: height + }; + } else { + cfg.style.width = width; + cfg.style.height = height; + } + + return styles; + }, + update: function update(cfg, item) { + var size = this.getSize(cfg); + var padding = cfg.padding || this.options.padding; + if (isNumber$4(padding)) padding = [padding, padding, padding, padding]; + var cfgStyle = clone$7(cfg.style); + var width, height; + var fixSize = cfg.collapsed && cfg.fixCollapseSize ? cfg.fixCollapseSize : cfg.fixSize; + + if (fixSize) { + if (isNumber$4(fixSize)) { + width = fixSize; + height = fixSize; + } else { + width = fixSize[0]; + height = fixSize[1]; + } + } else { + width = Math.max(cfgStyle.width, size[0]) || size[0]; + height = Math.max(cfgStyle.height, size[1]) || size[1]; + } + + cfgStyle.width = width + padding[1] + padding[3]; + cfgStyle.height = height + padding[0] + padding[2]; + var itemCacheSize = item.get('sizeCache'); + + if (itemCacheSize) { + itemCacheSize.width = cfgStyle.width; + itemCacheSize.height = cfgStyle.height; + } + + cfgStyle.x = -width / 2 - padding[3]; + cfgStyle.y = -height / 2 - padding[0]; // 下面这些属性需要覆盖默认样式与目前样式，但若在 cfg 中有指定则应该被 cfg 的相应配置覆盖。 + + var strokeStyle = { + stroke: cfg.color + }; // 与 getShapeStyle 不同在于，update 时需要获取到当前的 style 进行融合。即新传入的配置项中没有涉及的属性，保留当前的配置。 + + var keyShape = item.get('keyShape'); + var style = mix({}, keyShape.attr(), strokeStyle, cfgStyle); + + if (cfg.style) { + cfg.style.width = width; + cfg.style.height = height; + } else { + cfg.style = { + width: width, + height: height + }; + } + + this.updateShape(cfg, item, style, false); + }, + updateShape: function updateShape(cfg, item, keyShapeStyle) { + var keyShape = item.get('keyShape'); + var animate = cfg.animate === undefined ? this.options.animate : cfg.animate; + + if (animate && keyShape.animate) { + keyShape.animate(keyShapeStyle, { + duration: 200, + easing: 'easeLinear' + }); + } else { + keyShape.attr(__assign$r({}, keyShapeStyle)); + } + + this.updateLabel(cfg, item); + } +}, 'single-combo'); + +Shape.registerNode('simple-circle', { + // 自定义节点时的配置 + options: { + size: Global$1.defaultNode.size, + style: { + x: 0, + y: 0, + stroke: Global$1.defaultNode.style.stroke, + fill: Global$1.defaultNode.style.fill, + lineWidth: Global$1.defaultNode.style.lineWidth + }, + labelCfg: { + style: { + fill: Global$1.nodeLabel.style.fill, + fontSize: Global$1.nodeLabel.style.fontSize + } + }, + stateStyles: __assign$r({}, Global$1.nodeStateStyles) + }, + shapeType: 'simple-circle', + // 文本位置 + labelPosition: 'center', + drawShape: function drawShape(cfg, group) { + var style = this.getShapeStyle(cfg); + var keyShape = group.addShape('circle', { + attrs: style, + className: this.type + "-keyShape", + draggable: true + }); + return keyShape; + }, + + /** + * 获取节点的样式，供基于该节点自定义时使用 + * @param {Object} cfg 节点数据模型 + * @return {Object} 节点的样式 + */ + getShapeStyle: function getShapeStyle(cfg) { + var defaultStyle = this.getOptions(cfg).style; + var strokeStyle = { + stroke: cfg.color + }; // 如果设置了color，则覆盖默认的stroke属性 + + var style = deepMix({}, defaultStyle, strokeStyle); + var size = this.getSize(cfg); + var r = size[0] / 2; + + var styles = __assign$r({ + x: 0, + y: 0, + r: r + }, style); + + return styles; + }, + update: function update(cfg, item) { + var size = this.getSize(cfg); // 下面这些属性需要覆盖默认样式与目前样式，但若在 cfg 中有指定则应该被 cfg 的相应配置覆盖。 + + var strokeStyle = { + stroke: cfg.color, + r: size[0] / 2 + }; // 与 getShapeStyle 不同在于，update 时需要获取到当前的 style 进行融合。即新传入的配置项中没有涉及的属性，保留当前的配置。 + + var keyShape = item.get('keyShape'); + var style = deepMix({}, keyShape.attr(), strokeStyle, cfg.style); + this.updateShape(cfg, item, style, true); + } +}, 'single-node'); + +Shape.registerNode('simple-rect', { + // 自定义节点时的配置 + options: { + size: [100, 30], + style: { + radius: 0, + stroke: Global$1.defaultNode.style.stroke, + fill: Global$1.defaultNode.style.fill, + lineWidth: Global$1.defaultNode.style.lineWidth + }, + // 文本样式配置 + labelCfg: { + style: { + fill: Global$1.nodeLabel.style.fill, + fontSize: Global$1.nodeLabel.style.fontSize + } + }, + // 连接点，默认为左右 + // anchorPoints: [{ x: 0, y: 0.5 }, { x: 1, y: 0.5 }] + anchorPoints: [[0, 0.5], [1, 0.5]], + stateStyles: __assign$r({}, Global$1.nodeStateStyles) + }, + shapeType: 'simple-rect', + labelPosition: 'center', + drawShape: function drawShape(cfg, group) { + var style = this.getShapeStyle(cfg); + var keyShape = group.addShape('rect', { + attrs: style, + className: this.type + "-keyShape", + name: this.type + "-keyShape", + draggable: true + }); + return keyShape; + }, + + /** + * 获取节点的样式，供基于该节点自定义时使用 + * @param {Object} cfg 节点数据模型 + * @return {Object} 节点的样式 + */ + getShapeStyle: function getShapeStyle(cfg) { + var defaultStyle = this.getOptions(cfg).style; + var strokeStyle = { + stroke: cfg.color + }; // 如果设置了color，则覆盖默认的stroke属性 + + var style = mix({}, defaultStyle, strokeStyle); + var size = this.getSize(cfg); + var width = style.width || size[0]; + var height = style.height || size[1]; + + var styles = __assign$r({ + x: -width / 2, + y: -height / 2, + width: width, + height: height + }, style); + + return styles; + }, + update: function update(cfg, item) { + item.getContainer(); // 这里不传 cfg 参数是因为 cfg.style 需要最后覆盖样式 + + var defaultStyle = this.getOptions({}).style; + var size = this.getSize(cfg); + var keyShape = item.get('keyShape'); + + if (!cfg.size) { + size[0] = keyShape.attr('width') || defaultStyle.width; + size[1] = keyShape.attr('height') || defaultStyle.height; + } // 下面这些属性需要覆盖默认样式与目前样式，但若在 cfg 中有指定则应该被 cfg 的相应配置覆盖。 + + + var strokeStyle = { + stroke: cfg.color, + x: -size[0] / 2, + y: -size[1] / 2, + width: size[0], + height: size[1] + }; // 与 getShapeStyle 不同在于，update 时需要获取到当前的 style 进行融合。即新传入的配置项中没有涉及的属性，保留当前的配置。 + + var style = mix({}, defaultStyle, keyShape.attr(), strokeStyle); + style = mix(style, cfg.style); + this.updateShape(cfg, item, style, false); + } +}, 'single-node'); + +/** + * 基本的图片，可以添加文本，默认文本在图片的下面 + */ + +Shape.registerNode('image', { + options: { + img: 'https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*eD7nT6tmYgAAAAAAAAAAAABkARQnAQ', + size: 200, + clipCfg: { + show: false, + type: 'circle', + // circle + r: 50, + // ellipse + rx: 50, + ry: 35, + // rect + width: 50, + height: 35, + // polygon + points: [[30, 12], [12, 30], [30, 48], [48, 30]], + // path + path: [['M', 25, 25], ['L', 50, 25], ['A', 12.5, 12.5, 0, 1, 1, 50, 50], ['A', 12.5, 12.5, 0, 1, 0, 50, 50], ['L', 25, 75], ['Z']], + // 坐标 + x: 0, + y: 0 // clip 的属性样式 + // style: { + // lineWidth: 1 + // }, + + } + }, + shapeType: 'image', + labelPosition: 'bottom', + drawShape: function drawShape(cfg, group) { + var shapeType = this.shapeType; // || this.type，都已经加了 shapeType + + var style = this.getShapeStyle(cfg); + delete style.fill; + var shape = group.addShape(shapeType, { + attrs: style, + className: this.type + "-keyShape", + name: this.type + "-keyShape", + draggable: true + }); + this.drawClip(cfg, shape); + return shape; + }, + drawClip: function drawClip(cfg, shape) { + var clip = this.getOptions(cfg).clipCfg; + + if (!clip.show) { + return; + } // 支持 circle、rect、ellipse、Polygon 及自定义 path clip + + + var type = clip.type, + x = clip.x, + y = clip.y, + style = clip.style; + + if (type === 'circle') { + var r = clip.r; + shape.setClip({ + type: 'circle', + attrs: __assign$r({ + r: r, + x: x, + y: y + }, style) + }); + } else if (type === 'rect') { + var width = clip.width, + height = clip.height; + var rectX = x - width / 2; + var rectY = y - height / 2; + shape.setClip({ + type: 'rect', + attrs: __assign$r({ + x: rectX, + y: rectY, + width: width, + height: height + }, style) + }); + } else if (type === 'ellipse') { + var rx = clip.rx, + ry = clip.ry; + shape.setClip({ + type: 'ellipse', + attrs: __assign$r({ + x: x, + y: y, + rx: rx, + ry: ry + }, style) + }); + } else if (type === 'polygon') { + var points = clip.points; + shape.setClip({ + type: 'polygon', + attrs: __assign$r({ + points: points + }, style) + }); + } else if (type === 'path') { + var path = clip.path; + shape.setClip({ + type: 'path', + attrs: __assign$r({ + path: path + }, style) + }); + } + }, + getShapeStyle: function getShapeStyle(cfg) { + var defaultStyle = this.getOptions(cfg).style; + var size = this.getSize(cfg); + var img = this.getOptions(cfg).img; + var width = size[0]; + var height = size[1]; + + if (defaultStyle) { + width = defaultStyle.width || size[0]; + height = defaultStyle.height || size[1]; + } + + var style = __assign$r({ + x: -width / 2, + y: -height / 2, + width: width, + height: height, + img: img + }, defaultStyle); + + return style; + }, + updateShapeStyle: function updateShapeStyle(cfg, item) { + var group = item.getContainer(); + var shapeClassName = this.itemType + "-shape"; + var shape = group.find(function (element) { + return element.get('className') === shapeClassName; + }) || item.getKeyShape(); + var shapeStyle = this.getShapeStyle(cfg); + + if (shape) { + shape.attr(shapeStyle); + } + } +}, 'single-node'); + +var Arrow = { + triangle: function triangle(width, length, d) { + if (width === void 0) { + width = 10; + } + + if (length === void 0) { + length = 15; + } + + if (d === void 0) { + d = 0; + } + + var begin = d * 2; + var path = "M " + begin + ",0 L " + (begin + length) + ",-" + width / 2 + " L " + (begin + length) + "," + width / 2 + " Z"; + return path; + }, + vee: function vee(width, length, d) { + if (width === void 0) { + width = 15; + } + + if (length === void 0) { + length = 20; + } + + if (d === void 0) { + d = 0; + } + + var begin = d * 2; + var path = "M " + begin + ",0 L " + (begin + length) + ",-" + width / 2 + "\n L " + (begin + 2 * length / 3) + ",0 L " + (begin + length) + "," + width / 2 + " Z"; + return path; + }, + circle: function circle(r, d) { + if (r === void 0) { + r = 5; + } + + if (d === void 0) { + d = 0; + } + + var begin = d * 2; + var path = "M " + begin + ", 0\n a " + r + "," + r + " 0 1,0 " + r * 2 + ",0\n a " + r + "," + r + " 0 1,0 " + -r * 2 + ",0"; + return path; + }, + rect: function rect(width, length, d) { + if (width === void 0) { + width = 10; + } + + if (length === void 0) { + length = 10; + } + + if (d === void 0) { + d = 0; + } + + var begin = d * 2; + var path = "M " + begin + "," + -width / 2 + " \n L " + (begin + length) + "," + -width / 2 + " \n L " + (begin + length) + "," + width / 2 + " \n L " + begin + "," + width / 2 + " Z"; + return path; + }, + diamond: function diamond(width, length, d) { + if (width === void 0) { + width = 15; + } + + if (length === void 0) { + length = 15; + } + + if (d === void 0) { + d = 0; + } + + var begin = d * 2; + var path = "M " + begin + ",0 \n L " + (begin + length / 2) + "," + -width / 2 + " \n L " + (begin + length) + ",0 \n L " + (begin + length / 2) + "," + width / 2 + " Z"; + return path; + }, + triangleRect: function triangleRect(tWidth, tLength, rWidth, rLength, gap, d) { + if (tWidth === void 0) { + tWidth = 15; + } + + if (tLength === void 0) { + tLength = 15; + } + + if (rWidth === void 0) { + rWidth = 15; + } + + if (rLength === void 0) { + rLength = 3; + } + + if (gap === void 0) { + gap = 5; + } + + if (d === void 0) { + d = 0; + } + + var begin = d * 2; + var rectBegin = begin + tLength + gap; + var path = "M " + begin + ",0 L " + (begin + tLength) + ",-" + tWidth / 2 + " L " + (begin + tLength) + "," + tWidth / 2 + " Z\n M " + rectBegin + ", -" + rWidth / 2 + "\n L " + (rectBegin + rLength) + " -" + rWidth / 2 + "\n L " + (rectBegin + rLength) + " " + rWidth / 2 + "\n L " + rectBegin + " " + rWidth / 2 + "\n Z"; + return path; + } +}; + +var Marker = { + collapse: function collapse(x, y, r) { + return [['M', x - r, y], ['a', r, r, 0, 1, 0, r * 2, 0], ['a', r, r, 0, 1, 0, -r * 2, 0], ['M', x - r + 4, y], ['L', x + r - 4, y]]; + }, + expand: function expand(x, y, r) { + return [['M', x - r, y], ['a', r, r, 0, 1, 0, r * 2, 0], ['a', r, r, 0, 1, 0, -r * 2, 0], ['M', x - r + 4, y], ['L', x - r + 2 * r - 4, y], ['M', x - r + r, y - r + 4], ['L', x, y + r - 4]]; + }, + upTriangle: function upTriangle(x, y, r) { + var l1 = r * Math.cos(Math.PI / 6); + var l2 = r * Math.sin(Math.PI / 6); + return [['M', x - l1, y + l2], ['L', x + l1, y + l2], ['L', x, y - r], ['Z']]; + }, + downTriangle: function downTriangle(x, y, r) { + var l1 = r * Math.cos(Math.PI / 6); + var l2 = r * Math.sin(Math.PI / 6); + return [['M', x - l1, y - l2], ['L', x + l1, y - l2], ['L', x, y + r], ['Z']]; + } +}; + +var transform$7 = transform$i; + +var Util = __assign$r(__assign$r(__assign$r(__assign$r(__assign$r({}, BaseUtil), GraphicUtil), PathUtil), MathUtil), { + transform: transform$7, + mat3: mat3 +}); + +var LayoutController$1 = +/** @class */ +function () { + function LayoutController(graph) { + this.graph = graph; + this.layoutCfg = graph.get('layout') || {}; + this.layoutType = this.getLayoutType(); + this.layoutMethods = []; + this.initLayout(); + } // eslint-disable-next-line class-methods-use-this + + + LayoutController.prototype.initLayout = function () {// no data before rendering + }; + + LayoutController.prototype.getLayoutType = function () { + return this.getLayoutCfgType(this.layoutCfg); + }; + + LayoutController.prototype.getLayoutCfgType = function (layoutCfg) { + var type = layoutCfg.type; // type should be top priority + + if (type) { + return type; + } + + var pipes = layoutCfg.pipes; + + if (Array.isArray(pipes)) { + return pipes.map(function (pipe) { + return (pipe === null || pipe === void 0 ? void 0 : pipe.type) || ""; + }); + } + + return null; + }; + + LayoutController.prototype.isLayoutTypeSame = function (cfg) { + var current = this.getLayoutCfgType(cfg); // already has pipes + + if (Array.isArray(this.layoutType)) { + return this.layoutType.every(function (type, index) { + return type === current[index]; + }); + } + + return (cfg === null || cfg === void 0 ? void 0 : cfg.type) === this.layoutType; + }; // 绘制 + + + LayoutController.prototype.refreshLayout = function () { + var graph = this.graph; + if (!graph) return; + + if (graph.get('animate')) { + graph.positionsAnimate(); + } else { + graph.refreshPositions(); + } + }; // 更换布局 + + + LayoutController.prototype.changeLayout = function (cfg) { + this.layoutCfg = cfg; + this.destoryLayoutMethods(); + this.layout(); + }; // 更换数据 + + + LayoutController.prototype.changeData = function () { + this.destoryLayoutMethods(); + this.layout(); + }; + + LayoutController.prototype.destoryLayoutMethods = function () { + var layoutMethods = this.layoutMethods; + layoutMethods === null || layoutMethods === void 0 ? void 0 : layoutMethods.forEach(function (layoutMethod) { + layoutMethod.destroy(); + }); + this.layoutMethods = []; + }; // 销毁布局，不能使用 this.destroy，因为 controller 还需要被使用，只是把布局算法销毁 + + + LayoutController.prototype.destroyLayout = function () { + var graph = this.graph; + this.destoryLayoutMethods(); + graph.set('layout', undefined); + this.layoutCfg = undefined; + this.layoutType = undefined; + this.layoutMethods = undefined; + }; // 从 this.graph 获取数据 + + + LayoutController.prototype.setDataFromGraph = function () { + var nodes = []; + var hiddenNodes = []; + var edges = []; + var hiddenEdges = []; + var comboEdges = []; + var combos = []; + var hiddenCombos = []; + var nodeItems = this.graph.getNodes(); + var edgeItems = this.graph.getEdges(); + var comboItems = this.graph.getCombos(); + var nodeLength = nodeItems.length; + + for (var i = 0; i < nodeLength; i++) { + var nodeItem = nodeItems[i]; + if (!nodeItem || nodeItem.destroyed) continue; + var model = nodeItem.getModel(); + + if (!nodeItem.isVisible()) { + hiddenNodes.push(model); + continue; + } + + nodes.push(model); + } + + var edgeLength = edgeItems.length; + + for (var i = 0; i < edgeLength; i++) { + var edgeItem = edgeItems[i]; + if (!edgeItem || edgeItem.destroyed) continue; + var model = edgeItem.getModel(); + + if (!edgeItem.isVisible()) { + hiddenEdges.push(model); + continue; + } + + if (!model.isComboEdge) edges.push(model);else comboEdges.push(model); + } + + var comboLength = comboItems.length; + + for (var i = 0; i < comboLength; i++) { + var comboItem = comboItems[i]; + if (comboItem.destroyed) continue; + var model = comboItem.getModel(); + + if (!comboItem.isVisible()) { + hiddenEdges.push(model); + continue; + } + + combos.push(model); + } + + return { + nodes: nodes, + hiddenNodes: hiddenNodes, + edges: edges, + hiddenEdges: hiddenEdges, + combos: combos, + hiddenCombos: hiddenCombos, + comboEdges: comboEdges + }; + }; + + LayoutController.prototype.reLayoutMethod = function (layoutMethod, layoutCfg) { + var _this = this; + + return new Promise(function (reslove, reject) { + var graph = _this.graph; + var layoutType = layoutCfg === null || layoutCfg === void 0 ? void 0 : layoutCfg.type; // 每个布局方法都需要注册 + + layoutCfg.onLayoutEnd = function () { + graph.emit('aftersublayout', { + type: layoutType + }); + reslove(); + }; + + layoutMethod.init(_this.data); + + if (layoutType === 'force') { + layoutMethod.ticking = false; + layoutMethod.forceSimulation.stop(); + } + + graph.emit('beforesublayout', { + type: layoutType + }); + layoutMethod.execute(); + if (layoutMethod.isCustomLayout && layoutCfg.onLayoutEnd) layoutCfg.onLayoutEnd(); + }); + }; // 重新布局 + + + LayoutController.prototype.relayout = function (reloadData) { + var _this = this; + + var _a = this, + graph = _a.graph, + layoutMethods = _a.layoutMethods, + layoutCfg = _a.layoutCfg; + + if (reloadData) { + this.data = this.setDataFromGraph(); + var nodes = this.data.nodes; + + if (!nodes) { + return false; + } + + this.initPositions(layoutCfg.center, nodes); + } + + graph.emit('beforelayout'); + var start = Promise.resolve(); + layoutMethods === null || layoutMethods === void 0 ? void 0 : layoutMethods.forEach(function (layoutMethod, index) { + var currentCfg = layoutCfg[index]; + start = start.then(function () { + return _this.reLayoutMethod(layoutMethod, currentCfg); + }); + }); + start.then(function () { + if (layoutCfg.onAllLayoutEnd) layoutCfg.onAllLayoutEnd(); + }).catch(function (error) { + console.warn('relayout failed', error); + }); + }; // 筛选参与布局的nodes和edges + + + LayoutController.prototype.filterLayoutData = function (data, cfg) { + var nodes = data.nodes, + edges = data.edges, + rest = __rest$G(data, ["nodes", "edges"]); + + if (!nodes) { + return data; + } + + var nodesFilter; + var edegsFilter; + + if (isFunction$6(cfg === null || cfg === void 0 ? void 0 : cfg.nodesFilter)) { + nodesFilter = cfg.nodesFilter; + } else { + nodesFilter = function nodesFilter() { + return true; + }; + } + + if (isFunction$6(cfg === null || cfg === void 0 ? void 0 : cfg.edgesFilter)) { + edegsFilter = cfg.edgesFilter; + } else { + var nodesMap_1 = nodes.reduce(function (acc, cur) { + acc[cur.id] = true; + return acc; + }, {}); + + edegsFilter = function edegsFilter(edge) { + return nodesMap_1[edge.source] && nodesMap_1[edge.target]; + }; + } + + return __assign$r({ + nodes: nodes.filter(nodesFilter), + edges: edges.filter(edegsFilter) + }, rest); + }; + + LayoutController.prototype.getLayoutBBox = function (nodes) { + var graph = this.graph; + var graphGroupNodes = groupBy(graph.getNodes(), function (n) { + return n.getModel().layoutOrder; + }); + var layoutNodes = Object.values(graphGroupNodes).map(function (value) { + var bbox = calculationItemsBBox$1(value); + bbox.size = [bbox.width, bbox.height]; + return bbox; + }); + var groupNodes = Object.values(groupBy(nodes, 'layoutOrder')); + return { + groupNodes: groupNodes, + layoutNodes: layoutNodes + }; + }; // 控制布局动画 + // eslint-disable-next-line class-methods-use-this + + + LayoutController.prototype.layoutAnimate = function () {}; // 将当前节点的平均中心移动到原点 + + + LayoutController.prototype.moveToZero = function () { + var graph = this.graph; + var data = graph.get('data'); + var nodes = data.nodes; + + if (nodes[0].x === undefined || nodes[0].x === null || isNaN$3(nodes[0].x)) { + return; + } + + var meanCenter = [0, 0]; + var nodeLength = nodes.length; + + for (var i = 0; i < nodeLength; i++) { + var node = nodes[i]; + meanCenter[0] += node.x; + meanCenter[1] += node.y; + } + + meanCenter[0] /= nodes.length; + meanCenter[1] /= nodes.length; + + for (var i = 0; i < nodeLength; i++) { + var node = nodes[i]; + node.x -= meanCenter[0]; + node.y -= meanCenter[1]; + } + }; // 初始化节点到 center 附近 + + + LayoutController.prototype.initPositions = function (center, nodes) { + var graph = this.graph; + + if (!nodes) { + return false; + } + + var nodeLength = nodes ? nodes.length : 0; + if (!nodeLength) return; + var width = graph.get('width') * 0.85; + var height = graph.get('height') * 0.85; + var horiNum = Math.ceil(Math.sqrt(nodeLength) * (width / height)); + var vertiNum = Math.ceil(nodeLength / horiNum); + var horiGap = width / (horiNum - 1); + var vertiGap = height / (vertiNum - 1); + if (!isFinite(horiGap) || !horiGap) horiGap = 0; + if (!isFinite(vertiGap) || !horiGap) vertiGap = 0; + var beginX = center[0] - width / 2; + var beginY = center[1] - height / 2; + var allHavePos = true; + + for (var i = 0; i < nodeLength; i++) { + var node = nodes[i]; + + if (isNaN$3(node.x)) { + allHavePos = false; + node.x = i % horiNum * horiGap + beginX; + } + + if (isNaN$3(node.y)) { + allHavePos = false; + node.y = Math.floor(i / horiNum) * vertiGap + beginY; + } + } + + return allHavePos; + }; + + LayoutController.prototype.destroy = function () { + this.graph = null; + this.destoryLayoutMethods(); + this.destroyed = true; + }; + + return LayoutController; +}(); + +var EventController$1 = +/** @class */ +function () { + function EventController(graph) { + this.graph = graph; + this.destroyed = false; + this.initEvents(); + } + + return EventController; +}(); + +var G6Event; + +(function (G6Event) { + // common events + G6Event["CLICK"] = "click"; + G6Event["DBLCLICK"] = "dblclick"; + G6Event["MOUSEDOWN"] = "mousedown"; + G6Event["MOUDEUP"] = "mouseup"; + G6Event["CONTEXTMENU"] = "contextmenu"; + G6Event["MOUSEENTER"] = "mouseenter"; + G6Event["MOUSEOUT"] = "mouseout"; + G6Event["MOUSEOVER"] = "mouseover"; + G6Event["MOUSEMOVE"] = "mousemove"; + G6Event["MOUSELEAVE"] = "mouseleave"; + G6Event["DRAGSTART"] = "dragstart"; + G6Event["DRAGEND"] = "dragend"; + G6Event["DRAG"] = "drag"; + G6Event["DRAGENTER"] = "dragenter"; + G6Event["DRAGLEAVE"] = "dragleave"; + G6Event["DRAGOVER"] = "dragover"; + G6Event["DRAGOUT"] = "dragout"; + G6Event["DDROP"] = "drop"; + G6Event["KEYUP"] = "keyup"; + G6Event["KEYDOWN"] = "keydown"; + G6Event["WHEEL"] = "wheel"; + G6Event["FOCUS"] = "focus"; + G6Event["BLUR"] = "blur"; // touch events + + G6Event["TOUCHSTART"] = "touchstart"; + G6Event["TOUCHMOVE"] = "touchmove"; + G6Event["TOUCHEND"] = "touchend"; // node events + + G6Event["NODE_CONTEXTMENU"] = "node:contextmenu"; + G6Event["NODE_CLICK"] = "node:click"; + G6Event["NODE_DBLCLICK"] = "node:dblclick"; + G6Event["NODE_MOUSEDOWN"] = "node:mousedown"; + G6Event["NODE_MOUSEUP"] = "node:mouseup"; + G6Event["NODE_MOUSEENTER"] = "node:mouseenter"; + G6Event["NODE_MOUSELEAVE"] = "node:mouseleave"; + G6Event["NODE_MOUSEMOVE"] = "node:mousemove"; + G6Event["NODE_MOUSEOUT"] = "node:mouseout"; + G6Event["NODE_MOUSEOVER"] = "node:mouseover"; + G6Event["NODE_DROP"] = "node:drop"; + G6Event["NODE_DRAGOVER"] = "node:dragover"; + G6Event["NODE_DRAGENTER"] = "node:dragenter"; + G6Event["NODE_DRAGLEAVE"] = "node:dragleave"; + G6Event["NODE_DRAGSTART"] = "node:dragstart"; + G6Event["NODE_DRAG"] = "node:drag"; + G6Event["NODE_DRAGEND"] = "node:dragend"; // combo, extends from nodes + + G6Event["COMBO_CONTEXTMENU"] = "combo:contextmenu"; + G6Event["COMBO_CLICK"] = "combo:click"; + G6Event["COMBO_DBLCLICK"] = "combo:dblclick"; + G6Event["COMBO_MOUSEDOWN"] = "combo:mousedown"; + G6Event["COMBO_MOUSEUP"] = "combo:mouseup"; + G6Event["COMBO_MOUSEENTER"] = "combo:mouseenter"; + G6Event["COMBO_MOUSELEAVE"] = "combo:mouseleave"; + G6Event["COMBO_MOUSEMOVE"] = "combo:mousemove"; + G6Event["COMBO_MOUSEOUT"] = "combo:mouseout"; + G6Event["COMBO_MOUSEOVER"] = "combo:mouseover"; + G6Event["COMBO_DROP"] = "combo:drop"; + G6Event["COMBO_DRAGOVER"] = "combo:dragover"; + G6Event["COMBO_DRAGENTER"] = "combo:dragenter"; + G6Event["COMBO_DRAGLEAVE"] = "combo:dragleave"; + G6Event["COMBO_DRAGSTART"] = "combo:dragstart"; + G6Event["COMBO_DRAG"] = "combo:drag"; + G6Event["COMBO_DRAGEND"] = "combo:dragend"; // edge events + + G6Event["EDGE_CONTEXTMENU"] = "edge:contextmenu"; + G6Event["EDGE_CLICK"] = "edge:click"; + G6Event["EDGE_DBLCLICK"] = "edge:dblclick"; + G6Event["EDGE_MOUSEDOWN"] = "edge:mousedown"; + G6Event["EDGE_MOUSEUP"] = "edge:mouseup"; + G6Event["EDGE_MOUSEENTER"] = "edge:mouseenter"; + G6Event["EDGE_MOUSELEAVE"] = "edge:mouseleave"; + G6Event["EDGE_MOUSEMOVE"] = "edge:mousemove"; + G6Event["EDGE_MOUSEOUT"] = "edge:mouseout"; + G6Event["EDGE_MOUSEOVER"] = "edge:mouseover"; + G6Event["EDGE_DROP"] = "edge:drop"; + G6Event["EDGE_DRAGOVER"] = "edge:dragover"; + G6Event["EDGE_DRAGENTER"] = "edge:dragenter"; + G6Event["EDGE_DRAGLEAVE"] = "edge:dragleave"; // canvas events + + G6Event["CANVAS_CONTEXTMENU"] = "canvas:contextmenu"; + G6Event["CANVAS_CLICK"] = "canvas:click"; + G6Event["CANVAS_DBLCLICK"] = "canvas:dblclick"; + G6Event["CANVAS_MOUSEDOWN"] = "canvas:mousedown"; + G6Event["CANVAS_MOUSEUP"] = "canvas:mouseup"; + G6Event["CANVAS_MOUSEENTER"] = "canvas:mouseenter"; + G6Event["CANVAS_MOUSELEAVE"] = "canvas:mouseleave"; + G6Event["CANVAS_MOUSEMOVE"] = "canvas:mousemove"; + G6Event["CANVAS_MOUSEOUT"] = "canvas:mouseout"; + G6Event["CANVAS_MOUSEOVER"] = "canvas:mouseover"; + G6Event["CANVAS_DROP"] = "canvas:drop"; + G6Event["CANVAS_DRAGENTER"] = "canvas:dragenter"; + G6Event["CANVAS_DRAGLEAVE"] = "canvas:dragleave"; + G6Event["CANVAS_DRAGSTART"] = "canvas:dragstart"; + G6Event["CANVAS_DRAG"] = "canvas:drag"; + G6Event["CANVAS_DRAGEND"] = "canvas:dragend"; // timing events + + G6Event["BEFORERENDER"] = "beforerender"; + G6Event["AFTERRENDER"] = "afterrender"; + G6Event["BEFOREADDITEM"] = "beforeadditem"; + G6Event["AFTERADDITEM"] = "afteradditem"; + G6Event["BEFOREREMOVEITEM"] = "beforeremoveitem"; + G6Event["AFTERREMOVEITEM"] = "afterremoveitem"; + G6Event["BEFOREUPDATEITEM"] = "beforeupdateitem"; + G6Event["AFTERUPDATEITEM"] = "afterupdateitem"; + G6Event["BEFOREITEMVISIBILITYCHANGE"] = "beforeitemvisibilitychange"; + G6Event["AFTERITEMVISIBILITYCHANGE"] = "afteritemvisibilitychange"; + G6Event["BEFOREITEMSTATECHANGE"] = "beforeitemstatechange"; + G6Event["AFTERITEMSTATECHANGE"] = "afteritemstatechange"; + G6Event["BEFOREITEMREFRESH"] = "beforeitemrefresh"; + G6Event["AFTERITEMREFRESH"] = "afteritemrefresh"; + G6Event["BEFOREITEMSTATESCLEAR"] = "beforeitemstatesclear"; + G6Event["AFTERITEMSTATESCLEAR"] = "afteritemstatesclear"; + G6Event["BEFOREMODECHANGE"] = "beforemodechange"; + G6Event["AFTERMODECHANGE"] = "aftermodechange"; + G6Event["BEFORELAYOUT"] = "beforelayout"; + G6Event["AFTERLAYOUT"] = "afterlayout"; + G6Event["BEFORECREATEEDGE"] = "beforecreateedge"; + G6Event["AFTERCREATEEDGE"] = "aftercreateedge"; + G6Event["BEFOREGRAPHREFRESHPOSITION"] = "beforegraphrefreshposition"; + G6Event["AFTERGRAPHREFRESHPOSITION"] = "aftergraphrefreshposition"; + G6Event["BEFOREGRAPHREFRESH"] = "beforegraphrefresh"; + G6Event["AFTERGRAPHREFRESH"] = "aftergraphrefresh"; + G6Event["BEFOREANIMATE"] = "beforeanimate"; + G6Event["AFTERANIMATE"] = "afteranimate"; + G6Event["BEFOREPAINT"] = "beforepaint"; + G6Event["AFTERPAINT"] = "afterpaint"; + G6Event["BEFORECOLLAPSEEXPANDCOMBO"] = "beforecollapseexpandcombo"; + G6Event["AFTERCOLLAPSEEXPANDCOMBO"] = "aftercollapseexpandcombo"; + G6Event["GRAPHSTATECHANGE"] = "graphstatechange"; + G6Event["AFTERACTIVATERELATIONS"] = "afteractivaterelations"; + G6Event["NODESELECTCHANGE"] = "nodeselectchange"; + G6Event["TOOLTIPCHANGE"] = "tooltipchange"; + G6Event["WHEELZOOM"] = "wheelzoom"; + G6Event["VIEWPORTCHANGE"] = "viewportchange"; + G6Event["DRAGNODEEND"] = "dragnodeend"; + G6Event["STACKCHANGE"] = "stackchange"; +})(G6Event || (G6Event = {})); + +var registerNode = Shape.registerNode; +var registerEdge = Shape.registerEdge; +var registerCombo = Shape.registerCombo; +var registerBehavior = Behavior.registerBehavior; +var BaseGlobal = Global$1; + +/** + * @description 扩展方法，提供 gl-matrix 为提供的方法 + * */ +function leftTranslate$1(out, a, v) { + var transMat = [0, 0, 0, 0, 0, 0, 0, 0, 0]; + fromTranslation(transMat, v); + return multiply$4(out, transMat, a); +} +function leftRotate$1(out, a, rad) { + var rotateMat = [0, 0, 0, 0, 0, 0, 0, 0, 0]; + fromRotation(rotateMat, rad); + return multiply$4(out, rotateMat, a); +} +function leftScale$1(out, a, v) { + var scaleMat = [0, 0, 0, 0, 0, 0, 0, 0, 0]; + fromScaling(scaleMat, v); + return multiply$4(out, scaleMat, a); +} +function leftMultiply$1(out, a, a1) { + return multiply$4(out, a1, a); +} +/** + * 根据 actions 来做 transform + * @param m + * @param actions + */ +function transform$6(m, actions) { + var matrix = m ? [].concat(m) : [1, 0, 0, 0, 1, 0, 0, 0, 1]; + for (var i = 0, len = actions.length; i < len; i++) { + var action = actions[i]; + switch (action[0]) { + case 't': + leftTranslate$1(matrix, matrix, [action[1], action[2]]); + break; + case 's': + leftScale$1(matrix, matrix, [action[1], action[2]]); + break; + case 'r': + leftRotate$1(matrix, matrix, action[1]); + break; + case 'm': + leftMultiply$1(matrix, matrix, action[1]); + break; + } + } + return matrix; +} + +var colorString$1 = {exports: {}}; + +var colorName = { + "aliceblue": [240, 248, 255], + "antiquewhite": [250, 235, 215], + "aqua": [0, 255, 255], + "aquamarine": [127, 255, 212], + "azure": [240, 255, 255], + "beige": [245, 245, 220], + "bisque": [255, 228, 196], + "black": [0, 0, 0], + "blanchedalmond": [255, 235, 205], + "blue": [0, 0, 255], + "blueviolet": [138, 43, 226], + "brown": [165, 42, 42], + "burlywood": [222, 184, 135], + "cadetblue": [95, 158, 160], + "chartreuse": [127, 255, 0], + "chocolate": [210, 105, 30], + "coral": [255, 127, 80], + "cornflowerblue": [100, 149, 237], + "cornsilk": [255, 248, 220], + "crimson": [220, 20, 60], + "cyan": [0, 255, 255], + "darkblue": [0, 0, 139], + "darkcyan": [0, 139, 139], + "darkgoldenrod": [184, 134, 11], + "darkgray": [169, 169, 169], + "darkgreen": [0, 100, 0], + "darkgrey": [169, 169, 169], + "darkkhaki": [189, 183, 107], + "darkmagenta": [139, 0, 139], + "darkolivegreen": [85, 107, 47], + "darkorange": [255, 140, 0], + "darkorchid": [153, 50, 204], + "darkred": [139, 0, 0], + "darksalmon": [233, 150, 122], + "darkseagreen": [143, 188, 143], + "darkslateblue": [72, 61, 139], + "darkslategray": [47, 79, 79], + "darkslategrey": [47, 79, 79], + "darkturquoise": [0, 206, 209], + "darkviolet": [148, 0, 211], + "deeppink": [255, 20, 147], + "deepskyblue": [0, 191, 255], + "dimgray": [105, 105, 105], + "dimgrey": [105, 105, 105], + "dodgerblue": [30, 144, 255], + "firebrick": [178, 34, 34], + "floralwhite": [255, 250, 240], + "forestgreen": [34, 139, 34], + "fuchsia": [255, 0, 255], + "gainsboro": [220, 220, 220], + "ghostwhite": [248, 248, 255], + "gold": [255, 215, 0], + "goldenrod": [218, 165, 32], + "gray": [128, 128, 128], + "green": [0, 128, 0], + "greenyellow": [173, 255, 47], + "grey": [128, 128, 128], + "honeydew": [240, 255, 240], + "hotpink": [255, 105, 180], + "indianred": [205, 92, 92], + "indigo": [75, 0, 130], + "ivory": [255, 255, 240], + "khaki": [240, 230, 140], + "lavender": [230, 230, 250], + "lavenderblush": [255, 240, 245], + "lawngreen": [124, 252, 0], + "lemonchiffon": [255, 250, 205], + "lightblue": [173, 216, 230], + "lightcoral": [240, 128, 128], + "lightcyan": [224, 255, 255], + "lightgoldenrodyellow": [250, 250, 210], + "lightgray": [211, 211, 211], + "lightgreen": [144, 238, 144], + "lightgrey": [211, 211, 211], + "lightpink": [255, 182, 193], + "lightsalmon": [255, 160, 122], + "lightseagreen": [32, 178, 170], + "lightskyblue": [135, 206, 250], + "lightslategray": [119, 136, 153], + "lightslategrey": [119, 136, 153], + "lightsteelblue": [176, 196, 222], + "lightyellow": [255, 255, 224], + "lime": [0, 255, 0], + "limegreen": [50, 205, 50], + "linen": [250, 240, 230], + "magenta": [255, 0, 255], + "maroon": [128, 0, 0], + "mediumaquamarine": [102, 205, 170], + "mediumblue": [0, 0, 205], + "mediumorchid": [186, 85, 211], + "mediumpurple": [147, 112, 219], + "mediumseagreen": [60, 179, 113], + "mediumslateblue": [123, 104, 238], + "mediumspringgreen": [0, 250, 154], + "mediumturquoise": [72, 209, 204], + "mediumvioletred": [199, 21, 133], + "midnightblue": [25, 25, 112], + "mintcream": [245, 255, 250], + "mistyrose": [255, 228, 225], + "moccasin": [255, 228, 181], + "navajowhite": [255, 222, 173], + "navy": [0, 0, 128], + "oldlace": [253, 245, 230], + "olive": [128, 128, 0], + "olivedrab": [107, 142, 35], + "orange": [255, 165, 0], + "orangered": [255, 69, 0], + "orchid": [218, 112, 214], + "palegoldenrod": [238, 232, 170], + "palegreen": [152, 251, 152], + "paleturquoise": [175, 238, 238], + "palevioletred": [219, 112, 147], + "papayawhip": [255, 239, 213], + "peachpuff": [255, 218, 185], + "peru": [205, 133, 63], + "pink": [255, 192, 203], + "plum": [221, 160, 221], + "powderblue": [176, 224, 230], + "purple": [128, 0, 128], + "rebeccapurple": [102, 51, 153], + "red": [255, 0, 0], + "rosybrown": [188, 143, 143], + "royalblue": [65, 105, 225], + "saddlebrown": [139, 69, 19], + "salmon": [250, 128, 114], + "sandybrown": [244, 164, 96], + "seagreen": [46, 139, 87], + "seashell": [255, 245, 238], + "sienna": [160, 82, 45], + "silver": [192, 192, 192], + "skyblue": [135, 206, 235], + "slateblue": [106, 90, 205], + "slategray": [112, 128, 144], + "slategrey": [112, 128, 144], + "snow": [255, 250, 250], + "springgreen": [0, 255, 127], + "steelblue": [70, 130, 180], + "tan": [210, 180, 140], + "teal": [0, 128, 128], + "thistle": [216, 191, 216], + "tomato": [255, 99, 71], + "turquoise": [64, 224, 208], + "violet": [238, 130, 238], + "wheat": [245, 222, 179], + "white": [255, 255, 255], + "whitesmoke": [245, 245, 245], + "yellow": [255, 255, 0], + "yellowgreen": [154, 205, 50] +}; + +var simpleSwizzle = {exports: {}}; + +var isArrayish$1 = function isArrayish(obj) { + if (!obj || typeof obj === 'string') { + return false; + } + + return obj instanceof Array || Array.isArray(obj) || + (obj.length >= 0 && (obj.splice instanceof Function || + (Object.getOwnPropertyDescriptor(obj, (obj.length - 1)) && obj.constructor.name !== 'String'))); +}; + +var isArrayish = isArrayish$1; + +var concat = Array.prototype.concat; +var slice = Array.prototype.slice; + +var swizzle$1 = simpleSwizzle.exports = function swizzle(args) { + var results = []; + + for (var i = 0, len = args.length; i < len; i++) { + var arg = args[i]; + + if (isArrayish(arg)) { + // http://jsperf.com/javascript-array-concat-vs-push/98 + results = concat.call(results, slice.call(arg)); + } else { + results.push(arg); + } + } + + return results; +}; + +swizzle$1.wrap = function (fn) { + return function () { + return fn(swizzle$1(arguments)); + }; +}; + +/* MIT license */ + +var colorNames = colorName; +var swizzle = simpleSwizzle.exports; + +var reverseNames = {}; + +// create a list of reverse color names +for (var name in colorNames) { + if (colorNames.hasOwnProperty(name)) { + reverseNames[colorNames[name]] = name; + } +} + +var cs = colorString$1.exports = { + to: {}, + get: {} +}; + +cs.get = function (string) { + var prefix = string.substring(0, 3).toLowerCase(); + var val; + var model; + switch (prefix) { + case 'hsl': + val = cs.get.hsl(string); + model = 'hsl'; + break; + case 'hwb': + val = cs.get.hwb(string); + model = 'hwb'; + break; + default: + val = cs.get.rgb(string); + model = 'rgb'; + break; + } + + if (!val) { + return null; + } + + return {model: model, value: val}; +}; + +cs.get.rgb = function (string) { + if (!string) { + return null; + } + + var abbr = /^#([a-f0-9]{3,4})$/i; + var hex = /^#([a-f0-9]{6})([a-f0-9]{2})?$/i; + var rgba = /^rgba?\(\s*([+-]?\d+)\s*,\s*([+-]?\d+)\s*,\s*([+-]?\d+)\s*(?:,\s*([+-]?[\d\.]+)\s*)?\)$/; + var per = /^rgba?\(\s*([+-]?[\d\.]+)\%\s*,\s*([+-]?[\d\.]+)\%\s*,\s*([+-]?[\d\.]+)\%\s*(?:,\s*([+-]?[\d\.]+)\s*)?\)$/; + var keyword = /(\D+)/; + + var rgb = [0, 0, 0, 1]; + var match; + var i; + var hexAlpha; + + if (match = string.match(hex)) { + hexAlpha = match[2]; + match = match[1]; + + for (i = 0; i < 3; i++) { + // https://jsperf.com/slice-vs-substr-vs-substring-methods-long-string/19 + var i2 = i * 2; + rgb[i] = parseInt(match.slice(i2, i2 + 2), 16); + } + + if (hexAlpha) { + rgb[3] = parseInt(hexAlpha, 16) / 255; + } + } else if (match = string.match(abbr)) { + match = match[1]; + hexAlpha = match[3]; + + for (i = 0; i < 3; i++) { + rgb[i] = parseInt(match[i] + match[i], 16); + } + + if (hexAlpha) { + rgb[3] = parseInt(hexAlpha + hexAlpha, 16) / 255; + } + } else if (match = string.match(rgba)) { + for (i = 0; i < 3; i++) { + rgb[i] = parseInt(match[i + 1], 0); + } + + if (match[4]) { + rgb[3] = parseFloat(match[4]); + } + } else if (match = string.match(per)) { + for (i = 0; i < 3; i++) { + rgb[i] = Math.round(parseFloat(match[i + 1]) * 2.55); + } + + if (match[4]) { + rgb[3] = parseFloat(match[4]); + } + } else if (match = string.match(keyword)) { + if (match[1] === 'transparent') { + return [0, 0, 0, 0]; + } + + rgb = colorNames[match[1]]; + + if (!rgb) { + return null; + } + + rgb[3] = 1; + + return rgb; + } else { + return null; + } + + for (i = 0; i < 3; i++) { + rgb[i] = clamp(rgb[i], 0, 255); + } + rgb[3] = clamp(rgb[3], 0, 1); + + return rgb; +}; + +cs.get.hsl = function (string) { + if (!string) { + return null; + } + + var hsl = /^hsla?\(\s*([+-]?(?:\d{0,3}\.)?\d+)(?:deg)?\s*,?\s*([+-]?[\d\.]+)%\s*,?\s*([+-]?[\d\.]+)%\s*(?:[,|\/]\s*([+-]?[\d\.]+)\s*)?\)$/; + var match = string.match(hsl); + + if (match) { + var alpha = parseFloat(match[4]); + var h = (parseFloat(match[1]) + 360) % 360; + var s = clamp(parseFloat(match[2]), 0, 100); + var l = clamp(parseFloat(match[3]), 0, 100); + var a = clamp(isNaN(alpha) ? 1 : alpha, 0, 1); + + return [h, s, l, a]; + } + + return null; +}; + +cs.get.hwb = function (string) { + if (!string) { + return null; + } + + var hwb = /^hwb\(\s*([+-]?\d{0,3}(?:\.\d+)?)(?:deg)?\s*,\s*([+-]?[\d\.]+)%\s*,\s*([+-]?[\d\.]+)%\s*(?:,\s*([+-]?[\d\.]+)\s*)?\)$/; + var match = string.match(hwb); + + if (match) { + var alpha = parseFloat(match[4]); + var h = ((parseFloat(match[1]) % 360) + 360) % 360; + var w = clamp(parseFloat(match[2]), 0, 100); + var b = clamp(parseFloat(match[3]), 0, 100); + var a = clamp(isNaN(alpha) ? 1 : alpha, 0, 1); + return [h, w, b, a]; + } + + return null; +}; + +cs.to.hex = function () { + var rgba = swizzle(arguments); + + return ( + '#' + + hexDouble(rgba[0]) + + hexDouble(rgba[1]) + + hexDouble(rgba[2]) + + (rgba[3] < 1 + ? (hexDouble(Math.round(rgba[3] * 255))) + : '') + ); +}; + +cs.to.rgb = function () { + var rgba = swizzle(arguments); + + return rgba.length < 4 || rgba[3] === 1 + ? 'rgb(' + Math.round(rgba[0]) + ', ' + Math.round(rgba[1]) + ', ' + Math.round(rgba[2]) + ')' + : 'rgba(' + Math.round(rgba[0]) + ', ' + Math.round(rgba[1]) + ', ' + Math.round(rgba[2]) + ', ' + rgba[3] + ')'; +}; + +cs.to.rgb.percent = function () { + var rgba = swizzle(arguments); + + var r = Math.round(rgba[0] / 255 * 100); + var g = Math.round(rgba[1] / 255 * 100); + var b = Math.round(rgba[2] / 255 * 100); + + return rgba.length < 4 || rgba[3] === 1 + ? 'rgb(' + r + '%, ' + g + '%, ' + b + '%)' + : 'rgba(' + r + '%, ' + g + '%, ' + b + '%, ' + rgba[3] + ')'; +}; + +cs.to.hsl = function () { + var hsla = swizzle(arguments); + return hsla.length < 4 || hsla[3] === 1 + ? 'hsl(' + hsla[0] + ', ' + hsla[1] + '%, ' + hsla[2] + '%)' + : 'hsla(' + hsla[0] + ', ' + hsla[1] + '%, ' + hsla[2] + '%, ' + hsla[3] + ')'; +}; + +// hwb is a bit different than rgb(a) & hsl(a) since there is no alpha specific syntax +// (hwb have alpha optional & 1 is default value) +cs.to.hwb = function () { + var hwba = swizzle(arguments); + + var a = ''; + if (hwba.length >= 4 && hwba[3] !== 1) { + a = ', ' + hwba[3]; + } + + return 'hwb(' + hwba[0] + ', ' + hwba[1] + '%, ' + hwba[2] + '%' + a + ')'; +}; + +cs.to.keyword = function (rgb) { + return reverseNames[rgb.slice(0, 3)]; +}; + +// helpers +function clamp(num, min, max) { + return Math.min(Math.max(min, num), max); +} + +function hexDouble(num) { + var str = num.toString(16).toUpperCase(); + return (str.length < 2) ? '0' + str : str; +} + +var conversions$2 = {exports: {}}; + +/* MIT license */ + +var cssKeywords = colorName; + +// NOTE: conversions should only return primitive values (i.e. arrays, or +// values that give correct `typeof` results). +// do not use box values types (i.e. Number(), String(), etc.) + +var reverseKeywords = {}; +for (var key in cssKeywords) { + if (cssKeywords.hasOwnProperty(key)) { + reverseKeywords[cssKeywords[key]] = key; + } +} + +var convert$2 = conversions$2.exports = { + rgb: {channels: 3, labels: 'rgb'}, + hsl: {channels: 3, labels: 'hsl'}, + hsv: {channels: 3, labels: 'hsv'}, + hwb: {channels: 3, labels: 'hwb'}, + cmyk: {channels: 4, labels: 'cmyk'}, + xyz: {channels: 3, labels: 'xyz'}, + lab: {channels: 3, labels: 'lab'}, + lch: {channels: 3, labels: 'lch'}, + hex: {channels: 1, labels: ['hex']}, + keyword: {channels: 1, labels: ['keyword']}, + ansi16: {channels: 1, labels: ['ansi16']}, + ansi256: {channels: 1, labels: ['ansi256']}, + hcg: {channels: 3, labels: ['h', 'c', 'g']}, + apple: {channels: 3, labels: ['r16', 'g16', 'b16']}, + gray: {channels: 1, labels: ['gray']} +}; + +// hide .channels and .labels properties +for (var model in convert$2) { + if (convert$2.hasOwnProperty(model)) { + if (!('channels' in convert$2[model])) { + throw new Error('missing channels property: ' + model); + } + + if (!('labels' in convert$2[model])) { + throw new Error('missing channel labels property: ' + model); + } + + if (convert$2[model].labels.length !== convert$2[model].channels) { + throw new Error('channel and label counts mismatch: ' + model); + } + + var channels = convert$2[model].channels; + var labels = convert$2[model].labels; + delete convert$2[model].channels; + delete convert$2[model].labels; + Object.defineProperty(convert$2[model], 'channels', {value: channels}); + Object.defineProperty(convert$2[model], 'labels', {value: labels}); + } +} + +convert$2.rgb.hsl = function (rgb) { + var r = rgb[0] / 255; + var g = rgb[1] / 255; + var b = rgb[2] / 255; + var min = Math.min(r, g, b); + var max = Math.max(r, g, b); + var delta = max - min; + var h; + var s; + var l; + + if (max === min) { + h = 0; + } else if (r === max) { + h = (g - b) / delta; + } else if (g === max) { + h = 2 + (b - r) / delta; + } else if (b === max) { + h = 4 + (r - g) / delta; + } + + h = Math.min(h * 60, 360); + + if (h < 0) { + h += 360; + } + + l = (min + max) / 2; + + if (max === min) { + s = 0; + } else if (l <= 0.5) { + s = delta / (max + min); + } else { + s = delta / (2 - max - min); + } + + return [h, s * 100, l * 100]; +}; + +convert$2.rgb.hsv = function (rgb) { + var rdif; + var gdif; + var bdif; + var h; + var s; + + var r = rgb[0] / 255; + var g = rgb[1] / 255; + var b = rgb[2] / 255; + var v = Math.max(r, g, b); + var diff = v - Math.min(r, g, b); + var diffc = function (c) { + return (v - c) / 6 / diff + 1 / 2; + }; + + if (diff === 0) { + h = s = 0; + } else { + s = diff / v; + rdif = diffc(r); + gdif = diffc(g); + bdif = diffc(b); + + if (r === v) { + h = bdif - gdif; + } else if (g === v) { + h = (1 / 3) + rdif - bdif; + } else if (b === v) { + h = (2 / 3) + gdif - rdif; + } + if (h < 0) { + h += 1; + } else if (h > 1) { + h -= 1; + } + } + + return [ + h * 360, + s * 100, + v * 100 + ]; +}; + +convert$2.rgb.hwb = function (rgb) { + var r = rgb[0]; + var g = rgb[1]; + var b = rgb[2]; + var h = convert$2.rgb.hsl(rgb)[0]; + var w = 1 / 255 * Math.min(r, Math.min(g, b)); + + b = 1 - 1 / 255 * Math.max(r, Math.max(g, b)); + + return [h, w * 100, b * 100]; +}; + +convert$2.rgb.cmyk = function (rgb) { + var r = rgb[0] / 255; + var g = rgb[1] / 255; + var b = rgb[2] / 255; + var c; + var m; + var y; + var k; + + k = Math.min(1 - r, 1 - g, 1 - b); + c = (1 - r - k) / (1 - k) || 0; + m = (1 - g - k) / (1 - k) || 0; + y = (1 - b - k) / (1 - k) || 0; + + return [c * 100, m * 100, y * 100, k * 100]; +}; + +/** + * See https://en.m.wikipedia.org/wiki/Euclidean_distance#Squared_Euclidean_distance + * */ +function comparativeDistance(x, y) { + return ( + Math.pow(x[0] - y[0], 2) + + Math.pow(x[1] - y[1], 2) + + Math.pow(x[2] - y[2], 2) + ); +} + +convert$2.rgb.keyword = function (rgb) { + var reversed = reverseKeywords[rgb]; + if (reversed) { + return reversed; + } + + var currentClosestDistance = Infinity; + var currentClosestKeyword; + + for (var keyword in cssKeywords) { + if (cssKeywords.hasOwnProperty(keyword)) { + var value = cssKeywords[keyword]; + + // Compute comparative distance + var distance = comparativeDistance(rgb, value); + + // Check if its less, if so set as closest + if (distance < currentClosestDistance) { + currentClosestDistance = distance; + currentClosestKeyword = keyword; + } + } + } + + return currentClosestKeyword; +}; + +convert$2.keyword.rgb = function (keyword) { + return cssKeywords[keyword]; +}; + +convert$2.rgb.xyz = function (rgb) { + var r = rgb[0] / 255; + var g = rgb[1] / 255; + var b = rgb[2] / 255; + + // assume sRGB + r = r > 0.04045 ? Math.pow(((r + 0.055) / 1.055), 2.4) : (r / 12.92); + g = g > 0.04045 ? Math.pow(((g + 0.055) / 1.055), 2.4) : (g / 12.92); + b = b > 0.04045 ? Math.pow(((b + 0.055) / 1.055), 2.4) : (b / 12.92); + + var x = (r * 0.4124) + (g * 0.3576) + (b * 0.1805); + var y = (r * 0.2126) + (g * 0.7152) + (b * 0.0722); + var z = (r * 0.0193) + (g * 0.1192) + (b * 0.9505); + + return [x * 100, y * 100, z * 100]; +}; + +convert$2.rgb.lab = function (rgb) { + var xyz = convert$2.rgb.xyz(rgb); + var x = xyz[0]; + var y = xyz[1]; + var z = xyz[2]; + var l; + var a; + var b; + + x /= 95.047; + y /= 100; + z /= 108.883; + + x = x > 0.008856 ? Math.pow(x, 1 / 3) : (7.787 * x) + (16 / 116); + y = y > 0.008856 ? Math.pow(y, 1 / 3) : (7.787 * y) + (16 / 116); + z = z > 0.008856 ? Math.pow(z, 1 / 3) : (7.787 * z) + (16 / 116); + + l = (116 * y) - 16; + a = 500 * (x - y); + b = 200 * (y - z); + + return [l, a, b]; +}; + +convert$2.hsl.rgb = function (hsl) { + var h = hsl[0] / 360; + var s = hsl[1] / 100; + var l = hsl[2] / 100; + var t1; + var t2; + var t3; + var rgb; + var val; + + if (s === 0) { + val = l * 255; + return [val, val, val]; + } + + if (l < 0.5) { + t2 = l * (1 + s); + } else { + t2 = l + s - l * s; + } + + t1 = 2 * l - t2; + + rgb = [0, 0, 0]; + for (var i = 0; i < 3; i++) { + t3 = h + 1 / 3 * -(i - 1); + if (t3 < 0) { + t3++; + } + if (t3 > 1) { + t3--; + } + + if (6 * t3 < 1) { + val = t1 + (t2 - t1) * 6 * t3; + } else if (2 * t3 < 1) { + val = t2; + } else if (3 * t3 < 2) { + val = t1 + (t2 - t1) * (2 / 3 - t3) * 6; + } else { + val = t1; + } + + rgb[i] = val * 255; + } + + return rgb; +}; + +convert$2.hsl.hsv = function (hsl) { + var h = hsl[0]; + var s = hsl[1] / 100; + var l = hsl[2] / 100; + var smin = s; + var lmin = Math.max(l, 0.01); + var sv; + var v; + + l *= 2; + s *= (l <= 1) ? l : 2 - l; + smin *= lmin <= 1 ? lmin : 2 - lmin; + v = (l + s) / 2; + sv = l === 0 ? (2 * smin) / (lmin + smin) : (2 * s) / (l + s); + + return [h, sv * 100, v * 100]; +}; + +convert$2.hsv.rgb = function (hsv) { + var h = hsv[0] / 60; + var s = hsv[1] / 100; + var v = hsv[2] / 100; + var hi = Math.floor(h) % 6; + + var f = h - Math.floor(h); + var p = 255 * v * (1 - s); + var q = 255 * v * (1 - (s * f)); + var t = 255 * v * (1 - (s * (1 - f))); + v *= 255; + + switch (hi) { + case 0: + return [v, t, p]; + case 1: + return [q, v, p]; + case 2: + return [p, v, t]; + case 3: + return [p, q, v]; + case 4: + return [t, p, v]; + case 5: + return [v, p, q]; + } +}; + +convert$2.hsv.hsl = function (hsv) { + var h = hsv[0]; + var s = hsv[1] / 100; + var v = hsv[2] / 100; + var vmin = Math.max(v, 0.01); + var lmin; + var sl; + var l; + + l = (2 - s) * v; + lmin = (2 - s) * vmin; + sl = s * vmin; + sl /= (lmin <= 1) ? lmin : 2 - lmin; + sl = sl || 0; + l /= 2; + + return [h, sl * 100, l * 100]; +}; + +// http://dev.w3.org/csswg/css-color/#hwb-to-rgb +convert$2.hwb.rgb = function (hwb) { + var h = hwb[0] / 360; + var wh = hwb[1] / 100; + var bl = hwb[2] / 100; + var ratio = wh + bl; + var i; + var v; + var f; + var n; + + // wh + bl cant be > 1 + if (ratio > 1) { + wh /= ratio; + bl /= ratio; + } + + i = Math.floor(6 * h); + v = 1 - bl; + f = 6 * h - i; + + if ((i & 0x01) !== 0) { + f = 1 - f; + } + + n = wh + f * (v - wh); // linear interpolation + + var r; + var g; + var b; + switch (i) { + default: + case 6: + case 0: r = v; g = n; b = wh; break; + case 1: r = n; g = v; b = wh; break; + case 2: r = wh; g = v; b = n; break; + case 3: r = wh; g = n; b = v; break; + case 4: r = n; g = wh; b = v; break; + case 5: r = v; g = wh; b = n; break; + } + + return [r * 255, g * 255, b * 255]; +}; + +convert$2.cmyk.rgb = function (cmyk) { + var c = cmyk[0] / 100; + var m = cmyk[1] / 100; + var y = cmyk[2] / 100; + var k = cmyk[3] / 100; + var r; + var g; + var b; + + r = 1 - Math.min(1, c * (1 - k) + k); + g = 1 - Math.min(1, m * (1 - k) + k); + b = 1 - Math.min(1, y * (1 - k) + k); + + return [r * 255, g * 255, b * 255]; +}; + +convert$2.xyz.rgb = function (xyz) { + var x = xyz[0] / 100; + var y = xyz[1] / 100; + var z = xyz[2] / 100; + var r; + var g; + var b; + + r = (x * 3.2406) + (y * -1.5372) + (z * -0.4986); + g = (x * -0.9689) + (y * 1.8758) + (z * 0.0415); + b = (x * 0.0557) + (y * -0.2040) + (z * 1.0570); + + // assume sRGB + r = r > 0.0031308 + ? ((1.055 * Math.pow(r, 1.0 / 2.4)) - 0.055) + : r * 12.92; + + g = g > 0.0031308 + ? ((1.055 * Math.pow(g, 1.0 / 2.4)) - 0.055) + : g * 12.92; + + b = b > 0.0031308 + ? ((1.055 * Math.pow(b, 1.0 / 2.4)) - 0.055) + : b * 12.92; + + r = Math.min(Math.max(0, r), 1); + g = Math.min(Math.max(0, g), 1); + b = Math.min(Math.max(0, b), 1); + + return [r * 255, g * 255, b * 255]; +}; + +convert$2.xyz.lab = function (xyz) { + var x = xyz[0]; + var y = xyz[1]; + var z = xyz[2]; + var l; + var a; + var b; + + x /= 95.047; + y /= 100; + z /= 108.883; + + x = x > 0.008856 ? Math.pow(x, 1 / 3) : (7.787 * x) + (16 / 116); + y = y > 0.008856 ? Math.pow(y, 1 / 3) : (7.787 * y) + (16 / 116); + z = z > 0.008856 ? Math.pow(z, 1 / 3) : (7.787 * z) + (16 / 116); + + l = (116 * y) - 16; + a = 500 * (x - y); + b = 200 * (y - z); + + return [l, a, b]; +}; + +convert$2.lab.xyz = function (lab) { + var l = lab[0]; + var a = lab[1]; + var b = lab[2]; + var x; + var y; + var z; + + y = (l + 16) / 116; + x = a / 500 + y; + z = y - b / 200; + + var y2 = Math.pow(y, 3); + var x2 = Math.pow(x, 3); + var z2 = Math.pow(z, 3); + y = y2 > 0.008856 ? y2 : (y - 16 / 116) / 7.787; + x = x2 > 0.008856 ? x2 : (x - 16 / 116) / 7.787; + z = z2 > 0.008856 ? z2 : (z - 16 / 116) / 7.787; + + x *= 95.047; + y *= 100; + z *= 108.883; + + return [x, y, z]; +}; + +convert$2.lab.lch = function (lab) { + var l = lab[0]; + var a = lab[1]; + var b = lab[2]; + var hr; + var h; + var c; + + hr = Math.atan2(b, a); + h = hr * 360 / 2 / Math.PI; + + if (h < 0) { + h += 360; + } + + c = Math.sqrt(a * a + b * b); + + return [l, c, h]; +}; + +convert$2.lch.lab = function (lch) { + var l = lch[0]; + var c = lch[1]; + var h = lch[2]; + var a; + var b; + var hr; + + hr = h / 360 * 2 * Math.PI; + a = c * Math.cos(hr); + b = c * Math.sin(hr); + + return [l, a, b]; +}; + +convert$2.rgb.ansi16 = function (args) { + var r = args[0]; + var g = args[1]; + var b = args[2]; + var value = 1 in arguments ? arguments[1] : convert$2.rgb.hsv(args)[2]; // hsv -> ansi16 optimization + + value = Math.round(value / 50); + + if (value === 0) { + return 30; + } + + var ansi = 30 + + ((Math.round(b / 255) << 2) + | (Math.round(g / 255) << 1) + | Math.round(r / 255)); + + if (value === 2) { + ansi += 60; + } + + return ansi; +}; + +convert$2.hsv.ansi16 = function (args) { + // optimization here; we already know the value and don't need to get + // it converted for us. + return convert$2.rgb.ansi16(convert$2.hsv.rgb(args), args[2]); +}; + +convert$2.rgb.ansi256 = function (args) { + var r = args[0]; + var g = args[1]; + var b = args[2]; + + // we use the extended greyscale palette here, with the exception of + // black and white. normal palette only has 4 greyscale shades. + if (r === g && g === b) { + if (r < 8) { + return 16; + } + + if (r > 248) { + return 231; + } + + return Math.round(((r - 8) / 247) * 24) + 232; + } + + var ansi = 16 + + (36 * Math.round(r / 255 * 5)) + + (6 * Math.round(g / 255 * 5)) + + Math.round(b / 255 * 5); + + return ansi; +}; + +convert$2.ansi16.rgb = function (args) { + var color = args % 10; + + // handle greyscale + if (color === 0 || color === 7) { + if (args > 50) { + color += 3.5; + } + + color = color / 10.5 * 255; + + return [color, color, color]; + } + + var mult = (~~(args > 50) + 1) * 0.5; + var r = ((color & 1) * mult) * 255; + var g = (((color >> 1) & 1) * mult) * 255; + var b = (((color >> 2) & 1) * mult) * 255; + + return [r, g, b]; +}; + +convert$2.ansi256.rgb = function (args) { + // handle greyscale + if (args >= 232) { + var c = (args - 232) * 10 + 8; + return [c, c, c]; + } + + args -= 16; + + var rem; + var r = Math.floor(args / 36) / 5 * 255; + var g = Math.floor((rem = args % 36) / 6) / 5 * 255; + var b = (rem % 6) / 5 * 255; + + return [r, g, b]; +}; + +convert$2.rgb.hex = function (args) { + var integer = ((Math.round(args[0]) & 0xFF) << 16) + + ((Math.round(args[1]) & 0xFF) << 8) + + (Math.round(args[2]) & 0xFF); + + var string = integer.toString(16).toUpperCase(); + return '000000'.substring(string.length) + string; +}; + +convert$2.hex.rgb = function (args) { + var match = args.toString(16).match(/[a-f0-9]{6}|[a-f0-9]{3}/i); + if (!match) { + return [0, 0, 0]; + } + + var colorString = match[0]; + + if (match[0].length === 3) { + colorString = colorString.split('').map(function (char) { + return char + char; + }).join(''); + } + + var integer = parseInt(colorString, 16); + var r = (integer >> 16) & 0xFF; + var g = (integer >> 8) & 0xFF; + var b = integer & 0xFF; + + return [r, g, b]; +}; + +convert$2.rgb.hcg = function (rgb) { + var r = rgb[0] / 255; + var g = rgb[1] / 255; + var b = rgb[2] / 255; + var max = Math.max(Math.max(r, g), b); + var min = Math.min(Math.min(r, g), b); + var chroma = (max - min); + var grayscale; + var hue; + + if (chroma < 1) { + grayscale = min / (1 - chroma); + } else { + grayscale = 0; + } + + if (chroma <= 0) { + hue = 0; + } else + if (max === r) { + hue = ((g - b) / chroma) % 6; + } else + if (max === g) { + hue = 2 + (b - r) / chroma; + } else { + hue = 4 + (r - g) / chroma + 4; + } + + hue /= 6; + hue %= 1; + + return [hue * 360, chroma * 100, grayscale * 100]; +}; + +convert$2.hsl.hcg = function (hsl) { + var s = hsl[1] / 100; + var l = hsl[2] / 100; + var c = 1; + var f = 0; + + if (l < 0.5) { + c = 2.0 * s * l; + } else { + c = 2.0 * s * (1.0 - l); + } + + if (c < 1.0) { + f = (l - 0.5 * c) / (1.0 - c); + } + + return [hsl[0], c * 100, f * 100]; +}; + +convert$2.hsv.hcg = function (hsv) { + var s = hsv[1] / 100; + var v = hsv[2] / 100; + + var c = s * v; + var f = 0; + + if (c < 1.0) { + f = (v - c) / (1 - c); + } + + return [hsv[0], c * 100, f * 100]; +}; + +convert$2.hcg.rgb = function (hcg) { + var h = hcg[0] / 360; + var c = hcg[1] / 100; + var g = hcg[2] / 100; + + if (c === 0.0) { + return [g * 255, g * 255, g * 255]; + } + + var pure = [0, 0, 0]; + var hi = (h % 1) * 6; + var v = hi % 1; + var w = 1 - v; + var mg = 0; + + switch (Math.floor(hi)) { + case 0: + pure[0] = 1; pure[1] = v; pure[2] = 0; break; + case 1: + pure[0] = w; pure[1] = 1; pure[2] = 0; break; + case 2: + pure[0] = 0; pure[1] = 1; pure[2] = v; break; + case 3: + pure[0] = 0; pure[1] = w; pure[2] = 1; break; + case 4: + pure[0] = v; pure[1] = 0; pure[2] = 1; break; + default: + pure[0] = 1; pure[1] = 0; pure[2] = w; + } + + mg = (1.0 - c) * g; + + return [ + (c * pure[0] + mg) * 255, + (c * pure[1] + mg) * 255, + (c * pure[2] + mg) * 255 + ]; +}; + +convert$2.hcg.hsv = function (hcg) { + var c = hcg[1] / 100; + var g = hcg[2] / 100; + + var v = c + g * (1.0 - c); + var f = 0; + + if (v > 0.0) { + f = c / v; + } + + return [hcg[0], f * 100, v * 100]; +}; + +convert$2.hcg.hsl = function (hcg) { + var c = hcg[1] / 100; + var g = hcg[2] / 100; + + var l = g * (1.0 - c) + 0.5 * c; + var s = 0; + + if (l > 0.0 && l < 0.5) { + s = c / (2 * l); + } else + if (l >= 0.5 && l < 1.0) { + s = c / (2 * (1 - l)); + } + + return [hcg[0], s * 100, l * 100]; +}; + +convert$2.hcg.hwb = function (hcg) { + var c = hcg[1] / 100; + var g = hcg[2] / 100; + var v = c + g * (1.0 - c); + return [hcg[0], (v - c) * 100, (1 - v) * 100]; +}; + +convert$2.hwb.hcg = function (hwb) { + var w = hwb[1] / 100; + var b = hwb[2] / 100; + var v = 1 - b; + var c = v - w; + var g = 0; + + if (c < 1) { + g = (v - c) / (1 - c); + } + + return [hwb[0], c * 100, g * 100]; +}; + +convert$2.apple.rgb = function (apple) { + return [(apple[0] / 65535) * 255, (apple[1] / 65535) * 255, (apple[2] / 65535) * 255]; +}; + +convert$2.rgb.apple = function (rgb) { + return [(rgb[0] / 255) * 65535, (rgb[1] / 255) * 65535, (rgb[2] / 255) * 65535]; +}; + +convert$2.gray.rgb = function (args) { + return [args[0] / 100 * 255, args[0] / 100 * 255, args[0] / 100 * 255]; +}; + +convert$2.gray.hsl = convert$2.gray.hsv = function (args) { + return [0, 0, args[0]]; +}; + +convert$2.gray.hwb = function (gray) { + return [0, 100, gray[0]]; +}; + +convert$2.gray.cmyk = function (gray) { + return [0, 0, 0, gray[0]]; +}; + +convert$2.gray.lab = function (gray) { + return [gray[0], 0, 0]; +}; + +convert$2.gray.hex = function (gray) { + var val = Math.round(gray[0] / 100 * 255) & 0xFF; + var integer = (val << 16) + (val << 8) + val; + + var string = integer.toString(16).toUpperCase(); + return '000000'.substring(string.length) + string; +}; + +convert$2.rgb.gray = function (rgb) { + var val = (rgb[0] + rgb[1] + rgb[2]) / 3; + return [val / 255 * 100]; +}; + +var conversions$1 = conversions$2.exports; + +/* + this function routes a model to all other models. + + all functions that are routed have a property `.conversion` attached + to the returned synthetic function. This property is an array + of strings, each with the steps in between the 'from' and 'to' + color models (inclusive). + + conversions that are not possible simply are not included. +*/ + +function buildGraph() { + var graph = {}; + // https://jsperf.com/object-keys-vs-for-in-with-closure/3 + var models = Object.keys(conversions$1); + + for (var len = models.length, i = 0; i < len; i++) { + graph[models[i]] = { + // http://jsperf.com/1-vs-infinity + // micro-opt, but this is simple. + distance: -1, + parent: null + }; + } + + return graph; +} + +// https://en.wikipedia.org/wiki/Breadth-first_search +function deriveBFS(fromModel) { + var graph = buildGraph(); + var queue = [fromModel]; // unshift -> queue -> pop + + graph[fromModel].distance = 0; + + while (queue.length) { + var current = queue.pop(); + var adjacents = Object.keys(conversions$1[current]); + + for (var len = adjacents.length, i = 0; i < len; i++) { + var adjacent = adjacents[i]; + var node = graph[adjacent]; + + if (node.distance === -1) { + node.distance = graph[current].distance + 1; + node.parent = current; + queue.unshift(adjacent); + } + } + } + + return graph; +} + +function link$1(from, to) { + return function (args) { + return to(from(args)); + }; +} + +function wrapConversion(toModel, graph) { + var path = [graph[toModel].parent, toModel]; + var fn = conversions$1[graph[toModel].parent][toModel]; + + var cur = graph[toModel].parent; + while (graph[cur].parent) { + path.unshift(graph[cur].parent); + fn = link$1(conversions$1[graph[cur].parent][cur], fn); + cur = graph[cur].parent; + } + + fn.conversion = path; + return fn; +} + +var route$1 = function (fromModel) { + var graph = deriveBFS(fromModel); + var conversion = {}; + + var models = Object.keys(graph); + for (var len = models.length, i = 0; i < len; i++) { + var toModel = models[i]; + var node = graph[toModel]; + + if (node.parent === null) { + // no possible conversion, or this node is the source model. + continue; + } + + conversion[toModel] = wrapConversion(toModel, graph); + } + + return conversion; +}; + +var conversions = conversions$2.exports; +var route = route$1; + +var convert$1 = {}; + +var models = Object.keys(conversions); + +function wrapRaw(fn) { + var wrappedFn = function (args) { + if (args === undefined || args === null) { + return args; + } + + if (arguments.length > 1) { + args = Array.prototype.slice.call(arguments); + } + + return fn(args); + }; + + // preserve .conversion property if there is one + if ('conversion' in fn) { + wrappedFn.conversion = fn.conversion; + } + + return wrappedFn; +} + +function wrapRounded(fn) { + var wrappedFn = function (args) { + if (args === undefined || args === null) { + return args; + } + + if (arguments.length > 1) { + args = Array.prototype.slice.call(arguments); + } + + var result = fn(args); + + // we're assuming the result is an array here. + // see notice in conversions.js; don't use box types + // in conversion functions. + if (typeof result === 'object') { + for (var len = result.length, i = 0; i < len; i++) { + result[i] = Math.round(result[i]); + } + } + + return result; + }; + + // preserve .conversion property if there is one + if ('conversion' in fn) { + wrappedFn.conversion = fn.conversion; + } + + return wrappedFn; +} + +models.forEach(function (fromModel) { + convert$1[fromModel] = {}; + + Object.defineProperty(convert$1[fromModel], 'channels', {value: conversions[fromModel].channels}); + Object.defineProperty(convert$1[fromModel], 'labels', {value: conversions[fromModel].labels}); + + var routes = route(fromModel); + var routeModels = Object.keys(routes); + + routeModels.forEach(function (toModel) { + var fn = routes[toModel]; + + convert$1[fromModel][toModel] = wrapRounded(fn); + convert$1[fromModel][toModel].raw = wrapRaw(fn); + }); +}); + +var colorConvert = convert$1; + +var colorString = colorString$1.exports; +var convert = colorConvert; + +var _slice = [].slice; + +var skippedModels = [ + // to be honest, I don't really feel like keyword belongs in color convert, but eh. + 'keyword', + + // gray conflicts with some method names, and has its own method defined. + 'gray', + + // shouldn't really be in color-convert either... + 'hex' +]; + +var hashedModelKeys = {}; +Object.keys(convert).forEach(function (model) { + hashedModelKeys[_slice.call(convert[model].labels).sort().join('')] = model; +}); + +var limiters = {}; + +function Color(obj, model) { + if (!(this instanceof Color)) { + return new Color(obj, model); + } + + if (model && model in skippedModels) { + model = null; + } + + if (model && !(model in convert)) { + throw new Error('Unknown model: ' + model); + } + + var i; + var channels; + + if (obj == null) { // eslint-disable-line no-eq-null,eqeqeq + this.model = 'rgb'; + this.color = [0, 0, 0]; + this.valpha = 1; + } else if (obj instanceof Color) { + this.model = obj.model; + this.color = obj.color.slice(); + this.valpha = obj.valpha; + } else if (typeof obj === 'string') { + var result = colorString.get(obj); + if (result === null) { + throw new Error('Unable to parse color from string: ' + obj); + } + + this.model = result.model; + channels = convert[this.model].channels; + this.color = result.value.slice(0, channels); + this.valpha = typeof result.value[channels] === 'number' ? result.value[channels] : 1; + } else if (obj.length) { + this.model = model || 'rgb'; + channels = convert[this.model].channels; + var newArr = _slice.call(obj, 0, channels); + this.color = zeroArray(newArr, channels); + this.valpha = typeof obj[channels] === 'number' ? obj[channels] : 1; + } else if (typeof obj === 'number') { + // this is always RGB - can be converted later on. + obj &= 0xFFFFFF; + this.model = 'rgb'; + this.color = [ + (obj >> 16) & 0xFF, + (obj >> 8) & 0xFF, + obj & 0xFF + ]; + this.valpha = 1; + } else { + this.valpha = 1; + + var keys = Object.keys(obj); + if ('alpha' in obj) { + keys.splice(keys.indexOf('alpha'), 1); + this.valpha = typeof obj.alpha === 'number' ? obj.alpha : 0; + } + + var hashedKeys = keys.sort().join(''); + if (!(hashedKeys in hashedModelKeys)) { + throw new Error('Unable to parse color from object: ' + JSON.stringify(obj)); + } + + this.model = hashedModelKeys[hashedKeys]; + + var labels = convert[this.model].labels; + var color = []; + for (i = 0; i < labels.length; i++) { + color.push(obj[labels[i]]); + } + + this.color = zeroArray(color); + } + + // perform limitations (clamping, etc.) + if (limiters[this.model]) { + channels = convert[this.model].channels; + for (i = 0; i < channels; i++) { + var limit = limiters[this.model][i]; + if (limit) { + this.color[i] = limit(this.color[i]); + } + } + } + + this.valpha = Math.max(0, Math.min(1, this.valpha)); + + if (Object.freeze) { + Object.freeze(this); + } +} + +Color.prototype = { + toString: function () { + return this.string(); + }, + + toJSON: function () { + return this[this.model](); + }, + + string: function (places) { + var self = this.model in colorString.to ? this : this.rgb(); + self = self.round(typeof places === 'number' ? places : 1); + var args = self.valpha === 1 ? self.color : self.color.concat(this.valpha); + return colorString.to[self.model](args); + }, + + percentString: function (places) { + var self = this.rgb().round(typeof places === 'number' ? places : 1); + var args = self.valpha === 1 ? self.color : self.color.concat(this.valpha); + return colorString.to.rgb.percent(args); + }, + + array: function () { + return this.valpha === 1 ? this.color.slice() : this.color.concat(this.valpha); + }, + + object: function () { + var result = {}; + var channels = convert[this.model].channels; + var labels = convert[this.model].labels; + + for (var i = 0; i < channels; i++) { + result[labels[i]] = this.color[i]; + } + + if (this.valpha !== 1) { + result.alpha = this.valpha; + } + + return result; + }, + + unitArray: function () { + var rgb = this.rgb().color; + rgb[0] /= 255; + rgb[1] /= 255; + rgb[2] /= 255; + + if (this.valpha !== 1) { + rgb.push(this.valpha); + } + + return rgb; + }, + + unitObject: function () { + var rgb = this.rgb().object(); + rgb.r /= 255; + rgb.g /= 255; + rgb.b /= 255; + + if (this.valpha !== 1) { + rgb.alpha = this.valpha; + } + + return rgb; + }, + + round: function (places) { + places = Math.max(places || 0, 0); + return new Color(this.color.map(roundToPlace(places)).concat(this.valpha), this.model); + }, + + alpha: function (val) { + if (arguments.length) { + return new Color(this.color.concat(Math.max(0, Math.min(1, val))), this.model); + } + + return this.valpha; + }, + + // rgb + red: getset('rgb', 0, maxfn(255)), + green: getset('rgb', 1, maxfn(255)), + blue: getset('rgb', 2, maxfn(255)), + + hue: getset(['hsl', 'hsv', 'hsl', 'hwb', 'hcg'], 0, function (val) { return ((val % 360) + 360) % 360; }), // eslint-disable-line brace-style + + saturationl: getset('hsl', 1, maxfn(100)), + lightness: getset('hsl', 2, maxfn(100)), + + saturationv: getset('hsv', 1, maxfn(100)), + value: getset('hsv', 2, maxfn(100)), + + chroma: getset('hcg', 1, maxfn(100)), + gray: getset('hcg', 2, maxfn(100)), + + white: getset('hwb', 1, maxfn(100)), + wblack: getset('hwb', 2, maxfn(100)), + + cyan: getset('cmyk', 0, maxfn(100)), + magenta: getset('cmyk', 1, maxfn(100)), + yellow: getset('cmyk', 2, maxfn(100)), + black: getset('cmyk', 3, maxfn(100)), + + x: getset('xyz', 0, maxfn(100)), + y: getset('xyz', 1, maxfn(100)), + z: getset('xyz', 2, maxfn(100)), + + l: getset('lab', 0, maxfn(100)), + a: getset('lab', 1), + b: getset('lab', 2), + + keyword: function (val) { + if (arguments.length) { + return new Color(val); + } + + return convert[this.model].keyword(this.color); + }, + + hex: function (val) { + if (arguments.length) { + return new Color(val); + } + + return colorString.to.hex(this.rgb().round().color); + }, + + rgbNumber: function () { + var rgb = this.rgb().color; + return ((rgb[0] & 0xFF) << 16) | ((rgb[1] & 0xFF) << 8) | (rgb[2] & 0xFF); + }, + + luminosity: function () { + // http://www.w3.org/TR/WCAG20/#relativeluminancedef + var rgb = this.rgb().color; + + var lum = []; + for (var i = 0; i < rgb.length; i++) { + var chan = rgb[i] / 255; + lum[i] = (chan <= 0.03928) ? chan / 12.92 : Math.pow(((chan + 0.055) / 1.055), 2.4); + } + + return 0.2126 * lum[0] + 0.7152 * lum[1] + 0.0722 * lum[2]; + }, + + contrast: function (color2) { + // http://www.w3.org/TR/WCAG20/#contrast-ratiodef + var lum1 = this.luminosity(); + var lum2 = color2.luminosity(); + + if (lum1 > lum2) { + return (lum1 + 0.05) / (lum2 + 0.05); + } + + return (lum2 + 0.05) / (lum1 + 0.05); + }, + + level: function (color2) { + var contrastRatio = this.contrast(color2); + if (contrastRatio >= 7.1) { + return 'AAA'; + } + + return (contrastRatio >= 4.5) ? 'AA' : ''; + }, + + isDark: function () { + // YIQ equation from http://24ways.org/2010/calculating-color-contrast + var rgb = this.rgb().color; + var yiq = (rgb[0] * 299 + rgb[1] * 587 + rgb[2] * 114) / 1000; + return yiq < 128; + }, + + isLight: function () { + return !this.isDark(); + }, + + negate: function () { + var rgb = this.rgb(); + for (var i = 0; i < 3; i++) { + rgb.color[i] = 255 - rgb.color[i]; + } + return rgb; + }, + + lighten: function (ratio) { + var hsl = this.hsl(); + hsl.color[2] += hsl.color[2] * ratio; + return hsl; + }, + + darken: function (ratio) { + var hsl = this.hsl(); + hsl.color[2] -= hsl.color[2] * ratio; + return hsl; + }, + + saturate: function (ratio) { + var hsl = this.hsl(); + hsl.color[1] += hsl.color[1] * ratio; + return hsl; + }, + + desaturate: function (ratio) { + var hsl = this.hsl(); + hsl.color[1] -= hsl.color[1] * ratio; + return hsl; + }, + + whiten: function (ratio) { + var hwb = this.hwb(); + hwb.color[1] += hwb.color[1] * ratio; + return hwb; + }, + + blacken: function (ratio) { + var hwb = this.hwb(); + hwb.color[2] += hwb.color[2] * ratio; + return hwb; + }, + + grayscale: function () { + // http://en.wikipedia.org/wiki/Grayscale#Converting_color_to_grayscale + var rgb = this.rgb().color; + var val = rgb[0] * 0.3 + rgb[1] * 0.59 + rgb[2] * 0.11; + return Color.rgb(val, val, val); + }, + + fade: function (ratio) { + return this.alpha(this.valpha - (this.valpha * ratio)); + }, + + opaquer: function (ratio) { + return this.alpha(this.valpha + (this.valpha * ratio)); + }, + + rotate: function (degrees) { + var hsl = this.hsl(); + var hue = hsl.color[0]; + hue = (hue + degrees) % 360; + hue = hue < 0 ? 360 + hue : hue; + hsl.color[0] = hue; + return hsl; + }, + + mix: function (mixinColor, weight) { + // ported from sass implementation in C + // https://github.com/sass/libsass/blob/0e6b4a2850092356aa3ece07c6b249f0221caced/functions.cpp#L209 + if (!mixinColor || !mixinColor.rgb) { + throw new Error('Argument to "mix" was not a Color instance, but rather an instance of ' + typeof mixinColor); + } + var color1 = mixinColor.rgb(); + var color2 = this.rgb(); + var p = weight === undefined ? 0.5 : weight; + + var w = 2 * p - 1; + var a = color1.alpha() - color2.alpha(); + + var w1 = (((w * a === -1) ? w : (w + a) / (1 + w * a)) + 1) / 2.0; + var w2 = 1 - w1; + + return Color.rgb( + w1 * color1.red() + w2 * color2.red(), + w1 * color1.green() + w2 * color2.green(), + w1 * color1.blue() + w2 * color2.blue(), + color1.alpha() * p + color2.alpha() * (1 - p)); + } +}; + +// model conversion methods and static constructors +Object.keys(convert).forEach(function (model) { + if (skippedModels.indexOf(model) !== -1) { + return; + } + + var channels = convert[model].channels; + + // conversion methods + Color.prototype[model] = function () { + if (this.model === model) { + return new Color(this); + } + + if (arguments.length) { + return new Color(arguments, model); + } + + var newAlpha = typeof arguments[channels] === 'number' ? channels : this.valpha; + return new Color(assertArray(convert[this.model][model].raw(this.color)).concat(newAlpha), model); + }; + + // 'static' construction methods + Color[model] = function (color) { + if (typeof color === 'number') { + color = zeroArray(_slice.call(arguments), channels); + } + return new Color(color, model); + }; +}); + +function roundTo(num, places) { + return Number(num.toFixed(places)); +} + +function roundToPlace(places) { + return function (num) { + return roundTo(num, places); + }; +} + +function getset(model, channel, modifier) { + model = Array.isArray(model) ? model : [model]; + + model.forEach(function (m) { + (limiters[m] || (limiters[m] = []))[channel] = modifier; + }); + + model = model[0]; + + return function (val) { + var result; + + if (arguments.length) { + if (modifier) { + val = modifier(val); + } + + result = this[model](); + result.color[channel] = val; + return result; + } + + result = this[model]().color[channel]; + if (modifier) { + result = modifier(result); + } + + return result; + }; +} + +function maxfn(max) { + return function (v) { + return Math.max(0, Math.min(max, v)); + }; +} + +function assertArray(val) { + return Array.isArray(val) ? val : [val]; +} + +function zeroArray(arr, length) { + for (var i = 0; i < length; i++) { + if (typeof arr[i] !== 'number') { + arr[i] = 0; + } + } + + return arr; +} + +var color = Color; + +var tinycolor$1 = {exports: {}}; + +(function (module) { +// TinyColor v1.4.2 +// https://github.com/bgrins/TinyColor +// Brian Grinstead, MIT License + +(function(Math) { + +var trimLeft = /^\s+/, + trimRight = /\s+$/, + tinyCounter = 0, + mathRound = Math.round, + mathMin = Math.min, + mathMax = Math.max, + mathRandom = Math.random; + +function tinycolor (color, opts) { + + color = (color) ? color : ''; + opts = opts || { }; + + // If input is already a tinycolor, return itself + if (color instanceof tinycolor) { + return color; + } + // If we are called as a function, call using new instead + if (!(this instanceof tinycolor)) { + return new tinycolor(color, opts); + } + + var rgb = inputToRGB(color); + this._originalInput = color, + this._r = rgb.r, + this._g = rgb.g, + this._b = rgb.b, + this._a = rgb.a, + this._roundA = mathRound(100*this._a) / 100, + this._format = opts.format || rgb.format; + this._gradientType = opts.gradientType; + + // Don't let the range of [0,255] come back in [0,1]. + // Potentially lose a little bit of precision here, but will fix issues where + // .5 gets interpreted as half of the total, instead of half of 1 + // If it was supposed to be 128, this was already taken care of by `inputToRgb` + if (this._r < 1) { this._r = mathRound(this._r); } + if (this._g < 1) { this._g = mathRound(this._g); } + if (this._b < 1) { this._b = mathRound(this._b); } + + this._ok = rgb.ok; + this._tc_id = tinyCounter++; +} + +tinycolor.prototype = { + isDark: function() { + return this.getBrightness() < 128; + }, + isLight: function() { + return !this.isDark(); + }, + isValid: function() { + return this._ok; + }, + getOriginalInput: function() { + return this._originalInput; + }, + getFormat: function() { + return this._format; + }, + getAlpha: function() { + return this._a; + }, + getBrightness: function() { + //http://www.w3.org/TR/AERT#color-contrast + var rgb = this.toRgb(); + return (rgb.r * 299 + rgb.g * 587 + rgb.b * 114) / 1000; + }, + getLuminance: function() { + //http://www.w3.org/TR/2008/REC-WCAG20-20081211/#relativeluminancedef + var rgb = this.toRgb(); + var RsRGB, GsRGB, BsRGB, R, G, B; + RsRGB = rgb.r/255; + GsRGB = rgb.g/255; + BsRGB = rgb.b/255; + + if (RsRGB <= 0.03928) {R = RsRGB / 12.92;} else {R = Math.pow(((RsRGB + 0.055) / 1.055), 2.4);} + if (GsRGB <= 0.03928) {G = GsRGB / 12.92;} else {G = Math.pow(((GsRGB + 0.055) / 1.055), 2.4);} + if (BsRGB <= 0.03928) {B = BsRGB / 12.92;} else {B = Math.pow(((BsRGB + 0.055) / 1.055), 2.4);} + return (0.2126 * R) + (0.7152 * G) + (0.0722 * B); + }, + setAlpha: function(value) { + this._a = boundAlpha(value); + this._roundA = mathRound(100*this._a) / 100; + return this; + }, + toHsv: function() { + var hsv = rgbToHsv(this._r, this._g, this._b); + return { h: hsv.h * 360, s: hsv.s, v: hsv.v, a: this._a }; + }, + toHsvString: function() { + var hsv = rgbToHsv(this._r, this._g, this._b); + var h = mathRound(hsv.h * 360), s = mathRound(hsv.s * 100), v = mathRound(hsv.v * 100); + return (this._a == 1) ? + "hsv(" + h + ", " + s + "%, " + v + "%)" : + "hsva(" + h + ", " + s + "%, " + v + "%, "+ this._roundA + ")"; + }, + toHsl: function() { + var hsl = rgbToHsl(this._r, this._g, this._b); + return { h: hsl.h * 360, s: hsl.s, l: hsl.l, a: this._a }; + }, + toHslString: function() { + var hsl = rgbToHsl(this._r, this._g, this._b); + var h = mathRound(hsl.h * 360), s = mathRound(hsl.s * 100), l = mathRound(hsl.l * 100); + return (this._a == 1) ? + "hsl(" + h + ", " + s + "%, " + l + "%)" : + "hsla(" + h + ", " + s + "%, " + l + "%, "+ this._roundA + ")"; + }, + toHex: function(allow3Char) { + return rgbToHex(this._r, this._g, this._b, allow3Char); + }, + toHexString: function(allow3Char) { + return '#' + this.toHex(allow3Char); + }, + toHex8: function(allow4Char) { + return rgbaToHex(this._r, this._g, this._b, this._a, allow4Char); + }, + toHex8String: function(allow4Char) { + return '#' + this.toHex8(allow4Char); + }, + toRgb: function() { + return { r: mathRound(this._r), g: mathRound(this._g), b: mathRound(this._b), a: this._a }; + }, + toRgbString: function() { + return (this._a == 1) ? + "rgb(" + mathRound(this._r) + ", " + mathRound(this._g) + ", " + mathRound(this._b) + ")" : + "rgba(" + mathRound(this._r) + ", " + mathRound(this._g) + ", " + mathRound(this._b) + ", " + this._roundA + ")"; + }, + toPercentageRgb: function() { + return { r: mathRound(bound01(this._r, 255) * 100) + "%", g: mathRound(bound01(this._g, 255) * 100) + "%", b: mathRound(bound01(this._b, 255) * 100) + "%", a: this._a }; + }, + toPercentageRgbString: function() { + return (this._a == 1) ? + "rgb(" + mathRound(bound01(this._r, 255) * 100) + "%, " + mathRound(bound01(this._g, 255) * 100) + "%, " + mathRound(bound01(this._b, 255) * 100) + "%)" : + "rgba(" + mathRound(bound01(this._r, 255) * 100) + "%, " + mathRound(bound01(this._g, 255) * 100) + "%, " + mathRound(bound01(this._b, 255) * 100) + "%, " + this._roundA + ")"; + }, + toName: function() { + if (this._a === 0) { + return "transparent"; + } + + if (this._a < 1) { + return false; + } + + return hexNames[rgbToHex(this._r, this._g, this._b, true)] || false; + }, + toFilter: function(secondColor) { + var hex8String = '#' + rgbaToArgbHex(this._r, this._g, this._b, this._a); + var secondHex8String = hex8String; + var gradientType = this._gradientType ? "GradientType = 1, " : ""; + + if (secondColor) { + var s = tinycolor(secondColor); + secondHex8String = '#' + rgbaToArgbHex(s._r, s._g, s._b, s._a); + } + + return "progid:DXImageTransform.Microsoft.gradient("+gradientType+"startColorstr="+hex8String+",endColorstr="+secondHex8String+")"; + }, + toString: function(format) { + var formatSet = !!format; + format = format || this._format; + + var formattedString = false; + var hasAlpha = this._a < 1 && this._a >= 0; + var needsAlphaFormat = !formatSet && hasAlpha && (format === "hex" || format === "hex6" || format === "hex3" || format === "hex4" || format === "hex8" || format === "name"); + + if (needsAlphaFormat) { + // Special case for "transparent", all other non-alpha formats + // will return rgba when there is transparency. + if (format === "name" && this._a === 0) { + return this.toName(); + } + return this.toRgbString(); + } + if (format === "rgb") { + formattedString = this.toRgbString(); + } + if (format === "prgb") { + formattedString = this.toPercentageRgbString(); + } + if (format === "hex" || format === "hex6") { + formattedString = this.toHexString(); + } + if (format === "hex3") { + formattedString = this.toHexString(true); + } + if (format === "hex4") { + formattedString = this.toHex8String(true); + } + if (format === "hex8") { + formattedString = this.toHex8String(); + } + if (format === "name") { + formattedString = this.toName(); + } + if (format === "hsl") { + formattedString = this.toHslString(); + } + if (format === "hsv") { + formattedString = this.toHsvString(); + } + + return formattedString || this.toHexString(); + }, + clone: function() { + return tinycolor(this.toString()); + }, + + _applyModification: function(fn, args) { + var color = fn.apply(null, [this].concat([].slice.call(args))); + this._r = color._r; + this._g = color._g; + this._b = color._b; + this.setAlpha(color._a); + return this; + }, + lighten: function() { + return this._applyModification(lighten, arguments); + }, + brighten: function() { + return this._applyModification(brighten, arguments); + }, + darken: function() { + return this._applyModification(darken, arguments); + }, + desaturate: function() { + return this._applyModification(desaturate, arguments); + }, + saturate: function() { + return this._applyModification(saturate, arguments); + }, + greyscale: function() { + return this._applyModification(greyscale, arguments); + }, + spin: function() { + return this._applyModification(spin, arguments); + }, + + _applyCombination: function(fn, args) { + return fn.apply(null, [this].concat([].slice.call(args))); + }, + analogous: function() { + return this._applyCombination(analogous, arguments); + }, + complement: function() { + return this._applyCombination(complement, arguments); + }, + monochromatic: function() { + return this._applyCombination(monochromatic, arguments); + }, + splitcomplement: function() { + return this._applyCombination(splitcomplement, arguments); + }, + triad: function() { + return this._applyCombination(triad, arguments); + }, + tetrad: function() { + return this._applyCombination(tetrad, arguments); + } +}; + +// If input is an object, force 1 into "1.0" to handle ratios properly +// String input requires "1.0" as input, so 1 will be treated as 1 +tinycolor.fromRatio = function(color, opts) { + if (typeof color == "object") { + var newColor = {}; + for (var i in color) { + if (color.hasOwnProperty(i)) { + if (i === "a") { + newColor[i] = color[i]; + } + else { + newColor[i] = convertToPercentage(color[i]); + } + } + } + color = newColor; + } + + return tinycolor(color, opts); +}; + +// Given a string or object, convert that input to RGB +// Possible string inputs: +// +// "red" +// "#f00" or "f00" +// "#ff0000" or "ff0000" +// "#ff000000" or "ff000000" +// "rgb 255 0 0" or "rgb (255, 0, 0)" +// "rgb 1.0 0 0" or "rgb (1, 0, 0)" +// "rgba (255, 0, 0, 1)" or "rgba 255, 0, 0, 1" +// "rgba (1.0, 0, 0, 1)" or "rgba 1.0, 0, 0, 1" +// "hsl(0, 100%, 50%)" or "hsl 0 100% 50%" +// "hsla(0, 100%, 50%, 1)" or "hsla 0 100% 50%, 1" +// "hsv(0, 100%, 100%)" or "hsv 0 100% 100%" +// +function inputToRGB(color) { + + var rgb = { r: 0, g: 0, b: 0 }; + var a = 1; + var s = null; + var v = null; + var l = null; + var ok = false; + var format = false; + + if (typeof color == "string") { + color = stringInputToObject(color); + } + + if (typeof color == "object") { + if (isValidCSSUnit(color.r) && isValidCSSUnit(color.g) && isValidCSSUnit(color.b)) { + rgb = rgbToRgb(color.r, color.g, color.b); + ok = true; + format = String(color.r).substr(-1) === "%" ? "prgb" : "rgb"; + } + else if (isValidCSSUnit(color.h) && isValidCSSUnit(color.s) && isValidCSSUnit(color.v)) { + s = convertToPercentage(color.s); + v = convertToPercentage(color.v); + rgb = hsvToRgb(color.h, s, v); + ok = true; + format = "hsv"; + } + else if (isValidCSSUnit(color.h) && isValidCSSUnit(color.s) && isValidCSSUnit(color.l)) { + s = convertToPercentage(color.s); + l = convertToPercentage(color.l); + rgb = hslToRgb(color.h, s, l); + ok = true; + format = "hsl"; + } + + if (color.hasOwnProperty("a")) { + a = color.a; + } + } + + a = boundAlpha(a); + + return { + ok: ok, + format: color.format || format, + r: mathMin(255, mathMax(rgb.r, 0)), + g: mathMin(255, mathMax(rgb.g, 0)), + b: mathMin(255, mathMax(rgb.b, 0)), + a: a + }; +} + + +// Conversion Functions +// -------------------- + +// `rgbToHsl`, `rgbToHsv`, `hslToRgb`, `hsvToRgb` modified from: +// + +// `rgbToRgb` +// Handle bounds / percentage checking to conform to CSS color spec +// +// *Assumes:* r, g, b in [0, 255] or [0, 1] +// *Returns:* { r, g, b } in [0, 255] +function rgbToRgb(r, g, b){ + return { + r: bound01(r, 255) * 255, + g: bound01(g, 255) * 255, + b: bound01(b, 255) * 255 + }; +} + +// `rgbToHsl` +// Converts an RGB color value to HSL. +// *Assumes:* r, g, and b are contained in [0, 255] or [0, 1] +// *Returns:* { h, s, l } in [0,1] +function rgbToHsl(r, g, b) { + + r = bound01(r, 255); + g = bound01(g, 255); + b = bound01(b, 255); + + var max = mathMax(r, g, b), min = mathMin(r, g, b); + var h, s, l = (max + min) / 2; + + if(max == min) { + h = s = 0; // achromatic + } + else { + var d = max - min; + s = l > 0.5 ? d / (2 - max - min) : d / (max + min); + switch(max) { + case r: h = (g - b) / d + (g < b ? 6 : 0); break; + case g: h = (b - r) / d + 2; break; + case b: h = (r - g) / d + 4; break; + } + + h /= 6; + } + + return { h: h, s: s, l: l }; +} + +// `hslToRgb` +// Converts an HSL color value to RGB. +// *Assumes:* h is contained in [0, 1] or [0, 360] and s and l are contained [0, 1] or [0, 100] +// *Returns:* { r, g, b } in the set [0, 255] +function hslToRgb(h, s, l) { + var r, g, b; + + h = bound01(h, 360); + s = bound01(s, 100); + l = bound01(l, 100); + + function hue2rgb(p, q, t) { + if(t < 0) t += 1; + if(t > 1) t -= 1; + if(t < 1/6) return p + (q - p) * 6 * t; + if(t < 1/2) return q; + if(t < 2/3) return p + (q - p) * (2/3 - t) * 6; + return p; + } + + if(s === 0) { + r = g = b = l; // achromatic + } + else { + var q = l < 0.5 ? l * (1 + s) : l + s - l * s; + var p = 2 * l - q; + r = hue2rgb(p, q, h + 1/3); + g = hue2rgb(p, q, h); + b = hue2rgb(p, q, h - 1/3); + } + + return { r: r * 255, g: g * 255, b: b * 255 }; +} + +// `rgbToHsv` +// Converts an RGB color value to HSV +// *Assumes:* r, g, and b are contained in the set [0, 255] or [0, 1] +// *Returns:* { h, s, v } in [0,1] +function rgbToHsv(r, g, b) { + + r = bound01(r, 255); + g = bound01(g, 255); + b = bound01(b, 255); + + var max = mathMax(r, g, b), min = mathMin(r, g, b); + var h, s, v = max; + + var d = max - min; + s = max === 0 ? 0 : d / max; + + if(max == min) { + h = 0; // achromatic + } + else { + switch(max) { + case r: h = (g - b) / d + (g < b ? 6 : 0); break; + case g: h = (b - r) / d + 2; break; + case b: h = (r - g) / d + 4; break; + } + h /= 6; + } + return { h: h, s: s, v: v }; +} + +// `hsvToRgb` +// Converts an HSV color value to RGB. +// *Assumes:* h is contained in [0, 1] or [0, 360] and s and v are contained in [0, 1] or [0, 100] +// *Returns:* { r, g, b } in the set [0, 255] + function hsvToRgb(h, s, v) { + + h = bound01(h, 360) * 6; + s = bound01(s, 100); + v = bound01(v, 100); + + var i = Math.floor(h), + f = h - i, + p = v * (1 - s), + q = v * (1 - f * s), + t = v * (1 - (1 - f) * s), + mod = i % 6, + r = [v, q, p, p, t, v][mod], + g = [t, v, v, q, p, p][mod], + b = [p, p, t, v, v, q][mod]; + + return { r: r * 255, g: g * 255, b: b * 255 }; +} + +// `rgbToHex` +// Converts an RGB color to hex +// Assumes r, g, and b are contained in the set [0, 255] +// Returns a 3 or 6 character hex +function rgbToHex(r, g, b, allow3Char) { + + var hex = [ + pad2(mathRound(r).toString(16)), + pad2(mathRound(g).toString(16)), + pad2(mathRound(b).toString(16)) + ]; + + // Return a 3 character hex if possible + if (allow3Char && hex[0].charAt(0) == hex[0].charAt(1) && hex[1].charAt(0) == hex[1].charAt(1) && hex[2].charAt(0) == hex[2].charAt(1)) { + return hex[0].charAt(0) + hex[1].charAt(0) + hex[2].charAt(0); + } + + return hex.join(""); +} + +// `rgbaToHex` +// Converts an RGBA color plus alpha transparency to hex +// Assumes r, g, b are contained in the set [0, 255] and +// a in [0, 1]. Returns a 4 or 8 character rgba hex +function rgbaToHex(r, g, b, a, allow4Char) { + + var hex = [ + pad2(mathRound(r).toString(16)), + pad2(mathRound(g).toString(16)), + pad2(mathRound(b).toString(16)), + pad2(convertDecimalToHex(a)) + ]; + + // Return a 4 character hex if possible + if (allow4Char && hex[0].charAt(0) == hex[0].charAt(1) && hex[1].charAt(0) == hex[1].charAt(1) && hex[2].charAt(0) == hex[2].charAt(1) && hex[3].charAt(0) == hex[3].charAt(1)) { + return hex[0].charAt(0) + hex[1].charAt(0) + hex[2].charAt(0) + hex[3].charAt(0); + } + + return hex.join(""); +} + +// `rgbaToArgbHex` +// Converts an RGBA color to an ARGB Hex8 string +// Rarely used, but required for "toFilter()" +function rgbaToArgbHex(r, g, b, a) { + + var hex = [ + pad2(convertDecimalToHex(a)), + pad2(mathRound(r).toString(16)), + pad2(mathRound(g).toString(16)), + pad2(mathRound(b).toString(16)) + ]; + + return hex.join(""); +} + +// `equals` +// Can be called with any tinycolor input +tinycolor.equals = function (color1, color2) { + if (!color1 || !color2) { return false; } + return tinycolor(color1).toRgbString() == tinycolor(color2).toRgbString(); +}; + +tinycolor.random = function() { + return tinycolor.fromRatio({ + r: mathRandom(), + g: mathRandom(), + b: mathRandom() + }); +}; + + +// Modification Functions +// ---------------------- +// Thanks to less.js for some of the basics here +// + +function desaturate(color, amount) { + amount = (amount === 0) ? 0 : (amount || 10); + var hsl = tinycolor(color).toHsl(); + hsl.s -= amount / 100; + hsl.s = clamp01(hsl.s); + return tinycolor(hsl); +} + +function saturate(color, amount) { + amount = (amount === 0) ? 0 : (amount || 10); + var hsl = tinycolor(color).toHsl(); + hsl.s += amount / 100; + hsl.s = clamp01(hsl.s); + return tinycolor(hsl); +} + +function greyscale(color) { + return tinycolor(color).desaturate(100); +} + +function lighten (color, amount) { + amount = (amount === 0) ? 0 : (amount || 10); + var hsl = tinycolor(color).toHsl(); + hsl.l += amount / 100; + hsl.l = clamp01(hsl.l); + return tinycolor(hsl); +} + +function brighten(color, amount) { + amount = (amount === 0) ? 0 : (amount || 10); + var rgb = tinycolor(color).toRgb(); + rgb.r = mathMax(0, mathMin(255, rgb.r - mathRound(255 * - (amount / 100)))); + rgb.g = mathMax(0, mathMin(255, rgb.g - mathRound(255 * - (amount / 100)))); + rgb.b = mathMax(0, mathMin(255, rgb.b - mathRound(255 * - (amount / 100)))); + return tinycolor(rgb); +} + +function darken (color, amount) { + amount = (amount === 0) ? 0 : (amount || 10); + var hsl = tinycolor(color).toHsl(); + hsl.l -= amount / 100; + hsl.l = clamp01(hsl.l); + return tinycolor(hsl); +} + +// Spin takes a positive or negative amount within [-360, 360] indicating the change of hue. +// Values outside of this range will be wrapped into this range. +function spin(color, amount) { + var hsl = tinycolor(color).toHsl(); + var hue = (hsl.h + amount) % 360; + hsl.h = hue < 0 ? 360 + hue : hue; + return tinycolor(hsl); +} + +// Combination Functions +// --------------------- +// Thanks to jQuery xColor for some of the ideas behind these +// + +function complement(color) { + var hsl = tinycolor(color).toHsl(); + hsl.h = (hsl.h + 180) % 360; + return tinycolor(hsl); +} + +function triad(color) { + var hsl = tinycolor(color).toHsl(); + var h = hsl.h; + return [ + tinycolor(color), + tinycolor({ h: (h + 120) % 360, s: hsl.s, l: hsl.l }), + tinycolor({ h: (h + 240) % 360, s: hsl.s, l: hsl.l }) + ]; +} + +function tetrad(color) { + var hsl = tinycolor(color).toHsl(); + var h = hsl.h; + return [ + tinycolor(color), + tinycolor({ h: (h + 90) % 360, s: hsl.s, l: hsl.l }), + tinycolor({ h: (h + 180) % 360, s: hsl.s, l: hsl.l }), + tinycolor({ h: (h + 270) % 360, s: hsl.s, l: hsl.l }) + ]; +} + +function splitcomplement(color) { + var hsl = tinycolor(color).toHsl(); + var h = hsl.h; + return [ + tinycolor(color), + tinycolor({ h: (h + 72) % 360, s: hsl.s, l: hsl.l}), + tinycolor({ h: (h + 216) % 360, s: hsl.s, l: hsl.l}) + ]; +} + +function analogous(color, results, slices) { + results = results || 6; + slices = slices || 30; + + var hsl = tinycolor(color).toHsl(); + var part = 360 / slices; + var ret = [tinycolor(color)]; + + for (hsl.h = ((hsl.h - (part * results >> 1)) + 720) % 360; --results; ) { + hsl.h = (hsl.h + part) % 360; + ret.push(tinycolor(hsl)); + } + return ret; +} + +function monochromatic(color, results) { + results = results || 6; + var hsv = tinycolor(color).toHsv(); + var h = hsv.h, s = hsv.s, v = hsv.v; + var ret = []; + var modification = 1 / results; + + while (results--) { + ret.push(tinycolor({ h: h, s: s, v: v})); + v = (v + modification) % 1; + } + + return ret; +} + +// Utility Functions +// --------------------- + +tinycolor.mix = function(color1, color2, amount) { + amount = (amount === 0) ? 0 : (amount || 50); + + var rgb1 = tinycolor(color1).toRgb(); + var rgb2 = tinycolor(color2).toRgb(); + + var p = amount / 100; + + var rgba = { + r: ((rgb2.r - rgb1.r) * p) + rgb1.r, + g: ((rgb2.g - rgb1.g) * p) + rgb1.g, + b: ((rgb2.b - rgb1.b) * p) + rgb1.b, + a: ((rgb2.a - rgb1.a) * p) + rgb1.a + }; + + return tinycolor(rgba); +}; + + +// Readability Functions +// --------------------- +// false +// tinycolor.isReadable("#000", "#111",{level:"AA",size:"large"}) => false +tinycolor.isReadable = function(color1, color2, wcag2) { + var readability = tinycolor.readability(color1, color2); + var wcag2Parms, out; + + out = false; + + wcag2Parms = validateWCAG2Parms(wcag2); + switch (wcag2Parms.level + wcag2Parms.size) { + case "AAsmall": + case "AAAlarge": + out = readability >= 4.5; + break; + case "AAlarge": + out = readability >= 3; + break; + case "AAAsmall": + out = readability >= 7; + break; + } + return out; + +}; + +// `mostReadable` +// Given a base color and a list of possible foreground or background +// colors for that base, returns the most readable color. +// Optionally returns Black or White if the most readable color is unreadable. +// *Example* +// tinycolor.mostReadable(tinycolor.mostReadable("#123", ["#124", "#125"],{includeFallbackColors:false}).toHexString(); // "#112255" +// tinycolor.mostReadable(tinycolor.mostReadable("#123", ["#124", "#125"],{includeFallbackColors:true}).toHexString(); // "#ffffff" +// tinycolor.mostReadable("#a8015a", ["#faf3f3"],{includeFallbackColors:true,level:"AAA",size:"large"}).toHexString(); // "#faf3f3" +// tinycolor.mostReadable("#a8015a", ["#faf3f3"],{includeFallbackColors:true,level:"AAA",size:"small"}).toHexString(); // "#ffffff" +tinycolor.mostReadable = function(baseColor, colorList, args) { + var bestColor = null; + var bestScore = 0; + var readability; + var includeFallbackColors, level, size ; + args = args || {}; + includeFallbackColors = args.includeFallbackColors ; + level = args.level; + size = args.size; + + for (var i= 0; i < colorList.length ; i++) { + readability = tinycolor.readability(baseColor, colorList[i]); + if (readability > bestScore) { + bestScore = readability; + bestColor = tinycolor(colorList[i]); + } + } + + if (tinycolor.isReadable(baseColor, bestColor, {"level":level,"size":size}) || !includeFallbackColors) { + return bestColor; + } + else { + args.includeFallbackColors=false; + return tinycolor.mostReadable(baseColor,["#fff", "#000"],args); + } +}; + + +// Big List of Colors +// ------------------ +// +var names = tinycolor.names = { + aliceblue: "f0f8ff", + antiquewhite: "faebd7", + aqua: "0ff", + aquamarine: "7fffd4", + azure: "f0ffff", + beige: "f5f5dc", + bisque: "ffe4c4", + black: "000", + blanchedalmond: "ffebcd", + blue: "00f", + blueviolet: "8a2be2", + brown: "a52a2a", + burlywood: "deb887", + burntsienna: "ea7e5d", + cadetblue: "5f9ea0", + chartreuse: "7fff00", + chocolate: "d2691e", + coral: "ff7f50", + cornflowerblue: "6495ed", + cornsilk: "fff8dc", + crimson: "dc143c", + cyan: "0ff", + darkblue: "00008b", + darkcyan: "008b8b", + darkgoldenrod: "b8860b", + darkgray: "a9a9a9", + darkgreen: "006400", + darkgrey: "a9a9a9", + darkkhaki: "bdb76b", + darkmagenta: "8b008b", + darkolivegreen: "556b2f", + darkorange: "ff8c00", + darkorchid: "9932cc", + darkred: "8b0000", + darksalmon: "e9967a", + darkseagreen: "8fbc8f", + darkslateblue: "483d8b", + darkslategray: "2f4f4f", + darkslategrey: "2f4f4f", + darkturquoise: "00ced1", + darkviolet: "9400d3", + deeppink: "ff1493", + deepskyblue: "00bfff", + dimgray: "696969", + dimgrey: "696969", + dodgerblue: "1e90ff", + firebrick: "b22222", + floralwhite: "fffaf0", + forestgreen: "228b22", + fuchsia: "f0f", + gainsboro: "dcdcdc", + ghostwhite: "f8f8ff", + gold: "ffd700", + goldenrod: "daa520", + gray: "808080", + green: "008000", + greenyellow: "adff2f", + grey: "808080", + honeydew: "f0fff0", + hotpink: "ff69b4", + indianred: "cd5c5c", + indigo: "4b0082", + ivory: "fffff0", + khaki: "f0e68c", + lavender: "e6e6fa", + lavenderblush: "fff0f5", + lawngreen: "7cfc00", + lemonchiffon: "fffacd", + lightblue: "add8e6", + lightcoral: "f08080", + lightcyan: "e0ffff", + lightgoldenrodyellow: "fafad2", + lightgray: "d3d3d3", + lightgreen: "90ee90", + lightgrey: "d3d3d3", + lightpink: "ffb6c1", + lightsalmon: "ffa07a", + lightseagreen: "20b2aa", + lightskyblue: "87cefa", + lightslategray: "789", + lightslategrey: "789", + lightsteelblue: "b0c4de", + lightyellow: "ffffe0", + lime: "0f0", + limegreen: "32cd32", + linen: "faf0e6", + magenta: "f0f", + maroon: "800000", + mediumaquamarine: "66cdaa", + mediumblue: "0000cd", + mediumorchid: "ba55d3", + mediumpurple: "9370db", + mediumseagreen: "3cb371", + mediumslateblue: "7b68ee", + mediumspringgreen: "00fa9a", + mediumturquoise: "48d1cc", + mediumvioletred: "c71585", + midnightblue: "191970", + mintcream: "f5fffa", + mistyrose: "ffe4e1", + moccasin: "ffe4b5", + navajowhite: "ffdead", + navy: "000080", + oldlace: "fdf5e6", + olive: "808000", + olivedrab: "6b8e23", + orange: "ffa500", + orangered: "ff4500", + orchid: "da70d6", + palegoldenrod: "eee8aa", + palegreen: "98fb98", + paleturquoise: "afeeee", + palevioletred: "db7093", + papayawhip: "ffefd5", + peachpuff: "ffdab9", + peru: "cd853f", + pink: "ffc0cb", + plum: "dda0dd", + powderblue: "b0e0e6", + purple: "800080", + rebeccapurple: "663399", + red: "f00", + rosybrown: "bc8f8f", + royalblue: "4169e1", + saddlebrown: "8b4513", + salmon: "fa8072", + sandybrown: "f4a460", + seagreen: "2e8b57", + seashell: "fff5ee", + sienna: "a0522d", + silver: "c0c0c0", + skyblue: "87ceeb", + slateblue: "6a5acd", + slategray: "708090", + slategrey: "708090", + snow: "fffafa", + springgreen: "00ff7f", + steelblue: "4682b4", + tan: "d2b48c", + teal: "008080", + thistle: "d8bfd8", + tomato: "ff6347", + turquoise: "40e0d0", + violet: "ee82ee", + wheat: "f5deb3", + white: "fff", + whitesmoke: "f5f5f5", + yellow: "ff0", + yellowgreen: "9acd32" +}; + +// Make it easy to access colors via `hexNames[hex]` +var hexNames = tinycolor.hexNames = flip(names); + + +// Utilities +// --------- + +// `{ 'name1': 'val1' }` becomes `{ 'val1': 'name1' }` +function flip(o) { + var flipped = { }; + for (var i in o) { + if (o.hasOwnProperty(i)) { + flipped[o[i]] = i; + } + } + return flipped; +} + +// Return a valid alpha value [0,1] with all invalid values being set to 1 +function boundAlpha(a) { + a = parseFloat(a); + + if (isNaN(a) || a < 0 || a > 1) { + a = 1; + } + + return a; +} + +// Take input from [0, n] and return it as [0, 1] +function bound01(n, max) { + if (isOnePointZero(n)) { n = "100%"; } + + var processPercent = isPercentage(n); + n = mathMin(max, mathMax(0, parseFloat(n))); + + // Automatically convert percentage into number + if (processPercent) { + n = parseInt(n * max, 10) / 100; + } + + // Handle floating point rounding errors + if ((Math.abs(n - max) < 0.000001)) { + return 1; + } + + // Convert into [0, 1] range if it isn't already + return (n % max) / parseFloat(max); +} + +// Force a number between 0 and 1 +function clamp01(val) { + return mathMin(1, mathMax(0, val)); +} + +// Parse a base-16 hex value into a base-10 integer +function parseIntFromHex(val) { + return parseInt(val, 16); +} + +// Need to handle 1.0 as 100%, since once it is a number, there is no difference between it and 1 +// +function isOnePointZero(n) { + return typeof n == "string" && n.indexOf('.') != -1 && parseFloat(n) === 1; +} + +// Check to see if string passed in is a percentage +function isPercentage(n) { + return typeof n === "string" && n.indexOf('%') != -1; +} + +// Force a hex value to have 2 characters +function pad2(c) { + return c.length == 1 ? '0' + c : '' + c; +} + +// Replace a decimal with it's percentage value +function convertToPercentage(n) { + if (n <= 1) { + n = (n * 100) + "%"; + } + + return n; +} + +// Converts a decimal to a hex value +function convertDecimalToHex(d) { + return Math.round(parseFloat(d) * 255).toString(16); +} +// Converts a hex value to a decimal +function convertHexToDecimal(h) { + return (parseIntFromHex(h) / 255); +} + +var matchers = (function() { + + // + var CSS_INTEGER = "[-\\+]?\\d+%?"; + + // + var CSS_NUMBER = "[-\\+]?\\d*\\.\\d+%?"; + + // Allow positive/negative integer/number. Don't capture the either/or, just the entire outcome. + var CSS_UNIT = "(?:" + CSS_NUMBER + ")|(?:" + CSS_INTEGER + ")"; + + // Actual matching. + // Parentheses and commas are optional, but not required. + // Whitespace can take the place of commas or opening paren + var PERMISSIVE_MATCH3 = "[\\s|\\(]+(" + CSS_UNIT + ")[,|\\s]+(" + CSS_UNIT + ")[,|\\s]+(" + CSS_UNIT + ")\\s*\\)?"; + var PERMISSIVE_MATCH4 = "[\\s|\\(]+(" + CSS_UNIT + ")[,|\\s]+(" + CSS_UNIT + ")[,|\\s]+(" + CSS_UNIT + ")[,|\\s]+(" + CSS_UNIT + ")\\s*\\)?"; + + return { + CSS_UNIT: new RegExp(CSS_UNIT), + rgb: new RegExp("rgb" + PERMISSIVE_MATCH3), + rgba: new RegExp("rgba" + PERMISSIVE_MATCH4), + hsl: new RegExp("hsl" + PERMISSIVE_MATCH3), + hsla: new RegExp("hsla" + PERMISSIVE_MATCH4), + hsv: new RegExp("hsv" + PERMISSIVE_MATCH3), + hsva: new RegExp("hsva" + PERMISSIVE_MATCH4), + hex3: /^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/, + hex6: /^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/, + hex4: /^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/, + hex8: /^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/ + }; +})(); + +// `isValidCSSUnit` +// Take in a single string / number and check to see if it looks like a CSS unit +// (see `matchers` above for definition). +function isValidCSSUnit(color) { + return !!matchers.CSS_UNIT.exec(color); +} + +// `stringInputToObject` +// Permissive string parsing. Take in a number of formats, and output an object +// based on detected format. Returns `{ r, g, b }` or `{ h, s, l }` or `{ h, s, v}` +function stringInputToObject(color) { + + color = color.replace(trimLeft,'').replace(trimRight, '').toLowerCase(); + var named = false; + if (names[color]) { + color = names[color]; + named = true; + } + else if (color == 'transparent') { + return { r: 0, g: 0, b: 0, a: 0, format: "name" }; + } + + // Try to match string input using regular expressions. + // Keep most of the number bounding out of this function - don't worry about [0,1] or [0,100] or [0,360] + // Just return an object and let the conversion functions handle that. + // This way the result will be the same whether the tinycolor is initialized with string or object. + var match; + if ((match = matchers.rgb.exec(color))) { + return { r: match[1], g: match[2], b: match[3] }; + } + if ((match = matchers.rgba.exec(color))) { + return { r: match[1], g: match[2], b: match[3], a: match[4] }; + } + if ((match = matchers.hsl.exec(color))) { + return { h: match[1], s: match[2], l: match[3] }; + } + if ((match = matchers.hsla.exec(color))) { + return { h: match[1], s: match[2], l: match[3], a: match[4] }; + } + if ((match = matchers.hsv.exec(color))) { + return { h: match[1], s: match[2], v: match[3] }; + } + if ((match = matchers.hsva.exec(color))) { + return { h: match[1], s: match[2], v: match[3], a: match[4] }; + } + if ((match = matchers.hex8.exec(color))) { + return { + r: parseIntFromHex(match[1]), + g: parseIntFromHex(match[2]), + b: parseIntFromHex(match[3]), + a: convertHexToDecimal(match[4]), + format: named ? "name" : "hex8" + }; + } + if ((match = matchers.hex6.exec(color))) { + return { + r: parseIntFromHex(match[1]), + g: parseIntFromHex(match[2]), + b: parseIntFromHex(match[3]), + format: named ? "name" : "hex" + }; + } + if ((match = matchers.hex4.exec(color))) { + return { + r: parseIntFromHex(match[1] + '' + match[1]), + g: parseIntFromHex(match[2] + '' + match[2]), + b: parseIntFromHex(match[3] + '' + match[3]), + a: convertHexToDecimal(match[4] + '' + match[4]), + format: named ? "name" : "hex8" + }; + } + if ((match = matchers.hex3.exec(color))) { + return { + r: parseIntFromHex(match[1] + '' + match[1]), + g: parseIntFromHex(match[2] + '' + match[2]), + b: parseIntFromHex(match[3] + '' + match[3]), + format: named ? "name" : "hex" + }; + } + + return false; +} + +function validateWCAG2Parms(parms) { + // return valid WCAG2 parms for isReadable. + // If input parms are invalid, return {"level":"AA", "size":"small"} + var level, size; + parms = parms || {"level":"AA", "size":"small"}; + level = (parms.level || "AA").toUpperCase(); + size = (parms.size || "small").toLowerCase(); + if (level !== "AA" && level !== "AAA") { + level = "AA"; + } + if (size !== "small" && size !== "large") { + size = "small"; + } + return {"level":level, "size":size}; +} + +// Node: Export function +if (module.exports) { + module.exports = tinycolor; +} +// AMD/requirejs: Define the module +else { + window.tinycolor = tinycolor; +} + +})(Math); +}(tinycolor$1)); + +var tinycolor = tinycolor$1.exports; + +var hueStep = 2; // 色相阶梯 + +var saturationStep = 0.16; // 饱和度阶梯，浅色部分 + +var saturationStep2 = 0.05; // 饱和度阶梯，深色部分 + +var brightnessStep1 = 0.05; // 亮度阶梯，浅色部分 + +var brightnessStep2 = 0.15; // 亮度阶梯，深色部分 + +var lightColorCount = 5; // 浅色数量，主色上 + +var darkColorCount = 4; // 深色数量，主色下 +// 暗色主题颜色映射关系表 + +var darkColorMap = [{ + index: 7, + opacity: 0.15 +}, { + index: 6, + opacity: 0.25 +}, { + index: 5, + opacity: 0.3 +}, { + index: 5, + opacity: 0.45 +}, { + index: 5, + opacity: 0.65 +}, { + index: 5, + opacity: 0.85 +}, { + index: 4, + opacity: 0.9 +}, { + index: 3, + opacity: 0.95 +}, { + index: 2, + opacity: 0.97 +}, { + index: 1, + opacity: 0.98 +}]; + +function getHue(hsv, i, light) { + var hue; // 根据色相不同，色相转向不同 + + if (Math.round(hsv.h) >= 60 && Math.round(hsv.h) <= 240) { + hue = light ? Math.round(hsv.h) - hueStep * i : Math.round(hsv.h) + hueStep * i; + } else { + hue = light ? Math.round(hsv.h) + hueStep * i : Math.round(hsv.h) - hueStep * i; + } + + if (hue < 0) { + hue += 360; + } else if (hue >= 360) { + hue -= 360; + } + + return hue; +} + +function getSaturation(hsv, i, light) { + // grey color don't change saturation + if (hsv.h === 0 && hsv.s === 0) { + return hsv.s; + } + + var saturation; + + if (light) { + saturation = hsv.s - saturationStep * i; + } else if (i === darkColorCount) { + saturation = hsv.s + saturationStep; + } else { + saturation = hsv.s + saturationStep2 * i; + } // 边界值修正 + + + if (saturation > 1) { + saturation = 1; + } // 第一格的 s 限制在 0.06-0.1 之间 + + + if (light && i === lightColorCount && saturation > 0.1) { + saturation = 0.1; + } + + if (saturation < 0.06) { + saturation = 0.06; + } + + return Number(saturation.toFixed(2)); +} + +function getValue$2(hsv, i, light) { + var value; + + if (light) { + value = hsv.v + brightnessStep1 * i; + } else { + value = hsv.v - brightnessStep2 * i; + } + + if (value > 1) { + value = 1; + } + + return Number(value.toFixed(2)); +} + +function generate(color) { + var opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; + var patterns = []; + var pColor = tinycolor(color); + + for (var i = lightColorCount; i > 0; i -= 1) { + var hsv = pColor.toHsv(); + var colorString = tinycolor({ + h: getHue(hsv, i, true), + s: getSaturation(hsv, i, true), + v: getValue$2(hsv, i, true) + }).toHexString(); + patterns.push(colorString); + } + + patterns.push(pColor.toHexString()); + + for (var _i = 1; _i <= darkColorCount; _i += 1) { + var _hsv = pColor.toHsv(); + + var _colorString = tinycolor({ + h: getHue(_hsv, _i), + s: getSaturation(_hsv, _i), + v: getValue$2(_hsv, _i) + }).toHexString(); + + patterns.push(_colorString); + } // dark theme patterns + + + if (opts.theme === 'dark') { + return darkColorMap.map(function (_ref) { + var index = _ref.index, + opacity = _ref.opacity; + var darkColorString = tinycolor.mix(opts.backgroundColor || '#141414', patterns[index], opacity * 100).toHexString(); + return darkColorString; + }); + } + + return patterns; +} + +var presetPrimaryColors = { + red: '#F5222D', + volcano: '#FA541C', + orange: '#FA8C16', + gold: '#FAAD14', + yellow: '#FADB14', + lime: '#A0D911', + green: '#52C41A', + cyan: '#13C2C2', + blue: '#1890FF', + geekblue: '#2F54EB', + purple: '#722ED1', + magenta: '#EB2F96', + grey: '#666666' +}; +var presetPalettes = {}; +var presetDarkPalettes = {}; +Object.keys(presetPrimaryColors).forEach(function (key) { + presetPalettes[key] = generate(presetPrimaryColors[key]); + presetPalettes[key].primary = presetPalettes[key][5]; // dark presetPalettes + + presetDarkPalettes[key] = generate(presetPrimaryColors[key], { + theme: 'dark', + backgroundColor: '#141414' + }); + presetDarkPalettes[key].primary = presetDarkPalettes[key][5]; +}); +presetPalettes.red; +presetPalettes.volcano; +presetPalettes.gold; +presetPalettes.orange; +presetPalettes.yellow; +presetPalettes.lime; +presetPalettes.green; +presetPalettes.cyan; +presetPalettes.blue; +presetPalettes.geekblue; +presetPalettes.purple; +presetPalettes.magenta; +presetPalettes.grey; + +/** + * get the mix color of backColor and frontColor with alpah + * @param backColor background color + * @param frontColor foreground color + * @param frontAlpha the opacity of foreground color + */ + +var mixColor = function mixColor(backColor, frontColor, frontAlpha) { + var bc = color(backColor); + var fc = color(frontColor); + return color([(1 - frontAlpha) * bc.red() + frontAlpha * fc.red(), (1 - frontAlpha) * bc.green() + frontAlpha * fc.green(), (1 - frontAlpha) * bc.blue() + frontAlpha * fc.blue()]).rgb(); +}; + +var getColorsWithDefaultTheme = function getColorsWithDefaultTheme(subjectColor, backColor, disableColor) { + if (backColor === void 0) { + backColor = '#fff'; + } + + if (disableColor === void 0) { + disableColor = 'rgb(150, 150, 150)'; + } + + var subjectColor005 = mixColor(backColor, subjectColor, 0.05).rgb().toString(); + var subjectColor01 = mixColor(backColor, subjectColor, 0.1).rgb().toString(); + var subjectColor02 = mixColor(backColor, subjectColor, 0.2).rgb().toString(); + var subjectColor04 = mixColor(backColor, subjectColor, 0.4).rgb().toString(); + var disableColor002 = mixColor(backColor, disableColor, 0.02).rgb().toString(); + var disableColor005 = mixColor(backColor, disableColor, 0.05).rgb().toString(); + var disableColor01 = mixColor(backColor, disableColor, 0.1).rgb().toString(); + var disableColor02 = mixColor(backColor, disableColor, 0.2).rgb().toString(); + var disableColor03 = mixColor(backColor, disableColor, 0.3).rgb().toString(); + var paletteFromSubject = generate(subjectColor, { + theme: 'default', + backgroundColor: backColor + }); + var subjectHex = color(subjectColor).hex().toLowerCase(); + var subjectIdx = paletteFromSubject.indexOf(subjectHex); + var deeperSubject = subjectColor; + + if (subjectIdx !== -1) { + deeperSubject = paletteFromSubject[subjectIdx + 1]; + } + + return { + // for nodes + mainStroke: subjectColor, + mainFill: subjectColor01, + activeStroke: subjectColor, + activeFill: subjectColor005, + inactiveStroke: subjectColor04, + inactiveFill: subjectColor005, + selectedStroke: subjectColor, + selectedFill: backColor, + highlightStroke: deeperSubject, + highlightFill: subjectColor02, + disableStroke: disableColor03, + disableFill: disableColor005, + // for edges + edgeMainStroke: disableColor03, + edgeActiveStroke: subjectColor, + edgeInactiveStroke: disableColor02, + edgeSelectedStroke: subjectColor, + edgeHighlightStroke: subjectColor, + edgeDisableStroke: disableColor01, + // for combos + comboMainStroke: disableColor03, + comboMainFill: disableColor002, + comboActiveStroke: subjectColor, + comboActiveFill: subjectColor005, + comboInactiveStroke: disableColor03, + comboInactiveFill: disableColor002, + comboSelectedStroke: subjectColor, + comboSelectedFill: disableColor002, + comboHighlightStroke: deeperSubject, + comboHighlightFill: disableColor002, + comboDisableStroke: disableColor02, + comboDisableFill: disableColor005 + }; +}; + +var getColorsWithDarkTheme = function getColorsWithDarkTheme(subjectColor, backColor, disableColor) { + if (backColor === void 0) { + backColor = '#fff'; + } + + if (disableColor === void 0) { + disableColor = '#777'; + } + + var subjectColor02 = mixColor(backColor, subjectColor, 0.2).rgb().toString(); + var subjectColor03 = mixColor(backColor, subjectColor, 0.3).rgb().toString(); + var subjectColor06 = mixColor(backColor, subjectColor, 0.6).rgb().toString(); + var subjectColor08 = mixColor(backColor, subjectColor, 0.8).rgb().toString(); + var disableColor02 = mixColor(backColor, disableColor, 0.2).rgb().toString(); + var disableColor025 = mixColor(backColor, disableColor, 0.25).rgb().toString(); + var disableColor03 = mixColor(backColor, disableColor, 0.3).rgb().toString(); + var disableColor04 = mixColor(backColor, disableColor, 0.4).rgb().toString(); + var disableColor05 = mixColor(backColor, disableColor, 0.5).rgb().toString(); + var paletteFromSubject = generate(subjectColor, { + theme: 'dark', + backgroundColor: backColor + }); + var subjectHex = color(subjectColor).hex().toLowerCase(); + var subjectIdx = paletteFromSubject.indexOf(subjectHex); + var deeperSubject = subjectColor; + + if (subjectIdx !== -1) { + deeperSubject = paletteFromSubject[subjectIdx + 1]; + } + + return { + // for nodes + mainStroke: subjectColor08, + mainFill: subjectColor02, + activeStroke: subjectColor, + activeFill: subjectColor03, + inactiveStroke: subjectColor08, + inactiveFill: subjectColor02, + selectedStroke: subjectColor, + selectedFill: subjectColor02, + highlightStroke: subjectColor, + highlightFill: subjectColor06, + disableStroke: disableColor05, + disableFill: disableColor025, + // for edges + edgeMainStroke: disableColor, + edgeActiveStroke: subjectColor, + edgeInactiveStroke: disableColor, + edgeSelectedStroke: subjectColor, + edgeHighlightStroke: subjectColor, + edgeDisableStroke: disableColor03, + // for combos + comboMainStroke: disableColor04, + comboMainFill: disableColor025, + comboActiveStroke: subjectColor, + comboActiveFill: disableColor02, + comboInactiveStroke: disableColor04, + comboInactiveFill: disableColor025, + comboSelectedStroke: subjectColor, + comboSelectedFill: disableColor02, + comboHighlightStroke: deeperSubject, + comboHighlightFill: disableColor025, + comboDisableStroke: disableColor04, + comboDisableFill: disableColor02 + }; +}; +/** + * get the set of colors according to the subject color and background color + * @param subjectColor the subject color + * @param backColor background color + * @param disableColor the color for disable state + */ + + +var getColorsWithSubjectColor = function getColorsWithSubjectColor(subjectColor, backColor, theme, disableColor) { + if (backColor === void 0) { + backColor = '#fff'; + } + + if (theme === void 0) { + theme = 'default'; + } + + if (theme === 'default') return getColorsWithDefaultTheme(subjectColor, backColor, 'rgb(150, 150, 150)'); + return getColorsWithDarkTheme(subjectColor, backColor, '#777'); +}; +var getColorSetsBySubjectColors = function getColorSetsBySubjectColors(subjectColors, backColor, theme, disableColor) { + if (backColor === void 0) { + backColor = '#fff'; + } + + if (theme === void 0) { + theme = 'default'; + } + + var sets = []; + subjectColors.forEach(function (sColor) { + sets.push(getColorsWithSubjectColor(sColor, backColor, theme)); + }); + return sets; +}; + +var ColorUtil = /*#__PURE__*/Object.freeze({ + __proto__: null, + mixColor: mixColor, + getColorsWithSubjectColor: getColorsWithSubjectColor, + getColorSetsBySubjectColors: getColorSetsBySubjectColors +}); + +var subjectColor = 'rgb(95, 149, 255)'; +var backColor = 'rgb(255, 255, 255)'; +var textColor = 'rgb(0, 0, 0)'; +var colorSet = getColorsWithSubjectColor(subjectColor, backColor); +var Global = { + version: '0.2.4', + rootContainerClassName: 'root-container', + nodeContainerClassName: 'node-container', + edgeContainerClassName: 'edge-container', + comboContainerClassName: 'combo-container', + delegateContainerClassName: 'delegate-container', + defaultLoopPosition: 'top', + nodeLabel: { + style: { + fill: '#000', + fontSize: 12, + textAlign: 'center', + textBaseline: 'middle' + }, + offset: 4 // 节点的默认文本不居中时的偏移量 + + }, + defaultNode: { + type: 'circle', + style: { + lineWidth: 1, + stroke: colorSet.mainStroke, + fill: colorSet.mainFill + }, + size: 20, + color: colorSet.mainStroke, + linkPoints: { + size: 8, + lineWidth: 1, + fill: colorSet.activeFill, + stroke: colorSet.activeStroke + } + }, + // 节点应用状态后的样式，默认仅提供 active、selected、highlight、inactive、disable，用户可以自己扩展 + nodeStateStyles: { + active: { + fill: colorSet.activeFill, + stroke: colorSet.activeStroke, + lineWidth: 2, + shadowColor: colorSet.mainStroke, + shadowBlur: 10 + }, + selected: { + fill: colorSet.selectedFill, + stroke: colorSet.selectedStroke, + lineWidth: 4, + shadowColor: colorSet.selectedStroke, + shadowBlur: 10, + 'text-shape': { + fontWeight: 500 + } + }, + highlight: { + fill: colorSet.highlightFill, + stroke: colorSet.highlightStroke, + lineWidth: 2, + 'text-shape': { + fontWeight: 500 + } + }, + inactive: { + fill: colorSet.inactiveFill, + stroke: colorSet.inactiveStroke, + lineWidth: 1 + }, + disable: { + fill: colorSet.disableFill, + stroke: colorSet.disableStroke, + lineWidth: 1 + } + }, + edgeLabel: { + style: { + fill: textColor, + textAlign: 'center', + textBaseline: 'middle', + fontSize: 12 + } + }, + defaultEdge: { + type: 'line', + size: 1, + style: { + stroke: colorSet.edgeMainStroke, + lineAppendWidth: 2 + }, + color: colorSet.edgeMainStroke + }, + // 边应用状态后的样式，默认仅提供 active、selected、highlight、inactive、disable，用户可以自己扩展 + edgeStateStyles: { + active: { + stroke: colorSet.edgeActiveStroke, + lineWidth: 1 + }, + selected: { + stroke: colorSet.edgeSelectedStroke, + lineWidth: 2, + shadowColor: colorSet.edgeSelectedStroke, + shadowBlur: 10, + 'text-shape': { + fontWeight: 500 + } + }, + highlight: { + stroke: colorSet.edgeHighlightStroke, + lineWidth: 2, + 'text-shape': { + fontWeight: 500 + } + }, + inactive: { + stroke: colorSet.edgeInactiveStroke, + lineWidth: 1 + }, + disable: { + stroke: colorSet.edgeDisableStroke, + lineWidth: 1 + } + }, + comboLabel: { + style: { + fill: textColor, + // textAlign: 'center', + textBaseline: 'middle', + fontSize: 12 + }, + refY: 10, + refX: 10 // Combo 的默认文本不居中时的偏移量 + + }, + defaultCombo: { + type: 'circle', + style: { + fill: colorSet.comboMainFill, + lineWidth: 1, + stroke: colorSet.comboMainStroke, + r: 5, + width: 20, + height: 10 + }, + size: [20, 5], + color: colorSet.comboMainStroke, + padding: [25, 20, 15, 20] + }, + // combo 应用状态后的样式，默认仅提供 active、selected、highlight、inactive、disable，用户可以自己扩展 + comboStateStyles: { + active: { + stroke: colorSet.comboActiveStroke, + lineWidth: 1, + fill: colorSet.comboActiveFill + }, + selected: { + stroke: colorSet.comboSelectedStroke, + lineWidth: 2, + fill: colorSet.comboSelectedFill, + shadowColor: colorSet.comboSelectedStroke, + shadowBlur: 10, + 'text-shape': { + fontWeight: 500 + } + }, + highlight: { + stroke: colorSet.comboHighlightStroke, + lineWidth: 2, + fill: colorSet.comboHighlightFill, + 'text-shape': { + fontWeight: 500 + } + }, + inactive: { + stroke: colorSet.comboInactiveStroke, + fill: colorSet.comboInactiveFill, + lineWidth: 1 + }, + disable: { + stroke: colorSet.comboDisableStroke, + fill: colorSet.comboDisableFill, + lineWidth: 1 + } + }, + delegateStyle: { + fill: '#F3F9FF', + fillOpacity: 0.5, + stroke: '#1890FF', + strokeOpacity: 0.9, + lineDash: [5, 5] + }, + // 文本水印默认配置 + textWaterMarkerConfig: { + width: 150, + height: 100, + compatible: false, + text: { + x: 0, + y: 60, + lineHeight: 20, + rotate: 20, + fontSize: 14, + fontFamily: 'Microsoft YaHei', + fill: 'rgba(0, 0, 0, 0.1)', + baseline: 'Middle' + } + }, + imageWaterMarkerConfig: { + width: 150, + height: 130, + compatible: false, + image: { + x: 0, + y: 0, + width: 30, + height: 20, + rotate: 0 + } + }, + waterMarkerImage: 'https://gw.alipayobjects.com/os/s/prod/antv/assets/image/logo-with-text-73b8a.svg' +}; + +var cloneEvent$1 = Util.cloneEvent, + isViewportChanged = Util.isViewportChanged; + +var EventController = +/** @class */ +function (_super) { + __extends$e(EventController, _super); + + function EventController(graph) { + var _this = _super.call(this, graph) || this; + + _this.extendEvents = []; + _this.dragging = false; + _this.preItem = null; + _this.graph = graph; + _this.destroyed = false; + + _this.initEvents(); + + return _this; + } // 初始化 G6 中的事件 + + + EventController.prototype.initEvents = function () { + var _a = this, + graph = _a.graph, + _b = _a.extendEvents, + extendEvents = _b === void 0 ? [] : _b; + + var canvas = graph.get('canvas'); // canvas.set('draggable', true); + + var el = canvas.get('el'); + var canvasHandler = wrapBehavior(this, 'onCanvasEvents'); + var originHandler = wrapBehavior(this, 'onExtendEvents'); + var wheelHandler = wrapBehavior(this, 'onWheelEvent'); // each(EVENTS, event => { + // canvas.off(event).on(event, canvasHandler); + // }); + + canvas.off('*').on('*', canvasHandler); + this.canvasHandler = canvasHandler; + extendEvents.push(addEventListener(el, 'DOMMouseScroll', wheelHandler)); + extendEvents.push(addEventListener(el, 'mousewheel', wheelHandler)); + + if (typeof window !== 'undefined') { + extendEvents.push(addEventListener(window, 'keydown', originHandler)); + extendEvents.push(addEventListener(window, 'keyup', originHandler)); + extendEvents.push(addEventListener(window, 'focus', originHandler)); + } + }; // 获取 shape 的 item 对象 + + + EventController.getItemRoot = function (shape) { + while (shape && !shape.get('item')) { + shape = shape.get('parent'); + } + + return shape; + }; + /** + * 处理 canvas 事件 + * @param evt 事件句柄 + */ + + + EventController.prototype.onCanvasEvents = function (evt) { + var graph = this.graph; + var canvas = graph.get('canvas'); + var target = evt.target; + var eventType = evt.type; + /** + * (clientX, clientY): 相对于页面的坐标； + * (canvasX, canvasY): 相对于 左上角的坐标； + * (x, y): 相对于整个画布的坐标, 与 model 的 x, y 是同一维度的。 + */ + + evt.canvasX = evt.x; + evt.canvasY = evt.y; + var point = { + x: evt.canvasX, + y: evt.canvasY + }; + var group = graph.get('group'); + var matrix = group.getMatrix(); + + if (!matrix) { + matrix = [1, 0, 0, 0, 1, 0, 0, 0, 1]; + } + + if (isViewportChanged(matrix)) { + point = graph.getPointByClient(evt.clientX, evt.clientY); + } + + evt.x = point.x; + evt.y = point.y; + evt.currentTarget = graph; + + if (target === canvas) { + if (eventType === 'mousemove') { + this.handleMouseMove(evt, 'canvas'); + } + + evt.target = canvas; + evt.item = null; + graph.emit(eventType, evt); + graph.emit("canvas:" + eventType, evt); + return; + } + + var itemShape = EventController.getItemRoot(target); + + if (!itemShape) { + graph.emit(eventType, evt); + return; + } + + var item = itemShape.get('item'); + + if (item.destroyed) { + return; + } + + var type = item.getType(); // 事件target是触发事件的Shape实例，item是触发事件的item实例 + + evt.target = target; + evt.item = item; + + if (evt.canvasX === evt.x && evt.canvasY === evt.y) { + var canvasPoint = graph.getCanvasByPoint(evt.x, evt.y); + evt.canvasX = canvasPoint.x; + evt.canvasY = canvasPoint.y; + } // emit('click', evt); + + + graph.emit(eventType, evt); + if (evt.name && !evt.name.includes(':')) graph.emit(type + ":" + eventType, evt); // emit('node:click', evt) + else graph.emit(evt.name, evt); // emit('text-shape:click', evt) + + if (eventType === 'dragstart') { + this.dragging = true; + } + + if (eventType === 'dragend') { + this.dragging = false; + } + + if (eventType === 'mousemove') { + this.handleMouseMove(evt, type); + } + }; + /** + * 处理扩展事件 + * @param evt 事件句柄 + */ + + + EventController.prototype.onExtendEvents = function (evt) { + this.graph.emit(evt.type, evt); + }; + /** + * 处理滚轮事件 + * @param evt 事件句柄 + */ + + + EventController.prototype.onWheelEvent = function (evt) { + if (isNil(evt.wheelDelta)) { + evt.wheelDelta = -evt.detail; + } + + this.graph.emit('wheel', evt); + }; + /** + * 处理鼠标移动的事件 + * @param evt 事件句柄 + * @param type item 类型 + */ + + + EventController.prototype.handleMouseMove = function (evt, type) { + var _a = this, + graph = _a.graph, + preItem = _a.preItem; + + var canvas = graph.get('canvas'); + var item = evt.target === canvas ? null : evt.item; + evt = cloneEvent$1(evt); // 从前一个item直接移动到当前item，触发前一个item的leave事件 + + if (preItem && preItem !== item && !preItem.destroyed) { + evt.item = preItem; + this.emitCustomEvent(preItem.getType(), 'mouseleave', evt); + + if (this.dragging) { + this.emitCustomEvent(preItem.getType(), 'dragleave', evt); + } + } // 从一个item或canvas移动到当前item，触发当前item的enter事件 + + + if (item && preItem !== item) { + evt.item = item; + this.emitCustomEvent(type, 'mouseenter', evt); + + if (this.dragging) { + this.emitCustomEvent(type, 'dragenter', evt); + } + } + + this.preItem = item; + }; + /** + * 在 graph 上面 emit 事件 + * @param itemType item 类型 + * @param eventType 事件类型 + * @param evt 事件句柄 + */ + + + EventController.prototype.emitCustomEvent = function (itemType, eventType, evt) { + evt.type = eventType; + this.graph.emit(itemType + ":" + eventType, evt); + }; + + EventController.prototype.destroy = function () { + var _a = this, + graph = _a.graph, + canvasHandler = _a.canvasHandler, + extendEvents = _a.extendEvents; + + var canvas = graph.get('canvas'); // each(EVENTS, event => { + // canvas.off(event, canvasHandler); + // }); + + canvas.off('*', canvasHandler); + each$2(extendEvents, function (event) { + event.remove(); + }); + this.dragging = false; + this.preItem = null; + this.extendEvents.length = 0; + this.canvasHandler = null; + this.destroyed = true; + }; + + return EventController; +}(EventController$1); + +class Base { + constructor() { + this.nodes = []; + this.edges = []; + this.combos = []; + this.positions = []; + this.destroyed = false; + this.onLayoutEnd = () => { }; + } + layout(data) { + this.init(data); + return this.execute(true); + } + init(data) { + this.nodes = data.nodes || []; + this.edges = data.edges || []; + this.combos = data.combos || []; + } + execute(reloadData) { } + executeWithWorker() { } + getDefaultCfg() { + return {}; + } + updateCfg(cfg) { + if (cfg) { + Object.assign(this, cfg); + } + } + getType() { + return 'base'; + } + destroy() { + this.nodes = null; + this.edges = null; + this.combos = null; + this.positions = null; + this.destroyed = true; + } +} + +const isString$2 = (val) => typeof val === 'string'; +// export const capitalize = cacheStringFunction( +// (str: string) => str.charAt(0).toUpperCase() + str.slice(1), +// ) + +const isArray$l = Array.isArray; + +const isNumber$2 = (val) => typeof val === 'number'; +const isNaN$2 = (num) => Number.isNaN(Number(num)); + +const isObject$e = (val) => val !== null && typeof val === 'object'; +const clone$2 = (target) => { + if (target === null) { + return target; + } + if (target instanceof Date) { + return new Date(target.getTime()); + } + if (target instanceof Array) { + const cp = []; + target.forEach((v) => { + cp.push(v); + }); + return cp.map((n) => clone$2(n)); + } + if (typeof target === 'object' && target !== {}) { + const cp = Object.assign({}, target); + Object.keys(cp).forEach((k) => { + cp[k] = clone$2(cp[k]); + }); + return cp; + } + return target; +}; + +const getEdgeTerminal = (edge, type) => { + const terminal = edge[type]; + if (isObject$e(terminal)) { + return terminal.cell; + } + return terminal; +}; +const getDegree = (n, nodeIdxMap, edges) => { + const degrees = []; + for (let i = 0; i < n; i++) { + degrees[i] = 0; + } + if (!edges) + return degrees; + edges.forEach((e) => { + const source = getEdgeTerminal(e, 'source'); + const target = getEdgeTerminal(e, 'target'); + if (source) { + degrees[nodeIdxMap[source]] += 1; + } + if (target) { + degrees[nodeIdxMap[target]] += 1; + } + }); + return degrees; +}; +const floydWarshall$1 = (adjMatrix) => { + // initialize + const dist = []; + const size = adjMatrix.length; + for (let i = 0; i < size; i += 1) { + dist[i] = []; + for (let j = 0; j < size; j += 1) { + if (i === j) { + dist[i][j] = 0; + } + else if (adjMatrix[i][j] === 0 || !adjMatrix[i][j]) { + dist[i][j] = Infinity; + } + else { + dist[i][j] = adjMatrix[i][j]; + } + } + } + // floyd + for (let k = 0; k < size; k += 1) { + for (let i = 0; i < size; i += 1) { + for (let j = 0; j < size; j += 1) { + if (dist[i][j] > dist[i][k] + dist[k][j]) { + dist[i][j] = dist[i][k] + dist[k][j]; + } + } + } + } + return dist; +}; +const getAdjMatrix = (data, directed) => { + const { nodes, edges } = data; + const matrix = []; + // map node with index in data.nodes + const nodeMap = {}; + if (!nodes) { + throw new Error('invalid nodes data!'); + } + if (nodes) { + nodes.forEach((node, i) => { + nodeMap[node.id] = i; + const row = []; + matrix.push(row); + }); + } + if (edges) { + edges.forEach((e) => { + const source = getEdgeTerminal(e, 'source'); + const target = getEdgeTerminal(e, 'target'); + const sIndex = nodeMap[source]; + const tIndex = nodeMap[target]; + matrix[sIndex][tIndex] = 1; + if (!directed) { + matrix[tIndex][sIndex] = 1; + } + }); + } + return matrix; +}; +/** + * scale matrix + * @param matrix [ [], [], [] ] + * @param ratio + */ +const scaleMatrix = (matrix, ratio) => { + const result = []; + matrix.forEach((row) => { + const newRow = []; + row.forEach((v) => { + newRow.push(v * ratio); + }); + result.push(newRow); + }); + return result; +}; +/** + * depth first traverse, from leaves to root, children in inverse order + * if the fn returns false, terminate the traverse + */ +const traverseUp = (data, fn) => { + if (data && data.children) { + for (let i = data.children.length - 1; i >= 0; i--) { + if (!traverseUp(data.children[i], fn)) + return; + } + } + if (!fn(data)) { + return false; + } + return true; +}; +/** + * depth first traverse, from leaves to root, children in inverse order + * if the fn returns false, terminate the traverse + */ +const traverseTreeUp = (data, fn) => { + if (typeof fn !== 'function') { + return; + } + traverseUp(data, fn); +}; + +const isFunction$5 = (val) => typeof val === 'function'; + +const map$1 = new Map(); +const registerLayout$1 = (name, layoutOverride) => { + if (map$1.get(name)) { + console.warn(`The layout with the name ${name} exists already, it will be overridden`); + } + if (isObject$e(layoutOverride)) { + // tslint:disable-next-line: max-classes-per-file + class GLayout extends Base { + constructor(cfg) { + super(); + const self = this; + const props = {}; + const defaultCfg = self.getDefaultCfg(); + Object.assign(props, defaultCfg, layoutOverride, cfg); + Object.keys(props).forEach((key) => { + const value = props[key]; + self[key] = value; + }); + } + } + map$1.set(name, GLayout); + } + else { + map$1.set(name, layoutOverride); + } +}; +const getLayoutByName = (name) => { + if (map$1.has(name)) { + return map$1.get(name); + } + return null; +}; + +/** + * @fileOverview grid layout + * @author shiwu.wyy@antfin.com + * this algorithm refers to - https://github.com/cytoscape/cytoscape.js/ + */ +/** + * 网格布局 + */ +class GridLayout extends Base { + constructor(options) { + super(); + /** 布局起始点 */ + this.begin = [0, 0]; + /** prevents node overlap, may overflow boundingBox if not enough space */ + this.preventOverlap = true; + /** extra spacing around nodes when preventOverlap: true */ + this.preventOverlapPadding = 10; + /** uses all available space on false, uses minimal space on true */ + this.condense = false; + /** a sorting function to order the nodes; e.g. function(a, b){ return a.datapublic ('weight') - b.data('weight') } */ + this.sortBy = "degree"; + this.nodeSize = 30; + this.nodes = []; + this.edges = []; + this.width = 300; + this.height = 300; + this.row = 0; + this.col = 0; + this.cellWidth = 0; + this.cellHeight = 0; + this.cellUsed = {}; + this.id2manPos = {}; + /** 迭代结束的回调函数 */ + this.onLayoutEnd = () => { }; + this.updateCfg(options); + } + getDefaultCfg() { + return { + begin: [0, 0], + preventOverlap: true, + preventOverlapPadding: 10, + condense: false, + rows: undefined, + cols: undefined, + position: undefined, + sortBy: "degree", + nodeSize: 30 + }; + } + /** + * 执行布局 + */ + execute() { + const self = this; + const nodes = self.nodes; + const edges = self.edges; + const n = nodes.length; + const begin = self.begin; + if (n === 0) { + if (self.onLayoutEnd) + self.onLayoutEnd(); + return { + nodes, + edges + }; + } + if (n === 1) { + nodes[0].x = begin[0]; + nodes[0].y = begin[1]; + if (self.onLayoutEnd) + self.onLayoutEnd(); + return { + nodes, + edges, + }; + } + const layoutNodes = []; + nodes.forEach((node) => { + layoutNodes.push(node); + }); + const nodeIdxMap = {}; + layoutNodes.forEach((node, i) => { + nodeIdxMap[node.id] = i; + }); + if (self.sortBy === "degree" || + !isString$2(self.sortBy) || + layoutNodes[0][self.sortBy] === undefined) { + self.sortBy = "degree"; + if (isNaN$2(nodes[0].degree)) { + const values = getDegree(layoutNodes.length, nodeIdxMap, edges); + layoutNodes.forEach((node, i) => { + node.degree = values[i]; + }); + } + } + // sort nodes by value + layoutNodes.sort((n1, n2) => n2[self.sortBy] - n1[self.sortBy]); + if (!self.width && typeof window !== "undefined") { + self.width = window.innerWidth; + } + if (!self.height && typeof window !== "undefined") { + self.height = window.innerHeight; + } + const oRows = self.rows; + const oCols = self.cols != null ? self.cols : self.columns; + self.cells = n; + // if rows or columns were set in self, use those values + if (oRows != null && oCols != null) { + self.rows = oRows; + self.cols = oCols; + } + else if (oRows != null && oCols == null) { + self.rows = oRows; + self.cols = Math.ceil(self.cells / self.rows); + } + else if (oRows == null && oCols != null) { + self.cols = oCols; + self.rows = Math.ceil(self.cells / self.cols); + } + else { + // otherwise use the automatic values and adjust accordingly // otherwise use the automatic values and adjust accordingly + // width/height * splits^2 = cells where splits is number of times to split width + self.splits = Math.sqrt((self.cells * self.height) / self.width); + self.rows = Math.round(self.splits); + self.cols = Math.round((self.width / self.height) * self.splits); + } + if (self.cols * self.rows > self.cells) { + // otherwise use the automatic values and adjust accordingly + // if rounding was up, see if we can reduce rows or columns + const sm = self.small(); + const lg = self.large(); + // reducing the small side takes away the most cells, so try it first + if ((sm - 1) * lg >= self.cells) { + self.small(sm - 1); + } + else if ((lg - 1) * sm >= self.cells) { + self.large(lg - 1); + } + } + else { + // if rounding was too low, add rows or columns + while (self.cols * self.rows < self.cells) { + const sm = self.small(); + const lg = self.large(); + // try to add to larger side first (adds less in multiplication) + if ((lg + 1) * sm >= self.cells) { + self.large(lg + 1); + } + else { + self.small(sm + 1); + } + } + } + self.cellWidth = self.width / self.cols; + self.cellHeight = self.height / self.rows; + if (self.condense) { + self.cellWidth = 0; + self.cellHeight = 0; + } + if (self.preventOverlap) { + layoutNodes.forEach((node) => { + if (!node.x || !node.y) { + // for bb + node.x = 0; + node.y = 0; + } + let nodew; + let nodeh; + if (isArray$l(node.size)) { + nodew = node.size[0]; + nodeh = node.size[1]; + } + else if (isNumber$2(node.size)) { + nodew = node.size; + nodeh = node.size; + } + else if (isObject$e(node.size)) { + nodew = node.size.width; + nodeh = node.size.height; + } + if (nodew === undefined || nodeh === undefined) { + if (isArray$l(self.nodeSize)) { + nodew = self.nodeSize[0]; + nodeh = self.nodeSize[1]; + } + else if (isNumber$2(self.nodeSize)) { + nodew = self.nodeSize; + nodeh = self.nodeSize; + } + else { + nodew = 30; + nodeh = 30; + } + } + const p = self.preventOverlapPadding; + const w = nodew + p; + const h = nodeh + p; + self.cellWidth = Math.max(self.cellWidth, w); + self.cellHeight = Math.max(self.cellHeight, h); + }); + } + self.cellUsed = {}; // e.g. 'c-0-2' => true + // to keep track of current cell position + self.row = 0; + self.col = 0; + // get a cache of all the manual positions + self.id2manPos = {}; + for (let i = 0; i < layoutNodes.length; i++) { + const node = layoutNodes[i]; + let rcPos; + if (self.position) { + rcPos = self.position(node); + } + if (rcPos && (rcPos.row !== undefined || rcPos.col !== undefined)) { + // must have at least row or col def'd + const pos = { + row: rcPos.row, + col: rcPos.col + }; + if (pos.col === undefined) { + // find unused col + pos.col = 0; + while (self.used(pos.row, pos.col)) { + pos.col++; + } + } + else if (pos.row === undefined) { + // find unused row + pos.row = 0; + while (self.used(pos.row, pos.col)) { + pos.row++; + } + } + self.id2manPos[node.id] = pos; + self.use(pos.row, pos.col); + } + self.getPos(node); + } + if (self.onLayoutEnd) + self.onLayoutEnd(); + return { + edges, + nodes: layoutNodes + }; + } + small(val) { + const self = this; + let res; + const rows = self.rows || 5; + const cols = self.cols || 5; + if (val == null) { + res = Math.min(rows, cols); + } + else { + const min = Math.min(rows, cols); + if (min === self.rows) { + self.rows = val; + } + else { + self.cols = val; + } + } + return res; + } + large(val) { + const self = this; + let res; + const rows = self.rows || 5; + const cols = self.cols || 5; + if (val == null) { + res = Math.max(rows, cols); + } + else { + const max = Math.max(rows, cols); + if (max === self.rows) { + self.rows = val; + } + else { + self.cols = val; + } + } + return res; + } + used(row, col) { + const self = this; + return self.cellUsed[`c-${row}-${col}`] || false; + } + use(row, col) { + const self = this; + self.cellUsed[`c-${row}-${col}`] = true; + } + moveToNextCell() { + const self = this; + const cols = self.cols || 5; + self.col++; + if (self.col >= cols) { + self.col = 0; + self.row++; + } + } + getPos(node) { + const self = this; + const begin = self.begin; + const cellWidth = self.cellWidth; + const cellHeight = self.cellHeight; + let x; + let y; + // see if we have a manual position set + const rcPos = self.id2manPos[node.id]; + if (rcPos) { + x = rcPos.col * cellWidth + cellWidth / 2 + begin[0]; + y = rcPos.row * cellHeight + cellHeight / 2 + begin[1]; + } + else { + // otherwise set automatically + while (self.used(self.row, self.col)) { + self.moveToNextCell(); + } + x = self.col * cellWidth + cellWidth / 2 + begin[0]; + y = self.row * cellHeight + cellHeight / 2 + begin[1]; + self.use(self.row, self.col); + self.moveToNextCell(); + } + node.x = x; + node.y = y; + } + getType() { + return "grid"; + } +} + +/** + * @fileOverview random layout + * @author shiwu.wyy@antfin.com + */ +/** + * 随机布局 + */ +class RandomLayout extends Base { + constructor(options) { + super(); + /** 布局中心 */ + this.center = [0, 0]; + /** 宽度 */ + this.width = 300; + /** 高度 */ + this.height = 300; + this.nodes = []; + this.edges = []; + /** 迭代结束的回调函数 */ + this.onLayoutEnd = () => { }; + this.updateCfg(options); + } + getDefaultCfg() { + return { + center: [0, 0], + width: 300, + height: 300 + }; + } + /** + * 执行布局 + */ + execute() { + const self = this; + const nodes = self.nodes; + const layoutScale = 0.9; + const center = self.center; + if (!self.width && typeof window !== "undefined") { + self.width = window.innerWidth; + } + if (!self.height && typeof window !== "undefined") { + self.height = window.innerHeight; + } + if (nodes) { + nodes.forEach((node) => { + node.x = (Math.random() - 0.5) * layoutScale * self.width + center[0]; + node.y = (Math.random() - 0.5) * layoutScale * self.height + center[1]; + }); + } + if (self.onLayoutEnd) + self.onLayoutEnd(); + return { + nodes, + edges: this.edges + }; + } + getType() { + return "random"; + } +} + +/** + * @fileOverview fruchterman layout + * @author shiwu.wyy@antfin.com + */ +const proccessToFunc$2 = (value, defaultV) => { + let func; + if (!value) { + func = (d) => { + return defaultV || 1; + }; + } + else if (isNumber$2(value)) { + func = (d) => { + return value; + }; + } + else { + func = value; + } + return func; +}; +/** + * graphin 中的 force 布局 + */ +class GForceLayout extends Base { + constructor(options) { + super(); + /** 停止迭代的最大迭代数 */ + this.maxIteration = 1000; + /** 弹簧引力系数 */ + this.edgeStrength = 200; + /** 斥力系数 */ + this.nodeStrength = 1000; + /** 库伦系数 */ + this.coulombDisScale = 0.005; + /** 阻尼系数 */ + this.damping = 0.9; + /** 最大速度 */ + this.maxSpeed = 1000; + /** 一次迭代的平均移动距离小于该值时停止迭代 */ + this.minMovement = 0.5; + /** 迭代中衰减 */ + this.interval = 0.02; + /** 斥力的一个系数 */ + this.factor = 1; + /** 理想边长 */ + this.linkDistance = 1; + /** 重力大小 */ + this.gravity = 10; + /** 是否防止重叠 */ + this.preventOverlap = true; + /** 每次迭代结束的回调函数 */ + this.tick = () => { }; + this.nodes = []; + this.edges = []; + this.width = 300; + this.height = 300; + this.nodeMap = {}; + this.nodeIdxMap = {}; + this.updateCfg(options); + } + getDefaultCfg() { + return { + maxIteration: 500, + gravity: 10, + enableTick: true + }; + } + /** + * 执行布局 + */ + execute() { + const self = this; + const nodes = self.nodes; + if (self.timeInterval !== undefined && typeof window !== "undefined") { + window.clearInterval(self.timeInterval); + } + if (!nodes || nodes.length === 0) { + if (self.onLayoutEnd) + self.onLayoutEnd(); + return; + } + if (!self.width && typeof window !== "undefined") { + self.width = window.innerWidth; + } + if (!self.height && typeof window !== "undefined") { + self.height = window.innerHeight; + } + if (!self.center) { + self.center = [self.width / 2, self.height / 2]; + } + const center = self.center; + if (nodes.length === 1) { + nodes[0].x = center[0]; + nodes[0].y = center[1]; + if (self.onLayoutEnd) + self.onLayoutEnd(); + return; + } + const nodeMap = {}; + const nodeIdxMap = {}; + nodes.forEach((node, i) => { + if (!isNumber$2(node.x)) + node.x = Math.random() * self.width; + if (!isNumber$2(node.y)) + node.y = Math.random() * self.height; + nodeMap[node.id] = node; + nodeIdxMap[node.id] = i; + }); + self.nodeMap = nodeMap; + self.nodeIdxMap = nodeIdxMap; + self.linkDistance = proccessToFunc$2(self.linkDistance, 1); + self.nodeStrength = proccessToFunc$2(self.nodeStrength, 1); + self.edgeStrength = proccessToFunc$2(self.edgeStrength, 1); + // node size function + const nodeSize = self.nodeSize; + let nodeSizeFunc; + if (self.preventOverlap) { + const nodeSpacing = self.nodeSpacing; + let nodeSpacingFunc; + if (isNumber$2(nodeSpacing)) { + nodeSpacingFunc = () => nodeSpacing; + } + else if (isFunction$5(nodeSpacing)) { + nodeSpacingFunc = nodeSpacing; + } + else { + nodeSpacingFunc = () => 0; + } + if (!nodeSize) { + nodeSizeFunc = (d) => { + if (d.size) { + if (isArray$l(d.size)) { + const res = d.size[0] > d.size[1] ? d.size[0] : d.size[1]; + return res + nodeSpacingFunc(d); + } + if (isObject$e(d.size)) { + const res = d.size.width > d.size.height ? d.size.width : d.size.height; + return res + nodeSpacingFunc(d); + } + return d.size + nodeSpacingFunc(d); + } + return 10 + nodeSpacingFunc(d); + }; + } + else if (isArray$l(nodeSize)) { + nodeSizeFunc = (d) => { + const res = nodeSize[0] > nodeSize[1] ? nodeSize[0] : nodeSize[1]; + return res + nodeSpacingFunc(d); + }; + } + else { + nodeSizeFunc = (d) => nodeSize + nodeSpacingFunc(d); + } + } + self.nodeSize = nodeSizeFunc; + const edges = self.edges; + self.degrees = getDegree(nodes.length, self.nodeIdxMap, edges); + if (!self.getMass) { + self.getMass = (d) => { + const mass = self.degrees[self.nodeIdxMap[d.id]] || 1; + return mass; + }; + } + // layout + self.run(); + } + run() { + const self = this; + const nodes = self.nodes; + const edges = self.edges; + const maxIteration = self.maxIteration; + if (typeof window === "undefined") + return; + let iter = 0; + // interval for render the result after each iteration + this.timeInterval = window.setInterval(() => { + const accArray = []; + const velArray = []; + if (!nodes) + return; + nodes.forEach((_, i) => { + accArray[2 * i] = 0; + accArray[2 * i + 1] = 0; + velArray[2 * i] = 0; + velArray[2 * i + 1] = 0; + }); + self.calRepulsive(accArray, nodes); + if (edges) + self.calAttractive(accArray, edges); + self.calGravity(accArray, nodes); + const stepInterval = Math.max(0.02, self.interval - iter * 0.002); + self.updateVelocity(accArray, velArray, stepInterval, nodes); + const previousPos = []; + nodes.forEach((node) => { + previousPos.push({ + x: node.x, + y: node.y + }); + }); + self.updatePosition(velArray, stepInterval, nodes); + if (self.tick) + self.tick(); + // whether to stop the iteration + let movement = 0; + nodes.forEach((node, j) => { + const vx = node.x - previousPos[j].x; + const vy = node.y - previousPos[j].y; + movement += Math.sqrt(vx * vx + vy * vy); + }); + movement /= nodes.length; + if (movement < self.minMovement) { + window.clearInterval(self.timeInterval); + if (self.onLayoutEnd) + self.onLayoutEnd(); + } + iter++; + if (iter >= maxIteration) { + if (self.onLayoutEnd) + self.onLayoutEnd(); + window.clearInterval(self.timeInterval); + } + }, 0); + } + calRepulsive(accArray, nodes) { + const self = this; + // const nodes = self.nodes; + const getMass = self.getMass; + const nodeStrength = self.nodeStrength; + const factor = self.factor; + const coulombDisScale = self.coulombDisScale; + const preventOverlap = self.preventOverlap; + const nodeSize = self.nodeSize; + nodes.forEach((ni, i) => { + const massi = getMass ? getMass(ni) : 1; + nodes.forEach((nj, j) => { + if (i >= j) + return; + // if (!accArray[j]) accArray[j] = 0; + const vecX = ni.x - nj.x; + const vecY = ni.y - nj.y; + const vecLength = Math.sqrt(vecX * vecX + vecY * vecY) + 0.01; + const nVecLength = (vecLength + 0.1) * coulombDisScale; + const direX = vecX / vecLength; + const direY = vecY / vecLength; + const param = (((nodeStrength(ni) + nodeStrength(nj)) / 2) * factor) / + (nVecLength * nVecLength); + const massj = getMass ? getMass(nj) : 1; + accArray[2 * i] += (direX * param); + accArray[2 * i + 1] += (direY * param); + accArray[2 * j] -= (direX * param); + accArray[2 * j + 1] -= (direY * param); + if (preventOverlap && vecLength < (nodeSize(ni) + nodeSize(nj)) / 2) { + const paramOverlap = (nodeStrength(ni) + nodeStrength(nj)) / 2 / (vecLength * vecLength); + accArray[2 * i] += (direX * paramOverlap) / massi; + accArray[2 * i + 1] += (direY * paramOverlap) / massi; + accArray[2 * j] -= (direX * paramOverlap) / massj; + accArray[2 * j + 1] -= (direY * paramOverlap) / massj; + } + }); + }); + } + calAttractive(accArray, edges) { + const self = this; + // const edges = self.edges; + const nodeMap = self.nodeMap; + const nodeIdxMap = self.nodeIdxMap; + const linkDistance = self.linkDistance; + const edgeStrength = self.edgeStrength; + const getMass = self.getMass; + edges.forEach((edge, i) => { + const source = getEdgeTerminal(edge, 'source'); + const target = getEdgeTerminal(edge, 'target'); + const sourceNode = nodeMap[source]; + const targetNode = nodeMap[target]; + const vecX = targetNode.x - sourceNode.x; + const vecY = targetNode.y - sourceNode.y; + const vecLength = Math.sqrt(vecX * vecX + vecY * vecY) + 0.01; + const direX = vecX / vecLength; + const direY = vecY / vecLength; + const length = linkDistance(edge) || 1; + const diff = length - vecLength; + const param = diff * edgeStrength(edge); + const sourceIdx = nodeIdxMap[source]; + const targetIdx = nodeIdxMap[target]; + const massSource = getMass ? getMass(sourceNode) : 1; + const massTarget = getMass ? getMass(targetNode) : 1; + accArray[2 * sourceIdx] -= (direX * param) / massSource; + accArray[2 * sourceIdx + 1] -= (direY * param) / massSource; + accArray[2 * targetIdx] += (direX * param) / massTarget; + accArray[2 * targetIdx + 1] += (direY * param) / massTarget; + }); + } + calGravity(accArray, nodes) { + const self = this; + // const nodes = self.nodes; + const center = self.center; + const defaultGravity = self.gravity; + const degrees = self.degrees; + const nodeLength = nodes.length; + for (let i = 0; i < nodeLength; i++) { + const node = nodes[i]; + let vecX = node.x - center[0]; + let vecY = node.y - center[1]; + let gravity = defaultGravity; + if (self.getCenter) { + const customCenterOpt = self.getCenter(node, degrees[i]); + if (customCenterOpt && + isNumber$2(customCenterOpt[0]) && + isNumber$2(customCenterOpt[1]) && + isNumber$2(customCenterOpt[2])) { + vecX = node.x - customCenterOpt[0]; + vecY = node.y - customCenterOpt[1]; + gravity = customCenterOpt[2]; + } + } + if (!gravity) + continue; + accArray[2 * i] -= gravity * vecX; + accArray[2 * i + 1] -= gravity * vecY; + } + } + updateVelocity(accArray, velArray, stepInterval, nodes) { + const self = this; + const param = stepInterval * self.damping; + // const nodes = self.nodes; + nodes.forEach((node, i) => { + let vx = accArray[2 * i] * param || 0.01; + let vy = accArray[2 * i + 1] * param || 0.01; + const vLength = Math.sqrt(vx * vx + vy * vy); + if (vLength > self.maxSpeed) { + const param2 = self.maxSpeed / vLength; + vx = param2 * vx; + vy = param2 * vy; + } + velArray[2 * i] = vx; + velArray[2 * i + 1] = vy; + }); + } + updatePosition(velArray, stepInterval, nodes) { + nodes.forEach((node, i) => { + if (isNumber$2(node.fx) && isNumber$2(node.fy)) { + node.x = node.fx; + node.y = node.fy; + return; + } + const distX = velArray[2 * i] * stepInterval; + const distY = velArray[2 * i + 1] * stepInterval; + node.x += distX; + node.y += distY; + }); + } + stop() { + if (this.timeInterval && typeof window !== "undefined") { + window.clearInterval(this.timeInterval); + } + } + destroy() { + const self = this; + self.stop(); + self.tick = null; + self.nodes = null; + self.edges = null; + self.destroyed = true; + } + getType() { + return "gForce"; + } +} + +function center(x, y) { + var nodes, strength = 1; + + if (x == null) x = 0; + if (y == null) y = 0; + + function force() { + var i, + n = nodes.length, + node, + sx = 0, + sy = 0; + + for (i = 0; i < n; ++i) { + node = nodes[i], sx += node.x, sy += node.y; + } + + for (sx = (sx / n - x) * strength, sy = (sy / n - y) * strength, i = 0; i < n; ++i) { + node = nodes[i], node.x -= sx, node.y -= sy; + } + } + + force.initialize = function(_) { + nodes = _; + }; + + force.x = function(_) { + return arguments.length ? (x = +_, force) : x; + }; + + force.y = function(_) { + return arguments.length ? (y = +_, force) : y; + }; + + force.strength = function(_) { + return arguments.length ? (strength = +_, force) : strength; + }; + + return force; +} + +function tree_add(d) { + const x = +this._x.call(null, d), + y = +this._y.call(null, d); + return add$2(this.cover(x, y), x, y, d); +} + +function add$2(tree, x, y, d) { + if (isNaN(x) || isNaN(y)) return tree; // ignore invalid points + + var parent, + node = tree._root, + leaf = {data: d}, + x0 = tree._x0, + y0 = tree._y0, + x1 = tree._x1, + y1 = tree._y1, + xm, + ym, + xp, + yp, + right, + bottom, + i, + j; + + // If the tree is empty, initialize the root as a leaf. + if (!node) return tree._root = leaf, tree; + + // Find the existing leaf for the new point, or add it. + while (node.length) { + if (right = x >= (xm = (x0 + x1) / 2)) x0 = xm; else x1 = xm; + if (bottom = y >= (ym = (y0 + y1) / 2)) y0 = ym; else y1 = ym; + if (parent = node, !(node = node[i = bottom << 1 | right])) return parent[i] = leaf, tree; + } + + // Is the new point is exactly coincident with the existing point? + xp = +tree._x.call(null, node.data); + yp = +tree._y.call(null, node.data); + if (x === xp && y === yp) return leaf.next = node, parent ? parent[i] = leaf : tree._root = leaf, tree; + + // Otherwise, split the leaf node until the old and new point are separated. + do { + parent = parent ? parent[i] = new Array(4) : tree._root = new Array(4); + if (right = x >= (xm = (x0 + x1) / 2)) x0 = xm; else x1 = xm; + if (bottom = y >= (ym = (y0 + y1) / 2)) y0 = ym; else y1 = ym; + } while ((i = bottom << 1 | right) === (j = (yp >= ym) << 1 | (xp >= xm))); + return parent[j] = node, parent[i] = leaf, tree; +} + +function addAll(data) { + var d, i, n = data.length, + x, + y, + xz = new Array(n), + yz = new Array(n), + x0 = Infinity, + y0 = Infinity, + x1 = -Infinity, + y1 = -Infinity; + + // Compute the points and their extent. + for (i = 0; i < n; ++i) { + if (isNaN(x = +this._x.call(null, d = data[i])) || isNaN(y = +this._y.call(null, d))) continue; + xz[i] = x; + yz[i] = y; + if (x < x0) x0 = x; + if (x > x1) x1 = x; + if (y < y0) y0 = y; + if (y > y1) y1 = y; + } + + // If there were no (valid) points, abort. + if (x0 > x1 || y0 > y1) return this; + + // Expand the tree to cover the new points. + this.cover(x0, y0).cover(x1, y1); + + // Add the new points. + for (i = 0; i < n; ++i) { + add$2(this, xz[i], yz[i], data[i]); + } + + return this; +} + +function tree_cover(x, y) { + if (isNaN(x = +x) || isNaN(y = +y)) return this; // ignore invalid points + + var x0 = this._x0, + y0 = this._y0, + x1 = this._x1, + y1 = this._y1; + + // If the quadtree has no extent, initialize them. + // Integer extent are necessary so that if we later double the extent, + // the existing quadrant boundaries don’t change due to floating point error! + if (isNaN(x0)) { + x1 = (x0 = Math.floor(x)) + 1; + y1 = (y0 = Math.floor(y)) + 1; + } + + // Otherwise, double repeatedly to cover. + else { + var z = x1 - x0 || 1, + node = this._root, + parent, + i; + + while (x0 > x || x >= x1 || y0 > y || y >= y1) { + i = (y < y0) << 1 | (x < x0); + parent = new Array(4), parent[i] = node, node = parent, z *= 2; + switch (i) { + case 0: x1 = x0 + z, y1 = y0 + z; break; + case 1: x0 = x1 - z, y1 = y0 + z; break; + case 2: x1 = x0 + z, y0 = y1 - z; break; + case 3: x0 = x1 - z, y0 = y1 - z; break; + } + } + + if (this._root && this._root.length) this._root = node; + } + + this._x0 = x0; + this._y0 = y0; + this._x1 = x1; + this._y1 = y1; + return this; +} + +function tree_data() { + var data = []; + this.visit(function(node) { + if (!node.length) do data.push(node.data); while (node = node.next) + }); + return data; +} + +function tree_extent(_) { + return arguments.length + ? this.cover(+_[0][0], +_[0][1]).cover(+_[1][0], +_[1][1]) + : isNaN(this._x0) ? undefined : [[this._x0, this._y0], [this._x1, this._y1]]; +} + +function Quad$1(node, x0, y0, x1, y1) { + this.node = node; + this.x0 = x0; + this.y0 = y0; + this.x1 = x1; + this.y1 = y1; +} + +function tree_find(x, y, radius) { + var data, + x0 = this._x0, + y0 = this._y0, + x1, + y1, + x2, + y2, + x3 = this._x1, + y3 = this._y1, + quads = [], + node = this._root, + q, + i; + + if (node) quads.push(new Quad$1(node, x0, y0, x3, y3)); + if (radius == null) radius = Infinity; + else { + x0 = x - radius, y0 = y - radius; + x3 = x + radius, y3 = y + radius; + radius *= radius; + } + + while (q = quads.pop()) { + + // Stop searching if this quadrant can’t contain a closer node. + if (!(node = q.node) + || (x1 = q.x0) > x3 + || (y1 = q.y0) > y3 + || (x2 = q.x1) < x0 + || (y2 = q.y1) < y0) continue; + + // Bisect the current quadrant. + if (node.length) { + var xm = (x1 + x2) / 2, + ym = (y1 + y2) / 2; + + quads.push( + new Quad$1(node[3], xm, ym, x2, y2), + new Quad$1(node[2], x1, ym, xm, y2), + new Quad$1(node[1], xm, y1, x2, ym), + new Quad$1(node[0], x1, y1, xm, ym) + ); + + // Visit the closest quadrant first. + if (i = (y >= ym) << 1 | (x >= xm)) { + q = quads[quads.length - 1]; + quads[quads.length - 1] = quads[quads.length - 1 - i]; + quads[quads.length - 1 - i] = q; + } + } + + // Visit this point. (Visiting coincident points isn’t necessary!) + else { + var dx = x - +this._x.call(null, node.data), + dy = y - +this._y.call(null, node.data), + d2 = dx * dx + dy * dy; + if (d2 < radius) { + var d = Math.sqrt(radius = d2); + x0 = x - d, y0 = y - d; + x3 = x + d, y3 = y + d; + data = node.data; + } + } + } + + return data; +} + +function tree_remove(d) { + if (isNaN(x = +this._x.call(null, d)) || isNaN(y = +this._y.call(null, d))) return this; // ignore invalid points + + var parent, + node = this._root, + retainer, + previous, + next, + x0 = this._x0, + y0 = this._y0, + x1 = this._x1, + y1 = this._y1, + x, + y, + xm, + ym, + right, + bottom, + i, + j; + + // If the tree is empty, initialize the root as a leaf. + if (!node) return this; + + // Find the leaf node for the point. + // While descending, also retain the deepest parent with a non-removed sibling. + if (node.length) while (true) { + if (right = x >= (xm = (x0 + x1) / 2)) x0 = xm; else x1 = xm; + if (bottom = y >= (ym = (y0 + y1) / 2)) y0 = ym; else y1 = ym; + if (!(parent = node, node = node[i = bottom << 1 | right])) return this; + if (!node.length) break; + if (parent[(i + 1) & 3] || parent[(i + 2) & 3] || parent[(i + 3) & 3]) retainer = parent, j = i; + } + + // Find the point to remove. + while (node.data !== d) if (!(previous = node, node = node.next)) return this; + if (next = node.next) delete node.next; + + // If there are multiple coincident points, remove just the point. + if (previous) return (next ? previous.next = next : delete previous.next), this; + + // If this is the root point, remove it. + if (!parent) return this._root = next, this; + + // Remove this leaf. + next ? parent[i] = next : delete parent[i]; + + // If the parent now contains exactly one leaf, collapse superfluous parents. + if ((node = parent[0] || parent[1] || parent[2] || parent[3]) + && node === (parent[3] || parent[2] || parent[1] || parent[0]) + && !node.length) { + if (retainer) retainer[j] = node; + else this._root = node; + } + + return this; +} + +function removeAll(data) { + for (var i = 0, n = data.length; i < n; ++i) this.remove(data[i]); + return this; +} + +function tree_root() { + return this._root; +} + +function tree_size() { + var size = 0; + this.visit(function(node) { + if (!node.length) do ++size; while (node = node.next) + }); + return size; +} + +function tree_visit(callback) { + var quads = [], q, node = this._root, child, x0, y0, x1, y1; + if (node) quads.push(new Quad$1(node, this._x0, this._y0, this._x1, this._y1)); + while (q = quads.pop()) { + if (!callback(node = q.node, x0 = q.x0, y0 = q.y0, x1 = q.x1, y1 = q.y1) && node.length) { + var xm = (x0 + x1) / 2, ym = (y0 + y1) / 2; + if (child = node[3]) quads.push(new Quad$1(child, xm, ym, x1, y1)); + if (child = node[2]) quads.push(new Quad$1(child, x0, ym, xm, y1)); + if (child = node[1]) quads.push(new Quad$1(child, xm, y0, x1, ym)); + if (child = node[0]) quads.push(new Quad$1(child, x0, y0, xm, ym)); + } + } + return this; +} + +function tree_visitAfter(callback) { + var quads = [], next = [], q; + if (this._root) quads.push(new Quad$1(this._root, this._x0, this._y0, this._x1, this._y1)); + while (q = quads.pop()) { + var node = q.node; + if (node.length) { + var child, x0 = q.x0, y0 = q.y0, x1 = q.x1, y1 = q.y1, xm = (x0 + x1) / 2, ym = (y0 + y1) / 2; + if (child = node[0]) quads.push(new Quad$1(child, x0, y0, xm, ym)); + if (child = node[1]) quads.push(new Quad$1(child, xm, y0, x1, ym)); + if (child = node[2]) quads.push(new Quad$1(child, x0, ym, xm, y1)); + if (child = node[3]) quads.push(new Quad$1(child, xm, ym, x1, y1)); + } + next.push(q); + } + while (q = next.pop()) { + callback(q.node, q.x0, q.y0, q.x1, q.y1); + } + return this; +} + +function defaultX(d) { + return d[0]; +} + +function tree_x(_) { + return arguments.length ? (this._x = _, this) : this._x; +} + +function defaultY(d) { + return d[1]; +} + +function tree_y(_) { + return arguments.length ? (this._y = _, this) : this._y; +} + +function quadtree(nodes, x, y) { + var tree = new Quadtree(x == null ? defaultX : x, y == null ? defaultY : y, NaN, NaN, NaN, NaN); + return nodes == null ? tree : tree.addAll(nodes); +} + +function Quadtree(x, y, x0, y0, x1, y1) { + this._x = x; + this._y = y; + this._x0 = x0; + this._y0 = y0; + this._x1 = x1; + this._y1 = y1; + this._root = undefined; +} + +function leaf_copy(leaf) { + var copy = {data: leaf.data}, next = copy; + while (leaf = leaf.next) next = next.next = {data: leaf.data}; + return copy; +} + +var treeProto = quadtree.prototype = Quadtree.prototype; + +treeProto.copy = function() { + var copy = new Quadtree(this._x, this._y, this._x0, this._y0, this._x1, this._y1), + node = this._root, + nodes, + child; + + if (!node) return copy; + + if (!node.length) return copy._root = leaf_copy(node), copy; + + nodes = [{source: node, target: copy._root = new Array(4)}]; + while (node = nodes.pop()) { + for (var i = 0; i < 4; ++i) { + if (child = node.source[i]) { + if (child.length) nodes.push({source: child, target: node.target[i] = new Array(4)}); + else node.target[i] = leaf_copy(child); + } + } + } + + return copy; +}; + +treeProto.add = tree_add; +treeProto.addAll = addAll; +treeProto.cover = tree_cover; +treeProto.data = tree_data; +treeProto.extent = tree_extent; +treeProto.find = tree_find; +treeProto.remove = tree_remove; +treeProto.removeAll = removeAll; +treeProto.root = tree_root; +treeProto.size = tree_size; +treeProto.visit = tree_visit; +treeProto.visitAfter = tree_visitAfter; +treeProto.x = tree_x; +treeProto.y = tree_y; + +function constant$2(x) { + return function() { + return x; + }; +} + +function jiggle(random) { + return (random() - 0.5) * 1e-6; +} + +function x$2(d) { + return d.x + d.vx; +} + +function y$2(d) { + return d.y + d.vy; +} + +function collide(radius) { + var nodes, + radii, + random, + strength = 1, + iterations = 1; + + if (typeof radius !== "function") radius = constant$2(radius == null ? 1 : +radius); + + function force() { + var i, n = nodes.length, + tree, + node, + xi, + yi, + ri, + ri2; + + for (var k = 0; k < iterations; ++k) { + tree = quadtree(nodes, x$2, y$2).visitAfter(prepare); + for (i = 0; i < n; ++i) { + node = nodes[i]; + ri = radii[node.index], ri2 = ri * ri; + xi = node.x + node.vx; + yi = node.y + node.vy; + tree.visit(apply); + } + } + + function apply(quad, x0, y0, x1, y1) { + var data = quad.data, rj = quad.r, r = ri + rj; + if (data) { + if (data.index > node.index) { + var x = xi - data.x - data.vx, + y = yi - data.y - data.vy, + l = x * x + y * y; + if (l < r * r) { + if (x === 0) x = jiggle(random), l += x * x; + if (y === 0) y = jiggle(random), l += y * y; + l = (r - (l = Math.sqrt(l))) / l * strength; + node.vx += (x *= l) * (r = (rj *= rj) / (ri2 + rj)); + node.vy += (y *= l) * r; + data.vx -= x * (r = 1 - r); + data.vy -= y * r; + } + } + return; + } + return x0 > xi + r || x1 < xi - r || y0 > yi + r || y1 < yi - r; + } + } + + function prepare(quad) { + if (quad.data) return quad.r = radii[quad.data.index]; + for (var i = quad.r = 0; i < 4; ++i) { + if (quad[i] && quad[i].r > quad.r) { + quad.r = quad[i].r; + } + } + } + + function initialize() { + if (!nodes) return; + var i, n = nodes.length, node; + radii = new Array(n); + for (i = 0; i < n; ++i) node = nodes[i], radii[node.index] = +radius(node, i, nodes); + } + + force.initialize = function(_nodes, _random) { + nodes = _nodes; + random = _random; + initialize(); + }; + + force.iterations = function(_) { + return arguments.length ? (iterations = +_, force) : iterations; + }; + + force.strength = function(_) { + return arguments.length ? (strength = +_, force) : strength; + }; + + force.radius = function(_) { + return arguments.length ? (radius = typeof _ === "function" ? _ : constant$2(+_), initialize(), force) : radius; + }; + + return force; +} + +function index(d) { + return d.index; +} + +function find$1(nodeById, nodeId) { + var node = nodeById.get(nodeId); + if (!node) throw new Error("node not found: " + nodeId); + return node; +} + +function link(links) { + var id = index, + strength = defaultStrength, + strengths, + distance = constant$2(30), + distances, + nodes, + count, + bias, + random, + iterations = 1; + + if (links == null) links = []; + + function defaultStrength(link) { + return 1 / Math.min(count[link.source.index], count[link.target.index]); + } + + function force(alpha) { + for (var k = 0, n = links.length; k < iterations; ++k) { + for (var i = 0, link, source, target, x, y, l, b; i < n; ++i) { + link = links[i], source = link.source, target = link.target; + x = target.x + target.vx - source.x - source.vx || jiggle(random); + y = target.y + target.vy - source.y - source.vy || jiggle(random); + l = Math.sqrt(x * x + y * y); + l = (l - distances[i]) / l * alpha * strengths[i]; + x *= l, y *= l; + target.vx -= x * (b = bias[i]); + target.vy -= y * b; + source.vx += x * (b = 1 - b); + source.vy += y * b; + } + } + } + + function initialize() { + if (!nodes) return; + + var i, + n = nodes.length, + m = links.length, + nodeById = new Map(nodes.map((d, i) => [id(d, i, nodes), d])), + link; + + for (i = 0, count = new Array(n); i < m; ++i) { + link = links[i], link.index = i; + if (typeof link.source !== "object") link.source = find$1(nodeById, link.source); + if (typeof link.target !== "object") link.target = find$1(nodeById, link.target); + count[link.source.index] = (count[link.source.index] || 0) + 1; + count[link.target.index] = (count[link.target.index] || 0) + 1; + } + + for (i = 0, bias = new Array(m); i < m; ++i) { + link = links[i], bias[i] = count[link.source.index] / (count[link.source.index] + count[link.target.index]); + } + + strengths = new Array(m), initializeStrength(); + distances = new Array(m), initializeDistance(); + } + + function initializeStrength() { + if (!nodes) return; + + for (var i = 0, n = links.length; i < n; ++i) { + strengths[i] = +strength(links[i], i, links); + } + } + + function initializeDistance() { + if (!nodes) return; + + for (var i = 0, n = links.length; i < n; ++i) { + distances[i] = +distance(links[i], i, links); + } + } + + force.initialize = function(_nodes, _random) { + nodes = _nodes; + random = _random; + initialize(); + }; + + force.links = function(_) { + return arguments.length ? (links = _, initialize(), force) : links; + }; + + force.id = function(_) { + return arguments.length ? (id = _, force) : id; + }; + + force.iterations = function(_) { + return arguments.length ? (iterations = +_, force) : iterations; + }; + + force.strength = function(_) { + return arguments.length ? (strength = typeof _ === "function" ? _ : constant$2(+_), initializeStrength(), force) : strength; + }; + + force.distance = function(_) { + return arguments.length ? (distance = typeof _ === "function" ? _ : constant$2(+_), initializeDistance(), force) : distance; + }; + + return force; +} + +var noop$2 = {value: () => {}}; + +function dispatch() { + for (var i = 0, n = arguments.length, _ = {}, t; i < n; ++i) { + if (!(t = arguments[i] + "") || (t in _) || /[\s.]/.test(t)) throw new Error("illegal type: " + t); + _[t] = []; + } + return new Dispatch(_); +} + +function Dispatch(_) { + this._ = _; +} + +function parseTypenames(typenames, types) { + return typenames.trim().split(/^|\s+/).map(function(t) { + var name = "", i = t.indexOf("."); + if (i >= 0) name = t.slice(i + 1), t = t.slice(0, i); + if (t && !types.hasOwnProperty(t)) throw new Error("unknown type: " + t); + return {type: t, name: name}; + }); +} + +Dispatch.prototype = dispatch.prototype = { + constructor: Dispatch, + on: function(typename, callback) { + var _ = this._, + T = parseTypenames(typename + "", _), + t, + i = -1, + n = T.length; + + // If no callback was specified, return the callback of the given type and name. + if (arguments.length < 2) { + while (++i < n) if ((t = (typename = T[i]).type) && (t = get$2(_[t], typename.name))) return t; + return; + } + + // If a type was specified, set the callback for the given type and name. + // Otherwise, if a null callback was specified, remove callbacks of the given name. + if (callback != null && typeof callback !== "function") throw new Error("invalid callback: " + callback); + while (++i < n) { + if (t = (typename = T[i]).type) _[t] = set$2(_[t], typename.name, callback); + else if (callback == null) for (t in _) _[t] = set$2(_[t], typename.name, null); + } + + return this; + }, + copy: function() { + var copy = {}, _ = this._; + for (var t in _) copy[t] = _[t].slice(); + return new Dispatch(copy); + }, + call: function(type, that) { + if ((n = arguments.length - 2) > 0) for (var args = new Array(n), i = 0, n, t; i < n; ++i) args[i] = arguments[i + 2]; + if (!this._.hasOwnProperty(type)) throw new Error("unknown type: " + type); + for (t = this._[type], i = 0, n = t.length; i < n; ++i) t[i].value.apply(that, args); + }, + apply: function(type, that, args) { + if (!this._.hasOwnProperty(type)) throw new Error("unknown type: " + type); + for (var t = this._[type], i = 0, n = t.length; i < n; ++i) t[i].value.apply(that, args); + } +}; + +function get$2(type, name) { + for (var i = 0, n = type.length, c; i < n; ++i) { + if ((c = type[i]).name === name) { + return c.value; + } + } +} + +function set$2(type, name, callback) { + for (var i = 0, n = type.length; i < n; ++i) { + if (type[i].name === name) { + type[i] = noop$2, type = type.slice(0, i).concat(type.slice(i + 1)); + break; + } + } + if (callback != null) type.push({name: name, value: callback}); + return type; +} + +// https://en.wikipedia.org/wiki/Linear_congruential_generator#Parameters_in_common_use +const a = 1664525; +const c = 1013904223; +const m = 4294967296; // 2^32 + +function lcg() { + let s = 1; + return () => (s = (a * s + c) % m) / m; +} + +function x$1(d) { + return d.x; +} + +function y$1(d) { + return d.y; +} + +var initialRadius = 10, + initialAngle = Math.PI * (3 - Math.sqrt(5)); + +function simulation(nodes) { + var simulation, + alpha = 1, + alphaMin = 0.001, + alphaDecay = 1 - Math.pow(alphaMin, 1 / 300), + alphaTarget = 0, + velocityDecay = 0.6, + forces = new Map(), + stepper = timer$1(step), + event = dispatch("tick", "end"), + random = lcg(); + + if (nodes == null) nodes = []; + + function step() { + tick(); + event.call("tick", simulation); + if (alpha < alphaMin) { + stepper.stop(); + event.call("end", simulation); + } + } + + function tick(iterations) { + var i, n = nodes.length, node; + + if (iterations === undefined) iterations = 1; + + for (var k = 0; k < iterations; ++k) { + alpha += (alphaTarget - alpha) * alphaDecay; + + forces.forEach(function(force) { + force(alpha); + }); + + for (i = 0; i < n; ++i) { + node = nodes[i]; + if (node.fx == null) node.x += node.vx *= velocityDecay; + else node.x = node.fx, node.vx = 0; + if (node.fy == null) node.y += node.vy *= velocityDecay; + else node.y = node.fy, node.vy = 0; + } + } + + return simulation; + } + + function initializeNodes() { + for (var i = 0, n = nodes.length, node; i < n; ++i) { + node = nodes[i], node.index = i; + if (node.fx != null) node.x = node.fx; + if (node.fy != null) node.y = node.fy; + if (isNaN(node.x) || isNaN(node.y)) { + var radius = initialRadius * Math.sqrt(0.5 + i), angle = i * initialAngle; + node.x = radius * Math.cos(angle); + node.y = radius * Math.sin(angle); + } + if (isNaN(node.vx) || isNaN(node.vy)) { + node.vx = node.vy = 0; + } + } + } + + function initializeForce(force) { + if (force.initialize) force.initialize(nodes, random); + return force; + } + + initializeNodes(); + + return simulation = { + tick: tick, + + restart: function() { + return stepper.restart(step), simulation; + }, + + stop: function() { + return stepper.stop(), simulation; + }, + + nodes: function(_) { + return arguments.length ? (nodes = _, initializeNodes(), forces.forEach(initializeForce), simulation) : nodes; + }, + + alpha: function(_) { + return arguments.length ? (alpha = +_, simulation) : alpha; + }, + + alphaMin: function(_) { + return arguments.length ? (alphaMin = +_, simulation) : alphaMin; + }, + + alphaDecay: function(_) { + return arguments.length ? (alphaDecay = +_, simulation) : +alphaDecay; + }, + + alphaTarget: function(_) { + return arguments.length ? (alphaTarget = +_, simulation) : alphaTarget; + }, + + velocityDecay: function(_) { + return arguments.length ? (velocityDecay = 1 - _, simulation) : 1 - velocityDecay; + }, + + randomSource: function(_) { + return arguments.length ? (random = _, forces.forEach(initializeForce), simulation) : random; + }, + + force: function(name, _) { + return arguments.length > 1 ? ((_ == null ? forces.delete(name) : forces.set(name, initializeForce(_))), simulation) : forces.get(name); + }, + + find: function(x, y, radius) { + var i = 0, + n = nodes.length, + dx, + dy, + d2, + node, + closest; + + if (radius == null) radius = Infinity; + else radius *= radius; + + for (i = 0; i < n; ++i) { + node = nodes[i]; + dx = x - node.x; + dy = y - node.y; + d2 = dx * dx + dy * dy; + if (d2 < radius) closest = node, radius = d2; + } + + return closest; + }, + + on: function(name, _) { + return arguments.length > 1 ? (event.on(name, _), simulation) : event.on(name); + } + }; +} + +function manyBody() { + var nodes, + node, + random, + alpha, + strength = constant$2(-30), + strengths, + distanceMin2 = 1, + distanceMax2 = Infinity, + theta2 = 0.81; + + function force(_) { + var i, n = nodes.length, tree = quadtree(nodes, x$1, y$1).visitAfter(accumulate); + for (alpha = _, i = 0; i < n; ++i) node = nodes[i], tree.visit(apply); + } + + function initialize() { + if (!nodes) return; + var i, n = nodes.length, node; + strengths = new Array(n); + for (i = 0; i < n; ++i) node = nodes[i], strengths[node.index] = +strength(node, i, nodes); + } + + function accumulate(quad) { + var strength = 0, q, c, weight = 0, x, y, i; + + // For internal nodes, accumulate forces from child quadrants. + if (quad.length) { + for (x = y = i = 0; i < 4; ++i) { + if ((q = quad[i]) && (c = Math.abs(q.value))) { + strength += q.value, weight += c, x += c * q.x, y += c * q.y; + } + } + quad.x = x / weight; + quad.y = y / weight; + } + + // For leaf nodes, accumulate forces from coincident quadrants. + else { + q = quad; + q.x = q.data.x; + q.y = q.data.y; + do strength += strengths[q.data.index]; + while (q = q.next); + } + + quad.value = strength; + } + + function apply(quad, x1, _, x2) { + if (!quad.value) return true; + + var x = quad.x - node.x, + y = quad.y - node.y, + w = x2 - x1, + l = x * x + y * y; + + // Apply the Barnes-Hut approximation if possible. + // Limit forces for very close nodes; randomize direction if coincident. + if (w * w / theta2 < l) { + if (l < distanceMax2) { + if (x === 0) x = jiggle(random), l += x * x; + if (y === 0) y = jiggle(random), l += y * y; + if (l < distanceMin2) l = Math.sqrt(distanceMin2 * l); + node.vx += x * quad.value * alpha / l; + node.vy += y * quad.value * alpha / l; + } + return true; + } + + // Otherwise, process points directly. + else if (quad.length || l >= distanceMax2) return; + + // Limit forces for very close nodes; randomize direction if coincident. + if (quad.data !== node || quad.next) { + if (x === 0) x = jiggle(random), l += x * x; + if (y === 0) y = jiggle(random), l += y * y; + if (l < distanceMin2) l = Math.sqrt(distanceMin2 * l); + } + + do if (quad.data !== node) { + w = strengths[quad.data.index] * alpha / l; + node.vx += x * w; + node.vy += y * w; + } while (quad = quad.next); + } + + force.initialize = function(_nodes, _random) { + nodes = _nodes; + random = _random; + initialize(); + }; + + force.strength = function(_) { + return arguments.length ? (strength = typeof _ === "function" ? _ : constant$2(+_), initialize(), force) : strength; + }; + + force.distanceMin = function(_) { + return arguments.length ? (distanceMin2 = _ * _, force) : Math.sqrt(distanceMin2); + }; + + force.distanceMax = function(_) { + return arguments.length ? (distanceMax2 = _ * _, force) : Math.sqrt(distanceMax2); + }; + + force.theta = function(_) { + return arguments.length ? (theta2 = _ * _, force) : Math.sqrt(theta2); + }; + + return force; +} + +function x(x) { + var strength = constant$2(0.1), + nodes, + strengths, + xz; + + if (typeof x !== "function") x = constant$2(x == null ? 0 : +x); + + function force(alpha) { + for (var i = 0, n = nodes.length, node; i < n; ++i) { + node = nodes[i], node.vx += (xz[i] - node.x) * strengths[i] * alpha; + } + } + + function initialize() { + if (!nodes) return; + var i, n = nodes.length; + strengths = new Array(n); + xz = new Array(n); + for (i = 0; i < n; ++i) { + strengths[i] = isNaN(xz[i] = +x(nodes[i], i, nodes)) ? 0 : +strength(nodes[i], i, nodes); + } + } + + force.initialize = function(_) { + nodes = _; + initialize(); + }; + + force.strength = function(_) { + return arguments.length ? (strength = typeof _ === "function" ? _ : constant$2(+_), initialize(), force) : strength; + }; + + force.x = function(_) { + return arguments.length ? (x = typeof _ === "function" ? _ : constant$2(+_), initialize(), force) : x; + }; + + return force; +} + +function y(y) { + var strength = constant$2(0.1), + nodes, + strengths, + yz; + + if (typeof y !== "function") y = constant$2(y == null ? 0 : +y); + + function force(alpha) { + for (var i = 0, n = nodes.length, node; i < n; ++i) { + node = nodes[i], node.vy += (yz[i] - node.y) * strengths[i] * alpha; + } + } + + function initialize() { + if (!nodes) return; + var i, n = nodes.length; + strengths = new Array(n); + yz = new Array(n); + for (i = 0; i < n; ++i) { + strengths[i] = isNaN(yz[i] = +y(nodes[i], i, nodes)) ? 0 : +strength(nodes[i], i, nodes); + } + } + + force.initialize = function(_) { + nodes = _; + initialize(); + }; + + force.strength = function(_) { + return arguments.length ? (strength = typeof _ === "function" ? _ : constant$2(+_), initialize(), force) : strength; + }; + + force.y = function(_) { + return arguments.length ? (y = typeof _ === "function" ? _ : constant$2(+_), initialize(), force) : y; + }; + + return force; +} + +// https://github.com/john-guerra/forceInABox/blob/master/src/forceInABox.js +function forceInABox() { + function constant(_) { + return () => _; + } + let groupBy = (d) => { + return d.cluster; + }; + let forceNodeSize = constant(1); + let forceCharge = constant(-1); + let forceLinkDistance = constant(100); + let forceLinkStrength = constant(0.1); + let offset = [0, 0]; + let nodes = []; + let nodesMap = {}; + let links = []; + let centerX = 100; + let centerY = 100; + let foci = { + none: { + x: 0, + y: 0, + }, + }; + let templateNodes = []; + let templateForce; + let template = 'force'; + let enableGrouping = true; + let strength = 0.1; + function force(alpha) { + if (!enableGrouping) { + return force; + } + templateForce.tick(); + getFocisFromTemplate(); + for (let i = 0, n = nodes.length, node, k = alpha * strength; i < n; ++i) { + node = nodes[i]; + node.vx += (foci[groupBy(node)].x - node.x) * k; + node.vy += (foci[groupBy(node)].y - node.y) * k; + } + } + function initialize() { + if (!nodes) + return; + initializeWithForce(); + } + function initializeWithForce() { + if (!nodes || !nodes.length) { + return; + } + if (groupBy(nodes[0]) === undefined) { + throw Error("Couldnt find the grouping attribute for the nodes. Make sure to set it up with forceInABox.groupBy('clusterAttr') before calling .links()"); + } + // checkLinksAsObjects(); + const net = getGroupsGraph(); + templateForce = simulation(net.nodes) + .force('x', x(centerX).strength(0.1)) + .force('y', y(centerY).strength(0.1)) + .force('collide', collide((d) => d.r).iterations(4)) + .force('charge', manyBody().strength(forceCharge)) + .force('links', link(net.nodes.length ? net.links : []) + .distance(forceLinkDistance) + .strength(forceLinkStrength)); + templateNodes = templateForce.nodes(); + getFocisFromTemplate(); + } + function getGroupsGraph() { + const gnodes = []; + const glinks = []; + const dNodes = {}; + let clustersList = []; + let clustersCounts = {}; + let clustersLinks = []; + clustersCounts = computeClustersNodeCounts(nodes); + clustersLinks = computeClustersLinkCounts(links); + clustersList = Object.keys(clustersCounts); + clustersList.forEach((key, index) => { + const val = clustersCounts[key]; + // Uses approx meta-node size + gnodes.push({ + id: key, + size: val.count, + r: Math.sqrt(val.sumforceNodeSize / Math.PI), + }); + dNodes[key] = index; + }); + clustersLinks.forEach((l) => { + const sourceTerminal = getEdgeTerminal(l, 'source'); + const targetTerminal = getEdgeTerminal(l, 'target'); + const source = dNodes[sourceTerminal]; + const target = dNodes[targetTerminal]; + if (source !== undefined && target !== undefined) { + glinks.push({ + source, + target, + count: l.count, + }); + } + }); + return { + nodes: gnodes, + links: glinks, + }; + } + function computeClustersNodeCounts(nodes) { + const clustersCounts = {}; + nodes.forEach((d) => { + const key = groupBy(d); + if (!clustersCounts[key]) { + clustersCounts[key] = { + count: 0, + sumforceNodeSize: 0, + }; + } + }); + nodes.forEach((d) => { + const key = groupBy(d); + const nodeSize = forceNodeSize(d); + const tmpCount = clustersCounts[key]; + tmpCount.count = tmpCount.count + 1; + tmpCount.sumforceNodeSize = + tmpCount.sumforceNodeSize + Math.PI * (nodeSize * nodeSize) * 1.3; + clustersCounts[key] = tmpCount; + }); + return clustersCounts; + } + function computeClustersLinkCounts(links) { + const dClusterLinks = {}; + const clusterLinks = []; + links.forEach((l) => { + const key = getLinkKey(l); + let count = 0; + if (dClusterLinks[key] !== undefined) { + count = dClusterLinks[key]; + } + count += 1; + dClusterLinks[key] = count; + }); + const entries = Object.entries(dClusterLinks); + entries.forEach(([key, count]) => { + const source = key.split('~')[0]; + const target = key.split('~')[1]; + if (source !== undefined && target !== undefined) { + clusterLinks.push({ + source, + target, + count, + }); + } + }); + return clusterLinks; + } + function getFocisFromTemplate() { + foci = { + none: { + x: 0, + y: 0, + }, + }; + templateNodes.forEach((d) => { + foci[d.id] = { + x: d.x - offset[0], + y: d.y - offset[1], + }; + }); + return foci; + } + function getLinkKey(l) { + const source = getEdgeTerminal(l, 'source'); + const target = getEdgeTerminal(l, 'target'); + const sourceID = groupBy(nodesMap[source]); + const targetID = groupBy(nodesMap[target]); + return sourceID <= targetID + ? `${sourceID}~${targetID}` + : `${targetID}~${sourceID}`; + } + function genNodesMap(nodes) { + nodesMap = {}; + nodes.forEach((node) => { + nodesMap[node.id] = node; + }); + } + function setTemplate(x) { + if (!arguments.length) + return template; + template = x; + initialize(); + return force; + } + function setGroupBy(x) { + if (!arguments.length) + return groupBy; + if (typeof x === 'string') { + groupBy = (d) => { + return d[x]; + }; + return force; + } + groupBy = x; + return force; + } + function setEnableGrouping(x) { + if (!arguments.length) + return enableGrouping; + enableGrouping = x; + return force; + } + function setStrength(x) { + if (!arguments.length) + return strength; + strength = x; + return force; + } + function setCenterX(_) { + if (arguments.length) { + centerX = _; + return force; + } + return centerX; + } + function setCenterY(_) { + if (arguments.length) { + centerY = _; + return force; + } + return centerY; + } + function setNodes(_) { + if (arguments.length) { + genNodesMap(_ || []); + nodes = _ || []; + return force; + } + return nodes; + } + function setLinks(_) { + if (arguments.length) { + links = _ || []; + initialize(); + return force; + } + return links; + } + function setForceNodeSize(_) { + if (arguments.length) { + if (typeof _ === 'function') { + forceNodeSize = _; + } + else { + forceNodeSize = constant(+_); + } + initialize(); + return force; + } + return forceNodeSize; + } + function setForceCharge(_) { + if (arguments.length) { + if (typeof _ === 'function') { + forceCharge = _; + } + else { + forceCharge = constant(+_); + } + initialize(); + return force; + } + return forceCharge; + } + function setForceLinkDistance(_) { + if (arguments.length) { + if (typeof _ === 'function') { + forceLinkDistance = _; + } + else { + forceLinkDistance = constant(+_); + } + initialize(); + return force; + } + return forceLinkDistance; + } + function setForceLinkStrength(_) { + if (arguments.length) { + if (typeof _ === 'function') { + forceLinkStrength = _; + } + else { + forceLinkStrength = constant(+_); + } + initialize(); + return force; + } + return forceLinkStrength; + } + function setOffset(_) { + if (arguments.length) { + offset = _; + return force; + } + return offset; + } + force.initialize = (_) => { + nodes = _; + initialize(); + }; + force.template = setTemplate; + force.groupBy = setGroupBy; + force.enableGrouping = setEnableGrouping; + force.strength = setStrength; + force.centerX = setCenterX; + force.centerY = setCenterY; + force.nodes = setNodes; + force.links = setLinks; + force.forceNodeSize = setForceNodeSize; + // Legacy support + force.nodeSize = force.forceNodeSize; + force.forceCharge = setForceCharge; + force.forceLinkDistance = setForceLinkDistance; + force.forceLinkStrength = setForceLinkStrength; + force.offset = setOffset; + force.getFocis = getFocisFromTemplate; + return force; +} + +/** layout message type */ +const LAYOUT_MESSAGE$1 = { + // run layout + RUN: "LAYOUT_RUN", + // layout ended with success + END: "LAYOUT_END", + // layout error + ERROR: "LAYOUT_ERROR", + // layout tick, used in force directed layout + TICK: "LAYOUT_TICK", + GPURUN: "GPU_LAYOUT_RUN", + GPUEND: "GPU_LAYOUT_END" +}; + +/** + * @fileOverview random layout + * @author shiwu.wyy@antfin.com + */ +/** + * 经典力导布局 force-directed + */ +class ForceLayout extends Base { + constructor(options) { + super(); + /** 向心力作用点 */ + this.center = [0, 0]; + /** 节点作用力 */ + this.nodeStrength = null; + /** 边的作用力, 默认为根据节点的入度出度自适应 */ + this.edgeStrength = null; + /** 是否防止节点相互覆盖 */ + this.preventOverlap = false; + /** 聚类节点作用力 */ + this.clusterNodeStrength = null; + /** 聚类边作用力 */ + this.clusterEdgeStrength = null; + /** 聚类边长度 */ + this.clusterEdgeDistance = null; + /** 聚类节点大小 / 直径，直径越大，越分散 */ + this.clusterNodeSize = null; + /** 用于 foci 的力 */ + this.clusterFociStrength = null; + /** 默认边长度 */ + this.linkDistance = 50; + /** 迭代阈值的衰减率 [0, 1]，0.028 对应最大迭代数为 300 */ + this.alphaDecay = 0.028; + /** 停止迭代的阈值 */ + this.alphaMin = 0.001; + /** 当前阈值 */ + this.alpha = 0.3; + /** 防止重叠的力强度 */ + this.collideStrength = 1; + /** 是否启用web worker。前提是在web worker里执行布局，否则无效 */ + this.workerEnabled = false; + this.tick = () => { }; + /** 布局完成回调 */ + this.onLayoutEnd = () => { }; + /** 是否正在布局 */ + this.ticking = undefined; + if (options) { + this.updateCfg(options); + } + } + getDefaultCfg() { + return { + center: [0, 0], + nodeStrength: null, + edgeStrength: null, + preventOverlap: false, + nodeSize: undefined, + nodeSpacing: undefined, + linkDistance: 50, + forceSimulation: null, + alphaDecay: 0.028, + alphaMin: 0.001, + alpha: 0.3, + collideStrength: 1, + clustering: false, + clusterNodeStrength: -1, + clusterEdgeStrength: 0.1, + clusterEdgeDistance: 100, + clusterFociStrength: 0.8, + clusterNodeSize: 10, + tick() { }, + onLayoutEnd() { }, + // 是否启用web worker。前提是在web worker里执行布局，否则无效 + workerEnabled: false + }; + } + /** + * 初始化 + * @param {object} data 数据 + */ + init(data) { + const self = this; + self.nodes = data.nodes || []; + const edges = data.edges || []; + self.edges = edges.map((edge) => { + const res = {}; + const expectKeys = ["targetNode", "sourceNode", "startPoint", "endPoint"]; + Object.keys(edge).forEach((key) => { + if (!(expectKeys.indexOf(key) > -1)) { + res[key] = edge[key]; + } + }); + return res; + }); + self.ticking = false; + } + /** + * 执行布局 + */ + execute(reloadData) { + const self = this; + const nodes = self.nodes; + const edges = self.edges; + // 如果正在布局，忽略布局请求 + if (self.ticking) { + return; + } + let simulation$1 = self.forceSimulation; + const alphaMin = self.alphaMin; + const alphaDecay = self.alphaDecay; + const alpha = self.alpha; + if (!simulation$1) { + try { + // 定义节点的力 + const nodeForce = manyBody(); + if (self.nodeStrength) { + nodeForce.strength(self.nodeStrength); + } + simulation$1 = simulation().nodes(nodes); + if (self.clustering) { + const clusterForce = forceInABox(); + clusterForce + .centerX(self.center[0]) + .centerY(self.center[1]) + .template("force") + .strength(self.clusterFociStrength); + if (edges) { + clusterForce.links(edges); + } + if (nodes) { + clusterForce.nodes(nodes); + } + clusterForce + .forceLinkDistance(self.clusterEdgeDistance) + .forceLinkStrength(self.clusterEdgeStrength) + .forceCharge(self.clusterNodeStrength) + .forceNodeSize(self.clusterNodeSize); + self.clusterForce = clusterForce; + simulation$1.force("group", clusterForce); + } + simulation$1 + .force("center", center(self.center[0], self.center[1])) + .force("charge", nodeForce) + .alpha(alpha) + .alphaDecay(alphaDecay) + .alphaMin(alphaMin); + if (self.preventOverlap) { + self.overlapProcess(simulation$1); + } + // 如果有边，定义边的力 + if (edges) { + // d3 的 forceLayout 会重新生成边的数据模型，为了避免污染源数据 + const edgeForce = link() + .id((d) => d.id) + .links(edges); + if (self.edgeStrength) { + edgeForce.strength(self.edgeStrength); + } + if (self.linkDistance) { + edgeForce.distance(self.linkDistance); + } + self.edgeForce = edgeForce; + simulation$1.force("link", edgeForce); + } + if (self.workerEnabled && !isInWorker()) { + // 如果不是运行在web worker里，不用web worker布局 + self.workerEnabled = false; + console.warn("workerEnabled option is only supported when running in web worker."); + } + if (!self.workerEnabled) { + simulation$1 + .on("tick", () => { + self.tick(); + }) + .on("end", () => { + self.ticking = false; + if (self.onLayoutEnd) + self.onLayoutEnd(); + }); + self.ticking = true; + } + else { + // worker is enabled + simulation$1.stop(); + const totalTicks = getSimulationTicks(simulation$1); + for (let currentTick = 1; currentTick <= totalTicks; currentTick++) { + simulation$1.tick(); + // currentTick starts from 1. + postMessage({ + nodes, + currentTick, + totalTicks, + type: LAYOUT_MESSAGE$1.TICK + }, undefined); + } + self.ticking = false; + } + self.forceSimulation = simulation$1; + self.ticking = true; + } + catch (e) { + self.ticking = false; + console.warn(e); + } + } + else { + if (reloadData) { + if (self.clustering && self.clusterForce) { + self.clusterForce.nodes(nodes); + self.clusterForce.links(edges); + } + simulation$1.nodes(nodes); + if (edges && self.edgeForce) + self.edgeForce.links(edges); + else if (edges && !self.edgeForce) { + // d3 的 forceLayout 会重新生成边的数据模型，为了避免污染源数据 + const edgeForce = link() + .id((d) => d.id) + .links(edges); + if (self.edgeStrength) { + edgeForce.strength(self.edgeStrength); + } + if (self.linkDistance) { + edgeForce.distance(self.linkDistance); + } + self.edgeForce = edgeForce; + simulation$1.force("link", edgeForce); + } + } + if (self.preventOverlap) { + self.overlapProcess(simulation$1); + } + simulation$1.alpha(alpha).restart(); + this.ticking = true; + } + } + /** + * 防止重叠 + * @param {object} simulation 力模拟模型 + */ + overlapProcess(simulation) { + const self = this; + const nodeSize = self.nodeSize; + const nodeSpacing = self.nodeSpacing; + let nodeSizeFunc; + let nodeSpacingFunc; + const collideStrength = self.collideStrength; + if (isNumber$2(nodeSpacing)) { + nodeSpacingFunc = () => nodeSpacing; + } + else if (isFunction$5(nodeSpacing)) { + nodeSpacingFunc = nodeSpacing; + } + else { + nodeSpacingFunc = () => 0; + } + if (!nodeSize) { + nodeSizeFunc = (d) => { + if (d.size) { + if (isArray$l(d.size)) { + const res = d.size[0] > d.size[1] ? d.size[0] : d.size[1]; + return res / 2 + nodeSpacingFunc(d); + } + if (isObject$e(d.size)) { + const res = d.size.width > d.size.height ? d.size.width : d.size.height; + return res / 2 + nodeSpacingFunc(d); + } + return d.size / 2 + nodeSpacingFunc(d); + } + return 10 + nodeSpacingFunc(d); + }; + } + else if (isFunction$5(nodeSize)) { + nodeSizeFunc = (d) => { + const size = nodeSize(d); + return size + nodeSpacingFunc(d); + }; + } + else if (isArray$l(nodeSize)) { + const larger = nodeSize[0] > nodeSize[1] ? nodeSize[0] : nodeSize[1]; + const radius = larger / 2; + nodeSizeFunc = (d) => radius + nodeSpacingFunc(d); + } + else if (isNumber$2(nodeSize)) { + const radius = nodeSize / 2; + nodeSizeFunc = (d) => radius + nodeSpacingFunc(d); + } + else { + nodeSizeFunc = () => 10; + } + // forceCollide's parameter is a radius + simulation.force("collisionForce", collide(nodeSizeFunc).strength(collideStrength)); + } + /** + * 更新布局配置，但不执行布局 + * @param {object} cfg 需要更新的配置项 + */ + updateCfg(cfg) { + const self = this; + if (self.ticking) { + self.forceSimulation.stop(); + self.ticking = false; + } + self.forceSimulation = null; + Object.assign(self, cfg); + } + destroy() { + const self = this; + if (self.ticking) { + self.forceSimulation.stop(); + self.ticking = false; + } + self.nodes = null; + self.edges = null; + self.destroyed = true; + } +} +// Return total ticks of d3-force simulation +function getSimulationTicks(simulation) { + const alphaMin = simulation.alphaMin(); + const alphaTarget = simulation.alphaTarget(); + const alpha = simulation.alpha(); + const totalTicksFloat = Math.log((alphaMin - alphaTarget) / (alpha - alphaTarget)) / + Math.log(1 - simulation.alphaDecay()); + const totalTicks = Math.ceil(totalTicksFloat); + return totalTicks; +} +// 判断是否运行在web worker里 +function isInWorker() { + // eslint-disable-next-line no-undef + return (typeof WorkerGlobalScope !== "undefined" && + self instanceof WorkerGlobalScope); +} + +/** + * @fileOverview random layout + * @author shiwu.wyy@antfin.com + */ +function initHierarchy(nodes, edges, nodeMap, directed) { + nodes.forEach((_, i) => { + nodes[i].children = []; + nodes[i].parent = []; + }); + if (directed) { + edges.forEach((e) => { + const source = getEdgeTerminal(e, 'source'); + const target = getEdgeTerminal(e, 'target'); + let sourceIdx = 0; + if (source) { + sourceIdx = nodeMap[source]; + } + let targetIdx = 0; + if (target) { + targetIdx = nodeMap[target]; + } + const child = nodes[sourceIdx].children; + const parent = nodes[targetIdx].parent; + child.push(nodes[targetIdx].id); + parent.push(nodes[sourceIdx].id); + }); + } + else { + edges.forEach((e) => { + const source = getEdgeTerminal(e, 'source'); + const target = getEdgeTerminal(e, 'target'); + let sourceIdx = 0; + if (source) { + sourceIdx = nodeMap[source]; + } + let targetIdx = 0; + if (target) { + targetIdx = nodeMap[target]; + } + const sourceChildren = nodes[sourceIdx].children; + const targetChildren = nodes[targetIdx].children; + sourceChildren.push(nodes[targetIdx].id); + targetChildren.push(nodes[sourceIdx].id); + }); + } +} +function connect(a, b, edges) { + const m = edges.length; + for (let i = 0; i < m; i++) { + const source = getEdgeTerminal(edges[i], 'source'); + const target = getEdgeTerminal(edges[i], 'target'); + if ((a.id === source && b.id === target) || + (b.id === source && a.id === target)) { + return true; + } + } + return false; +} +function compareDegree(a, b) { + const aDegree = a.degree; + const bDegree = b.degree; + if (aDegree < bDegree) { + return -1; + } + if (aDegree > bDegree) { + return 1; + } + return 0; +} +/** + * 圆形布局 + */ +class CircularLayout extends Base { + constructor(options) { + super(); + /** 固定半径，若设置了 radius，则 startRadius 与 endRadius 不起效 */ + this.radius = null; + /** 起始半径 */ + this.startRadius = null; + /** 终止半径 */ + this.endRadius = null; + /** 起始角度 */ + this.startAngle = 0; + /** 终止角度 */ + this.endAngle = 2 * Math.PI; + /** 是否顺时针 */ + this.clockwise = true; + /** 节点在环上分成段数（几个段将均匀分布），在 endRadius - startRadius != 0 时生效 */ + this.divisions = 1; + /** 节点在环上排序的依据，可选: 'topology', 'degree', 'null' */ + this.ordering = null; + /** how many 2*pi from first to last nodes */ + this.angleRatio = 1; + this.nodes = []; + this.edges = []; + this.nodeMap = {}; + this.degrees = []; + this.width = 300; + this.height = 300; + this.updateCfg(options); + } + getDefaultCfg() { + return { + radius: null, + startRadius: null, + endRadius: null, + startAngle: 0, + endAngle: 2 * Math.PI, + clockwise: true, + divisions: 1, + ordering: null, + angleRatio: 1 + }; + } + /** + * 执行布局 + */ + execute() { + const self = this; + const nodes = self.nodes; + const edges = self.edges; + const n = nodes.length; + if (n === 0) { + if (self.onLayoutEnd) + self.onLayoutEnd(); + return; + } + if (!self.width && typeof window !== "undefined") { + self.width = window.innerWidth; + } + if (!self.height && typeof window !== "undefined") { + self.height = window.innerHeight; + } + if (!self.center) { + self.center = [self.width / 2, self.height / 2]; + } + const center = self.center; + if (n === 1) { + nodes[0].x = center[0]; + nodes[0].y = center[1]; + if (self.onLayoutEnd) + self.onLayoutEnd(); + return; + } + let radius = self.radius; + let startRadius = self.startRadius; + let endRadius = self.endRadius; + const divisions = self.divisions; + const startAngle = self.startAngle; + const endAngle = self.endAngle; + const angleStep = (endAngle - startAngle) / n; + // layout + const nodeMap = {}; + nodes.forEach((node, i) => { + nodeMap[node.id] = i; + }); + self.nodeMap = nodeMap; + const degrees = getDegree(nodes.length, nodeMap, edges); + self.degrees = degrees; + if (!radius && !startRadius && !endRadius) { + radius = self.height > self.width ? self.width / 2 : self.height / 2; + } + else if (!startRadius && endRadius) { + startRadius = endRadius; + } + else if (startRadius && !endRadius) { + endRadius = startRadius; + } + const angleRatio = self.angleRatio; + const astep = angleStep * angleRatio; + const ordering = self.ordering; + let layoutNodes = []; + if (ordering === "topology") { + // layout according to the topology + layoutNodes = self.topologyOrdering(); + } + else if (ordering === "topology-directed") { + // layout according to the topology + layoutNodes = self.topologyOrdering(true); + } + else if (ordering === "degree") { + // layout according to the descent order of degrees + layoutNodes = self.degreeOrdering(); + } + else { + // layout according to the original order in the data.nodes + layoutNodes = nodes; + } + const clockwise = self.clockwise; + const divN = Math.ceil(n / divisions); // node number in each division + for (let i = 0; i < n; ++i) { + let r = radius; + if (!r && startRadius !== null && endRadius !== null) { + r = startRadius + (i * (endRadius - startRadius)) / (n - 1); + } + if (!r) { + r = 10 + (i * 100) / (n - 1); + } + let angle = startAngle + + (i % divN) * astep + + ((2 * Math.PI) / divisions) * Math.floor(i / divN); + if (!clockwise) { + angle = + endAngle - + (i % divN) * astep - + ((2 * Math.PI) / divisions) * Math.floor(i / divN); + } + layoutNodes[i].x = center[0] + Math.cos(angle) * r; + layoutNodes[i].y = center[1] + Math.sin(angle) * r; + layoutNodes[i].weight = degrees[i]; + } + if (self.onLayoutEnd) + self.onLayoutEnd(); + return { + nodes: layoutNodes, + edges: this.edges + }; + } + /** + * 根据节点的拓扑结构排序 + * @return {array} orderedNodes 排序后的结果 + */ + topologyOrdering(directed = false) { + const self = this; + const degrees = self.degrees; + const edges = self.edges; + const nodes = self.nodes; + const cnodes = clone$2(nodes); + const nodeMap = self.nodeMap; + const orderedCNodes = [cnodes[0]]; + const resNodes = [nodes[0]]; + const pickFlags = []; + const n = nodes.length; + pickFlags[0] = true; + initHierarchy(cnodes, edges, nodeMap, directed); + let k = 0; + cnodes.forEach((cnode, i) => { + if (i !== 0) { + if ((i === n - 1 || + degrees[i] !== degrees[i + 1] || + connect(orderedCNodes[k], cnode, edges)) && + !pickFlags[i]) { + orderedCNodes.push(cnode); + resNodes.push(nodes[nodeMap[cnode.id]]); + pickFlags[i] = true; + k++; + } + else { + const children = orderedCNodes[k].children; + let foundChild = false; + for (let j = 0; j < children.length; j++) { + const childIdx = nodeMap[children[j]]; + if (degrees[childIdx] === degrees[i] && !pickFlags[childIdx]) { + orderedCNodes.push(cnodes[childIdx]); + resNodes.push(nodes[nodeMap[cnodes[childIdx].id]]); + pickFlags[childIdx] = true; + foundChild = true; + break; + } + } + let ii = 0; + while (!foundChild) { + if (!pickFlags[ii]) { + orderedCNodes.push(cnodes[ii]); + resNodes.push(nodes[nodeMap[cnodes[ii].id]]); + pickFlags[ii] = true; + foundChild = true; + } + ii++; + if (ii === n) { + break; + } + } + } + } + }); + return resNodes; + } + /** + * 根据节点度数大小排序 + * @return {array} orderedNodes 排序后的结果 + */ + degreeOrdering() { + const self = this; + const nodes = self.nodes; + const orderedNodes = []; + const degrees = self.degrees; + nodes.forEach((node, i) => { + node.degree = degrees[i]; + orderedNodes.push(node); + }); + orderedNodes.sort(compareDegree); + return orderedNodes; + } + getType() { + return "circular"; + } +} + +/** + * Removes all key-value entries from the list cache. + * + * @private + * @name clear + * @memberOf ListCache + */ + +function listCacheClear$1() { + this.__data__ = []; + this.size = 0; +} + +var _listCacheClear = listCacheClear$1; + +/** + * Performs a + * [`SameValueZero`](http://ecma-international.org/ecma-262/7.0/#sec-samevaluezero) + * comparison between two values to determine if they are equivalent. + * + * @static + * @memberOf _ + * @since 4.0.0 + * @category Lang + * @param {*} value The value to compare. + * @param {*} other The other value to compare. + * @returns {boolean} Returns `true` if the values are equivalent, else `false`. + * @example + * + * var object = { 'a': 1 }; + * var other = { 'a': 1 }; + * + * _.eq(object, object); + * // => true + * + * _.eq(object, other); + * // => false + * + * _.eq('a', 'a'); + * // => true + * + * _.eq('a', Object('a')); + * // => false + * + * _.eq(NaN, NaN); + * // => true + */ + +function eq$6(value, other) { + return value === other || (value !== value && other !== other); +} + +var eq_1 = eq$6; + +var eq$5 = eq_1; + +/** + * Gets the index at which the `key` is found in `array` of key-value pairs. + * + * @private + * @param {Array} array The array to inspect. + * @param {*} key The key to search for. + * @returns {number} Returns the index of the matched value, else `-1`. + */ +function assocIndexOf$4(array, key) { + var length = array.length; + while (length--) { + if (eq$5(array[length][0], key)) { + return length; + } + } + return -1; +} + +var _assocIndexOf = assocIndexOf$4; + +var assocIndexOf$3 = _assocIndexOf; + +/** Used for built-in method references. */ +var arrayProto = Array.prototype; + +/** Built-in value references. */ +var splice = arrayProto.splice; + +/** + * Removes `key` and its value from the list cache. + * + * @private + * @name delete + * @memberOf ListCache + * @param {string} key The key of the value to remove. + * @returns {boolean} Returns `true` if the entry was removed, else `false`. + */ +function listCacheDelete$1(key) { + var data = this.__data__, + index = assocIndexOf$3(data, key); + + if (index < 0) { + return false; + } + var lastIndex = data.length - 1; + if (index == lastIndex) { + data.pop(); + } else { + splice.call(data, index, 1); + } + --this.size; + return true; +} + +var _listCacheDelete = listCacheDelete$1; + +var assocIndexOf$2 = _assocIndexOf; + +/** + * Gets the list cache value for `key`. + * + * @private + * @name get + * @memberOf ListCache + * @param {string} key The key of the value to get. + * @returns {*} Returns the entry value. + */ +function listCacheGet$1(key) { + var data = this.__data__, + index = assocIndexOf$2(data, key); + + return index < 0 ? undefined : data[index][1]; +} + +var _listCacheGet = listCacheGet$1; + +var assocIndexOf$1 = _assocIndexOf; + +/** + * Checks if a list cache value for `key` exists. + * + * @private + * @name has + * @memberOf ListCache + * @param {string} key The key of the entry to check. + * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`. + */ +function listCacheHas$1(key) { + return assocIndexOf$1(this.__data__, key) > -1; +} + +var _listCacheHas = listCacheHas$1; + +var assocIndexOf = _assocIndexOf; + +/** + * Sets the list cache `key` to `value`. + * + * @private + * @name set + * @memberOf ListCache + * @param {string} key The key of the value to set. + * @param {*} value The value to set. + * @returns {Object} Returns the list cache instance. + */ +function listCacheSet$1(key, value) { + var data = this.__data__, + index = assocIndexOf(data, key); + + if (index < 0) { + ++this.size; + data.push([key, value]); + } else { + data[index][1] = value; + } + return this; +} + +var _listCacheSet = listCacheSet$1; + +var listCacheClear = _listCacheClear, + listCacheDelete = _listCacheDelete, + listCacheGet = _listCacheGet, + listCacheHas = _listCacheHas, + listCacheSet = _listCacheSet; + +/** + * Creates an list cache object. + * + * @private + * @constructor + * @param {Array} [entries] The key-value pairs to cache. + */ +function ListCache$4(entries) { + var index = -1, + length = entries == null ? 0 : entries.length; + + this.clear(); + while (++index < length) { + var entry = entries[index]; + this.set(entry[0], entry[1]); + } +} + +// Add methods to `ListCache`. +ListCache$4.prototype.clear = listCacheClear; +ListCache$4.prototype['delete'] = listCacheDelete; +ListCache$4.prototype.get = listCacheGet; +ListCache$4.prototype.has = listCacheHas; +ListCache$4.prototype.set = listCacheSet; + +var _ListCache = ListCache$4; + +var ListCache$3 = _ListCache; + +/** + * Removes all key-value entries from the stack. + * + * @private + * @name clear + * @memberOf Stack + */ +function stackClear$1() { + this.__data__ = new ListCache$3; + this.size = 0; +} + +var _stackClear = stackClear$1; + +/** + * Removes `key` and its value from the stack. + * + * @private + * @name delete + * @memberOf Stack + * @param {string} key The key of the value to remove. + * @returns {boolean} Returns `true` if the entry was removed, else `false`. + */ + +function stackDelete$1(key) { + var data = this.__data__, + result = data['delete'](key); + + this.size = data.size; + return result; +} + +var _stackDelete = stackDelete$1; + +/** + * Gets the stack value for `key`. + * + * @private + * @name get + * @memberOf Stack + * @param {string} key The key of the value to get. + * @returns {*} Returns the entry value. + */ + +function stackGet$1(key) { + return this.__data__.get(key); +} + +var _stackGet = stackGet$1; + +/** + * Checks if a stack value for `key` exists. + * + * @private + * @name has + * @memberOf Stack + * @param {string} key The key of the entry to check. + * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`. + */ + +function stackHas$1(key) { + return this.__data__.has(key); +} + +var _stackHas = stackHas$1; + +/** Detect free variable `global` from Node.js. */ + +var freeGlobal$1 = typeof commonjsGlobal == 'object' && commonjsGlobal && commonjsGlobal.Object === Object && commonjsGlobal; + +var _freeGlobal = freeGlobal$1; + +var freeGlobal = _freeGlobal; + +/** Detect free variable `self`. */ +var freeSelf = typeof self == 'object' && self && self.Object === Object && self; + +/** Used as a reference to the global object. */ +var root$9 = freeGlobal || freeSelf || Function('return this')(); + +var _root = root$9; + +var root$8 = _root; + +/** Built-in value references. */ +var Symbol$7 = root$8.Symbol; + +var _Symbol = Symbol$7; + +var Symbol$6 = _Symbol; + +/** Used for built-in method references. */ +var objectProto$l = Object.prototype; + +/** Used to check objects for own properties. */ +var hasOwnProperty$f = objectProto$l.hasOwnProperty; + +/** + * Used to resolve the + * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring) + * of values. + */ +var nativeObjectToString$1 = objectProto$l.toString; + +/** Built-in value references. */ +var symToStringTag$1 = Symbol$6 ? Symbol$6.toStringTag : undefined; + +/** + * A specialized version of `baseGetTag` which ignores `Symbol.toStringTag` values. + * + * @private + * @param {*} value The value to query. + * @returns {string} Returns the raw `toStringTag`. + */ +function getRawTag$1(value) { + var isOwn = hasOwnProperty$f.call(value, symToStringTag$1), + tag = value[symToStringTag$1]; + + try { + value[symToStringTag$1] = undefined; + var unmasked = true; + } catch (e) {} + + var result = nativeObjectToString$1.call(value); + if (unmasked) { + if (isOwn) { + value[symToStringTag$1] = tag; + } else { + delete value[symToStringTag$1]; + } + } + return result; +} + +var _getRawTag = getRawTag$1; + +/** Used for built-in method references. */ + +var objectProto$k = Object.prototype; + +/** + * Used to resolve the + * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring) + * of values. + */ +var nativeObjectToString = objectProto$k.toString; + +/** + * Converts `value` to a string using `Object.prototype.toString`. + * + * @private + * @param {*} value The value to convert. + * @returns {string} Returns the converted string. + */ +function objectToString$4(value) { + return nativeObjectToString.call(value); +} + +var _objectToString = objectToString$4; + +var Symbol$5 = _Symbol, + getRawTag = _getRawTag, + objectToString$3 = _objectToString; + +/** `Object#toString` result references. */ +var nullTag = '[object Null]', + undefinedTag = '[object Undefined]'; + +/** Built-in value references. */ +var symToStringTag = Symbol$5 ? Symbol$5.toStringTag : undefined; + +/** + * The base implementation of `getTag` without fallbacks for buggy environments. + * + * @private + * @param {*} value The value to query. + * @returns {string} Returns the `toStringTag`. + */ +function baseGetTag$7(value) { + if (value == null) { + return value === undefined ? undefinedTag : nullTag; + } + return (symToStringTag && symToStringTag in Object(value)) + ? getRawTag(value) + : objectToString$3(value); +} + +var _baseGetTag = baseGetTag$7; + +/** + * Checks if `value` is the + * [language type](http://www.ecma-international.org/ecma-262/7.0/#sec-ecmascript-language-types) + * of `Object`. (e.g. arrays, functions, objects, regexes, `new Number(0)`, and `new String('')`) + * + * @static + * @memberOf _ + * @since 0.1.0 + * @category Lang + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is an object, else `false`. + * @example + * + * _.isObject({}); + * // => true + * + * _.isObject([1, 2, 3]); + * // => true + * + * _.isObject(_.noop); + * // => true + * + * _.isObject(null); + * // => false + */ + +function isObject$d(value) { + var type = typeof value; + return value != null && (type == 'object' || type == 'function'); +} + +var isObject_1 = isObject$d; + +var baseGetTag$6 = _baseGetTag, + isObject$c = isObject_1; + +/** `Object#toString` result references. */ +var asyncTag = '[object AsyncFunction]', + funcTag$5 = '[object Function]', + genTag$1 = '[object GeneratorFunction]', + proxyTag = '[object Proxy]'; + +/** + * Checks if `value` is classified as a `Function` object. + * + * @static + * @memberOf _ + * @since 0.1.0 + * @category Lang + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is a function, else `false`. + * @example + * + * _.isFunction(_); + * // => true + * + * _.isFunction(/abc/); + * // => false + */ +function isFunction$4(value) { + if (!isObject$c(value)) { + return false; + } + // The use of `Object#toString` avoids issues with the `typeof` operator + // in Safari 9 which returns 'object' for typed arrays and other constructors. + var tag = baseGetTag$6(value); + return tag == funcTag$5 || tag == genTag$1 || tag == asyncTag || tag == proxyTag; +} + +var isFunction_1 = isFunction$4; + +var root$7 = _root; + +/** Used to detect overreaching core-js shims. */ +var coreJsData$1 = root$7['__core-js_shared__']; + +var _coreJsData = coreJsData$1; + +var coreJsData = _coreJsData; + +/** Used to detect methods masquerading as native. */ +var maskSrcKey = (function() { + var uid = /[^.]+$/.exec(coreJsData && coreJsData.keys && coreJsData.keys.IE_PROTO || ''); + return uid ? ('Symbol(src)_1.' + uid) : ''; +}()); + +/** + * Checks if `func` has its source masked. + * + * @private + * @param {Function} func The function to check. + * @returns {boolean} Returns `true` if `func` is masked, else `false`. + */ +function isMasked$1(func) { + return !!maskSrcKey && (maskSrcKey in func); +} + +var _isMasked = isMasked$1; + +/** Used for built-in method references. */ + +var funcProto$2 = Function.prototype; + +/** Used to resolve the decompiled source of functions. */ +var funcToString$2 = funcProto$2.toString; + +/** + * Converts `func` to its source code. + * + * @private + * @param {Function} func The function to convert. + * @returns {string} Returns the source code. + */ +function toSource$2(func) { + if (func != null) { + try { + return funcToString$2.call(func); + } catch (e) {} + try { + return (func + ''); + } catch (e) {} + } + return ''; +} + +var _toSource = toSource$2; + +var isFunction$3 = isFunction_1, + isMasked = _isMasked, + isObject$b = isObject_1, + toSource$1 = _toSource; + +/** + * Used to match `RegExp` + * [syntax characters](http://ecma-international.org/ecma-262/7.0/#sec-patterns). + */ +var reRegExpChar = /[\\^$.*+?()[\]{}|]/g; + +/** Used to detect host constructors (Safari). */ +var reIsHostCtor = /^\[object .+?Constructor\]$/; + +/** Used for built-in method references. */ +var funcProto$1 = Function.prototype, + objectProto$j = Object.prototype; + +/** Used to resolve the decompiled source of functions. */ +var funcToString$1 = funcProto$1.toString; + +/** Used to check objects for own properties. */ +var hasOwnProperty$e = objectProto$j.hasOwnProperty; + +/** Used to detect if a method is native. */ +var reIsNative = RegExp('^' + + funcToString$1.call(hasOwnProperty$e).replace(reRegExpChar, '\\$&') + .replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g, '$1.*?') + '$' +); + +/** + * The base implementation of `_.isNative` without bad shim checks. + * + * @private + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is a native function, + * else `false`. + */ +function baseIsNative$1(value) { + if (!isObject$b(value) || isMasked(value)) { + return false; + } + var pattern = isFunction$3(value) ? reIsNative : reIsHostCtor; + return pattern.test(toSource$1(value)); +} + +var _baseIsNative = baseIsNative$1; + +/** + * Gets the value at `key` of `object`. + * + * @private + * @param {Object} [object] The object to query. + * @param {string} key The key of the property to get. + * @returns {*} Returns the property value. + */ + +function getValue$1(object, key) { + return object == null ? undefined : object[key]; +} + +var _getValue = getValue$1; + +var baseIsNative = _baseIsNative, + getValue = _getValue; + +/** + * Gets the native function at `key` of `object`. + * + * @private + * @param {Object} object The object to query. + * @param {string} key The key of the method to get. + * @returns {*} Returns the function if it's native, else `undefined`. + */ +function getNative$7(object, key) { + var value = getValue(object, key); + return baseIsNative(value) ? value : undefined; +} + +var _getNative = getNative$7; + +var getNative$6 = _getNative, + root$6 = _root; + +/* Built-in method references that are verified to be native. */ +var Map$4 = getNative$6(root$6, 'Map'); + +var _Map = Map$4; + +var getNative$5 = _getNative; + +/* Built-in method references that are verified to be native. */ +var nativeCreate$4 = getNative$5(Object, 'create'); + +var _nativeCreate = nativeCreate$4; + +var nativeCreate$3 = _nativeCreate; + +/** + * Removes all key-value entries from the hash. + * + * @private + * @name clear + * @memberOf Hash + */ +function hashClear$1() { + this.__data__ = nativeCreate$3 ? nativeCreate$3(null) : {}; + this.size = 0; +} + +var _hashClear = hashClear$1; + +/** + * Removes `key` and its value from the hash. + * + * @private + * @name delete + * @memberOf Hash + * @param {Object} hash The hash to modify. + * @param {string} key The key of the value to remove. + * @returns {boolean} Returns `true` if the entry was removed, else `false`. + */ + +function hashDelete$1(key) { + var result = this.has(key) && delete this.__data__[key]; + this.size -= result ? 1 : 0; + return result; +} + +var _hashDelete = hashDelete$1; + +var nativeCreate$2 = _nativeCreate; + +/** Used to stand-in for `undefined` hash values. */ +var HASH_UNDEFINED$2 = '__lodash_hash_undefined__'; + +/** Used for built-in method references. */ +var objectProto$i = Object.prototype; + +/** Used to check objects for own properties. */ +var hasOwnProperty$d = objectProto$i.hasOwnProperty; + +/** + * Gets the hash value for `key`. + * + * @private + * @name get + * @memberOf Hash + * @param {string} key The key of the value to get. + * @returns {*} Returns the entry value. + */ +function hashGet$1(key) { + var data = this.__data__; + if (nativeCreate$2) { + var result = data[key]; + return result === HASH_UNDEFINED$2 ? undefined : result; + } + return hasOwnProperty$d.call(data, key) ? data[key] : undefined; +} + +var _hashGet = hashGet$1; + +var nativeCreate$1 = _nativeCreate; + +/** Used for built-in method references. */ +var objectProto$h = Object.prototype; + +/** Used to check objects for own properties. */ +var hasOwnProperty$c = objectProto$h.hasOwnProperty; + +/** + * Checks if a hash value for `key` exists. + * + * @private + * @name has + * @memberOf Hash + * @param {string} key The key of the entry to check. + * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`. + */ +function hashHas$1(key) { + var data = this.__data__; + return nativeCreate$1 ? (data[key] !== undefined) : hasOwnProperty$c.call(data, key); +} + +var _hashHas = hashHas$1; + +var nativeCreate = _nativeCreate; + +/** Used to stand-in for `undefined` hash values. */ +var HASH_UNDEFINED$1 = '__lodash_hash_undefined__'; + +/** + * Sets the hash `key` to `value`. + * + * @private + * @name set + * @memberOf Hash + * @param {string} key The key of the value to set. + * @param {*} value The value to set. + * @returns {Object} Returns the hash instance. + */ +function hashSet$1(key, value) { + var data = this.__data__; + this.size += this.has(key) ? 0 : 1; + data[key] = (nativeCreate && value === undefined) ? HASH_UNDEFINED$1 : value; + return this; +} + +var _hashSet = hashSet$1; + +var hashClear = _hashClear, + hashDelete = _hashDelete, + hashGet = _hashGet, + hashHas = _hashHas, + hashSet = _hashSet; + +/** + * Creates a hash object. + * + * @private + * @constructor + * @param {Array} [entries] The key-value pairs to cache. + */ +function Hash$1(entries) { + var index = -1, + length = entries == null ? 0 : entries.length; + + this.clear(); + while (++index < length) { + var entry = entries[index]; + this.set(entry[0], entry[1]); + } +} + +// Add methods to `Hash`. +Hash$1.prototype.clear = hashClear; +Hash$1.prototype['delete'] = hashDelete; +Hash$1.prototype.get = hashGet; +Hash$1.prototype.has = hashHas; +Hash$1.prototype.set = hashSet; + +var _Hash = Hash$1; + +var Hash = _Hash, + ListCache$2 = _ListCache, + Map$3 = _Map; + +/** + * Removes all key-value entries from the map. + * + * @private + * @name clear + * @memberOf MapCache + */ +function mapCacheClear$1() { + this.size = 0; + this.__data__ = { + 'hash': new Hash, + 'map': new (Map$3 || ListCache$2), + 'string': new Hash + }; +} + +var _mapCacheClear = mapCacheClear$1; + +/** + * Checks if `value` is suitable for use as unique object key. + * + * @private + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is suitable, else `false`. + */ + +function isKeyable$1(value) { + var type = typeof value; + return (type == 'string' || type == 'number' || type == 'symbol' || type == 'boolean') + ? (value !== '__proto__') + : (value === null); +} + +var _isKeyable = isKeyable$1; + +var isKeyable = _isKeyable; + +/** + * Gets the data for `map`. + * + * @private + * @param {Object} map The map to query. + * @param {string} key The reference key. + * @returns {*} Returns the map data. + */ +function getMapData$4(map, key) { + var data = map.__data__; + return isKeyable(key) + ? data[typeof key == 'string' ? 'string' : 'hash'] + : data.map; +} + +var _getMapData = getMapData$4; + +var getMapData$3 = _getMapData; + +/** + * Removes `key` and its value from the map. + * + * @private + * @name delete + * @memberOf MapCache + * @param {string} key The key of the value to remove. + * @returns {boolean} Returns `true` if the entry was removed, else `false`. + */ +function mapCacheDelete$1(key) { + var result = getMapData$3(this, key)['delete'](key); + this.size -= result ? 1 : 0; + return result; +} + +var _mapCacheDelete = mapCacheDelete$1; + +var getMapData$2 = _getMapData; + +/** + * Gets the map value for `key`. + * + * @private + * @name get + * @memberOf MapCache + * @param {string} key The key of the value to get. + * @returns {*} Returns the entry value. + */ +function mapCacheGet$1(key) { + return getMapData$2(this, key).get(key); +} + +var _mapCacheGet = mapCacheGet$1; + +var getMapData$1 = _getMapData; + +/** + * Checks if a map value for `key` exists. + * + * @private + * @name has + * @memberOf MapCache + * @param {string} key The key of the entry to check. + * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`. + */ +function mapCacheHas$1(key) { + return getMapData$1(this, key).has(key); +} + +var _mapCacheHas = mapCacheHas$1; + +var getMapData = _getMapData; + +/** + * Sets the map `key` to `value`. + * + * @private + * @name set + * @memberOf MapCache + * @param {string} key The key of the value to set. + * @param {*} value The value to set. + * @returns {Object} Returns the map cache instance. + */ +function mapCacheSet$1(key, value) { + var data = getMapData(this, key), + size = data.size; + + data.set(key, value); + this.size += data.size == size ? 0 : 1; + return this; +} + +var _mapCacheSet = mapCacheSet$1; + +var mapCacheClear = _mapCacheClear, + mapCacheDelete = _mapCacheDelete, + mapCacheGet = _mapCacheGet, + mapCacheHas = _mapCacheHas, + mapCacheSet = _mapCacheSet; + +/** + * Creates a map cache object to store key-value pairs. + * + * @private + * @constructor + * @param {Array} [entries] The key-value pairs to cache. + */ +function MapCache$3(entries) { + var index = -1, + length = entries == null ? 0 : entries.length; + + this.clear(); + while (++index < length) { + var entry = entries[index]; + this.set(entry[0], entry[1]); + } +} + +// Add methods to `MapCache`. +MapCache$3.prototype.clear = mapCacheClear; +MapCache$3.prototype['delete'] = mapCacheDelete; +MapCache$3.prototype.get = mapCacheGet; +MapCache$3.prototype.has = mapCacheHas; +MapCache$3.prototype.set = mapCacheSet; + +var _MapCache = MapCache$3; + +var ListCache$1 = _ListCache, + Map$2 = _Map, + MapCache$2 = _MapCache; + +/** Used as the size to enable large array optimizations. */ +var LARGE_ARRAY_SIZE$1 = 200; + +/** + * Sets the stack `key` to `value`. + * + * @private + * @name set + * @memberOf Stack + * @param {string} key The key of the value to set. + * @param {*} value The value to set. + * @returns {Object} Returns the stack cache instance. + */ +function stackSet$1(key, value) { + var data = this.__data__; + if (data instanceof ListCache$1) { + var pairs = data.__data__; + if (!Map$2 || (pairs.length < LARGE_ARRAY_SIZE$1 - 1)) { + pairs.push([key, value]); + this.size = ++data.size; + return this; + } + data = this.__data__ = new MapCache$2(pairs); + } + data.set(key, value); + this.size = data.size; + return this; +} + +var _stackSet = stackSet$1; + +var ListCache = _ListCache, + stackClear = _stackClear, + stackDelete = _stackDelete, + stackGet = _stackGet, + stackHas = _stackHas, + stackSet = _stackSet; + +/** + * Creates a stack cache object to store key-value pairs. + * + * @private + * @constructor + * @param {Array} [entries] The key-value pairs to cache. + */ +function Stack$4(entries) { + var data = this.__data__ = new ListCache(entries); + this.size = data.size; +} + +// Add methods to `Stack`. +Stack$4.prototype.clear = stackClear; +Stack$4.prototype['delete'] = stackDelete; +Stack$4.prototype.get = stackGet; +Stack$4.prototype.has = stackHas; +Stack$4.prototype.set = stackSet; + +var _Stack = Stack$4; + +/** + * A specialized version of `_.forEach` for arrays without support for + * iteratee shorthands. + * + * @private + * @param {Array} [array] The array to iterate over. + * @param {Function} iteratee The function invoked per iteration. + * @returns {Array} Returns `array`. + */ + +function arrayEach$3(array, iteratee) { + var index = -1, + length = array == null ? 0 : array.length; + + while (++index < length) { + if (iteratee(array[index], index, array) === false) { + break; + } + } + return array; +} + +var _arrayEach = arrayEach$3; + +var getNative$4 = _getNative; + +var defineProperty$2 = (function() { + try { + var func = getNative$4(Object, 'defineProperty'); + func({}, '', {}); + return func; + } catch (e) {} +}()); + +var _defineProperty$1 = defineProperty$2; + +var defineProperty$1 = _defineProperty$1; + +/** + * The base implementation of `assignValue` and `assignMergeValue` without + * value checks. + * + * @private + * @param {Object} object The object to modify. + * @param {string} key The key of the property to assign. + * @param {*} value The value to assign. + */ +function baseAssignValue$4(object, key, value) { + if (key == '__proto__' && defineProperty$1) { + defineProperty$1(object, key, { + 'configurable': true, + 'enumerable': true, + 'value': value, + 'writable': true + }); + } else { + object[key] = value; + } +} + +var _baseAssignValue = baseAssignValue$4; + +var baseAssignValue$3 = _baseAssignValue, + eq$4 = eq_1; + +/** Used for built-in method references. */ +var objectProto$g = Object.prototype; + +/** Used to check objects for own properties. */ +var hasOwnProperty$b = objectProto$g.hasOwnProperty; + +/** + * Assigns `value` to `key` of `object` if the existing value is not equivalent + * using [`SameValueZero`](http://ecma-international.org/ecma-262/7.0/#sec-samevaluezero) + * for equality comparisons. + * + * @private + * @param {Object} object The object to modify. + * @param {string} key The key of the property to assign. + * @param {*} value The value to assign. + */ +function assignValue$4(object, key, value) { + var objValue = object[key]; + if (!(hasOwnProperty$b.call(object, key) && eq$4(objValue, value)) || + (value === undefined && !(key in object))) { + baseAssignValue$3(object, key, value); + } +} + +var _assignValue = assignValue$4; + +var assignValue$3 = _assignValue, + baseAssignValue$2 = _baseAssignValue; + +/** + * Copies properties of `source` to `object`. + * + * @private + * @param {Object} source The object to copy properties from. + * @param {Array} props The property identifiers to copy. + * @param {Object} [object={}] The object to copy properties to. + * @param {Function} [customizer] The function to customize copied values. + * @returns {Object} Returns `object`. + */ +function copyObject$5(source, props, object, customizer) { + var isNew = !object; + object || (object = {}); + + var index = -1, + length = props.length; + + while (++index < length) { + var key = props[index]; + + var newValue = customizer + ? customizer(object[key], source[key], key, object, source) + : undefined; + + if (newValue === undefined) { + newValue = source[key]; + } + if (isNew) { + baseAssignValue$2(object, key, newValue); + } else { + assignValue$3(object, key, newValue); + } + } + return object; +} + +var _copyObject = copyObject$5; + +/** + * The base implementation of `_.times` without support for iteratee shorthands + * or max array length checks. + * + * @private + * @param {number} n The number of times to invoke `iteratee`. + * @param {Function} iteratee The function invoked per iteration. + * @returns {Array} Returns the array of results. + */ + +function baseTimes$1(n, iteratee) { + var index = -1, + result = Array(n); + + while (++index < n) { + result[index] = iteratee(index); + } + return result; +} + +var _baseTimes = baseTimes$1; + +/** + * Checks if `value` is object-like. A value is object-like if it's not `null` + * and has a `typeof` result of "object". + * + * @static + * @memberOf _ + * @since 4.0.0 + * @category Lang + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is object-like, else `false`. + * @example + * + * _.isObjectLike({}); + * // => true + * + * _.isObjectLike([1, 2, 3]); + * // => true + * + * _.isObjectLike(_.noop); + * // => false + * + * _.isObjectLike(null); + * // => false + */ + +function isObjectLike$d(value) { + return value != null && typeof value == 'object'; +} + +var isObjectLike_1 = isObjectLike$d; + +var baseGetTag$5 = _baseGetTag, + isObjectLike$c = isObjectLike_1; + +/** `Object#toString` result references. */ +var argsTag$6 = '[object Arguments]'; + +/** + * The base implementation of `_.isArguments`. + * + * @private + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is an `arguments` object, + */ +function baseIsArguments$1(value) { + return isObjectLike$c(value) && baseGetTag$5(value) == argsTag$6; +} + +var _baseIsArguments = baseIsArguments$1; + +var baseIsArguments = _baseIsArguments, + isObjectLike$b = isObjectLike_1; + +/** Used for built-in method references. */ +var objectProto$f = Object.prototype; + +/** Used to check objects for own properties. */ +var hasOwnProperty$a = objectProto$f.hasOwnProperty; + +/** Built-in value references. */ +var propertyIsEnumerable$1 = objectProto$f.propertyIsEnumerable; + +/** + * Checks if `value` is likely an `arguments` object. + * + * @static + * @memberOf _ + * @since 0.1.0 + * @category Lang + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is an `arguments` object, + * else `false`. + * @example + * + * _.isArguments(function() { return arguments; }()); + * // => true + * + * _.isArguments([1, 2, 3]); + * // => false + */ +var isArguments$5 = baseIsArguments(function() { return arguments; }()) ? baseIsArguments : function(value) { + return isObjectLike$b(value) && hasOwnProperty$a.call(value, 'callee') && + !propertyIsEnumerable$1.call(value, 'callee'); +}; + +var isArguments_1 = isArguments$5; + +/** + * Checks if `value` is classified as an `Array` object. + * + * @static + * @memberOf _ + * @since 0.1.0 + * @category Lang + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is an array, else `false`. + * @example + * + * _.isArray([1, 2, 3]); + * // => true + * + * _.isArray(document.body.children); + * // => false + * + * _.isArray('abc'); + * // => false + * + * _.isArray(_.noop); + * // => false + */ + +var isArray$k = Array.isArray; + +var isArray_1 = isArray$k; + +var isBuffer$6 = {exports: {}}; + +/** + * This method returns `false`. + * + * @static + * @memberOf _ + * @since 4.13.0 + * @category Util + * @returns {boolean} Returns `false`. + * @example + * + * _.times(2, _.stubFalse); + * // => [false, false] + */ + +function stubFalse() { + return false; +} + +var stubFalse_1 = stubFalse; + +(function (module, exports) { +var root = _root, + stubFalse = stubFalse_1; + +/** Detect free variable `exports`. */ +var freeExports = exports && !exports.nodeType && exports; + +/** Detect free variable `module`. */ +var freeModule = freeExports && 'object' == 'object' && module && !module.nodeType && module; + +/** Detect the popular CommonJS extension `module.exports`. */ +var moduleExports = freeModule && freeModule.exports === freeExports; + +/** Built-in value references. */ +var Buffer = moduleExports ? root.Buffer : undefined; + +/* Built-in method references for those with the same name as other `lodash` methods. */ +var nativeIsBuffer = Buffer ? Buffer.isBuffer : undefined; + +/** + * Checks if `value` is a buffer. + * + * @static + * @memberOf _ + * @since 4.3.0 + * @category Lang + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is a buffer, else `false`. + * @example + * + * _.isBuffer(new Buffer(2)); + * // => true + * + * _.isBuffer(new Uint8Array(2)); + * // => false + */ +var isBuffer = nativeIsBuffer || stubFalse; + +module.exports = isBuffer; +}(isBuffer$6, isBuffer$6.exports)); + +/** Used as references for various `Number` constants. */ + +var MAX_SAFE_INTEGER$4 = 9007199254740991; + +/** Used to detect unsigned integer values. */ +var reIsUint = /^(?:0|[1-9]\d*)$/; + +/** + * Checks if `value` is a valid array-like index. + * + * @private + * @param {*} value The value to check. + * @param {number} [length=MAX_SAFE_INTEGER] The upper bounds of a valid index. + * @returns {boolean} Returns `true` if `value` is a valid index, else `false`. + */ +function isIndex$4(value, length) { + var type = typeof value; + length = length == null ? MAX_SAFE_INTEGER$4 : length; + + return !!length && + (type == 'number' || + (type != 'symbol' && reIsUint.test(value))) && + (value > -1 && value % 1 == 0 && value < length); +} + +var _isIndex = isIndex$4; + +/** Used as references for various `Number` constants. */ + +var MAX_SAFE_INTEGER$3 = 9007199254740991; + +/** + * Checks if `value` is a valid array-like length. + * + * **Note:** This method is loosely based on + * [`ToLength`](http://ecma-international.org/ecma-262/7.0/#sec-tolength). + * + * @static + * @memberOf _ + * @since 4.0.0 + * @category Lang + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is a valid length, else `false`. + * @example + * + * _.isLength(3); + * // => true + * + * _.isLength(Number.MIN_VALUE); + * // => false + * + * _.isLength(Infinity); + * // => false + * + * _.isLength('3'); + * // => false + */ +function isLength$6(value) { + return typeof value == 'number' && + value > -1 && value % 1 == 0 && value <= MAX_SAFE_INTEGER$3; +} + +var isLength_1 = isLength$6; + +var baseGetTag$4 = _baseGetTag, + isLength$5 = isLength_1, + isObjectLike$a = isObjectLike_1; + +/** `Object#toString` result references. */ +var argsTag$5 = '[object Arguments]', + arrayTag$5 = '[object Array]', + boolTag$6 = '[object Boolean]', + dateTag$6 = '[object Date]', + errorTag$5 = '[object Error]', + funcTag$4 = '[object Function]', + mapTag$a = '[object Map]', + numberTag$6 = '[object Number]', + objectTag$7 = '[object Object]', + regexpTag$6 = '[object RegExp]', + setTag$b = '[object Set]', + stringTag$7 = '[object String]', + weakMapTag$5 = '[object WeakMap]'; + +var arrayBufferTag$6 = '[object ArrayBuffer]', + dataViewTag$7 = '[object DataView]', + float32Tag$5 = '[object Float32Array]', + float64Tag$5 = '[object Float64Array]', + int8Tag$5 = '[object Int8Array]', + int16Tag$5 = '[object Int16Array]', + int32Tag$5 = '[object Int32Array]', + uint8Tag$5 = '[object Uint8Array]', + uint8ClampedTag$5 = '[object Uint8ClampedArray]', + uint16Tag$5 = '[object Uint16Array]', + uint32Tag$5 = '[object Uint32Array]'; + +/** Used to identify `toStringTag` values of typed arrays. */ +var typedArrayTags$3 = {}; +typedArrayTags$3[float32Tag$5] = typedArrayTags$3[float64Tag$5] = +typedArrayTags$3[int8Tag$5] = typedArrayTags$3[int16Tag$5] = +typedArrayTags$3[int32Tag$5] = typedArrayTags$3[uint8Tag$5] = +typedArrayTags$3[uint8ClampedTag$5] = typedArrayTags$3[uint16Tag$5] = +typedArrayTags$3[uint32Tag$5] = true; +typedArrayTags$3[argsTag$5] = typedArrayTags$3[arrayTag$5] = +typedArrayTags$3[arrayBufferTag$6] = typedArrayTags$3[boolTag$6] = +typedArrayTags$3[dataViewTag$7] = typedArrayTags$3[dateTag$6] = +typedArrayTags$3[errorTag$5] = typedArrayTags$3[funcTag$4] = +typedArrayTags$3[mapTag$a] = typedArrayTags$3[numberTag$6] = +typedArrayTags$3[objectTag$7] = typedArrayTags$3[regexpTag$6] = +typedArrayTags$3[setTag$b] = typedArrayTags$3[stringTag$7] = +typedArrayTags$3[weakMapTag$5] = false; + +/** + * The base implementation of `_.isTypedArray` without Node.js optimizations. + * + * @private + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is a typed array, else `false`. + */ +function baseIsTypedArray$4(value) { + return isObjectLike$a(value) && + isLength$5(value.length) && !!typedArrayTags$3[baseGetTag$4(value)]; +} + +var _baseIsTypedArray = baseIsTypedArray$4; + +/** + * The base implementation of `_.unary` without support for storing metadata. + * + * @private + * @param {Function} func The function to cap arguments for. + * @returns {Function} Returns the new capped function. + */ + +function baseUnary$4(func) { + return function(value) { + return func(value); + }; +} + +var _baseUnary = baseUnary$4; + +var _nodeUtil = {exports: {}}; + +(function (module, exports) { +var freeGlobal = _freeGlobal; + +/** Detect free variable `exports`. */ +var freeExports = exports && !exports.nodeType && exports; + +/** Detect free variable `module`. */ +var freeModule = freeExports && 'object' == 'object' && module && !module.nodeType && module; + +/** Detect the popular CommonJS extension `module.exports`. */ +var moduleExports = freeModule && freeModule.exports === freeExports; + +/** Detect free variable `process` from Node.js. */ +var freeProcess = moduleExports && freeGlobal.process; + +/** Used to access faster Node.js helpers. */ +var nodeUtil = (function() { + try { + // Use `util.types` for Node.js 10+. + var types = freeModule && freeModule.require && freeModule.require('util').types; + + if (types) { + return types; + } + + // Legacy `process.binding('util')` for Node.js < 10. + return freeProcess && freeProcess.binding && freeProcess.binding('util'); + } catch (e) {} +}()); + +module.exports = nodeUtil; +}(_nodeUtil, _nodeUtil.exports)); + +var baseIsTypedArray$3 = _baseIsTypedArray, + baseUnary$3 = _baseUnary, + nodeUtil$2 = _nodeUtil.exports; + +/* Node.js helper references. */ +var nodeIsTypedArray = nodeUtil$2 && nodeUtil$2.isTypedArray; + +/** + * Checks if `value` is classified as a typed array. + * + * @static + * @memberOf _ + * @since 3.0.0 + * @category Lang + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is a typed array, else `false`. + * @example + * + * _.isTypedArray(new Uint8Array); + * // => true + * + * _.isTypedArray([]); + * // => false + */ +var isTypedArray$8 = nodeIsTypedArray ? baseUnary$3(nodeIsTypedArray) : baseIsTypedArray$3; + +var isTypedArray_1 = isTypedArray$8; + +var baseTimes = _baseTimes, + isArguments$4 = isArguments_1, + isArray$j = isArray_1, + isBuffer$5 = isBuffer$6.exports, + isIndex$3 = _isIndex, + isTypedArray$7 = isTypedArray_1; + +/** Used for built-in method references. */ +var objectProto$e = Object.prototype; + +/** Used to check objects for own properties. */ +var hasOwnProperty$9 = objectProto$e.hasOwnProperty; + +/** + * Creates an array of the enumerable property names of the array-like `value`. + * + * @private + * @param {*} value The value to query. + * @param {boolean} inherited Specify returning inherited property names. + * @returns {Array} Returns the array of property names. + */ +function arrayLikeKeys$2(value, inherited) { + var isArr = isArray$j(value), + isArg = !isArr && isArguments$4(value), + isBuff = !isArr && !isArg && isBuffer$5(value), + isType = !isArr && !isArg && !isBuff && isTypedArray$7(value), + skipIndexes = isArr || isArg || isBuff || isType, + result = skipIndexes ? baseTimes(value.length, String) : [], + length = result.length; + + for (var key in value) { + if ((inherited || hasOwnProperty$9.call(value, key)) && + !(skipIndexes && ( + // Safari 9 has enumerable `arguments.length` in strict mode. + key == 'length' || + // Node.js 0.10 has enumerable non-index properties on buffers. + (isBuff && (key == 'offset' || key == 'parent')) || + // PhantomJS 2 has enumerable non-index properties on typed arrays. + (isType && (key == 'buffer' || key == 'byteLength' || key == 'byteOffset')) || + // Skip index properties. + isIndex$3(key, length) + ))) { + result.push(key); + } + } + return result; +} + +var _arrayLikeKeys = arrayLikeKeys$2; + +/** Used for built-in method references. */ + +var objectProto$d = Object.prototype; + +/** + * Checks if `value` is likely a prototype object. + * + * @private + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is a prototype, else `false`. + */ +function isPrototype$4(value) { + var Ctor = value && value.constructor, + proto = (typeof Ctor == 'function' && Ctor.prototype) || objectProto$d; + + return value === proto; +} + +var _isPrototype = isPrototype$4; + +/** + * Creates a unary function that invokes `func` with its argument transformed. + * + * @private + * @param {Function} func The function to wrap. + * @param {Function} transform The argument transform. + * @returns {Function} Returns the new function. + */ + +function overArg$2(func, transform) { + return function(arg) { + return func(transform(arg)); + }; +} + +var _overArg = overArg$2; + +var overArg$1 = _overArg; + +/* Built-in method references for those with the same name as other `lodash` methods. */ +var nativeKeys$1 = overArg$1(Object.keys, Object); + +var _nativeKeys = nativeKeys$1; + +var isPrototype$3 = _isPrototype, + nativeKeys = _nativeKeys; + +/** Used for built-in method references. */ +var objectProto$c = Object.prototype; + +/** Used to check objects for own properties. */ +var hasOwnProperty$8 = objectProto$c.hasOwnProperty; + +/** + * The base implementation of `_.keys` which doesn't treat sparse arrays as dense. + * + * @private + * @param {Object} object The object to query. + * @returns {Array} Returns the array of property names. + */ +function baseKeys$3(object) { + if (!isPrototype$3(object)) { + return nativeKeys(object); + } + var result = []; + for (var key in Object(object)) { + if (hasOwnProperty$8.call(object, key) && key != 'constructor') { + result.push(key); + } + } + return result; +} + +var _baseKeys = baseKeys$3; + +var isFunction$2 = isFunction_1, + isLength$4 = isLength_1; + +/** + * Checks if `value` is array-like. A value is considered array-like if it's + * not a function and has a `value.length` that's an integer greater than or + * equal to `0` and less than or equal to `Number.MAX_SAFE_INTEGER`. + * + * @static + * @memberOf _ + * @since 4.0.0 + * @category Lang + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is array-like, else `false`. + * @example + * + * _.isArrayLike([1, 2, 3]); + * // => true + * + * _.isArrayLike(document.body.children); + * // => true + * + * _.isArrayLike('abc'); + * // => true + * + * _.isArrayLike(_.noop); + * // => false + */ +function isArrayLike$9(value) { + return value != null && isLength$4(value.length) && !isFunction$2(value); +} + +var isArrayLike_1 = isArrayLike$9; + +var arrayLikeKeys$1 = _arrayLikeKeys, + baseKeys$2 = _baseKeys, + isArrayLike$8 = isArrayLike_1; + +/** + * Creates an array of the own enumerable property names of `object`. + * + * **Note:** Non-object values are coerced to objects. See the + * [ES spec](http://ecma-international.org/ecma-262/7.0/#sec-object.keys) + * for more details. + * + * @static + * @since 0.1.0 + * @memberOf _ + * @category Object + * @param {Object} object The object to query. + * @returns {Array} Returns the array of property names. + * @example + * + * function Foo() { + * this.a = 1; + * this.b = 2; + * } + * + * Foo.prototype.c = 3; + * + * _.keys(new Foo); + * // => ['a', 'b'] (iteration order is not guaranteed) + * + * _.keys('hi'); + * // => ['0', '1'] + */ +function keys$7(object) { + return isArrayLike$8(object) ? arrayLikeKeys$1(object) : baseKeys$2(object); +} + +var keys_1 = keys$7; + +var copyObject$4 = _copyObject, + keys$6 = keys_1; + +/** + * The base implementation of `_.assign` without support for multiple sources + * or `customizer` functions. + * + * @private + * @param {Object} object The destination object. + * @param {Object} source The source object. + * @returns {Object} Returns `object`. + */ +function baseAssign$1(object, source) { + return object && copyObject$4(source, keys$6(source), object); +} + +var _baseAssign = baseAssign$1; + +/** + * This function is like + * [`Object.keys`](http://ecma-international.org/ecma-262/7.0/#sec-object.keys) + * except that it includes inherited enumerable properties. + * + * @private + * @param {Object} object The object to query. + * @returns {Array} Returns the array of property names. + */ + +function nativeKeysIn$1(object) { + var result = []; + if (object != null) { + for (var key in Object(object)) { + result.push(key); + } + } + return result; +} + +var _nativeKeysIn = nativeKeysIn$1; + +var isObject$a = isObject_1, + isPrototype$2 = _isPrototype, + nativeKeysIn = _nativeKeysIn; + +/** Used for built-in method references. */ +var objectProto$b = Object.prototype; + +/** Used to check objects for own properties. */ +var hasOwnProperty$7 = objectProto$b.hasOwnProperty; + +/** + * The base implementation of `_.keysIn` which doesn't treat sparse arrays as dense. + * + * @private + * @param {Object} object The object to query. + * @returns {Array} Returns the array of property names. + */ +function baseKeysIn$1(object) { + if (!isObject$a(object)) { + return nativeKeysIn(object); + } + var isProto = isPrototype$2(object), + result = []; + + for (var key in object) { + if (!(key == 'constructor' && (isProto || !hasOwnProperty$7.call(object, key)))) { + result.push(key); + } + } + return result; +} + +var _baseKeysIn = baseKeysIn$1; + +var arrayLikeKeys = _arrayLikeKeys, + baseKeysIn = _baseKeysIn, + isArrayLike$7 = isArrayLike_1; + +/** + * Creates an array of the own and inherited enumerable property names of `object`. + * + * **Note:** Non-object values are coerced to objects. + * + * @static + * @memberOf _ + * @since 3.0.0 + * @category Object + * @param {Object} object The object to query. + * @returns {Array} Returns the array of property names. + * @example + * + * function Foo() { + * this.a = 1; + * this.b = 2; + * } + * + * Foo.prototype.c = 3; + * + * _.keysIn(new Foo); + * // => ['a', 'b', 'c'] (iteration order is not guaranteed) + */ +function keysIn$7(object) { + return isArrayLike$7(object) ? arrayLikeKeys(object, true) : baseKeysIn(object); +} + +var keysIn_1 = keysIn$7; + +var copyObject$3 = _copyObject, + keysIn$6 = keysIn_1; + +/** + * The base implementation of `_.assignIn` without support for multiple sources + * or `customizer` functions. + * + * @private + * @param {Object} object The destination object. + * @param {Object} source The source object. + * @returns {Object} Returns `object`. + */ +function baseAssignIn$1(object, source) { + return object && copyObject$3(source, keysIn$6(source), object); +} + +var _baseAssignIn = baseAssignIn$1; + +var _cloneBuffer = {exports: {}}; + +(function (module, exports) { +var root = _root; + +/** Detect free variable `exports`. */ +var freeExports = exports && !exports.nodeType && exports; + +/** Detect free variable `module`. */ +var freeModule = freeExports && 'object' == 'object' && module && !module.nodeType && module; + +/** Detect the popular CommonJS extension `module.exports`. */ +var moduleExports = freeModule && freeModule.exports === freeExports; + +/** Built-in value references. */ +var Buffer = moduleExports ? root.Buffer : undefined, + allocUnsafe = Buffer ? Buffer.allocUnsafe : undefined; + +/** + * Creates a clone of `buffer`. + * + * @private + * @param {Buffer} buffer The buffer to clone. + * @param {boolean} [isDeep] Specify a deep clone. + * @returns {Buffer} Returns the cloned buffer. + */ +function cloneBuffer(buffer, isDeep) { + if (isDeep) { + return buffer.slice(); + } + var length = buffer.length, + result = allocUnsafe ? allocUnsafe(length) : new buffer.constructor(length); + + buffer.copy(result); + return result; +} + +module.exports = cloneBuffer; +}(_cloneBuffer, _cloneBuffer.exports)); + +/** + * Copies the values of `source` to `array`. + * + * @private + * @param {Array} source The array to copy values from. + * @param {Array} [array=[]] The array to copy values to. + * @returns {Array} Returns `array`. + */ + +function copyArray$2(source, array) { + var index = -1, + length = source.length; + + array || (array = Array(length)); + while (++index < length) { + array[index] = source[index]; + } + return array; +} + +var _copyArray = copyArray$2; + +/** + * A specialized version of `_.filter` for arrays without support for + * iteratee shorthands. + * + * @private + * @param {Array} [array] The array to iterate over. + * @param {Function} predicate The function invoked per iteration. + * @returns {Array} Returns the new filtered array. + */ + +function arrayFilter$2(array, predicate) { + var index = -1, + length = array == null ? 0 : array.length, + resIndex = 0, + result = []; + + while (++index < length) { + var value = array[index]; + if (predicate(value, index, array)) { + result[resIndex++] = value; + } + } + return result; +} + +var _arrayFilter = arrayFilter$2; + +/** + * This method returns a new empty array. + * + * @static + * @memberOf _ + * @since 4.13.0 + * @category Util + * @returns {Array} Returns the new empty array. + * @example + * + * var arrays = _.times(2, _.stubArray); + * + * console.log(arrays); + * // => [[], []] + * + * console.log(arrays[0] === arrays[1]); + * // => false + */ + +function stubArray$2() { + return []; +} + +var stubArray_1 = stubArray$2; + +var arrayFilter$1 = _arrayFilter, + stubArray$1 = stubArray_1; + +/** Used for built-in method references. */ +var objectProto$a = Object.prototype; + +/** Built-in value references. */ +var propertyIsEnumerable = objectProto$a.propertyIsEnumerable; + +/* Built-in method references for those with the same name as other `lodash` methods. */ +var nativeGetSymbols$1 = Object.getOwnPropertySymbols; + +/** + * Creates an array of the own enumerable symbols of `object`. + * + * @private + * @param {Object} object The object to query. + * @returns {Array} Returns the array of symbols. + */ +var getSymbols$3 = !nativeGetSymbols$1 ? stubArray$1 : function(object) { + if (object == null) { + return []; + } + object = Object(object); + return arrayFilter$1(nativeGetSymbols$1(object), function(symbol) { + return propertyIsEnumerable.call(object, symbol); + }); +}; + +var _getSymbols = getSymbols$3; + +var copyObject$2 = _copyObject, + getSymbols$2 = _getSymbols; + +/** + * Copies own symbols of `source` to `object`. + * + * @private + * @param {Object} source The object to copy symbols from. + * @param {Object} [object={}] The object to copy symbols to. + * @returns {Object} Returns `object`. + */ +function copySymbols$1(source, object) { + return copyObject$2(source, getSymbols$2(source), object); +} + +var _copySymbols = copySymbols$1; + +/** + * Appends the elements of `values` to `array`. + * + * @private + * @param {Array} array The array to modify. + * @param {Array} values The values to append. + * @returns {Array} Returns `array`. + */ + +function arrayPush$3(array, values) { + var index = -1, + length = values.length, + offset = array.length; + + while (++index < length) { + array[offset + index] = values[index]; + } + return array; +} + +var _arrayPush = arrayPush$3; + +var overArg = _overArg; + +/** Built-in value references. */ +var getPrototype$4 = overArg(Object.getPrototypeOf, Object); + +var _getPrototype = getPrototype$4; + +var arrayPush$2 = _arrayPush, + getPrototype$3 = _getPrototype, + getSymbols$1 = _getSymbols, + stubArray = stubArray_1; + +/* Built-in method references for those with the same name as other `lodash` methods. */ +var nativeGetSymbols = Object.getOwnPropertySymbols; + +/** + * Creates an array of the own and inherited enumerable symbols of `object`. + * + * @private + * @param {Object} object The object to query. + * @returns {Array} Returns the array of symbols. + */ +var getSymbolsIn$2 = !nativeGetSymbols ? stubArray : function(object) { + var result = []; + while (object) { + arrayPush$2(result, getSymbols$1(object)); + object = getPrototype$3(object); + } + return result; +}; + +var _getSymbolsIn = getSymbolsIn$2; + +var copyObject$1 = _copyObject, + getSymbolsIn$1 = _getSymbolsIn; + +/** + * Copies own and inherited symbols of `source` to `object`. + * + * @private + * @param {Object} source The object to copy symbols from. + * @param {Object} [object={}] The object to copy symbols to. + * @returns {Object} Returns `object`. + */ +function copySymbolsIn$1(source, object) { + return copyObject$1(source, getSymbolsIn$1(source), object); +} + +var _copySymbolsIn = copySymbolsIn$1; + +var arrayPush$1 = _arrayPush, + isArray$i = isArray_1; + +/** + * The base implementation of `getAllKeys` and `getAllKeysIn` which uses + * `keysFunc` and `symbolsFunc` to get the enumerable property names and + * symbols of `object`. + * + * @private + * @param {Object} object The object to query. + * @param {Function} keysFunc The function to get the keys of `object`. + * @param {Function} symbolsFunc The function to get the symbols of `object`. + * @returns {Array} Returns the array of property names and symbols. + */ +function baseGetAllKeys$2(object, keysFunc, symbolsFunc) { + var result = keysFunc(object); + return isArray$i(object) ? result : arrayPush$1(result, symbolsFunc(object)); +} + +var _baseGetAllKeys = baseGetAllKeys$2; + +var baseGetAllKeys$1 = _baseGetAllKeys, + getSymbols = _getSymbols, + keys$5 = keys_1; + +/** + * Creates an array of own enumerable property names and symbols of `object`. + * + * @private + * @param {Object} object The object to query. + * @returns {Array} Returns the array of property names and symbols. + */ +function getAllKeys$2(object) { + return baseGetAllKeys$1(object, keys$5, getSymbols); +} + +var _getAllKeys = getAllKeys$2; + +var baseGetAllKeys = _baseGetAllKeys, + getSymbolsIn = _getSymbolsIn, + keysIn$5 = keysIn_1; + +/** + * Creates an array of own and inherited enumerable property names and + * symbols of `object`. + * + * @private + * @param {Object} object The object to query. + * @returns {Array} Returns the array of property names and symbols. + */ +function getAllKeysIn$1(object) { + return baseGetAllKeys(object, keysIn$5, getSymbolsIn); +} + +var _getAllKeysIn = getAllKeysIn$1; + +var getNative$3 = _getNative, + root$5 = _root; + +/* Built-in method references that are verified to be native. */ +var DataView$2 = getNative$3(root$5, 'DataView'); + +var _DataView = DataView$2; + +var getNative$2 = _getNative, + root$4 = _root; + +/* Built-in method references that are verified to be native. */ +var Promise$2 = getNative$2(root$4, 'Promise'); + +var _Promise = Promise$2; + +var getNative$1 = _getNative, + root$3 = _root; + +/* Built-in method references that are verified to be native. */ +var Set$3 = getNative$1(root$3, 'Set'); + +var _Set = Set$3; + +var getNative = _getNative, + root$2 = _root; + +/* Built-in method references that are verified to be native. */ +var WeakMap$2 = getNative(root$2, 'WeakMap'); + +var _WeakMap = WeakMap$2; + +var DataView$1 = _DataView, + Map$1 = _Map, + Promise$1 = _Promise, + Set$2 = _Set, + WeakMap$1 = _WeakMap, + baseGetTag$3 = _baseGetTag, + toSource = _toSource; + +/** `Object#toString` result references. */ +var mapTag$9 = '[object Map]', + objectTag$6 = '[object Object]', + promiseTag = '[object Promise]', + setTag$a = '[object Set]', + weakMapTag$4 = '[object WeakMap]'; + +var dataViewTag$6 = '[object DataView]'; + +/** Used to detect maps, sets, and weakmaps. */ +var dataViewCtorString = toSource(DataView$1), + mapCtorString = toSource(Map$1), + promiseCtorString = toSource(Promise$1), + setCtorString = toSource(Set$2), + weakMapCtorString = toSource(WeakMap$1); + +/** + * Gets the `toStringTag` of `value`. + * + * @private + * @param {*} value The value to query. + * @returns {string} Returns the `toStringTag`. + */ +var getTag$6 = baseGetTag$3; + +// Fallback for data views, maps, sets, and weak maps in IE 11 and promises in Node.js < 6. +if ((DataView$1 && getTag$6(new DataView$1(new ArrayBuffer(1))) != dataViewTag$6) || + (Map$1 && getTag$6(new Map$1) != mapTag$9) || + (Promise$1 && getTag$6(Promise$1.resolve()) != promiseTag) || + (Set$2 && getTag$6(new Set$2) != setTag$a) || + (WeakMap$1 && getTag$6(new WeakMap$1) != weakMapTag$4)) { + getTag$6 = function(value) { + var result = baseGetTag$3(value), + Ctor = result == objectTag$6 ? value.constructor : undefined, + ctorString = Ctor ? toSource(Ctor) : ''; + + if (ctorString) { + switch (ctorString) { + case dataViewCtorString: return dataViewTag$6; + case mapCtorString: return mapTag$9; + case promiseCtorString: return promiseTag; + case setCtorString: return setTag$a; + case weakMapCtorString: return weakMapTag$4; + } + } + return result; + }; +} + +var _getTag = getTag$6; + +/** Used for built-in method references. */ + +var objectProto$9 = Object.prototype; + +/** Used to check objects for own properties. */ +var hasOwnProperty$6 = objectProto$9.hasOwnProperty; + +/** + * Initializes an array clone. + * + * @private + * @param {Array} array The array to clone. + * @returns {Array} Returns the initialized clone. + */ +function initCloneArray$1(array) { + var length = array.length, + result = new array.constructor(length); + + // Add properties assigned by `RegExp#exec`. + if (length && typeof array[0] == 'string' && hasOwnProperty$6.call(array, 'index')) { + result.index = array.index; + result.input = array.input; + } + return result; +} + +var _initCloneArray = initCloneArray$1; + +var root$1 = _root; + +/** Built-in value references. */ +var Uint8Array$3 = root$1.Uint8Array; + +var _Uint8Array = Uint8Array$3; + +var Uint8Array$2 = _Uint8Array; + +/** + * Creates a clone of `arrayBuffer`. + * + * @private + * @param {ArrayBuffer} arrayBuffer The array buffer to clone. + * @returns {ArrayBuffer} Returns the cloned array buffer. + */ +function cloneArrayBuffer$3(arrayBuffer) { + var result = new arrayBuffer.constructor(arrayBuffer.byteLength); + new Uint8Array$2(result).set(new Uint8Array$2(arrayBuffer)); + return result; +} + +var _cloneArrayBuffer = cloneArrayBuffer$3; + +var cloneArrayBuffer$2 = _cloneArrayBuffer; + +/** + * Creates a clone of `dataView`. + * + * @private + * @param {Object} dataView The data view to clone. + * @param {boolean} [isDeep] Specify a deep clone. + * @returns {Object} Returns the cloned data view. + */ +function cloneDataView$1(dataView, isDeep) { + var buffer = isDeep ? cloneArrayBuffer$2(dataView.buffer) : dataView.buffer; + return new dataView.constructor(buffer, dataView.byteOffset, dataView.byteLength); +} + +var _cloneDataView = cloneDataView$1; + +/** Used to match `RegExp` flags from their coerced string values. */ + +var reFlags = /\w*$/; + +/** + * Creates a clone of `regexp`. + * + * @private + * @param {Object} regexp The regexp to clone. + * @returns {Object} Returns the cloned regexp. + */ +function cloneRegExp$1(regexp) { + var result = new regexp.constructor(regexp.source, reFlags.exec(regexp)); + result.lastIndex = regexp.lastIndex; + return result; +} + +var _cloneRegExp = cloneRegExp$1; + +var Symbol$4 = _Symbol; + +/** Used to convert symbols to primitives and strings. */ +var symbolProto$2 = Symbol$4 ? Symbol$4.prototype : undefined, + symbolValueOf$1 = symbolProto$2 ? symbolProto$2.valueOf : undefined; + +/** + * Creates a clone of the `symbol` object. + * + * @private + * @param {Object} symbol The symbol object to clone. + * @returns {Object} Returns the cloned symbol object. + */ +function cloneSymbol$1(symbol) { + return symbolValueOf$1 ? Object(symbolValueOf$1.call(symbol)) : {}; +} + +var _cloneSymbol = cloneSymbol$1; + +var cloneArrayBuffer$1 = _cloneArrayBuffer; + +/** + * Creates a clone of `typedArray`. + * + * @private + * @param {Object} typedArray The typed array to clone. + * @param {boolean} [isDeep] Specify a deep clone. + * @returns {Object} Returns the cloned typed array. + */ +function cloneTypedArray$2(typedArray, isDeep) { + var buffer = isDeep ? cloneArrayBuffer$1(typedArray.buffer) : typedArray.buffer; + return new typedArray.constructor(buffer, typedArray.byteOffset, typedArray.length); +} + +var _cloneTypedArray = cloneTypedArray$2; + +var cloneArrayBuffer = _cloneArrayBuffer, + cloneDataView = _cloneDataView, + cloneRegExp = _cloneRegExp, + cloneSymbol = _cloneSymbol, + cloneTypedArray$1 = _cloneTypedArray; + +/** `Object#toString` result references. */ +var boolTag$5 = '[object Boolean]', + dateTag$5 = '[object Date]', + mapTag$8 = '[object Map]', + numberTag$5 = '[object Number]', + regexpTag$5 = '[object RegExp]', + setTag$9 = '[object Set]', + stringTag$6 = '[object String]', + symbolTag$3 = '[object Symbol]'; + +var arrayBufferTag$5 = '[object ArrayBuffer]', + dataViewTag$5 = '[object DataView]', + float32Tag$4 = '[object Float32Array]', + float64Tag$4 = '[object Float64Array]', + int8Tag$4 = '[object Int8Array]', + int16Tag$4 = '[object Int16Array]', + int32Tag$4 = '[object Int32Array]', + uint8Tag$4 = '[object Uint8Array]', + uint8ClampedTag$4 = '[object Uint8ClampedArray]', + uint16Tag$4 = '[object Uint16Array]', + uint32Tag$4 = '[object Uint32Array]'; + +/** + * Initializes an object clone based on its `toStringTag`. + * + * **Note:** This function only supports cloning values with tags of + * `Boolean`, `Date`, `Error`, `Map`, `Number`, `RegExp`, `Set`, or `String`. + * + * @private + * @param {Object} object The object to clone. + * @param {string} tag The `toStringTag` of the object to clone. + * @param {boolean} [isDeep] Specify a deep clone. + * @returns {Object} Returns the initialized clone. + */ +function initCloneByTag$1(object, tag, isDeep) { + var Ctor = object.constructor; + switch (tag) { + case arrayBufferTag$5: + return cloneArrayBuffer(object); + + case boolTag$5: + case dateTag$5: + return new Ctor(+object); + + case dataViewTag$5: + return cloneDataView(object, isDeep); + + case float32Tag$4: case float64Tag$4: + case int8Tag$4: case int16Tag$4: case int32Tag$4: + case uint8Tag$4: case uint8ClampedTag$4: case uint16Tag$4: case uint32Tag$4: + return cloneTypedArray$1(object, isDeep); + + case mapTag$8: + return new Ctor; + + case numberTag$5: + case stringTag$6: + return new Ctor(object); + + case regexpTag$5: + return cloneRegExp(object); + + case setTag$9: + return new Ctor; + + case symbolTag$3: + return cloneSymbol(object); + } +} + +var _initCloneByTag = initCloneByTag$1; + +var isObject$9 = isObject_1; + +/** Built-in value references. */ +var objectCreate = Object.create; + +/** + * The base implementation of `_.create` without support for assigning + * properties to the created object. + * + * @private + * @param {Object} proto The object to inherit from. + * @returns {Object} Returns the new object. + */ +var baseCreate$2 = (function() { + function object() {} + return function(proto) { + if (!isObject$9(proto)) { + return {}; + } + if (objectCreate) { + return objectCreate(proto); + } + object.prototype = proto; + var result = new object; + object.prototype = undefined; + return result; + }; +}()); + +var _baseCreate = baseCreate$2; + +var baseCreate$1 = _baseCreate, + getPrototype$2 = _getPrototype, + isPrototype$1 = _isPrototype; + +/** + * Initializes an object clone. + * + * @private + * @param {Object} object The object to clone. + * @returns {Object} Returns the initialized clone. + */ +function initCloneObject$2(object) { + return (typeof object.constructor == 'function' && !isPrototype$1(object)) + ? baseCreate$1(getPrototype$2(object)) + : {}; +} + +var _initCloneObject = initCloneObject$2; + +var getTag$5 = _getTag, + isObjectLike$9 = isObjectLike_1; + +/** `Object#toString` result references. */ +var mapTag$7 = '[object Map]'; + +/** + * The base implementation of `_.isMap` without Node.js optimizations. + * + * @private + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is a map, else `false`. + */ +function baseIsMap$1(value) { + return isObjectLike$9(value) && getTag$5(value) == mapTag$7; +} + +var _baseIsMap = baseIsMap$1; + +var baseIsMap = _baseIsMap, + baseUnary$2 = _baseUnary, + nodeUtil$1 = _nodeUtil.exports; + +/* Node.js helper references. */ +var nodeIsMap = nodeUtil$1 && nodeUtil$1.isMap; + +/** + * Checks if `value` is classified as a `Map` object. + * + * @static + * @memberOf _ + * @since 4.3.0 + * @category Lang + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is a map, else `false`. + * @example + * + * _.isMap(new Map); + * // => true + * + * _.isMap(new WeakMap); + * // => false + */ +var isMap$1 = nodeIsMap ? baseUnary$2(nodeIsMap) : baseIsMap; + +var isMap_1 = isMap$1; + +var getTag$4 = _getTag, + isObjectLike$8 = isObjectLike_1; + +/** `Object#toString` result references. */ +var setTag$8 = '[object Set]'; + +/** + * The base implementation of `_.isSet` without Node.js optimizations. + * + * @private + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is a set, else `false`. + */ +function baseIsSet$1(value) { + return isObjectLike$8(value) && getTag$4(value) == setTag$8; +} + +var _baseIsSet = baseIsSet$1; + +var baseIsSet = _baseIsSet, + baseUnary$1 = _baseUnary, + nodeUtil = _nodeUtil.exports; + +/* Node.js helper references. */ +var nodeIsSet = nodeUtil && nodeUtil.isSet; + +/** + * Checks if `value` is classified as a `Set` object. + * + * @static + * @memberOf _ + * @since 4.3.0 + * @category Lang + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is a set, else `false`. + * @example + * + * _.isSet(new Set); + * // => true + * + * _.isSet(new WeakSet); + * // => false + */ +var isSet$1 = nodeIsSet ? baseUnary$1(nodeIsSet) : baseIsSet; + +var isSet_1 = isSet$1; + +var Stack$3 = _Stack, + arrayEach$2 = _arrayEach, + assignValue$2 = _assignValue, + baseAssign = _baseAssign, + baseAssignIn = _baseAssignIn, + cloneBuffer$1 = _cloneBuffer.exports, + copyArray$1 = _copyArray, + copySymbols = _copySymbols, + copySymbolsIn = _copySymbolsIn, + getAllKeys$1 = _getAllKeys, + getAllKeysIn = _getAllKeysIn, + getTag$3 = _getTag, + initCloneArray = _initCloneArray, + initCloneByTag = _initCloneByTag, + initCloneObject$1 = _initCloneObject, + isArray$h = isArray_1, + isBuffer$4 = isBuffer$6.exports, + isMap = isMap_1, + isObject$8 = isObject_1, + isSet = isSet_1, + keys$4 = keys_1, + keysIn$4 = keysIn_1; + +/** Used to compose bitmasks for cloning. */ +var CLONE_DEEP_FLAG$1 = 1, + CLONE_FLAT_FLAG = 2, + CLONE_SYMBOLS_FLAG$2 = 4; + +/** `Object#toString` result references. */ +var argsTag$4 = '[object Arguments]', + arrayTag$4 = '[object Array]', + boolTag$4 = '[object Boolean]', + dateTag$4 = '[object Date]', + errorTag$4 = '[object Error]', + funcTag$3 = '[object Function]', + genTag = '[object GeneratorFunction]', + mapTag$6 = '[object Map]', + numberTag$4 = '[object Number]', + objectTag$5 = '[object Object]', + regexpTag$4 = '[object RegExp]', + setTag$7 = '[object Set]', + stringTag$5 = '[object String]', + symbolTag$2 = '[object Symbol]', + weakMapTag$3 = '[object WeakMap]'; + +var arrayBufferTag$4 = '[object ArrayBuffer]', + dataViewTag$4 = '[object DataView]', + float32Tag$3 = '[object Float32Array]', + float64Tag$3 = '[object Float64Array]', + int8Tag$3 = '[object Int8Array]', + int16Tag$3 = '[object Int16Array]', + int32Tag$3 = '[object Int32Array]', + uint8Tag$3 = '[object Uint8Array]', + uint8ClampedTag$3 = '[object Uint8ClampedArray]', + uint16Tag$3 = '[object Uint16Array]', + uint32Tag$3 = '[object Uint32Array]'; + +/** Used to identify `toStringTag` values supported by `_.clone`. */ +var cloneableTags = {}; +cloneableTags[argsTag$4] = cloneableTags[arrayTag$4] = +cloneableTags[arrayBufferTag$4] = cloneableTags[dataViewTag$4] = +cloneableTags[boolTag$4] = cloneableTags[dateTag$4] = +cloneableTags[float32Tag$3] = cloneableTags[float64Tag$3] = +cloneableTags[int8Tag$3] = cloneableTags[int16Tag$3] = +cloneableTags[int32Tag$3] = cloneableTags[mapTag$6] = +cloneableTags[numberTag$4] = cloneableTags[objectTag$5] = +cloneableTags[regexpTag$4] = cloneableTags[setTag$7] = +cloneableTags[stringTag$5] = cloneableTags[symbolTag$2] = +cloneableTags[uint8Tag$3] = cloneableTags[uint8ClampedTag$3] = +cloneableTags[uint16Tag$3] = cloneableTags[uint32Tag$3] = true; +cloneableTags[errorTag$4] = cloneableTags[funcTag$3] = +cloneableTags[weakMapTag$3] = false; + +/** + * The base implementation of `_.clone` and `_.cloneDeep` which tracks + * traversed objects. + * + * @private + * @param {*} value The value to clone. + * @param {boolean} bitmask The bitmask flags. + * 1 - Deep clone + * 2 - Flatten inherited properties + * 4 - Clone symbols + * @param {Function} [customizer] The function to customize cloning. + * @param {string} [key] The key of `value`. + * @param {Object} [object] The parent object of `value`. + * @param {Object} [stack] Tracks traversed objects and their clone counterparts. + * @returns {*} Returns the cloned value. + */ +function baseClone$2(value, bitmask, customizer, key, object, stack) { + var result, + isDeep = bitmask & CLONE_DEEP_FLAG$1, + isFlat = bitmask & CLONE_FLAT_FLAG, + isFull = bitmask & CLONE_SYMBOLS_FLAG$2; + + if (customizer) { + result = object ? customizer(value, key, object, stack) : customizer(value); + } + if (result !== undefined) { + return result; + } + if (!isObject$8(value)) { + return value; + } + var isArr = isArray$h(value); + if (isArr) { + result = initCloneArray(value); + if (!isDeep) { + return copyArray$1(value, result); + } + } else { + var tag = getTag$3(value), + isFunc = tag == funcTag$3 || tag == genTag; + + if (isBuffer$4(value)) { + return cloneBuffer$1(value, isDeep); + } + if (tag == objectTag$5 || tag == argsTag$4 || (isFunc && !object)) { + result = (isFlat || isFunc) ? {} : initCloneObject$1(value); + if (!isDeep) { + return isFlat + ? copySymbolsIn(value, baseAssignIn(result, value)) + : copySymbols(value, baseAssign(result, value)); + } + } else { + if (!cloneableTags[tag]) { + return object ? value : {}; + } + result = initCloneByTag(value, tag, isDeep); + } + } + // Check for circular references and return its corresponding clone. + stack || (stack = new Stack$3); + var stacked = stack.get(value); + if (stacked) { + return stacked; + } + stack.set(value, result); + + if (isSet(value)) { + value.forEach(function(subValue) { + result.add(baseClone$2(subValue, bitmask, customizer, subValue, value, stack)); + }); + } else if (isMap(value)) { + value.forEach(function(subValue, key) { + result.set(key, baseClone$2(subValue, bitmask, customizer, key, value, stack)); + }); + } + + var keysFunc = isFull + ? (isFlat ? getAllKeysIn : getAllKeys$1) + : (isFlat ? keysIn$4 : keys$4); + + var props = isArr ? undefined : keysFunc(value); + arrayEach$2(props || value, function(subValue, key) { + if (props) { + key = subValue; + subValue = value[key]; + } + // Recursively populate clone (susceptible to call stack limits). + assignValue$2(result, key, baseClone$2(subValue, bitmask, customizer, key, value, stack)); + }); + return result; +} + +var _baseClone = baseClone$2; + +var baseClone$1 = _baseClone; + +/** Used to compose bitmasks for cloning. */ +var CLONE_SYMBOLS_FLAG$1 = 4; + +/** + * Creates a shallow clone of `value`. + * + * **Note:** This method is loosely based on the + * [structured clone algorithm](https://mdn.io/Structured_clone_algorithm) + * and supports cloning arrays, array buffers, booleans, date objects, maps, + * numbers, `Object` objects, regexes, sets, strings, symbols, and typed + * arrays. The own enumerable properties of `arguments` objects are cloned + * as plain objects. An empty object is returned for uncloneable values such + * as error objects, functions, DOM nodes, and WeakMaps. + * + * @static + * @memberOf _ + * @since 0.1.0 + * @category Lang + * @param {*} value The value to clone. + * @returns {*} Returns the cloned value. + * @see _.cloneDeep + * @example + * + * var objects = [{ 'a': 1 }, { 'b': 2 }]; + * + * var shallow = _.clone(objects); + * console.log(shallow[0] === objects[0]); + * // => true + */ +function clone$1(value) { + return baseClone$1(value, CLONE_SYMBOLS_FLAG$1); +} + +var clone_1$1 = clone$1; + +/** + * Creates a function that returns `value`. + * + * @static + * @memberOf _ + * @since 2.4.0 + * @category Util + * @param {*} value The value to return from the new function. + * @returns {Function} Returns the new constant function. + * @example + * + * var objects = _.times(2, _.constant({ 'a': 1 })); + * + * console.log(objects); + * // => [{ 'a': 1 }, { 'a': 1 }] + * + * console.log(objects[0] === objects[1]); + * // => true + */ + +function constant$1(value) { + return function() { + return value; + }; +} + +var constant_1 = constant$1; + +/** + * Creates a base function for methods like `_.forIn` and `_.forOwn`. + * + * @private + * @param {boolean} [fromRight] Specify iterating from right to left. + * @returns {Function} Returns the new base function. + */ + +function createBaseFor$1(fromRight) { + return function(object, iteratee, keysFunc) { + var index = -1, + iterable = Object(object), + props = keysFunc(object), + length = props.length; + + while (length--) { + var key = props[fromRight ? length : ++index]; + if (iteratee(iterable[key], key, iterable) === false) { + break; + } + } + return object; + }; +} + +var _createBaseFor = createBaseFor$1; + +var createBaseFor = _createBaseFor; + +/** + * The base implementation of `baseForOwn` which iterates over `object` + * properties returned by `keysFunc` and invokes `iteratee` for each property. + * Iteratee functions may exit iteration early by explicitly returning `false`. + * + * @private + * @param {Object} object The object to iterate over. + * @param {Function} iteratee The function invoked per iteration. + * @param {Function} keysFunc The function to get the keys of `object`. + * @returns {Object} Returns `object`. + */ +var baseFor$3 = createBaseFor(); + +var _baseFor = baseFor$3; + +var baseFor$2 = _baseFor, + keys$3 = keys_1; + +/** + * The base implementation of `_.forOwn` without support for iteratee shorthands. + * + * @private + * @param {Object} object The object to iterate over. + * @param {Function} iteratee The function invoked per iteration. + * @returns {Object} Returns `object`. + */ +function baseForOwn$3(object, iteratee) { + return object && baseFor$2(object, iteratee, keys$3); +} + +var _baseForOwn = baseForOwn$3; + +var isArrayLike$6 = isArrayLike_1; + +/** + * Creates a `baseEach` or `baseEachRight` function. + * + * @private + * @param {Function} eachFunc The function to iterate over a collection. + * @param {boolean} [fromRight] Specify iterating from right to left. + * @returns {Function} Returns the new base function. + */ +function createBaseEach$1(eachFunc, fromRight) { + return function(collection, iteratee) { + if (collection == null) { + return collection; + } + if (!isArrayLike$6(collection)) { + return eachFunc(collection, iteratee); + } + var length = collection.length, + index = fromRight ? length : -1, + iterable = Object(collection); + + while ((fromRight ? index-- : ++index < length)) { + if (iteratee(iterable[index], index, iterable) === false) { + break; + } + } + return collection; + }; +} + +var _createBaseEach = createBaseEach$1; + +var baseForOwn$2 = _baseForOwn, + createBaseEach = _createBaseEach; + +/** + * The base implementation of `_.forEach` without support for iteratee shorthands. + * + * @private + * @param {Array|Object} collection The collection to iterate over. + * @param {Function} iteratee The function invoked per iteration. + * @returns {Array|Object} Returns `collection`. + */ +var baseEach$4 = createBaseEach(baseForOwn$2); + +var _baseEach = baseEach$4; + +/** + * This method returns the first argument it receives. + * + * @static + * @since 0.1.0 + * @memberOf _ + * @category Util + * @param {*} value Any value. + * @returns {*} Returns `value`. + * @example + * + * var object = { 'a': 1 }; + * + * console.log(_.identity(object) === object); + * // => true + */ + +function identity$7(value) { + return value; +} + +var identity_1 = identity$7; + +var identity$6 = identity_1; + +/** + * Casts `value` to `identity` if it's not a function. + * + * @private + * @param {*} value The value to inspect. + * @returns {Function} Returns cast function. + */ +function castFunction$2(value) { + return typeof value == 'function' ? value : identity$6; +} + +var _castFunction = castFunction$2; + +var arrayEach$1 = _arrayEach, + baseEach$3 = _baseEach, + castFunction$1 = _castFunction, + isArray$g = isArray_1; + +/** + * Iterates over elements of `collection` and invokes `iteratee` for each element. + * The iteratee is invoked with three arguments: (value, index|key, collection). + * Iteratee functions may exit iteration early by explicitly returning `false`. + * + * **Note:** As with other "Collections" methods, objects with a "length" + * property are iterated like arrays. To avoid this behavior use `_.forIn` + * or `_.forOwn` for object iteration. + * + * @static + * @memberOf _ + * @since 0.1.0 + * @alias each + * @category Collection + * @param {Array|Object} collection The collection to iterate over. + * @param {Function} [iteratee=_.identity] The function invoked per iteration. + * @returns {Array|Object} Returns `collection`. + * @see _.forEachRight + * @example + * + * _.forEach([1, 2], function(value) { + * console.log(value); + * }); + * // => Logs `1` then `2`. + * + * _.forEach({ 'a': 1, 'b': 2 }, function(value, key) { + * console.log(key); + * }); + * // => Logs 'a' then 'b' (iteration order is not guaranteed). + */ +function forEach$1(collection, iteratee) { + var func = isArray$g(collection) ? arrayEach$1 : baseEach$3; + return func(collection, castFunction$1(iteratee)); +} + +var forEach_1$1 = forEach$1; + +var each = forEach_1$1; + +var baseEach$2 = _baseEach; + +/** + * The base implementation of `_.filter` without support for iteratee shorthands. + * + * @private + * @param {Array|Object} collection The collection to iterate over. + * @param {Function} predicate The function invoked per iteration. + * @returns {Array} Returns the new filtered array. + */ +function baseFilter$1(collection, predicate) { + var result = []; + baseEach$2(collection, function(value, index, collection) { + if (predicate(value, index, collection)) { + result.push(value); + } + }); + return result; +} + +var _baseFilter = baseFilter$1; + +/** Used to stand-in for `undefined` hash values. */ + +var HASH_UNDEFINED = '__lodash_hash_undefined__'; + +/** + * Adds `value` to the array cache. + * + * @private + * @name add + * @memberOf SetCache + * @alias push + * @param {*} value The value to cache. + * @returns {Object} Returns the cache instance. + */ +function setCacheAdd$1(value) { + this.__data__.set(value, HASH_UNDEFINED); + return this; +} + +var _setCacheAdd = setCacheAdd$1; + +/** + * Checks if `value` is in the array cache. + * + * @private + * @name has + * @memberOf SetCache + * @param {*} value The value to search for. + * @returns {number} Returns `true` if `value` is found, else `false`. + */ + +function setCacheHas$1(value) { + return this.__data__.has(value); +} + +var _setCacheHas = setCacheHas$1; + +var MapCache$1 = _MapCache, + setCacheAdd = _setCacheAdd, + setCacheHas = _setCacheHas; + +/** + * + * Creates an array cache object to store unique values. + * + * @private + * @constructor + * @param {Array} [values] The values to cache. + */ +function SetCache$2(values) { + var index = -1, + length = values == null ? 0 : values.length; + + this.__data__ = new MapCache$1; + while (++index < length) { + this.add(values[index]); + } +} + +// Add methods to `SetCache`. +SetCache$2.prototype.add = SetCache$2.prototype.push = setCacheAdd; +SetCache$2.prototype.has = setCacheHas; + +var _SetCache = SetCache$2; + +/** + * A specialized version of `_.some` for arrays without support for iteratee + * shorthands. + * + * @private + * @param {Array} [array] The array to iterate over. + * @param {Function} predicate The function invoked per iteration. + * @returns {boolean} Returns `true` if any element passes the predicate check, + * else `false`. + */ + +function arraySome$1(array, predicate) { + var index = -1, + length = array == null ? 0 : array.length; + + while (++index < length) { + if (predicate(array[index], index, array)) { + return true; + } + } + return false; +} + +var _arraySome = arraySome$1; + +/** + * Checks if a `cache` value for `key` exists. + * + * @private + * @param {Object} cache The cache to query. + * @param {string} key The key of the entry to check. + * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`. + */ + +function cacheHas$2(cache, key) { + return cache.has(key); +} + +var _cacheHas = cacheHas$2; + +var SetCache$1 = _SetCache, + arraySome = _arraySome, + cacheHas$1 = _cacheHas; + +/** Used to compose bitmasks for value comparisons. */ +var COMPARE_PARTIAL_FLAG$5 = 1, + COMPARE_UNORDERED_FLAG$3 = 2; + +/** + * A specialized version of `baseIsEqualDeep` for arrays with support for + * partial deep comparisons. + * + * @private + * @param {Array} array The array to compare. + * @param {Array} other The other array to compare. + * @param {number} bitmask The bitmask flags. See `baseIsEqual` for more details. + * @param {Function} customizer The function to customize comparisons. + * @param {Function} equalFunc The function to determine equivalents of values. + * @param {Object} stack Tracks traversed `array` and `other` objects. + * @returns {boolean} Returns `true` if the arrays are equivalent, else `false`. + */ +function equalArrays$2(array, other, bitmask, customizer, equalFunc, stack) { + var isPartial = bitmask & COMPARE_PARTIAL_FLAG$5, + arrLength = array.length, + othLength = other.length; + + if (arrLength != othLength && !(isPartial && othLength > arrLength)) { + return false; + } + // Check that cyclic values are equal. + var arrStacked = stack.get(array); + var othStacked = stack.get(other); + if (arrStacked && othStacked) { + return arrStacked == other && othStacked == array; + } + var index = -1, + result = true, + seen = (bitmask & COMPARE_UNORDERED_FLAG$3) ? new SetCache$1 : undefined; + + stack.set(array, other); + stack.set(other, array); + + // Ignore non-index properties. + while (++index < arrLength) { + var arrValue = array[index], + othValue = other[index]; + + if (customizer) { + var compared = isPartial + ? customizer(othValue, arrValue, index, other, array, stack) + : customizer(arrValue, othValue, index, array, other, stack); + } + if (compared !== undefined) { + if (compared) { + continue; + } + result = false; + break; + } + // Recursively compare arrays (susceptible to call stack limits). + if (seen) { + if (!arraySome(other, function(othValue, othIndex) { + if (!cacheHas$1(seen, othIndex) && + (arrValue === othValue || equalFunc(arrValue, othValue, bitmask, customizer, stack))) { + return seen.push(othIndex); + } + })) { + result = false; + break; + } + } else if (!( + arrValue === othValue || + equalFunc(arrValue, othValue, bitmask, customizer, stack) + )) { + result = false; + break; + } + } + stack['delete'](array); + stack['delete'](other); + return result; +} + +var _equalArrays = equalArrays$2; + +/** + * Converts `map` to its key-value pairs. + * + * @private + * @param {Object} map The map to convert. + * @returns {Array} Returns the key-value pairs. + */ + +function mapToArray$1(map) { + var index = -1, + result = Array(map.size); + + map.forEach(function(value, key) { + result[++index] = [key, value]; + }); + return result; +} + +var _mapToArray = mapToArray$1; + +/** + * Converts `set` to an array of its values. + * + * @private + * @param {Object} set The set to convert. + * @returns {Array} Returns the values. + */ + +function setToArray$3(set) { + var index = -1, + result = Array(set.size); + + set.forEach(function(value) { + result[++index] = value; + }); + return result; +} + +var _setToArray = setToArray$3; + +var Symbol$3 = _Symbol, + Uint8Array$1 = _Uint8Array, + eq$3 = eq_1, + equalArrays$1 = _equalArrays, + mapToArray = _mapToArray, + setToArray$2 = _setToArray; + +/** Used to compose bitmasks for value comparisons. */ +var COMPARE_PARTIAL_FLAG$4 = 1, + COMPARE_UNORDERED_FLAG$2 = 2; + +/** `Object#toString` result references. */ +var boolTag$3 = '[object Boolean]', + dateTag$3 = '[object Date]', + errorTag$3 = '[object Error]', + mapTag$5 = '[object Map]', + numberTag$3 = '[object Number]', + regexpTag$3 = '[object RegExp]', + setTag$6 = '[object Set]', + stringTag$4 = '[object String]', + symbolTag$1 = '[object Symbol]'; + +var arrayBufferTag$3 = '[object ArrayBuffer]', + dataViewTag$3 = '[object DataView]'; + +/** Used to convert symbols to primitives and strings. */ +var symbolProto$1 = Symbol$3 ? Symbol$3.prototype : undefined, + symbolValueOf = symbolProto$1 ? symbolProto$1.valueOf : undefined; + +/** + * A specialized version of `baseIsEqualDeep` for comparing objects of + * the same `toStringTag`. + * + * **Note:** This function only supports comparing values with tags of + * `Boolean`, `Date`, `Error`, `Number`, `RegExp`, or `String`. + * + * @private + * @param {Object} object The object to compare. + * @param {Object} other The other object to compare. + * @param {string} tag The `toStringTag` of the objects to compare. + * @param {number} bitmask The bitmask flags. See `baseIsEqual` for more details. + * @param {Function} customizer The function to customize comparisons. + * @param {Function} equalFunc The function to determine equivalents of values. + * @param {Object} stack Tracks traversed `object` and `other` objects. + * @returns {boolean} Returns `true` if the objects are equivalent, else `false`. + */ +function equalByTag$1(object, other, tag, bitmask, customizer, equalFunc, stack) { + switch (tag) { + case dataViewTag$3: + if ((object.byteLength != other.byteLength) || + (object.byteOffset != other.byteOffset)) { + return false; + } + object = object.buffer; + other = other.buffer; + + case arrayBufferTag$3: + if ((object.byteLength != other.byteLength) || + !equalFunc(new Uint8Array$1(object), new Uint8Array$1(other))) { + return false; + } + return true; + + case boolTag$3: + case dateTag$3: + case numberTag$3: + // Coerce booleans to `1` or `0` and dates to milliseconds. + // Invalid dates are coerced to `NaN`. + return eq$3(+object, +other); + + case errorTag$3: + return object.name == other.name && object.message == other.message; + + case regexpTag$3: + case stringTag$4: + // Coerce regexes to strings and treat strings, primitives and objects, + // as equal. See http://www.ecma-international.org/ecma-262/7.0/#sec-regexp.prototype.tostring + // for more details. + return object == (other + ''); + + case mapTag$5: + var convert = mapToArray; + + case setTag$6: + var isPartial = bitmask & COMPARE_PARTIAL_FLAG$4; + convert || (convert = setToArray$2); + + if (object.size != other.size && !isPartial) { + return false; + } + // Assume cyclic values are equal. + var stacked = stack.get(object); + if (stacked) { + return stacked == other; + } + bitmask |= COMPARE_UNORDERED_FLAG$2; + + // Recursively compare objects (susceptible to call stack limits). + stack.set(object, other); + var result = equalArrays$1(convert(object), convert(other), bitmask, customizer, equalFunc, stack); + stack['delete'](object); + return result; + + case symbolTag$1: + if (symbolValueOf) { + return symbolValueOf.call(object) == symbolValueOf.call(other); + } + } + return false; +} + +var _equalByTag = equalByTag$1; + +var getAllKeys = _getAllKeys; + +/** Used to compose bitmasks for value comparisons. */ +var COMPARE_PARTIAL_FLAG$3 = 1; + +/** Used for built-in method references. */ +var objectProto$8 = Object.prototype; + +/** Used to check objects for own properties. */ +var hasOwnProperty$5 = objectProto$8.hasOwnProperty; + +/** + * A specialized version of `baseIsEqualDeep` for objects with support for + * partial deep comparisons. + * + * @private + * @param {Object} object The object to compare. + * @param {Object} other The other object to compare. + * @param {number} bitmask The bitmask flags. See `baseIsEqual` for more details. + * @param {Function} customizer The function to customize comparisons. + * @param {Function} equalFunc The function to determine equivalents of values. + * @param {Object} stack Tracks traversed `object` and `other` objects. + * @returns {boolean} Returns `true` if the objects are equivalent, else `false`. + */ +function equalObjects$1(object, other, bitmask, customizer, equalFunc, stack) { + var isPartial = bitmask & COMPARE_PARTIAL_FLAG$3, + objProps = getAllKeys(object), + objLength = objProps.length, + othProps = getAllKeys(other), + othLength = othProps.length; + + if (objLength != othLength && !isPartial) { + return false; + } + var index = objLength; + while (index--) { + var key = objProps[index]; + if (!(isPartial ? key in other : hasOwnProperty$5.call(other, key))) { + return false; + } + } + // Check that cyclic values are equal. + var objStacked = stack.get(object); + var othStacked = stack.get(other); + if (objStacked && othStacked) { + return objStacked == other && othStacked == object; + } + var result = true; + stack.set(object, other); + stack.set(other, object); + + var skipCtor = isPartial; + while (++index < objLength) { + key = objProps[index]; + var objValue = object[key], + othValue = other[key]; + + if (customizer) { + var compared = isPartial + ? customizer(othValue, objValue, key, other, object, stack) + : customizer(objValue, othValue, key, object, other, stack); + } + // Recursively compare objects (susceptible to call stack limits). + if (!(compared === undefined + ? (objValue === othValue || equalFunc(objValue, othValue, bitmask, customizer, stack)) + : compared + )) { + result = false; + break; + } + skipCtor || (skipCtor = key == 'constructor'); + } + if (result && !skipCtor) { + var objCtor = object.constructor, + othCtor = other.constructor; + + // Non `Object` object instances with different constructors are not equal. + if (objCtor != othCtor && + ('constructor' in object && 'constructor' in other) && + !(typeof objCtor == 'function' && objCtor instanceof objCtor && + typeof othCtor == 'function' && othCtor instanceof othCtor)) { + result = false; + } + } + stack['delete'](object); + stack['delete'](other); + return result; +} + +var _equalObjects = equalObjects$1; + +var Stack$2 = _Stack, + equalArrays = _equalArrays, + equalByTag = _equalByTag, + equalObjects = _equalObjects, + getTag$2 = _getTag, + isArray$f = isArray_1, + isBuffer$3 = isBuffer$6.exports, + isTypedArray$6 = isTypedArray_1; + +/** Used to compose bitmasks for value comparisons. */ +var COMPARE_PARTIAL_FLAG$2 = 1; + +/** `Object#toString` result references. */ +var argsTag$3 = '[object Arguments]', + arrayTag$3 = '[object Array]', + objectTag$4 = '[object Object]'; + +/** Used for built-in method references. */ +var objectProto$7 = Object.prototype; + +/** Used to check objects for own properties. */ +var hasOwnProperty$4 = objectProto$7.hasOwnProperty; + +/** + * A specialized version of `baseIsEqual` for arrays and objects which performs + * deep comparisons and tracks traversed objects enabling objects with circular + * references to be compared. + * + * @private + * @param {Object} object The object to compare. + * @param {Object} other The other object to compare. + * @param {number} bitmask The bitmask flags. See `baseIsEqual` for more details. + * @param {Function} customizer The function to customize comparisons. + * @param {Function} equalFunc The function to determine equivalents of values. + * @param {Object} [stack] Tracks traversed `object` and `other` objects. + * @returns {boolean} Returns `true` if the objects are equivalent, else `false`. + */ +function baseIsEqualDeep$1(object, other, bitmask, customizer, equalFunc, stack) { + var objIsArr = isArray$f(object), + othIsArr = isArray$f(other), + objTag = objIsArr ? arrayTag$3 : getTag$2(object), + othTag = othIsArr ? arrayTag$3 : getTag$2(other); + + objTag = objTag == argsTag$3 ? objectTag$4 : objTag; + othTag = othTag == argsTag$3 ? objectTag$4 : othTag; + + var objIsObj = objTag == objectTag$4, + othIsObj = othTag == objectTag$4, + isSameTag = objTag == othTag; + + if (isSameTag && isBuffer$3(object)) { + if (!isBuffer$3(other)) { + return false; + } + objIsArr = true; + objIsObj = false; + } + if (isSameTag && !objIsObj) { + stack || (stack = new Stack$2); + return (objIsArr || isTypedArray$6(object)) + ? equalArrays(object, other, bitmask, customizer, equalFunc, stack) + : equalByTag(object, other, objTag, bitmask, customizer, equalFunc, stack); + } + if (!(bitmask & COMPARE_PARTIAL_FLAG$2)) { + var objIsWrapped = objIsObj && hasOwnProperty$4.call(object, '__wrapped__'), + othIsWrapped = othIsObj && hasOwnProperty$4.call(other, '__wrapped__'); + + if (objIsWrapped || othIsWrapped) { + var objUnwrapped = objIsWrapped ? object.value() : object, + othUnwrapped = othIsWrapped ? other.value() : other; + + stack || (stack = new Stack$2); + return equalFunc(objUnwrapped, othUnwrapped, bitmask, customizer, stack); + } + } + if (!isSameTag) { + return false; + } + stack || (stack = new Stack$2); + return equalObjects(object, other, bitmask, customizer, equalFunc, stack); +} + +var _baseIsEqualDeep = baseIsEqualDeep$1; + +var baseIsEqualDeep = _baseIsEqualDeep, + isObjectLike$7 = isObjectLike_1; + +/** + * The base implementation of `_.isEqual` which supports partial comparisons + * and tracks traversed objects. + * + * @private + * @param {*} value The value to compare. + * @param {*} other The other value to compare. + * @param {boolean} bitmask The bitmask flags. + * 1 - Unordered comparison + * 2 - Partial comparison + * @param {Function} [customizer] The function to customize comparisons. + * @param {Object} [stack] Tracks traversed `value` and `other` objects. + * @returns {boolean} Returns `true` if the values are equivalent, else `false`. + */ +function baseIsEqual$2(value, other, bitmask, customizer, stack) { + if (value === other) { + return true; + } + if (value == null || other == null || (!isObjectLike$7(value) && !isObjectLike$7(other))) { + return value !== value && other !== other; + } + return baseIsEqualDeep(value, other, bitmask, customizer, baseIsEqual$2, stack); +} + +var _baseIsEqual = baseIsEqual$2; + +var Stack$1 = _Stack, + baseIsEqual$1 = _baseIsEqual; + +/** Used to compose bitmasks for value comparisons. */ +var COMPARE_PARTIAL_FLAG$1 = 1, + COMPARE_UNORDERED_FLAG$1 = 2; + +/** + * The base implementation of `_.isMatch` without support for iteratee shorthands. + * + * @private + * @param {Object} object The object to inspect. + * @param {Object} source The object of property values to match. + * @param {Array} matchData The property names, values, and compare flags to match. + * @param {Function} [customizer] The function to customize comparisons. + * @returns {boolean} Returns `true` if `object` is a match, else `false`. + */ +function baseIsMatch$1(object, source, matchData, customizer) { + var index = matchData.length, + length = index, + noCustomizer = !customizer; + + if (object == null) { + return !length; + } + object = Object(object); + while (index--) { + var data = matchData[index]; + if ((noCustomizer && data[2]) + ? data[1] !== object[data[0]] + : !(data[0] in object) + ) { + return false; + } + } + while (++index < length) { + data = matchData[index]; + var key = data[0], + objValue = object[key], + srcValue = data[1]; + + if (noCustomizer && data[2]) { + if (objValue === undefined && !(key in object)) { + return false; + } + } else { + var stack = new Stack$1; + if (customizer) { + var result = customizer(objValue, srcValue, key, object, source, stack); + } + if (!(result === undefined + ? baseIsEqual$1(srcValue, objValue, COMPARE_PARTIAL_FLAG$1 | COMPARE_UNORDERED_FLAG$1, customizer, stack) + : result + )) { + return false; + } + } + } + return true; +} + +var _baseIsMatch = baseIsMatch$1; + +var isObject$7 = isObject_1; + +/** + * Checks if `value` is suitable for strict equality comparisons, i.e. `===`. + * + * @private + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` if suitable for strict + * equality comparisons, else `false`. + */ +function isStrictComparable$2(value) { + return value === value && !isObject$7(value); +} + +var _isStrictComparable = isStrictComparable$2; + +var isStrictComparable$1 = _isStrictComparable, + keys$2 = keys_1; + +/** + * Gets the property names, values, and compare flags of `object`. + * + * @private + * @param {Object} object The object to query. + * @returns {Array} Returns the match data of `object`. + */ +function getMatchData$1(object) { + var result = keys$2(object), + length = result.length; + + while (length--) { + var key = result[length], + value = object[key]; + + result[length] = [key, value, isStrictComparable$1(value)]; + } + return result; +} + +var _getMatchData = getMatchData$1; + +/** + * A specialized version of `matchesProperty` for source values suitable + * for strict equality comparisons, i.e. `===`. + * + * @private + * @param {string} key The key of the property to get. + * @param {*} srcValue The value to match. + * @returns {Function} Returns the new spec function. + */ + +function matchesStrictComparable$2(key, srcValue) { + return function(object) { + if (object == null) { + return false; + } + return object[key] === srcValue && + (srcValue !== undefined || (key in Object(object))); + }; +} + +var _matchesStrictComparable = matchesStrictComparable$2; + +var baseIsMatch = _baseIsMatch, + getMatchData = _getMatchData, + matchesStrictComparable$1 = _matchesStrictComparable; + +/** + * The base implementation of `_.matches` which doesn't clone `source`. + * + * @private + * @param {Object} source The object of property values to match. + * @returns {Function} Returns the new spec function. + */ +function baseMatches$1(source) { + var matchData = getMatchData(source); + if (matchData.length == 1 && matchData[0][2]) { + return matchesStrictComparable$1(matchData[0][0], matchData[0][1]); + } + return function(object) { + return object === source || baseIsMatch(object, source, matchData); + }; +} + +var _baseMatches = baseMatches$1; + +var baseGetTag$2 = _baseGetTag, + isObjectLike$6 = isObjectLike_1; + +/** `Object#toString` result references. */ +var symbolTag = '[object Symbol]'; + +/** + * Checks if `value` is classified as a `Symbol` primitive or object. + * + * @static + * @memberOf _ + * @since 4.0.0 + * @category Lang + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is a symbol, else `false`. + * @example + * + * _.isSymbol(Symbol.iterator); + * // => true + * + * _.isSymbol('abc'); + * // => false + */ +function isSymbol$6(value) { + return typeof value == 'symbol' || + (isObjectLike$6(value) && baseGetTag$2(value) == symbolTag); +} + +var isSymbol_1 = isSymbol$6; + +var isArray$e = isArray_1, + isSymbol$5 = isSymbol_1; + +/** Used to match property names within property paths. */ +var reIsDeepProp = /\.|\[(?:[^[\]]*|(["'])(?:(?!\1)[^\\]|\\.)*?\1)\]/, + reIsPlainProp = /^\w*$/; + +/** + * Checks if `value` is a property name and not a property path. + * + * @private + * @param {*} value The value to check. + * @param {Object} [object] The object to query keys on. + * @returns {boolean} Returns `true` if `value` is a property name, else `false`. + */ +function isKey$3(value, object) { + if (isArray$e(value)) { + return false; + } + var type = typeof value; + if (type == 'number' || type == 'symbol' || type == 'boolean' || + value == null || isSymbol$5(value)) { + return true; + } + return reIsPlainProp.test(value) || !reIsDeepProp.test(value) || + (object != null && value in Object(object)); +} + +var _isKey = isKey$3; + +var MapCache = _MapCache; + +/** Error message constants. */ +var FUNC_ERROR_TEXT = 'Expected a function'; + +/** + * Creates a function that memoizes the result of `func`. If `resolver` is + * provided, it determines the cache key for storing the result based on the + * arguments provided to the memoized function. By default, the first argument + * provided to the memoized function is used as the map cache key. The `func` + * is invoked with the `this` binding of the memoized function. + * + * **Note:** The cache is exposed as the `cache` property on the memoized + * function. Its creation may be customized by replacing the `_.memoize.Cache` + * constructor with one whose instances implement the + * [`Map`](http://ecma-international.org/ecma-262/7.0/#sec-properties-of-the-map-prototype-object) + * method interface of `clear`, `delete`, `get`, `has`, and `set`. + * + * @static + * @memberOf _ + * @since 0.1.0 + * @category Function + * @param {Function} func The function to have its output memoized. + * @param {Function} [resolver] The function to resolve the cache key. + * @returns {Function} Returns the new memoized function. + * @example + * + * var object = { 'a': 1, 'b': 2 }; + * var other = { 'c': 3, 'd': 4 }; + * + * var values = _.memoize(_.values); + * values(object); + * // => [1, 2] + * + * values(other); + * // => [3, 4] + * + * object.a = 2; + * values(object); + * // => [1, 2] + * + * // Modify the result cache. + * values.cache.set(object, ['a', 'b']); + * values(object); + * // => ['a', 'b'] + * + * // Replace `_.memoize.Cache`. + * _.memoize.Cache = WeakMap; + */ +function memoize$1(func, resolver) { + if (typeof func != 'function' || (resolver != null && typeof resolver != 'function')) { + throw new TypeError(FUNC_ERROR_TEXT); + } + var memoized = function() { + var args = arguments, + key = resolver ? resolver.apply(this, args) : args[0], + cache = memoized.cache; + + if (cache.has(key)) { + return cache.get(key); + } + var result = func.apply(this, args); + memoized.cache = cache.set(key, result) || cache; + return result; + }; + memoized.cache = new (memoize$1.Cache || MapCache); + return memoized; +} + +// Expose `MapCache`. +memoize$1.Cache = MapCache; + +var memoize_1 = memoize$1; + +var memoize = memoize_1; + +/** Used as the maximum memoize cache size. */ +var MAX_MEMOIZE_SIZE = 500; + +/** + * A specialized version of `_.memoize` which clears the memoized function's + * cache when it exceeds `MAX_MEMOIZE_SIZE`. + * + * @private + * @param {Function} func The function to have its output memoized. + * @returns {Function} Returns the new memoized function. + */ +function memoizeCapped$1(func) { + var result = memoize(func, function(key) { + if (cache.size === MAX_MEMOIZE_SIZE) { + cache.clear(); + } + return key; + }); + + var cache = result.cache; + return result; +} + +var _memoizeCapped = memoizeCapped$1; + +var memoizeCapped = _memoizeCapped; + +/** Used to match property names within property paths. */ +var rePropName = /[^.[\]]+|\[(?:(-?\d+(?:\.\d+)?)|(["'])((?:(?!\2)[^\\]|\\.)*?)\2)\]|(?=(?:\.|\[\])(?:\.|\[\]|$))/g; + +/** Used to match backslashes in property paths. */ +var reEscapeChar = /\\(\\)?/g; + +/** + * Converts `string` to a property path array. + * + * @private + * @param {string} string The string to convert. + * @returns {Array} Returns the property path array. + */ +var stringToPath$1 = memoizeCapped(function(string) { + var result = []; + if (string.charCodeAt(0) === 46 /* . */) { + result.push(''); + } + string.replace(rePropName, function(match, number, quote, subString) { + result.push(quote ? subString.replace(reEscapeChar, '$1') : (number || match)); + }); + return result; +}); + +var _stringToPath = stringToPath$1; + +/** + * A specialized version of `_.map` for arrays without support for iteratee + * shorthands. + * + * @private + * @param {Array} [array] The array to iterate over. + * @param {Function} iteratee The function invoked per iteration. + * @returns {Array} Returns the new mapped array. + */ + +function arrayMap$4(array, iteratee) { + var index = -1, + length = array == null ? 0 : array.length, + result = Array(length); + + while (++index < length) { + result[index] = iteratee(array[index], index, array); + } + return result; +} + +var _arrayMap = arrayMap$4; + +var Symbol$2 = _Symbol, + arrayMap$3 = _arrayMap, + isArray$d = isArray_1, + isSymbol$4 = isSymbol_1; + +/** Used as references for various `Number` constants. */ +var INFINITY$3 = 1 / 0; + +/** Used to convert symbols to primitives and strings. */ +var symbolProto = Symbol$2 ? Symbol$2.prototype : undefined, + symbolToString = symbolProto ? symbolProto.toString : undefined; + +/** + * The base implementation of `_.toString` which doesn't convert nullish + * values to empty strings. + * + * @private + * @param {*} value The value to process. + * @returns {string} Returns the string. + */ +function baseToString$1(value) { + // Exit early for strings to avoid a performance hit in some environments. + if (typeof value == 'string') { + return value; + } + if (isArray$d(value)) { + // Recursively convert values (susceptible to call stack limits). + return arrayMap$3(value, baseToString$1) + ''; + } + if (isSymbol$4(value)) { + return symbolToString ? symbolToString.call(value) : ''; + } + var result = (value + ''); + return (result == '0' && (1 / value) == -INFINITY$3) ? '-0' : result; +} + +var _baseToString = baseToString$1; + +var baseToString = _baseToString; + +/** + * Converts `value` to a string. An empty string is returned for `null` + * and `undefined` values. The sign of `-0` is preserved. + * + * @static + * @memberOf _ + * @since 4.0.0 + * @category Lang + * @param {*} value The value to convert. + * @returns {string} Returns the converted string. + * @example + * + * _.toString(null); + * // => '' + * + * _.toString(-0); + * // => '-0' + * + * _.toString([1, 2, 3]); + * // => '1,2,3' + */ +function toString$4(value) { + return value == null ? '' : baseToString(value); +} + +var toString_1 = toString$4; + +var isArray$c = isArray_1, + isKey$2 = _isKey, + stringToPath = _stringToPath, + toString$3 = toString_1; + +/** + * Casts `value` to a path array if it's not one. + * + * @private + * @param {*} value The value to inspect. + * @param {Object} [object] The object to query keys on. + * @returns {Array} Returns the cast property path array. + */ +function castPath$4(value, object) { + if (isArray$c(value)) { + return value; + } + return isKey$2(value, object) ? [value] : stringToPath(toString$3(value)); +} + +var _castPath = castPath$4; + +var isSymbol$3 = isSymbol_1; + +/** Used as references for various `Number` constants. */ +var INFINITY$2 = 1 / 0; + +/** + * Converts `value` to a string key if it's not a string or symbol. + * + * @private + * @param {*} value The value to inspect. + * @returns {string|symbol} Returns the key. + */ +function toKey$5(value) { + if (typeof value == 'string' || isSymbol$3(value)) { + return value; + } + var result = (value + ''); + return (result == '0' && (1 / value) == -INFINITY$2) ? '-0' : result; +} + +var _toKey = toKey$5; + +var castPath$3 = _castPath, + toKey$4 = _toKey; + +/** + * The base implementation of `_.get` without support for default values. + * + * @private + * @param {Object} object The object to query. + * @param {Array|string} path The path of the property to get. + * @returns {*} Returns the resolved value. + */ +function baseGet$4(object, path) { + path = castPath$3(path, object); + + var index = 0, + length = path.length; + + while (object != null && index < length) { + object = object[toKey$4(path[index++])]; + } + return (index && index == length) ? object : undefined; +} + +var _baseGet = baseGet$4; + +var baseGet$3 = _baseGet; + +/** + * Gets the value at `path` of `object`. If the resolved value is + * `undefined`, the `defaultValue` is returned in its place. + * + * @static + * @memberOf _ + * @since 3.7.0 + * @category Object + * @param {Object} object The object to query. + * @param {Array|string} path The path of the property to get. + * @param {*} [defaultValue] The value returned for `undefined` resolved values. + * @returns {*} Returns the resolved value. + * @example + * + * var object = { 'a': [{ 'b': { 'c': 3 } }] }; + * + * _.get(object, 'a[0].b.c'); + * // => 3 + * + * _.get(object, ['a', '0', 'b', 'c']); + * // => 3 + * + * _.get(object, 'a.b.c', 'default'); + * // => 'default' + */ +function get$1(object, path, defaultValue) { + var result = object == null ? undefined : baseGet$3(object, path); + return result === undefined ? defaultValue : result; +} + +var get_1 = get$1; + +/** + * The base implementation of `_.hasIn` without support for deep paths. + * + * @private + * @param {Object} [object] The object to query. + * @param {Array|string} key The key to check. + * @returns {boolean} Returns `true` if `key` exists, else `false`. + */ + +function baseHasIn$1(object, key) { + return object != null && key in Object(object); +} + +var _baseHasIn = baseHasIn$1; + +var castPath$2 = _castPath, + isArguments$3 = isArguments_1, + isArray$b = isArray_1, + isIndex$2 = _isIndex, + isLength$3 = isLength_1, + toKey$3 = _toKey; + +/** + * Checks if `path` exists on `object`. + * + * @private + * @param {Object} object The object to query. + * @param {Array|string} path The path to check. + * @param {Function} hasFunc The function to check properties. + * @returns {boolean} Returns `true` if `path` exists, else `false`. + */ +function hasPath$2(object, path, hasFunc) { + path = castPath$2(path, object); + + var index = -1, + length = path.length, + result = false; + + while (++index < length) { + var key = toKey$3(path[index]); + if (!(result = object != null && hasFunc(object, key))) { + break; + } + object = object[key]; + } + if (result || ++index != length) { + return result; + } + length = object == null ? 0 : object.length; + return !!length && isLength$3(length) && isIndex$2(key, length) && + (isArray$b(object) || isArguments$3(object)); +} + +var _hasPath = hasPath$2; + +var baseHasIn = _baseHasIn, + hasPath$1 = _hasPath; + +/** + * Checks if `path` is a direct or inherited property of `object`. + * + * @static + * @memberOf _ + * @since 4.0.0 + * @category Object + * @param {Object} object The object to query. + * @param {Array|string} path The path to check. + * @returns {boolean} Returns `true` if `path` exists, else `false`. + * @example + * + * var object = _.create({ 'a': _.create({ 'b': 2 }) }); + * + * _.hasIn(object, 'a'); + * // => true + * + * _.hasIn(object, 'a.b'); + * // => true + * + * _.hasIn(object, ['a', 'b']); + * // => true + * + * _.hasIn(object, 'b'); + * // => false + */ +function hasIn$2(object, path) { + return object != null && hasPath$1(object, path, baseHasIn); +} + +var hasIn_1 = hasIn$2; + +var baseIsEqual = _baseIsEqual, + get = get_1, + hasIn$1 = hasIn_1, + isKey$1 = _isKey, + isStrictComparable = _isStrictComparable, + matchesStrictComparable = _matchesStrictComparable, + toKey$2 = _toKey; + +/** Used to compose bitmasks for value comparisons. */ +var COMPARE_PARTIAL_FLAG = 1, + COMPARE_UNORDERED_FLAG = 2; + +/** + * The base implementation of `_.matchesProperty` which doesn't clone `srcValue`. + * + * @private + * @param {string} path The path of the property to get. + * @param {*} srcValue The value to match. + * @returns {Function} Returns the new spec function. + */ +function baseMatchesProperty$1(path, srcValue) { + if (isKey$1(path) && isStrictComparable(srcValue)) { + return matchesStrictComparable(toKey$2(path), srcValue); + } + return function(object) { + var objValue = get(object, path); + return (objValue === undefined && objValue === srcValue) + ? hasIn$1(object, path) + : baseIsEqual(srcValue, objValue, COMPARE_PARTIAL_FLAG | COMPARE_UNORDERED_FLAG); + }; +} + +var _baseMatchesProperty = baseMatchesProperty$1; + +/** + * The base implementation of `_.property` without support for deep paths. + * + * @private + * @param {string} key The key of the property to get. + * @returns {Function} Returns the new accessor function. + */ + +function baseProperty$2(key) { + return function(object) { + return object == null ? undefined : object[key]; + }; +} + +var _baseProperty = baseProperty$2; + +var baseGet$2 = _baseGet; + +/** + * A specialized version of `baseProperty` which supports deep paths. + * + * @private + * @param {Array|string} path The path of the property to get. + * @returns {Function} Returns the new accessor function. + */ +function basePropertyDeep$1(path) { + return function(object) { + return baseGet$2(object, path); + }; +} + +var _basePropertyDeep = basePropertyDeep$1; + +var baseProperty$1 = _baseProperty, + basePropertyDeep = _basePropertyDeep, + isKey = _isKey, + toKey$1 = _toKey; + +/** + * Creates a function that returns the value at `path` of a given object. + * + * @static + * @memberOf _ + * @since 2.4.0 + * @category Util + * @param {Array|string} path The path of the property to get. + * @returns {Function} Returns the new accessor function. + * @example + * + * var objects = [ + * { 'a': { 'b': 2 } }, + * { 'a': { 'b': 1 } } + * ]; + * + * _.map(objects, _.property('a.b')); + * // => [2, 1] + * + * _.map(_.sortBy(objects, _.property(['a', 'b'])), 'a.b'); + * // => [1, 2] + */ +function property$1(path) { + return isKey(path) ? baseProperty$1(toKey$1(path)) : basePropertyDeep(path); +} + +var property_1 = property$1; + +var baseMatches = _baseMatches, + baseMatchesProperty = _baseMatchesProperty, + identity$5 = identity_1, + isArray$a = isArray_1, + property = property_1; + +/** + * The base implementation of `_.iteratee`. + * + * @private + * @param {*} [value=_.identity] The value to convert to an iteratee. + * @returns {Function} Returns the iteratee. + */ +function baseIteratee$9(value) { + // Don't store the `typeof` result in a variable to avoid a JIT bug in Safari 9. + // See https://bugs.webkit.org/show_bug.cgi?id=156034 for more details. + if (typeof value == 'function') { + return value; + } + if (value == null) { + return identity$5; + } + if (typeof value == 'object') { + return isArray$a(value) + ? baseMatchesProperty(value[0], value[1]) + : baseMatches(value); + } + return property(value); +} + +var _baseIteratee = baseIteratee$9; + +var arrayFilter = _arrayFilter, + baseFilter = _baseFilter, + baseIteratee$8 = _baseIteratee, + isArray$9 = isArray_1; + +/** + * Iterates over elements of `collection`, returning an array of all elements + * `predicate` returns truthy for. The predicate is invoked with three + * arguments: (value, index|key, collection). + * + * **Note:** Unlike `_.remove`, this method returns a new array. + * + * @static + * @memberOf _ + * @since 0.1.0 + * @category Collection + * @param {Array|Object} collection The collection to iterate over. + * @param {Function} [predicate=_.identity] The function invoked per iteration. + * @returns {Array} Returns the new filtered array. + * @see _.reject + * @example + * + * var users = [ + * { 'user': 'barney', 'age': 36, 'active': true }, + * { 'user': 'fred', 'age': 40, 'active': false } + * ]; + * + * _.filter(users, function(o) { return !o.active; }); + * // => objects for ['fred'] + * + * // The `_.matches` iteratee shorthand. + * _.filter(users, { 'age': 36, 'active': true }); + * // => objects for ['barney'] + * + * // The `_.matchesProperty` iteratee shorthand. + * _.filter(users, ['active', false]); + * // => objects for ['fred'] + * + * // The `_.property` iteratee shorthand. + * _.filter(users, 'active'); + * // => objects for ['barney'] + * + * // Combining several predicates using `_.overEvery` or `_.overSome`. + * _.filter(users, _.overSome([{ 'age': 36 }, ['age', 40]])); + * // => objects for ['fred', 'barney'] + */ +function filter(collection, predicate) { + var func = isArray$9(collection) ? arrayFilter : baseFilter; + return func(collection, baseIteratee$8(predicate)); +} + +var filter_1 = filter; + +/** Used for built-in method references. */ + +var objectProto$6 = Object.prototype; + +/** Used to check objects for own properties. */ +var hasOwnProperty$3 = objectProto$6.hasOwnProperty; + +/** + * The base implementation of `_.has` without support for deep paths. + * + * @private + * @param {Object} [object] The object to query. + * @param {Array|string} key The key to check. + * @returns {boolean} Returns `true` if `key` exists, else `false`. + */ +function baseHas$1(object, key) { + return object != null && hasOwnProperty$3.call(object, key); +} + +var _baseHas = baseHas$1; + +var baseHas = _baseHas, + hasPath = _hasPath; + +/** + * Checks if `path` is a direct property of `object`. + * + * @static + * @since 0.1.0 + * @memberOf _ + * @category Object + * @param {Object} object The object to query. + * @param {Array|string} path The path to check. + * @returns {boolean} Returns `true` if `path` exists, else `false`. + * @example + * + * var object = { 'a': { 'b': 2 } }; + * var other = _.create({ 'a': _.create({ 'b': 2 }) }); + * + * _.has(object, 'a'); + * // => true + * + * _.has(object, 'a.b'); + * // => true + * + * _.has(object, ['a', 'b']); + * // => true + * + * _.has(other, 'a'); + * // => false + */ +function has(object, path) { + return object != null && hasPath(object, path, baseHas); +} + +var has_1 = has; + +var baseKeys$1 = _baseKeys, + getTag$1 = _getTag, + isArguments$2 = isArguments_1, + isArray$8 = isArray_1, + isArrayLike$5 = isArrayLike_1, + isBuffer$2 = isBuffer$6.exports, + isPrototype = _isPrototype, + isTypedArray$5 = isTypedArray_1; + +/** `Object#toString` result references. */ +var mapTag$4 = '[object Map]', + setTag$5 = '[object Set]'; + +/** Used for built-in method references. */ +var objectProto$5 = Object.prototype; + +/** Used to check objects for own properties. */ +var hasOwnProperty$2 = objectProto$5.hasOwnProperty; + +/** + * Checks if `value` is an empty object, collection, map, or set. + * + * Objects are considered empty if they have no own enumerable string keyed + * properties. + * + * Array-like values such as `arguments` objects, arrays, buffers, strings, or + * jQuery-like collections are considered empty if they have a `length` of `0`. + * Similarly, maps and sets are considered empty if they have a `size` of `0`. + * + * @static + * @memberOf _ + * @since 0.1.0 + * @category Lang + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is empty, else `false`. + * @example + * + * _.isEmpty(null); + * // => true + * + * _.isEmpty(true); + * // => true + * + * _.isEmpty(1); + * // => true + * + * _.isEmpty([1, 2, 3]); + * // => false + * + * _.isEmpty({ 'a': 1 }); + * // => false + */ +function isEmpty(value) { + if (value == null) { + return true; + } + if (isArrayLike$5(value) && + (isArray$8(value) || typeof value == 'string' || typeof value.splice == 'function' || + isBuffer$2(value) || isTypedArray$5(value) || isArguments$2(value))) { + return !value.length; + } + var tag = getTag$1(value); + if (tag == mapTag$4 || tag == setTag$5) { + return !value.size; + } + if (isPrototype(value)) { + return !baseKeys$1(value).length; + } + for (var key in value) { + if (hasOwnProperty$2.call(value, key)) { + return false; + } + } + return true; +} + +var isEmpty_1 = isEmpty; + +/** + * Checks if `value` is `undefined`. + * + * @static + * @since 0.1.0 + * @memberOf _ + * @category Lang + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is `undefined`, else `false`. + * @example + * + * _.isUndefined(void 0); + * // => true + * + * _.isUndefined(null); + * // => false + */ + +function isUndefined(value) { + return value === undefined; +} + +var isUndefined_1 = isUndefined; + +var baseEach$1 = _baseEach, + isArrayLike$4 = isArrayLike_1; + +/** + * The base implementation of `_.map` without support for iteratee shorthands. + * + * @private + * @param {Array|Object} collection The collection to iterate over. + * @param {Function} iteratee The function invoked per iteration. + * @returns {Array} Returns the new mapped array. + */ +function baseMap$2(collection, iteratee) { + var index = -1, + result = isArrayLike$4(collection) ? Array(collection.length) : []; + + baseEach$1(collection, function(value, key, collection) { + result[++index] = iteratee(value, key, collection); + }); + return result; +} + +var _baseMap = baseMap$2; + +var arrayMap$2 = _arrayMap, + baseIteratee$7 = _baseIteratee, + baseMap$1 = _baseMap, + isArray$7 = isArray_1; + +/** + * Creates an array of values by running each element in `collection` thru + * `iteratee`. The iteratee is invoked with three arguments: + * (value, index|key, collection). + * + * Many lodash methods are guarded to work as iteratees for methods like + * `_.every`, `_.filter`, `_.map`, `_.mapValues`, `_.reject`, and `_.some`. + * + * The guarded methods are: + * `ary`, `chunk`, `curry`, `curryRight`, `drop`, `dropRight`, `every`, + * `fill`, `invert`, `parseInt`, `random`, `range`, `rangeRight`, `repeat`, + * `sampleSize`, `slice`, `some`, `sortBy`, `split`, `take`, `takeRight`, + * `template`, `trim`, `trimEnd`, `trimStart`, and `words` + * + * @static + * @memberOf _ + * @since 0.1.0 + * @category Collection + * @param {Array|Object} collection The collection to iterate over. + * @param {Function} [iteratee=_.identity] The function invoked per iteration. + * @returns {Array} Returns the new mapped array. + * @example + * + * function square(n) { + * return n * n; + * } + * + * _.map([4, 8], square); + * // => [16, 64] + * + * _.map({ 'a': 4, 'b': 8 }, square); + * // => [16, 64] (iteration order is not guaranteed) + * + * var users = [ + * { 'user': 'barney' }, + * { 'user': 'fred' } + * ]; + * + * // The `_.property` iteratee shorthand. + * _.map(users, 'user'); + * // => ['barney', 'fred'] + */ +function map(collection, iteratee) { + var func = isArray$7(collection) ? arrayMap$2 : baseMap$1; + return func(collection, baseIteratee$7(iteratee)); +} + +var map_1 = map; + +/** + * A specialized version of `_.reduce` for arrays without support for + * iteratee shorthands. + * + * @private + * @param {Array} [array] The array to iterate over. + * @param {Function} iteratee The function invoked per iteration. + * @param {*} [accumulator] The initial value. + * @param {boolean} [initAccum] Specify using the first element of `array` as + * the initial value. + * @returns {*} Returns the accumulated value. + */ + +function arrayReduce$1(array, iteratee, accumulator, initAccum) { + var index = -1, + length = array == null ? 0 : array.length; + + if (initAccum && length) { + accumulator = array[++index]; + } + while (++index < length) { + accumulator = iteratee(accumulator, array[index], index, array); + } + return accumulator; +} + +var _arrayReduce = arrayReduce$1; + +/** + * The base implementation of `_.reduce` and `_.reduceRight`, without support + * for iteratee shorthands, which iterates over `collection` using `eachFunc`. + * + * @private + * @param {Array|Object} collection The collection to iterate over. + * @param {Function} iteratee The function invoked per iteration. + * @param {*} accumulator The initial value. + * @param {boolean} initAccum Specify using the first or last element of + * `collection` as the initial value. + * @param {Function} eachFunc The function to iterate over `collection`. + * @returns {*} Returns the accumulated value. + */ + +function baseReduce$1(collection, iteratee, accumulator, initAccum, eachFunc) { + eachFunc(collection, function(value, index, collection) { + accumulator = initAccum + ? (initAccum = false, value) + : iteratee(accumulator, value, index, collection); + }); + return accumulator; +} + +var _baseReduce = baseReduce$1; + +var arrayReduce = _arrayReduce, + baseEach = _baseEach, + baseIteratee$6 = _baseIteratee, + baseReduce = _baseReduce, + isArray$6 = isArray_1; + +/** + * Reduces `collection` to a value which is the accumulated result of running + * each element in `collection` thru `iteratee`, where each successive + * invocation is supplied the return value of the previous. If `accumulator` + * is not given, the first element of `collection` is used as the initial + * value. The iteratee is invoked with four arguments: + * (accumulator, value, index|key, collection). + * + * Many lodash methods are guarded to work as iteratees for methods like + * `_.reduce`, `_.reduceRight`, and `_.transform`. + * + * The guarded methods are: + * `assign`, `defaults`, `defaultsDeep`, `includes`, `merge`, `orderBy`, + * and `sortBy` + * + * @static + * @memberOf _ + * @since 0.1.0 + * @category Collection + * @param {Array|Object} collection The collection to iterate over. + * @param {Function} [iteratee=_.identity] The function invoked per iteration. + * @param {*} [accumulator] The initial value. + * @returns {*} Returns the accumulated value. + * @see _.reduceRight + * @example + * + * _.reduce([1, 2], function(sum, n) { + * return sum + n; + * }, 0); + * // => 3 + * + * _.reduce({ 'a': 1, 'b': 2, 'c': 1 }, function(result, value, key) { + * (result[value] || (result[value] = [])).push(key); + * return result; + * }, {}); + * // => { '1': ['a', 'c'], '2': ['b'] } (iteration order is not guaranteed) + */ +function reduce(collection, iteratee, accumulator) { + var func = isArray$6(collection) ? arrayReduce : baseReduce, + initAccum = arguments.length < 3; + + return func(collection, baseIteratee$6(iteratee), accumulator, initAccum, baseEach); +} + +var reduce_1 = reduce; + +var baseGetTag$1 = _baseGetTag, + isArray$5 = isArray_1, + isObjectLike$5 = isObjectLike_1; + +/** `Object#toString` result references. */ +var stringTag$3 = '[object String]'; + +/** + * Checks if `value` is classified as a `String` primitive or object. + * + * @static + * @since 0.1.0 + * @memberOf _ + * @category Lang + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is a string, else `false`. + * @example + * + * _.isString('abc'); + * // => true + * + * _.isString(1); + * // => false + */ +function isString$1(value) { + return typeof value == 'string' || + (!isArray$5(value) && isObjectLike$5(value) && baseGetTag$1(value) == stringTag$3); +} + +var isString_1 = isString$1; + +var baseProperty = _baseProperty; + +/** + * Gets the size of an ASCII `string`. + * + * @private + * @param {string} string The string inspect. + * @returns {number} Returns the string size. + */ +var asciiSize$1 = baseProperty('length'); + +var _asciiSize = asciiSize$1; + +/** Used to compose unicode character classes. */ + +var rsAstralRange$1 = '\\ud800-\\udfff', + rsComboMarksRange$1 = '\\u0300-\\u036f', + reComboHalfMarksRange$1 = '\\ufe20-\\ufe2f', + rsComboSymbolsRange$1 = '\\u20d0-\\u20ff', + rsComboRange$1 = rsComboMarksRange$1 + reComboHalfMarksRange$1 + rsComboSymbolsRange$1, + rsVarRange$1 = '\\ufe0e\\ufe0f'; + +/** Used to compose unicode capture groups. */ +var rsZWJ$1 = '\\u200d'; + +/** Used to detect strings with [zero-width joiners or code points from the astral planes](http://eev.ee/blog/2015/09/12/dark-corners-of-unicode/). */ +var reHasUnicode = RegExp('[' + rsZWJ$1 + rsAstralRange$1 + rsComboRange$1 + rsVarRange$1 + ']'); + +/** + * Checks if `string` contains Unicode symbols. + * + * @private + * @param {string} string The string to inspect. + * @returns {boolean} Returns `true` if a symbol is found, else `false`. + */ +function hasUnicode$1(string) { + return reHasUnicode.test(string); +} + +var _hasUnicode = hasUnicode$1; + +/** Used to compose unicode character classes. */ + +var rsAstralRange = '\\ud800-\\udfff', + rsComboMarksRange = '\\u0300-\\u036f', + reComboHalfMarksRange = '\\ufe20-\\ufe2f', + rsComboSymbolsRange = '\\u20d0-\\u20ff', + rsComboRange = rsComboMarksRange + reComboHalfMarksRange + rsComboSymbolsRange, + rsVarRange = '\\ufe0e\\ufe0f'; + +/** Used to compose unicode capture groups. */ +var rsAstral = '[' + rsAstralRange + ']', + rsCombo = '[' + rsComboRange + ']', + rsFitz = '\\ud83c[\\udffb-\\udfff]', + rsModifier = '(?:' + rsCombo + '|' + rsFitz + ')', + rsNonAstral = '[^' + rsAstralRange + ']', + rsRegional = '(?:\\ud83c[\\udde6-\\uddff]){2}', + rsSurrPair = '[\\ud800-\\udbff][\\udc00-\\udfff]', + rsZWJ = '\\u200d'; + +/** Used to compose unicode regexes. */ +var reOptMod = rsModifier + '?', + rsOptVar = '[' + rsVarRange + ']?', + rsOptJoin = '(?:' + rsZWJ + '(?:' + [rsNonAstral, rsRegional, rsSurrPair].join('|') + ')' + rsOptVar + reOptMod + ')*', + rsSeq = rsOptVar + reOptMod + rsOptJoin, + rsSymbol = '(?:' + [rsNonAstral + rsCombo + '?', rsCombo, rsRegional, rsSurrPair, rsAstral].join('|') + ')'; + +/** Used to match [string symbols](https://mathiasbynens.be/notes/javascript-unicode). */ +var reUnicode = RegExp(rsFitz + '(?=' + rsFitz + ')|' + rsSymbol + rsSeq, 'g'); + +/** + * Gets the size of a Unicode `string`. + * + * @private + * @param {string} string The string inspect. + * @returns {number} Returns the string size. + */ +function unicodeSize$1(string) { + var result = reUnicode.lastIndex = 0; + while (reUnicode.test(string)) { + ++result; + } + return result; +} + +var _unicodeSize = unicodeSize$1; + +var asciiSize = _asciiSize, + hasUnicode = _hasUnicode, + unicodeSize = _unicodeSize; + +/** + * Gets the number of symbols in `string`. + * + * @private + * @param {string} string The string to inspect. + * @returns {number} Returns the string size. + */ +function stringSize$1(string) { + return hasUnicode(string) + ? unicodeSize(string) + : asciiSize(string); +} + +var _stringSize = stringSize$1; + +var baseKeys = _baseKeys, + getTag = _getTag, + isArrayLike$3 = isArrayLike_1, + isString = isString_1, + stringSize = _stringSize; + +/** `Object#toString` result references. */ +var mapTag$3 = '[object Map]', + setTag$4 = '[object Set]'; + +/** + * Gets the size of `collection` by returning its length for array-like + * values or the number of own enumerable string keyed properties for objects. + * + * @static + * @memberOf _ + * @since 0.1.0 + * @category Collection + * @param {Array|Object|string} collection The collection to inspect. + * @returns {number} Returns the collection size. + * @example + * + * _.size([1, 2, 3]); + * // => 3 + * + * _.size({ 'a': 1, 'b': 2 }); + * // => 2 + * + * _.size('pebbles'); + * // => 7 + */ +function size(collection) { + if (collection == null) { + return 0; + } + if (isArrayLike$3(collection)) { + return isString(collection) ? stringSize(collection) : collection.length; + } + var tag = getTag(collection); + if (tag == mapTag$3 || tag == setTag$4) { + return collection.size; + } + return baseKeys(collection).length; +} + +var size_1 = size; + +var arrayEach = _arrayEach, + baseCreate = _baseCreate, + baseForOwn$1 = _baseForOwn, + baseIteratee$5 = _baseIteratee, + getPrototype$1 = _getPrototype, + isArray$4 = isArray_1, + isBuffer$1 = isBuffer$6.exports, + isFunction$1 = isFunction_1, + isObject$6 = isObject_1, + isTypedArray$4 = isTypedArray_1; + +/** + * An alternative to `_.reduce`; this method transforms `object` to a new + * `accumulator` object which is the result of running each of its own + * enumerable string keyed properties thru `iteratee`, with each invocation + * potentially mutating the `accumulator` object. If `accumulator` is not + * provided, a new object with the same `[[Prototype]]` will be used. The + * iteratee is invoked with four arguments: (accumulator, value, key, object). + * Iteratee functions may exit iteration early by explicitly returning `false`. + * + * @static + * @memberOf _ + * @since 1.3.0 + * @category Object + * @param {Object} object The object to iterate over. + * @param {Function} [iteratee=_.identity] The function invoked per iteration. + * @param {*} [accumulator] The custom accumulator value. + * @returns {*} Returns the accumulated value. + * @example + * + * _.transform([2, 3, 4], function(result, n) { + * result.push(n *= n); + * return n % 2 == 0; + * }, []); + * // => [4, 9] + * + * _.transform({ 'a': 1, 'b': 2, 'c': 1 }, function(result, value, key) { + * (result[value] || (result[value] = [])).push(key); + * }, {}); + * // => { '1': ['a', 'c'], '2': ['b'] } + */ +function transform$5(object, iteratee, accumulator) { + var isArr = isArray$4(object), + isArrLike = isArr || isBuffer$1(object) || isTypedArray$4(object); + + iteratee = baseIteratee$5(iteratee); + if (accumulator == null) { + var Ctor = object && object.constructor; + if (isArrLike) { + accumulator = isArr ? new Ctor : []; + } + else if (isObject$6(object)) { + accumulator = isFunction$1(Ctor) ? baseCreate(getPrototype$1(object)) : {}; + } + else { + accumulator = {}; + } + } + (isArrLike ? arrayEach : baseForOwn$1)(object, function(value, index, object) { + return iteratee(accumulator, value, index, object); + }); + return accumulator; +} + +var transform_1 = transform$5; + +var Symbol$1 = _Symbol, + isArguments$1 = isArguments_1, + isArray$3 = isArray_1; + +/** Built-in value references. */ +var spreadableSymbol = Symbol$1 ? Symbol$1.isConcatSpreadable : undefined; + +/** + * Checks if `value` is a flattenable `arguments` object or array. + * + * @private + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is flattenable, else `false`. + */ +function isFlattenable$1(value) { + return isArray$3(value) || isArguments$1(value) || + !!(spreadableSymbol && value && value[spreadableSymbol]); +} + +var _isFlattenable = isFlattenable$1; + +var arrayPush = _arrayPush, + isFlattenable = _isFlattenable; + +/** + * The base implementation of `_.flatten` with support for restricting flattening. + * + * @private + * @param {Array} array The array to flatten. + * @param {number} depth The maximum recursion depth. + * @param {boolean} [predicate=isFlattenable] The function invoked per iteration. + * @param {boolean} [isStrict] Restrict to values that pass `predicate` checks. + * @param {Array} [result=[]] The initial result value. + * @returns {Array} Returns the new flattened array. + */ +function baseFlatten$3(array, depth, predicate, isStrict, result) { + var index = -1, + length = array.length; + + predicate || (predicate = isFlattenable); + result || (result = []); + + while (++index < length) { + var value = array[index]; + if (depth > 0 && predicate(value)) { + if (depth > 1) { + // Recursively flatten arrays (susceptible to call stack limits). + baseFlatten$3(value, depth - 1, predicate, isStrict, result); + } else { + arrayPush(result, value); + } + } else if (!isStrict) { + result[result.length] = value; + } + } + return result; +} + +var _baseFlatten = baseFlatten$3; + +/** + * A faster alternative to `Function#apply`, this function invokes `func` + * with the `this` binding of `thisArg` and the arguments of `args`. + * + * @private + * @param {Function} func The function to invoke. + * @param {*} thisArg The `this` binding of `func`. + * @param {Array} args The arguments to invoke `func` with. + * @returns {*} Returns the result of `func`. + */ + +function apply$1(func, thisArg, args) { + switch (args.length) { + case 0: return func.call(thisArg); + case 1: return func.call(thisArg, args[0]); + case 2: return func.call(thisArg, args[0], args[1]); + case 3: return func.call(thisArg, args[0], args[1], args[2]); + } + return func.apply(thisArg, args); +} + +var _apply = apply$1; + +var apply = _apply; + +/* Built-in method references for those with the same name as other `lodash` methods. */ +var nativeMax$2 = Math.max; + +/** + * A specialized version of `baseRest` which transforms the rest array. + * + * @private + * @param {Function} func The function to apply a rest parameter to. + * @param {number} [start=func.length-1] The start position of the rest parameter. + * @param {Function} transform The rest array transform. + * @returns {Function} Returns the new function. + */ +function overRest$2(func, start, transform) { + start = nativeMax$2(start === undefined ? (func.length - 1) : start, 0); + return function() { + var args = arguments, + index = -1, + length = nativeMax$2(args.length - start, 0), + array = Array(length); + + while (++index < length) { + array[index] = args[start + index]; + } + index = -1; + var otherArgs = Array(start + 1); + while (++index < start) { + otherArgs[index] = args[index]; + } + otherArgs[start] = transform(array); + return apply(func, this, otherArgs); + }; +} + +var _overRest = overRest$2; + +var constant = constant_1, + defineProperty = _defineProperty$1, + identity$4 = identity_1; + +/** + * The base implementation of `setToString` without support for hot loop shorting. + * + * @private + * @param {Function} func The function to modify. + * @param {Function} string The `toString` result. + * @returns {Function} Returns `func`. + */ +var baseSetToString$1 = !defineProperty ? identity$4 : function(func, string) { + return defineProperty(func, 'toString', { + 'configurable': true, + 'enumerable': false, + 'value': constant(string), + 'writable': true + }); +}; + +var _baseSetToString = baseSetToString$1; + +/** Used to detect hot functions by number of calls within a span of milliseconds. */ + +var HOT_COUNT = 800, + HOT_SPAN = 16; + +/* Built-in method references for those with the same name as other `lodash` methods. */ +var nativeNow = Date.now; + +/** + * Creates a function that'll short out and invoke `identity` instead + * of `func` when it's called `HOT_COUNT` or more times in `HOT_SPAN` + * milliseconds. + * + * @private + * @param {Function} func The function to restrict. + * @returns {Function} Returns the new shortable function. + */ +function shortOut$1(func) { + var count = 0, + lastCalled = 0; + + return function() { + var stamp = nativeNow(), + remaining = HOT_SPAN - (stamp - lastCalled); + + lastCalled = stamp; + if (remaining > 0) { + if (++count >= HOT_COUNT) { + return arguments[0]; + } + } else { + count = 0; + } + return func.apply(undefined, arguments); + }; +} + +var _shortOut = shortOut$1; + +var baseSetToString = _baseSetToString, + shortOut = _shortOut; + +/** + * Sets the `toString` method of `func` to return `string`. + * + * @private + * @param {Function} func The function to modify. + * @param {Function} string The `toString` result. + * @returns {Function} Returns `func`. + */ +var setToString$2 = shortOut(baseSetToString); + +var _setToString = setToString$2; + +var identity$3 = identity_1, + overRest$1 = _overRest, + setToString$1 = _setToString; + +/** + * The base implementation of `_.rest` which doesn't validate or coerce arguments. + * + * @private + * @param {Function} func The function to apply a rest parameter to. + * @param {number} [start=func.length-1] The start position of the rest parameter. + * @returns {Function} Returns the new function. + */ +function baseRest$4(func, start) { + return setToString$1(overRest$1(func, start, identity$3), func + ''); +} + +var _baseRest = baseRest$4; + +/** + * The base implementation of `_.findIndex` and `_.findLastIndex` without + * support for iteratee shorthands. + * + * @private + * @param {Array} array The array to inspect. + * @param {Function} predicate The function invoked per iteration. + * @param {number} fromIndex The index to search from. + * @param {boolean} [fromRight] Specify iterating from right to left. + * @returns {number} Returns the index of the matched value, else `-1`. + */ + +function baseFindIndex$2(array, predicate, fromIndex, fromRight) { + var length = array.length, + index = fromIndex + (fromRight ? 1 : -1); + + while ((fromRight ? index-- : ++index < length)) { + if (predicate(array[index], index, array)) { + return index; + } + } + return -1; +} + +var _baseFindIndex = baseFindIndex$2; + +/** + * The base implementation of `_.isNaN` without support for number objects. + * + * @private + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is `NaN`, else `false`. + */ + +function baseIsNaN$1(value) { + return value !== value; +} + +var _baseIsNaN = baseIsNaN$1; + +/** + * A specialized version of `_.indexOf` which performs strict equality + * comparisons of values, i.e. `===`. + * + * @private + * @param {Array} array The array to inspect. + * @param {*} value The value to search for. + * @param {number} fromIndex The index to search from. + * @returns {number} Returns the index of the matched value, else `-1`. + */ + +function strictIndexOf$1(array, value, fromIndex) { + var index = fromIndex - 1, + length = array.length; + + while (++index < length) { + if (array[index] === value) { + return index; + } + } + return -1; +} + +var _strictIndexOf = strictIndexOf$1; + +var baseFindIndex$1 = _baseFindIndex, + baseIsNaN = _baseIsNaN, + strictIndexOf = _strictIndexOf; + +/** + * The base implementation of `_.indexOf` without `fromIndex` bounds checks. + * + * @private + * @param {Array} array The array to inspect. + * @param {*} value The value to search for. + * @param {number} fromIndex The index to search from. + * @returns {number} Returns the index of the matched value, else `-1`. + */ +function baseIndexOf$1(array, value, fromIndex) { + return value === value + ? strictIndexOf(array, value, fromIndex) + : baseFindIndex$1(array, baseIsNaN, fromIndex); +} + +var _baseIndexOf = baseIndexOf$1; + +var baseIndexOf = _baseIndexOf; + +/** + * A specialized version of `_.includes` for arrays without support for + * specifying an index to search from. + * + * @private + * @param {Array} [array] The array to inspect. + * @param {*} target The value to search for. + * @returns {boolean} Returns `true` if `target` is found, else `false`. + */ +function arrayIncludes$1(array, value) { + var length = array == null ? 0 : array.length; + return !!length && baseIndexOf(array, value, 0) > -1; +} + +var _arrayIncludes = arrayIncludes$1; + +/** + * This function is like `arrayIncludes` except that it accepts a comparator. + * + * @private + * @param {Array} [array] The array to inspect. + * @param {*} target The value to search for. + * @param {Function} comparator The comparator invoked per element. + * @returns {boolean} Returns `true` if `target` is found, else `false`. + */ + +function arrayIncludesWith$1(array, value, comparator) { + var index = -1, + length = array == null ? 0 : array.length; + + while (++index < length) { + if (comparator(value, array[index])) { + return true; + } + } + return false; +} + +var _arrayIncludesWith = arrayIncludesWith$1; + +/** + * This method returns `undefined`. + * + * @static + * @memberOf _ + * @since 2.3.0 + * @category Util + * @example + * + * _.times(2, _.noop); + * // => [undefined, undefined] + */ + +function noop$1() { + // No operation performed. +} + +var noop_1 = noop$1; + +var Set$1 = _Set, + noop = noop_1, + setToArray$1 = _setToArray; + +/** Used as references for various `Number` constants. */ +var INFINITY$1 = 1 / 0; + +/** + * Creates a set object of `values`. + * + * @private + * @param {Array} values The values to add to the set. + * @returns {Object} Returns the new set. + */ +var createSet$1 = !(Set$1 && (1 / setToArray$1(new Set$1([,-0]))[1]) == INFINITY$1) ? noop : function(values) { + return new Set$1(values); +}; + +var _createSet = createSet$1; + +var SetCache = _SetCache, + arrayIncludes = _arrayIncludes, + arrayIncludesWith = _arrayIncludesWith, + cacheHas = _cacheHas, + createSet = _createSet, + setToArray = _setToArray; + +/** Used as the size to enable large array optimizations. */ +var LARGE_ARRAY_SIZE = 200; + +/** + * The base implementation of `_.uniqBy` without support for iteratee shorthands. + * + * @private + * @param {Array} array The array to inspect. + * @param {Function} [iteratee] The iteratee invoked per element. + * @param {Function} [comparator] The comparator invoked per element. + * @returns {Array} Returns the new duplicate free array. + */ +function baseUniq$1(array, iteratee, comparator) { + var index = -1, + includes = arrayIncludes, + length = array.length, + isCommon = true, + result = [], + seen = result; + + if (comparator) { + isCommon = false; + includes = arrayIncludesWith; + } + else if (length >= LARGE_ARRAY_SIZE) { + var set = iteratee ? null : createSet(array); + if (set) { + return setToArray(set); + } + isCommon = false; + includes = cacheHas; + seen = new SetCache; + } + else { + seen = iteratee ? [] : result; + } + outer: + while (++index < length) { + var value = array[index], + computed = iteratee ? iteratee(value) : value; + + value = (comparator || value !== 0) ? value : 0; + if (isCommon && computed === computed) { + var seenIndex = seen.length; + while (seenIndex--) { + if (seen[seenIndex] === computed) { + continue outer; + } + } + if (iteratee) { + seen.push(computed); + } + result.push(value); + } + else if (!includes(seen, computed, comparator)) { + if (seen !== result) { + seen.push(computed); + } + result.push(value); + } + } + return result; +} + +var _baseUniq = baseUniq$1; + +var isArrayLike$2 = isArrayLike_1, + isObjectLike$4 = isObjectLike_1; + +/** + * This method is like `_.isArrayLike` except that it also checks if `value` + * is an object. + * + * @static + * @memberOf _ + * @since 4.0.0 + * @category Lang + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is an array-like object, + * else `false`. + * @example + * + * _.isArrayLikeObject([1, 2, 3]); + * // => true + * + * _.isArrayLikeObject(document.body.children); + * // => true + * + * _.isArrayLikeObject('abc'); + * // => false + * + * _.isArrayLikeObject(_.noop); + * // => false + */ +function isArrayLikeObject$2(value) { + return isObjectLike$4(value) && isArrayLike$2(value); +} + +var isArrayLikeObject_1 = isArrayLikeObject$2; + +var baseFlatten$2 = _baseFlatten, + baseRest$3 = _baseRest, + baseUniq = _baseUniq, + isArrayLikeObject$1 = isArrayLikeObject_1; + +/** + * Creates an array of unique values, in order, from all given arrays using + * [`SameValueZero`](http://ecma-international.org/ecma-262/7.0/#sec-samevaluezero) + * for equality comparisons. + * + * @static + * @memberOf _ + * @since 0.1.0 + * @category Array + * @param {...Array} [arrays] The arrays to inspect. + * @returns {Array} Returns the new array of combined values. + * @example + * + * _.union([2], [1, 2]); + * // => [2, 1] + */ +var union = baseRest$3(function(arrays) { + return baseUniq(baseFlatten$2(arrays, 1, isArrayLikeObject$1, true)); +}); + +var union_1 = union; + +var arrayMap$1 = _arrayMap; + +/** + * The base implementation of `_.values` and `_.valuesIn` which creates an + * array of `object` property values corresponding to the property names + * of `props`. + * + * @private + * @param {Object} object The object to query. + * @param {Array} props The property names to get values for. + * @returns {Object} Returns the array of property values. + */ +function baseValues$1(object, props) { + return arrayMap$1(props, function(key) { + return object[key]; + }); +} + +var _baseValues = baseValues$1; + +var baseValues = _baseValues, + keys$1 = keys_1; + +/** + * Creates an array of the own enumerable string keyed property values of `object`. + * + * **Note:** Non-object values are coerced to objects. + * + * @static + * @since 0.1.0 + * @memberOf _ + * @category Object + * @param {Object} object The object to query. + * @returns {Array} Returns the array of property values. + * @example + * + * function Foo() { + * this.a = 1; + * this.b = 2; + * } + * + * Foo.prototype.c = 3; + * + * _.values(new Foo); + * // => [1, 2] (iteration order is not guaranteed) + * + * _.values('hi'); + * // => ['h', 'i'] + */ +function values(object) { + return object == null ? [] : baseValues(object, keys$1(object)); +} + +var values_1 = values; + +/* global window */ + +var lodash$1; + +if (typeof commonjsRequire === "function") { + try { + lodash$1 = { + clone: clone_1$1, + constant: constant_1, + each: each, + filter: filter_1, + has: has_1, + isArray: isArray_1, + isEmpty: isEmpty_1, + isFunction: isFunction_1, + isUndefined: isUndefined_1, + keys: keys_1, + map: map_1, + reduce: reduce_1, + size: size_1, + transform: transform_1, + union: union_1, + values: values_1 + }; + } catch (e) { + // continue regardless of error + } +} + +if (!lodash$1) { + lodash$1 = window._; +} + +var lodash_1$1 = lodash$1; + +var _$z = lodash_1$1; + +var graph = Graph$b; + +var DEFAULT_EDGE_NAME = "\x00"; +var GRAPH_NODE = "\x00"; +var EDGE_KEY_DELIM = "\x01"; + +// Implementation notes: +// +// * Node id query functions should return string ids for the nodes +// * Edge id query functions should return an "edgeObj", edge object, that is +// composed of enough information to uniquely identify an edge: {v, w, name}. +// * Internally we use an "edgeId", a stringified form of the edgeObj, to +// reference edges. This is because we need a performant way to look these +// edges up and, object properties, which have string keys, are the closest +// we're going to get to a performant hashtable in JavaScript. + +function Graph$b(opts) { + this._isDirected = _$z.has(opts, "directed") ? opts.directed : true; + this._isMultigraph = _$z.has(opts, "multigraph") ? opts.multigraph : false; + this._isCompound = _$z.has(opts, "compound") ? opts.compound : false; + + // Label for the graph itself + this._label = undefined; + + // Defaults to be set when creating a new node + this._defaultNodeLabelFn = _$z.constant(undefined); + + // Defaults to be set when creating a new edge + this._defaultEdgeLabelFn = _$z.constant(undefined); + + // v -> label + this._nodes = {}; + + if (this._isCompound) { + // v -> parent + this._parent = {}; + + // v -> children + this._children = {}; + this._children[GRAPH_NODE] = {}; + } + + // v -> edgeObj + this._in = {}; + + // u -> v -> Number + this._preds = {}; + + // v -> edgeObj + this._out = {}; + + // v -> w -> Number + this._sucs = {}; + + // e -> edgeObj + this._edgeObjs = {}; + + // e -> label + this._edgeLabels = {}; +} + +/* Number of nodes in the graph. Should only be changed by the implementation. */ +Graph$b.prototype._nodeCount = 0; + +/* Number of edges in the graph. Should only be changed by the implementation. */ +Graph$b.prototype._edgeCount = 0; + + +/* === Graph functions ========= */ + +Graph$b.prototype.isDirected = function() { + return this._isDirected; +}; + +Graph$b.prototype.isMultigraph = function() { + return this._isMultigraph; +}; + +Graph$b.prototype.isCompound = function() { + return this._isCompound; +}; + +Graph$b.prototype.setGraph = function(label) { + this._label = label; + return this; +}; + +Graph$b.prototype.graph = function() { + return this._label; +}; + + +/* === Node functions ========== */ + +Graph$b.prototype.setDefaultNodeLabel = function(newDefault) { + if (!_$z.isFunction(newDefault)) { + newDefault = _$z.constant(newDefault); + } + this._defaultNodeLabelFn = newDefault; + return this; +}; + +Graph$b.prototype.nodeCount = function() { + return this._nodeCount; +}; + +Graph$b.prototype.nodes = function() { + return _$z.keys(this._nodes); +}; + +Graph$b.prototype.sources = function() { + var self = this; + return _$z.filter(this.nodes(), function(v) { + return _$z.isEmpty(self._in[v]); + }); +}; + +Graph$b.prototype.sinks = function() { + var self = this; + return _$z.filter(this.nodes(), function(v) { + return _$z.isEmpty(self._out[v]); + }); +}; + +Graph$b.prototype.setNodes = function(vs, value) { + var args = arguments; + var self = this; + _$z.each(vs, function(v) { + if (args.length > 1) { + self.setNode(v, value); + } else { + self.setNode(v); + } + }); + return this; +}; + +Graph$b.prototype.setNode = function(v, value) { + if (_$z.has(this._nodes, v)) { + if (arguments.length > 1) { + this._nodes[v] = value; + } + return this; + } + + this._nodes[v] = arguments.length > 1 ? value : this._defaultNodeLabelFn(v); + if (this._isCompound) { + this._parent[v] = GRAPH_NODE; + this._children[v] = {}; + this._children[GRAPH_NODE][v] = true; + } + this._in[v] = {}; + this._preds[v] = {}; + this._out[v] = {}; + this._sucs[v] = {}; + ++this._nodeCount; + return this; +}; + +Graph$b.prototype.node = function(v) { + return this._nodes[v]; +}; + +Graph$b.prototype.hasNode = function(v) { + return _$z.has(this._nodes, v); +}; + +Graph$b.prototype.removeNode = function(v) { + var self = this; + if (_$z.has(this._nodes, v)) { + var removeEdge = function(e) { self.removeEdge(self._edgeObjs[e]); }; + delete this._nodes[v]; + if (this._isCompound) { + this._removeFromParentsChildList(v); + delete this._parent[v]; + _$z.each(this.children(v), function(child) { + self.setParent(child); + }); + delete this._children[v]; + } + _$z.each(_$z.keys(this._in[v]), removeEdge); + delete this._in[v]; + delete this._preds[v]; + _$z.each(_$z.keys(this._out[v]), removeEdge); + delete this._out[v]; + delete this._sucs[v]; + --this._nodeCount; + } + return this; +}; + +Graph$b.prototype.setParent = function(v, parent) { + if (!this._isCompound) { + throw new Error("Cannot set parent in a non-compound graph"); + } + + if (_$z.isUndefined(parent)) { + parent = GRAPH_NODE; + } else { + // Coerce parent to string + parent += ""; + for (var ancestor = parent; + !_$z.isUndefined(ancestor); + ancestor = this.parent(ancestor)) { + if (ancestor === v) { + throw new Error("Setting " + parent+ " as parent of " + v + + " would create a cycle"); + } + } + + this.setNode(parent); + } + + this.setNode(v); + this._removeFromParentsChildList(v); + this._parent[v] = parent; + this._children[parent][v] = true; + return this; +}; + +Graph$b.prototype._removeFromParentsChildList = function(v) { + delete this._children[this._parent[v]][v]; +}; + +Graph$b.prototype.parent = function(v) { + if (this._isCompound) { + var parent = this._parent[v]; + if (parent !== GRAPH_NODE) { + return parent; + } + } +}; + +Graph$b.prototype.children = function(v) { + if (_$z.isUndefined(v)) { + v = GRAPH_NODE; + } + + if (this._isCompound) { + var children = this._children[v]; + if (children) { + return _$z.keys(children); + } + } else if (v === GRAPH_NODE) { + return this.nodes(); + } else if (this.hasNode(v)) { + return []; + } +}; + +Graph$b.prototype.predecessors = function(v) { + var predsV = this._preds[v]; + if (predsV) { + return _$z.keys(predsV); + } +}; + +Graph$b.prototype.successors = function(v) { + var sucsV = this._sucs[v]; + if (sucsV) { + return _$z.keys(sucsV); + } +}; + +Graph$b.prototype.neighbors = function(v) { + var preds = this.predecessors(v); + if (preds) { + return _$z.union(preds, this.successors(v)); + } +}; + +Graph$b.prototype.isLeaf = function (v) { + var neighbors; + if (this.isDirected()) { + neighbors = this.successors(v); + } else { + neighbors = this.neighbors(v); + } + return neighbors.length === 0; +}; + +Graph$b.prototype.filterNodes = function(filter) { + var copy = new this.constructor({ + directed: this._isDirected, + multigraph: this._isMultigraph, + compound: this._isCompound + }); + + copy.setGraph(this.graph()); + + var self = this; + _$z.each(this._nodes, function(value, v) { + if (filter(v)) { + copy.setNode(v, value); + } + }); + + _$z.each(this._edgeObjs, function(e) { + if (copy.hasNode(e.v) && copy.hasNode(e.w)) { + copy.setEdge(e, self.edge(e)); + } + }); + + var parents = {}; + function findParent(v) { + var parent = self.parent(v); + if (parent === undefined || copy.hasNode(parent)) { + parents[v] = parent; + return parent; + } else if (parent in parents) { + return parents[parent]; + } else { + return findParent(parent); + } + } + + if (this._isCompound) { + _$z.each(copy.nodes(), function(v) { + copy.setParent(v, findParent(v)); + }); + } + + return copy; +}; + +/* === Edge functions ========== */ + +Graph$b.prototype.setDefaultEdgeLabel = function(newDefault) { + if (!_$z.isFunction(newDefault)) { + newDefault = _$z.constant(newDefault); + } + this._defaultEdgeLabelFn = newDefault; + return this; +}; + +Graph$b.prototype.edgeCount = function() { + return this._edgeCount; +}; + +Graph$b.prototype.edges = function() { + return _$z.values(this._edgeObjs); +}; + +Graph$b.prototype.setPath = function(vs, value) { + var self = this; + var args = arguments; + _$z.reduce(vs, function(v, w) { + if (args.length > 1) { + self.setEdge(v, w, value); + } else { + self.setEdge(v, w); + } + return w; + }); + return this; +}; + +/* + * setEdge(v, w, [value, [name]]) + * setEdge({ v, w, [name] }, [value]) + */ +Graph$b.prototype.setEdge = function() { + var v, w, name, value; + var valueSpecified = false; + var arg0 = arguments[0]; + + if (typeof arg0 === "object" && arg0 !== null && "v" in arg0) { + v = arg0.v; + w = arg0.w; + name = arg0.name; + if (arguments.length === 2) { + value = arguments[1]; + valueSpecified = true; + } + } else { + v = arg0; + w = arguments[1]; + name = arguments[3]; + if (arguments.length > 2) { + value = arguments[2]; + valueSpecified = true; + } + } + + v = "" + v; + w = "" + w; + if (!_$z.isUndefined(name)) { + name = "" + name; + } + + var e = edgeArgsToId(this._isDirected, v, w, name); + if (_$z.has(this._edgeLabels, e)) { + if (valueSpecified) { + this._edgeLabels[e] = value; + } + return this; + } + + if (!_$z.isUndefined(name) && !this._isMultigraph) { + throw new Error("Cannot set a named edge when isMultigraph = false"); + } + + // It didn't exist, so we need to create it. + // First ensure the nodes exist. + this.setNode(v); + this.setNode(w); + + this._edgeLabels[e] = valueSpecified ? value : this._defaultEdgeLabelFn(v, w, name); + + var edgeObj = edgeArgsToObj(this._isDirected, v, w, name); + // Ensure we add undirected edges in a consistent way. + v = edgeObj.v; + w = edgeObj.w; + + Object.freeze(edgeObj); + this._edgeObjs[e] = edgeObj; + incrementOrInitEntry(this._preds[w], v); + incrementOrInitEntry(this._sucs[v], w); + this._in[w][e] = edgeObj; + this._out[v][e] = edgeObj; + this._edgeCount++; + return this; +}; + +Graph$b.prototype.edge = function(v, w, name) { + var e = (arguments.length === 1 + ? edgeObjToId(this._isDirected, arguments[0]) + : edgeArgsToId(this._isDirected, v, w, name)); + return this._edgeLabels[e]; +}; + +Graph$b.prototype.hasEdge = function(v, w, name) { + var e = (arguments.length === 1 + ? edgeObjToId(this._isDirected, arguments[0]) + : edgeArgsToId(this._isDirected, v, w, name)); + return _$z.has(this._edgeLabels, e); +}; + +Graph$b.prototype.removeEdge = function(v, w, name) { + var e = (arguments.length === 1 + ? edgeObjToId(this._isDirected, arguments[0]) + : edgeArgsToId(this._isDirected, v, w, name)); + var edge = this._edgeObjs[e]; + if (edge) { + v = edge.v; + w = edge.w; + delete this._edgeLabels[e]; + delete this._edgeObjs[e]; + decrementOrRemoveEntry(this._preds[w], v); + decrementOrRemoveEntry(this._sucs[v], w); + delete this._in[w][e]; + delete this._out[v][e]; + this._edgeCount--; + } + return this; +}; + +Graph$b.prototype.inEdges = function(v, u) { + var inV = this._in[v]; + if (inV) { + var edges = _$z.values(inV); + if (!u) { + return edges; + } + return _$z.filter(edges, function(edge) { return edge.v === u; }); + } +}; + +Graph$b.prototype.outEdges = function(v, w) { + var outV = this._out[v]; + if (outV) { + var edges = _$z.values(outV); + if (!w) { + return edges; + } + return _$z.filter(edges, function(edge) { return edge.w === w; }); + } +}; + +Graph$b.prototype.nodeEdges = function(v, w) { + var inEdges = this.inEdges(v, w); + if (inEdges) { + return inEdges.concat(this.outEdges(v, w)); + } +}; + +function incrementOrInitEntry(map, k) { + if (map[k]) { + map[k]++; + } else { + map[k] = 1; + } +} + +function decrementOrRemoveEntry(map, k) { + if (!--map[k]) { delete map[k]; } +} + +function edgeArgsToId(isDirected, v_, w_, name) { + var v = "" + v_; + var w = "" + w_; + if (!isDirected && v > w) { + var tmp = v; + v = w; + w = tmp; + } + return v + EDGE_KEY_DELIM + w + EDGE_KEY_DELIM + + (_$z.isUndefined(name) ? DEFAULT_EDGE_NAME : name); +} + +function edgeArgsToObj(isDirected, v_, w_, name) { + var v = "" + v_; + var w = "" + w_; + if (!isDirected && v > w) { + var tmp = v; + v = w; + w = tmp; + } + var edgeObj = { v: v, w: w }; + if (name) { + edgeObj.name = name; + } + return edgeObj; +} + +function edgeObjToId(isDirected, edgeObj) { + return edgeArgsToId(isDirected, edgeObj.v, edgeObj.w, edgeObj.name); +} + +var version$1 = '2.1.8'; + +// Includes only the "core" of graphlib +var lib$2 = { + Graph: graph, + version: version$1 +}; + +var _$y = lodash_1$1; +var Graph$a = graph; + +var json = { + write: write, + read: read +}; + +function write(g) { + var json = { + options: { + directed: g.isDirected(), + multigraph: g.isMultigraph(), + compound: g.isCompound() + }, + nodes: writeNodes(g), + edges: writeEdges(g) + }; + if (!_$y.isUndefined(g.graph())) { + json.value = _$y.clone(g.graph()); + } + return json; +} + +function writeNodes(g) { + return _$y.map(g.nodes(), function(v) { + var nodeValue = g.node(v); + var parent = g.parent(v); + var node = { v: v }; + if (!_$y.isUndefined(nodeValue)) { + node.value = nodeValue; + } + if (!_$y.isUndefined(parent)) { + node.parent = parent; + } + return node; + }); +} + +function writeEdges(g) { + return _$y.map(g.edges(), function(e) { + var edgeValue = g.edge(e); + var edge = { v: e.v, w: e.w }; + if (!_$y.isUndefined(e.name)) { + edge.name = e.name; + } + if (!_$y.isUndefined(edgeValue)) { + edge.value = edgeValue; + } + return edge; + }); +} + +function read(json) { + var g = new Graph$a(json.options).setGraph(json.value); + _$y.each(json.nodes, function(entry) { + g.setNode(entry.v, entry.value); + if (entry.parent) { + g.setParent(entry.v, entry.parent); + } + }); + _$y.each(json.edges, function(entry) { + g.setEdge({ v: entry.v, w: entry.w, name: entry.name }, entry.value); + }); + return g; +} + +var _$x = lodash_1$1; + +var components_1 = components; + +function components(g) { + var visited = {}; + var cmpts = []; + var cmpt; + + function dfs(v) { + if (_$x.has(visited, v)) return; + visited[v] = true; + cmpt.push(v); + _$x.each(g.successors(v), dfs); + _$x.each(g.predecessors(v), dfs); + } + + _$x.each(g.nodes(), function(v) { + cmpt = []; + dfs(v); + if (cmpt.length) { + cmpts.push(cmpt); + } + }); + + return cmpts; +} + +var _$w = lodash_1$1; + +var priorityQueue = PriorityQueue$2; + +/** + * A min-priority queue data structure. This algorithm is derived from Cormen, + * et al., "Introduction to Algorithms". The basic idea of a min-priority + * queue is that you can efficiently (in O(1) time) get the smallest key in + * the queue. Adding and removing elements takes O(log n) time. A key can + * have its priority decreased in O(log n) time. + */ +function PriorityQueue$2() { + this._arr = []; + this._keyIndices = {}; +} + +/** + * Returns the number of elements in the queue. Takes `O(1)` time. + */ +PriorityQueue$2.prototype.size = function() { + return this._arr.length; +}; + +/** + * Returns the keys that are in the queue. Takes `O(n)` time. + */ +PriorityQueue$2.prototype.keys = function() { + return this._arr.map(function(x) { return x.key; }); +}; + +/** + * Returns `true` if **key** is in the queue and `false` if not. + */ +PriorityQueue$2.prototype.has = function(key) { + return _$w.has(this._keyIndices, key); +}; + +/** + * Returns the priority for **key**. If **key** is not present in the queue + * then this function returns `undefined`. Takes `O(1)` time. + * + * @param {Object} key + */ +PriorityQueue$2.prototype.priority = function(key) { + var index = this._keyIndices[key]; + if (index !== undefined) { + return this._arr[index].priority; + } +}; + +/** + * Returns the key for the minimum element in this queue. If the queue is + * empty this function throws an Error. Takes `O(1)` time. + */ +PriorityQueue$2.prototype.min = function() { + if (this.size() === 0) { + throw new Error("Queue underflow"); + } + return this._arr[0].key; +}; + +/** + * Inserts a new key into the priority queue. If the key already exists in + * the queue this function returns `false`; otherwise it will return `true`. + * Takes `O(n)` time. + * + * @param {Object} key the key to add + * @param {Number} priority the initial priority for the key + */ +PriorityQueue$2.prototype.add = function(key, priority) { + var keyIndices = this._keyIndices; + key = String(key); + if (!_$w.has(keyIndices, key)) { + var arr = this._arr; + var index = arr.length; + keyIndices[key] = index; + arr.push({key: key, priority: priority}); + this._decrease(index); + return true; + } + return false; +}; + +/** + * Removes and returns the smallest key in the queue. Takes `O(log n)` time. + */ +PriorityQueue$2.prototype.removeMin = function() { + this._swap(0, this._arr.length - 1); + var min = this._arr.pop(); + delete this._keyIndices[min.key]; + this._heapify(0); + return min.key; +}; + +/** + * Decreases the priority for **key** to **priority**. If the new priority is + * greater than the previous priority, this function will throw an Error. + * + * @param {Object} key the key for which to raise priority + * @param {Number} priority the new priority for the key + */ +PriorityQueue$2.prototype.decrease = function(key, priority) { + var index = this._keyIndices[key]; + if (priority > this._arr[index].priority) { + throw new Error("New priority is greater than current priority. " + + "Key: " + key + " Old: " + this._arr[index].priority + " New: " + priority); + } + this._arr[index].priority = priority; + this._decrease(index); +}; + +PriorityQueue$2.prototype._heapify = function(i) { + var arr = this._arr; + var l = 2 * i; + var r = l + 1; + var largest = i; + if (l < arr.length) { + largest = arr[l].priority < arr[largest].priority ? l : largest; + if (r < arr.length) { + largest = arr[r].priority < arr[largest].priority ? r : largest; + } + if (largest !== i) { + this._swap(i, largest); + this._heapify(largest); + } + } +}; + +PriorityQueue$2.prototype._decrease = function(index) { + var arr = this._arr; + var priority = arr[index].priority; + var parent; + while (index !== 0) { + parent = index >> 1; + if (arr[parent].priority < priority) { + break; + } + this._swap(index, parent); + index = parent; + } +}; + +PriorityQueue$2.prototype._swap = function(i, j) { + var arr = this._arr; + var keyIndices = this._keyIndices; + var origArrI = arr[i]; + var origArrJ = arr[j]; + arr[i] = origArrJ; + arr[j] = origArrI; + keyIndices[origArrJ.key] = i; + keyIndices[origArrI.key] = j; +}; + +var _$v = lodash_1$1; +var PriorityQueue$1 = priorityQueue; + +var dijkstra_1 = dijkstra$1; + +var DEFAULT_WEIGHT_FUNC$1 = _$v.constant(1); + +function dijkstra$1(g, source, weightFn, edgeFn) { + return runDijkstra(g, String(source), + weightFn || DEFAULT_WEIGHT_FUNC$1, + edgeFn || function(v) { return g.outEdges(v); }); +} + +function runDijkstra(g, source, weightFn, edgeFn) { + var results = {}; + var pq = new PriorityQueue$1(); + var v, vEntry; + + var updateNeighbors = function(edge) { + var w = edge.v !== v ? edge.v : edge.w; + var wEntry = results[w]; + var weight = weightFn(edge); + var distance = vEntry.distance + weight; + + if (weight < 0) { + throw new Error("dijkstra does not allow negative edge weights. " + + "Bad edge: " + edge + " Weight: " + weight); + } + + if (distance < wEntry.distance) { + wEntry.distance = distance; + wEntry.predecessor = v; + pq.decrease(w, distance); + } + }; + + g.nodes().forEach(function(v) { + var distance = v === source ? 0 : Number.POSITIVE_INFINITY; + results[v] = { distance: distance }; + pq.add(v, distance); + }); + + while (pq.size() > 0) { + v = pq.removeMin(); + vEntry = results[v]; + if (vEntry.distance === Number.POSITIVE_INFINITY) { + break; + } + + edgeFn(v).forEach(updateNeighbors); + } + + return results; +} + +var dijkstra = dijkstra_1; +var _$u = lodash_1$1; + +var dijkstraAll_1 = dijkstraAll; + +function dijkstraAll(g, weightFunc, edgeFunc) { + return _$u.transform(g.nodes(), function(acc, v) { + acc[v] = dijkstra(g, v, weightFunc, edgeFunc); + }, {}); +} + +var _$t = lodash_1$1; + +var tarjan_1 = tarjan$1; + +function tarjan$1(g) { + var index = 0; + var stack = []; + var visited = {}; // node id -> { onStack, lowlink, index } + var results = []; + + function dfs(v) { + var entry = visited[v] = { + onStack: true, + lowlink: index, + index: index++ + }; + stack.push(v); + + g.successors(v).forEach(function(w) { + if (!_$t.has(visited, w)) { + dfs(w); + entry.lowlink = Math.min(entry.lowlink, visited[w].lowlink); + } else if (visited[w].onStack) { + entry.lowlink = Math.min(entry.lowlink, visited[w].index); + } + }); + + if (entry.lowlink === entry.index) { + var cmpt = []; + var w; + do { + w = stack.pop(); + visited[w].onStack = false; + cmpt.push(w); + } while (v !== w); + results.push(cmpt); + } + } + + g.nodes().forEach(function(v) { + if (!_$t.has(visited, v)) { + dfs(v); + } + }); + + return results; +} + +var _$s = lodash_1$1; +var tarjan = tarjan_1; + +var findCycles_1 = findCycles; + +function findCycles(g) { + return _$s.filter(tarjan(g), function(cmpt) { + return cmpt.length > 1 || (cmpt.length === 1 && g.hasEdge(cmpt[0], cmpt[0])); + }); +} + +var _$r = lodash_1$1; + +var floydWarshall_1 = floydWarshall; + +var DEFAULT_WEIGHT_FUNC = _$r.constant(1); + +function floydWarshall(g, weightFn, edgeFn) { + return runFloydWarshall(g, + weightFn || DEFAULT_WEIGHT_FUNC, + edgeFn || function(v) { return g.outEdges(v); }); +} + +function runFloydWarshall(g, weightFn, edgeFn) { + var results = {}; + var nodes = g.nodes(); + + nodes.forEach(function(v) { + results[v] = {}; + results[v][v] = { distance: 0 }; + nodes.forEach(function(w) { + if (v !== w) { + results[v][w] = { distance: Number.POSITIVE_INFINITY }; + } + }); + edgeFn(v).forEach(function(edge) { + var w = edge.v === v ? edge.w : edge.v; + var d = weightFn(edge); + results[v][w] = { distance: d, predecessor: v }; + }); + }); + + nodes.forEach(function(k) { + var rowK = results[k]; + nodes.forEach(function(i) { + var rowI = results[i]; + nodes.forEach(function(j) { + var ik = rowI[k]; + var kj = rowK[j]; + var ij = rowI[j]; + var altDistance = ik.distance + kj.distance; + if (altDistance < ij.distance) { + ij.distance = altDistance; + ij.predecessor = kj.predecessor; + } + }); + }); + }); + + return results; +} + +var _$q = lodash_1$1; + +var topsort_1 = topsort$1; +topsort$1.CycleException = CycleException; + +function topsort$1(g) { + var visited = {}; + var stack = {}; + var results = []; + + function visit(node) { + if (_$q.has(stack, node)) { + throw new CycleException(); + } + + if (!_$q.has(visited, node)) { + stack[node] = true; + visited[node] = true; + _$q.each(g.predecessors(node), visit); + delete stack[node]; + results.push(node); + } + } + + _$q.each(g.sinks(), visit); + + if (_$q.size(visited) !== g.nodeCount()) { + throw new CycleException(); + } + + return results; +} + +function CycleException() {} +CycleException.prototype = new Error(); // must be an instance of Error to pass testing + +var topsort = topsort_1; + +var isAcyclic_1 = isAcyclic; + +function isAcyclic(g) { + try { + topsort(g); + } catch (e) { + if (e instanceof topsort.CycleException) { + return false; + } + throw e; + } + return true; +} + +var _$p = lodash_1$1; + +var dfs_1 = dfs$3; + +/* + * A helper that preforms a pre- or post-order traversal on the input graph + * and returns the nodes in the order they were visited. If the graph is + * undirected then this algorithm will navigate using neighbors. If the graph + * is directed then this algorithm will navigate using successors. + * + * Order must be one of "pre" or "post". + */ +function dfs$3(g, vs, order) { + if (!_$p.isArray(vs)) { + vs = [vs]; + } + + var navigation = (g.isDirected() ? g.successors : g.neighbors).bind(g); + + var acc = []; + var visited = {}; + _$p.each(vs, function(v) { + if (!g.hasNode(v)) { + throw new Error("Graph does not have node: " + v); + } + + doDfs(g, v, order === "post", visited, navigation, acc); + }); + return acc; +} + +function doDfs(g, v, postorder, visited, navigation, acc) { + if (!_$p.has(visited, v)) { + visited[v] = true; + + if (!postorder) { acc.push(v); } + _$p.each(navigation(v), function(w) { + doDfs(g, w, postorder, visited, navigation, acc); + }); + if (postorder) { acc.push(v); } + } +} + +var dfs$2 = dfs_1; + +var postorder_1 = postorder$2; + +function postorder$2(g, vs) { + return dfs$2(g, vs, "post"); +} + +var dfs$1 = dfs_1; + +var preorder_1 = preorder$1; + +function preorder$1(g, vs) { + return dfs$1(g, vs, "pre"); +} + +var _$o = lodash_1$1; +var Graph$9 = graph; +var PriorityQueue = priorityQueue; + +var prim_1 = prim; + +function prim(g, weightFunc) { + var result = new Graph$9(); + var parents = {}; + var pq = new PriorityQueue(); + var v; + + function updateNeighbors(edge) { + var w = edge.v === v ? edge.w : edge.v; + var pri = pq.priority(w); + if (pri !== undefined) { + var edgeWeight = weightFunc(edge); + if (edgeWeight < pri) { + parents[w] = v; + pq.decrease(w, edgeWeight); + } + } + } + + if (g.nodeCount() === 0) { + return result; + } + + _$o.each(g.nodes(), function(v) { + pq.add(v, Number.POSITIVE_INFINITY); + result.setNode(v); + }); + + // Start from an arbitrary node + pq.decrease(g.nodes()[0], 0); + + var init = false; + while (pq.size() > 0) { + v = pq.removeMin(); + if (_$o.has(parents, v)) { + result.setEdge(v, parents[v]); + } else if (init) { + throw new Error("Input graph is not connected: " + g); + } else { + init = true; + } + + g.nodeEdges(v).forEach(updateNeighbors); + } + + return result; +} + +var alg = { + components: components_1, + dijkstra: dijkstra_1, + dijkstraAll: dijkstraAll_1, + findCycles: findCycles_1, + floydWarshall: floydWarshall_1, + isAcyclic: isAcyclic_1, + postorder: postorder_1, + preorder: preorder_1, + prim: prim_1, + tarjan: tarjan_1, + topsort: topsort_1 +}; + +/** + * Copyright (c) 2014, Chris Pettitt + * All rights reserved. + * + * Redistribution and use in source and binary forms, with or without + * modification, are permitted provided that the following conditions are met: + * + * 1. Redistributions of source code must retain the above copyright notice, this + * list of conditions and the following disclaimer. + * + * 2. Redistributions in binary form must reproduce the above copyright notice, + * this list of conditions and the following disclaimer in the documentation + * and/or other materials provided with the distribution. + * + * 3. Neither the name of the copyright holder nor the names of its contributors + * may be used to endorse or promote products derived from this software without + * specific prior written permission. + * + * THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND + * ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED + * WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE + * DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE + * FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL + * DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR + * SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER + * CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, + * OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE + * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. + */ + +var lib$1 = lib$2; + +var graphlib$1 = { + Graph: lib$1.Graph, + json: json, + alg: alg, + version: lib$1.version +}; + +/* global window */ + +var graphlib; + +if (typeof commonjsRequire === "function") { + try { + graphlib = graphlib$1; + } catch (e) { + // continue regardless of error + } +} + +if (!graphlib) { + graphlib = window.graphlib; +} + +var graphlib_1 = graphlib; + +var baseClone = _baseClone; + +/** Used to compose bitmasks for cloning. */ +var CLONE_DEEP_FLAG = 1, + CLONE_SYMBOLS_FLAG = 4; + +/** + * This method is like `_.clone` except that it recursively clones `value`. + * + * @static + * @memberOf _ + * @since 1.0.0 + * @category Lang + * @param {*} value The value to recursively clone. + * @returns {*} Returns the deep cloned value. + * @see _.clone + * @example + * + * var objects = [{ 'a': 1 }, { 'b': 2 }]; + * + * var deep = _.cloneDeep(objects); + * console.log(deep[0] === objects[0]); + * // => false + */ +function cloneDeep(value) { + return baseClone(value, CLONE_DEEP_FLAG | CLONE_SYMBOLS_FLAG); +} + +var cloneDeep_1 = cloneDeep; + +var eq$2 = eq_1, + isArrayLike$1 = isArrayLike_1, + isIndex$1 = _isIndex, + isObject$5 = isObject_1; + +/** + * Checks if the given arguments are from an iteratee call. + * + * @private + * @param {*} value The potential iteratee value argument. + * @param {*} index The potential iteratee index or key argument. + * @param {*} object The potential iteratee object argument. + * @returns {boolean} Returns `true` if the arguments are from an iteratee call, + * else `false`. + */ +function isIterateeCall$4(value, index, object) { + if (!isObject$5(object)) { + return false; + } + var type = typeof index; + if (type == 'number' + ? (isArrayLike$1(object) && isIndex$1(index, object.length)) + : (type == 'string' && index in object) + ) { + return eq$2(object[index], value); + } + return false; +} + +var _isIterateeCall = isIterateeCall$4; + +var baseRest$2 = _baseRest, + eq$1 = eq_1, + isIterateeCall$3 = _isIterateeCall, + keysIn$3 = keysIn_1; + +/** Used for built-in method references. */ +var objectProto$4 = Object.prototype; + +/** Used to check objects for own properties. */ +var hasOwnProperty$1 = objectProto$4.hasOwnProperty; + +/** + * Assigns own and inherited enumerable string keyed properties of source + * objects to the destination object for all destination properties that + * resolve to `undefined`. Source objects are applied from left to right. + * Once a property is set, additional values of the same property are ignored. + * + * **Note:** This method mutates `object`. + * + * @static + * @since 0.1.0 + * @memberOf _ + * @category Object + * @param {Object} object The destination object. + * @param {...Object} [sources] The source objects. + * @returns {Object} Returns `object`. + * @see _.defaultsDeep + * @example + * + * _.defaults({ 'a': 1 }, { 'b': 2 }, { 'a': 3 }); + * // => { 'a': 1, 'b': 2 } + */ +var defaults = baseRest$2(function(object, sources) { + object = Object(object); + + var index = -1; + var length = sources.length; + var guard = length > 2 ? sources[2] : undefined; + + if (guard && isIterateeCall$3(sources[0], sources[1], guard)) { + length = 1; + } + + while (++index < length) { + var source = sources[index]; + var props = keysIn$3(source); + var propsIndex = -1; + var propsLength = props.length; + + while (++propsIndex < propsLength) { + var key = props[propsIndex]; + var value = object[key]; + + if (value === undefined || + (eq$1(value, objectProto$4[key]) && !hasOwnProperty$1.call(object, key))) { + object[key] = source[key]; + } + } + } + + return object; +}); + +var defaults_1 = defaults; + +var baseIteratee$4 = _baseIteratee, + isArrayLike = isArrayLike_1, + keys = keys_1; + +/** + * Creates a `_.find` or `_.findLast` function. + * + * @private + * @param {Function} findIndexFunc The function to find the collection index. + * @returns {Function} Returns the new find function. + */ +function createFind$1(findIndexFunc) { + return function(collection, predicate, fromIndex) { + var iterable = Object(collection); + if (!isArrayLike(collection)) { + var iteratee = baseIteratee$4(predicate); + collection = keys(collection); + predicate = function(key) { return iteratee(iterable[key], key, iterable); }; + } + var index = findIndexFunc(collection, predicate, fromIndex); + return index > -1 ? iterable[iteratee ? collection[index] : index] : undefined; + }; +} + +var _createFind = createFind$1; + +/** Used to match a single whitespace character. */ + +var reWhitespace = /\s/; + +/** + * Used by `_.trim` and `_.trimEnd` to get the index of the last non-whitespace + * character of `string`. + * + * @private + * @param {string} string The string to inspect. + * @returns {number} Returns the index of the last non-whitespace character. + */ +function trimmedEndIndex$1(string) { + var index = string.length; + + while (index-- && reWhitespace.test(string.charAt(index))) {} + return index; +} + +var _trimmedEndIndex = trimmedEndIndex$1; + +var trimmedEndIndex = _trimmedEndIndex; + +/** Used to match leading whitespace. */ +var reTrimStart = /^\s+/; + +/** + * The base implementation of `_.trim`. + * + * @private + * @param {string} string The string to trim. + * @returns {string} Returns the trimmed string. + */ +function baseTrim$1(string) { + return string + ? string.slice(0, trimmedEndIndex(string) + 1).replace(reTrimStart, '') + : string; +} + +var _baseTrim = baseTrim$1; + +var baseTrim = _baseTrim, + isObject$4 = isObject_1, + isSymbol$2 = isSymbol_1; + +/** Used as references for various `Number` constants. */ +var NAN = 0 / 0; + +/** Used to detect bad signed hexadecimal string values. */ +var reIsBadHex = /^[-+]0x[0-9a-f]+$/i; + +/** Used to detect binary string values. */ +var reIsBinary = /^0b[01]+$/i; + +/** Used to detect octal string values. */ +var reIsOctal = /^0o[0-7]+$/i; + +/** Built-in method references without a dependency on `root`. */ +var freeParseInt = parseInt; + +/** + * Converts `value` to a number. + * + * @static + * @memberOf _ + * @since 4.0.0 + * @category Lang + * @param {*} value The value to process. + * @returns {number} Returns the number. + * @example + * + * _.toNumber(3.2); + * // => 3.2 + * + * _.toNumber(Number.MIN_VALUE); + * // => 5e-324 + * + * _.toNumber(Infinity); + * // => Infinity + * + * _.toNumber('3.2'); + * // => 3.2 + */ +function toNumber$1(value) { + if (typeof value == 'number') { + return value; + } + if (isSymbol$2(value)) { + return NAN; + } + if (isObject$4(value)) { + var other = typeof value.valueOf == 'function' ? value.valueOf() : value; + value = isObject$4(other) ? (other + '') : other; + } + if (typeof value != 'string') { + return value === 0 ? value : +value; + } + value = baseTrim(value); + var isBinary = reIsBinary.test(value); + return (isBinary || reIsOctal.test(value)) + ? freeParseInt(value.slice(2), isBinary ? 2 : 8) + : (reIsBadHex.test(value) ? NAN : +value); +} + +var toNumber_1 = toNumber$1; + +var toNumber = toNumber_1; + +/** Used as references for various `Number` constants. */ +var INFINITY = 1 / 0, + MAX_INTEGER = 1.7976931348623157e+308; + +/** + * Converts `value` to a finite number. + * + * @static + * @memberOf _ + * @since 4.12.0 + * @category Lang + * @param {*} value The value to convert. + * @returns {number} Returns the converted number. + * @example + * + * _.toFinite(3.2); + * // => 3.2 + * + * _.toFinite(Number.MIN_VALUE); + * // => 5e-324 + * + * _.toFinite(Infinity); + * // => 1.7976931348623157e+308 + * + * _.toFinite('3.2'); + * // => 3.2 + */ +function toFinite$2(value) { + if (!value) { + return value === 0 ? value : 0; + } + value = toNumber(value); + if (value === INFINITY || value === -INFINITY) { + var sign = (value < 0 ? -1 : 1); + return sign * MAX_INTEGER; + } + return value === value ? value : 0; +} + +var toFinite_1 = toFinite$2; + +var toFinite$1 = toFinite_1; + +/** + * Converts `value` to an integer. + * + * **Note:** This method is loosely based on + * [`ToInteger`](http://www.ecma-international.org/ecma-262/7.0/#sec-tointeger). + * + * @static + * @memberOf _ + * @since 4.0.0 + * @category Lang + * @param {*} value The value to convert. + * @returns {number} Returns the converted integer. + * @example + * + * _.toInteger(3.2); + * // => 3 + * + * _.toInteger(Number.MIN_VALUE); + * // => 0 + * + * _.toInteger(Infinity); + * // => 1.7976931348623157e+308 + * + * _.toInteger('3.2'); + * // => 3 + */ +function toInteger$1(value) { + var result = toFinite$1(value), + remainder = result % 1; + + return result === result ? (remainder ? result - remainder : result) : 0; +} + +var toInteger_1 = toInteger$1; + +var baseFindIndex = _baseFindIndex, + baseIteratee$3 = _baseIteratee, + toInteger = toInteger_1; + +/* Built-in method references for those with the same name as other `lodash` methods. */ +var nativeMax$1 = Math.max; + +/** + * This method is like `_.find` except that it returns the index of the first + * element `predicate` returns truthy for instead of the element itself. + * + * @static + * @memberOf _ + * @since 1.1.0 + * @category Array + * @param {Array} array The array to inspect. + * @param {Function} [predicate=_.identity] The function invoked per iteration. + * @param {number} [fromIndex=0] The index to search from. + * @returns {number} Returns the index of the found element, else `-1`. + * @example + * + * var users = [ + * { 'user': 'barney', 'active': false }, + * { 'user': 'fred', 'active': false }, + * { 'user': 'pebbles', 'active': true } + * ]; + * + * _.findIndex(users, function(o) { return o.user == 'barney'; }); + * // => 0 + * + * // The `_.matches` iteratee shorthand. + * _.findIndex(users, { 'user': 'fred', 'active': false }); + * // => 1 + * + * // The `_.matchesProperty` iteratee shorthand. + * _.findIndex(users, ['active', false]); + * // => 0 + * + * // The `_.property` iteratee shorthand. + * _.findIndex(users, 'active'); + * // => 2 + */ +function findIndex$1(array, predicate, fromIndex) { + var length = array == null ? 0 : array.length; + if (!length) { + return -1; + } + var index = fromIndex == null ? 0 : toInteger(fromIndex); + if (index < 0) { + index = nativeMax$1(length + index, 0); + } + return baseFindIndex(array, baseIteratee$3(predicate), index); +} + +var findIndex_1 = findIndex$1; + +var createFind = _createFind, + findIndex = findIndex_1; + +/** + * Iterates over elements of `collection`, returning the first element + * `predicate` returns truthy for. The predicate is invoked with three + * arguments: (value, index|key, collection). + * + * @static + * @memberOf _ + * @since 0.1.0 + * @category Collection + * @param {Array|Object} collection The collection to inspect. + * @param {Function} [predicate=_.identity] The function invoked per iteration. + * @param {number} [fromIndex=0] The index to search from. + * @returns {*} Returns the matched element, else `undefined`. + * @example + * + * var users = [ + * { 'user': 'barney', 'age': 36, 'active': true }, + * { 'user': 'fred', 'age': 40, 'active': false }, + * { 'user': 'pebbles', 'age': 1, 'active': true } + * ]; + * + * _.find(users, function(o) { return o.age < 40; }); + * // => object for 'barney' + * + * // The `_.matches` iteratee shorthand. + * _.find(users, { 'age': 1, 'active': true }); + * // => object for 'pebbles' + * + * // The `_.matchesProperty` iteratee shorthand. + * _.find(users, ['active', false]); + * // => object for 'fred' + * + * // The `_.property` iteratee shorthand. + * _.find(users, 'active'); + * // => object for 'barney' + */ +var find = createFind(findIndex); + +var find_1 = find; + +var baseFlatten$1 = _baseFlatten; + +/** + * Flattens `array` a single level deep. + * + * @static + * @memberOf _ + * @since 0.1.0 + * @category Array + * @param {Array} array The array to flatten. + * @returns {Array} Returns the new flattened array. + * @example + * + * _.flatten([1, [2, [3, [4]], 5]]); + * // => [1, 2, [3, [4]], 5] + */ +function flatten$1(array) { + var length = array == null ? 0 : array.length; + return length ? baseFlatten$1(array, 1) : []; +} + +var flatten_1 = flatten$1; + +var baseFor$1 = _baseFor, + castFunction = _castFunction, + keysIn$2 = keysIn_1; + +/** + * Iterates over own and inherited enumerable string keyed properties of an + * object and invokes `iteratee` for each property. The iteratee is invoked + * with three arguments: (value, key, object). Iteratee functions may exit + * iteration early by explicitly returning `false`. + * + * @static + * @memberOf _ + * @since 0.3.0 + * @category Object + * @param {Object} object The object to iterate over. + * @param {Function} [iteratee=_.identity] The function invoked per iteration. + * @returns {Object} Returns `object`. + * @see _.forInRight + * @example + * + * function Foo() { + * this.a = 1; + * this.b = 2; + * } + * + * Foo.prototype.c = 3; + * + * _.forIn(new Foo, function(value, key) { + * console.log(key); + * }); + * // => Logs 'a', 'b', then 'c' (iteration order is not guaranteed). + */ +function forIn(object, iteratee) { + return object == null + ? object + : baseFor$1(object, castFunction(iteratee), keysIn$2); +} + +var forIn_1 = forIn; + +/** + * Gets the last element of `array`. + * + * @static + * @memberOf _ + * @since 0.1.0 + * @category Array + * @param {Array} array The array to query. + * @returns {*} Returns the last element of `array`. + * @example + * + * _.last([1, 2, 3]); + * // => 3 + */ + +function last(array) { + var length = array == null ? 0 : array.length; + return length ? array[length - 1] : undefined; +} + +var last_1 = last; + +var baseAssignValue$1 = _baseAssignValue, + baseForOwn = _baseForOwn, + baseIteratee$2 = _baseIteratee; + +/** + * Creates an object with the same keys as `object` and values generated + * by running each own enumerable string keyed property of `object` thru + * `iteratee`. The iteratee is invoked with three arguments: + * (value, key, object). + * + * @static + * @memberOf _ + * @since 2.4.0 + * @category Object + * @param {Object} object The object to iterate over. + * @param {Function} [iteratee=_.identity] The function invoked per iteration. + * @returns {Object} Returns the new mapped object. + * @see _.mapKeys + * @example + * + * var users = { + * 'fred': { 'user': 'fred', 'age': 40 }, + * 'pebbles': { 'user': 'pebbles', 'age': 1 } + * }; + * + * _.mapValues(users, function(o) { return o.age; }); + * // => { 'fred': 40, 'pebbles': 1 } (iteration order is not guaranteed) + * + * // The `_.property` iteratee shorthand. + * _.mapValues(users, 'age'); + * // => { 'fred': 40, 'pebbles': 1 } (iteration order is not guaranteed) + */ +function mapValues(object, iteratee) { + var result = {}; + iteratee = baseIteratee$2(iteratee); + + baseForOwn(object, function(value, key, object) { + baseAssignValue$1(result, key, iteratee(value, key, object)); + }); + return result; +} + +var mapValues_1 = mapValues; + +var isSymbol$1 = isSymbol_1; + +/** + * The base implementation of methods like `_.max` and `_.min` which accepts a + * `comparator` to determine the extremum value. + * + * @private + * @param {Array} array The array to iterate over. + * @param {Function} iteratee The iteratee invoked per iteration. + * @param {Function} comparator The comparator used to compare values. + * @returns {*} Returns the extremum value. + */ +function baseExtremum$3(array, iteratee, comparator) { + var index = -1, + length = array.length; + + while (++index < length) { + var value = array[index], + current = iteratee(value); + + if (current != null && (computed === undefined + ? (current === current && !isSymbol$1(current)) + : comparator(current, computed) + )) { + var computed = current, + result = value; + } + } + return result; +} + +var _baseExtremum = baseExtremum$3; + +/** + * The base implementation of `_.gt` which doesn't coerce arguments. + * + * @private + * @param {*} value The value to compare. + * @param {*} other The other value to compare. + * @returns {boolean} Returns `true` if `value` is greater than `other`, + * else `false`. + */ + +function baseGt$1(value, other) { + return value > other; +} + +var _baseGt = baseGt$1; + +var baseExtremum$2 = _baseExtremum, + baseGt = _baseGt, + identity$2 = identity_1; + +/** + * Computes the maximum value of `array`. If `array` is empty or falsey, + * `undefined` is returned. + * + * @static + * @since 0.1.0 + * @memberOf _ + * @category Math + * @param {Array} array The array to iterate over. + * @returns {*} Returns the maximum value. + * @example + * + * _.max([4, 2, 8, 6]); + * // => 8 + * + * _.max([]); + * // => undefined + */ +function max$4(array) { + return (array && array.length) + ? baseExtremum$2(array, identity$2, baseGt) + : undefined; +} + +var max_1$1 = max$4; + +var baseAssignValue = _baseAssignValue, + eq = eq_1; + +/** + * This function is like `assignValue` except that it doesn't assign + * `undefined` values. + * + * @private + * @param {Object} object The object to modify. + * @param {string} key The key of the property to assign. + * @param {*} value The value to assign. + */ +function assignMergeValue$2(object, key, value) { + if ((value !== undefined && !eq(object[key], value)) || + (value === undefined && !(key in object))) { + baseAssignValue(object, key, value); + } +} + +var _assignMergeValue = assignMergeValue$2; + +var baseGetTag = _baseGetTag, + getPrototype = _getPrototype, + isObjectLike$3 = isObjectLike_1; + +/** `Object#toString` result references. */ +var objectTag$3 = '[object Object]'; + +/** Used for built-in method references. */ +var funcProto = Function.prototype, + objectProto$3 = Object.prototype; + +/** Used to resolve the decompiled source of functions. */ +var funcToString = funcProto.toString; + +/** Used to check objects for own properties. */ +var hasOwnProperty = objectProto$3.hasOwnProperty; + +/** Used to infer the `Object` constructor. */ +var objectCtorString = funcToString.call(Object); + +/** + * Checks if `value` is a plain object, that is, an object created by the + * `Object` constructor or one with a `[[Prototype]]` of `null`. + * + * @static + * @memberOf _ + * @since 0.8.0 + * @category Lang + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is a plain object, else `false`. + * @example + * + * function Foo() { + * this.a = 1; + * } + * + * _.isPlainObject(new Foo); + * // => false + * + * _.isPlainObject([1, 2, 3]); + * // => false + * + * _.isPlainObject({ 'x': 0, 'y': 0 }); + * // => true + * + * _.isPlainObject(Object.create(null)); + * // => true + */ +function isPlainObject$1(value) { + if (!isObjectLike$3(value) || baseGetTag(value) != objectTag$3) { + return false; + } + var proto = getPrototype(value); + if (proto === null) { + return true; + } + var Ctor = hasOwnProperty.call(proto, 'constructor') && proto.constructor; + return typeof Ctor == 'function' && Ctor instanceof Ctor && + funcToString.call(Ctor) == objectCtorString; +} + +var isPlainObject_1 = isPlainObject$1; + +/** + * Gets the value at `key`, unless `key` is "__proto__" or "constructor". + * + * @private + * @param {Object} object The object to query. + * @param {string} key The key of the property to get. + * @returns {*} Returns the property value. + */ + +function safeGet$2(object, key) { + if (key === 'constructor' && typeof object[key] === 'function') { + return; + } + + if (key == '__proto__') { + return; + } + + return object[key]; +} + +var _safeGet = safeGet$2; + +var copyObject = _copyObject, + keysIn$1 = keysIn_1; + +/** + * Converts `value` to a plain object flattening inherited enumerable string + * keyed properties of `value` to own properties of the plain object. + * + * @static + * @memberOf _ + * @since 3.0.0 + * @category Lang + * @param {*} value The value to convert. + * @returns {Object} Returns the converted plain object. + * @example + * + * function Foo() { + * this.b = 2; + * } + * + * Foo.prototype.c = 3; + * + * _.assign({ 'a': 1 }, new Foo); + * // => { 'a': 1, 'b': 2 } + * + * _.assign({ 'a': 1 }, _.toPlainObject(new Foo)); + * // => { 'a': 1, 'b': 2, 'c': 3 } + */ +function toPlainObject$1(value) { + return copyObject(value, keysIn$1(value)); +} + +var toPlainObject_1 = toPlainObject$1; + +var assignMergeValue$1 = _assignMergeValue, + cloneBuffer = _cloneBuffer.exports, + cloneTypedArray = _cloneTypedArray, + copyArray = _copyArray, + initCloneObject = _initCloneObject, + isArguments = isArguments_1, + isArray$2 = isArray_1, + isArrayLikeObject = isArrayLikeObject_1, + isBuffer = isBuffer$6.exports, + isFunction = isFunction_1, + isObject$3 = isObject_1, + isPlainObject = isPlainObject_1, + isTypedArray$3 = isTypedArray_1, + safeGet$1 = _safeGet, + toPlainObject = toPlainObject_1; + +/** + * A specialized version of `baseMerge` for arrays and objects which performs + * deep merges and tracks traversed objects enabling objects with circular + * references to be merged. + * + * @private + * @param {Object} object The destination object. + * @param {Object} source The source object. + * @param {string} key The key of the value to merge. + * @param {number} srcIndex The index of `source`. + * @param {Function} mergeFunc The function to merge values. + * @param {Function} [customizer] The function to customize assigned values. + * @param {Object} [stack] Tracks traversed source values and their merged + * counterparts. + */ +function baseMergeDeep$1(object, source, key, srcIndex, mergeFunc, customizer, stack) { + var objValue = safeGet$1(object, key), + srcValue = safeGet$1(source, key), + stacked = stack.get(srcValue); + + if (stacked) { + assignMergeValue$1(object, key, stacked); + return; + } + var newValue = customizer + ? customizer(objValue, srcValue, (key + ''), object, source, stack) + : undefined; + + var isCommon = newValue === undefined; + + if (isCommon) { + var isArr = isArray$2(srcValue), + isBuff = !isArr && isBuffer(srcValue), + isTyped = !isArr && !isBuff && isTypedArray$3(srcValue); + + newValue = srcValue; + if (isArr || isBuff || isTyped) { + if (isArray$2(objValue)) { + newValue = objValue; + } + else if (isArrayLikeObject(objValue)) { + newValue = copyArray(objValue); + } + else if (isBuff) { + isCommon = false; + newValue = cloneBuffer(srcValue, true); + } + else if (isTyped) { + isCommon = false; + newValue = cloneTypedArray(srcValue, true); + } + else { + newValue = []; + } + } + else if (isPlainObject(srcValue) || isArguments(srcValue)) { + newValue = objValue; + if (isArguments(objValue)) { + newValue = toPlainObject(objValue); + } + else if (!isObject$3(objValue) || isFunction(objValue)) { + newValue = initCloneObject(srcValue); + } + } + else { + isCommon = false; + } + } + if (isCommon) { + // Recursively merge objects and arrays (susceptible to call stack limits). + stack.set(srcValue, newValue); + mergeFunc(newValue, srcValue, srcIndex, customizer, stack); + stack['delete'](srcValue); + } + assignMergeValue$1(object, key, newValue); +} + +var _baseMergeDeep = baseMergeDeep$1; + +var Stack = _Stack, + assignMergeValue = _assignMergeValue, + baseFor = _baseFor, + baseMergeDeep = _baseMergeDeep, + isObject$2 = isObject_1, + keysIn = keysIn_1, + safeGet = _safeGet; + +/** + * The base implementation of `_.merge` without support for multiple sources. + * + * @private + * @param {Object} object The destination object. + * @param {Object} source The source object. + * @param {number} srcIndex The index of `source`. + * @param {Function} [customizer] The function to customize merged values. + * @param {Object} [stack] Tracks traversed source values and their merged + * counterparts. + */ +function baseMerge$1(object, source, srcIndex, customizer, stack) { + if (object === source) { + return; + } + baseFor(source, function(srcValue, key) { + stack || (stack = new Stack); + if (isObject$2(srcValue)) { + baseMergeDeep(object, source, key, srcIndex, baseMerge$1, customizer, stack); + } + else { + var newValue = customizer + ? customizer(safeGet(object, key), srcValue, (key + ''), object, source, stack) + : undefined; + + if (newValue === undefined) { + newValue = srcValue; + } + assignMergeValue(object, key, newValue); + } + }, keysIn); +} + +var _baseMerge = baseMerge$1; + +var baseRest$1 = _baseRest, + isIterateeCall$2 = _isIterateeCall; + +/** + * Creates a function like `_.assign`. + * + * @private + * @param {Function} assigner The function to assign values. + * @returns {Function} Returns the new assigner function. + */ +function createAssigner$1(assigner) { + return baseRest$1(function(object, sources) { + var index = -1, + length = sources.length, + customizer = length > 1 ? sources[length - 1] : undefined, + guard = length > 2 ? sources[2] : undefined; + + customizer = (assigner.length > 3 && typeof customizer == 'function') + ? (length--, customizer) + : undefined; + + if (guard && isIterateeCall$2(sources[0], sources[1], guard)) { + customizer = length < 3 ? undefined : customizer; + length = 1; + } + object = Object(object); + while (++index < length) { + var source = sources[index]; + if (source) { + assigner(object, source, index, customizer); + } + } + return object; + }); +} + +var _createAssigner = createAssigner$1; + +var baseMerge = _baseMerge, + createAssigner = _createAssigner; + +/** + * This method is like `_.assign` except that it recursively merges own and + * inherited enumerable string keyed properties of source objects into the + * destination object. Source properties that resolve to `undefined` are + * skipped if a destination value exists. Array and plain object properties + * are merged recursively. Other objects and value types are overridden by + * assignment. Source objects are applied from left to right. Subsequent + * sources overwrite property assignments of previous sources. + * + * **Note:** This method mutates `object`. + * + * @static + * @memberOf _ + * @since 0.5.0 + * @category Object + * @param {Object} object The destination object. + * @param {...Object} [sources] The source objects. + * @returns {Object} Returns `object`. + * @example + * + * var object = { + * 'a': [{ 'b': 2 }, { 'd': 4 }] + * }; + * + * var other = { + * 'a': [{ 'c': 3 }, { 'e': 5 }] + * }; + * + * _.merge(object, other); + * // => { 'a': [{ 'b': 2, 'c': 3 }, { 'd': 4, 'e': 5 }] } + */ +var merge$1 = createAssigner(function(object, source, srcIndex) { + baseMerge(object, source, srcIndex); +}); + +var merge_1 = merge$1; + +/** + * The base implementation of `_.lt` which doesn't coerce arguments. + * + * @private + * @param {*} value The value to compare. + * @param {*} other The other value to compare. + * @returns {boolean} Returns `true` if `value` is less than `other`, + * else `false`. + */ + +function baseLt$2(value, other) { + return value < other; +} + +var _baseLt = baseLt$2; + +var baseExtremum$1 = _baseExtremum, + baseLt$1 = _baseLt, + identity$1 = identity_1; + +/** + * Computes the minimum value of `array`. If `array` is empty or falsey, + * `undefined` is returned. + * + * @static + * @since 0.1.0 + * @memberOf _ + * @category Math + * @param {Array} array The array to iterate over. + * @returns {*} Returns the minimum value. + * @example + * + * _.min([4, 2, 8, 6]); + * // => 2 + * + * _.min([]); + * // => undefined + */ +function min$3(array) { + return (array && array.length) + ? baseExtremum$1(array, identity$1, baseLt$1) + : undefined; +} + +var min_1$1 = min$3; + +var baseExtremum = _baseExtremum, + baseIteratee$1 = _baseIteratee, + baseLt = _baseLt; + +/** + * This method is like `_.min` except that it accepts `iteratee` which is + * invoked for each element in `array` to generate the criterion by which + * the value is ranked. The iteratee is invoked with one argument: (value). + * + * @static + * @memberOf _ + * @since 4.0.0 + * @category Math + * @param {Array} array The array to iterate over. + * @param {Function} [iteratee=_.identity] The iteratee invoked per element. + * @returns {*} Returns the minimum value. + * @example + * + * var objects = [{ 'n': 1 }, { 'n': 2 }]; + * + * _.minBy(objects, function(o) { return o.n; }); + * // => { 'n': 1 } + * + * // The `_.property` iteratee shorthand. + * _.minBy(objects, 'n'); + * // => { 'n': 1 } + */ +function minBy(array, iteratee) { + return (array && array.length) + ? baseExtremum(array, baseIteratee$1(iteratee), baseLt) + : undefined; +} + +var minBy_1 = minBy; + +var root = _root; + +/** + * Gets the timestamp of the number of milliseconds that have elapsed since + * the Unix epoch (1 January 1970 00:00:00 UTC). + * + * @static + * @memberOf _ + * @since 2.4.0 + * @category Date + * @returns {number} Returns the timestamp. + * @example + * + * _.defer(function(stamp) { + * console.log(_.now() - stamp); + * }, _.now()); + * // => Logs the number of milliseconds it took for the deferred invocation. + */ +var now = function() { + return root.Date.now(); +}; + +var now_1 = now; + +var assignValue$1 = _assignValue, + castPath$1 = _castPath, + isIndex = _isIndex, + isObject$1 = isObject_1, + toKey = _toKey; + +/** + * The base implementation of `_.set`. + * + * @private + * @param {Object} object The object to modify. + * @param {Array|string} path The path of the property to set. + * @param {*} value The value to set. + * @param {Function} [customizer] The function to customize path creation. + * @returns {Object} Returns `object`. + */ +function baseSet$1(object, path, value, customizer) { + if (!isObject$1(object)) { + return object; + } + path = castPath$1(path, object); + + var index = -1, + length = path.length, + lastIndex = length - 1, + nested = object; + + while (nested != null && ++index < length) { + var key = toKey(path[index]), + newValue = value; + + if (key === '__proto__' || key === 'constructor' || key === 'prototype') { + return object; + } + + if (index != lastIndex) { + var objValue = nested[key]; + newValue = customizer ? customizer(objValue, key, nested) : undefined; + if (newValue === undefined) { + newValue = isObject$1(objValue) + ? objValue + : (isIndex(path[index + 1]) ? [] : {}); + } + } + assignValue$1(nested, key, newValue); + nested = nested[key]; + } + return object; +} + +var _baseSet = baseSet$1; + +var baseGet$1 = _baseGet, + baseSet = _baseSet, + castPath = _castPath; + +/** + * The base implementation of `_.pickBy` without support for iteratee shorthands. + * + * @private + * @param {Object} object The source object. + * @param {string[]} paths The property paths to pick. + * @param {Function} predicate The function invoked per property. + * @returns {Object} Returns the new object. + */ +function basePickBy$1(object, paths, predicate) { + var index = -1, + length = paths.length, + result = {}; + + while (++index < length) { + var path = paths[index], + value = baseGet$1(object, path); + + if (predicate(value, path)) { + baseSet(result, castPath(path, object), value); + } + } + return result; +} + +var _basePickBy = basePickBy$1; + +var basePickBy = _basePickBy, + hasIn = hasIn_1; + +/** + * The base implementation of `_.pick` without support for individual + * property identifiers. + * + * @private + * @param {Object} object The source object. + * @param {string[]} paths The property paths to pick. + * @returns {Object} Returns the new object. + */ +function basePick$1(object, paths) { + return basePickBy(object, paths, function(value, path) { + return hasIn(object, path); + }); +} + +var _basePick = basePick$1; + +var flatten = flatten_1, + overRest = _overRest, + setToString = _setToString; + +/** + * A specialized version of `baseRest` which flattens the rest array. + * + * @private + * @param {Function} func The function to apply a rest parameter to. + * @returns {Function} Returns the new function. + */ +function flatRest$1(func) { + return setToString(overRest(func, undefined, flatten), func + ''); +} + +var _flatRest = flatRest$1; + +var basePick = _basePick, + flatRest = _flatRest; + +/** + * Creates an object composed of the picked `object` properties. + * + * @static + * @since 0.1.0 + * @memberOf _ + * @category Object + * @param {Object} object The source object. + * @param {...(string|string[])} [paths] The property paths to pick. + * @returns {Object} Returns the new object. + * @example + * + * var object = { 'a': 1, 'b': '2', 'c': 3 }; + * + * _.pick(object, ['a', 'c']); + * // => { 'a': 1, 'c': 3 } + */ +var pick = flatRest(function(object, paths) { + return object == null ? {} : basePick(object, paths); +}); + +var pick_1 = pick; + +/* Built-in method references for those with the same name as other `lodash` methods. */ + +var nativeCeil = Math.ceil, + nativeMax = Math.max; + +/** + * The base implementation of `_.range` and `_.rangeRight` which doesn't + * coerce arguments. + * + * @private + * @param {number} start The start of the range. + * @param {number} end The end of the range. + * @param {number} step The value to increment or decrement by. + * @param {boolean} [fromRight] Specify iterating from right to left. + * @returns {Array} Returns the range of numbers. + */ +function baseRange$1(start, end, step, fromRight) { + var index = -1, + length = nativeMax(nativeCeil((end - start) / (step || 1)), 0), + result = Array(length); + + while (length--) { + result[fromRight ? length : ++index] = start; + start += step; + } + return result; +} + +var _baseRange = baseRange$1; + +var baseRange = _baseRange, + isIterateeCall$1 = _isIterateeCall, + toFinite = toFinite_1; + +/** + * Creates a `_.range` or `_.rangeRight` function. + * + * @private + * @param {boolean} [fromRight] Specify iterating from right to left. + * @returns {Function} Returns the new range function. + */ +function createRange$1(fromRight) { + return function(start, end, step) { + if (step && typeof step != 'number' && isIterateeCall$1(start, end, step)) { + end = step = undefined; + } + // Ensure the sign of `-0` is preserved. + start = toFinite(start); + if (end === undefined) { + end = start; + start = 0; + } else { + end = toFinite(end); + } + step = step === undefined ? (start < end ? 1 : -1) : toFinite(step); + return baseRange(start, end, step, fromRight); + }; +} + +var _createRange = createRange$1; + +var createRange = _createRange; + +/** + * Creates an array of numbers (positive and/or negative) progressing from + * `start` up to, but not including, `end`. A step of `-1` is used if a negative + * `start` is specified without an `end` or `step`. If `end` is not specified, + * it's set to `start` with `start` then set to `0`. + * + * **Note:** JavaScript follows the IEEE-754 standard for resolving + * floating-point values which can produce unexpected results. + * + * @static + * @since 0.1.0 + * @memberOf _ + * @category Util + * @param {number} [start=0] The start of the range. + * @param {number} end The end of the range. + * @param {number} [step=1] The value to increment or decrement by. + * @returns {Array} Returns the range of numbers. + * @see _.inRange, _.rangeRight + * @example + * + * _.range(4); + * // => [0, 1, 2, 3] + * + * _.range(-4); + * // => [0, -1, -2, -3] + * + * _.range(1, 5); + * // => [1, 2, 3, 4] + * + * _.range(0, 20, 5); + * // => [0, 5, 10, 15] + * + * _.range(0, -4, -1); + * // => [0, -1, -2, -3] + * + * _.range(1, 4, 0); + * // => [1, 1, 1] + * + * _.range(0); + * // => [] + */ +var range = createRange(); + +var range_1 = range; + +/** + * The base implementation of `_.sortBy` which uses `comparer` to define the + * sort order of `array` and replaces criteria objects with their corresponding + * values. + * + * @private + * @param {Array} array The array to sort. + * @param {Function} comparer The function to define sort order. + * @returns {Array} Returns `array`. + */ + +function baseSortBy$1(array, comparer) { + var length = array.length; + + array.sort(comparer); + while (length--) { + array[length] = array[length].value; + } + return array; +} + +var _baseSortBy = baseSortBy$1; + +var isSymbol = isSymbol_1; + +/** + * Compares values to sort them in ascending order. + * + * @private + * @param {*} value The value to compare. + * @param {*} other The other value to compare. + * @returns {number} Returns the sort order indicator for `value`. + */ +function compareAscending$1(value, other) { + if (value !== other) { + var valIsDefined = value !== undefined, + valIsNull = value === null, + valIsReflexive = value === value, + valIsSymbol = isSymbol(value); + + var othIsDefined = other !== undefined, + othIsNull = other === null, + othIsReflexive = other === other, + othIsSymbol = isSymbol(other); + + if ((!othIsNull && !othIsSymbol && !valIsSymbol && value > other) || + (valIsSymbol && othIsDefined && othIsReflexive && !othIsNull && !othIsSymbol) || + (valIsNull && othIsDefined && othIsReflexive) || + (!valIsDefined && othIsReflexive) || + !valIsReflexive) { + return 1; + } + if ((!valIsNull && !valIsSymbol && !othIsSymbol && value < other) || + (othIsSymbol && valIsDefined && valIsReflexive && !valIsNull && !valIsSymbol) || + (othIsNull && valIsDefined && valIsReflexive) || + (!othIsDefined && valIsReflexive) || + !othIsReflexive) { + return -1; + } + } + return 0; +} + +var _compareAscending = compareAscending$1; + +var compareAscending = _compareAscending; + +/** + * Used by `_.orderBy` to compare multiple properties of a value to another + * and stable sort them. + * + * If `orders` is unspecified, all values are sorted in ascending order. Otherwise, + * specify an order of "desc" for descending or "asc" for ascending sort order + * of corresponding values. + * + * @private + * @param {Object} object The object to compare. + * @param {Object} other The other object to compare. + * @param {boolean[]|string[]} orders The order to sort by for each property. + * @returns {number} Returns the sort order indicator for `object`. + */ +function compareMultiple$1(object, other, orders) { + var index = -1, + objCriteria = object.criteria, + othCriteria = other.criteria, + length = objCriteria.length, + ordersLength = orders.length; + + while (++index < length) { + var result = compareAscending(objCriteria[index], othCriteria[index]); + if (result) { + if (index >= ordersLength) { + return result; + } + var order = orders[index]; + return result * (order == 'desc' ? -1 : 1); + } + } + // Fixes an `Array#sort` bug in the JS engine embedded in Adobe applications + // that causes it, under certain circumstances, to provide the same value for + // `object` and `other`. See https://github.com/jashkenas/underscore/pull/1247 + // for more details. + // + // This also ensures a stable sort in V8 and other engines. + // See https://bugs.chromium.org/p/v8/issues/detail?id=90 for more details. + return object.index - other.index; +} + +var _compareMultiple = compareMultiple$1; + +var arrayMap = _arrayMap, + baseGet = _baseGet, + baseIteratee = _baseIteratee, + baseMap = _baseMap, + baseSortBy = _baseSortBy, + baseUnary = _baseUnary, + compareMultiple = _compareMultiple, + identity = identity_1, + isArray$1 = isArray_1; + +/** + * The base implementation of `_.orderBy` without param guards. + * + * @private + * @param {Array|Object} collection The collection to iterate over. + * @param {Function[]|Object[]|string[]} iteratees The iteratees to sort by. + * @param {string[]} orders The sort orders of `iteratees`. + * @returns {Array} Returns the new sorted array. + */ +function baseOrderBy$1(collection, iteratees, orders) { + if (iteratees.length) { + iteratees = arrayMap(iteratees, function(iteratee) { + if (isArray$1(iteratee)) { + return function(value) { + return baseGet(value, iteratee.length === 1 ? iteratee[0] : iteratee); + } + } + return iteratee; + }); + } else { + iteratees = [identity]; + } + + var index = -1; + iteratees = arrayMap(iteratees, baseUnary(baseIteratee)); + + var result = baseMap(collection, function(value, key, collection) { + var criteria = arrayMap(iteratees, function(iteratee) { + return iteratee(value); + }); + return { 'criteria': criteria, 'index': ++index, 'value': value }; + }); + + return baseSortBy(result, function(object, other) { + return compareMultiple(object, other, orders); + }); +} + +var _baseOrderBy = baseOrderBy$1; + +var baseFlatten = _baseFlatten, + baseOrderBy = _baseOrderBy, + baseRest = _baseRest, + isIterateeCall = _isIterateeCall; + +/** + * Creates an array of elements, sorted in ascending order by the results of + * running each element in a collection thru each iteratee. This method + * performs a stable sort, that is, it preserves the original sort order of + * equal elements. The iteratees are invoked with one argument: (value). + * + * @static + * @memberOf _ + * @since 0.1.0 + * @category Collection + * @param {Array|Object} collection The collection to iterate over. + * @param {...(Function|Function[])} [iteratees=[_.identity]] + * The iteratees to sort by. + * @returns {Array} Returns the new sorted array. + * @example + * + * var users = [ + * { 'user': 'fred', 'age': 48 }, + * { 'user': 'barney', 'age': 36 }, + * { 'user': 'fred', 'age': 30 }, + * { 'user': 'barney', 'age': 34 } + * ]; + * + * _.sortBy(users, [function(o) { return o.user; }]); + * // => objects for [['barney', 36], ['barney', 34], ['fred', 48], ['fred', 30]] + * + * _.sortBy(users, ['user', 'age']); + * // => objects for [['barney', 34], ['barney', 36], ['fred', 30], ['fred', 48]] + */ +var sortBy = baseRest(function(collection, iteratees) { + if (collection == null) { + return []; + } + var length = iteratees.length; + if (length > 1 && isIterateeCall(collection, iteratees[0], iteratees[1])) { + iteratees = []; + } else if (length > 2 && isIterateeCall(iteratees[0], iteratees[1], iteratees[2])) { + iteratees = [iteratees[0]]; + } + return baseOrderBy(collection, baseFlatten(iteratees, 1), []); +}); + +var sortBy_1 = sortBy; + +var toString$2 = toString_1; + +/** Used to generate unique IDs. */ +var idCounter$1 = 0; + +/** + * Generates a unique ID. If `prefix` is given, the ID is appended to it. + * + * @static + * @since 0.1.0 + * @memberOf _ + * @category Util + * @param {string} [prefix=''] The value to prefix the ID with. + * @returns {string} Returns the unique ID. + * @example + * + * _.uniqueId('contact_'); + * // => 'contact_104' + * + * _.uniqueId(); + * // => '105' + */ +function uniqueId(prefix) { + var id = ++idCounter$1; + return toString$2(prefix) + id; +} + +var uniqueId_1 = uniqueId; + +/** + * This base implementation of `_.zipObject` which assigns values using `assignFunc`. + * + * @private + * @param {Array} props The property identifiers. + * @param {Array} values The property values. + * @param {Function} assignFunc The function to assign values. + * @returns {Object} Returns the new object. + */ + +function baseZipObject$1(props, values, assignFunc) { + var index = -1, + length = props.length, + valsLength = values.length, + result = {}; + + while (++index < length) { + var value = index < valsLength ? values[index] : undefined; + assignFunc(result, props[index], value); + } + return result; +} + +var _baseZipObject = baseZipObject$1; + +var assignValue = _assignValue, + baseZipObject = _baseZipObject; + +/** + * This method is like `_.fromPairs` except that it accepts two arrays, + * one of property identifiers and one of corresponding values. + * + * @static + * @memberOf _ + * @since 0.4.0 + * @category Array + * @param {Array} [props=[]] The property identifiers. + * @param {Array} [values=[]] The property values. + * @returns {Object} Returns the new object. + * @example + * + * _.zipObject(['a', 'b'], [1, 2]); + * // => { 'a': 1, 'b': 2 } + */ +function zipObject(props, values) { + return baseZipObject(props || [], values || [], assignValue); +} + +var zipObject_1 = zipObject; + +/* global window */ + +var lodash; + +if (typeof commonjsRequire === "function") { + try { + lodash = { + cloneDeep: cloneDeep_1, + constant: constant_1, + defaults: defaults_1, + each: each, + filter: filter_1, + find: find_1, + flatten: flatten_1, + forEach: forEach_1$1, + forIn: forIn_1, + has: has_1, + isUndefined: isUndefined_1, + last: last_1, + map: map_1, + mapValues: mapValues_1, + max: max_1$1, + merge: merge_1, + min: min_1$1, + minBy: minBy_1, + now: now_1, + pick: pick_1, + range: range_1, + reduce: reduce_1, + sortBy: sortBy_1, + uniqueId: uniqueId_1, + values: values_1, + zipObject: zipObject_1, + }; + } catch (e) { + // continue regardless of error + } +} + +if (!lodash) { + lodash = window._; +} + +var lodash_1 = lodash; + +/* + * Simple doubly linked list implementation derived from Cormen, et al., + * "Introduction to Algorithms". + */ + +var list = List$1; + +function List$1() { + var sentinel = {}; + sentinel._next = sentinel._prev = sentinel; + this._sentinel = sentinel; +} + +List$1.prototype.dequeue = function() { + var sentinel = this._sentinel; + var entry = sentinel._prev; + if (entry !== sentinel) { + unlink(entry); + return entry; + } +}; + +List$1.prototype.enqueue = function(entry) { + var sentinel = this._sentinel; + if (entry._prev && entry._next) { + unlink(entry); + } + entry._next = sentinel._next; + sentinel._next._prev = entry; + sentinel._next = entry; + entry._prev = sentinel; +}; + +List$1.prototype.toString = function() { + var strs = []; + var sentinel = this._sentinel; + var curr = sentinel._prev; + while (curr !== sentinel) { + strs.push(JSON.stringify(curr, filterOutLinks)); + curr = curr._prev; + } + return "[" + strs.join(", ") + "]"; +}; + +function unlink(entry) { + entry._prev._next = entry._next; + entry._next._prev = entry._prev; + delete entry._next; + delete entry._prev; +} + +function filterOutLinks(k, v) { + if (k !== "_next" && k !== "_prev") { + return v; + } +} + +var _$n = lodash_1; +var Graph$8 = graphlib_1.Graph; +var List = list; + +/* + * A greedy heuristic for finding a feedback arc set for a graph. A feedback + * arc set is a set of edges that can be removed to make a graph acyclic. + * The algorithm comes from: P. Eades, X. Lin, and W. F. Smyth, "A fast and + * effective heuristic for the feedback arc set problem." This implementation + * adjusts that from the paper to allow for weighted edges. + */ +var greedyFas = greedyFAS$1; + +var DEFAULT_WEIGHT_FN = _$n.constant(1); + +function greedyFAS$1(g, weightFn) { + if (g.nodeCount() <= 1) { + return []; + } + var state = buildState(g, weightFn || DEFAULT_WEIGHT_FN); + var results = doGreedyFAS(state.graph, state.buckets, state.zeroIdx); + + // Expand multi-edges + return _$n.flatten(_$n.map(results, function(e) { + return g.outEdges(e.v, e.w); + }), true); +} + +function doGreedyFAS(g, buckets, zeroIdx) { + var results = []; + var sources = buckets[buckets.length - 1]; + var sinks = buckets[0]; + + var entry; + while (g.nodeCount()) { + while ((entry = sinks.dequeue())) { removeNode(g, buckets, zeroIdx, entry); } + while ((entry = sources.dequeue())) { removeNode(g, buckets, zeroIdx, entry); } + if (g.nodeCount()) { + for (var i = buckets.length - 2; i > 0; --i) { + entry = buckets[i].dequeue(); + if (entry) { + results = results.concat(removeNode(g, buckets, zeroIdx, entry, true)); + break; + } + } + } + } + + return results; +} + +function removeNode(g, buckets, zeroIdx, entry, collectPredecessors) { + var results = collectPredecessors ? [] : undefined; + + _$n.forEach(g.inEdges(entry.v), function(edge) { + var weight = g.edge(edge); + var uEntry = g.node(edge.v); + + if (collectPredecessors) { + results.push({ v: edge.v, w: edge.w }); + } + + uEntry.out -= weight; + assignBucket(buckets, zeroIdx, uEntry); + }); + + _$n.forEach(g.outEdges(entry.v), function(edge) { + var weight = g.edge(edge); + var w = edge.w; + var wEntry = g.node(w); + wEntry["in"] -= weight; + assignBucket(buckets, zeroIdx, wEntry); + }); + + g.removeNode(entry.v); + + return results; +} + +function buildState(g, weightFn) { + var fasGraph = new Graph$8(); + var maxIn = 0; + var maxOut = 0; + + _$n.forEach(g.nodes(), function(v) { + fasGraph.setNode(v, { v: v, "in": 0, out: 0 }); + }); + + // Aggregate weights on nodes, but also sum the weights across multi-edges + // into a single edge for the fasGraph. + _$n.forEach(g.edges(), function(e) { + var prevWeight = fasGraph.edge(e.v, e.w) || 0; + var weight = weightFn(e); + var edgeWeight = prevWeight + weight; + fasGraph.setEdge(e.v, e.w, edgeWeight); + maxOut = Math.max(maxOut, fasGraph.node(e.v).out += weight); + maxIn = Math.max(maxIn, fasGraph.node(e.w)["in"] += weight); + }); + + var buckets = _$n.range(maxOut + maxIn + 3).map(function() { return new List(); }); + var zeroIdx = maxIn + 1; + + _$n.forEach(fasGraph.nodes(), function(v) { + assignBucket(buckets, zeroIdx, fasGraph.node(v)); + }); + + return { graph: fasGraph, buckets: buckets, zeroIdx: zeroIdx }; +} + +function assignBucket(buckets, zeroIdx, entry) { + if (!entry.out) { + buckets[0].enqueue(entry); + } else if (!entry["in"]) { + buckets[buckets.length - 1].enqueue(entry); + } else { + buckets[entry.out - entry["in"] + zeroIdx].enqueue(entry); + } +} + +var _$m = lodash_1; +var greedyFAS = greedyFas; + +var acyclic$1 = { + run: run$2, + undo: undo$2 +}; + +function run$2(g) { + var fas = (g.graph().acyclicer === "greedy" + ? greedyFAS(g, weightFn(g)) + : dfsFAS(g)); + _$m.forEach(fas, function(e) { + var label = g.edge(e); + g.removeEdge(e); + label.forwardName = e.name; + label.reversed = true; + g.setEdge(e.w, e.v, label, _$m.uniqueId("rev")); + }); + + function weightFn(g) { + return function(e) { + return g.edge(e).weight; + }; + } +} + +function dfsFAS(g) { + var fas = []; + var stack = {}; + var visited = {}; + + function dfs(v) { + if (_$m.has(visited, v)) { + return; + } + visited[v] = true; + stack[v] = true; + _$m.forEach(g.outEdges(v), function(e) { + if (_$m.has(stack, e.w)) { + fas.push(e); + } else { + dfs(e.w); + } + }); + delete stack[v]; + } + + _$m.forEach(g.nodes(), dfs); + return fas; +} + +function undo$2(g) { + _$m.forEach(g.edges(), function(e) { + var label = g.edge(e); + if (label.reversed) { + g.removeEdge(e); + + var forwardName = label.forwardName; + delete label.reversed; + delete label.forwardName; + g.setEdge(e.w, e.v, label, forwardName); + } + }); +} + +/* eslint "no-console": off */ + +var _$l = lodash_1; +var Graph$7 = graphlib_1.Graph; + +var util$a = { + addDummyNode: addDummyNode, + simplify: simplify$1, + asNonCompoundGraph: asNonCompoundGraph, + successorWeights: successorWeights, + predecessorWeights: predecessorWeights, + intersectRect: intersectRect, + buildLayerMatrix: buildLayerMatrix, + normalizeRanks: normalizeRanks$1, + removeEmptyRanks: removeEmptyRanks$1, + addBorderNode: addBorderNode$1, + maxRank: maxRank, + partition: partition, + time: time, + notime: notime +}; + +/* + * Adds a dummy node to the graph and return v. + */ +function addDummyNode(g, type, attrs, name) { + var v; + do { + v = _$l.uniqueId(name); + } while (g.hasNode(v)); + + attrs.dummy = type; + g.setNode(v, attrs); + return v; +} + +/* + * Returns a new graph with only simple edges. Handles aggregation of data + * associated with multi-edges. + */ +function simplify$1(g) { + var simplified = new Graph$7().setGraph(g.graph()); + _$l.forEach(g.nodes(), function(v) { simplified.setNode(v, g.node(v)); }); + _$l.forEach(g.edges(), function(e) { + var simpleLabel = simplified.edge(e.v, e.w) || { weight: 0, minlen: 1 }; + var label = g.edge(e); + simplified.setEdge(e.v, e.w, { + weight: simpleLabel.weight + label.weight, + minlen: Math.max(simpleLabel.minlen, label.minlen) + }); + }); + return simplified; +} + +function asNonCompoundGraph(g) { + var simplified = new Graph$7({ multigraph: g.isMultigraph() }).setGraph(g.graph()); + _$l.forEach(g.nodes(), function(v) { + if (!g.children(v).length) { + simplified.setNode(v, g.node(v)); + } + }); + _$l.forEach(g.edges(), function(e) { + simplified.setEdge(e, g.edge(e)); + }); + return simplified; +} + +function successorWeights(g) { + var weightMap = _$l.map(g.nodes(), function(v) { + var sucs = {}; + _$l.forEach(g.outEdges(v), function(e) { + sucs[e.w] = (sucs[e.w] || 0) + g.edge(e).weight; + }); + return sucs; + }); + return _$l.zipObject(g.nodes(), weightMap); +} + +function predecessorWeights(g) { + var weightMap = _$l.map(g.nodes(), function(v) { + var preds = {}; + _$l.forEach(g.inEdges(v), function(e) { + preds[e.v] = (preds[e.v] || 0) + g.edge(e).weight; + }); + return preds; + }); + return _$l.zipObject(g.nodes(), weightMap); +} + +/* + * Finds where a line starting at point ({x, y}) would intersect a rectangle + * ({x, y, width, height}) if it were pointing at the rectangle's center. + */ +function intersectRect(rect, point) { + var x = rect.x; + var y = rect.y; + + // Rectangle intersection algorithm from: + // http://math.stackexchange.com/questions/108113/find-edge-between-two-boxes + var dx = point.x - x; + var dy = point.y - y; + var w = rect.width / 2; + var h = rect.height / 2; + + if (!dx && !dy) { + throw new Error("Not possible to find intersection inside of the rectangle"); + } + + var sx, sy; + if (Math.abs(dy) * w > Math.abs(dx) * h) { + // Intersection is top or bottom of rect. + if (dy < 0) { + h = -h; + } + sx = h * dx / dy; + sy = h; + } else { + // Intersection is left or right of rect. + if (dx < 0) { + w = -w; + } + sx = w; + sy = w * dy / dx; + } + + return { x: x + sx, y: y + sy }; +} + +/* + * Given a DAG with each node assigned "rank" and "order" properties, this + * function will produce a matrix with the ids of each node. + */ +function buildLayerMatrix(g) { + var layering = _$l.map(_$l.range(maxRank(g) + 1), function() { return []; }); + _$l.forEach(g.nodes(), function(v) { + var node = g.node(v); + var rank = node.rank; + if (!_$l.isUndefined(rank)) { + layering[rank][node.order] = v; + } + }); + return layering; +} + +/* + * Adjusts the ranks for all nodes in the graph such that all nodes v have + * rank(v) >= 0 and at least one node w has rank(w) = 0. + */ +function normalizeRanks$1(g) { + var min = _$l.min(_$l.map(g.nodes(), function(v) { return g.node(v).rank; })); + _$l.forEach(g.nodes(), function(v) { + var node = g.node(v); + if (_$l.has(node, "rank")) { + node.rank -= min; + } + }); +} + +function removeEmptyRanks$1(g) { + // Ranks may not start at 0, so we need to offset them + var offset = _$l.min(_$l.map(g.nodes(), function(v) { return g.node(v).rank; })); + + var layers = []; + _$l.forEach(g.nodes(), function(v) { + var rank = g.node(v).rank - offset; + if (!layers[rank]) { + layers[rank] = []; + } + layers[rank].push(v); + }); + + var delta = 0; + var nodeRankFactor = g.graph().nodeRankFactor; + _$l.forEach(layers, function(vs, i) { + if (_$l.isUndefined(vs) && i % nodeRankFactor !== 0) { + --delta; + } else if (delta) { + _$l.forEach(vs, function(v) { g.node(v).rank += delta; }); + } + }); +} + +function addBorderNode$1(g, prefix, rank, order) { + var node = { + width: 0, + height: 0 + }; + if (arguments.length >= 4) { + node.rank = rank; + node.order = order; + } + return addDummyNode(g, "border", node, prefix); +} + +function maxRank(g) { + return _$l.max(_$l.map(g.nodes(), function(v) { + var rank = g.node(v).rank; + if (!_$l.isUndefined(rank)) { + return rank; + } + })); +} + +/* + * Partition a collection into two groups: `lhs` and `rhs`. If the supplied + * function returns true for an entry it goes into `lhs`. Otherwise it goes + * into `rhs. + */ +function partition(collection, fn) { + var result = { lhs: [], rhs: [] }; + _$l.forEach(collection, function(value) { + if (fn(value)) { + result.lhs.push(value); + } else { + result.rhs.push(value); + } + }); + return result; +} + +/* + * Returns a new function that wraps `fn` with a timer. The wrapper logs the + * time it takes to execute the function. + */ +function time(name, fn) { + var start = _$l.now(); + try { + return fn(); + } finally { + console.log(name + " time: " + (_$l.now() - start) + "ms"); + } +} + +function notime(name, fn) { + return fn(); +} + +var _$k = lodash_1; +var util$9 = util$a; + +var normalize$3 = { + run: run$1, + undo: undo$1 +}; + +/* + * Breaks any long edges in the graph into short segments that span 1 layer + * each. This operation is undoable with the denormalize function. + * + * Pre-conditions: + * + * 1. The input graph is a DAG. + * 2. Each node in the graph has a "rank" property. + * + * Post-condition: + * + * 1. All edges in the graph have a length of 1. + * 2. Dummy nodes are added where edges have been split into segments. + * 3. The graph is augmented with a "dummyChains" attribute which contains + * the first dummy in each chain of dummy nodes produced. + */ +function run$1(g) { + g.graph().dummyChains = []; + _$k.forEach(g.edges(), function(edge) { normalizeEdge(g, edge); }); +} + +function normalizeEdge(g, e) { + var v = e.v; + var vRank = g.node(v).rank; + var w = e.w; + var wRank = g.node(w).rank; + var name = e.name; + var edgeLabel = g.edge(e); + var labelRank = edgeLabel.labelRank; + + if (wRank === vRank + 1) return; + + g.removeEdge(e); + + var dummy, attrs, i; + for (i = 0, ++vRank; vRank < wRank; ++i, ++vRank) { + edgeLabel.points = []; + attrs = { + width: 0, height: 0, + edgeLabel: edgeLabel, edgeObj: e, + rank: vRank + }; + dummy = util$9.addDummyNode(g, "edge", attrs, "_d"); + if (vRank === labelRank) { + attrs.width = edgeLabel.width; + attrs.height = edgeLabel.height; + attrs.dummy = "edge-label"; + attrs.labelpos = edgeLabel.labelpos; + } + g.setEdge(v, dummy, { weight: edgeLabel.weight }, name); + if (i === 0) { + g.graph().dummyChains.push(dummy); + } + v = dummy; + } + + g.setEdge(v, w, { weight: edgeLabel.weight }, name); +} + +function undo$1(g) { + _$k.forEach(g.graph().dummyChains, function(v) { + var node = g.node(v); + var origLabel = node.edgeLabel; + var w; + g.setEdge(node.edgeObj, origLabel); + while (node.dummy) { + w = g.successors(v)[0]; + g.removeNode(v); + origLabel.points.push({ x: node.x, y: node.y }); + if (node.dummy === "edge-label") { + origLabel.x = node.x; + origLabel.y = node.y; + origLabel.width = node.width; + origLabel.height = node.height; + } + v = w; + node = g.node(v); + } + }); +} + +var _$j = lodash_1; + +var util$8 = { + longestPath: longestPath$1, + slack: slack$2 +}; + +/* + * Initializes ranks for the input graph using the longest path algorithm. This + * algorithm scales well and is fast in practice, it yields rather poor + * solutions. Nodes are pushed to the lowest layer possible, leaving the bottom + * ranks wide and leaving edges longer than necessary. However, due to its + * speed, this algorithm is good for getting an initial ranking that can be fed + * into other algorithms. + * + * This algorithm does not normalize layers because it will be used by other + * algorithms in most cases. If using this algorithm directly, be sure to + * run normalize at the end. + * + * Pre-conditions: + * + * 1. Input graph is a DAG. + * 2. Input graph node labels can be assigned properties. + * + * Post-conditions: + * + * 1. Each node will be assign an (unnormalized) "rank" property. + */ +function longestPath$1(g) { + var visited = {}; + + function dfs(v) { + var label = g.node(v); + if (_$j.has(visited, v)) { + return label.rank; + } + visited[v] = true; + + var rank = _$j.min(_$j.map(g.outEdges(v), function(e) { + return dfs(e.w) - g.edge(e).minlen; + })); + + if (rank === Number.POSITIVE_INFINITY || // return value of _.map([]) for Lodash 3 + rank === undefined || // return value of _.map([]) for Lodash 4 + rank === null) { // return value of _.map([null]) + rank = 0; + } + + return (label.rank = rank); + } + + _$j.forEach(g.sources(), dfs); +} + +/* + * Returns the amount of slack for the given edge. The slack is defined as the + * difference between the length of the edge and its minimum length. + */ +function slack$2(g, e) { + return g.node(e.w).rank - g.node(e.v).rank - g.edge(e).minlen; +} + +var _$i = lodash_1; +var Graph$6 = graphlib_1.Graph; +var slack$1 = util$8.slack; + +var feasibleTree_1 = feasibleTree$2; + +/* + * Constructs a spanning tree with tight edges and adjusted the input node's + * ranks to achieve this. A tight edge is one that is has a length that matches + * its "minlen" attribute. + * + * The basic structure for this function is derived from Gansner, et al., "A + * Technique for Drawing Directed Graphs." + * + * Pre-conditions: + * + * 1. Graph must be a DAG. + * 2. Graph must be connected. + * 3. Graph must have at least one node. + * 5. Graph nodes must have been previously assigned a "rank" property that + * respects the "minlen" property of incident edges. + * 6. Graph edges must have a "minlen" property. + * + * Post-conditions: + * + * - Graph nodes will have their rank adjusted to ensure that all edges are + * tight. + * + * Returns a tree (undirected graph) that is constructed using only "tight" + * edges. + */ +function feasibleTree$2(g) { + var t = new Graph$6({ directed: false }); + + // Choose arbitrary node from which to start our tree + var start = g.nodes()[0]; + var size = g.nodeCount(); + t.setNode(start, {}); + + var edge, delta; + while (tightTree(t, g) < size) { + edge = findMinSlackEdge(t, g); + delta = t.hasNode(edge.v) ? slack$1(g, edge) : -slack$1(g, edge); + shiftRanks(t, g, delta); + } + + return t; +} + +/* + * Finds a maximal tree of tight edges and returns the number of nodes in the + * tree. + */ +function tightTree(t, g) { + function dfs(v) { + _$i.forEach(g.nodeEdges(v), function(e) { + var edgeV = e.v, + w = (v === edgeV) ? e.w : edgeV; + if (!t.hasNode(w) && !slack$1(g, e)) { + t.setNode(w, {}); + t.setEdge(v, w, {}); + dfs(w); + } + }); + } + + _$i.forEach(t.nodes(), dfs); + return t.nodeCount(); +} + +/* + * Finds the edge with the smallest slack that is incident on tree and returns + * it. + */ +function findMinSlackEdge(t, g) { + return _$i.minBy(g.edges(), function(e) { + if (t.hasNode(e.v) !== t.hasNode(e.w)) { + return slack$1(g, e); + } + }); +} + +function shiftRanks(t, g, delta) { + _$i.forEach(t.nodes(), function(v) { + g.node(v).rank += delta; + }); +} + +var _$h = lodash_1; +var feasibleTree$1 = feasibleTree_1; +var slack = util$8.slack; +var initRank = util$8.longestPath; +var preorder = graphlib_1.alg.preorder; +var postorder$1 = graphlib_1.alg.postorder; +var simplify = util$a.simplify; + +var networkSimplex_1 = networkSimplex$1; + +// Expose some internals for testing purposes +networkSimplex$1.initLowLimValues = initLowLimValues; +networkSimplex$1.initCutValues = initCutValues; +networkSimplex$1.calcCutValue = calcCutValue; +networkSimplex$1.leaveEdge = leaveEdge; +networkSimplex$1.enterEdge = enterEdge; +networkSimplex$1.exchangeEdges = exchangeEdges; + +/* + * The network simplex algorithm assigns ranks to each node in the input graph + * and iteratively improves the ranking to reduce the length of edges. + * + * Preconditions: + * + * 1. The input graph must be a DAG. + * 2. All nodes in the graph must have an object value. + * 3. All edges in the graph must have "minlen" and "weight" attributes. + * + * Postconditions: + * + * 1. All nodes in the graph will have an assigned "rank" attribute that has + * been optimized by the network simplex algorithm. Ranks start at 0. + * + * + * A rough sketch of the algorithm is as follows: + * + * 1. Assign initial ranks to each node. We use the longest path algorithm, + * which assigns ranks to the lowest position possible. In general this + * leads to very wide bottom ranks and unnecessarily long edges. + * 2. Construct a feasible tight tree. A tight tree is one such that all + * edges in the tree have no slack (difference between length of edge + * and minlen for the edge). This by itself greatly improves the assigned + * rankings by shorting edges. + * 3. Iteratively find edges that have negative cut values. Generally a + * negative cut value indicates that the edge could be removed and a new + * tree edge could be added to produce a more compact graph. + * + * Much of the algorithms here are derived from Gansner, et al., "A Technique + * for Drawing Directed Graphs." The structure of the file roughly follows the + * structure of the overall algorithm. + */ +function networkSimplex$1(g) { + g = simplify(g); + initRank(g); + var t = feasibleTree$1(g); + initLowLimValues(t); + initCutValues(t, g); + + var e, f; + while ((e = leaveEdge(t))) { + f = enterEdge(t, g, e); + exchangeEdges(t, g, e, f); + } +} + +/* + * Initializes cut values for all edges in the tree. + */ +function initCutValues(t, g) { + var vs = postorder$1(t, t.nodes()); + vs = vs.slice(0, vs.length - 1); + _$h.forEach(vs, function(v) { + assignCutValue(t, g, v); + }); +} + +function assignCutValue(t, g, child) { + var childLab = t.node(child); + var parent = childLab.parent; + t.edge(child, parent).cutvalue = calcCutValue(t, g, child); +} + +/* + * Given the tight tree, its graph, and a child in the graph calculate and + * return the cut value for the edge between the child and its parent. + */ +function calcCutValue(t, g, child) { + var childLab = t.node(child); + var parent = childLab.parent; + // True if the child is on the tail end of the edge in the directed graph + var childIsTail = true; + // The graph's view of the tree edge we're inspecting + var graphEdge = g.edge(child, parent); + // The accumulated cut value for the edge between this node and its parent + var cutValue = 0; + + if (!graphEdge) { + childIsTail = false; + graphEdge = g.edge(parent, child); + } + + cutValue = graphEdge.weight; + + _$h.forEach(g.nodeEdges(child), function(e) { + var isOutEdge = e.v === child, + other = isOutEdge ? e.w : e.v; + + if (other !== parent) { + var pointsToHead = isOutEdge === childIsTail, + otherWeight = g.edge(e).weight; + + cutValue += pointsToHead ? otherWeight : -otherWeight; + if (isTreeEdge(t, child, other)) { + var otherCutValue = t.edge(child, other).cutvalue; + cutValue += pointsToHead ? -otherCutValue : otherCutValue; + } + } + }); + + return cutValue; +} + +function initLowLimValues(tree, root) { + if (arguments.length < 2) { + root = tree.nodes()[0]; + } + dfsAssignLowLim(tree, {}, 1, root); +} + +function dfsAssignLowLim(tree, visited, nextLim, v, parent) { + var low = nextLim; + var label = tree.node(v); + + visited[v] = true; + _$h.forEach(tree.neighbors(v), function(w) { + if (!_$h.has(visited, w)) { + nextLim = dfsAssignLowLim(tree, visited, nextLim, w, v); + } + }); + + label.low = low; + label.lim = nextLim++; + if (parent) { + label.parent = parent; + } else { + // TODO should be able to remove this when we incrementally update low lim + delete label.parent; + } + + return nextLim; +} + +function leaveEdge(tree) { + return _$h.find(tree.edges(), function(e) { + return tree.edge(e).cutvalue < 0; + }); +} + +function enterEdge(t, g, edge) { + var v = edge.v; + var w = edge.w; + + // For the rest of this function we assume that v is the tail and w is the + // head, so if we don't have this edge in the graph we should flip it to + // match the correct orientation. + if (!g.hasEdge(v, w)) { + v = edge.w; + w = edge.v; + } + + var vLabel = t.node(v); + var wLabel = t.node(w); + var tailLabel = vLabel; + var flip = false; + + // If the root is in the tail of the edge then we need to flip the logic that + // checks for the head and tail nodes in the candidates function below. + if (vLabel.lim > wLabel.lim) { + tailLabel = wLabel; + flip = true; + } + + var candidates = _$h.filter(g.edges(), function(edge) { + return flip === isDescendant(t, t.node(edge.v), tailLabel) && + flip !== isDescendant(t, t.node(edge.w), tailLabel); + }); + + return _$h.minBy(candidates, function(edge) { return slack(g, edge); }); +} + +function exchangeEdges(t, g, e, f) { + var v = e.v; + var w = e.w; + t.removeEdge(v, w); + t.setEdge(f.v, f.w, {}); + initLowLimValues(t); + initCutValues(t, g); + updateRanks(t, g); +} + +function updateRanks(t, g) { + var root = _$h.find(t.nodes(), function(v) { return !g.node(v).parent; }); + var vs = preorder(t, root); + vs = vs.slice(1); + _$h.forEach(vs, function(v) { + var parent = t.node(v).parent, + edge = g.edge(v, parent), + flipped = false; + + if (!edge) { + edge = g.edge(parent, v); + flipped = true; + } + + g.node(v).rank = g.node(parent).rank + (flipped ? edge.minlen : -edge.minlen); + }); +} + +/* + * Returns true if the edge is in the tree. + */ +function isTreeEdge(tree, u, v) { + return tree.hasEdge(u, v); +} + +/* + * Returns true if the specified node is descendant of the root node per the + * assigned low and lim attributes in the tree. + */ +function isDescendant(tree, vLabel, rootLabel) { + return rootLabel.low <= vLabel.lim && vLabel.lim <= rootLabel.lim; +} + +var rankUtil = util$8; +var longestPath = rankUtil.longestPath; +var feasibleTree = feasibleTree_1; +var networkSimplex = networkSimplex_1; + +var rank_1 = rank$1; + +/* + * Assigns a rank to each node in the input graph that respects the "minlen" + * constraint specified on edges between nodes. + * + * This basic structure is derived from Gansner, et al., "A Technique for + * Drawing Directed Graphs." + * + * Pre-conditions: + * + * 1. Graph must be a connected DAG + * 2. Graph nodes must be objects + * 3. Graph edges must have "weight" and "minlen" attributes + * + * Post-conditions: + * + * 1. Graph nodes will have a "rank" attribute based on the results of the + * algorithm. Ranks can start at any index (including negative), we'll + * fix them up later. + */ +function rank$1(g) { + switch(g.graph().ranker) { + case "network-simplex": networkSimplexRanker(g); break; + case "tight-tree": tightTreeRanker(g); break; + case "longest-path": longestPathRanker(g); break; + default: networkSimplexRanker(g); + } +} + +// A fast and simple ranker, but results are far from optimal. +var longestPathRanker = longestPath; + +function tightTreeRanker(g) { + longestPath(g); + feasibleTree(g); +} + +function networkSimplexRanker(g) { + networkSimplex(g); +} + +var _$g = lodash_1; + +var parentDummyChains_1 = parentDummyChains$1; + +function parentDummyChains$1(g) { + var postorderNums = postorder(g); + + _$g.forEach(g.graph().dummyChains, function(v) { + var node = g.node(v); + var edgeObj = node.edgeObj; + var pathData = findPath(g, postorderNums, edgeObj.v, edgeObj.w); + var path = pathData.path; + var lca = pathData.lca; + var pathIdx = 0; + var pathV = path[pathIdx]; + var ascending = true; + + while (v !== edgeObj.w) { + node = g.node(v); + + if (ascending) { + while ((pathV = path[pathIdx]) !== lca && + g.node(pathV).maxRank < node.rank) { + pathIdx++; + } + + if (pathV === lca) { + ascending = false; + } + } + + if (!ascending) { + while (pathIdx < path.length - 1 && + g.node(pathV = path[pathIdx + 1]).minRank <= node.rank) { + pathIdx++; + } + pathV = path[pathIdx]; + } + + g.setParent(v, pathV); + v = g.successors(v)[0]; + } + }); +} + +// Find a path from v to w through the lowest common ancestor (LCA). Return the +// full path and the LCA. +function findPath(g, postorderNums, v, w) { + var vPath = []; + var wPath = []; + var low = Math.min(postorderNums[v].low, postorderNums[w].low); + var lim = Math.max(postorderNums[v].lim, postorderNums[w].lim); + var parent; + var lca; + + // Traverse up from v to find the LCA + parent = v; + do { + parent = g.parent(parent); + vPath.push(parent); + } while (parent && + (postorderNums[parent].low > low || lim > postorderNums[parent].lim)); + lca = parent; + + // Traverse from w to LCA + parent = w; + while ((parent = g.parent(parent)) !== lca) { + wPath.push(parent); + } + + return { path: vPath.concat(wPath.reverse()), lca: lca }; +} + +function postorder(g) { + var result = {}; + var lim = 0; + + function dfs(v) { + var low = lim; + _$g.forEach(g.children(v), dfs); + result[v] = { low: low, lim: lim++ }; + } + _$g.forEach(g.children(), dfs); + + return result; +} + +var _$f = lodash_1; +var util$7 = util$a; + +var nestingGraph$1 = { + run: run, + cleanup: cleanup +}; + +/* + * A nesting graph creates dummy nodes for the tops and bottoms of subgraphs, + * adds appropriate edges to ensure that all cluster nodes are placed between + * these boundries, and ensures that the graph is connected. + * + * In addition we ensure, through the use of the minlen property, that nodes + * and subgraph border nodes to not end up on the same rank. + * + * Preconditions: + * + * 1. Input graph is a DAG + * 2. Nodes in the input graph has a minlen attribute + * + * Postconditions: + * + * 1. Input graph is connected. + * 2. Dummy nodes are added for the tops and bottoms of subgraphs. + * 3. The minlen attribute for nodes is adjusted to ensure nodes do not + * get placed on the same rank as subgraph border nodes. + * + * The nesting graph idea comes from Sander, "Layout of Compound Directed + * Graphs." + */ +function run(g) { + var root = util$7.addDummyNode(g, "root", {}, "_root"); + var depths = treeDepths(g); + var height = _$f.max(_$f.values(depths)) - 1; // Note: depths is an Object not an array + var nodeSep = 2 * height + 1; + + g.graph().nestingRoot = root; + + // Multiply minlen by nodeSep to align nodes on non-border ranks. + _$f.forEach(g.edges(), function(e) { g.edge(e).minlen *= nodeSep; }); + + // Calculate a weight that is sufficient to keep subgraphs vertically compact + var weight = sumWeights(g) + 1; + + // Create border nodes and link them up + _$f.forEach(g.children(), function(child) { + dfs(g, root, nodeSep, weight, height, depths, child); + }); + + // Save the multiplier for node layers for later removal of empty border + // layers. + g.graph().nodeRankFactor = nodeSep; +} + +function dfs(g, root, nodeSep, weight, height, depths, v) { + var children = g.children(v); + if (!children.length) { + if (v !== root) { + g.setEdge(root, v, { weight: 0, minlen: nodeSep }); + } + return; + } + + var top = util$7.addBorderNode(g, "_bt"); + var bottom = util$7.addBorderNode(g, "_bb"); + var label = g.node(v); + + g.setParent(top, v); + label.borderTop = top; + g.setParent(bottom, v); + label.borderBottom = bottom; + + _$f.forEach(children, function(child) { + dfs(g, root, nodeSep, weight, height, depths, child); + + var childNode = g.node(child); + var childTop = childNode.borderTop ? childNode.borderTop : child; + var childBottom = childNode.borderBottom ? childNode.borderBottom : child; + var thisWeight = childNode.borderTop ? weight : 2 * weight; + var minlen = childTop !== childBottom ? 1 : height - depths[v] + 1; + + g.setEdge(top, childTop, { + weight: thisWeight, + minlen: minlen, + nestingEdge: true + }); + + g.setEdge(childBottom, bottom, { + weight: thisWeight, + minlen: minlen, + nestingEdge: true + }); + }); + + if (!g.parent(v)) { + g.setEdge(root, top, { weight: 0, minlen: height + depths[v] }); + } +} + +function treeDepths(g) { + var depths = {}; + function dfs(v, depth) { + var children = g.children(v); + if (children && children.length) { + _$f.forEach(children, function(child) { + dfs(child, depth + 1); + }); + } + depths[v] = depth; + } + _$f.forEach(g.children(), function(v) { dfs(v, 1); }); + return depths; +} + +function sumWeights(g) { + return _$f.reduce(g.edges(), function(acc, e) { + return acc + g.edge(e).weight; + }, 0); +} + +function cleanup(g) { + var graphLabel = g.graph(); + g.removeNode(graphLabel.nestingRoot); + delete graphLabel.nestingRoot; + _$f.forEach(g.edges(), function(e) { + var edge = g.edge(e); + if (edge.nestingEdge) { + g.removeEdge(e); + } + }); +} + +var _$e = lodash_1; +var util$6 = util$a; + +var addBorderSegments_1 = addBorderSegments$1; + +function addBorderSegments$1(g) { + function dfs(v) { + var children = g.children(v); + var node = g.node(v); + if (children.length) { + _$e.forEach(children, dfs); + } + + if (_$e.has(node, "minRank")) { + node.borderLeft = []; + node.borderRight = []; + for (var rank = node.minRank, maxRank = node.maxRank + 1; + rank < maxRank; + ++rank) { + addBorderNode(g, "borderLeft", "_bl", v, node, rank); + addBorderNode(g, "borderRight", "_br", v, node, rank); + } + } + } + + _$e.forEach(g.children(), dfs); +} + +function addBorderNode(g, prop, prefix, sg, sgNode, rank) { + var label = { width: 0, height: 0, rank: rank, borderType: prop }; + var prev = sgNode[prop][rank - 1]; + var curr = util$6.addDummyNode(g, "border", label, prefix); + sgNode[prop][rank] = curr; + g.setParent(curr, sg); + if (prev) { + g.setEdge(prev, curr, { weight: 1 }); + } +} + +var _$d = lodash_1; + +var coordinateSystem$1 = { + adjust: adjust, + undo: undo +}; + +function adjust(g) { + var rankDir = g.graph().rankdir.toLowerCase(); + if (rankDir === "lr" || rankDir === "rl") { + swapWidthHeight(g); + } +} + +function undo(g) { + var rankDir = g.graph().rankdir.toLowerCase(); + if (rankDir === "bt" || rankDir === "rl") { + reverseY(g); + } + + if (rankDir === "lr" || rankDir === "rl") { + swapXY(g); + swapWidthHeight(g); + } +} + +function swapWidthHeight(g) { + _$d.forEach(g.nodes(), function(v) { swapWidthHeightOne(g.node(v)); }); + _$d.forEach(g.edges(), function(e) { swapWidthHeightOne(g.edge(e)); }); +} + +function swapWidthHeightOne(attrs) { + var w = attrs.width; + attrs.width = attrs.height; + attrs.height = w; +} + +function reverseY(g) { + _$d.forEach(g.nodes(), function(v) { reverseYOne(g.node(v)); }); + + _$d.forEach(g.edges(), function(e) { + var edge = g.edge(e); + _$d.forEach(edge.points, reverseYOne); + if (_$d.has(edge, "y")) { + reverseYOne(edge); + } + }); +} + +function reverseYOne(attrs) { + attrs.y = -attrs.y; +} + +function swapXY(g) { + _$d.forEach(g.nodes(), function(v) { swapXYOne(g.node(v)); }); + + _$d.forEach(g.edges(), function(e) { + var edge = g.edge(e); + _$d.forEach(edge.points, swapXYOne); + if (_$d.has(edge, "x")) { + swapXYOne(edge); + } + }); +} + +function swapXYOne(attrs) { + var x = attrs.x; + attrs.x = attrs.y; + attrs.y = x; +} + +var _$c = lodash_1; + +var initOrder_1 = initOrder$1; + +/* + * Assigns an initial order value for each node by performing a DFS search + * starting from nodes in the first rank. Nodes are assigned an order in their + * rank as they are first visited. + * + * This approach comes from Gansner, et al., "A Technique for Drawing Directed + * Graphs." + * + * Returns a layering matrix with an array per layer and each layer sorted by + * the order of its nodes. + */ +function initOrder$1(g) { + var visited = {}; + var simpleNodes = _$c.filter(g.nodes(), function(v) { + return !g.children(v).length; + }); + var maxRank = _$c.max(_$c.map(simpleNodes, function(v) { return g.node(v).rank; })); + var layers = _$c.map(_$c.range(maxRank + 1), function() { return []; }); + + function dfs(v) { + if (_$c.has(visited, v)) return; + visited[v] = true; + var node = g.node(v); + layers[node.rank].push(v); + _$c.forEach(g.successors(v), dfs); + } + + var orderedVs = _$c.sortBy(simpleNodes, function(v) { return g.node(v).rank; }); + _$c.forEach(orderedVs, dfs); + + return layers; +} + +var _$b = lodash_1; + +var crossCount_1 = crossCount$1; + +/* + * A function that takes a layering (an array of layers, each with an array of + * ordererd nodes) and a graph and returns a weighted crossing count. + * + * Pre-conditions: + * + * 1. Input graph must be simple (not a multigraph), directed, and include + * only simple edges. + * 2. Edges in the input graph must have assigned weights. + * + * Post-conditions: + * + * 1. The graph and layering matrix are left unchanged. + * + * This algorithm is derived from Barth, et al., "Bilayer Cross Counting." + */ +function crossCount$1(g, layering) { + var cc = 0; + for (var i = 1; i < layering.length; ++i) { + cc += twoLayerCrossCount(g, layering[i-1], layering[i]); + } + return cc; +} + +function twoLayerCrossCount(g, northLayer, southLayer) { + // Sort all of the edges between the north and south layers by their position + // in the north layer and then the south. Map these edges to the position of + // their head in the south layer. + var southPos = _$b.zipObject(southLayer, + _$b.map(southLayer, function (v, i) { return i; })); + var southEntries = _$b.flatten(_$b.map(northLayer, function(v) { + return _$b.sortBy(_$b.map(g.outEdges(v), function(e) { + return { pos: southPos[e.w], weight: g.edge(e).weight }; + }), "pos"); + }), true); + + // Build the accumulator tree + var firstIndex = 1; + while (firstIndex < southLayer.length) firstIndex <<= 1; + var treeSize = 2 * firstIndex - 1; + firstIndex -= 1; + var tree = _$b.map(new Array(treeSize), function() { return 0; }); + + // Calculate the weighted crossings + var cc = 0; + _$b.forEach(southEntries.forEach(function(entry) { + var index = entry.pos + firstIndex; + tree[index] += entry.weight; + var weightSum = 0; + while (index > 0) { + if (index % 2) { + weightSum += tree[index + 1]; + } + index = (index - 1) >> 1; + tree[index] += entry.weight; + } + cc += entry.weight * weightSum; + })); + + return cc; +} + +var _$a = lodash_1; + +var barycenter_1 = barycenter$1; + +function barycenter$1(g, movable) { + return _$a.map(movable, function(v) { + var inV = g.inEdges(v); + if (!inV.length) { + return { v: v }; + } else { + var result = _$a.reduce(inV, function(acc, e) { + var edge = g.edge(e), + nodeU = g.node(e.v); + return { + sum: acc.sum + (edge.weight * nodeU.order), + weight: acc.weight + edge.weight + }; + }, { sum: 0, weight: 0 }); + + return { + v: v, + barycenter: result.sum / result.weight, + weight: result.weight + }; + } + }); +} + +var _$9 = lodash_1; + +var resolveConflicts_1 = resolveConflicts$1; + +/* + * Given a list of entries of the form {v, barycenter, weight} and a + * constraint graph this function will resolve any conflicts between the + * constraint graph and the barycenters for the entries. If the barycenters for + * an entry would violate a constraint in the constraint graph then we coalesce + * the nodes in the conflict into a new node that respects the contraint and + * aggregates barycenter and weight information. + * + * This implementation is based on the description in Forster, "A Fast and + * Simple Hueristic for Constrained Two-Level Crossing Reduction," thought it + * differs in some specific details. + * + * Pre-conditions: + * + * 1. Each entry has the form {v, barycenter, weight}, or if the node has + * no barycenter, then {v}. + * + * Returns: + * + * A new list of entries of the form {vs, i, barycenter, weight}. The list + * `vs` may either be a singleton or it may be an aggregation of nodes + * ordered such that they do not violate constraints from the constraint + * graph. The property `i` is the lowest original index of any of the + * elements in `vs`. + */ +function resolveConflicts$1(entries, cg) { + var mappedEntries = {}; + _$9.forEach(entries, function(entry, i) { + var tmp = mappedEntries[entry.v] = { + indegree: 0, + "in": [], + out: [], + vs: [entry.v], + i: i + }; + if (!_$9.isUndefined(entry.barycenter)) { + tmp.barycenter = entry.barycenter; + tmp.weight = entry.weight; + } + }); + + _$9.forEach(cg.edges(), function(e) { + var entryV = mappedEntries[e.v]; + var entryW = mappedEntries[e.w]; + if (!_$9.isUndefined(entryV) && !_$9.isUndefined(entryW)) { + entryW.indegree++; + entryV.out.push(mappedEntries[e.w]); + } + }); + + var sourceSet = _$9.filter(mappedEntries, function(entry) { + return !entry.indegree; + }); + + return doResolveConflicts(sourceSet); +} + +function doResolveConflicts(sourceSet) { + var entries = []; + + function handleIn(vEntry) { + return function(uEntry) { + if (uEntry.merged) { + return; + } + if (_$9.isUndefined(uEntry.barycenter) || + _$9.isUndefined(vEntry.barycenter) || + uEntry.barycenter >= vEntry.barycenter) { + mergeEntries(vEntry, uEntry); + } + }; + } + + function handleOut(vEntry) { + return function(wEntry) { + wEntry["in"].push(vEntry); + if (--wEntry.indegree === 0) { + sourceSet.push(wEntry); + } + }; + } + + while (sourceSet.length) { + var entry = sourceSet.pop(); + entries.push(entry); + _$9.forEach(entry["in"].reverse(), handleIn(entry)); + _$9.forEach(entry.out, handleOut(entry)); + } + + return _$9.map(_$9.filter(entries, function(entry) { return !entry.merged; }), + function(entry) { + return _$9.pick(entry, ["vs", "i", "barycenter", "weight"]); + }); + +} + +function mergeEntries(target, source) { + var sum = 0; + var weight = 0; + + if (target.weight) { + sum += target.barycenter * target.weight; + weight += target.weight; + } + + if (source.weight) { + sum += source.barycenter * source.weight; + weight += source.weight; + } + + target.vs = source.vs.concat(target.vs); + target.barycenter = sum / weight; + target.weight = weight; + target.i = Math.min(source.i, target.i); + source.merged = true; +} + +var _$8 = lodash_1; +var util$5 = util$a; + +var sort_1 = sort$1; + +function sort$1(entries, biasRight) { + var parts = util$5.partition(entries, function(entry) { + return _$8.has(entry, "barycenter"); + }); + var sortable = parts.lhs, + unsortable = _$8.sortBy(parts.rhs, function(entry) { return -entry.i; }), + vs = [], + sum = 0, + weight = 0, + vsIndex = 0; + + sortable.sort(compareWithBias(!!biasRight)); + + vsIndex = consumeUnsortable(vs, unsortable, vsIndex); + + _$8.forEach(sortable, function (entry) { + vsIndex += entry.vs.length; + vs.push(entry.vs); + sum += entry.barycenter * entry.weight; + weight += entry.weight; + vsIndex = consumeUnsortable(vs, unsortable, vsIndex); + }); + + var result = { vs: _$8.flatten(vs, true) }; + if (weight) { + result.barycenter = sum / weight; + result.weight = weight; + } + return result; +} + +function consumeUnsortable(vs, unsortable, index) { + var last; + while (unsortable.length && (last = _$8.last(unsortable)).i <= index) { + unsortable.pop(); + vs.push(last.vs); + index++; + } + return index; +} + +function compareWithBias(bias) { + return function(entryV, entryW) { + if (entryV.barycenter < entryW.barycenter) { + return -1; + } else if (entryV.barycenter > entryW.barycenter) { + return 1; + } + + return !bias ? entryV.i - entryW.i : entryW.i - entryV.i; + }; +} + +var _$7 = lodash_1; +var barycenter = barycenter_1; +var resolveConflicts = resolveConflicts_1; +var sort = sort_1; + +var sortSubgraph_1 = sortSubgraph$1; + +function sortSubgraph$1(g, v, cg, biasRight) { + var movable = g.children(v); + var node = g.node(v); + var bl = node ? node.borderLeft : undefined; + var br = node ? node.borderRight: undefined; + var subgraphs = {}; + + if (bl) { + movable = _$7.filter(movable, function(w) { + return w !== bl && w !== br; + }); + } + + var barycenters = barycenter(g, movable); + _$7.forEach(barycenters, function(entry) { + if (g.children(entry.v).length) { + var subgraphResult = sortSubgraph$1(g, entry.v, cg, biasRight); + subgraphs[entry.v] = subgraphResult; + if (_$7.has(subgraphResult, "barycenter")) { + mergeBarycenters(entry, subgraphResult); + } + } + }); + + var entries = resolveConflicts(barycenters, cg); + expandSubgraphs(entries, subgraphs); + + var result = sort(entries, biasRight); + + if (bl) { + result.vs = _$7.flatten([bl, result.vs, br], true); + if (g.predecessors(bl).length) { + var blPred = g.node(g.predecessors(bl)[0]), + brPred = g.node(g.predecessors(br)[0]); + if (!_$7.has(result, "barycenter")) { + result.barycenter = 0; + result.weight = 0; + } + result.barycenter = (result.barycenter * result.weight + + blPred.order + brPred.order) / (result.weight + 2); + result.weight += 2; + } + } + + return result; +} + +function expandSubgraphs(entries, subgraphs) { + _$7.forEach(entries, function(entry) { + entry.vs = _$7.flatten(entry.vs.map(function(v) { + if (subgraphs[v]) { + return subgraphs[v].vs; + } + return v; + }), true); + }); +} + +function mergeBarycenters(target, other) { + if (!_$7.isUndefined(target.barycenter)) { + target.barycenter = (target.barycenter * target.weight + + other.barycenter * other.weight) / + (target.weight + other.weight); + target.weight += other.weight; + } else { + target.barycenter = other.barycenter; + target.weight = other.weight; + } +} + +var _$6 = lodash_1; +var Graph$5 = graphlib_1.Graph; + +var buildLayerGraph_1 = buildLayerGraph$1; + +/* + * Constructs a graph that can be used to sort a layer of nodes. The graph will + * contain all base and subgraph nodes from the request layer in their original + * hierarchy and any edges that are incident on these nodes and are of the type + * requested by the "relationship" parameter. + * + * Nodes from the requested rank that do not have parents are assigned a root + * node in the output graph, which is set in the root graph attribute. This + * makes it easy to walk the hierarchy of movable nodes during ordering. + * + * Pre-conditions: + * + * 1. Input graph is a DAG + * 2. Base nodes in the input graph have a rank attribute + * 3. Subgraph nodes in the input graph has minRank and maxRank attributes + * 4. Edges have an assigned weight + * + * Post-conditions: + * + * 1. Output graph has all nodes in the movable rank with preserved + * hierarchy. + * 2. Root nodes in the movable layer are made children of the node + * indicated by the root attribute of the graph. + * 3. Non-movable nodes incident on movable nodes, selected by the + * relationship parameter, are included in the graph (without hierarchy). + * 4. Edges incident on movable nodes, selected by the relationship + * parameter, are added to the output graph. + * 5. The weights for copied edges are aggregated as need, since the output + * graph is not a multi-graph. + */ +function buildLayerGraph$1(g, rank, relationship) { + var root = createRootNode(g), + result = new Graph$5({ compound: true }).setGraph({ root: root }) + .setDefaultNodeLabel(function(v) { return g.node(v); }); + + _$6.forEach(g.nodes(), function(v) { + var node = g.node(v), + parent = g.parent(v); + + if (node.rank === rank || node.minRank <= rank && rank <= node.maxRank) { + result.setNode(v); + result.setParent(v, parent || root); + + // This assumes we have only short edges! + _$6.forEach(g[relationship](v), function(e) { + var u = e.v === v ? e.w : e.v, + edge = result.edge(u, v), + weight = !_$6.isUndefined(edge) ? edge.weight : 0; + result.setEdge(u, v, { weight: g.edge(e).weight + weight }); + }); + + if (_$6.has(node, "minRank")) { + result.setNode(v, { + borderLeft: node.borderLeft[rank], + borderRight: node.borderRight[rank] + }); + } + } + }); + + return result; +} + +function createRootNode(g) { + var v; + while (g.hasNode((v = _$6.uniqueId("_root")))); + return v; +} + +var _$5 = lodash_1; + +var addSubgraphConstraints_1 = addSubgraphConstraints$1; + +function addSubgraphConstraints$1(g, cg, vs) { + var prev = {}, + rootPrev; + + _$5.forEach(vs, function(v) { + var child = g.parent(v), + parent, + prevChild; + while (child) { + parent = g.parent(child); + if (parent) { + prevChild = prev[parent]; + prev[parent] = child; + } else { + prevChild = rootPrev; + rootPrev = child; + } + if (prevChild && prevChild !== child) { + cg.setEdge(prevChild, child); + return; + } + child = parent; + } + }); + + /* + function dfs(v) { + var children = v ? g.children(v) : g.children(); + if (children.length) { + var min = Number.POSITIVE_INFINITY, + subgraphs = []; + _.each(children, function(child) { + var childMin = dfs(child); + if (g.children(child).length) { + subgraphs.push({ v: child, order: childMin }); + } + min = Math.min(min, childMin); + }); + _.reduce(_.sortBy(subgraphs, "order"), function(prev, curr) { + cg.setEdge(prev.v, curr.v); + return curr; + }); + return min; + } + return g.node(v).order; + } + dfs(undefined); + */ +} + +var _$4 = lodash_1; +var initOrder = initOrder_1; +var crossCount = crossCount_1; +var sortSubgraph = sortSubgraph_1; +var buildLayerGraph = buildLayerGraph_1; +var addSubgraphConstraints = addSubgraphConstraints_1; +var Graph$4 = graphlib_1.Graph; +var util$4 = util$a; + +var order_1 = order$1; + +/* + * Applies heuristics to minimize edge crossings in the graph and sets the best + * order solution as an order attribute on each node. + * + * Pre-conditions: + * + * 1. Graph must be DAG + * 2. Graph nodes must be objects with a "rank" attribute + * 3. Graph edges must have the "weight" attribute + * + * Post-conditions: + * + * 1. Graph nodes will have an "order" attribute based on the results of the + * algorithm. + */ +function order$1(g) { + var maxRank = util$4.maxRank(g), + downLayerGraphs = buildLayerGraphs(g, _$4.range(1, maxRank + 1), "inEdges"), + upLayerGraphs = buildLayerGraphs(g, _$4.range(maxRank - 1, -1, -1), "outEdges"); + + var layering = initOrder(g); + assignOrder(g, layering); + + var bestCC = Number.POSITIVE_INFINITY, + best; + + for (var i = 0, lastBest = 0; lastBest < 4; ++i, ++lastBest) { + sweepLayerGraphs(i % 2 ? downLayerGraphs : upLayerGraphs, i % 4 >= 2); + + layering = util$4.buildLayerMatrix(g); + var cc = crossCount(g, layering); + if (cc < bestCC) { + lastBest = 0; + best = _$4.cloneDeep(layering); + bestCC = cc; + } + } + + assignOrder(g, best); +} + +function buildLayerGraphs(g, ranks, relationship) { + return _$4.map(ranks, function(rank) { + return buildLayerGraph(g, rank, relationship); + }); +} + +function sweepLayerGraphs(layerGraphs, biasRight) { + var cg = new Graph$4(); + _$4.forEach(layerGraphs, function(lg) { + var root = lg.graph().root; + var sorted = sortSubgraph(lg, root, cg, biasRight); + _$4.forEach(sorted.vs, function(v, i) { + lg.node(v).order = i; + }); + addSubgraphConstraints(lg, cg, sorted.vs); + }); +} + +function assignOrder(g, layering) { + _$4.forEach(layering, function(layer) { + _$4.forEach(layer, function(v, i) { + g.node(v).order = i; + }); + }); +} + +var _$3 = lodash_1; +var Graph$3 = graphlib_1.Graph; +var util$3 = util$a; + +/* + * This module provides coordinate assignment based on Brandes and Köpf, "Fast + * and Simple Horizontal Coordinate Assignment." + */ + +var bk = { + positionX: positionX$1, + findType1Conflicts: findType1Conflicts, + findType2Conflicts: findType2Conflicts, + addConflict: addConflict, + hasConflict: hasConflict, + verticalAlignment: verticalAlignment, + horizontalCompaction: horizontalCompaction, + alignCoordinates: alignCoordinates, + findSmallestWidthAlignment: findSmallestWidthAlignment, + balance: balance +}; + +/* + * Marks all edges in the graph with a type-1 conflict with the "type1Conflict" + * property. A type-1 conflict is one where a non-inner segment crosses an + * inner segment. An inner segment is an edge with both incident nodes marked + * with the "dummy" property. + * + * This algorithm scans layer by layer, starting with the second, for type-1 + * conflicts between the current layer and the previous layer. For each layer + * it scans the nodes from left to right until it reaches one that is incident + * on an inner segment. It then scans predecessors to determine if they have + * edges that cross that inner segment. At the end a final scan is done for all + * nodes on the current rank to see if they cross the last visited inner + * segment. + * + * This algorithm (safely) assumes that a dummy node will only be incident on a + * single node in the layers being scanned. + */ +function findType1Conflicts(g, layering) { + var conflicts = {}; + + function visitLayer(prevLayer, layer) { + var + // last visited node in the previous layer that is incident on an inner + // segment. + k0 = 0, + // Tracks the last node in this layer scanned for crossings with a type-1 + // segment. + scanPos = 0, + prevLayerLength = prevLayer.length, + lastNode = _$3.last(layer); + + _$3.forEach(layer, function(v, i) { + var w = findOtherInnerSegmentNode(g, v), + k1 = w ? g.node(w).order : prevLayerLength; + + if (w || v === lastNode) { + _$3.forEach(layer.slice(scanPos, i +1), function(scanNode) { + _$3.forEach(g.predecessors(scanNode), function(u) { + var uLabel = g.node(u), + uPos = uLabel.order; + if ((uPos < k0 || k1 < uPos) && + !(uLabel.dummy && g.node(scanNode).dummy)) { + addConflict(conflicts, u, scanNode); + } + }); + }); + scanPos = i + 1; + k0 = k1; + } + }); + + return layer; + } + + _$3.reduce(layering, visitLayer); + return conflicts; +} + +function findType2Conflicts(g, layering) { + var conflicts = {}; + + function scan(south, southPos, southEnd, prevNorthBorder, nextNorthBorder) { + var v; + _$3.forEach(_$3.range(southPos, southEnd), function(i) { + v = south[i]; + if (g.node(v).dummy) { + _$3.forEach(g.predecessors(v), function(u) { + var uNode = g.node(u); + if (uNode.dummy && + (uNode.order < prevNorthBorder || uNode.order > nextNorthBorder)) { + addConflict(conflicts, u, v); + } + }); + } + }); + } + + + function visitLayer(north, south) { + var prevNorthPos = -1, + nextNorthPos, + southPos = 0; + + _$3.forEach(south, function(v, southLookahead) { + if (g.node(v).dummy === "border") { + var predecessors = g.predecessors(v); + if (predecessors.length) { + nextNorthPos = g.node(predecessors[0]).order; + scan(south, southPos, southLookahead, prevNorthPos, nextNorthPos); + southPos = southLookahead; + prevNorthPos = nextNorthPos; + } + } + scan(south, southPos, south.length, nextNorthPos, north.length); + }); + + return south; + } + + _$3.reduce(layering, visitLayer); + return conflicts; +} + +function findOtherInnerSegmentNode(g, v) { + if (g.node(v).dummy) { + return _$3.find(g.predecessors(v), function(u) { + return g.node(u).dummy; + }); + } +} + +function addConflict(conflicts, v, w) { + if (v > w) { + var tmp = v; + v = w; + w = tmp; + } + + var conflictsV = conflicts[v]; + if (!conflictsV) { + conflicts[v] = conflictsV = {}; + } + conflictsV[w] = true; +} + +function hasConflict(conflicts, v, w) { + if (v > w) { + var tmp = v; + v = w; + w = tmp; + } + return _$3.has(conflicts[v], w); +} + +/* + * Try to align nodes into vertical "blocks" where possible. This algorithm + * attempts to align a node with one of its median neighbors. If the edge + * connecting a neighbor is a type-1 conflict then we ignore that possibility. + * If a previous node has already formed a block with a node after the node + * we're trying to form a block with, we also ignore that possibility - our + * blocks would be split in that scenario. + */ +function verticalAlignment(g, layering, conflicts, neighborFn) { + var root = {}, + align = {}, + pos = {}; + + // We cache the position here based on the layering because the graph and + // layering may be out of sync. The layering matrix is manipulated to + // generate different extreme alignments. + _$3.forEach(layering, function(layer) { + _$3.forEach(layer, function(v, order) { + root[v] = v; + align[v] = v; + pos[v] = order; + }); + }); + + _$3.forEach(layering, function(layer) { + var prevIdx = -1; + _$3.forEach(layer, function(v) { + var ws = neighborFn(v); + if (ws.length) { + ws = _$3.sortBy(ws, function(w) { return pos[w]; }); + var mp = (ws.length - 1) / 2; + for (var i = Math.floor(mp), il = Math.ceil(mp); i <= il; ++i) { + var w = ws[i]; + if (align[v] === v && + prevIdx < pos[w] && + !hasConflict(conflicts, v, w)) { + align[w] = v; + align[v] = root[v] = root[w]; + prevIdx = pos[w]; + } + } + } + }); + }); + + return { root: root, align: align }; +} + +function horizontalCompaction(g, layering, root, align, reverseSep) { + // This portion of the algorithm differs from BK due to a number of problems. + // Instead of their algorithm we construct a new block graph and do two + // sweeps. The first sweep places blocks with the smallest possible + // coordinates. The second sweep removes unused space by moving blocks to the + // greatest coordinates without violating separation. + var xs = {}, + blockG = buildBlockGraph(g, layering, root, reverseSep), + borderType = reverseSep ? "borderLeft" : "borderRight"; + + function iterate(setXsFunc, nextNodesFunc) { + var stack = blockG.nodes(); + var elem = stack.pop(); + var visited = {}; + while (elem) { + if (visited[elem]) { + setXsFunc(elem); + } else { + visited[elem] = true; + stack.push(elem); + stack = stack.concat(nextNodesFunc(elem)); + } + + elem = stack.pop(); + } + } + + // First pass, assign smallest coordinates + function pass1(elem) { + xs[elem] = blockG.inEdges(elem).reduce(function(acc, e) { + return Math.max(acc, xs[e.v] + blockG.edge(e)); + }, 0); + } + + // Second pass, assign greatest coordinates + function pass2(elem) { + var min = blockG.outEdges(elem).reduce(function(acc, e) { + return Math.min(acc, xs[e.w] - blockG.edge(e)); + }, Number.POSITIVE_INFINITY); + + var node = g.node(elem); + if (min !== Number.POSITIVE_INFINITY && node.borderType !== borderType) { + xs[elem] = Math.max(xs[elem], min); + } + } + + iterate(pass1, blockG.predecessors.bind(blockG)); + iterate(pass2, blockG.successors.bind(blockG)); + + // Assign x coordinates to all nodes + _$3.forEach(align, function(v) { + xs[v] = xs[root[v]]; + }); + + return xs; +} + + +function buildBlockGraph(g, layering, root, reverseSep) { + var blockGraph = new Graph$3(), + graphLabel = g.graph(), + sepFn = sep(graphLabel.nodesep, graphLabel.edgesep, reverseSep); + + _$3.forEach(layering, function(layer) { + var u; + _$3.forEach(layer, function(v) { + var vRoot = root[v]; + blockGraph.setNode(vRoot); + if (u) { + var uRoot = root[u], + prevMax = blockGraph.edge(uRoot, vRoot); + blockGraph.setEdge(uRoot, vRoot, Math.max(sepFn(g, v, u), prevMax || 0)); + } + u = v; + }); + }); + + return blockGraph; +} + +/* + * Returns the alignment that has the smallest width of the given alignments. + */ +function findSmallestWidthAlignment(g, xss) { + return _$3.minBy(_$3.values(xss), function (xs) { + var max = Number.NEGATIVE_INFINITY; + var min = Number.POSITIVE_INFINITY; + + _$3.forIn(xs, function (x, v) { + var halfWidth = width(g, v) / 2; + + max = Math.max(x + halfWidth, max); + min = Math.min(x - halfWidth, min); + }); + + return max - min; + }); +} + +/* + * Align the coordinates of each of the layout alignments such that + * left-biased alignments have their minimum coordinate at the same point as + * the minimum coordinate of the smallest width alignment and right-biased + * alignments have their maximum coordinate at the same point as the maximum + * coordinate of the smallest width alignment. + */ +function alignCoordinates(xss, alignTo) { + var alignToVals = _$3.values(alignTo), + alignToMin = _$3.min(alignToVals), + alignToMax = _$3.max(alignToVals); + + _$3.forEach(["u", "d"], function(vert) { + _$3.forEach(["l", "r"], function(horiz) { + var alignment = vert + horiz, + xs = xss[alignment], + delta; + if (xs === alignTo) return; + + var xsVals = _$3.values(xs); + delta = horiz === "l" ? alignToMin - _$3.min(xsVals) : alignToMax - _$3.max(xsVals); + + if (delta) { + xss[alignment] = _$3.mapValues(xs, function(x) { return x + delta; }); + } + }); + }); +} + +function balance(xss, align) { + return _$3.mapValues(xss.ul, function(ignore, v) { + if (align) { + return xss[align.toLowerCase()][v]; + } else { + var xs = _$3.sortBy(_$3.map(xss, v)); + return (xs[1] + xs[2]) / 2; + } + }); +} + +function positionX$1(g) { + var layering = util$3.buildLayerMatrix(g); + var conflicts = _$3.merge( + findType1Conflicts(g, layering), + findType2Conflicts(g, layering)); + + var xss = {}; + var adjustedLayering; + _$3.forEach(["u", "d"], function(vert) { + adjustedLayering = vert === "u" ? layering : _$3.values(layering).reverse(); + _$3.forEach(["l", "r"], function(horiz) { + if (horiz === "r") { + adjustedLayering = _$3.map(adjustedLayering, function(inner) { + return _$3.values(inner).reverse(); + }); + } + + var neighborFn = (vert === "u" ? g.predecessors : g.successors).bind(g); + var align = verticalAlignment(g, adjustedLayering, conflicts, neighborFn); + var xs = horizontalCompaction(g, adjustedLayering, + align.root, align.align, horiz === "r"); + if (horiz === "r") { + xs = _$3.mapValues(xs, function(x) { return -x; }); + } + xss[vert + horiz] = xs; + }); + }); + + var smallestWidth = findSmallestWidthAlignment(g, xss); + alignCoordinates(xss, smallestWidth); + return balance(xss, g.graph().align); +} + +function sep(nodeSep, edgeSep, reverseSep) { + return function(g, v, w) { + var vLabel = g.node(v); + var wLabel = g.node(w); + var sum = 0; + var delta; + + sum += vLabel.width / 2; + if (_$3.has(vLabel, "labelpos")) { + switch (vLabel.labelpos.toLowerCase()) { + case "l": delta = -vLabel.width / 2; break; + case "r": delta = vLabel.width / 2; break; + } + } + if (delta) { + sum += reverseSep ? delta : -delta; + } + delta = 0; + + sum += (vLabel.dummy ? edgeSep : nodeSep) / 2; + sum += (wLabel.dummy ? edgeSep : nodeSep) / 2; + + sum += wLabel.width / 2; + if (_$3.has(wLabel, "labelpos")) { + switch (wLabel.labelpos.toLowerCase()) { + case "l": delta = wLabel.width / 2; break; + case "r": delta = -wLabel.width / 2; break; + } + } + if (delta) { + sum += reverseSep ? delta : -delta; + } + delta = 0; + + return sum; + }; +} + +function width(g, v) { + return g.node(v).width; +} + +var _$2 = lodash_1; +var util$2 = util$a; +var positionX = bk.positionX; + +var position_1 = position$1; + +function position$1(g) { + g = util$2.asNonCompoundGraph(g); + + positionY(g); + _$2.forEach(positionX(g), function(x, v) { + g.node(v).x = x; + }); +} + +function positionY(g) { + var layering = util$2.buildLayerMatrix(g); + var rankSep = g.graph().ranksep; + var prevY = 0; + _$2.forEach(layering, function(layer) { + var maxHeight = _$2.max(_$2.map(layer, function(v) { return g.node(v).height; })); + _$2.forEach(layer, function(v) { + g.node(v).y = prevY + maxHeight / 2; + }); + prevY += maxHeight + rankSep; + }); +} + +var _$1 = lodash_1; +var acyclic = acyclic$1; +var normalize$2 = normalize$3; +var rank = rank_1; +var normalizeRanks = util$a.normalizeRanks; +var parentDummyChains = parentDummyChains_1; +var removeEmptyRanks = util$a.removeEmptyRanks; +var nestingGraph = nestingGraph$1; +var addBorderSegments = addBorderSegments_1; +var coordinateSystem = coordinateSystem$1; +var order = order_1; +var position = position_1; +var util$1 = util$a; +var Graph$2 = graphlib_1.Graph; + +var layout_1 = layout$1; + +function layout$1(g, opts) { + var time = opts && opts.debugTiming ? util$1.time : util$1.notime; + time("layout", function() { + var layoutGraph = + time(" buildLayoutGraph", function() { return buildLayoutGraph(g); }); + time(" runLayout", function() { runLayout(layoutGraph, time); }); + time(" updateInputGraph", function() { updateInputGraph(g, layoutGraph); }); + }); +} + +function runLayout(g, time) { + time(" makeSpaceForEdgeLabels", function() { makeSpaceForEdgeLabels(g); }); + time(" removeSelfEdges", function() { removeSelfEdges(g); }); + time(" acyclic", function() { acyclic.run(g); }); + time(" nestingGraph.run", function() { nestingGraph.run(g); }); + time(" rank", function() { rank(util$1.asNonCompoundGraph(g)); }); + time(" injectEdgeLabelProxies", function() { injectEdgeLabelProxies(g); }); + time(" removeEmptyRanks", function() { removeEmptyRanks(g); }); + time(" nestingGraph.cleanup", function() { nestingGraph.cleanup(g); }); + time(" normalizeRanks", function() { normalizeRanks(g); }); + time(" assignRankMinMax", function() { assignRankMinMax(g); }); + time(" removeEdgeLabelProxies", function() { removeEdgeLabelProxies(g); }); + time(" normalize.run", function() { normalize$2.run(g); }); + time(" parentDummyChains", function() { parentDummyChains(g); }); + time(" addBorderSegments", function() { addBorderSegments(g); }); + time(" order", function() { order(g); }); + time(" insertSelfEdges", function() { insertSelfEdges(g); }); + time(" adjustCoordinateSystem", function() { coordinateSystem.adjust(g); }); + time(" position", function() { position(g); }); + time(" positionSelfEdges", function() { positionSelfEdges(g); }); + time(" removeBorderNodes", function() { removeBorderNodes(g); }); + time(" normalize.undo", function() { normalize$2.undo(g); }); + time(" fixupEdgeLabelCoords", function() { fixupEdgeLabelCoords(g); }); + time(" undoCoordinateSystem", function() { coordinateSystem.undo(g); }); + time(" translateGraph", function() { translateGraph(g); }); + time(" assignNodeIntersects", function() { assignNodeIntersects(g); }); + time(" reversePoints", function() { reversePointsForReversedEdges(g); }); + time(" acyclic.undo", function() { acyclic.undo(g); }); +} + +/* + * Copies final layout information from the layout graph back to the input + * graph. This process only copies whitelisted attributes from the layout graph + * to the input graph, so it serves as a good place to determine what + * attributes can influence layout. + */ +function updateInputGraph(inputGraph, layoutGraph) { + _$1.forEach(inputGraph.nodes(), function(v) { + var inputLabel = inputGraph.node(v); + var layoutLabel = layoutGraph.node(v); + + if (inputLabel) { + inputLabel.x = layoutLabel.x; + inputLabel.y = layoutLabel.y; + + if (layoutGraph.children(v).length) { + inputLabel.width = layoutLabel.width; + inputLabel.height = layoutLabel.height; + } + } + }); + + _$1.forEach(inputGraph.edges(), function(e) { + var inputLabel = inputGraph.edge(e); + var layoutLabel = layoutGraph.edge(e); + + inputLabel.points = layoutLabel.points; + if (_$1.has(layoutLabel, "x")) { + inputLabel.x = layoutLabel.x; + inputLabel.y = layoutLabel.y; + } + }); + + inputGraph.graph().width = layoutGraph.graph().width; + inputGraph.graph().height = layoutGraph.graph().height; +} + +var graphNumAttrs = ["nodesep", "edgesep", "ranksep", "marginx", "marginy"]; +var graphDefaults = { ranksep: 50, edgesep: 20, nodesep: 50, rankdir: "tb" }; +var graphAttrs = ["acyclicer", "ranker", "rankdir", "align"]; +var nodeNumAttrs = ["width", "height"]; +var nodeDefaults = { width: 0, height: 0 }; +var edgeNumAttrs = ["minlen", "weight", "width", "height", "labeloffset"]; +var edgeDefaults = { + minlen: 1, weight: 1, width: 0, height: 0, + labeloffset: 10, labelpos: "r" +}; +var edgeAttrs = ["labelpos"]; + +/* + * Constructs a new graph from the input graph, which can be used for layout. + * This process copies only whitelisted attributes from the input graph to the + * layout graph. Thus this function serves as a good place to determine what + * attributes can influence layout. + */ +function buildLayoutGraph(inputGraph) { + var g = new Graph$2({ multigraph: true, compound: true }); + var graph = canonicalize(inputGraph.graph()); + + g.setGraph(_$1.merge({}, + graphDefaults, + selectNumberAttrs(graph, graphNumAttrs), + _$1.pick(graph, graphAttrs))); + + _$1.forEach(inputGraph.nodes(), function(v) { + var node = canonicalize(inputGraph.node(v)); + g.setNode(v, _$1.defaults(selectNumberAttrs(node, nodeNumAttrs), nodeDefaults)); + g.setParent(v, inputGraph.parent(v)); + }); + + _$1.forEach(inputGraph.edges(), function(e) { + var edge = canonicalize(inputGraph.edge(e)); + g.setEdge(e, _$1.merge({}, + edgeDefaults, + selectNumberAttrs(edge, edgeNumAttrs), + _$1.pick(edge, edgeAttrs))); + }); + + return g; +} + +/* + * This idea comes from the Gansner paper: to account for edge labels in our + * layout we split each rank in half by doubling minlen and halving ranksep. + * Then we can place labels at these mid-points between nodes. + * + * We also add some minimal padding to the width to push the label for the edge + * away from the edge itself a bit. + */ +function makeSpaceForEdgeLabels(g) { + var graph = g.graph(); + graph.ranksep /= 2; + _$1.forEach(g.edges(), function(e) { + var edge = g.edge(e); + edge.minlen *= 2; + if (edge.labelpos.toLowerCase() !== "c") { + if (graph.rankdir === "TB" || graph.rankdir === "BT") { + edge.width += edge.labeloffset; + } else { + edge.height += edge.labeloffset; + } + } + }); +} + +/* + * Creates temporary dummy nodes that capture the rank in which each edge's + * label is going to, if it has one of non-zero width and height. We do this + * so that we can safely remove empty ranks while preserving balance for the + * label's position. + */ +function injectEdgeLabelProxies(g) { + _$1.forEach(g.edges(), function(e) { + var edge = g.edge(e); + if (edge.width && edge.height) { + var v = g.node(e.v); + var w = g.node(e.w); + var label = { rank: (w.rank - v.rank) / 2 + v.rank, e: e }; + util$1.addDummyNode(g, "edge-proxy", label, "_ep"); + } + }); +} + +function assignRankMinMax(g) { + var maxRank = 0; + _$1.forEach(g.nodes(), function(v) { + var node = g.node(v); + if (node.borderTop) { + node.minRank = g.node(node.borderTop).rank; + node.maxRank = g.node(node.borderBottom).rank; + maxRank = _$1.max(maxRank, node.maxRank); + } + }); + g.graph().maxRank = maxRank; +} + +function removeEdgeLabelProxies(g) { + _$1.forEach(g.nodes(), function(v) { + var node = g.node(v); + if (node.dummy === "edge-proxy") { + g.edge(node.e).labelRank = node.rank; + g.removeNode(v); + } + }); +} + +function translateGraph(g) { + var minX = Number.POSITIVE_INFINITY; + var maxX = 0; + var minY = Number.POSITIVE_INFINITY; + var maxY = 0; + var graphLabel = g.graph(); + var marginX = graphLabel.marginx || 0; + var marginY = graphLabel.marginy || 0; + + function getExtremes(attrs) { + var x = attrs.x; + var y = attrs.y; + var w = attrs.width; + var h = attrs.height; + minX = Math.min(minX, x - w / 2); + maxX = Math.max(maxX, x + w / 2); + minY = Math.min(minY, y - h / 2); + maxY = Math.max(maxY, y + h / 2); + } + + _$1.forEach(g.nodes(), function(v) { getExtremes(g.node(v)); }); + _$1.forEach(g.edges(), function(e) { + var edge = g.edge(e); + if (_$1.has(edge, "x")) { + getExtremes(edge); + } + }); + + minX -= marginX; + minY -= marginY; + + _$1.forEach(g.nodes(), function(v) { + var node = g.node(v); + node.x -= minX; + node.y -= minY; + }); + + _$1.forEach(g.edges(), function(e) { + var edge = g.edge(e); + _$1.forEach(edge.points, function(p) { + p.x -= minX; + p.y -= minY; + }); + if (_$1.has(edge, "x")) { edge.x -= minX; } + if (_$1.has(edge, "y")) { edge.y -= minY; } + }); + + graphLabel.width = maxX - minX + marginX; + graphLabel.height = maxY - minY + marginY; +} + +function assignNodeIntersects(g) { + _$1.forEach(g.edges(), function(e) { + var edge = g.edge(e); + var nodeV = g.node(e.v); + var nodeW = g.node(e.w); + var p1, p2; + if (!edge.points) { + edge.points = []; + p1 = nodeW; + p2 = nodeV; + } else { + p1 = edge.points[0]; + p2 = edge.points[edge.points.length - 1]; + } + edge.points.unshift(util$1.intersectRect(nodeV, p1)); + edge.points.push(util$1.intersectRect(nodeW, p2)); + }); +} + +function fixupEdgeLabelCoords(g) { + _$1.forEach(g.edges(), function(e) { + var edge = g.edge(e); + if (_$1.has(edge, "x")) { + if (edge.labelpos === "l" || edge.labelpos === "r") { + edge.width -= edge.labeloffset; + } + switch (edge.labelpos) { + case "l": edge.x -= edge.width / 2 + edge.labeloffset; break; + case "r": edge.x += edge.width / 2 + edge.labeloffset; break; + } + } + }); +} + +function reversePointsForReversedEdges(g) { + _$1.forEach(g.edges(), function(e) { + var edge = g.edge(e); + if (edge.reversed) { + edge.points.reverse(); + } + }); +} + +function removeBorderNodes(g) { + _$1.forEach(g.nodes(), function(v) { + if (g.children(v).length) { + var node = g.node(v); + var t = g.node(node.borderTop); + var b = g.node(node.borderBottom); + var l = g.node(_$1.last(node.borderLeft)); + var r = g.node(_$1.last(node.borderRight)); + + node.width = Math.abs(r.x - l.x); + node.height = Math.abs(b.y - t.y); + node.x = l.x + node.width / 2; + node.y = t.y + node.height / 2; + } + }); + + _$1.forEach(g.nodes(), function(v) { + if (g.node(v).dummy === "border") { + g.removeNode(v); + } + }); +} + +function removeSelfEdges(g) { + _$1.forEach(g.edges(), function(e) { + if (e.v === e.w) { + var node = g.node(e.v); + if (!node.selfEdges) { + node.selfEdges = []; + } + node.selfEdges.push({ e: e, label: g.edge(e) }); + g.removeEdge(e); + } + }); +} + +function insertSelfEdges(g) { + var layers = util$1.buildLayerMatrix(g); + _$1.forEach(layers, function(layer) { + var orderShift = 0; + _$1.forEach(layer, function(v, i) { + var node = g.node(v); + node.order = i + orderShift; + _$1.forEach(node.selfEdges, function(selfEdge) { + util$1.addDummyNode(g, "selfedge", { + width: selfEdge.label.width, + height: selfEdge.label.height, + rank: node.rank, + order: i + (++orderShift), + e: selfEdge.e, + label: selfEdge.label + }, "_se"); + }); + delete node.selfEdges; + }); + }); +} + +function positionSelfEdges(g) { + _$1.forEach(g.nodes(), function(v) { + var node = g.node(v); + if (node.dummy === "selfedge") { + var selfNode = g.node(node.e.v); + var x = selfNode.x + selfNode.width / 2; + var y = selfNode.y; + var dx = node.x - x; + var dy = selfNode.height / 2; + g.setEdge(node.e, node.label); + g.removeNode(v); + node.label.points = [ + { x: x + 2 * dx / 3, y: y - dy }, + { x: x + 5 * dx / 6, y: y - dy }, + { x: x + dx , y: y }, + { x: x + 5 * dx / 6, y: y + dy }, + { x: x + 2 * dx / 3, y: y + dy } + ]; + node.label.x = node.x; + node.label.y = node.y; + } + }); +} + +function selectNumberAttrs(obj, attrs) { + return _$1.mapValues(_$1.pick(obj, attrs), Number); +} + +function canonicalize(attrs) { + var newAttrs = {}; + _$1.forEach(attrs, function(v, k) { + newAttrs[k.toLowerCase()] = v; + }); + return newAttrs; +} + +var _ = lodash_1; +var util = util$a; +var Graph$1 = graphlib_1.Graph; + +var debug = { + debugOrdering: debugOrdering +}; + +/* istanbul ignore next */ +function debugOrdering(g) { + var layerMatrix = util.buildLayerMatrix(g); + + var h = new Graph$1({ compound: true, multigraph: true }).setGraph({}); + + _.forEach(g.nodes(), function(v) { + h.setNode(v, { label: v }); + h.setParent(v, "layer" + g.node(v).rank); + }); + + _.forEach(g.edges(), function(e) { + h.setEdge(e.v, e.w, {}, e.name); + }); + + _.forEach(layerMatrix, function(layer, i) { + var layerV = "layer" + i; + h.setNode(layerV, { rank: "same" }); + _.reduce(layer, function(u, v) { + h.setEdge(u, v, { style: "invis" }); + return v; + }); + }); + + return h; +} + +var version = "0.8.5"; + +/* +Copyright (c) 2012-2014 Chris Pettitt + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in +all copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN +THE SOFTWARE. +*/ + +var dagre = { + graphlib: graphlib_1, + + layout: layout_1, + debug: debug, + util: { + time: util$a.time, + notime: util$a.notime + }, + version: version +}; + +/** + * @fileOverview random layout + * @author shiwu.wyy@antfin.com + */ +/** + * 层次布局 + */ +class DagreLayout extends Base { + constructor(options) { + super(); + /** layout 方向, 可选 TB, BT, LR, RL */ + this.rankdir = "TB"; + /** 节点水平间距(px) */ + this.nodesep = 50; + /** 每一层节点之间间距 */ + this.ranksep = 50; + /** 是否保留布局连线的控制点 */ + this.controlPoints = false; + /** 每层节点是否根据节点数据中的 comboId 进行排序，以防止同层 combo 重叠 */ + this.sortByCombo = false; + this.nodes = []; + this.edges = []; + /** 迭代结束的回调函数 */ + this.onLayoutEnd = () => { }; + this.updateCfg(options); + } + getDefaultCfg() { + return { + rankdir: "TB", + align: undefined, + nodeSize: undefined, + nodesepFunc: undefined, + ranksepFunc: undefined, + nodesep: 50, + ranksep: 50, + controlPoints: false, // 是否保留布局连线的控制点 + }; + } + /** + * 执行布局 + */ + execute() { + const self = this; + const { nodes, nodeSize, rankdir, combos } = self; + if (!nodes) + return; + const edges = self.edges || []; + const g = new dagre.graphlib.Graph({ + multigraph: true, + compound: true, + }); + let nodeSizeFunc; + if (!nodeSize) { + nodeSizeFunc = (d) => { + if (d.size) { + if (isArray$l(d.size)) { + return d.size; + } + if (isObject$e(d.size)) { + return [d.size.width || 40, d.size.height || 40]; + } + return [d.size, d.size]; + } + return [40, 40]; + }; + } + else if (isArray$l(nodeSize)) { + nodeSizeFunc = () => nodeSize; + } + else { + nodeSizeFunc = () => [nodeSize, nodeSize]; + } + let horisep = getFunc(self.nodesepFunc, self.nodesep, 50); + let vertisep = getFunc(self.ranksepFunc, self.ranksep, 50); + if (rankdir === "LR" || rankdir === "RL") { + horisep = getFunc(self.ranksepFunc, self.ranksep, 50); + vertisep = getFunc(self.nodesepFunc, self.nodesep, 50); + } + g.setDefaultEdgeLabel(() => ({})); + g.setGraph(self); + const comboMap = {}; + nodes.filter((node) => node.layout !== false).forEach((node) => { + const size = nodeSizeFunc(node); + const verti = vertisep(node); + const hori = horisep(node); + const width = size[0] + 2 * hori; + const height = size[1] + 2 * verti; + g.setNode(node.id, { width, height }); + if (this.sortByCombo && node.comboId) { + if (!comboMap[node.comboId]) { + comboMap[node.comboId] = true; + g.setNode(node.comboId, {}); + } + g.setParent(node.id, node.comboId); + } + }); + if (this.sortByCombo && combos) { + combos.forEach((combo) => { + if (!combo.parentId) + return; + if (!comboMap[combo.parentId]) { + comboMap[combo.parentId] = true; + g.setNode(combo.parentId, {}); + } + g.setParent(combo.id, combo.parentId); + }); + } + edges.forEach((edge) => { + // dagrejs Wiki https://github.com/dagrejs/dagre/wiki#configuring-the-layout + const source = getEdgeTerminal(edge, 'source'); + const target = getEdgeTerminal(edge, 'target'); + g.setEdge(source, target, { + weight: edge.weight || 1, + }); + }); + dagre.layout(g); + let coord; + g.nodes().forEach((node) => { + coord = g.node(node); + const i = nodes.findIndex((it) => it.id === node); + if (!nodes[i]) + return; + nodes[i].x = coord.x; + nodes[i].y = coord.y; + }); + g.edges().forEach((edge) => { + coord = g.edge(edge); + const i = edges.findIndex((it) => { + const source = getEdgeTerminal(it, 'source'); + const target = getEdgeTerminal(it, 'target'); + return source === edge.v && target === edge.w; + }); + if (self.controlPoints && edges[i].type !== "loop") { + edges[i].controlPoints = coord.points.slice(1, coord.points.length - 1); + } + }); + if (self.onLayoutEnd) + self.onLayoutEnd(); + return { + nodes, + edges, + }; + } + getType() { + return "dagre"; + } +} +function getFunc(func, value, defaultValue) { + let resultFunc; + if (func) { + resultFunc = func; + } + else if (isNumber$2(value)) { + resultFunc = () => value; + } + else { + resultFunc = () => defaultValue; + } + return resultFunc; +} + +const toString$1 = Object.prototype.toString; + +function isAnyArray(object) { + return toString$1.call(object).endsWith('Array]'); +} + +function max$3(input) { + var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; + + if (!isAnyArray(input)) { + throw new TypeError('input must be an array'); + } + + if (input.length === 0) { + throw new TypeError('input must not be empty'); + } + + var _options$fromIndex = options.fromIndex, + fromIndex = _options$fromIndex === void 0 ? 0 : _options$fromIndex, + _options$toIndex = options.toIndex, + toIndex = _options$toIndex === void 0 ? input.length : _options$toIndex; + + if (fromIndex < 0 || fromIndex >= input.length || !Number.isInteger(fromIndex)) { + throw new Error('fromIndex must be a positive integer smaller than length'); + } + + if (toIndex <= fromIndex || toIndex > input.length || !Number.isInteger(toIndex)) { + throw new Error('toIndex must be an integer greater than fromIndex and at most equal to length'); + } + + var maxValue = input[fromIndex]; + + for (var i = fromIndex + 1; i < toIndex; i++) { + if (input[i] > maxValue) maxValue = input[i]; + } + + return maxValue; +} + +function min$2(input) { + var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; + + if (!isAnyArray(input)) { + throw new TypeError('input must be an array'); + } + + if (input.length === 0) { + throw new TypeError('input must not be empty'); + } + + var _options$fromIndex = options.fromIndex, + fromIndex = _options$fromIndex === void 0 ? 0 : _options$fromIndex, + _options$toIndex = options.toIndex, + toIndex = _options$toIndex === void 0 ? input.length : _options$toIndex; + + if (fromIndex < 0 || fromIndex >= input.length || !Number.isInteger(fromIndex)) { + throw new Error('fromIndex must be a positive integer smaller than length'); + } + + if (toIndex <= fromIndex || toIndex > input.length || !Number.isInteger(toIndex)) { + throw new Error('toIndex must be an integer greater than fromIndex and at most equal to length'); + } + + var minValue = input[fromIndex]; + + for (var i = fromIndex + 1; i < toIndex; i++) { + if (input[i] < minValue) minValue = input[i]; + } + + return minValue; +} + +function rescale(input) { + var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; + + if (!isAnyArray(input)) { + throw new TypeError('input must be an array'); + } else if (input.length === 0) { + throw new TypeError('input must not be empty'); + } + + var output; + + if (options.output !== undefined) { + if (!isAnyArray(options.output)) { + throw new TypeError('output option must be an array if specified'); + } + + output = options.output; + } else { + output = new Array(input.length); + } + + var currentMin = min$2(input); + var currentMax = max$3(input); + + if (currentMin === currentMax) { + throw new RangeError('minimum and maximum input values are equal. Cannot rescale a constant array'); + } + + var _options$min = options.min, + minValue = _options$min === void 0 ? options.autoMinMax ? currentMin : 0 : _options$min, + _options$max = options.max, + maxValue = _options$max === void 0 ? options.autoMinMax ? currentMax : 1 : _options$max; + + if (minValue >= maxValue) { + throw new RangeError('min option must be smaller than max option'); + } + + var factor = (maxValue - minValue) / (currentMax - currentMin); + + for (var i = 0; i < input.length; i++) { + output[i] = (input[i] - currentMin) * factor + minValue; + } + + return output; +} + +const indent = ' '.repeat(2); +const indentData = ' '.repeat(4); + +function inspectMatrix() { + return inspectMatrixWithOptions(this); +} + +function inspectMatrixWithOptions(matrix, options = {}) { + const { maxRows = 15, maxColumns = 10, maxNumSize = 8 } = options; + return `${matrix.constructor.name} { +${indent}[ +${indentData}${inspectData(matrix, maxRows, maxColumns, maxNumSize)} +${indent}] +${indent}rows: ${matrix.rows} +${indent}columns: ${matrix.columns} +}`; +} + +function inspectData(matrix, maxRows, maxColumns, maxNumSize) { + const { rows, columns } = matrix; + const maxI = Math.min(rows, maxRows); + const maxJ = Math.min(columns, maxColumns); + const result = []; + for (let i = 0; i < maxI; i++) { + let line = []; + for (let j = 0; j < maxJ; j++) { + line.push(formatNumber(matrix.get(i, j), maxNumSize)); + } + result.push(`${line.join(' ')}`); + } + if (maxJ !== columns) { + result[result.length - 1] += ` ... ${columns - maxColumns} more columns`; + } + if (maxI !== rows) { + result.push(`... ${rows - maxRows} more rows`); + } + return result.join(`\n${indentData}`); +} + +function formatNumber(num, maxNumSize) { + const numStr = String(num); + if (numStr.length <= maxNumSize) { + return numStr.padEnd(maxNumSize, ' '); + } + const precise = num.toPrecision(maxNumSize - 2); + if (precise.length <= maxNumSize) { + return precise; + } + const exponential = num.toExponential(maxNumSize - 2); + const eIndex = exponential.indexOf('e'); + const e = exponential.slice(eIndex); + return exponential.slice(0, maxNumSize - e.length) + e; +} + +function installMathOperations(AbstractMatrix, Matrix) { + AbstractMatrix.prototype.add = function add(value) { + if (typeof value === 'number') return this.addS(value); + return this.addM(value); + }; + + AbstractMatrix.prototype.addS = function addS(value) { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) + value); + } + } + return this; + }; + + AbstractMatrix.prototype.addM = function addM(matrix) { + matrix = Matrix.checkMatrix(matrix); + if (this.rows !== matrix.rows || + this.columns !== matrix.columns) { + throw new RangeError('Matrices dimensions must be equal'); + } + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) + matrix.get(i, j)); + } + } + return this; + }; + + AbstractMatrix.add = function add(matrix, value) { + const newMatrix = new Matrix(matrix); + return newMatrix.add(value); + }; + + AbstractMatrix.prototype.sub = function sub(value) { + if (typeof value === 'number') return this.subS(value); + return this.subM(value); + }; + + AbstractMatrix.prototype.subS = function subS(value) { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) - value); + } + } + return this; + }; + + AbstractMatrix.prototype.subM = function subM(matrix) { + matrix = Matrix.checkMatrix(matrix); + if (this.rows !== matrix.rows || + this.columns !== matrix.columns) { + throw new RangeError('Matrices dimensions must be equal'); + } + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) - matrix.get(i, j)); + } + } + return this; + }; + + AbstractMatrix.sub = function sub(matrix, value) { + const newMatrix = new Matrix(matrix); + return newMatrix.sub(value); + }; + AbstractMatrix.prototype.subtract = AbstractMatrix.prototype.sub; + AbstractMatrix.prototype.subtractS = AbstractMatrix.prototype.subS; + AbstractMatrix.prototype.subtractM = AbstractMatrix.prototype.subM; + AbstractMatrix.subtract = AbstractMatrix.sub; + + AbstractMatrix.prototype.mul = function mul(value) { + if (typeof value === 'number') return this.mulS(value); + return this.mulM(value); + }; + + AbstractMatrix.prototype.mulS = function mulS(value) { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) * value); + } + } + return this; + }; + + AbstractMatrix.prototype.mulM = function mulM(matrix) { + matrix = Matrix.checkMatrix(matrix); + if (this.rows !== matrix.rows || + this.columns !== matrix.columns) { + throw new RangeError('Matrices dimensions must be equal'); + } + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) * matrix.get(i, j)); + } + } + return this; + }; + + AbstractMatrix.mul = function mul(matrix, value) { + const newMatrix = new Matrix(matrix); + return newMatrix.mul(value); + }; + AbstractMatrix.prototype.multiply = AbstractMatrix.prototype.mul; + AbstractMatrix.prototype.multiplyS = AbstractMatrix.prototype.mulS; + AbstractMatrix.prototype.multiplyM = AbstractMatrix.prototype.mulM; + AbstractMatrix.multiply = AbstractMatrix.mul; + + AbstractMatrix.prototype.div = function div(value) { + if (typeof value === 'number') return this.divS(value); + return this.divM(value); + }; + + AbstractMatrix.prototype.divS = function divS(value) { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) / value); + } + } + return this; + }; + + AbstractMatrix.prototype.divM = function divM(matrix) { + matrix = Matrix.checkMatrix(matrix); + if (this.rows !== matrix.rows || + this.columns !== matrix.columns) { + throw new RangeError('Matrices dimensions must be equal'); + } + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) / matrix.get(i, j)); + } + } + return this; + }; + + AbstractMatrix.div = function div(matrix, value) { + const newMatrix = new Matrix(matrix); + return newMatrix.div(value); + }; + AbstractMatrix.prototype.divide = AbstractMatrix.prototype.div; + AbstractMatrix.prototype.divideS = AbstractMatrix.prototype.divS; + AbstractMatrix.prototype.divideM = AbstractMatrix.prototype.divM; + AbstractMatrix.divide = AbstractMatrix.div; + + AbstractMatrix.prototype.mod = function mod(value) { + if (typeof value === 'number') return this.modS(value); + return this.modM(value); + }; + + AbstractMatrix.prototype.modS = function modS(value) { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) % value); + } + } + return this; + }; + + AbstractMatrix.prototype.modM = function modM(matrix) { + matrix = Matrix.checkMatrix(matrix); + if (this.rows !== matrix.rows || + this.columns !== matrix.columns) { + throw new RangeError('Matrices dimensions must be equal'); + } + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) % matrix.get(i, j)); + } + } + return this; + }; + + AbstractMatrix.mod = function mod(matrix, value) { + const newMatrix = new Matrix(matrix); + return newMatrix.mod(value); + }; + AbstractMatrix.prototype.modulus = AbstractMatrix.prototype.mod; + AbstractMatrix.prototype.modulusS = AbstractMatrix.prototype.modS; + AbstractMatrix.prototype.modulusM = AbstractMatrix.prototype.modM; + AbstractMatrix.modulus = AbstractMatrix.mod; + + AbstractMatrix.prototype.and = function and(value) { + if (typeof value === 'number') return this.andS(value); + return this.andM(value); + }; + + AbstractMatrix.prototype.andS = function andS(value) { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) & value); + } + } + return this; + }; + + AbstractMatrix.prototype.andM = function andM(matrix) { + matrix = Matrix.checkMatrix(matrix); + if (this.rows !== matrix.rows || + this.columns !== matrix.columns) { + throw new RangeError('Matrices dimensions must be equal'); + } + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) & matrix.get(i, j)); + } + } + return this; + }; + + AbstractMatrix.and = function and(matrix, value) { + const newMatrix = new Matrix(matrix); + return newMatrix.and(value); + }; + + AbstractMatrix.prototype.or = function or(value) { + if (typeof value === 'number') return this.orS(value); + return this.orM(value); + }; + + AbstractMatrix.prototype.orS = function orS(value) { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) | value); + } + } + return this; + }; + + AbstractMatrix.prototype.orM = function orM(matrix) { + matrix = Matrix.checkMatrix(matrix); + if (this.rows !== matrix.rows || + this.columns !== matrix.columns) { + throw new RangeError('Matrices dimensions must be equal'); + } + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) | matrix.get(i, j)); + } + } + return this; + }; + + AbstractMatrix.or = function or(matrix, value) { + const newMatrix = new Matrix(matrix); + return newMatrix.or(value); + }; + + AbstractMatrix.prototype.xor = function xor(value) { + if (typeof value === 'number') return this.xorS(value); + return this.xorM(value); + }; + + AbstractMatrix.prototype.xorS = function xorS(value) { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) ^ value); + } + } + return this; + }; + + AbstractMatrix.prototype.xorM = function xorM(matrix) { + matrix = Matrix.checkMatrix(matrix); + if (this.rows !== matrix.rows || + this.columns !== matrix.columns) { + throw new RangeError('Matrices dimensions must be equal'); + } + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) ^ matrix.get(i, j)); + } + } + return this; + }; + + AbstractMatrix.xor = function xor(matrix, value) { + const newMatrix = new Matrix(matrix); + return newMatrix.xor(value); + }; + + AbstractMatrix.prototype.leftShift = function leftShift(value) { + if (typeof value === 'number') return this.leftShiftS(value); + return this.leftShiftM(value); + }; + + AbstractMatrix.prototype.leftShiftS = function leftShiftS(value) { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) << value); + } + } + return this; + }; + + AbstractMatrix.prototype.leftShiftM = function leftShiftM(matrix) { + matrix = Matrix.checkMatrix(matrix); + if (this.rows !== matrix.rows || + this.columns !== matrix.columns) { + throw new RangeError('Matrices dimensions must be equal'); + } + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) << matrix.get(i, j)); + } + } + return this; + }; + + AbstractMatrix.leftShift = function leftShift(matrix, value) { + const newMatrix = new Matrix(matrix); + return newMatrix.leftShift(value); + }; + + AbstractMatrix.prototype.signPropagatingRightShift = function signPropagatingRightShift(value) { + if (typeof value === 'number') return this.signPropagatingRightShiftS(value); + return this.signPropagatingRightShiftM(value); + }; + + AbstractMatrix.prototype.signPropagatingRightShiftS = function signPropagatingRightShiftS(value) { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) >> value); + } + } + return this; + }; + + AbstractMatrix.prototype.signPropagatingRightShiftM = function signPropagatingRightShiftM(matrix) { + matrix = Matrix.checkMatrix(matrix); + if (this.rows !== matrix.rows || + this.columns !== matrix.columns) { + throw new RangeError('Matrices dimensions must be equal'); + } + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) >> matrix.get(i, j)); + } + } + return this; + }; + + AbstractMatrix.signPropagatingRightShift = function signPropagatingRightShift(matrix, value) { + const newMatrix = new Matrix(matrix); + return newMatrix.signPropagatingRightShift(value); + }; + + AbstractMatrix.prototype.rightShift = function rightShift(value) { + if (typeof value === 'number') return this.rightShiftS(value); + return this.rightShiftM(value); + }; + + AbstractMatrix.prototype.rightShiftS = function rightShiftS(value) { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) >>> value); + } + } + return this; + }; + + AbstractMatrix.prototype.rightShiftM = function rightShiftM(matrix) { + matrix = Matrix.checkMatrix(matrix); + if (this.rows !== matrix.rows || + this.columns !== matrix.columns) { + throw new RangeError('Matrices dimensions must be equal'); + } + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) >>> matrix.get(i, j)); + } + } + return this; + }; + + AbstractMatrix.rightShift = function rightShift(matrix, value) { + const newMatrix = new Matrix(matrix); + return newMatrix.rightShift(value); + }; + AbstractMatrix.prototype.zeroFillRightShift = AbstractMatrix.prototype.rightShift; + AbstractMatrix.prototype.zeroFillRightShiftS = AbstractMatrix.prototype.rightShiftS; + AbstractMatrix.prototype.zeroFillRightShiftM = AbstractMatrix.prototype.rightShiftM; + AbstractMatrix.zeroFillRightShift = AbstractMatrix.rightShift; + + AbstractMatrix.prototype.not = function not() { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, ~(this.get(i, j))); + } + } + return this; + }; + + AbstractMatrix.not = function not(matrix) { + const newMatrix = new Matrix(matrix); + return newMatrix.not(); + }; + + AbstractMatrix.prototype.abs = function abs() { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.abs(this.get(i, j))); + } + } + return this; + }; + + AbstractMatrix.abs = function abs(matrix) { + const newMatrix = new Matrix(matrix); + return newMatrix.abs(); + }; + + AbstractMatrix.prototype.acos = function acos() { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.acos(this.get(i, j))); + } + } + return this; + }; + + AbstractMatrix.acos = function acos(matrix) { + const newMatrix = new Matrix(matrix); + return newMatrix.acos(); + }; + + AbstractMatrix.prototype.acosh = function acosh() { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.acosh(this.get(i, j))); + } + } + return this; + }; + + AbstractMatrix.acosh = function acosh(matrix) { + const newMatrix = new Matrix(matrix); + return newMatrix.acosh(); + }; + + AbstractMatrix.prototype.asin = function asin() { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.asin(this.get(i, j))); + } + } + return this; + }; + + AbstractMatrix.asin = function asin(matrix) { + const newMatrix = new Matrix(matrix); + return newMatrix.asin(); + }; + + AbstractMatrix.prototype.asinh = function asinh() { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.asinh(this.get(i, j))); + } + } + return this; + }; + + AbstractMatrix.asinh = function asinh(matrix) { + const newMatrix = new Matrix(matrix); + return newMatrix.asinh(); + }; + + AbstractMatrix.prototype.atan = function atan() { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.atan(this.get(i, j))); + } + } + return this; + }; + + AbstractMatrix.atan = function atan(matrix) { + const newMatrix = new Matrix(matrix); + return newMatrix.atan(); + }; + + AbstractMatrix.prototype.atanh = function atanh() { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.atanh(this.get(i, j))); + } + } + return this; + }; + + AbstractMatrix.atanh = function atanh(matrix) { + const newMatrix = new Matrix(matrix); + return newMatrix.atanh(); + }; + + AbstractMatrix.prototype.cbrt = function cbrt() { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.cbrt(this.get(i, j))); + } + } + return this; + }; + + AbstractMatrix.cbrt = function cbrt(matrix) { + const newMatrix = new Matrix(matrix); + return newMatrix.cbrt(); + }; + + AbstractMatrix.prototype.ceil = function ceil() { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.ceil(this.get(i, j))); + } + } + return this; + }; + + AbstractMatrix.ceil = function ceil(matrix) { + const newMatrix = new Matrix(matrix); + return newMatrix.ceil(); + }; + + AbstractMatrix.prototype.clz32 = function clz32() { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.clz32(this.get(i, j))); + } + } + return this; + }; + + AbstractMatrix.clz32 = function clz32(matrix) { + const newMatrix = new Matrix(matrix); + return newMatrix.clz32(); + }; + + AbstractMatrix.prototype.cos = function cos() { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.cos(this.get(i, j))); + } + } + return this; + }; + + AbstractMatrix.cos = function cos(matrix) { + const newMatrix = new Matrix(matrix); + return newMatrix.cos(); + }; + + AbstractMatrix.prototype.cosh = function cosh() { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.cosh(this.get(i, j))); + } + } + return this; + }; + + AbstractMatrix.cosh = function cosh(matrix) { + const newMatrix = new Matrix(matrix); + return newMatrix.cosh(); + }; + + AbstractMatrix.prototype.exp = function exp() { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.exp(this.get(i, j))); + } + } + return this; + }; + + AbstractMatrix.exp = function exp(matrix) { + const newMatrix = new Matrix(matrix); + return newMatrix.exp(); + }; + + AbstractMatrix.prototype.expm1 = function expm1() { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.expm1(this.get(i, j))); + } + } + return this; + }; + + AbstractMatrix.expm1 = function expm1(matrix) { + const newMatrix = new Matrix(matrix); + return newMatrix.expm1(); + }; + + AbstractMatrix.prototype.floor = function floor() { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.floor(this.get(i, j))); + } + } + return this; + }; + + AbstractMatrix.floor = function floor(matrix) { + const newMatrix = new Matrix(matrix); + return newMatrix.floor(); + }; + + AbstractMatrix.prototype.fround = function fround() { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.fround(this.get(i, j))); + } + } + return this; + }; + + AbstractMatrix.fround = function fround(matrix) { + const newMatrix = new Matrix(matrix); + return newMatrix.fround(); + }; + + AbstractMatrix.prototype.log = function log() { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.log(this.get(i, j))); + } + } + return this; + }; + + AbstractMatrix.log = function log(matrix) { + const newMatrix = new Matrix(matrix); + return newMatrix.log(); + }; + + AbstractMatrix.prototype.log1p = function log1p() { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.log1p(this.get(i, j))); + } + } + return this; + }; + + AbstractMatrix.log1p = function log1p(matrix) { + const newMatrix = new Matrix(matrix); + return newMatrix.log1p(); + }; + + AbstractMatrix.prototype.log10 = function log10() { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.log10(this.get(i, j))); + } + } + return this; + }; + + AbstractMatrix.log10 = function log10(matrix) { + const newMatrix = new Matrix(matrix); + return newMatrix.log10(); + }; + + AbstractMatrix.prototype.log2 = function log2() { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.log2(this.get(i, j))); + } + } + return this; + }; + + AbstractMatrix.log2 = function log2(matrix) { + const newMatrix = new Matrix(matrix); + return newMatrix.log2(); + }; + + AbstractMatrix.prototype.round = function round() { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.round(this.get(i, j))); + } + } + return this; + }; + + AbstractMatrix.round = function round(matrix) { + const newMatrix = new Matrix(matrix); + return newMatrix.round(); + }; + + AbstractMatrix.prototype.sign = function sign() { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.sign(this.get(i, j))); + } + } + return this; + }; + + AbstractMatrix.sign = function sign(matrix) { + const newMatrix = new Matrix(matrix); + return newMatrix.sign(); + }; + + AbstractMatrix.prototype.sin = function sin() { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.sin(this.get(i, j))); + } + } + return this; + }; + + AbstractMatrix.sin = function sin(matrix) { + const newMatrix = new Matrix(matrix); + return newMatrix.sin(); + }; + + AbstractMatrix.prototype.sinh = function sinh() { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.sinh(this.get(i, j))); + } + } + return this; + }; + + AbstractMatrix.sinh = function sinh(matrix) { + const newMatrix = new Matrix(matrix); + return newMatrix.sinh(); + }; + + AbstractMatrix.prototype.sqrt = function sqrt() { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.sqrt(this.get(i, j))); + } + } + return this; + }; + + AbstractMatrix.sqrt = function sqrt(matrix) { + const newMatrix = new Matrix(matrix); + return newMatrix.sqrt(); + }; + + AbstractMatrix.prototype.tan = function tan() { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.tan(this.get(i, j))); + } + } + return this; + }; + + AbstractMatrix.tan = function tan(matrix) { + const newMatrix = new Matrix(matrix); + return newMatrix.tan(); + }; + + AbstractMatrix.prototype.tanh = function tanh() { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.tanh(this.get(i, j))); + } + } + return this; + }; + + AbstractMatrix.tanh = function tanh(matrix) { + const newMatrix = new Matrix(matrix); + return newMatrix.tanh(); + }; + + AbstractMatrix.prototype.trunc = function trunc() { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.trunc(this.get(i, j))); + } + } + return this; + }; + + AbstractMatrix.trunc = function trunc(matrix) { + const newMatrix = new Matrix(matrix); + return newMatrix.trunc(); + }; + + AbstractMatrix.pow = function pow(matrix, arg0) { + const newMatrix = new Matrix(matrix); + return newMatrix.pow(arg0); + }; + + AbstractMatrix.prototype.pow = function pow(value) { + if (typeof value === 'number') return this.powS(value); + return this.powM(value); + }; + + AbstractMatrix.prototype.powS = function powS(value) { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.pow(this.get(i, j), value)); + } + } + return this; + }; + + AbstractMatrix.prototype.powM = function powM(matrix) { + matrix = Matrix.checkMatrix(matrix); + if (this.rows !== matrix.rows || + this.columns !== matrix.columns) { + throw new RangeError('Matrices dimensions must be equal'); + } + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, Math.pow(this.get(i, j), matrix.get(i, j))); + } + } + return this; + }; +} + +/** + * @private + * Check that a row index is not out of bounds + * @param {Matrix} matrix + * @param {number} index + * @param {boolean} [outer] + */ +function checkRowIndex(matrix, index, outer) { + let max = outer ? matrix.rows : matrix.rows - 1; + if (index < 0 || index > max) { + throw new RangeError('Row index out of range'); + } +} + +/** + * @private + * Check that a column index is not out of bounds + * @param {Matrix} matrix + * @param {number} index + * @param {boolean} [outer] + */ +function checkColumnIndex(matrix, index, outer) { + let max = outer ? matrix.columns : matrix.columns - 1; + if (index < 0 || index > max) { + throw new RangeError('Column index out of range'); + } +} + +/** + * @private + * Check that the provided vector is an array with the right length + * @param {Matrix} matrix + * @param {Array|Matrix} vector + * @return {Array} + * @throws {RangeError} + */ +function checkRowVector(matrix, vector) { + if (vector.to1DArray) { + vector = vector.to1DArray(); + } + if (vector.length !== matrix.columns) { + throw new RangeError( + 'vector size must be the same as the number of columns', + ); + } + return vector; +} + +/** + * @private + * Check that the provided vector is an array with the right length + * @param {Matrix} matrix + * @param {Array|Matrix} vector + * @return {Array} + * @throws {RangeError} + */ +function checkColumnVector(matrix, vector) { + if (vector.to1DArray) { + vector = vector.to1DArray(); + } + if (vector.length !== matrix.rows) { + throw new RangeError('vector size must be the same as the number of rows'); + } + return vector; +} + +function checkIndices(matrix, rowIndices, columnIndices) { + return { + row: checkRowIndices(matrix, rowIndices), + column: checkColumnIndices(matrix, columnIndices), + }; +} + +function checkRowIndices(matrix, rowIndices) { + if (typeof rowIndices !== 'object') { + throw new TypeError('unexpected type for row indices'); + } + + let rowOut = rowIndices.some((r) => { + return r < 0 || r >= matrix.rows; + }); + + if (rowOut) { + throw new RangeError('row indices are out of range'); + } + + if (!Array.isArray(rowIndices)) rowIndices = Array.from(rowIndices); + + return rowIndices; +} + +function checkColumnIndices(matrix, columnIndices) { + if (typeof columnIndices !== 'object') { + throw new TypeError('unexpected type for column indices'); + } + + let columnOut = columnIndices.some((c) => { + return c < 0 || c >= matrix.columns; + }); + + if (columnOut) { + throw new RangeError('column indices are out of range'); + } + if (!Array.isArray(columnIndices)) columnIndices = Array.from(columnIndices); + + return columnIndices; +} + +function checkRange(matrix, startRow, endRow, startColumn, endColumn) { + if (arguments.length !== 5) { + throw new RangeError('expected 4 arguments'); + } + checkNumber('startRow', startRow); + checkNumber('endRow', endRow); + checkNumber('startColumn', startColumn); + checkNumber('endColumn', endColumn); + if ( + startRow > endRow || + startColumn > endColumn || + startRow < 0 || + startRow >= matrix.rows || + endRow < 0 || + endRow >= matrix.rows || + startColumn < 0 || + startColumn >= matrix.columns || + endColumn < 0 || + endColumn >= matrix.columns + ) { + throw new RangeError('Submatrix indices are out of range'); + } +} + +function newArray(length, value = 0) { + let array = []; + for (let i = 0; i < length; i++) { + array.push(value); + } + return array; +} + +function checkNumber(name, value) { + if (typeof value !== 'number') { + throw new TypeError(`${name} must be a number`); + } +} + +function checkNonEmpty(matrix) { + if (matrix.isEmpty()) { + throw new Error('Empty matrix has no elements to index'); + } +} + +function sumByRow(matrix) { + let sum = newArray(matrix.rows); + for (let i = 0; i < matrix.rows; ++i) { + for (let j = 0; j < matrix.columns; ++j) { + sum[i] += matrix.get(i, j); + } + } + return sum; +} + +function sumByColumn(matrix) { + let sum = newArray(matrix.columns); + for (let i = 0; i < matrix.rows; ++i) { + for (let j = 0; j < matrix.columns; ++j) { + sum[j] += matrix.get(i, j); + } + } + return sum; +} + +function sumAll(matrix) { + let v = 0; + for (let i = 0; i < matrix.rows; i++) { + for (let j = 0; j < matrix.columns; j++) { + v += matrix.get(i, j); + } + } + return v; +} + +function productByRow(matrix) { + let sum = newArray(matrix.rows, 1); + for (let i = 0; i < matrix.rows; ++i) { + for (let j = 0; j < matrix.columns; ++j) { + sum[i] *= matrix.get(i, j); + } + } + return sum; +} + +function productByColumn(matrix) { + let sum = newArray(matrix.columns, 1); + for (let i = 0; i < matrix.rows; ++i) { + for (let j = 0; j < matrix.columns; ++j) { + sum[j] *= matrix.get(i, j); + } + } + return sum; +} + +function productAll(matrix) { + let v = 1; + for (let i = 0; i < matrix.rows; i++) { + for (let j = 0; j < matrix.columns; j++) { + v *= matrix.get(i, j); + } + } + return v; +} + +function varianceByRow(matrix, unbiased, mean) { + const rows = matrix.rows; + const cols = matrix.columns; + const variance = []; + + for (let i = 0; i < rows; i++) { + let sum1 = 0; + let sum2 = 0; + let x = 0; + for (let j = 0; j < cols; j++) { + x = matrix.get(i, j) - mean[i]; + sum1 += x; + sum2 += x * x; + } + if (unbiased) { + variance.push((sum2 - (sum1 * sum1) / cols) / (cols - 1)); + } else { + variance.push((sum2 - (sum1 * sum1) / cols) / cols); + } + } + return variance; +} + +function varianceByColumn(matrix, unbiased, mean) { + const rows = matrix.rows; + const cols = matrix.columns; + const variance = []; + + for (let j = 0; j < cols; j++) { + let sum1 = 0; + let sum2 = 0; + let x = 0; + for (let i = 0; i < rows; i++) { + x = matrix.get(i, j) - mean[j]; + sum1 += x; + sum2 += x * x; + } + if (unbiased) { + variance.push((sum2 - (sum1 * sum1) / rows) / (rows - 1)); + } else { + variance.push((sum2 - (sum1 * sum1) / rows) / rows); + } + } + return variance; +} + +function varianceAll(matrix, unbiased, mean) { + const rows = matrix.rows; + const cols = matrix.columns; + const size = rows * cols; + + let sum1 = 0; + let sum2 = 0; + let x = 0; + for (let i = 0; i < rows; i++) { + for (let j = 0; j < cols; j++) { + x = matrix.get(i, j) - mean; + sum1 += x; + sum2 += x * x; + } + } + if (unbiased) { + return (sum2 - (sum1 * sum1) / size) / (size - 1); + } else { + return (sum2 - (sum1 * sum1) / size) / size; + } +} + +function centerByRow(matrix, mean) { + for (let i = 0; i < matrix.rows; i++) { + for (let j = 0; j < matrix.columns; j++) { + matrix.set(i, j, matrix.get(i, j) - mean[i]); + } + } +} + +function centerByColumn(matrix, mean) { + for (let i = 0; i < matrix.rows; i++) { + for (let j = 0; j < matrix.columns; j++) { + matrix.set(i, j, matrix.get(i, j) - mean[j]); + } + } +} + +function centerAll(matrix, mean) { + for (let i = 0; i < matrix.rows; i++) { + for (let j = 0; j < matrix.columns; j++) { + matrix.set(i, j, matrix.get(i, j) - mean); + } + } +} + +function getScaleByRow(matrix) { + const scale = []; + for (let i = 0; i < matrix.rows; i++) { + let sum = 0; + for (let j = 0; j < matrix.columns; j++) { + sum += Math.pow(matrix.get(i, j), 2) / (matrix.columns - 1); + } + scale.push(Math.sqrt(sum)); + } + return scale; +} + +function scaleByRow(matrix, scale) { + for (let i = 0; i < matrix.rows; i++) { + for (let j = 0; j < matrix.columns; j++) { + matrix.set(i, j, matrix.get(i, j) / scale[i]); + } + } +} + +function getScaleByColumn(matrix) { + const scale = []; + for (let j = 0; j < matrix.columns; j++) { + let sum = 0; + for (let i = 0; i < matrix.rows; i++) { + sum += Math.pow(matrix.get(i, j), 2) / (matrix.rows - 1); + } + scale.push(Math.sqrt(sum)); + } + return scale; +} + +function scaleByColumn(matrix, scale) { + for (let i = 0; i < matrix.rows; i++) { + for (let j = 0; j < matrix.columns; j++) { + matrix.set(i, j, matrix.get(i, j) / scale[j]); + } + } +} + +function getScaleAll(matrix) { + const divider = matrix.size - 1; + let sum = 0; + for (let j = 0; j < matrix.columns; j++) { + for (let i = 0; i < matrix.rows; i++) { + sum += Math.pow(matrix.get(i, j), 2) / divider; + } + } + return Math.sqrt(sum); +} + +function scaleAll(matrix, scale) { + for (let i = 0; i < matrix.rows; i++) { + for (let j = 0; j < matrix.columns; j++) { + matrix.set(i, j, matrix.get(i, j) / scale); + } + } +} + +class AbstractMatrix { + static from1DArray(newRows, newColumns, newData) { + let length = newRows * newColumns; + if (length !== newData.length) { + throw new RangeError('data length does not match given dimensions'); + } + let newMatrix = new Matrix(newRows, newColumns); + for (let row = 0; row < newRows; row++) { + for (let column = 0; column < newColumns; column++) { + newMatrix.set(row, column, newData[row * newColumns + column]); + } + } + return newMatrix; + } + + static rowVector(newData) { + let vector = new Matrix(1, newData.length); + for (let i = 0; i < newData.length; i++) { + vector.set(0, i, newData[i]); + } + return vector; + } + + static columnVector(newData) { + let vector = new Matrix(newData.length, 1); + for (let i = 0; i < newData.length; i++) { + vector.set(i, 0, newData[i]); + } + return vector; + } + + static zeros(rows, columns) { + return new Matrix(rows, columns); + } + + static ones(rows, columns) { + return new Matrix(rows, columns).fill(1); + } + + static rand(rows, columns, options = {}) { + if (typeof options !== 'object') { + throw new TypeError('options must be an object'); + } + const { random = Math.random } = options; + let matrix = new Matrix(rows, columns); + for (let i = 0; i < rows; i++) { + for (let j = 0; j < columns; j++) { + matrix.set(i, j, random()); + } + } + return matrix; + } + + static randInt(rows, columns, options = {}) { + if (typeof options !== 'object') { + throw new TypeError('options must be an object'); + } + const { min = 0, max = 1000, random = Math.random } = options; + if (!Number.isInteger(min)) throw new TypeError('min must be an integer'); + if (!Number.isInteger(max)) throw new TypeError('max must be an integer'); + if (min >= max) throw new RangeError('min must be smaller than max'); + let interval = max - min; + let matrix = new Matrix(rows, columns); + for (let i = 0; i < rows; i++) { + for (let j = 0; j < columns; j++) { + let value = min + Math.round(random() * interval); + matrix.set(i, j, value); + } + } + return matrix; + } + + static eye(rows, columns, value) { + if (columns === undefined) columns = rows; + if (value === undefined) value = 1; + let min = Math.min(rows, columns); + let matrix = this.zeros(rows, columns); + for (let i = 0; i < min; i++) { + matrix.set(i, i, value); + } + return matrix; + } + + static diag(data, rows, columns) { + let l = data.length; + if (rows === undefined) rows = l; + if (columns === undefined) columns = rows; + let min = Math.min(l, rows, columns); + let matrix = this.zeros(rows, columns); + for (let i = 0; i < min; i++) { + matrix.set(i, i, data[i]); + } + return matrix; + } + + static min(matrix1, matrix2) { + matrix1 = this.checkMatrix(matrix1); + matrix2 = this.checkMatrix(matrix2); + let rows = matrix1.rows; + let columns = matrix1.columns; + let result = new Matrix(rows, columns); + for (let i = 0; i < rows; i++) { + for (let j = 0; j < columns; j++) { + result.set(i, j, Math.min(matrix1.get(i, j), matrix2.get(i, j))); + } + } + return result; + } + + static max(matrix1, matrix2) { + matrix1 = this.checkMatrix(matrix1); + matrix2 = this.checkMatrix(matrix2); + let rows = matrix1.rows; + let columns = matrix1.columns; + let result = new this(rows, columns); + for (let i = 0; i < rows; i++) { + for (let j = 0; j < columns; j++) { + result.set(i, j, Math.max(matrix1.get(i, j), matrix2.get(i, j))); + } + } + return result; + } + + static checkMatrix(value) { + return AbstractMatrix.isMatrix(value) ? value : new Matrix(value); + } + + static isMatrix(value) { + return value != null && value.klass === 'Matrix'; + } + + get size() { + return this.rows * this.columns; + } + + apply(callback) { + if (typeof callback !== 'function') { + throw new TypeError('callback must be a function'); + } + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + callback.call(this, i, j); + } + } + return this; + } + + to1DArray() { + let array = []; + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + array.push(this.get(i, j)); + } + } + return array; + } + + to2DArray() { + let copy = []; + for (let i = 0; i < this.rows; i++) { + copy.push([]); + for (let j = 0; j < this.columns; j++) { + copy[i].push(this.get(i, j)); + } + } + return copy; + } + + toJSON() { + return this.to2DArray(); + } + + isRowVector() { + return this.rows === 1; + } + + isColumnVector() { + return this.columns === 1; + } + + isVector() { + return this.rows === 1 || this.columns === 1; + } + + isSquare() { + return this.rows === this.columns; + } + + isEmpty() { + return this.rows === 0 || this.columns === 0; + } + + isSymmetric() { + if (this.isSquare()) { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j <= i; j++) { + if (this.get(i, j) !== this.get(j, i)) { + return false; + } + } + } + return true; + } + return false; + } + + isEchelonForm() { + let i = 0; + let j = 0; + let previousColumn = -1; + let isEchelonForm = true; + let checked = false; + while (i < this.rows && isEchelonForm) { + j = 0; + checked = false; + while (j < this.columns && checked === false) { + if (this.get(i, j) === 0) { + j++; + } else if (this.get(i, j) === 1 && j > previousColumn) { + checked = true; + previousColumn = j; + } else { + isEchelonForm = false; + checked = true; + } + } + i++; + } + return isEchelonForm; + } + + isReducedEchelonForm() { + let i = 0; + let j = 0; + let previousColumn = -1; + let isReducedEchelonForm = true; + let checked = false; + while (i < this.rows && isReducedEchelonForm) { + j = 0; + checked = false; + while (j < this.columns && checked === false) { + if (this.get(i, j) === 0) { + j++; + } else if (this.get(i, j) === 1 && j > previousColumn) { + checked = true; + previousColumn = j; + } else { + isReducedEchelonForm = false; + checked = true; + } + } + for (let k = j + 1; k < this.rows; k++) { + if (this.get(i, k) !== 0) { + isReducedEchelonForm = false; + } + } + i++; + } + return isReducedEchelonForm; + } + + echelonForm() { + let result = this.clone(); + let h = 0; + let k = 0; + while (h < result.rows && k < result.columns) { + let iMax = h; + for (let i = h; i < result.rows; i++) { + if (result.get(i, k) > result.get(iMax, k)) { + iMax = i; + } + } + if (result.get(iMax, k) === 0) { + k++; + } else { + result.swapRows(h, iMax); + let tmp = result.get(h, k); + for (let j = k; j < result.columns; j++) { + result.set(h, j, result.get(h, j) / tmp); + } + for (let i = h + 1; i < result.rows; i++) { + let factor = result.get(i, k) / result.get(h, k); + result.set(i, k, 0); + for (let j = k + 1; j < result.columns; j++) { + result.set(i, j, result.get(i, j) - result.get(h, j) * factor); + } + } + h++; + k++; + } + } + return result; + } + + reducedEchelonForm() { + let result = this.echelonForm(); + let m = result.columns; + let n = result.rows; + let h = n - 1; + while (h >= 0) { + if (result.maxRow(h) === 0) { + h--; + } else { + let p = 0; + let pivot = false; + while (p < n && pivot === false) { + if (result.get(h, p) === 1) { + pivot = true; + } else { + p++; + } + } + for (let i = 0; i < h; i++) { + let factor = result.get(i, p); + for (let j = p; j < m; j++) { + let tmp = result.get(i, j) - factor * result.get(h, j); + result.set(i, j, tmp); + } + } + h--; + } + } + return result; + } + + set() { + throw new Error('set method is unimplemented'); + } + + get() { + throw new Error('get method is unimplemented'); + } + + repeat(options = {}) { + if (typeof options !== 'object') { + throw new TypeError('options must be an object'); + } + const { rows = 1, columns = 1 } = options; + if (!Number.isInteger(rows) || rows <= 0) { + throw new TypeError('rows must be a positive integer'); + } + if (!Number.isInteger(columns) || columns <= 0) { + throw new TypeError('columns must be a positive integer'); + } + let matrix = new Matrix(this.rows * rows, this.columns * columns); + for (let i = 0; i < rows; i++) { + for (let j = 0; j < columns; j++) { + matrix.setSubMatrix(this, this.rows * i, this.columns * j); + } + } + return matrix; + } + + fill(value) { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, value); + } + } + return this; + } + + neg() { + return this.mulS(-1); + } + + getRow(index) { + checkRowIndex(this, index); + let row = []; + for (let i = 0; i < this.columns; i++) { + row.push(this.get(index, i)); + } + return row; + } + + getRowVector(index) { + return Matrix.rowVector(this.getRow(index)); + } + + setRow(index, array) { + checkRowIndex(this, index); + array = checkRowVector(this, array); + for (let i = 0; i < this.columns; i++) { + this.set(index, i, array[i]); + } + return this; + } + + swapRows(row1, row2) { + checkRowIndex(this, row1); + checkRowIndex(this, row2); + for (let i = 0; i < this.columns; i++) { + let temp = this.get(row1, i); + this.set(row1, i, this.get(row2, i)); + this.set(row2, i, temp); + } + return this; + } + + getColumn(index) { + checkColumnIndex(this, index); + let column = []; + for (let i = 0; i < this.rows; i++) { + column.push(this.get(i, index)); + } + return column; + } + + getColumnVector(index) { + return Matrix.columnVector(this.getColumn(index)); + } + + setColumn(index, array) { + checkColumnIndex(this, index); + array = checkColumnVector(this, array); + for (let i = 0; i < this.rows; i++) { + this.set(i, index, array[i]); + } + return this; + } + + swapColumns(column1, column2) { + checkColumnIndex(this, column1); + checkColumnIndex(this, column2); + for (let i = 0; i < this.rows; i++) { + let temp = this.get(i, column1); + this.set(i, column1, this.get(i, column2)); + this.set(i, column2, temp); + } + return this; + } + + addRowVector(vector) { + vector = checkRowVector(this, vector); + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) + vector[j]); + } + } + return this; + } + + subRowVector(vector) { + vector = checkRowVector(this, vector); + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) - vector[j]); + } + } + return this; + } + + mulRowVector(vector) { + vector = checkRowVector(this, vector); + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) * vector[j]); + } + } + return this; + } + + divRowVector(vector) { + vector = checkRowVector(this, vector); + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) / vector[j]); + } + } + return this; + } + + addColumnVector(vector) { + vector = checkColumnVector(this, vector); + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) + vector[i]); + } + } + return this; + } + + subColumnVector(vector) { + vector = checkColumnVector(this, vector); + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) - vector[i]); + } + } + return this; + } + + mulColumnVector(vector) { + vector = checkColumnVector(this, vector); + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) * vector[i]); + } + } + return this; + } + + divColumnVector(vector) { + vector = checkColumnVector(this, vector); + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + this.set(i, j, this.get(i, j) / vector[i]); + } + } + return this; + } + + mulRow(index, value) { + checkRowIndex(this, index); + for (let i = 0; i < this.columns; i++) { + this.set(index, i, this.get(index, i) * value); + } + return this; + } + + mulColumn(index, value) { + checkColumnIndex(this, index); + for (let i = 0; i < this.rows; i++) { + this.set(i, index, this.get(i, index) * value); + } + return this; + } + + max() { + if (this.isEmpty()) { + return NaN; + } + let v = this.get(0, 0); + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + if (this.get(i, j) > v) { + v = this.get(i, j); + } + } + } + return v; + } + + maxIndex() { + checkNonEmpty(this); + let v = this.get(0, 0); + let idx = [0, 0]; + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + if (this.get(i, j) > v) { + v = this.get(i, j); + idx[0] = i; + idx[1] = j; + } + } + } + return idx; + } + + min() { + if (this.isEmpty()) { + return NaN; + } + let v = this.get(0, 0); + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + if (this.get(i, j) < v) { + v = this.get(i, j); + } + } + } + return v; + } + + minIndex() { + checkNonEmpty(this); + let v = this.get(0, 0); + let idx = [0, 0]; + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + if (this.get(i, j) < v) { + v = this.get(i, j); + idx[0] = i; + idx[1] = j; + } + } + } + return idx; + } + + maxRow(row) { + checkRowIndex(this, row); + if (this.isEmpty()) { + return NaN; + } + let v = this.get(row, 0); + for (let i = 1; i < this.columns; i++) { + if (this.get(row, i) > v) { + v = this.get(row, i); + } + } + return v; + } + + maxRowIndex(row) { + checkRowIndex(this, row); + checkNonEmpty(this); + let v = this.get(row, 0); + let idx = [row, 0]; + for (let i = 1; i < this.columns; i++) { + if (this.get(row, i) > v) { + v = this.get(row, i); + idx[1] = i; + } + } + return idx; + } + + minRow(row) { + checkRowIndex(this, row); + if (this.isEmpty()) { + return NaN; + } + let v = this.get(row, 0); + for (let i = 1; i < this.columns; i++) { + if (this.get(row, i) < v) { + v = this.get(row, i); + } + } + return v; + } + + minRowIndex(row) { + checkRowIndex(this, row); + checkNonEmpty(this); + let v = this.get(row, 0); + let idx = [row, 0]; + for (let i = 1; i < this.columns; i++) { + if (this.get(row, i) < v) { + v = this.get(row, i); + idx[1] = i; + } + } + return idx; + } + + maxColumn(column) { + checkColumnIndex(this, column); + if (this.isEmpty()) { + return NaN; + } + let v = this.get(0, column); + for (let i = 1; i < this.rows; i++) { + if (this.get(i, column) > v) { + v = this.get(i, column); + } + } + return v; + } + + maxColumnIndex(column) { + checkColumnIndex(this, column); + checkNonEmpty(this); + let v = this.get(0, column); + let idx = [0, column]; + for (let i = 1; i < this.rows; i++) { + if (this.get(i, column) > v) { + v = this.get(i, column); + idx[0] = i; + } + } + return idx; + } + + minColumn(column) { + checkColumnIndex(this, column); + if (this.isEmpty()) { + return NaN; + } + let v = this.get(0, column); + for (let i = 1; i < this.rows; i++) { + if (this.get(i, column) < v) { + v = this.get(i, column); + } + } + return v; + } + + minColumnIndex(column) { + checkColumnIndex(this, column); + checkNonEmpty(this); + let v = this.get(0, column); + let idx = [0, column]; + for (let i = 1; i < this.rows; i++) { + if (this.get(i, column) < v) { + v = this.get(i, column); + idx[0] = i; + } + } + return idx; + } + + diag() { + let min = Math.min(this.rows, this.columns); + let diag = []; + for (let i = 0; i < min; i++) { + diag.push(this.get(i, i)); + } + return diag; + } + + norm(type = 'frobenius') { + let result = 0; + if (type === 'max') { + return this.max(); + } else if (type === 'frobenius') { + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + result = result + this.get(i, j) * this.get(i, j); + } + } + return Math.sqrt(result); + } else { + throw new RangeError(`unknown norm type: ${type}`); + } + } + + cumulativeSum() { + let sum = 0; + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + sum += this.get(i, j); + this.set(i, j, sum); + } + } + return this; + } + + dot(vector2) { + if (AbstractMatrix.isMatrix(vector2)) vector2 = vector2.to1DArray(); + let vector1 = this.to1DArray(); + if (vector1.length !== vector2.length) { + throw new RangeError('vectors do not have the same size'); + } + let dot = 0; + for (let i = 0; i < vector1.length; i++) { + dot += vector1[i] * vector2[i]; + } + return dot; + } + + mmul(other) { + other = Matrix.checkMatrix(other); + + let m = this.rows; + let n = this.columns; + let p = other.columns; + + let result = new Matrix(m, p); + + let Bcolj = new Float64Array(n); + for (let j = 0; j < p; j++) { + for (let k = 0; k < n; k++) { + Bcolj[k] = other.get(k, j); + } + + for (let i = 0; i < m; i++) { + let s = 0; + for (let k = 0; k < n; k++) { + s += this.get(i, k) * Bcolj[k]; + } + + result.set(i, j, s); + } + } + return result; + } + + strassen2x2(other) { + other = Matrix.checkMatrix(other); + let result = new Matrix(2, 2); + const a11 = this.get(0, 0); + const b11 = other.get(0, 0); + const a12 = this.get(0, 1); + const b12 = other.get(0, 1); + const a21 = this.get(1, 0); + const b21 = other.get(1, 0); + const a22 = this.get(1, 1); + const b22 = other.get(1, 1); + + // Compute intermediate values. + const m1 = (a11 + a22) * (b11 + b22); + const m2 = (a21 + a22) * b11; + const m3 = a11 * (b12 - b22); + const m4 = a22 * (b21 - b11); + const m5 = (a11 + a12) * b22; + const m6 = (a21 - a11) * (b11 + b12); + const m7 = (a12 - a22) * (b21 + b22); + + // Combine intermediate values into the output. + const c00 = m1 + m4 - m5 + m7; + const c01 = m3 + m5; + const c10 = m2 + m4; + const c11 = m1 - m2 + m3 + m6; + + result.set(0, 0, c00); + result.set(0, 1, c01); + result.set(1, 0, c10); + result.set(1, 1, c11); + return result; + } + + strassen3x3(other) { + other = Matrix.checkMatrix(other); + let result = new Matrix(3, 3); + + const a00 = this.get(0, 0); + const a01 = this.get(0, 1); + const a02 = this.get(0, 2); + const a10 = this.get(1, 0); + const a11 = this.get(1, 1); + const a12 = this.get(1, 2); + const a20 = this.get(2, 0); + const a21 = this.get(2, 1); + const a22 = this.get(2, 2); + + const b00 = other.get(0, 0); + const b01 = other.get(0, 1); + const b02 = other.get(0, 2); + const b10 = other.get(1, 0); + const b11 = other.get(1, 1); + const b12 = other.get(1, 2); + const b20 = other.get(2, 0); + const b21 = other.get(2, 1); + const b22 = other.get(2, 2); + + const m1 = (a00 + a01 + a02 - a10 - a11 - a21 - a22) * b11; + const m2 = (a00 - a10) * (-b01 + b11); + const m3 = a11 * (-b00 + b01 + b10 - b11 - b12 - b20 + b22); + const m4 = (-a00 + a10 + a11) * (b00 - b01 + b11); + const m5 = (a10 + a11) * (-b00 + b01); + const m6 = a00 * b00; + const m7 = (-a00 + a20 + a21) * (b00 - b02 + b12); + const m8 = (-a00 + a20) * (b02 - b12); + const m9 = (a20 + a21) * (-b00 + b02); + const m10 = (a00 + a01 + a02 - a11 - a12 - a20 - a21) * b12; + const m11 = a21 * (-b00 + b02 + b10 - b11 - b12 - b20 + b21); + const m12 = (-a02 + a21 + a22) * (b11 + b20 - b21); + const m13 = (a02 - a22) * (b11 - b21); + const m14 = a02 * b20; + const m15 = (a21 + a22) * (-b20 + b21); + const m16 = (-a02 + a11 + a12) * (b12 + b20 - b22); + const m17 = (a02 - a12) * (b12 - b22); + const m18 = (a11 + a12) * (-b20 + b22); + const m19 = a01 * b10; + const m20 = a12 * b21; + const m21 = a10 * b02; + const m22 = a20 * b01; + const m23 = a22 * b22; + + const c00 = m6 + m14 + m19; + const c01 = m1 + m4 + m5 + m6 + m12 + m14 + m15; + const c02 = m6 + m7 + m9 + m10 + m14 + m16 + m18; + const c10 = m2 + m3 + m4 + m6 + m14 + m16 + m17; + const c11 = m2 + m4 + m5 + m6 + m20; + const c12 = m14 + m16 + m17 + m18 + m21; + const c20 = m6 + m7 + m8 + m11 + m12 + m13 + m14; + const c21 = m12 + m13 + m14 + m15 + m22; + const c22 = m6 + m7 + m8 + m9 + m23; + + result.set(0, 0, c00); + result.set(0, 1, c01); + result.set(0, 2, c02); + result.set(1, 0, c10); + result.set(1, 1, c11); + result.set(1, 2, c12); + result.set(2, 0, c20); + result.set(2, 1, c21); + result.set(2, 2, c22); + return result; + } + + mmulStrassen(y) { + y = Matrix.checkMatrix(y); + let x = this.clone(); + let r1 = x.rows; + let c1 = x.columns; + let r2 = y.rows; + let c2 = y.columns; + if (c1 !== r2) { + // eslint-disable-next-line no-console + console.warn( + `Multiplying ${r1} x ${c1} and ${r2} x ${c2} matrix: dimensions do not match.`, + ); + } + + // Put a matrix into the top left of a matrix of zeros. + // `rows` and `cols` are the dimensions of the output matrix. + function embed(mat, rows, cols) { + let r = mat.rows; + let c = mat.columns; + if (r === rows && c === cols) { + return mat; + } else { + let resultat = AbstractMatrix.zeros(rows, cols); + resultat = resultat.setSubMatrix(mat, 0, 0); + return resultat; + } + } + + // Make sure both matrices are the same size. + // This is exclusively for simplicity: + // this algorithm can be implemented with matrices of different sizes. + + let r = Math.max(r1, r2); + let c = Math.max(c1, c2); + x = embed(x, r, c); + y = embed(y, r, c); + + // Our recursive multiplication function. + function blockMult(a, b, rows, cols) { + // For small matrices, resort to naive multiplication. + if (rows <= 512 || cols <= 512) { + return a.mmul(b); // a is equivalent to this + } + + // Apply dynamic padding. + if (rows % 2 === 1 && cols % 2 === 1) { + a = embed(a, rows + 1, cols + 1); + b = embed(b, rows + 1, cols + 1); + } else if (rows % 2 === 1) { + a = embed(a, rows + 1, cols); + b = embed(b, rows + 1, cols); + } else if (cols % 2 === 1) { + a = embed(a, rows, cols + 1); + b = embed(b, rows, cols + 1); + } + + let halfRows = parseInt(a.rows / 2, 10); + let halfCols = parseInt(a.columns / 2, 10); + // Subdivide input matrices. + let a11 = a.subMatrix(0, halfRows - 1, 0, halfCols - 1); + let b11 = b.subMatrix(0, halfRows - 1, 0, halfCols - 1); + + let a12 = a.subMatrix(0, halfRows - 1, halfCols, a.columns - 1); + let b12 = b.subMatrix(0, halfRows - 1, halfCols, b.columns - 1); + + let a21 = a.subMatrix(halfRows, a.rows - 1, 0, halfCols - 1); + let b21 = b.subMatrix(halfRows, b.rows - 1, 0, halfCols - 1); + + let a22 = a.subMatrix(halfRows, a.rows - 1, halfCols, a.columns - 1); + let b22 = b.subMatrix(halfRows, b.rows - 1, halfCols, b.columns - 1); + + // Compute intermediate values. + let m1 = blockMult( + AbstractMatrix.add(a11, a22), + AbstractMatrix.add(b11, b22), + halfRows, + halfCols, + ); + let m2 = blockMult(AbstractMatrix.add(a21, a22), b11, halfRows, halfCols); + let m3 = blockMult(a11, AbstractMatrix.sub(b12, b22), halfRows, halfCols); + let m4 = blockMult(a22, AbstractMatrix.sub(b21, b11), halfRows, halfCols); + let m5 = blockMult(AbstractMatrix.add(a11, a12), b22, halfRows, halfCols); + let m6 = blockMult( + AbstractMatrix.sub(a21, a11), + AbstractMatrix.add(b11, b12), + halfRows, + halfCols, + ); + let m7 = blockMult( + AbstractMatrix.sub(a12, a22), + AbstractMatrix.add(b21, b22), + halfRows, + halfCols, + ); + + // Combine intermediate values into the output. + let c11 = AbstractMatrix.add(m1, m4); + c11.sub(m5); + c11.add(m7); + let c12 = AbstractMatrix.add(m3, m5); + let c21 = AbstractMatrix.add(m2, m4); + let c22 = AbstractMatrix.sub(m1, m2); + c22.add(m3); + c22.add(m6); + + // Crop output to the desired size (undo dynamic padding). + let resultat = AbstractMatrix.zeros(2 * c11.rows, 2 * c11.columns); + resultat = resultat.setSubMatrix(c11, 0, 0); + resultat = resultat.setSubMatrix(c12, c11.rows, 0); + resultat = resultat.setSubMatrix(c21, 0, c11.columns); + resultat = resultat.setSubMatrix(c22, c11.rows, c11.columns); + return resultat.subMatrix(0, rows - 1, 0, cols - 1); + } + return blockMult(x, y, r, c); + } + + scaleRows(options = {}) { + if (typeof options !== 'object') { + throw new TypeError('options must be an object'); + } + const { min = 0, max = 1 } = options; + if (!Number.isFinite(min)) throw new TypeError('min must be a number'); + if (!Number.isFinite(max)) throw new TypeError('max must be a number'); + if (min >= max) throw new RangeError('min must be smaller than max'); + let newMatrix = new Matrix(this.rows, this.columns); + for (let i = 0; i < this.rows; i++) { + const row = this.getRow(i); + if (row.length > 0) { + rescale(row, { min, max, output: row }); + } + newMatrix.setRow(i, row); + } + return newMatrix; + } + + scaleColumns(options = {}) { + if (typeof options !== 'object') { + throw new TypeError('options must be an object'); + } + const { min = 0, max = 1 } = options; + if (!Number.isFinite(min)) throw new TypeError('min must be a number'); + if (!Number.isFinite(max)) throw new TypeError('max must be a number'); + if (min >= max) throw new RangeError('min must be smaller than max'); + let newMatrix = new Matrix(this.rows, this.columns); + for (let i = 0; i < this.columns; i++) { + const column = this.getColumn(i); + if (column.length) { + rescale(column, { + min: min, + max: max, + output: column, + }); + } + newMatrix.setColumn(i, column); + } + return newMatrix; + } + + flipRows() { + const middle = Math.ceil(this.columns / 2); + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < middle; j++) { + let first = this.get(i, j); + let last = this.get(i, this.columns - 1 - j); + this.set(i, j, last); + this.set(i, this.columns - 1 - j, first); + } + } + return this; + } + + flipColumns() { + const middle = Math.ceil(this.rows / 2); + for (let j = 0; j < this.columns; j++) { + for (let i = 0; i < middle; i++) { + let first = this.get(i, j); + let last = this.get(this.rows - 1 - i, j); + this.set(i, j, last); + this.set(this.rows - 1 - i, j, first); + } + } + return this; + } + + kroneckerProduct(other) { + other = Matrix.checkMatrix(other); + + let m = this.rows; + let n = this.columns; + let p = other.rows; + let q = other.columns; + + let result = new Matrix(m * p, n * q); + for (let i = 0; i < m; i++) { + for (let j = 0; j < n; j++) { + for (let k = 0; k < p; k++) { + for (let l = 0; l < q; l++) { + result.set(p * i + k, q * j + l, this.get(i, j) * other.get(k, l)); + } + } + } + } + return result; + } + + kroneckerSum(other) { + other = Matrix.checkMatrix(other); + if (!this.isSquare() || !other.isSquare()) { + throw new Error('Kronecker Sum needs two Square Matrices'); + } + let m = this.rows; + let n = other.rows; + let AxI = this.kroneckerProduct(Matrix.eye(n, n)); + let IxB = Matrix.eye(m, m).kroneckerProduct(other); + return AxI.add(IxB); + } + + transpose() { + let result = new Matrix(this.columns, this.rows); + for (let i = 0; i < this.rows; i++) { + for (let j = 0; j < this.columns; j++) { + result.set(j, i, this.get(i, j)); + } + } + return result; + } + + sortRows(compareFunction = compareNumbers) { + for (let i = 0; i < this.rows; i++) { + this.setRow(i, this.getRow(i).sort(compareFunction)); + } + return this; + } + + sortColumns(compareFunction = compareNumbers) { + for (let i = 0; i < this.columns; i++) { + this.setColumn(i, this.getColumn(i).sort(compareFunction)); + } + return this; + } + + subMatrix(startRow, endRow, startColumn, endColumn) { + checkRange(this, startRow, endRow, startColumn, endColumn); + let newMatrix = new Matrix( + endRow - startRow + 1, + endColumn - startColumn + 1, + ); + for (let i = startRow; i <= endRow; i++) { + for (let j = startColumn; j <= endColumn; j++) { + newMatrix.set(i - startRow, j - startColumn, this.get(i, j)); + } + } + return newMatrix; + } + + subMatrixRow(indices, startColumn, endColumn) { + if (startColumn === undefined) startColumn = 0; + if (endColumn === undefined) endColumn = this.columns - 1; + if ( + startColumn > endColumn || + startColumn < 0 || + startColumn >= this.columns || + endColumn < 0 || + endColumn >= this.columns + ) { + throw new RangeError('Argument out of range'); + } + + let newMatrix = new Matrix(indices.length, endColumn - startColumn + 1); + for (let i = 0; i < indices.length; i++) { + for (let j = startColumn; j <= endColumn; j++) { + if (indices[i] < 0 || indices[i] >= this.rows) { + throw new RangeError(`Row index out of range: ${indices[i]}`); + } + newMatrix.set(i, j - startColumn, this.get(indices[i], j)); + } + } + return newMatrix; + } + + subMatrixColumn(indices, startRow, endRow) { + if (startRow === undefined) startRow = 0; + if (endRow === undefined) endRow = this.rows - 1; + if ( + startRow > endRow || + startRow < 0 || + startRow >= this.rows || + endRow < 0 || + endRow >= this.rows + ) { + throw new RangeError('Argument out of range'); + } + + let newMatrix = new Matrix(endRow - startRow + 1, indices.length); + for (let i = 0; i < indices.length; i++) { + for (let j = startRow; j <= endRow; j++) { + if (indices[i] < 0 || indices[i] >= this.columns) { + throw new RangeError(`Column index out of range: ${indices[i]}`); + } + newMatrix.set(j - startRow, i, this.get(j, indices[i])); + } + } + return newMatrix; + } + + setSubMatrix(matrix, startRow, startColumn) { + matrix = Matrix.checkMatrix(matrix); + if (matrix.isEmpty()) { + return this; + } + let endRow = startRow + matrix.rows - 1; + let endColumn = startColumn + matrix.columns - 1; + checkRange(this, startRow, endRow, startColumn, endColumn); + for (let i = 0; i < matrix.rows; i++) { + for (let j = 0; j < matrix.columns; j++) { + this.set(startRow + i, startColumn + j, matrix.get(i, j)); + } + } + return this; + } + + selection(rowIndices, columnIndices) { + let indices = checkIndices(this, rowIndices, columnIndices); + let newMatrix = new Matrix(rowIndices.length, columnIndices.length); + for (let i = 0; i < indices.row.length; i++) { + let rowIndex = indices.row[i]; + for (let j = 0; j < indices.column.length; j++) { + let columnIndex = indices.column[j]; + newMatrix.set(i, j, this.get(rowIndex, columnIndex)); + } + } + return newMatrix; + } + + trace() { + let min = Math.min(this.rows, this.columns); + let trace = 0; + for (let i = 0; i < min; i++) { + trace += this.get(i, i); + } + return trace; + } + + clone() { + let newMatrix = new Matrix(this.rows, this.columns); + for (let row = 0; row < this.rows; row++) { + for (let column = 0; column < this.columns; column++) { + newMatrix.set(row, column, this.get(row, column)); + } + } + return newMatrix; + } + + sum(by) { + switch (by) { + case 'row': + return sumByRow(this); + case 'column': + return sumByColumn(this); + case undefined: + return sumAll(this); + default: + throw new Error(`invalid option: ${by}`); + } + } + + product(by) { + switch (by) { + case 'row': + return productByRow(this); + case 'column': + return productByColumn(this); + case undefined: + return productAll(this); + default: + throw new Error(`invalid option: ${by}`); + } + } + + mean(by) { + const sum = this.sum(by); + switch (by) { + case 'row': { + for (let i = 0; i < this.rows; i++) { + sum[i] /= this.columns; + } + return sum; + } + case 'column': { + for (let i = 0; i < this.columns; i++) { + sum[i] /= this.rows; + } + return sum; + } + case undefined: + return sum / this.size; + default: + throw new Error(`invalid option: ${by}`); + } + } + + variance(by, options = {}) { + if (typeof by === 'object') { + options = by; + by = undefined; + } + if (typeof options !== 'object') { + throw new TypeError('options must be an object'); + } + const { unbiased = true, mean = this.mean(by) } = options; + if (typeof unbiased !== 'boolean') { + throw new TypeError('unbiased must be a boolean'); + } + switch (by) { + case 'row': { + if (!Array.isArray(mean)) { + throw new TypeError('mean must be an array'); + } + return varianceByRow(this, unbiased, mean); + } + case 'column': { + if (!Array.isArray(mean)) { + throw new TypeError('mean must be an array'); + } + return varianceByColumn(this, unbiased, mean); + } + case undefined: { + if (typeof mean !== 'number') { + throw new TypeError('mean must be a number'); + } + return varianceAll(this, unbiased, mean); + } + default: + throw new Error(`invalid option: ${by}`); + } + } + + standardDeviation(by, options) { + if (typeof by === 'object') { + options = by; + by = undefined; + } + const variance = this.variance(by, options); + if (by === undefined) { + return Math.sqrt(variance); + } else { + for (let i = 0; i < variance.length; i++) { + variance[i] = Math.sqrt(variance[i]); + } + return variance; + } + } + + center(by, options = {}) { + if (typeof by === 'object') { + options = by; + by = undefined; + } + if (typeof options !== 'object') { + throw new TypeError('options must be an object'); + } + const { center = this.mean(by) } = options; + switch (by) { + case 'row': { + if (!Array.isArray(center)) { + throw new TypeError('center must be an array'); + } + centerByRow(this, center); + return this; + } + case 'column': { + if (!Array.isArray(center)) { + throw new TypeError('center must be an array'); + } + centerByColumn(this, center); + return this; + } + case undefined: { + if (typeof center !== 'number') { + throw new TypeError('center must be a number'); + } + centerAll(this, center); + return this; + } + default: + throw new Error(`invalid option: ${by}`); + } + } + + scale(by, options = {}) { + if (typeof by === 'object') { + options = by; + by = undefined; + } + if (typeof options !== 'object') { + throw new TypeError('options must be an object'); + } + let scale = options.scale; + switch (by) { + case 'row': { + if (scale === undefined) { + scale = getScaleByRow(this); + } else if (!Array.isArray(scale)) { + throw new TypeError('scale must be an array'); + } + scaleByRow(this, scale); + return this; + } + case 'column': { + if (scale === undefined) { + scale = getScaleByColumn(this); + } else if (!Array.isArray(scale)) { + throw new TypeError('scale must be an array'); + } + scaleByColumn(this, scale); + return this; + } + case undefined: { + if (scale === undefined) { + scale = getScaleAll(this); + } else if (typeof scale !== 'number') { + throw new TypeError('scale must be a number'); + } + scaleAll(this, scale); + return this; + } + default: + throw new Error(`invalid option: ${by}`); + } + } + + toString(options) { + return inspectMatrixWithOptions(this, options); + } +} + +AbstractMatrix.prototype.klass = 'Matrix'; +if (typeof Symbol !== 'undefined') { + AbstractMatrix.prototype[ + Symbol.for('nodejs.util.inspect.custom') + ] = inspectMatrix; +} + +function compareNumbers(a, b) { + return a - b; +} + +// Synonyms +AbstractMatrix.random = AbstractMatrix.rand; +AbstractMatrix.randomInt = AbstractMatrix.randInt; +AbstractMatrix.diagonal = AbstractMatrix.diag; +AbstractMatrix.prototype.diagonal = AbstractMatrix.prototype.diag; +AbstractMatrix.identity = AbstractMatrix.eye; +AbstractMatrix.prototype.negate = AbstractMatrix.prototype.neg; +AbstractMatrix.prototype.tensorProduct = + AbstractMatrix.prototype.kroneckerProduct; + +class Matrix extends AbstractMatrix { + constructor(nRows, nColumns) { + super(); + if (Matrix.isMatrix(nRows)) { + // eslint-disable-next-line no-constructor-return + return nRows.clone(); + } else if (Number.isInteger(nRows) && nRows >= 0) { + // Create an empty matrix + this.data = []; + if (Number.isInteger(nColumns) && nColumns >= 0) { + for (let i = 0; i < nRows; i++) { + this.data.push(new Float64Array(nColumns)); + } + } else { + throw new TypeError('nColumns must be a positive integer'); + } + } else if (Array.isArray(nRows)) { + // Copy the values from the 2D array + const arrayData = nRows; + nRows = arrayData.length; + nColumns = nRows ? arrayData[0].length : 0; + if (typeof nColumns !== 'number') { + throw new TypeError( + 'Data must be a 2D array with at least one element', + ); + } + this.data = []; + for (let i = 0; i < nRows; i++) { + if (arrayData[i].length !== nColumns) { + throw new RangeError('Inconsistent array dimensions'); + } + this.data.push(Float64Array.from(arrayData[i])); + } + } else { + throw new TypeError( + 'First argument must be a positive number or an array', + ); + } + this.rows = nRows; + this.columns = nColumns; + } + + set(rowIndex, columnIndex, value) { + this.data[rowIndex][columnIndex] = value; + return this; + } + + get(rowIndex, columnIndex) { + return this.data[rowIndex][columnIndex]; + } + + removeRow(index) { + checkRowIndex(this, index); + this.data.splice(index, 1); + this.rows -= 1; + return this; + } + + addRow(index, array) { + if (array === undefined) { + array = index; + index = this.rows; + } + checkRowIndex(this, index, true); + array = Float64Array.from(checkRowVector(this, array)); + this.data.splice(index, 0, array); + this.rows += 1; + return this; + } + + removeColumn(index) { + checkColumnIndex(this, index); + for (let i = 0; i < this.rows; i++) { + const newRow = new Float64Array(this.columns - 1); + for (let j = 0; j < index; j++) { + newRow[j] = this.data[i][j]; + } + for (let j = index + 1; j < this.columns; j++) { + newRow[j - 1] = this.data[i][j]; + } + this.data[i] = newRow; + } + this.columns -= 1; + return this; + } + + addColumn(index, array) { + if (typeof array === 'undefined') { + array = index; + index = this.columns; + } + checkColumnIndex(this, index, true); + array = checkColumnVector(this, array); + for (let i = 0; i < this.rows; i++) { + const newRow = new Float64Array(this.columns + 1); + let j = 0; + for (; j < index; j++) { + newRow[j] = this.data[i][j]; + } + newRow[j++] = array[i]; + for (; j < this.columns + 1; j++) { + newRow[j] = this.data[i][j - 1]; + } + this.data[i] = newRow; + } + this.columns += 1; + return this; + } +} + +installMathOperations(AbstractMatrix, Matrix); + +class WrapperMatrix2D extends AbstractMatrix { + constructor(data) { + super(); + this.data = data; + this.rows = data.length; + this.columns = data[0].length; + } + + set(rowIndex, columnIndex, value) { + this.data[rowIndex][columnIndex] = value; + return this; + } + + get(rowIndex, columnIndex) { + return this.data[rowIndex][columnIndex]; + } +} + +function hypotenuse(a, b) { + let r = 0; + if (Math.abs(a) > Math.abs(b)) { + r = b / a; + return Math.abs(a) * Math.sqrt(1 + r * r); + } + if (b !== 0) { + r = a / b; + return Math.abs(b) * Math.sqrt(1 + r * r); + } + return 0; +} + +class SingularValueDecomposition { + constructor(value, options = {}) { + value = WrapperMatrix2D.checkMatrix(value); + + if (value.isEmpty()) { + throw new Error('Matrix must be non-empty'); + } + + let m = value.rows; + let n = value.columns; + + const { + computeLeftSingularVectors = true, + computeRightSingularVectors = true, + autoTranspose = false, + } = options; + + let wantu = Boolean(computeLeftSingularVectors); + let wantv = Boolean(computeRightSingularVectors); + + let swapped = false; + let a; + if (m < n) { + if (!autoTranspose) { + a = value.clone(); + // eslint-disable-next-line no-console + console.warn( + 'Computing SVD on a matrix with more columns than rows. Consider enabling autoTranspose', + ); + } else { + a = value.transpose(); + m = a.rows; + n = a.columns; + swapped = true; + let aux = wantu; + wantu = wantv; + wantv = aux; + } + } else { + a = value.clone(); + } + + let nu = Math.min(m, n); + let ni = Math.min(m + 1, n); + let s = new Float64Array(ni); + let U = new Matrix(m, nu); + let V = new Matrix(n, n); + + let e = new Float64Array(n); + let work = new Float64Array(m); + + let si = new Float64Array(ni); + for (let i = 0; i < ni; i++) si[i] = i; + + let nct = Math.min(m - 1, n); + let nrt = Math.max(0, Math.min(n - 2, m)); + let mrc = Math.max(nct, nrt); + + for (let k = 0; k < mrc; k++) { + if (k < nct) { + s[k] = 0; + for (let i = k; i < m; i++) { + s[k] = hypotenuse(s[k], a.get(i, k)); + } + if (s[k] !== 0) { + if (a.get(k, k) < 0) { + s[k] = -s[k]; + } + for (let i = k; i < m; i++) { + a.set(i, k, a.get(i, k) / s[k]); + } + a.set(k, k, a.get(k, k) + 1); + } + s[k] = -s[k]; + } + + for (let j = k + 1; j < n; j++) { + if (k < nct && s[k] !== 0) { + let t = 0; + for (let i = k; i < m; i++) { + t += a.get(i, k) * a.get(i, j); + } + t = -t / a.get(k, k); + for (let i = k; i < m; i++) { + a.set(i, j, a.get(i, j) + t * a.get(i, k)); + } + } + e[j] = a.get(k, j); + } + + if (wantu && k < nct) { + for (let i = k; i < m; i++) { + U.set(i, k, a.get(i, k)); + } + } + + if (k < nrt) { + e[k] = 0; + for (let i = k + 1; i < n; i++) { + e[k] = hypotenuse(e[k], e[i]); + } + if (e[k] !== 0) { + if (e[k + 1] < 0) { + e[k] = 0 - e[k]; + } + for (let i = k + 1; i < n; i++) { + e[i] /= e[k]; + } + e[k + 1] += 1; + } + e[k] = -e[k]; + if (k + 1 < m && e[k] !== 0) { + for (let i = k + 1; i < m; i++) { + work[i] = 0; + } + for (let i = k + 1; i < m; i++) { + for (let j = k + 1; j < n; j++) { + work[i] += e[j] * a.get(i, j); + } + } + for (let j = k + 1; j < n; j++) { + let t = -e[j] / e[k + 1]; + for (let i = k + 1; i < m; i++) { + a.set(i, j, a.get(i, j) + t * work[i]); + } + } + } + if (wantv) { + for (let i = k + 1; i < n; i++) { + V.set(i, k, e[i]); + } + } + } + } + + let p = Math.min(n, m + 1); + if (nct < n) { + s[nct] = a.get(nct, nct); + } + if (m < p) { + s[p - 1] = 0; + } + if (nrt + 1 < p) { + e[nrt] = a.get(nrt, p - 1); + } + e[p - 1] = 0; + + if (wantu) { + for (let j = nct; j < nu; j++) { + for (let i = 0; i < m; i++) { + U.set(i, j, 0); + } + U.set(j, j, 1); + } + for (let k = nct - 1; k >= 0; k--) { + if (s[k] !== 0) { + for (let j = k + 1; j < nu; j++) { + let t = 0; + for (let i = k; i < m; i++) { + t += U.get(i, k) * U.get(i, j); + } + t = -t / U.get(k, k); + for (let i = k; i < m; i++) { + U.set(i, j, U.get(i, j) + t * U.get(i, k)); + } + } + for (let i = k; i < m; i++) { + U.set(i, k, -U.get(i, k)); + } + U.set(k, k, 1 + U.get(k, k)); + for (let i = 0; i < k - 1; i++) { + U.set(i, k, 0); + } + } else { + for (let i = 0; i < m; i++) { + U.set(i, k, 0); + } + U.set(k, k, 1); + } + } + } + + if (wantv) { + for (let k = n - 1; k >= 0; k--) { + if (k < nrt && e[k] !== 0) { + for (let j = k + 1; j < n; j++) { + let t = 0; + for (let i = k + 1; i < n; i++) { + t += V.get(i, k) * V.get(i, j); + } + t = -t / V.get(k + 1, k); + for (let i = k + 1; i < n; i++) { + V.set(i, j, V.get(i, j) + t * V.get(i, k)); + } + } + } + for (let i = 0; i < n; i++) { + V.set(i, k, 0); + } + V.set(k, k, 1); + } + } + + let pp = p - 1; + let eps = Number.EPSILON; + while (p > 0) { + let k, kase; + for (k = p - 2; k >= -1; k--) { + if (k === -1) { + break; + } + const alpha = + Number.MIN_VALUE + eps * Math.abs(s[k] + Math.abs(s[k + 1])); + if (Math.abs(e[k]) <= alpha || Number.isNaN(e[k])) { + e[k] = 0; + break; + } + } + if (k === p - 2) { + kase = 4; + } else { + let ks; + for (ks = p - 1; ks >= k; ks--) { + if (ks === k) { + break; + } + let t = + (ks !== p ? Math.abs(e[ks]) : 0) + + (ks !== k + 1 ? Math.abs(e[ks - 1]) : 0); + if (Math.abs(s[ks]) <= eps * t) { + s[ks] = 0; + break; + } + } + if (ks === k) { + kase = 3; + } else if (ks === p - 1) { + kase = 1; + } else { + kase = 2; + k = ks; + } + } + + k++; + + switch (kase) { + case 1: { + let f = e[p - 2]; + e[p - 2] = 0; + for (let j = p - 2; j >= k; j--) { + let t = hypotenuse(s[j], f); + let cs = s[j] / t; + let sn = f / t; + s[j] = t; + if (j !== k) { + f = -sn * e[j - 1]; + e[j - 1] = cs * e[j - 1]; + } + if (wantv) { + for (let i = 0; i < n; i++) { + t = cs * V.get(i, j) + sn * V.get(i, p - 1); + V.set(i, p - 1, -sn * V.get(i, j) + cs * V.get(i, p - 1)); + V.set(i, j, t); + } + } + } + break; + } + case 2: { + let f = e[k - 1]; + e[k - 1] = 0; + for (let j = k; j < p; j++) { + let t = hypotenuse(s[j], f); + let cs = s[j] / t; + let sn = f / t; + s[j] = t; + f = -sn * e[j]; + e[j] = cs * e[j]; + if (wantu) { + for (let i = 0; i < m; i++) { + t = cs * U.get(i, j) + sn * U.get(i, k - 1); + U.set(i, k - 1, -sn * U.get(i, j) + cs * U.get(i, k - 1)); + U.set(i, j, t); + } + } + } + break; + } + case 3: { + const scale = Math.max( + Math.abs(s[p - 1]), + Math.abs(s[p - 2]), + Math.abs(e[p - 2]), + Math.abs(s[k]), + Math.abs(e[k]), + ); + const sp = s[p - 1] / scale; + const spm1 = s[p - 2] / scale; + const epm1 = e[p - 2] / scale; + const sk = s[k] / scale; + const ek = e[k] / scale; + const b = ((spm1 + sp) * (spm1 - sp) + epm1 * epm1) / 2; + const c = sp * epm1 * (sp * epm1); + let shift = 0; + if (b !== 0 || c !== 0) { + if (b < 0) { + shift = 0 - Math.sqrt(b * b + c); + } else { + shift = Math.sqrt(b * b + c); + } + shift = c / (b + shift); + } + let f = (sk + sp) * (sk - sp) + shift; + let g = sk * ek; + for (let j = k; j < p - 1; j++) { + let t = hypotenuse(f, g); + if (t === 0) t = Number.MIN_VALUE; + let cs = f / t; + let sn = g / t; + if (j !== k) { + e[j - 1] = t; + } + f = cs * s[j] + sn * e[j]; + e[j] = cs * e[j] - sn * s[j]; + g = sn * s[j + 1]; + s[j + 1] = cs * s[j + 1]; + if (wantv) { + for (let i = 0; i < n; i++) { + t = cs * V.get(i, j) + sn * V.get(i, j + 1); + V.set(i, j + 1, -sn * V.get(i, j) + cs * V.get(i, j + 1)); + V.set(i, j, t); + } + } + t = hypotenuse(f, g); + if (t === 0) t = Number.MIN_VALUE; + cs = f / t; + sn = g / t; + s[j] = t; + f = cs * e[j] + sn * s[j + 1]; + s[j + 1] = -sn * e[j] + cs * s[j + 1]; + g = sn * e[j + 1]; + e[j + 1] = cs * e[j + 1]; + if (wantu && j < m - 1) { + for (let i = 0; i < m; i++) { + t = cs * U.get(i, j) + sn * U.get(i, j + 1); + U.set(i, j + 1, -sn * U.get(i, j) + cs * U.get(i, j + 1)); + U.set(i, j, t); + } + } + } + e[p - 2] = f; + break; + } + case 4: { + if (s[k] <= 0) { + s[k] = s[k] < 0 ? -s[k] : 0; + if (wantv) { + for (let i = 0; i <= pp; i++) { + V.set(i, k, -V.get(i, k)); + } + } + } + while (k < pp) { + if (s[k] >= s[k + 1]) { + break; + } + let t = s[k]; + s[k] = s[k + 1]; + s[k + 1] = t; + if (wantv && k < n - 1) { + for (let i = 0; i < n; i++) { + t = V.get(i, k + 1); + V.set(i, k + 1, V.get(i, k)); + V.set(i, k, t); + } + } + if (wantu && k < m - 1) { + for (let i = 0; i < m; i++) { + t = U.get(i, k + 1); + U.set(i, k + 1, U.get(i, k)); + U.set(i, k, t); + } + } + k++; + } + p--; + break; + } + // no default + } + } + + if (swapped) { + let tmp = V; + V = U; + U = tmp; + } + + this.m = m; + this.n = n; + this.s = s; + this.U = U; + this.V = V; + } + + solve(value) { + let Y = value; + let e = this.threshold; + let scols = this.s.length; + let Ls = Matrix.zeros(scols, scols); + + for (let i = 0; i < scols; i++) { + if (Math.abs(this.s[i]) <= e) { + Ls.set(i, i, 0); + } else { + Ls.set(i, i, 1 / this.s[i]); + } + } + + let U = this.U; + let V = this.rightSingularVectors; + + let VL = V.mmul(Ls); + let vrows = V.rows; + let urows = U.rows; + let VLU = Matrix.zeros(vrows, urows); + + for (let i = 0; i < vrows; i++) { + for (let j = 0; j < urows; j++) { + let sum = 0; + for (let k = 0; k < scols; k++) { + sum += VL.get(i, k) * U.get(j, k); + } + VLU.set(i, j, sum); + } + } + + return VLU.mmul(Y); + } + + solveForDiagonal(value) { + return this.solve(Matrix.diag(value)); + } + + inverse() { + let V = this.V; + let e = this.threshold; + let vrows = V.rows; + let vcols = V.columns; + let X = new Matrix(vrows, this.s.length); + + for (let i = 0; i < vrows; i++) { + for (let j = 0; j < vcols; j++) { + if (Math.abs(this.s[j]) > e) { + X.set(i, j, V.get(i, j) / this.s[j]); + } + } + } + + let U = this.U; + + let urows = U.rows; + let ucols = U.columns; + let Y = new Matrix(vrows, urows); + + for (let i = 0; i < vrows; i++) { + for (let j = 0; j < urows; j++) { + let sum = 0; + for (let k = 0; k < ucols; k++) { + sum += X.get(i, k) * U.get(j, k); + } + Y.set(i, j, sum); + } + } + + return Y; + } + + get condition() { + return this.s[0] / this.s[Math.min(this.m, this.n) - 1]; + } + + get norm2() { + return this.s[0]; + } + + get rank() { + let tol = Math.max(this.m, this.n) * this.s[0] * Number.EPSILON; + let r = 0; + let s = this.s; + for (let i = 0, ii = s.length; i < ii; i++) { + if (s[i] > tol) { + r++; + } + } + return r; + } + + get diagonal() { + return Array.from(this.s); + } + + get threshold() { + return (Number.EPSILON / 2) * Math.max(this.m, this.n) * this.s[0]; + } + + get leftSingularVectors() { + return this.U; + } + + get rightSingularVectors() { + return this.V; + } + + get diagonalMatrix() { + return Matrix.diag(this.s); + } +} + +class MDS { + constructor(params) { + this.distances = params.distances; + this.dimension = params.dimension || 2; + this.linkDistance = params.linkDistance; + } + layout() { + const self = this; + const { dimension, distances, linkDistance } = self; + try { + // square distances + const M = Matrix.mul(Matrix.pow(distances, 2), -0.5); + // double centre the rows/columns + const rowMeans = M.mean('row'); + const colMeans = M.mean('column'); + const totalMean = M.mean(); + M.add(totalMean).subRowVector(rowMeans).subColumnVector(colMeans); + // take the SVD of the double centred matrix, and return the + // points from it + const ret = new SingularValueDecomposition(M); + const eigenValues = Matrix.sqrt(ret.diagonalMatrix).diagonal(); + return ret.leftSingularVectors.toJSON().map((row) => { + return Matrix.mul([row], [eigenValues]).toJSON()[0].splice(0, dimension); + }); + } + catch (_a) { + const res = []; + for (let i = 0; i < distances.length; i++) { + const x = Math.random() * linkDistance; + const y = Math.random() * linkDistance; + res.push([x, y]); + } + return res; + } + } +} + +const SPEED_DIVISOR$1 = 800; +class RadialNonoverlapForce { + constructor(params) { + this.disp = []; + this.positions = params.positions; + this.adjMatrix = params.adjMatrix; + this.focusID = params.focusID; + this.radii = params.radii; + this.iterations = params.iterations || 10; + this.height = params.height || 10; + this.width = params.width || 10; + this.speed = params.speed || 100; + this.gravity = params.gravity || 10; + this.nodeSizeFunc = params.nodeSizeFunc; + this.k = params.k || 5; + this.strictRadial = params.strictRadial; + this.nodes = params.nodes; + } + layout() { + const self = this; + const positions = self.positions; + const disp = []; + const iterations = self.iterations; + const maxDisplace = self.width / 10; + self.maxDisplace = maxDisplace; + self.disp = disp; + for (let i = 0; i < iterations; i++) { + positions.forEach((_, k) => { + disp[k] = { x: 0, y: 0 }; + }); + // 给重叠的节点增加斥力 + self.getRepulsion(); + self.updatePositions(); + } + return positions; + } + getRepulsion() { + const self = this; + const positions = self.positions; + const nodes = self.nodes; + const disp = self.disp; + const k = self.k; + const radii = self.radii || []; + positions.forEach((v, i) => { + disp[i] = { x: 0, y: 0 }; + positions.forEach((u, j) => { + if (i === j) { + return; + } + // v and u are not on the same circle, return + if (radii[i] !== radii[j]) { + return; + } + let vecx = v[0] - u[0]; + let vecy = v[1] - u[1]; + let vecLength = Math.sqrt(vecx * vecx + vecy * vecy); + if (vecLength === 0) { + vecLength = 1; + const sign = i > j ? 1 : -1; + vecx = 0.01 * sign; + vecy = 0.01 * sign; + } + // these two nodes overlap + if (vecLength < self.nodeSizeFunc(nodes[i]) / 2 + self.nodeSizeFunc(nodes[j]) / 2) { + const common = (k * k) / vecLength; + disp[i].x += (vecx / vecLength) * common; + disp[i].y += (vecy / vecLength) * common; + } + }); + }); + } + updatePositions() { + const self = this; + const positions = self.positions; + const disp = self.disp; + const speed = self.speed; + const strictRadial = self.strictRadial; + const f = self.focusID; + const maxDisplace = self.maxDisplace || self.width / 10; + if (strictRadial) { + disp.forEach((di, i) => { + const vx = positions[i][0] - positions[f][0]; + const vy = positions[i][1] - positions[f][1]; + const vLength = Math.sqrt(vx * vx + vy * vy); + let vpx = vy / vLength; + let vpy = -vx / vLength; + const diLength = Math.sqrt(di.x * di.x + di.y * di.y); + let alpha = Math.acos((vpx * di.x + vpy * di.y) / diLength); + if (alpha > Math.PI / 2) { + alpha -= Math.PI / 2; + vpx *= -1; + vpy *= -1; + } + const tdispLength = Math.cos(alpha) * diLength; + di.x = vpx * tdispLength; + di.y = vpy * tdispLength; + }); + } + // move + const radii = self.radii; + positions.forEach((n, i) => { + if (i === f) { + return; + } + const distLength = Math.sqrt(disp[i].x * disp[i].x + disp[i].y * disp[i].y); + if (distLength > 0 && i !== f) { + const limitedDist = Math.min(maxDisplace * (speed / SPEED_DIVISOR$1), distLength); + n[0] += (disp[i].x / distLength) * limitedDist; + n[1] += (disp[i].y / distLength) * limitedDist; + if (strictRadial) { + let vx = n[0] - positions[f][0]; + let vy = n[1] - positions[f][1]; + const nfDis = Math.sqrt(vx * vx + vy * vy); + vx = (vx / nfDis) * radii[i]; + vy = (vy / nfDis) * radii[i]; + n[0] = positions[f][0] + vx; + n[1] = positions[f][1] + vy; + } + } + }); + } +} + +/** + * @fileOverview random layout + * @author shiwu.wyy@antfin.com + */ +function getWeightMatrix(M) { + const rows = M.length; + const cols = M[0].length; + const result = []; + for (let i = 0; i < rows; i++) { + const row = []; + for (let j = 0; j < cols; j++) { + if (M[i][j] !== 0) { + row.push(1 / (M[i][j] * M[i][j])); + } + else { + row.push(0); + } + } + result.push(row); + } + return result; +} +function getIndexById(array, id) { + let index = -1; + array.forEach((a, i) => { + if (a.id === id) { + index = i; + } + }); + return index; +} +function getEDistance(p1, p2) { + return Math.sqrt((p1[0] - p2[0]) * (p1[0] - p2[0]) + (p1[1] - p2[1]) * (p1[1] - p2[1])); +} +/** + * 辐射状布局 + */ +class RadialLayout extends Base { + constructor(options) { + super(); + /** 停止迭代的最大迭代数 */ + this.maxIteration = 1000; + /** 中心点，默认为数据中第一个点 */ + this.focusNode = null; + /** 每一圈半径 */ + this.unitRadius = null; + /** 默认边长度 */ + this.linkDistance = 50; + /** 是否防止重叠 */ + this.preventOverlap = false; + /** 是否必须是严格的 radial 布局，即每一层的节点严格布局在一个环上。preventOverlap 为 true 时生效 */ + this.strictRadial = true; + /** 防止重叠步骤的最大迭代次数 */ + this.maxPreventOverlapIteration = 200; + this.sortStrength = 10; + this.nodes = []; + this.edges = []; + this.updateCfg(options); + } + getDefaultCfg() { + return { + maxIteration: 1000, + focusNode: null, + unitRadius: null, + linkDistance: 50, + preventOverlap: false, + nodeSize: undefined, + nodeSpacing: undefined, + strictRadial: true, + maxPreventOverlapIteration: 200, + sortBy: undefined, + sortStrength: 10 + }; + } + /** + * 执行布局 + */ + execute() { + const self = this; + const nodes = self.nodes; + const edges = self.edges || []; + if (!nodes || nodes.length === 0) { + if (self.onLayoutEnd) + self.onLayoutEnd(); + return; + } + if (!self.width && typeof window !== "undefined") { + self.width = window.innerWidth; + } + if (!self.height && typeof window !== "undefined") { + self.height = window.innerHeight; + } + if (!self.center) { + self.center = [self.width / 2, self.height / 2]; + } + const center = self.center; + if (nodes.length === 1) { + nodes[0].x = center[0]; + nodes[0].y = center[1]; + if (self.onLayoutEnd) + self.onLayoutEnd(); + return; + } + const linkDistance = self.linkDistance; + // layout + let focusNode = null; + if (isString$2(self.focusNode)) { + let found = false; + for (let i = 0; i < nodes.length; i++) { + if (nodes[i].id === self.focusNode) { + focusNode = nodes[i]; + self.focusNode = focusNode; + found = true; + i = nodes.length; + } + } + if (!found) { + focusNode = null; + } + } + else { + focusNode = self.focusNode; + } + // default focus node + if (!focusNode) { + focusNode = nodes[0]; + self.focusNode = focusNode; + } + // the index of the focusNode in data + const focusIndex = getIndexById(nodes, focusNode.id); + self.focusIndex = focusIndex; + // the graph-theoretic distance (shortest path distance) matrix + const adjMatrix = getAdjMatrix({ nodes, edges }, false); + const D = floydWarshall$1(adjMatrix); + const maxDistance = self.maxToFocus(D, focusIndex); + // replace first node in unconnected component to the circle at (maxDistance + 1) + self.handleInfinity(D, focusIndex, maxDistance + 1); + self.distances = D; + // the shortest path distance from each node to focusNode + const focusNodeD = D[focusIndex]; + const width = self.width || 500; + const height = self.height || 500; + let semiWidth = width - center[0] > center[0] ? center[0] : width - center[0]; + let semiHeight = height - center[1] > center[1] ? center[1] : height - center[1]; + if (semiWidth === 0) { + semiWidth = width / 2; + } + if (semiHeight === 0) { + semiHeight = height / 2; + } + // the maxRadius of the graph + const maxRadius = semiHeight > semiWidth ? semiWidth : semiHeight; + const maxD = Math.max(...focusNodeD); + // the radius for each nodes away from focusNode + const radii = []; + focusNodeD.forEach((value, i) => { + if (!self.unitRadius) { + self.unitRadius = maxRadius / maxD; + } + radii[i] = value * self.unitRadius; + }); + self.radii = radii; + const eIdealD = self.eIdealDisMatrix(); + // const eIdealD = scaleMatrix(D, linkDistance); + self.eIdealDistances = eIdealD; + // the weight matrix, Wij = 1 / dij^(-2) + const W = getWeightMatrix(eIdealD); + self.weights = W; + // the initial positions from mds + const mds = new MDS({ linkDistance, distances: eIdealD }); + let positions = mds.layout(); + positions.forEach((p) => { + if (isNaN$2(p[0])) { + p[0] = Math.random() * linkDistance; + } + if (isNaN$2(p[1])) { + p[1] = Math.random() * linkDistance; + } + }); + self.positions = positions; + positions.forEach((p, i) => { + nodes[i].x = p[0] + center[0]; + nodes[i].y = p[1] + center[1]; + }); + // move the graph to origin, centered at focusNode + positions.forEach((p) => { + p[0] -= positions[focusIndex][0]; + p[1] -= positions[focusIndex][1]; + }); + self.run(); + const preventOverlap = self.preventOverlap; + const nodeSize = self.nodeSize; + let nodeSizeFunc; + const strictRadial = self.strictRadial; + // stagger the overlapped nodes + if (preventOverlap) { + const nodeSpacing = self.nodeSpacing; + let nodeSpacingFunc; + if (isNumber$2(nodeSpacing)) { + nodeSpacingFunc = () => nodeSpacing; + } + else if (isFunction$5(nodeSpacing)) { + nodeSpacingFunc = nodeSpacing; + } + else { + nodeSpacingFunc = () => 0; + } + if (!nodeSize) { + nodeSizeFunc = (d) => { + if (d.size) { + if (isArray$l(d.size)) { + const res = d.size[0] > d.size[1] ? d.size[0] : d.size[1]; + return res + nodeSpacingFunc(d); + } + if (isObject$e(d.size)) { + const res = d.size.width > d.size.height ? d.size.width : d.size.height; + return res + nodeSpacingFunc(d); + } + return d.size + nodeSpacingFunc(d); + } + return 10 + nodeSpacingFunc(d); + }; + } + else if (isArray$l(nodeSize)) { + nodeSizeFunc = (d) => { + const res = nodeSize[0] > nodeSize[1] ? nodeSize[0] : nodeSize[1]; + return res + nodeSpacingFunc(d); + }; + } + else { + nodeSizeFunc = (d) => nodeSize + nodeSpacingFunc(d); + } + const nonoverlapForceParams = { + nodes, + nodeSizeFunc, + adjMatrix, + positions, + radii, + height, + width, + strictRadial, + focusID: focusIndex, + iterations: self.maxPreventOverlapIteration || 200, + k: positions.length / 4.5 + }; + const nonoverlapForce = new RadialNonoverlapForce(nonoverlapForceParams); + positions = nonoverlapForce.layout(); + } + // move the graph to center + positions.forEach((p, i) => { + nodes[i].x = p[0] + center[0]; + nodes[i].y = p[1] + center[1]; + }); + if (self.onLayoutEnd) + self.onLayoutEnd(); + return { + nodes, + edges + }; + } + run() { + const self = this; + const maxIteration = self.maxIteration; + const positions = self.positions || []; + const W = self.weights || []; + const eIdealDis = self.eIdealDistances || []; + const radii = self.radii || []; + for (let i = 0; i <= maxIteration; i++) { + const param = i / maxIteration; + self.oneIteration(param, positions, radii, eIdealDis, W); + } + } + oneIteration(param, positions, radii, D, W) { + const self = this; + const vparam = 1 - param; + const focusIndex = self.focusIndex; + positions.forEach((v, i) => { + // v + const originDis = getEDistance(v, [0, 0]); + const reciODis = originDis === 0 ? 0 : 1 / originDis; + if (i === focusIndex) { + return; + } + let xMolecule = 0; + let yMolecule = 0; + let denominator = 0; + positions.forEach((u, j) => { + // u + if (i === j) { + return; + } + // the euclidean distance between v and u + const edis = getEDistance(v, u); + const reciEdis = edis === 0 ? 0 : 1 / edis; + const idealDis = D[j][i]; + // same for x and y + denominator += W[i][j]; + // x + xMolecule += W[i][j] * (u[0] + idealDis * (v[0] - u[0]) * reciEdis); + // y + yMolecule += W[i][j] * (u[1] + idealDis * (v[1] - u[1]) * reciEdis); + }); + const reciR = radii[i] === 0 ? 0 : 1 / radii[i]; + denominator *= vparam; + denominator += param * reciR * reciR; + // x + xMolecule *= vparam; + xMolecule += param * reciR * v[0] * reciODis; + v[0] = xMolecule / denominator; + // y + yMolecule *= vparam; + yMolecule += param * reciR * v[1] * reciODis; + v[1] = yMolecule / denominator; + }); + } + eIdealDisMatrix() { + const self = this; + const nodes = self.nodes; + if (!nodes) + return []; + const D = self.distances; + const linkDis = self.linkDistance; + const radii = self.radii || []; + const unitRadius = self.unitRadius || 50; + const result = []; + if (D) { + D.forEach((row, i) => { + const newRow = []; + row.forEach((v, j) => { + if (i === j) { + newRow.push(0); + } + else if (radii[i] === radii[j]) { + // i and j are on the same circle + if (self.sortBy === "data") { + // sort the nodes on the same circle according to the ordering of the data + newRow.push((v * (Math.abs(i - j) * self.sortStrength)) / + (radii[i] / unitRadius)); + } + else if (self.sortBy) { + // sort the nodes on the same circle according to the attributes + let iValue = nodes[i][self.sortBy] || 0; + let jValue = nodes[j][self.sortBy] || 0; + if (isString$2(iValue)) { + iValue = iValue.charCodeAt(0); + } + if (isString$2(jValue)) { + jValue = jValue.charCodeAt(0); + } + newRow.push((v * (Math.abs(iValue - jValue) * self.sortStrength)) / + (radii[i] / unitRadius)); + } + else { + newRow.push((v * linkDis) / (radii[i] / unitRadius)); + } + } + else { + // i and j are on different circle + // i and j are on different circle + const link = (linkDis + unitRadius) / 2; + newRow.push(v * link); + } + }); + result.push(newRow); + }); + } + return result; + } + handleInfinity(matrix, focusIndex, step) { + const length = matrix.length; + // 遍历 matrix 中遍历 focus 对应行 + for (let i = 0; i < length; i++) { + // matrix 关注点对应行的 Inf 项 + if (matrix[focusIndex][i] === Infinity) { + matrix[focusIndex][i] = step; + matrix[i][focusIndex] = step; + // 遍历 matrix 中的 i 行，i 行中非 Inf 项若在 focus 行为 Inf，则替换 focus 行的那个 Inf + for (let j = 0; j < length; j++) { + if (matrix[i][j] !== Infinity && matrix[focusIndex][j] === Infinity) { + matrix[focusIndex][j] = step + matrix[i][j]; + matrix[j][focusIndex] = step + matrix[i][j]; + } + } + } + } + // 处理其他行的 Inf。根据该行对应点与 focus 距离以及 Inf 项点 与 focus 距离，决定替换值 + for (let i = 0; i < length; i++) { + if (i === focusIndex) { + continue; + } + for (let j = 0; j < length; j++) { + if (matrix[i][j] === Infinity) { + let minus = Math.abs(matrix[focusIndex][i] - matrix[focusIndex][j]); + minus = minus === 0 ? 1 : minus; + matrix[i][j] = minus; + } + } + } + } + maxToFocus(matrix, focusIndex) { + let max = 0; + for (let i = 0; i < matrix[focusIndex].length; i++) { + if (matrix[focusIndex][i] === Infinity) { + continue; + } + max = matrix[focusIndex][i] > max ? matrix[focusIndex][i] : max; + } + return max; + } + getType() { + return "radial"; + } +} + +/** + * @fileOverview concentric layout + * @author shiwu.wyy@antfin.com + * this algorithm refers to - https://github.com/cytoscape/cytoscape.js/ + */ +/** + * 同心圆布局 + */ +class ConcentricLayout extends Base { + constructor(options) { + super(); + this.nodeSize = 30; + /** min spacing between outside of nodes (used for radius adjustment) */ + this.minNodeSpacing = 10; + /** prevents node overlap, may overflow boundingBox if not enough space */ + this.preventOverlap = false; + /** whether levels have an equal radial distance betwen them, may cause bounding box overflow */ + this.equidistant = false; + /** where nodes start in radians */ + this.startAngle = (3 / 2) * Math.PI; + /** whether the layout should go clockwise (true) or counterclockwise/anticlockwise (false) */ + this.clockwise = true; + /** 根据 sortBy 指定的属性进行排布，数值高的放在中心，如果是 sortBy 则会计算节点度数，度数最高的放在中心 */ + this.sortBy = "degree"; + this.nodes = []; + this.edges = []; + this.width = 300; + this.height = 300; + /** 迭代结束的回调函数 */ + this.onLayoutEnd = () => { }; + this.updateCfg(options); + } + getDefaultCfg() { + return { + nodeSize: 30, + minNodeSpacing: 10, + preventOverlap: false, + sweep: undefined, + equidistant: false, + startAngle: (3 / 2) * Math.PI, + clockwise: true, + maxLevelDiff: undefined, + sortBy: "degree" + }; + } + /** + * 执行布局 + */ + execute() { + const self = this; + const nodes = self.nodes; + const edges = self.edges; + const n = nodes.length; + if (n === 0) { + if (self.onLayoutEnd) + self.onLayoutEnd(); + return; + } + if (!self.width && typeof window !== "undefined") { + self.width = window.innerWidth; + } + if (!self.height && typeof window !== "undefined") { + self.height = window.innerHeight; + } + if (!self.center) { + self.center = [self.width / 2, self.height / 2]; + } + const center = self.center; + if (n === 1) { + nodes[0].x = center[0]; + nodes[0].y = center[1]; + if (self.onLayoutEnd) + self.onLayoutEnd(); + return; + } + const layoutNodes = []; + let maxNodeSize; + if (isArray$l(self.nodeSize)) { + maxNodeSize = Math.max(self.nodeSize[0], self.nodeSize[1]); + } + else { + maxNodeSize = self.nodeSize; + } + nodes.forEach((node) => { + layoutNodes.push(node); + let nodeSize = maxNodeSize; + if (isArray$l(node.size)) { + nodeSize = Math.max(node.size[0], node.size[1]); + } + else if (isNumber$2(node.size)) { + nodeSize = node.size; + } + else if (isObject$e(node.size)) { + nodeSize = Math.max(node.size.width, node.size.height); + } + maxNodeSize = Math.max(maxNodeSize, nodeSize); + }); + self.clockwise = + self.counterclockwise !== undefined + ? !self.counterclockwise + : self.clockwise; + // layout + const nodeMap = {}; + const indexMap = {}; + layoutNodes.forEach((node, i) => { + nodeMap[node.id] = node; + indexMap[node.id] = i; + }); + // get the node degrees + if (self.sortBy === "degree" || + !isString$2(self.sortBy) || + layoutNodes[0][self.sortBy] === undefined) { + self.sortBy = "degree"; + if (!isNumber$2(nodes[0].degree)) { + const values = getDegree(nodes.length, indexMap, edges); + layoutNodes.forEach((node, i) => { + node.degree = values[i]; + }); + } + } + // sort nodes by value + layoutNodes.sort((n1, n2) => n2[self.sortBy] - n1[self.sortBy]); + self.maxValueNode = layoutNodes[0]; + self.maxLevelDiff = + self.maxLevelDiff || self.maxValueNode[self.sortBy] / 4; + // put the values into levels + const levels = [[]]; + let currentLevel = levels[0]; + layoutNodes.forEach((node) => { + if (currentLevel.length > 0) { + const diff = Math.abs(currentLevel[0][self.sortBy] - node[self.sortBy]); + if (self.maxLevelDiff && diff >= self.maxLevelDiff) { + currentLevel = []; + levels.push(currentLevel); + } + } + currentLevel.push(node); + }); + // create positions for levels + let minDist = maxNodeSize + self.minNodeSpacing; // min dist between nodes + if (!self.preventOverlap) { + // then strictly constrain to bb + const firstLvlHasMulti = levels.length > 0 && levels[0].length > 1; + const maxR = Math.min(self.width, self.height) / 2 - minDist; + const rStep = maxR / (levels.length + (firstLvlHasMulti ? 1 : 0)); + minDist = Math.min(minDist, rStep); + } + // find the metrics for each level + let r = 0; + levels.forEach((level) => { + let sweep = self.sweep; + if (sweep === undefined) { + sweep = 2 * Math.PI - (2 * Math.PI) / level.length; + } + const dTheta = (level.dTheta = sweep / Math.max(1, level.length - 1)); + // calculate the radius + if (level.length > 1 && self.preventOverlap) { + // but only if more than one node (can't overlap) + const dcos = Math.cos(dTheta) - Math.cos(0); + const dsin = Math.sin(dTheta) - Math.sin(0); + const rMin = Math.sqrt((minDist * minDist) / (dcos * dcos + dsin * dsin)); // s.t. no nodes overlapping + r = Math.max(rMin, r); + } + level.r = r; + r += minDist; + }); + if (self.equidistant) { + let rDeltaMax = 0; + let rr = 0; + for (let i = 0; i < levels.length; i++) { + const level = levels[i]; + const rDelta = level.r - rr; + rDeltaMax = Math.max(rDeltaMax, rDelta); + } + rr = 0; + levels.forEach((level, i) => { + if (i === 0) { + rr = level.r; + } + level.r = rr; + rr += rDeltaMax; + }); + } + // calculate the node positions + levels.forEach((level) => { + const dTheta = level.dTheta; + const rr = level.r; + level.forEach((node, j) => { + const theta = self.startAngle + (self.clockwise ? 1 : -1) * dTheta * j; + node.x = center[0] + rr * Math.cos(theta); + node.y = center[1] + rr * Math.sin(theta); + }); + }); + if (self.onLayoutEnd) + self.onLayoutEnd(); + return { + nodes, + edges + }; + } + getType() { + return "concentric"; + } +} + +/** + * @fileOverview MDS layout + * @author shiwu.wyy@antfin.com + */ +/** + * mds 布局 + */ +class MDSLayout extends Base { + constructor(options) { + super(); + /** 布局中心 */ + this.center = [0, 0]; + /** 边长度 */ + this.linkDistance = 50; + this.nodes = []; + this.edges = []; + /** 迭代结束的回调函数 */ + this.onLayoutEnd = () => { }; + this.updateCfg(options); + } + getDefaultCfg() { + return { + center: [0, 0], + linkDistance: 50 + }; + } + /** + * 执行布局 + */ + execute() { + const self = this; + const { nodes, edges = [] } = self; + const center = self.center; + if (!nodes || nodes.length === 0) { + if (self.onLayoutEnd) + self.onLayoutEnd(); + return; + } + if (nodes.length === 1) { + nodes[0].x = center[0]; + nodes[0].y = center[1]; + if (self.onLayoutEnd) + self.onLayoutEnd(); + return; + } + const linkDistance = self.linkDistance; + // the graph-theoretic distance (shortest path distance) matrix + const adjMatrix = getAdjMatrix({ nodes, edges }, false); + const distances = floydWarshall$1(adjMatrix); + self.handleInfinity(distances); + // scale the ideal edge length acoording to linkDistance + const scaledD = scaleMatrix(distances, linkDistance); + self.scaledDistances = scaledD; + // get positions by MDS + const positions = self.runMDS(); + self.positions = positions; + positions.forEach((p, i) => { + nodes[i].x = p[0] + center[0]; + nodes[i].y = p[1] + center[1]; + }); + if (self.onLayoutEnd) + self.onLayoutEnd(); + return { + nodes, + edges + }; + } + /** + * mds 算法 + * @return {array} positions 计算后的节点位置数组 + */ + runMDS() { + const self = this; + const dimension = 2; + const distances = self.scaledDistances; + // square distances + const M = Matrix.mul(Matrix.pow(distances, 2), -0.5); + // double centre the rows/columns + const rowMeans = M.mean("row"); + const colMeans = M.mean("column"); + const totalMean = M.mean(); + M.add(totalMean) + .subRowVector(rowMeans) + .subColumnVector(colMeans); + // take the SVD of the double centred matrix, and return the + // points from it + const ret = new SingularValueDecomposition(M); + const eigenValues = Matrix.sqrt(ret.diagonalMatrix).diagonal(); + return ret.leftSingularVectors.toJSON().map((row) => { + return Matrix.mul([row], [eigenValues]) + .toJSON()[0] + .splice(0, dimension); + }); + } + handleInfinity(distances) { + let maxDistance = -999999; + distances.forEach((row) => { + row.forEach((value) => { + if (value === Infinity) { + return; + } + if (maxDistance < value) { + maxDistance = value; + } + }); + }); + distances.forEach((row, i) => { + row.forEach((value, j) => { + if (value === Infinity) { + distances[i][j] = maxDistance; + } + }); + }); + } + getType() { + return "mds"; + } +} + +/** + * @fileOverview fruchterman layout + * @author shiwu.wyy@antfin.com + */ +const SPEED_DIVISOR = 800; +/** + * fruchterman 布局 + */ +class FruchtermanLayout extends Base { + constructor(options) { + super(); + /** 停止迭代的最大迭代数 */ + this.maxIteration = 1000; + /** 重力大小，影响图的紧凑程度 */ + this.gravity = 10; + /** 速度 */ + this.speed = 5; + /** 是否产生聚类力 */ + this.clustering = false; + /** 聚类力大小 */ + this.clusterGravity = 10; + this.nodes = []; + this.edges = []; + this.width = 300; + this.height = 300; + this.nodeMap = {}; + this.nodeIdxMap = {}; + /** 迭代结束的回调函数 */ + this.onLayoutEnd = () => { }; + /** 每次迭代结束的回调函数 */ + this.tick = () => { }; + this.updateCfg(options); + } + getDefaultCfg() { + return { + maxIteration: 1000, + gravity: 10, + speed: 1, + clustering: false, + clusterGravity: 10 + }; + } + /** + * 执行布局 + */ + execute() { + const self = this; + const nodes = self.nodes; + if (self.timeInterval !== undefined && typeof window !== "undefined") { + window.clearInterval(self.timeInterval); + } + if (!nodes || nodes.length === 0) { + if (self.onLayoutEnd) + self.onLayoutEnd(); + return; + } + if (!self.width && typeof window !== "undefined") { + self.width = window.innerWidth; + } + if (!self.height && typeof window !== "undefined") { + self.height = window.innerHeight; + } + if (!self.center) { + self.center = [self.width / 2, self.height / 2]; + } + const center = self.center; + if (nodes.length === 1) { + nodes[0].x = center[0]; + nodes[0].y = center[1]; + if (self.onLayoutEnd) + self.onLayoutEnd(); + return; + } + const nodeMap = {}; + const nodeIdxMap = {}; + nodes.forEach((node, i) => { + if (!isNumber$2(node.x)) + node.x = Math.random() * this.width; + if (!isNumber$2(node.y)) + node.y = Math.random() * this.height; + nodeMap[node.id] = node; + nodeIdxMap[node.id] = i; + }); + self.nodeMap = nodeMap; + self.nodeIdxMap = nodeIdxMap; + // layout + return self.run(); + } + run() { + const self = this; + const nodes = self.nodes; + if (!nodes) + return; + const edges = self.edges; + const maxIteration = self.maxIteration; + const center = self.center; + const area = self.height * self.width; + const maxDisplace = Math.sqrt(area) / 10; + const k2 = area / (nodes.length + 1); + const k = Math.sqrt(k2); + const gravity = self.gravity; + const speed = self.speed; + const clustering = self.clustering; + const clusterMap = {}; + if (clustering) { + nodes.forEach((n) => { + if (clusterMap[n.cluster] === undefined) { + const cluster = { + name: n.cluster, + cx: 0, + cy: 0, + count: 0 + }; + clusterMap[n.cluster] = cluster; + } + const c = clusterMap[n.cluster]; + if (isNumber$2(n.x)) { + c.cx += n.x; + } + if (isNumber$2(n.y)) { + c.cy += n.y; + } + c.count++; + }); + for (const key in clusterMap) { + clusterMap[key].cx /= clusterMap[key].count; + clusterMap[key].cy /= clusterMap[key].count; + } + } + if (typeof window === "undefined") + return; + let iter = 0; + // interval for render the result after each iteration + this.timeInterval = window.setInterval(() => { + if (!nodes) + return; + // for (let i = 0; i < maxIteration; i++) { + const displacements = []; + nodes.forEach((_, j) => { + displacements[j] = { x: 0, y: 0 }; + }); + self.applyCalculate(nodes, edges, displacements, k, k2); + // gravity for clusters + if (clustering) { + const clusterGravity = self.clusterGravity || gravity; + nodes.forEach((n, j) => { + if (!isNumber$2(n.x) || !isNumber$2(n.y)) + return; + const c = clusterMap[n.cluster]; + const distLength = Math.sqrt((n.x - c.cx) * (n.x - c.cx) + (n.y - c.cy) * (n.y - c.cy)); + const gravityForce = k * clusterGravity; + displacements[j].x -= (gravityForce * (n.x - c.cx)) / distLength; + displacements[j].y -= (gravityForce * (n.y - c.cy)) / distLength; + }); + for (const key in clusterMap) { + clusterMap[key].cx = 0; + clusterMap[key].cy = 0; + clusterMap[key].count = 0; + } + nodes.forEach((n) => { + const c = clusterMap[n.cluster]; + if (isNumber$2(n.x)) { + c.cx += n.x; + } + if (isNumber$2(n.y)) { + c.cy += n.y; + } + c.count++; + }); + for (const key in clusterMap) { + clusterMap[key].cx /= clusterMap[key].count; + clusterMap[key].cy /= clusterMap[key].count; + } + } + // gravity + nodes.forEach((n, j) => { + if (!isNumber$2(n.x) || !isNumber$2(n.y)) + return; + const gravityForce = 0.01 * k * gravity; + displacements[j].x -= gravityForce * (n.x - center[0]); + displacements[j].y -= gravityForce * (n.y - center[1]); + }); + // move + nodes.forEach((n, j) => { + if (isNumber$2(n.fx) && isNumber$2(n.fy)) { + n.x = n.fx; + n.y = n.fy; + return; + } + if (!isNumber$2(n.x) || !isNumber$2(n.y)) + return; + const distLength = Math.sqrt(displacements[j].x * displacements[j].x + + displacements[j].y * displacements[j].y); + if (distLength > 0) { + // && !n.isFixed() + const limitedDist = Math.min(maxDisplace * (speed / SPEED_DIVISOR), distLength); + n.x += (displacements[j].x / distLength) * limitedDist; + n.y += (displacements[j].y / distLength) * limitedDist; + } + }); + if (self.tick) + self.tick(); + iter++; + if (iter >= maxIteration) { + if (self.onLayoutEnd) + self.onLayoutEnd(); + window.clearInterval(self.timeInterval); + } + }, 0); + return { + nodes, + edges + }; + } + applyCalculate(nodes, edges, displacements, k, k2) { + const self = this; + self.calRepulsive(nodes, displacements, k2); + if (edges) + self.calAttractive(edges, displacements, k); + } + calRepulsive(nodes, displacements, k2) { + nodes.forEach((v, i) => { + displacements[i] = { x: 0, y: 0 }; + nodes.forEach((u, j) => { + if (i === j) { + return; + } + if (!isNumber$2(v.x) || + !isNumber$2(u.x) || + !isNumber$2(v.y) || + !isNumber$2(u.y)) { + return; + } + let vecX = v.x - u.x; + let vecY = v.y - u.y; + let vecLengthSqr = vecX * vecX + vecY * vecY; + if (vecLengthSqr === 0) { + vecLengthSqr = 1; + const sign = i > j ? 1 : -1; + vecX = 0.01 * sign; + vecY = 0.01 * sign; + } + const common = k2 / vecLengthSqr; + displacements[i].x += vecX * common; + displacements[i].y += vecY * common; + }); + }); + } + calAttractive(edges, displacements, k) { + edges.forEach((e) => { + const source = getEdgeTerminal(e, 'source'); + const target = getEdgeTerminal(e, 'target'); + if (!source || !target) + return; + const uIndex = this.nodeIdxMap[source]; + const vIndex = this.nodeIdxMap[target]; + if (uIndex === vIndex) { + return; + } + const u = this.nodeMap[source]; + const v = this.nodeMap[target]; + if (!isNumber$2(v.x) || !isNumber$2(u.x) || !isNumber$2(v.y) || !isNumber$2(u.y)) { + return; + } + const vecX = v.x - u.x; + const vecY = v.y - u.y; + const vecLength = Math.sqrt(vecX * vecX + vecY * vecY); + const common = (vecLength * vecLength) / k; + displacements[vIndex].x -= (vecX / vecLength) * common; + displacements[vIndex].y -= (vecY / vecLength) * common; + displacements[uIndex].x += (vecX / vecLength) * common; + displacements[uIndex].y += (vecY / vecLength) * common; + }); + } + stop() { + if (this.timeInterval && typeof window !== "undefined") { + window.clearInterval(this.timeInterval); + } + } + destroy() { + const self = this; + self.stop(); + self.tick = null; + self.nodes = null; + self.edges = null; + self.destroyed = true; + } + getType() { + return "fruchterman"; + } +} + +function _initializerDefineProperty(target, property, descriptor, context) { + if (!descriptor) return; + Object.defineProperty(target, property, { + enumerable: descriptor.enumerable, + configurable: descriptor.configurable, + writable: descriptor.writable, + value: descriptor.initializer ? descriptor.initializer.call(context) : void 0 + }); +} + +function _classCallCheck(instance, Constructor) { + if (!(instance instanceof Constructor)) { + throw new TypeError("Cannot call a class as a function"); + } +} + +function _defineProperties(target, props) { + for (var i = 0; i < props.length; i++) { + var descriptor = props[i]; + descriptor.enumerable = descriptor.enumerable || false; + descriptor.configurable = true; + if ("value" in descriptor) descriptor.writable = true; + Object.defineProperty(target, descriptor.key, descriptor); + } +} + +function _createClass(Constructor, protoProps, staticProps) { + if (protoProps) _defineProperties(Constructor.prototype, protoProps); + if (staticProps) _defineProperties(Constructor, staticProps); + return Constructor; +} + +function _applyDecoratedDescriptor(target, property, decorators, descriptor, context) { + var desc = {}; + Object.keys(descriptor).forEach(function (key) { + desc[key] = descriptor[key]; + }); + desc.enumerable = !!desc.enumerable; + desc.configurable = !!desc.configurable; + + if ('value' in desc || desc.initializer) { + desc.writable = true; + } + + desc = decorators.slice().reverse().reduce(function (desc, decorator) { + return decorator(target, property, desc) || desc; + }, desc); + + if (context && desc.initializer !== void 0) { + desc.value = desc.initializer ? desc.initializer.call(context) : void 0; + desc.initializer = undefined; + } + + if (desc.initializer === void 0) { + Object.defineProperty(target, property, desc); + desc = null; + } + + return desc; +} + +/*! ***************************************************************************** +Copyright (C) Microsoft. All rights reserved. +Licensed under the Apache License, Version 2.0 (the "License"); you may not use +this file except in compliance with the License. You may obtain a copy of the +License at http://www.apache.org/licenses/LICENSE-2.0 + +THIS CODE IS PROVIDED ON AN *AS IS* BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY +KIND, EITHER EXPRESS OR IMPLIED, INCLUDING WITHOUT LIMITATION ANY IMPLIED +WARRANTIES OR CONDITIONS OF TITLE, FITNESS FOR A PARTICULAR PURPOSE, +MERCHANTABLITY OR NON-INFRINGEMENT. + +See the Apache Version 2.0 License for specific language governing permissions +and limitations under the License. +***************************************************************************** */ + +var Reflect$1; +(function (Reflect) { + // Metadata Proposal + // https://rbuckton.github.io/reflect-metadata/ + (function (factory) { + var root = typeof commonjsGlobal === "object" ? commonjsGlobal : + typeof self === "object" ? self : + typeof this === "object" ? this : + Function("return this;")(); + var exporter = makeExporter(Reflect); + if (typeof root.Reflect === "undefined") { + root.Reflect = Reflect; + } + else { + exporter = makeExporter(root.Reflect, exporter); + } + factory(exporter); + function makeExporter(target, previous) { + return function (key, value) { + if (typeof target[key] !== "function") { + Object.defineProperty(target, key, { configurable: true, writable: true, value: value }); + } + if (previous) + previous(key, value); + }; + } + })(function (exporter) { + var hasOwn = Object.prototype.hasOwnProperty; + // feature test for Symbol support + var supportsSymbol = typeof Symbol === "function"; + var toPrimitiveSymbol = supportsSymbol && typeof Symbol.toPrimitive !== "undefined" ? Symbol.toPrimitive : "@@toPrimitive"; + var iteratorSymbol = supportsSymbol && typeof Symbol.iterator !== "undefined" ? Symbol.iterator : "@@iterator"; + var supportsCreate = typeof Object.create === "function"; // feature test for Object.create support + var supportsProto = { __proto__: [] } instanceof Array; // feature test for __proto__ support + var downLevel = !supportsCreate && !supportsProto; + var HashMap = { + // create an object in dictionary mode (a.k.a. "slow" mode in v8) + create: supportsCreate + ? function () { return MakeDictionary(Object.create(null)); } + : supportsProto + ? function () { return MakeDictionary({ __proto__: null }); } + : function () { return MakeDictionary({}); }, + has: downLevel + ? function (map, key) { return hasOwn.call(map, key); } + : function (map, key) { return key in map; }, + get: downLevel + ? function (map, key) { return hasOwn.call(map, key) ? map[key] : undefined; } + : function (map, key) { return map[key]; }, + }; + // Load global or shim versions of Map, Set, and WeakMap + var functionPrototype = Object.getPrototypeOf(Function); + var usePolyfill = typeof process === "object" && process.env && process.env["REFLECT_METADATA_USE_MAP_POLYFILL"] === "true"; + var _Map = !usePolyfill && typeof Map === "function" && typeof Map.prototype.entries === "function" ? Map : CreateMapPolyfill(); + var _Set = !usePolyfill && typeof Set === "function" && typeof Set.prototype.entries === "function" ? Set : CreateSetPolyfill(); + var _WeakMap = !usePolyfill && typeof WeakMap === "function" ? WeakMap : CreateWeakMapPolyfill(); + // [[Metadata]] internal slot + // https://rbuckton.github.io/reflect-metadata/#ordinary-object-internal-methods-and-internal-slots + var Metadata = new _WeakMap(); + /** + * Applies a set of decorators to a property of a target object. + * @param decorators An array of decorators. + * @param target The target object. + * @param propertyKey (Optional) The property key to decorate. + * @param attributes (Optional) The property descriptor for the target key. + * @remarks Decorators are applied in reverse order. + * @example + * + * class Example { + * // property declarations are not part of ES6, though they are valid in TypeScript: + * // static staticProperty; + * // property; + * + * constructor(p) { } + * static staticMethod(p) { } + * method(p) { } + * } + * + * // constructor + * Example = Reflect.decorate(decoratorsArray, Example); + * + * // property (on constructor) + * Reflect.decorate(decoratorsArray, Example, "staticProperty"); + * + * // property (on prototype) + * Reflect.decorate(decoratorsArray, Example.prototype, "property"); + * + * // method (on constructor) + * Object.defineProperty(Example, "staticMethod", + * Reflect.decorate(decoratorsArray, Example, "staticMethod", + * Object.getOwnPropertyDescriptor(Example, "staticMethod"))); + * + * // method (on prototype) + * Object.defineProperty(Example.prototype, "method", + * Reflect.decorate(decoratorsArray, Example.prototype, "method", + * Object.getOwnPropertyDescriptor(Example.prototype, "method"))); + * + */ + function decorate(decorators, target, propertyKey, attributes) { + if (!IsUndefined(propertyKey)) { + if (!IsArray(decorators)) + throw new TypeError(); + if (!IsObject(target)) + throw new TypeError(); + if (!IsObject(attributes) && !IsUndefined(attributes) && !IsNull(attributes)) + throw new TypeError(); + if (IsNull(attributes)) + attributes = undefined; + propertyKey = ToPropertyKey(propertyKey); + return DecorateProperty(decorators, target, propertyKey, attributes); + } + else { + if (!IsArray(decorators)) + throw new TypeError(); + if (!IsConstructor(target)) + throw new TypeError(); + return DecorateConstructor(decorators, target); + } + } + exporter("decorate", decorate); + // 4.1.2 Reflect.metadata(metadataKey, metadataValue) + // https://rbuckton.github.io/reflect-metadata/#reflect.metadata + /** + * A default metadata decorator factory that can be used on a class, class member, or parameter. + * @param metadataKey The key for the metadata entry. + * @param metadataValue The value for the metadata entry. + * @returns A decorator function. + * @remarks + * If `metadataKey` is already defined for the target and target key, the + * metadataValue for that key will be overwritten. + * @example + * + * // constructor + * @Reflect.metadata(key, value) + * class Example { + * } + * + * // property (on constructor, TypeScript only) + * class Example { + * @Reflect.metadata(key, value) + * static staticProperty; + * } + * + * // property (on prototype, TypeScript only) + * class Example { + * @Reflect.metadata(key, value) + * property; + * } + * + * // method (on constructor) + * class Example { + * @Reflect.metadata(key, value) + * static staticMethod() { } + * } + * + * // method (on prototype) + * class Example { + * @Reflect.metadata(key, value) + * method() { } + * } + * + */ + function metadata(metadataKey, metadataValue) { + function decorator(target, propertyKey) { + if (!IsObject(target)) + throw new TypeError(); + if (!IsUndefined(propertyKey) && !IsPropertyKey(propertyKey)) + throw new TypeError(); + OrdinaryDefineOwnMetadata(metadataKey, metadataValue, target, propertyKey); + } + return decorator; + } + exporter("metadata", metadata); + /** + * Define a unique metadata entry on the target. + * @param metadataKey A key used to store and retrieve metadata. + * @param metadataValue A value that contains attached metadata. + * @param target The target object on which to define metadata. + * @param propertyKey (Optional) The property key for the target. + * @example + * + * class Example { + * // property declarations are not part of ES6, though they are valid in TypeScript: + * // static staticProperty; + * // property; + * + * constructor(p) { } + * static staticMethod(p) { } + * method(p) { } + * } + * + * // constructor + * Reflect.defineMetadata("custom:annotation", options, Example); + * + * // property (on constructor) + * Reflect.defineMetadata("custom:annotation", options, Example, "staticProperty"); + * + * // property (on prototype) + * Reflect.defineMetadata("custom:annotation", options, Example.prototype, "property"); + * + * // method (on constructor) + * Reflect.defineMetadata("custom:annotation", options, Example, "staticMethod"); + * + * // method (on prototype) + * Reflect.defineMetadata("custom:annotation", options, Example.prototype, "method"); + * + * // decorator factory as metadata-producing annotation. + * function MyAnnotation(options): Decorator { + * return (target, key?) => Reflect.defineMetadata("custom:annotation", options, target, key); + * } + * + */ + function defineMetadata(metadataKey, metadataValue, target, propertyKey) { + if (!IsObject(target)) + throw new TypeError(); + if (!IsUndefined(propertyKey)) + propertyKey = ToPropertyKey(propertyKey); + return OrdinaryDefineOwnMetadata(metadataKey, metadataValue, target, propertyKey); + } + exporter("defineMetadata", defineMetadata); + /** + * Gets a value indicating whether the target object or its prototype chain has the provided metadata key defined. + * @param metadataKey A key used to store and retrieve metadata. + * @param target The target object on which the metadata is defined. + * @param propertyKey (Optional) The property key for the target. + * @returns `true` if the metadata key was defined on the target object or its prototype chain; otherwise, `false`. + * @example + * + * class Example { + * // property declarations are not part of ES6, though they are valid in TypeScript: + * // static staticProperty; + * // property; + * + * constructor(p) { } + * static staticMethod(p) { } + * method(p) { } + * } + * + * // constructor + * result = Reflect.hasMetadata("custom:annotation", Example); + * + * // property (on constructor) + * result = Reflect.hasMetadata("custom:annotation", Example, "staticProperty"); + * + * // property (on prototype) + * result = Reflect.hasMetadata("custom:annotation", Example.prototype, "property"); + * + * // method (on constructor) + * result = Reflect.hasMetadata("custom:annotation", Example, "staticMethod"); + * + * // method (on prototype) + * result = Reflect.hasMetadata("custom:annotation", Example.prototype, "method"); + * + */ + function hasMetadata(metadataKey, target, propertyKey) { + if (!IsObject(target)) + throw new TypeError(); + if (!IsUndefined(propertyKey)) + propertyKey = ToPropertyKey(propertyKey); + return OrdinaryHasMetadata(metadataKey, target, propertyKey); + } + exporter("hasMetadata", hasMetadata); + /** + * Gets a value indicating whether the target object has the provided metadata key defined. + * @param metadataKey A key used to store and retrieve metadata. + * @param target The target object on which the metadata is defined. + * @param propertyKey (Optional) The property key for the target. + * @returns `true` if the metadata key was defined on the target object; otherwise, `false`. + * @example + * + * class Example { + * // property declarations are not part of ES6, though they are valid in TypeScript: + * // static staticProperty; + * // property; + * + * constructor(p) { } + * static staticMethod(p) { } + * method(p) { } + * } + * + * // constructor + * result = Reflect.hasOwnMetadata("custom:annotation", Example); + * + * // property (on constructor) + * result = Reflect.hasOwnMetadata("custom:annotation", Example, "staticProperty"); + * + * // property (on prototype) + * result = Reflect.hasOwnMetadata("custom:annotation", Example.prototype, "property"); + * + * // method (on constructor) + * result = Reflect.hasOwnMetadata("custom:annotation", Example, "staticMethod"); + * + * // method (on prototype) + * result = Reflect.hasOwnMetadata("custom:annotation", Example.prototype, "method"); + * + */ + function hasOwnMetadata(metadataKey, target, propertyKey) { + if (!IsObject(target)) + throw new TypeError(); + if (!IsUndefined(propertyKey)) + propertyKey = ToPropertyKey(propertyKey); + return OrdinaryHasOwnMetadata(metadataKey, target, propertyKey); + } + exporter("hasOwnMetadata", hasOwnMetadata); + /** + * Gets the metadata value for the provided metadata key on the target object or its prototype chain. + * @param metadataKey A key used to store and retrieve metadata. + * @param target The target object on which the metadata is defined. + * @param propertyKey (Optional) The property key for the target. + * @returns The metadata value for the metadata key if found; otherwise, `undefined`. + * @example + * + * class Example { + * // property declarations are not part of ES6, though they are valid in TypeScript: + * // static staticProperty; + * // property; + * + * constructor(p) { } + * static staticMethod(p) { } + * method(p) { } + * } + * + * // constructor + * result = Reflect.getMetadata("custom:annotation", Example); + * + * // property (on constructor) + * result = Reflect.getMetadata("custom:annotation", Example, "staticProperty"); + * + * // property (on prototype) + * result = Reflect.getMetadata("custom:annotation", Example.prototype, "property"); + * + * // method (on constructor) + * result = Reflect.getMetadata("custom:annotation", Example, "staticMethod"); + * + * // method (on prototype) + * result = Reflect.getMetadata("custom:annotation", Example.prototype, "method"); + * + */ + function getMetadata(metadataKey, target, propertyKey) { + if (!IsObject(target)) + throw new TypeError(); + if (!IsUndefined(propertyKey)) + propertyKey = ToPropertyKey(propertyKey); + return OrdinaryGetMetadata(metadataKey, target, propertyKey); + } + exporter("getMetadata", getMetadata); + /** + * Gets the metadata value for the provided metadata key on the target object. + * @param metadataKey A key used to store and retrieve metadata. + * @param target The target object on which the metadata is defined. + * @param propertyKey (Optional) The property key for the target. + * @returns The metadata value for the metadata key if found; otherwise, `undefined`. + * @example + * + * class Example { + * // property declarations are not part of ES6, though they are valid in TypeScript: + * // static staticProperty; + * // property; + * + * constructor(p) { } + * static staticMethod(p) { } + * method(p) { } + * } + * + * // constructor + * result = Reflect.getOwnMetadata("custom:annotation", Example); + * + * // property (on constructor) + * result = Reflect.getOwnMetadata("custom:annotation", Example, "staticProperty"); + * + * // property (on prototype) + * result = Reflect.getOwnMetadata("custom:annotation", Example.prototype, "property"); + * + * // method (on constructor) + * result = Reflect.getOwnMetadata("custom:annotation", Example, "staticMethod"); + * + * // method (on prototype) + * result = Reflect.getOwnMetadata("custom:annotation", Example.prototype, "method"); + * + */ + function getOwnMetadata(metadataKey, target, propertyKey) { + if (!IsObject(target)) + throw new TypeError(); + if (!IsUndefined(propertyKey)) + propertyKey = ToPropertyKey(propertyKey); + return OrdinaryGetOwnMetadata(metadataKey, target, propertyKey); + } + exporter("getOwnMetadata", getOwnMetadata); + /** + * Gets the metadata keys defined on the target object or its prototype chain. + * @param target The target object on which the metadata is defined. + * @param propertyKey (Optional) The property key for the target. + * @returns An array of unique metadata keys. + * @example + * + * class Example { + * // property declarations are not part of ES6, though they are valid in TypeScript: + * // static staticProperty; + * // property; + * + * constructor(p) { } + * static staticMethod(p) { } + * method(p) { } + * } + * + * // constructor + * result = Reflect.getMetadataKeys(Example); + * + * // property (on constructor) + * result = Reflect.getMetadataKeys(Example, "staticProperty"); + * + * // property (on prototype) + * result = Reflect.getMetadataKeys(Example.prototype, "property"); + * + * // method (on constructor) + * result = Reflect.getMetadataKeys(Example, "staticMethod"); + * + * // method (on prototype) + * result = Reflect.getMetadataKeys(Example.prototype, "method"); + * + */ + function getMetadataKeys(target, propertyKey) { + if (!IsObject(target)) + throw new TypeError(); + if (!IsUndefined(propertyKey)) + propertyKey = ToPropertyKey(propertyKey); + return OrdinaryMetadataKeys(target, propertyKey); + } + exporter("getMetadataKeys", getMetadataKeys); + /** + * Gets the unique metadata keys defined on the target object. + * @param target The target object on which the metadata is defined. + * @param propertyKey (Optional) The property key for the target. + * @returns An array of unique metadata keys. + * @example + * + * class Example { + * // property declarations are not part of ES6, though they are valid in TypeScript: + * // static staticProperty; + * // property; + * + * constructor(p) { } + * static staticMethod(p) { } + * method(p) { } + * } + * + * // constructor + * result = Reflect.getOwnMetadataKeys(Example); + * + * // property (on constructor) + * result = Reflect.getOwnMetadataKeys(Example, "staticProperty"); + * + * // property (on prototype) + * result = Reflect.getOwnMetadataKeys(Example.prototype, "property"); + * + * // method (on constructor) + * result = Reflect.getOwnMetadataKeys(Example, "staticMethod"); + * + * // method (on prototype) + * result = Reflect.getOwnMetadataKeys(Example.prototype, "method"); + * + */ + function getOwnMetadataKeys(target, propertyKey) { + if (!IsObject(target)) + throw new TypeError(); + if (!IsUndefined(propertyKey)) + propertyKey = ToPropertyKey(propertyKey); + return OrdinaryOwnMetadataKeys(target, propertyKey); + } + exporter("getOwnMetadataKeys", getOwnMetadataKeys); + /** + * Deletes the metadata entry from the target object with the provided key. + * @param metadataKey A key used to store and retrieve metadata. + * @param target The target object on which the metadata is defined. + * @param propertyKey (Optional) The property key for the target. + * @returns `true` if the metadata entry was found and deleted; otherwise, false. + * @example + * + * class Example { + * // property declarations are not part of ES6, though they are valid in TypeScript: + * // static staticProperty; + * // property; + * + * constructor(p) { } + * static staticMethod(p) { } + * method(p) { } + * } + * + * // constructor + * result = Reflect.deleteMetadata("custom:annotation", Example); + * + * // property (on constructor) + * result = Reflect.deleteMetadata("custom:annotation", Example, "staticProperty"); + * + * // property (on prototype) + * result = Reflect.deleteMetadata("custom:annotation", Example.prototype, "property"); + * + * // method (on constructor) + * result = Reflect.deleteMetadata("custom:annotation", Example, "staticMethod"); + * + * // method (on prototype) + * result = Reflect.deleteMetadata("custom:annotation", Example.prototype, "method"); + * + */ + function deleteMetadata(metadataKey, target, propertyKey) { + if (!IsObject(target)) + throw new TypeError(); + if (!IsUndefined(propertyKey)) + propertyKey = ToPropertyKey(propertyKey); + var metadataMap = GetOrCreateMetadataMap(target, propertyKey, /*Create*/ false); + if (IsUndefined(metadataMap)) + return false; + if (!metadataMap.delete(metadataKey)) + return false; + if (metadataMap.size > 0) + return true; + var targetMetadata = Metadata.get(target); + targetMetadata.delete(propertyKey); + if (targetMetadata.size > 0) + return true; + Metadata.delete(target); + return true; + } + exporter("deleteMetadata", deleteMetadata); + function DecorateConstructor(decorators, target) { + for (var i = decorators.length - 1; i >= 0; --i) { + var decorator = decorators[i]; + var decorated = decorator(target); + if (!IsUndefined(decorated) && !IsNull(decorated)) { + if (!IsConstructor(decorated)) + throw new TypeError(); + target = decorated; + } + } + return target; + } + function DecorateProperty(decorators, target, propertyKey, descriptor) { + for (var i = decorators.length - 1; i >= 0; --i) { + var decorator = decorators[i]; + var decorated = decorator(target, propertyKey, descriptor); + if (!IsUndefined(decorated) && !IsNull(decorated)) { + if (!IsObject(decorated)) + throw new TypeError(); + descriptor = decorated; + } + } + return descriptor; + } + function GetOrCreateMetadataMap(O, P, Create) { + var targetMetadata = Metadata.get(O); + if (IsUndefined(targetMetadata)) { + if (!Create) + return undefined; + targetMetadata = new _Map(); + Metadata.set(O, targetMetadata); + } + var metadataMap = targetMetadata.get(P); + if (IsUndefined(metadataMap)) { + if (!Create) + return undefined; + metadataMap = new _Map(); + targetMetadata.set(P, metadataMap); + } + return metadataMap; + } + // 3.1.1.1 OrdinaryHasMetadata(MetadataKey, O, P) + // https://rbuckton.github.io/reflect-metadata/#ordinaryhasmetadata + function OrdinaryHasMetadata(MetadataKey, O, P) { + var hasOwn = OrdinaryHasOwnMetadata(MetadataKey, O, P); + if (hasOwn) + return true; + var parent = OrdinaryGetPrototypeOf(O); + if (!IsNull(parent)) + return OrdinaryHasMetadata(MetadataKey, parent, P); + return false; + } + // 3.1.2.1 OrdinaryHasOwnMetadata(MetadataKey, O, P) + // https://rbuckton.github.io/reflect-metadata/#ordinaryhasownmetadata + function OrdinaryHasOwnMetadata(MetadataKey, O, P) { + var metadataMap = GetOrCreateMetadataMap(O, P, /*Create*/ false); + if (IsUndefined(metadataMap)) + return false; + return ToBoolean(metadataMap.has(MetadataKey)); + } + // 3.1.3.1 OrdinaryGetMetadata(MetadataKey, O, P) + // https://rbuckton.github.io/reflect-metadata/#ordinarygetmetadata + function OrdinaryGetMetadata(MetadataKey, O, P) { + var hasOwn = OrdinaryHasOwnMetadata(MetadataKey, O, P); + if (hasOwn) + return OrdinaryGetOwnMetadata(MetadataKey, O, P); + var parent = OrdinaryGetPrototypeOf(O); + if (!IsNull(parent)) + return OrdinaryGetMetadata(MetadataKey, parent, P); + return undefined; + } + // 3.1.4.1 OrdinaryGetOwnMetadata(MetadataKey, O, P) + // https://rbuckton.github.io/reflect-metadata/#ordinarygetownmetadata + function OrdinaryGetOwnMetadata(MetadataKey, O, P) { + var metadataMap = GetOrCreateMetadataMap(O, P, /*Create*/ false); + if (IsUndefined(metadataMap)) + return undefined; + return metadataMap.get(MetadataKey); + } + // 3.1.5.1 OrdinaryDefineOwnMetadata(MetadataKey, MetadataValue, O, P) + // https://rbuckton.github.io/reflect-metadata/#ordinarydefineownmetadata + function OrdinaryDefineOwnMetadata(MetadataKey, MetadataValue, O, P) { + var metadataMap = GetOrCreateMetadataMap(O, P, /*Create*/ true); + metadataMap.set(MetadataKey, MetadataValue); + } + // 3.1.6.1 OrdinaryMetadataKeys(O, P) + // https://rbuckton.github.io/reflect-metadata/#ordinarymetadatakeys + function OrdinaryMetadataKeys(O, P) { + var ownKeys = OrdinaryOwnMetadataKeys(O, P); + var parent = OrdinaryGetPrototypeOf(O); + if (parent === null) + return ownKeys; + var parentKeys = OrdinaryMetadataKeys(parent, P); + if (parentKeys.length <= 0) + return ownKeys; + if (ownKeys.length <= 0) + return parentKeys; + var set = new _Set(); + var keys = []; + for (var _i = 0, ownKeys_1 = ownKeys; _i < ownKeys_1.length; _i++) { + var key = ownKeys_1[_i]; + var hasKey = set.has(key); + if (!hasKey) { + set.add(key); + keys.push(key); + } + } + for (var _a = 0, parentKeys_1 = parentKeys; _a < parentKeys_1.length; _a++) { + var key = parentKeys_1[_a]; + var hasKey = set.has(key); + if (!hasKey) { + set.add(key); + keys.push(key); + } + } + return keys; + } + // 3.1.7.1 OrdinaryOwnMetadataKeys(O, P) + // https://rbuckton.github.io/reflect-metadata/#ordinaryownmetadatakeys + function OrdinaryOwnMetadataKeys(O, P) { + var keys = []; + var metadataMap = GetOrCreateMetadataMap(O, P, /*Create*/ false); + if (IsUndefined(metadataMap)) + return keys; + var keysObj = metadataMap.keys(); + var iterator = GetIterator(keysObj); + var k = 0; + while (true) { + var next = IteratorStep(iterator); + if (!next) { + keys.length = k; + return keys; + } + var nextValue = IteratorValue(next); + try { + keys[k] = nextValue; + } + catch (e) { + try { + IteratorClose(iterator); + } + finally { + throw e; + } + } + k++; + } + } + // 6 ECMAScript Data Typ0es and Values + // https://tc39.github.io/ecma262/#sec-ecmascript-data-types-and-values + function Type(x) { + if (x === null) + return 1 /* Null */; + switch (typeof x) { + case "undefined": return 0 /* Undefined */; + case "boolean": return 2 /* Boolean */; + case "string": return 3 /* String */; + case "symbol": return 4 /* Symbol */; + case "number": return 5 /* Number */; + case "object": return x === null ? 1 /* Null */ : 6 /* Object */; + default: return 6 /* Object */; + } + } + // 6.1.1 The Undefined Type + // https://tc39.github.io/ecma262/#sec-ecmascript-language-types-undefined-type + function IsUndefined(x) { + return x === undefined; + } + // 6.1.2 The Null Type + // https://tc39.github.io/ecma262/#sec-ecmascript-language-types-null-type + function IsNull(x) { + return x === null; + } + // 6.1.5 The Symbol Type + // https://tc39.github.io/ecma262/#sec-ecmascript-language-types-symbol-type + function IsSymbol(x) { + return typeof x === "symbol"; + } + // 6.1.7 The Object Type + // https://tc39.github.io/ecma262/#sec-object-type + function IsObject(x) { + return typeof x === "object" ? x !== null : typeof x === "function"; + } + // 7.1 Type Conversion + // https://tc39.github.io/ecma262/#sec-type-conversion + // 7.1.1 ToPrimitive(input [, PreferredType]) + // https://tc39.github.io/ecma262/#sec-toprimitive + function ToPrimitive(input, PreferredType) { + switch (Type(input)) { + case 0 /* Undefined */: return input; + case 1 /* Null */: return input; + case 2 /* Boolean */: return input; + case 3 /* String */: return input; + case 4 /* Symbol */: return input; + case 5 /* Number */: return input; + } + var hint = PreferredType === 3 /* String */ ? "string" : PreferredType === 5 /* Number */ ? "number" : "default"; + var exoticToPrim = GetMethod(input, toPrimitiveSymbol); + if (exoticToPrim !== undefined) { + var result = exoticToPrim.call(input, hint); + if (IsObject(result)) + throw new TypeError(); + return result; + } + return OrdinaryToPrimitive(input, hint === "default" ? "number" : hint); + } + // 7.1.1.1 OrdinaryToPrimitive(O, hint) + // https://tc39.github.io/ecma262/#sec-ordinarytoprimitive + function OrdinaryToPrimitive(O, hint) { + if (hint === "string") { + var toString_1 = O.toString; + if (IsCallable(toString_1)) { + var result = toString_1.call(O); + if (!IsObject(result)) + return result; + } + var valueOf = O.valueOf; + if (IsCallable(valueOf)) { + var result = valueOf.call(O); + if (!IsObject(result)) + return result; + } + } + else { + var valueOf = O.valueOf; + if (IsCallable(valueOf)) { + var result = valueOf.call(O); + if (!IsObject(result)) + return result; + } + var toString_2 = O.toString; + if (IsCallable(toString_2)) { + var result = toString_2.call(O); + if (!IsObject(result)) + return result; + } + } + throw new TypeError(); + } + // 7.1.2 ToBoolean(argument) + // https://tc39.github.io/ecma262/2016/#sec-toboolean + function ToBoolean(argument) { + return !!argument; + } + // 7.1.12 ToString(argument) + // https://tc39.github.io/ecma262/#sec-tostring + function ToString(argument) { + return "" + argument; + } + // 7.1.14 ToPropertyKey(argument) + // https://tc39.github.io/ecma262/#sec-topropertykey + function ToPropertyKey(argument) { + var key = ToPrimitive(argument, 3 /* String */); + if (IsSymbol(key)) + return key; + return ToString(key); + } + // 7.2 Testing and Comparison Operations + // https://tc39.github.io/ecma262/#sec-testing-and-comparison-operations + // 7.2.2 IsArray(argument) + // https://tc39.github.io/ecma262/#sec-isarray + function IsArray(argument) { + return Array.isArray + ? Array.isArray(argument) + : argument instanceof Object + ? argument instanceof Array + : Object.prototype.toString.call(argument) === "[object Array]"; + } + // 7.2.3 IsCallable(argument) + // https://tc39.github.io/ecma262/#sec-iscallable + function IsCallable(argument) { + // NOTE: This is an approximation as we cannot check for [[Call]] internal method. + return typeof argument === "function"; + } + // 7.2.4 IsConstructor(argument) + // https://tc39.github.io/ecma262/#sec-isconstructor + function IsConstructor(argument) { + // NOTE: This is an approximation as we cannot check for [[Construct]] internal method. + return typeof argument === "function"; + } + // 7.2.7 IsPropertyKey(argument) + // https://tc39.github.io/ecma262/#sec-ispropertykey + function IsPropertyKey(argument) { + switch (Type(argument)) { + case 3 /* String */: return true; + case 4 /* Symbol */: return true; + default: return false; + } + } + // 7.3 Operations on Objects + // https://tc39.github.io/ecma262/#sec-operations-on-objects + // 7.3.9 GetMethod(V, P) + // https://tc39.github.io/ecma262/#sec-getmethod + function GetMethod(V, P) { + var func = V[P]; + if (func === undefined || func === null) + return undefined; + if (!IsCallable(func)) + throw new TypeError(); + return func; + } + // 7.4 Operations on Iterator Objects + // https://tc39.github.io/ecma262/#sec-operations-on-iterator-objects + function GetIterator(obj) { + var method = GetMethod(obj, iteratorSymbol); + if (!IsCallable(method)) + throw new TypeError(); // from Call + var iterator = method.call(obj); + if (!IsObject(iterator)) + throw new TypeError(); + return iterator; + } + // 7.4.4 IteratorValue(iterResult) + // https://tc39.github.io/ecma262/2016/#sec-iteratorvalue + function IteratorValue(iterResult) { + return iterResult.value; + } + // 7.4.5 IteratorStep(iterator) + // https://tc39.github.io/ecma262/#sec-iteratorstep + function IteratorStep(iterator) { + var result = iterator.next(); + return result.done ? false : result; + } + // 7.4.6 IteratorClose(iterator, completion) + // https://tc39.github.io/ecma262/#sec-iteratorclose + function IteratorClose(iterator) { + var f = iterator["return"]; + if (f) + f.call(iterator); + } + // 9.1 Ordinary Object Internal Methods and Internal Slots + // https://tc39.github.io/ecma262/#sec-ordinary-object-internal-methods-and-internal-slots + // 9.1.1.1 OrdinaryGetPrototypeOf(O) + // https://tc39.github.io/ecma262/#sec-ordinarygetprototypeof + function OrdinaryGetPrototypeOf(O) { + var proto = Object.getPrototypeOf(O); + if (typeof O !== "function" || O === functionPrototype) + return proto; + // TypeScript doesn't set __proto__ in ES5, as it's non-standard. + // Try to determine the superclass constructor. Compatible implementations + // must either set __proto__ on a subclass constructor to the superclass constructor, + // or ensure each class has a valid `constructor` property on its prototype that + // points back to the constructor. + // If this is not the same as Function.[[Prototype]], then this is definately inherited. + // This is the case when in ES6 or when using __proto__ in a compatible browser. + if (proto !== functionPrototype) + return proto; + // If the super prototype is Object.prototype, null, or undefined, then we cannot determine the heritage. + var prototype = O.prototype; + var prototypeProto = prototype && Object.getPrototypeOf(prototype); + if (prototypeProto == null || prototypeProto === Object.prototype) + return proto; + // If the constructor was not a function, then we cannot determine the heritage. + var constructor = prototypeProto.constructor; + if (typeof constructor !== "function") + return proto; + // If we have some kind of self-reference, then we cannot determine the heritage. + if (constructor === O) + return proto; + // we have a pretty good guess at the heritage. + return constructor; + } + // naive Map shim + function CreateMapPolyfill() { + var cacheSentinel = {}; + var arraySentinel = []; + var MapIterator = /** @class */ (function () { + function MapIterator(keys, values, selector) { + this._index = 0; + this._keys = keys; + this._values = values; + this._selector = selector; + } + MapIterator.prototype["@@iterator"] = function () { return this; }; + MapIterator.prototype[iteratorSymbol] = function () { return this; }; + MapIterator.prototype.next = function () { + var index = this._index; + if (index >= 0 && index < this._keys.length) { + var result = this._selector(this._keys[index], this._values[index]); + if (index + 1 >= this._keys.length) { + this._index = -1; + this._keys = arraySentinel; + this._values = arraySentinel; + } + else { + this._index++; + } + return { value: result, done: false }; + } + return { value: undefined, done: true }; + }; + MapIterator.prototype.throw = function (error) { + if (this._index >= 0) { + this._index = -1; + this._keys = arraySentinel; + this._values = arraySentinel; + } + throw error; + }; + MapIterator.prototype.return = function (value) { + if (this._index >= 0) { + this._index = -1; + this._keys = arraySentinel; + this._values = arraySentinel; + } + return { value: value, done: true }; + }; + return MapIterator; + }()); + return /** @class */ (function () { + function Map() { + this._keys = []; + this._values = []; + this._cacheKey = cacheSentinel; + this._cacheIndex = -2; + } + Object.defineProperty(Map.prototype, "size", { + get: function () { return this._keys.length; }, + enumerable: true, + configurable: true + }); + Map.prototype.has = function (key) { return this._find(key, /*insert*/ false) >= 0; }; + Map.prototype.get = function (key) { + var index = this._find(key, /*insert*/ false); + return index >= 0 ? this._values[index] : undefined; + }; + Map.prototype.set = function (key, value) { + var index = this._find(key, /*insert*/ true); + this._values[index] = value; + return this; + }; + Map.prototype.delete = function (key) { + var index = this._find(key, /*insert*/ false); + if (index >= 0) { + var size = this._keys.length; + for (var i = index + 1; i < size; i++) { + this._keys[i - 1] = this._keys[i]; + this._values[i - 1] = this._values[i]; + } + this._keys.length--; + this._values.length--; + if (key === this._cacheKey) { + this._cacheKey = cacheSentinel; + this._cacheIndex = -2; + } + return true; + } + return false; + }; + Map.prototype.clear = function () { + this._keys.length = 0; + this._values.length = 0; + this._cacheKey = cacheSentinel; + this._cacheIndex = -2; + }; + Map.prototype.keys = function () { return new MapIterator(this._keys, this._values, getKey); }; + Map.prototype.values = function () { return new MapIterator(this._keys, this._values, getValue); }; + Map.prototype.entries = function () { return new MapIterator(this._keys, this._values, getEntry); }; + Map.prototype["@@iterator"] = function () { return this.entries(); }; + Map.prototype[iteratorSymbol] = function () { return this.entries(); }; + Map.prototype._find = function (key, insert) { + if (this._cacheKey !== key) { + this._cacheIndex = this._keys.indexOf(this._cacheKey = key); + } + if (this._cacheIndex < 0 && insert) { + this._cacheIndex = this._keys.length; + this._keys.push(key); + this._values.push(undefined); + } + return this._cacheIndex; + }; + return Map; + }()); + function getKey(key, _) { + return key; + } + function getValue(_, value) { + return value; + } + function getEntry(key, value) { + return [key, value]; + } + } + // naive Set shim + function CreateSetPolyfill() { + return /** @class */ (function () { + function Set() { + this._map = new _Map(); + } + Object.defineProperty(Set.prototype, "size", { + get: function () { return this._map.size; }, + enumerable: true, + configurable: true + }); + Set.prototype.has = function (value) { return this._map.has(value); }; + Set.prototype.add = function (value) { return this._map.set(value, value), this; }; + Set.prototype.delete = function (value) { return this._map.delete(value); }; + Set.prototype.clear = function () { this._map.clear(); }; + Set.prototype.keys = function () { return this._map.keys(); }; + Set.prototype.values = function () { return this._map.values(); }; + Set.prototype.entries = function () { return this._map.entries(); }; + Set.prototype["@@iterator"] = function () { return this.keys(); }; + Set.prototype[iteratorSymbol] = function () { return this.keys(); }; + return Set; + }()); + } + // naive WeakMap shim + function CreateWeakMapPolyfill() { + var UUID_SIZE = 16; + var keys = HashMap.create(); + var rootKey = CreateUniqueKey(); + return /** @class */ (function () { + function WeakMap() { + this._key = CreateUniqueKey(); + } + WeakMap.prototype.has = function (target) { + var table = GetOrCreateWeakMapTable(target, /*create*/ false); + return table !== undefined ? HashMap.has(table, this._key) : false; + }; + WeakMap.prototype.get = function (target) { + var table = GetOrCreateWeakMapTable(target, /*create*/ false); + return table !== undefined ? HashMap.get(table, this._key) : undefined; + }; + WeakMap.prototype.set = function (target, value) { + var table = GetOrCreateWeakMapTable(target, /*create*/ true); + table[this._key] = value; + return this; + }; + WeakMap.prototype.delete = function (target) { + var table = GetOrCreateWeakMapTable(target, /*create*/ false); + return table !== undefined ? delete table[this._key] : false; + }; + WeakMap.prototype.clear = function () { + // NOTE: not a real clear, just makes the previous data unreachable + this._key = CreateUniqueKey(); + }; + return WeakMap; + }()); + function CreateUniqueKey() { + var key; + do + key = "@@WeakMap@@" + CreateUUID(); + while (HashMap.has(keys, key)); + keys[key] = true; + return key; + } + function GetOrCreateWeakMapTable(target, create) { + if (!hasOwn.call(target, rootKey)) { + if (!create) + return undefined; + Object.defineProperty(target, rootKey, { value: HashMap.create() }); + } + return target[rootKey]; + } + function FillRandomBytes(buffer, size) { + for (var i = 0; i < size; ++i) + buffer[i] = Math.random() * 0xff | 0; + return buffer; + } + function GenRandomBytes(size) { + if (typeof Uint8Array === "function") { + if (typeof crypto !== "undefined") + return crypto.getRandomValues(new Uint8Array(size)); + if (typeof msCrypto !== "undefined") + return msCrypto.getRandomValues(new Uint8Array(size)); + return FillRandomBytes(new Uint8Array(size), size); + } + return FillRandomBytes(new Array(size), size); + } + function CreateUUID() { + var data = GenRandomBytes(UUID_SIZE); + // mark as random - RFC 4122 § 4.4 + data[6] = data[6] & 0x4f | 0x40; + data[8] = data[8] & 0xbf | 0x80; + var result = ""; + for (var offset = 0; offset < UUID_SIZE; ++offset) { + var byte = data[offset]; + if (offset === 4 || offset === 6 || offset === 8) + result += "-"; + if (byte < 16) + result += "0"; + result += byte.toString(16).toLowerCase(); + } + return result; + } + } + // uses a heuristic used by v8 and chakra to force an object into dictionary mode. + function MakeDictionary(obj) { + obj.__ = undefined; + delete obj.__; + return obj; + } + }); +})(Reflect$1 || (Reflect$1 = {})); + +var runtime = {exports: {}}; + +/** + * Copyright (c) 2014-present, Facebook, Inc. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ + +(function (module) { +var runtime = (function (exports) { + + var Op = Object.prototype; + var hasOwn = Op.hasOwnProperty; + var undefined$1; // More compressible than void 0. + var $Symbol = typeof Symbol === "function" ? Symbol : {}; + var iteratorSymbol = $Symbol.iterator || "@@iterator"; + var asyncIteratorSymbol = $Symbol.asyncIterator || "@@asyncIterator"; + var toStringTagSymbol = $Symbol.toStringTag || "@@toStringTag"; + + function define(obj, key, value) { + Object.defineProperty(obj, key, { + value: value, + enumerable: true, + configurable: true, + writable: true + }); + return obj[key]; + } + try { + // IE 8 has a broken Object.defineProperty that only works on DOM objects. + define({}, ""); + } catch (err) { + define = function(obj, key, value) { + return obj[key] = value; + }; + } + + function wrap(innerFn, outerFn, self, tryLocsList) { + // If outerFn provided and outerFn.prototype is a Generator, then outerFn.prototype instanceof Generator. + var protoGenerator = outerFn && outerFn.prototype instanceof Generator ? outerFn : Generator; + var generator = Object.create(protoGenerator.prototype); + var context = new Context(tryLocsList || []); + + // The ._invoke method unifies the implementations of the .next, + // .throw, and .return methods. + generator._invoke = makeInvokeMethod(innerFn, self, context); + + return generator; + } + exports.wrap = wrap; + + // Try/catch helper to minimize deoptimizations. Returns a completion + // record like context.tryEntries[i].completion. This interface could + // have been (and was previously) designed to take a closure to be + // invoked without arguments, but in all the cases we care about we + // already have an existing method we want to call, so there's no need + // to create a new function object. We can even get away with assuming + // the method takes exactly one argument, since that happens to be true + // in every case, so we don't have to touch the arguments object. The + // only additional allocation required is the completion record, which + // has a stable shape and so hopefully should be cheap to allocate. + function tryCatch(fn, obj, arg) { + try { + return { type: "normal", arg: fn.call(obj, arg) }; + } catch (err) { + return { type: "throw", arg: err }; + } + } + + var GenStateSuspendedStart = "suspendedStart"; + var GenStateSuspendedYield = "suspendedYield"; + var GenStateExecuting = "executing"; + var GenStateCompleted = "completed"; + + // Returning this object from the innerFn has the same effect as + // breaking out of the dispatch switch statement. + var ContinueSentinel = {}; + + // Dummy constructor functions that we use as the .constructor and + // .constructor.prototype properties for functions that return Generator + // objects. For full spec compliance, you may wish to configure your + // minifier not to mangle the names of these two functions. + function Generator() {} + function GeneratorFunction() {} + function GeneratorFunctionPrototype() {} + + // This is a polyfill for %IteratorPrototype% for environments that + // don't natively support it. + var IteratorPrototype = {}; + define(IteratorPrototype, iteratorSymbol, function () { + return this; + }); + + var getProto = Object.getPrototypeOf; + var NativeIteratorPrototype = getProto && getProto(getProto(values([]))); + if (NativeIteratorPrototype && + NativeIteratorPrototype !== Op && + hasOwn.call(NativeIteratorPrototype, iteratorSymbol)) { + // This environment has a native %IteratorPrototype%; use it instead + // of the polyfill. + IteratorPrototype = NativeIteratorPrototype; + } + + var Gp = GeneratorFunctionPrototype.prototype = + Generator.prototype = Object.create(IteratorPrototype); + GeneratorFunction.prototype = GeneratorFunctionPrototype; + define(Gp, "constructor", GeneratorFunctionPrototype); + define(GeneratorFunctionPrototype, "constructor", GeneratorFunction); + GeneratorFunction.displayName = define( + GeneratorFunctionPrototype, + toStringTagSymbol, + "GeneratorFunction" + ); + + // Helper for defining the .next, .throw, and .return methods of the + // Iterator interface in terms of a single ._invoke method. + function defineIteratorMethods(prototype) { + ["next", "throw", "return"].forEach(function(method) { + define(prototype, method, function(arg) { + return this._invoke(method, arg); + }); + }); + } + + exports.isGeneratorFunction = function(genFun) { + var ctor = typeof genFun === "function" && genFun.constructor; + return ctor + ? ctor === GeneratorFunction || + // For the native GeneratorFunction constructor, the best we can + // do is to check its .name property. + (ctor.displayName || ctor.name) === "GeneratorFunction" + : false; + }; + + exports.mark = function(genFun) { + if (Object.setPrototypeOf) { + Object.setPrototypeOf(genFun, GeneratorFunctionPrototype); + } else { + genFun.__proto__ = GeneratorFunctionPrototype; + define(genFun, toStringTagSymbol, "GeneratorFunction"); + } + genFun.prototype = Object.create(Gp); + return genFun; + }; + + // Within the body of any async function, `await x` is transformed to + // `yield regeneratorRuntime.awrap(x)`, so that the runtime can test + // `hasOwn.call(value, "__await")` to determine if the yielded value is + // meant to be awaited. + exports.awrap = function(arg) { + return { __await: arg }; + }; + + function AsyncIterator(generator, PromiseImpl) { + function invoke(method, arg, resolve, reject) { + var record = tryCatch(generator[method], generator, arg); + if (record.type === "throw") { + reject(record.arg); + } else { + var result = record.arg; + var value = result.value; + if (value && + typeof value === "object" && + hasOwn.call(value, "__await")) { + return PromiseImpl.resolve(value.__await).then(function(value) { + invoke("next", value, resolve, reject); + }, function(err) { + invoke("throw", err, resolve, reject); + }); + } + + return PromiseImpl.resolve(value).then(function(unwrapped) { + // When a yielded Promise is resolved, its final value becomes + // the .value of the Promise<{value,done}> result for the + // current iteration. + result.value = unwrapped; + resolve(result); + }, function(error) { + // If a rejected Promise was yielded, throw the rejection back + // into the async generator function so it can be handled there. + return invoke("throw", error, resolve, reject); + }); + } + } + + var previousPromise; + + function enqueue(method, arg) { + function callInvokeWithMethodAndArg() { + return new PromiseImpl(function(resolve, reject) { + invoke(method, arg, resolve, reject); + }); + } + + return previousPromise = + // If enqueue has been called before, then we want to wait until + // all previous Promises have been resolved before calling invoke, + // so that results are always delivered in the correct order. If + // enqueue has not been called before, then it is important to + // call invoke immediately, without waiting on a callback to fire, + // so that the async generator function has the opportunity to do + // any necessary setup in a predictable way. This predictability + // is why the Promise constructor synchronously invokes its + // executor callback, and why async functions synchronously + // execute code before the first await. Since we implement simple + // async functions in terms of async generators, it is especially + // important to get this right, even though it requires care. + previousPromise ? previousPromise.then( + callInvokeWithMethodAndArg, + // Avoid propagating failures to Promises returned by later + // invocations of the iterator. + callInvokeWithMethodAndArg + ) : callInvokeWithMethodAndArg(); + } + + // Define the unified helper method that is used to implement .next, + // .throw, and .return (see defineIteratorMethods). + this._invoke = enqueue; + } + + defineIteratorMethods(AsyncIterator.prototype); + define(AsyncIterator.prototype, asyncIteratorSymbol, function () { + return this; + }); + exports.AsyncIterator = AsyncIterator; + + // Note that simple async functions are implemented on top of + // AsyncIterator objects; they just return a Promise for the value of + // the final result produced by the iterator. + exports.async = function(innerFn, outerFn, self, tryLocsList, PromiseImpl) { + if (PromiseImpl === void 0) PromiseImpl = Promise; + + var iter = new AsyncIterator( + wrap(innerFn, outerFn, self, tryLocsList), + PromiseImpl + ); + + return exports.isGeneratorFunction(outerFn) + ? iter // If outerFn is a generator, return the full iterator. + : iter.next().then(function(result) { + return result.done ? result.value : iter.next(); + }); + }; + + function makeInvokeMethod(innerFn, self, context) { + var state = GenStateSuspendedStart; + + return function invoke(method, arg) { + if (state === GenStateExecuting) { + throw new Error("Generator is already running"); + } + + if (state === GenStateCompleted) { + if (method === "throw") { + throw arg; + } + + // Be forgiving, per 25.3.3.3.3 of the spec: + // https://people.mozilla.org/~jorendorff/es6-draft.html#sec-generatorresume + return doneResult(); + } + + context.method = method; + context.arg = arg; + + while (true) { + var delegate = context.delegate; + if (delegate) { + var delegateResult = maybeInvokeDelegate(delegate, context); + if (delegateResult) { + if (delegateResult === ContinueSentinel) continue; + return delegateResult; + } + } + + if (context.method === "next") { + // Setting context._sent for legacy support of Babel's + // function.sent implementation. + context.sent = context._sent = context.arg; + + } else if (context.method === "throw") { + if (state === GenStateSuspendedStart) { + state = GenStateCompleted; + throw context.arg; + } + + context.dispatchException(context.arg); + + } else if (context.method === "return") { + context.abrupt("return", context.arg); + } + + state = GenStateExecuting; + + var record = tryCatch(innerFn, self, context); + if (record.type === "normal") { + // If an exception is thrown from innerFn, we leave state === + // GenStateExecuting and loop back for another invocation. + state = context.done + ? GenStateCompleted + : GenStateSuspendedYield; + + if (record.arg === ContinueSentinel) { + continue; + } + + return { + value: record.arg, + done: context.done + }; + + } else if (record.type === "throw") { + state = GenStateCompleted; + // Dispatch the exception by looping back around to the + // context.dispatchException(context.arg) call above. + context.method = "throw"; + context.arg = record.arg; + } + } + }; + } + + // Call delegate.iterator[context.method](context.arg) and handle the + // result, either by returning a { value, done } result from the + // delegate iterator, or by modifying context.method and context.arg, + // setting context.delegate to null, and returning the ContinueSentinel. + function maybeInvokeDelegate(delegate, context) { + var method = delegate.iterator[context.method]; + if (method === undefined$1) { + // A .throw or .return when the delegate iterator has no .throw + // method always terminates the yield* loop. + context.delegate = null; + + if (context.method === "throw") { + // Note: ["return"] must be used for ES3 parsing compatibility. + if (delegate.iterator["return"]) { + // If the delegate iterator has a return method, give it a + // chance to clean up. + context.method = "return"; + context.arg = undefined$1; + maybeInvokeDelegate(delegate, context); + + if (context.method === "throw") { + // If maybeInvokeDelegate(context) changed context.method from + // "return" to "throw", let that override the TypeError below. + return ContinueSentinel; + } + } + + context.method = "throw"; + context.arg = new TypeError( + "The iterator does not provide a 'throw' method"); + } + + return ContinueSentinel; + } + + var record = tryCatch(method, delegate.iterator, context.arg); + + if (record.type === "throw") { + context.method = "throw"; + context.arg = record.arg; + context.delegate = null; + return ContinueSentinel; + } + + var info = record.arg; + + if (! info) { + context.method = "throw"; + context.arg = new TypeError("iterator result is not an object"); + context.delegate = null; + return ContinueSentinel; + } + + if (info.done) { + // Assign the result of the finished delegate to the temporary + // variable specified by delegate.resultName (see delegateYield). + context[delegate.resultName] = info.value; + + // Resume execution at the desired location (see delegateYield). + context.next = delegate.nextLoc; + + // If context.method was "throw" but the delegate handled the + // exception, let the outer generator proceed normally. If + // context.method was "next", forget context.arg since it has been + // "consumed" by the delegate iterator. If context.method was + // "return", allow the original .return call to continue in the + // outer generator. + if (context.method !== "return") { + context.method = "next"; + context.arg = undefined$1; + } + + } else { + // Re-yield the result returned by the delegate method. + return info; + } + + // The delegate iterator is finished, so forget it and continue with + // the outer generator. + context.delegate = null; + return ContinueSentinel; + } + + // Define Generator.prototype.{next,throw,return} in terms of the + // unified ._invoke helper method. + defineIteratorMethods(Gp); + + define(Gp, toStringTagSymbol, "Generator"); + + // A Generator should always return itself as the iterator object when the + // @@iterator function is called on it. Some browsers' implementations of the + // iterator prototype chain incorrectly implement this, causing the Generator + // object to not be returned from this call. This ensures that doesn't happen. + // See https://github.com/facebook/regenerator/issues/274 for more details. + define(Gp, iteratorSymbol, function() { + return this; + }); + + define(Gp, "toString", function() { + return "[object Generator]"; + }); + + function pushTryEntry(locs) { + var entry = { tryLoc: locs[0] }; + + if (1 in locs) { + entry.catchLoc = locs[1]; + } + + if (2 in locs) { + entry.finallyLoc = locs[2]; + entry.afterLoc = locs[3]; + } + + this.tryEntries.push(entry); + } + + function resetTryEntry(entry) { + var record = entry.completion || {}; + record.type = "normal"; + delete record.arg; + entry.completion = record; + } + + function Context(tryLocsList) { + // The root entry object (effectively a try statement without a catch + // or a finally block) gives us a place to store values thrown from + // locations where there is no enclosing try statement. + this.tryEntries = [{ tryLoc: "root" }]; + tryLocsList.forEach(pushTryEntry, this); + this.reset(true); + } + + exports.keys = function(object) { + var keys = []; + for (var key in object) { + keys.push(key); + } + keys.reverse(); + + // Rather than returning an object with a next method, we keep + // things simple and return the next function itself. + return function next() { + while (keys.length) { + var key = keys.pop(); + if (key in object) { + next.value = key; + next.done = false; + return next; + } + } + + // To avoid creating an additional object, we just hang the .value + // and .done properties off the next function object itself. This + // also ensures that the minifier will not anonymize the function. + next.done = true; + return next; + }; + }; + + function values(iterable) { + if (iterable) { + var iteratorMethod = iterable[iteratorSymbol]; + if (iteratorMethod) { + return iteratorMethod.call(iterable); + } + + if (typeof iterable.next === "function") { + return iterable; + } + + if (!isNaN(iterable.length)) { + var i = -1, next = function next() { + while (++i < iterable.length) { + if (hasOwn.call(iterable, i)) { + next.value = iterable[i]; + next.done = false; + return next; + } + } + + next.value = undefined$1; + next.done = true; + + return next; + }; + + return next.next = next; + } + } + + // Return an iterator with no values. + return { next: doneResult }; + } + exports.values = values; + + function doneResult() { + return { value: undefined$1, done: true }; + } + + Context.prototype = { + constructor: Context, + + reset: function(skipTempReset) { + this.prev = 0; + this.next = 0; + // Resetting context._sent for legacy support of Babel's + // function.sent implementation. + this.sent = this._sent = undefined$1; + this.done = false; + this.delegate = null; + + this.method = "next"; + this.arg = undefined$1; + + this.tryEntries.forEach(resetTryEntry); + + if (!skipTempReset) { + for (var name in this) { + // Not sure about the optimal order of these conditions: + if (name.charAt(0) === "t" && + hasOwn.call(this, name) && + !isNaN(+name.slice(1))) { + this[name] = undefined$1; + } + } + } + }, + + stop: function() { + this.done = true; + + var rootEntry = this.tryEntries[0]; + var rootRecord = rootEntry.completion; + if (rootRecord.type === "throw") { + throw rootRecord.arg; + } + + return this.rval; + }, + + dispatchException: function(exception) { + if (this.done) { + throw exception; + } + + var context = this; + function handle(loc, caught) { + record.type = "throw"; + record.arg = exception; + context.next = loc; + + if (caught) { + // If the dispatched exception was caught by a catch block, + // then let that catch block handle the exception normally. + context.method = "next"; + context.arg = undefined$1; + } + + return !! caught; + } + + for (var i = this.tryEntries.length - 1; i >= 0; --i) { + var entry = this.tryEntries[i]; + var record = entry.completion; + + if (entry.tryLoc === "root") { + // Exception thrown outside of any try block that could handle + // it, so set the completion value of the entire function to + // throw the exception. + return handle("end"); + } + + if (entry.tryLoc <= this.prev) { + var hasCatch = hasOwn.call(entry, "catchLoc"); + var hasFinally = hasOwn.call(entry, "finallyLoc"); + + if (hasCatch && hasFinally) { + if (this.prev < entry.catchLoc) { + return handle(entry.catchLoc, true); + } else if (this.prev < entry.finallyLoc) { + return handle(entry.finallyLoc); + } + + } else if (hasCatch) { + if (this.prev < entry.catchLoc) { + return handle(entry.catchLoc, true); + } + + } else if (hasFinally) { + if (this.prev < entry.finallyLoc) { + return handle(entry.finallyLoc); + } + + } else { + throw new Error("try statement without catch or finally"); + } + } + } + }, + + abrupt: function(type, arg) { + for (var i = this.tryEntries.length - 1; i >= 0; --i) { + var entry = this.tryEntries[i]; + if (entry.tryLoc <= this.prev && + hasOwn.call(entry, "finallyLoc") && + this.prev < entry.finallyLoc) { + var finallyEntry = entry; + break; + } + } + + if (finallyEntry && + (type === "break" || + type === "continue") && + finallyEntry.tryLoc <= arg && + arg <= finallyEntry.finallyLoc) { + // Ignore the finally entry if control is not jumping to a + // location outside the try/catch block. + finallyEntry = null; + } + + var record = finallyEntry ? finallyEntry.completion : {}; + record.type = type; + record.arg = arg; + + if (finallyEntry) { + this.method = "next"; + this.next = finallyEntry.finallyLoc; + return ContinueSentinel; + } + + return this.complete(record); + }, + + complete: function(record, afterLoc) { + if (record.type === "throw") { + throw record.arg; + } + + if (record.type === "break" || + record.type === "continue") { + this.next = record.arg; + } else if (record.type === "return") { + this.rval = this.arg = record.arg; + this.method = "return"; + this.next = "end"; + } else if (record.type === "normal" && afterLoc) { + this.next = afterLoc; + } + + return ContinueSentinel; + }, + + finish: function(finallyLoc) { + for (var i = this.tryEntries.length - 1; i >= 0; --i) { + var entry = this.tryEntries[i]; + if (entry.finallyLoc === finallyLoc) { + this.complete(entry.completion, entry.afterLoc); + resetTryEntry(entry); + return ContinueSentinel; + } + } + }, + + "catch": function(tryLoc) { + for (var i = this.tryEntries.length - 1; i >= 0; --i) { + var entry = this.tryEntries[i]; + if (entry.tryLoc === tryLoc) { + var record = entry.completion; + if (record.type === "throw") { + var thrown = record.arg; + resetTryEntry(entry); + } + return thrown; + } + } + + // The context.catch method must only be called with a location + // argument that corresponds to a known catch block. + throw new Error("illegal catch attempt"); + }, + + delegateYield: function(iterable, resultName, nextLoc) { + this.delegate = { + iterator: values(iterable), + resultName: resultName, + nextLoc: nextLoc + }; + + if (this.method === "next") { + // Deliberately forget the last sent value so that we don't + // accidentally pass it on to the delegate. + this.arg = undefined$1; + } + + return ContinueSentinel; + } + }; + + // Regardless of whether this script is executing as a CommonJS module + // or not, return the runtime object so that we can declare the variable + // regeneratorRuntime in the outer scope, which allows this module to be + // injected easily by `bin/regenerator --include-runtime script.js`. + return exports; + +}( + // If this script is executing as a CommonJS module, use module.exports + // as the regeneratorRuntime namespace. Otherwise create a new empty + // object. Either way, the resulting object will be used to initialize + // the regeneratorRuntime variable at the top of this file. + module.exports +)); + +try { + regeneratorRuntime = runtime; +} catch (accidentalStrictMode) { + // This module should not be running in strict mode, so the above + // assignment should always work unless something is misconfigured. Just + // in case runtime.js accidentally runs in strict mode, in modern engines + // we can explicitly access globalThis. In older engines we can escape + // strict mode using a global Function call. This could conceivably fail + // if a Content Security Policy forbids using Function, but in that case + // the proper solution is to fix the accidental strict mode problem. If + // you've misconfigured your bundler to force strict mode and applied a + // CSP to forbid Function, and you're not willing to fix either of those + // problems, please detail your unique predicament in a GitHub issue. + if (typeof globalThis === "object") { + globalThis.regeneratorRuntime = runtime; + } else { + Function("r", "regeneratorRuntime = r")(runtime); + } +} +}(runtime)); + +var regenerator = runtime.exports; + +function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { + try { + var info = gen[key](arg); + var value = info.value; + } catch (error) { + reject(error); + return; + } + + if (info.done) { + resolve(value); + } else { + Promise.resolve(value).then(_next, _throw); + } +} + +function _asyncToGenerator(fn) { + return function () { + var self = this, + args = arguments; + return new Promise(function (resolve, reject) { + var gen = fn.apply(self, args); + + function _next(value) { + asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); + } + + function _throw(err) { + asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); + } + + _next(undefined); + }); + }; +} + +var EMPTY = -1; +var entitySequence = 1; +/** + * 类似关系型数据库的主键 + * TODO: 自动生成，考虑序列化 + */ + +function createEntity() { + return entitySequence++; +} + +var Component = function Component(data) {// + + _classCallCheck(this, Component); +}; +/** + * 管理某一类 Component，尽可能做到 AoS 而非 SoA + * @see https://wickedengine.net/2019/09/29/entity-component-system/ + * @see https://github.com/turanszkij/WickedEngine/blob/master/WickedEngine/wiECS.h + */ +// tslint:disable-next-line:max-classes-per-file + +var ComponentManager = /*#__PURE__*/function () { + /** + * 不在 Entity 中维护拥有的 Component 列表，反之亦然 + */ + function ComponentManager(clazz) { + _classCallCheck(this, ComponentManager); + + this.clazz = void 0; + this.components = []; + this.entities = []; + this.lookup = {}; + this.clazz = clazz; + } + + _createClass(ComponentManager, [{ + key: "clear", + value: function clear() { + this.components = []; + this.entities = []; + this.lookup = {}; + } + }, { + key: "contains", + value: function contains(entity) { + return this.lookup[entity] > -1; + } + }, { + key: "create", + value: function create(entity, data) { + this.lookup[entity] = this.components.length; + var component = new this.clazz(data || {}); + this.components.push(component); + this.entities.push(entity); + return component; + } + }, { + key: "remove", + value: function remove(entity) { + var componentIndex = this.lookup[entity]; + + if (componentIndex > -1) { + if (componentIndex < this.components.length - 1) { + // 将待删除元素和最后一个元素交换 + // C++ 中有 std::move 这样的操作，避免数据的拷贝 + // @see https://github.com/turanszkij/WickedEngine/blob/master/WickedEngine/wiECS.h#L169 + this.components[componentIndex] = this.components[this.components.length - 1]; + this.entities[componentIndex] = this.entities[this.entities.length - 1]; + this.lookup[this.entities[componentIndex]] = componentIndex; + } + } // 待删除元素已经移动到了最后一个 + + + this.components.pop(); + this.entities.pop(); + delete this.lookup[entity]; + } + }, { + key: "removeKeepSorted", + value: function removeKeepSorted(entity) { + var componentIndex = this.lookup[entity]; + + if (componentIndex > -1) { + var entity2 = this.entities[componentIndex]; + + if (componentIndex < this.components.length - 1) { + // Move every component left by one that is after this element: + for (var _i = componentIndex + 1; _i < this.components.length; ++_i) { + this.components[_i - 1] = this.components[_i]; + } // Move every entity left by one that is after this element and update lut: + + + for (var _i2 = componentIndex + 1; _i2 < this.entities.length; ++_i2) { + this.entities[_i2 - 1] = this.entities[_i2]; + this.lookup[this.entities[_i2 - 1]] = _i2 - 1; + } + } + + this.components.pop(); + this.entities.pop(); + delete this.lookup[entity2]; + } + } + }, { + key: "moveItem", + value: function moveItem(srcIndex, destIndex) { + if (srcIndex === destIndex) { + return; + } // Save the moved component and entity: + + + var srcComponent = this.components[srcIndex]; + var srcEntity = this.entities[srcIndex]; // Every other entity-component that's in the way gets moved by one and lut is kept updated: + + var direction = srcIndex < destIndex ? 1 : -1; + + for (var _i3 = srcIndex; _i3 !== destIndex; _i3 += direction) { + var next = _i3 + direction; + this.components[_i3] = this.components[next]; + this.entities[_i3] = this.entities[next]; + this.lookup[this.entities[_i3]] = _i3; + } // Saved entity-component moved to the required position: + + + this.components[destIndex] = srcComponent; + this.entities[destIndex] = srcEntity; + this.lookup[srcEntity] = destIndex; + } + }, { + key: "getEntity", + value: function getEntity(index) { + return this.entities[index]; + } + /** + * 由于缺少类似 C++ 的重载操作符，没法通过 [下标] 直接访问。因此只能增加该方法用于遍历。 + */ + + }, { + key: "getComponent", + value: function getComponent(index) { + return this.components[index]; + } + }, { + key: "getComponentByEntity", + value: function getComponentByEntity(entity) { + var componentIndex = this.lookup[entity]; + + if (componentIndex > -1) { + return this.components[componentIndex]; + } + + return null; + } + }, { + key: "getCount", + value: function getCount() { + return this.components.length; + } + }, { + key: "getEntityByComponentIndex", + value: function getEntityByComponentIndex(componentIdx) { + for (var _i4 = 0, _Object$keys = Object.keys(this.lookup); _i4 < _Object$keys.length; _i4++) { + var _entity = _Object$keys[_i4]; + var entityInNum = Number(_entity); + + if (this.lookup[entityInNum] === componentIdx) { + return entityInNum; + } + } + + return EMPTY; + } + }, { + key: "find", + value: function find(callback) { + for (var _i5 = 0; _i5 < this.getCount(); _i5++) { + var _component = this.getComponent(_i5); + + if (callback(_component, _i5)) { + return _component; + } + } + + return null; + } + }, { + key: "findIndex", + value: function findIndex(callback) { + for (var _i6 = 0; _i6 < this.getCount(); _i6++) { + var _component2 = this.getComponent(_i6); + + if (callback(_component2, _i6)) { + return _i6; + } + } + + return -1; + } + }, { + key: "forEach", + value: function forEach(callback) { + for (var _i7 = 0, _Object$keys2 = Object.keys(this.lookup); _i7 < _Object$keys2.length; _i7++) { + var _entity2 = _Object$keys2[_i7]; + var entityInNum = Number(_entity2); + var componentIndex = this.lookup[entityInNum]; + callback(entityInNum, this.getComponent(componentIndex)); + } + } + }, { + key: "forEachAsync", + value: function () { + var _forEachAsync = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee(callback) { + var _i8, _Object$keys3, _entity3, entityInNum, componentIndex; + + return regenerator.wrap(function _callee$(_context) { + while (1) { + switch (_context.prev = _context.next) { + case 0: + _i8 = 0, _Object$keys3 = Object.keys(this.lookup); + + case 1: + if (!(_i8 < _Object$keys3.length)) { + _context.next = 10; + break; + } + + _entity3 = _Object$keys3[_i8]; + entityInNum = Number(_entity3); + componentIndex = this.lookup[entityInNum]; + _context.next = 7; + return callback(entityInNum, this.getComponent(componentIndex)); + + case 7: + _i8++; + _context.next = 1; + break; + + case 10: + case "end": + return _context.stop(); + } + } + }, _callee, this); + })); + + function forEachAsync(_x) { + return _forEachAsync.apply(this, arguments); + } + + return forEachAsync; + }() + }, { + key: "map", + value: function map(callback) { + var result = []; + + for (var _i9 = 0, _Object$keys4 = Object.keys(this.lookup); _i9 < _Object$keys4.length; _i9++) { + var _entity4 = _Object$keys4[_i9]; + var entityInNum = Number(_entity4); + var componentIndex = this.lookup[entityInNum]; + result.push(callback(entityInNum, this.getComponent(componentIndex))); + } + + return result; + } + }]); + + return ComponentManager; +}(); + +function _arrayWithHoles(arr) { + if (Array.isArray(arr)) return arr; +} + +function _iterableToArrayLimit(arr, i) { + var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; + + if (_i == null) return; + var _arr = []; + var _n = true; + var _d = false; + + var _s, _e; + + try { + for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { + _arr.push(_s.value); + + if (i && _arr.length === i) break; + } + } catch (err) { + _d = true; + _e = err; + } finally { + try { + if (!_n && _i["return"] != null) _i["return"](); + } finally { + if (_d) throw _e; + } + } + + return _arr; +} + +function _arrayLikeToArray$5(arr, len) { + if (len == null || len > arr.length) len = arr.length; + + for (var i = 0, arr2 = new Array(len); i < len; i++) { + arr2[i] = arr[i]; + } + + return arr2; +} + +function _unsupportedIterableToArray$5(o, minLen) { + if (!o) return; + if (typeof o === "string") return _arrayLikeToArray$5(o, minLen); + var n = Object.prototype.toString.call(o).slice(8, -1); + if (n === "Object" && o.constructor) n = o.constructor.name; + if (n === "Map" || n === "Set") return Array.from(o); + if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$5(o, minLen); +} + +function _nonIterableRest() { + throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); +} + +function _slicedToArray(arr, i) { + return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray$5(arr, i) || _nonIterableRest(); +} + +var inversify = {}; + +var metadata_keys = {}; + +(function (exports) { +Object.defineProperty(exports, "__esModule", { value: true }); +exports.NON_CUSTOM_TAG_KEYS = exports.POST_CONSTRUCT = exports.DESIGN_PARAM_TYPES = exports.PARAM_TYPES = exports.TAGGED_PROP = exports.TAGGED = exports.MULTI_INJECT_TAG = exports.INJECT_TAG = exports.OPTIONAL_TAG = exports.UNMANAGED_TAG = exports.NAME_TAG = exports.NAMED_TAG = void 0; +exports.NAMED_TAG = "named"; +exports.NAME_TAG = "name"; +exports.UNMANAGED_TAG = "unmanaged"; +exports.OPTIONAL_TAG = "optional"; +exports.INJECT_TAG = "inject"; +exports.MULTI_INJECT_TAG = "multi_inject"; +exports.TAGGED = "inversify:tagged"; +exports.TAGGED_PROP = "inversify:tagged_props"; +exports.PARAM_TYPES = "inversify:paramtypes"; +exports.DESIGN_PARAM_TYPES = "design:paramtypes"; +exports.POST_CONSTRUCT = "post_construct"; +function getNonCustomTagKeys() { + return [ + exports.INJECT_TAG, + exports.MULTI_INJECT_TAG, + exports.NAME_TAG, + exports.UNMANAGED_TAG, + exports.NAMED_TAG, + exports.OPTIONAL_TAG, + ]; +} +exports.NON_CUSTOM_TAG_KEYS = getNonCustomTagKeys(); + +}(metadata_keys)); + +var container$1 = {}; + +var binding = {}; + +var literal_types = {}; + +Object.defineProperty(literal_types, "__esModule", { value: true }); +literal_types.TargetTypeEnum = literal_types.BindingTypeEnum = literal_types.BindingScopeEnum = void 0; +var BindingScopeEnum = { + Request: "Request", + Singleton: "Singleton", + Transient: "Transient" +}; +literal_types.BindingScopeEnum = BindingScopeEnum; +var BindingTypeEnum = { + ConstantValue: "ConstantValue", + Constructor: "Constructor", + DynamicValue: "DynamicValue", + Factory: "Factory", + Function: "Function", + Instance: "Instance", + Invalid: "Invalid", + Provider: "Provider" +}; +literal_types.BindingTypeEnum = BindingTypeEnum; +var TargetTypeEnum = { + ClassProperty: "ClassProperty", + ConstructorArgument: "ConstructorArgument", + Variable: "Variable" +}; +literal_types.TargetTypeEnum = TargetTypeEnum; + +var id$1 = {}; + +Object.defineProperty(id$1, "__esModule", { value: true }); +id$1.id = void 0; +var idCounter = 0; +function id() { + return idCounter++; +} +id$1.id = id; + +Object.defineProperty(binding, "__esModule", { value: true }); +binding.Binding = void 0; +var literal_types_1$6 = literal_types; +var id_1$5 = id$1; +var Binding = (function () { + function Binding(serviceIdentifier, scope) { + this.id = id_1$5.id(); + this.activated = false; + this.serviceIdentifier = serviceIdentifier; + this.scope = scope; + this.type = literal_types_1$6.BindingTypeEnum.Invalid; + this.constraint = function (request) { return true; }; + this.implementationType = null; + this.cache = null; + this.factory = null; + this.provider = null; + this.onActivation = null; + this.dynamicValue = null; + } + Binding.prototype.clone = function () { + var clone = new Binding(this.serviceIdentifier, this.scope); + clone.activated = (clone.scope === literal_types_1$6.BindingScopeEnum.Singleton) ? this.activated : false; + clone.implementationType = this.implementationType; + clone.dynamicValue = this.dynamicValue; + clone.scope = this.scope; + clone.type = this.type; + clone.factory = this.factory; + clone.provider = this.provider; + clone.constraint = this.constraint; + clone.onActivation = this.onActivation; + clone.cache = this.cache; + return clone; + }; + return Binding; +}()); +binding.Binding = Binding; + +var error_msgs = {}; + +Object.defineProperty(error_msgs, "__esModule", { value: true }); +error_msgs.STACK_OVERFLOW = error_msgs.CIRCULAR_DEPENDENCY_IN_FACTORY = error_msgs.POST_CONSTRUCT_ERROR = error_msgs.MULTIPLE_POST_CONSTRUCT_METHODS = error_msgs.CONTAINER_OPTIONS_INVALID_SKIP_BASE_CHECK = error_msgs.CONTAINER_OPTIONS_INVALID_AUTO_BIND_INJECTABLE = error_msgs.CONTAINER_OPTIONS_INVALID_DEFAULT_SCOPE = error_msgs.CONTAINER_OPTIONS_MUST_BE_AN_OBJECT = error_msgs.ARGUMENTS_LENGTH_MISMATCH = error_msgs.INVALID_DECORATOR_OPERATION = error_msgs.INVALID_TO_SELF_VALUE = error_msgs.INVALID_FUNCTION_BINDING = error_msgs.INVALID_MIDDLEWARE_RETURN = error_msgs.NO_MORE_SNAPSHOTS_AVAILABLE = error_msgs.INVALID_BINDING_TYPE = error_msgs.NOT_IMPLEMENTED = error_msgs.CIRCULAR_DEPENDENCY = error_msgs.UNDEFINED_INJECT_ANNOTATION = error_msgs.MISSING_INJECT_ANNOTATION = error_msgs.MISSING_INJECTABLE_ANNOTATION = error_msgs.NOT_REGISTERED = error_msgs.CANNOT_UNBIND = error_msgs.AMBIGUOUS_MATCH = error_msgs.KEY_NOT_FOUND = error_msgs.NULL_ARGUMENT = error_msgs.DUPLICATED_METADATA = error_msgs.DUPLICATED_INJECTABLE_DECORATOR = void 0; +error_msgs.DUPLICATED_INJECTABLE_DECORATOR = "Cannot apply @injectable decorator multiple times."; +error_msgs.DUPLICATED_METADATA = "Metadata key was used more than once in a parameter:"; +error_msgs.NULL_ARGUMENT = "NULL argument"; +error_msgs.KEY_NOT_FOUND = "Key Not Found"; +error_msgs.AMBIGUOUS_MATCH = "Ambiguous match found for serviceIdentifier:"; +error_msgs.CANNOT_UNBIND = "Could not unbind serviceIdentifier:"; +error_msgs.NOT_REGISTERED = "No matching bindings found for serviceIdentifier:"; +error_msgs.MISSING_INJECTABLE_ANNOTATION = "Missing required @injectable annotation in:"; +error_msgs.MISSING_INJECT_ANNOTATION = "Missing required @inject or @multiInject annotation in:"; +var UNDEFINED_INJECT_ANNOTATION = function (name) { + return "@inject called with undefined this could mean that the class " + name + " has " + + "a circular dependency problem. You can use a LazyServiceIdentifer to " + + "overcome this limitation."; +}; +error_msgs.UNDEFINED_INJECT_ANNOTATION = UNDEFINED_INJECT_ANNOTATION; +error_msgs.CIRCULAR_DEPENDENCY = "Circular dependency found:"; +error_msgs.NOT_IMPLEMENTED = "Sorry, this feature is not fully implemented yet."; +error_msgs.INVALID_BINDING_TYPE = "Invalid binding type:"; +error_msgs.NO_MORE_SNAPSHOTS_AVAILABLE = "No snapshot available to restore."; +error_msgs.INVALID_MIDDLEWARE_RETURN = "Invalid return type in middleware. Middleware must return!"; +error_msgs.INVALID_FUNCTION_BINDING = "Value provided to function binding must be a function!"; +error_msgs.INVALID_TO_SELF_VALUE = "The toSelf function can only be applied when a constructor is " + + "used as service identifier"; +error_msgs.INVALID_DECORATOR_OPERATION = "The @inject @multiInject @tagged and @named decorators " + + "must be applied to the parameters of a class constructor or a class property."; +var ARGUMENTS_LENGTH_MISMATCH = function () { + var values = []; + for (var _i = 0; _i < arguments.length; _i++) { + values[_i] = arguments[_i]; + } + return "The number of constructor arguments in the derived class " + + (values[0] + " must be >= than the number of constructor arguments of its base class."); +}; +error_msgs.ARGUMENTS_LENGTH_MISMATCH = ARGUMENTS_LENGTH_MISMATCH; +error_msgs.CONTAINER_OPTIONS_MUST_BE_AN_OBJECT = "Invalid Container constructor argument. Container options " + + "must be an object."; +error_msgs.CONTAINER_OPTIONS_INVALID_DEFAULT_SCOPE = "Invalid Container option. Default scope must " + + "be a string ('singleton' or 'transient')."; +error_msgs.CONTAINER_OPTIONS_INVALID_AUTO_BIND_INJECTABLE = "Invalid Container option. Auto bind injectable must " + + "be a boolean"; +error_msgs.CONTAINER_OPTIONS_INVALID_SKIP_BASE_CHECK = "Invalid Container option. Skip base check must " + + "be a boolean"; +error_msgs.MULTIPLE_POST_CONSTRUCT_METHODS = "Cannot apply @postConstruct decorator multiple times in the same class"; +var POST_CONSTRUCT_ERROR = function () { + var values = []; + for (var _i = 0; _i < arguments.length; _i++) { + values[_i] = arguments[_i]; + } + return "@postConstruct error in class " + values[0] + ": " + values[1]; +}; +error_msgs.POST_CONSTRUCT_ERROR = POST_CONSTRUCT_ERROR; +var CIRCULAR_DEPENDENCY_IN_FACTORY = function () { + var values = []; + for (var _i = 0; _i < arguments.length; _i++) { + values[_i] = arguments[_i]; + } + return "It looks like there is a circular dependency " + + ("in one of the '" + values[0] + "' bindings. Please investigate bindings with") + + ("service identifier '" + values[1] + "'."); +}; +error_msgs.CIRCULAR_DEPENDENCY_IN_FACTORY = CIRCULAR_DEPENDENCY_IN_FACTORY; +error_msgs.STACK_OVERFLOW = "Maximum call stack size exceeded"; + +var metadata_reader = {}; + +Object.defineProperty(metadata_reader, "__esModule", { value: true }); +metadata_reader.MetadataReader = void 0; +var METADATA_KEY$f = metadata_keys; +var MetadataReader = (function () { + function MetadataReader() { + } + MetadataReader.prototype.getConstructorMetadata = function (constructorFunc) { + var compilerGeneratedMetadata = Reflect.getMetadata(METADATA_KEY$f.PARAM_TYPES, constructorFunc); + var userGeneratedMetadata = Reflect.getMetadata(METADATA_KEY$f.TAGGED, constructorFunc); + return { + compilerGeneratedMetadata: compilerGeneratedMetadata, + userGeneratedMetadata: userGeneratedMetadata || {} + }; + }; + MetadataReader.prototype.getPropertiesMetadata = function (constructorFunc) { + var userGeneratedMetadata = Reflect.getMetadata(METADATA_KEY$f.TAGGED_PROP, constructorFunc) || []; + return userGeneratedMetadata; + }; + return MetadataReader; +}()); +metadata_reader.MetadataReader = MetadataReader; + +var planner = {}; + +var binding_count = {}; + +Object.defineProperty(binding_count, "__esModule", { value: true }); +binding_count.BindingCount = void 0; +var BindingCount = { + MultipleBindingsAvailable: 2, + NoBindingsAvailable: 0, + OnlyOneBindingAvailable: 1 +}; +binding_count.BindingCount = BindingCount; + +var exceptions = {}; + +Object.defineProperty(exceptions, "__esModule", { value: true }); +exceptions.isStackOverflowExeption = void 0; +var ERROR_MSGS$7 = error_msgs; +function isStackOverflowExeption(error) { + return (error instanceof RangeError || + error.message === ERROR_MSGS$7.STACK_OVERFLOW); +} +exceptions.isStackOverflowExeption = isStackOverflowExeption; + +var serialization = {}; + +Object.defineProperty(serialization, "__esModule", { value: true }); +serialization.circularDependencyToException = serialization.listMetadataForTarget = serialization.listRegisteredBindingsForServiceIdentifier = serialization.getServiceIdentifierAsString = serialization.getFunctionName = void 0; +var ERROR_MSGS$6 = error_msgs; +function getServiceIdentifierAsString(serviceIdentifier) { + if (typeof serviceIdentifier === "function") { + var _serviceIdentifier = serviceIdentifier; + return _serviceIdentifier.name; + } + else if (typeof serviceIdentifier === "symbol") { + return serviceIdentifier.toString(); + } + else { + var _serviceIdentifier = serviceIdentifier; + return _serviceIdentifier; + } +} +serialization.getServiceIdentifierAsString = getServiceIdentifierAsString; +function listRegisteredBindingsForServiceIdentifier(container, serviceIdentifier, getBindings) { + var registeredBindingsList = ""; + var registeredBindings = getBindings(container, serviceIdentifier); + if (registeredBindings.length !== 0) { + registeredBindingsList = "\nRegistered bindings:"; + registeredBindings.forEach(function (binding) { + var name = "Object"; + if (binding.implementationType !== null) { + name = getFunctionName(binding.implementationType); + } + registeredBindingsList = registeredBindingsList + "\n " + name; + if (binding.constraint.metaData) { + registeredBindingsList = registeredBindingsList + " - " + binding.constraint.metaData; + } + }); + } + return registeredBindingsList; +} +serialization.listRegisteredBindingsForServiceIdentifier = listRegisteredBindingsForServiceIdentifier; +function alreadyDependencyChain(request, serviceIdentifier) { + if (request.parentRequest === null) { + return false; + } + else if (request.parentRequest.serviceIdentifier === serviceIdentifier) { + return true; + } + else { + return alreadyDependencyChain(request.parentRequest, serviceIdentifier); + } +} +function dependencyChainToString(request) { + function _createStringArr(req, result) { + if (result === void 0) { result = []; } + var serviceIdentifier = getServiceIdentifierAsString(req.serviceIdentifier); + result.push(serviceIdentifier); + if (req.parentRequest !== null) { + return _createStringArr(req.parentRequest, result); + } + return result; + } + var stringArr = _createStringArr(request); + return stringArr.reverse().join(" --> "); +} +function circularDependencyToException(request) { + request.childRequests.forEach(function (childRequest) { + if (alreadyDependencyChain(childRequest, childRequest.serviceIdentifier)) { + var services = dependencyChainToString(childRequest); + throw new Error(ERROR_MSGS$6.CIRCULAR_DEPENDENCY + " " + services); + } + else { + circularDependencyToException(childRequest); + } + }); +} +serialization.circularDependencyToException = circularDependencyToException; +function listMetadataForTarget(serviceIdentifierString, target) { + if (target.isTagged() || target.isNamed()) { + var m_1 = ""; + var namedTag = target.getNamedTag(); + var otherTags = target.getCustomTags(); + if (namedTag !== null) { + m_1 += namedTag.toString() + "\n"; + } + if (otherTags !== null) { + otherTags.forEach(function (tag) { + m_1 += tag.toString() + "\n"; + }); + } + return " " + serviceIdentifierString + "\n " + serviceIdentifierString + " - " + m_1; + } + else { + return " " + serviceIdentifierString; + } +} +serialization.listMetadataForTarget = listMetadataForTarget; +function getFunctionName(v) { + if (v.name) { + return v.name; + } + else { + var name_1 = v.toString(); + var match = name_1.match(/^function\s*([^\s(]+)/); + return match ? match[1] : "Anonymous function: " + name_1; + } +} +serialization.getFunctionName = getFunctionName; + +var context = {}; + +Object.defineProperty(context, "__esModule", { value: true }); +context.Context = void 0; +var id_1$4 = id$1; +var Context = (function () { + function Context(container) { + this.id = id_1$4.id(); + this.container = container; + } + Context.prototype.addPlan = function (plan) { + this.plan = plan; + }; + Context.prototype.setCurrentRequest = function (currentRequest) { + this.currentRequest = currentRequest; + }; + return Context; +}()); +context.Context = Context; + +var metadata = {}; + +Object.defineProperty(metadata, "__esModule", { value: true }); +metadata.Metadata = void 0; +var METADATA_KEY$e = metadata_keys; +var Metadata = (function () { + function Metadata(key, value) { + this.key = key; + this.value = value; + } + Metadata.prototype.toString = function () { + if (this.key === METADATA_KEY$e.NAMED_TAG) { + return "named: " + this.value.toString() + " "; + } + else { + return "tagged: { key:" + this.key.toString() + ", value: " + this.value + " }"; + } + }; + return Metadata; +}()); +metadata.Metadata = Metadata; + +var plan$1 = {}; + +Object.defineProperty(plan$1, "__esModule", { value: true }); +plan$1.Plan = void 0; +var Plan = (function () { + function Plan(parentContext, rootRequest) { + this.parentContext = parentContext; + this.rootRequest = rootRequest; + } + return Plan; +}()); +plan$1.Plan = Plan; + +var reflection_utils = {}; + +var inject$1 = {}; + +var decorator_utils = {}; + +Object.defineProperty(decorator_utils, "__esModule", { value: true }); +decorator_utils.tagProperty = decorator_utils.tagParameter = decorator_utils.decorate = void 0; +var ERROR_MSGS$5 = error_msgs; +var METADATA_KEY$d = metadata_keys; +function tagParameter(annotationTarget, propertyName, parameterIndex, metadata) { + var metadataKey = METADATA_KEY$d.TAGGED; + _tagParameterOrProperty(metadataKey, annotationTarget, propertyName, metadata, parameterIndex); +} +decorator_utils.tagParameter = tagParameter; +function tagProperty(annotationTarget, propertyName, metadata) { + var metadataKey = METADATA_KEY$d.TAGGED_PROP; + _tagParameterOrProperty(metadataKey, annotationTarget.constructor, propertyName, metadata); +} +decorator_utils.tagProperty = tagProperty; +function _tagParameterOrProperty(metadataKey, annotationTarget, propertyName, metadata, parameterIndex) { + var paramsOrPropertiesMetadata = {}; + var isParameterDecorator = (typeof parameterIndex === "number"); + var key = (parameterIndex !== undefined && isParameterDecorator) ? parameterIndex.toString() : propertyName; + if (isParameterDecorator && propertyName !== undefined) { + throw new Error(ERROR_MSGS$5.INVALID_DECORATOR_OPERATION); + } + if (Reflect.hasOwnMetadata(metadataKey, annotationTarget)) { + paramsOrPropertiesMetadata = Reflect.getMetadata(metadataKey, annotationTarget); + } + var paramOrPropertyMetadata = paramsOrPropertiesMetadata[key]; + if (!Array.isArray(paramOrPropertyMetadata)) { + paramOrPropertyMetadata = []; + } + else { + for (var _i = 0, paramOrPropertyMetadata_1 = paramOrPropertyMetadata; _i < paramOrPropertyMetadata_1.length; _i++) { + var m = paramOrPropertyMetadata_1[_i]; + if (m.key === metadata.key) { + throw new Error(ERROR_MSGS$5.DUPLICATED_METADATA + " " + m.key.toString()); + } + } + } + paramOrPropertyMetadata.push(metadata); + paramsOrPropertiesMetadata[key] = paramOrPropertyMetadata; + Reflect.defineMetadata(metadataKey, paramsOrPropertiesMetadata, annotationTarget); +} +function _decorate(decorators, target) { + Reflect.decorate(decorators, target); +} +function _param(paramIndex, decorator) { + return function (target, key) { decorator(target, key, paramIndex); }; +} +function decorate(decorator, target, parameterIndex) { + if (typeof parameterIndex === "number") { + _decorate([_param(parameterIndex, decorator)], target); + } + else if (typeof parameterIndex === "string") { + Reflect.decorate([decorator], target, parameterIndex); + } + else { + _decorate([decorator], target); + } +} +decorator_utils.decorate = decorate; + +Object.defineProperty(inject$1, "__esModule", { value: true }); +inject$1.inject = inject$1.LazyServiceIdentifer = void 0; +var error_msgs_1$1 = error_msgs; +var METADATA_KEY$c = metadata_keys; +var metadata_1$a = metadata; +var decorator_utils_1$6 = decorator_utils; +var LazyServiceIdentifer = (function () { + function LazyServiceIdentifer(cb) { + this._cb = cb; + } + LazyServiceIdentifer.prototype.unwrap = function () { + return this._cb(); + }; + return LazyServiceIdentifer; +}()); +inject$1.LazyServiceIdentifer = LazyServiceIdentifer; +function inject(serviceIdentifier) { + return function (target, targetKey, index) { + if (serviceIdentifier === undefined) { + throw new Error(error_msgs_1$1.UNDEFINED_INJECT_ANNOTATION(target.name)); + } + var metadata = new metadata_1$a.Metadata(METADATA_KEY$c.INJECT_TAG, serviceIdentifier); + if (typeof index === "number") { + decorator_utils_1$6.tagParameter(target, targetKey, index, metadata); + } + else { + decorator_utils_1$6.tagProperty(target, targetKey, metadata); + } + }; +} +inject$1.inject = inject; + +var target = {}; + +var queryable_string = {}; + +Object.defineProperty(queryable_string, "__esModule", { value: true }); +queryable_string.QueryableString = void 0; +var QueryableString = (function () { + function QueryableString(str) { + this.str = str; + } + QueryableString.prototype.startsWith = function (searchString) { + return this.str.indexOf(searchString) === 0; + }; + QueryableString.prototype.endsWith = function (searchString) { + var reverseString = ""; + var reverseSearchString = searchString.split("").reverse().join(""); + reverseString = this.str.split("").reverse().join(""); + return this.startsWith.call({ str: reverseString }, reverseSearchString); + }; + QueryableString.prototype.contains = function (searchString) { + return (this.str.indexOf(searchString) !== -1); + }; + QueryableString.prototype.equals = function (compareString) { + return this.str === compareString; + }; + QueryableString.prototype.value = function () { + return this.str; + }; + return QueryableString; +}()); +queryable_string.QueryableString = QueryableString; + +Object.defineProperty(target, "__esModule", { value: true }); +target.Target = void 0; +var METADATA_KEY$b = metadata_keys; +var id_1$3 = id$1; +var metadata_1$9 = metadata; +var queryable_string_1 = queryable_string; +var Target$1 = (function () { + function Target(type, name, serviceIdentifier, namedOrTagged) { + this.id = id_1$3.id(); + this.type = type; + this.serviceIdentifier = serviceIdentifier; + this.name = new queryable_string_1.QueryableString(name || ""); + this.metadata = new Array(); + var metadataItem = null; + if (typeof namedOrTagged === "string") { + metadataItem = new metadata_1$9.Metadata(METADATA_KEY$b.NAMED_TAG, namedOrTagged); + } + else if (namedOrTagged instanceof metadata_1$9.Metadata) { + metadataItem = namedOrTagged; + } + if (metadataItem !== null) { + this.metadata.push(metadataItem); + } + } + Target.prototype.hasTag = function (key) { + for (var _i = 0, _a = this.metadata; _i < _a.length; _i++) { + var m = _a[_i]; + if (m.key === key) { + return true; + } + } + return false; + }; + Target.prototype.isArray = function () { + return this.hasTag(METADATA_KEY$b.MULTI_INJECT_TAG); + }; + Target.prototype.matchesArray = function (name) { + return this.matchesTag(METADATA_KEY$b.MULTI_INJECT_TAG)(name); + }; + Target.prototype.isNamed = function () { + return this.hasTag(METADATA_KEY$b.NAMED_TAG); + }; + Target.prototype.isTagged = function () { + return this.metadata.some(function (metadata) { return METADATA_KEY$b.NON_CUSTOM_TAG_KEYS.every(function (key) { return metadata.key !== key; }); }); + }; + Target.prototype.isOptional = function () { + return this.matchesTag(METADATA_KEY$b.OPTIONAL_TAG)(true); + }; + Target.prototype.getNamedTag = function () { + if (this.isNamed()) { + return this.metadata.filter(function (m) { return m.key === METADATA_KEY$b.NAMED_TAG; })[0]; + } + return null; + }; + Target.prototype.getCustomTags = function () { + if (this.isTagged()) { + return this.metadata.filter(function (metadata) { return METADATA_KEY$b.NON_CUSTOM_TAG_KEYS.every(function (key) { return metadata.key !== key; }); }); + } + else { + return null; + } + }; + Target.prototype.matchesNamedTag = function (name) { + return this.matchesTag(METADATA_KEY$b.NAMED_TAG)(name); + }; + Target.prototype.matchesTag = function (key) { + var _this = this; + return function (value) { + for (var _i = 0, _a = _this.metadata; _i < _a.length; _i++) { + var m = _a[_i]; + if (m.key === key && m.value === value) { + return true; + } + } + return false; + }; + }; + return Target; +}()); +target.Target = Target$1; + +(function (exports) { +var __spreadArray = (commonjsGlobal && commonjsGlobal.__spreadArray) || function (to, from) { + for (var i = 0, il = from.length, j = to.length; i < il; i++, j++) + to[j] = from[i]; + return to; +}; +Object.defineProperty(exports, "__esModule", { value: true }); +exports.getFunctionName = exports.getBaseClassDependencyCount = exports.getDependencies = void 0; +var inject_1 = inject$1; +var ERROR_MSGS = error_msgs; +var literal_types_1 = literal_types; +var METADATA_KEY = metadata_keys; +var serialization_1 = serialization; +Object.defineProperty(exports, "getFunctionName", { enumerable: true, get: function () { return serialization_1.getFunctionName; } }); +var target_1 = target; +function getDependencies(metadataReader, func) { + var constructorName = serialization_1.getFunctionName(func); + var targets = getTargets(metadataReader, constructorName, func, false); + return targets; +} +exports.getDependencies = getDependencies; +function getTargets(metadataReader, constructorName, func, isBaseClass) { + var metadata = metadataReader.getConstructorMetadata(func); + var serviceIdentifiers = metadata.compilerGeneratedMetadata; + if (serviceIdentifiers === undefined) { + var msg = ERROR_MSGS.MISSING_INJECTABLE_ANNOTATION + " " + constructorName + "."; + throw new Error(msg); + } + var constructorArgsMetadata = metadata.userGeneratedMetadata; + var keys = Object.keys(constructorArgsMetadata); + var hasUserDeclaredUnknownInjections = (func.length === 0 && keys.length > 0); + var hasOptionalParameters = keys.length > func.length; + var iterations = (hasUserDeclaredUnknownInjections || hasOptionalParameters) ? keys.length : func.length; + var constructorTargets = getConstructorArgsAsTargets(isBaseClass, constructorName, serviceIdentifiers, constructorArgsMetadata, iterations); + var propertyTargets = getClassPropsAsTargets(metadataReader, func); + var targets = __spreadArray(__spreadArray([], constructorTargets), propertyTargets); + return targets; +} +function getConstructorArgsAsTarget(index, isBaseClass, constructorName, serviceIdentifiers, constructorArgsMetadata) { + var targetMetadata = constructorArgsMetadata[index.toString()] || []; + var metadata = formatTargetMetadata(targetMetadata); + var isManaged = metadata.unmanaged !== true; + var serviceIdentifier = serviceIdentifiers[index]; + var injectIdentifier = (metadata.inject || metadata.multiInject); + serviceIdentifier = (injectIdentifier) ? (injectIdentifier) : serviceIdentifier; + if (serviceIdentifier instanceof inject_1.LazyServiceIdentifer) { + serviceIdentifier = serviceIdentifier.unwrap(); + } + if (isManaged) { + var isObject = serviceIdentifier === Object; + var isFunction = serviceIdentifier === Function; + var isUndefined = serviceIdentifier === undefined; + var isUnknownType = (isObject || isFunction || isUndefined); + if (!isBaseClass && isUnknownType) { + var msg = ERROR_MSGS.MISSING_INJECT_ANNOTATION + " argument " + index + " in class " + constructorName + "."; + throw new Error(msg); + } + var target = new target_1.Target(literal_types_1.TargetTypeEnum.ConstructorArgument, metadata.targetName, serviceIdentifier); + target.metadata = targetMetadata; + return target; + } + return null; +} +function getConstructorArgsAsTargets(isBaseClass, constructorName, serviceIdentifiers, constructorArgsMetadata, iterations) { + var targets = []; + for (var i = 0; i < iterations; i++) { + var index = i; + var target = getConstructorArgsAsTarget(index, isBaseClass, constructorName, serviceIdentifiers, constructorArgsMetadata); + if (target !== null) { + targets.push(target); + } + } + return targets; +} +function getClassPropsAsTargets(metadataReader, constructorFunc) { + var classPropsMetadata = metadataReader.getPropertiesMetadata(constructorFunc); + var targets = []; + var keys = Object.keys(classPropsMetadata); + for (var _i = 0, keys_1 = keys; _i < keys_1.length; _i++) { + var key = keys_1[_i]; + var targetMetadata = classPropsMetadata[key]; + var metadata = formatTargetMetadata(classPropsMetadata[key]); + var targetName = metadata.targetName || key; + var serviceIdentifier = (metadata.inject || metadata.multiInject); + var target = new target_1.Target(literal_types_1.TargetTypeEnum.ClassProperty, targetName, serviceIdentifier); + target.metadata = targetMetadata; + targets.push(target); + } + var baseConstructor = Object.getPrototypeOf(constructorFunc.prototype).constructor; + if (baseConstructor !== Object) { + var baseTargets = getClassPropsAsTargets(metadataReader, baseConstructor); + targets = __spreadArray(__spreadArray([], targets), baseTargets); + } + return targets; +} +function getBaseClassDependencyCount(metadataReader, func) { + var baseConstructor = Object.getPrototypeOf(func.prototype).constructor; + if (baseConstructor !== Object) { + var baseConstructorName = serialization_1.getFunctionName(baseConstructor); + var targets = getTargets(metadataReader, baseConstructorName, baseConstructor, true); + var metadata = targets.map(function (t) { + return t.metadata.filter(function (m) { + return m.key === METADATA_KEY.UNMANAGED_TAG; + }); + }); + var unmanagedCount = [].concat.apply([], metadata).length; + var dependencyCount = targets.length - unmanagedCount; + if (dependencyCount > 0) { + return dependencyCount; + } + else { + return getBaseClassDependencyCount(metadataReader, baseConstructor); + } + } + else { + return 0; + } +} +exports.getBaseClassDependencyCount = getBaseClassDependencyCount; +function formatTargetMetadata(targetMetadata) { + var targetMetadataMap = {}; + targetMetadata.forEach(function (m) { + targetMetadataMap[m.key.toString()] = m.value; + }); + return { + inject: targetMetadataMap[METADATA_KEY.INJECT_TAG], + multiInject: targetMetadataMap[METADATA_KEY.MULTI_INJECT_TAG], + targetName: targetMetadataMap[METADATA_KEY.NAME_TAG], + unmanaged: targetMetadataMap[METADATA_KEY.UNMANAGED_TAG] + }; +} + +}(reflection_utils)); + +var request = {}; + +Object.defineProperty(request, "__esModule", { value: true }); +request.Request = void 0; +var id_1$2 = id$1; +var Request = (function () { + function Request(serviceIdentifier, parentContext, parentRequest, bindings, target) { + this.id = id_1$2.id(); + this.serviceIdentifier = serviceIdentifier; + this.parentContext = parentContext; + this.parentRequest = parentRequest; + this.target = target; + this.childRequests = []; + this.bindings = (Array.isArray(bindings) ? bindings : [bindings]); + this.requestScope = parentRequest === null + ? new Map() + : null; + } + Request.prototype.addChildRequest = function (serviceIdentifier, bindings, target) { + var child = new Request(serviceIdentifier, this.parentContext, this, bindings, target); + this.childRequests.push(child); + return child; + }; + return Request; +}()); +request.Request = Request; + +Object.defineProperty(planner, "__esModule", { value: true }); +planner.getBindingDictionary = planner.createMockRequest = planner.plan = void 0; +var binding_count_1 = binding_count; +var ERROR_MSGS$4 = error_msgs; +var literal_types_1$5 = literal_types; +var METADATA_KEY$a = metadata_keys; +var exceptions_1$1 = exceptions; +var serialization_1$2 = serialization; +var context_1 = context; +var metadata_1$8 = metadata; +var plan_1 = plan$1; +var reflection_utils_1 = reflection_utils; +var request_1 = request; +var target_1 = target; +function getBindingDictionary(cntnr) { + return cntnr._bindingDictionary; +} +planner.getBindingDictionary = getBindingDictionary; +function _createTarget(isMultiInject, targetType, serviceIdentifier, name, key, value) { + var metadataKey = isMultiInject ? METADATA_KEY$a.MULTI_INJECT_TAG : METADATA_KEY$a.INJECT_TAG; + var injectMetadata = new metadata_1$8.Metadata(metadataKey, serviceIdentifier); + var target = new target_1.Target(targetType, name, serviceIdentifier, injectMetadata); + if (key !== undefined) { + var tagMetadata = new metadata_1$8.Metadata(key, value); + target.metadata.push(tagMetadata); + } + return target; +} +function _getActiveBindings(metadataReader, avoidConstraints, context, parentRequest, target) { + var bindings = getBindings(context.container, target.serviceIdentifier); + var activeBindings = []; + if (bindings.length === binding_count_1.BindingCount.NoBindingsAvailable && + context.container.options.autoBindInjectable && + typeof target.serviceIdentifier === "function" && + metadataReader.getConstructorMetadata(target.serviceIdentifier).compilerGeneratedMetadata) { + context.container.bind(target.serviceIdentifier).toSelf(); + bindings = getBindings(context.container, target.serviceIdentifier); + } + if (!avoidConstraints) { + activeBindings = bindings.filter(function (binding) { + var request = new request_1.Request(binding.serviceIdentifier, context, parentRequest, binding, target); + return binding.constraint(request); + }); + } + else { + activeBindings = bindings; + } + _validateActiveBindingCount(target.serviceIdentifier, activeBindings, target, context.container); + return activeBindings; +} +function _validateActiveBindingCount(serviceIdentifier, bindings, target, container) { + switch (bindings.length) { + case binding_count_1.BindingCount.NoBindingsAvailable: + if (target.isOptional()) { + return bindings; + } + else { + var serviceIdentifierString = serialization_1$2.getServiceIdentifierAsString(serviceIdentifier); + var msg = ERROR_MSGS$4.NOT_REGISTERED; + msg += serialization_1$2.listMetadataForTarget(serviceIdentifierString, target); + msg += serialization_1$2.listRegisteredBindingsForServiceIdentifier(container, serviceIdentifierString, getBindings); + throw new Error(msg); + } + case binding_count_1.BindingCount.OnlyOneBindingAvailable: + if (!target.isArray()) { + return bindings; + } + case binding_count_1.BindingCount.MultipleBindingsAvailable: + default: + if (!target.isArray()) { + var serviceIdentifierString = serialization_1$2.getServiceIdentifierAsString(serviceIdentifier); + var msg = ERROR_MSGS$4.AMBIGUOUS_MATCH + " " + serviceIdentifierString; + msg += serialization_1$2.listRegisteredBindingsForServiceIdentifier(container, serviceIdentifierString, getBindings); + throw new Error(msg); + } + else { + return bindings; + } + } +} +function _createSubRequests(metadataReader, avoidConstraints, serviceIdentifier, context, parentRequest, target) { + var activeBindings; + var childRequest; + if (parentRequest === null) { + activeBindings = _getActiveBindings(metadataReader, avoidConstraints, context, null, target); + childRequest = new request_1.Request(serviceIdentifier, context, null, activeBindings, target); + var thePlan = new plan_1.Plan(context, childRequest); + context.addPlan(thePlan); + } + else { + activeBindings = _getActiveBindings(metadataReader, avoidConstraints, context, parentRequest, target); + childRequest = parentRequest.addChildRequest(target.serviceIdentifier, activeBindings, target); + } + activeBindings.forEach(function (binding) { + var subChildRequest = null; + if (target.isArray()) { + subChildRequest = childRequest.addChildRequest(binding.serviceIdentifier, binding, target); + } + else { + if (binding.cache) { + return; + } + subChildRequest = childRequest; + } + if (binding.type === literal_types_1$5.BindingTypeEnum.Instance && binding.implementationType !== null) { + var dependencies = reflection_utils_1.getDependencies(metadataReader, binding.implementationType); + if (!context.container.options.skipBaseClassChecks) { + var baseClassDependencyCount = reflection_utils_1.getBaseClassDependencyCount(metadataReader, binding.implementationType); + if (dependencies.length < baseClassDependencyCount) { + var error = ERROR_MSGS$4.ARGUMENTS_LENGTH_MISMATCH(reflection_utils_1.getFunctionName(binding.implementationType)); + throw new Error(error); + } + } + dependencies.forEach(function (dependency) { + _createSubRequests(metadataReader, false, dependency.serviceIdentifier, context, subChildRequest, dependency); + }); + } + }); +} +function getBindings(container, serviceIdentifier) { + var bindings = []; + var bindingDictionary = getBindingDictionary(container); + if (bindingDictionary.hasKey(serviceIdentifier)) { + bindings = bindingDictionary.get(serviceIdentifier); + } + else if (container.parent !== null) { + bindings = getBindings(container.parent, serviceIdentifier); + } + return bindings; +} +function plan(metadataReader, container, isMultiInject, targetType, serviceIdentifier, key, value, avoidConstraints) { + if (avoidConstraints === void 0) { avoidConstraints = false; } + var context = new context_1.Context(container); + var target = _createTarget(isMultiInject, targetType, serviceIdentifier, "", key, value); + try { + _createSubRequests(metadataReader, avoidConstraints, serviceIdentifier, context, null, target); + return context; + } + catch (error) { + if (exceptions_1$1.isStackOverflowExeption(error)) { + if (context.plan) { + serialization_1$2.circularDependencyToException(context.plan.rootRequest); + } + } + throw error; + } +} +planner.plan = plan; +function createMockRequest(container, serviceIdentifier, key, value) { + var target = new target_1.Target(literal_types_1$5.TargetTypeEnum.Variable, "", serviceIdentifier, new metadata_1$8.Metadata(key, value)); + var context = new context_1.Context(container); + var request = new request_1.Request(serviceIdentifier, context, null, [], target); + return request; +} +planner.createMockRequest = createMockRequest; + +var resolver = {}; + +var instantiation = {}; + +var __spreadArray$2 = (commonjsGlobal && commonjsGlobal.__spreadArray) || function (to, from) { + for (var i = 0, il = from.length, j = to.length; i < il; i++, j++) + to[j] = from[i]; + return to; +}; +Object.defineProperty(instantiation, "__esModule", { value: true }); +instantiation.resolveInstance = void 0; +var error_msgs_1 = error_msgs; +var literal_types_1$4 = literal_types; +var METADATA_KEY$9 = metadata_keys; +function _injectProperties(instance, childRequests, resolveRequest) { + var propertyInjectionsRequests = childRequests.filter(function (childRequest) { + return (childRequest.target !== null && + childRequest.target.type === literal_types_1$4.TargetTypeEnum.ClassProperty); + }); + var propertyInjections = propertyInjectionsRequests.map(resolveRequest); + propertyInjectionsRequests.forEach(function (r, index) { + var propertyName = ""; + propertyName = r.target.name.value(); + var injection = propertyInjections[index]; + instance[propertyName] = injection; + }); + return instance; +} +function _createInstance(Func, injections) { + return new (Func.bind.apply(Func, __spreadArray$2([void 0], injections)))(); +} +function _postConstruct(constr, result) { + if (Reflect.hasMetadata(METADATA_KEY$9.POST_CONSTRUCT, constr)) { + var data = Reflect.getMetadata(METADATA_KEY$9.POST_CONSTRUCT, constr); + try { + result[data.value](); + } + catch (e) { + throw new Error(error_msgs_1.POST_CONSTRUCT_ERROR(constr.name, e.message)); + } + } +} +function resolveInstance(constr, childRequests, resolveRequest) { + var result = null; + if (childRequests.length > 0) { + var constructorInjectionsRequests = childRequests.filter(function (childRequest) { + return (childRequest.target !== null && childRequest.target.type === literal_types_1$4.TargetTypeEnum.ConstructorArgument); + }); + var constructorInjections = constructorInjectionsRequests.map(resolveRequest); + result = _createInstance(constr, constructorInjections); + result = _injectProperties(result, childRequests, resolveRequest); + } + else { + result = new constr(); + } + _postConstruct(constr, result); + return result; +} +instantiation.resolveInstance = resolveInstance; + +Object.defineProperty(resolver, "__esModule", { value: true }); +resolver.resolve = void 0; +var ERROR_MSGS$3 = error_msgs; +var literal_types_1$3 = literal_types; +var exceptions_1 = exceptions; +var serialization_1$1 = serialization; +var instantiation_1 = instantiation; +var invokeFactory = function (factoryType, serviceIdentifier, fn) { + try { + return fn(); + } + catch (error) { + if (exceptions_1.isStackOverflowExeption(error)) { + throw new Error(ERROR_MSGS$3.CIRCULAR_DEPENDENCY_IN_FACTORY(factoryType, serviceIdentifier.toString())); + } + else { + throw error; + } + } +}; +var _resolveRequest = function (requestScope) { + return function (request) { + request.parentContext.setCurrentRequest(request); + var bindings = request.bindings; + var childRequests = request.childRequests; + var targetIsAnArray = request.target && request.target.isArray(); + var targetParentIsNotAnArray = !request.parentRequest || + !request.parentRequest.target || + !request.target || + !request.parentRequest.target.matchesArray(request.target.serviceIdentifier); + if (targetIsAnArray && targetParentIsNotAnArray) { + return childRequests.map(function (childRequest) { + var _f = _resolveRequest(requestScope); + return _f(childRequest); + }); + } + else { + var result = null; + if (request.target.isOptional() && bindings.length === 0) { + return undefined; + } + var binding_1 = bindings[0]; + var isSingleton = binding_1.scope === literal_types_1$3.BindingScopeEnum.Singleton; + var isRequestSingleton = binding_1.scope === literal_types_1$3.BindingScopeEnum.Request; + if (isSingleton && binding_1.activated) { + return binding_1.cache; + } + if (isRequestSingleton && + requestScope !== null && + requestScope.has(binding_1.id)) { + return requestScope.get(binding_1.id); + } + if (binding_1.type === literal_types_1$3.BindingTypeEnum.ConstantValue) { + result = binding_1.cache; + binding_1.activated = true; + } + else if (binding_1.type === literal_types_1$3.BindingTypeEnum.Function) { + result = binding_1.cache; + binding_1.activated = true; + } + else if (binding_1.type === literal_types_1$3.BindingTypeEnum.Constructor) { + result = binding_1.implementationType; + } + else if (binding_1.type === literal_types_1$3.BindingTypeEnum.DynamicValue && binding_1.dynamicValue !== null) { + result = invokeFactory("toDynamicValue", binding_1.serviceIdentifier, function () { return binding_1.dynamicValue(request.parentContext); }); + } + else if (binding_1.type === literal_types_1$3.BindingTypeEnum.Factory && binding_1.factory !== null) { + result = invokeFactory("toFactory", binding_1.serviceIdentifier, function () { return binding_1.factory(request.parentContext); }); + } + else if (binding_1.type === literal_types_1$3.BindingTypeEnum.Provider && binding_1.provider !== null) { + result = invokeFactory("toProvider", binding_1.serviceIdentifier, function () { return binding_1.provider(request.parentContext); }); + } + else if (binding_1.type === literal_types_1$3.BindingTypeEnum.Instance && binding_1.implementationType !== null) { + result = instantiation_1.resolveInstance(binding_1.implementationType, childRequests, _resolveRequest(requestScope)); + } + else { + var serviceIdentifier = serialization_1$1.getServiceIdentifierAsString(request.serviceIdentifier); + throw new Error(ERROR_MSGS$3.INVALID_BINDING_TYPE + " " + serviceIdentifier); + } + if (typeof binding_1.onActivation === "function") { + result = binding_1.onActivation(request.parentContext, result); + } + if (isSingleton) { + binding_1.cache = result; + binding_1.activated = true; + } + if (isRequestSingleton && + requestScope !== null && + !requestScope.has(binding_1.id)) { + requestScope.set(binding_1.id, result); + } + return result; + } + }; +}; +function resolve(context) { + var _f = _resolveRequest(context.plan.rootRequest.requestScope); + return _f(context.plan.rootRequest); +} +resolver.resolve = resolve; + +var binding_to_syntax = {}; + +var binding_in_when_on_syntax = {}; + +var binding_in_syntax = {}; + +var binding_when_on_syntax = {}; + +var binding_on_syntax = {}; + +var binding_when_syntax = {}; + +var constraint_helpers = {}; + +Object.defineProperty(constraint_helpers, "__esModule", { value: true }); +constraint_helpers.typeConstraint = constraint_helpers.namedConstraint = constraint_helpers.taggedConstraint = constraint_helpers.traverseAncerstors = void 0; +var METADATA_KEY$8 = metadata_keys; +var metadata_1$7 = metadata; +var traverseAncerstors = function (request, constraint) { + var parent = request.parentRequest; + if (parent !== null) { + return constraint(parent) ? true : traverseAncerstors(parent, constraint); + } + else { + return false; + } +}; +constraint_helpers.traverseAncerstors = traverseAncerstors; +var taggedConstraint = function (key) { return function (value) { + var constraint = function (request) { + return request !== null && request.target !== null && request.target.matchesTag(key)(value); + }; + constraint.metaData = new metadata_1$7.Metadata(key, value); + return constraint; +}; }; +constraint_helpers.taggedConstraint = taggedConstraint; +var namedConstraint = taggedConstraint(METADATA_KEY$8.NAMED_TAG); +constraint_helpers.namedConstraint = namedConstraint; +var typeConstraint = function (type) { return function (request) { + var binding = null; + if (request !== null) { + binding = request.bindings[0]; + if (typeof type === "string") { + var serviceIdentifier = binding.serviceIdentifier; + return serviceIdentifier === type; + } + else { + var constructor = request.bindings[0].implementationType; + return type === constructor; + } + } + return false; +}; }; +constraint_helpers.typeConstraint = typeConstraint; + +Object.defineProperty(binding_when_syntax, "__esModule", { value: true }); +binding_when_syntax.BindingWhenSyntax = void 0; +var binding_on_syntax_1$2 = binding_on_syntax; +var constraint_helpers_1 = constraint_helpers; +var BindingWhenSyntax = (function () { + function BindingWhenSyntax(binding) { + this._binding = binding; + } + BindingWhenSyntax.prototype.when = function (constraint) { + this._binding.constraint = constraint; + return new binding_on_syntax_1$2.BindingOnSyntax(this._binding); + }; + BindingWhenSyntax.prototype.whenTargetNamed = function (name) { + this._binding.constraint = constraint_helpers_1.namedConstraint(name); + return new binding_on_syntax_1$2.BindingOnSyntax(this._binding); + }; + BindingWhenSyntax.prototype.whenTargetIsDefault = function () { + this._binding.constraint = function (request) { + var targetIsDefault = (request.target !== null) && + (!request.target.isNamed()) && + (!request.target.isTagged()); + return targetIsDefault; + }; + return new binding_on_syntax_1$2.BindingOnSyntax(this._binding); + }; + BindingWhenSyntax.prototype.whenTargetTagged = function (tag, value) { + this._binding.constraint = constraint_helpers_1.taggedConstraint(tag)(value); + return new binding_on_syntax_1$2.BindingOnSyntax(this._binding); + }; + BindingWhenSyntax.prototype.whenInjectedInto = function (parent) { + this._binding.constraint = function (request) { + return constraint_helpers_1.typeConstraint(parent)(request.parentRequest); + }; + return new binding_on_syntax_1$2.BindingOnSyntax(this._binding); + }; + BindingWhenSyntax.prototype.whenParentNamed = function (name) { + this._binding.constraint = function (request) { + return constraint_helpers_1.namedConstraint(name)(request.parentRequest); + }; + return new binding_on_syntax_1$2.BindingOnSyntax(this._binding); + }; + BindingWhenSyntax.prototype.whenParentTagged = function (tag, value) { + this._binding.constraint = function (request) { + return constraint_helpers_1.taggedConstraint(tag)(value)(request.parentRequest); + }; + return new binding_on_syntax_1$2.BindingOnSyntax(this._binding); + }; + BindingWhenSyntax.prototype.whenAnyAncestorIs = function (ancestor) { + this._binding.constraint = function (request) { + return constraint_helpers_1.traverseAncerstors(request, constraint_helpers_1.typeConstraint(ancestor)); + }; + return new binding_on_syntax_1$2.BindingOnSyntax(this._binding); + }; + BindingWhenSyntax.prototype.whenNoAncestorIs = function (ancestor) { + this._binding.constraint = function (request) { + return !constraint_helpers_1.traverseAncerstors(request, constraint_helpers_1.typeConstraint(ancestor)); + }; + return new binding_on_syntax_1$2.BindingOnSyntax(this._binding); + }; + BindingWhenSyntax.prototype.whenAnyAncestorNamed = function (name) { + this._binding.constraint = function (request) { + return constraint_helpers_1.traverseAncerstors(request, constraint_helpers_1.namedConstraint(name)); + }; + return new binding_on_syntax_1$2.BindingOnSyntax(this._binding); + }; + BindingWhenSyntax.prototype.whenNoAncestorNamed = function (name) { + this._binding.constraint = function (request) { + return !constraint_helpers_1.traverseAncerstors(request, constraint_helpers_1.namedConstraint(name)); + }; + return new binding_on_syntax_1$2.BindingOnSyntax(this._binding); + }; + BindingWhenSyntax.prototype.whenAnyAncestorTagged = function (tag, value) { + this._binding.constraint = function (request) { + return constraint_helpers_1.traverseAncerstors(request, constraint_helpers_1.taggedConstraint(tag)(value)); + }; + return new binding_on_syntax_1$2.BindingOnSyntax(this._binding); + }; + BindingWhenSyntax.prototype.whenNoAncestorTagged = function (tag, value) { + this._binding.constraint = function (request) { + return !constraint_helpers_1.traverseAncerstors(request, constraint_helpers_1.taggedConstraint(tag)(value)); + }; + return new binding_on_syntax_1$2.BindingOnSyntax(this._binding); + }; + BindingWhenSyntax.prototype.whenAnyAncestorMatches = function (constraint) { + this._binding.constraint = function (request) { + return constraint_helpers_1.traverseAncerstors(request, constraint); + }; + return new binding_on_syntax_1$2.BindingOnSyntax(this._binding); + }; + BindingWhenSyntax.prototype.whenNoAncestorMatches = function (constraint) { + this._binding.constraint = function (request) { + return !constraint_helpers_1.traverseAncerstors(request, constraint); + }; + return new binding_on_syntax_1$2.BindingOnSyntax(this._binding); + }; + return BindingWhenSyntax; +}()); +binding_when_syntax.BindingWhenSyntax = BindingWhenSyntax; + +Object.defineProperty(binding_on_syntax, "__esModule", { value: true }); +binding_on_syntax.BindingOnSyntax = void 0; +var binding_when_syntax_1$2 = binding_when_syntax; +var BindingOnSyntax = (function () { + function BindingOnSyntax(binding) { + this._binding = binding; + } + BindingOnSyntax.prototype.onActivation = function (handler) { + this._binding.onActivation = handler; + return new binding_when_syntax_1$2.BindingWhenSyntax(this._binding); + }; + return BindingOnSyntax; +}()); +binding_on_syntax.BindingOnSyntax = BindingOnSyntax; + +Object.defineProperty(binding_when_on_syntax, "__esModule", { value: true }); +binding_when_on_syntax.BindingWhenOnSyntax = void 0; +var binding_on_syntax_1$1 = binding_on_syntax; +var binding_when_syntax_1$1 = binding_when_syntax; +var BindingWhenOnSyntax = (function () { + function BindingWhenOnSyntax(binding) { + this._binding = binding; + this._bindingWhenSyntax = new binding_when_syntax_1$1.BindingWhenSyntax(this._binding); + this._bindingOnSyntax = new binding_on_syntax_1$1.BindingOnSyntax(this._binding); + } + BindingWhenOnSyntax.prototype.when = function (constraint) { + return this._bindingWhenSyntax.when(constraint); + }; + BindingWhenOnSyntax.prototype.whenTargetNamed = function (name) { + return this._bindingWhenSyntax.whenTargetNamed(name); + }; + BindingWhenOnSyntax.prototype.whenTargetIsDefault = function () { + return this._bindingWhenSyntax.whenTargetIsDefault(); + }; + BindingWhenOnSyntax.prototype.whenTargetTagged = function (tag, value) { + return this._bindingWhenSyntax.whenTargetTagged(tag, value); + }; + BindingWhenOnSyntax.prototype.whenInjectedInto = function (parent) { + return this._bindingWhenSyntax.whenInjectedInto(parent); + }; + BindingWhenOnSyntax.prototype.whenParentNamed = function (name) { + return this._bindingWhenSyntax.whenParentNamed(name); + }; + BindingWhenOnSyntax.prototype.whenParentTagged = function (tag, value) { + return this._bindingWhenSyntax.whenParentTagged(tag, value); + }; + BindingWhenOnSyntax.prototype.whenAnyAncestorIs = function (ancestor) { + return this._bindingWhenSyntax.whenAnyAncestorIs(ancestor); + }; + BindingWhenOnSyntax.prototype.whenNoAncestorIs = function (ancestor) { + return this._bindingWhenSyntax.whenNoAncestorIs(ancestor); + }; + BindingWhenOnSyntax.prototype.whenAnyAncestorNamed = function (name) { + return this._bindingWhenSyntax.whenAnyAncestorNamed(name); + }; + BindingWhenOnSyntax.prototype.whenAnyAncestorTagged = function (tag, value) { + return this._bindingWhenSyntax.whenAnyAncestorTagged(tag, value); + }; + BindingWhenOnSyntax.prototype.whenNoAncestorNamed = function (name) { + return this._bindingWhenSyntax.whenNoAncestorNamed(name); + }; + BindingWhenOnSyntax.prototype.whenNoAncestorTagged = function (tag, value) { + return this._bindingWhenSyntax.whenNoAncestorTagged(tag, value); + }; + BindingWhenOnSyntax.prototype.whenAnyAncestorMatches = function (constraint) { + return this._bindingWhenSyntax.whenAnyAncestorMatches(constraint); + }; + BindingWhenOnSyntax.prototype.whenNoAncestorMatches = function (constraint) { + return this._bindingWhenSyntax.whenNoAncestorMatches(constraint); + }; + BindingWhenOnSyntax.prototype.onActivation = function (handler) { + return this._bindingOnSyntax.onActivation(handler); + }; + return BindingWhenOnSyntax; +}()); +binding_when_on_syntax.BindingWhenOnSyntax = BindingWhenOnSyntax; + +Object.defineProperty(binding_in_syntax, "__esModule", { value: true }); +binding_in_syntax.BindingInSyntax = void 0; +var literal_types_1$2 = literal_types; +var binding_when_on_syntax_1$1 = binding_when_on_syntax; +var BindingInSyntax = (function () { + function BindingInSyntax(binding) { + this._binding = binding; + } + BindingInSyntax.prototype.inRequestScope = function () { + this._binding.scope = literal_types_1$2.BindingScopeEnum.Request; + return new binding_when_on_syntax_1$1.BindingWhenOnSyntax(this._binding); + }; + BindingInSyntax.prototype.inSingletonScope = function () { + this._binding.scope = literal_types_1$2.BindingScopeEnum.Singleton; + return new binding_when_on_syntax_1$1.BindingWhenOnSyntax(this._binding); + }; + BindingInSyntax.prototype.inTransientScope = function () { + this._binding.scope = literal_types_1$2.BindingScopeEnum.Transient; + return new binding_when_on_syntax_1$1.BindingWhenOnSyntax(this._binding); + }; + return BindingInSyntax; +}()); +binding_in_syntax.BindingInSyntax = BindingInSyntax; + +Object.defineProperty(binding_in_when_on_syntax, "__esModule", { value: true }); +binding_in_when_on_syntax.BindingInWhenOnSyntax = void 0; +var binding_in_syntax_1 = binding_in_syntax; +var binding_on_syntax_1 = binding_on_syntax; +var binding_when_syntax_1 = binding_when_syntax; +var BindingInWhenOnSyntax = (function () { + function BindingInWhenOnSyntax(binding) { + this._binding = binding; + this._bindingWhenSyntax = new binding_when_syntax_1.BindingWhenSyntax(this._binding); + this._bindingOnSyntax = new binding_on_syntax_1.BindingOnSyntax(this._binding); + this._bindingInSyntax = new binding_in_syntax_1.BindingInSyntax(binding); + } + BindingInWhenOnSyntax.prototype.inRequestScope = function () { + return this._bindingInSyntax.inRequestScope(); + }; + BindingInWhenOnSyntax.prototype.inSingletonScope = function () { + return this._bindingInSyntax.inSingletonScope(); + }; + BindingInWhenOnSyntax.prototype.inTransientScope = function () { + return this._bindingInSyntax.inTransientScope(); + }; + BindingInWhenOnSyntax.prototype.when = function (constraint) { + return this._bindingWhenSyntax.when(constraint); + }; + BindingInWhenOnSyntax.prototype.whenTargetNamed = function (name) { + return this._bindingWhenSyntax.whenTargetNamed(name); + }; + BindingInWhenOnSyntax.prototype.whenTargetIsDefault = function () { + return this._bindingWhenSyntax.whenTargetIsDefault(); + }; + BindingInWhenOnSyntax.prototype.whenTargetTagged = function (tag, value) { + return this._bindingWhenSyntax.whenTargetTagged(tag, value); + }; + BindingInWhenOnSyntax.prototype.whenInjectedInto = function (parent) { + return this._bindingWhenSyntax.whenInjectedInto(parent); + }; + BindingInWhenOnSyntax.prototype.whenParentNamed = function (name) { + return this._bindingWhenSyntax.whenParentNamed(name); + }; + BindingInWhenOnSyntax.prototype.whenParentTagged = function (tag, value) { + return this._bindingWhenSyntax.whenParentTagged(tag, value); + }; + BindingInWhenOnSyntax.prototype.whenAnyAncestorIs = function (ancestor) { + return this._bindingWhenSyntax.whenAnyAncestorIs(ancestor); + }; + BindingInWhenOnSyntax.prototype.whenNoAncestorIs = function (ancestor) { + return this._bindingWhenSyntax.whenNoAncestorIs(ancestor); + }; + BindingInWhenOnSyntax.prototype.whenAnyAncestorNamed = function (name) { + return this._bindingWhenSyntax.whenAnyAncestorNamed(name); + }; + BindingInWhenOnSyntax.prototype.whenAnyAncestorTagged = function (tag, value) { + return this._bindingWhenSyntax.whenAnyAncestorTagged(tag, value); + }; + BindingInWhenOnSyntax.prototype.whenNoAncestorNamed = function (name) { + return this._bindingWhenSyntax.whenNoAncestorNamed(name); + }; + BindingInWhenOnSyntax.prototype.whenNoAncestorTagged = function (tag, value) { + return this._bindingWhenSyntax.whenNoAncestorTagged(tag, value); + }; + BindingInWhenOnSyntax.prototype.whenAnyAncestorMatches = function (constraint) { + return this._bindingWhenSyntax.whenAnyAncestorMatches(constraint); + }; + BindingInWhenOnSyntax.prototype.whenNoAncestorMatches = function (constraint) { + return this._bindingWhenSyntax.whenNoAncestorMatches(constraint); + }; + BindingInWhenOnSyntax.prototype.onActivation = function (handler) { + return this._bindingOnSyntax.onActivation(handler); + }; + return BindingInWhenOnSyntax; +}()); +binding_in_when_on_syntax.BindingInWhenOnSyntax = BindingInWhenOnSyntax; + +Object.defineProperty(binding_to_syntax, "__esModule", { value: true }); +binding_to_syntax.BindingToSyntax = void 0; +var ERROR_MSGS$2 = error_msgs; +var literal_types_1$1 = literal_types; +var binding_in_when_on_syntax_1 = binding_in_when_on_syntax; +var binding_when_on_syntax_1 = binding_when_on_syntax; +var BindingToSyntax = (function () { + function BindingToSyntax(binding) { + this._binding = binding; + } + BindingToSyntax.prototype.to = function (constructor) { + this._binding.type = literal_types_1$1.BindingTypeEnum.Instance; + this._binding.implementationType = constructor; + return new binding_in_when_on_syntax_1.BindingInWhenOnSyntax(this._binding); + }; + BindingToSyntax.prototype.toSelf = function () { + if (typeof this._binding.serviceIdentifier !== "function") { + throw new Error("" + ERROR_MSGS$2.INVALID_TO_SELF_VALUE); + } + var self = this._binding.serviceIdentifier; + return this.to(self); + }; + BindingToSyntax.prototype.toConstantValue = function (value) { + this._binding.type = literal_types_1$1.BindingTypeEnum.ConstantValue; + this._binding.cache = value; + this._binding.dynamicValue = null; + this._binding.implementationType = null; + this._binding.scope = literal_types_1$1.BindingScopeEnum.Singleton; + return new binding_when_on_syntax_1.BindingWhenOnSyntax(this._binding); + }; + BindingToSyntax.prototype.toDynamicValue = function (func) { + this._binding.type = literal_types_1$1.BindingTypeEnum.DynamicValue; + this._binding.cache = null; + this._binding.dynamicValue = func; + this._binding.implementationType = null; + return new binding_in_when_on_syntax_1.BindingInWhenOnSyntax(this._binding); + }; + BindingToSyntax.prototype.toConstructor = function (constructor) { + this._binding.type = literal_types_1$1.BindingTypeEnum.Constructor; + this._binding.implementationType = constructor; + this._binding.scope = literal_types_1$1.BindingScopeEnum.Singleton; + return new binding_when_on_syntax_1.BindingWhenOnSyntax(this._binding); + }; + BindingToSyntax.prototype.toFactory = function (factory) { + this._binding.type = literal_types_1$1.BindingTypeEnum.Factory; + this._binding.factory = factory; + this._binding.scope = literal_types_1$1.BindingScopeEnum.Singleton; + return new binding_when_on_syntax_1.BindingWhenOnSyntax(this._binding); + }; + BindingToSyntax.prototype.toFunction = function (func) { + if (typeof func !== "function") { + throw new Error(ERROR_MSGS$2.INVALID_FUNCTION_BINDING); + } + var bindingWhenOnSyntax = this.toConstantValue(func); + this._binding.type = literal_types_1$1.BindingTypeEnum.Function; + this._binding.scope = literal_types_1$1.BindingScopeEnum.Singleton; + return bindingWhenOnSyntax; + }; + BindingToSyntax.prototype.toAutoFactory = function (serviceIdentifier) { + this._binding.type = literal_types_1$1.BindingTypeEnum.Factory; + this._binding.factory = function (context) { + var autofactory = function () { return context.container.get(serviceIdentifier); }; + return autofactory; + }; + this._binding.scope = literal_types_1$1.BindingScopeEnum.Singleton; + return new binding_when_on_syntax_1.BindingWhenOnSyntax(this._binding); + }; + BindingToSyntax.prototype.toProvider = function (provider) { + this._binding.type = literal_types_1$1.BindingTypeEnum.Provider; + this._binding.provider = provider; + this._binding.scope = literal_types_1$1.BindingScopeEnum.Singleton; + return new binding_when_on_syntax_1.BindingWhenOnSyntax(this._binding); + }; + BindingToSyntax.prototype.toService = function (service) { + this.toDynamicValue(function (context) { return context.container.get(service); }); + }; + return BindingToSyntax; +}()); +binding_to_syntax.BindingToSyntax = BindingToSyntax; + +var container_snapshot = {}; + +Object.defineProperty(container_snapshot, "__esModule", { value: true }); +container_snapshot.ContainerSnapshot = void 0; +var ContainerSnapshot = (function () { + function ContainerSnapshot() { + } + ContainerSnapshot.of = function (bindings, middleware) { + var snapshot = new ContainerSnapshot(); + snapshot.bindings = bindings; + snapshot.middleware = middleware; + return snapshot; + }; + return ContainerSnapshot; +}()); +container_snapshot.ContainerSnapshot = ContainerSnapshot; + +var lookup$1 = {}; + +Object.defineProperty(lookup$1, "__esModule", { value: true }); +lookup$1.Lookup = void 0; +var ERROR_MSGS$1 = error_msgs; +var Lookup = (function () { + function Lookup() { + this._map = new Map(); + } + Lookup.prototype.getMap = function () { + return this._map; + }; + Lookup.prototype.add = function (serviceIdentifier, value) { + if (serviceIdentifier === null || serviceIdentifier === undefined) { + throw new Error(ERROR_MSGS$1.NULL_ARGUMENT); + } + if (value === null || value === undefined) { + throw new Error(ERROR_MSGS$1.NULL_ARGUMENT); + } + var entry = this._map.get(serviceIdentifier); + if (entry !== undefined) { + entry.push(value); + this._map.set(serviceIdentifier, entry); + } + else { + this._map.set(serviceIdentifier, [value]); + } + }; + Lookup.prototype.get = function (serviceIdentifier) { + if (serviceIdentifier === null || serviceIdentifier === undefined) { + throw new Error(ERROR_MSGS$1.NULL_ARGUMENT); + } + var entry = this._map.get(serviceIdentifier); + if (entry !== undefined) { + return entry; + } + else { + throw new Error(ERROR_MSGS$1.KEY_NOT_FOUND); + } + }; + Lookup.prototype.remove = function (serviceIdentifier) { + if (serviceIdentifier === null || serviceIdentifier === undefined) { + throw new Error(ERROR_MSGS$1.NULL_ARGUMENT); + } + if (!this._map.delete(serviceIdentifier)) { + throw new Error(ERROR_MSGS$1.KEY_NOT_FOUND); + } + }; + Lookup.prototype.removeByCondition = function (condition) { + var _this = this; + this._map.forEach(function (entries, key) { + var updatedEntries = entries.filter(function (entry) { return !condition(entry); }); + if (updatedEntries.length > 0) { + _this._map.set(key, updatedEntries); + } + else { + _this._map.delete(key); + } + }); + }; + Lookup.prototype.hasKey = function (serviceIdentifier) { + if (serviceIdentifier === null || serviceIdentifier === undefined) { + throw new Error(ERROR_MSGS$1.NULL_ARGUMENT); + } + return this._map.has(serviceIdentifier); + }; + Lookup.prototype.clone = function () { + var copy = new Lookup(); + this._map.forEach(function (value, key) { + value.forEach(function (b) { return copy.add(key, b.clone()); }); + }); + return copy; + }; + Lookup.prototype.traverse = function (func) { + this._map.forEach(function (value, key) { + func(key, value); + }); + }; + return Lookup; +}()); +lookup$1.Lookup = Lookup; + +var __awaiter$3 = (commonjsGlobal && commonjsGlobal.__awaiter) || function (thisArg, _arguments, P, generator) { + function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); } + return new (P || (P = Promise))(function (resolve, reject) { + function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } } + function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } } + function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); } + step((generator = generator.apply(thisArg, _arguments || [])).next()); + }); +}; +var __generator$1 = (commonjsGlobal && commonjsGlobal.__generator) || function (thisArg, body) { + var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g; + return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g; + function verb(n) { return function (v) { return step([n, v]); }; } + function step(op) { + if (f) throw new TypeError("Generator is already executing."); + while (_) try { + if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t; + if (y = 0, t) op = [op[0] & 2, t.value]; + switch (op[0]) { + case 0: case 1: t = op; break; + case 4: _.label++; return { value: op[1], done: false }; + case 5: _.label++; y = op[1]; op = [0]; continue; + case 7: op = _.ops.pop(); _.trys.pop(); continue; + default: + if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; } + if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; } + if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; } + if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; } + if (t[2]) _.ops.pop(); + _.trys.pop(); continue; + } + op = body.call(thisArg, _); + } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; } + if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true }; + } +}; +var __spreadArray$1 = (commonjsGlobal && commonjsGlobal.__spreadArray) || function (to, from) { + for (var i = 0, il = from.length, j = to.length; i < il; i++, j++) + to[j] = from[i]; + return to; +}; +Object.defineProperty(container$1, "__esModule", { value: true }); +container$1.Container = void 0; +var binding_1 = binding; +var ERROR_MSGS = error_msgs; +var literal_types_1 = literal_types; +var METADATA_KEY$7 = metadata_keys; +var metadata_reader_1 = metadata_reader; +var planner_1 = planner; +var resolver_1 = resolver; +var binding_to_syntax_1 = binding_to_syntax; +var id_1$1 = id$1; +var serialization_1 = serialization; +var container_snapshot_1 = container_snapshot; +var lookup_1 = lookup$1; +var Container = (function () { + function Container(containerOptions) { + this._appliedMiddleware = []; + var options = containerOptions || {}; + if (typeof options !== "object") { + throw new Error("" + ERROR_MSGS.CONTAINER_OPTIONS_MUST_BE_AN_OBJECT); + } + if (options.defaultScope === undefined) { + options.defaultScope = literal_types_1.BindingScopeEnum.Transient; + } + else if (options.defaultScope !== literal_types_1.BindingScopeEnum.Singleton && + options.defaultScope !== literal_types_1.BindingScopeEnum.Transient && + options.defaultScope !== literal_types_1.BindingScopeEnum.Request) { + throw new Error("" + ERROR_MSGS.CONTAINER_OPTIONS_INVALID_DEFAULT_SCOPE); + } + if (options.autoBindInjectable === undefined) { + options.autoBindInjectable = false; + } + else if (typeof options.autoBindInjectable !== "boolean") { + throw new Error("" + ERROR_MSGS.CONTAINER_OPTIONS_INVALID_AUTO_BIND_INJECTABLE); + } + if (options.skipBaseClassChecks === undefined) { + options.skipBaseClassChecks = false; + } + else if (typeof options.skipBaseClassChecks !== "boolean") { + throw new Error("" + ERROR_MSGS.CONTAINER_OPTIONS_INVALID_SKIP_BASE_CHECK); + } + this.options = { + autoBindInjectable: options.autoBindInjectable, + defaultScope: options.defaultScope, + skipBaseClassChecks: options.skipBaseClassChecks + }; + this.id = id_1$1.id(); + this._bindingDictionary = new lookup_1.Lookup(); + this._snapshots = []; + this._middleware = null; + this.parent = null; + this._metadataReader = new metadata_reader_1.MetadataReader(); + } + Container.merge = function (container1, container2) { + var container3 = []; + for (var _i = 2; _i < arguments.length; _i++) { + container3[_i - 2] = arguments[_i]; + } + var container = new Container(); + var targetContainers = __spreadArray$1([container1, container2], container3).map(function (targetContainer) { return planner_1.getBindingDictionary(targetContainer); }); + var bindingDictionary = planner_1.getBindingDictionary(container); + function copyDictionary(origin, destination) { + origin.traverse(function (key, value) { + value.forEach(function (binding) { + destination.add(binding.serviceIdentifier, binding.clone()); + }); + }); + } + targetContainers.forEach(function (targetBindingDictionary) { + copyDictionary(targetBindingDictionary, bindingDictionary); + }); + return container; + }; + Container.prototype.load = function () { + var modules = []; + for (var _i = 0; _i < arguments.length; _i++) { + modules[_i] = arguments[_i]; + } + var getHelpers = this._getContainerModuleHelpersFactory(); + for (var _a = 0, modules_1 = modules; _a < modules_1.length; _a++) { + var currentModule = modules_1[_a]; + var containerModuleHelpers = getHelpers(currentModule.id); + currentModule.registry(containerModuleHelpers.bindFunction, containerModuleHelpers.unbindFunction, containerModuleHelpers.isboundFunction, containerModuleHelpers.rebindFunction); + } + }; + Container.prototype.loadAsync = function () { + var modules = []; + for (var _i = 0; _i < arguments.length; _i++) { + modules[_i] = arguments[_i]; + } + return __awaiter$3(this, void 0, void 0, function () { + var getHelpers, _a, modules_2, currentModule, containerModuleHelpers; + return __generator$1(this, function (_b) { + switch (_b.label) { + case 0: + getHelpers = this._getContainerModuleHelpersFactory(); + _a = 0, modules_2 = modules; + _b.label = 1; + case 1: + if (!(_a < modules_2.length)) return [3, 4]; + currentModule = modules_2[_a]; + containerModuleHelpers = getHelpers(currentModule.id); + return [4, currentModule.registry(containerModuleHelpers.bindFunction, containerModuleHelpers.unbindFunction, containerModuleHelpers.isboundFunction, containerModuleHelpers.rebindFunction)]; + case 2: + _b.sent(); + _b.label = 3; + case 3: + _a++; + return [3, 1]; + case 4: return [2]; + } + }); + }); + }; + Container.prototype.unload = function () { + var _this = this; + var modules = []; + for (var _i = 0; _i < arguments.length; _i++) { + modules[_i] = arguments[_i]; + } + var conditionFactory = function (expected) { return function (item) { + return item.moduleId === expected; + }; }; + modules.forEach(function (module) { + var condition = conditionFactory(module.id); + _this._bindingDictionary.removeByCondition(condition); + }); + }; + Container.prototype.bind = function (serviceIdentifier) { + var scope = this.options.defaultScope || literal_types_1.BindingScopeEnum.Transient; + var binding = new binding_1.Binding(serviceIdentifier, scope); + this._bindingDictionary.add(serviceIdentifier, binding); + return new binding_to_syntax_1.BindingToSyntax(binding); + }; + Container.prototype.rebind = function (serviceIdentifier) { + this.unbind(serviceIdentifier); + return this.bind(serviceIdentifier); + }; + Container.prototype.unbind = function (serviceIdentifier) { + try { + this._bindingDictionary.remove(serviceIdentifier); + } + catch (e) { + throw new Error(ERROR_MSGS.CANNOT_UNBIND + " " + serialization_1.getServiceIdentifierAsString(serviceIdentifier)); + } + }; + Container.prototype.unbindAll = function () { + this._bindingDictionary = new lookup_1.Lookup(); + }; + Container.prototype.isBound = function (serviceIdentifier) { + var bound = this._bindingDictionary.hasKey(serviceIdentifier); + if (!bound && this.parent) { + bound = this.parent.isBound(serviceIdentifier); + } + return bound; + }; + Container.prototype.isBoundNamed = function (serviceIdentifier, named) { + return this.isBoundTagged(serviceIdentifier, METADATA_KEY$7.NAMED_TAG, named); + }; + Container.prototype.isBoundTagged = function (serviceIdentifier, key, value) { + var bound = false; + if (this._bindingDictionary.hasKey(serviceIdentifier)) { + var bindings = this._bindingDictionary.get(serviceIdentifier); + var request_1 = planner_1.createMockRequest(this, serviceIdentifier, key, value); + bound = bindings.some(function (b) { return b.constraint(request_1); }); + } + if (!bound && this.parent) { + bound = this.parent.isBoundTagged(serviceIdentifier, key, value); + } + return bound; + }; + Container.prototype.snapshot = function () { + this._snapshots.push(container_snapshot_1.ContainerSnapshot.of(this._bindingDictionary.clone(), this._middleware)); + }; + Container.prototype.restore = function () { + var snapshot = this._snapshots.pop(); + if (snapshot === undefined) { + throw new Error(ERROR_MSGS.NO_MORE_SNAPSHOTS_AVAILABLE); + } + this._bindingDictionary = snapshot.bindings; + this._middleware = snapshot.middleware; + }; + Container.prototype.createChild = function (containerOptions) { + var child = new Container(containerOptions || this.options); + child.parent = this; + return child; + }; + Container.prototype.applyMiddleware = function () { + var middlewares = []; + for (var _i = 0; _i < arguments.length; _i++) { + middlewares[_i] = arguments[_i]; + } + this._appliedMiddleware = this._appliedMiddleware.concat(middlewares); + var initial = (this._middleware) ? this._middleware : this._planAndResolve(); + this._middleware = middlewares.reduce(function (prev, curr) { return curr(prev); }, initial); + }; + Container.prototype.applyCustomMetadataReader = function (metadataReader) { + this._metadataReader = metadataReader; + }; + Container.prototype.get = function (serviceIdentifier) { + return this._get(false, false, literal_types_1.TargetTypeEnum.Variable, serviceIdentifier); + }; + Container.prototype.getTagged = function (serviceIdentifier, key, value) { + return this._get(false, false, literal_types_1.TargetTypeEnum.Variable, serviceIdentifier, key, value); + }; + Container.prototype.getNamed = function (serviceIdentifier, named) { + return this.getTagged(serviceIdentifier, METADATA_KEY$7.NAMED_TAG, named); + }; + Container.prototype.getAll = function (serviceIdentifier) { + return this._get(true, true, literal_types_1.TargetTypeEnum.Variable, serviceIdentifier); + }; + Container.prototype.getAllTagged = function (serviceIdentifier, key, value) { + return this._get(false, true, literal_types_1.TargetTypeEnum.Variable, serviceIdentifier, key, value); + }; + Container.prototype.getAllNamed = function (serviceIdentifier, named) { + return this.getAllTagged(serviceIdentifier, METADATA_KEY$7.NAMED_TAG, named); + }; + Container.prototype.resolve = function (constructorFunction) { + var tempContainer = this.createChild(); + tempContainer.bind(constructorFunction).toSelf(); + this._appliedMiddleware.forEach(function (m) { + tempContainer.applyMiddleware(m); + }); + return tempContainer.get(constructorFunction); + }; + Container.prototype._getContainerModuleHelpersFactory = function () { + var _this = this; + var setModuleId = function (bindingToSyntax, moduleId) { + bindingToSyntax._binding.moduleId = moduleId; + }; + var getBindFunction = function (moduleId) { + return function (serviceIdentifier) { + var _bind = _this.bind.bind(_this); + var bindingToSyntax = _bind(serviceIdentifier); + setModuleId(bindingToSyntax, moduleId); + return bindingToSyntax; + }; + }; + var getUnbindFunction = function (moduleId) { + return function (serviceIdentifier) { + var _unbind = _this.unbind.bind(_this); + _unbind(serviceIdentifier); + }; + }; + var getIsboundFunction = function (moduleId) { + return function (serviceIdentifier) { + var _isBound = _this.isBound.bind(_this); + return _isBound(serviceIdentifier); + }; + }; + var getRebindFunction = function (moduleId) { + return function (serviceIdentifier) { + var _rebind = _this.rebind.bind(_this); + var bindingToSyntax = _rebind(serviceIdentifier); + setModuleId(bindingToSyntax, moduleId); + return bindingToSyntax; + }; + }; + return function (mId) { return ({ + bindFunction: getBindFunction(mId), + isboundFunction: getIsboundFunction(mId), + rebindFunction: getRebindFunction(mId), + unbindFunction: getUnbindFunction(mId) + }); }; + }; + Container.prototype._get = function (avoidConstraints, isMultiInject, targetType, serviceIdentifier, key, value) { + var result = null; + var defaultArgs = { + avoidConstraints: avoidConstraints, + contextInterceptor: function (context) { return context; }, + isMultiInject: isMultiInject, + key: key, + serviceIdentifier: serviceIdentifier, + targetType: targetType, + value: value + }; + if (this._middleware) { + result = this._middleware(defaultArgs); + if (result === undefined || result === null) { + throw new Error(ERROR_MSGS.INVALID_MIDDLEWARE_RETURN); + } + } + else { + result = this._planAndResolve()(defaultArgs); + } + return result; + }; + Container.prototype._planAndResolve = function () { + var _this = this; + return function (args) { + var context = planner_1.plan(_this._metadataReader, _this, args.isMultiInject, args.targetType, args.serviceIdentifier, args.key, args.value, args.avoidConstraints); + context = args.contextInterceptor(context); + var result = resolver_1.resolve(context); + return result; + }; + }; + return Container; +}()); +container$1.Container = Container; + +var container_module = {}; + +Object.defineProperty(container_module, "__esModule", { value: true }); +container_module.AsyncContainerModule = container_module.ContainerModule = void 0; +var id_1 = id$1; +var ContainerModule = (function () { + function ContainerModule(registry) { + this.id = id_1.id(); + this.registry = registry; + } + return ContainerModule; +}()); +container_module.ContainerModule = ContainerModule; +var AsyncContainerModule = (function () { + function AsyncContainerModule(registry) { + this.id = id_1.id(); + this.registry = registry; + } + return AsyncContainerModule; +}()); +container_module.AsyncContainerModule = AsyncContainerModule; + +var injectable$1 = {}; + +Object.defineProperty(injectable$1, "__esModule", { value: true }); +injectable$1.injectable = void 0; +var ERRORS_MSGS$1 = error_msgs; +var METADATA_KEY$6 = metadata_keys; +function injectable() { + return function (target) { + if (Reflect.hasOwnMetadata(METADATA_KEY$6.PARAM_TYPES, target)) { + throw new Error(ERRORS_MSGS$1.DUPLICATED_INJECTABLE_DECORATOR); + } + var types = Reflect.getMetadata(METADATA_KEY$6.DESIGN_PARAM_TYPES, target) || []; + Reflect.defineMetadata(METADATA_KEY$6.PARAM_TYPES, types, target); + return target; + }; +} +injectable$1.injectable = injectable; + +var tagged$1 = {}; + +Object.defineProperty(tagged$1, "__esModule", { value: true }); +tagged$1.tagged = void 0; +var metadata_1$6 = metadata; +var decorator_utils_1$5 = decorator_utils; +function tagged(metadataKey, metadataValue) { + return function (target, targetKey, index) { + var metadata = new metadata_1$6.Metadata(metadataKey, metadataValue); + if (typeof index === "number") { + decorator_utils_1$5.tagParameter(target, targetKey, index, metadata); + } + else { + decorator_utils_1$5.tagProperty(target, targetKey, metadata); + } + }; +} +tagged$1.tagged = tagged; + +var named$1 = {}; + +Object.defineProperty(named$1, "__esModule", { value: true }); +named$1.named = void 0; +var METADATA_KEY$5 = metadata_keys; +var metadata_1$5 = metadata; +var decorator_utils_1$4 = decorator_utils; +function named(name) { + return function (target, targetKey, index) { + var metadata = new metadata_1$5.Metadata(METADATA_KEY$5.NAMED_TAG, name); + if (typeof index === "number") { + decorator_utils_1$4.tagParameter(target, targetKey, index, metadata); + } + else { + decorator_utils_1$4.tagProperty(target, targetKey, metadata); + } + }; +} +named$1.named = named; + +var optional$1 = {}; + +Object.defineProperty(optional$1, "__esModule", { value: true }); +optional$1.optional = void 0; +var METADATA_KEY$4 = metadata_keys; +var metadata_1$4 = metadata; +var decorator_utils_1$3 = decorator_utils; +function optional() { + return function (target, targetKey, index) { + var metadata = new metadata_1$4.Metadata(METADATA_KEY$4.OPTIONAL_TAG, true); + if (typeof index === "number") { + decorator_utils_1$3.tagParameter(target, targetKey, index, metadata); + } + else { + decorator_utils_1$3.tagProperty(target, targetKey, metadata); + } + }; +} +optional$1.optional = optional; + +var unmanaged$1 = {}; + +Object.defineProperty(unmanaged$1, "__esModule", { value: true }); +unmanaged$1.unmanaged = void 0; +var METADATA_KEY$3 = metadata_keys; +var metadata_1$3 = metadata; +var decorator_utils_1$2 = decorator_utils; +function unmanaged() { + return function (target, targetKey, index) { + var metadata = new metadata_1$3.Metadata(METADATA_KEY$3.UNMANAGED_TAG, true); + decorator_utils_1$2.tagParameter(target, targetKey, index, metadata); + }; +} +unmanaged$1.unmanaged = unmanaged; + +var multi_inject = {}; + +Object.defineProperty(multi_inject, "__esModule", { value: true }); +multi_inject.multiInject = void 0; +var METADATA_KEY$2 = metadata_keys; +var metadata_1$2 = metadata; +var decorator_utils_1$1 = decorator_utils; +function multiInject(serviceIdentifier) { + return function (target, targetKey, index) { + var metadata = new metadata_1$2.Metadata(METADATA_KEY$2.MULTI_INJECT_TAG, serviceIdentifier); + if (typeof index === "number") { + decorator_utils_1$1.tagParameter(target, targetKey, index, metadata); + } + else { + decorator_utils_1$1.tagProperty(target, targetKey, metadata); + } + }; +} +multi_inject.multiInject = multiInject; + +var target_name = {}; + +Object.defineProperty(target_name, "__esModule", { value: true }); +target_name.targetName = void 0; +var METADATA_KEY$1 = metadata_keys; +var metadata_1$1 = metadata; +var decorator_utils_1 = decorator_utils; +function targetName(name) { + return function (target, targetKey, index) { + var metadata = new metadata_1$1.Metadata(METADATA_KEY$1.NAME_TAG, name); + decorator_utils_1.tagParameter(target, targetKey, index, metadata); + }; +} +target_name.targetName = targetName; + +var post_construct = {}; + +Object.defineProperty(post_construct, "__esModule", { value: true }); +post_construct.postConstruct = void 0; +var ERRORS_MSGS = error_msgs; +var METADATA_KEY = metadata_keys; +var metadata_1 = metadata; +function postConstruct() { + return function (target, propertyKey, descriptor) { + var metadata = new metadata_1.Metadata(METADATA_KEY.POST_CONSTRUCT, propertyKey); + if (Reflect.hasOwnMetadata(METADATA_KEY.POST_CONSTRUCT, target.constructor)) { + throw new Error(ERRORS_MSGS.MULTIPLE_POST_CONSTRUCT_METHODS); + } + Reflect.defineMetadata(METADATA_KEY.POST_CONSTRUCT, metadata, target.constructor); + }; +} +post_construct.postConstruct = postConstruct; + +var binding_utils = {}; + +Object.defineProperty(binding_utils, "__esModule", { value: true }); +binding_utils.multiBindToService = void 0; +var multiBindToService = function (container) { + return function (service) { + return function () { + var types = []; + for (var _i = 0; _i < arguments.length; _i++) { + types[_i] = arguments[_i]; + } + return types.forEach(function (t) { return container.bind(t).toService(service); }); + }; + }; +}; +binding_utils.multiBindToService = multiBindToService; + +(function (exports) { +Object.defineProperty(exports, "__esModule", { value: true }); +exports.multiBindToService = exports.getServiceIdentifierAsString = exports.typeConstraint = exports.namedConstraint = exports.taggedConstraint = exports.traverseAncerstors = exports.decorate = exports.id = exports.MetadataReader = exports.postConstruct = exports.targetName = exports.multiInject = exports.unmanaged = exports.optional = exports.LazyServiceIdentifer = exports.inject = exports.named = exports.tagged = exports.injectable = exports.ContainerModule = exports.AsyncContainerModule = exports.TargetTypeEnum = exports.BindingTypeEnum = exports.BindingScopeEnum = exports.Container = exports.METADATA_KEY = void 0; +var keys = metadata_keys; +exports.METADATA_KEY = keys; +var container_1 = container$1; +Object.defineProperty(exports, "Container", { enumerable: true, get: function () { return container_1.Container; } }); +var literal_types_1 = literal_types; +Object.defineProperty(exports, "BindingScopeEnum", { enumerable: true, get: function () { return literal_types_1.BindingScopeEnum; } }); +Object.defineProperty(exports, "BindingTypeEnum", { enumerable: true, get: function () { return literal_types_1.BindingTypeEnum; } }); +Object.defineProperty(exports, "TargetTypeEnum", { enumerable: true, get: function () { return literal_types_1.TargetTypeEnum; } }); +var container_module_1 = container_module; +Object.defineProperty(exports, "AsyncContainerModule", { enumerable: true, get: function () { return container_module_1.AsyncContainerModule; } }); +Object.defineProperty(exports, "ContainerModule", { enumerable: true, get: function () { return container_module_1.ContainerModule; } }); +var injectable_1 = injectable$1; +Object.defineProperty(exports, "injectable", { enumerable: true, get: function () { return injectable_1.injectable; } }); +var tagged_1 = tagged$1; +Object.defineProperty(exports, "tagged", { enumerable: true, get: function () { return tagged_1.tagged; } }); +var named_1 = named$1; +Object.defineProperty(exports, "named", { enumerable: true, get: function () { return named_1.named; } }); +var inject_1 = inject$1; +Object.defineProperty(exports, "inject", { enumerable: true, get: function () { return inject_1.inject; } }); +Object.defineProperty(exports, "LazyServiceIdentifer", { enumerable: true, get: function () { return inject_1.LazyServiceIdentifer; } }); +var optional_1 = optional$1; +Object.defineProperty(exports, "optional", { enumerable: true, get: function () { return optional_1.optional; } }); +var unmanaged_1 = unmanaged$1; +Object.defineProperty(exports, "unmanaged", { enumerable: true, get: function () { return unmanaged_1.unmanaged; } }); +var multi_inject_1 = multi_inject; +Object.defineProperty(exports, "multiInject", { enumerable: true, get: function () { return multi_inject_1.multiInject; } }); +var target_name_1 = target_name; +Object.defineProperty(exports, "targetName", { enumerable: true, get: function () { return target_name_1.targetName; } }); +var post_construct_1 = post_construct; +Object.defineProperty(exports, "postConstruct", { enumerable: true, get: function () { return post_construct_1.postConstruct; } }); +var metadata_reader_1 = metadata_reader; +Object.defineProperty(exports, "MetadataReader", { enumerable: true, get: function () { return metadata_reader_1.MetadataReader; } }); +var id_1 = id$1; +Object.defineProperty(exports, "id", { enumerable: true, get: function () { return id_1.id; } }); +var decorator_utils_1 = decorator_utils; +Object.defineProperty(exports, "decorate", { enumerable: true, get: function () { return decorator_utils_1.decorate; } }); +var constraint_helpers_1 = constraint_helpers; +Object.defineProperty(exports, "traverseAncerstors", { enumerable: true, get: function () { return constraint_helpers_1.traverseAncerstors; } }); +Object.defineProperty(exports, "taggedConstraint", { enumerable: true, get: function () { return constraint_helpers_1.taggedConstraint; } }); +Object.defineProperty(exports, "namedConstraint", { enumerable: true, get: function () { return constraint_helpers_1.namedConstraint; } }); +Object.defineProperty(exports, "typeConstraint", { enumerable: true, get: function () { return constraint_helpers_1.typeConstraint; } }); +var serialization_1 = serialization; +Object.defineProperty(exports, "getServiceIdentifierAsString", { enumerable: true, get: function () { return serialization_1.getServiceIdentifierAsString; } }); +var binding_utils_1 = binding_utils; +Object.defineProperty(exports, "multiBindToService", { enumerable: true, get: function () { return binding_utils_1.multiBindToService; } }); + +}(inversify)); + +var IDENTIFIER = { + // SceneGraph + HierarchyComponentManager: Symbol('HierarchyComponentManager'), + TransformComponentManager: Symbol('TransformComponentManager'), + NameComponentManager: Symbol('NameComponentManager'), + SceneGraphSystem: Symbol('SceneGraphSystem'), + // FrameGraph + FrameGraphSystem: Symbol('FrameGraphSystem'), + ResourcePool: Symbol('ResourcePool'), + ResourceHandleComponentManager: Symbol('ResourceHandleComponentManager'), + PassNodeComponentManager: Symbol('PassNodeComponentManager'), + // Renderer + RendererSystem: Symbol('RendererSystem'), + RenderPass: Symbol('RenderPass'), + RenderPassFactory: Symbol('Factory'), + Renderable: Symbol('Factory'), + // Mesh + MeshSystem: Symbol('MeshSystem'), + MeshComponentManager: Symbol('MeshComponentManager'), + CullableComponentManager: Symbol('CullableComponentManager'), + // Geometry + Geometry: Symbol('Geometry'), + GeometrySystem: Symbol('GeometrySystem'), + GeometryComponentManager: Symbol('GeometryComponentManager'), + // Material + Material: Symbol('Material'), + MaterialSystem: Symbol('MaterialSystem'), + MaterialComponentManager: Symbol('MaterialComponentManager'), + // RenderPath + ForwardRenderPath: Symbol('ForwardRenderPath'), + // ComputeSystem + ComputeSystem: Symbol('ComputeSystem'), + ComputeComponentManager: Symbol('ComputeComponentManager'), + ComputeStrategy: Symbol('ComputeStrategy'), + Systems: Symbol('Systems'), + World: Symbol('World'), + // RenderEngine + RenderEngine: Symbol('RenderEngine'), + WebGPUEngine: Symbol('WebGPUEngine'), + WebGLEngine: Symbol('WebGLEngine'), + // Shader Module + ShaderModuleService: Symbol('ShaderModuleService'), + ConfigService: Symbol('ConfigService'), + InteractorService: Symbol('InteractorService'), + IEventEmitter: Symbol('IEventEmitter'), + // Light + Light: Symbol('Light') +}; + +var FrameGraphHandle = function FrameGraphHandle() { + _classCallCheck(this, FrameGraphHandle); + + this.index = void 0; +}; + +var FrameGraphPass = function FrameGraphPass() { + _classCallCheck(this, FrameGraphPass); + + this.name = void 0; + this.data = void 0; + this.execute = void 0; + this.tearDown = void 0; +}; + +var PassNode = /*#__PURE__*/function () { + function PassNode() { + _classCallCheck(this, PassNode); + + this.name = void 0; + this.refCount = 0; + this.hasSideEffect = false; + this.devirtualize = []; + this.destroy = []; + this.reads = []; + this.writes = []; + } + + _createClass(PassNode, [{ + key: "read", + value: function read(handle) { + if (!this.reads.find(function (h) { + return h.index === handle.index; + })) { + this.reads.push(handle); + } + + return handle; + } + }, { + key: "sample", + value: function sample(handle) { + this.read(handle); // TODO: 记录在 this.samples 中 + + return handle; + } + }, { + key: "write", + value: function write(fg, handle) { + var existed = this.writes.find(function (h) { + return h.index === handle.index; + }); + + if (existed) { + return handle; + } + + var node = fg.getResourceNode(handle); + node.resource.version++; + + if (node.resource.imported) { + this.hasSideEffect = true; + } + + var r = fg.createResourceNode(node.resource); + var newNode = fg.getResourceNode(r); + newNode.writer = this; + this.writes.push(r); + return r; + } + }]); + + return PassNode; +}(); + +function _setPrototypeOf(o, p) { + _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { + o.__proto__ = p; + return o; + }; + + return _setPrototypeOf(o, p); +} + +function _inherits(subClass, superClass) { + if (typeof superClass !== "function" && superClass !== null) { + throw new TypeError("Super expression must either be null or a function"); + } + + subClass.prototype = Object.create(superClass && superClass.prototype, { + constructor: { + value: subClass, + writable: true, + configurable: true + } + }); + if (superClass) _setPrototypeOf(subClass, superClass); +} + +function _typeof$1(obj) { + "@babel/helpers - typeof"; + + if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { + _typeof$1 = function _typeof(obj) { + return typeof obj; + }; + } else { + _typeof$1 = function _typeof(obj) { + return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; + }; + } + + return _typeof$1(obj); +} + +function _assertThisInitialized(self) { + if (self === void 0) { + throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); + } + + return self; +} + +function _possibleConstructorReturn(self, call) { + if (call && (_typeof$1(call) === "object" || typeof call === "function")) { + return call; + } else if (call !== void 0) { + throw new TypeError("Derived constructors may only return object or undefined"); + } + + return _assertThisInitialized(self); +} + +function _getPrototypeOf(o) { + _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { + return o.__proto__ || Object.getPrototypeOf(o); + }; + return _getPrototypeOf(o); +} + +/** + * ported from filament + */ +var VirtualResource = function VirtualResource() { + _classCallCheck(this, VirtualResource); + + this.first = void 0; + this.last = void 0; +}; + +function _createSuper$f(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$f(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; } + +function _isNativeReflectConstruct$f() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } +var ResourceEntry = /*#__PURE__*/function (_VirtualResource) { + _inherits(ResourceEntry, _VirtualResource); + + var _super = _createSuper$f(ResourceEntry); + + function ResourceEntry() { + var _this; + + _classCallCheck(this, ResourceEntry); + + for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { + args[_key] = arguments[_key]; + } + + _this = _super.call.apply(_super, [this].concat(args)); + _this.version = 0; + _this.refs = 0; + _this.name = void 0; + _this.imported = void 0; + _this.priority = void 0; + _this.discardStart = true; + _this.discardEnd = false; + _this.descriptor = void 0; + _this.resource = void 0; + return _this; + } + + _createClass(ResourceEntry, [{ + key: "preExecuteDestroy", + + /** + * Lifecycles in FG's execute + */ + value: function preExecuteDestroy() { + this.discardEnd = true; + } + }, { + key: "postExecuteDestroy", + value: function postExecuteDestroy() { + if (!this.imported) ; + } + }, { + key: "postExecuteDevirtualize", + value: function postExecuteDevirtualize() { + this.discardStart = false; + } + }, { + key: "preExecuteDevirtualize", + value: function preExecuteDevirtualize() { + if (!this.imported) ; + } + }]); + + return ResourceEntry; +}(VirtualResource); + +var ResourceNode = function ResourceNode() { + _classCallCheck(this, ResourceNode); + + this.resource = void 0; + this.writer = void 0; + this.readerCount = 0; + this.version = void 0; +}; + +var _dec$x, _dec2$m, _class$x, _class2$m, _descriptor$m, _temp$s; + +function _createForOfIteratorHelper$4(o, allowArrayLike) { var it; if (typeof Symbol === "undefined" || o[Symbol.iterator] == null) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$4(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = o[Symbol.iterator](); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; } + +function _unsupportedIterableToArray$4(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$4(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$4(o, minLen); } + +function _arrayLikeToArray$4(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; } +/** + * ported from FrameGraph implemented by SakuraRender + * @see https://zhuanlan.zhihu.com/p/98572442 + * @see https://github.com/SaeruHikari/Sakura/blob/RenderGraph/SakuraCore/Source/Framework/GraphicTypes/FrameGraph/SakuraFrameGraph.cpp + */ + +var FrameGraphSystem = (_dec$x = inversify.injectable(), _dec2$m = inversify.inject(IDENTIFIER.RenderEngine), _dec$x(_class$x = (_class2$m = (_temp$s = /*#__PURE__*/function () { + function FrameGraphSystem() { + _classCallCheck(this, FrameGraphSystem); + + this.passNodes = []; + this.resourceNodes = []; + this.frameGraphPasses = []; + + _initializerDefineProperty(this, "engine", _descriptor$m, this); + } + + _createClass(FrameGraphSystem, [{ + key: "execute", + value: function () { + var _execute = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee(views) { + return regenerator.wrap(function _callee$(_context) { + while (1) { + switch (_context.prev = _context.next) { + case 0: + // this.engine.beginFrame(); + this.compile(); + _context.next = 3; + return this.executePassNodes(views); + + case 3: + case "end": + return _context.stop(); + } + } + }, _callee, this); + })); + + function execute(_x) { + return _execute.apply(this, arguments); + } + + return execute; + }() + }, { + key: "tearDown", + value: function tearDown() { + this.frameGraphPasses.forEach(function (pass) { + if (pass.tearDown) { + pass.tearDown(); + } + }); + this.reset(); + } + }, { + key: "addPass", + value: function addPass(name, setup, execute, tearDown) { + var frameGraphPass = new FrameGraphPass(); + frameGraphPass.execute = execute; + + if (tearDown) { + frameGraphPass.tearDown = tearDown; + } + + frameGraphPass.name = name; + var passNode = new PassNode(); + passNode.name = name; + this.passNodes.push(passNode); + this.frameGraphPasses.push(frameGraphPass); + setup(this, passNode, frameGraphPass); + return frameGraphPass; + } + }, { + key: "getPass", + value: function getPass(name) { + return this.frameGraphPasses.find(function (p) { + return p.name === name; + }); + } + }, { + key: "compile", + value: function compile() { + var _this = this; + + var _iterator = _createForOfIteratorHelper$4(this.passNodes), + _step; + + try { + for (_iterator.s(); !(_step = _iterator.n()).done;) { + var _pass = _step.value; + _pass.refCount = _pass.writes.length + (_pass.hasSideEffect ? 1 : 0); + + _pass.reads.forEach(function (handle) { + _this.resourceNodes[handle.index].readerCount++; + }); + } + } catch (err) { + _iterator.e(err); + } finally { + _iterator.f(); + } + + var stack = []; + + var _iterator2 = _createForOfIteratorHelper$4(this.resourceNodes), + _step2; + + try { + for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) { + var node = _step2.value; + + if (node.readerCount === 0) { + stack.push(node); + } + } + } catch (err) { + _iterator2.e(err); + } finally { + _iterator2.f(); + } + + while (stack.length) { + var pNode = stack.pop(); + var writer = pNode && pNode.writer; + + if (writer) { + if (--writer.refCount === 0) { + // this pass is culled + // assert(!writer->hasSideEffect); + var _iterator3 = _createForOfIteratorHelper$4(writer.reads), + _step3; + + try { + for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) { + var resource = _step3.value; + var r = this.resourceNodes[resource.index]; + + if (--r.readerCount === 0) { + stack.push(r); + } + } + } catch (err) { + _iterator3.e(err); + } finally { + _iterator3.f(); + } + } + } + } // update the final reference counts + + + this.resourceNodes.forEach(function (node) { + node.resource.refs += node.readerCount; + }); + + var _iterator4 = _createForOfIteratorHelper$4(this.passNodes), + _step4; + + try { + for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) { + var _pass2 = _step4.value; + + if (!_pass2.refCount) { + continue; + } + + var _iterator6 = _createForOfIteratorHelper$4(_pass2.reads), + _step6; + + try { + for (_iterator6.s(); !(_step6 = _iterator6.n()).done;) { + var _resource2 = _step6.value; + var pResource = this.resourceNodes[_resource2.index].resource; + pResource.first = pResource.first ? pResource.first : _pass2; + pResource.last = _pass2; + } + } catch (err) { + _iterator6.e(err); + } finally { + _iterator6.f(); + } + + var _iterator7 = _createForOfIteratorHelper$4(_pass2.writes), + _step7; + + try { + for (_iterator7.s(); !(_step7 = _iterator7.n()).done;) { + var _resource3 = _step7.value; + var _pResource = this.resourceNodes[_resource3.index].resource; + _pResource.first = _pResource.first ? _pResource.first : _pass2; + _pResource.last = _pass2; + } + } catch (err) { + _iterator7.e(err); + } finally { + _iterator7.f(); + } + } + } catch (err) { + _iterator4.e(err); + } finally { + _iterator4.f(); + } + + for (var priority = 0; priority < 2; priority++) { + var _iterator5 = _createForOfIteratorHelper$4(this.resourceNodes), + _step5; + + try { + for (_iterator5.s(); !(_step5 = _iterator5.n()).done;) { + var resoureNode = _step5.value; + var _resource = resoureNode.resource; + + if (_resource.priority === priority && _resource.refs) { + var pFirst = _resource.first; + var pLast = _resource.last; + + if (pFirst && pLast) { + pFirst.devirtualize.push(_resource); + pLast.destroy.push(_resource); + } + } + } + } catch (err) { + _iterator5.e(err); + } finally { + _iterator5.f(); + } + } + } + }, { + key: "executePassNodes", + value: function () { + var _executePassNodes = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee2(views) { + var _iterator8, _step8, _step8$value, index, node, _iterator9, _step9, resource, _iterator10, _step10, _resource4, _iterator11, _step11, _resource5, _iterator12, _step12, _resource6; + + return regenerator.wrap(function _callee2$(_context2) { + while (1) { + switch (_context2.prev = _context2.next) { + case 0: + _iterator8 = _createForOfIteratorHelper$4(this.passNodes.entries()); + _context2.prev = 1; + + _iterator8.s(); + + case 3: + if ((_step8 = _iterator8.n()).done) { + _context2.next = 18; + break; + } + + _step8$value = _slicedToArray(_step8.value, 2), index = _step8$value[0], node = _step8$value[1]; + + if (!node.refCount) { + _context2.next = 16; + break; + } + + _iterator9 = _createForOfIteratorHelper$4(node.devirtualize); + + try { + for (_iterator9.s(); !(_step9 = _iterator9.n()).done;) { + resource = _step9.value; + resource.preExecuteDevirtualize(this.engine); + } + } catch (err) { + _iterator9.e(err); + } finally { + _iterator9.f(); + } + + _iterator10 = _createForOfIteratorHelper$4(node.destroy); + + try { + for (_iterator10.s(); !(_step10 = _iterator10.n()).done;) { + _resource4 = _step10.value; + + _resource4.preExecuteDestroy(this.engine); + } + } catch (err) { + _iterator10.e(err); + } finally { + _iterator10.f(); + } + + _context2.next = 12; + return this.frameGraphPasses[index].execute(this, this.frameGraphPasses[index], views); + + case 12: + _iterator11 = _createForOfIteratorHelper$4(node.devirtualize); + + try { + for (_iterator11.s(); !(_step11 = _iterator11.n()).done;) { + _resource5 = _step11.value; + + _resource5.postExecuteDevirtualize(this.engine); + } + } catch (err) { + _iterator11.e(err); + } finally { + _iterator11.f(); + } + + _iterator12 = _createForOfIteratorHelper$4(node.destroy); + + try { + for (_iterator12.s(); !(_step12 = _iterator12.n()).done;) { + _resource6 = _step12.value; + + _resource6.postExecuteDestroy(this.engine); + } + } catch (err) { + _iterator12.e(err); + } finally { + _iterator12.f(); + } + + case 16: + _context2.next = 3; + break; + + case 18: + _context2.next = 23; + break; + + case 20: + _context2.prev = 20; + _context2.t0 = _context2["catch"](1); + + _iterator8.e(_context2.t0); + + case 23: + _context2.prev = 23; + + _iterator8.f(); + + return _context2.finish(23); + + case 26: + this.reset(); + + case 27: + case "end": + return _context2.stop(); + } + } + }, _callee2, this, [[1, 20, 23, 26]]); + })); + + function executePassNodes(_x2) { + return _executePassNodes.apply(this, arguments); + } + + return executePassNodes; + }() + }, { + key: "reset", + value: function reset() { + this.passNodes = []; + this.resourceNodes = []; + this.frameGraphPasses = []; + } + }, { + key: "getResourceNode", + value: function getResourceNode(r) { + return this.resourceNodes[r.index]; + } + }, { + key: "createResourceNode", + value: function createResourceNode(resourceEntry) { + var resourceNode = new ResourceNode(); + resourceNode.resource = resourceEntry; + resourceNode.version = resourceEntry.version; + this.resourceNodes.push(resourceNode); + var fgh = new FrameGraphHandle(); + fgh.index = this.resourceNodes.length - 1; + return fgh; + } + }, { + key: "createTexture", + value: function createTexture(passNode, name, descriptor) { + var resource = new ResourceEntry(); + resource.name = name; + resource.descriptor = descriptor; + return this.createResourceNode(resource); + } + }, { + key: "createRenderTarget", + value: function createRenderTarget(passNode, name, descriptor) { + var resource = new ResourceEntry(); + resource.name = name; + resource.descriptor = descriptor; + return this.createResourceNode(resource); + } + }, { + key: "present", + value: function present(input) { + this.addPass('Present', function (fg, passNode) { + passNode.read(input); + passNode.hasSideEffect = true; + }, /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee3() { + return regenerator.wrap(function _callee3$(_context3) { + while (1) { + switch (_context3.prev = _context3.next) { + case 0: + case "end": + return _context3.stop(); + } + } + }, _callee3); + }))); + } + }]); + + return FrameGraphSystem; +}(), _temp$s), (_descriptor$m = _applyDecoratedDescriptor(_class2$m.prototype, "engine", [_dec2$m], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +})), _class2$m)) || _class$x); + +function _defineProperty(obj, key, value) { + if (key in obj) { + Object.defineProperty(obj, key, { + value: value, + enumerable: true, + configurable: true, + writable: true + }); + } else { + obj[key] = value; + } + + return obj; +} + +/** Used as references for various `Number` constants. */ +var MAX_SAFE_INTEGER$2 = 9007199254740991; +/** `Object#toString` result references. */ + +var argsTag$2 = '[object Arguments]'; +var arrayTag$2 = '[object Array]'; +var boolTag$2 = '[object Boolean]'; +var dateTag$2 = '[object Date]'; +var errorTag$2 = '[object Error]'; +var funcTag$2 = '[object Function]'; +var mapTag$2 = '[object Map]'; +var numberTag$2 = '[object Number]'; +var objectTag$2 = '[object Object]'; +var regexpTag$2 = '[object RegExp]'; +var setTag$3 = '[object Set]'; +var stringTag$2 = '[object String]'; +var weakMapTag$2 = '[object WeakMap]'; +var arrayBufferTag$2 = '[object ArrayBuffer]'; +var dataViewTag$2 = '[object DataView]'; +var float32Tag$2 = '[object Float32Array]'; +var float64Tag$2 = '[object Float64Array]'; +var int8Tag$2 = '[object Int8Array]'; +var int16Tag$2 = '[object Int16Array]'; +var int32Tag$2 = '[object Int32Array]'; +var uint8Tag$2 = '[object Uint8Array]'; +var uint8ClampedTag$2 = '[object Uint8ClampedArray]'; +var uint16Tag$2 = '[object Uint16Array]'; +var uint32Tag$2 = '[object Uint32Array]'; +/** Used to identify `toStringTag` values of typed arrays. */ + +var typedArrayTags$2 = {}; +typedArrayTags$2[float32Tag$2] = typedArrayTags$2[float64Tag$2] = typedArrayTags$2[int8Tag$2] = typedArrayTags$2[int16Tag$2] = typedArrayTags$2[int32Tag$2] = typedArrayTags$2[uint8Tag$2] = typedArrayTags$2[uint8ClampedTag$2] = typedArrayTags$2[uint16Tag$2] = typedArrayTags$2[uint32Tag$2] = true; +typedArrayTags$2[argsTag$2] = typedArrayTags$2[arrayTag$2] = typedArrayTags$2[arrayBufferTag$2] = typedArrayTags$2[boolTag$2] = typedArrayTags$2[dataViewTag$2] = typedArrayTags$2[dateTag$2] = typedArrayTags$2[errorTag$2] = typedArrayTags$2[funcTag$2] = typedArrayTags$2[mapTag$2] = typedArrayTags$2[numberTag$2] = typedArrayTags$2[objectTag$2] = typedArrayTags$2[regexpTag$2] = typedArrayTags$2[setTag$3] = typedArrayTags$2[stringTag$2] = typedArrayTags$2[weakMapTag$2] = false; +/** Used for built-in method references. */ + + +var objectProto$2 = Object.prototype; +/** + * Used to resolve the + * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring) + * of values. + */ + +var objectToString$2 = objectProto$2.toString; +/** + * The base implementation of `_.isTypedArray` without Node.js optimizations. + * + * @private + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is a typed array, else `false`. + */ + +function baseIsTypedArray$2(value) { + return isObjectLike$2(value) && isLength$2(value.length) && !!typedArrayTags$2[objectToString$2.call(value)]; +} + +function isLength$2(value) { + return typeof value === 'number' && value > -1 && value % 1 === 0 && value <= MAX_SAFE_INTEGER$2; +} + +function isObjectLike$2(value) { + return !!value && _typeof$1(value) === 'object'; +} +/** + * Checks if `value` is classified as a typed array. + * + * @static + * @memberOf _ + * @since 3.0.0 + * @category Lang + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is a typed array, else `false`. + * @example + * + * _.isTypedArray(new Uint8Array); + * // => true + * + * _.isTypedArray([]); + * // => false + */ + + +var isTypedArray$2 = baseIsTypedArray$2; + +function ownKeys$a(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; } + +function _objectSpread$a(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$a(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$a(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; } + +function _createSuper$e(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$e(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; } + +function _isNativeReflectConstruct$e() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } +var GeometryComponent = /*#__PURE__*/function (_Component) { + _inherits(GeometryComponent, _Component); + + var _super = _createSuper$e(GeometryComponent); + + // instanced count + function GeometryComponent(data) { + var _this; + + _classCallCheck(this, GeometryComponent); + + _this = _super.call(this, data); + _this.dirty = true; + _this.attributes = []; + _this.indices = void 0; + _this.indicesBuffer = void 0; + _this.vertexCount = 0; + _this.maxInstancedCount = void 0; + _this.aabb = void 0; + _this.entity = void 0; + Object.assign(_assertThisInitialized(_this), data); + return _this; + } + /** + * @see https://threejs.org/docs/#api/en/core/BufferAttribute + */ + + + _createClass(GeometryComponent, [{ + key: "setAttribute", + value: function setAttribute(name, data, descriptor, bufferGetter) { + var existed = this.attributes.find(function (a) { + return a.name === name; + }); + + if (!existed) { + this.attributes.push(_objectSpread$a(_objectSpread$a({ + dirty: true, + name: name, + data: data + }, descriptor), {}, { + bufferGetter: bufferGetter + })); + } else { + existed.data = data; + existed.dirty = true; + } + + this.dirty = true; + return this; + } + }, { + key: "setIndex", + value: function setIndex(data) { + this.indices = new Uint32Array( // @ts-ignore + data.buffer ? data.buffer : data); + this.dirty = true; + return this; + } + /** + * when merge all the geometries into one, we need to transform every vertex's position + * and every face's normal + */ + + }, { + key: "applyMatrix", + value: function applyMatrix(matrix) { + var positionAttribute = this.attributes.find(function (_ref) { + var name = _ref.name; + return name === 'position'; + }); + var normalAttribute = this.attributes.find(function (_ref2) { + var name = _ref2.name; + return name === 'normal'; + }); + + if (positionAttribute) { + positionAttribute.dirty = true; // @ts-ignore + + if (positionAttribute.data && positionAttribute.data.length) { + // @ts-ignore + for (var i = 0; i < positionAttribute.data.length; i += 3) { + var position = fromValues$2( // @ts-ignore + positionAttribute.data[i], // @ts-ignore + positionAttribute.data[i + 1], // @ts-ignore + positionAttribute.data[i + 2], 1); + transformMat4$1(position, position, matrix); + + if (isTypedArray$2(positionAttribute.data)) { + // @ts-ignore + positionAttribute.data.set([position[0], position[1], position[2]], i); + } else { + // @ts-ignore + positionAttribute.data[i] = position[0]; // @ts-ignore + + positionAttribute.data[i + 1] = position[1]; // @ts-ignore + + positionAttribute.data[i + 2] = position[2]; + } + } + } + } + + if (normalAttribute) { + var normalMatrix = normalFromMat4(create$6(), matrix); // @ts-ignore + + if (normalAttribute.data && normalAttribute.data.length) { + // @ts-ignore + for (var _i = 0; _i < normalAttribute.data.length; _i += 3) { + var normal = fromValues$3( // @ts-ignore + normalAttribute.data[_i], // @ts-ignore + normalAttribute.data[_i + 1], // @ts-ignore + normalAttribute.data[_i + 2]); + transformMat3$2(normal, normal, normalMatrix); + normalize$7(normal, normal); + + if (isTypedArray$2(normalAttribute.data)) { + // @ts-ignore + normalAttribute.data.set([normal[0], normal[1], normal[2]], _i); + } else { + // @ts-ignore + normalAttribute.data[_i] = normal[0]; // @ts-ignore + + normalAttribute.data[_i + 1] = normal[1]; // @ts-ignore + + normalAttribute.data[_i + 2] = normal[2]; + } + } + } + } + } + }]); + + return GeometryComponent; +}(Component); + +/** + * WebGL 枚举值 + * @see http://www.khronos.org/registry/webgl/specs/latest/1.0/#5.14 + * 使用 babel 插件对常量进行内联，以减少最终打包产物大小 + * @see https://github.com/uber/deck.gl/blob/7.1-release/dev-docs/roadmaps/dist-size-roadmap.md#inline-gl-constants + * 为了支持 WebGPU，新增 TextureUsage + * @see https://gpuweb.github.io/gpuweb/#gputextureusage + */ +var gl; + +(function (gl) { + gl[gl["DEPTH_BUFFER_BIT"] = 256] = "DEPTH_BUFFER_BIT"; + gl[gl["STENCIL_BUFFER_BIT"] = 1024] = "STENCIL_BUFFER_BIT"; + gl[gl["COLOR_BUFFER_BIT"] = 16384] = "COLOR_BUFFER_BIT"; + gl[gl["POINTS"] = 0] = "POINTS"; + gl[gl["LINES"] = 1] = "LINES"; + gl[gl["LINE_LOOP"] = 2] = "LINE_LOOP"; + gl[gl["LINE_STRIP"] = 3] = "LINE_STRIP"; + gl[gl["TRIANGLES"] = 4] = "TRIANGLES"; + gl[gl["TRIANGLE_STRIP"] = 5] = "TRIANGLE_STRIP"; + gl[gl["TRIANGLE_FAN"] = 6] = "TRIANGLE_FAN"; + gl[gl["ZERO"] = 0] = "ZERO"; + gl[gl["ONE"] = 1] = "ONE"; + gl[gl["SRC_COLOR"] = 768] = "SRC_COLOR"; + gl[gl["ONE_MINUS_SRC_COLOR"] = 769] = "ONE_MINUS_SRC_COLOR"; + gl[gl["SRC_ALPHA"] = 770] = "SRC_ALPHA"; + gl[gl["ONE_MINUS_SRC_ALPHA"] = 771] = "ONE_MINUS_SRC_ALPHA"; + gl[gl["DST_ALPHA"] = 772] = "DST_ALPHA"; + gl[gl["ONE_MINUS_DST_ALPHA"] = 773] = "ONE_MINUS_DST_ALPHA"; + gl[gl["DST_COLOR"] = 774] = "DST_COLOR"; + gl[gl["ONE_MINUS_DST_COLOR"] = 775] = "ONE_MINUS_DST_COLOR"; + gl[gl["SRC_ALPHA_SATURATE"] = 776] = "SRC_ALPHA_SATURATE"; + gl[gl["FUNC_ADD"] = 32774] = "FUNC_ADD"; + gl[gl["BLEND_EQUATION"] = 32777] = "BLEND_EQUATION"; + gl[gl["BLEND_EQUATION_RGB"] = 32777] = "BLEND_EQUATION_RGB"; + gl[gl["BLEND_EQUATION_ALPHA"] = 34877] = "BLEND_EQUATION_ALPHA"; + gl[gl["FUNC_SUBTRACT"] = 32778] = "FUNC_SUBTRACT"; + gl[gl["FUNC_REVERSE_SUBTRACT"] = 32779] = "FUNC_REVERSE_SUBTRACT"; + gl[gl["MAX_EXT"] = 32776] = "MAX_EXT"; + gl[gl["MIN_EXT"] = 32775] = "MIN_EXT"; + gl[gl["BLEND_DST_RGB"] = 32968] = "BLEND_DST_RGB"; + gl[gl["BLEND_SRC_RGB"] = 32969] = "BLEND_SRC_RGB"; + gl[gl["BLEND_DST_ALPHA"] = 32970] = "BLEND_DST_ALPHA"; + gl[gl["BLEND_SRC_ALPHA"] = 32971] = "BLEND_SRC_ALPHA"; + gl[gl["CONSTANT_COLOR"] = 32769] = "CONSTANT_COLOR"; + gl[gl["ONE_MINUS_CONSTANT_COLOR"] = 32770] = "ONE_MINUS_CONSTANT_COLOR"; + gl[gl["CONSTANT_ALPHA"] = 32771] = "CONSTANT_ALPHA"; + gl[gl["ONE_MINUS_CONSTANT_ALPHA"] = 32772] = "ONE_MINUS_CONSTANT_ALPHA"; + gl[gl["BLEND_COLOR"] = 32773] = "BLEND_COLOR"; + gl[gl["ARRAY_BUFFER"] = 34962] = "ARRAY_BUFFER"; + gl[gl["ELEMENT_ARRAY_BUFFER"] = 34963] = "ELEMENT_ARRAY_BUFFER"; + gl[gl["ARRAY_BUFFER_BINDING"] = 34964] = "ARRAY_BUFFER_BINDING"; + gl[gl["ELEMENT_ARRAY_BUFFER_BINDING"] = 34965] = "ELEMENT_ARRAY_BUFFER_BINDING"; + gl[gl["STREAM_DRAW"] = 35040] = "STREAM_DRAW"; + gl[gl["STATIC_DRAW"] = 35044] = "STATIC_DRAW"; + gl[gl["DYNAMIC_DRAW"] = 35048] = "DYNAMIC_DRAW"; + gl[gl["BUFFER_SIZE"] = 34660] = "BUFFER_SIZE"; + gl[gl["BUFFER_USAGE"] = 34661] = "BUFFER_USAGE"; + gl[gl["CURRENT_VERTEX_ATTRIB"] = 34342] = "CURRENT_VERTEX_ATTRIB"; + gl[gl["FRONT"] = 1028] = "FRONT"; + gl[gl["BACK"] = 1029] = "BACK"; + gl[gl["FRONT_AND_BACK"] = 1032] = "FRONT_AND_BACK"; + gl[gl["CULL_FACE"] = 2884] = "CULL_FACE"; + gl[gl["BLEND"] = 3042] = "BLEND"; + gl[gl["DITHER"] = 3024] = "DITHER"; + gl[gl["STENCIL_TEST"] = 2960] = "STENCIL_TEST"; + gl[gl["DEPTH_TEST"] = 2929] = "DEPTH_TEST"; + gl[gl["SCISSOR_TEST"] = 3089] = "SCISSOR_TEST"; + gl[gl["POLYGON_OFFSET_FILL"] = 32823] = "POLYGON_OFFSET_FILL"; + gl[gl["SAMPLE_ALPHA_TO_COVERAGE"] = 32926] = "SAMPLE_ALPHA_TO_COVERAGE"; + gl[gl["SAMPLE_COVERAGE"] = 32928] = "SAMPLE_COVERAGE"; + gl[gl["NO_ERROR"] = 0] = "NO_ERROR"; + gl[gl["INVALID_ENUM"] = 1280] = "INVALID_ENUM"; + gl[gl["INVALID_VALUE"] = 1281] = "INVALID_VALUE"; + gl[gl["INVALID_OPERATION"] = 1282] = "INVALID_OPERATION"; + gl[gl["OUT_OF_MEMORY"] = 1285] = "OUT_OF_MEMORY"; + gl[gl["CW"] = 2304] = "CW"; + gl[gl["CCW"] = 2305] = "CCW"; + gl[gl["LINE_WIDTH"] = 2849] = "LINE_WIDTH"; + gl[gl["ALIASED_POINT_SIZE_RANGE"] = 33901] = "ALIASED_POINT_SIZE_RANGE"; + gl[gl["ALIASED_LINE_WIDTH_RANGE"] = 33902] = "ALIASED_LINE_WIDTH_RANGE"; + gl[gl["CULL_FACE_MODE"] = 2885] = "CULL_FACE_MODE"; + gl[gl["FRONT_FACE"] = 2886] = "FRONT_FACE"; + gl[gl["DEPTH_RANGE"] = 2928] = "DEPTH_RANGE"; + gl[gl["DEPTH_WRITEMASK"] = 2930] = "DEPTH_WRITEMASK"; + gl[gl["DEPTH_CLEAR_VALUE"] = 2931] = "DEPTH_CLEAR_VALUE"; + gl[gl["DEPTH_FUNC"] = 2932] = "DEPTH_FUNC"; + gl[gl["STENCIL_CLEAR_VALUE"] = 2961] = "STENCIL_CLEAR_VALUE"; + gl[gl["STENCIL_FUNC"] = 2962] = "STENCIL_FUNC"; + gl[gl["STENCIL_FAIL"] = 2964] = "STENCIL_FAIL"; + gl[gl["STENCIL_PASS_DEPTH_FAIL"] = 2965] = "STENCIL_PASS_DEPTH_FAIL"; + gl[gl["STENCIL_PASS_DEPTH_PASS"] = 2966] = "STENCIL_PASS_DEPTH_PASS"; + gl[gl["STENCIL_REF"] = 2967] = "STENCIL_REF"; + gl[gl["STENCIL_VALUE_MASK"] = 2963] = "STENCIL_VALUE_MASK"; + gl[gl["STENCIL_WRITEMASK"] = 2968] = "STENCIL_WRITEMASK"; + gl[gl["STENCIL_BACK_FUNC"] = 34816] = "STENCIL_BACK_FUNC"; + gl[gl["STENCIL_BACK_FAIL"] = 34817] = "STENCIL_BACK_FAIL"; + gl[gl["STENCIL_BACK_PASS_DEPTH_FAIL"] = 34818] = "STENCIL_BACK_PASS_DEPTH_FAIL"; + gl[gl["STENCIL_BACK_PASS_DEPTH_PASS"] = 34819] = "STENCIL_BACK_PASS_DEPTH_PASS"; + gl[gl["STENCIL_BACK_REF"] = 36003] = "STENCIL_BACK_REF"; + gl[gl["STENCIL_BACK_VALUE_MASK"] = 36004] = "STENCIL_BACK_VALUE_MASK"; + gl[gl["STENCIL_BACK_WRITEMASK"] = 36005] = "STENCIL_BACK_WRITEMASK"; + gl[gl["VIEWPORT"] = 2978] = "VIEWPORT"; + gl[gl["SCISSOR_BOX"] = 3088] = "SCISSOR_BOX"; + gl[gl["COLOR_CLEAR_VALUE"] = 3106] = "COLOR_CLEAR_VALUE"; + gl[gl["COLOR_WRITEMASK"] = 3107] = "COLOR_WRITEMASK"; + gl[gl["UNPACK_ALIGNMENT"] = 3317] = "UNPACK_ALIGNMENT"; + gl[gl["PACK_ALIGNMENT"] = 3333] = "PACK_ALIGNMENT"; + gl[gl["MAX_TEXTURE_SIZE"] = 3379] = "MAX_TEXTURE_SIZE"; + gl[gl["MAX_VIEWPORT_DIMS"] = 3386] = "MAX_VIEWPORT_DIMS"; + gl[gl["SUBPIXEL_BITS"] = 3408] = "SUBPIXEL_BITS"; + gl[gl["RED_BITS"] = 3410] = "RED_BITS"; + gl[gl["GREEN_BITS"] = 3411] = "GREEN_BITS"; + gl[gl["BLUE_BITS"] = 3412] = "BLUE_BITS"; + gl[gl["ALPHA_BITS"] = 3413] = "ALPHA_BITS"; + gl[gl["DEPTH_BITS"] = 3414] = "DEPTH_BITS"; + gl[gl["STENCIL_BITS"] = 3415] = "STENCIL_BITS"; + gl[gl["POLYGON_OFFSET_UNITS"] = 10752] = "POLYGON_OFFSET_UNITS"; + gl[gl["POLYGON_OFFSET_FACTOR"] = 32824] = "POLYGON_OFFSET_FACTOR"; + gl[gl["TEXTURE_BINDING_2D"] = 32873] = "TEXTURE_BINDING_2D"; + gl[gl["SAMPLE_BUFFERS"] = 32936] = "SAMPLE_BUFFERS"; + gl[gl["SAMPLES"] = 32937] = "SAMPLES"; + gl[gl["SAMPLE_COVERAGE_VALUE"] = 32938] = "SAMPLE_COVERAGE_VALUE"; + gl[gl["SAMPLE_COVERAGE_INVERT"] = 32939] = "SAMPLE_COVERAGE_INVERT"; + gl[gl["COMPRESSED_TEXTURE_FORMATS"] = 34467] = "COMPRESSED_TEXTURE_FORMATS"; + gl[gl["DONT_CARE"] = 4352] = "DONT_CARE"; + gl[gl["FASTEST"] = 4353] = "FASTEST"; + gl[gl["NICEST"] = 4354] = "NICEST"; + gl[gl["GENERATE_MIPMAP_HINT"] = 33170] = "GENERATE_MIPMAP_HINT"; + gl[gl["BYTE"] = 5120] = "BYTE"; + gl[gl["UNSIGNED_BYTE"] = 5121] = "UNSIGNED_BYTE"; + gl[gl["SHORT"] = 5122] = "SHORT"; + gl[gl["UNSIGNED_SHORT"] = 5123] = "UNSIGNED_SHORT"; + gl[gl["INT"] = 5124] = "INT"; + gl[gl["UNSIGNED_INT"] = 5125] = "UNSIGNED_INT"; + gl[gl["FLOAT"] = 5126] = "FLOAT"; + gl[gl["DEPTH_COMPONENT"] = 6402] = "DEPTH_COMPONENT"; + gl[gl["ALPHA"] = 6406] = "ALPHA"; + gl[gl["RGB"] = 6407] = "RGB"; + gl[gl["RGBA"] = 6408] = "RGBA"; + gl[gl["LUMINANCE"] = 6409] = "LUMINANCE"; + gl[gl["LUMINANCE_ALPHA"] = 6410] = "LUMINANCE_ALPHA"; + gl[gl["UNSIGNED_SHORT_4_4_4_4"] = 32819] = "UNSIGNED_SHORT_4_4_4_4"; + gl[gl["UNSIGNED_SHORT_5_5_5_1"] = 32820] = "UNSIGNED_SHORT_5_5_5_1"; + gl[gl["UNSIGNED_SHORT_5_6_5"] = 33635] = "UNSIGNED_SHORT_5_6_5"; + gl[gl["FRAGMENT_SHADER"] = 35632] = "FRAGMENT_SHADER"; + gl[gl["VERTEX_SHADER"] = 35633] = "VERTEX_SHADER"; + gl[gl["MAX_VERTEX_ATTRIBS"] = 34921] = "MAX_VERTEX_ATTRIBS"; + gl[gl["MAX_VERTEX_UNIFORM_VECTORS"] = 36347] = "MAX_VERTEX_UNIFORM_VECTORS"; + gl[gl["MAX_VARYING_VECTORS"] = 36348] = "MAX_VARYING_VECTORS"; + gl[gl["MAX_COMBINED_TEXTURE_IMAGE_UNITS"] = 35661] = "MAX_COMBINED_TEXTURE_IMAGE_UNITS"; + gl[gl["MAX_VERTEX_TEXTURE_IMAGE_UNITS"] = 35660] = "MAX_VERTEX_TEXTURE_IMAGE_UNITS"; + gl[gl["MAX_TEXTURE_IMAGE_UNITS"] = 34930] = "MAX_TEXTURE_IMAGE_UNITS"; + gl[gl["MAX_FRAGMENT_UNIFORM_VECTORS"] = 36349] = "MAX_FRAGMENT_UNIFORM_VECTORS"; + gl[gl["SHADER_TYPE"] = 35663] = "SHADER_TYPE"; + gl[gl["DELETE_STATUS"] = 35712] = "DELETE_STATUS"; + gl[gl["LINK_STATUS"] = 35714] = "LINK_STATUS"; + gl[gl["VALIDATE_STATUS"] = 35715] = "VALIDATE_STATUS"; + gl[gl["ATTACHED_SHADERS"] = 35717] = "ATTACHED_SHADERS"; + gl[gl["ACTIVE_UNIFORMS"] = 35718] = "ACTIVE_UNIFORMS"; + gl[gl["ACTIVE_ATTRIBUTES"] = 35721] = "ACTIVE_ATTRIBUTES"; + gl[gl["SHADING_LANGUAGE_VERSION"] = 35724] = "SHADING_LANGUAGE_VERSION"; + gl[gl["CURRENT_PROGRAM"] = 35725] = "CURRENT_PROGRAM"; + gl[gl["NEVER"] = 512] = "NEVER"; + gl[gl["LESS"] = 513] = "LESS"; + gl[gl["EQUAL"] = 514] = "EQUAL"; + gl[gl["LEQUAL"] = 515] = "LEQUAL"; + gl[gl["GREATER"] = 516] = "GREATER"; + gl[gl["NOTEQUAL"] = 517] = "NOTEQUAL"; + gl[gl["GEQUAL"] = 518] = "GEQUAL"; + gl[gl["ALWAYS"] = 519] = "ALWAYS"; + gl[gl["KEEP"] = 7680] = "KEEP"; + gl[gl["REPLACE"] = 7681] = "REPLACE"; + gl[gl["INCR"] = 7682] = "INCR"; + gl[gl["DECR"] = 7683] = "DECR"; + gl[gl["INVERT"] = 5386] = "INVERT"; + gl[gl["INCR_WRAP"] = 34055] = "INCR_WRAP"; + gl[gl["DECR_WRAP"] = 34056] = "DECR_WRAP"; + gl[gl["VENDOR"] = 7936] = "VENDOR"; + gl[gl["RENDERER"] = 7937] = "RENDERER"; + gl[gl["VERSION"] = 7938] = "VERSION"; + gl[gl["NEAREST"] = 9728] = "NEAREST"; + gl[gl["LINEAR"] = 9729] = "LINEAR"; + gl[gl["NEAREST_MIPMAP_NEAREST"] = 9984] = "NEAREST_MIPMAP_NEAREST"; + gl[gl["LINEAR_MIPMAP_NEAREST"] = 9985] = "LINEAR_MIPMAP_NEAREST"; + gl[gl["NEAREST_MIPMAP_LINEAR"] = 9986] = "NEAREST_MIPMAP_LINEAR"; + gl[gl["LINEAR_MIPMAP_LINEAR"] = 9987] = "LINEAR_MIPMAP_LINEAR"; + gl[gl["TEXTURE_MAG_FILTER"] = 10240] = "TEXTURE_MAG_FILTER"; + gl[gl["TEXTURE_MIN_FILTER"] = 10241] = "TEXTURE_MIN_FILTER"; + gl[gl["TEXTURE_WRAP_S"] = 10242] = "TEXTURE_WRAP_S"; + gl[gl["TEXTURE_WRAP_T"] = 10243] = "TEXTURE_WRAP_T"; + gl[gl["TEXTURE_2D"] = 3553] = "TEXTURE_2D"; + gl[gl["TEXTURE"] = 5890] = "TEXTURE"; + gl[gl["TEXTURE_CUBE_MAP"] = 34067] = "TEXTURE_CUBE_MAP"; + gl[gl["TEXTURE_BINDING_CUBE_MAP"] = 34068] = "TEXTURE_BINDING_CUBE_MAP"; + gl[gl["TEXTURE_CUBE_MAP_POSITIVE_X"] = 34069] = "TEXTURE_CUBE_MAP_POSITIVE_X"; + gl[gl["TEXTURE_CUBE_MAP_NEGATIVE_X"] = 34070] = "TEXTURE_CUBE_MAP_NEGATIVE_X"; + gl[gl["TEXTURE_CUBE_MAP_POSITIVE_Y"] = 34071] = "TEXTURE_CUBE_MAP_POSITIVE_Y"; + gl[gl["TEXTURE_CUBE_MAP_NEGATIVE_Y"] = 34072] = "TEXTURE_CUBE_MAP_NEGATIVE_Y"; + gl[gl["TEXTURE_CUBE_MAP_POSITIVE_Z"] = 34073] = "TEXTURE_CUBE_MAP_POSITIVE_Z"; + gl[gl["TEXTURE_CUBE_MAP_NEGATIVE_Z"] = 34074] = "TEXTURE_CUBE_MAP_NEGATIVE_Z"; + gl[gl["MAX_CUBE_MAP_TEXTURE_SIZE"] = 34076] = "MAX_CUBE_MAP_TEXTURE_SIZE"; + gl[gl["TEXTURE0"] = 33984] = "TEXTURE0"; + gl[gl["TEXTURE1"] = 33985] = "TEXTURE1"; + gl[gl["TEXTURE2"] = 33986] = "TEXTURE2"; + gl[gl["TEXTURE3"] = 33987] = "TEXTURE3"; + gl[gl["TEXTURE4"] = 33988] = "TEXTURE4"; + gl[gl["TEXTURE5"] = 33989] = "TEXTURE5"; + gl[gl["TEXTURE6"] = 33990] = "TEXTURE6"; + gl[gl["TEXTURE7"] = 33991] = "TEXTURE7"; + gl[gl["TEXTURE8"] = 33992] = "TEXTURE8"; + gl[gl["TEXTURE9"] = 33993] = "TEXTURE9"; + gl[gl["TEXTURE10"] = 33994] = "TEXTURE10"; + gl[gl["TEXTURE11"] = 33995] = "TEXTURE11"; + gl[gl["TEXTURE12"] = 33996] = "TEXTURE12"; + gl[gl["TEXTURE13"] = 33997] = "TEXTURE13"; + gl[gl["TEXTURE14"] = 33998] = "TEXTURE14"; + gl[gl["TEXTURE15"] = 33999] = "TEXTURE15"; + gl[gl["TEXTURE16"] = 34000] = "TEXTURE16"; + gl[gl["TEXTURE17"] = 34001] = "TEXTURE17"; + gl[gl["TEXTURE18"] = 34002] = "TEXTURE18"; + gl[gl["TEXTURE19"] = 34003] = "TEXTURE19"; + gl[gl["TEXTURE20"] = 34004] = "TEXTURE20"; + gl[gl["TEXTURE21"] = 34005] = "TEXTURE21"; + gl[gl["TEXTURE22"] = 34006] = "TEXTURE22"; + gl[gl["TEXTURE23"] = 34007] = "TEXTURE23"; + gl[gl["TEXTURE24"] = 34008] = "TEXTURE24"; + gl[gl["TEXTURE25"] = 34009] = "TEXTURE25"; + gl[gl["TEXTURE26"] = 34010] = "TEXTURE26"; + gl[gl["TEXTURE27"] = 34011] = "TEXTURE27"; + gl[gl["TEXTURE28"] = 34012] = "TEXTURE28"; + gl[gl["TEXTURE29"] = 34013] = "TEXTURE29"; + gl[gl["TEXTURE30"] = 34014] = "TEXTURE30"; + gl[gl["TEXTURE31"] = 34015] = "TEXTURE31"; + gl[gl["ACTIVE_TEXTURE"] = 34016] = "ACTIVE_TEXTURE"; + gl[gl["REPEAT"] = 10497] = "REPEAT"; + gl[gl["CLAMP_TO_EDGE"] = 33071] = "CLAMP_TO_EDGE"; + gl[gl["MIRRORED_REPEAT"] = 33648] = "MIRRORED_REPEAT"; + gl[gl["FLOAT_VEC2"] = 35664] = "FLOAT_VEC2"; + gl[gl["FLOAT_VEC3"] = 35665] = "FLOAT_VEC3"; + gl[gl["FLOAT_VEC4"] = 35666] = "FLOAT_VEC4"; + gl[gl["INT_VEC2"] = 35667] = "INT_VEC2"; + gl[gl["INT_VEC3"] = 35668] = "INT_VEC3"; + gl[gl["INT_VEC4"] = 35669] = "INT_VEC4"; + gl[gl["BOOL"] = 35670] = "BOOL"; + gl[gl["BOOL_VEC2"] = 35671] = "BOOL_VEC2"; + gl[gl["BOOL_VEC3"] = 35672] = "BOOL_VEC3"; + gl[gl["BOOL_VEC4"] = 35673] = "BOOL_VEC4"; + gl[gl["FLOAT_MAT2"] = 35674] = "FLOAT_MAT2"; + gl[gl["FLOAT_MAT3"] = 35675] = "FLOAT_MAT3"; + gl[gl["FLOAT_MAT4"] = 35676] = "FLOAT_MAT4"; + gl[gl["SAMPLER_2D"] = 35678] = "SAMPLER_2D"; + gl[gl["SAMPLER_CUBE"] = 35680] = "SAMPLER_CUBE"; + gl[gl["VERTEX_ATTRIB_ARRAY_ENABLED"] = 34338] = "VERTEX_ATTRIB_ARRAY_ENABLED"; + gl[gl["VERTEX_ATTRIB_ARRAY_SIZE"] = 34339] = "VERTEX_ATTRIB_ARRAY_SIZE"; + gl[gl["VERTEX_ATTRIB_ARRAY_STRIDE"] = 34340] = "VERTEX_ATTRIB_ARRAY_STRIDE"; + gl[gl["VERTEX_ATTRIB_ARRAY_TYPE"] = 34341] = "VERTEX_ATTRIB_ARRAY_TYPE"; + gl[gl["VERTEX_ATTRIB_ARRAY_NORMALIZED"] = 34922] = "VERTEX_ATTRIB_ARRAY_NORMALIZED"; + gl[gl["VERTEX_ATTRIB_ARRAY_POINTER"] = 34373] = "VERTEX_ATTRIB_ARRAY_POINTER"; + gl[gl["VERTEX_ATTRIB_ARRAY_BUFFER_BINDING"] = 34975] = "VERTEX_ATTRIB_ARRAY_BUFFER_BINDING"; + gl[gl["COMPILE_STATUS"] = 35713] = "COMPILE_STATUS"; + gl[gl["LOW_FLOAT"] = 36336] = "LOW_FLOAT"; + gl[gl["MEDIUM_FLOAT"] = 36337] = "MEDIUM_FLOAT"; + gl[gl["HIGH_FLOAT"] = 36338] = "HIGH_FLOAT"; + gl[gl["LOW_INT"] = 36339] = "LOW_INT"; + gl[gl["MEDIUM_INT"] = 36340] = "MEDIUM_INT"; + gl[gl["HIGH_INT"] = 36341] = "HIGH_INT"; + gl[gl["FRAMEBUFFER"] = 36160] = "FRAMEBUFFER"; + gl[gl["RENDERBUFFER"] = 36161] = "RENDERBUFFER"; + gl[gl["RGBA4"] = 32854] = "RGBA4"; + gl[gl["RGB5_A1"] = 32855] = "RGB5_A1"; + gl[gl["RGB565"] = 36194] = "RGB565"; + gl[gl["DEPTH_COMPONENT16"] = 33189] = "DEPTH_COMPONENT16"; + gl[gl["STENCIL_INDEX"] = 6401] = "STENCIL_INDEX"; + gl[gl["STENCIL_INDEX8"] = 36168] = "STENCIL_INDEX8"; + gl[gl["DEPTH_STENCIL"] = 34041] = "DEPTH_STENCIL"; + gl[gl["RENDERBUFFER_WIDTH"] = 36162] = "RENDERBUFFER_WIDTH"; + gl[gl["RENDERBUFFER_HEIGHT"] = 36163] = "RENDERBUFFER_HEIGHT"; + gl[gl["RENDERBUFFER_INTERNAL_FORMAT"] = 36164] = "RENDERBUFFER_INTERNAL_FORMAT"; + gl[gl["RENDERBUFFER_RED_SIZE"] = 36176] = "RENDERBUFFER_RED_SIZE"; + gl[gl["RENDERBUFFER_GREEN_SIZE"] = 36177] = "RENDERBUFFER_GREEN_SIZE"; + gl[gl["RENDERBUFFER_BLUE_SIZE"] = 36178] = "RENDERBUFFER_BLUE_SIZE"; + gl[gl["RENDERBUFFER_ALPHA_SIZE"] = 36179] = "RENDERBUFFER_ALPHA_SIZE"; + gl[gl["RENDERBUFFER_DEPTH_SIZE"] = 36180] = "RENDERBUFFER_DEPTH_SIZE"; + gl[gl["RENDERBUFFER_STENCIL_SIZE"] = 36181] = "RENDERBUFFER_STENCIL_SIZE"; + gl[gl["FRAMEBUFFER_ATTACHMENT_OBJECT_TYPE"] = 36048] = "FRAMEBUFFER_ATTACHMENT_OBJECT_TYPE"; + gl[gl["FRAMEBUFFER_ATTACHMENT_OBJECT_NAME"] = 36049] = "FRAMEBUFFER_ATTACHMENT_OBJECT_NAME"; + gl[gl["FRAMEBUFFER_ATTACHMENT_TEXTURE_LEVEL"] = 36050] = "FRAMEBUFFER_ATTACHMENT_TEXTURE_LEVEL"; + gl[gl["FRAMEBUFFER_ATTACHMENT_TEXTURE_CUBE_MAP_FACE"] = 36051] = "FRAMEBUFFER_ATTACHMENT_TEXTURE_CUBE_MAP_FACE"; + gl[gl["COLOR_ATTACHMENT0"] = 36064] = "COLOR_ATTACHMENT0"; + gl[gl["DEPTH_ATTACHMENT"] = 36096] = "DEPTH_ATTACHMENT"; + gl[gl["STENCIL_ATTACHMENT"] = 36128] = "STENCIL_ATTACHMENT"; + gl[gl["DEPTH_STENCIL_ATTACHMENT"] = 33306] = "DEPTH_STENCIL_ATTACHMENT"; + gl[gl["NONE"] = 0] = "NONE"; + gl[gl["FRAMEBUFFER_COMPLETE"] = 36053] = "FRAMEBUFFER_COMPLETE"; + gl[gl["FRAMEBUFFER_INCOMPLETE_ATTACHMENT"] = 36054] = "FRAMEBUFFER_INCOMPLETE_ATTACHMENT"; + gl[gl["FRAMEBUFFER_INCOMPLETE_MISSING_ATTACHMENT"] = 36055] = "FRAMEBUFFER_INCOMPLETE_MISSING_ATTACHMENT"; + gl[gl["FRAMEBUFFER_INCOMPLETE_DIMENSIONS"] = 36057] = "FRAMEBUFFER_INCOMPLETE_DIMENSIONS"; + gl[gl["FRAMEBUFFER_UNSUPPORTED"] = 36061] = "FRAMEBUFFER_UNSUPPORTED"; + gl[gl["FRAMEBUFFER_BINDING"] = 36006] = "FRAMEBUFFER_BINDING"; + gl[gl["RENDERBUFFER_BINDING"] = 36007] = "RENDERBUFFER_BINDING"; + gl[gl["MAX_RENDERBUFFER_SIZE"] = 34024] = "MAX_RENDERBUFFER_SIZE"; + gl[gl["INVALID_FRAMEBUFFER_OPERATION"] = 1286] = "INVALID_FRAMEBUFFER_OPERATION"; + gl[gl["UNPACK_FLIP_Y_WEBGL"] = 37440] = "UNPACK_FLIP_Y_WEBGL"; + gl[gl["UNPACK_PREMULTIPLY_ALPHA_WEBGL"] = 37441] = "UNPACK_PREMULTIPLY_ALPHA_WEBGL"; + gl[gl["CONTEXT_LOST_WEBGL"] = 37442] = "CONTEXT_LOST_WEBGL"; + gl[gl["UNPACK_COLORSPACE_CONVERSION_WEBGL"] = 37443] = "UNPACK_COLORSPACE_CONVERSION_WEBGL"; + gl[gl["BROWSER_DEFAULT_WEBGL"] = 37444] = "BROWSER_DEFAULT_WEBGL"; + gl[gl["COPY_SRC"] = 1] = "COPY_SRC"; + gl[gl["COPY_DST"] = 2] = "COPY_DST"; + gl[gl["SAMPLED"] = 4] = "SAMPLED"; + gl[gl["STORAGE"] = 8] = "STORAGE"; + gl[gl["RENDER_ATTACHMENT"] = 16] = "RENDER_ATTACHMENT"; +})(gl || (gl = {})); + +var _dec$w, _dec2$l, _dec3$g, _class$w, _class2$l, _descriptor$l, _descriptor2$f, _temp$r; +var GeometrySystem = (_dec$w = inversify.injectable(), _dec2$l = inversify.inject(IDENTIFIER.GeometryComponentManager), _dec3$g = inversify.inject(IDENTIFIER.RenderEngine), _dec$w(_class$w = (_class2$l = (_temp$r = /*#__PURE__*/function () { + function GeometrySystem() { + _classCallCheck(this, GeometrySystem); + + _initializerDefineProperty(this, "geometry", _descriptor$l, this); + + _initializerDefineProperty(this, "engine", _descriptor2$f, this); + } + + _createClass(GeometrySystem, [{ + key: "execute", + value: function () { + var _execute = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee() { + var _this = this; + + return regenerator.wrap(function _callee$(_context) { + while (1) { + switch (_context.prev = _context.next) { + case 0: + this.geometry.forEach(function (entity, component) { + // build buffers for each geometry + if (component.dirty) { + component.attributes.forEach(function (attribute) { + if (attribute.dirty && attribute.data) { + if (!attribute.buffer) { + attribute.buffer = _this.engine.createBuffer({ + data: attribute.data, + type: gl.FLOAT + }); + } else { + var _attribute$buffer; + + (_attribute$buffer = attribute.buffer) === null || _attribute$buffer === void 0 ? void 0 : _attribute$buffer.subData({ + data: attribute.data, + // TODO: support offset in subdata + offset: 0 + }); + } + + attribute.dirty = false; + } + }); // create index buffer if needed + + if (component.indices) { + if (!component.indicesBuffer) { + component.indicesBuffer = _this.engine.createElements({ + data: component.indices, + count: component.indices.length, + type: gl.UNSIGNED_INT, + usage: gl.STATIC_DRAW + }); + } else { + component.indicesBuffer.subData({ + data: component.indices, + offset: 0 + }); + } + } + + component.dirty = false; + } + }); + + case 1: + case "end": + return _context.stop(); + } + } + }, _callee, this); + })); + + function execute() { + return _execute.apply(this, arguments); + } + + return execute; + }() + }, { + key: "tearDown", + value: function tearDown() { + this.geometry.forEach(function (_, geometry) { + if (geometry.indicesBuffer) { + geometry.indicesBuffer.destroy(); + } + + geometry.attributes.forEach(function (attribute) { + if (attribute.buffer) { + attribute.buffer.destroy(); + } + }); + }); + this.geometry.clear(); + } + /** + * @see https://threejs.org/docs/#api/en/core/BufferGeometry + */ + + }, { + key: "createBufferGeometry", + value: function createBufferGeometry() { + var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : { + vertexCount: 3 + }, + vertexCount = _ref.vertexCount; + + var entity = createEntity(); + return this.geometry.create(entity, { + vertexCount: vertexCount + }); + } + /** + * @see https://threejs.org/docs/#api/en/core/InstancedBufferGeometry + */ + + }, { + key: "createInstancedBufferGeometry", + value: function createInstancedBufferGeometry(_ref2) { + var maxInstancedCount = _ref2.maxInstancedCount, + vertexCount = _ref2.vertexCount; + var entity = createEntity(); + return this.geometry.create(entity, { + maxInstancedCount: maxInstancedCount, + vertexCount: vertexCount + }); + } + }]); + + return GeometrySystem; +}(), _temp$r), (_descriptor$l = _applyDecoratedDescriptor(_class2$l.prototype, "geometry", [_dec2$l], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor2$f = _applyDecoratedDescriptor(_class2$l.prototype, "engine", [_dec3$g], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +})), _class2$l)) || _class$w); + +function ownKeys$9(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; } + +function _objectSpread$9(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$9(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$9(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; } + +function _createSuper$d(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$d(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; } + +function _isNativeReflectConstruct$d() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } +var MaterialComponent = /*#__PURE__*/function (_Component) { + _inherits(MaterialComponent, _Component); + + var _super = _createSuper$d(MaterialComponent); + + // control flow in shaders, eg. USE_UV, USE_MAP... + function MaterialComponent(data) { + var _this; + + _classCallCheck(this, MaterialComponent); + + _this = _super.call(this, data); + _this.vertexShaderGLSL = void 0; + _this.fragmentShaderGLSL = void 0; + _this.defines = {}; + _this.dirty = true; + _this.uniforms = []; + _this.cull = { + enable: true, + face: gl.BACK + }; + _this.depth = { + enable: true + }; + _this.blend = void 0; + _this.entity = void 0; + _this.type = void 0; + Object.assign(_assertThisInitialized(_this), data); + return _this; + } + + _createClass(MaterialComponent, [{ + key: "setDefines", + value: function setDefines(defines) { + this.defines = _objectSpread$9(_objectSpread$9({}, this.defines), defines); + return this; + } + }, { + key: "setCull", + value: function setCull(cull) { + this.cull = cull; + return this; + } + }, { + key: "setDepth", + value: function setDepth(depth) { + this.depth = depth; + return this; + } + }, { + key: "setBlend", + value: function setBlend(blend) { + this.blend = blend; + return this; + } + }, { + key: "setUniform", + value: function setUniform(name, data) { + var _this2 = this; + + if (typeof name !== 'string') { + Object.keys(name).forEach(function (key) { + return _this2.setUniform(key, name[key]); + }); + return this; + } + + var existedUniform = this.uniforms.find(function (u) { + return u.name === name; + }); + + if (!existedUniform) { + this.uniforms.push({ + name: name, + dirty: true, + data: data + }); + } else { + existedUniform.dirty = true; + existedUniform.data = data; + } + + this.dirty = true; + return this; + } + }]); + + return MaterialComponent; +}(Component); + +var _dec$v, _dec2$k, _dec3$f, _dec4$a, _class$v, _class2$k, _descriptor$k, _descriptor2$e, _descriptor3$a, _temp$q; + +function ownKeys$8(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; } + +function _objectSpread$8(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$8(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$8(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; } +var MaterialSystem = (_dec$v = inversify.injectable(), _dec2$k = inversify.inject(IDENTIFIER.MaterialComponentManager), _dec3$f = inversify.inject(IDENTIFIER.RenderEngine), _dec4$a = inversify.inject(IDENTIFIER.ShaderModuleService), _dec$v(_class$v = (_class2$k = (_temp$q = /*#__PURE__*/function () { + function MaterialSystem() { + _classCallCheck(this, MaterialSystem); + + _initializerDefineProperty(this, "material", _descriptor$k, this); + + _initializerDefineProperty(this, "engine", _descriptor2$e, this); + + _initializerDefineProperty(this, "shaderModule", _descriptor3$a, this); + } + + _createClass(MaterialSystem, [{ + key: "execute", + value: function () { + var _execute = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee() { + return regenerator.wrap(function _callee$(_context) { + while (1) { + switch (_context.prev = _context.next) { + case 0: + case "end": + return _context.stop(); + } + } + }, _callee); + })); + + function execute() { + return _execute.apply(this, arguments); + } + + return execute; + }() + }, { + key: "tearDown", + value: function tearDown() { + this.material.clear(); + } + /** + * @see https://threejs.org/docs/#api/en/materials/ShaderMaterial + */ + + }, { + key: "createShaderMaterial", + value: function createShaderMaterial(params) { + var entity = createEntity(); + var vertexShaderGLSL = params.vertexShader; + var fragmentShaderGLSL = params.fragmentShader; + var uniforms = []; + + if (!this.engine.supportWebGPU) { + var moduleName = "material-".concat(entity); + this.shaderModule.registerModule(moduleName, { + vs: params.vertexShader, + fs: params.fragmentShader + }); + var materialModule = this.shaderModule.getModule(moduleName); + vertexShaderGLSL = materialModule.vs; + fragmentShaderGLSL = materialModule.fs; + + if (materialModule.uniforms) { + // @ts-ignore + uniforms = Object.keys(materialModule.uniforms).map(function (uniformName) { + return { + dirty: true, + name: uniformName, + // @ts-ignore + data: materialModule.uniforms[uniformName] + }; + }); + } + } + + return this.material.create(entity, _objectSpread$8(_objectSpread$8({ + vertexShaderGLSL: vertexShaderGLSL, + fragmentShaderGLSL: fragmentShaderGLSL + }, params), {}, { + uniforms: uniforms + })); + } + }]); + + return MaterialSystem; +}(), _temp$q), (_descriptor$k = _applyDecoratedDescriptor(_class2$k.prototype, "material", [_dec2$k], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor2$e = _applyDecoratedDescriptor(_class2$k.prototype, "engine", [_dec3$f], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor3$a = _applyDecoratedDescriptor(_class2$k.prototype, "shaderModule", [_dec4$a], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +})), _class2$k)) || _class$v); + +function _createSuper$c(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$c(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; } + +function _isNativeReflectConstruct$c() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } + +/** + * @see https://doc.babylonjs.com/how_to/optimizing_your_scene#changing-mesh-culling-strategy + */ +var Strategy; + +(function (Strategy) { + Strategy[Strategy["Standard"] = 0] = "Standard"; +})(Strategy || (Strategy = {})); + +var CullableComponent = /*#__PURE__*/function (_Component) { + _inherits(CullableComponent, _Component); + + var _super = _createSuper$c(CullableComponent); + + function CullableComponent(data) { + var _this; + + _classCallCheck(this, CullableComponent); + + _this = _super.call(this, data); + _this.strategy = Strategy.Standard; + _this.visibilityPlaneMask = 0; + _this.visible = false; + Object.assign(_assertThisInitialized(_this), data); + return _this; + } + + return CullableComponent; +}(Component); + +/** + * Axis-Aligned Bounding Box + * 为了便于后续 Frustum Culling，通过查找表定义 p-vertex 和 n-vertex + * @see https://github.com/antvis/GWebGPUEngine/issues/3 + */ +var AABB = /*#__PURE__*/function () { + function AABB(center, halfExtents) { + _classCallCheck(this, AABB); + + this.center = void 0; + this.halfExtents = void 0; + this.min = create$4(); + this.max = create$4(); + this.update(center, halfExtents); + } + + _createClass(AABB, [{ + key: "update", + value: function update(center, halfExtents) { + this.center = center || create$4(); + this.halfExtents = halfExtents || fromValues$3(0.5, 0.5, 0.5); + this.min = sub$2(this.min, this.center, this.halfExtents); + this.max = add$4(this.max, this.center, this.halfExtents); + } + }, { + key: "setMinMax", + value: function setMinMax(min, max) { + add$4(this.center, max, min); + scale$5(this.center, this.center, 0.5); + sub$2(this.halfExtents, max, min); + scale$5(this.halfExtents, this.halfExtents, 0.5); + copy$3(this.min, min); + copy$3(this.max, max); + } + }, { + key: "getMin", + value: function getMin() { + return this.min; + } + }, { + key: "getMax", + value: function getMax() { + return this.max; + } + }, { + key: "add", + value: function add(aabb) { + var tc = this.center; + var tcx = tc[0]; + var tcy = tc[1]; + var tcz = tc[2]; + var th = this.halfExtents; + var thx = th[0]; + var thy = th[1]; + var thz = th[2]; + var tminx = tcx - thx; + var tmaxx = tcx + thx; + var tminy = tcy - thy; + var tmaxy = tcy + thy; + var tminz = tcz - thz; + var tmaxz = tcz + thz; + var oc = aabb.center; + var ocx = oc[0]; + var ocy = oc[1]; + var ocz = oc[2]; + var oh = aabb.halfExtents; + var ohx = oh[0]; + var ohy = oh[1]; + var ohz = oh[2]; + var ominx = ocx - ohx; + var omaxx = ocx + ohx; + var ominy = ocy - ohy; + var omaxy = ocy + ohy; + var ominz = ocz - ohz; + var omaxz = ocz + ohz; + + if (ominx < tminx) { + tminx = ominx; + } + + if (omaxx > tmaxx) { + tmaxx = omaxx; + } + + if (ominy < tminy) { + tminy = ominy; + } + + if (omaxy > tmaxy) { + tmaxy = omaxy; + } + + if (ominz < tminz) { + tminz = ominz; + } + + if (omaxz > tmaxz) { + tmaxz = omaxz; + } + + tc[0] = (tminx + tmaxx) * 0.5; + tc[1] = (tminy + tmaxy) * 0.5; + tc[2] = (tminz + tmaxz) * 0.5; + th[0] = (tmaxx - tminx) * 0.5; + th[1] = (tmaxy - tminy) * 0.5; + th[2] = (tmaxz - tminz) * 0.5; + this.min[0] = tminx; + this.min[1] = tminy; + this.min[2] = tminz; + this.max[0] = tmaxx; + this.max[1] = tmaxy; + this.max[2] = tmaxz; + } + }, { + key: "intersects", + value: function intersects(aabb) { + var aMax = this.getMax(); + var aMin = this.getMin(); + var bMax = aabb.getMax(); + var bMin = aabb.getMin(); + return aMin[0] <= bMax[0] && aMax[0] >= bMin[0] && aMin[1] <= bMax[1] && aMax[1] >= bMin[1] && aMin[2] <= bMax[2] && aMax[2] >= bMin[2]; + } + }, { + key: "containsPoint", + value: function containsPoint(point) { + var min = this.getMin(); + var max = this.getMax(); + return !(point[0] < min[0] || point[0] > max[0] || point[1] < min[1] || point[1] > max[1] || point[2] < min[2] || point[2] > max[2]); + } + /** + * get n-vertex + * @param plane plane of CullingVolume + */ + + }, { + key: "getNegativeFarPoint", + value: function getNegativeFarPoint(plane) { + if (plane.pnVertexFlag === 0x111) { + return copy$3(create$4(), this.min); + } else if (plane.pnVertexFlag === 0x110) { + return fromValues$3(this.min[0], this.min[1], this.max[2]); + } else if (plane.pnVertexFlag === 0x101) { + return fromValues$3(this.min[0], this.max[1], this.min[2]); + } else if (plane.pnVertexFlag === 0x100) { + return fromValues$3(this.min[0], this.max[1], this.max[2]); + } else if (plane.pnVertexFlag === 0x011) { + return fromValues$3(this.max[0], this.min[1], this.min[2]); + } else if (plane.pnVertexFlag === 0x010) { + return fromValues$3(this.max[0], this.min[1], this.max[2]); + } else if (plane.pnVertexFlag === 0x001) { + return fromValues$3(this.max[0], this.max[1], this.min[2]); + } else { + return fromValues$3(this.max[0], this.max[1], this.max[2]); + } + } + /** + * get p-vertex + * @param plane plane of CullingVolume + */ + + }, { + key: "getPositiveFarPoint", + value: function getPositiveFarPoint(plane) { + if (plane.pnVertexFlag === 0x111) { + return copy$3(create$4(), this.max); + } else if (plane.pnVertexFlag === 0x110) { + return fromValues$3(this.max[0], this.max[1], this.min[2]); + } else if (plane.pnVertexFlag === 0x101) { + return fromValues$3(this.max[0], this.min[1], this.max[2]); + } else if (plane.pnVertexFlag === 0x100) { + return fromValues$3(this.max[0], this.min[1], this.min[2]); + } else if (plane.pnVertexFlag === 0x011) { + return fromValues$3(this.min[0], this.max[1], this.max[2]); + } else if (plane.pnVertexFlag === 0x010) { + return fromValues$3(this.min[0], this.max[1], this.min[2]); + } else if (plane.pnVertexFlag === 0x001) { + return fromValues$3(this.min[0], this.min[1], this.max[2]); + } else { + return fromValues$3(this.min[0], this.min[1], this.min[2]); + } + } + }]); + + return AABB; +}(); + +function _createSuper$b(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$b(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; } + +function _isNativeReflectConstruct$b() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } +var MeshComponent = /*#__PURE__*/function (_Component) { + _inherits(MeshComponent, _Component); + + var _super = _createSuper$b(MeshComponent); + + /** + * aabb 应该存在 Mesh 而非 Geometry 中，原因包括： + * 1. 包围盒会受 transform 影响。例如每次 transform 之后应该重新计算包围盒（center 发生偏移）。 + * 2. 多个 Mesh 可以共享一个 Geometry，但可以各自拥有不同的 aabb + */ + + /** + * transform 之后需要重新计算包围盒 + */ + + /** + * 实际渲染 Model + */ + function MeshComponent(data) { + var _this; + + _classCallCheck(this, MeshComponent); + + _this = _super.call(this, data); + _this.material = void 0; + _this.geometry = void 0; + _this.aabb = new AABB(); + _this.aabbDirty = true; + _this.model = void 0; + _this.visible = true; + _this.children = []; + Object.assign(_assertThisInitialized(_this), data); + return _this; + } + + return MeshComponent; +}(Component); + +var Plane$1 = /*#__PURE__*/function () { + /** + * lookup table for p-vertex & n-vertex when doing frustum culling + */ + function Plane(distance, normal) { + _classCallCheck(this, Plane); + + this.distance = void 0; + this.normal = void 0; + this.pnVertexFlag = void 0; + this.distance = distance || 0; + this.normal = normal || fromValues$3(0, 1, 0); + this.updatePNVertexFlag(); + } + + _createClass(Plane, [{ + key: "updatePNVertexFlag", + value: function updatePNVertexFlag() { + this.pnVertexFlag = (Number(this.normal[0] >= 0) << 8) + (Number(this.normal[1] >= 0) << 4) + Number(this.normal[2] >= 0); + } + }, { + key: "distanceToPoint", + value: function distanceToPoint(point) { + return dot$4(point, this.normal) - this.distance; + } + }, { + key: "normalize", + value: function normalize() { + var invLen = 1 / len$2(this.normal); + scale$5(this.normal, this.normal, invLen); + this.distance *= invLen; + } + }, { + key: "intersectsLine", + value: function intersectsLine(start, end, point) { + var d0 = this.distanceToPoint(start); + var d1 = this.distanceToPoint(end); + var t = d0 / (d0 - d1); + var intersects = t >= 0 && t <= 1; + + if (intersects && point) { + lerp$2(point, start, end, t); + } + + return intersects; + } + }]); + + return Plane; +}(); + +var Mask; + +(function (Mask) { + Mask[Mask["OUTSIDE"] = 4294967295] = "OUTSIDE"; + Mask[Mask["INSIDE"] = 0] = "INSIDE"; + Mask[Mask["INDETERMINATE"] = 2147483647] = "INDETERMINATE"; +})(Mask || (Mask = {})); + +var Frustum = /*#__PURE__*/function () { + function Frustum(planes) { + _classCallCheck(this, Frustum); + + this.planes = []; + + if (planes) { + this.planes = planes; + } else { + for (var i = 0; i < 6; i++) { + this.planes.push(new Plane$1()); + } + } + } + /** + * extract 6 planes from vpMatrix + * @see http://www8.cs.umu.se/kurser/5DV051/HT12/lab/plane_extraction.pdf + * @param vpMatrix viewProjectionMatrix + */ + + + _createClass(Frustum, [{ + key: "extractFromVPMatrix", + value: function extractFromVPMatrix(vpMatrix) { + var _vpMatrix = _slicedToArray(vpMatrix, 16), + m0 = _vpMatrix[0], + m1 = _vpMatrix[1], + m2 = _vpMatrix[2], + m3 = _vpMatrix[3], + m4 = _vpMatrix[4], + m5 = _vpMatrix[5], + m6 = _vpMatrix[6], + m7 = _vpMatrix[7], + m8 = _vpMatrix[8], + m9 = _vpMatrix[9], + m10 = _vpMatrix[10], + m11 = _vpMatrix[11], + m12 = _vpMatrix[12], + m13 = _vpMatrix[13], + m14 = _vpMatrix[14], + m15 = _vpMatrix[15]; // right + + + set$3(this.planes[0].normal, m3 - m0, m7 - m4, m11 - m8); + this.planes[0].distance = -(m15 - m12); // left + + set$3(this.planes[1].normal, m3 + m0, m7 + m4, m11 + m8); + this.planes[1].distance = -(m15 + m12); // bottom + + set$3(this.planes[2].normal, m3 + m1, m7 + m5, m11 + m9); + this.planes[2].distance = -(m15 + m13); // top + + set$3(this.planes[3].normal, m3 - m1, m7 - m5, m11 - m9); + this.planes[3].distance = -(m15 - m13); // far + + set$3(this.planes[4].normal, m3 - m2, m7 - m6, m11 - m10); + this.planes[4].distance = -(m15 - m14); // near + + set$3(this.planes[5].normal, m3 + m2, m7 + m6, m11 + m10); + this.planes[5].distance = -(m15 + m14); + this.planes.forEach(function (plane) { + plane.normalize(); + plane.updatePNVertexFlag(); + }); + } + }]); + + return Frustum; +}(); + +function getRotationScale(matrix, result) { + result[0] = matrix[0]; + result[1] = matrix[1]; + result[2] = matrix[2]; + result[3] = matrix[4]; + result[4] = matrix[5]; + result[5] = matrix[6]; + result[6] = matrix[8]; + result[7] = matrix[9]; + result[8] = matrix[10]; + return result; +} +function decodePickingColor(color) { + var _color = _slicedToArray(color, 3), + i1 = _color[0], + i2 = _color[1], + i3 = _color[2]; // 1 was added to seperate from no selection + + + var index = i1 + i2 * 256 + i3 * 65536 - 1; + return index; +} + +var _dec$u, _dec2$j, _dec3$e, _dec4$9, _dec5$7, _dec6$6, _class$u, _class2$j, _descriptor$j, _descriptor2$d, _descriptor3$9, _descriptor4$4, _descriptor5$1, _temp$p; + +function _createForOfIteratorHelper$3(o, allowArrayLike) { var it; if (typeof Symbol === "undefined" || o[Symbol.iterator] == null) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$3(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = o[Symbol.iterator](); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; } + +function _unsupportedIterableToArray$3(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$3(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$3(o, minLen); } + +function _arrayLikeToArray$3(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; } +var MeshSystem = (_dec$u = inversify.injectable(), _dec2$j = inversify.inject(IDENTIFIER.MeshComponentManager), _dec3$e = inversify.inject(IDENTIFIER.CullableComponentManager), _dec4$9 = inversify.inject(IDENTIFIER.GeometryComponentManager), _dec5$7 = inversify.inject(IDENTIFIER.HierarchyComponentManager), _dec6$6 = inversify.inject(IDENTIFIER.TransformComponentManager), _dec$u(_class$u = (_class2$j = (_temp$p = /*#__PURE__*/function () { + function MeshSystem() { + _classCallCheck(this, MeshSystem); + + _initializerDefineProperty(this, "mesh", _descriptor$j, this); + + _initializerDefineProperty(this, "cullable", _descriptor2$d, this); + + _initializerDefineProperty(this, "geometry", _descriptor3$9, this); + + _initializerDefineProperty(this, "hierarchy", _descriptor4$4, this); + + _initializerDefineProperty(this, "transform", _descriptor5$1, this); + + this.planes = void 0; + } + + _createClass(MeshSystem, [{ + key: "setFrustumPlanes", + value: function setFrustumPlanes(planes) { + this.planes = planes; + } + }, { + key: "execute", + value: function () { + var _execute = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee(views) { + var _iterator, _step, view, scene, camera, _iterator2, _step2, entity, component, hierarchyComponent, cullableComponent, geometryComponent, meshTransform, worldTransform, _geometryComponent$aa, center, halfExtents, transformedCenter, rotationScale, transformedHalfExtents, parentCullableComponent; + + return regenerator.wrap(function _callee$(_context) { + while (1) { + switch (_context.prev = _context.next) { + case 0: + _iterator = _createForOfIteratorHelper$3(views); + + try { + for (_iterator.s(); !(_step = _iterator.n()).done;) { + view = _step.value; + scene = view.getScene(); + camera = view.getCamera(); // get VP matrix from camera + + _iterator2 = _createForOfIteratorHelper$3(scene.getEntities()); + + try { + for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) { + entity = _step2.value; + component = this.mesh.getComponentByEntity(entity); + + if (component) { + hierarchyComponent = this.hierarchy.getComponentByEntity(entity); + cullableComponent = this.cullable.getComponentByEntity(entity); + geometryComponent = component.geometry; + meshTransform = this.transform.getComponentByEntity(entity); // update mesh.aabb + + if (geometryComponent && geometryComponent.aabb && meshTransform && component.aabbDirty) { + worldTransform = meshTransform.worldTransform; // apply transform to geometry.aabb + + _geometryComponent$aa = geometryComponent.aabb, center = _geometryComponent$aa.center, halfExtents = _geometryComponent$aa.halfExtents; + transformedCenter = transformMat4$2(create$4(), center, worldTransform); + rotationScale = getRotationScale(worldTransform, create$6()); + transformedHalfExtents = transformMat3$2(create$4(), halfExtents, rotationScale); + component.aabb.update(transformedCenter, transformedHalfExtents); + component.aabbDirty = false; + } // culling + + + if (cullableComponent && geometryComponent) { + parentCullableComponent = this.cullable.getComponentByEntity((hierarchyComponent === null || hierarchyComponent === void 0 ? void 0 : hierarchyComponent.parentID) || -1); + cullableComponent.visibilityPlaneMask = this.computeVisibilityWithPlaneMask(component.aabb, (parentCullableComponent === null || parentCullableComponent === void 0 ? void 0 : parentCullableComponent.visibilityPlaneMask) || Mask.INDETERMINATE, this.planes || camera.getFrustum().planes); + cullableComponent.visible = cullableComponent.visibilityPlaneMask !== Mask.OUTSIDE; + } + } + } + } catch (err) { + _iterator2.e(err); + } finally { + _iterator2.f(); + } + } + } catch (err) { + _iterator.e(err); + } finally { + _iterator.f(); + } + + case 2: + case "end": + return _context.stop(); + } + } + }, _callee, this); + })); + + function execute(_x) { + return _execute.apply(this, arguments); + } + + return execute; + }() + }, { + key: "tearDown", + value: function tearDown() { + this.cullable.clear(); + this.mesh.clear(); + } + /** + * + * @see「Optimized View Frustum Culling Algorithms for Bounding Boxes」 + * @see https://github.com/antvis/GWebGPUEngine/issues/3 + * + * * 基础相交测试 the basic intersection test + * * 标记 masking @see https://cesium.com/blog/2015/08/04/fast-hierarchical-culling/ + * * TODO: 平面一致性测试 the plane-coherency test + * * TODO: 支持 mesh 指定自身的剔除策略，参考 Babylon.js @see https://doc.babylonjs.com/how_to/optimizing_your_scene#changing-mesh-culling-strategy + * + * @param aabb aabb + * @param parentPlaneMask mask of parent + * @param planes planes of frustum + */ + + }, { + key: "computeVisibilityWithPlaneMask", + value: function computeVisibilityWithPlaneMask(aabb, parentPlaneMask, planes) { + if (parentPlaneMask === Mask.OUTSIDE || parentPlaneMask === Mask.INSIDE) { + // 父节点完全位于视锥内或者外部，直接返回 + return parentPlaneMask; + } // Start with MASK_INSIDE (all zeros) so that after the loop, the return value can be compared with MASK_INSIDE. + // (Because if there are fewer than 31 planes, the upper bits wont be changed.) + + + var mask = Mask.INSIDE; + + for (var k = 0, len = planes.length; k < len; ++k) { + // For k greater than 31 (since 31 is the maximum number of INSIDE/INTERSECTING bits we can store), skip the optimization. + var flag = k < 31 ? 1 << k : 0; + + if (k < 31 && (parentPlaneMask & flag) === 0) { + // 父节点处于当前面内部，可以跳过 + continue; + } // 使用 p-vertex 和 n-vertex 加速，避免进行平面和 aabb 全部顶点的相交检测 + + + var _planes$k = planes[k], + normal = _planes$k.normal, + distance = _planes$k.distance; + + if (dot$4(normal, aabb.getNegativeFarPoint(planes[k])) + distance > 0) { + return Mask.OUTSIDE; + } + + if (dot$4(normal, aabb.getPositiveFarPoint(planes[k])) + distance > 0) { + // 和当前面相交，对应位置为1，继续检测下一个面 + mask |= flag; + } + } + + return mask; + } + }]); + + return MeshSystem; +}(), _temp$p), (_descriptor$j = _applyDecoratedDescriptor(_class2$j.prototype, "mesh", [_dec2$j], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor2$d = _applyDecoratedDescriptor(_class2$j.prototype, "cullable", [_dec3$e], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor3$9 = _applyDecoratedDescriptor(_class2$j.prototype, "geometry", [_dec4$9], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor4$4 = _applyDecoratedDescriptor(_class2$j.prototype, "hierarchy", [_dec5$7], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor5$1 = _applyDecoratedDescriptor(_class2$j.prototype, "transform", [_dec6$6], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +})), _class2$j)) || _class$u); + +var _dec$t, _dec2$i, _dec3$d, _dec4$8, _dec5$6, _dec6$5, _dec7, _dec8, _dec9, _dec10, _dec11, _class$t, _class2$i, _descriptor$i, _descriptor2$c, _descriptor3$8, _descriptor4$3, _descriptor5, _descriptor6, _descriptor7, _descriptor8, _descriptor9, _class3$6, _temp$o; + +function _createForOfIteratorHelper$2(o, allowArrayLike) { var it; if (typeof Symbol === "undefined" || o[Symbol.iterator] == null) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$2(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = o[Symbol.iterator](); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; } + +function _unsupportedIterableToArray$2(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$2(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$2(o, minLen); } + +function _arrayLikeToArray$2(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; } +var RenderPass = (_dec$t = inversify.injectable(), _dec2$i = inversify.inject(IDENTIFIER.MeshComponentManager), _dec3$d = inversify.inject(IDENTIFIER.GeometryComponentManager), _dec4$8 = inversify.inject(IDENTIFIER.MaterialComponentManager), _dec5$6 = inversify.inject(IDENTIFIER.CullableComponentManager), _dec6$5 = inversify.inject(IDENTIFIER.TransformComponentManager), _dec7 = inversify.inject(IDENTIFIER.HierarchyComponentManager), _dec8 = inversify.inject(IDENTIFIER.Systems), _dec9 = inversify.named(IDENTIFIER.FrameGraphSystem), _dec10 = inversify.inject(IDENTIFIER.RenderEngine), _dec11 = inversify.inject(IDENTIFIER.ResourcePool), _dec$t(_class$t = (_class2$i = (_temp$o = _class3$6 = /*#__PURE__*/function () { + function RenderPass() { + var _this = this; + + _classCallCheck(this, RenderPass); + + _initializerDefineProperty(this, "mesh", _descriptor$i, this); + + _initializerDefineProperty(this, "geometry", _descriptor2$c, this); + + _initializerDefineProperty(this, "material", _descriptor3$8, this); + + _initializerDefineProperty(this, "cullable", _descriptor4$3, this); + + _initializerDefineProperty(this, "transform", _descriptor5, this); + + _initializerDefineProperty(this, "hierarchy", _descriptor6, this); + + _initializerDefineProperty(this, "frameGraphSystem", _descriptor7, this); + + _initializerDefineProperty(this, "engine", _descriptor8, this); + + _initializerDefineProperty(this, "resourcePool", _descriptor9, this); + + this.modelCache = {}; + + this.setup = function (fg, passNode, pass) { + var output = fg.createRenderTarget(passNode, 'color buffer', { + width: 1, + height: 1, + usage: gl.RENDER_ATTACHMENT | gl.SAMPLED | gl.COPY_SRC + }); + pass.data = { + output: passNode.write(fg, output) + }; + }; + + this.execute = /*#__PURE__*/function () { + var _ref = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee(fg, pass, views) { + var resourceNode, framebuffer, _iterator, _step, view, canvas; + + return regenerator.wrap(function _callee$(_context) { + while (1) { + switch (_context.prev = _context.next) { + case 0: + resourceNode = fg.getResourceNode(pass.data.output); + framebuffer = _this.resourcePool.getOrCreateResource(resourceNode.resource); // initialize model of each mesh + + _iterator = _createForOfIteratorHelper$2(views); + _context.prev = 3; + + _iterator.s(); + + case 5: + if ((_step = _iterator.n()).done) { + _context.next = 11; + break; + } + + view = _step.value; + _context.next = 9; + return _this.initView(view); + + case 9: + _context.next = 5; + break; + + case 11: + _context.next = 16; + break; + + case 13: + _context.prev = 13; + _context.t0 = _context["catch"](3); + + _iterator.e(_context.t0); + + case 16: + _context.prev = 16; + + _iterator.f(); + + return _context.finish(16); + + case 19: + canvas = _this.engine.getCanvas(); + framebuffer.resize({ + width: canvas.width, + height: canvas.height + }); + + _this.engine.setScissor({ + enable: false + }); + + _this.engine.clear({ + framebuffer: framebuffer, + color: views[0].getClearColor(), + // TODO: use clearColor defined in view + depth: 1 + }); + + _this.engine.useFramebuffer(framebuffer, function () { + var _iterator2 = _createForOfIteratorHelper$2(views), + _step2; + + try { + for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) { + var view = _step2.value; + + // must do rendering in a sync way + _this.renderView(view); + } + } catch (err) { + _iterator2.e(err); + } finally { + _iterator2.f(); + } + }); + + case 24: + case "end": + return _context.stop(); + } + } + }, _callee, null, [[3, 13, 16, 19]]); + })); + + return function (_x, _x2, _x3) { + return _ref.apply(this, arguments); + }; + }(); + } + + _createClass(RenderPass, [{ + key: "renderView", + value: function renderView(view) { + var scene = view.getScene(); + var camera = view.getCamera(); // get VP matrix from camera + + var viewMatrix = camera.getViewTransform(); + var viewProjectionMatrix = multiply$3(create$5(), camera.getPerspective(), viewMatrix); // TODO: use cached planes if camera was not changed + + camera.getFrustum().extractFromVPMatrix(viewProjectionMatrix); + + var _view$getViewport = view.getViewport(), + x = _view$getViewport.x, + y = _view$getViewport.y, + width = _view$getViewport.width, + height = _view$getViewport.height; + + this.engine.viewport({ + x: x, + y: y, + width: width, + height: height + }); // this.engine.setScissor({ + // enable: true, + // box: { x, y, width, height }, + // }); + // this.engine.clear({ + // // framebuffer, + // color: [1, 1, 1, 1], // TODO: use clearColor defined in view + // depth: 1, + // }); + + var _iterator3 = _createForOfIteratorHelper$2(scene.getEntities()), + _step3; + + try { + for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) { + var meshEntity = _step3.value; + this.renderMesh(meshEntity, { + camera: camera, + view: view, + viewMatrix: viewMatrix + }); + } + } catch (err) { + _iterator3.e(err); + } finally { + _iterator3.f(); + } + } + }, { + key: "renderMesh", + value: function renderMesh(meshEntity, _ref2) { + var camera = _ref2.camera, + view = _ref2.view, + viewMatrix = _ref2.viewMatrix; + var mesh = this.mesh.getComponentByEntity(meshEntity); + + if (!mesh || !mesh.visible) { + return; + } // filter meshes with frustum culling + // if (!this.cullable.getComponentByEntity(meshEntity)?.visible) { + // return; + // } + + + var material = mesh.material; + var geometry = mesh.geometry; // geometry 在自己的 System 中完成脏检查后的更新 + + if (!geometry || geometry.dirty || !material) { + return; + } // get model matrix from mesh + + + var transform = this.transform.getComponentByEntity(meshEntity); + var modelViewMatrix = multiply$3(create$5(), viewMatrix, transform.worldTransform); + + var _view$getViewport2 = view.getViewport(), + width = _view$getViewport2.width, + height = _view$getViewport2.height; // set MVP matrix, other builtin uniforms @see https://threejs.org/docs/#api/en/renderers/webgl/WebGLProgram + + + material.setUniform({ + projectionMatrix: camera.getPerspective(), + modelViewMatrix: modelViewMatrix, + modelMatrix: transform.worldTransform, + viewMatrix: viewMatrix, + cameraPosition: camera.getPosition(), + u_viewport: [width, height] + }); + + if (mesh.model) { + mesh.model.draw({ + uniforms: material.uniforms.reduce(function (cur, prev) { + cur[prev.name] = prev.data; + return cur; + }, {}) + }); + material.uniforms.forEach(function (u) { + u.dirty = false; + }); + material.dirty = false; + } + } + }, { + key: "initMesh", + value: function () { + var _initMesh = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee2(meshEntity, view) { + var mesh, material, geometry, modelCacheKey, _this$engine, createModel, createAttribute, modelInitializationOptions; + + return regenerator.wrap(function _callee2$(_context2) { + while (1) { + switch (_context2.prev = _context2.next) { + case 0: + mesh = this.mesh.getComponentByEntity(meshEntity); + + if (mesh) { + _context2.next = 3; + break; + } + + return _context2.abrupt("return"); + + case 3: + material = mesh.material; + geometry = mesh.geometry; + + if (!(!geometry || geometry.dirty || !material)) { + _context2.next = 7; + break; + } + + return _context2.abrupt("return"); + + case 7: + if (mesh.model) { + _context2.next = 24; + break; + } + + modelCacheKey = "m-".concat(material.entity, "-g-").concat(geometry.entity); + + if (!this.modelCache[modelCacheKey]) { + _context2.next = 12; + break; + } + + mesh.model = this.modelCache[modelCacheKey]; + return _context2.abrupt("return"); + + case 12: + material.setUniform({ + projectionMatrix: 1, + modelViewMatrix: 1, + modelMatrix: 1, + viewMatrix: 1, + cameraPosition: 1, + u_viewport: 1 + }); + _this$engine = this.engine, createModel = _this$engine.createModel, createAttribute = _this$engine.createAttribute; + modelInitializationOptions = { + vs: material.vertexShaderGLSL, + fs: material.fragmentShaderGLSL, + defines: material.defines, + attributes: geometry.attributes.reduce(function (cur, prev) { + if (prev.data && prev.buffer) { + cur[prev.name] = createAttribute({ + buffer: prev.buffer, + attributes: prev.attributes, + arrayStride: prev.arrayStride, + stepMode: prev.stepMode, + divisor: prev.stepMode === 'vertex' ? 0 : 1 + }); + } + + return cur; + }, {}), + uniforms: material.uniforms.reduce(function (cur, prev) { + cur[prev.name] = prev.data; + return cur; + }, {}), + scissor: { + enable: true, + // @ts-ignore + box: function box() { + return view.getViewport(); + } + } + }; + + if (material.cull) { + modelInitializationOptions.cull = material.cull; + } + + if (material.depth) { + modelInitializationOptions.depth = material.depth; + } + + if (material.blend) { + modelInitializationOptions.blend = material.blend; + } + + if (geometry.indicesBuffer) { + modelInitializationOptions.elements = geometry.indicesBuffer; + } + + if (geometry.maxInstancedCount) { + modelInitializationOptions.instances = geometry.maxInstancedCount; + modelInitializationOptions.count = geometry.vertexCount || 3; + } + + _context2.next = 22; + return createModel(modelInitializationOptions); + + case 22: + mesh.model = _context2.sent; + this.modelCache[modelCacheKey] = mesh.model; + + case 24: + case "end": + return _context2.stop(); + } + } + }, _callee2, this); + })); + + function initMesh(_x4, _x5) { + return _initMesh.apply(this, arguments); + } + + return initMesh; + }() + }, { + key: "initView", + value: function () { + var _initView = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee3(view) { + var scene, _iterator4, _step4, meshEntity; + + return regenerator.wrap(function _callee3$(_context3) { + while (1) { + switch (_context3.prev = _context3.next) { + case 0: + scene = view.getScene(); + _iterator4 = _createForOfIteratorHelper$2(scene.getEntities()); + _context3.prev = 2; + + _iterator4.s(); + + case 4: + if ((_step4 = _iterator4.n()).done) { + _context3.next = 10; + break; + } + + meshEntity = _step4.value; + _context3.next = 8; + return this.initMesh(meshEntity, view); + + case 8: + _context3.next = 4; + break; + + case 10: + _context3.next = 15; + break; + + case 12: + _context3.prev = 12; + _context3.t0 = _context3["catch"](2); + + _iterator4.e(_context3.t0); + + case 15: + _context3.prev = 15; + + _iterator4.f(); + + return _context3.finish(15); + + case 18: + case "end": + return _context3.stop(); + } + } + }, _callee3, this, [[2, 12, 15, 18]]); + })); + + function initView(_x6) { + return _initView.apply(this, arguments); + } + + return initView; + }() + }]); + + return RenderPass; +}(), _class3$6.IDENTIFIER = 'Render Pass', _temp$o), (_descriptor$i = _applyDecoratedDescriptor(_class2$i.prototype, "mesh", [_dec2$i], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor2$c = _applyDecoratedDescriptor(_class2$i.prototype, "geometry", [_dec3$d], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor3$8 = _applyDecoratedDescriptor(_class2$i.prototype, "material", [_dec4$8], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor4$3 = _applyDecoratedDescriptor(_class2$i.prototype, "cullable", [_dec5$6], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor5 = _applyDecoratedDescriptor(_class2$i.prototype, "transform", [_dec6$5], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor6 = _applyDecoratedDescriptor(_class2$i.prototype, "hierarchy", [_dec7], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor7 = _applyDecoratedDescriptor(_class2$i.prototype, "frameGraphSystem", [_dec8, _dec9], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor8 = _applyDecoratedDescriptor(_class2$i.prototype, "engine", [_dec10], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor9 = _applyDecoratedDescriptor(_class2$i.prototype, "resourcePool", [_dec11], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +})), _class2$i)) || _class$t); + +var _dec$s, _dec2$h, _dec3$c, _dec4$7, _dec5$5, _class$s, _class2$h, _descriptor$h, _descriptor2$b, _descriptor3$7, _descriptor4$2, _class3$5, _temp$n; + +function _createForOfIteratorHelper$1(o, allowArrayLike) { var it; if (typeof Symbol === "undefined" || o[Symbol.iterator] == null) { if (Array.isArray(o) || (it = _unsupportedIterableToArray$1(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = o[Symbol.iterator](); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; } + +function _unsupportedIterableToArray$1(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray$1(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray$1(o, minLen); } + +function _arrayLikeToArray$1(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; } +var PickingStage = { + NONE: 0.0, + ENCODE: 1.0, + HIGHLIGHT: 2.0 +}; +/** + * color-based picking + * @see https://threejsfundamentals.org/threejs/lessons/threejs-picking.html + */ + +var PixelPickingPass = (_dec$s = inversify.injectable(), _dec2$h = inversify.inject(IDENTIFIER.RenderEngine), _dec3$c = inversify.inject(IDENTIFIER.ResourcePool), _dec4$7 = inversify.inject(IDENTIFIER.RenderPassFactory), _dec5$5 = inversify.inject(IDENTIFIER.MeshComponentManager), _dec$s(_class$s = (_class2$h = (_temp$n = _class3$5 = /*#__PURE__*/function () { + function PixelPickingPass() { + var _this = this; + + _classCallCheck(this, PixelPickingPass); + + _initializerDefineProperty(this, "engine", _descriptor$h, this); + + _initializerDefineProperty(this, "resourcePool", _descriptor2$b, this); + + _initializerDefineProperty(this, "renderPassFactory", _descriptor3$7, this); + + _initializerDefineProperty(this, "mesh", _descriptor4$2, this); + + this.pickingFBO = void 0; + this.views = void 0; + this.highlightEnabled = true; + this.highlightColor = [255, 0, 0, 255]; + this.alreadyInRendering = false; + + this.setup = function (fg, passNode, pass) { + var output = fg.createRenderTarget(passNode, 'picking fbo', { + width: 1, + height: 1 + }); + pass.data = { + output: passNode.write(fg, output) + }; // 防止被 FrameGraph 剔除 + + passNode.hasSideEffect = true; + }; + + this.execute = /*#__PURE__*/function () { + var _ref = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee(fg, pass, views) { + var _iterator, _step, _loop; + + return regenerator.wrap(function _callee$(_context) { + while (1) { + switch (_context.prev = _context.next) { + case 0: + _this.views = views; + + if (!_this.alreadyInRendering) { + _context.next = 3; + break; + } + + return _context.abrupt("return"); + + case 3: + _iterator = _createForOfIteratorHelper$1(views); + + try { + _loop = function _loop() { + var view = _step.value; + + var _view$getViewport = view.getViewport(), + width = _view$getViewport.width, + height = _view$getViewport.height; // throttled + + + _this.alreadyInRendering = true; // 实例化资源 + + var resourceNode = fg.getResourceNode(pass.data.output); + _this.pickingFBO = _this.resourcePool.getOrCreateResource(resourceNode.resource); // TODO: only draw 1x1 quad, with offset camera + + _this.pickingFBO.resize({ + width: width, + height: height + }); + + _this.engine.useFramebuffer(_this.pickingFBO, function () { + _this.engine.clear({ + framebuffer: _this.pickingFBO, + color: [0, 0, 0, 0], + stencil: 0, + depth: 1 + }); // 渲染 + + + var renderPass = _this.renderPassFactory(RenderPass.IDENTIFIER); // 修改所有 + + + var meshes = []; + var scene = view.getScene(); + + var _iterator2 = _createForOfIteratorHelper$1(scene.getEntities()), + _step2; + + try { + for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) { + var meshEntity = _step2.value; + + var mesh = _this.mesh.getComponentByEntity(meshEntity); + + var material = mesh.material; + material.setUniform('u_PickingStage', PickingStage.ENCODE); + meshes.push(mesh); + } // @ts-ignore + + } catch (err) { + _iterator2.e(err); + } finally { + _iterator2.f(); + } + + renderPass.renderView(view); + meshes.forEach(function (mesh) { + var material = mesh.material; + material.setUniform('u_PickingStage', PickingStage.HIGHLIGHT); + }); + _this.alreadyInRendering = false; + }); + }; + + for (_iterator.s(); !(_step = _iterator.n()).done;) { + _loop(); + } + } catch (err) { + _iterator.e(err); + } finally { + _iterator.f(); + } + + case 5: + case "end": + return _context.stop(); + } + } + }, _callee); + })); + + return function (_x, _x2, _x3) { + return _ref.apply(this, arguments); + }; + }(); + + this.pick = function (_ref2, view) { + var x = _ref2.x, + y = _ref2.y; + var _this$engine = _this.engine, + readPixels = _this$engine.readPixels, + useFramebuffer = _this$engine.useFramebuffer; + + var _view$getViewport2 = view.getViewport(), + width = _view$getViewport2.width, + height = _view$getViewport2.height; + + var xInDevicePixel = x * window.devicePixelRatio; + var yInDevicePixel = y * window.devicePixelRatio; // const xInDevicePixel = x; + // const yInDevicePixel = y; + + if (xInDevicePixel > width || xInDevicePixel < 0 || yInDevicePixel > height || yInDevicePixel < 0) { + return; + } + + var pickedColors; + var pickedFeatureIdx; + useFramebuffer(_this.pickingFBO, function () { + // avoid realloc + pickedColors = readPixels({ + x: Math.round(xInDevicePixel), + // 视口坐标系原点在左上，而 WebGL 在左下，需要翻转 Y 轴 + y: Math.round(height - (y + 1) * window.devicePixelRatio), + // y: Math.round(height - (y + 1)), + width: 1, + height: 1, + data: new Uint8Array(1 * 1 * 4), + framebuffer: _this.pickingFBO + }); + + if (pickedColors[0] !== 0 || pickedColors[1] !== 0 || pickedColors[2] !== 0) { + pickedFeatureIdx = decodePickingColor(pickedColors); + + if (_this.highlightEnabled) { + // 高亮 + _this.highlightPickedFeature(pickedColors, view); + } + } + }); + return pickedFeatureIdx; + }; + } + + _createClass(PixelPickingPass, [{ + key: "enableHighlight", + value: function enableHighlight(enabled) { + this.highlightEnabled = enabled; + } + }, { + key: "setHighlightColor", + value: function setHighlightColor(color) { + this.highlightColor = color; + } + }, { + key: "highlightPickedFeature", + + /** + * highlight 如果直接修改选中 feature 的 buffer，存在两个问题： + * 1. 鼠标移走时无法恢复 + * 2. 无法实现高亮颜色与原始原色的 alpha 混合 + * 因此高亮还是放在 shader 中做比较好 + */ + value: function highlightPickedFeature(pickedColors, view) { + if (pickedColors) { + var _iterator3 = _createForOfIteratorHelper$1(view.getScene().getEntities()), + _step3; + + try { + for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) { + var meshEntity = _step3.value; + var mesh = this.mesh.getComponentByEntity(meshEntity); + var material = mesh.material; + material.setUniform('u_PickingStage', PickingStage.HIGHLIGHT); + material.setUniform('u_PickingColor', [pickedColors[0], pickedColors[1], pickedColors[2]]); + material.setUniform('u_HighlightColor', this.highlightColor); + } + } catch (err) { + _iterator3.e(err); + } finally { + _iterator3.f(); + } + } + } + }]); + + return PixelPickingPass; +}(), _class3$5.IDENTIFIER = 'PixelPicking Pass', _temp$n), (_descriptor$h = _applyDecoratedDescriptor(_class2$h.prototype, "engine", [_dec2$h], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor2$b = _applyDecoratedDescriptor(_class2$h.prototype, "resourcePool", [_dec3$c], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor3$7 = _applyDecoratedDescriptor(_class2$h.prototype, "renderPassFactory", [_dec4$7], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor4$2 = _applyDecoratedDescriptor(_class2$h.prototype, "mesh", [_dec5$5], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +})), _class2$h)) || _class$s); + +var _dec$r, _dec2$g, _dec3$b, _class$r, _class2$g, _descriptor$g, _descriptor2$a, _class3$4, _temp$m; + +/* babel-plugin-inline-import '../../../services/shader-module/shaders/webgl.copy.frag.glsl' */ +var copyFrag = "varying vec2 v_UV;\n\nuniform sampler2D u_Texture;\n\nvoid main() {\n gl_FragColor = vec4(texture2D(u_Texture, v_UV));\n}"; + +/* babel-plugin-inline-import '../../../services/shader-module/shaders/webgl.copy.vert.glsl' */ +var copyVert = "attribute vec2 a_Position;\n\nvarying vec2 v_UV;\n\nvoid main() {\n v_UV = 0.5 * (a_Position + 1.0);\n gl_Position = vec4(a_Position, 0., 1.);\n}"; + +/* babel-plugin-inline-import '../../../services/shader-module/shaders/webgpu.copy.frag.glsl' */ +var copyFragWebGPU = "layout(set = 0, binding = 0) uniform sampler u_TextureSampler;\nlayout(set = 0, binding = 1) uniform texture2D u_Texture;\n\nlayout(location = 0) in vec2 v_UV;\nlayout(location = 0) out vec4 outColor;\n\nvoid main() {\n outColor = texture(sampler2D(u_Texture, u_TextureSampler), v_UV);\n}"; + +/* babel-plugin-inline-import '../../../services/shader-module/shaders/webgpu.copy.vert.glsl' */ +var copyVertWebGPU = "layout(location = 0) in vec2 a_Position;\nlayout(location = 0) out vec2 v_UV;\n\nvoid main() {\n v_UV = 0.5 * (a_Position + 1.0);\n gl_Position = vec4(a_Position, 0., 1.);\n}"; +var CopyPass = (_dec$r = inversify.injectable(), _dec2$g = inversify.inject(IDENTIFIER.RenderEngine), _dec3$b = inversify.inject(IDENTIFIER.ResourcePool), _dec$r(_class$r = (_class2$g = (_temp$m = _class3$4 = function CopyPass() { + var _this = this; + + _classCallCheck(this, CopyPass); + + _initializerDefineProperty(this, "engine", _descriptor$g, this); + + _initializerDefineProperty(this, "resourcePool", _descriptor2$a, this); + + this.model = void 0; + + this.setup = function (fg, passNode, pass) { + var renderPass = fg.getPass(RenderPass.IDENTIFIER); + + if (renderPass) { + var output = fg.createRenderTarget(passNode, 'render to screen', { + width: 1, + height: 1 + }); + pass.data = { + input: passNode.read(renderPass.data.output), + output: passNode.write(fg, output) + }; + } + }; + + this.execute = /*#__PURE__*/function () { + var _ref = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee(fg, pass) { + var _this$engine, createModel, createAttribute, createBuffer, model, resourceNode, framebuffer; + + return regenerator.wrap(function _callee$(_context) { + while (1) { + switch (_context.prev = _context.next) { + case 0: + _this$engine = _this.engine, createModel = _this$engine.createModel, createAttribute = _this$engine.createAttribute, createBuffer = _this$engine.createBuffer; + + if (_this.model) { + _context.next = 6; + break; + } + + _context.next = 4; + return createModel({ + vs: _this.engine.supportWebGPU ? copyVertWebGPU : copyVert, + fs: _this.engine.supportWebGPU ? copyFragWebGPU : copyFrag, + attributes: { + // rendering a fullscreen triangle instead of quad + // @see https://www.saschawillems.de/blog/2016/08/13/vulkan-tutorial-on-rendering-a-fullscreen-quad-without-buffers/ + a_Position: createAttribute({ + buffer: createBuffer({ + data: [-4, -4, 4, -4, 0, 4], + type: gl.FLOAT + }), + size: 2, + arrayStride: 2 * 4, + stepMode: 'vertex', + attributes: [{ + shaderLocation: 0, + offset: 0, + format: 'float2' + }] + }) + }, + uniforms: { + // @ts-ignore + u_Texture: null + }, + depth: { + enable: false + }, + count: 3, + blend: { + // copy pass 需要混合 + // enable: this.getName() === 'copy', + enable: true + } + }); + + case 4: + model = _context.sent; + _this.model = model; + + case 6: + // 实例化资源 + resourceNode = fg.getResourceNode(pass.data.input); + framebuffer = _this.resourcePool.getOrCreateResource(resourceNode.resource); + + _this.engine.useFramebuffer(null, function () { + _this.engine.clear({ + framebuffer: null, + color: [0, 0, 0, 0], + depth: 1, + stencil: 0 + }); + + _this.model.draw({ + uniforms: { + u_Texture: framebuffer // u_ViewportSize: [width, height], + + } + }); + }); + + case 9: + case "end": + return _context.stop(); + } + } + }, _callee); + })); + + return function (_x, _x2) { + return _ref.apply(this, arguments); + }; + }(); + + this.tearDown = function () { + _this.model = undefined; + }; +}, _class3$4.IDENTIFIER = 'Copy Pass', _temp$m), (_descriptor$g = _applyDecoratedDescriptor(_class2$g.prototype, "engine", [_dec2$g], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor2$a = _applyDecoratedDescriptor(_class2$g.prototype, "resourcePool", [_dec3$b], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +})), _class2$g)) || _class$r); + +var _dec$q, _dec2$f, _dec3$a, _dec4$6, _dec5$4, _dec6$4, _class$q, _class2$f, _descriptor$f, _descriptor2$9, _descriptor3$6, _descriptor4$1, _temp$l; +var RendererSystem = (_dec$q = inversify.injectable(), _dec2$f = inversify.inject(IDENTIFIER.Systems), _dec3$a = inversify.named(IDENTIFIER.FrameGraphSystem), _dec4$6 = inversify.inject(IDENTIFIER.RenderPassFactory), _dec5$4 = inversify.inject(IDENTIFIER.ConfigService), _dec6$4 = inversify.inject(IDENTIFIER.ResourcePool), _dec$q(_class$q = (_class2$f = (_temp$l = /*#__PURE__*/function () { + function RendererSystem() { + _classCallCheck(this, RendererSystem); + + _initializerDefineProperty(this, "frameGraphSystem", _descriptor$f, this); + + _initializerDefineProperty(this, "renderPassFactory", _descriptor2$9, this); + + _initializerDefineProperty(this, "configService", _descriptor3$6, this); + + _initializerDefineProperty(this, "resourcePool", _descriptor4$1, this); + } + + _createClass(RendererSystem, [{ + key: "execute", + value: function () { + var _execute = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee(views) { + var _this$renderPassFacto, setupRenderPass, executeRenderPass, _this$renderPassFacto2, setupCopyPass, executeCopyPass, tearDownCopyPass, copyPass; + + return regenerator.wrap(function _callee$(_context) { + while (1) { + switch (_context.prev = _context.next) { + case 0: + // const pixelPickingPass = this.renderPassFactory( + // PixelPickingPass.IDENTIFIER, + // ); + // const { + // setup: setupPixelPickingPass, + // execute: executePixelPickingPass, + // tearDown: tearDownPickingPass, + // } = pixelPickingPass; + // this.frameGraphSystem.addPass( + // PixelPickingPass.IDENTIFIER, + // setupPixelPickingPass, + // executePixelPickingPass, + // tearDownPickingPass, + // ); + _this$renderPassFacto = this.renderPassFactory(RenderPass.IDENTIFIER), setupRenderPass = _this$renderPassFacto.setup, executeRenderPass = _this$renderPassFacto.execute; + this.frameGraphSystem.addPass(RenderPass.IDENTIFIER, setupRenderPass, executeRenderPass); + _this$renderPassFacto2 = this.renderPassFactory(CopyPass.IDENTIFIER), setupCopyPass = _this$renderPassFacto2.setup, executeCopyPass = _this$renderPassFacto2.execute, tearDownCopyPass = _this$renderPassFacto2.tearDown; + copyPass = this.frameGraphSystem.addPass(CopyPass.IDENTIFIER, setupCopyPass, executeCopyPass, tearDownCopyPass); + this.frameGraphSystem.present(copyPass.data.output); // this.frameGraphSystem.present(renderPass.data.output); + + case 5: + case "end": + return _context.stop(); + } + } + }, _callee, this); + })); + + function execute(_x) { + return _execute.apply(this, arguments); + } + + return execute; + }() + }, { + key: "tearDown", + value: function tearDown() { + this.resourcePool.clean(); + } + }, { + key: "pick", + value: function pick(position, view) { + var pickingPass = this.renderPassFactory(PixelPickingPass.IDENTIFIER); + return pickingPass.pick(position, view); + } + }]); + + return RendererSystem; +}(), _temp$l), (_descriptor$f = _applyDecoratedDescriptor(_class2$f.prototype, "frameGraphSystem", [_dec2$f, _dec3$a], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor2$9 = _applyDecoratedDescriptor(_class2$f.prototype, "renderPassFactory", [_dec4$6], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor3$6 = _applyDecoratedDescriptor(_class2$f.prototype, "configService", [_dec5$4], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor4$1 = _applyDecoratedDescriptor(_class2$f.prototype, "resourcePool", [_dec6$4], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +})), _class2$f)) || _class$q); + +function _createSuper$a(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$a(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; } + +function _isNativeReflectConstruct$a() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } +var HierarchyComponent = /*#__PURE__*/function (_Component) { + _inherits(HierarchyComponent, _Component); + + var _super = _createSuper$a(HierarchyComponent); + + function HierarchyComponent(data) { + var _this; + + _classCallCheck(this, HierarchyComponent); + + _this = _super.call(this, data); + _this.parentID = void 0; + Object.assign(_assertThisInitialized(_this), data); + return _this; + } + + return HierarchyComponent; +}(Component); + +var _dec$p, _dec2$e, _dec3$9, _dec4$5, _class$p, _class2$e, _descriptor$e, _descriptor2$8, _descriptor3$5, _temp$k; +var SceneGraphSystem = (_dec$p = inversify.injectable(), _dec2$e = inversify.inject(IDENTIFIER.HierarchyComponentManager), _dec3$9 = inversify.inject(IDENTIFIER.TransformComponentManager), _dec4$5 = inversify.inject(IDENTIFIER.MeshComponentManager), _dec$p(_class$p = (_class2$e = (_temp$k = /*#__PURE__*/function () { + function SceneGraphSystem() { + _classCallCheck(this, SceneGraphSystem); + + _initializerDefineProperty(this, "hierarchy", _descriptor$e, this); + + _initializerDefineProperty(this, "transform", _descriptor2$8, this); + + _initializerDefineProperty(this, "mesh", _descriptor3$5, this); + } + + _createClass(SceneGraphSystem, [{ + key: "execute", + value: function () { + var _execute = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee() { + return regenerator.wrap(function _callee$(_context) { + while (1) { + switch (_context.prev = _context.next) { + case 0: + this.runTransformUpdateSystem(); + this.runHierarchyUpdateSystem(); + + case 2: + case "end": + return _context.stop(); + } + } + }, _callee, this); + })); + + function execute() { + return _execute.apply(this, arguments); + } + + return execute; + }() + }, { + key: "tearDown", + value: function tearDown() { + this.hierarchy.clear(); + this.transform.clear(); + } + }, { + key: "getHierarchyComponentManager", + value: function getHierarchyComponentManager() { + return this.hierarchy; + } + }, { + key: "getTransformComponentManager", + value: function getTransformComponentManager() { + return this.transform; + } + }, { + key: "runTransformUpdateSystem", + value: function runTransformUpdateSystem() { + var _this = this; + + // 原版基于 JobSystem 实现 + this.transform.forEach(function (entity, transform) { + if (transform.isDirty() || transform.isLocalDirty()) { + _this.setMeshAABBDirty(_this.mesh.getComponentByEntity(entity)); + + transform.updateTransform(); + } + }); + } + }, { + key: "runHierarchyUpdateSystem", + value: function runHierarchyUpdateSystem() { + var _this2 = this; + + this.hierarchy.forEach(function (entity, parentComponent) { + var transformChild = _this2.transform.getComponentByEntity(entity); + + var transformParent = _this2.transform.getComponentByEntity(parentComponent.parentID); + + if (transformChild !== null && transformParent !== null) { + transformChild.updateTransformWithParent(transformParent); + } + }); + } + }, { + key: "attach", + value: function attach(entity, parent, isChildAlreadyInLocalSpace) { + if (this.hierarchy.contains(entity)) { + this.detach(entity); + } + + this.hierarchy.create(entity, { + parentID: parent + }); + var mesh = this.mesh.getComponentByEntity(parent); // inform parent mesh to update its aabb + + this.setMeshAABBDirty(mesh); + + if (mesh && mesh.children.indexOf(entity) === -1) { + mesh.children.push(entity); + } + + if (this.hierarchy.getCount() > 1) { + for (var i = this.hierarchy.getCount() - 1; i > 0; --i) { + var parentCandidateEntity = this.hierarchy.getEntity(i); // const parentCandidateComponent = this.hierarchy.getComponent(i); + + for (var j = 0; j < i; ++j) { + var childCandidateEntity = this.hierarchy.getComponent(j); + + if (childCandidateEntity.parentID === parentCandidateEntity) { + this.hierarchy.moveItem(i, j); + ++i; // next outer iteration will check the same index again as parent candidate, however things were moved upwards, so it will be a different entity! + + break; + } + } + } + } // Re-query parent after potential MoveItem(), because it invalidates references: + + + this.hierarchy.getComponentByEntity(entity); + var transformParent = this.transform.getComponentByEntity(parent); + + if (transformParent === null) { + transformParent = this.transform.create(parent); + } + + var transformChild = this.transform.getComponentByEntity(entity); + + if (transformChild === null) { + transformChild = this.transform.create(entity); // after transforms.Create(), transform_parent pointer could have become invalidated! + + transformParent = this.transform.getComponentByEntity(parent); + } + + transformChild.parent = transformParent; + + if (!isChildAlreadyInLocalSpace && transformParent) { + transformChild.matrixTransform(invert$3(create$5(), transformParent.worldTransform)); + transformChild.updateTransform(); + } + + if (transformParent) { + transformChild.updateTransformWithParent(transformParent); + } + } + }, { + key: "detach", + value: function detach(entity) { + var self = this.hierarchy.getComponentByEntity(entity); + + if (self !== null) { + var transform = this.transform.getComponentByEntity(entity); + + if (transform !== null) { + transform.parent = null; + transform.applyTransform(); + } + + this.hierarchy.removeKeepSorted(entity); // inform parent mesh to update its aabb + + var mesh = this.mesh.getComponentByEntity(self.parentID); + + if (mesh) { + var index = mesh.children.indexOf(entity); + mesh.children.splice(index, 1); + } + + this.setMeshAABBDirty(mesh); + } + } + }, { + key: "detachChildren", + value: function detachChildren(parent) { + var mesh = this.mesh.getComponentByEntity(parent); + + if (mesh) { + mesh.children = []; + } + + for (var i = 0; i < this.hierarchy.getCount();) { + var _this$hierarchy$getCo; + + if (((_this$hierarchy$getCo = this.hierarchy.getComponent(i)) === null || _this$hierarchy$getCo === void 0 ? void 0 : _this$hierarchy$getCo.parentID) === parent) { + var entity = this.hierarchy.getEntity(i); + this.detach(entity); + } else { + ++i; + } + } + } + }, { + key: "setMeshAABBDirty", + value: function setMeshAABBDirty(mesh) { + if (mesh) { + mesh.aabbDirty = true; + } + } + }]); + + return SceneGraphSystem; +}(), _temp$k), (_descriptor$e = _applyDecoratedDescriptor(_class2$e.prototype, "hierarchy", [_dec2$e], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor2$8 = _applyDecoratedDescriptor(_class2$e.prototype, "transform", [_dec3$9], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor3$5 = _applyDecoratedDescriptor(_class2$e.prototype, "mesh", [_dec4$5], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +})), _class2$e)) || _class$p); + +function _createSuper$9(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$9(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; } + +function _isNativeReflectConstruct$9() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } +var TransformComponent = /*#__PURE__*/function (_Component) { + _inherits(TransformComponent, _Component); + + var _super = _createSuper$9(TransformComponent); + + /** + * local space RTS + */ + + /** + * XMFLOAT4X4._41 + * @see https://docs.microsoft.com/en-us/windows/win32/api/directxmath/nf-directxmath-xmfloat4x4-xmfloat4x4(constfloat)#remarks + */ + + /** + * world space RTS + */ + // 高阶函数，利用闭包重复利用临时变量 + // @see playcanvas graph node + + /** + * @see https://docs.microsoft.com/en-us/windows/win32/api/directxmath/nf-directxmath-xmquaternionrotationrollpitchyaw + */ + + /** + * @see https://xiaoiver.github.io/coding/2018/12/28/Camera-%E8%AE%BE%E8%AE%A1-%E4%B8%80.html + */ + + /** + * TODO: 支持以下两种： + * * translate(x, y, z) + * * translate(vec3(x, y, z)) + */ + + /** + * @see https://en.wikipedia.org/wiki/Centripetal_Catmull%E2%80%93Rom_spline + */ + // public catmullRom = (() => { + // const aS = vec3.create(); + // const aR = quat.create(); + // const aT = vec3.create(); + // const bS = vec3.create(); + // const bR = quat.create(); + // const bT = vec3.create(); + // const cS = vec3.create(); + // const cR = quat.create(); + // const cT = vec3.create(); + // const dS = vec3.create(); + // const dR = quat.create(); + // const dT = vec3.create(); + // const R = quat.create(); + // return ( + // a: TransformComponent, + // b: TransformComponent, + // c: TransformComponent, + // d: TransformComponent, + // t: number, + // ) => { + // this.setDirty(); + // mat4.getScaling(aS, a.worldTransform); + // mat4.getTranslation(aT, a.worldTransform); + // mat4.getRotation(aR, a.worldTransform); + // mat4.getScaling(bS, b.worldTransform); + // mat4.getTranslation(bT, b.worldTransform); + // mat4.getRotation(bR, b.worldTransform); + // mat4.getScaling(cS, c.worldTransform); + // mat4.getTranslation(cT, c.worldTransform); + // mat4.getRotation(cR, c.worldTransform); + // mat4.getScaling(dS, d.worldTransform); + // mat4.getTranslation(dT, d.worldTransform); + // mat4.getRotation(dR, d.worldTransform); + // vec3.catmullRom(this.localPosition, aT, bT, cT, dT, t); + // vec3.catmullRom(R, aR, bR, cR, dR, t); + // quat.normalize(this.localRotation, R); + // vec3.catmullRom(this.localScale, aS, bS, cS, dS, t); + // }; + // })(); + function TransformComponent(data) { + var _this; + + _classCallCheck(this, TransformComponent); + + _this = _super.call(this, data); + _this.dirtyFlag = void 0; + _this.localDirtyFlag = void 0; + _this.parent = null; + _this.localPosition = fromValues$3(0, 0, 0); + _this.localRotation = fromValues$1(0, 0, 0, 1); + _this.localScale = fromValues$3(1, 1, 1); + _this.localTransform = create$5(); + _this.position = fromValues$3(0, 0, 0); + _this.rotation = fromValues$1(0, 0, 0, 1); + _this.scaling = fromValues$3(1, 1, 1); + _this.worldTransform = create$5(); + + _this.matrixTransform = function () { + var transformed = create$5(); + return function (mat) { + multiply$3(transformed, _this.getLocalTransform(), mat); + getScaling(_this.localScale, transformed); + getTranslation(_this.localPosition, transformed); + getRotation(_this.localRotation, transformed); + }; + }(); + + _this.rotateRollPitchYaw = function () { + var quatX = create$2(); + var quatY = create$2(); + var quatZ = create$2(); + return function (x, y, z) { + _this.setDirty(); + + fromEuler(quatX, x, 0, 0); + fromEuler(quatY, 0, y, 0); + fromEuler(quatZ, 0, 0, z); + multiply$1(_this.localRotation, quatX, _this.localRotation); + multiply$1(_this.localRotation, _this.localRotation, quatY); + multiply$1(_this.localRotation, quatZ, _this.localRotation); + normalize$5(_this.localRotation, _this.localRotation); + }; + }(); + + _this.lerp = function () { + var aS = create$4(); + var aR = create$2(); + var aT = create$4(); + var bS = create$4(); + var bR = create$2(); + var bT = create$4(); + return function (a, b, t) { + _this.setDirty(); + + getScaling(aS, a.worldTransform); + getTranslation(aT, a.worldTransform); + getRotation(aR, a.worldTransform); + getScaling(bS, b.worldTransform); + getTranslation(bT, b.worldTransform); + getRotation(bR, b.worldTransform); + lerp$2(_this.localScale, aS, bS, t); + slerp(_this.localRotation, aR, bR, t); + lerp$2(_this.localPosition, aT, bT, t); + }; + }(); + + _this.translate = function () { + var tr = create$4(); + return function (translation) { + add$4(tr, _this.getPosition(), translation); + + _this.setPosition(tr); + + _this.setDirty(true); + + return _assertThisInitialized(_this); + }; + }(); + + _this.translateLocal = function () { + return function (translation) { + transformQuat(translation, translation, _this.localRotation); + add$4(_this.localPosition, _this.localPosition, translation); + + _this.setLocalDirty(true); + + return _assertThisInitialized(_this); + }; + }(); + + _this.setPosition = function () { + var parentInvertMatrix = create$5(); + return function (position) { + _this.position = position; + + _this.setLocalDirty(true); + + if (_this.parent === null) { + copy$3(_this.localPosition, position); + } else { + copy$4(parentInvertMatrix, _this.parent.worldTransform); + invert$3(parentInvertMatrix, parentInvertMatrix); + transformMat4$2(_this.localPosition, position, parentInvertMatrix); + } + + return _assertThisInitialized(_this); + }; + }(); + + _this.rotate = function () { + var parentInvertRotation = create$2(); + return function (quaternion) { + if (_this.parent === null) { + multiply$1(_this.localRotation, _this.localRotation, quaternion); + normalize$5(_this.localRotation, _this.localRotation); + } else { + var rot = _this.getRotation(); + + var parentRot = _this.parent.getRotation(); + + copy$1(parentInvertRotation, parentRot); + invert$2(parentInvertRotation, parentInvertRotation); + multiply$1(parentInvertRotation, parentInvertRotation, quaternion); + multiply$1(_this.localRotation, quaternion, rot); + normalize$5(_this.localRotation, _this.localRotation); + } + + _this.setLocalDirty(); + + return _assertThisInitialized(_this); + }; + }(); + + _this.rotateLocal = function () { + return function (quaternion) { + multiply$1(_this.localRotation, _this.localRotation, quaternion); + normalize$5(_this.localRotation, _this.localRotation); + + _this.setLocalDirty(true); + + return _assertThisInitialized(_this); + }; + }(); + + _this.setRotation = function () { + var invParentRot = create$2(); + return function (rotation) { + if (_this.parent === null) { + copy$1(_this.localRotation, rotation); + } else { + copy$1(invParentRot, _this.parent.getRotation()); + invert$2(invParentRot, invParentRot); + copy$1(_this.localRotation, invParentRot); + mul$1(_this.localRotation, _this.localRotation, rotation); + } + + _this.setLocalDirty(true); + + return _assertThisInitialized(_this); + }; + }(); + + return _this; + } + + _createClass(TransformComponent, [{ + key: "setLocalPosition", + value: function setLocalPosition(position) { + copy$3(this.localPosition, position); + this.setLocalDirty(true); + } + }, { + key: "setLocalScale", + value: function setLocalScale(scale) { + copy$3(this.localScale, scale); + this.setLocalDirty(true); + } + }, { + key: "setLocalRotation", + value: function setLocalRotation(rotation) { + copy$1(this.localRotation, rotation); + this.setLocalDirty(true); + return this; + } + }, { + key: "isDirty", + value: function isDirty() { + return this.dirtyFlag; + } + }, { + key: "setDirty", + value: function setDirty() { + var value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true; + + if (value) { + this.dirtyFlag |= TransformComponent.DIRTY; + } else { + this.dirtyFlag &= ~TransformComponent.DIRTY; + } + } + }, { + key: "isLocalDirty", + value: function isLocalDirty() { + return this.localDirtyFlag; + } + }, { + key: "setLocalDirty", + value: function setLocalDirty() { + var value = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true; + + if (value) { + this.localDirtyFlag |= TransformComponent.DIRTY; + this.setDirty(true); + } else { + this.localDirtyFlag &= ~TransformComponent.DIRTY; + } + } + }, { + key: "updateTransform", + value: function updateTransform() { + if (this.isLocalDirty()) { + this.getLocalTransform(); + } + + if (this.isDirty()) { + if (this.parent === null) { + copy$4(this.worldTransform, this.getLocalTransform()); + this.setDirty(false); + } + } + } + }, { + key: "updateTransformWithParent", + value: function updateTransformWithParent(parent) { + multiply$3(this.worldTransform, parent.worldTransform, this.getLocalTransform()); + } + }, { + key: "applyTransform", + value: function applyTransform() { + this.setDirty(); + getScaling(this.localScale, this.worldTransform); + getTranslation(this.localPosition, this.worldTransform); + getRotation(this.localRotation, this.worldTransform); + } + }, { + key: "clearTransform", + value: function clearTransform() { + this.setDirty(); + this.localPosition = fromValues$3(0, 0, 0); + this.localRotation = fromValues$1(0, 0, 0, 1); + this.localScale = fromValues$3(1, 1, 1); + } + }, { + key: "scaleLocal", + value: function scaleLocal(scaling) { + this.setLocalDirty(); + multiply$2(this.localScale, this.localScale, scaling); + return this; + } + }, { + key: "getLocalPosition", + value: function getLocalPosition() { + return this.localPosition; + } + }, { + key: "getLocalRotation", + value: function getLocalRotation() { + return this.localRotation; + } + }, { + key: "getLocalScale", + value: function getLocalScale() { + return this.localScale; + } + }, { + key: "getLocalTransform", + value: function getLocalTransform() { + if (this.localDirtyFlag) { + fromRotationTranslationScale(this.localTransform, this.localRotation, this.localPosition, this.localScale); + this.setLocalDirty(false); + } + + return this.localTransform; + } + }, { + key: "getWorldTransform", + value: function getWorldTransform() { + if (!this.isLocalDirty() && !this.isDirty()) { + return this.worldTransform; + } + + if (this.parent) { + this.parent.getWorldTransform(); + } + + this.updateTransform(); + return this.worldTransform; + } + }, { + key: "getPosition", + value: function getPosition() { + getTranslation(this.position, this.worldTransform); + return this.position; + } + }, { + key: "getRotation", + value: function getRotation$1() { + getRotation(this.rotation, this.worldTransform); + return this.rotation; + } + }, { + key: "getScale", + value: function getScale() { + getScaling(this.scaling, this.worldTransform); + return this.scaling; + } + }]); + + return TransformComponent; +}(Component); +TransformComponent.DIRTY = 1 << 0; + +var lib = {}; + +var decorators = {}; + +Object.defineProperty(decorators, "__esModule", { value: true }); +var INJECTION = Symbol.for("INJECTION"); +function _proxyGetter(proto, key, resolve, doCache) { + function getter() { + if (doCache && !Reflect.hasMetadata(INJECTION, this, key)) { + Reflect.defineMetadata(INJECTION, resolve(), this, key); + } + if (Reflect.hasMetadata(INJECTION, this, key)) { + return Reflect.getMetadata(INJECTION, this, key); + } + else { + return resolve(); + } + } + function setter(newVal) { + Reflect.defineMetadata(INJECTION, newVal, this, key); + } + Object.defineProperty(proto, key, { + configurable: true, + enumerable: true, + get: getter, + set: setter + }); +} +function makePropertyInjectDecorator(container, doCache) { + return function (serviceIdentifier) { + return function (proto, key) { + var resolve = function () { + return container.get(serviceIdentifier); + }; + _proxyGetter(proto, key, resolve, doCache); + }; + }; +} +decorators.makePropertyInjectDecorator = makePropertyInjectDecorator; +function makePropertyInjectNamedDecorator(container, doCache) { + return function (serviceIdentifier, named) { + return function (proto, key) { + var resolve = function () { + return container.getNamed(serviceIdentifier, named); + }; + _proxyGetter(proto, key, resolve, doCache); + }; + }; +} +decorators.makePropertyInjectNamedDecorator = makePropertyInjectNamedDecorator; +function makePropertyInjectTaggedDecorator(container, doCache) { + return function (serviceIdentifier, key, value) { + return function (proto, propertyName) { + var resolve = function () { + return container.getTagged(serviceIdentifier, key, value); + }; + _proxyGetter(proto, propertyName, resolve, doCache); + }; + }; +} +decorators.makePropertyInjectTaggedDecorator = makePropertyInjectTaggedDecorator; +function makePropertyMultiInjectDecorator(container, doCache) { + return function (serviceIdentifier) { + return function (proto, key) { + var resolve = function () { + return container.getAll(serviceIdentifier); + }; + _proxyGetter(proto, key, resolve, doCache); + }; + }; +} +decorators.makePropertyMultiInjectDecorator = makePropertyMultiInjectDecorator; + +Object.defineProperty(lib, "__esModule", { value: true }); +var decorators_1 = decorators; +function getDecorators(container, doCache) { + if (doCache === void 0) { doCache = true; } + var lazyInject = decorators_1.makePropertyInjectDecorator(container, doCache); + var lazyInjectNamed = decorators_1.makePropertyInjectNamedDecorator(container, doCache); + var lazyInjectTagged = decorators_1.makePropertyInjectTaggedDecorator(container, doCache); + var lazyMultiInject = decorators_1.makePropertyMultiInjectDecorator(container, doCache); + return { + lazyInject: lazyInject, + lazyInjectNamed: lazyInjectNamed, + lazyInjectTagged: lazyInjectTagged, + lazyMultiInject: lazyMultiInject + }; +} +var _default$1 = lib.default = getDecorators; + +var _dec$o, _dec2$d, _class$o, _class2$d, _descriptor$d, _temp$j; +var ResourcePool = (_dec$o = inversify.injectable(), _dec2$d = inversify.inject(IDENTIFIER.RenderEngine), _dec$o(_class$o = (_class2$d = (_temp$j = /*#__PURE__*/function () { + function ResourcePool() { + _classCallCheck(this, ResourcePool); + + _initializerDefineProperty(this, "engine", _descriptor$d, this); + + this.resourcePool = {}; + } + + _createClass(ResourcePool, [{ + key: "getOrCreateResource", + + /** + * 负责实例化虚拟资源，通过引擎服务 + * @param resource 虚拟资源 + */ + value: function getOrCreateResource(resource) { + if (!this.resourcePool[resource.name]) { + var _resource$descriptor = resource.descriptor, + width = _resource$descriptor.width, + height = _resource$descriptor.height, + usage = _resource$descriptor.usage; + this.resourcePool[resource.name] = this.engine.createFramebuffer({ + color: this.engine.createTexture2D({ + width: width, + height: height, + wrapS: gl.CLAMP_TO_EDGE, + wrapT: gl.CLAMP_TO_EDGE, + usage: usage + }) + }); + } + + return this.resourcePool[resource.name]; + } + }, { + key: "clean", + value: function clean() { + this.resourcePool = {}; + } + }]); + + return ResourcePool; +}(), _temp$j), (_descriptor$d = _applyDecoratedDescriptor(_class2$d.prototype, "engine", [_dec2$d], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +})), _class2$d)) || _class$o); + +function _createSuper$8(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$8(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; } + +function _isNativeReflectConstruct$8() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } +var NameComponent = /*#__PURE__*/function (_Component) { + _inherits(NameComponent, _Component); + + var _super = _createSuper$8(NameComponent); + + function NameComponent(data) { + var _this; + + _classCallCheck(this, NameComponent); + + _this = _super.call(this, data); + _this.name = void 0; + _this.name = data.name || ''; + return _this; + } + + return NameComponent; +}(Component); + +var _dec$n, _class$n, _temp$i; +var ConfigService = (_dec$n = inversify.injectable(), _dec$n(_class$n = (_temp$i = /*#__PURE__*/function () { + function ConfigService() { + _classCallCheck(this, ConfigService); + + this.config = void 0; + } + + _createClass(ConfigService, [{ + key: "get", + value: function get() { + return this.config; + } + }, { + key: "set", + value: function set(config) { + this.config = config; + } + }]); + + return ConfigService; +}(), _temp$i)) || _class$n); + +var _dec$m, _class$m; +var IInteractorEvent; + +(function (IInteractorEvent) { + IInteractorEvent["PANSTART"] = "PANSTART"; + IInteractorEvent["PANEND"] = "PANEND"; + IInteractorEvent["PANMOVE"] = "PANMOVE"; + IInteractorEvent["PINCH"] = "PINCH"; + IInteractorEvent["KEYDOWN"] = "KEYDOWN"; + IInteractorEvent["KEYUP"] = "KEYUP"; + IInteractorEvent["HOVER"] = "HOVER"; +})(IInteractorEvent || (IInteractorEvent = {})); + +var InteractorService = (_dec$m = inversify.injectable(), _dec$m(_class$m = /*#__PURE__*/function () { + function InteractorService() { + _classCallCheck(this, InteractorService); + } + + _createClass(InteractorService, [{ + key: "listen", + value: function listen(canvas) {} + }, { + key: "on", + value: function on(event, args) {} + }, { + key: "connect", + value: function connect() {} + }, { + key: "disconnect", + value: function disconnect() {} + }, { + key: "destroy", + value: function destroy() {} + }]); + + return InteractorService; +}()) || _class$m); + +function getUniformLengthByType(type) { + var arrayLength = 0; + + switch (type) { + case 'vec2': + case 'ivec2': + arrayLength = 2; + break; + + case 'vec3': + case 'ivec3': + arrayLength = 3; + break; + + case 'vec4': + case 'ivec4': + case 'mat2': + arrayLength = 4; + break; + + case 'mat3': + arrayLength = 9; + break; + + case 'mat4': + arrayLength = 16; + break; + } + + return arrayLength; +} +var uniformRegExp = /uniform\s+(bool|float|int|vec2|vec3|vec4|ivec2|ivec3|ivec4|mat2|mat3|mat4|sampler2D|samplerCube)\s+([\s\S]*?);/g; +function extractUniforms$1(content) { + var uniforms = {}; + content = content.replace(uniformRegExp, function (_, type, c) { + var defaultValues = c.split(':'); + var uniformName = defaultValues[0].trim(); + var defaultValue = ''; + + if (defaultValues.length > 1) { + defaultValue = defaultValues[1].trim(); + } // set default value for uniform according to its type + // eg. vec2 u -> [0.0, 0.0] + + + switch (type) { + case 'bool': + defaultValue = defaultValue === 'true'; + break; + + case 'float': + case 'int': + defaultValue = Number(defaultValue); + break; + + case 'vec2': + case 'vec3': + case 'vec4': + case 'ivec2': + case 'ivec3': + case 'ivec4': + case 'mat2': + case 'mat3': + case 'mat4': + if (defaultValue) { + defaultValue = defaultValue.replace('[', '').replace(']', '').split(',').reduce(function (prev, cur) { + prev.push(Number(cur.trim())); + return prev; + }, []); + } else { + defaultValue = new Array(getUniformLengthByType(type)).fill(0); + } + + break; + } // @ts-ignore + + + uniforms[uniformName] = defaultValue; + return "uniform ".concat(type, " ").concat(uniformName, ";\n"); + }); + return { + content: content, + uniforms: uniforms + }; +} + +function uniq(array) { + return array.filter(function (v, i, a) { + return a.indexOf(v) === i; + }); +} + +var _dec$l, _class$l, _temp$h; + +function ownKeys$7(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; } + +function _objectSpread$7(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$7(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$7(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; } + +/* babel-plugin-inline-import './shaders/webgl.picking.frag.glsl' */ +var pickingFrag = "varying vec4 v_PickingResult;\nuniform vec4 u_HighlightColor : [0, 0, 0, 0];\nuniform float u_PickingStage : 0.0;\n\n#define PICKING_ENCODE 1.0\n#define PICKING_HIGHLIGHT 2.0\n#define COLOR_SCALE 1. / 255.\n\n/*\n * Returns highlight color if this item is selected.\n */\nvec4 filterHighlightColor(vec4 color) {\n bool selected = bool(v_PickingResult.a);\n\n if (selected) {\n vec4 highLightColor = u_HighlightColor * COLOR_SCALE;\n\n float highLightAlpha = highLightColor.a;\n float highLightRatio = highLightAlpha / (highLightAlpha + color.a * (1.0 - highLightAlpha));\n\n vec3 resultRGB = mix(color.rgb, highLightColor.rgb, highLightRatio);\n return vec4(resultRGB, color.a);\n } else {\n return color;\n }\n}\n\n/*\n * Returns picking color if picking enabled else unmodified argument.\n */\nvec4 filterPickingColor(vec4 color) {\n vec3 pickingColor = v_PickingResult.rgb;\n if (u_PickingStage == PICKING_ENCODE && length(pickingColor) < 0.001) {\n discard;\n }\n return u_PickingStage == PICKING_ENCODE ? vec4(pickingColor, step(0.001,color.a)): color;\n}\n\n/*\n * Returns picking color if picking is enabled if not\n * highlight color if this item is selected, otherwise unmodified argument.\n */\nvec4 filterColor(vec4 color) {\n return filterPickingColor(filterHighlightColor(color));\n}\n"; + +/* babel-plugin-inline-import './shaders/webgl.picking.vert.glsl' */ +var pickingVert = "attribute vec3 a_PickingColor;\nvarying vec4 v_PickingResult;\n\nuniform vec3 u_PickingColor : [0, 0, 0];\nuniform vec4 u_HighlightColor : [0, 0, 0, 0];\nuniform float u_PickingStage : 0.0;\nuniform float u_PickingThreshold : 1.0;\nuniform float u_PickingBuffer: 0.0;\n\n#define PICKING_ENCODE 1.0\n#define PICKING_HIGHLIGHT 2.0\n#define COLOR_SCALE 1. / 255.\n\nbool isVertexPicked(vec3 vertexColor) {\n return\n abs(vertexColor.r - u_PickingColor.r) < u_PickingThreshold &&\n abs(vertexColor.g - u_PickingColor.g) < u_PickingThreshold &&\n abs(vertexColor.b - u_PickingColor.b) < u_PickingThreshold;\n}\n\nvoid setPickingColor(vec3 pickingColor) {\n // compares only in highlight stage\n v_PickingResult.a = float((u_PickingStage == PICKING_HIGHLIGHT) && isVertexPicked(pickingColor));\n\n // Stores the picking color so that the fragment shader can render it during picking\n v_PickingResult.rgb = pickingColor * COLOR_SCALE;\n}\n\nfloat setPickingSize(float x) {\n return u_PickingStage == PICKING_ENCODE ? x + u_PickingBuffer : x;\n}"; + +/* babel-plugin-inline-import './shaders/webgl.sdf2d.frag.glsl' */ +var sdf2dFrag = "/**\n * 2D signed distance field functions\n * @see http://www.iquilezles.org/www/articles/distfunctions2d/distfunctions2d.htm\n */\n\nfloat ndot(vec2 a, vec2 b ) { return a.x*b.x - a.y*b.y; }\n\nfloat sdCircle(vec2 p, float r) {\n return length(p) - r;\n}\n\nfloat sdEquilateralTriangle(vec2 p) {\n float k = sqrt(3.0);\n p.x = abs(p.x) - 1.0;\n p.y = p.y + 1.0/k;\n if( p.x + k*p.y > 0.0 ) p = vec2(p.x-k*p.y,-k*p.x-p.y)/2.0;\n p.x -= clamp( p.x, -2.0, 0.0 );\n return -length(p)*sign(p.y);\n}\n\nfloat sdBox(vec2 p, vec2 b) {\n vec2 d = abs(p)-b;\n return length(max(d,vec2(0))) + min(max(d.x,d.y),0.0);\n}\n\nfloat sdPentagon(vec2 p, float r) {\n vec3 k = vec3(0.809016994,0.587785252,0.726542528);\n p.x = abs(p.x);\n p -= 2.0*min(dot(vec2(-k.x,k.y),p),0.0)*vec2(-k.x,k.y);\n p -= 2.0*min(dot(vec2( k.x,k.y),p),0.0)*vec2( k.x,k.y);\n p -= vec2(clamp(p.x,-r*k.z,r*k.z),r);\n return length(p)*sign(p.y);\n}\n\nfloat sdHexagon(vec2 p, float r) {\n vec3 k = vec3(-0.866025404,0.5,0.577350269);\n p = abs(p);\n p -= 2.0*min(dot(k.xy,p),0.0)*k.xy;\n p -= vec2(clamp(p.x, -k.z*r, k.z*r), r);\n return length(p)*sign(p.y);\n}\n\nfloat sdOctogon(vec2 p, float r) {\n vec3 k = vec3(-0.9238795325, 0.3826834323, 0.4142135623 );\n p = abs(p);\n p -= 2.0*min(dot(vec2( k.x,k.y),p),0.0)*vec2( k.x,k.y);\n p -= 2.0*min(dot(vec2(-k.x,k.y),p),0.0)*vec2(-k.x,k.y);\n p -= vec2(clamp(p.x, -k.z*r, k.z*r), r);\n return length(p)*sign(p.y);\n}\n\nfloat sdHexagram(vec2 p, float r) {\n vec4 k=vec4(-0.5,0.8660254038,0.5773502692,1.7320508076);\n p = abs(p);\n p -= 2.0*min(dot(k.xy,p),0.0)*k.xy;\n p -= 2.0*min(dot(k.yx,p),0.0)*k.yx;\n p -= vec2(clamp(p.x,r*k.z,r*k.w),r);\n return length(p)*sign(p.y);\n}\n\nfloat sdRhombus(vec2 p, vec2 b) {\n vec2 q = abs(p);\n float h = clamp((-2.0*ndot(q,b)+ndot(b,b))/dot(b,b),-1.0,1.0);\n float d = length( q - 0.5*b*vec2(1.0-h,1.0+h) );\n return d * sign( q.x*b.y + q.y*b.x - b.x*b.y );\n}\n\nfloat sdVesica(vec2 p, float r, float d) {\n p = abs(p);\n float b = sqrt(r*r-d*d); // can delay this sqrt\n return ((p.y-b)*d>p.x*b)\n ? length(p-vec2(0.0,b))\n : length(p-vec2(-d,0.0))-r;\n}"; +var precisionRegExp = /precision\s+(high|low|medium)p\s+float/; +var globalDefaultprecision = '#ifdef GL_FRAGMENT_PRECISION_HIGH\n precision highp float;\n #else\n precision mediump float;\n#endif\n'; +var includeRegExp = /#pragma include (["^+"]?["\ "[a-zA-Z_0-9](.*)"]*?)/g; +var ShaderModuleService = (_dec$l = inversify.injectable(), _dec$l(_class$l = (_temp$h = /*#__PURE__*/function () { + function ShaderModuleService() { + _classCallCheck(this, ShaderModuleService); + + this.moduleCache = {}; + this.rawContentCache = {}; + } + + _createClass(ShaderModuleService, [{ + key: "registerBuiltinModules", + value: function registerBuiltinModules() { + this.destroy(); + this.registerModule('picking', { + vs: pickingVert, + fs: pickingFrag + }); + this.registerModule('sdf2d', { + vs: '', + fs: sdf2dFrag + }); + } + }, { + key: "registerModule", + value: function registerModule(moduleName, moduleParams) { + // prevent registering the same module multiple times + if (this.rawContentCache[moduleName]) { + return; + } + + var _moduleParams$vs = moduleParams.vs, + vs = _moduleParams$vs === void 0 ? '' : _moduleParams$vs, + _moduleParams$fs = moduleParams.fs, + fs = _moduleParams$fs === void 0 ? '' : _moduleParams$fs, + declaredUniforms = moduleParams.uniforms; + + var _extractUniforms = extractUniforms$1(vs), + extractedVS = _extractUniforms.content, + vsUniforms = _extractUniforms.uniforms; + + var _extractUniforms2 = extractUniforms$1(fs), + extractedFS = _extractUniforms2.content, + fsUniforms = _extractUniforms2.uniforms; + + this.rawContentCache[moduleName] = { + fs: extractedFS, + uniforms: _objectSpread$7(_objectSpread$7(_objectSpread$7({}, vsUniforms), fsUniforms), declaredUniforms), + vs: extractedVS + }; + } + }, { + key: "destroy", + value: function destroy() { + this.moduleCache = {}; + this.rawContentCache = {}; + } + }, { + key: "getModule", + value: function getModule(moduleName) { + var _this = this; + + if (this.moduleCache[moduleName]) { + return this.moduleCache[moduleName]; + } + + var rawVS = this.rawContentCache[moduleName].vs || ''; + var rawFS = this.rawContentCache[moduleName].fs || ''; + + var _this$processModule = this.processModule(rawVS, [], 'vs'), + vs = _this$processModule.content, + vsIncludeList = _this$processModule.includeList; + + var _this$processModule2 = this.processModule(rawFS, [], 'fs'), + fs = _this$processModule2.content, + fsIncludeList = _this$processModule2.includeList; + + var compiledFs = fs; // TODO: extract uniforms and their default values from GLSL + + var uniforms = uniq(vsIncludeList.concat(fsIncludeList).concat(moduleName)).reduce(function (prev, cur) { + return _objectSpread$7(_objectSpread$7({}, prev), _this.rawContentCache[cur].uniforms); + }, {}); + /** + * set default precision for fragment shader + * https://stackoverflow.com/questions/28540290/why-it-is-necessary-to-set-precision-for-the-fragment-shader + */ + + if (!precisionRegExp.test(fs)) { + compiledFs = globalDefaultprecision + fs; + } + + this.moduleCache[moduleName] = { + fs: compiledFs.trim(), + uniforms: uniforms, + vs: vs.trim() + }; + return this.moduleCache[moduleName]; + } + }, { + key: "processModule", + value: function processModule(rawContent, includeList, type) { + var _this2 = this; + + var compiled = rawContent.replace(includeRegExp, function (_, strMatch) { + var includeOpt = strMatch.split(' '); + var includeName = includeOpt[0].replace(/"/g, ''); + + if (includeList.indexOf(includeName) > -1) { + return ''; + } + + var txt = _this2.rawContentCache[includeName][type]; + includeList.push(includeName); + + var _this2$processModule = _this2.processModule(txt || '', includeList, type), + content = _this2$processModule.content; + + return content; + }); + return { + content: compiled, + includeList: includeList + }; + } + }]); + + return ShaderModuleService; +}(), _temp$h)) || _class$l); + +/** + * Root Container + * @see /dev-docs/IoC 容器、依赖注入与服务说明.md + */ + +var container = new inversify.Container(); // @see https://github.com/inversify/InversifyJS/blob/master/wiki/inheritance.md#what-can-i-do-when-my-base-class-is-provided-by-a-third-party-module +// decorate(injectable(), EventEmitter); +// container.bind(IDENTIFIER.IEventEmitter).to(EventEmitter); +// 支持使用 new 而非容器实例化的场景，同时禁止 lazyInject cache +// @see https://github.com/inversify/inversify-inject-decorators#caching-vs-non-caching-behaviour + +_default$1(container, false); +/** global services */ + +container.bind(IDENTIFIER.ShaderModuleService).to(ShaderModuleService).inSingletonScope(); +/** + * bind global component managers in root container + */ + +container.bind(IDENTIFIER.NameComponentManager).toConstantValue(new ComponentManager(NameComponent)); +container.bind(IDENTIFIER.HierarchyComponentManager).toConstantValue(new ComponentManager(HierarchyComponent)); +container.bind(IDENTIFIER.TransformComponentManager).toConstantValue(new ComponentManager(TransformComponent)); +container.bind(IDENTIFIER.MeshComponentManager).toConstantValue(new ComponentManager(MeshComponent)); +container.bind(IDENTIFIER.CullableComponentManager).toConstantValue(new ComponentManager(CullableComponent)); +container.bind(IDENTIFIER.GeometryComponentManager).toConstantValue(new ComponentManager(GeometryComponent)); +container.bind(IDENTIFIER.MaterialComponentManager).toConstantValue(new ComponentManager(MaterialComponent)); // https://github.com/inversify/InversifyJS/blob/master/wiki/hierarchical_di.md#support-for-hierarchical-di-systems + +function createWorldContainer() { + var worldContainer = new inversify.Container(); + worldContainer.parent = container; + /** + * bind systems + */ + + worldContainer.bind(IDENTIFIER.Systems).to(SceneGraphSystem).inSingletonScope().whenTargetNamed(IDENTIFIER.SceneGraphSystem); + worldContainer.bind(IDENTIFIER.Systems).to(FrameGraphSystem).inSingletonScope().whenTargetNamed(IDENTIFIER.FrameGraphSystem); + worldContainer.bind(IDENTIFIER.Systems).to(MeshSystem).inSingletonScope().whenTargetNamed(IDENTIFIER.MeshSystem); + worldContainer.bind(IDENTIFIER.Systems).to(GeometrySystem).inSingletonScope().whenTargetNamed(IDENTIFIER.GeometrySystem); + worldContainer.bind(IDENTIFIER.Systems).to(MaterialSystem).inSingletonScope().whenTargetNamed(IDENTIFIER.MaterialSystem); + worldContainer.bind(IDENTIFIER.Systems).to(RendererSystem).inSingletonScope().whenTargetNamed(IDENTIFIER.RendererSystem); // 资源池 + + worldContainer.bind(IDENTIFIER.ResourcePool).to(ResourcePool).inSingletonScope(); + worldContainer.bind(IDENTIFIER.ConfigService).to(ConfigService).inSingletonScope(); + worldContainer.bind(IDENTIFIER.InteractorService).to(InteractorService).inSingletonScope(); + /** + * bind render passes + */ + + worldContainer.bind(IDENTIFIER.RenderPass).to(RenderPass).inSingletonScope().whenTargetNamed(RenderPass.IDENTIFIER); + worldContainer.bind(IDENTIFIER.RenderPass).to(CopyPass).inSingletonScope().whenTargetNamed(CopyPass.IDENTIFIER); + worldContainer.bind(IDENTIFIER.RenderPass).to(PixelPickingPass).inSingletonScope().whenTargetNamed(PixelPickingPass.IDENTIFIER); + worldContainer.bind(IDENTIFIER.RenderPassFactory).toFactory(function (context) { + return function (name) { + return context.container.getNamed(IDENTIFIER.RenderPass, name); + }; + }); + return worldContainer; +} + +/** + * generate AABB with positions + * @param positions [x1,y1,z1, x2,y2,z2] + */ + +function generateAABBFromVertices(positions) { + var aabb = new AABB(); + var min = fromValues$3(positions[0], positions[1], positions[2]); + var max = fromValues$3(positions[0], positions[1], positions[2]); + + for (var i = 3; i < positions.length;) { + var x = positions[i++]; + var y = positions[i++]; + var z = positions[i++]; + + if (x < min[0]) { + min[0] = x; + } + + if (y < min[1]) { + min[1] = y; + } + + if (z < min[2]) { + min[2] = z; + } + + if (x > max[0]) { + max[0] = x; + } + + if (y > max[1]) { + max[1] = y; + } + + if (z > max[2]) { + max[2] = z; + } + } + + aabb.setMinMax(min, max); + return aabb; +} + +var isSafari = typeof navigator !== 'undefined' && /Version\/[\d\.]+.*Safari/.test(navigator.userAgent); + +create$4(); + +create$4(); +create$4(); +create$4(); +create$4(); +create$4(); + +var PassType; +/** + * Pass 分两类： + * 1. 渲染相关 eg. ClearPass、RenderPass、PickingPass、ShadowPass + * 2. PostProcessing eg. CopyPass、BlurPass + * 另外考虑到 Pass 之间严格的执行顺序，render 方法必须是异步的 + */ + +(function (PassType) { + PassType["Normal"] = "normal"; + PassType["PostProcessing"] = "post-processing"; +})(PassType || (PassType = {})); + +// tslint:disable-next-line:no-reference +/** + * inspired by Entitas' Systems + * @see https://github.com/sschmid/Entitas-CSharp/wiki/Systems + */ + +var AST_TOKEN_TYPES; + +(function (AST_TOKEN_TYPES) { + AST_TOKEN_TYPES["Void"] = "Void"; + AST_TOKEN_TYPES["Boolean"] = "Boolean"; + AST_TOKEN_TYPES["Float"] = "Float"; + AST_TOKEN_TYPES["Uint32"] = "Uint32"; + AST_TOKEN_TYPES["Int32"] = "Int32"; + AST_TOKEN_TYPES["Vector"] = "Vector"; + AST_TOKEN_TYPES["Vector2Float"] = "vec2"; + AST_TOKEN_TYPES["Vector3Float"] = "vec3"; + AST_TOKEN_TYPES["Vector4Float"] = "vec4"; + AST_TOKEN_TYPES["Vector2Boolean"] = "vec2"; + AST_TOKEN_TYPES["Vector3Boolean"] = "vec3"; + AST_TOKEN_TYPES["Vector4Boolean"] = "vec4"; + AST_TOKEN_TYPES["Vector2Uint"] = "vec2"; + AST_TOKEN_TYPES["Vector3Uint"] = "vec3"; + AST_TOKEN_TYPES["Vector4Uint"] = "vec4"; + AST_TOKEN_TYPES["Vector2Int"] = "vec2"; + AST_TOKEN_TYPES["Vector3Int"] = "vec3"; + AST_TOKEN_TYPES["Vector4Int"] = "vec4"; + AST_TOKEN_TYPES["Matrix"] = "Matrix"; + AST_TOKEN_TYPES["Matrix3x3Float"] = "mat3x3"; + AST_TOKEN_TYPES["Matrix4x4Float"] = "mat4x4"; + AST_TOKEN_TYPES["Struct"] = "Struct"; + AST_TOKEN_TYPES["FloatArray"] = "Float[]"; + AST_TOKEN_TYPES["Vector4FloatArray"] = "vec4[]"; +})(AST_TOKEN_TYPES || (AST_TOKEN_TYPES = {})); + +var AST_NODE_TYPES; + +(function (AST_NODE_TYPES) { + AST_NODE_TYPES["Program"] = "Program"; + AST_NODE_TYPES["Identifier"] = "Identifier"; + AST_NODE_TYPES["VariableDeclaration"] = "VariableDeclaration"; + AST_NODE_TYPES["BlockStatement"] = "BlockStatement"; + AST_NODE_TYPES["ReturnStatement"] = "ReturnStatement"; + AST_NODE_TYPES["FunctionDeclaration"] = "FunctionDeclaration"; + AST_NODE_TYPES["VariableDeclarator"] = "VariableDeclarator"; + AST_NODE_TYPES["AssignmentExpression"] = "AssignmentExpression"; + AST_NODE_TYPES["LogicalExpression"] = "LogicalExpression"; + AST_NODE_TYPES["BinaryExpression"] = "BinaryExpression"; + AST_NODE_TYPES["ArrayExpression"] = "ArrayExpression"; + AST_NODE_TYPES["UnaryExpression"] = "UnaryExpression"; + AST_NODE_TYPES["UpdateExpression"] = "UpdateExpression"; + AST_NODE_TYPES["FunctionExpression"] = "FunctionExpression"; + AST_NODE_TYPES["MemberExpression"] = "MemberExpression"; + AST_NODE_TYPES["ConditionalExpression"] = "ConditionalExpression"; + AST_NODE_TYPES["ExpressionStatement"] = "ExpressionStatement"; + AST_NODE_TYPES["CallExpression"] = "CallExpression"; + AST_NODE_TYPES["NumThreadStatement"] = "NumThreadStatement"; + AST_NODE_TYPES["StorageStatement"] = "StorageStatement"; + AST_NODE_TYPES["DoWhileStatement"] = "DoWhileStatement"; + AST_NODE_TYPES["WhileStatement"] = "WhileStatement"; + AST_NODE_TYPES["ForStatement"] = "ForStatement"; + AST_NODE_TYPES["BreakStatement"] = "BreakStatement"; + AST_NODE_TYPES["ContinueStatement"] = "ContinueStatement"; + AST_NODE_TYPES["IfStatement"] = "IfStatement"; + AST_NODE_TYPES["ImportedFunctionStatement"] = "ImportedFunctionStatement"; +})(AST_NODE_TYPES || (AST_NODE_TYPES = {})); + +var STORAGE_CLASS; + +(function (STORAGE_CLASS) { + STORAGE_CLASS["Input"] = "Input"; + STORAGE_CLASS["Output"] = "Output"; + STORAGE_CLASS["Uniform"] = "Uniform"; + STORAGE_CLASS["Workgroup"] = "Workgroup"; + STORAGE_CLASS["UniformConstant"] = "UniformConstant"; + STORAGE_CLASS["Image"] = "Image"; + STORAGE_CLASS["StorageBuffer"] = "StorageBuffer"; + STORAGE_CLASS["Private"] = "Private"; + STORAGE_CLASS["Function"] = "Function"; +})(STORAGE_CLASS || (STORAGE_CLASS = {})); + +/** + * 根据目标平台生成 Shader 代码 + * * WebGL GLSL 1.0 + * * WebGPU Chrome/Edge GLSL 4.5 & WGSL @see https://gpuweb.github.io/gpuweb/wgsl.html + * * Safari WHLSL (maybe deprecated) + */ +var Target; + +(function (Target) { + Target["GLSL100"] = "GLSL100"; + Target["GLSL450"] = "GLSL450"; + Target["WGSL"] = "WGSL"; +})(Target || (Target = {})); + +var DefineValuePlaceholder = '__DefineValuePlaceholder__'; + +function isNumber$1(value) { + return typeof value === 'number'; +} + +function getAngle(angle) { + if (angle === undefined) { + return 0; + } else if (angle > 360 || angle < -360) { + return angle % 360; + } + + return angle; +} +function createVec3(x, y, z) { + if (isNumber$1(x)) { + return fromValues$3(x, y, z); + } + + if (x.length === 3) { + return clone$4(x); + } // @ts-ignore + + + return fromValues$3(x[0], x[1], x[2]); +} + +/** + * 保存相机状态，便于后续在多个 Landmark 间移动 + */ +var Landmark = /*#__PURE__*/function () { + function Landmark(name, c) { + _classCallCheck(this, Landmark); + + this.name = void 0; + this.matrix = void 0; + this.right = void 0; + this.up = void 0; + this.forward = void 0; + this.position = void 0; + this.focalPoint = void 0; + this.distanceVector = void 0; + this.distance = void 0; + this.dollyingStep = void 0; + this.azimuth = 0; + this.elevation = 0; + this.roll = 0; + this.relAzimuth = 0; + this.relElevation = 0; + this.relRoll = 0; + this.name = name; + this.matrix = clone$5(c.matrix); + this.right = clone$4(c.right); + this.up = clone$4(c.up); + this.forward = clone$4(c.forward); + this.position = clone$4(c.position); + this.focalPoint = clone$4(c.focalPoint); + this.distanceVector = clone$4(c.distanceVector); + this.azimuth = c.azimuth; + this.elevation = c.elevation; + this.roll = c.roll; + this.relAzimuth = c.relAzimuth; + this.relElevation = c.relElevation; + this.relRoll = c.relRoll; + this.dollyingStep = c.dollyingStep; + this.distance = c.distance; + } + + _createClass(Landmark, [{ + key: "getPosition", + value: function getPosition() { + return this.position; + } + }, { + key: "getFocalPoint", + value: function getFocalPoint() { + return this.focalPoint; + } + }, { + key: "getRoll", + value: function getRoll() { + return this.roll; + } + }, { + key: "retrieve", + value: function retrieve(c) { + c.matrix = copy$4(c.matrix, this.matrix); + c.right = copy$3(c.right, this.right); + c.up = copy$3(c.up, this.up); + c.forward = copy$3(c.forward, this.forward); + c.position = copy$3(c.position, this.position); + c.focalPoint = copy$3(c.focalPoint, this.focalPoint); + c.distanceVector = copy$3(c.distanceVector, this.distanceVector); + c.azimuth = this.azimuth; + c.elevation = this.elevation; + c.roll = this.roll; + c.relAzimuth = this.relAzimuth; + c.relElevation = this.relElevation; + c.relRoll = this.relRoll; + c.dollyingStep = this.dollyingStep; + c.distance = this.distance; + } + }]); + + return Landmark; +}(); + +var _dec$k, _dec2$c, _class$k, _class2$c, _descriptor$c, _class3$3, _temp$g; +var CAMERA_TYPE; + +(function (CAMERA_TYPE) { + CAMERA_TYPE["ORBITING"] = "ORBITING"; + CAMERA_TYPE["EXPLORING"] = "EXPLORING"; + CAMERA_TYPE["TRACKING"] = "TRACKING"; +})(CAMERA_TYPE || (CAMERA_TYPE = {})); + +var CAMERA_TRACKING_MODE; + +(function (CAMERA_TRACKING_MODE) { + CAMERA_TRACKING_MODE["DEFAULT"] = "DEFAULT"; + CAMERA_TRACKING_MODE["ROTATIONAL"] = "ROTATIONAL"; + CAMERA_TRACKING_MODE["TRANSLATIONAL"] = "TRANSLATIONAL"; + CAMERA_TRACKING_MODE["CINEMATIC"] = "CINEMATIC"; +})(CAMERA_TRACKING_MODE || (CAMERA_TRACKING_MODE = {})); + +var CAMERA_PROJECTION_MODE; + +(function (CAMERA_PROJECTION_MODE) { + CAMERA_PROJECTION_MODE["ORTHOGRAPHIC"] = "ORTHOGRAPHIC"; + CAMERA_PROJECTION_MODE["PERSPECTIVE"] = "PERSPECTIVE"; +})(CAMERA_PROJECTION_MODE || (CAMERA_PROJECTION_MODE = {})); + +var DEG_2_RAD = Math.PI / 180; +var RAD_2_DEG = 180 / Math.PI; +/** + * 参考「WebGL Insights - 23.Designing Cameras for WebGL Applications」，基于 Responsible Camera 思路设计 + * 保存相机参数，定义相机动作： + * 1. dolly 沿 n 轴移动 + * 2. pan 沿 u v 轴移动 + * 3. rotate 以方位角旋转 + * 4. 移动到 Landmark，具有平滑的动画效果，其间禁止其他用户交互 + */ + +var Camera = (_dec$k = inversify.injectable(), _dec2$c = inversify.inject(IDENTIFIER.InteractorService), _dec$k(_class$k = (_class2$c = (_temp$g = _class3$3 = /*#__PURE__*/function () { + function Camera() { + _classCallCheck(this, Camera); + + this.matrix = create$5(); + this.right = fromValues$3(1, 0, 0); + this.up = fromValues$3(0, 1, 0); + this.forward = fromValues$3(0, 0, 1); + this.position = fromValues$3(0, 0, 1); + this.focalPoint = fromValues$3(0, 0, 0); + this.distanceVector = fromValues$3(0, 0, 0); + this.distance = 1; + this.azimuth = 0; + this.elevation = 0; + this.roll = 0; + this.relAzimuth = 0; + this.relElevation = 0; + this.relRoll = 0; + this.dollyingStep = 0; + this.maxDistance = Infinity; + this.minDistance = -Infinity; + this.rotateWorld = false; + + _initializerDefineProperty(this, "interactor", _descriptor$c, this); + + this.fov = 30; + this.near = 0.1; + this.far = 10000; + this.aspect = 1; + this.left = void 0; + this.rright = void 0; + this.top = void 0; + this.bottom = void 0; + this.zoom = 1; + this.perspective = create$5(); + this.view = void 0; + this.following = undefined; + this.type = CAMERA_TYPE.EXPLORING; + this.trackingMode = CAMERA_TRACKING_MODE.DEFAULT; + this.projectionMode = CAMERA_PROJECTION_MODE.PERSPECTIVE; + this.frustum = new Frustum(); + this.landmarks = []; + this.landmarkAnimationID = void 0; + } + + _createClass(Camera, [{ + key: "clone", + value: function clone() { + var camera = new Camera(); + camera.setType(this.type, undefined); + camera.interactor = this.interactor; + return camera; + } + }, { + key: "getProjectionMode", + value: function getProjectionMode() { + return this.projectionMode; + } + }, { + key: "getPerspective", + value: function getPerspective() { + return this.perspective; + } + }, { + key: "getFrustum", + value: function getFrustum() { + return this.frustum; + } + }, { + key: "getPosition", + value: function getPosition() { + return this.position; + } + }, { + key: "setType", + value: function setType(type, trackingMode) { + this.type = type; + + if (this.type === CAMERA_TYPE.EXPLORING) { + this.setWorldRotation(true); + } else { + this.setWorldRotation(false); + } + + this._getAngles(); + + if (this.type === CAMERA_TYPE.TRACKING && trackingMode !== undefined) { + this.setTrackingMode(trackingMode); + } + + return this; + } + }, { + key: "setProjectionMode", + value: function setProjectionMode(projectionMode) { + this.projectionMode = projectionMode; + return this; + } + }, { + key: "setTrackingMode", + value: function setTrackingMode(trackingMode) { + if (this.type !== CAMERA_TYPE.TRACKING) { + throw new Error('Impossible to set a tracking mode if the camera is not of tracking type'); + } + + this.trackingMode = trackingMode; + return this; + } + /** + * If flag is true, it reverses the azimuth and elevation angles. + * Subsequent calls to rotate, setAzimuth, setElevation, + * changeAzimuth or changeElevation will cause the inverted effect. + * setRoll or changeRoll is not affected by this method. + * + * This inversion is useful when one wants to simulate that the world + * is moving, instead of the camera. + * + * By default the camera angles are not reversed. + * @param {Boolean} flag the boolean flag to reverse the angles. + */ + + }, { + key: "setWorldRotation", + value: function setWorldRotation(flag) { + this.rotateWorld = flag; + + this._getAngles(); + } + /** + * 计算 MV 矩阵，为相机矩阵的逆矩阵 + */ + + }, { + key: "getViewTransform", + value: function getViewTransform() { + return invert$3(create$5(), this.matrix); + } + }, { + key: "getWorldTransform", + value: function getWorldTransform() { + return this.matrix; + } + /** + * 设置相机矩阵 + */ + + }, { + key: "setMatrix", + value: function setMatrix(matrix) { + this.matrix = matrix; + + this._update(); + + return this; + } + }, { + key: "setAspect", + value: function setAspect(aspect) { + this.setPerspective(this.near, this.far, this.fov, aspect); + return this; + } + /** + * Sets an offset in a larger frustum, used in PixelPicking + */ + + }, { + key: "setViewOffset", + value: function setViewOffset(fullWidth, fullHeight, x, y, width, height) { + this.aspect = fullWidth / fullHeight; + + if (this.view === undefined) { + this.view = { + enabled: true, + fullWidth: 1, + fullHeight: 1, + offsetX: 0, + offsetY: 0, + width: 1, + height: 1 + }; + } + + this.view.enabled = true; + this.view.fullWidth = fullWidth; + this.view.fullHeight = fullHeight; + this.view.offsetX = x; + this.view.offsetY = y; + this.view.width = width; + this.view.height = height; + + if (this.projectionMode === CAMERA_PROJECTION_MODE.PERSPECTIVE) { + this.setPerspective(this.near, this.far, this.fov, this.aspect); + } else { + this.setOrthographic(this.left, this.rright, this.top, this.bottom, this.near, this.far); + } + + return this; + } + }, { + key: "clearViewOffset", + value: function clearViewOffset() { + if (this.view !== undefined) { + this.view.enabled = false; + } + + if (this.projectionMode === CAMERA_PROJECTION_MODE.PERSPECTIVE) { + this.setPerspective(this.near, this.far, this.fov, this.aspect); + } else { + this.setOrthographic(this.left, this.rright, this.top, this.bottom, this.near, this.far); + } + + return this; + } + }, { + key: "setPerspective", + value: function setPerspective(near, far, fov, aspect) { + this.projectionMode = CAMERA_PROJECTION_MODE.PERSPECTIVE; + this.fov = fov; + this.near = near; + this.far = far; + this.aspect = aspect; + perspective(this.perspective, this.fov * DEG_2_RAD, this.aspect, this.near, this.far); + return this; + } + }, { + key: "setOrthographic", + value: function setOrthographic(l, r, t, b, near, far) { + this.projectionMode = CAMERA_PROJECTION_MODE.ORTHOGRAPHIC; + this.rright = r; + this.left = l; + this.top = t; + this.bottom = b; + this.near = near; + this.far = far; + var dx = (this.rright - this.left) / (2 * this.zoom); + var dy = (this.top - this.bottom) / (2 * this.zoom); + var cx = (this.rright + this.left) / 2; + var cy = (this.top + this.bottom) / 2; + var left = cx - dx; + var right = cx + dx; + var top = cy + dy; + var bottom = cy - dy; + + if (this.view !== undefined && this.view.enabled) { + var scaleW = (this.rright - this.left) / this.view.fullWidth / this.zoom; + var scaleH = (this.top - this.bottom) / this.view.fullHeight / this.zoom; + left += scaleW * this.view.offsetX; + right = left + scaleW * this.view.width; + top -= scaleH * this.view.offsetY; + bottom = top - scaleH * this.view.height; + } + + ortho(this.perspective, left, right, top, bottom, near, far); + return this; + } + /** + * 设置相机位置 + */ + + }, { + key: "setPosition", + value: function setPosition(x, y, z) { + this._setPosition(x, y, z); + + this.setFocalPoint(this.focalPoint); + return this; + } + /** + * 设置视点位置 + */ + + }, { + key: "setFocalPoint", + value: function setFocalPoint(x, y, z) { + var up = fromValues$3(0, 1, 0); + this.focalPoint = createVec3(x, y, z); + + if (this.trackingMode === CAMERA_TRACKING_MODE.CINEMATIC) { + var d = subtract$3(create$4(), this.focalPoint, this.position); + x = d[0]; + y = d[1]; + z = d[2]; + var r = length$2(d); + var el = Math.asin(y / r) * RAD_2_DEG; + var az = 90 + Math.atan2(z, x) * RAD_2_DEG; + var m = create$5(); + rotateY(m, m, az * DEG_2_RAD); + rotateX(m, m, el * DEG_2_RAD); + up = transformMat4$2(create$4(), [0, 1, 0], m); + } + + invert$3(this.matrix, lookAt(create$5(), this.position, this.focalPoint, up)); + + this._getAxes(); + + this._getDistance(); + + this._getAngles(); + + return this; + } + /** + * 固定当前视点，按指定距离放置相机 + */ + + }, { + key: "setDistance", + value: function setDistance(d) { + if (this.distance === d || d < 0) { + return; + } + + this.distance = d; + + if (this.distance < 0.0002) { + this.distance = 0.0002; + } + + this.dollyingStep = this.distance / 100; + var pos = create$4(); + d = this.distance; + var n = this.forward; + var f = this.focalPoint; + pos[0] = d * n[0] + f[0]; + pos[1] = d * n[1] + f[1]; + pos[2] = d * n[2] + f[2]; + + this._setPosition(pos); + + return this; + } + }, { + key: "setMaxDistance", + value: function setMaxDistance(d) { + this.maxDistance = d; + return this; + } + }, { + key: "setMinDistance", + value: function setMinDistance(d) { + this.minDistance = d; + return this; + } + /** + * Changes the initial azimuth of the camera + */ + + }, { + key: "changeAzimuth", + value: function changeAzimuth(az) { + this.setAzimuth(this.azimuth + az); + return this; + } + /** + * Changes the initial elevation of the camera + */ + + }, { + key: "changeElevation", + value: function changeElevation(el) { + this.setElevation(this.elevation + el); + return this; + } + /** + * Changes the initial roll of the camera + */ + + }, { + key: "changeRoll", + value: function changeRoll(rl) { + this.setRoll(this.roll + rl); + return this; + } + /** + * 设置相机方位角，不同相机模式下需要重新计算相机位置或者是视点位置 + * @param {Number} el the azimuth in degrees + */ + + }, { + key: "setAzimuth", + value: function setAzimuth(az) { + this.azimuth = getAngle(az); + this.computeMatrix(); + + this._getAxes(); + + if (this.type === CAMERA_TYPE.ORBITING || this.type === CAMERA_TYPE.EXPLORING) { + this._getPosition(); + } else if (this.type === CAMERA_TYPE.TRACKING) { + this._getFocalPoint(); + } + + return this; + } + }, { + key: "getAzimuth", + value: function getAzimuth() { + return this.azimuth; + } + /** + * 设置相机方位角，不同相机模式下需要重新计算相机位置或者是视点位置 + * @param {Number} el the elevation in degrees + */ + + }, { + key: "setElevation", + value: function setElevation(el) { + this.elevation = getAngle(el); + this.computeMatrix(); + + this._getAxes(); + + if (this.type === CAMERA_TYPE.ORBITING || this.type === CAMERA_TYPE.EXPLORING) { + this._getPosition(); + } else if (this.type === CAMERA_TYPE.TRACKING) { + this._getFocalPoint(); + } + + return this; + } + /** + * 设置相机方位角，不同相机模式下需要重新计算相机位置或者是视点位置 + * @param {Number} angle the roll angle + */ + + }, { + key: "setRoll", + value: function setRoll(angle) { + this.roll = getAngle(angle); + this.computeMatrix(); + + this._getAxes(); + + if (this.type === CAMERA_TYPE.ORBITING || this.type === CAMERA_TYPE.EXPLORING) { + this._getPosition(); + } else if (this.type === CAMERA_TYPE.TRACKING) { + this._getFocalPoint(); + } + + return this; + } + /** + * Changes the azimuth and elevation with respect to the current camera axes + * @param {Number} azimuth the relative azimuth + * @param {Number} elevation the relative elevation + * @param {Number} roll the relative roll + */ + + }, { + key: "rotate", + value: function rotate(azimuth, elevation, roll) { + if (this.type === CAMERA_TYPE.EXPLORING) { + azimuth = getAngle(azimuth); + elevation = getAngle(elevation); + roll = getAngle(roll); + var rotX = setAxisAngle(create$2(), [1, 0, 0], (this.rotateWorld ? 1 : -1) * elevation * DEG_2_RAD); + var rotY = setAxisAngle(create$2(), [0, 1, 0], (this.rotateWorld ? 1 : -1) * azimuth * DEG_2_RAD); + var rotZ = setAxisAngle(create$2(), [0, 0, 1], roll * DEG_2_RAD); + var rotQ = multiply$1(create$2(), rotY, rotX); + rotQ = multiply$1(create$2(), rotQ, rotZ); + var rotMatrix = fromQuat(create$5(), rotQ); + translate$2(this.matrix, this.matrix, [0, 0, -this.distance]); + multiply$3(this.matrix, this.matrix, rotMatrix); + translate$2(this.matrix, this.matrix, [0, 0, this.distance]); + } else { + if (Math.abs(this.elevation + elevation) > 90) { + return; + } + + this.relElevation = getAngle(elevation); + this.relAzimuth = getAngle(azimuth); + this.relRoll = getAngle(roll); + this.elevation += this.relElevation; + this.azimuth += this.relAzimuth; + this.roll += this.relRoll; + this.computeMatrix(); + } + + this._getAxes(); + + if (this.type === CAMERA_TYPE.ORBITING || this.type === CAMERA_TYPE.EXPLORING) { + this._getPosition(); + } else if (this.type === CAMERA_TYPE.TRACKING) { + this._getFocalPoint(); + } + + this._update(); + + return this; + } + /** + * 沿水平(right) & 垂直(up)平移相机 + */ + + }, { + key: "pan", + value: function pan(tx, ty) { + var coords = createVec3(tx, ty, 0); + var pos = clone$4(this.position); + add$4(pos, pos, scale$5(create$4(), this.right, coords[0])); + add$4(pos, pos, scale$5(create$4(), this.up, coords[1])); + + this._setPosition(pos); + + return this; + } + /** + * 沿 n 轴移动，当距离视点远时移动速度较快，离视点越近速度越慢 + */ + + }, { + key: "dolly", + value: function dolly(value) { + var n = this.forward; + var pos = clone$4(this.position); + var step = value * this.dollyingStep; + var updatedDistance = this.distance + value * this.dollyingStep; // 限制视点距离范围 + + step = Math.max(Math.min(updatedDistance, this.maxDistance), this.minDistance) - this.distance; + pos[0] += step * n[0]; + pos[1] += step * n[1]; + pos[2] += step * n[2]; + + this._setPosition(pos); + + if (this.type === CAMERA_TYPE.ORBITING || this.type === CAMERA_TYPE.EXPLORING) { + // 重新计算视点距离 + this._getDistance(); + } else if (this.type === CAMERA_TYPE.TRACKING) { + // 保持视距，移动视点位置 + add$4(this.focalPoint, pos, this.distanceVector); + } + + return this; + } + }, { + key: "createLandmark", + value: function createLandmark(name, params) { + var camera = this.clone(); + camera.setPosition(params.position); + camera.setFocalPoint(params.focalPoint); + + if (params.roll !== undefined) { + camera.setRoll(params.roll); + } + + var landmark = new Landmark(name, camera); + this.landmarks.push(landmark); + return landmark; + } + }, { + key: "setLandmark", + value: function setLandmark(name) { + var landmark = new Landmark(name, this); + this.landmarks.push(landmark); + return this; + } + }, { + key: "gotoLandmark", + value: function gotoLandmark(name) { + var _this = this; + + var duration = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1000; + var landmark = this.landmarks.find(function (l) { + return l.name === name; + }); + + if (landmark) { + if (duration === 0) { + landmark.retrieve(this); + return; + } + + if (this.landmarkAnimationID !== undefined) { + window.cancelAnimationFrame(this.landmarkAnimationID); + } // TODO: do not process events during animation + + + this.interactor.disconnect(); + var destPosition = landmark.getPosition(); + var destFocalPoint = landmark.getFocalPoint(); + var destRoll = landmark.getRoll(); + var timeStart; + + var animate = function animate(timestamp) { + if (timeStart === undefined) { + timeStart = timestamp; + } + + var elapsed = timestamp - timeStart; // TODO: use better ease function + + var t = (1 - Math.cos(elapsed / duration * Math.PI)) / 2; + var interFocalPoint = create$4(); + var interPosition = create$4(); + var interRoll = 0; + lerp$2(interFocalPoint, _this.focalPoint, destFocalPoint, t); + lerp$2(interPosition, _this.position, destPosition, t); + interRoll = _this.roll * (1 - t) + destRoll * t; + + _this.setFocalPoint(interFocalPoint); + + _this.setPosition(interPosition); + + _this.setRoll(interRoll); + + _this.computeMatrix(); + + var dist = dist$1(interFocalPoint, destFocalPoint) + dist$1(interPosition, destPosition); + + if (dist > 0.01) ; else { + _this.setFocalPoint(interFocalPoint); + + _this.setPosition(interPosition); + + _this.setRoll(interRoll); + + _this.computeMatrix(); + + _this.interactor.connect(); + + return; + } + + if (elapsed < duration) { + _this.landmarkAnimationID = window.requestAnimationFrame(animate); + } + }; + + window.requestAnimationFrame(animate); + } + } + /** + * 根据相机矩阵重新计算各种相机参数 + */ + + }, { + key: "_update", + value: function _update() { + this._getAxes(); + + this._getPosition(); + + this._getDistance(); + + this._getAngles(); + } + /** + * 计算相机矩阵 + */ + + }, { + key: "computeMatrix", + value: function computeMatrix() { + var rotX; + var rotY; // 使用四元数描述 3D 旋转 + // @see https://xiaoiver.github.io/coding/2018/12/28/Camera-%E8%AE%BE%E8%AE%A1-%E4%B8%80.html + + var rotZ = setAxisAngle(create$2(), [0, 0, 1], this.roll * DEG_2_RAD); + identity$8(this.matrix); // only consider HCS for EXPLORING and ORBITING cameras + + rotX = setAxisAngle(create$2(), [1, 0, 0], (this.rotateWorld && this.type !== CAMERA_TYPE.TRACKING || this.type === CAMERA_TYPE.TRACKING ? 1 : -1) * this.elevation * DEG_2_RAD); + rotY = setAxisAngle(create$2(), [0, 1, 0], (this.rotateWorld && this.type !== CAMERA_TYPE.TRACKING || this.type === CAMERA_TYPE.TRACKING ? 1 : -1) * this.azimuth * DEG_2_RAD); + var rotQ = multiply$1(create$2(), rotY, rotX); + rotQ = multiply$1(create$2(), rotQ, rotZ); + var rotMatrix = fromQuat(create$5(), rotQ); + + if (this.type === CAMERA_TYPE.ORBITING || this.type === CAMERA_TYPE.EXPLORING) { + translate$2(this.matrix, this.matrix, this.focalPoint); + multiply$3(this.matrix, this.matrix, rotMatrix); + translate$2(this.matrix, this.matrix, [0, 0, this.distance]); + } else if (this.type === CAMERA_TYPE.TRACKING) { + translate$2(this.matrix, this.matrix, this.position); + multiply$3(this.matrix, this.matrix, rotMatrix); + } + } + /** + * Sets the camera position in the camera matrix + */ + + }, { + key: "_setPosition", + value: function _setPosition(x, y, z) { + this.position = createVec3(x, y, z); + var m = this.matrix; + m[12] = this.position[0]; + m[13] = this.position[1]; + m[14] = this.position[2]; + m[15] = 1; + } + /** + * Recalculates axes based on the current matrix + */ + + }, { + key: "_getAxes", + value: function _getAxes() { + copy$3(this.right, createVec3(transformMat4$1(create$3(), [1, 0, 0, 0], this.matrix))); + copy$3(this.up, createVec3(transformMat4$1(create$3(), [0, 1, 0, 0], this.matrix))); + copy$3(this.forward, createVec3(transformMat4$1(create$3(), [0, 0, 1, 0], this.matrix))); + normalize$7(this.right, this.right); + normalize$7(this.up, this.up); + normalize$7(this.forward, this.forward); + } + /** + * Recalculates euler angles based on the current state + */ + + }, { + key: "_getAngles", + value: function _getAngles() { + // Recalculates angles + var x = this.distanceVector[0]; + var y = this.distanceVector[1]; + var z = this.distanceVector[2]; + var r = length$2(this.distanceVector); // FAST FAIL: If there is no distance we cannot compute angles + + if (r === 0) { + this.elevation = 0; + this.azimuth = 0; + return; + } + + if (this.type === CAMERA_TYPE.TRACKING) { + this.elevation = Math.asin(y / r) * RAD_2_DEG; + this.azimuth = Math.atan2(-x, -z) * RAD_2_DEG; + } else { + if (this.rotateWorld) { + this.elevation = Math.asin(y / r) * RAD_2_DEG; + this.azimuth = Math.atan2(-x, -z) * RAD_2_DEG; + } else { + this.elevation = -Math.asin(y / r) * RAD_2_DEG; + this.azimuth = -Math.atan2(-x, -z) * RAD_2_DEG; + } + } + } + /** + * 重新计算相机位置，只有 ORBITING 模式相机位置才会发生变化 + */ + + }, { + key: "_getPosition", + value: function _getPosition() { + copy$3(this.position, createVec3(transformMat4$1(create$3(), [0, 0, 0, 1], this.matrix))); // 相机位置变化，需要重新计算视距 + + this._getDistance(); + } + /** + * 重新计算视点，只有 TRACKING 模式视点才会发生变化 + */ + + }, { + key: "_getFocalPoint", + value: function _getFocalPoint() { + transformMat3$2(this.distanceVector, [0, 0, -this.distance], fromMat4(create$6(), this.matrix)); + add$4(this.focalPoint, this.position, this.distanceVector); // 视点变化，需要重新计算视距 + + this._getDistance(); + } + /** + * 重新计算视距 + */ + + }, { + key: "_getDistance", + value: function _getDistance() { + this.distanceVector = subtract$3(create$4(), this.focalPoint, this.position); + this.distance = length$2(this.distanceVector); + this.dollyingStep = this.distance / 100; + } + }]); + + return Camera; +}(), _class3$3.ProjectionMode = { + ORTHOGRAPHIC: 'ORTHOGRAPHIC', + PERSPECTIVE: 'PERSPECTIVE' +}, _temp$g), (_descriptor$c = _applyDecoratedDescriptor(_class2$c.prototype, "interactor", [_dec2$c], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +})), _class2$c)) || _class$k); + +var _dec$j, _dec2$b, _class$j, _class2$b, _descriptor$b, _class3$2, _temp$f; +var Geometry = (_dec$j = inversify.injectable(), _dec2$b = inversify.inject(IDENTIFIER.GeometryComponentManager), _dec$j(_class$j = (_class2$b = (_temp$f = _class3$2 = /*#__PURE__*/function () { + function Geometry() { + _classCallCheck(this, Geometry); + + this.config = void 0; + + _initializerDefineProperty(this, "geometry", _descriptor$b, this); + + this.entity = void 0; + this.component = void 0; + } + + _createClass(Geometry, [{ + key: "getEntity", + value: function getEntity() { + return this.entity; + } + }, { + key: "getComponent", + value: function getComponent() { + return this.component; + } + }, { + key: "setConfig", + value: function setConfig(config) { + this.config = config; + } + }, { + key: "setEntity", + value: function setEntity(entity) { + this.entity = entity; + this.component = this.geometry.create(entity); + this.component.entity = entity; + this.onEntityCreated(); + } + }, { + key: "onEntityCreated", + value: function onEntityCreated() {// + } + }]); + + return Geometry; +}(), _class3$2.BOX = 'box', _class3$2.SPHERE = 'sphere', _class3$2.PLANE = 'plane', _class3$2.MERGED = 'merged', _temp$f), (_descriptor$b = _applyDecoratedDescriptor(_class2$b.prototype, "geometry", [_dec2$b], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +})), _class2$b)) || _class$j); + +var constants = {}; + +(function (exports) { +// https://github.com/gpuweb/gpuweb/blob/01b20b4ad93fabae1e8e0d7752515f69708d33e0/spec/index.bs +Object.defineProperty(exports, "__esModule", { value: true }); +(function (ExtensionName) { + ExtensionName["TextureCompressionBC"] = "texture-compression-bc"; +})(exports.ExtensionName || (exports.ExtensionName = {})); +(function (AddressMode) { + AddressMode["ClampToEdge"] = "clamp-to-edge"; + AddressMode["Repeat"] = "repeat"; + AddressMode["MirrorRepeat"] = "mirror-repeat"; +})(exports.AddressMode || (exports.AddressMode = {})); +(function (BindingType) { + BindingType["UniformBuffer"] = "uniform-buffer"; + BindingType["StorageBuffer"] = "storage-buffer"; + BindingType["ReadonlyStorageBuffer"] = "readonly-storage-buffer"; + BindingType["Sampler"] = "sampler"; + BindingType["ComparisonSampler"] = "comparison-sampler"; + BindingType["SampledTexture"] = "sampled-texture"; + BindingType["ReadonlyStorageTexture"] = "readonly-storage-texture"; + BindingType["WriteonlyStorageTexture"] = "writeonly-storage-texture"; +})(exports.BindingType || (exports.BindingType = {})); +(function (BlendFactor) { + BlendFactor["Zero"] = "zero"; + BlendFactor["One"] = "one"; + BlendFactor["SrcColor"] = "src-color"; + BlendFactor["OneMinusSrcColor"] = "one-minus-src-color"; + BlendFactor["SrcAlpha"] = "src-alpha"; + BlendFactor["OneMinusSrcAlpha"] = "one-minus-src-alpha"; + BlendFactor["DstColor"] = "dst-color"; + BlendFactor["OneMinusDstColor"] = "one-minus-dst-color"; + BlendFactor["DstAlpha"] = "dst-alpha"; + BlendFactor["OneMinusDstAlpha"] = "one-minus-dst-alpha"; + BlendFactor["SrcAlphaSaturated"] = "src-alpha-saturated"; + BlendFactor["BlendColor"] = "blend-color"; + BlendFactor["OneMinusBlendColor"] = "one-minus-blend-color"; +})(exports.BlendFactor || (exports.BlendFactor = {})); +(function (BlendOperation) { + BlendOperation["Add"] = "add"; + BlendOperation["Subtract"] = "subtract"; + BlendOperation["ReverseSubtract"] = "reverse-subtract"; + BlendOperation["Min"] = "min"; + BlendOperation["Max"] = "max"; +})(exports.BlendOperation || (exports.BlendOperation = {})); +(function (CompareFunction) { + CompareFunction["Never"] = "never"; + CompareFunction["Less"] = "less"; + CompareFunction["Equal"] = "equal"; + CompareFunction["LessEqual"] = "less-equal"; + CompareFunction["Greater"] = "greater"; + CompareFunction["NotEqual"] = "not-equal"; + CompareFunction["GreaterEqual"] = "greater-equal"; + CompareFunction["Always"] = "always"; +})(exports.CompareFunction || (exports.CompareFunction = {})); +(function (CullMode) { + CullMode["None"] = "none"; + CullMode["Front"] = "front"; + CullMode["Back"] = "back"; +})(exports.CullMode || (exports.CullMode = {})); +(function (FilterMode) { + FilterMode["Nearest"] = "nearest"; + FilterMode["Linear"] = "linear"; +})(exports.FilterMode || (exports.FilterMode = {})); +(function (FrontFace) { + FrontFace["CCW"] = "ccw"; + FrontFace["CW"] = "cw"; +})(exports.FrontFace || (exports.FrontFace = {})); +(function (IndexFormat) { + IndexFormat["Uint16"] = "uint16"; + IndexFormat["Uint32"] = "uint32"; +})(exports.IndexFormat || (exports.IndexFormat = {})); +(function (InputStepMode) { + InputStepMode["Vertex"] = "vertex"; + InputStepMode["Instance"] = "instance"; +})(exports.InputStepMode || (exports.InputStepMode = {})); +(function (LoadOp) { + LoadOp["Load"] = "load"; +})(exports.LoadOp || (exports.LoadOp = {})); +(function (PrimitiveTopology) { + PrimitiveTopology["PointList"] = "point-list"; + PrimitiveTopology["LineList"] = "line-list"; + PrimitiveTopology["LineStrip"] = "line-strip"; + PrimitiveTopology["TriangleList"] = "triangle-list"; + PrimitiveTopology["TriangleStrip"] = "triangle-strip"; +})(exports.PrimitiveTopology || (exports.PrimitiveTopology = {})); +(function (StencilOperation) { + StencilOperation["Keep"] = "keep"; + StencilOperation["Zero"] = "zero"; + StencilOperation["Replace"] = "replace"; + StencilOperation["Invert"] = "invert"; + StencilOperation["IncrementClamp"] = "increment-clamp"; + StencilOperation["DecrementClamp"] = "decrement-clamp"; + StencilOperation["IncrementWrap"] = "increment-wrap"; + StencilOperation["DecrementWrap"] = "decrement-wrap"; +})(exports.StencilOperation || (exports.StencilOperation = {})); +(function (StoreOp) { + StoreOp["Store"] = "store"; + StoreOp["Clear"] = "clear"; +})(exports.StoreOp || (exports.StoreOp = {})); +(function (TextureDimension) { + TextureDimension["E1d"] = "1d"; + TextureDimension["E2d"] = "2d"; + TextureDimension["E3d"] = "3d"; +})(exports.TextureDimension || (exports.TextureDimension = {})); +(function (TextureFormat) { + TextureFormat["R8Unorm"] = "r8unorm"; + TextureFormat["R8Snorm"] = "r8snorm"; + TextureFormat["R8Uint"] = "r8uint"; + TextureFormat["R8Sint"] = "r8sint"; + TextureFormat["R16Uint"] = "r16uint"; + TextureFormat["R16Sint"] = "r16sint"; + TextureFormat["R16Float"] = "r16float"; + TextureFormat["RG8Unorm"] = "rg8unorm"; + TextureFormat["RG8Snorm"] = "rg8snorm"; + TextureFormat["RG8Uint"] = "rg8uint"; + TextureFormat["RG8Sint"] = "rg8sint"; + TextureFormat["R32Uint"] = "r32uint"; + TextureFormat["R32Sint"] = "r32sint"; + TextureFormat["R32Float"] = "r32float"; + TextureFormat["RG16Uint"] = "rg16uint"; + TextureFormat["RG16Sint"] = "rg16sint"; + TextureFormat["RG16Float"] = "rg16float"; + TextureFormat["RGBA8Unorm"] = "rgba8unorm"; + TextureFormat["RGBA8UnormSRGB"] = "rgba8unorm-srgb"; + TextureFormat["RGBA8Snorm"] = "rgba8snorm"; + TextureFormat["RGBA8Uint"] = "rgba8uint"; + TextureFormat["RGBA8Sint"] = "rgba8sint"; + TextureFormat["BGRA8Unorm"] = "bgra8unorm"; + TextureFormat["BGRA8UnormSRGB"] = "bgra8unorm-srgb"; + TextureFormat["RGB10A2Unorm"] = "rgb10a2unorm"; + TextureFormat["RG11B10Float"] = "rg11b10float"; + TextureFormat["RG32Uint"] = "rg32uint"; + TextureFormat["RG32Sint"] = "rg32sint"; + TextureFormat["RG32Float"] = "rg32float"; + TextureFormat["RGBA16Uint"] = "rgba16uint"; + TextureFormat["RGBA16Sint"] = "rgba16sint"; + TextureFormat["RGBA16Float"] = "rgba16float"; + TextureFormat["RGBA32Uint"] = "rgba32uint"; + TextureFormat["RGBA32Sint"] = "rgba32sint"; + TextureFormat["RGBA32Float"] = "rgba32float"; + TextureFormat["Depth32Float"] = "depth32float"; + TextureFormat["Depth24Plus"] = "depth24plus"; + TextureFormat["Depth24PlusStencil8"] = "depth24plus-stencil8"; +})(exports.TextureFormat || (exports.TextureFormat = {})); +(function (TextureComponentType) { + TextureComponentType["Float"] = "float"; + TextureComponentType["Sint"] = "sint"; + TextureComponentType["Uint"] = "uint"; +})(exports.TextureComponentType || (exports.TextureComponentType = {})); +(function (TextureViewDimension) { + TextureViewDimension["E1d"] = "1d"; + TextureViewDimension["E2d"] = "2d"; + TextureViewDimension["E2dArray"] = "2d-array"; + TextureViewDimension["Cube"] = "cube"; + TextureViewDimension["CubeArray"] = "cube-array"; + TextureViewDimension["E3d"] = "3d"; +})(exports.TextureViewDimension || (exports.TextureViewDimension = {})); +(function (VertexFormat) { + VertexFormat["Uchar2"] = "uchar2"; + VertexFormat["Uchar4"] = "uchar4"; + VertexFormat["Char2"] = "char2"; + VertexFormat["Char4"] = "char4"; + VertexFormat["Uchar2Norm"] = "uchar2norm"; + VertexFormat["Uchar4Norm"] = "uchar4norm"; + VertexFormat["Char2Norm"] = "char2norm"; + VertexFormat["Char4Norm"] = "char4norm"; + VertexFormat["Ushort2"] = "ushort2"; + VertexFormat["Ushort4"] = "ushort4"; + VertexFormat["Short2"] = "short2"; + VertexFormat["Short4"] = "short4"; + VertexFormat["Ushort2Norm"] = "ushort2norm"; + VertexFormat["Ushort4Norm"] = "ushort4norm"; + VertexFormat["Short2Norm"] = "short2norm"; + VertexFormat["Short4Norm"] = "short4norm"; + VertexFormat["Half2"] = "half2"; + VertexFormat["Half4"] = "half4"; + VertexFormat["Float"] = "float"; + VertexFormat["Float2"] = "float2"; + VertexFormat["Float3"] = "float3"; + VertexFormat["Float4"] = "float4"; + VertexFormat["Uint"] = "uint"; + VertexFormat["Uint2"] = "uint2"; + VertexFormat["Uint3"] = "uint3"; + VertexFormat["Uint4"] = "uint4"; + VertexFormat["Int"] = "int"; + VertexFormat["Int2"] = "int2"; + VertexFormat["Int3"] = "int3"; + VertexFormat["Int4"] = "int4"; +})(exports.VertexFormat || (exports.VertexFormat = {})); +(function (TextureAspect) { + TextureAspect["All"] = "all"; + TextureAspect["StencilOnly"] = "stencil-only"; + TextureAspect["DepthOnly"] = "depth-only"; +})(exports.TextureAspect || (exports.TextureAspect = {})); +(function (CompilationMessageType) { + CompilationMessageType["Error"] = "error"; + CompilationMessageType["Warning"] = "warning"; + CompilationMessageType["Info"] = "info"; +})(exports.CompilationMessageType || (exports.CompilationMessageType = {})); +(function (QueryType) { + QueryType["Occlusion"] = "occlusion"; +})(exports.QueryType || (exports.QueryType = {})); +(function (BufferUsage) { + BufferUsage[BufferUsage["MapRead"] = 1] = "MapRead"; + BufferUsage[BufferUsage["MapWrite"] = 2] = "MapWrite"; + BufferUsage[BufferUsage["CopySrc"] = 4] = "CopySrc"; + BufferUsage[BufferUsage["CopyDst"] = 8] = "CopyDst"; + BufferUsage[BufferUsage["Index"] = 16] = "Index"; + BufferUsage[BufferUsage["Vertex"] = 32] = "Vertex"; + BufferUsage[BufferUsage["Uniform"] = 64] = "Uniform"; + BufferUsage[BufferUsage["Storage"] = 128] = "Storage"; + BufferUsage[BufferUsage["Indirect"] = 256] = "Indirect"; + BufferUsage[BufferUsage["QueryResolve"] = 512] = "QueryResolve"; +})(exports.BufferUsage || (exports.BufferUsage = {})); +(function (ColorWrite) { + ColorWrite[ColorWrite["Red"] = 1] = "Red"; + ColorWrite[ColorWrite["Green"] = 2] = "Green"; + ColorWrite[ColorWrite["Blue"] = 4] = "Blue"; + ColorWrite[ColorWrite["Alpha"] = 8] = "Alpha"; + ColorWrite[ColorWrite["All"] = 15] = "All"; +})(exports.ColorWrite || (exports.ColorWrite = {})); +(function (ShaderStage) { + ShaderStage[ShaderStage["Vertex"] = 1] = "Vertex"; + ShaderStage[ShaderStage["Fragment"] = 2] = "Fragment"; + ShaderStage[ShaderStage["Compute"] = 4] = "Compute"; +})(exports.ShaderStage || (exports.ShaderStage = {})); +(function (TextureUsage) { + TextureUsage[TextureUsage["CopySrc"] = 1] = "CopySrc"; + TextureUsage[TextureUsage["CopyDst"] = 2] = "CopyDst"; + TextureUsage[TextureUsage["Sampled"] = 4] = "Sampled"; + TextureUsage[TextureUsage["Storage"] = 8] = "Storage"; + TextureUsage[TextureUsage["OutputAttachment"] = 16] = "OutputAttachment"; +})(exports.TextureUsage || (exports.TextureUsage = {})); +(function (MapMode) { + MapMode[MapMode["Read"] = 1] = "Read"; + MapMode[MapMode["Write"] = 2] = "Write"; +})(exports.MapMode || (exports.MapMode = {})); +}(constants)); + +function createCanvas() { + if (typeof document !== 'undefined') { + return document.createElement('canvas'); + } else { + throw new Error('Cannot create a canvas in this context'); + } +} + +var toString = {}.toString; + +var isType = function isType(value, type) { + return toString.call(value) === '[object ' + type + ']'; +}; + +var isArray = (function (value) { + return Array.isArray ? Array.isArray(value) : isType(value, 'Array'); +}); + +/** Used as references for various `Number` constants. */ +var MAX_SAFE_INTEGER$1 = 9007199254740991; +/** `Object#toString` result references. */ + +var argsTag$1 = '[object Arguments]'; +var arrayTag$1 = '[object Array]'; +var boolTag$1 = '[object Boolean]'; +var dateTag$1 = '[object Date]'; +var errorTag$1 = '[object Error]'; +var funcTag$1 = '[object Function]'; +var mapTag$1 = '[object Map]'; +var numberTag$1 = '[object Number]'; +var objectTag$1 = '[object Object]'; +var regexpTag$1 = '[object RegExp]'; +var setTag$2 = '[object Set]'; +var stringTag$1 = '[object String]'; +var weakMapTag$1 = '[object WeakMap]'; +var arrayBufferTag$1 = '[object ArrayBuffer]'; +var dataViewTag$1 = '[object DataView]'; +var float32Tag$1 = '[object Float32Array]'; +var float64Tag$1 = '[object Float64Array]'; +var int8Tag$1 = '[object Int8Array]'; +var int16Tag$1 = '[object Int16Array]'; +var int32Tag$1 = '[object Int32Array]'; +var uint8Tag$1 = '[object Uint8Array]'; +var uint8ClampedTag$1 = '[object Uint8ClampedArray]'; +var uint16Tag$1 = '[object Uint16Array]'; +var uint32Tag$1 = '[object Uint32Array]'; +/** Used to identify `toStringTag` values of typed arrays. */ + +var typedArrayTags$1 = {}; +typedArrayTags$1[float32Tag$1] = typedArrayTags$1[float64Tag$1] = typedArrayTags$1[int8Tag$1] = typedArrayTags$1[int16Tag$1] = typedArrayTags$1[int32Tag$1] = typedArrayTags$1[uint8Tag$1] = typedArrayTags$1[uint8ClampedTag$1] = typedArrayTags$1[uint16Tag$1] = typedArrayTags$1[uint32Tag$1] = true; +typedArrayTags$1[argsTag$1] = typedArrayTags$1[arrayTag$1] = typedArrayTags$1[arrayBufferTag$1] = typedArrayTags$1[boolTag$1] = typedArrayTags$1[dataViewTag$1] = typedArrayTags$1[dateTag$1] = typedArrayTags$1[errorTag$1] = typedArrayTags$1[funcTag$1] = typedArrayTags$1[mapTag$1] = typedArrayTags$1[numberTag$1] = typedArrayTags$1[objectTag$1] = typedArrayTags$1[regexpTag$1] = typedArrayTags$1[setTag$2] = typedArrayTags$1[stringTag$1] = typedArrayTags$1[weakMapTag$1] = false; +/** Used for built-in method references. */ + + +var objectProto$1 = Object.prototype; +/** + * Used to resolve the + * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring) + * of values. + */ + +var objectToString$1 = objectProto$1.toString; +/** + * The base implementation of `_.isTypedArray` without Node.js optimizations. + * + * @private + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is a typed array, else `false`. + */ + +function baseIsTypedArray$1(value) { + return isObjectLike$1(value) && isLength$1(value.length) && !!typedArrayTags$1[objectToString$1.call(value)]; +} + +function isLength$1(value) { + return typeof value === 'number' && value > -1 && value % 1 === 0 && value <= MAX_SAFE_INTEGER$1; +} + +function isObjectLike$1(value) { + return !!value && _typeof$1(value) === 'object'; +} +/** + * Checks if `value` is classified as a typed array. + * + * @static + * @memberOf _ + * @since 3.0.0 + * @category Lang + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is a typed array, else `false`. + * @example + * + * _.isTypedArray(new Uint8Array); + * // => true + * + * _.isTypedArray([]); + * // => false + */ + + +var isTypedArray$1 = baseIsTypedArray$1; + +var _dec$i, _dec2$a, _dec3$8, _class$i, _class2$a, _descriptor$a, _descriptor2$7, _temp$e; + +function ownKeys$6(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; } + +function _objectSpread$6(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$6(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$6(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; } +var Kernel = (_dec$i = inversify.injectable(), _dec2$a = inversify.inject(IDENTIFIER.RenderEngine), _dec3$8 = inversify.inject(IDENTIFIER.ConfigService), _dec$i(_class$i = (_class2$a = (_temp$e = /*#__PURE__*/function () { + function Kernel() { + _classCallCheck(this, Kernel); + + _initializerDefineProperty(this, "engine", _descriptor$a, this); + + _initializerDefineProperty(this, "configService", _descriptor2$7, this); + + this.entity = createEntity(); + this.model = void 0; + this.dirty = true; + this.compiledBundle = void 0; + this.initPromise = void 0; + } + + _createClass(Kernel, [{ + key: "init", + value: function init() { + var _this$configService$g = this.configService.get(), + canvas = _this$configService$g.canvas, + engineOptions = _this$configService$g.engineOptions; + + this.initPromise = this.engine.init(_objectSpread$6({ + canvas: canvas || createCanvas(), + swapChainFormat: constants.TextureFormat.BGRA8Unorm, + antialiasing: false + }, engineOptions)); + } + }, { + key: "setBundle", + value: function setBundle(bundle) { + // deep clone + this.compiledBundle = JSON.parse(JSON.stringify(bundle)); + } + }, { + key: "setDispatch", + value: function setDispatch(dispatch) { + if (this.compiledBundle.context) { + this.compiledBundle.context.dispatch = dispatch; + } + + return this; + } + }, { + key: "setMaxIteration", + value: function setMaxIteration(maxIteration) { + if (this.compiledBundle.context) { + this.compiledBundle.context.maxIteration = maxIteration; + } + + return this; + } + }, { + key: "setBinding", + value: function setBinding(name, data) { + var _this = this; + + if (typeof name === 'string') { + var isNumberLikeData = isNumber$1(data) || isTypedArray$1(data) || isArray(data); + + if (this.compiledBundle && this.compiledBundle.context) { + // set define, eg. setBinding('MAX_LENGTH', 10) + var existedDefine = this.compiledBundle.context.defines.find(function (b) { + return b.name === name; + }); + + if (existedDefine) { + existedDefine.value = data; + return this; + } // set uniform + + + var existedBinding = this.compiledBundle.context.uniforms.find(function (b) { + return b.name === name; + }); + + if (existedBinding) { + // update uniform or buffer + if (isNumberLikeData) { + // @ts-ignore + existedBinding.data = data; + existedBinding.isReferer = false; + + if (existedBinding.storageClass === STORAGE_CLASS.Uniform) { + if (this.model) { + // @ts-ignore + this.model.updateUniform(name, data); + } + } else { + if (this.model) { + // @ts-ignore + this.model.updateBuffer(name, data); + } + } + } else { + // update with another kernel + existedBinding.isReferer = true; // @ts-ignore + + existedBinding.data = data; + } + } + } + } else { + Object.keys(name).forEach(function (key) { + _this.setBinding(key, name[key]); + }); + } + + return this; + } + }, { + key: "execute", + value: function () { + var _execute = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee() { + var _this2 = this; + + var iteration, + i, + _args = arguments; + return regenerator.wrap(function _callee$(_context) { + while (1) { + switch (_context.prev = _context.next) { + case 0: + iteration = _args.length > 0 && _args[0] !== undefined ? _args[0] : 1; + + if (!this.dirty) { + _context.next = 6; + break; + } + + if (this.compiledBundle.context) { + if (iteration > 1) { + this.compiledBundle.context.maxIteration = iteration; + } else { + this.compiledBundle.context.maxIteration++; + } + } + + _context.next = 5; + return this.compile(); + + case 5: + this.dirty = false; + + case 6: + this.engine.beginFrame(); // 首先开启当前 frame 的 compute pass + + this.engine.clear({}); + + if (this.compiledBundle.context) { + this.compiledBundle.context.uniforms.filter(function (_ref) { + var isReferer = _ref.isReferer; + return isReferer; + }).forEach(function (_ref2) { + var data = _ref2.data, + name = _ref2.name; + + // @ts-ignore + _this2.model.confirmInput(data.model, name); + }); + } + + for (i = 0; i < iteration; i++) { + this.model.run(); + } + + this.engine.endFrame(); + return _context.abrupt("return", this); + + case 12: + case "end": + return _context.stop(); + } + } + }, _callee, this); + })); + + function execute() { + return _execute.apply(this, arguments); + } + + return execute; + }() + /** + * read output from GPUBuffer + */ + + }, { + key: "getOutput", + value: function () { + var _getOutput = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee2() { + return regenerator.wrap(function _callee2$(_context2) { + while (1) { + switch (_context2.prev = _context2.next) { + case 0: + return _context2.abrupt("return", this.model.readData()); + + case 1: + case "end": + return _context2.stop(); + } + } + }, _callee2, this); + })); + + function getOutput() { + return _getOutput.apply(this, arguments); + } + + return getOutput; + }() + }, { + key: "compile", + value: function () { + var _compile = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee3() { + var context, target, shader; + return regenerator.wrap(function _callee3$(_context3) { + while (1) { + switch (_context3.prev = _context3.next) { + case 0: + _context3.next = 2; + return this.initPromise; + + case 2: + context = _objectSpread$6({}, this.compiledBundle.context); + target = this.engine.supportWebGPU ? this.engine.useWGSL ? Target.WGSL : Target.GLSL450 : Target.GLSL100; + shader = this.compiledBundle.shaders[target]; // this.bindings?.forEach(({ name, data }) => { + // if (name === name.toUpperCase()) { + // const define = context.defines.find((d) => d.name === name); + // if (define) { + // // @ts-ignore + // define.value = data; + // } + // } + // }); + // 生成运行时 define + + context.defines.filter(function (define) { + return define.runtime; + }).forEach(function (define) { + var valuePlaceHolder = "".concat(DefineValuePlaceholder).concat(define.name); + shader = shader.replace(valuePlaceHolder, "".concat(define.value)); + }); + context.shader = shader; // 添加 uniform 绑定的数据 + + context.uniforms.forEach(function (uniform) { + // const binding = this.bindings.find((b) => b.name === uniform.name); + // if (binding) { + // // @ts-ignore + // uniform.data = binding.referer || binding.data; + // // @ts-ignore + // uniform.isReferer = !!binding.referer; + // } + // 未指定数据，尝试根据 uniform 类型初始化 + if (!uniform.data) { + if (uniform.storageClass === STORAGE_CLASS.StorageBuffer) { + var sizePerElement = 1; + + if (uniform.type === AST_TOKEN_TYPES.FloatArray) { + sizePerElement = 1; + } else if (uniform.type === AST_TOKEN_TYPES.Vector4FloatArray) { + sizePerElement = 4; + } + + uniform.data = new Float32Array(context.output.length * sizePerElement).fill(0); + } + } + }); // } else if (uniform.type === 'image2D') { + // // @ts-ignore + // buffer.data = new Uint8ClampedArray(context.output.length!).fill(0); + // } + + this.compiledBundle.context = context; + _context3.next = 11; + return this.engine.createComputeModel(this.compiledBundle.context); + + case 11: + this.model = _context3.sent; + + case 12: + case "end": + return _context3.stop(); + } + } + }, _callee3, this); + })); + + function compile() { + return _compile.apply(this, arguments); + } + + return compile; + }() + }]); + + return Kernel; +}(), _temp$e), (_descriptor$a = _applyDecoratedDescriptor(_class2$a.prototype, "engine", [_dec2$a], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor2$7 = _applyDecoratedDescriptor(_class2$a.prototype, "configService", [_dec3$8], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +})), _class2$a)) || _class$i); + +var _dec$h, _dec2$9, _class$h, _class2$9, _descriptor$9, _class3$1, _temp$d; +var Material = (_dec$h = inversify.injectable(), _dec2$9 = inversify.inject(IDENTIFIER.MaterialComponentManager), _dec$h(_class$h = (_class2$9 = (_temp$d = _class3$1 = /*#__PURE__*/function () { + function Material() { + _classCallCheck(this, Material); + + this.config = void 0; + + _initializerDefineProperty(this, "material", _descriptor$9, this); + + this.entity = void 0; + this.component = void 0; + } + + _createClass(Material, [{ + key: "getEntity", + value: function getEntity() { + return this.entity; + } + }, { + key: "getComponent", + value: function getComponent() { + return this.component; + } + }, { + key: "setConfig", + value: function setConfig(config) { + this.config = config; + } + }, { + key: "setEntity", + value: function setEntity(entity, type) { + this.entity = entity; + this.component = this.material.create(entity); + this.component.entity = entity; + this.component.type = type; + this.onEntityCreated(); + } + }, { + key: "onEntityCreated", + value: function onEntityCreated() {// + } + }]); + + return Material; +}(), _class3$1.BASIC = 'basic', _temp$d), (_descriptor$9 = _applyDecoratedDescriptor(_class2$9.prototype, "material", [_dec2$9], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +})), _class2$9)) || _class$h); + +var _dec$g, _dec2$8, _dec3$7, _dec4$4, _dec5$3, _dec6$3, _class$g, _class2$8, _descriptor$8, _descriptor2$6, _descriptor3$4, _descriptor4, _class3, _temp$c; +var Renderable = (_dec$g = inversify.injectable(), _dec2$8 = inversify.inject(IDENTIFIER.MeshComponentManager), _dec3$7 = inversify.inject(IDENTIFIER.CullableComponentManager), _dec4$4 = inversify.inject(IDENTIFIER.TransformComponentManager), _dec5$3 = inversify.inject(IDENTIFIER.Systems), _dec6$3 = inversify.named(IDENTIFIER.SceneGraphSystem), _dec$g(_class$g = (_class2$8 = (_temp$c = _class3 = /*#__PURE__*/function () { + function Renderable() { + _classCallCheck(this, Renderable); + + this.attributes = {}; + this.config = void 0; + + _initializerDefineProperty(this, "mesh", _descriptor$8, this); + + _initializerDefineProperty(this, "cullable", _descriptor2$6, this); + + _initializerDefineProperty(this, "transform", _descriptor3$4, this); + + _initializerDefineProperty(this, "sceneGraphSystem", _descriptor4, this); + + this.meshComponent = void 0; + this.transformComponent = void 0; + this.entity = void 0; + } + + _createClass(Renderable, [{ + key: "getEntity", + value: function getEntity() { + return this.entity; + } + }, { + key: "getTransformComponent", + value: function getTransformComponent() { + return this.transformComponent; + } + }, { + key: "getMeshComponent", + value: function getMeshComponent() { + return this.meshComponent; + } + }, { + key: "setConfig", + value: function setConfig(config) { + this.config = config; + } + }, { + key: "setEntity", + value: function setEntity(entity) { + this.entity = entity; + this.cullable.create(entity); + this.meshComponent = this.mesh.create(entity); + this.transformComponent = this.transform.create(entity); + this.onEntityCreated(); + } + }, { + key: "setMaterial", + value: function setMaterial(material) { + this.meshComponent.material = material; + return this; + } + }, { + key: "setGeometry", + value: function setGeometry(geometry) { + this.meshComponent.geometry = geometry; + return this; + } + }, { + key: "setAttributes", + value: function setAttributes(attributes) { + var _this = this; + + Object.keys(attributes).forEach(function (name) { + if (attributes[name] !== undefined && attributes[name] !== _this.attributes[name]) { + _this.onAttributeChanged({ + name: name, + data: attributes[name] + }); + + _this.attributes[name] = attributes[name]; + } + }); + } + }, { + key: "setVisible", + value: function setVisible(visible) { + var _this2 = this; + + this.meshComponent.visible = visible; + this.meshComponent.children.forEach(function (childEntity) { + var child = _this2.mesh.getComponentByEntity(childEntity); + + if (child) { + child.visible = visible; + } + }); + return this; + } + }, { + key: "isVisible", + value: function isVisible() { + return this.meshComponent.visible; + } + }, { + key: "attach", + value: function attach(parentRenderable) { + this.sceneGraphSystem.attach(this.entity, parentRenderable.entity); + return this; + } + }, { + key: "detach", + value: function detach() { + this.sceneGraphSystem.detach(this.entity); + return this; + } + }, { + key: "detachChildren", + value: function detachChildren() { + this.sceneGraphSystem.detachChildren(this.entity); + return this; + } + }, { + key: "onEntityCreated", + value: function onEntityCreated() {// + } + }, { + key: "onAttributeChanged", + value: function onAttributeChanged(_ref) { + var name = _ref.name, + data = _ref.data; + + if (this.meshComponent && this.meshComponent.material) { + this.meshComponent.material.setUniform(this.convertAttributeName2UniformName(name), data); + } + } + }, { + key: "convertAttributeName2UniformName", + value: function convertAttributeName2UniformName(attributeName) { + return attributeName; + } + }]); + + return Renderable; +}(), _class3.POINT = 'point', _class3.LINE = 'line', _class3.GRID = 'grid', _temp$c), (_descriptor$8 = _applyDecoratedDescriptor(_class2$8.prototype, "mesh", [_dec2$8], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor2$6 = _applyDecoratedDescriptor(_class2$8.prototype, "cullable", [_dec3$7], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor3$4 = _applyDecoratedDescriptor(_class2$8.prototype, "transform", [_dec4$4], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor4 = _applyDecoratedDescriptor(_class2$8.prototype, "sceneGraphSystem", [_dec5$3, _dec6$3], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +})), _class2$8)) || _class$g); + +var regl$1 = {exports: {}}; + +(function (module, exports) { +(function (global, factory) { + module.exports = factory() ; +}(commonjsGlobal, (function () { +var isTypedArray = function (x) { + return ( + x instanceof Uint8Array || + x instanceof Uint16Array || + x instanceof Uint32Array || + x instanceof Int8Array || + x instanceof Int16Array || + x instanceof Int32Array || + x instanceof Float32Array || + x instanceof Float64Array || + x instanceof Uint8ClampedArray + ) +}; + +var extend = function (base, opts) { + var keys = Object.keys(opts); + for (var i = 0; i < keys.length; ++i) { + base[keys[i]] = opts[keys[i]]; + } + return base +}; + +// Error checking and parameter validation. +// +// Statements for the form `check.someProcedure(...)` get removed by +// a browserify transform for optimized/minified bundles. +// +/* globals atob */ +var endl = '\n'; + +// only used for extracting shader names. if atob not present, then errors +// will be slightly crappier +function decodeB64 (str) { + if (typeof atob !== 'undefined') { + return atob(str) + } + return 'base64:' + str +} + +function raise (message) { + var error = new Error('(regl) ' + message); + console.error(error); + throw error +} + +function check (pred, message) { + if (!pred) { + raise(message); + } +} + +function encolon (message) { + if (message) { + return ': ' + message + } + return '' +} + +function checkParameter (param, possibilities, message) { + if (!(param in possibilities)) { + raise('unknown parameter (' + param + ')' + encolon(message) + + '. possible values: ' + Object.keys(possibilities).join()); + } +} + +function checkIsTypedArray (data, message) { + if (!isTypedArray(data)) { + raise( + 'invalid parameter type' + encolon(message) + + '. must be a typed array'); + } +} + +function standardTypeEh (value, type) { + switch (type) { + case 'number': return typeof value === 'number' + case 'object': return typeof value === 'object' + case 'string': return typeof value === 'string' + case 'boolean': return typeof value === 'boolean' + case 'function': return typeof value === 'function' + case 'undefined': return typeof value === 'undefined' + case 'symbol': return typeof value === 'symbol' + } +} + +function checkTypeOf (value, type, message) { + if (!standardTypeEh(value, type)) { + raise( + 'invalid parameter type' + encolon(message) + + '. expected ' + type + ', got ' + (typeof value)); + } +} + +function checkNonNegativeInt (value, message) { + if (!((value >= 0) && + ((value | 0) === value))) { + raise('invalid parameter type, (' + value + ')' + encolon(message) + + '. must be a nonnegative integer'); + } +} + +function checkOneOf (value, list, message) { + if (list.indexOf(value) < 0) { + raise('invalid value' + encolon(message) + '. must be one of: ' + list); + } +} + +var constructorKeys = [ + 'gl', + 'canvas', + 'container', + 'attributes', + 'pixelRatio', + 'extensions', + 'optionalExtensions', + 'profile', + 'onDone' +]; + +function checkConstructor (obj) { + Object.keys(obj).forEach(function (key) { + if (constructorKeys.indexOf(key) < 0) { + raise('invalid regl constructor argument "' + key + '". must be one of ' + constructorKeys); + } + }); +} + +function leftPad (str, n) { + str = str + ''; + while (str.length < n) { + str = ' ' + str; + } + return str +} + +function ShaderFile () { + this.name = 'unknown'; + this.lines = []; + this.index = {}; + this.hasErrors = false; +} + +function ShaderLine (number, line) { + this.number = number; + this.line = line; + this.errors = []; +} + +function ShaderError (fileNumber, lineNumber, message) { + this.file = fileNumber; + this.line = lineNumber; + this.message = message; +} + +function guessCommand () { + var error = new Error(); + var stack = (error.stack || error).toString(); + var pat = /compileProcedure.*\n\s*at.*\((.*)\)/.exec(stack); + if (pat) { + return pat[1] + } + var pat2 = /compileProcedure.*\n\s*at\s+(.*)(\n|$)/.exec(stack); + if (pat2) { + return pat2[1] + } + return 'unknown' +} + +function guessCallSite () { + var error = new Error(); + var stack = (error.stack || error).toString(); + var pat = /at REGLCommand.*\n\s+at.*\((.*)\)/.exec(stack); + if (pat) { + return pat[1] + } + var pat2 = /at REGLCommand.*\n\s+at\s+(.*)\n/.exec(stack); + if (pat2) { + return pat2[1] + } + return 'unknown' +} + +function parseSource (source, command) { + var lines = source.split('\n'); + var lineNumber = 1; + var fileNumber = 0; + var files = { + unknown: new ShaderFile(), + 0: new ShaderFile() + }; + files.unknown.name = files[0].name = command || guessCommand(); + files.unknown.lines.push(new ShaderLine(0, '')); + for (var i = 0; i < lines.length; ++i) { + var line = lines[i]; + var parts = /^\s*#\s*(\w+)\s+(.+)\s*$/.exec(line); + if (parts) { + switch (parts[1]) { + case 'line': + var lineNumberInfo = /(\d+)(\s+\d+)?/.exec(parts[2]); + if (lineNumberInfo) { + lineNumber = lineNumberInfo[1] | 0; + if (lineNumberInfo[2]) { + fileNumber = lineNumberInfo[2] | 0; + if (!(fileNumber in files)) { + files[fileNumber] = new ShaderFile(); + } + } + } + break + case 'define': + var nameInfo = /SHADER_NAME(_B64)?\s+(.*)$/.exec(parts[2]); + if (nameInfo) { + files[fileNumber].name = (nameInfo[1] + ? decodeB64(nameInfo[2]) + : nameInfo[2]); + } + break + } + } + files[fileNumber].lines.push(new ShaderLine(lineNumber++, line)); + } + Object.keys(files).forEach(function (fileNumber) { + var file = files[fileNumber]; + file.lines.forEach(function (line) { + file.index[line.number] = line; + }); + }); + return files +} + +function parseErrorLog (errLog) { + var result = []; + errLog.split('\n').forEach(function (errMsg) { + if (errMsg.length < 5) { + return + } + var parts = /^ERROR:\s+(\d+):(\d+):\s*(.*)$/.exec(errMsg); + if (parts) { + result.push(new ShaderError( + parts[1] | 0, + parts[2] | 0, + parts[3].trim())); + } else if (errMsg.length > 0) { + result.push(new ShaderError('unknown', 0, errMsg)); + } + }); + return result +} + +function annotateFiles (files, errors) { + errors.forEach(function (error) { + var file = files[error.file]; + if (file) { + var line = file.index[error.line]; + if (line) { + line.errors.push(error); + file.hasErrors = true; + return + } + } + files.unknown.hasErrors = true; + files.unknown.lines[0].errors.push(error); + }); +} + +function checkShaderError (gl, shader, source, type, command) { + if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) { + var errLog = gl.getShaderInfoLog(shader); + var typeName = type === gl.FRAGMENT_SHADER ? 'fragment' : 'vertex'; + checkCommandType(source, 'string', typeName + ' shader source must be a string', command); + var files = parseSource(source, command); + var errors = parseErrorLog(errLog); + annotateFiles(files, errors); + + Object.keys(files).forEach(function (fileNumber) { + var file = files[fileNumber]; + if (!file.hasErrors) { + return + } + + var strings = ['']; + var styles = ['']; + + function push (str, style) { + strings.push(str); + styles.push(style || ''); + } + + push('file number ' + fileNumber + ': ' + file.name + '\n', 'color:red;text-decoration:underline;font-weight:bold'); + + file.lines.forEach(function (line) { + if (line.errors.length > 0) { + push(leftPad(line.number, 4) + '| ', 'background-color:yellow; font-weight:bold'); + push(line.line + endl, 'color:red; background-color:yellow; font-weight:bold'); + + // try to guess token + var offset = 0; + line.errors.forEach(function (error) { + var message = error.message; + var token = /^\s*'(.*)'\s*:\s*(.*)$/.exec(message); + if (token) { + var tokenPat = token[1]; + message = token[2]; + switch (tokenPat) { + case 'assign': + tokenPat = '='; + break + } + offset = Math.max(line.line.indexOf(tokenPat, offset), 0); + } else { + offset = 0; + } + + push(leftPad('| ', 6)); + push(leftPad('^^^', offset + 3) + endl, 'font-weight:bold'); + push(leftPad('| ', 6)); + push(message + endl, 'font-weight:bold'); + }); + push(leftPad('| ', 6) + endl); + } else { + push(leftPad(line.number, 4) + '| '); + push(line.line + endl, 'color:red'); + } + }); + if (typeof document !== 'undefined' && !window.chrome) { + styles[0] = strings.join('%c'); + console.log.apply(console, styles); + } else { + console.log(strings.join('')); + } + }); + + check.raise('Error compiling ' + typeName + ' shader, ' + files[0].name); + } +} + +function checkLinkError (gl, program, fragShader, vertShader, command) { + if (!gl.getProgramParameter(program, gl.LINK_STATUS)) { + var errLog = gl.getProgramInfoLog(program); + var fragParse = parseSource(fragShader, command); + var vertParse = parseSource(vertShader, command); + + var header = 'Error linking program with vertex shader, "' + + vertParse[0].name + '", and fragment shader "' + fragParse[0].name + '"'; + + if (typeof document !== 'undefined') { + console.log('%c' + header + endl + '%c' + errLog, + 'color:red;text-decoration:underline;font-weight:bold', + 'color:red'); + } else { + console.log(header + endl + errLog); + } + check.raise(header); + } +} + +function saveCommandRef (object) { + object._commandRef = guessCommand(); +} + +function saveDrawCommandInfo (opts, uniforms, attributes, stringStore) { + saveCommandRef(opts); + + function id (str) { + if (str) { + return stringStore.id(str) + } + return 0 + } + opts._fragId = id(opts.static.frag); + opts._vertId = id(opts.static.vert); + + function addProps (dict, set) { + Object.keys(set).forEach(function (u) { + dict[stringStore.id(u)] = true; + }); + } + + var uniformSet = opts._uniformSet = {}; + addProps(uniformSet, uniforms.static); + addProps(uniformSet, uniforms.dynamic); + + var attributeSet = opts._attributeSet = {}; + addProps(attributeSet, attributes.static); + addProps(attributeSet, attributes.dynamic); + + opts._hasCount = ( + 'count' in opts.static || + 'count' in opts.dynamic || + 'elements' in opts.static || + 'elements' in opts.dynamic); +} + +function commandRaise (message, command) { + var callSite = guessCallSite(); + raise(message + + ' in command ' + (command || guessCommand()) + + (callSite === 'unknown' ? '' : ' called from ' + callSite)); +} + +function checkCommand (pred, message, command) { + if (!pred) { + commandRaise(message, command || guessCommand()); + } +} + +function checkParameterCommand (param, possibilities, message, command) { + if (!(param in possibilities)) { + commandRaise( + 'unknown parameter (' + param + ')' + encolon(message) + + '. possible values: ' + Object.keys(possibilities).join(), + command || guessCommand()); + } +} + +function checkCommandType (value, type, message, command) { + if (!standardTypeEh(value, type)) { + commandRaise( + 'invalid parameter type' + encolon(message) + + '. expected ' + type + ', got ' + (typeof value), + command || guessCommand()); + } +} + +function checkOptional (block) { + block(); +} + +function checkFramebufferFormat (attachment, texFormats, rbFormats) { + if (attachment.texture) { + checkOneOf( + attachment.texture._texture.internalformat, + texFormats, + 'unsupported texture format for attachment'); + } else { + checkOneOf( + attachment.renderbuffer._renderbuffer.format, + rbFormats, + 'unsupported renderbuffer format for attachment'); + } +} + +var GL_CLAMP_TO_EDGE = 0x812F; + +var GL_NEAREST = 0x2600; +var GL_NEAREST_MIPMAP_NEAREST = 0x2700; +var GL_LINEAR_MIPMAP_NEAREST = 0x2701; +var GL_NEAREST_MIPMAP_LINEAR = 0x2702; +var GL_LINEAR_MIPMAP_LINEAR = 0x2703; + +var GL_BYTE = 5120; +var GL_UNSIGNED_BYTE = 5121; +var GL_SHORT = 5122; +var GL_UNSIGNED_SHORT = 5123; +var GL_INT = 5124; +var GL_UNSIGNED_INT = 5125; +var GL_FLOAT = 5126; + +var GL_UNSIGNED_SHORT_4_4_4_4 = 0x8033; +var GL_UNSIGNED_SHORT_5_5_5_1 = 0x8034; +var GL_UNSIGNED_SHORT_5_6_5 = 0x8363; +var GL_UNSIGNED_INT_24_8_WEBGL = 0x84FA; + +var GL_HALF_FLOAT_OES = 0x8D61; + +var TYPE_SIZE = {}; + +TYPE_SIZE[GL_BYTE] = +TYPE_SIZE[GL_UNSIGNED_BYTE] = 1; + +TYPE_SIZE[GL_SHORT] = +TYPE_SIZE[GL_UNSIGNED_SHORT] = +TYPE_SIZE[GL_HALF_FLOAT_OES] = +TYPE_SIZE[GL_UNSIGNED_SHORT_5_6_5] = +TYPE_SIZE[GL_UNSIGNED_SHORT_4_4_4_4] = +TYPE_SIZE[GL_UNSIGNED_SHORT_5_5_5_1] = 2; + +TYPE_SIZE[GL_INT] = +TYPE_SIZE[GL_UNSIGNED_INT] = +TYPE_SIZE[GL_FLOAT] = +TYPE_SIZE[GL_UNSIGNED_INT_24_8_WEBGL] = 4; + +function pixelSize (type, channels) { + if (type === GL_UNSIGNED_SHORT_5_5_5_1 || + type === GL_UNSIGNED_SHORT_4_4_4_4 || + type === GL_UNSIGNED_SHORT_5_6_5) { + return 2 + } else if (type === GL_UNSIGNED_INT_24_8_WEBGL) { + return 4 + } else { + return TYPE_SIZE[type] * channels + } +} + +function isPow2 (v) { + return !(v & (v - 1)) && (!!v) +} + +function checkTexture2D (info, mipData, limits) { + var i; + var w = mipData.width; + var h = mipData.height; + var c = mipData.channels; + + // Check texture shape + check(w > 0 && w <= limits.maxTextureSize && + h > 0 && h <= limits.maxTextureSize, + 'invalid texture shape'); + + // check wrap mode + if (info.wrapS !== GL_CLAMP_TO_EDGE || info.wrapT !== GL_CLAMP_TO_EDGE) { + check(isPow2(w) && isPow2(h), + 'incompatible wrap mode for texture, both width and height must be power of 2'); + } + + if (mipData.mipmask === 1) { + if (w !== 1 && h !== 1) { + check( + info.minFilter !== GL_NEAREST_MIPMAP_NEAREST && + info.minFilter !== GL_NEAREST_MIPMAP_LINEAR && + info.minFilter !== GL_LINEAR_MIPMAP_NEAREST && + info.minFilter !== GL_LINEAR_MIPMAP_LINEAR, + 'min filter requires mipmap'); + } + } else { + // texture must be power of 2 + check(isPow2(w) && isPow2(h), + 'texture must be a square power of 2 to support mipmapping'); + check(mipData.mipmask === (w << 1) - 1, + 'missing or incomplete mipmap data'); + } + + if (mipData.type === GL_FLOAT) { + if (limits.extensions.indexOf('oes_texture_float_linear') < 0) { + check(info.minFilter === GL_NEAREST && info.magFilter === GL_NEAREST, + 'filter not supported, must enable oes_texture_float_linear'); + } + check(!info.genMipmaps, + 'mipmap generation not supported with float textures'); + } + + // check image complete + var mipimages = mipData.images; + for (i = 0; i < 16; ++i) { + if (mipimages[i]) { + var mw = w >> i; + var mh = h >> i; + check(mipData.mipmask & (1 << i), 'missing mipmap data'); + + var img = mipimages[i]; + + check( + img.width === mw && + img.height === mh, + 'invalid shape for mip images'); + + check( + img.format === mipData.format && + img.internalformat === mipData.internalformat && + img.type === mipData.type, + 'incompatible type for mip image'); + + if (img.compressed) ; else if (img.data) { + // check(img.data.byteLength === mw * mh * + // Math.max(pixelSize(img.type, c), img.unpackAlignment), + var rowSize = Math.ceil(pixelSize(img.type, c) * mw / img.unpackAlignment) * img.unpackAlignment; + check(img.data.byteLength === rowSize * mh, + 'invalid data for image, buffer size is inconsistent with image format'); + } else if (img.element) ; else if (img.copy) ; + } else if (!info.genMipmaps) { + check((mipData.mipmask & (1 << i)) === 0, 'extra mipmap data'); + } + } + + if (mipData.compressed) { + check(!info.genMipmaps, + 'mipmap generation for compressed images not supported'); + } +} + +function checkTextureCube (texture, info, faces, limits) { + var w = texture.width; + var h = texture.height; + var c = texture.channels; + + // Check texture shape + check( + w > 0 && w <= limits.maxTextureSize && h > 0 && h <= limits.maxTextureSize, + 'invalid texture shape'); + check( + w === h, + 'cube map must be square'); + check( + info.wrapS === GL_CLAMP_TO_EDGE && info.wrapT === GL_CLAMP_TO_EDGE, + 'wrap mode not supported by cube map'); + + for (var i = 0; i < faces.length; ++i) { + var face = faces[i]; + check( + face.width === w && face.height === h, + 'inconsistent cube map face shape'); + + if (info.genMipmaps) { + check(!face.compressed, + 'can not generate mipmap for compressed textures'); + check(face.mipmask === 1, + 'can not specify mipmaps and generate mipmaps'); + } + + var mipmaps = face.images; + for (var j = 0; j < 16; ++j) { + var img = mipmaps[j]; + if (img) { + var mw = w >> j; + var mh = h >> j; + check(face.mipmask & (1 << j), 'missing mipmap data'); + check( + img.width === mw && + img.height === mh, + 'invalid shape for mip images'); + check( + img.format === texture.format && + img.internalformat === texture.internalformat && + img.type === texture.type, + 'incompatible type for mip image'); + + if (img.compressed) ; else if (img.data) { + check(img.data.byteLength === mw * mh * + Math.max(pixelSize(img.type, c), img.unpackAlignment), + 'invalid data for image, buffer size is inconsistent with image format'); + } else if (img.element) ; else if (img.copy) ; + } + } + } +} + +var check$1 = extend(check, { + optional: checkOptional, + raise: raise, + commandRaise: commandRaise, + command: checkCommand, + parameter: checkParameter, + commandParameter: checkParameterCommand, + constructor: checkConstructor, + type: checkTypeOf, + commandType: checkCommandType, + isTypedArray: checkIsTypedArray, + nni: checkNonNegativeInt, + oneOf: checkOneOf, + shaderError: checkShaderError, + linkError: checkLinkError, + callSite: guessCallSite, + saveCommandRef: saveCommandRef, + saveDrawInfo: saveDrawCommandInfo, + framebufferFormat: checkFramebufferFormat, + guessCommand: guessCommand, + texture2D: checkTexture2D, + textureCube: checkTextureCube +}); + +var VARIABLE_COUNTER = 0; + +var DYN_FUNC = 0; +var DYN_CONSTANT = 5; +var DYN_ARRAY = 6; + +function DynamicVariable (type, data) { + this.id = (VARIABLE_COUNTER++); + this.type = type; + this.data = data; +} + +function escapeStr (str) { + return str.replace(/\\/g, '\\\\').replace(/"/g, '\\"') +} + +function splitParts (str) { + if (str.length === 0) { + return [] + } + + var firstChar = str.charAt(0); + var lastChar = str.charAt(str.length - 1); + + if (str.length > 1 && + firstChar === lastChar && + (firstChar === '"' || firstChar === "'")) { + return ['"' + escapeStr(str.substr(1, str.length - 2)) + '"'] + } + + var parts = /\[(false|true|null|\d+|'[^']*'|"[^"]*")\]/.exec(str); + if (parts) { + return ( + splitParts(str.substr(0, parts.index)) + .concat(splitParts(parts[1])) + .concat(splitParts(str.substr(parts.index + parts[0].length))) + ) + } + + var subparts = str.split('.'); + if (subparts.length === 1) { + return ['"' + escapeStr(str) + '"'] + } + + var result = []; + for (var i = 0; i < subparts.length; ++i) { + result = result.concat(splitParts(subparts[i])); + } + return result +} + +function toAccessorString (str) { + return '[' + splitParts(str).join('][') + ']' +} + +function defineDynamic (type, data) { + return new DynamicVariable(type, toAccessorString(data + '')) +} + +function isDynamic (x) { + return (typeof x === 'function' && !x._reglType) || (x instanceof DynamicVariable) +} + +function unbox (x, path) { + if (typeof x === 'function') { + return new DynamicVariable(DYN_FUNC, x) + } else if (typeof x === 'number' || typeof x === 'boolean') { + return new DynamicVariable(DYN_CONSTANT, x) + } else if (Array.isArray(x)) { + return new DynamicVariable(DYN_ARRAY, x.map((y, i) => unbox(y, path + '[' + i + ']'))) + } else if (x instanceof DynamicVariable) { + return x + } + check$1(false, 'invalid option type in uniform ' + path); +} + +var dynamic = { + DynamicVariable: DynamicVariable, + define: defineDynamic, + isDynamic: isDynamic, + unbox: unbox, + accessor: toAccessorString +}; + +/* globals requestAnimationFrame, cancelAnimationFrame */ +var raf = { + next: typeof requestAnimationFrame === 'function' + ? function (cb) { return requestAnimationFrame(cb) } + : function (cb) { return setTimeout(cb, 16) }, + cancel: typeof cancelAnimationFrame === 'function' + ? function (raf) { return cancelAnimationFrame(raf) } + : clearTimeout +}; + +/* globals performance */ +var clock = (typeof performance !== 'undefined' && performance.now) + ? function () { return performance.now() } + : function () { return +(new Date()) }; + +function createStringStore () { + var stringIds = { '': 0 }; + var stringValues = ['']; + return { + id: function (str) { + var result = stringIds[str]; + if (result) { + return result + } + result = stringIds[str] = stringValues.length; + stringValues.push(str); + return result + }, + + str: function (id) { + return stringValues[id] + } + } +} + +// Context and canvas creation helper functions +function createCanvas (element, onDone, pixelRatio) { + var canvas = document.createElement('canvas'); + extend(canvas.style, { + border: 0, + margin: 0, + padding: 0, + top: 0, + left: 0 + }); + element.appendChild(canvas); + + if (element === document.body) { + canvas.style.position = 'absolute'; + extend(element.style, { + margin: 0, + padding: 0 + }); + } + + function resize () { + var w = window.innerWidth; + var h = window.innerHeight; + if (element !== document.body) { + var bounds = element.getBoundingClientRect(); + w = bounds.right - bounds.left; + h = bounds.bottom - bounds.top; + } + canvas.width = pixelRatio * w; + canvas.height = pixelRatio * h; + extend(canvas.style, { + width: w + 'px', + height: h + 'px' + }); + } + + var resizeObserver; + if (element !== document.body && typeof ResizeObserver === 'function') { + // ignore 'ResizeObserver' is not defined + // eslint-disable-next-line + resizeObserver = new ResizeObserver(function () { + // setTimeout to avoid flicker + setTimeout(resize); + }); + resizeObserver.observe(element); + } else { + window.addEventListener('resize', resize, false); + } + + function onDestroy () { + if (resizeObserver) { + resizeObserver.disconnect(); + } else { + window.removeEventListener('resize', resize); + } + element.removeChild(canvas); + } + + resize(); + + return { + canvas: canvas, + onDestroy: onDestroy + } +} + +function createContext (canvas, contextAttributes) { + function get (name) { + try { + return canvas.getContext(name, contextAttributes) + } catch (e) { + return null + } + } + return ( + get('webgl') || + get('experimental-webgl') || + get('webgl-experimental') + ) +} + +function isHTMLElement (obj) { + return ( + typeof obj.nodeName === 'string' && + typeof obj.appendChild === 'function' && + typeof obj.getBoundingClientRect === 'function' + ) +} + +function isWebGLContext (obj) { + return ( + typeof obj.drawArrays === 'function' || + typeof obj.drawElements === 'function' + ) +} + +function parseExtensions (input) { + if (typeof input === 'string') { + return input.split() + } + check$1(Array.isArray(input), 'invalid extension array'); + return input +} + +function getElement (desc) { + if (typeof desc === 'string') { + check$1(typeof document !== 'undefined', 'not supported outside of DOM'); + return document.querySelector(desc) + } + return desc +} + +function parseArgs (args_) { + var args = args_ || {}; + var element, container, canvas, gl; + var contextAttributes = {}; + var extensions = []; + var optionalExtensions = []; + var pixelRatio = (typeof window === 'undefined' ? 1 : window.devicePixelRatio); + var profile = false; + var onDone = function (err) { + if (err) { + check$1.raise(err); + } + }; + var onDestroy = function () {}; + if (typeof args === 'string') { + check$1( + typeof document !== 'undefined', + 'selector queries only supported in DOM enviroments'); + element = document.querySelector(args); + check$1(element, 'invalid query string for element'); + } else if (typeof args === 'object') { + if (isHTMLElement(args)) { + element = args; + } else if (isWebGLContext(args)) { + gl = args; + canvas = gl.canvas; + } else { + check$1.constructor(args); + if ('gl' in args) { + gl = args.gl; + } else if ('canvas' in args) { + canvas = getElement(args.canvas); + } else if ('container' in args) { + container = getElement(args.container); + } + if ('attributes' in args) { + contextAttributes = args.attributes; + check$1.type(contextAttributes, 'object', 'invalid context attributes'); + } + if ('extensions' in args) { + extensions = parseExtensions(args.extensions); + } + if ('optionalExtensions' in args) { + optionalExtensions = parseExtensions(args.optionalExtensions); + } + if ('onDone' in args) { + check$1.type( + args.onDone, 'function', + 'invalid or missing onDone callback'); + onDone = args.onDone; + } + if ('profile' in args) { + profile = !!args.profile; + } + if ('pixelRatio' in args) { + pixelRatio = +args.pixelRatio; + check$1(pixelRatio > 0, 'invalid pixel ratio'); + } + } + } else { + check$1.raise('invalid arguments to regl'); + } + + if (element) { + if (element.nodeName.toLowerCase() === 'canvas') { + canvas = element; + } else { + container = element; + } + } + + if (!gl) { + if (!canvas) { + check$1( + typeof document !== 'undefined', + 'must manually specify webgl context outside of DOM environments'); + var result = createCanvas(container || document.body, onDone, pixelRatio); + if (!result) { + return null + } + canvas = result.canvas; + onDestroy = result.onDestroy; + } + // workaround for chromium bug, premultiplied alpha value is platform dependent + if (contextAttributes.premultipliedAlpha === undefined) contextAttributes.premultipliedAlpha = true; + gl = createContext(canvas, contextAttributes); + } + + if (!gl) { + onDestroy(); + onDone('webgl not supported, try upgrading your browser or graphics drivers http://get.webgl.org'); + return null + } + + return { + gl: gl, + canvas: canvas, + container: container, + extensions: extensions, + optionalExtensions: optionalExtensions, + pixelRatio: pixelRatio, + profile: profile, + onDone: onDone, + onDestroy: onDestroy + } +} + +function createExtensionCache (gl, config) { + var extensions = {}; + + function tryLoadExtension (name_) { + check$1.type(name_, 'string', 'extension name must be string'); + var name = name_.toLowerCase(); + var ext; + try { + ext = extensions[name] = gl.getExtension(name); + } catch (e) {} + return !!ext + } + + for (var i = 0; i < config.extensions.length; ++i) { + var name = config.extensions[i]; + if (!tryLoadExtension(name)) { + config.onDestroy(); + config.onDone('"' + name + '" extension is not supported by the current WebGL context, try upgrading your system or a different browser'); + return null + } + } + + config.optionalExtensions.forEach(tryLoadExtension); + + return { + extensions: extensions, + restore: function () { + Object.keys(extensions).forEach(function (name) { + if (extensions[name] && !tryLoadExtension(name)) { + throw new Error('(regl): error restoring extension ' + name) + } + }); + } + } +} + +function loop (n, f) { + var result = Array(n); + for (var i = 0; i < n; ++i) { + result[i] = f(i); + } + return result +} + +var GL_BYTE$1 = 5120; +var GL_UNSIGNED_BYTE$2 = 5121; +var GL_SHORT$1 = 5122; +var GL_UNSIGNED_SHORT$1 = 5123; +var GL_INT$1 = 5124; +var GL_UNSIGNED_INT$1 = 5125; +var GL_FLOAT$2 = 5126; + +function nextPow16 (v) { + for (var i = 16; i <= (1 << 28); i *= 16) { + if (v <= i) { + return i + } + } + return 0 +} + +function log2 (v) { + var r, shift; + r = (v > 0xFFFF) << 4; + v >>>= r; + shift = (v > 0xFF) << 3; + v >>>= shift; r |= shift; + shift = (v > 0xF) << 2; + v >>>= shift; r |= shift; + shift = (v > 0x3) << 1; + v >>>= shift; r |= shift; + return r | (v >> 1) +} + +function createPool () { + var bufferPool = loop(8, function () { + return [] + }); + + function alloc (n) { + var sz = nextPow16(n); + var bin = bufferPool[log2(sz) >> 2]; + if (bin.length > 0) { + return bin.pop() + } + return new ArrayBuffer(sz) + } + + function free (buf) { + bufferPool[log2(buf.byteLength) >> 2].push(buf); + } + + function allocType (type, n) { + var result = null; + switch (type) { + case GL_BYTE$1: + result = new Int8Array(alloc(n), 0, n); + break + case GL_UNSIGNED_BYTE$2: + result = new Uint8Array(alloc(n), 0, n); + break + case GL_SHORT$1: + result = new Int16Array(alloc(2 * n), 0, n); + break + case GL_UNSIGNED_SHORT$1: + result = new Uint16Array(alloc(2 * n), 0, n); + break + case GL_INT$1: + result = new Int32Array(alloc(4 * n), 0, n); + break + case GL_UNSIGNED_INT$1: + result = new Uint32Array(alloc(4 * n), 0, n); + break + case GL_FLOAT$2: + result = new Float32Array(alloc(4 * n), 0, n); + break + default: + return null + } + if (result.length !== n) { + return result.subarray(0, n) + } + return result + } + + function freeType (array) { + free(array.buffer); + } + + return { + alloc: alloc, + free: free, + allocType: allocType, + freeType: freeType + } +} + +var pool = createPool(); + +// zero pool for initial zero data +pool.zero = createPool(); + +var GL_SUBPIXEL_BITS = 0x0D50; +var GL_RED_BITS = 0x0D52; +var GL_GREEN_BITS = 0x0D53; +var GL_BLUE_BITS = 0x0D54; +var GL_ALPHA_BITS = 0x0D55; +var GL_DEPTH_BITS = 0x0D56; +var GL_STENCIL_BITS = 0x0D57; + +var GL_ALIASED_POINT_SIZE_RANGE = 0x846D; +var GL_ALIASED_LINE_WIDTH_RANGE = 0x846E; + +var GL_MAX_TEXTURE_SIZE = 0x0D33; +var GL_MAX_VIEWPORT_DIMS = 0x0D3A; +var GL_MAX_VERTEX_ATTRIBS = 0x8869; +var GL_MAX_VERTEX_UNIFORM_VECTORS = 0x8DFB; +var GL_MAX_VARYING_VECTORS = 0x8DFC; +var GL_MAX_COMBINED_TEXTURE_IMAGE_UNITS = 0x8B4D; +var GL_MAX_VERTEX_TEXTURE_IMAGE_UNITS = 0x8B4C; +var GL_MAX_TEXTURE_IMAGE_UNITS = 0x8872; +var GL_MAX_FRAGMENT_UNIFORM_VECTORS = 0x8DFD; +var GL_MAX_CUBE_MAP_TEXTURE_SIZE = 0x851C; +var GL_MAX_RENDERBUFFER_SIZE = 0x84E8; + +var GL_VENDOR = 0x1F00; +var GL_RENDERER = 0x1F01; +var GL_VERSION = 0x1F02; +var GL_SHADING_LANGUAGE_VERSION = 0x8B8C; + +var GL_MAX_TEXTURE_MAX_ANISOTROPY_EXT = 0x84FF; + +var GL_MAX_COLOR_ATTACHMENTS_WEBGL = 0x8CDF; +var GL_MAX_DRAW_BUFFERS_WEBGL = 0x8824; + +var GL_TEXTURE_2D = 0x0DE1; +var GL_TEXTURE_CUBE_MAP = 0x8513; +var GL_TEXTURE_CUBE_MAP_POSITIVE_X = 0x8515; +var GL_TEXTURE0 = 0x84C0; +var GL_RGBA = 0x1908; +var GL_FLOAT$1 = 0x1406; +var GL_UNSIGNED_BYTE$1 = 0x1401; +var GL_FRAMEBUFFER = 0x8D40; +var GL_FRAMEBUFFER_COMPLETE = 0x8CD5; +var GL_COLOR_ATTACHMENT0 = 0x8CE0; +var GL_COLOR_BUFFER_BIT$1 = 0x4000; + +var wrapLimits = function (gl, extensions) { + var maxAnisotropic = 1; + if (extensions.ext_texture_filter_anisotropic) { + maxAnisotropic = gl.getParameter(GL_MAX_TEXTURE_MAX_ANISOTROPY_EXT); + } + + var maxDrawbuffers = 1; + var maxColorAttachments = 1; + if (extensions.webgl_draw_buffers) { + maxDrawbuffers = gl.getParameter(GL_MAX_DRAW_BUFFERS_WEBGL); + maxColorAttachments = gl.getParameter(GL_MAX_COLOR_ATTACHMENTS_WEBGL); + } + + // detect if reading float textures is available (Safari doesn't support) + var readFloat = !!extensions.oes_texture_float; + if (readFloat) { + var readFloatTexture = gl.createTexture(); + gl.bindTexture(GL_TEXTURE_2D, readFloatTexture); + gl.texImage2D(GL_TEXTURE_2D, 0, GL_RGBA, 1, 1, 0, GL_RGBA, GL_FLOAT$1, null); + + var fbo = gl.createFramebuffer(); + gl.bindFramebuffer(GL_FRAMEBUFFER, fbo); + gl.framebufferTexture2D(GL_FRAMEBUFFER, GL_COLOR_ATTACHMENT0, GL_TEXTURE_2D, readFloatTexture, 0); + gl.bindTexture(GL_TEXTURE_2D, null); + + if (gl.checkFramebufferStatus(GL_FRAMEBUFFER) !== GL_FRAMEBUFFER_COMPLETE) readFloat = false; + + else { + gl.viewport(0, 0, 1, 1); + gl.clearColor(1.0, 0.0, 0.0, 1.0); + gl.clear(GL_COLOR_BUFFER_BIT$1); + var pixels = pool.allocType(GL_FLOAT$1, 4); + gl.readPixels(0, 0, 1, 1, GL_RGBA, GL_FLOAT$1, pixels); + + if (gl.getError()) readFloat = false; + else { + gl.deleteFramebuffer(fbo); + gl.deleteTexture(readFloatTexture); + + readFloat = pixels[0] === 1.0; + } + + pool.freeType(pixels); + } + } + + // detect non power of two cube textures support (IE doesn't support) + var isIE = typeof navigator !== 'undefined' && (/MSIE/.test(navigator.userAgent) || /Trident\//.test(navigator.appVersion) || /Edge/.test(navigator.userAgent)); + + var npotTextureCube = true; + + if (!isIE) { + var cubeTexture = gl.createTexture(); + var data = pool.allocType(GL_UNSIGNED_BYTE$1, 36); + gl.activeTexture(GL_TEXTURE0); + gl.bindTexture(GL_TEXTURE_CUBE_MAP, cubeTexture); + gl.texImage2D(GL_TEXTURE_CUBE_MAP_POSITIVE_X, 0, GL_RGBA, 3, 3, 0, GL_RGBA, GL_UNSIGNED_BYTE$1, data); + pool.freeType(data); + gl.bindTexture(GL_TEXTURE_CUBE_MAP, null); + gl.deleteTexture(cubeTexture); + npotTextureCube = !gl.getError(); + } + + return { + // drawing buffer bit depth + colorBits: [ + gl.getParameter(GL_RED_BITS), + gl.getParameter(GL_GREEN_BITS), + gl.getParameter(GL_BLUE_BITS), + gl.getParameter(GL_ALPHA_BITS) + ], + depthBits: gl.getParameter(GL_DEPTH_BITS), + stencilBits: gl.getParameter(GL_STENCIL_BITS), + subpixelBits: gl.getParameter(GL_SUBPIXEL_BITS), + + // supported extensions + extensions: Object.keys(extensions).filter(function (ext) { + return !!extensions[ext] + }), + + // max aniso samples + maxAnisotropic: maxAnisotropic, + + // max draw buffers + maxDrawbuffers: maxDrawbuffers, + maxColorAttachments: maxColorAttachments, + + // point and line size ranges + pointSizeDims: gl.getParameter(GL_ALIASED_POINT_SIZE_RANGE), + lineWidthDims: gl.getParameter(GL_ALIASED_LINE_WIDTH_RANGE), + maxViewportDims: gl.getParameter(GL_MAX_VIEWPORT_DIMS), + maxCombinedTextureUnits: gl.getParameter(GL_MAX_COMBINED_TEXTURE_IMAGE_UNITS), + maxCubeMapSize: gl.getParameter(GL_MAX_CUBE_MAP_TEXTURE_SIZE), + maxRenderbufferSize: gl.getParameter(GL_MAX_RENDERBUFFER_SIZE), + maxTextureUnits: gl.getParameter(GL_MAX_TEXTURE_IMAGE_UNITS), + maxTextureSize: gl.getParameter(GL_MAX_TEXTURE_SIZE), + maxAttributes: gl.getParameter(GL_MAX_VERTEX_ATTRIBS), + maxVertexUniforms: gl.getParameter(GL_MAX_VERTEX_UNIFORM_VECTORS), + maxVertexTextureUnits: gl.getParameter(GL_MAX_VERTEX_TEXTURE_IMAGE_UNITS), + maxVaryingVectors: gl.getParameter(GL_MAX_VARYING_VECTORS), + maxFragmentUniforms: gl.getParameter(GL_MAX_FRAGMENT_UNIFORM_VECTORS), + + // vendor info + glsl: gl.getParameter(GL_SHADING_LANGUAGE_VERSION), + renderer: gl.getParameter(GL_RENDERER), + vendor: gl.getParameter(GL_VENDOR), + version: gl.getParameter(GL_VERSION), + + // quirks + readFloat: readFloat, + npotTextureCube: npotTextureCube + } +}; + +function isNDArrayLike (obj) { + return ( + !!obj && + typeof obj === 'object' && + Array.isArray(obj.shape) && + Array.isArray(obj.stride) && + typeof obj.offset === 'number' && + obj.shape.length === obj.stride.length && + (Array.isArray(obj.data) || + isTypedArray(obj.data))) +} + +var values = function (obj) { + return Object.keys(obj).map(function (key) { return obj[key] }) +}; + +var flattenUtils = { + shape: arrayShape$1, + flatten: flattenArray +}; + +function flatten1D (array, nx, out) { + for (var i = 0; i < nx; ++i) { + out[i] = array[i]; + } +} + +function flatten2D (array, nx, ny, out) { + var ptr = 0; + for (var i = 0; i < nx; ++i) { + var row = array[i]; + for (var j = 0; j < ny; ++j) { + out[ptr++] = row[j]; + } + } +} + +function flatten3D (array, nx, ny, nz, out, ptr_) { + var ptr = ptr_; + for (var i = 0; i < nx; ++i) { + var row = array[i]; + for (var j = 0; j < ny; ++j) { + var col = row[j]; + for (var k = 0; k < nz; ++k) { + out[ptr++] = col[k]; + } + } + } +} + +function flattenRec (array, shape, level, out, ptr) { + var stride = 1; + for (var i = level + 1; i < shape.length; ++i) { + stride *= shape[i]; + } + var n = shape[level]; + if (shape.length - level === 4) { + var nx = shape[level + 1]; + var ny = shape[level + 2]; + var nz = shape[level + 3]; + for (i = 0; i < n; ++i) { + flatten3D(array[i], nx, ny, nz, out, ptr); + ptr += stride; + } + } else { + for (i = 0; i < n; ++i) { + flattenRec(array[i], shape, level + 1, out, ptr); + ptr += stride; + } + } +} + +function flattenArray (array, shape, type, out_) { + var sz = 1; + if (shape.length) { + for (var i = 0; i < shape.length; ++i) { + sz *= shape[i]; + } + } else { + sz = 0; + } + var out = out_ || pool.allocType(type, sz); + switch (shape.length) { + case 0: + break + case 1: + flatten1D(array, shape[0], out); + break + case 2: + flatten2D(array, shape[0], shape[1], out); + break + case 3: + flatten3D(array, shape[0], shape[1], shape[2], out, 0); + break + default: + flattenRec(array, shape, 0, out, 0); + } + return out +} + +function arrayShape$1 (array_) { + var shape = []; + for (var array = array_; array.length; array = array[0]) { + shape.push(array.length); + } + return shape +} + +var arrayTypes = { + "[object Int8Array]": 5120, + "[object Int16Array]": 5122, + "[object Int32Array]": 5124, + "[object Uint8Array]": 5121, + "[object Uint8ClampedArray]": 5121, + "[object Uint16Array]": 5123, + "[object Uint32Array]": 5125, + "[object Float32Array]": 5126, + "[object Float64Array]": 5121, + "[object ArrayBuffer]": 5121 +}; + +var int8 = 5120; +var int16 = 5122; +var int32 = 5124; +var uint8 = 5121; +var uint16 = 5123; +var uint32 = 5125; +var float = 5126; +var float32 = 5126; +var glTypes = { + int8: int8, + int16: int16, + int32: int32, + uint8: uint8, + uint16: uint16, + uint32: uint32, + float: float, + float32: float32 +}; + +var dynamic$1 = 35048; +var stream = 35040; +var usageTypes = { + dynamic: dynamic$1, + stream: stream, + "static": 35044 +}; + +var arrayFlatten = flattenUtils.flatten; +var arrayShape = flattenUtils.shape; + +var GL_STATIC_DRAW = 0x88E4; +var GL_STREAM_DRAW = 0x88E0; + +var GL_UNSIGNED_BYTE$3 = 5121; +var GL_FLOAT$3 = 5126; + +var DTYPES_SIZES = []; +DTYPES_SIZES[5120] = 1; // int8 +DTYPES_SIZES[5122] = 2; // int16 +DTYPES_SIZES[5124] = 4; // int32 +DTYPES_SIZES[5121] = 1; // uint8 +DTYPES_SIZES[5123] = 2; // uint16 +DTYPES_SIZES[5125] = 4; // uint32 +DTYPES_SIZES[5126] = 4; // float32 + +function typedArrayCode (data) { + return arrayTypes[Object.prototype.toString.call(data)] | 0 +} + +function copyArray (out, inp) { + for (var i = 0; i < inp.length; ++i) { + out[i] = inp[i]; + } +} + +function transpose ( + result, data, shapeX, shapeY, strideX, strideY, offset) { + var ptr = 0; + for (var i = 0; i < shapeX; ++i) { + for (var j = 0; j < shapeY; ++j) { + result[ptr++] = data[strideX * i + strideY * j + offset]; + } + } +} + +function wrapBufferState (gl, stats, config, destroyBuffer) { + var bufferCount = 0; + var bufferSet = {}; + + function REGLBuffer (type) { + this.id = bufferCount++; + this.buffer = gl.createBuffer(); + this.type = type; + this.usage = GL_STATIC_DRAW; + this.byteLength = 0; + this.dimension = 1; + this.dtype = GL_UNSIGNED_BYTE$3; + + this.persistentData = null; + + if (config.profile) { + this.stats = { size: 0 }; + } + } + + REGLBuffer.prototype.bind = function () { + gl.bindBuffer(this.type, this.buffer); + }; + + REGLBuffer.prototype.destroy = function () { + destroy(this); + }; + + var streamPool = []; + + function createStream (type, data) { + var buffer = streamPool.pop(); + if (!buffer) { + buffer = new REGLBuffer(type); + } + buffer.bind(); + initBufferFromData(buffer, data, GL_STREAM_DRAW, 0, 1, false); + return buffer + } + + function destroyStream (stream$$1) { + streamPool.push(stream$$1); + } + + function initBufferFromTypedArray (buffer, data, usage) { + buffer.byteLength = data.byteLength; + gl.bufferData(buffer.type, data, usage); + } + + function initBufferFromData (buffer, data, usage, dtype, dimension, persist) { + var shape; + buffer.usage = usage; + if (Array.isArray(data)) { + buffer.dtype = dtype || GL_FLOAT$3; + if (data.length > 0) { + var flatData; + if (Array.isArray(data[0])) { + shape = arrayShape(data); + var dim = 1; + for (var i = 1; i < shape.length; ++i) { + dim *= shape[i]; + } + buffer.dimension = dim; + flatData = arrayFlatten(data, shape, buffer.dtype); + initBufferFromTypedArray(buffer, flatData, usage); + if (persist) { + buffer.persistentData = flatData; + } else { + pool.freeType(flatData); + } + } else if (typeof data[0] === 'number') { + buffer.dimension = dimension; + var typedData = pool.allocType(buffer.dtype, data.length); + copyArray(typedData, data); + initBufferFromTypedArray(buffer, typedData, usage); + if (persist) { + buffer.persistentData = typedData; + } else { + pool.freeType(typedData); + } + } else if (isTypedArray(data[0])) { + buffer.dimension = data[0].length; + buffer.dtype = dtype || typedArrayCode(data[0]) || GL_FLOAT$3; + flatData = arrayFlatten( + data, + [data.length, data[0].length], + buffer.dtype); + initBufferFromTypedArray(buffer, flatData, usage); + if (persist) { + buffer.persistentData = flatData; + } else { + pool.freeType(flatData); + } + } else { + check$1.raise('invalid buffer data'); + } + } + } else if (isTypedArray(data)) { + buffer.dtype = dtype || typedArrayCode(data); + buffer.dimension = dimension; + initBufferFromTypedArray(buffer, data, usage); + if (persist) { + buffer.persistentData = new Uint8Array(new Uint8Array(data.buffer)); + } + } else if (isNDArrayLike(data)) { + shape = data.shape; + var stride = data.stride; + var offset = data.offset; + + var shapeX = 0; + var shapeY = 0; + var strideX = 0; + var strideY = 0; + if (shape.length === 1) { + shapeX = shape[0]; + shapeY = 1; + strideX = stride[0]; + strideY = 0; + } else if (shape.length === 2) { + shapeX = shape[0]; + shapeY = shape[1]; + strideX = stride[0]; + strideY = stride[1]; + } else { + check$1.raise('invalid shape'); + } + + buffer.dtype = dtype || typedArrayCode(data.data) || GL_FLOAT$3; + buffer.dimension = shapeY; + + var transposeData = pool.allocType(buffer.dtype, shapeX * shapeY); + transpose(transposeData, + data.data, + shapeX, shapeY, + strideX, strideY, + offset); + initBufferFromTypedArray(buffer, transposeData, usage); + if (persist) { + buffer.persistentData = transposeData; + } else { + pool.freeType(transposeData); + } + } else if (data instanceof ArrayBuffer) { + buffer.dtype = GL_UNSIGNED_BYTE$3; + buffer.dimension = dimension; + initBufferFromTypedArray(buffer, data, usage); + if (persist) { + buffer.persistentData = new Uint8Array(new Uint8Array(data)); + } + } else { + check$1.raise('invalid buffer data'); + } + } + + function destroy (buffer) { + stats.bufferCount--; + + // remove attribute link + destroyBuffer(buffer); + + var handle = buffer.buffer; + check$1(handle, 'buffer must not be deleted already'); + gl.deleteBuffer(handle); + buffer.buffer = null; + delete bufferSet[buffer.id]; + } + + function createBuffer (options, type, deferInit, persistent) { + stats.bufferCount++; + + var buffer = new REGLBuffer(type); + bufferSet[buffer.id] = buffer; + + function reglBuffer (options) { + var usage = GL_STATIC_DRAW; + var data = null; + var byteLength = 0; + var dtype = 0; + var dimension = 1; + if (Array.isArray(options) || + isTypedArray(options) || + isNDArrayLike(options) || + options instanceof ArrayBuffer) { + data = options; + } else if (typeof options === 'number') { + byteLength = options | 0; + } else if (options) { + check$1.type( + options, 'object', + 'buffer arguments must be an object, a number or an array'); + + if ('data' in options) { + check$1( + data === null || + Array.isArray(data) || + isTypedArray(data) || + isNDArrayLike(data), + 'invalid data for buffer'); + data = options.data; + } + + if ('usage' in options) { + check$1.parameter(options.usage, usageTypes, 'invalid buffer usage'); + usage = usageTypes[options.usage]; + } + + if ('type' in options) { + check$1.parameter(options.type, glTypes, 'invalid buffer type'); + dtype = glTypes[options.type]; + } + + if ('dimension' in options) { + check$1.type(options.dimension, 'number', 'invalid dimension'); + dimension = options.dimension | 0; + } + + if ('length' in options) { + check$1.nni(byteLength, 'buffer length must be a nonnegative integer'); + byteLength = options.length | 0; + } + } + + buffer.bind(); + if (!data) { + // #475 + if (byteLength) gl.bufferData(buffer.type, byteLength, usage); + buffer.dtype = dtype || GL_UNSIGNED_BYTE$3; + buffer.usage = usage; + buffer.dimension = dimension; + buffer.byteLength = byteLength; + } else { + initBufferFromData(buffer, data, usage, dtype, dimension, persistent); + } + + if (config.profile) { + buffer.stats.size = buffer.byteLength * DTYPES_SIZES[buffer.dtype]; + } + + return reglBuffer + } + + function setSubData (data, offset) { + check$1(offset + data.byteLength <= buffer.byteLength, + 'invalid buffer subdata call, buffer is too small. ' + ' Can\'t write data of size ' + data.byteLength + ' starting from offset ' + offset + ' to a buffer of size ' + buffer.byteLength); + + gl.bufferSubData(buffer.type, offset, data); + } + + function subdata (data, offset_) { + var offset = (offset_ || 0) | 0; + var shape; + buffer.bind(); + if (isTypedArray(data) || data instanceof ArrayBuffer) { + setSubData(data, offset); + } else if (Array.isArray(data)) { + if (data.length > 0) { + if (typeof data[0] === 'number') { + var converted = pool.allocType(buffer.dtype, data.length); + copyArray(converted, data); + setSubData(converted, offset); + pool.freeType(converted); + } else if (Array.isArray(data[0]) || isTypedArray(data[0])) { + shape = arrayShape(data); + var flatData = arrayFlatten(data, shape, buffer.dtype); + setSubData(flatData, offset); + pool.freeType(flatData); + } else { + check$1.raise('invalid buffer data'); + } + } + } else if (isNDArrayLike(data)) { + shape = data.shape; + var stride = data.stride; + + var shapeX = 0; + var shapeY = 0; + var strideX = 0; + var strideY = 0; + if (shape.length === 1) { + shapeX = shape[0]; + shapeY = 1; + strideX = stride[0]; + strideY = 0; + } else if (shape.length === 2) { + shapeX = shape[0]; + shapeY = shape[1]; + strideX = stride[0]; + strideY = stride[1]; + } else { + check$1.raise('invalid shape'); + } + var dtype = Array.isArray(data.data) + ? buffer.dtype + : typedArrayCode(data.data); + + var transposeData = pool.allocType(dtype, shapeX * shapeY); + transpose(transposeData, + data.data, + shapeX, shapeY, + strideX, strideY, + data.offset); + setSubData(transposeData, offset); + pool.freeType(transposeData); + } else { + check$1.raise('invalid data for buffer subdata'); + } + return reglBuffer + } + + if (!deferInit) { + reglBuffer(options); + } + + reglBuffer._reglType = 'buffer'; + reglBuffer._buffer = buffer; + reglBuffer.subdata = subdata; + if (config.profile) { + reglBuffer.stats = buffer.stats; + } + reglBuffer.destroy = function () { destroy(buffer); }; + + return reglBuffer + } + + function restoreBuffers () { + values(bufferSet).forEach(function (buffer) { + buffer.buffer = gl.createBuffer(); + gl.bindBuffer(buffer.type, buffer.buffer); + gl.bufferData( + buffer.type, buffer.persistentData || buffer.byteLength, buffer.usage); + }); + } + + if (config.profile) { + stats.getTotalBufferSize = function () { + var total = 0; + // TODO: Right now, the streams are not part of the total count. + Object.keys(bufferSet).forEach(function (key) { + total += bufferSet[key].stats.size; + }); + return total + }; + } + + return { + create: createBuffer, + + createStream: createStream, + destroyStream: destroyStream, + + clear: function () { + values(bufferSet).forEach(destroy); + streamPool.forEach(destroy); + }, + + getBuffer: function (wrapper) { + if (wrapper && wrapper._buffer instanceof REGLBuffer) { + return wrapper._buffer + } + return null + }, + + restore: restoreBuffers, + + _initBuffer: initBufferFromData + } +} + +var points = 0; +var point = 0; +var lines = 1; +var line = 1; +var triangles = 4; +var triangle = 4; +var primTypes = { + points: points, + point: point, + lines: lines, + line: line, + triangles: triangles, + triangle: triangle, + "line loop": 2, + "line strip": 3, + "triangle strip": 5, + "triangle fan": 6 +}; + +var GL_POINTS = 0; +var GL_LINES = 1; +var GL_TRIANGLES = 4; + +var GL_BYTE$2 = 5120; +var GL_UNSIGNED_BYTE$4 = 5121; +var GL_SHORT$2 = 5122; +var GL_UNSIGNED_SHORT$2 = 5123; +var GL_INT$2 = 5124; +var GL_UNSIGNED_INT$2 = 5125; + +var GL_ELEMENT_ARRAY_BUFFER = 34963; + +var GL_STREAM_DRAW$1 = 0x88E0; +var GL_STATIC_DRAW$1 = 0x88E4; + +function wrapElementsState (gl, extensions, bufferState, stats) { + var elementSet = {}; + var elementCount = 0; + + var elementTypes = { + 'uint8': GL_UNSIGNED_BYTE$4, + 'uint16': GL_UNSIGNED_SHORT$2 + }; + + if (extensions.oes_element_index_uint) { + elementTypes.uint32 = GL_UNSIGNED_INT$2; + } + + function REGLElementBuffer (buffer) { + this.id = elementCount++; + elementSet[this.id] = this; + this.buffer = buffer; + this.primType = GL_TRIANGLES; + this.vertCount = 0; + this.type = 0; + } + + REGLElementBuffer.prototype.bind = function () { + this.buffer.bind(); + }; + + var bufferPool = []; + + function createElementStream (data) { + var result = bufferPool.pop(); + if (!result) { + result = new REGLElementBuffer(bufferState.create( + null, + GL_ELEMENT_ARRAY_BUFFER, + true, + false)._buffer); + } + initElements(result, data, GL_STREAM_DRAW$1, -1, -1, 0, 0); + return result + } + + function destroyElementStream (elements) { + bufferPool.push(elements); + } + + function initElements ( + elements, + data, + usage, + prim, + count, + byteLength, + type) { + elements.buffer.bind(); + var dtype; + if (data) { + var predictedType = type; + if (!type && ( + !isTypedArray(data) || + (isNDArrayLike(data) && !isTypedArray(data.data)))) { + predictedType = extensions.oes_element_index_uint + ? GL_UNSIGNED_INT$2 + : GL_UNSIGNED_SHORT$2; + } + bufferState._initBuffer( + elements.buffer, + data, + usage, + predictedType, + 3); + } else { + gl.bufferData(GL_ELEMENT_ARRAY_BUFFER, byteLength, usage); + elements.buffer.dtype = dtype || GL_UNSIGNED_BYTE$4; + elements.buffer.usage = usage; + elements.buffer.dimension = 3; + elements.buffer.byteLength = byteLength; + } + + dtype = type; + if (!type) { + switch (elements.buffer.dtype) { + case GL_UNSIGNED_BYTE$4: + case GL_BYTE$2: + dtype = GL_UNSIGNED_BYTE$4; + break + + case GL_UNSIGNED_SHORT$2: + case GL_SHORT$2: + dtype = GL_UNSIGNED_SHORT$2; + break + + case GL_UNSIGNED_INT$2: + case GL_INT$2: + dtype = GL_UNSIGNED_INT$2; + break + + default: + check$1.raise('unsupported type for element array'); + } + elements.buffer.dtype = dtype; + } + elements.type = dtype; + + // Check oes_element_index_uint extension + check$1( + dtype !== GL_UNSIGNED_INT$2 || + !!extensions.oes_element_index_uint, + '32 bit element buffers not supported, enable oes_element_index_uint first'); + + // try to guess default primitive type and arguments + var vertCount = count; + if (vertCount < 0) { + vertCount = elements.buffer.byteLength; + if (dtype === GL_UNSIGNED_SHORT$2) { + vertCount >>= 1; + } else if (dtype === GL_UNSIGNED_INT$2) { + vertCount >>= 2; + } + } + elements.vertCount = vertCount; + + // try to guess primitive type from cell dimension + var primType = prim; + if (prim < 0) { + primType = GL_TRIANGLES; + var dimension = elements.buffer.dimension; + if (dimension === 1) primType = GL_POINTS; + if (dimension === 2) primType = GL_LINES; + if (dimension === 3) primType = GL_TRIANGLES; + } + elements.primType = primType; + } + + function destroyElements (elements) { + stats.elementsCount--; + + check$1(elements.buffer !== null, 'must not double destroy elements'); + delete elementSet[elements.id]; + elements.buffer.destroy(); + elements.buffer = null; + } + + function createElements (options, persistent) { + var buffer = bufferState.create(null, GL_ELEMENT_ARRAY_BUFFER, true); + var elements = new REGLElementBuffer(buffer._buffer); + stats.elementsCount++; + + function reglElements (options) { + if (!options) { + buffer(); + elements.primType = GL_TRIANGLES; + elements.vertCount = 0; + elements.type = GL_UNSIGNED_BYTE$4; + } else if (typeof options === 'number') { + buffer(options); + elements.primType = GL_TRIANGLES; + elements.vertCount = options | 0; + elements.type = GL_UNSIGNED_BYTE$4; + } else { + var data = null; + var usage = GL_STATIC_DRAW$1; + var primType = -1; + var vertCount = -1; + var byteLength = 0; + var dtype = 0; + if (Array.isArray(options) || + isTypedArray(options) || + isNDArrayLike(options)) { + data = options; + } else { + check$1.type(options, 'object', 'invalid arguments for elements'); + if ('data' in options) { + data = options.data; + check$1( + Array.isArray(data) || + isTypedArray(data) || + isNDArrayLike(data), + 'invalid data for element buffer'); + } + if ('usage' in options) { + check$1.parameter( + options.usage, + usageTypes, + 'invalid element buffer usage'); + usage = usageTypes[options.usage]; + } + if ('primitive' in options) { + check$1.parameter( + options.primitive, + primTypes, + 'invalid element buffer primitive'); + primType = primTypes[options.primitive]; + } + if ('count' in options) { + check$1( + typeof options.count === 'number' && options.count >= 0, + 'invalid vertex count for elements'); + vertCount = options.count | 0; + } + if ('type' in options) { + check$1.parameter( + options.type, + elementTypes, + 'invalid buffer type'); + dtype = elementTypes[options.type]; + } + if ('length' in options) { + byteLength = options.length | 0; + } else { + byteLength = vertCount; + if (dtype === GL_UNSIGNED_SHORT$2 || dtype === GL_SHORT$2) { + byteLength *= 2; + } else if (dtype === GL_UNSIGNED_INT$2 || dtype === GL_INT$2) { + byteLength *= 4; + } + } + } + initElements( + elements, + data, + usage, + primType, + vertCount, + byteLength, + dtype); + } + + return reglElements + } + + reglElements(options); + + reglElements._reglType = 'elements'; + reglElements._elements = elements; + reglElements.subdata = function (data, offset) { + buffer.subdata(data, offset); + return reglElements + }; + reglElements.destroy = function () { + destroyElements(elements); + }; + + return reglElements + } + + return { + create: createElements, + createStream: createElementStream, + destroyStream: destroyElementStream, + getElements: function (elements) { + if (typeof elements === 'function' && + elements._elements instanceof REGLElementBuffer) { + return elements._elements + } + return null + }, + clear: function () { + values(elementSet).forEach(destroyElements); + } + } +} + +var FLOAT = new Float32Array(1); +var INT = new Uint32Array(FLOAT.buffer); + +var GL_UNSIGNED_SHORT$4 = 5123; + +function convertToHalfFloat (array) { + var ushorts = pool.allocType(GL_UNSIGNED_SHORT$4, array.length); + + for (var i = 0; i < array.length; ++i) { + if (isNaN(array[i])) { + ushorts[i] = 0xffff; + } else if (array[i] === Infinity) { + ushorts[i] = 0x7c00; + } else if (array[i] === -Infinity) { + ushorts[i] = 0xfc00; + } else { + FLOAT[0] = array[i]; + var x = INT[0]; + + var sgn = (x >>> 31) << 15; + var exp = ((x << 1) >>> 24) - 127; + var frac = (x >> 13) & ((1 << 10) - 1); + + if (exp < -24) { + // round non-representable denormals to 0 + ushorts[i] = sgn; + } else if (exp < -14) { + // handle denormals + var s = -14 - exp; + ushorts[i] = sgn + ((frac + (1 << 10)) >> s); + } else if (exp > 15) { + // round overflow to +/- Infinity + ushorts[i] = sgn + 0x7c00; + } else { + // otherwise convert directly + ushorts[i] = sgn + ((exp + 15) << 10) + frac; + } + } + } + + return ushorts +} + +function isArrayLike (s) { + return Array.isArray(s) || isTypedArray(s) +} + +var isPow2$1 = function (v) { + return !(v & (v - 1)) && (!!v) +}; + +var GL_COMPRESSED_TEXTURE_FORMATS = 0x86A3; + +var GL_TEXTURE_2D$1 = 0x0DE1; +var GL_TEXTURE_CUBE_MAP$1 = 0x8513; +var GL_TEXTURE_CUBE_MAP_POSITIVE_X$1 = 0x8515; + +var GL_RGBA$1 = 0x1908; +var GL_ALPHA = 0x1906; +var GL_RGB = 0x1907; +var GL_LUMINANCE = 0x1909; +var GL_LUMINANCE_ALPHA = 0x190A; + +var GL_RGBA4 = 0x8056; +var GL_RGB5_A1 = 0x8057; +var GL_RGB565 = 0x8D62; + +var GL_UNSIGNED_SHORT_4_4_4_4$1 = 0x8033; +var GL_UNSIGNED_SHORT_5_5_5_1$1 = 0x8034; +var GL_UNSIGNED_SHORT_5_6_5$1 = 0x8363; +var GL_UNSIGNED_INT_24_8_WEBGL$1 = 0x84FA; + +var GL_DEPTH_COMPONENT = 0x1902; +var GL_DEPTH_STENCIL = 0x84F9; + +var GL_SRGB_EXT = 0x8C40; +var GL_SRGB_ALPHA_EXT = 0x8C42; + +var GL_HALF_FLOAT_OES$1 = 0x8D61; + +var GL_COMPRESSED_RGB_S3TC_DXT1_EXT = 0x83F0; +var GL_COMPRESSED_RGBA_S3TC_DXT1_EXT = 0x83F1; +var GL_COMPRESSED_RGBA_S3TC_DXT3_EXT = 0x83F2; +var GL_COMPRESSED_RGBA_S3TC_DXT5_EXT = 0x83F3; + +var GL_COMPRESSED_RGB_ATC_WEBGL = 0x8C92; +var GL_COMPRESSED_RGBA_ATC_EXPLICIT_ALPHA_WEBGL = 0x8C93; +var GL_COMPRESSED_RGBA_ATC_INTERPOLATED_ALPHA_WEBGL = 0x87EE; + +var GL_COMPRESSED_RGB_PVRTC_4BPPV1_IMG = 0x8C00; +var GL_COMPRESSED_RGB_PVRTC_2BPPV1_IMG = 0x8C01; +var GL_COMPRESSED_RGBA_PVRTC_4BPPV1_IMG = 0x8C02; +var GL_COMPRESSED_RGBA_PVRTC_2BPPV1_IMG = 0x8C03; + +var GL_COMPRESSED_RGB_ETC1_WEBGL = 0x8D64; + +var GL_UNSIGNED_BYTE$5 = 0x1401; +var GL_UNSIGNED_SHORT$3 = 0x1403; +var GL_UNSIGNED_INT$3 = 0x1405; +var GL_FLOAT$4 = 0x1406; + +var GL_TEXTURE_WRAP_S = 0x2802; +var GL_TEXTURE_WRAP_T = 0x2803; + +var GL_REPEAT = 0x2901; +var GL_CLAMP_TO_EDGE$1 = 0x812F; +var GL_MIRRORED_REPEAT = 0x8370; + +var GL_TEXTURE_MAG_FILTER = 0x2800; +var GL_TEXTURE_MIN_FILTER = 0x2801; + +var GL_NEAREST$1 = 0x2600; +var GL_LINEAR = 0x2601; +var GL_NEAREST_MIPMAP_NEAREST$1 = 0x2700; +var GL_LINEAR_MIPMAP_NEAREST$1 = 0x2701; +var GL_NEAREST_MIPMAP_LINEAR$1 = 0x2702; +var GL_LINEAR_MIPMAP_LINEAR$1 = 0x2703; + +var GL_GENERATE_MIPMAP_HINT = 0x8192; +var GL_DONT_CARE = 0x1100; +var GL_FASTEST = 0x1101; +var GL_NICEST = 0x1102; + +var GL_TEXTURE_MAX_ANISOTROPY_EXT = 0x84FE; + +var GL_UNPACK_ALIGNMENT = 0x0CF5; +var GL_UNPACK_FLIP_Y_WEBGL = 0x9240; +var GL_UNPACK_PREMULTIPLY_ALPHA_WEBGL = 0x9241; +var GL_UNPACK_COLORSPACE_CONVERSION_WEBGL = 0x9243; + +var GL_BROWSER_DEFAULT_WEBGL = 0x9244; + +var GL_TEXTURE0$1 = 0x84C0; + +var MIPMAP_FILTERS = [ + GL_NEAREST_MIPMAP_NEAREST$1, + GL_NEAREST_MIPMAP_LINEAR$1, + GL_LINEAR_MIPMAP_NEAREST$1, + GL_LINEAR_MIPMAP_LINEAR$1 +]; + +var CHANNELS_FORMAT = [ + 0, + GL_LUMINANCE, + GL_LUMINANCE_ALPHA, + GL_RGB, + GL_RGBA$1 +]; + +var FORMAT_CHANNELS = {}; +FORMAT_CHANNELS[GL_LUMINANCE] = +FORMAT_CHANNELS[GL_ALPHA] = +FORMAT_CHANNELS[GL_DEPTH_COMPONENT] = 1; +FORMAT_CHANNELS[GL_DEPTH_STENCIL] = +FORMAT_CHANNELS[GL_LUMINANCE_ALPHA] = 2; +FORMAT_CHANNELS[GL_RGB] = +FORMAT_CHANNELS[GL_SRGB_EXT] = 3; +FORMAT_CHANNELS[GL_RGBA$1] = +FORMAT_CHANNELS[GL_SRGB_ALPHA_EXT] = 4; + +function objectName (str) { + return '[object ' + str + ']' +} + +var CANVAS_CLASS = objectName('HTMLCanvasElement'); +var OFFSCREENCANVAS_CLASS = objectName('OffscreenCanvas'); +var CONTEXT2D_CLASS = objectName('CanvasRenderingContext2D'); +var BITMAP_CLASS = objectName('ImageBitmap'); +var IMAGE_CLASS = objectName('HTMLImageElement'); +var VIDEO_CLASS = objectName('HTMLVideoElement'); + +var PIXEL_CLASSES = Object.keys(arrayTypes).concat([ + CANVAS_CLASS, + OFFSCREENCANVAS_CLASS, + CONTEXT2D_CLASS, + BITMAP_CLASS, + IMAGE_CLASS, + VIDEO_CLASS +]); + +// for every texture type, store +// the size in bytes. +var TYPE_SIZES = []; +TYPE_SIZES[GL_UNSIGNED_BYTE$5] = 1; +TYPE_SIZES[GL_FLOAT$4] = 4; +TYPE_SIZES[GL_HALF_FLOAT_OES$1] = 2; + +TYPE_SIZES[GL_UNSIGNED_SHORT$3] = 2; +TYPE_SIZES[GL_UNSIGNED_INT$3] = 4; + +var FORMAT_SIZES_SPECIAL = []; +FORMAT_SIZES_SPECIAL[GL_RGBA4] = 2; +FORMAT_SIZES_SPECIAL[GL_RGB5_A1] = 2; +FORMAT_SIZES_SPECIAL[GL_RGB565] = 2; +FORMAT_SIZES_SPECIAL[GL_DEPTH_STENCIL] = 4; + +FORMAT_SIZES_SPECIAL[GL_COMPRESSED_RGB_S3TC_DXT1_EXT] = 0.5; +FORMAT_SIZES_SPECIAL[GL_COMPRESSED_RGBA_S3TC_DXT1_EXT] = 0.5; +FORMAT_SIZES_SPECIAL[GL_COMPRESSED_RGBA_S3TC_DXT3_EXT] = 1; +FORMAT_SIZES_SPECIAL[GL_COMPRESSED_RGBA_S3TC_DXT5_EXT] = 1; + +FORMAT_SIZES_SPECIAL[GL_COMPRESSED_RGB_ATC_WEBGL] = 0.5; +FORMAT_SIZES_SPECIAL[GL_COMPRESSED_RGBA_ATC_EXPLICIT_ALPHA_WEBGL] = 1; +FORMAT_SIZES_SPECIAL[GL_COMPRESSED_RGBA_ATC_INTERPOLATED_ALPHA_WEBGL] = 1; + +FORMAT_SIZES_SPECIAL[GL_COMPRESSED_RGB_PVRTC_4BPPV1_IMG] = 0.5; +FORMAT_SIZES_SPECIAL[GL_COMPRESSED_RGB_PVRTC_2BPPV1_IMG] = 0.25; +FORMAT_SIZES_SPECIAL[GL_COMPRESSED_RGBA_PVRTC_4BPPV1_IMG] = 0.5; +FORMAT_SIZES_SPECIAL[GL_COMPRESSED_RGBA_PVRTC_2BPPV1_IMG] = 0.25; + +FORMAT_SIZES_SPECIAL[GL_COMPRESSED_RGB_ETC1_WEBGL] = 0.5; + +function isNumericArray (arr) { + return ( + Array.isArray(arr) && + (arr.length === 0 || + typeof arr[0] === 'number')) +} + +function isRectArray (arr) { + if (!Array.isArray(arr)) { + return false + } + var width = arr.length; + if (width === 0 || !isArrayLike(arr[0])) { + return false + } + return true +} + +function classString (x) { + return Object.prototype.toString.call(x) +} + +function isCanvasElement (object) { + return classString(object) === CANVAS_CLASS +} + +function isOffscreenCanvas (object) { + return classString(object) === OFFSCREENCANVAS_CLASS +} + +function isContext2D (object) { + return classString(object) === CONTEXT2D_CLASS +} + +function isBitmap (object) { + return classString(object) === BITMAP_CLASS +} + +function isImageElement (object) { + return classString(object) === IMAGE_CLASS +} + +function isVideoElement (object) { + return classString(object) === VIDEO_CLASS +} + +function isPixelData (object) { + if (!object) { + return false + } + var className = classString(object); + if (PIXEL_CLASSES.indexOf(className) >= 0) { + return true + } + return ( + isNumericArray(object) || + isRectArray(object) || + isNDArrayLike(object)) +} + +function typedArrayCode$1 (data) { + return arrayTypes[Object.prototype.toString.call(data)] | 0 +} + +function convertData (result, data) { + var n = data.length; + switch (result.type) { + case GL_UNSIGNED_BYTE$5: + case GL_UNSIGNED_SHORT$3: + case GL_UNSIGNED_INT$3: + case GL_FLOAT$4: + var converted = pool.allocType(result.type, n); + converted.set(data); + result.data = converted; + break + + case GL_HALF_FLOAT_OES$1: + result.data = convertToHalfFloat(data); + break + + default: + check$1.raise('unsupported texture type, must specify a typed array'); + } +} + +function preConvert (image, n) { + return pool.allocType( + image.type === GL_HALF_FLOAT_OES$1 + ? GL_FLOAT$4 + : image.type, n) +} + +function postConvert (image, data) { + if (image.type === GL_HALF_FLOAT_OES$1) { + image.data = convertToHalfFloat(data); + pool.freeType(data); + } else { + image.data = data; + } +} + +function transposeData (image, array, strideX, strideY, strideC, offset) { + var w = image.width; + var h = image.height; + var c = image.channels; + var n = w * h * c; + var data = preConvert(image, n); + + var p = 0; + for (var i = 0; i < h; ++i) { + for (var j = 0; j < w; ++j) { + for (var k = 0; k < c; ++k) { + data[p++] = array[strideX * j + strideY * i + strideC * k + offset]; + } + } + } + + postConvert(image, data); +} + +function getTextureSize (format, type, width, height, isMipmap, isCube) { + var s; + if (typeof FORMAT_SIZES_SPECIAL[format] !== 'undefined') { + // we have a special array for dealing with weird color formats such as RGB5A1 + s = FORMAT_SIZES_SPECIAL[format]; + } else { + s = FORMAT_CHANNELS[format] * TYPE_SIZES[type]; + } + + if (isCube) { + s *= 6; + } + + if (isMipmap) { + // compute the total size of all the mipmaps. + var total = 0; + + var w = width; + while (w >= 1) { + // we can only use mipmaps on a square image, + // so we can simply use the width and ignore the height: + total += s * w * w; + w /= 2; + } + return total + } else { + return s * width * height + } +} + +function createTextureSet ( + gl, extensions, limits, reglPoll, contextState, stats, config) { + // ------------------------------------------------------- + // Initialize constants and parameter tables here + // ------------------------------------------------------- + var mipmapHint = { + "don't care": GL_DONT_CARE, + 'dont care': GL_DONT_CARE, + 'nice': GL_NICEST, + 'fast': GL_FASTEST + }; + + var wrapModes = { + 'repeat': GL_REPEAT, + 'clamp': GL_CLAMP_TO_EDGE$1, + 'mirror': GL_MIRRORED_REPEAT + }; + + var magFilters = { + 'nearest': GL_NEAREST$1, + 'linear': GL_LINEAR + }; + + var minFilters = extend({ + 'mipmap': GL_LINEAR_MIPMAP_LINEAR$1, + 'nearest mipmap nearest': GL_NEAREST_MIPMAP_NEAREST$1, + 'linear mipmap nearest': GL_LINEAR_MIPMAP_NEAREST$1, + 'nearest mipmap linear': GL_NEAREST_MIPMAP_LINEAR$1, + 'linear mipmap linear': GL_LINEAR_MIPMAP_LINEAR$1 + }, magFilters); + + var colorSpace = { + 'none': 0, + 'browser': GL_BROWSER_DEFAULT_WEBGL + }; + + var textureTypes = { + 'uint8': GL_UNSIGNED_BYTE$5, + 'rgba4': GL_UNSIGNED_SHORT_4_4_4_4$1, + 'rgb565': GL_UNSIGNED_SHORT_5_6_5$1, + 'rgb5 a1': GL_UNSIGNED_SHORT_5_5_5_1$1 + }; + + var textureFormats = { + 'alpha': GL_ALPHA, + 'luminance': GL_LUMINANCE, + 'luminance alpha': GL_LUMINANCE_ALPHA, + 'rgb': GL_RGB, + 'rgba': GL_RGBA$1, + 'rgba4': GL_RGBA4, + 'rgb5 a1': GL_RGB5_A1, + 'rgb565': GL_RGB565 + }; + + var compressedTextureFormats = {}; + + if (extensions.ext_srgb) { + textureFormats.srgb = GL_SRGB_EXT; + textureFormats.srgba = GL_SRGB_ALPHA_EXT; + } + + if (extensions.oes_texture_float) { + textureTypes.float32 = textureTypes.float = GL_FLOAT$4; + } + + if (extensions.oes_texture_half_float) { + textureTypes['float16'] = textureTypes['half float'] = GL_HALF_FLOAT_OES$1; + } + + if (extensions.webgl_depth_texture) { + extend(textureFormats, { + 'depth': GL_DEPTH_COMPONENT, + 'depth stencil': GL_DEPTH_STENCIL + }); + + extend(textureTypes, { + 'uint16': GL_UNSIGNED_SHORT$3, + 'uint32': GL_UNSIGNED_INT$3, + 'depth stencil': GL_UNSIGNED_INT_24_8_WEBGL$1 + }); + } + + if (extensions.webgl_compressed_texture_s3tc) { + extend(compressedTextureFormats, { + 'rgb s3tc dxt1': GL_COMPRESSED_RGB_S3TC_DXT1_EXT, + 'rgba s3tc dxt1': GL_COMPRESSED_RGBA_S3TC_DXT1_EXT, + 'rgba s3tc dxt3': GL_COMPRESSED_RGBA_S3TC_DXT3_EXT, + 'rgba s3tc dxt5': GL_COMPRESSED_RGBA_S3TC_DXT5_EXT + }); + } + + if (extensions.webgl_compressed_texture_atc) { + extend(compressedTextureFormats, { + 'rgb atc': GL_COMPRESSED_RGB_ATC_WEBGL, + 'rgba atc explicit alpha': GL_COMPRESSED_RGBA_ATC_EXPLICIT_ALPHA_WEBGL, + 'rgba atc interpolated alpha': GL_COMPRESSED_RGBA_ATC_INTERPOLATED_ALPHA_WEBGL + }); + } + + if (extensions.webgl_compressed_texture_pvrtc) { + extend(compressedTextureFormats, { + 'rgb pvrtc 4bppv1': GL_COMPRESSED_RGB_PVRTC_4BPPV1_IMG, + 'rgb pvrtc 2bppv1': GL_COMPRESSED_RGB_PVRTC_2BPPV1_IMG, + 'rgba pvrtc 4bppv1': GL_COMPRESSED_RGBA_PVRTC_4BPPV1_IMG, + 'rgba pvrtc 2bppv1': GL_COMPRESSED_RGBA_PVRTC_2BPPV1_IMG + }); + } + + if (extensions.webgl_compressed_texture_etc1) { + compressedTextureFormats['rgb etc1'] = GL_COMPRESSED_RGB_ETC1_WEBGL; + } + + // Copy over all texture formats + var supportedCompressedFormats = Array.prototype.slice.call( + gl.getParameter(GL_COMPRESSED_TEXTURE_FORMATS)); + Object.keys(compressedTextureFormats).forEach(function (name) { + var format = compressedTextureFormats[name]; + if (supportedCompressedFormats.indexOf(format) >= 0) { + textureFormats[name] = format; + } + }); + + var supportedFormats = Object.keys(textureFormats); + limits.textureFormats = supportedFormats; + + // associate with every format string its + // corresponding GL-value. + var textureFormatsInvert = []; + Object.keys(textureFormats).forEach(function (key) { + var val = textureFormats[key]; + textureFormatsInvert[val] = key; + }); + + // associate with every type string its + // corresponding GL-value. + var textureTypesInvert = []; + Object.keys(textureTypes).forEach(function (key) { + var val = textureTypes[key]; + textureTypesInvert[val] = key; + }); + + var magFiltersInvert = []; + Object.keys(magFilters).forEach(function (key) { + var val = magFilters[key]; + magFiltersInvert[val] = key; + }); + + var minFiltersInvert = []; + Object.keys(minFilters).forEach(function (key) { + var val = minFilters[key]; + minFiltersInvert[val] = key; + }); + + var wrapModesInvert = []; + Object.keys(wrapModes).forEach(function (key) { + var val = wrapModes[key]; + wrapModesInvert[val] = key; + }); + + // colorFormats[] gives the format (channels) associated to an + // internalformat + var colorFormats = supportedFormats.reduce(function (color, key) { + var glenum = textureFormats[key]; + if (glenum === GL_LUMINANCE || + glenum === GL_ALPHA || + glenum === GL_LUMINANCE || + glenum === GL_LUMINANCE_ALPHA || + glenum === GL_DEPTH_COMPONENT || + glenum === GL_DEPTH_STENCIL || + (extensions.ext_srgb && + (glenum === GL_SRGB_EXT || + glenum === GL_SRGB_ALPHA_EXT))) { + color[glenum] = glenum; + } else if (glenum === GL_RGB5_A1 || key.indexOf('rgba') >= 0) { + color[glenum] = GL_RGBA$1; + } else { + color[glenum] = GL_RGB; + } + return color + }, {}); + + function TexFlags () { + // format info + this.internalformat = GL_RGBA$1; + this.format = GL_RGBA$1; + this.type = GL_UNSIGNED_BYTE$5; + this.compressed = false; + + // pixel storage + this.premultiplyAlpha = false; + this.flipY = false; + this.unpackAlignment = 1; + this.colorSpace = GL_BROWSER_DEFAULT_WEBGL; + + // shape info + this.width = 0; + this.height = 0; + this.channels = 0; + } + + function copyFlags (result, other) { + result.internalformat = other.internalformat; + result.format = other.format; + result.type = other.type; + result.compressed = other.compressed; + + result.premultiplyAlpha = other.premultiplyAlpha; + result.flipY = other.flipY; + result.unpackAlignment = other.unpackAlignment; + result.colorSpace = other.colorSpace; + + result.width = other.width; + result.height = other.height; + result.channels = other.channels; + } + + function parseFlags (flags, options) { + if (typeof options !== 'object' || !options) { + return + } + + if ('premultiplyAlpha' in options) { + check$1.type(options.premultiplyAlpha, 'boolean', + 'invalid premultiplyAlpha'); + flags.premultiplyAlpha = options.premultiplyAlpha; + } + + if ('flipY' in options) { + check$1.type(options.flipY, 'boolean', + 'invalid texture flip'); + flags.flipY = options.flipY; + } + + if ('alignment' in options) { + check$1.oneOf(options.alignment, [1, 2, 4, 8], + 'invalid texture unpack alignment'); + flags.unpackAlignment = options.alignment; + } + + if ('colorSpace' in options) { + check$1.parameter(options.colorSpace, colorSpace, + 'invalid colorSpace'); + flags.colorSpace = colorSpace[options.colorSpace]; + } + + if ('type' in options) { + var type = options.type; + check$1(extensions.oes_texture_float || + !(type === 'float' || type === 'float32'), + 'you must enable the OES_texture_float extension in order to use floating point textures.'); + check$1(extensions.oes_texture_half_float || + !(type === 'half float' || type === 'float16'), + 'you must enable the OES_texture_half_float extension in order to use 16-bit floating point textures.'); + check$1(extensions.webgl_depth_texture || + !(type === 'uint16' || type === 'uint32' || type === 'depth stencil'), + 'you must enable the WEBGL_depth_texture extension in order to use depth/stencil textures.'); + check$1.parameter(type, textureTypes, + 'invalid texture type'); + flags.type = textureTypes[type]; + } + + var w = flags.width; + var h = flags.height; + var c = flags.channels; + var hasChannels = false; + if ('shape' in options) { + check$1(Array.isArray(options.shape) && options.shape.length >= 2, + 'shape must be an array'); + w = options.shape[0]; + h = options.shape[1]; + if (options.shape.length === 3) { + c = options.shape[2]; + check$1(c > 0 && c <= 4, 'invalid number of channels'); + hasChannels = true; + } + check$1(w >= 0 && w <= limits.maxTextureSize, 'invalid width'); + check$1(h >= 0 && h <= limits.maxTextureSize, 'invalid height'); + } else { + if ('radius' in options) { + w = h = options.radius; + check$1(w >= 0 && w <= limits.maxTextureSize, 'invalid radius'); + } + if ('width' in options) { + w = options.width; + check$1(w >= 0 && w <= limits.maxTextureSize, 'invalid width'); + } + if ('height' in options) { + h = options.height; + check$1(h >= 0 && h <= limits.maxTextureSize, 'invalid height'); + } + if ('channels' in options) { + c = options.channels; + check$1(c > 0 && c <= 4, 'invalid number of channels'); + hasChannels = true; + } + } + flags.width = w | 0; + flags.height = h | 0; + flags.channels = c | 0; + + var hasFormat = false; + if ('format' in options) { + var formatStr = options.format; + check$1(extensions.webgl_depth_texture || + !(formatStr === 'depth' || formatStr === 'depth stencil'), + 'you must enable the WEBGL_depth_texture extension in order to use depth/stencil textures.'); + check$1.parameter(formatStr, textureFormats, + 'invalid texture format'); + var internalformat = flags.internalformat = textureFormats[formatStr]; + flags.format = colorFormats[internalformat]; + if (formatStr in textureTypes) { + if (!('type' in options)) { + flags.type = textureTypes[formatStr]; + } + } + if (formatStr in compressedTextureFormats) { + flags.compressed = true; + } + hasFormat = true; + } + + // Reconcile channels and format + if (!hasChannels && hasFormat) { + flags.channels = FORMAT_CHANNELS[flags.format]; + } else if (hasChannels && !hasFormat) { + if (flags.channels !== CHANNELS_FORMAT[flags.format]) { + flags.format = flags.internalformat = CHANNELS_FORMAT[flags.channels]; + } + } else if (hasFormat && hasChannels) { + check$1( + flags.channels === FORMAT_CHANNELS[flags.format], + 'number of channels inconsistent with specified format'); + } + } + + function setFlags (flags) { + gl.pixelStorei(GL_UNPACK_FLIP_Y_WEBGL, flags.flipY); + gl.pixelStorei(GL_UNPACK_PREMULTIPLY_ALPHA_WEBGL, flags.premultiplyAlpha); + gl.pixelStorei(GL_UNPACK_COLORSPACE_CONVERSION_WEBGL, flags.colorSpace); + gl.pixelStorei(GL_UNPACK_ALIGNMENT, flags.unpackAlignment); + } + + // ------------------------------------------------------- + // Tex image data + // ------------------------------------------------------- + function TexImage () { + TexFlags.call(this); + + this.xOffset = 0; + this.yOffset = 0; + + // data + this.data = null; + this.needsFree = false; + + // html element + this.element = null; + + // copyTexImage info + this.needsCopy = false; + } + + function parseImage (image, options) { + var data = null; + if (isPixelData(options)) { + data = options; + } else if (options) { + check$1.type(options, 'object', 'invalid pixel data type'); + parseFlags(image, options); + if ('x' in options) { + image.xOffset = options.x | 0; + } + if ('y' in options) { + image.yOffset = options.y | 0; + } + if (isPixelData(options.data)) { + data = options.data; + } + } + + check$1( + !image.compressed || + data instanceof Uint8Array, + 'compressed texture data must be stored in a uint8array'); + + if (options.copy) { + check$1(!data, 'can not specify copy and data field for the same texture'); + var viewW = contextState.viewportWidth; + var viewH = contextState.viewportHeight; + image.width = image.width || (viewW - image.xOffset); + image.height = image.height || (viewH - image.yOffset); + image.needsCopy = true; + check$1(image.xOffset >= 0 && image.xOffset < viewW && + image.yOffset >= 0 && image.yOffset < viewH && + image.width > 0 && image.width <= viewW && + image.height > 0 && image.height <= viewH, + 'copy texture read out of bounds'); + } else if (!data) { + image.width = image.width || 1; + image.height = image.height || 1; + image.channels = image.channels || 4; + } else if (isTypedArray(data)) { + image.channels = image.channels || 4; + image.data = data; + if (!('type' in options) && image.type === GL_UNSIGNED_BYTE$5) { + image.type = typedArrayCode$1(data); + } + } else if (isNumericArray(data)) { + image.channels = image.channels || 4; + convertData(image, data); + image.alignment = 1; + image.needsFree = true; + } else if (isNDArrayLike(data)) { + var array = data.data; + if (!Array.isArray(array) && image.type === GL_UNSIGNED_BYTE$5) { + image.type = typedArrayCode$1(array); + } + var shape = data.shape; + var stride = data.stride; + var shapeX, shapeY, shapeC, strideX, strideY, strideC; + if (shape.length === 3) { + shapeC = shape[2]; + strideC = stride[2]; + } else { + check$1(shape.length === 2, 'invalid ndarray pixel data, must be 2 or 3D'); + shapeC = 1; + strideC = 1; + } + shapeX = shape[0]; + shapeY = shape[1]; + strideX = stride[0]; + strideY = stride[1]; + image.alignment = 1; + image.width = shapeX; + image.height = shapeY; + image.channels = shapeC; + image.format = image.internalformat = CHANNELS_FORMAT[shapeC]; + image.needsFree = true; + transposeData(image, array, strideX, strideY, strideC, data.offset); + } else if (isCanvasElement(data) || isOffscreenCanvas(data) || isContext2D(data)) { + if (isCanvasElement(data) || isOffscreenCanvas(data)) { + image.element = data; + } else { + image.element = data.canvas; + } + image.width = image.element.width; + image.height = image.element.height; + image.channels = 4; + } else if (isBitmap(data)) { + image.element = data; + image.width = data.width; + image.height = data.height; + image.channels = 4; + } else if (isImageElement(data)) { + image.element = data; + image.width = data.naturalWidth; + image.height = data.naturalHeight; + image.channels = 4; + } else if (isVideoElement(data)) { + image.element = data; + image.width = data.videoWidth; + image.height = data.videoHeight; + image.channels = 4; + } else if (isRectArray(data)) { + var w = image.width || data[0].length; + var h = image.height || data.length; + var c = image.channels; + if (isArrayLike(data[0][0])) { + c = c || data[0][0].length; + } else { + c = c || 1; + } + var arrayShape = flattenUtils.shape(data); + var n = 1; + for (var dd = 0; dd < arrayShape.length; ++dd) { + n *= arrayShape[dd]; + } + var allocData = preConvert(image, n); + flattenUtils.flatten(data, arrayShape, '', allocData); + postConvert(image, allocData); + image.alignment = 1; + image.width = w; + image.height = h; + image.channels = c; + image.format = image.internalformat = CHANNELS_FORMAT[c]; + image.needsFree = true; + } + + if (image.type === GL_FLOAT$4) { + check$1(limits.extensions.indexOf('oes_texture_float') >= 0, + 'oes_texture_float extension not enabled'); + } else if (image.type === GL_HALF_FLOAT_OES$1) { + check$1(limits.extensions.indexOf('oes_texture_half_float') >= 0, + 'oes_texture_half_float extension not enabled'); + } + + // do compressed texture validation here. + } + + function setImage (info, target, miplevel) { + var element = info.element; + var data = info.data; + var internalformat = info.internalformat; + var format = info.format; + var type = info.type; + var width = info.width; + var height = info.height; + + setFlags(info); + + if (element) { + gl.texImage2D(target, miplevel, format, format, type, element); + } else if (info.compressed) { + gl.compressedTexImage2D(target, miplevel, internalformat, width, height, 0, data); + } else if (info.needsCopy) { + reglPoll(); + gl.copyTexImage2D( + target, miplevel, format, info.xOffset, info.yOffset, width, height, 0); + } else { + gl.texImage2D(target, miplevel, format, width, height, 0, format, type, data || null); + } + } + + function setSubImage (info, target, x, y, miplevel) { + var element = info.element; + var data = info.data; + var internalformat = info.internalformat; + var format = info.format; + var type = info.type; + var width = info.width; + var height = info.height; + + setFlags(info); + + if (element) { + gl.texSubImage2D( + target, miplevel, x, y, format, type, element); + } else if (info.compressed) { + gl.compressedTexSubImage2D( + target, miplevel, x, y, internalformat, width, height, data); + } else if (info.needsCopy) { + reglPoll(); + gl.copyTexSubImage2D( + target, miplevel, x, y, info.xOffset, info.yOffset, width, height); + } else { + gl.texSubImage2D( + target, miplevel, x, y, width, height, format, type, data); + } + } + + // texImage pool + var imagePool = []; + + function allocImage () { + return imagePool.pop() || new TexImage() + } + + function freeImage (image) { + if (image.needsFree) { + pool.freeType(image.data); + } + TexImage.call(image); + imagePool.push(image); + } + + // ------------------------------------------------------- + // Mip map + // ------------------------------------------------------- + function MipMap () { + TexFlags.call(this); + + this.genMipmaps = false; + this.mipmapHint = GL_DONT_CARE; + this.mipmask = 0; + this.images = Array(16); + } + + function parseMipMapFromShape (mipmap, width, height) { + var img = mipmap.images[0] = allocImage(); + mipmap.mipmask = 1; + img.width = mipmap.width = width; + img.height = mipmap.height = height; + img.channels = mipmap.channels = 4; + } + + function parseMipMapFromObject (mipmap, options) { + var imgData = null; + if (isPixelData(options)) { + imgData = mipmap.images[0] = allocImage(); + copyFlags(imgData, mipmap); + parseImage(imgData, options); + mipmap.mipmask = 1; + } else { + parseFlags(mipmap, options); + if (Array.isArray(options.mipmap)) { + var mipData = options.mipmap; + for (var i = 0; i < mipData.length; ++i) { + imgData = mipmap.images[i] = allocImage(); + copyFlags(imgData, mipmap); + imgData.width >>= i; + imgData.height >>= i; + parseImage(imgData, mipData[i]); + mipmap.mipmask |= (1 << i); + } + } else { + imgData = mipmap.images[0] = allocImage(); + copyFlags(imgData, mipmap); + parseImage(imgData, options); + mipmap.mipmask = 1; + } + } + copyFlags(mipmap, mipmap.images[0]); + + // For textures of the compressed format WEBGL_compressed_texture_s3tc + // we must have that + // + // "When level equals zero width and height must be a multiple of 4. + // When level is greater than 0 width and height must be 0, 1, 2 or a multiple of 4. " + // + // but we do not yet support having multiple mipmap levels for compressed textures, + // so we only test for level zero. + + if ( + mipmap.compressed && + ( + mipmap.internalformat === GL_COMPRESSED_RGB_S3TC_DXT1_EXT || + mipmap.internalformat === GL_COMPRESSED_RGBA_S3TC_DXT1_EXT || + mipmap.internalformat === GL_COMPRESSED_RGBA_S3TC_DXT3_EXT || + mipmap.internalformat === GL_COMPRESSED_RGBA_S3TC_DXT5_EXT + ) + ) { + check$1(mipmap.width % 4 === 0 && mipmap.height % 4 === 0, + 'for compressed texture formats, mipmap level 0 must have width and height that are a multiple of 4'); + } + } + + function setMipMap (mipmap, target) { + var images = mipmap.images; + for (var i = 0; i < images.length; ++i) { + if (!images[i]) { + return + } + setImage(images[i], target, i); + } + } + + var mipPool = []; + + function allocMipMap () { + var result = mipPool.pop() || new MipMap(); + TexFlags.call(result); + result.mipmask = 0; + for (var i = 0; i < 16; ++i) { + result.images[i] = null; + } + return result + } + + function freeMipMap (mipmap) { + var images = mipmap.images; + for (var i = 0; i < images.length; ++i) { + if (images[i]) { + freeImage(images[i]); + } + images[i] = null; + } + mipPool.push(mipmap); + } + + // ------------------------------------------------------- + // Tex info + // ------------------------------------------------------- + function TexInfo () { + this.minFilter = GL_NEAREST$1; + this.magFilter = GL_NEAREST$1; + + this.wrapS = GL_CLAMP_TO_EDGE$1; + this.wrapT = GL_CLAMP_TO_EDGE$1; + + this.anisotropic = 1; + + this.genMipmaps = false; + this.mipmapHint = GL_DONT_CARE; + } + + function parseTexInfo (info, options) { + if ('min' in options) { + var minFilter = options.min; + check$1.parameter(minFilter, minFilters); + info.minFilter = minFilters[minFilter]; + if (MIPMAP_FILTERS.indexOf(info.minFilter) >= 0 && !('faces' in options)) { + info.genMipmaps = true; + } + } + + if ('mag' in options) { + var magFilter = options.mag; + check$1.parameter(magFilter, magFilters); + info.magFilter = magFilters[magFilter]; + } + + var wrapS = info.wrapS; + var wrapT = info.wrapT; + if ('wrap' in options) { + var wrap = options.wrap; + if (typeof wrap === 'string') { + check$1.parameter(wrap, wrapModes); + wrapS = wrapT = wrapModes[wrap]; + } else if (Array.isArray(wrap)) { + check$1.parameter(wrap[0], wrapModes); + check$1.parameter(wrap[1], wrapModes); + wrapS = wrapModes[wrap[0]]; + wrapT = wrapModes[wrap[1]]; + } + } else { + if ('wrapS' in options) { + var optWrapS = options.wrapS; + check$1.parameter(optWrapS, wrapModes); + wrapS = wrapModes[optWrapS]; + } + if ('wrapT' in options) { + var optWrapT = options.wrapT; + check$1.parameter(optWrapT, wrapModes); + wrapT = wrapModes[optWrapT]; + } + } + info.wrapS = wrapS; + info.wrapT = wrapT; + + if ('anisotropic' in options) { + var anisotropic = options.anisotropic; + check$1(typeof anisotropic === 'number' && + anisotropic >= 1 && anisotropic <= limits.maxAnisotropic, + 'aniso samples must be between 1 and '); + info.anisotropic = options.anisotropic; + } + + if ('mipmap' in options) { + var hasMipMap = false; + switch (typeof options.mipmap) { + case 'string': + check$1.parameter(options.mipmap, mipmapHint, + 'invalid mipmap hint'); + info.mipmapHint = mipmapHint[options.mipmap]; + info.genMipmaps = true; + hasMipMap = true; + break + + case 'boolean': + hasMipMap = info.genMipmaps = options.mipmap; + break + + case 'object': + check$1(Array.isArray(options.mipmap), 'invalid mipmap type'); + info.genMipmaps = false; + hasMipMap = true; + break + + default: + check$1.raise('invalid mipmap type'); + } + if (hasMipMap && !('min' in options)) { + info.minFilter = GL_NEAREST_MIPMAP_NEAREST$1; + } + } + } + + function setTexInfo (info, target) { + gl.texParameteri(target, GL_TEXTURE_MIN_FILTER, info.minFilter); + gl.texParameteri(target, GL_TEXTURE_MAG_FILTER, info.magFilter); + gl.texParameteri(target, GL_TEXTURE_WRAP_S, info.wrapS); + gl.texParameteri(target, GL_TEXTURE_WRAP_T, info.wrapT); + if (extensions.ext_texture_filter_anisotropic) { + gl.texParameteri(target, GL_TEXTURE_MAX_ANISOTROPY_EXT, info.anisotropic); + } + if (info.genMipmaps) { + gl.hint(GL_GENERATE_MIPMAP_HINT, info.mipmapHint); + gl.generateMipmap(target); + } + } + + // ------------------------------------------------------- + // Full texture object + // ------------------------------------------------------- + var textureCount = 0; + var textureSet = {}; + var numTexUnits = limits.maxTextureUnits; + var textureUnits = Array(numTexUnits).map(function () { + return null + }); + + function REGLTexture (target) { + TexFlags.call(this); + this.mipmask = 0; + this.internalformat = GL_RGBA$1; + + this.id = textureCount++; + + this.refCount = 1; + + this.target = target; + this.texture = gl.createTexture(); + + this.unit = -1; + this.bindCount = 0; + + this.texInfo = new TexInfo(); + + if (config.profile) { + this.stats = { size: 0 }; + } + } + + function tempBind (texture) { + gl.activeTexture(GL_TEXTURE0$1); + gl.bindTexture(texture.target, texture.texture); + } + + function tempRestore () { + var prev = textureUnits[0]; + if (prev) { + gl.bindTexture(prev.target, prev.texture); + } else { + gl.bindTexture(GL_TEXTURE_2D$1, null); + } + } + + function destroy (texture) { + var handle = texture.texture; + check$1(handle, 'must not double destroy texture'); + var unit = texture.unit; + var target = texture.target; + if (unit >= 0) { + gl.activeTexture(GL_TEXTURE0$1 + unit); + gl.bindTexture(target, null); + textureUnits[unit] = null; + } + gl.deleteTexture(handle); + texture.texture = null; + texture.params = null; + texture.pixels = null; + texture.refCount = 0; + delete textureSet[texture.id]; + stats.textureCount--; + } + + extend(REGLTexture.prototype, { + bind: function () { + var texture = this; + texture.bindCount += 1; + var unit = texture.unit; + if (unit < 0) { + for (var i = 0; i < numTexUnits; ++i) { + var other = textureUnits[i]; + if (other) { + if (other.bindCount > 0) { + continue + } + other.unit = -1; + } + textureUnits[i] = texture; + unit = i; + break + } + if (unit >= numTexUnits) { + check$1.raise('insufficient number of texture units'); + } + if (config.profile && stats.maxTextureUnits < (unit + 1)) { + stats.maxTextureUnits = unit + 1; // +1, since the units are zero-based + } + texture.unit = unit; + gl.activeTexture(GL_TEXTURE0$1 + unit); + gl.bindTexture(texture.target, texture.texture); + } + return unit + }, + + unbind: function () { + this.bindCount -= 1; + }, + + decRef: function () { + if (--this.refCount <= 0) { + destroy(this); + } + } + }); + + function createTexture2D (a, b) { + var texture = new REGLTexture(GL_TEXTURE_2D$1); + textureSet[texture.id] = texture; + stats.textureCount++; + + function reglTexture2D (a, b) { + var texInfo = texture.texInfo; + TexInfo.call(texInfo); + var mipData = allocMipMap(); + + if (typeof a === 'number') { + if (typeof b === 'number') { + parseMipMapFromShape(mipData, a | 0, b | 0); + } else { + parseMipMapFromShape(mipData, a | 0, a | 0); + } + } else if (a) { + check$1.type(a, 'object', 'invalid arguments to regl.texture'); + parseTexInfo(texInfo, a); + parseMipMapFromObject(mipData, a); + } else { + // empty textures get assigned a default shape of 1x1 + parseMipMapFromShape(mipData, 1, 1); + } + + if (texInfo.genMipmaps) { + mipData.mipmask = (mipData.width << 1) - 1; + } + texture.mipmask = mipData.mipmask; + + copyFlags(texture, mipData); + + check$1.texture2D(texInfo, mipData, limits); + texture.internalformat = mipData.internalformat; + + reglTexture2D.width = mipData.width; + reglTexture2D.height = mipData.height; + + tempBind(texture); + setMipMap(mipData, GL_TEXTURE_2D$1); + setTexInfo(texInfo, GL_TEXTURE_2D$1); + tempRestore(); + + freeMipMap(mipData); + + if (config.profile) { + texture.stats.size = getTextureSize( + texture.internalformat, + texture.type, + mipData.width, + mipData.height, + texInfo.genMipmaps, + false); + } + reglTexture2D.format = textureFormatsInvert[texture.internalformat]; + reglTexture2D.type = textureTypesInvert[texture.type]; + + reglTexture2D.mag = magFiltersInvert[texInfo.magFilter]; + reglTexture2D.min = minFiltersInvert[texInfo.minFilter]; + + reglTexture2D.wrapS = wrapModesInvert[texInfo.wrapS]; + reglTexture2D.wrapT = wrapModesInvert[texInfo.wrapT]; + + return reglTexture2D + } + + function subimage (image, x_, y_, level_) { + check$1(!!image, 'must specify image data'); + + var x = x_ | 0; + var y = y_ | 0; + var level = level_ | 0; + + var imageData = allocImage(); + copyFlags(imageData, texture); + imageData.width = 0; + imageData.height = 0; + parseImage(imageData, image); + imageData.width = imageData.width || ((texture.width >> level) - x); + imageData.height = imageData.height || ((texture.height >> level) - y); + + check$1( + texture.type === imageData.type && + texture.format === imageData.format && + texture.internalformat === imageData.internalformat, + 'incompatible format for texture.subimage'); + check$1( + x >= 0 && y >= 0 && + x + imageData.width <= texture.width && + y + imageData.height <= texture.height, + 'texture.subimage write out of bounds'); + check$1( + texture.mipmask & (1 << level), + 'missing mipmap data'); + check$1( + imageData.data || imageData.element || imageData.needsCopy, + 'missing image data'); + + tempBind(texture); + setSubImage(imageData, GL_TEXTURE_2D$1, x, y, level); + tempRestore(); + + freeImage(imageData); + + return reglTexture2D + } + + function resize (w_, h_) { + var w = w_ | 0; + var h = (h_ | 0) || w; + if (w === texture.width && h === texture.height) { + return reglTexture2D + } + + reglTexture2D.width = texture.width = w; + reglTexture2D.height = texture.height = h; + + tempBind(texture); + + for (var i = 0; texture.mipmask >> i; ++i) { + var _w = w >> i; + var _h = h >> i; + if (!_w || !_h) break + gl.texImage2D( + GL_TEXTURE_2D$1, + i, + texture.format, + _w, + _h, + 0, + texture.format, + texture.type, + null); + } + tempRestore(); + + // also, recompute the texture size. + if (config.profile) { + texture.stats.size = getTextureSize( + texture.internalformat, + texture.type, + w, + h, + false, + false); + } + + return reglTexture2D + } + + reglTexture2D(a, b); + + reglTexture2D.subimage = subimage; + reglTexture2D.resize = resize; + reglTexture2D._reglType = 'texture2d'; + reglTexture2D._texture = texture; + if (config.profile) { + reglTexture2D.stats = texture.stats; + } + reglTexture2D.destroy = function () { + texture.decRef(); + }; + + return reglTexture2D + } + + function createTextureCube (a0, a1, a2, a3, a4, a5) { + var texture = new REGLTexture(GL_TEXTURE_CUBE_MAP$1); + textureSet[texture.id] = texture; + stats.cubeCount++; + + var faces = new Array(6); + + function reglTextureCube (a0, a1, a2, a3, a4, a5) { + var i; + var texInfo = texture.texInfo; + TexInfo.call(texInfo); + for (i = 0; i < 6; ++i) { + faces[i] = allocMipMap(); + } + + if (typeof a0 === 'number' || !a0) { + var s = (a0 | 0) || 1; + for (i = 0; i < 6; ++i) { + parseMipMapFromShape(faces[i], s, s); + } + } else if (typeof a0 === 'object') { + if (a1) { + parseMipMapFromObject(faces[0], a0); + parseMipMapFromObject(faces[1], a1); + parseMipMapFromObject(faces[2], a2); + parseMipMapFromObject(faces[3], a3); + parseMipMapFromObject(faces[4], a4); + parseMipMapFromObject(faces[5], a5); + } else { + parseTexInfo(texInfo, a0); + parseFlags(texture, a0); + if ('faces' in a0) { + var faceInput = a0.faces; + check$1(Array.isArray(faceInput) && faceInput.length === 6, + 'cube faces must be a length 6 array'); + for (i = 0; i < 6; ++i) { + check$1(typeof faceInput[i] === 'object' && !!faceInput[i], + 'invalid input for cube map face'); + copyFlags(faces[i], texture); + parseMipMapFromObject(faces[i], faceInput[i]); + } + } else { + for (i = 0; i < 6; ++i) { + parseMipMapFromObject(faces[i], a0); + } + } + } + } else { + check$1.raise('invalid arguments to cube map'); + } + + copyFlags(texture, faces[0]); + + if (!limits.npotTextureCube) { + check$1(isPow2$1(texture.width) && isPow2$1(texture.height), 'your browser does not support non power or two texture dimensions'); + } + + if (texInfo.genMipmaps) { + texture.mipmask = (faces[0].width << 1) - 1; + } else { + texture.mipmask = faces[0].mipmask; + } + + check$1.textureCube(texture, texInfo, faces, limits); + texture.internalformat = faces[0].internalformat; + + reglTextureCube.width = faces[0].width; + reglTextureCube.height = faces[0].height; + + tempBind(texture); + for (i = 0; i < 6; ++i) { + setMipMap(faces[i], GL_TEXTURE_CUBE_MAP_POSITIVE_X$1 + i); + } + setTexInfo(texInfo, GL_TEXTURE_CUBE_MAP$1); + tempRestore(); + + if (config.profile) { + texture.stats.size = getTextureSize( + texture.internalformat, + texture.type, + reglTextureCube.width, + reglTextureCube.height, + texInfo.genMipmaps, + true); + } + + reglTextureCube.format = textureFormatsInvert[texture.internalformat]; + reglTextureCube.type = textureTypesInvert[texture.type]; + + reglTextureCube.mag = magFiltersInvert[texInfo.magFilter]; + reglTextureCube.min = minFiltersInvert[texInfo.minFilter]; + + reglTextureCube.wrapS = wrapModesInvert[texInfo.wrapS]; + reglTextureCube.wrapT = wrapModesInvert[texInfo.wrapT]; + + for (i = 0; i < 6; ++i) { + freeMipMap(faces[i]); + } + + return reglTextureCube + } + + function subimage (face, image, x_, y_, level_) { + check$1(!!image, 'must specify image data'); + check$1(typeof face === 'number' && face === (face | 0) && + face >= 0 && face < 6, 'invalid face'); + + var x = x_ | 0; + var y = y_ | 0; + var level = level_ | 0; + + var imageData = allocImage(); + copyFlags(imageData, texture); + imageData.width = 0; + imageData.height = 0; + parseImage(imageData, image); + imageData.width = imageData.width || ((texture.width >> level) - x); + imageData.height = imageData.height || ((texture.height >> level) - y); + + check$1( + texture.type === imageData.type && + texture.format === imageData.format && + texture.internalformat === imageData.internalformat, + 'incompatible format for texture.subimage'); + check$1( + x >= 0 && y >= 0 && + x + imageData.width <= texture.width && + y + imageData.height <= texture.height, + 'texture.subimage write out of bounds'); + check$1( + texture.mipmask & (1 << level), + 'missing mipmap data'); + check$1( + imageData.data || imageData.element || imageData.needsCopy, + 'missing image data'); + + tempBind(texture); + setSubImage(imageData, GL_TEXTURE_CUBE_MAP_POSITIVE_X$1 + face, x, y, level); + tempRestore(); + + freeImage(imageData); + + return reglTextureCube + } + + function resize (radius_) { + var radius = radius_ | 0; + if (radius === texture.width) { + return + } + + reglTextureCube.width = texture.width = radius; + reglTextureCube.height = texture.height = radius; + + tempBind(texture); + for (var i = 0; i < 6; ++i) { + for (var j = 0; texture.mipmask >> j; ++j) { + gl.texImage2D( + GL_TEXTURE_CUBE_MAP_POSITIVE_X$1 + i, + j, + texture.format, + radius >> j, + radius >> j, + 0, + texture.format, + texture.type, + null); + } + } + tempRestore(); + + if (config.profile) { + texture.stats.size = getTextureSize( + texture.internalformat, + texture.type, + reglTextureCube.width, + reglTextureCube.height, + false, + true); + } + + return reglTextureCube + } + + reglTextureCube(a0, a1, a2, a3, a4, a5); + + reglTextureCube.subimage = subimage; + reglTextureCube.resize = resize; + reglTextureCube._reglType = 'textureCube'; + reglTextureCube._texture = texture; + if (config.profile) { + reglTextureCube.stats = texture.stats; + } + reglTextureCube.destroy = function () { + texture.decRef(); + }; + + return reglTextureCube + } + + // Called when regl is destroyed + function destroyTextures () { + for (var i = 0; i < numTexUnits; ++i) { + gl.activeTexture(GL_TEXTURE0$1 + i); + gl.bindTexture(GL_TEXTURE_2D$1, null); + textureUnits[i] = null; + } + values(textureSet).forEach(destroy); + + stats.cubeCount = 0; + stats.textureCount = 0; + } + + if (config.profile) { + stats.getTotalTextureSize = function () { + var total = 0; + Object.keys(textureSet).forEach(function (key) { + total += textureSet[key].stats.size; + }); + return total + }; + } + + function restoreTextures () { + for (var i = 0; i < numTexUnits; ++i) { + var tex = textureUnits[i]; + if (tex) { + tex.bindCount = 0; + tex.unit = -1; + textureUnits[i] = null; + } + } + + values(textureSet).forEach(function (texture) { + texture.texture = gl.createTexture(); + gl.bindTexture(texture.target, texture.texture); + for (var i = 0; i < 32; ++i) { + if ((texture.mipmask & (1 << i)) === 0) { + continue + } + if (texture.target === GL_TEXTURE_2D$1) { + gl.texImage2D(GL_TEXTURE_2D$1, + i, + texture.internalformat, + texture.width >> i, + texture.height >> i, + 0, + texture.internalformat, + texture.type, + null); + } else { + for (var j = 0; j < 6; ++j) { + gl.texImage2D(GL_TEXTURE_CUBE_MAP_POSITIVE_X$1 + j, + i, + texture.internalformat, + texture.width >> i, + texture.height >> i, + 0, + texture.internalformat, + texture.type, + null); + } + } + } + setTexInfo(texture.texInfo, texture.target); + }); + } + + function refreshTextures () { + for (var i = 0; i < numTexUnits; ++i) { + var tex = textureUnits[i]; + if (tex) { + tex.bindCount = 0; + tex.unit = -1; + textureUnits[i] = null; + } + gl.activeTexture(GL_TEXTURE0$1 + i); + gl.bindTexture(GL_TEXTURE_2D$1, null); + gl.bindTexture(GL_TEXTURE_CUBE_MAP$1, null); + } + } + + return { + create2D: createTexture2D, + createCube: createTextureCube, + clear: destroyTextures, + getTexture: function (wrapper) { + return null + }, + restore: restoreTextures, + refresh: refreshTextures + } +} + +var GL_RENDERBUFFER = 0x8D41; + +var GL_RGBA4$1 = 0x8056; +var GL_RGB5_A1$1 = 0x8057; +var GL_RGB565$1 = 0x8D62; +var GL_DEPTH_COMPONENT16 = 0x81A5; +var GL_STENCIL_INDEX8 = 0x8D48; +var GL_DEPTH_STENCIL$1 = 0x84F9; + +var GL_SRGB8_ALPHA8_EXT = 0x8C43; + +var GL_RGBA32F_EXT = 0x8814; + +var GL_RGBA16F_EXT = 0x881A; +var GL_RGB16F_EXT = 0x881B; + +var FORMAT_SIZES = []; + +FORMAT_SIZES[GL_RGBA4$1] = 2; +FORMAT_SIZES[GL_RGB5_A1$1] = 2; +FORMAT_SIZES[GL_RGB565$1] = 2; + +FORMAT_SIZES[GL_DEPTH_COMPONENT16] = 2; +FORMAT_SIZES[GL_STENCIL_INDEX8] = 1; +FORMAT_SIZES[GL_DEPTH_STENCIL$1] = 4; + +FORMAT_SIZES[GL_SRGB8_ALPHA8_EXT] = 4; +FORMAT_SIZES[GL_RGBA32F_EXT] = 16; +FORMAT_SIZES[GL_RGBA16F_EXT] = 8; +FORMAT_SIZES[GL_RGB16F_EXT] = 6; + +function getRenderbufferSize (format, width, height) { + return FORMAT_SIZES[format] * width * height +} + +var wrapRenderbuffers = function (gl, extensions, limits, stats, config) { + var formatTypes = { + 'rgba4': GL_RGBA4$1, + 'rgb565': GL_RGB565$1, + 'rgb5 a1': GL_RGB5_A1$1, + 'depth': GL_DEPTH_COMPONENT16, + 'stencil': GL_STENCIL_INDEX8, + 'depth stencil': GL_DEPTH_STENCIL$1 + }; + + if (extensions.ext_srgb) { + formatTypes['srgba'] = GL_SRGB8_ALPHA8_EXT; + } + + if (extensions.ext_color_buffer_half_float) { + formatTypes['rgba16f'] = GL_RGBA16F_EXT; + formatTypes['rgb16f'] = GL_RGB16F_EXT; + } + + if (extensions.webgl_color_buffer_float) { + formatTypes['rgba32f'] = GL_RGBA32F_EXT; + } + + var formatTypesInvert = []; + Object.keys(formatTypes).forEach(function (key) { + var val = formatTypes[key]; + formatTypesInvert[val] = key; + }); + + var renderbufferCount = 0; + var renderbufferSet = {}; + + function REGLRenderbuffer (renderbuffer) { + this.id = renderbufferCount++; + this.refCount = 1; + + this.renderbuffer = renderbuffer; + + this.format = GL_RGBA4$1; + this.width = 0; + this.height = 0; + + if (config.profile) { + this.stats = { size: 0 }; + } + } + + REGLRenderbuffer.prototype.decRef = function () { + if (--this.refCount <= 0) { + destroy(this); + } + }; + + function destroy (rb) { + var handle = rb.renderbuffer; + check$1(handle, 'must not double destroy renderbuffer'); + gl.bindRenderbuffer(GL_RENDERBUFFER, null); + gl.deleteRenderbuffer(handle); + rb.renderbuffer = null; + rb.refCount = 0; + delete renderbufferSet[rb.id]; + stats.renderbufferCount--; + } + + function createRenderbuffer (a, b) { + var renderbuffer = new REGLRenderbuffer(gl.createRenderbuffer()); + renderbufferSet[renderbuffer.id] = renderbuffer; + stats.renderbufferCount++; + + function reglRenderbuffer (a, b) { + var w = 0; + var h = 0; + var format = GL_RGBA4$1; + + if (typeof a === 'object' && a) { + var options = a; + if ('shape' in options) { + var shape = options.shape; + check$1(Array.isArray(shape) && shape.length >= 2, + 'invalid renderbuffer shape'); + w = shape[0] | 0; + h = shape[1] | 0; + } else { + if ('radius' in options) { + w = h = options.radius | 0; + } + if ('width' in options) { + w = options.width | 0; + } + if ('height' in options) { + h = options.height | 0; + } + } + if ('format' in options) { + check$1.parameter(options.format, formatTypes, + 'invalid renderbuffer format'); + format = formatTypes[options.format]; + } + } else if (typeof a === 'number') { + w = a | 0; + if (typeof b === 'number') { + h = b | 0; + } else { + h = w; + } + } else if (!a) { + w = h = 1; + } else { + check$1.raise('invalid arguments to renderbuffer constructor'); + } + + // check shape + check$1( + w > 0 && h > 0 && + w <= limits.maxRenderbufferSize && h <= limits.maxRenderbufferSize, + 'invalid renderbuffer size'); + + if (w === renderbuffer.width && + h === renderbuffer.height && + format === renderbuffer.format) { + return + } + + reglRenderbuffer.width = renderbuffer.width = w; + reglRenderbuffer.height = renderbuffer.height = h; + renderbuffer.format = format; + + gl.bindRenderbuffer(GL_RENDERBUFFER, renderbuffer.renderbuffer); + gl.renderbufferStorage(GL_RENDERBUFFER, format, w, h); + + check$1( + gl.getError() === 0, + 'invalid render buffer format'); + + if (config.profile) { + renderbuffer.stats.size = getRenderbufferSize(renderbuffer.format, renderbuffer.width, renderbuffer.height); + } + reglRenderbuffer.format = formatTypesInvert[renderbuffer.format]; + + return reglRenderbuffer + } + + function resize (w_, h_) { + var w = w_ | 0; + var h = (h_ | 0) || w; + + if (w === renderbuffer.width && h === renderbuffer.height) { + return reglRenderbuffer + } + + // check shape + check$1( + w > 0 && h > 0 && + w <= limits.maxRenderbufferSize && h <= limits.maxRenderbufferSize, + 'invalid renderbuffer size'); + + reglRenderbuffer.width = renderbuffer.width = w; + reglRenderbuffer.height = renderbuffer.height = h; + + gl.bindRenderbuffer(GL_RENDERBUFFER, renderbuffer.renderbuffer); + gl.renderbufferStorage(GL_RENDERBUFFER, renderbuffer.format, w, h); + + check$1( + gl.getError() === 0, + 'invalid render buffer format'); + + // also, recompute size. + if (config.profile) { + renderbuffer.stats.size = getRenderbufferSize( + renderbuffer.format, renderbuffer.width, renderbuffer.height); + } + + return reglRenderbuffer + } + + reglRenderbuffer(a, b); + + reglRenderbuffer.resize = resize; + reglRenderbuffer._reglType = 'renderbuffer'; + reglRenderbuffer._renderbuffer = renderbuffer; + if (config.profile) { + reglRenderbuffer.stats = renderbuffer.stats; + } + reglRenderbuffer.destroy = function () { + renderbuffer.decRef(); + }; + + return reglRenderbuffer + } + + if (config.profile) { + stats.getTotalRenderbufferSize = function () { + var total = 0; + Object.keys(renderbufferSet).forEach(function (key) { + total += renderbufferSet[key].stats.size; + }); + return total + }; + } + + function restoreRenderbuffers () { + values(renderbufferSet).forEach(function (rb) { + rb.renderbuffer = gl.createRenderbuffer(); + gl.bindRenderbuffer(GL_RENDERBUFFER, rb.renderbuffer); + gl.renderbufferStorage(GL_RENDERBUFFER, rb.format, rb.width, rb.height); + }); + gl.bindRenderbuffer(GL_RENDERBUFFER, null); + } + + return { + create: createRenderbuffer, + clear: function () { + values(renderbufferSet).forEach(destroy); + }, + restore: restoreRenderbuffers + } +}; + +// We store these constants so that the minifier can inline them +var GL_FRAMEBUFFER$1 = 0x8D40; +var GL_RENDERBUFFER$1 = 0x8D41; + +var GL_TEXTURE_2D$2 = 0x0DE1; +var GL_TEXTURE_CUBE_MAP_POSITIVE_X$2 = 0x8515; + +var GL_COLOR_ATTACHMENT0$1 = 0x8CE0; +var GL_DEPTH_ATTACHMENT = 0x8D00; +var GL_STENCIL_ATTACHMENT = 0x8D20; +var GL_DEPTH_STENCIL_ATTACHMENT = 0x821A; + +var GL_FRAMEBUFFER_COMPLETE$1 = 0x8CD5; +var GL_FRAMEBUFFER_INCOMPLETE_ATTACHMENT = 0x8CD6; +var GL_FRAMEBUFFER_INCOMPLETE_MISSING_ATTACHMENT = 0x8CD7; +var GL_FRAMEBUFFER_INCOMPLETE_DIMENSIONS = 0x8CD9; +var GL_FRAMEBUFFER_UNSUPPORTED = 0x8CDD; + +var GL_HALF_FLOAT_OES$2 = 0x8D61; +var GL_UNSIGNED_BYTE$6 = 0x1401; +var GL_FLOAT$5 = 0x1406; + +var GL_RGB$1 = 0x1907; +var GL_RGBA$2 = 0x1908; + +var GL_DEPTH_COMPONENT$1 = 0x1902; + +var colorTextureFormatEnums = [ + GL_RGB$1, + GL_RGBA$2 +]; + +// for every texture format, store +// the number of channels +var textureFormatChannels = []; +textureFormatChannels[GL_RGBA$2] = 4; +textureFormatChannels[GL_RGB$1] = 3; + +// for every texture type, store +// the size in bytes. +var textureTypeSizes = []; +textureTypeSizes[GL_UNSIGNED_BYTE$6] = 1; +textureTypeSizes[GL_FLOAT$5] = 4; +textureTypeSizes[GL_HALF_FLOAT_OES$2] = 2; + +var GL_RGBA4$2 = 0x8056; +var GL_RGB5_A1$2 = 0x8057; +var GL_RGB565$2 = 0x8D62; +var GL_DEPTH_COMPONENT16$1 = 0x81A5; +var GL_STENCIL_INDEX8$1 = 0x8D48; +var GL_DEPTH_STENCIL$2 = 0x84F9; + +var GL_SRGB8_ALPHA8_EXT$1 = 0x8C43; + +var GL_RGBA32F_EXT$1 = 0x8814; + +var GL_RGBA16F_EXT$1 = 0x881A; +var GL_RGB16F_EXT$1 = 0x881B; + +var colorRenderbufferFormatEnums = [ + GL_RGBA4$2, + GL_RGB5_A1$2, + GL_RGB565$2, + GL_SRGB8_ALPHA8_EXT$1, + GL_RGBA16F_EXT$1, + GL_RGB16F_EXT$1, + GL_RGBA32F_EXT$1 +]; + +var statusCode = {}; +statusCode[GL_FRAMEBUFFER_COMPLETE$1] = 'complete'; +statusCode[GL_FRAMEBUFFER_INCOMPLETE_ATTACHMENT] = 'incomplete attachment'; +statusCode[GL_FRAMEBUFFER_INCOMPLETE_DIMENSIONS] = 'incomplete dimensions'; +statusCode[GL_FRAMEBUFFER_INCOMPLETE_MISSING_ATTACHMENT] = 'incomplete, missing attachment'; +statusCode[GL_FRAMEBUFFER_UNSUPPORTED] = 'unsupported'; + +function wrapFBOState ( + gl, + extensions, + limits, + textureState, + renderbufferState, + stats) { + var framebufferState = { + cur: null, + next: null, + dirty: false, + setFBO: null + }; + + var colorTextureFormats = ['rgba']; + var colorRenderbufferFormats = ['rgba4', 'rgb565', 'rgb5 a1']; + + if (extensions.ext_srgb) { + colorRenderbufferFormats.push('srgba'); + } + + if (extensions.ext_color_buffer_half_float) { + colorRenderbufferFormats.push('rgba16f', 'rgb16f'); + } + + if (extensions.webgl_color_buffer_float) { + colorRenderbufferFormats.push('rgba32f'); + } + + var colorTypes = ['uint8']; + if (extensions.oes_texture_half_float) { + colorTypes.push('half float', 'float16'); + } + if (extensions.oes_texture_float) { + colorTypes.push('float', 'float32'); + } + + function FramebufferAttachment (target, texture, renderbuffer) { + this.target = target; + this.texture = texture; + this.renderbuffer = renderbuffer; + + var w = 0; + var h = 0; + if (texture) { + w = texture.width; + h = texture.height; + } else if (renderbuffer) { + w = renderbuffer.width; + h = renderbuffer.height; + } + this.width = w; + this.height = h; + } + + function decRef (attachment) { + if (attachment) { + if (attachment.texture) { + attachment.texture._texture.decRef(); + } + if (attachment.renderbuffer) { + attachment.renderbuffer._renderbuffer.decRef(); + } + } + } + + function incRefAndCheckShape (attachment, width, height) { + if (!attachment) { + return + } + if (attachment.texture) { + var texture = attachment.texture._texture; + var tw = Math.max(1, texture.width); + var th = Math.max(1, texture.height); + check$1(tw === width && th === height, + 'inconsistent width/height for supplied texture'); + texture.refCount += 1; + } else { + var renderbuffer = attachment.renderbuffer._renderbuffer; + check$1( + renderbuffer.width === width && renderbuffer.height === height, + 'inconsistent width/height for renderbuffer'); + renderbuffer.refCount += 1; + } + } + + function attach (location, attachment) { + if (attachment) { + if (attachment.texture) { + gl.framebufferTexture2D( + GL_FRAMEBUFFER$1, + location, + attachment.target, + attachment.texture._texture.texture, + 0); + } else { + gl.framebufferRenderbuffer( + GL_FRAMEBUFFER$1, + location, + GL_RENDERBUFFER$1, + attachment.renderbuffer._renderbuffer.renderbuffer); + } + } + } + + function parseAttachment (attachment) { + var target = GL_TEXTURE_2D$2; + var texture = null; + var renderbuffer = null; + + var data = attachment; + if (typeof attachment === 'object') { + data = attachment.data; + if ('target' in attachment) { + target = attachment.target | 0; + } + } + + check$1.type(data, 'function', 'invalid attachment data'); + + var type = data._reglType; + if (type === 'texture2d') { + texture = data; + check$1(target === GL_TEXTURE_2D$2); + } else if (type === 'textureCube') { + texture = data; + check$1( + target >= GL_TEXTURE_CUBE_MAP_POSITIVE_X$2 && + target < GL_TEXTURE_CUBE_MAP_POSITIVE_X$2 + 6, + 'invalid cube map target'); + } else if (type === 'renderbuffer') { + renderbuffer = data; + target = GL_RENDERBUFFER$1; + } else { + check$1.raise('invalid regl object for attachment'); + } + + return new FramebufferAttachment(target, texture, renderbuffer) + } + + function allocAttachment ( + width, + height, + isTexture, + format, + type) { + if (isTexture) { + var texture = textureState.create2D({ + width: width, + height: height, + format: format, + type: type + }); + texture._texture.refCount = 0; + return new FramebufferAttachment(GL_TEXTURE_2D$2, texture, null) + } else { + var rb = renderbufferState.create({ + width: width, + height: height, + format: format + }); + rb._renderbuffer.refCount = 0; + return new FramebufferAttachment(GL_RENDERBUFFER$1, null, rb) + } + } + + function unwrapAttachment (attachment) { + return attachment && (attachment.texture || attachment.renderbuffer) + } + + function resizeAttachment (attachment, w, h) { + if (attachment) { + if (attachment.texture) { + attachment.texture.resize(w, h); + } else if (attachment.renderbuffer) { + attachment.renderbuffer.resize(w, h); + } + attachment.width = w; + attachment.height = h; + } + } + + var framebufferCount = 0; + var framebufferSet = {}; + + function REGLFramebuffer () { + this.id = framebufferCount++; + framebufferSet[this.id] = this; + + this.framebuffer = gl.createFramebuffer(); + this.width = 0; + this.height = 0; + + this.colorAttachments = []; + this.depthAttachment = null; + this.stencilAttachment = null; + this.depthStencilAttachment = null; + } + + function decFBORefs (framebuffer) { + framebuffer.colorAttachments.forEach(decRef); + decRef(framebuffer.depthAttachment); + decRef(framebuffer.stencilAttachment); + decRef(framebuffer.depthStencilAttachment); + } + + function destroy (framebuffer) { + var handle = framebuffer.framebuffer; + check$1(handle, 'must not double destroy framebuffer'); + gl.deleteFramebuffer(handle); + framebuffer.framebuffer = null; + stats.framebufferCount--; + delete framebufferSet[framebuffer.id]; + } + + function updateFramebuffer (framebuffer) { + var i; + + gl.bindFramebuffer(GL_FRAMEBUFFER$1, framebuffer.framebuffer); + var colorAttachments = framebuffer.colorAttachments; + for (i = 0; i < colorAttachments.length; ++i) { + attach(GL_COLOR_ATTACHMENT0$1 + i, colorAttachments[i]); + } + for (i = colorAttachments.length; i < limits.maxColorAttachments; ++i) { + gl.framebufferTexture2D( + GL_FRAMEBUFFER$1, + GL_COLOR_ATTACHMENT0$1 + i, + GL_TEXTURE_2D$2, + null, + 0); + } + + gl.framebufferTexture2D( + GL_FRAMEBUFFER$1, + GL_DEPTH_STENCIL_ATTACHMENT, + GL_TEXTURE_2D$2, + null, + 0); + gl.framebufferTexture2D( + GL_FRAMEBUFFER$1, + GL_DEPTH_ATTACHMENT, + GL_TEXTURE_2D$2, + null, + 0); + gl.framebufferTexture2D( + GL_FRAMEBUFFER$1, + GL_STENCIL_ATTACHMENT, + GL_TEXTURE_2D$2, + null, + 0); + + attach(GL_DEPTH_ATTACHMENT, framebuffer.depthAttachment); + attach(GL_STENCIL_ATTACHMENT, framebuffer.stencilAttachment); + attach(GL_DEPTH_STENCIL_ATTACHMENT, framebuffer.depthStencilAttachment); + + // Check status code + var status = gl.checkFramebufferStatus(GL_FRAMEBUFFER$1); + if (!gl.isContextLost() && status !== GL_FRAMEBUFFER_COMPLETE$1) { + check$1.raise('framebuffer configuration not supported, status = ' + + statusCode[status]); + } + + gl.bindFramebuffer(GL_FRAMEBUFFER$1, framebufferState.next ? framebufferState.next.framebuffer : null); + framebufferState.cur = framebufferState.next; + + // FIXME: Clear error code here. This is a work around for a bug in + // headless-gl + gl.getError(); + } + + function createFBO (a0, a1) { + var framebuffer = new REGLFramebuffer(); + stats.framebufferCount++; + + function reglFramebuffer (a, b) { + var i; + + check$1(framebufferState.next !== framebuffer, + 'can not update framebuffer which is currently in use'); + + var width = 0; + var height = 0; + + var needsDepth = true; + var needsStencil = true; + + var colorBuffer = null; + var colorTexture = true; + var colorFormat = 'rgba'; + var colorType = 'uint8'; + var colorCount = 1; + + var depthBuffer = null; + var stencilBuffer = null; + var depthStencilBuffer = null; + var depthStencilTexture = false; + + if (typeof a === 'number') { + width = a | 0; + height = (b | 0) || width; + } else if (!a) { + width = height = 1; + } else { + check$1.type(a, 'object', 'invalid arguments for framebuffer'); + var options = a; + + if ('shape' in options) { + var shape = options.shape; + check$1(Array.isArray(shape) && shape.length >= 2, + 'invalid shape for framebuffer'); + width = shape[0]; + height = shape[1]; + } else { + if ('radius' in options) { + width = height = options.radius; + } + if ('width' in options) { + width = options.width; + } + if ('height' in options) { + height = options.height; + } + } + + if ('color' in options || + 'colors' in options) { + colorBuffer = + options.color || + options.colors; + if (Array.isArray(colorBuffer)) { + check$1( + colorBuffer.length === 1 || extensions.webgl_draw_buffers, + 'multiple render targets not supported'); + } + } + + if (!colorBuffer) { + if ('colorCount' in options) { + colorCount = options.colorCount | 0; + check$1(colorCount > 0, 'invalid color buffer count'); + } + + if ('colorTexture' in options) { + colorTexture = !!options.colorTexture; + colorFormat = 'rgba4'; + } + + if ('colorType' in options) { + colorType = options.colorType; + if (!colorTexture) { + if (colorType === 'half float' || colorType === 'float16') { + check$1(extensions.ext_color_buffer_half_float, + 'you must enable EXT_color_buffer_half_float to use 16-bit render buffers'); + colorFormat = 'rgba16f'; + } else if (colorType === 'float' || colorType === 'float32') { + check$1(extensions.webgl_color_buffer_float, + 'you must enable WEBGL_color_buffer_float in order to use 32-bit floating point renderbuffers'); + colorFormat = 'rgba32f'; + } + } else { + check$1(extensions.oes_texture_float || + !(colorType === 'float' || colorType === 'float32'), + 'you must enable OES_texture_float in order to use floating point framebuffer objects'); + check$1(extensions.oes_texture_half_float || + !(colorType === 'half float' || colorType === 'float16'), + 'you must enable OES_texture_half_float in order to use 16-bit floating point framebuffer objects'); + } + check$1.oneOf(colorType, colorTypes, 'invalid color type'); + } + + if ('colorFormat' in options) { + colorFormat = options.colorFormat; + if (colorTextureFormats.indexOf(colorFormat) >= 0) { + colorTexture = true; + } else if (colorRenderbufferFormats.indexOf(colorFormat) >= 0) { + colorTexture = false; + } else { + if (colorTexture) { + check$1.oneOf( + options.colorFormat, colorTextureFormats, + 'invalid color format for texture'); + } else { + check$1.oneOf( + options.colorFormat, colorRenderbufferFormats, + 'invalid color format for renderbuffer'); + } + } + } + } + + if ('depthTexture' in options || 'depthStencilTexture' in options) { + depthStencilTexture = !!(options.depthTexture || + options.depthStencilTexture); + check$1(!depthStencilTexture || extensions.webgl_depth_texture, + 'webgl_depth_texture extension not supported'); + } + + if ('depth' in options) { + if (typeof options.depth === 'boolean') { + needsDepth = options.depth; + } else { + depthBuffer = options.depth; + needsStencil = false; + } + } + + if ('stencil' in options) { + if (typeof options.stencil === 'boolean') { + needsStencil = options.stencil; + } else { + stencilBuffer = options.stencil; + needsDepth = false; + } + } + + if ('depthStencil' in options) { + if (typeof options.depthStencil === 'boolean') { + needsDepth = needsStencil = options.depthStencil; + } else { + depthStencilBuffer = options.depthStencil; + needsDepth = false; + needsStencil = false; + } + } + } + + // parse attachments + var colorAttachments = null; + var depthAttachment = null; + var stencilAttachment = null; + var depthStencilAttachment = null; + + // Set up color attachments + if (Array.isArray(colorBuffer)) { + colorAttachments = colorBuffer.map(parseAttachment); + } else if (colorBuffer) { + colorAttachments = [parseAttachment(colorBuffer)]; + } else { + colorAttachments = new Array(colorCount); + for (i = 0; i < colorCount; ++i) { + colorAttachments[i] = allocAttachment( + width, + height, + colorTexture, + colorFormat, + colorType); + } + } + + check$1(extensions.webgl_draw_buffers || colorAttachments.length <= 1, + 'you must enable the WEBGL_draw_buffers extension in order to use multiple color buffers.'); + check$1(colorAttachments.length <= limits.maxColorAttachments, + 'too many color attachments, not supported'); + + width = width || colorAttachments[0].width; + height = height || colorAttachments[0].height; + + if (depthBuffer) { + depthAttachment = parseAttachment(depthBuffer); + } else if (needsDepth && !needsStencil) { + depthAttachment = allocAttachment( + width, + height, + depthStencilTexture, + 'depth', + 'uint32'); + } + + if (stencilBuffer) { + stencilAttachment = parseAttachment(stencilBuffer); + } else if (needsStencil && !needsDepth) { + stencilAttachment = allocAttachment( + width, + height, + false, + 'stencil', + 'uint8'); + } + + if (depthStencilBuffer) { + depthStencilAttachment = parseAttachment(depthStencilBuffer); + } else if (!depthBuffer && !stencilBuffer && needsStencil && needsDepth) { + depthStencilAttachment = allocAttachment( + width, + height, + depthStencilTexture, + 'depth stencil', + 'depth stencil'); + } + + check$1( + (!!depthBuffer) + (!!stencilBuffer) + (!!depthStencilBuffer) <= 1, + 'invalid framebuffer configuration, can specify exactly one depth/stencil attachment'); + + var commonColorAttachmentSize = null; + + for (i = 0; i < colorAttachments.length; ++i) { + incRefAndCheckShape(colorAttachments[i], width, height); + check$1(!colorAttachments[i] || + (colorAttachments[i].texture && + colorTextureFormatEnums.indexOf(colorAttachments[i].texture._texture.format) >= 0) || + (colorAttachments[i].renderbuffer && + colorRenderbufferFormatEnums.indexOf(colorAttachments[i].renderbuffer._renderbuffer.format) >= 0), + 'framebuffer color attachment ' + i + ' is invalid'); + + if (colorAttachments[i] && colorAttachments[i].texture) { + var colorAttachmentSize = + textureFormatChannels[colorAttachments[i].texture._texture.format] * + textureTypeSizes[colorAttachments[i].texture._texture.type]; + + if (commonColorAttachmentSize === null) { + commonColorAttachmentSize = colorAttachmentSize; + } else { + // We need to make sure that all color attachments have the same number of bitplanes + // (that is, the same numer of bits per pixel) + // This is required by the GLES2.0 standard. See the beginning of Chapter 4 in that document. + check$1(commonColorAttachmentSize === colorAttachmentSize, + 'all color attachments much have the same number of bits per pixel.'); + } + } + } + incRefAndCheckShape(depthAttachment, width, height); + check$1(!depthAttachment || + (depthAttachment.texture && + depthAttachment.texture._texture.format === GL_DEPTH_COMPONENT$1) || + (depthAttachment.renderbuffer && + depthAttachment.renderbuffer._renderbuffer.format === GL_DEPTH_COMPONENT16$1), + 'invalid depth attachment for framebuffer object'); + incRefAndCheckShape(stencilAttachment, width, height); + check$1(!stencilAttachment || + (stencilAttachment.renderbuffer && + stencilAttachment.renderbuffer._renderbuffer.format === GL_STENCIL_INDEX8$1), + 'invalid stencil attachment for framebuffer object'); + incRefAndCheckShape(depthStencilAttachment, width, height); + check$1(!depthStencilAttachment || + (depthStencilAttachment.texture && + depthStencilAttachment.texture._texture.format === GL_DEPTH_STENCIL$2) || + (depthStencilAttachment.renderbuffer && + depthStencilAttachment.renderbuffer._renderbuffer.format === GL_DEPTH_STENCIL$2), + 'invalid depth-stencil attachment for framebuffer object'); + + // decrement references + decFBORefs(framebuffer); + + framebuffer.width = width; + framebuffer.height = height; + + framebuffer.colorAttachments = colorAttachments; + framebuffer.depthAttachment = depthAttachment; + framebuffer.stencilAttachment = stencilAttachment; + framebuffer.depthStencilAttachment = depthStencilAttachment; + + reglFramebuffer.color = colorAttachments.map(unwrapAttachment); + reglFramebuffer.depth = unwrapAttachment(depthAttachment); + reglFramebuffer.stencil = unwrapAttachment(stencilAttachment); + reglFramebuffer.depthStencil = unwrapAttachment(depthStencilAttachment); + + reglFramebuffer.width = framebuffer.width; + reglFramebuffer.height = framebuffer.height; + + updateFramebuffer(framebuffer); + + return reglFramebuffer + } + + function resize (w_, h_) { + check$1(framebufferState.next !== framebuffer, + 'can not resize a framebuffer which is currently in use'); + + var w = Math.max(w_ | 0, 1); + var h = Math.max((h_ | 0) || w, 1); + if (w === framebuffer.width && h === framebuffer.height) { + return reglFramebuffer + } + + // resize all buffers + var colorAttachments = framebuffer.colorAttachments; + for (var i = 0; i < colorAttachments.length; ++i) { + resizeAttachment(colorAttachments[i], w, h); + } + resizeAttachment(framebuffer.depthAttachment, w, h); + resizeAttachment(framebuffer.stencilAttachment, w, h); + resizeAttachment(framebuffer.depthStencilAttachment, w, h); + + framebuffer.width = reglFramebuffer.width = w; + framebuffer.height = reglFramebuffer.height = h; + + updateFramebuffer(framebuffer); + + return reglFramebuffer + } + + reglFramebuffer(a0, a1); + + return extend(reglFramebuffer, { + resize: resize, + _reglType: 'framebuffer', + _framebuffer: framebuffer, + destroy: function () { + destroy(framebuffer); + decFBORefs(framebuffer); + }, + use: function (block) { + framebufferState.setFBO({ + framebuffer: reglFramebuffer + }, block); + } + }) + } + + function createCubeFBO (options) { + var faces = Array(6); + + function reglFramebufferCube (a) { + var i; + + check$1(faces.indexOf(framebufferState.next) < 0, + 'can not update framebuffer which is currently in use'); + + var params = { + color: null + }; + + var radius = 0; + + var colorBuffer = null; + var colorFormat = 'rgba'; + var colorType = 'uint8'; + var colorCount = 1; + + if (typeof a === 'number') { + radius = a | 0; + } else if (!a) { + radius = 1; + } else { + check$1.type(a, 'object', 'invalid arguments for framebuffer'); + var options = a; + + if ('shape' in options) { + var shape = options.shape; + check$1( + Array.isArray(shape) && shape.length >= 2, + 'invalid shape for framebuffer'); + check$1( + shape[0] === shape[1], + 'cube framebuffer must be square'); + radius = shape[0]; + } else { + if ('radius' in options) { + radius = options.radius | 0; + } + if ('width' in options) { + radius = options.width | 0; + if ('height' in options) { + check$1(options.height === radius, 'must be square'); + } + } else if ('height' in options) { + radius = options.height | 0; + } + } + + if ('color' in options || + 'colors' in options) { + colorBuffer = + options.color || + options.colors; + if (Array.isArray(colorBuffer)) { + check$1( + colorBuffer.length === 1 || extensions.webgl_draw_buffers, + 'multiple render targets not supported'); + } + } + + if (!colorBuffer) { + if ('colorCount' in options) { + colorCount = options.colorCount | 0; + check$1(colorCount > 0, 'invalid color buffer count'); + } + + if ('colorType' in options) { + check$1.oneOf( + options.colorType, colorTypes, + 'invalid color type'); + colorType = options.colorType; + } + + if ('colorFormat' in options) { + colorFormat = options.colorFormat; + check$1.oneOf( + options.colorFormat, colorTextureFormats, + 'invalid color format for texture'); + } + } + + if ('depth' in options) { + params.depth = options.depth; + } + + if ('stencil' in options) { + params.stencil = options.stencil; + } + + if ('depthStencil' in options) { + params.depthStencil = options.depthStencil; + } + } + + var colorCubes; + if (colorBuffer) { + if (Array.isArray(colorBuffer)) { + colorCubes = []; + for (i = 0; i < colorBuffer.length; ++i) { + colorCubes[i] = colorBuffer[i]; + } + } else { + colorCubes = [ colorBuffer ]; + } + } else { + colorCubes = Array(colorCount); + var cubeMapParams = { + radius: radius, + format: colorFormat, + type: colorType + }; + for (i = 0; i < colorCount; ++i) { + colorCubes[i] = textureState.createCube(cubeMapParams); + } + } + + // Check color cubes + params.color = Array(colorCubes.length); + for (i = 0; i < colorCubes.length; ++i) { + var cube = colorCubes[i]; + check$1( + typeof cube === 'function' && cube._reglType === 'textureCube', + 'invalid cube map'); + radius = radius || cube.width; + check$1( + cube.width === radius && cube.height === radius, + 'invalid cube map shape'); + params.color[i] = { + target: GL_TEXTURE_CUBE_MAP_POSITIVE_X$2, + data: colorCubes[i] + }; + } + + for (i = 0; i < 6; ++i) { + for (var j = 0; j < colorCubes.length; ++j) { + params.color[j].target = GL_TEXTURE_CUBE_MAP_POSITIVE_X$2 + i; + } + // reuse depth-stencil attachments across all cube maps + if (i > 0) { + params.depth = faces[0].depth; + params.stencil = faces[0].stencil; + params.depthStencil = faces[0].depthStencil; + } + if (faces[i]) { + (faces[i])(params); + } else { + faces[i] = createFBO(params); + } + } + + return extend(reglFramebufferCube, { + width: radius, + height: radius, + color: colorCubes + }) + } + + function resize (radius_) { + var i; + var radius = radius_ | 0; + check$1(radius > 0 && radius <= limits.maxCubeMapSize, + 'invalid radius for cube fbo'); + + if (radius === reglFramebufferCube.width) { + return reglFramebufferCube + } + + var colors = reglFramebufferCube.color; + for (i = 0; i < colors.length; ++i) { + colors[i].resize(radius); + } + + for (i = 0; i < 6; ++i) { + faces[i].resize(radius); + } + + reglFramebufferCube.width = reglFramebufferCube.height = radius; + + return reglFramebufferCube + } + + reglFramebufferCube(options); + + return extend(reglFramebufferCube, { + faces: faces, + resize: resize, + _reglType: 'framebufferCube', + destroy: function () { + faces.forEach(function (f) { + f.destroy(); + }); + } + }) + } + + function restoreFramebuffers () { + framebufferState.cur = null; + framebufferState.next = null; + framebufferState.dirty = true; + values(framebufferSet).forEach(function (fb) { + fb.framebuffer = gl.createFramebuffer(); + updateFramebuffer(fb); + }); + } + + return extend(framebufferState, { + getFramebuffer: function (object) { + if (typeof object === 'function' && object._reglType === 'framebuffer') { + var fbo = object._framebuffer; + if (fbo instanceof REGLFramebuffer) { + return fbo + } + } + return null + }, + create: createFBO, + createCube: createCubeFBO, + clear: function () { + values(framebufferSet).forEach(destroy); + }, + restore: restoreFramebuffers + }) +} + +var GL_FLOAT$6 = 5126; +var GL_ARRAY_BUFFER$1 = 34962; + +function AttributeRecord () { + this.state = 0; + + this.x = 0.0; + this.y = 0.0; + this.z = 0.0; + this.w = 0.0; + + this.buffer = null; + this.size = 0; + this.normalized = false; + this.type = GL_FLOAT$6; + this.offset = 0; + this.stride = 0; + this.divisor = 0; +} + +function wrapAttributeState ( + gl, + extensions, + limits, + stats, + bufferState) { + var NUM_ATTRIBUTES = limits.maxAttributes; + var attributeBindings = new Array(NUM_ATTRIBUTES); + for (var i = 0; i < NUM_ATTRIBUTES; ++i) { + attributeBindings[i] = new AttributeRecord(); + } + var vaoCount = 0; + var vaoSet = {}; + + var state = { + Record: AttributeRecord, + scope: {}, + state: attributeBindings, + currentVAO: null, + targetVAO: null, + restore: extVAO() ? restoreVAO : function () {}, + createVAO: createVAO, + getVAO: getVAO, + destroyBuffer: destroyBuffer, + setVAO: extVAO() ? setVAOEXT : setVAOEmulated, + clear: extVAO() ? destroyVAOEXT : function () {} + }; + + function destroyBuffer (buffer) { + for (var i = 0; i < attributeBindings.length; ++i) { + var record = attributeBindings[i]; + if (record.buffer === buffer) { + gl.disableVertexAttribArray(i); + record.buffer = null; + } + } + } + + function extVAO () { + return extensions.oes_vertex_array_object + } + + function extInstanced () { + return extensions.angle_instanced_arrays + } + + function getVAO (vao) { + if (typeof vao === 'function' && vao._vao) { + return vao._vao + } + return null + } + + function setVAOEXT (vao) { + if (vao === state.currentVAO) { + return + } + var ext = extVAO(); + if (vao) { + ext.bindVertexArrayOES(vao.vao); + } else { + ext.bindVertexArrayOES(null); + } + state.currentVAO = vao; + } + + function setVAOEmulated (vao) { + if (vao === state.currentVAO) { + return + } + if (vao) { + vao.bindAttrs(); + } else { + var exti = extInstanced(); + for (var i = 0; i < attributeBindings.length; ++i) { + var binding = attributeBindings[i]; + if (binding.buffer) { + gl.enableVertexAttribArray(i); + gl.vertexAttribPointer(i, binding.size, binding.type, binding.normalized, binding.stride, binding.offfset); + if (exti && binding.divisor) { + exti.vertexAttribDivisorANGLE(i, binding.divisor); + } + } else { + gl.disableVertexAttribArray(i); + gl.vertexAttrib4f(i, binding.x, binding.y, binding.z, binding.w); + } + } + } + state.currentVAO = vao; + } + + function destroyVAOEXT () { + values(vaoSet).forEach(function (vao) { + vao.destroy(); + }); + } + + function REGLVAO () { + this.id = ++vaoCount; + this.attributes = []; + var extension = extVAO(); + if (extension) { + this.vao = extension.createVertexArrayOES(); + } else { + this.vao = null; + } + vaoSet[this.id] = this; + this.buffers = []; + } + + REGLVAO.prototype.bindAttrs = function () { + var exti = extInstanced(); + var attributes = this.attributes; + for (var i = 0; i < attributes.length; ++i) { + var attr = attributes[i]; + if (attr.buffer) { + gl.enableVertexAttribArray(i); + gl.bindBuffer(GL_ARRAY_BUFFER$1, attr.buffer.buffer); + gl.vertexAttribPointer(i, attr.size, attr.type, attr.normalized, attr.stride, attr.offset); + if (exti && attr.divisor) { + exti.vertexAttribDivisorANGLE(i, attr.divisor); + } + } else { + gl.disableVertexAttribArray(i); + gl.vertexAttrib4f(i, attr.x, attr.y, attr.z, attr.w); + } + } + for (var j = attributes.length; j < NUM_ATTRIBUTES; ++j) { + gl.disableVertexAttribArray(j); + } + }; + + REGLVAO.prototype.refresh = function () { + var ext = extVAO(); + if (ext) { + ext.bindVertexArrayOES(this.vao); + this.bindAttrs(); + state.currentVAO = this; + } + }; + + REGLVAO.prototype.destroy = function () { + if (this.vao) { + var extension = extVAO(); + if (this === state.currentVAO) { + state.currentVAO = null; + extension.bindVertexArrayOES(null); + } + extension.deleteVertexArrayOES(this.vao); + this.vao = null; + } + if (vaoSet[this.id]) { + delete vaoSet[this.id]; + stats.vaoCount -= 1; + } + }; + + function restoreVAO () { + var ext = extVAO(); + if (ext) { + values(vaoSet).forEach(function (vao) { + vao.refresh(); + }); + } + } + + function createVAO (_attr) { + var vao = new REGLVAO(); + stats.vaoCount += 1; + + function updateVAO (attributes) { + check$1(Array.isArray(attributes), 'arguments to vertex array constructor must be an array'); + check$1(attributes.length < NUM_ATTRIBUTES, 'too many attributes'); + check$1(attributes.length > 0, 'must specify at least one attribute'); + + var bufUpdated = {}; + var nattributes = vao.attributes; + nattributes.length = attributes.length; + for (var i = 0; i < attributes.length; ++i) { + var spec = attributes[i]; + var rec = nattributes[i] = new AttributeRecord(); + var data = spec.data || spec; + if (Array.isArray(data) || isTypedArray(data) || isNDArrayLike(data)) { + var buf; + if (vao.buffers[i]) { + buf = vao.buffers[i]; + if (isTypedArray(data) && buf._buffer.byteLength >= data.byteLength) { + buf.subdata(data); + } else { + buf.destroy(); + vao.buffers[i] = null; + } + } + if (!vao.buffers[i]) { + buf = vao.buffers[i] = bufferState.create(spec, GL_ARRAY_BUFFER$1, false, true); + } + rec.buffer = bufferState.getBuffer(buf); + rec.size = rec.buffer.dimension | 0; + rec.normalized = false; + rec.type = rec.buffer.dtype; + rec.offset = 0; + rec.stride = 0; + rec.divisor = 0; + rec.state = 1; + bufUpdated[i] = 1; + } else if (bufferState.getBuffer(spec)) { + rec.buffer = bufferState.getBuffer(spec); + rec.size = rec.buffer.dimension | 0; + rec.normalized = false; + rec.type = rec.buffer.dtype; + rec.offset = 0; + rec.stride = 0; + rec.divisor = 0; + rec.state = 1; + } else if (bufferState.getBuffer(spec.buffer)) { + rec.buffer = bufferState.getBuffer(spec.buffer); + rec.size = ((+spec.size) || rec.buffer.dimension) | 0; + rec.normalized = !!spec.normalized || false; + if ('type' in spec) { + check$1.parameter(spec.type, glTypes, 'invalid buffer type'); + rec.type = glTypes[spec.type]; + } else { + rec.type = rec.buffer.dtype; + } + rec.offset = (spec.offset || 0) | 0; + rec.stride = (spec.stride || 0) | 0; + rec.divisor = (spec.divisor || 0) | 0; + rec.state = 1; + + check$1(rec.size >= 1 && rec.size <= 4, 'size must be between 1 and 4'); + check$1(rec.offset >= 0, 'invalid offset'); + check$1(rec.stride >= 0 && rec.stride <= 255, 'stride must be between 0 and 255'); + check$1(rec.divisor >= 0, 'divisor must be positive'); + check$1(!rec.divisor || !!extensions.angle_instanced_arrays, 'ANGLE_instanced_arrays must be enabled to use divisor'); + } else if ('x' in spec) { + check$1(i > 0, 'first attribute must not be a constant'); + rec.x = +spec.x || 0; + rec.y = +spec.y || 0; + rec.z = +spec.z || 0; + rec.w = +spec.w || 0; + rec.state = 2; + } else { + check$1(false, 'invalid attribute spec for location ' + i); + } + } + + // retire unused buffers + for (var j = 0; j < vao.buffers.length; ++j) { + if (!bufUpdated[j] && vao.buffers[j]) { + vao.buffers[j].destroy(); + vao.buffers[j] = null; + } + } + + vao.refresh(); + return updateVAO + } + + updateVAO.destroy = function () { + for (var j = 0; j < vao.buffers.length; ++j) { + if (vao.buffers[j]) { + vao.buffers[j].destroy(); + } + } + vao.buffers.length = 0; + vao.destroy(); + }; + + updateVAO._vao = vao; + updateVAO._reglType = 'vao'; + + return updateVAO(_attr) + } + + return state +} + +var GL_FRAGMENT_SHADER = 35632; +var GL_VERTEX_SHADER = 35633; + +var GL_ACTIVE_UNIFORMS = 0x8B86; +var GL_ACTIVE_ATTRIBUTES = 0x8B89; + +function wrapShaderState (gl, stringStore, stats, config) { + // =================================================== + // glsl compilation and linking + // =================================================== + var fragShaders = {}; + var vertShaders = {}; + + function ActiveInfo (name, id, location, info) { + this.name = name; + this.id = id; + this.location = location; + this.info = info; + } + + function insertActiveInfo (list, info) { + for (var i = 0; i < list.length; ++i) { + if (list[i].id === info.id) { + list[i].location = info.location; + return + } + } + list.push(info); + } + + function getShader (type, id, command) { + var cache = type === GL_FRAGMENT_SHADER ? fragShaders : vertShaders; + var shader = cache[id]; + + if (!shader) { + var source = stringStore.str(id); + shader = gl.createShader(type); + gl.shaderSource(shader, source); + gl.compileShader(shader); + check$1.shaderError(gl, shader, source, type, command); + cache[id] = shader; + } + + return shader + } + + // =================================================== + // program linking + // =================================================== + var programCache = {}; + var programList = []; + + var PROGRAM_COUNTER = 0; + + function REGLProgram (fragId, vertId) { + this.id = PROGRAM_COUNTER++; + this.fragId = fragId; + this.vertId = vertId; + this.program = null; + this.uniforms = []; + this.attributes = []; + this.refCount = 1; + + if (config.profile) { + this.stats = { + uniformsCount: 0, + attributesCount: 0 + }; + } + } + + function linkProgram (desc, command, attributeLocations) { + var i, info; + + // ------------------------------- + // compile & link + // ------------------------------- + var fragShader = getShader(GL_FRAGMENT_SHADER, desc.fragId); + var vertShader = getShader(GL_VERTEX_SHADER, desc.vertId); + + var program = desc.program = gl.createProgram(); + gl.attachShader(program, fragShader); + gl.attachShader(program, vertShader); + if (attributeLocations) { + for (i = 0; i < attributeLocations.length; ++i) { + var binding = attributeLocations[i]; + gl.bindAttribLocation(program, binding[0], binding[1]); + } + } + + gl.linkProgram(program); + check$1.linkError( + gl, + program, + stringStore.str(desc.fragId), + stringStore.str(desc.vertId), + command); + + // ------------------------------- + // grab uniforms + // ------------------------------- + var numUniforms = gl.getProgramParameter(program, GL_ACTIVE_UNIFORMS); + if (config.profile) { + desc.stats.uniformsCount = numUniforms; + } + var uniforms = desc.uniforms; + for (i = 0; i < numUniforms; ++i) { + info = gl.getActiveUniform(program, i); + if (info) { + if (info.size > 1) { + for (var j = 0; j < info.size; ++j) { + var name = info.name.replace('[0]', '[' + j + ']'); + insertActiveInfo(uniforms, new ActiveInfo( + name, + stringStore.id(name), + gl.getUniformLocation(program, name), + info)); + } + } else { + insertActiveInfo(uniforms, new ActiveInfo( + info.name, + stringStore.id(info.name), + gl.getUniformLocation(program, info.name), + info)); + } + } + } + + // ------------------------------- + // grab attributes + // ------------------------------- + var numAttributes = gl.getProgramParameter(program, GL_ACTIVE_ATTRIBUTES); + if (config.profile) { + desc.stats.attributesCount = numAttributes; + } + + var attributes = desc.attributes; + for (i = 0; i < numAttributes; ++i) { + info = gl.getActiveAttrib(program, i); + if (info) { + insertActiveInfo(attributes, new ActiveInfo( + info.name, + stringStore.id(info.name), + gl.getAttribLocation(program, info.name), + info)); + } + } + } + + if (config.profile) { + stats.getMaxUniformsCount = function () { + var m = 0; + programList.forEach(function (desc) { + if (desc.stats.uniformsCount > m) { + m = desc.stats.uniformsCount; + } + }); + return m + }; + + stats.getMaxAttributesCount = function () { + var m = 0; + programList.forEach(function (desc) { + if (desc.stats.attributesCount > m) { + m = desc.stats.attributesCount; + } + }); + return m + }; + } + + function restoreShaders () { + fragShaders = {}; + vertShaders = {}; + for (var i = 0; i < programList.length; ++i) { + linkProgram(programList[i], null, programList[i].attributes.map(function (info) { + return [info.location, info.name] + })); + } + } + + return { + clear: function () { + var deleteShader = gl.deleteShader.bind(gl); + values(fragShaders).forEach(deleteShader); + fragShaders = {}; + values(vertShaders).forEach(deleteShader); + vertShaders = {}; + + programList.forEach(function (desc) { + gl.deleteProgram(desc.program); + }); + programList.length = 0; + programCache = {}; + + stats.shaderCount = 0; + }, + + program: function (vertId, fragId, command, attribLocations) { + check$1.command(vertId >= 0, 'missing vertex shader', command); + check$1.command(fragId >= 0, 'missing fragment shader', command); + + var cache = programCache[fragId]; + if (!cache) { + cache = programCache[fragId] = {}; + } + var prevProgram = cache[vertId]; + if (prevProgram) { + prevProgram.refCount++; + if (!attribLocations) { + return prevProgram + } + } + var program = new REGLProgram(fragId, vertId); + stats.shaderCount++; + linkProgram(program, command, attribLocations); + if (!prevProgram) { + cache[vertId] = program; + } + programList.push(program); + return extend(program, { + destroy: function () { + program.refCount--; + if (program.refCount <= 0) { + gl.deleteProgram(program.program); + var idx = programList.indexOf(program); + programList.splice(idx, 1); + stats.shaderCount--; + } + // no program is linked to this vert anymore + if (cache[program.vertId].refCount <= 0) { + gl.deleteShader(vertShaders[program.vertId]); + delete vertShaders[program.vertId]; + delete programCache[program.fragId][program.vertId]; + } + // no program is linked to this frag anymore + if (!Object.keys(programCache[program.fragId]).length) { + gl.deleteShader(fragShaders[program.fragId]); + delete fragShaders[program.fragId]; + delete programCache[program.fragId]; + } + } + }) + }, + + restore: restoreShaders, + + shader: getShader, + + frag: -1, + vert: -1 + } +} + +var GL_RGBA$3 = 6408; +var GL_UNSIGNED_BYTE$7 = 5121; +var GL_PACK_ALIGNMENT = 0x0D05; +var GL_FLOAT$7 = 0x1406; // 5126 + +function wrapReadPixels ( + gl, + framebufferState, + reglPoll, + context, + glAttributes, + extensions, + limits) { + function readPixelsImpl (input) { + var type; + if (framebufferState.next === null) { + check$1( + glAttributes.preserveDrawingBuffer, + 'you must create a webgl context with "preserveDrawingBuffer":true in order to read pixels from the drawing buffer'); + type = GL_UNSIGNED_BYTE$7; + } else { + check$1( + framebufferState.next.colorAttachments[0].texture !== null, + 'You cannot read from a renderbuffer'); + type = framebufferState.next.colorAttachments[0].texture._texture.type; + + if (extensions.oes_texture_float) { + check$1( + type === GL_UNSIGNED_BYTE$7 || type === GL_FLOAT$7, + 'Reading from a framebuffer is only allowed for the types \'uint8\' and \'float\''); + + if (type === GL_FLOAT$7) { + check$1(limits.readFloat, 'Reading \'float\' values is not permitted in your browser. For a fallback, please see: https://www.npmjs.com/package/glsl-read-float'); + } + } else { + check$1( + type === GL_UNSIGNED_BYTE$7, + 'Reading from a framebuffer is only allowed for the type \'uint8\''); + } + } + + var x = 0; + var y = 0; + var width = context.framebufferWidth; + var height = context.framebufferHeight; + var data = null; + + if (isTypedArray(input)) { + data = input; + } else if (input) { + check$1.type(input, 'object', 'invalid arguments to regl.read()'); + x = input.x | 0; + y = input.y | 0; + check$1( + x >= 0 && x < context.framebufferWidth, + 'invalid x offset for regl.read'); + check$1( + y >= 0 && y < context.framebufferHeight, + 'invalid y offset for regl.read'); + width = (input.width || (context.framebufferWidth - x)) | 0; + height = (input.height || (context.framebufferHeight - y)) | 0; + data = input.data || null; + } + + // sanity check input.data + if (data) { + if (type === GL_UNSIGNED_BYTE$7) { + check$1( + data instanceof Uint8Array, + 'buffer must be \'Uint8Array\' when reading from a framebuffer of type \'uint8\''); + } else if (type === GL_FLOAT$7) { + check$1( + data instanceof Float32Array, + 'buffer must be \'Float32Array\' when reading from a framebuffer of type \'float\''); + } + } + + check$1( + width > 0 && width + x <= context.framebufferWidth, + 'invalid width for read pixels'); + check$1( + height > 0 && height + y <= context.framebufferHeight, + 'invalid height for read pixels'); + + // Update WebGL state + reglPoll(); + + // Compute size + var size = width * height * 4; + + // Allocate data + if (!data) { + if (type === GL_UNSIGNED_BYTE$7) { + data = new Uint8Array(size); + } else if (type === GL_FLOAT$7) { + data = data || new Float32Array(size); + } + } + + // Type check + check$1.isTypedArray(data, 'data buffer for regl.read() must be a typedarray'); + check$1(data.byteLength >= size, 'data buffer for regl.read() too small'); + + // Run read pixels + gl.pixelStorei(GL_PACK_ALIGNMENT, 4); + gl.readPixels(x, y, width, height, GL_RGBA$3, + type, + data); + + return data + } + + function readPixelsFBO (options) { + var result; + framebufferState.setFBO({ + framebuffer: options.framebuffer + }, function () { + result = readPixelsImpl(options); + }); + return result + } + + function readPixels (options) { + if (!options || !('framebuffer' in options)) { + return readPixelsImpl(options) + } else { + return readPixelsFBO(options) + } + } + + return readPixels +} + +function slice (x) { + return Array.prototype.slice.call(x) +} + +function join (x) { + return slice(x).join('') +} + +function createEnvironment () { + // Unique variable id counter + var varCounter = 0; + + // Linked values are passed from this scope into the generated code block + // Calling link() passes a value into the generated scope and returns + // the variable name which it is bound to + var linkedNames = []; + var linkedValues = []; + function link (value) { + for (var i = 0; i < linkedValues.length; ++i) { + if (linkedValues[i] === value) { + return linkedNames[i] + } + } + + var name = 'g' + (varCounter++); + linkedNames.push(name); + linkedValues.push(value); + return name + } + + // create a code block + function block () { + var code = []; + function push () { + code.push.apply(code, slice(arguments)); + } + + var vars = []; + function def () { + var name = 'v' + (varCounter++); + vars.push(name); + + if (arguments.length > 0) { + code.push(name, '='); + code.push.apply(code, slice(arguments)); + code.push(';'); + } + + return name + } + + return extend(push, { + def: def, + toString: function () { + return join([ + (vars.length > 0 ? 'var ' + vars.join(',') + ';' : ''), + join(code) + ]) + } + }) + } + + function scope () { + var entry = block(); + var exit = block(); + + var entryToString = entry.toString; + var exitToString = exit.toString; + + function save (object, prop) { + exit(object, prop, '=', entry.def(object, prop), ';'); + } + + return extend(function () { + entry.apply(entry, slice(arguments)); + }, { + def: entry.def, + entry: entry, + exit: exit, + save: save, + set: function (object, prop, value) { + save(object, prop); + entry(object, prop, '=', value, ';'); + }, + toString: function () { + return entryToString() + exitToString() + } + }) + } + + function conditional () { + var pred = join(arguments); + var thenBlock = scope(); + var elseBlock = scope(); + + var thenToString = thenBlock.toString; + var elseToString = elseBlock.toString; + + return extend(thenBlock, { + then: function () { + thenBlock.apply(thenBlock, slice(arguments)); + return this + }, + else: function () { + elseBlock.apply(elseBlock, slice(arguments)); + return this + }, + toString: function () { + var elseClause = elseToString(); + if (elseClause) { + elseClause = 'else{' + elseClause + '}'; + } + return join([ + 'if(', pred, '){', + thenToString(), + '}', elseClause + ]) + } + }) + } + + // procedure list + var globalBlock = block(); + var procedures = {}; + function proc (name, count) { + var args = []; + function arg () { + var name = 'a' + args.length; + args.push(name); + return name + } + + count = count || 0; + for (var i = 0; i < count; ++i) { + arg(); + } + + var body = scope(); + var bodyToString = body.toString; + + var result = procedures[name] = extend(body, { + arg: arg, + toString: function () { + return join([ + 'function(', args.join(), '){', + bodyToString(), + '}' + ]) + } + }); + + return result + } + + function compile () { + var code = ['"use strict";', + globalBlock, + 'return {']; + Object.keys(procedures).forEach(function (name) { + code.push('"', name, '":', procedures[name].toString(), ','); + }); + code.push('}'); + var src = join(code) + .replace(/;/g, ';\n') + .replace(/}/g, '}\n') + .replace(/{/g, '{\n'); + var proc = Function.apply(null, linkedNames.concat(src)); + return proc.apply(null, linkedValues) + } + + return { + global: globalBlock, + link: link, + block: block, + proc: proc, + scope: scope, + cond: conditional, + compile: compile + } +} + +// "cute" names for vector components +var CUTE_COMPONENTS = 'xyzw'.split(''); + +var GL_UNSIGNED_BYTE$8 = 5121; + +var ATTRIB_STATE_POINTER = 1; +var ATTRIB_STATE_CONSTANT = 2; + +var DYN_FUNC$1 = 0; +var DYN_PROP$1 = 1; +var DYN_CONTEXT$1 = 2; +var DYN_STATE$1 = 3; +var DYN_THUNK = 4; +var DYN_CONSTANT$1 = 5; +var DYN_ARRAY$1 = 6; + +var S_DITHER = 'dither'; +var S_BLEND_ENABLE = 'blend.enable'; +var S_BLEND_COLOR = 'blend.color'; +var S_BLEND_EQUATION = 'blend.equation'; +var S_BLEND_FUNC = 'blend.func'; +var S_DEPTH_ENABLE = 'depth.enable'; +var S_DEPTH_FUNC = 'depth.func'; +var S_DEPTH_RANGE = 'depth.range'; +var S_DEPTH_MASK = 'depth.mask'; +var S_COLOR_MASK = 'colorMask'; +var S_CULL_ENABLE = 'cull.enable'; +var S_CULL_FACE = 'cull.face'; +var S_FRONT_FACE = 'frontFace'; +var S_LINE_WIDTH = 'lineWidth'; +var S_POLYGON_OFFSET_ENABLE = 'polygonOffset.enable'; +var S_POLYGON_OFFSET_OFFSET = 'polygonOffset.offset'; +var S_SAMPLE_ALPHA = 'sample.alpha'; +var S_SAMPLE_ENABLE = 'sample.enable'; +var S_SAMPLE_COVERAGE = 'sample.coverage'; +var S_STENCIL_ENABLE = 'stencil.enable'; +var S_STENCIL_MASK = 'stencil.mask'; +var S_STENCIL_FUNC = 'stencil.func'; +var S_STENCIL_OPFRONT = 'stencil.opFront'; +var S_STENCIL_OPBACK = 'stencil.opBack'; +var S_SCISSOR_ENABLE = 'scissor.enable'; +var S_SCISSOR_BOX = 'scissor.box'; +var S_VIEWPORT = 'viewport'; + +var S_PROFILE = 'profile'; + +var S_FRAMEBUFFER = 'framebuffer'; +var S_VERT = 'vert'; +var S_FRAG = 'frag'; +var S_ELEMENTS = 'elements'; +var S_PRIMITIVE = 'primitive'; +var S_COUNT = 'count'; +var S_OFFSET = 'offset'; +var S_INSTANCES = 'instances'; +var S_VAO = 'vao'; + +var SUFFIX_WIDTH = 'Width'; +var SUFFIX_HEIGHT = 'Height'; + +var S_FRAMEBUFFER_WIDTH = S_FRAMEBUFFER + SUFFIX_WIDTH; +var S_FRAMEBUFFER_HEIGHT = S_FRAMEBUFFER + SUFFIX_HEIGHT; +var S_VIEWPORT_WIDTH = S_VIEWPORT + SUFFIX_WIDTH; +var S_VIEWPORT_HEIGHT = S_VIEWPORT + SUFFIX_HEIGHT; +var S_DRAWINGBUFFER = 'drawingBuffer'; +var S_DRAWINGBUFFER_WIDTH = S_DRAWINGBUFFER + SUFFIX_WIDTH; +var S_DRAWINGBUFFER_HEIGHT = S_DRAWINGBUFFER + SUFFIX_HEIGHT; + +var NESTED_OPTIONS = [ + S_BLEND_FUNC, + S_BLEND_EQUATION, + S_STENCIL_FUNC, + S_STENCIL_OPFRONT, + S_STENCIL_OPBACK, + S_SAMPLE_COVERAGE, + S_VIEWPORT, + S_SCISSOR_BOX, + S_POLYGON_OFFSET_OFFSET +]; + +var GL_ARRAY_BUFFER$2 = 34962; +var GL_ELEMENT_ARRAY_BUFFER$1 = 34963; + +var GL_FRAGMENT_SHADER$1 = 35632; +var GL_VERTEX_SHADER$1 = 35633; + +var GL_TEXTURE_2D$3 = 0x0DE1; +var GL_TEXTURE_CUBE_MAP$2 = 0x8513; + +var GL_CULL_FACE = 0x0B44; +var GL_BLEND = 0x0BE2; +var GL_DITHER = 0x0BD0; +var GL_STENCIL_TEST = 0x0B90; +var GL_DEPTH_TEST = 0x0B71; +var GL_SCISSOR_TEST = 0x0C11; +var GL_POLYGON_OFFSET_FILL = 0x8037; +var GL_SAMPLE_ALPHA_TO_COVERAGE = 0x809E; +var GL_SAMPLE_COVERAGE = 0x80A0; + +var GL_FLOAT$8 = 5126; +var GL_FLOAT_VEC2 = 35664; +var GL_FLOAT_VEC3 = 35665; +var GL_FLOAT_VEC4 = 35666; +var GL_INT$3 = 5124; +var GL_INT_VEC2 = 35667; +var GL_INT_VEC3 = 35668; +var GL_INT_VEC4 = 35669; +var GL_BOOL = 35670; +var GL_BOOL_VEC2 = 35671; +var GL_BOOL_VEC3 = 35672; +var GL_BOOL_VEC4 = 35673; +var GL_FLOAT_MAT2 = 35674; +var GL_FLOAT_MAT3 = 35675; +var GL_FLOAT_MAT4 = 35676; +var GL_SAMPLER_2D = 35678; +var GL_SAMPLER_CUBE = 35680; + +var GL_TRIANGLES$1 = 4; + +var GL_FRONT = 1028; +var GL_BACK = 1029; +var GL_CW = 0x0900; +var GL_CCW = 0x0901; +var GL_MIN_EXT = 0x8007; +var GL_MAX_EXT = 0x8008; +var GL_ALWAYS = 519; +var GL_KEEP = 7680; +var GL_ZERO = 0; +var GL_ONE = 1; +var GL_FUNC_ADD = 0x8006; +var GL_LESS = 513; + +var GL_FRAMEBUFFER$2 = 0x8D40; +var GL_COLOR_ATTACHMENT0$2 = 0x8CE0; + +var blendFuncs = { + '0': 0, + '1': 1, + 'zero': 0, + 'one': 1, + 'src color': 768, + 'one minus src color': 769, + 'src alpha': 770, + 'one minus src alpha': 771, + 'dst color': 774, + 'one minus dst color': 775, + 'dst alpha': 772, + 'one minus dst alpha': 773, + 'constant color': 32769, + 'one minus constant color': 32770, + 'constant alpha': 32771, + 'one minus constant alpha': 32772, + 'src alpha saturate': 776 +}; + +// There are invalid values for srcRGB and dstRGB. See: +// https://www.khronos.org/registry/webgl/specs/1.0/#6.13 +// https://github.com/KhronosGroup/WebGL/blob/0d3201f5f7ec3c0060bc1f04077461541f1987b9/conformance-suites/1.0.3/conformance/misc/webgl-specific.html#L56 +var invalidBlendCombinations = [ + 'constant color, constant alpha', + 'one minus constant color, constant alpha', + 'constant color, one minus constant alpha', + 'one minus constant color, one minus constant alpha', + 'constant alpha, constant color', + 'constant alpha, one minus constant color', + 'one minus constant alpha, constant color', + 'one minus constant alpha, one minus constant color' +]; + +var compareFuncs = { + 'never': 512, + 'less': 513, + '<': 513, + 'equal': 514, + '=': 514, + '==': 514, + '===': 514, + 'lequal': 515, + '<=': 515, + 'greater': 516, + '>': 516, + 'notequal': 517, + '!=': 517, + '!==': 517, + 'gequal': 518, + '>=': 518, + 'always': 519 +}; + +var stencilOps = { + '0': 0, + 'zero': 0, + 'keep': 7680, + 'replace': 7681, + 'increment': 7682, + 'decrement': 7683, + 'increment wrap': 34055, + 'decrement wrap': 34056, + 'invert': 5386 +}; + +var shaderType = { + 'frag': GL_FRAGMENT_SHADER$1, + 'vert': GL_VERTEX_SHADER$1 +}; + +var orientationType = { + 'cw': GL_CW, + 'ccw': GL_CCW +}; + +function isBufferArgs (x) { + return Array.isArray(x) || + isTypedArray(x) || + isNDArrayLike(x) +} + +// Make sure viewport is processed first +function sortState (state) { + return state.sort(function (a, b) { + if (a === S_VIEWPORT) { + return -1 + } else if (b === S_VIEWPORT) { + return 1 + } + return (a < b) ? -1 : 1 + }) +} + +function Declaration (thisDep, contextDep, propDep, append) { + this.thisDep = thisDep; + this.contextDep = contextDep; + this.propDep = propDep; + this.append = append; +} + +function isStatic (decl) { + return decl && !(decl.thisDep || decl.contextDep || decl.propDep) +} + +function createStaticDecl (append) { + return new Declaration(false, false, false, append) +} + +function createDynamicDecl (dyn, append) { + var type = dyn.type; + if (type === DYN_FUNC$1) { + var numArgs = dyn.data.length; + return new Declaration( + true, + numArgs >= 1, + numArgs >= 2, + append) + } else if (type === DYN_THUNK) { + var data = dyn.data; + return new Declaration( + data.thisDep, + data.contextDep, + data.propDep, + append) + } else if (type === DYN_CONSTANT$1) { + return new Declaration( + false, + false, + false, + append) + } else if (type === DYN_ARRAY$1) { + var thisDep = false; + var contextDep = false; + var propDep = false; + for (var i = 0; i < dyn.data.length; ++i) { + var subDyn = dyn.data[i]; + if (subDyn.type === DYN_PROP$1) { + propDep = true; + } else if (subDyn.type === DYN_CONTEXT$1) { + contextDep = true; + } else if (subDyn.type === DYN_STATE$1) { + thisDep = true; + } else if (subDyn.type === DYN_FUNC$1) { + thisDep = true; + var subArgs = subDyn.data; + if (subArgs >= 1) { + contextDep = true; + } + if (subArgs >= 2) { + propDep = true; + } + } else if (subDyn.type === DYN_THUNK) { + thisDep = thisDep || subDyn.data.thisDep; + contextDep = contextDep || subDyn.data.contextDep; + propDep = propDep || subDyn.data.propDep; + } + } + return new Declaration( + thisDep, + contextDep, + propDep, + append) + } else { + return new Declaration( + type === DYN_STATE$1, + type === DYN_CONTEXT$1, + type === DYN_PROP$1, + append) + } +} + +var SCOPE_DECL = new Declaration(false, false, false, function () {}); + +function reglCore ( + gl, + stringStore, + extensions, + limits, + bufferState, + elementState, + textureState, + framebufferState, + uniformState, + attributeState, + shaderState, + drawState, + contextState, + timer, + config) { + var AttributeRecord = attributeState.Record; + + var blendEquations = { + 'add': 32774, + 'subtract': 32778, + 'reverse subtract': 32779 + }; + if (extensions.ext_blend_minmax) { + blendEquations.min = GL_MIN_EXT; + blendEquations.max = GL_MAX_EXT; + } + + var extInstancing = extensions.angle_instanced_arrays; + var extDrawBuffers = extensions.webgl_draw_buffers; + + // =================================================== + // =================================================== + // WEBGL STATE + // =================================================== + // =================================================== + var currentState = { + dirty: true, + profile: config.profile + }; + var nextState = {}; + var GL_STATE_NAMES = []; + var GL_FLAGS = {}; + var GL_VARIABLES = {}; + + function propName (name) { + return name.replace('.', '_') + } + + function stateFlag (sname, cap, init) { + var name = propName(sname); + GL_STATE_NAMES.push(sname); + nextState[name] = currentState[name] = !!init; + GL_FLAGS[name] = cap; + } + + function stateVariable (sname, func, init) { + var name = propName(sname); + GL_STATE_NAMES.push(sname); + if (Array.isArray(init)) { + currentState[name] = init.slice(); + nextState[name] = init.slice(); + } else { + currentState[name] = nextState[name] = init; + } + GL_VARIABLES[name] = func; + } + + // Dithering + stateFlag(S_DITHER, GL_DITHER); + + // Blending + stateFlag(S_BLEND_ENABLE, GL_BLEND); + stateVariable(S_BLEND_COLOR, 'blendColor', [0, 0, 0, 0]); + stateVariable(S_BLEND_EQUATION, 'blendEquationSeparate', + [GL_FUNC_ADD, GL_FUNC_ADD]); + stateVariable(S_BLEND_FUNC, 'blendFuncSeparate', + [GL_ONE, GL_ZERO, GL_ONE, GL_ZERO]); + + // Depth + stateFlag(S_DEPTH_ENABLE, GL_DEPTH_TEST, true); + stateVariable(S_DEPTH_FUNC, 'depthFunc', GL_LESS); + stateVariable(S_DEPTH_RANGE, 'depthRange', [0, 1]); + stateVariable(S_DEPTH_MASK, 'depthMask', true); + + // Color mask + stateVariable(S_COLOR_MASK, S_COLOR_MASK, [true, true, true, true]); + + // Face culling + stateFlag(S_CULL_ENABLE, GL_CULL_FACE); + stateVariable(S_CULL_FACE, 'cullFace', GL_BACK); + + // Front face orientation + stateVariable(S_FRONT_FACE, S_FRONT_FACE, GL_CCW); + + // Line width + stateVariable(S_LINE_WIDTH, S_LINE_WIDTH, 1); + + // Polygon offset + stateFlag(S_POLYGON_OFFSET_ENABLE, GL_POLYGON_OFFSET_FILL); + stateVariable(S_POLYGON_OFFSET_OFFSET, 'polygonOffset', [0, 0]); + + // Sample coverage + stateFlag(S_SAMPLE_ALPHA, GL_SAMPLE_ALPHA_TO_COVERAGE); + stateFlag(S_SAMPLE_ENABLE, GL_SAMPLE_COVERAGE); + stateVariable(S_SAMPLE_COVERAGE, 'sampleCoverage', [1, false]); + + // Stencil + stateFlag(S_STENCIL_ENABLE, GL_STENCIL_TEST); + stateVariable(S_STENCIL_MASK, 'stencilMask', -1); + stateVariable(S_STENCIL_FUNC, 'stencilFunc', [GL_ALWAYS, 0, -1]); + stateVariable(S_STENCIL_OPFRONT, 'stencilOpSeparate', + [GL_FRONT, GL_KEEP, GL_KEEP, GL_KEEP]); + stateVariable(S_STENCIL_OPBACK, 'stencilOpSeparate', + [GL_BACK, GL_KEEP, GL_KEEP, GL_KEEP]); + + // Scissor + stateFlag(S_SCISSOR_ENABLE, GL_SCISSOR_TEST); + stateVariable(S_SCISSOR_BOX, 'scissor', + [0, 0, gl.drawingBufferWidth, gl.drawingBufferHeight]); + + // Viewport + stateVariable(S_VIEWPORT, S_VIEWPORT, + [0, 0, gl.drawingBufferWidth, gl.drawingBufferHeight]); + + // =================================================== + // =================================================== + // ENVIRONMENT + // =================================================== + // =================================================== + var sharedState = { + gl: gl, + context: contextState, + strings: stringStore, + next: nextState, + current: currentState, + draw: drawState, + elements: elementState, + buffer: bufferState, + shader: shaderState, + attributes: attributeState.state, + vao: attributeState, + uniforms: uniformState, + framebuffer: framebufferState, + extensions: extensions, + + timer: timer, + isBufferArgs: isBufferArgs + }; + + var sharedConstants = { + primTypes: primTypes, + compareFuncs: compareFuncs, + blendFuncs: blendFuncs, + blendEquations: blendEquations, + stencilOps: stencilOps, + glTypes: glTypes, + orientationType: orientationType + }; + + check$1.optional(function () { + sharedState.isArrayLike = isArrayLike; + }); + + if (extDrawBuffers) { + sharedConstants.backBuffer = [GL_BACK]; + sharedConstants.drawBuffer = loop(limits.maxDrawbuffers, function (i) { + if (i === 0) { + return [0] + } + return loop(i, function (j) { + return GL_COLOR_ATTACHMENT0$2 + j + }) + }); + } + + var drawCallCounter = 0; + function createREGLEnvironment () { + var env = createEnvironment(); + var link = env.link; + var global = env.global; + env.id = drawCallCounter++; + + env.batchId = '0'; + + // link shared state + var SHARED = link(sharedState); + var shared = env.shared = { + props: 'a0' + }; + Object.keys(sharedState).forEach(function (prop) { + shared[prop] = global.def(SHARED, '.', prop); + }); + + // Inject runtime assertion stuff for debug builds + check$1.optional(function () { + env.CHECK = link(check$1); + env.commandStr = check$1.guessCommand(); + env.command = link(env.commandStr); + env.assert = function (block, pred, message) { + block( + 'if(!(', pred, '))', + this.CHECK, '.commandRaise(', link(message), ',', this.command, ');'); + }; + + sharedConstants.invalidBlendCombinations = invalidBlendCombinations; + }); + + // Copy GL state variables over + var nextVars = env.next = {}; + var currentVars = env.current = {}; + Object.keys(GL_VARIABLES).forEach(function (variable) { + if (Array.isArray(currentState[variable])) { + nextVars[variable] = global.def(shared.next, '.', variable); + currentVars[variable] = global.def(shared.current, '.', variable); + } + }); + + // Initialize shared constants + var constants = env.constants = {}; + Object.keys(sharedConstants).forEach(function (name) { + constants[name] = global.def(JSON.stringify(sharedConstants[name])); + }); + + // Helper function for calling a block + env.invoke = function (block, x) { + switch (x.type) { + case DYN_FUNC$1: + var argList = [ + 'this', + shared.context, + shared.props, + env.batchId + ]; + return block.def( + link(x.data), '.call(', + argList.slice(0, Math.max(x.data.length + 1, 4)), + ')') + case DYN_PROP$1: + return block.def(shared.props, x.data) + case DYN_CONTEXT$1: + return block.def(shared.context, x.data) + case DYN_STATE$1: + return block.def('this', x.data) + case DYN_THUNK: + x.data.append(env, block); + return x.data.ref + case DYN_CONSTANT$1: + return x.data.toString() + case DYN_ARRAY$1: + return x.data.map(function (y) { + return env.invoke(block, y) + }) + } + }; + + env.attribCache = {}; + + var scopeAttribs = {}; + env.scopeAttrib = function (name) { + var id = stringStore.id(name); + if (id in scopeAttribs) { + return scopeAttribs[id] + } + var binding = attributeState.scope[id]; + if (!binding) { + binding = attributeState.scope[id] = new AttributeRecord(); + } + var result = scopeAttribs[id] = link(binding); + return result + }; + + return env + } + + // =================================================== + // =================================================== + // PARSING + // =================================================== + // =================================================== + function parseProfile (options) { + var staticOptions = options.static; + var dynamicOptions = options.dynamic; + + var profileEnable; + if (S_PROFILE in staticOptions) { + var value = !!staticOptions[S_PROFILE]; + profileEnable = createStaticDecl(function (env, scope) { + return value + }); + profileEnable.enable = value; + } else if (S_PROFILE in dynamicOptions) { + var dyn = dynamicOptions[S_PROFILE]; + profileEnable = createDynamicDecl(dyn, function (env, scope) { + return env.invoke(scope, dyn) + }); + } + + return profileEnable + } + + function parseFramebuffer (options, env) { + var staticOptions = options.static; + var dynamicOptions = options.dynamic; + + if (S_FRAMEBUFFER in staticOptions) { + var framebuffer = staticOptions[S_FRAMEBUFFER]; + if (framebuffer) { + framebuffer = framebufferState.getFramebuffer(framebuffer); + check$1.command(framebuffer, 'invalid framebuffer object'); + return createStaticDecl(function (env, block) { + var FRAMEBUFFER = env.link(framebuffer); + var shared = env.shared; + block.set( + shared.framebuffer, + '.next', + FRAMEBUFFER); + var CONTEXT = shared.context; + block.set( + CONTEXT, + '.' + S_FRAMEBUFFER_WIDTH, + FRAMEBUFFER + '.width'); + block.set( + CONTEXT, + '.' + S_FRAMEBUFFER_HEIGHT, + FRAMEBUFFER + '.height'); + return FRAMEBUFFER + }) + } else { + return createStaticDecl(function (env, scope) { + var shared = env.shared; + scope.set( + shared.framebuffer, + '.next', + 'null'); + var CONTEXT = shared.context; + scope.set( + CONTEXT, + '.' + S_FRAMEBUFFER_WIDTH, + CONTEXT + '.' + S_DRAWINGBUFFER_WIDTH); + scope.set( + CONTEXT, + '.' + S_FRAMEBUFFER_HEIGHT, + CONTEXT + '.' + S_DRAWINGBUFFER_HEIGHT); + return 'null' + }) + } + } else if (S_FRAMEBUFFER in dynamicOptions) { + var dyn = dynamicOptions[S_FRAMEBUFFER]; + return createDynamicDecl(dyn, function (env, scope) { + var FRAMEBUFFER_FUNC = env.invoke(scope, dyn); + var shared = env.shared; + var FRAMEBUFFER_STATE = shared.framebuffer; + var FRAMEBUFFER = scope.def( + FRAMEBUFFER_STATE, '.getFramebuffer(', FRAMEBUFFER_FUNC, ')'); + + check$1.optional(function () { + env.assert(scope, + '!' + FRAMEBUFFER_FUNC + '||' + FRAMEBUFFER, + 'invalid framebuffer object'); + }); + + scope.set( + FRAMEBUFFER_STATE, + '.next', + FRAMEBUFFER); + var CONTEXT = shared.context; + scope.set( + CONTEXT, + '.' + S_FRAMEBUFFER_WIDTH, + FRAMEBUFFER + '?' + FRAMEBUFFER + '.width:' + + CONTEXT + '.' + S_DRAWINGBUFFER_WIDTH); + scope.set( + CONTEXT, + '.' + S_FRAMEBUFFER_HEIGHT, + FRAMEBUFFER + + '?' + FRAMEBUFFER + '.height:' + + CONTEXT + '.' + S_DRAWINGBUFFER_HEIGHT); + return FRAMEBUFFER + }) + } else { + return null + } + } + + function parseViewportScissor (options, framebuffer, env) { + var staticOptions = options.static; + var dynamicOptions = options.dynamic; + + function parseBox (param) { + if (param in staticOptions) { + var box = staticOptions[param]; + check$1.commandType(box, 'object', 'invalid ' + param, env.commandStr); + + var isStatic = true; + var x = box.x | 0; + var y = box.y | 0; + var w, h; + if ('width' in box) { + w = box.width | 0; + check$1.command(w >= 0, 'invalid ' + param, env.commandStr); + } else { + isStatic = false; + } + if ('height' in box) { + h = box.height | 0; + check$1.command(h >= 0, 'invalid ' + param, env.commandStr); + } else { + isStatic = false; + } + + return new Declaration( + !isStatic && framebuffer && framebuffer.thisDep, + !isStatic && framebuffer && framebuffer.contextDep, + !isStatic && framebuffer && framebuffer.propDep, + function (env, scope) { + var CONTEXT = env.shared.context; + var BOX_W = w; + if (!('width' in box)) { + BOX_W = scope.def(CONTEXT, '.', S_FRAMEBUFFER_WIDTH, '-', x); + } + var BOX_H = h; + if (!('height' in box)) { + BOX_H = scope.def(CONTEXT, '.', S_FRAMEBUFFER_HEIGHT, '-', y); + } + return [x, y, BOX_W, BOX_H] + }) + } else if (param in dynamicOptions) { + var dynBox = dynamicOptions[param]; + var result = createDynamicDecl(dynBox, function (env, scope) { + var BOX = env.invoke(scope, dynBox); + + check$1.optional(function () { + env.assert(scope, + BOX + '&&typeof ' + BOX + '==="object"', + 'invalid ' + param); + }); + + var CONTEXT = env.shared.context; + var BOX_X = scope.def(BOX, '.x|0'); + var BOX_Y = scope.def(BOX, '.y|0'); + var BOX_W = scope.def( + '"width" in ', BOX, '?', BOX, '.width|0:', + '(', CONTEXT, '.', S_FRAMEBUFFER_WIDTH, '-', BOX_X, ')'); + var BOX_H = scope.def( + '"height" in ', BOX, '?', BOX, '.height|0:', + '(', CONTEXT, '.', S_FRAMEBUFFER_HEIGHT, '-', BOX_Y, ')'); + + check$1.optional(function () { + env.assert(scope, + BOX_W + '>=0&&' + + BOX_H + '>=0', + 'invalid ' + param); + }); + + return [BOX_X, BOX_Y, BOX_W, BOX_H] + }); + if (framebuffer) { + result.thisDep = result.thisDep || framebuffer.thisDep; + result.contextDep = result.contextDep || framebuffer.contextDep; + result.propDep = result.propDep || framebuffer.propDep; + } + return result + } else if (framebuffer) { + return new Declaration( + framebuffer.thisDep, + framebuffer.contextDep, + framebuffer.propDep, + function (env, scope) { + var CONTEXT = env.shared.context; + return [ + 0, 0, + scope.def(CONTEXT, '.', S_FRAMEBUFFER_WIDTH), + scope.def(CONTEXT, '.', S_FRAMEBUFFER_HEIGHT)] + }) + } else { + return null + } + } + + var viewport = parseBox(S_VIEWPORT); + + if (viewport) { + var prevViewport = viewport; + viewport = new Declaration( + viewport.thisDep, + viewport.contextDep, + viewport.propDep, + function (env, scope) { + var VIEWPORT = prevViewport.append(env, scope); + var CONTEXT = env.shared.context; + scope.set( + CONTEXT, + '.' + S_VIEWPORT_WIDTH, + VIEWPORT[2]); + scope.set( + CONTEXT, + '.' + S_VIEWPORT_HEIGHT, + VIEWPORT[3]); + return VIEWPORT + }); + } + + return { + viewport: viewport, + scissor_box: parseBox(S_SCISSOR_BOX) + } + } + + function parseAttribLocations (options, attributes) { + var staticOptions = options.static; + var staticProgram = + typeof staticOptions[S_FRAG] === 'string' && + typeof staticOptions[S_VERT] === 'string'; + if (staticProgram) { + if (Object.keys(attributes.dynamic).length > 0) { + return null + } + var staticAttributes = attributes.static; + var sAttributes = Object.keys(staticAttributes); + if (sAttributes.length > 0 && typeof staticAttributes[sAttributes[0]] === 'number') { + var bindings = []; + for (var i = 0; i < sAttributes.length; ++i) { + check$1(typeof staticAttributes[sAttributes[i]] === 'number', 'must specify all vertex attribute locations when using vaos'); + bindings.push([staticAttributes[sAttributes[i]] | 0, sAttributes[i]]); + } + return bindings + } + } + return null + } + + function parseProgram (options, env, attribLocations) { + var staticOptions = options.static; + var dynamicOptions = options.dynamic; + + function parseShader (name) { + if (name in staticOptions) { + var id = stringStore.id(staticOptions[name]); + check$1.optional(function () { + shaderState.shader(shaderType[name], id, check$1.guessCommand()); + }); + var result = createStaticDecl(function () { + return id + }); + result.id = id; + return result + } else if (name in dynamicOptions) { + var dyn = dynamicOptions[name]; + return createDynamicDecl(dyn, function (env, scope) { + var str = env.invoke(scope, dyn); + var id = scope.def(env.shared.strings, '.id(', str, ')'); + check$1.optional(function () { + scope( + env.shared.shader, '.shader(', + shaderType[name], ',', + id, ',', + env.command, ');'); + }); + return id + }) + } + return null + } + + var frag = parseShader(S_FRAG); + var vert = parseShader(S_VERT); + + var program = null; + var progVar; + if (isStatic(frag) && isStatic(vert)) { + program = shaderState.program(vert.id, frag.id, null, attribLocations); + progVar = createStaticDecl(function (env, scope) { + return env.link(program) + }); + } else { + progVar = new Declaration( + (frag && frag.thisDep) || (vert && vert.thisDep), + (frag && frag.contextDep) || (vert && vert.contextDep), + (frag && frag.propDep) || (vert && vert.propDep), + function (env, scope) { + var SHADER_STATE = env.shared.shader; + var fragId; + if (frag) { + fragId = frag.append(env, scope); + } else { + fragId = scope.def(SHADER_STATE, '.', S_FRAG); + } + var vertId; + if (vert) { + vertId = vert.append(env, scope); + } else { + vertId = scope.def(SHADER_STATE, '.', S_VERT); + } + var progDef = SHADER_STATE + '.program(' + vertId + ',' + fragId; + check$1.optional(function () { + progDef += ',' + env.command; + }); + return scope.def(progDef + ')') + }); + } + + return { + frag: frag, + vert: vert, + progVar: progVar, + program: program + } + } + + function parseDraw (options, env) { + var staticOptions = options.static; + var dynamicOptions = options.dynamic; + + function parseElements () { + if (S_ELEMENTS in staticOptions) { + var elements = staticOptions[S_ELEMENTS]; + if (isBufferArgs(elements)) { + elements = elementState.getElements(elementState.create(elements, true)); + } else if (elements) { + elements = elementState.getElements(elements); + check$1.command(elements, 'invalid elements', env.commandStr); + } + var result = createStaticDecl(function (env, scope) { + if (elements) { + var result = env.link(elements); + env.ELEMENTS = result; + return result + } + env.ELEMENTS = null; + return null + }); + result.value = elements; + return result + } else if (S_ELEMENTS in dynamicOptions) { + var dyn = dynamicOptions[S_ELEMENTS]; + return createDynamicDecl(dyn, function (env, scope) { + var shared = env.shared; + + var IS_BUFFER_ARGS = shared.isBufferArgs; + var ELEMENT_STATE = shared.elements; + + var elementDefn = env.invoke(scope, dyn); + var elements = scope.def('null'); + var elementStream = scope.def(IS_BUFFER_ARGS, '(', elementDefn, ')'); + + var ifte = env.cond(elementStream) + .then(elements, '=', ELEMENT_STATE, '.createStream(', elementDefn, ');') + .else(elements, '=', ELEMENT_STATE, '.getElements(', elementDefn, ');'); + + check$1.optional(function () { + env.assert(ifte.else, + '!' + elementDefn + '||' + elements, + 'invalid elements'); + }); + + scope.entry(ifte); + scope.exit( + env.cond(elementStream) + .then(ELEMENT_STATE, '.destroyStream(', elements, ');')); + + env.ELEMENTS = elements; + + return elements + }) + } + + return null + } + + var elements = parseElements(); + + function parsePrimitive () { + if (S_PRIMITIVE in staticOptions) { + var primitive = staticOptions[S_PRIMITIVE]; + check$1.commandParameter(primitive, primTypes, 'invalid primitve', env.commandStr); + return createStaticDecl(function (env, scope) { + return primTypes[primitive] + }) + } else if (S_PRIMITIVE in dynamicOptions) { + var dynPrimitive = dynamicOptions[S_PRIMITIVE]; + return createDynamicDecl(dynPrimitive, function (env, scope) { + var PRIM_TYPES = env.constants.primTypes; + var prim = env.invoke(scope, dynPrimitive); + check$1.optional(function () { + env.assert(scope, + prim + ' in ' + PRIM_TYPES, + 'invalid primitive, must be one of ' + Object.keys(primTypes)); + }); + return scope.def(PRIM_TYPES, '[', prim, ']') + }) + } else if (elements) { + if (isStatic(elements)) { + if (elements.value) { + return createStaticDecl(function (env, scope) { + return scope.def(env.ELEMENTS, '.primType') + }) + } else { + return createStaticDecl(function () { + return GL_TRIANGLES$1 + }) + } + } else { + return new Declaration( + elements.thisDep, + elements.contextDep, + elements.propDep, + function (env, scope) { + var elements = env.ELEMENTS; + return scope.def(elements, '?', elements, '.primType:', GL_TRIANGLES$1) + }) + } + } + return null + } + + function parseParam (param, isOffset) { + if (param in staticOptions) { + var value = staticOptions[param] | 0; + check$1.command(!isOffset || value >= 0, 'invalid ' + param, env.commandStr); + return createStaticDecl(function (env, scope) { + if (isOffset) { + env.OFFSET = value; + } + return value + }) + } else if (param in dynamicOptions) { + var dynValue = dynamicOptions[param]; + return createDynamicDecl(dynValue, function (env, scope) { + var result = env.invoke(scope, dynValue); + if (isOffset) { + env.OFFSET = result; + check$1.optional(function () { + env.assert(scope, + result + '>=0', + 'invalid ' + param); + }); + } + return result + }) + } else if (isOffset && elements) { + return createStaticDecl(function (env, scope) { + env.OFFSET = '0'; + return 0 + }) + } + return null + } + + var OFFSET = parseParam(S_OFFSET, true); + + function parseVertCount () { + if (S_COUNT in staticOptions) { + var count = staticOptions[S_COUNT] | 0; + check$1.command( + typeof count === 'number' && count >= 0, 'invalid vertex count', env.commandStr); + return createStaticDecl(function () { + return count + }) + } else if (S_COUNT in dynamicOptions) { + var dynCount = dynamicOptions[S_COUNT]; + return createDynamicDecl(dynCount, function (env, scope) { + var result = env.invoke(scope, dynCount); + check$1.optional(function () { + env.assert(scope, + 'typeof ' + result + '==="number"&&' + + result + '>=0&&' + + result + '===(' + result + '|0)', + 'invalid vertex count'); + }); + return result + }) + } else if (elements) { + if (isStatic(elements)) { + if (elements) { + if (OFFSET) { + return new Declaration( + OFFSET.thisDep, + OFFSET.contextDep, + OFFSET.propDep, + function (env, scope) { + var result = scope.def( + env.ELEMENTS, '.vertCount-', env.OFFSET); + + check$1.optional(function () { + env.assert(scope, + result + '>=0', + 'invalid vertex offset/element buffer too small'); + }); + + return result + }) + } else { + return createStaticDecl(function (env, scope) { + return scope.def(env.ELEMENTS, '.vertCount') + }) + } + } else { + var result = createStaticDecl(function () { + return -1 + }); + check$1.optional(function () { + result.MISSING = true; + }); + return result + } + } else { + var variable = new Declaration( + elements.thisDep || OFFSET.thisDep, + elements.contextDep || OFFSET.contextDep, + elements.propDep || OFFSET.propDep, + function (env, scope) { + var elements = env.ELEMENTS; + if (env.OFFSET) { + return scope.def(elements, '?', elements, '.vertCount-', + env.OFFSET, ':-1') + } + return scope.def(elements, '?', elements, '.vertCount:-1') + }); + check$1.optional(function () { + variable.DYNAMIC = true; + }); + return variable + } + } + return null + } + + return { + elements: elements, + primitive: parsePrimitive(), + count: parseVertCount(), + instances: parseParam(S_INSTANCES, false), + offset: OFFSET + } + } + + function parseGLState (options, env) { + var staticOptions = options.static; + var dynamicOptions = options.dynamic; + + var STATE = {}; + + GL_STATE_NAMES.forEach(function (prop) { + var param = propName(prop); + + function parseParam (parseStatic, parseDynamic) { + if (prop in staticOptions) { + var value = parseStatic(staticOptions[prop]); + STATE[param] = createStaticDecl(function () { + return value + }); + } else if (prop in dynamicOptions) { + var dyn = dynamicOptions[prop]; + STATE[param] = createDynamicDecl(dyn, function (env, scope) { + return parseDynamic(env, scope, env.invoke(scope, dyn)) + }); + } + } + + switch (prop) { + case S_CULL_ENABLE: + case S_BLEND_ENABLE: + case S_DITHER: + case S_STENCIL_ENABLE: + case S_DEPTH_ENABLE: + case S_SCISSOR_ENABLE: + case S_POLYGON_OFFSET_ENABLE: + case S_SAMPLE_ALPHA: + case S_SAMPLE_ENABLE: + case S_DEPTH_MASK: + return parseParam( + function (value) { + check$1.commandType(value, 'boolean', prop, env.commandStr); + return value + }, + function (env, scope, value) { + check$1.optional(function () { + env.assert(scope, + 'typeof ' + value + '==="boolean"', + 'invalid flag ' + prop, env.commandStr); + }); + return value + }) + + case S_DEPTH_FUNC: + return parseParam( + function (value) { + check$1.commandParameter(value, compareFuncs, 'invalid ' + prop, env.commandStr); + return compareFuncs[value] + }, + function (env, scope, value) { + var COMPARE_FUNCS = env.constants.compareFuncs; + check$1.optional(function () { + env.assert(scope, + value + ' in ' + COMPARE_FUNCS, + 'invalid ' + prop + ', must be one of ' + Object.keys(compareFuncs)); + }); + return scope.def(COMPARE_FUNCS, '[', value, ']') + }) + + case S_DEPTH_RANGE: + return parseParam( + function (value) { + check$1.command( + isArrayLike(value) && + value.length === 2 && + typeof value[0] === 'number' && + typeof value[1] === 'number' && + value[0] <= value[1], + 'depth range is 2d array', + env.commandStr); + return value + }, + function (env, scope, value) { + check$1.optional(function () { + env.assert(scope, + env.shared.isArrayLike + '(' + value + ')&&' + + value + '.length===2&&' + + 'typeof ' + value + '[0]==="number"&&' + + 'typeof ' + value + '[1]==="number"&&' + + value + '[0]<=' + value + '[1]', + 'depth range must be a 2d array'); + }); + + var Z_NEAR = scope.def('+', value, '[0]'); + var Z_FAR = scope.def('+', value, '[1]'); + return [Z_NEAR, Z_FAR] + }) + + case S_BLEND_FUNC: + return parseParam( + function (value) { + check$1.commandType(value, 'object', 'blend.func', env.commandStr); + var srcRGB = ('srcRGB' in value ? value.srcRGB : value.src); + var srcAlpha = ('srcAlpha' in value ? value.srcAlpha : value.src); + var dstRGB = ('dstRGB' in value ? value.dstRGB : value.dst); + var dstAlpha = ('dstAlpha' in value ? value.dstAlpha : value.dst); + check$1.commandParameter(srcRGB, blendFuncs, param + '.srcRGB', env.commandStr); + check$1.commandParameter(srcAlpha, blendFuncs, param + '.srcAlpha', env.commandStr); + check$1.commandParameter(dstRGB, blendFuncs, param + '.dstRGB', env.commandStr); + check$1.commandParameter(dstAlpha, blendFuncs, param + '.dstAlpha', env.commandStr); + + check$1.command( + (invalidBlendCombinations.indexOf(srcRGB + ', ' + dstRGB) === -1), + 'unallowed blending combination (srcRGB, dstRGB) = (' + srcRGB + ', ' + dstRGB + ')', env.commandStr); + + return [ + blendFuncs[srcRGB], + blendFuncs[dstRGB], + blendFuncs[srcAlpha], + blendFuncs[dstAlpha] + ] + }, + function (env, scope, value) { + var BLEND_FUNCS = env.constants.blendFuncs; + + check$1.optional(function () { + env.assert(scope, + value + '&&typeof ' + value + '==="object"', + 'invalid blend func, must be an object'); + }); + + function read (prefix, suffix) { + var func = scope.def( + '"', prefix, suffix, '" in ', value, + '?', value, '.', prefix, suffix, + ':', value, '.', prefix); + + check$1.optional(function () { + env.assert(scope, + func + ' in ' + BLEND_FUNCS, + 'invalid ' + prop + '.' + prefix + suffix + ', must be one of ' + Object.keys(blendFuncs)); + }); + + return func + } + + var srcRGB = read('src', 'RGB'); + var dstRGB = read('dst', 'RGB'); + + check$1.optional(function () { + var INVALID_BLEND_COMBINATIONS = env.constants.invalidBlendCombinations; + + env.assert(scope, + INVALID_BLEND_COMBINATIONS + + '.indexOf(' + srcRGB + '+", "+' + dstRGB + ') === -1 ', + 'unallowed blending combination for (srcRGB, dstRGB)' + ); + }); + + var SRC_RGB = scope.def(BLEND_FUNCS, '[', srcRGB, ']'); + var SRC_ALPHA = scope.def(BLEND_FUNCS, '[', read('src', 'Alpha'), ']'); + var DST_RGB = scope.def(BLEND_FUNCS, '[', dstRGB, ']'); + var DST_ALPHA = scope.def(BLEND_FUNCS, '[', read('dst', 'Alpha'), ']'); + + return [SRC_RGB, DST_RGB, SRC_ALPHA, DST_ALPHA] + }) + + case S_BLEND_EQUATION: + return parseParam( + function (value) { + if (typeof value === 'string') { + check$1.commandParameter(value, blendEquations, 'invalid ' + prop, env.commandStr); + return [ + blendEquations[value], + blendEquations[value] + ] + } else if (typeof value === 'object') { + check$1.commandParameter( + value.rgb, blendEquations, prop + '.rgb', env.commandStr); + check$1.commandParameter( + value.alpha, blendEquations, prop + '.alpha', env.commandStr); + return [ + blendEquations[value.rgb], + blendEquations[value.alpha] + ] + } else { + check$1.commandRaise('invalid blend.equation', env.commandStr); + } + }, + function (env, scope, value) { + var BLEND_EQUATIONS = env.constants.blendEquations; + + var RGB = scope.def(); + var ALPHA = scope.def(); + + var ifte = env.cond('typeof ', value, '==="string"'); + + check$1.optional(function () { + function checkProp (block, name, value) { + env.assert(block, + value + ' in ' + BLEND_EQUATIONS, + 'invalid ' + name + ', must be one of ' + Object.keys(blendEquations)); + } + checkProp(ifte.then, prop, value); + + env.assert(ifte.else, + value + '&&typeof ' + value + '==="object"', + 'invalid ' + prop); + checkProp(ifte.else, prop + '.rgb', value + '.rgb'); + checkProp(ifte.else, prop + '.alpha', value + '.alpha'); + }); + + ifte.then( + RGB, '=', ALPHA, '=', BLEND_EQUATIONS, '[', value, '];'); + ifte.else( + RGB, '=', BLEND_EQUATIONS, '[', value, '.rgb];', + ALPHA, '=', BLEND_EQUATIONS, '[', value, '.alpha];'); + + scope(ifte); + + return [RGB, ALPHA] + }) + + case S_BLEND_COLOR: + return parseParam( + function (value) { + check$1.command( + isArrayLike(value) && + value.length === 4, + 'blend.color must be a 4d array', env.commandStr); + return loop(4, function (i) { + return +value[i] + }) + }, + function (env, scope, value) { + check$1.optional(function () { + env.assert(scope, + env.shared.isArrayLike + '(' + value + ')&&' + + value + '.length===4', + 'blend.color must be a 4d array'); + }); + return loop(4, function (i) { + return scope.def('+', value, '[', i, ']') + }) + }) + + case S_STENCIL_MASK: + return parseParam( + function (value) { + check$1.commandType(value, 'number', param, env.commandStr); + return value | 0 + }, + function (env, scope, value) { + check$1.optional(function () { + env.assert(scope, + 'typeof ' + value + '==="number"', + 'invalid stencil.mask'); + }); + return scope.def(value, '|0') + }) + + case S_STENCIL_FUNC: + return parseParam( + function (value) { + check$1.commandType(value, 'object', param, env.commandStr); + var cmp = value.cmp || 'keep'; + var ref = value.ref || 0; + var mask = 'mask' in value ? value.mask : -1; + check$1.commandParameter(cmp, compareFuncs, prop + '.cmp', env.commandStr); + check$1.commandType(ref, 'number', prop + '.ref', env.commandStr); + check$1.commandType(mask, 'number', prop + '.mask', env.commandStr); + return [ + compareFuncs[cmp], + ref, + mask + ] + }, + function (env, scope, value) { + var COMPARE_FUNCS = env.constants.compareFuncs; + check$1.optional(function () { + function assert () { + env.assert(scope, + Array.prototype.join.call(arguments, ''), + 'invalid stencil.func'); + } + assert(value + '&&typeof ', value, '==="object"'); + assert('!("cmp" in ', value, ')||(', + value, '.cmp in ', COMPARE_FUNCS, ')'); + }); + var cmp = scope.def( + '"cmp" in ', value, + '?', COMPARE_FUNCS, '[', value, '.cmp]', + ':', GL_KEEP); + var ref = scope.def(value, '.ref|0'); + var mask = scope.def( + '"mask" in ', value, + '?', value, '.mask|0:-1'); + return [cmp, ref, mask] + }) + + case S_STENCIL_OPFRONT: + case S_STENCIL_OPBACK: + return parseParam( + function (value) { + check$1.commandType(value, 'object', param, env.commandStr); + var fail = value.fail || 'keep'; + var zfail = value.zfail || 'keep'; + var zpass = value.zpass || 'keep'; + check$1.commandParameter(fail, stencilOps, prop + '.fail', env.commandStr); + check$1.commandParameter(zfail, stencilOps, prop + '.zfail', env.commandStr); + check$1.commandParameter(zpass, stencilOps, prop + '.zpass', env.commandStr); + return [ + prop === S_STENCIL_OPBACK ? GL_BACK : GL_FRONT, + stencilOps[fail], + stencilOps[zfail], + stencilOps[zpass] + ] + }, + function (env, scope, value) { + var STENCIL_OPS = env.constants.stencilOps; + + check$1.optional(function () { + env.assert(scope, + value + '&&typeof ' + value + '==="object"', + 'invalid ' + prop); + }); + + function read (name) { + check$1.optional(function () { + env.assert(scope, + '!("' + name + '" in ' + value + ')||' + + '(' + value + '.' + name + ' in ' + STENCIL_OPS + ')', + 'invalid ' + prop + '.' + name + ', must be one of ' + Object.keys(stencilOps)); + }); + + return scope.def( + '"', name, '" in ', value, + '?', STENCIL_OPS, '[', value, '.', name, ']:', + GL_KEEP) + } + + return [ + prop === S_STENCIL_OPBACK ? GL_BACK : GL_FRONT, + read('fail'), + read('zfail'), + read('zpass') + ] + }) + + case S_POLYGON_OFFSET_OFFSET: + return parseParam( + function (value) { + check$1.commandType(value, 'object', param, env.commandStr); + var factor = value.factor | 0; + var units = value.units | 0; + check$1.commandType(factor, 'number', param + '.factor', env.commandStr); + check$1.commandType(units, 'number', param + '.units', env.commandStr); + return [factor, units] + }, + function (env, scope, value) { + check$1.optional(function () { + env.assert(scope, + value + '&&typeof ' + value + '==="object"', + 'invalid ' + prop); + }); + + var FACTOR = scope.def(value, '.factor|0'); + var UNITS = scope.def(value, '.units|0'); + + return [FACTOR, UNITS] + }) + + case S_CULL_FACE: + return parseParam( + function (value) { + var face = 0; + if (value === 'front') { + face = GL_FRONT; + } else if (value === 'back') { + face = GL_BACK; + } + check$1.command(!!face, param, env.commandStr); + return face + }, + function (env, scope, value) { + check$1.optional(function () { + env.assert(scope, + value + '==="front"||' + + value + '==="back"', + 'invalid cull.face'); + }); + return scope.def(value, '==="front"?', GL_FRONT, ':', GL_BACK) + }) + + case S_LINE_WIDTH: + return parseParam( + function (value) { + check$1.command( + typeof value === 'number' && + value >= limits.lineWidthDims[0] && + value <= limits.lineWidthDims[1], + 'invalid line width, must be a positive number between ' + + limits.lineWidthDims[0] + ' and ' + limits.lineWidthDims[1], env.commandStr); + return value + }, + function (env, scope, value) { + check$1.optional(function () { + env.assert(scope, + 'typeof ' + value + '==="number"&&' + + value + '>=' + limits.lineWidthDims[0] + '&&' + + value + '<=' + limits.lineWidthDims[1], + 'invalid line width'); + }); + + return value + }) + + case S_FRONT_FACE: + return parseParam( + function (value) { + check$1.commandParameter(value, orientationType, param, env.commandStr); + return orientationType[value] + }, + function (env, scope, value) { + check$1.optional(function () { + env.assert(scope, + value + '==="cw"||' + + value + '==="ccw"', + 'invalid frontFace, must be one of cw,ccw'); + }); + return scope.def(value + '==="cw"?' + GL_CW + ':' + GL_CCW) + }) + + case S_COLOR_MASK: + return parseParam( + function (value) { + check$1.command( + isArrayLike(value) && value.length === 4, + 'color.mask must be length 4 array', env.commandStr); + return value.map(function (v) { return !!v }) + }, + function (env, scope, value) { + check$1.optional(function () { + env.assert(scope, + env.shared.isArrayLike + '(' + value + ')&&' + + value + '.length===4', + 'invalid color.mask'); + }); + return loop(4, function (i) { + return '!!' + value + '[' + i + ']' + }) + }) + + case S_SAMPLE_COVERAGE: + return parseParam( + function (value) { + check$1.command(typeof value === 'object' && value, param, env.commandStr); + var sampleValue = 'value' in value ? value.value : 1; + var sampleInvert = !!value.invert; + check$1.command( + typeof sampleValue === 'number' && + sampleValue >= 0 && sampleValue <= 1, + 'sample.coverage.value must be a number between 0 and 1', env.commandStr); + return [sampleValue, sampleInvert] + }, + function (env, scope, value) { + check$1.optional(function () { + env.assert(scope, + value + '&&typeof ' + value + '==="object"', + 'invalid sample.coverage'); + }); + var VALUE = scope.def( + '"value" in ', value, '?+', value, '.value:1'); + var INVERT = scope.def('!!', value, '.invert'); + return [VALUE, INVERT] + }) + } + }); + + return STATE + } + + function parseUniforms (uniforms, env) { + var staticUniforms = uniforms.static; + var dynamicUniforms = uniforms.dynamic; + + var UNIFORMS = {}; + + Object.keys(staticUniforms).forEach(function (name) { + var value = staticUniforms[name]; + var result; + if (typeof value === 'number' || + typeof value === 'boolean') { + result = createStaticDecl(function () { + return value + }); + } else if (typeof value === 'function') { + var reglType = value._reglType; + if (reglType === 'texture2d' || + reglType === 'textureCube') { + result = createStaticDecl(function (env) { + return env.link(value) + }); + } else if (reglType === 'framebuffer' || + reglType === 'framebufferCube') { + check$1.command(value.color.length > 0, + 'missing color attachment for framebuffer sent to uniform "' + name + '"', env.commandStr); + result = createStaticDecl(function (env) { + return env.link(value.color[0]) + }); + } else { + check$1.commandRaise('invalid data for uniform "' + name + '"', env.commandStr); + } + } else if (isArrayLike(value)) { + result = createStaticDecl(function (env) { + var ITEM = env.global.def('[', + loop(value.length, function (i) { + check$1.command( + typeof value[i] === 'number' || + typeof value[i] === 'boolean', + 'invalid uniform ' + name, env.commandStr); + return value[i] + }), ']'); + return ITEM + }); + } else { + check$1.commandRaise('invalid or missing data for uniform "' + name + '"', env.commandStr); + } + result.value = value; + UNIFORMS[name] = result; + }); + + Object.keys(dynamicUniforms).forEach(function (key) { + var dyn = dynamicUniforms[key]; + UNIFORMS[key] = createDynamicDecl(dyn, function (env, scope) { + return env.invoke(scope, dyn) + }); + }); + + return UNIFORMS + } + + function parseAttributes (attributes, env) { + var staticAttributes = attributes.static; + var dynamicAttributes = attributes.dynamic; + + var attributeDefs = {}; + + Object.keys(staticAttributes).forEach(function (attribute) { + var value = staticAttributes[attribute]; + var id = stringStore.id(attribute); + + var record = new AttributeRecord(); + if (isBufferArgs(value)) { + record.state = ATTRIB_STATE_POINTER; + record.buffer = bufferState.getBuffer( + bufferState.create(value, GL_ARRAY_BUFFER$2, false, true)); + record.type = 0; + } else { + var buffer = bufferState.getBuffer(value); + if (buffer) { + record.state = ATTRIB_STATE_POINTER; + record.buffer = buffer; + record.type = 0; + } else { + check$1.command(typeof value === 'object' && value, + 'invalid data for attribute ' + attribute, env.commandStr); + if ('constant' in value) { + var constant = value.constant; + record.buffer = 'null'; + record.state = ATTRIB_STATE_CONSTANT; + if (typeof constant === 'number') { + record.x = constant; + } else { + check$1.command( + isArrayLike(constant) && + constant.length > 0 && + constant.length <= 4, + 'invalid constant for attribute ' + attribute, env.commandStr); + CUTE_COMPONENTS.forEach(function (c, i) { + if (i < constant.length) { + record[c] = constant[i]; + } + }); + } + } else { + if (isBufferArgs(value.buffer)) { + buffer = bufferState.getBuffer( + bufferState.create(value.buffer, GL_ARRAY_BUFFER$2, false, true)); + } else { + buffer = bufferState.getBuffer(value.buffer); + } + check$1.command(!!buffer, 'missing buffer for attribute "' + attribute + '"', env.commandStr); + + var offset = value.offset | 0; + check$1.command(offset >= 0, + 'invalid offset for attribute "' + attribute + '"', env.commandStr); + + var stride = value.stride | 0; + check$1.command(stride >= 0 && stride < 256, + 'invalid stride for attribute "' + attribute + '", must be integer betweeen [0, 255]', env.commandStr); + + var size = value.size | 0; + check$1.command(!('size' in value) || (size > 0 && size <= 4), + 'invalid size for attribute "' + attribute + '", must be 1,2,3,4', env.commandStr); + + var normalized = !!value.normalized; + + var type = 0; + if ('type' in value) { + check$1.commandParameter( + value.type, glTypes, + 'invalid type for attribute ' + attribute, env.commandStr); + type = glTypes[value.type]; + } + + var divisor = value.divisor | 0; + if ('divisor' in value) { + check$1.command(divisor === 0 || extInstancing, + 'cannot specify divisor for attribute "' + attribute + '", instancing not supported', env.commandStr); + check$1.command(divisor >= 0, + 'invalid divisor for attribute "' + attribute + '"', env.commandStr); + } + + check$1.optional(function () { + var command = env.commandStr; + + var VALID_KEYS = [ + 'buffer', + 'offset', + 'divisor', + 'normalized', + 'type', + 'size', + 'stride' + ]; + + Object.keys(value).forEach(function (prop) { + check$1.command( + VALID_KEYS.indexOf(prop) >= 0, + 'unknown parameter "' + prop + '" for attribute pointer "' + attribute + '" (valid parameters are ' + VALID_KEYS + ')', + command); + }); + }); + + record.buffer = buffer; + record.state = ATTRIB_STATE_POINTER; + record.size = size; + record.normalized = normalized; + record.type = type || buffer.dtype; + record.offset = offset; + record.stride = stride; + record.divisor = divisor; + } + } + } + + attributeDefs[attribute] = createStaticDecl(function (env, scope) { + var cache = env.attribCache; + if (id in cache) { + return cache[id] + } + var result = { + isStream: false + }; + Object.keys(record).forEach(function (key) { + result[key] = record[key]; + }); + if (record.buffer) { + result.buffer = env.link(record.buffer); + result.type = result.type || (result.buffer + '.dtype'); + } + cache[id] = result; + return result + }); + }); + + Object.keys(dynamicAttributes).forEach(function (attribute) { + var dyn = dynamicAttributes[attribute]; + + function appendAttributeCode (env, block) { + var VALUE = env.invoke(block, dyn); + + var shared = env.shared; + var constants = env.constants; + + var IS_BUFFER_ARGS = shared.isBufferArgs; + var BUFFER_STATE = shared.buffer; + + // Perform validation on attribute + check$1.optional(function () { + env.assert(block, + VALUE + '&&(typeof ' + VALUE + '==="object"||typeof ' + + VALUE + '==="function")&&(' + + IS_BUFFER_ARGS + '(' + VALUE + ')||' + + BUFFER_STATE + '.getBuffer(' + VALUE + ')||' + + BUFFER_STATE + '.getBuffer(' + VALUE + '.buffer)||' + + IS_BUFFER_ARGS + '(' + VALUE + '.buffer)||' + + '("constant" in ' + VALUE + + '&&(typeof ' + VALUE + '.constant==="number"||' + + shared.isArrayLike + '(' + VALUE + '.constant))))', + 'invalid dynamic attribute "' + attribute + '"'); + }); + + // allocate names for result + var result = { + isStream: block.def(false) + }; + var defaultRecord = new AttributeRecord(); + defaultRecord.state = ATTRIB_STATE_POINTER; + Object.keys(defaultRecord).forEach(function (key) { + result[key] = block.def('' + defaultRecord[key]); + }); + + var BUFFER = result.buffer; + var TYPE = result.type; + block( + 'if(', IS_BUFFER_ARGS, '(', VALUE, ')){', + result.isStream, '=true;', + BUFFER, '=', BUFFER_STATE, '.createStream(', GL_ARRAY_BUFFER$2, ',', VALUE, ');', + TYPE, '=', BUFFER, '.dtype;', + '}else{', + BUFFER, '=', BUFFER_STATE, '.getBuffer(', VALUE, ');', + 'if(', BUFFER, '){', + TYPE, '=', BUFFER, '.dtype;', + '}else if("constant" in ', VALUE, '){', + result.state, '=', ATTRIB_STATE_CONSTANT, ';', + 'if(typeof ' + VALUE + '.constant === "number"){', + result[CUTE_COMPONENTS[0]], '=', VALUE, '.constant;', + CUTE_COMPONENTS.slice(1).map(function (n) { + return result[n] + }).join('='), '=0;', + '}else{', + CUTE_COMPONENTS.map(function (name, i) { + return ( + result[name] + '=' + VALUE + '.constant.length>' + i + + '?' + VALUE + '.constant[' + i + ']:0;' + ) + }).join(''), + '}}else{', + 'if(', IS_BUFFER_ARGS, '(', VALUE, '.buffer)){', + BUFFER, '=', BUFFER_STATE, '.createStream(', GL_ARRAY_BUFFER$2, ',', VALUE, '.buffer);', + '}else{', + BUFFER, '=', BUFFER_STATE, '.getBuffer(', VALUE, '.buffer);', + '}', + TYPE, '="type" in ', VALUE, '?', + constants.glTypes, '[', VALUE, '.type]:', BUFFER, '.dtype;', + result.normalized, '=!!', VALUE, '.normalized;'); + function emitReadRecord (name) { + block(result[name], '=', VALUE, '.', name, '|0;'); + } + emitReadRecord('size'); + emitReadRecord('offset'); + emitReadRecord('stride'); + emitReadRecord('divisor'); + + block('}}'); + + block.exit( + 'if(', result.isStream, '){', + BUFFER_STATE, '.destroyStream(', BUFFER, ');', + '}'); + + return result + } + + attributeDefs[attribute] = createDynamicDecl(dyn, appendAttributeCode); + }); + + return attributeDefs + } + + function parseVAO (options, env) { + var staticOptions = options.static; + var dynamicOptions = options.dynamic; + if (S_VAO in staticOptions) { + var vao = staticOptions[S_VAO]; + if (vao !== null && attributeState.getVAO(vao) === null) { + vao = attributeState.createVAO(vao); + } + return createStaticDecl(function (env) { + return env.link(attributeState.getVAO(vao)) + }) + } else if (S_VAO in dynamicOptions) { + var dyn = dynamicOptions[S_VAO]; + return createDynamicDecl(dyn, function (env, scope) { + var vaoRef = env.invoke(scope, dyn); + return scope.def(env.shared.vao + '.getVAO(' + vaoRef + ')') + }) + } + return null + } + + function parseContext (context) { + var staticContext = context.static; + var dynamicContext = context.dynamic; + var result = {}; + + Object.keys(staticContext).forEach(function (name) { + var value = staticContext[name]; + result[name] = createStaticDecl(function (env, scope) { + if (typeof value === 'number' || typeof value === 'boolean') { + return '' + value + } else { + return env.link(value) + } + }); + }); + + Object.keys(dynamicContext).forEach(function (name) { + var dyn = dynamicContext[name]; + result[name] = createDynamicDecl(dyn, function (env, scope) { + return env.invoke(scope, dyn) + }); + }); + + return result + } + + function parseArguments (options, attributes, uniforms, context, env) { + var staticOptions = options.static; + var dynamicOptions = options.dynamic; + + check$1.optional(function () { + var KEY_NAMES = [ + S_FRAMEBUFFER, + S_VERT, + S_FRAG, + S_ELEMENTS, + S_PRIMITIVE, + S_OFFSET, + S_COUNT, + S_INSTANCES, + S_PROFILE, + S_VAO + ].concat(GL_STATE_NAMES); + + function checkKeys (dict) { + Object.keys(dict).forEach(function (key) { + check$1.command( + KEY_NAMES.indexOf(key) >= 0, + 'unknown parameter "' + key + '"', + env.commandStr); + }); + } + + checkKeys(staticOptions); + checkKeys(dynamicOptions); + }); + + var attribLocations = parseAttribLocations(options, attributes); + + var framebuffer = parseFramebuffer(options); + var viewportAndScissor = parseViewportScissor(options, framebuffer, env); + var draw = parseDraw(options, env); + var state = parseGLState(options, env); + var shader = parseProgram(options, env, attribLocations); + + function copyBox (name) { + var defn = viewportAndScissor[name]; + if (defn) { + state[name] = defn; + } + } + copyBox(S_VIEWPORT); + copyBox(propName(S_SCISSOR_BOX)); + + var dirty = Object.keys(state).length > 0; + + var result = { + framebuffer: framebuffer, + draw: draw, + shader: shader, + state: state, + dirty: dirty, + scopeVAO: null, + drawVAO: null, + useVAO: false, + attributes: {} + }; + + result.profile = parseProfile(options); + result.uniforms = parseUniforms(uniforms, env); + result.drawVAO = result.scopeVAO = parseVAO(options); + // special case: check if we can statically allocate a vertex array object for this program + if (!result.drawVAO && shader.program && !attribLocations && extensions.angle_instanced_arrays) { + var useVAO = true; + var staticBindings = shader.program.attributes.map(function (attr) { + var binding = attributes.static[attr]; + useVAO = useVAO && !!binding; + return binding + }); + if (useVAO && staticBindings.length > 0) { + var vao = attributeState.getVAO(attributeState.createVAO(staticBindings)); + result.drawVAO = new Declaration(null, null, null, function (env, scope) { + return env.link(vao) + }); + result.useVAO = true; + } + } + if (attribLocations) { + result.useVAO = true; + } else { + result.attributes = parseAttributes(attributes, env); + } + result.context = parseContext(context); + return result + } + + // =================================================== + // =================================================== + // COMMON UPDATE FUNCTIONS + // =================================================== + // =================================================== + function emitContext (env, scope, context) { + var shared = env.shared; + var CONTEXT = shared.context; + + var contextEnter = env.scope(); + + Object.keys(context).forEach(function (name) { + scope.save(CONTEXT, '.' + name); + var defn = context[name]; + var value = defn.append(env, scope); + if (Array.isArray(value)) { + contextEnter(CONTEXT, '.', name, '=[', value.join(), '];'); + } else { + contextEnter(CONTEXT, '.', name, '=', value, ';'); + } + }); + + scope(contextEnter); + } + + // =================================================== + // =================================================== + // COMMON DRAWING FUNCTIONS + // =================================================== + // =================================================== + function emitPollFramebuffer (env, scope, framebuffer, skipCheck) { + var shared = env.shared; + + var GL = shared.gl; + var FRAMEBUFFER_STATE = shared.framebuffer; + var EXT_DRAW_BUFFERS; + if (extDrawBuffers) { + EXT_DRAW_BUFFERS = scope.def(shared.extensions, '.webgl_draw_buffers'); + } + + var constants = env.constants; + + var DRAW_BUFFERS = constants.drawBuffer; + var BACK_BUFFER = constants.backBuffer; + + var NEXT; + if (framebuffer) { + NEXT = framebuffer.append(env, scope); + } else { + NEXT = scope.def(FRAMEBUFFER_STATE, '.next'); + } + + if (!skipCheck) { + scope('if(', NEXT, '!==', FRAMEBUFFER_STATE, '.cur){'); + } + scope( + 'if(', NEXT, '){', + GL, '.bindFramebuffer(', GL_FRAMEBUFFER$2, ',', NEXT, '.framebuffer);'); + if (extDrawBuffers) { + scope(EXT_DRAW_BUFFERS, '.drawBuffersWEBGL(', + DRAW_BUFFERS, '[', NEXT, '.colorAttachments.length]);'); + } + scope('}else{', + GL, '.bindFramebuffer(', GL_FRAMEBUFFER$2, ',null);'); + if (extDrawBuffers) { + scope(EXT_DRAW_BUFFERS, '.drawBuffersWEBGL(', BACK_BUFFER, ');'); + } + scope( + '}', + FRAMEBUFFER_STATE, '.cur=', NEXT, ';'); + if (!skipCheck) { + scope('}'); + } + } + + function emitPollState (env, scope, args) { + var shared = env.shared; + + var GL = shared.gl; + + var CURRENT_VARS = env.current; + var NEXT_VARS = env.next; + var CURRENT_STATE = shared.current; + var NEXT_STATE = shared.next; + + var block = env.cond(CURRENT_STATE, '.dirty'); + + GL_STATE_NAMES.forEach(function (prop) { + var param = propName(prop); + if (param in args.state) { + return + } + + var NEXT, CURRENT; + if (param in NEXT_VARS) { + NEXT = NEXT_VARS[param]; + CURRENT = CURRENT_VARS[param]; + var parts = loop(currentState[param].length, function (i) { + return block.def(NEXT, '[', i, ']') + }); + block(env.cond(parts.map(function (p, i) { + return p + '!==' + CURRENT + '[' + i + ']' + }).join('||')) + .then( + GL, '.', GL_VARIABLES[param], '(', parts, ');', + parts.map(function (p, i) { + return CURRENT + '[' + i + ']=' + p + }).join(';'), ';')); + } else { + NEXT = block.def(NEXT_STATE, '.', param); + var ifte = env.cond(NEXT, '!==', CURRENT_STATE, '.', param); + block(ifte); + if (param in GL_FLAGS) { + ifte( + env.cond(NEXT) + .then(GL, '.enable(', GL_FLAGS[param], ');') + .else(GL, '.disable(', GL_FLAGS[param], ');'), + CURRENT_STATE, '.', param, '=', NEXT, ';'); + } else { + ifte( + GL, '.', GL_VARIABLES[param], '(', NEXT, ');', + CURRENT_STATE, '.', param, '=', NEXT, ';'); + } + } + }); + if (Object.keys(args.state).length === 0) { + block(CURRENT_STATE, '.dirty=false;'); + } + scope(block); + } + + function emitSetOptions (env, scope, options, filter) { + var shared = env.shared; + var CURRENT_VARS = env.current; + var CURRENT_STATE = shared.current; + var GL = shared.gl; + sortState(Object.keys(options)).forEach(function (param) { + var defn = options[param]; + if (filter && !filter(defn)) { + return + } + var variable = defn.append(env, scope); + if (GL_FLAGS[param]) { + var flag = GL_FLAGS[param]; + if (isStatic(defn)) { + if (variable) { + scope(GL, '.enable(', flag, ');'); + } else { + scope(GL, '.disable(', flag, ');'); + } + } else { + scope(env.cond(variable) + .then(GL, '.enable(', flag, ');') + .else(GL, '.disable(', flag, ');')); + } + scope(CURRENT_STATE, '.', param, '=', variable, ';'); + } else if (isArrayLike(variable)) { + var CURRENT = CURRENT_VARS[param]; + scope( + GL, '.', GL_VARIABLES[param], '(', variable, ');', + variable.map(function (v, i) { + return CURRENT + '[' + i + ']=' + v + }).join(';'), ';'); + } else { + scope( + GL, '.', GL_VARIABLES[param], '(', variable, ');', + CURRENT_STATE, '.', param, '=', variable, ';'); + } + }); + } + + function injectExtensions (env, scope) { + if (extInstancing) { + env.instancing = scope.def( + env.shared.extensions, '.angle_instanced_arrays'); + } + } + + function emitProfile (env, scope, args, useScope, incrementCounter) { + var shared = env.shared; + var STATS = env.stats; + var CURRENT_STATE = shared.current; + var TIMER = shared.timer; + var profileArg = args.profile; + + function perfCounter () { + if (typeof performance === 'undefined') { + return 'Date.now()' + } else { + return 'performance.now()' + } + } + + var CPU_START, QUERY_COUNTER; + function emitProfileStart (block) { + CPU_START = scope.def(); + block(CPU_START, '=', perfCounter(), ';'); + if (typeof incrementCounter === 'string') { + block(STATS, '.count+=', incrementCounter, ';'); + } else { + block(STATS, '.count++;'); + } + if (timer) { + if (useScope) { + QUERY_COUNTER = scope.def(); + block(QUERY_COUNTER, '=', TIMER, '.getNumPendingQueries();'); + } else { + block(TIMER, '.beginQuery(', STATS, ');'); + } + } + } + + function emitProfileEnd (block) { + block(STATS, '.cpuTime+=', perfCounter(), '-', CPU_START, ';'); + if (timer) { + if (useScope) { + block(TIMER, '.pushScopeStats(', + QUERY_COUNTER, ',', + TIMER, '.getNumPendingQueries(),', + STATS, ');'); + } else { + block(TIMER, '.endQuery();'); + } + } + } + + function scopeProfile (value) { + var prev = scope.def(CURRENT_STATE, '.profile'); + scope(CURRENT_STATE, '.profile=', value, ';'); + scope.exit(CURRENT_STATE, '.profile=', prev, ';'); + } + + var USE_PROFILE; + if (profileArg) { + if (isStatic(profileArg)) { + if (profileArg.enable) { + emitProfileStart(scope); + emitProfileEnd(scope.exit); + scopeProfile('true'); + } else { + scopeProfile('false'); + } + return + } + USE_PROFILE = profileArg.append(env, scope); + scopeProfile(USE_PROFILE); + } else { + USE_PROFILE = scope.def(CURRENT_STATE, '.profile'); + } + + var start = env.block(); + emitProfileStart(start); + scope('if(', USE_PROFILE, '){', start, '}'); + var end = env.block(); + emitProfileEnd(end); + scope.exit('if(', USE_PROFILE, '){', end, '}'); + } + + function emitAttributes (env, scope, args, attributes, filter) { + var shared = env.shared; + + function typeLength (x) { + switch (x) { + case GL_FLOAT_VEC2: + case GL_INT_VEC2: + case GL_BOOL_VEC2: + return 2 + case GL_FLOAT_VEC3: + case GL_INT_VEC3: + case GL_BOOL_VEC3: + return 3 + case GL_FLOAT_VEC4: + case GL_INT_VEC4: + case GL_BOOL_VEC4: + return 4 + default: + return 1 + } + } + + function emitBindAttribute (ATTRIBUTE, size, record) { + var GL = shared.gl; + + var LOCATION = scope.def(ATTRIBUTE, '.location'); + var BINDING = scope.def(shared.attributes, '[', LOCATION, ']'); + + var STATE = record.state; + var BUFFER = record.buffer; + var CONST_COMPONENTS = [ + record.x, + record.y, + record.z, + record.w + ]; + + var COMMON_KEYS = [ + 'buffer', + 'normalized', + 'offset', + 'stride' + ]; + + function emitBuffer () { + scope( + 'if(!', BINDING, '.buffer){', + GL, '.enableVertexAttribArray(', LOCATION, ');}'); + + var TYPE = record.type; + var SIZE; + if (!record.size) { + SIZE = size; + } else { + SIZE = scope.def(record.size, '||', size); + } + + scope('if(', + BINDING, '.type!==', TYPE, '||', + BINDING, '.size!==', SIZE, '||', + COMMON_KEYS.map(function (key) { + return BINDING + '.' + key + '!==' + record[key] + }).join('||'), + '){', + GL, '.bindBuffer(', GL_ARRAY_BUFFER$2, ',', BUFFER, '.buffer);', + GL, '.vertexAttribPointer(', [ + LOCATION, + SIZE, + TYPE, + record.normalized, + record.stride, + record.offset + ], ');', + BINDING, '.type=', TYPE, ';', + BINDING, '.size=', SIZE, ';', + COMMON_KEYS.map(function (key) { + return BINDING + '.' + key + '=' + record[key] + ';' + }).join(''), + '}'); + + if (extInstancing) { + var DIVISOR = record.divisor; + scope( + 'if(', BINDING, '.divisor!==', DIVISOR, '){', + env.instancing, '.vertexAttribDivisorANGLE(', [LOCATION, DIVISOR], ');', + BINDING, '.divisor=', DIVISOR, ';}'); + } + } + + function emitConstant () { + scope( + 'if(', BINDING, '.buffer){', + GL, '.disableVertexAttribArray(', LOCATION, ');', + BINDING, '.buffer=null;', + '}if(', CUTE_COMPONENTS.map(function (c, i) { + return BINDING + '.' + c + '!==' + CONST_COMPONENTS[i] + }).join('||'), '){', + GL, '.vertexAttrib4f(', LOCATION, ',', CONST_COMPONENTS, ');', + CUTE_COMPONENTS.map(function (c, i) { + return BINDING + '.' + c + '=' + CONST_COMPONENTS[i] + ';' + }).join(''), + '}'); + } + + if (STATE === ATTRIB_STATE_POINTER) { + emitBuffer(); + } else if (STATE === ATTRIB_STATE_CONSTANT) { + emitConstant(); + } else { + scope('if(', STATE, '===', ATTRIB_STATE_POINTER, '){'); + emitBuffer(); + scope('}else{'); + emitConstant(); + scope('}'); + } + } + + attributes.forEach(function (attribute) { + var name = attribute.name; + var arg = args.attributes[name]; + var record; + if (arg) { + if (!filter(arg)) { + return + } + record = arg.append(env, scope); + } else { + if (!filter(SCOPE_DECL)) { + return + } + var scopeAttrib = env.scopeAttrib(name); + check$1.optional(function () { + env.assert(scope, + scopeAttrib + '.state', + 'missing attribute ' + name); + }); + record = {}; + Object.keys(new AttributeRecord()).forEach(function (key) { + record[key] = scope.def(scopeAttrib, '.', key); + }); + } + emitBindAttribute( + env.link(attribute), typeLength(attribute.info.type), record); + }); + } + + function emitUniforms (env, scope, args, uniforms, filter) { + var shared = env.shared; + var GL = shared.gl; + + var infix; + for (var i = 0; i < uniforms.length; ++i) { + var uniform = uniforms[i]; + var name = uniform.name; + var type = uniform.info.type; + var arg = args.uniforms[name]; + var UNIFORM = env.link(uniform); + var LOCATION = UNIFORM + '.location'; + + var VALUE; + if (arg) { + if (!filter(arg)) { + continue + } + if (isStatic(arg)) { + var value = arg.value; + check$1.command( + value !== null && typeof value !== 'undefined', + 'missing uniform "' + name + '"', env.commandStr); + if (type === GL_SAMPLER_2D || type === GL_SAMPLER_CUBE) { + check$1.command( + typeof value === 'function' && + ((type === GL_SAMPLER_2D && + (value._reglType === 'texture2d' || + value._reglType === 'framebuffer')) || + (type === GL_SAMPLER_CUBE && + (value._reglType === 'textureCube' || + value._reglType === 'framebufferCube'))), + 'invalid texture for uniform ' + name, env.commandStr); + var TEX_VALUE = env.link(value._texture || value.color[0]._texture); + scope(GL, '.uniform1i(', LOCATION, ',', TEX_VALUE + '.bind());'); + scope.exit(TEX_VALUE, '.unbind();'); + } else if ( + type === GL_FLOAT_MAT2 || + type === GL_FLOAT_MAT3 || + type === GL_FLOAT_MAT4) { + check$1.optional(function () { + check$1.command(isArrayLike(value), + 'invalid matrix for uniform ' + name, env.commandStr); + check$1.command( + (type === GL_FLOAT_MAT2 && value.length === 4) || + (type === GL_FLOAT_MAT3 && value.length === 9) || + (type === GL_FLOAT_MAT4 && value.length === 16), + 'invalid length for matrix uniform ' + name, env.commandStr); + }); + var MAT_VALUE = env.global.def('new Float32Array([' + + Array.prototype.slice.call(value) + '])'); + var dim = 2; + if (type === GL_FLOAT_MAT3) { + dim = 3; + } else if (type === GL_FLOAT_MAT4) { + dim = 4; + } + scope( + GL, '.uniformMatrix', dim, 'fv(', + LOCATION, ',false,', MAT_VALUE, ');'); + } else { + switch (type) { + case GL_FLOAT$8: + check$1.commandType(value, 'number', 'uniform ' + name, env.commandStr); + infix = '1f'; + break + case GL_FLOAT_VEC2: + check$1.command( + isArrayLike(value) && value.length === 2, + 'uniform ' + name, env.commandStr); + infix = '2f'; + break + case GL_FLOAT_VEC3: + check$1.command( + isArrayLike(value) && value.length === 3, + 'uniform ' + name, env.commandStr); + infix = '3f'; + break + case GL_FLOAT_VEC4: + check$1.command( + isArrayLike(value) && value.length === 4, + 'uniform ' + name, env.commandStr); + infix = '4f'; + break + case GL_BOOL: + check$1.commandType(value, 'boolean', 'uniform ' + name, env.commandStr); + infix = '1i'; + break + case GL_INT$3: + check$1.commandType(value, 'number', 'uniform ' + name, env.commandStr); + infix = '1i'; + break + case GL_BOOL_VEC2: + check$1.command( + isArrayLike(value) && value.length === 2, + 'uniform ' + name, env.commandStr); + infix = '2i'; + break + case GL_INT_VEC2: + check$1.command( + isArrayLike(value) && value.length === 2, + 'uniform ' + name, env.commandStr); + infix = '2i'; + break + case GL_BOOL_VEC3: + check$1.command( + isArrayLike(value) && value.length === 3, + 'uniform ' + name, env.commandStr); + infix = '3i'; + break + case GL_INT_VEC3: + check$1.command( + isArrayLike(value) && value.length === 3, + 'uniform ' + name, env.commandStr); + infix = '3i'; + break + case GL_BOOL_VEC4: + check$1.command( + isArrayLike(value) && value.length === 4, + 'uniform ' + name, env.commandStr); + infix = '4i'; + break + case GL_INT_VEC4: + check$1.command( + isArrayLike(value) && value.length === 4, + 'uniform ' + name, env.commandStr); + infix = '4i'; + break + } + scope(GL, '.uniform', infix, '(', LOCATION, ',', + isArrayLike(value) ? Array.prototype.slice.call(value) : value, + ');'); + } + continue + } else { + VALUE = arg.append(env, scope); + } + } else { + if (!filter(SCOPE_DECL)) { + continue + } + VALUE = scope.def(shared.uniforms, '[', stringStore.id(name), ']'); + } + + if (type === GL_SAMPLER_2D) { + check$1(!Array.isArray(VALUE), 'must specify a scalar prop for textures'); + scope( + 'if(', VALUE, '&&', VALUE, '._reglType==="framebuffer"){', + VALUE, '=', VALUE, '.color[0];', + '}'); + } else if (type === GL_SAMPLER_CUBE) { + check$1(!Array.isArray(VALUE), 'must specify a scalar prop for cube maps'); + scope( + 'if(', VALUE, '&&', VALUE, '._reglType==="framebufferCube"){', + VALUE, '=', VALUE, '.color[0];', + '}'); + } + + // perform type validation + check$1.optional(function () { + function emitCheck (pred, message) { + env.assert(scope, pred, + 'bad data or missing for uniform "' + name + '". ' + message); + } + + function checkType (type) { + check$1(!Array.isArray(VALUE), 'must not specify an array type for uniform'); + emitCheck( + 'typeof ' + VALUE + '==="' + type + '"', + 'invalid type, expected ' + type); + } + + function checkVector (n, type) { + if (Array.isArray(VALUE)) { + check$1(VALUE.length === n, 'must have length ' + n); + } else { + emitCheck( + shared.isArrayLike + '(' + VALUE + ')&&' + VALUE + '.length===' + n, + 'invalid vector, should have length ' + n, env.commandStr); + } + } + + function checkTexture (target) { + check$1(!Array.isArray(VALUE), 'must not specify a value type'); + emitCheck( + 'typeof ' + VALUE + '==="function"&&' + + VALUE + '._reglType==="texture' + + (target === GL_TEXTURE_2D$3 ? '2d' : 'Cube') + '"', + 'invalid texture type', env.commandStr); + } + + switch (type) { + case GL_INT$3: + checkType('number'); + break + case GL_INT_VEC2: + checkVector(2); + break + case GL_INT_VEC3: + checkVector(3); + break + case GL_INT_VEC4: + checkVector(4); + break + case GL_FLOAT$8: + checkType('number'); + break + case GL_FLOAT_VEC2: + checkVector(2); + break + case GL_FLOAT_VEC3: + checkVector(3); + break + case GL_FLOAT_VEC4: + checkVector(4); + break + case GL_BOOL: + checkType('boolean'); + break + case GL_BOOL_VEC2: + checkVector(2); + break + case GL_BOOL_VEC3: + checkVector(3); + break + case GL_BOOL_VEC4: + checkVector(4); + break + case GL_FLOAT_MAT2: + checkVector(4); + break + case GL_FLOAT_MAT3: + checkVector(9); + break + case GL_FLOAT_MAT4: + checkVector(16); + break + case GL_SAMPLER_2D: + checkTexture(GL_TEXTURE_2D$3); + break + case GL_SAMPLER_CUBE: + checkTexture(GL_TEXTURE_CUBE_MAP$2); + break + } + }); + + var unroll = 1; + switch (type) { + case GL_SAMPLER_2D: + case GL_SAMPLER_CUBE: + var TEX = scope.def(VALUE, '._texture'); + scope(GL, '.uniform1i(', LOCATION, ',', TEX, '.bind());'); + scope.exit(TEX, '.unbind();'); + continue + + case GL_INT$3: + case GL_BOOL: + infix = '1i'; + break + + case GL_INT_VEC2: + case GL_BOOL_VEC2: + infix = '2i'; + unroll = 2; + break + + case GL_INT_VEC3: + case GL_BOOL_VEC3: + infix = '3i'; + unroll = 3; + break + + case GL_INT_VEC4: + case GL_BOOL_VEC4: + infix = '4i'; + unroll = 4; + break + + case GL_FLOAT$8: + infix = '1f'; + break + + case GL_FLOAT_VEC2: + infix = '2f'; + unroll = 2; + break + + case GL_FLOAT_VEC3: + infix = '3f'; + unroll = 3; + break + + case GL_FLOAT_VEC4: + infix = '4f'; + unroll = 4; + break + + case GL_FLOAT_MAT2: + infix = 'Matrix2fv'; + break + + case GL_FLOAT_MAT3: + infix = 'Matrix3fv'; + break + + case GL_FLOAT_MAT4: + infix = 'Matrix4fv'; + break + } + + scope(GL, '.uniform', infix, '(', LOCATION, ','); + if (infix.charAt(0) === 'M') { + var matSize = Math.pow(type - GL_FLOAT_MAT2 + 2, 2); + var STORAGE = env.global.def('new Float32Array(', matSize, ')'); + if (Array.isArray(VALUE)) { + scope( + 'false,(', + loop(matSize, function (i) { + return STORAGE + '[' + i + ']=' + VALUE[i] + }), ',', STORAGE, ')'); + } else { + scope( + 'false,(Array.isArray(', VALUE, ')||', VALUE, ' instanceof Float32Array)?', VALUE, ':(', + loop(matSize, function (i) { + return STORAGE + '[' + i + ']=' + VALUE + '[' + i + ']' + }), ',', STORAGE, ')'); + } + } else if (unroll > 1) { + scope(loop(unroll, function (i) { + return Array.isArray(VALUE) ? VALUE[i] : VALUE + '[' + i + ']' + })); + } else { + check$1(!Array.isArray(VALUE), 'uniform value must not be an array'); + scope(VALUE); + } + scope(');'); + } + } + + function emitDraw (env, outer, inner, args) { + var shared = env.shared; + var GL = shared.gl; + var DRAW_STATE = shared.draw; + + var drawOptions = args.draw; + + function emitElements () { + var defn = drawOptions.elements; + var ELEMENTS; + var scope = outer; + if (defn) { + if ((defn.contextDep && args.contextDynamic) || defn.propDep) { + scope = inner; + } + ELEMENTS = defn.append(env, scope); + } else { + ELEMENTS = scope.def(DRAW_STATE, '.', S_ELEMENTS); + } + if (ELEMENTS) { + scope( + 'if(' + ELEMENTS + ')' + + GL + '.bindBuffer(' + GL_ELEMENT_ARRAY_BUFFER$1 + ',' + ELEMENTS + '.buffer.buffer);'); + } + return ELEMENTS + } + + function emitCount () { + var defn = drawOptions.count; + var COUNT; + var scope = outer; + if (defn) { + if ((defn.contextDep && args.contextDynamic) || defn.propDep) { + scope = inner; + } + COUNT = defn.append(env, scope); + check$1.optional(function () { + if (defn.MISSING) { + env.assert(outer, 'false', 'missing vertex count'); + } + if (defn.DYNAMIC) { + env.assert(scope, COUNT + '>=0', 'missing vertex count'); + } + }); + } else { + COUNT = scope.def(DRAW_STATE, '.', S_COUNT); + check$1.optional(function () { + env.assert(scope, COUNT + '>=0', 'missing vertex count'); + }); + } + return COUNT + } + + var ELEMENTS = emitElements(); + function emitValue (name) { + var defn = drawOptions[name]; + if (defn) { + if ((defn.contextDep && args.contextDynamic) || defn.propDep) { + return defn.append(env, inner) + } else { + return defn.append(env, outer) + } + } else { + return outer.def(DRAW_STATE, '.', name) + } + } + + var PRIMITIVE = emitValue(S_PRIMITIVE); + var OFFSET = emitValue(S_OFFSET); + + var COUNT = emitCount(); + if (typeof COUNT === 'number') { + if (COUNT === 0) { + return + } + } else { + inner('if(', COUNT, '){'); + inner.exit('}'); + } + + var INSTANCES, EXT_INSTANCING; + if (extInstancing) { + INSTANCES = emitValue(S_INSTANCES); + EXT_INSTANCING = env.instancing; + } + + var ELEMENT_TYPE = ELEMENTS + '.type'; + + var elementsStatic = drawOptions.elements && isStatic(drawOptions.elements); + + function emitInstancing () { + function drawElements () { + inner(EXT_INSTANCING, '.drawElementsInstancedANGLE(', [ + PRIMITIVE, + COUNT, + ELEMENT_TYPE, + OFFSET + '<<((' + ELEMENT_TYPE + '-' + GL_UNSIGNED_BYTE$8 + ')>>1)', + INSTANCES + ], ');'); + } + + function drawArrays () { + inner(EXT_INSTANCING, '.drawArraysInstancedANGLE(', + [PRIMITIVE, OFFSET, COUNT, INSTANCES], ');'); + } + + if (ELEMENTS) { + if (!elementsStatic) { + inner('if(', ELEMENTS, '){'); + drawElements(); + inner('}else{'); + drawArrays(); + inner('}'); + } else { + drawElements(); + } + } else { + drawArrays(); + } + } + + function emitRegular () { + function drawElements () { + inner(GL + '.drawElements(' + [ + PRIMITIVE, + COUNT, + ELEMENT_TYPE, + OFFSET + '<<((' + ELEMENT_TYPE + '-' + GL_UNSIGNED_BYTE$8 + ')>>1)' + ] + ');'); + } + + function drawArrays () { + inner(GL + '.drawArrays(' + [PRIMITIVE, OFFSET, COUNT] + ');'); + } + + if (ELEMENTS) { + if (!elementsStatic) { + inner('if(', ELEMENTS, '){'); + drawElements(); + inner('}else{'); + drawArrays(); + inner('}'); + } else { + drawElements(); + } + } else { + drawArrays(); + } + } + + if (extInstancing && (typeof INSTANCES !== 'number' || INSTANCES >= 0)) { + if (typeof INSTANCES === 'string') { + inner('if(', INSTANCES, '>0){'); + emitInstancing(); + inner('}else if(', INSTANCES, '<0){'); + emitRegular(); + inner('}'); + } else { + emitInstancing(); + } + } else { + emitRegular(); + } + } + + function createBody (emitBody, parentEnv, args, program, count) { + var env = createREGLEnvironment(); + var scope = env.proc('body', count); + check$1.optional(function () { + env.commandStr = parentEnv.commandStr; + env.command = env.link(parentEnv.commandStr); + }); + if (extInstancing) { + env.instancing = scope.def( + env.shared.extensions, '.angle_instanced_arrays'); + } + emitBody(env, scope, args, program); + return env.compile().body + } + + // =================================================== + // =================================================== + // DRAW PROC + // =================================================== + // =================================================== + function emitDrawBody (env, draw, args, program) { + injectExtensions(env, draw); + if (args.useVAO) { + if (args.drawVAO) { + draw(env.shared.vao, '.setVAO(', args.drawVAO.append(env, draw), ');'); + } else { + draw(env.shared.vao, '.setVAO(', env.shared.vao, '.targetVAO);'); + } + } else { + draw(env.shared.vao, '.setVAO(null);'); + emitAttributes(env, draw, args, program.attributes, function () { + return true + }); + } + emitUniforms(env, draw, args, program.uniforms, function () { + return true + }); + emitDraw(env, draw, draw, args); + } + + function emitDrawProc (env, args) { + var draw = env.proc('draw', 1); + + injectExtensions(env, draw); + + emitContext(env, draw, args.context); + emitPollFramebuffer(env, draw, args.framebuffer); + + emitPollState(env, draw, args); + emitSetOptions(env, draw, args.state); + + emitProfile(env, draw, args, false, true); + + var program = args.shader.progVar.append(env, draw); + draw(env.shared.gl, '.useProgram(', program, '.program);'); + + if (args.shader.program) { + emitDrawBody(env, draw, args, args.shader.program); + } else { + draw(env.shared.vao, '.setVAO(null);'); + var drawCache = env.global.def('{}'); + var PROG_ID = draw.def(program, '.id'); + var CACHED_PROC = draw.def(drawCache, '[', PROG_ID, ']'); + draw( + env.cond(CACHED_PROC) + .then(CACHED_PROC, '.call(this,a0);') + .else( + CACHED_PROC, '=', drawCache, '[', PROG_ID, ']=', + env.link(function (program) { + return createBody(emitDrawBody, env, args, program, 1) + }), '(', program, ');', + CACHED_PROC, '.call(this,a0);')); + } + + if (Object.keys(args.state).length > 0) { + draw(env.shared.current, '.dirty=true;'); + } + } + + // =================================================== + // =================================================== + // BATCH PROC + // =================================================== + // =================================================== + + function emitBatchDynamicShaderBody (env, scope, args, program) { + env.batchId = 'a1'; + + injectExtensions(env, scope); + + function all () { + return true + } + + emitAttributes(env, scope, args, program.attributes, all); + emitUniforms(env, scope, args, program.uniforms, all); + emitDraw(env, scope, scope, args); + } + + function emitBatchBody (env, scope, args, program) { + injectExtensions(env, scope); + + var contextDynamic = args.contextDep; + + var BATCH_ID = scope.def(); + var PROP_LIST = 'a0'; + var NUM_PROPS = 'a1'; + var PROPS = scope.def(); + env.shared.props = PROPS; + env.batchId = BATCH_ID; + + var outer = env.scope(); + var inner = env.scope(); + + scope( + outer.entry, + 'for(', BATCH_ID, '=0;', BATCH_ID, '<', NUM_PROPS, ';++', BATCH_ID, '){', + PROPS, '=', PROP_LIST, '[', BATCH_ID, '];', + inner, + '}', + outer.exit); + + function isInnerDefn (defn) { + return ((defn.contextDep && contextDynamic) || defn.propDep) + } + + function isOuterDefn (defn) { + return !isInnerDefn(defn) + } + + if (args.needsContext) { + emitContext(env, inner, args.context); + } + if (args.needsFramebuffer) { + emitPollFramebuffer(env, inner, args.framebuffer); + } + emitSetOptions(env, inner, args.state, isInnerDefn); + + if (args.profile && isInnerDefn(args.profile)) { + emitProfile(env, inner, args, false, true); + } + + if (!program) { + var progCache = env.global.def('{}'); + var PROGRAM = args.shader.progVar.append(env, inner); + var PROG_ID = inner.def(PROGRAM, '.id'); + var CACHED_PROC = inner.def(progCache, '[', PROG_ID, ']'); + inner( + env.shared.gl, '.useProgram(', PROGRAM, '.program);', + 'if(!', CACHED_PROC, '){', + CACHED_PROC, '=', progCache, '[', PROG_ID, ']=', + env.link(function (program) { + return createBody( + emitBatchDynamicShaderBody, env, args, program, 2) + }), '(', PROGRAM, ');}', + CACHED_PROC, '.call(this,a0[', BATCH_ID, '],', BATCH_ID, ');'); + } else { + if (args.useVAO) { + if (args.drawVAO) { + if (isInnerDefn(args.drawVAO)) { + // vao is a prop + inner(env.shared.vao, '.setVAO(', args.drawVAO.append(env, inner), ');'); + } else { + // vao is invariant + outer(env.shared.vao, '.setVAO(', args.drawVAO.append(env, outer), ');'); + } + } else { + // scoped vao binding + outer(env.shared.vao, '.setVAO(', env.shared.vao, '.targetVAO);'); + } + } else { + outer(env.shared.vao, '.setVAO(null);'); + emitAttributes(env, outer, args, program.attributes, isOuterDefn); + emitAttributes(env, inner, args, program.attributes, isInnerDefn); + } + emitUniforms(env, outer, args, program.uniforms, isOuterDefn); + emitUniforms(env, inner, args, program.uniforms, isInnerDefn); + emitDraw(env, outer, inner, args); + } + } + + function emitBatchProc (env, args) { + var batch = env.proc('batch', 2); + env.batchId = '0'; + + injectExtensions(env, batch); + + // Check if any context variables depend on props + var contextDynamic = false; + var needsContext = true; + Object.keys(args.context).forEach(function (name) { + contextDynamic = contextDynamic || args.context[name].propDep; + }); + if (!contextDynamic) { + emitContext(env, batch, args.context); + needsContext = false; + } + + // framebuffer state affects framebufferWidth/height context vars + var framebuffer = args.framebuffer; + var needsFramebuffer = false; + if (framebuffer) { + if (framebuffer.propDep) { + contextDynamic = needsFramebuffer = true; + } else if (framebuffer.contextDep && contextDynamic) { + needsFramebuffer = true; + } + if (!needsFramebuffer) { + emitPollFramebuffer(env, batch, framebuffer); + } + } else { + emitPollFramebuffer(env, batch, null); + } + + // viewport is weird because it can affect context vars + if (args.state.viewport && args.state.viewport.propDep) { + contextDynamic = true; + } + + function isInnerDefn (defn) { + return (defn.contextDep && contextDynamic) || defn.propDep + } + + // set webgl options + emitPollState(env, batch, args); + emitSetOptions(env, batch, args.state, function (defn) { + return !isInnerDefn(defn) + }); + + if (!args.profile || !isInnerDefn(args.profile)) { + emitProfile(env, batch, args, false, 'a1'); + } + + // Save these values to args so that the batch body routine can use them + args.contextDep = contextDynamic; + args.needsContext = needsContext; + args.needsFramebuffer = needsFramebuffer; + + // determine if shader is dynamic + var progDefn = args.shader.progVar; + if ((progDefn.contextDep && contextDynamic) || progDefn.propDep) { + emitBatchBody( + env, + batch, + args, + null); + } else { + var PROGRAM = progDefn.append(env, batch); + batch(env.shared.gl, '.useProgram(', PROGRAM, '.program);'); + if (args.shader.program) { + emitBatchBody( + env, + batch, + args, + args.shader.program); + } else { + batch(env.shared.vao, '.setVAO(null);'); + var batchCache = env.global.def('{}'); + var PROG_ID = batch.def(PROGRAM, '.id'); + var CACHED_PROC = batch.def(batchCache, '[', PROG_ID, ']'); + batch( + env.cond(CACHED_PROC) + .then(CACHED_PROC, '.call(this,a0,a1);') + .else( + CACHED_PROC, '=', batchCache, '[', PROG_ID, ']=', + env.link(function (program) { + return createBody(emitBatchBody, env, args, program, 2) + }), '(', PROGRAM, ');', + CACHED_PROC, '.call(this,a0,a1);')); + } + } + + if (Object.keys(args.state).length > 0) { + batch(env.shared.current, '.dirty=true;'); + } + } + + // =================================================== + // =================================================== + // SCOPE COMMAND + // =================================================== + // =================================================== + function emitScopeProc (env, args) { + var scope = env.proc('scope', 3); + env.batchId = 'a2'; + + var shared = env.shared; + var CURRENT_STATE = shared.current; + + emitContext(env, scope, args.context); + + if (args.framebuffer) { + args.framebuffer.append(env, scope); + } + + sortState(Object.keys(args.state)).forEach(function (name) { + var defn = args.state[name]; + var value = defn.append(env, scope); + if (isArrayLike(value)) { + value.forEach(function (v, i) { + scope.set(env.next[name], '[' + i + ']', v); + }); + } else { + scope.set(shared.next, '.' + name, value); + } + }); + + emitProfile(env, scope, args, true, true) + + ;[S_ELEMENTS, S_OFFSET, S_COUNT, S_INSTANCES, S_PRIMITIVE].forEach( + function (opt) { + var variable = args.draw[opt]; + if (!variable) { + return + } + scope.set(shared.draw, '.' + opt, '' + variable.append(env, scope)); + }); + + Object.keys(args.uniforms).forEach(function (opt) { + var value = args.uniforms[opt].append(env, scope); + if (Array.isArray(value)) { + value = '[' + value.join() + ']'; + } + scope.set( + shared.uniforms, + '[' + stringStore.id(opt) + ']', + value); + }); + + Object.keys(args.attributes).forEach(function (name) { + var record = args.attributes[name].append(env, scope); + var scopeAttrib = env.scopeAttrib(name); + Object.keys(new AttributeRecord()).forEach(function (prop) { + scope.set(scopeAttrib, '.' + prop, record[prop]); + }); + }); + + if (args.scopeVAO) { + scope.set(shared.vao, '.targetVAO', args.scopeVAO.append(env, scope)); + } + + function saveShader (name) { + var shader = args.shader[name]; + if (shader) { + scope.set(shared.shader, '.' + name, shader.append(env, scope)); + } + } + saveShader(S_VERT); + saveShader(S_FRAG); + + if (Object.keys(args.state).length > 0) { + scope(CURRENT_STATE, '.dirty=true;'); + scope.exit(CURRENT_STATE, '.dirty=true;'); + } + + scope('a1(', env.shared.context, ',a0,', env.batchId, ');'); + } + + function isDynamicObject (object) { + if (typeof object !== 'object' || isArrayLike(object)) { + return + } + var props = Object.keys(object); + for (var i = 0; i < props.length; ++i) { + if (dynamic.isDynamic(object[props[i]])) { + return true + } + } + return false + } + + function splatObject (env, options, name) { + var object = options.static[name]; + if (!object || !isDynamicObject(object)) { + return + } + + var globals = env.global; + var keys = Object.keys(object); + var thisDep = false; + var contextDep = false; + var propDep = false; + var objectRef = env.global.def('{}'); + keys.forEach(function (key) { + var value = object[key]; + if (dynamic.isDynamic(value)) { + if (typeof value === 'function') { + value = object[key] = dynamic.unbox(value); + } + var deps = createDynamicDecl(value, null); + thisDep = thisDep || deps.thisDep; + propDep = propDep || deps.propDep; + contextDep = contextDep || deps.contextDep; + } else { + globals(objectRef, '.', key, '='); + switch (typeof value) { + case 'number': + globals(value); + break + case 'string': + globals('"', value, '"'); + break + case 'object': + if (Array.isArray(value)) { + globals('[', value.join(), ']'); + } + break + default: + globals(env.link(value)); + break + } + globals(';'); + } + }); + + function appendBlock (env, block) { + keys.forEach(function (key) { + var value = object[key]; + if (!dynamic.isDynamic(value)) { + return + } + var ref = env.invoke(block, value); + block(objectRef, '.', key, '=', ref, ';'); + }); + } + + options.dynamic[name] = new dynamic.DynamicVariable(DYN_THUNK, { + thisDep: thisDep, + contextDep: contextDep, + propDep: propDep, + ref: objectRef, + append: appendBlock + }); + delete options.static[name]; + } + + // =========================================================================== + // =========================================================================== + // MAIN DRAW COMMAND + // =========================================================================== + // =========================================================================== + function compileCommand (options, attributes, uniforms, context, stats) { + var env = createREGLEnvironment(); + + // link stats, so that we can easily access it in the program. + env.stats = env.link(stats); + + // splat options and attributes to allow for dynamic nested properties + Object.keys(attributes.static).forEach(function (key) { + splatObject(env, attributes, key); + }); + NESTED_OPTIONS.forEach(function (name) { + splatObject(env, options, name); + }); + + var args = parseArguments(options, attributes, uniforms, context, env); + + emitDrawProc(env, args); + emitScopeProc(env, args); + emitBatchProc(env, args); + + return extend(env.compile(), { + destroy: function () { + args.shader.program.destroy(); + } + }) + } + + // =========================================================================== + // =========================================================================== + // POLL / REFRESH + // =========================================================================== + // =========================================================================== + return { + next: nextState, + current: currentState, + procs: (function () { + var env = createREGLEnvironment(); + var poll = env.proc('poll'); + var refresh = env.proc('refresh'); + var common = env.block(); + poll(common); + refresh(common); + + var shared = env.shared; + var GL = shared.gl; + var NEXT_STATE = shared.next; + var CURRENT_STATE = shared.current; + + common(CURRENT_STATE, '.dirty=false;'); + + emitPollFramebuffer(env, poll); + emitPollFramebuffer(env, refresh, null, true); + + // Refresh updates all attribute state changes + var INSTANCING; + if (extInstancing) { + INSTANCING = env.link(extInstancing); + } + + // update vertex array bindings + if (extensions.oes_vertex_array_object) { + refresh(env.link(extensions.oes_vertex_array_object), '.bindVertexArrayOES(null);'); + } + for (var i = 0; i < limits.maxAttributes; ++i) { + var BINDING = refresh.def(shared.attributes, '[', i, ']'); + var ifte = env.cond(BINDING, '.buffer'); + ifte.then( + GL, '.enableVertexAttribArray(', i, ');', + GL, '.bindBuffer(', + GL_ARRAY_BUFFER$2, ',', + BINDING, '.buffer.buffer);', + GL, '.vertexAttribPointer(', + i, ',', + BINDING, '.size,', + BINDING, '.type,', + BINDING, '.normalized,', + BINDING, '.stride,', + BINDING, '.offset);' + ).else( + GL, '.disableVertexAttribArray(', i, ');', + GL, '.vertexAttrib4f(', + i, ',', + BINDING, '.x,', + BINDING, '.y,', + BINDING, '.z,', + BINDING, '.w);', + BINDING, '.buffer=null;'); + refresh(ifte); + if (extInstancing) { + refresh( + INSTANCING, '.vertexAttribDivisorANGLE(', + i, ',', + BINDING, '.divisor);'); + } + } + refresh( + env.shared.vao, '.currentVAO=null;', + env.shared.vao, '.setVAO(', env.shared.vao, '.targetVAO);'); + + Object.keys(GL_FLAGS).forEach(function (flag) { + var cap = GL_FLAGS[flag]; + var NEXT = common.def(NEXT_STATE, '.', flag); + var block = env.block(); + block('if(', NEXT, '){', + GL, '.enable(', cap, ')}else{', + GL, '.disable(', cap, ')}', + CURRENT_STATE, '.', flag, '=', NEXT, ';'); + refresh(block); + poll( + 'if(', NEXT, '!==', CURRENT_STATE, '.', flag, '){', + block, + '}'); + }); + + Object.keys(GL_VARIABLES).forEach(function (name) { + var func = GL_VARIABLES[name]; + var init = currentState[name]; + var NEXT, CURRENT; + var block = env.block(); + block(GL, '.', func, '('); + if (isArrayLike(init)) { + var n = init.length; + NEXT = env.global.def(NEXT_STATE, '.', name); + CURRENT = env.global.def(CURRENT_STATE, '.', name); + block( + loop(n, function (i) { + return NEXT + '[' + i + ']' + }), ');', + loop(n, function (i) { + return CURRENT + '[' + i + ']=' + NEXT + '[' + i + '];' + }).join('')); + poll( + 'if(', loop(n, function (i) { + return NEXT + '[' + i + ']!==' + CURRENT + '[' + i + ']' + }).join('||'), '){', + block, + '}'); + } else { + NEXT = common.def(NEXT_STATE, '.', name); + CURRENT = common.def(CURRENT_STATE, '.', name); + block( + NEXT, ');', + CURRENT_STATE, '.', name, '=', NEXT, ';'); + poll( + 'if(', NEXT, '!==', CURRENT, '){', + block, + '}'); + } + refresh(block); + }); + + return env.compile() + })(), + compile: compileCommand + } +} + +function stats () { + return { + vaoCount: 0, + bufferCount: 0, + elementsCount: 0, + framebufferCount: 0, + shaderCount: 0, + textureCount: 0, + cubeCount: 0, + renderbufferCount: 0, + maxTextureUnits: 0 + } +} + +var GL_QUERY_RESULT_EXT = 0x8866; +var GL_QUERY_RESULT_AVAILABLE_EXT = 0x8867; +var GL_TIME_ELAPSED_EXT = 0x88BF; + +var createTimer = function (gl, extensions) { + if (!extensions.ext_disjoint_timer_query) { + return null + } + + // QUERY POOL BEGIN + var queryPool = []; + function allocQuery () { + return queryPool.pop() || extensions.ext_disjoint_timer_query.createQueryEXT() + } + function freeQuery (query) { + queryPool.push(query); + } + // QUERY POOL END + + var pendingQueries = []; + function beginQuery (stats) { + var query = allocQuery(); + extensions.ext_disjoint_timer_query.beginQueryEXT(GL_TIME_ELAPSED_EXT, query); + pendingQueries.push(query); + pushScopeStats(pendingQueries.length - 1, pendingQueries.length, stats); + } + + function endQuery () { + extensions.ext_disjoint_timer_query.endQueryEXT(GL_TIME_ELAPSED_EXT); + } + + // + // Pending stats pool. + // + function PendingStats () { + this.startQueryIndex = -1; + this.endQueryIndex = -1; + this.sum = 0; + this.stats = null; + } + var pendingStatsPool = []; + function allocPendingStats () { + return pendingStatsPool.pop() || new PendingStats() + } + function freePendingStats (pendingStats) { + pendingStatsPool.push(pendingStats); + } + // Pending stats pool end + + var pendingStats = []; + function pushScopeStats (start, end, stats) { + var ps = allocPendingStats(); + ps.startQueryIndex = start; + ps.endQueryIndex = end; + ps.sum = 0; + ps.stats = stats; + pendingStats.push(ps); + } + + // we should call this at the beginning of the frame, + // in order to update gpuTime + var timeSum = []; + var queryPtr = []; + function update () { + var ptr, i; + + var n = pendingQueries.length; + if (n === 0) { + return + } + + // Reserve space + queryPtr.length = Math.max(queryPtr.length, n + 1); + timeSum.length = Math.max(timeSum.length, n + 1); + timeSum[0] = 0; + queryPtr[0] = 0; + + // Update all pending timer queries + var queryTime = 0; + ptr = 0; + for (i = 0; i < pendingQueries.length; ++i) { + var query = pendingQueries[i]; + if (extensions.ext_disjoint_timer_query.getQueryObjectEXT(query, GL_QUERY_RESULT_AVAILABLE_EXT)) { + queryTime += extensions.ext_disjoint_timer_query.getQueryObjectEXT(query, GL_QUERY_RESULT_EXT); + freeQuery(query); + } else { + pendingQueries[ptr++] = query; + } + timeSum[i + 1] = queryTime; + queryPtr[i + 1] = ptr; + } + pendingQueries.length = ptr; + + // Update all pending stat queries + ptr = 0; + for (i = 0; i < pendingStats.length; ++i) { + var stats = pendingStats[i]; + var start = stats.startQueryIndex; + var end = stats.endQueryIndex; + stats.sum += timeSum[end] - timeSum[start]; + var startPtr = queryPtr[start]; + var endPtr = queryPtr[end]; + if (endPtr === startPtr) { + stats.stats.gpuTime += stats.sum / 1e6; + freePendingStats(stats); + } else { + stats.startQueryIndex = startPtr; + stats.endQueryIndex = endPtr; + pendingStats[ptr++] = stats; + } + } + pendingStats.length = ptr; + } + + return { + beginQuery: beginQuery, + endQuery: endQuery, + pushScopeStats: pushScopeStats, + update: update, + getNumPendingQueries: function () { + return pendingQueries.length + }, + clear: function () { + queryPool.push.apply(queryPool, pendingQueries); + for (var i = 0; i < queryPool.length; i++) { + extensions.ext_disjoint_timer_query.deleteQueryEXT(queryPool[i]); + } + pendingQueries.length = 0; + queryPool.length = 0; + }, + restore: function () { + pendingQueries.length = 0; + queryPool.length = 0; + } + } +}; + +var GL_COLOR_BUFFER_BIT = 16384; +var GL_DEPTH_BUFFER_BIT = 256; +var GL_STENCIL_BUFFER_BIT = 1024; + +var GL_ARRAY_BUFFER = 34962; + +var CONTEXT_LOST_EVENT = 'webglcontextlost'; +var CONTEXT_RESTORED_EVENT = 'webglcontextrestored'; + +var DYN_PROP = 1; +var DYN_CONTEXT = 2; +var DYN_STATE = 3; + +function find (haystack, needle) { + for (var i = 0; i < haystack.length; ++i) { + if (haystack[i] === needle) { + return i + } + } + return -1 +} + +function wrapREGL (args) { + var config = parseArgs(args); + if (!config) { + return null + } + + var gl = config.gl; + var glAttributes = gl.getContextAttributes(); + var contextLost = gl.isContextLost(); + + var extensionState = createExtensionCache(gl, config); + if (!extensionState) { + return null + } + + var stringStore = createStringStore(); + var stats$$1 = stats(); + var extensions = extensionState.extensions; + var timer = createTimer(gl, extensions); + + var START_TIME = clock(); + var WIDTH = gl.drawingBufferWidth; + var HEIGHT = gl.drawingBufferHeight; + + var contextState = { + tick: 0, + time: 0, + viewportWidth: WIDTH, + viewportHeight: HEIGHT, + framebufferWidth: WIDTH, + framebufferHeight: HEIGHT, + drawingBufferWidth: WIDTH, + drawingBufferHeight: HEIGHT, + pixelRatio: config.pixelRatio + }; + var uniformState = {}; + var drawState = { + elements: null, + primitive: 4, // GL_TRIANGLES + count: -1, + offset: 0, + instances: -1 + }; + + var limits = wrapLimits(gl, extensions); + var bufferState = wrapBufferState( + gl, + stats$$1, + config, + destroyBuffer); + var attributeState = wrapAttributeState( + gl, + extensions, + limits, + stats$$1, + bufferState); + function destroyBuffer (buffer) { + return attributeState.destroyBuffer(buffer) + } + var elementState = wrapElementsState(gl, extensions, bufferState, stats$$1); + var shaderState = wrapShaderState(gl, stringStore, stats$$1, config); + var textureState = createTextureSet( + gl, + extensions, + limits, + function () { core.procs.poll(); }, + contextState, + stats$$1, + config); + var renderbufferState = wrapRenderbuffers(gl, extensions, limits, stats$$1, config); + var framebufferState = wrapFBOState( + gl, + extensions, + limits, + textureState, + renderbufferState, + stats$$1); + var core = reglCore( + gl, + stringStore, + extensions, + limits, + bufferState, + elementState, + textureState, + framebufferState, + uniformState, + attributeState, + shaderState, + drawState, + contextState, + timer, + config); + var readPixels = wrapReadPixels( + gl, + framebufferState, + core.procs.poll, + contextState, + glAttributes, extensions, limits); + + var nextState = core.next; + var canvas = gl.canvas; + + var rafCallbacks = []; + var lossCallbacks = []; + var restoreCallbacks = []; + var destroyCallbacks = [config.onDestroy]; + + var activeRAF = null; + function handleRAF () { + if (rafCallbacks.length === 0) { + if (timer) { + timer.update(); + } + activeRAF = null; + return + } + + // schedule next animation frame + activeRAF = raf.next(handleRAF); + + // poll for changes + poll(); + + // fire a callback for all pending rafs + for (var i = rafCallbacks.length - 1; i >= 0; --i) { + var cb = rafCallbacks[i]; + if (cb) { + cb(contextState, null, 0); + } + } + + // flush all pending webgl calls + gl.flush(); + + // poll GPU timers *after* gl.flush so we don't delay command dispatch + if (timer) { + timer.update(); + } + } + + function startRAF () { + if (!activeRAF && rafCallbacks.length > 0) { + activeRAF = raf.next(handleRAF); + } + } + + function stopRAF () { + if (activeRAF) { + raf.cancel(handleRAF); + activeRAF = null; + } + } + + function handleContextLoss (event) { + event.preventDefault(); + + // set context lost flag + contextLost = true; + + // pause request animation frame + stopRAF(); + + // lose context + lossCallbacks.forEach(function (cb) { + cb(); + }); + } + + function handleContextRestored (event) { + // clear error code + gl.getError(); + + // clear context lost flag + contextLost = false; + + // refresh state + extensionState.restore(); + shaderState.restore(); + bufferState.restore(); + textureState.restore(); + renderbufferState.restore(); + framebufferState.restore(); + attributeState.restore(); + if (timer) { + timer.restore(); + } + + // refresh state + core.procs.refresh(); + + // restart RAF + startRAF(); + + // restore context + restoreCallbacks.forEach(function (cb) { + cb(); + }); + } + + if (canvas) { + canvas.addEventListener(CONTEXT_LOST_EVENT, handleContextLoss, false); + canvas.addEventListener(CONTEXT_RESTORED_EVENT, handleContextRestored, false); + } + + function destroy () { + rafCallbacks.length = 0; + stopRAF(); + + if (canvas) { + canvas.removeEventListener(CONTEXT_LOST_EVENT, handleContextLoss); + canvas.removeEventListener(CONTEXT_RESTORED_EVENT, handleContextRestored); + } + + shaderState.clear(); + framebufferState.clear(); + renderbufferState.clear(); + textureState.clear(); + elementState.clear(); + bufferState.clear(); + attributeState.clear(); + + if (timer) { + timer.clear(); + } + + destroyCallbacks.forEach(function (cb) { + cb(); + }); + } + + function compileProcedure (options) { + check$1(!!options, 'invalid args to regl({...})'); + check$1.type(options, 'object', 'invalid args to regl({...})'); + + function flattenNestedOptions (options) { + var result = extend({}, options); + delete result.uniforms; + delete result.attributes; + delete result.context; + delete result.vao; + + if ('stencil' in result && result.stencil.op) { + result.stencil.opBack = result.stencil.opFront = result.stencil.op; + delete result.stencil.op; + } + + function merge (name) { + if (name in result) { + var child = result[name]; + delete result[name]; + Object.keys(child).forEach(function (prop) { + result[name + '.' + prop] = child[prop]; + }); + } + } + merge('blend'); + merge('depth'); + merge('cull'); + merge('stencil'); + merge('polygonOffset'); + merge('scissor'); + merge('sample'); + + if ('vao' in options) { + result.vao = options.vao; + } + + return result + } + + function separateDynamic (object, useArrays) { + var staticItems = {}; + var dynamicItems = {}; + Object.keys(object).forEach(function (option) { + var value = object[option]; + if (dynamic.isDynamic(value)) { + dynamicItems[option] = dynamic.unbox(value, option); + return + } else if (useArrays && Array.isArray(value)) { + for (var i = 0; i < value.length; ++i) { + if (dynamic.isDynamic(value[i])) { + dynamicItems[option] = dynamic.unbox(value, option); + return + } + } + } + staticItems[option] = value; + }); + return { + dynamic: dynamicItems, + static: staticItems + } + } + + // Treat context variables separate from other dynamic variables + var context = separateDynamic(options.context || {}, true); + var uniforms = separateDynamic(options.uniforms || {}, true); + var attributes = separateDynamic(options.attributes || {}, false); + var opts = separateDynamic(flattenNestedOptions(options), false); + + var stats$$1 = { + gpuTime: 0.0, + cpuTime: 0.0, + count: 0 + }; + + var compiled = core.compile(opts, attributes, uniforms, context, stats$$1); + + var draw = compiled.draw; + var batch = compiled.batch; + var scope = compiled.scope; + + // FIXME: we should modify code generation for batch commands so this + // isn't necessary + var EMPTY_ARRAY = []; + function reserve (count) { + while (EMPTY_ARRAY.length < count) { + EMPTY_ARRAY.push(null); + } + return EMPTY_ARRAY + } + + function REGLCommand (args, body) { + var i; + if (contextLost) { + check$1.raise('context lost'); + } + if (typeof args === 'function') { + return scope.call(this, null, args, 0) + } else if (typeof body === 'function') { + if (typeof args === 'number') { + for (i = 0; i < args; ++i) { + scope.call(this, null, body, i); + } + } else if (Array.isArray(args)) { + for (i = 0; i < args.length; ++i) { + scope.call(this, args[i], body, i); + } + } else { + return scope.call(this, args, body, 0) + } + } else if (typeof args === 'number') { + if (args > 0) { + return batch.call(this, reserve(args | 0), args | 0) + } + } else if (Array.isArray(args)) { + if (args.length) { + return batch.call(this, args, args.length) + } + } else { + return draw.call(this, args) + } + } + + return extend(REGLCommand, { + stats: stats$$1, + destroy: function () { + compiled.destroy(); + } + }) + } + + var setFBO = framebufferState.setFBO = compileProcedure({ + framebuffer: dynamic.define.call(null, DYN_PROP, 'framebuffer') + }); + + function clearImpl (_, options) { + var clearFlags = 0; + core.procs.poll(); + + var c = options.color; + if (c) { + gl.clearColor(+c[0] || 0, +c[1] || 0, +c[2] || 0, +c[3] || 0); + clearFlags |= GL_COLOR_BUFFER_BIT; + } + if ('depth' in options) { + gl.clearDepth(+options.depth); + clearFlags |= GL_DEPTH_BUFFER_BIT; + } + if ('stencil' in options) { + gl.clearStencil(options.stencil | 0); + clearFlags |= GL_STENCIL_BUFFER_BIT; + } + + check$1(!!clearFlags, 'called regl.clear with no buffer specified'); + gl.clear(clearFlags); + } + + function clear (options) { + check$1( + typeof options === 'object' && options, + 'regl.clear() takes an object as input'); + if ('framebuffer' in options) { + if (options.framebuffer && + options.framebuffer_reglType === 'framebufferCube') { + for (var i = 0; i < 6; ++i) { + setFBO(extend({ + framebuffer: options.framebuffer.faces[i] + }, options), clearImpl); + } + } else { + setFBO(options, clearImpl); + } + } else { + clearImpl(null, options); + } + } + + function frame (cb) { + check$1.type(cb, 'function', 'regl.frame() callback must be a function'); + rafCallbacks.push(cb); + + function cancel () { + // FIXME: should we check something other than equals cb here? + // what if a user calls frame twice with the same callback... + // + var i = find(rafCallbacks, cb); + check$1(i >= 0, 'cannot cancel a frame twice'); + function pendingCancel () { + var index = find(rafCallbacks, pendingCancel); + rafCallbacks[index] = rafCallbacks[rafCallbacks.length - 1]; + rafCallbacks.length -= 1; + if (rafCallbacks.length <= 0) { + stopRAF(); + } + } + rafCallbacks[i] = pendingCancel; + } + + startRAF(); + + return { + cancel: cancel + } + } + + // poll viewport + function pollViewport () { + var viewport = nextState.viewport; + var scissorBox = nextState.scissor_box; + viewport[0] = viewport[1] = scissorBox[0] = scissorBox[1] = 0; + contextState.viewportWidth = + contextState.framebufferWidth = + contextState.drawingBufferWidth = + viewport[2] = + scissorBox[2] = gl.drawingBufferWidth; + contextState.viewportHeight = + contextState.framebufferHeight = + contextState.drawingBufferHeight = + viewport[3] = + scissorBox[3] = gl.drawingBufferHeight; + } + + function poll () { + contextState.tick += 1; + contextState.time = now(); + pollViewport(); + core.procs.poll(); + } + + function refresh () { + textureState.refresh(); + pollViewport(); + core.procs.refresh(); + if (timer) { + timer.update(); + } + } + + function now () { + return (clock() - START_TIME) / 1000.0 + } + + refresh(); + + function addListener (event, callback) { + check$1.type(callback, 'function', 'listener callback must be a function'); + + var callbacks; + switch (event) { + case 'frame': + return frame(callback) + case 'lost': + callbacks = lossCallbacks; + break + case 'restore': + callbacks = restoreCallbacks; + break + case 'destroy': + callbacks = destroyCallbacks; + break + default: + check$1.raise('invalid event, must be one of frame,lost,restore,destroy'); + } + + callbacks.push(callback); + return { + cancel: function () { + for (var i = 0; i < callbacks.length; ++i) { + if (callbacks[i] === callback) { + callbacks[i] = callbacks[callbacks.length - 1]; + callbacks.pop(); + return + } + } + } + } + } + + var regl = extend(compileProcedure, { + // Clear current FBO + clear: clear, + + // Short cuts for dynamic variables + prop: dynamic.define.bind(null, DYN_PROP), + context: dynamic.define.bind(null, DYN_CONTEXT), + this: dynamic.define.bind(null, DYN_STATE), + + // executes an empty draw command + draw: compileProcedure({}), + + // Resources + buffer: function (options) { + return bufferState.create(options, GL_ARRAY_BUFFER, false, false) + }, + elements: function (options) { + return elementState.create(options, false) + }, + texture: textureState.create2D, + cube: textureState.createCube, + renderbuffer: renderbufferState.create, + framebuffer: framebufferState.create, + framebufferCube: framebufferState.createCube, + vao: attributeState.createVAO, + + // Expose context attributes + attributes: glAttributes, + + // Frame rendering + frame: frame, + on: addListener, + + // System limits + limits: limits, + hasExtension: function (name) { + return limits.extensions.indexOf(name.toLowerCase()) >= 0 + }, + + // Read pixels + read: readPixels, + + // Destroy regl and all associated resources + destroy: destroy, + + // Direct GL state manipulation + _gl: gl, + _refresh: refresh, + + poll: function () { + poll(); + if (timer) { + timer.update(); + } + }, + + // Current time + now: now, + + // regl Statistics Information + stats: stats$$1 + }); + + config.onDone(null, regl); + + return regl +} + +return wrapREGL; + +}))); + +}(regl$1)); + +var regl = regl$1.exports; + +/** + * @see https://github.com/regl-project/regl/blob/gh-pages/API.md#attributes + */ +var ReglAttribute = /*#__PURE__*/function () { + function ReglAttribute(gl, options) { + _classCallCheck(this, ReglAttribute); + + this.attribute = void 0; + this.buffer = void 0; + var buffer = options.buffer, + offset = options.offset, + stride = options.stride, + normalized = options.normalized, + size = options.size, + divisor = options.divisor; + this.buffer = buffer; + this.attribute = { + buffer: buffer.get(), + offset: offset || 0, + stride: stride || 0, + normalized: normalized || false, + divisor: divisor || 0 + }; + + if (size) { + this.attribute.size = size; + } + } + + _createClass(ReglAttribute, [{ + key: "get", + value: function get() { + return this.attribute; + } + }, { + key: "updateBuffer", + value: function updateBuffer(options) { + this.buffer.subData(options); + } + }, { + key: "destroy", + value: function destroy() { + this.buffer.destroy(); + } + }]); + + return ReglAttribute; +}(); + +var _primitiveMap$1, _usageMap, _dataTypeMap, _formatMap$1, _mipmapMap, _filterMap$1, _wrapModeMap$1, _colorSpaceMap, _depthFuncMap$1, _blendEquationMap$1, _blendFuncMap$1, _stencilFuncMap, _stencilOpMap, _cullFaceMap; +// @see https://github.com/regl-project/regl/blob/gh-pages/lib/constants/primitives.json +var primitiveMap$1 = (_primitiveMap$1 = {}, _defineProperty(_primitiveMap$1, gl.POINTS, 'points'), _defineProperty(_primitiveMap$1, gl.LINES, 'lines'), _defineProperty(_primitiveMap$1, gl.LINE_LOOP, 'line loop'), _defineProperty(_primitiveMap$1, gl.LINE_STRIP, 'line strip'), _defineProperty(_primitiveMap$1, gl.TRIANGLES, 'triangles'), _defineProperty(_primitiveMap$1, gl.TRIANGLE_FAN, 'triangle fan'), _defineProperty(_primitiveMap$1, gl.TRIANGLE_STRIP, 'triangle strip'), _primitiveMap$1); +var usageMap = (_usageMap = {}, _defineProperty(_usageMap, gl.STATIC_DRAW, 'static'), _defineProperty(_usageMap, gl.DYNAMIC_DRAW, 'dynamic'), _defineProperty(_usageMap, gl.STREAM_DRAW, 'stream'), _usageMap); +var dataTypeMap = (_dataTypeMap = {}, _defineProperty(_dataTypeMap, gl.BYTE, 'int8'), _defineProperty(_dataTypeMap, gl.UNSIGNED_INT, 'int16'), _defineProperty(_dataTypeMap, gl.INT, 'int32'), _defineProperty(_dataTypeMap, gl.UNSIGNED_BYTE, 'uint8'), _defineProperty(_dataTypeMap, gl.UNSIGNED_SHORT, 'uint16'), _defineProperty(_dataTypeMap, gl.UNSIGNED_INT, 'uint32'), _defineProperty(_dataTypeMap, gl.FLOAT, 'float'), _dataTypeMap); +var formatMap$1 = (_formatMap$1 = {}, _defineProperty(_formatMap$1, gl.ALPHA, 'alpha'), _defineProperty(_formatMap$1, gl.LUMINANCE, 'luminance'), _defineProperty(_formatMap$1, gl.LUMINANCE_ALPHA, 'luminance alpha'), _defineProperty(_formatMap$1, gl.RGB, 'rgb'), _defineProperty(_formatMap$1, gl.RGBA, 'rgba'), _defineProperty(_formatMap$1, gl.RGBA4, 'rgba4'), _defineProperty(_formatMap$1, gl.RGB5_A1, 'rgb5 a1'), _defineProperty(_formatMap$1, gl.RGB565, 'rgb565'), _defineProperty(_formatMap$1, gl.DEPTH_COMPONENT, 'depth'), _defineProperty(_formatMap$1, gl.DEPTH_STENCIL, 'depth stencil'), _formatMap$1); +var mipmapMap = (_mipmapMap = {}, _defineProperty(_mipmapMap, gl.DONT_CARE, 'dont care'), _defineProperty(_mipmapMap, gl.NICEST, 'nice'), _defineProperty(_mipmapMap, gl.FASTEST, 'fast'), _mipmapMap); +var filterMap$1 = (_filterMap$1 = {}, _defineProperty(_filterMap$1, gl.NEAREST, 'nearest'), _defineProperty(_filterMap$1, gl.LINEAR, 'linear'), _defineProperty(_filterMap$1, gl.LINEAR_MIPMAP_LINEAR, 'mipmap'), _defineProperty(_filterMap$1, gl.NEAREST_MIPMAP_LINEAR, 'nearest mipmap linear'), _defineProperty(_filterMap$1, gl.LINEAR_MIPMAP_NEAREST, 'linear mipmap nearest'), _defineProperty(_filterMap$1, gl.NEAREST_MIPMAP_NEAREST, 'nearest mipmap nearest'), _filterMap$1); +var wrapModeMap$1 = (_wrapModeMap$1 = {}, _defineProperty(_wrapModeMap$1, gl.REPEAT, 'repeat'), _defineProperty(_wrapModeMap$1, gl.CLAMP_TO_EDGE, 'clamp'), _defineProperty(_wrapModeMap$1, gl.MIRRORED_REPEAT, 'mirror'), _wrapModeMap$1); +var colorSpaceMap = (_colorSpaceMap = {}, _defineProperty(_colorSpaceMap, gl.NONE, 'none'), _defineProperty(_colorSpaceMap, gl.BROWSER_DEFAULT_WEBGL, 'browser'), _colorSpaceMap); +var depthFuncMap$1 = (_depthFuncMap$1 = {}, _defineProperty(_depthFuncMap$1, gl.NEVER, 'never'), _defineProperty(_depthFuncMap$1, gl.ALWAYS, 'always'), _defineProperty(_depthFuncMap$1, gl.LESS, 'less'), _defineProperty(_depthFuncMap$1, gl.LEQUAL, 'lequal'), _defineProperty(_depthFuncMap$1, gl.GREATER, 'greater'), _defineProperty(_depthFuncMap$1, gl.GEQUAL, 'gequal'), _defineProperty(_depthFuncMap$1, gl.EQUAL, 'equal'), _defineProperty(_depthFuncMap$1, gl.NOTEQUAL, 'notequal'), _depthFuncMap$1); +var blendEquationMap$1 = (_blendEquationMap$1 = {}, _defineProperty(_blendEquationMap$1, gl.FUNC_ADD, 'add'), _defineProperty(_blendEquationMap$1, gl.MIN_EXT, 'min'), _defineProperty(_blendEquationMap$1, gl.MAX_EXT, 'max'), _defineProperty(_blendEquationMap$1, gl.FUNC_SUBTRACT, 'subtract'), _defineProperty(_blendEquationMap$1, gl.FUNC_REVERSE_SUBTRACT, 'reverse subtract'), _blendEquationMap$1); +var blendFuncMap$1 = (_blendFuncMap$1 = {}, _defineProperty(_blendFuncMap$1, gl.ZERO, 'zero'), _defineProperty(_blendFuncMap$1, gl.ONE, 'one'), _defineProperty(_blendFuncMap$1, gl.SRC_COLOR, 'src color'), _defineProperty(_blendFuncMap$1, gl.ONE_MINUS_SRC_COLOR, 'one minus src color'), _defineProperty(_blendFuncMap$1, gl.SRC_ALPHA, 'src alpha'), _defineProperty(_blendFuncMap$1, gl.ONE_MINUS_SRC_ALPHA, 'one minus src alpha'), _defineProperty(_blendFuncMap$1, gl.DST_COLOR, 'dst color'), _defineProperty(_blendFuncMap$1, gl.ONE_MINUS_DST_COLOR, 'one minus dst color'), _defineProperty(_blendFuncMap$1, gl.DST_ALPHA, 'dst alpha'), _defineProperty(_blendFuncMap$1, gl.ONE_MINUS_DST_ALPHA, 'one minus dst alpha'), _defineProperty(_blendFuncMap$1, gl.CONSTANT_COLOR, 'constant color'), _defineProperty(_blendFuncMap$1, gl.ONE_MINUS_CONSTANT_COLOR, 'one minus constant color'), _defineProperty(_blendFuncMap$1, gl.CONSTANT_ALPHA, 'constant alpha'), _defineProperty(_blendFuncMap$1, gl.ONE_MINUS_CONSTANT_ALPHA, 'one minus constant alpha'), _defineProperty(_blendFuncMap$1, gl.SRC_ALPHA_SATURATE, 'src alpha saturate'), _blendFuncMap$1); +var stencilFuncMap = (_stencilFuncMap = {}, _defineProperty(_stencilFuncMap, gl.NEVER, 'never'), _defineProperty(_stencilFuncMap, gl.ALWAYS, 'always'), _defineProperty(_stencilFuncMap, gl.LESS, 'less'), _defineProperty(_stencilFuncMap, gl.LEQUAL, 'lequal'), _defineProperty(_stencilFuncMap, gl.GREATER, 'greater'), _defineProperty(_stencilFuncMap, gl.GEQUAL, 'gequal'), _defineProperty(_stencilFuncMap, gl.EQUAL, 'equal'), _defineProperty(_stencilFuncMap, gl.NOTEQUAL, 'notequal'), _stencilFuncMap); +var stencilOpMap = (_stencilOpMap = {}, _defineProperty(_stencilOpMap, gl.ZERO, 'zero'), _defineProperty(_stencilOpMap, gl.KEEP, 'keep'), _defineProperty(_stencilOpMap, gl.REPLACE, 'replace'), _defineProperty(_stencilOpMap, gl.INVERT, 'invert'), _defineProperty(_stencilOpMap, gl.INCR, 'increment'), _defineProperty(_stencilOpMap, gl.DECR, 'decrement'), _defineProperty(_stencilOpMap, gl.INCR_WRAP, 'increment wrap'), _defineProperty(_stencilOpMap, gl.DECR_WRAP, 'decrement wrap'), _stencilOpMap); +var cullFaceMap = (_cullFaceMap = {}, _defineProperty(_cullFaceMap, gl.FRONT, 'front'), _defineProperty(_cullFaceMap, gl.BACK, 'back'), _cullFaceMap); + +/** + * adaptor for regl.Buffer + * @see https://github.com/regl-project/regl/blob/gh-pages/API.md#buffers + */ + +var ReglBuffer = /*#__PURE__*/function () { + function ReglBuffer(reGl, options) { + _classCallCheck(this, ReglBuffer); + + this.buffer = void 0; + var data = options.data, + usage = options.usage, + type = options.type; // @ts-ignore + + this.buffer = reGl.buffer({ + data: data, + usage: usageMap[usage || gl.STATIC_DRAW], + type: dataTypeMap[type || gl.UNSIGNED_BYTE] // length: 0, + + }); + } + + _createClass(ReglBuffer, [{ + key: "get", + value: function get() { + return this.buffer; + } + }, { + key: "destroy", + value: function destroy() {// this.buffer.destroy(); + } + }, { + key: "subData", + value: function subData(_ref) { + var data = _ref.data, + offset = _ref.offset; + // @ts-ignore + this.buffer.subdata(data, offset); + } + }]); + + return ReglBuffer; +}(); + +function _arrayWithoutHoles(arr) { + if (Array.isArray(arr)) return _arrayLikeToArray$5(arr); +} + +function _iterableToArray(iter) { + if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); +} + +function _nonIterableSpread() { + throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); +} + +function _toConsumableArray(arr) { + return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray$5(arr) || _nonIterableSpread(); +} + +/** Used as references for various `Number` constants. */ +var MAX_SAFE_INTEGER = 9007199254740991; +/** `Object#toString` result references. */ + +var argsTag = '[object Arguments]'; +var arrayTag = '[object Array]'; +var boolTag = '[object Boolean]'; +var dateTag = '[object Date]'; +var errorTag = '[object Error]'; +var funcTag = '[object Function]'; +var mapTag = '[object Map]'; +var numberTag = '[object Number]'; +var objectTag = '[object Object]'; +var regexpTag = '[object RegExp]'; +var setTag$1 = '[object Set]'; +var stringTag = '[object String]'; +var weakMapTag = '[object WeakMap]'; +var arrayBufferTag = '[object ArrayBuffer]'; +var dataViewTag = '[object DataView]'; +var float32Tag = '[object Float32Array]'; +var float64Tag = '[object Float64Array]'; +var int8Tag = '[object Int8Array]'; +var int16Tag = '[object Int16Array]'; +var int32Tag = '[object Int32Array]'; +var uint8Tag = '[object Uint8Array]'; +var uint8ClampedTag = '[object Uint8ClampedArray]'; +var uint16Tag = '[object Uint16Array]'; +var uint32Tag = '[object Uint32Array]'; +/** Used to identify `toStringTag` values of typed arrays. */ + +var typedArrayTags = {}; +typedArrayTags[float32Tag] = typedArrayTags[float64Tag] = typedArrayTags[int8Tag] = typedArrayTags[int16Tag] = typedArrayTags[int32Tag] = typedArrayTags[uint8Tag] = typedArrayTags[uint8ClampedTag] = typedArrayTags[uint16Tag] = typedArrayTags[uint32Tag] = true; +typedArrayTags[argsTag] = typedArrayTags[arrayTag] = typedArrayTags[arrayBufferTag] = typedArrayTags[boolTag] = typedArrayTags[dataViewTag] = typedArrayTags[dateTag] = typedArrayTags[errorTag] = typedArrayTags[funcTag] = typedArrayTags[mapTag] = typedArrayTags[numberTag] = typedArrayTags[objectTag] = typedArrayTags[regexpTag] = typedArrayTags[setTag$1] = typedArrayTags[stringTag] = typedArrayTags[weakMapTag] = false; +/** Used for built-in method references. */ + + +var objectProto = Object.prototype; +/** + * Used to resolve the + * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring) + * of values. + */ + +var objectToString = objectProto.toString; +/** + * The base implementation of `_.isTypedArray` without Node.js optimizations. + * + * @private + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is a typed array, else `false`. + */ + +function baseIsTypedArray(value) { + return isObjectLike(value) && isLength(value.length) && !!typedArrayTags[objectToString.call(value)]; +} + +function isLength(value) { + return typeof value === 'number' && value > -1 && value % 1 === 0 && value <= MAX_SAFE_INTEGER; +} + +function isObjectLike(value) { + return !!value && _typeof$1(value) === 'object'; +} +/** + * Checks if `value` is classified as a typed array. + * + * @static + * @memberOf _ + * @since 3.0.0 + * @category Lang + * @param {*} value The value to check. + * @returns {boolean} Returns `true` if `value` is a typed array, else `false`. + * @example + * + * _.isTypedArray(new Uint8Array); + * // => true + * + * _.isTypedArray([]); + * // => false + */ + + +var isTypedArray = baseIsTypedArray; + +function ownKeys$5(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; } + +function _objectSpread$5(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$5(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$5(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; } + +/* babel-plugin-inline-import './shaders/quad.vert.glsl' */ +var quadVert = "attribute vec3 a_Position;\nattribute vec2 a_TexCoord;\n\nvarying vec2 v_TexCoord;\n\nvoid main() {\n gl_Position = vec4(a_Position, 1.0);\n v_TexCoord = a_TexCoord;\n}"; +var textureId = 0; +/** + * adaptor for regl.DrawCommand + */ + +var ReglComputeModel = /*#__PURE__*/function () { + function ReglComputeModel(reGl, context) { + var _this = this; + + _classCallCheck(this, ReglComputeModel); + + this.reGl = reGl; + this.context = context; + this.entity = createEntity(); + this.texFBO = void 0; + this.computeCommand = void 0; + this.textureCache = {}; + this.outputTextureName = void 0; + this.swapOutputTextureName = void 0; + this.compiledPingpong = void 0; + this.dynamicPingpong = void 0; + var uniforms = {}; + this.context.uniforms.forEach(function (uniform) { + var name = uniform.name, + type = uniform.type, + data = uniform.data, + isReferer = uniform.isReferer, + storageClass = uniform.storageClass; // store data with a 2D texture + + if (storageClass === STORAGE_CLASS.StorageBuffer) { + if (!isReferer) { + _this.textureCache[name] = _this.calcDataTexture(name, type, data); + var _this$textureCache$na = _this.textureCache[name], + width = _this$textureCache$na.textureWidth, + isOutput = _this$textureCache$na.isOutput; + uniforms["".concat(name, "Size")] = [width, width]; + + if (isOutput) { + _this.outputTextureName = name; + + if (_this.context.needPingpong) { + _this.outputTextureName = "".concat(name, "Output"); + _this.textureCache[_this.outputTextureName] = _this.calcDataTexture(name, type, data); + } + } + } else { + // @ts-ignore + _this.textureCache[name] = { + data: undefined + }; // refer to another kernel's output, + // the referred kernel may not have been initialized, so we use dynamic way here + + uniforms["".concat(name, "Size")] = function () { + return (// @ts-ignore + data.compiledBundle.context.output.textureSize + ); + }; + } + + uniforms[name] = function () { + + return _this.textureCache[name].texture; + }; + } else if (storageClass === STORAGE_CLASS.Uniform) { + if (data && (Array.isArray(data) || isTypedArray(data)) && data.length > 16) { + // up to mat4 which includes 16 elements + throw new Error("invalid data type ".concat(type)); + } // get uniform dynamically + + + uniforms[name] = function () { + return uniform.data; + }; + } + }); + + var _this$getOuputDataTex = this.getOuputDataTexture(), + textureWidth = _this$getOuputDataTex.textureWidth, + texelCount = _this$getOuputDataTex.texelCount; // 传入 output 纹理尺寸和数据长度，便于多余的 texel 提前退出 + + + uniforms.u_OutputTextureSize = [textureWidth, textureWidth]; + uniforms.u_OutputTexelCount = texelCount; // 保存在 Kernel 的上下文中，供其他 Kernel 引用 + + this.context.output.textureSize = [textureWidth, textureWidth]; + var drawParams = { + attributes: { + a_Position: [[-1, 1, 0], [-1, -1, 0], [1, 1, 0], [1, -1, 0]], + a_TexCoord: [[0, 1], [0, 0], [1, 1], [1, 0]] + }, + frag: "#ifdef GL_FRAGMENT_PRECISION_HIGH\n precision highp float;\n#else\n precision mediump float;\n#endif\n".concat(this.context.shader), + uniforms: uniforms, + vert: quadVert, + // TODO: use a fullscreen triangle instead. + primitive: 'triangle strip', + count: 4 + }; + this.computeCommand = this.reGl(drawParams); + } + + _createClass(ReglComputeModel, [{ + key: "run", + value: function run() { + var _this2 = this; + + if (this.context.maxIteration > 1 && this.context.needPingpong) { + this.compiledPingpong = true; + } // need pingpong when (@in@out and execute(10)) or use `setBinding('out', self)` + // this.needPingpong = + // !!(this.context.maxIteration > 1 && this.context.needPingpong); + // if (this.relativeOutputTextureNames.length) { + // const { id, texture } = this.getOuputDataTexture(); + // this.relativeOutputTextureNames.forEach((name) => { + // this.textureCache[name].id = id; + // this.textureCache[name].texture = texture; + // }); + // this.swap(); + // } + + + if (this.compiledPingpong || this.dynamicPingpong) { + this.swap(); + } + + this.texFBO = this.reGl.framebuffer({ + color: this.getOuputDataTexture().texture + }); + this.texFBO.use(function () { + _this2.computeCommand(); + }); + } + }, { + key: "readData", + value: function () { + var _readData = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee() { + var _this3 = this; + + var pixels, _this$getOuputDataTex2, originalDataLength, elementsPerTexel, _this$getOuputDataTex3, typedArrayConstructor, formattedPixels, i; + + return regenerator.wrap(function _callee$(_context) { + while (1) { + switch (_context.prev = _context.next) { + case 0: + this.reGl({ + framebuffer: this.texFBO + })(function () { + pixels = _this3.reGl.read(); + }); // @ts-ignore + + if (!pixels) { + _context.next = 6; + break; + } + + _this$getOuputDataTex2 = this.getOuputDataTexture(), originalDataLength = _this$getOuputDataTex2.originalDataLength, elementsPerTexel = _this$getOuputDataTex2.elementsPerTexel, _this$getOuputDataTex3 = _this$getOuputDataTex2.typedArrayConstructor, typedArrayConstructor = _this$getOuputDataTex3 === void 0 ? Float32Array : _this$getOuputDataTex3; + formattedPixels = []; + + if (elementsPerTexel !== 4) { + for (i = 0; i < pixels.length; i += 4) { + if (elementsPerTexel === 1) { + formattedPixels.push(pixels[i]); + } else if (elementsPerTexel === 2) { + formattedPixels.push(pixels[i], pixels[i + 1]); + } else { + formattedPixels.push(pixels[i], pixels[i + 1], pixels[i + 2]); + } + } + } else { + // @ts-ignore + formattedPixels = pixels; + } // 截取多余的部分 + // @ts-ignore + + + return _context.abrupt("return", new typedArrayConstructor(formattedPixels.slice(0, originalDataLength))); + + case 6: + return _context.abrupt("return", new Float32Array()); + + case 7: + case "end": + return _context.stop(); + } + } + }, _callee, this); + })); + + function readData() { + return _readData.apply(this, arguments); + } + + return readData; + }() + }, { + key: "confirmInput", + value: function confirmInput(model, inputName) { + var inputModel; // refer to self, same as pingpong + + if (this.entity === model.entity) { + this.dynamicPingpong = true; + inputModel = this; + } else { + inputModel = model; + } + + this.textureCache[inputName].id = inputModel.getOuputDataTexture().id; + this.textureCache[inputName].texture = inputModel.getOuputDataTexture().texture; + } + }, { + key: "updateUniform", + value: function updateUniform() {// already get uniform's data dynamically when created, do nothing here + } + }, { + key: "updateBuffer", + value: function updateBuffer(bufferName, data) { + // regenerate data texture + var buffer = this.context.uniforms.find(function (_ref) { + var name = _ref.name; + return name === bufferName; + }); + + if (buffer) { + var _this$calcDataTexture = this.calcDataTexture(bufferName, buffer.type, data), + texture = _this$calcDataTexture.texture, + paddingData = _this$calcDataTexture.data; // TODO: destroy outdated texture + + + this.textureCache[bufferName].data = paddingData; + this.textureCache[bufferName].texture = texture; + } + } + }, { + key: "destroy", + value: function destroy() {// regl will destroy all resources + } + }, { + key: "swap", + value: function swap() { + if (!this.swapOutputTextureName) { + this.createSwapOutputDataTexture(); + } + + if (this.compiledPingpong) { + var outputTextureUniformName = this.context.output.name; + this.textureCache[outputTextureUniformName].id = this.getOuputDataTexture().id; + this.textureCache[outputTextureUniformName].texture = this.getOuputDataTexture().texture; + } + + var tmp = this.outputTextureName; + this.outputTextureName = this.swapOutputTextureName; + this.swapOutputTextureName = tmp; + } + }, { + key: "getOuputDataTexture", + value: function getOuputDataTexture() { + return this.textureCache[this.outputTextureName]; + } + }, { + key: "createSwapOutputDataTexture", + value: function createSwapOutputDataTexture() { + var texture = this.cloneDataTexture(this.getOuputDataTexture()); + this.swapOutputTextureName = "".concat(this.entity, "-swap"); + this.textureCache[this.swapOutputTextureName] = texture; + } + }, { + key: "cloneDataTexture", + value: function cloneDataTexture(texture) { + var data = texture.data, + textureWidth = texture.textureWidth; + return _objectSpread$5(_objectSpread$5({}, texture), {}, { + id: textureId++, + // @ts-ignore + texture: this.reGl.texture({ + width: textureWidth, + height: textureWidth, + data: data, + type: 'float' + }) + }); + } + }, { + key: "calcDataTexture", + value: function calcDataTexture(name, type, data) { + var elementsPerTexel = 1; + + if (type === AST_TOKEN_TYPES.Vector4FloatArray) { + elementsPerTexel = 4; + } // 用 0 补全不足 vec4 的部分 + + + var paddingData = []; + + for (var i = 0; i < data.length; i += elementsPerTexel) { + if (elementsPerTexel === 1) { + paddingData.push(data[i], 0, 0, 0); + } else if (elementsPerTexel === 2) { + paddingData.push(data[i], data[i + 1], 0, 0); + } else if (elementsPerTexel === 3) { + paddingData.push(data[i], data[i + 1], data[i + 2], 0); + } else if (elementsPerTexel === 4) { + paddingData.push(data[i], data[i + 1], data[i + 2], data[i + 3]); + } + } // 使用纹理存储，例如 Array(8) 使用 3 * 3 纹理，末尾空白使用 0 填充 + + + var originalDataLength = data.length; + var texelCount = Math.ceil(originalDataLength / elementsPerTexel); + var width = Math.ceil(Math.sqrt(texelCount)); + var paddingTexelCount = width * width; + + if (texelCount < paddingTexelCount) { + paddingData.push.apply(paddingData, _toConsumableArray(new Array((paddingTexelCount - texelCount) * 4).fill(0))); + } + + var texture = this.reGl.texture({ + width: width, + height: width, + data: paddingData, + type: 'float' + }); + return { + id: textureId++, + data: paddingData, + originalDataLength: originalDataLength, + typedArrayConstructor: isTypedArray(data) ? data.constructor : undefined, + textureWidth: width, + texture: texture, + texelCount: texelCount, + elementsPerTexel: elementsPerTexel, + isOutput: name === this.context.output.name + }; + } + }]); + + return ReglComputeModel; +}(); + +/** + * @see https://github.com/regl-project/regl/blob/gh-pages/API.md#elements + */ + +var ReglElements = /*#__PURE__*/function () { + function ReglElements(reGl, options) { + _classCallCheck(this, ReglElements); + + this.elements = void 0; + var data = options.data, + usage = options.usage, + type = options.type, + count = options.count; + this.elements = reGl.elements({ + data: data, + usage: usageMap[usage || gl.STATIC_DRAW], + type: dataTypeMap[type || gl.UNSIGNED_BYTE], + count: count + }); + } + + _createClass(ReglElements, [{ + key: "get", + value: function get() { + return this.elements; + } + }, { + key: "subData", + value: function subData(_ref) { + var data = _ref.data; + this.elements.subdata(data); + } + }, { + key: "destroy", + value: function destroy() { + this.elements.destroy(); + } + }]); + + return ReglElements; +}(); + +/** + * adaptor for regl.Framebuffer + * @see https://github.com/regl-project/regl/blob/gh-pages/API.md#framebuffers + */ +var ReglFramebuffer = /*#__PURE__*/function () { + function ReglFramebuffer(reGl, options) { + _classCallCheck(this, ReglFramebuffer); + + this.framebuffer = void 0; + var width = options.width, + height = options.height, + color = options.color, + colors = options.colors; + options.depth; + options.stencil; + var framebufferOptions = { + width: width, + height: height + }; + + if (Array.isArray(colors)) { + framebufferOptions.colors = colors.map(function (c) { + return c.get(); + }); + } + + if (color && typeof color !== 'boolean') { + framebufferOptions.color = color.get(); + } // TODO: depth & stencil + + + this.framebuffer = reGl.framebuffer(framebufferOptions); + } + + _createClass(ReglFramebuffer, [{ + key: "get", + value: function get() { + return this.framebuffer; + } + }, { + key: "destroy", + value: function destroy() { + this.framebuffer.destroy(); + } + }, { + key: "resize", + value: function resize(_ref) { + var width = _ref.width, + height = _ref.height; + this.framebuffer.resize(width, height); + } + }]); + + return ReglFramebuffer; +}(); + +function isObject(value) { + var type = _typeof$1(value); + + return value != null && (type === 'object' || type === 'function'); +} + +/** + * 考虑结构体命名, eg: + * a: { b: 1 } -> 'a.b' + * a: [ { b: 1 } ] -> 'a[0].b' + */ + +function extractUniforms(uniforms) { + var extractedUniforms = {}; + Object.keys(uniforms).forEach(function (uniformName) { + extractUniformsRecursively(uniformName, uniforms[uniformName], extractedUniforms, ''); + }); + return extractedUniforms; +} + +function extractUniformsRecursively(uniformName, uniformValue, uniforms, prefix) { + if (uniformValue === null || typeof uniformValue === 'number' || // u_A: 1 + typeof uniformValue === 'boolean' || // u_A: false + Array.isArray(uniformValue) && typeof uniformValue[0] === 'number' || // u_A: [1, 2, 3] + isTypedArray(uniformValue) || // u_A: Float32Array + // @ts-ignore + uniformValue === '' || // @ts-ignore + uniformValue.resize !== undefined) { + uniforms["".concat(prefix && prefix + '.').concat(uniformName)] = uniformValue; + return; + } // u_Struct.a.b.c + + + if (isObject(uniformValue)) { + Object.keys(uniformValue).forEach(function (childName) { + extractUniformsRecursively(childName, // @ts-ignore + uniformValue[childName], uniforms, "".concat(prefix && prefix + '.').concat(uniformName)); + }); + } // u_Struct[0].a + + + if (Array.isArray(uniformValue)) { + // @ts-ignore + uniformValue.forEach(function (child, idx) { + Object.keys(child).forEach(function (childName) { + extractUniformsRecursively(childName, // @ts-ignore + child[childName], uniforms, "".concat(prefix && prefix + '.').concat(uniformName, "[").concat(idx, "]")); + }); + }); + } +} + +function ownKeys$4(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; } + +function _objectSpread$4(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$4(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$4(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; } + +/** + * adaptor for regl.DrawCommand + */ +var ReglModel = /*#__PURE__*/function () { + function ReglModel(reGl, options) { + _classCallCheck(this, ReglModel); + + this.reGl = void 0; + this.drawCommand = void 0; + this.uniforms = {}; + this.reGl = reGl; + var vs = options.vs, + fs = options.fs, + defines = options.defines, + attributes = options.attributes, + uniforms = options.uniforms, + primitive = options.primitive, + count = options.count, + elements = options.elements, + depth = options.depth, + blend = options.blend, + stencil = options.stencil, + cull = options.cull, + instances = options.instances, + scissor = options.scissor, + viewport = options.viewport; + var reglUniforms = {}; + + if (uniforms) { + this.uniforms = extractUniforms(uniforms); + Object.keys(uniforms).forEach(function (uniformName) { + // use regl prop API + // @ts-ignore + reglUniforms[uniformName] = reGl.prop(uniformName); + }); + } + + var reglAttributes = {}; + Object.keys(attributes).forEach(function (name) { + reglAttributes[name] = attributes[name].get(); + }); + var defineStmts = defines && this.generateDefines(defines) || ''; + var drawParams = { + attributes: reglAttributes, + frag: "#ifdef GL_FRAGMENT_PRECISION_HIGH\n precision highp float;\n#else\n precision mediump float;\n#endif\n".concat(defineStmts, "\n").concat(fs), + uniforms: reglUniforms, + vert: "\n".concat(defineStmts, "\n").concat(vs), + primitive: primitiveMap$1[primitive === undefined ? gl.TRIANGLES : primitive] + }; + + if (instances) { + drawParams.instances = instances; + } // elements 中可能包含 count，此时不应传入 + + + if (count) { + drawParams.count = count; + } + + if (elements) { + drawParams.elements = elements.get(); + } + + if (scissor) { + drawParams.scissor = scissor; + } + + if (viewport) { + drawParams.viewport = viewport; + } + + this.initDepthDrawParams({ + depth: depth + }, drawParams); + this.initBlendDrawParams({ + blend: blend + }, drawParams); + this.initStencilDrawParams({ + stencil: stencil + }, drawParams); + this.initCullDrawParams({ + cull: cull + }, drawParams); + this.drawCommand = reGl(drawParams); + } + + _createClass(ReglModel, [{ + key: "addUniforms", + value: function addUniforms(uniforms) { + this.uniforms = _objectSpread$4(_objectSpread$4({}, this.uniforms), extractUniforms(uniforms)); + } + }, { + key: "draw", + value: function draw(options) { + var uniforms = _objectSpread$4(_objectSpread$4({}, this.uniforms), extractUniforms(options.uniforms || {})); + + var reglDrawProps = {}; + Object.keys(uniforms).forEach(function (uniformName) { + var type = _typeof$1(uniforms[uniformName]); + + if (type === 'boolean' || type === 'number' || Array.isArray(uniforms[uniformName]) || // @ts-ignore + uniforms[uniformName].BYTES_PER_ELEMENT) { + reglDrawProps[uniformName] = uniforms[uniformName]; + } else if (type === 'string') ; else { + reglDrawProps[uniformName] = uniforms[uniformName].get(); + } + }); + this.drawCommand(reglDrawProps); + } + }, { + key: "destroy", + value: function destroy() {// don't need do anything since we will call `rendererService.cleanup()` + } + /** + * @see https://github.com/regl-project/regl/blob/gh-pages/API.md#depth-buffer + */ + + }, { + key: "initDepthDrawParams", + value: function initDepthDrawParams(_ref, drawParams) { + var depth = _ref.depth; + + if (depth) { + drawParams.depth = { + enable: depth.enable === undefined ? true : !!depth.enable, + mask: depth.mask === undefined ? true : !!depth.mask, + func: depthFuncMap$1[depth.func || gl.LESS], + range: depth.range || [0, 1] + }; + } + } + /** + * @see https://github.com/regl-project/regl/blob/gh-pages/API.md#blending + */ + + }, { + key: "initBlendDrawParams", + value: function initBlendDrawParams(_ref2, drawParams) { + var blend = _ref2.blend; + + if (blend) { + var enable = blend.enable, + func = blend.func, + equation = blend.equation, + _blend$color = blend.color, + color = _blend$color === void 0 ? [0, 0, 0, 0] : _blend$color; // @ts-ignore + + drawParams.blend = { + enable: !!enable, + func: { + srcRGB: blendFuncMap$1[func && func.srcRGB || gl.SRC_ALPHA], + srcAlpha: blendFuncMap$1[func && func.srcAlpha || gl.SRC_ALPHA], + dstRGB: blendFuncMap$1[func && func.dstRGB || gl.ONE_MINUS_SRC_ALPHA], + dstAlpha: blendFuncMap$1[func && func.dstAlpha || gl.ONE_MINUS_SRC_ALPHA] + }, + equation: { + rgb: blendEquationMap$1[equation && equation.rgb || gl.FUNC_ADD], + alpha: blendEquationMap$1[equation && equation.alpha || gl.FUNC_ADD] + }, + color: color + }; + } + } + /** + * @see https://github.com/regl-project/regl/blob/gh-pages/API.md#stencil + */ + + }, { + key: "initStencilDrawParams", + value: function initStencilDrawParams(_ref3, drawParams) { + var stencil = _ref3.stencil; + + if (stencil) { + var enable = stencil.enable, + _stencil$mask = stencil.mask, + mask = _stencil$mask === void 0 ? -1 : _stencil$mask, + _stencil$func = stencil.func, + func = _stencil$func === void 0 ? { + cmp: gl.ALWAYS, + ref: 0, + mask: -1 + } : _stencil$func, + _stencil$opFront = stencil.opFront, + opFront = _stencil$opFront === void 0 ? { + fail: gl.KEEP, + zfail: gl.KEEP, + zpass: gl.KEEP + } : _stencil$opFront, + _stencil$opBack = stencil.opBack, + opBack = _stencil$opBack === void 0 ? { + fail: gl.KEEP, + zfail: gl.KEEP, + zpass: gl.KEEP + } : _stencil$opBack; + drawParams.stencil = { + enable: !!enable, + mask: mask, + func: _objectSpread$4(_objectSpread$4({}, func), {}, { + cmp: stencilFuncMap[func.cmp] + }), + opFront: { + fail: stencilOpMap[opFront.fail], + zfail: stencilOpMap[opFront.zfail], + zpass: stencilOpMap[opFront.zpass] + }, + opBack: { + fail: stencilOpMap[opBack.fail], + zfail: stencilOpMap[opBack.zfail], + zpass: stencilOpMap[opBack.zpass] + } + }; + } + } + /** + * @see https://github.com/regl-project/regl/blob/gh-pages/API.md#culling + */ + + }, { + key: "initCullDrawParams", + value: function initCullDrawParams(_ref4, drawParams) { + var cull = _ref4.cull; + + if (cull) { + var enable = cull.enable, + _cull$face = cull.face, + face = _cull$face === void 0 ? gl.BACK : _cull$face; + drawParams.cull = { + enable: !!enable, + face: cullFaceMap[face] + }; + } + } + }, { + key: "generateDefines", + value: function generateDefines(defines) { + return Object.keys(defines).map(function (name) { + return "#define ".concat(name, " ").concat(Number(defines[name])); + }).join('\n'); + } + }]); + + return ReglModel; +}(); + +/** + * adaptor for regl.Buffer + * @see https://github.com/regl-project/regl/blob/gh-pages/API.md#buffers + */ + +var ReglTexture2D = /*#__PURE__*/function () { + function ReglTexture2D(reGl, options) { + _classCallCheck(this, ReglTexture2D); + + this.texture = void 0; + this.width = void 0; + this.height = void 0; + var data = options.data, + _options$type = options.type, + type = _options$type === void 0 ? gl.UNSIGNED_BYTE : _options$type, + width = options.width, + height = options.height, + _options$flipY = options.flipY, + flipY = _options$flipY === void 0 ? false : _options$flipY, + _options$format = options.format, + format = _options$format === void 0 ? gl.RGBA : _options$format, + _options$mipmap = options.mipmap, + mipmap = _options$mipmap === void 0 ? false : _options$mipmap, + _options$wrapS = options.wrapS, + wrapS = _options$wrapS === void 0 ? gl.CLAMP_TO_EDGE : _options$wrapS, + _options$wrapT = options.wrapT, + wrapT = _options$wrapT === void 0 ? gl.CLAMP_TO_EDGE : _options$wrapT, + _options$aniso = options.aniso, + aniso = _options$aniso === void 0 ? 0 : _options$aniso, + _options$alignment = options.alignment, + alignment = _options$alignment === void 0 ? 1 : _options$alignment, + _options$premultiplyA = options.premultiplyAlpha, + premultiplyAlpha = _options$premultiplyA === void 0 ? false : _options$premultiplyA, + _options$mag = options.mag, + mag = _options$mag === void 0 ? gl.NEAREST : _options$mag, + _options$min = options.min, + min = _options$min === void 0 ? gl.NEAREST : _options$min, + _options$colorSpace = options.colorSpace, + colorSpace = _options$colorSpace === void 0 ? gl.BROWSER_DEFAULT_WEBGL : _options$colorSpace; + this.width = width; + this.height = height; + var textureOptions = { + width: width, + height: height, + // @ts-ignore + type: dataTypeMap[type], + format: formatMap$1[format], + wrapS: wrapModeMap$1[wrapS], + wrapT: wrapModeMap$1[wrapT], + // @ts-ignore + mag: filterMap$1[mag], + min: filterMap$1[min], + alignment: alignment, + flipY: flipY, + colorSpace: colorSpaceMap[colorSpace], + premultiplyAlpha: premultiplyAlpha, + aniso: aniso + }; + + if (data) { + textureOptions.data = data; + } + + if (typeof mipmap === 'number') { + textureOptions.mipmap = mipmapMap[mipmap]; + } else if (typeof mipmap === 'boolean') { + textureOptions.mipmap = mipmap; + } + + this.texture = reGl.texture(textureOptions); + } + + _createClass(ReglTexture2D, [{ + key: "get", + value: function get() { + return this.texture; + } + }, { + key: "update", + value: function update() { + // @ts-ignore + this.texture._texture.bind(); + } + }, { + key: "resize", + value: function resize(_ref) { + var width = _ref.width, + height = _ref.height; + this.texture.resize(width, height); + this.width = width; + this.height = height; + } + }, { + key: "destroy", + value: function destroy() { + this.texture.destroy(); + } + }]); + + return ReglTexture2D; +}(); + +var _dec$f, _class$f, _temp$b; +/** + * regl renderer + */ + +var WebGLEngine = (_dec$f = inversify.injectable(), _dec$f(_class$f = (_temp$b = /*#__PURE__*/function () { + function WebGLEngine() { + var _this = this; + + _classCallCheck(this, WebGLEngine); + + this.supportWebGPU = false; + this.useWGSL = false; + this.$canvas = void 0; + this.gl = void 0; + this.inited = void 0; + + this.createModel = /*#__PURE__*/function () { + var _ref = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee2(options) { + return regenerator.wrap(function _callee2$(_context2) { + while (1) { + switch (_context2.prev = _context2.next) { + case 0: + if (!options.uniforms) { + _context2.next = 3; + break; + } + + _context2.next = 3; + return Promise.all(Object.keys(options.uniforms).map( /*#__PURE__*/function () { + var _ref2 = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee(name) { + var texture; + return regenerator.wrap(function _callee$(_context) { + while (1) { + switch (_context.prev = _context.next) { + case 0: + if (!(options.uniforms[name] && options.uniforms[name].load !== undefined)) { + _context.next = 5; + break; + } + + _context.next = 3; + return options.uniforms[name].load(); + + case 3: + texture = _context.sent; + // @ts-ignore + options.uniforms[name] = texture; + + case 5: + case "end": + return _context.stop(); + } + } + }, _callee); + })); + + return function (_x2) { + return _ref2.apply(this, arguments); + }; + }())); + + case 3: + return _context2.abrupt("return", new ReglModel(_this.gl, options)); + + case 4: + case "end": + return _context2.stop(); + } + } + }, _callee2); + })); + + return function (_x) { + return _ref.apply(this, arguments); + }; + }(); + + this.createAttribute = function (options) { + return new ReglAttribute(_this.gl, options); + }; + + this.createBuffer = function (options) { + return new ReglBuffer(_this.gl, options); + }; + + this.createElements = function (options) { + return new ReglElements(_this.gl, options); + }; + + this.createTexture2D = function (options) { + return new ReglTexture2D(_this.gl, options); + }; + + this.createFramebuffer = function (options) { + return new ReglFramebuffer(_this.gl, options); + }; + + this.useFramebuffer = function (framebuffer, drawCommands) { + _this.gl({ + framebuffer: framebuffer ? framebuffer.get() : null + })(drawCommands); + }; + + this.createComputeModel = /*#__PURE__*/function () { + var _ref3 = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee3(context) { + return regenerator.wrap(function _callee3$(_context3) { + while (1) { + switch (_context3.prev = _context3.next) { + case 0: + return _context3.abrupt("return", new ReglComputeModel(_this.gl, context)); + + case 1: + case "end": + return _context3.stop(); + } + } + }, _callee3); + })); + + return function (_x3) { + return _ref3.apply(this, arguments); + }; + }(); + + this.clear = function (options) { + // @see https://github.com/regl-project/regl/blob/gh-pages/API.md#clear-the-draw-buffer + var color = options.color, + depth = options.depth, + stencil = options.stencil, + _options$framebuffer = options.framebuffer, + framebuffer = _options$framebuffer === void 0 ? null : _options$framebuffer; + var reglClearOptions = { + color: color, + depth: depth, + stencil: stencil + }; + reglClearOptions.framebuffer = framebuffer === null ? framebuffer : framebuffer.get(); + + _this.gl.clear(reglClearOptions); + }; + + this.setScissor = function (scissor) { + if (_this.gl && _this.gl._gl) { + // https://developer.mozilla.org/zh-CN/docs/Web/API/WebGLRenderingContext/scissor + if (scissor.enable && scissor.box) { + // console.log(scissor.box); + _this.gl._gl.enable(gl.SCISSOR_TEST); + + _this.gl._gl.scissor(scissor.box.x, scissor.box.y, scissor.box.width, scissor.box.height); + } else { + _this.gl._gl.disable(gl.SCISSOR_TEST); + } + + _this.gl._refresh(); + } + }; + + this.viewport = function (_ref4) { + var x = _ref4.x, + y = _ref4.y, + width = _ref4.width, + height = _ref4.height; + + if (_this.gl && _this.gl._gl) { + // use WebGL context directly + // @see https://github.com/regl-project/regl/blob/gh-pages/API.md#unsafe-escape-hatch + _this.gl._gl.viewport(x, y, width, height); + + _this.gl._refresh(); + } + }; + + this.readPixels = function (options) { + var framebuffer = options.framebuffer, + x = options.x, + y = options.y, + width = options.width, + height = options.height; + var readPixelsOptions = { + x: x, + y: y, + width: width, + height: height + }; + + if (framebuffer) { + readPixelsOptions.framebuffer = framebuffer.get(); + } + + return _this.gl.read(readPixelsOptions); + }; + + this.getCanvas = function () { + return _this.$canvas; + }; + + this.getGLContext = function () { + return _this.gl._gl; + }; + + this.destroy = function () { + if (_this.gl) { + // @see https://github.com/regl-project/regl/blob/gh-pages/API.md#clean-up + _this.gl.destroy(); + + _this.inited = false; + } + }; + } + + _createClass(WebGLEngine, [{ + key: "init", + value: function () { + var _init = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee4(cfg) { + return regenerator.wrap(function _callee4$(_context4) { + while (1) { + switch (_context4.prev = _context4.next) { + case 0: + if (!this.inited) { + _context4.next = 2; + break; + } + + return _context4.abrupt("return"); + + case 2: + this.$canvas = cfg.canvas; // tslint:disable-next-line:typedef + + _context4.next = 5; + return new Promise(function (resolve, reject) { + regl({ + canvas: cfg.canvas, + attributes: { + alpha: true, + // use TAA instead of MSAA + // @see https://www.khronos.org/registry/webgl/specs/1.0/#5.2.1 + antialias: cfg.antialias, + premultipliedAlpha: true // preserveDrawingBuffer: false, + + }, + pixelRatio: 1, + // TODO: use extensions + extensions: ['OES_element_index_uint', 'OES_texture_float', 'OES_standard_derivatives', // wireframe + 'angle_instanced_arrays' // VSM shadow map + ], + optionalExtensions: ['EXT_texture_filter_anisotropic', 'EXT_blend_minmax', 'WEBGL_depth_texture'], + profile: true, + onDone: function onDone(err, r) { + if (err || !r) { + reject(err); + } // @ts-ignore + + + resolve(r); + } + }); + }); + + case 5: + this.gl = _context4.sent; + this.inited = true; + + case 7: + case "end": + return _context4.stop(); + } + } + }, _callee4, this); + })); + + function init(_x4) { + return _init.apply(this, arguments); + } + + return init; + }() + }, { + key: "isFloatSupported", + value: function isFloatSupported() { + // @see https://github.com/antvis/GWebGPUEngine/issues/26 + // @ts-ignore + return this.gl.limits.readFloat; + } + }, { + key: "beginFrame", + value: function beginFrame() {// + } + }, { + key: "endFrame", + value: function endFrame() {// + } + }]); + + return WebGLEngine; +}(), _temp$b)) || _class$f); + +function isWindowObjectExist() { + return typeof window !== 'undefined'; +} +function loadScript(scriptUrl, onSuccess, onError, scriptId) { + if (!isWindowObjectExist()) { + return; + } + + var head = document.getElementsByTagName('head')[0]; + var script = document.createElement('script'); + script.setAttribute('type', 'text/javascript'); + script.setAttribute('src', scriptUrl); + + if (scriptId) { + script.id = scriptId; + } + + script.onload = function () { + if (onSuccess) { + onSuccess(); + } + }; + + script.onerror = function (e) { + if (onError) { + onError("Unable to load script '".concat(scriptUrl, "'"), e); + } + }; + + head.appendChild(script); +} +function loadScriptAsync(scriptUrl, scriptId) { + return new Promise(function (resolve, reject) { + loadScript(scriptUrl, function () { + resolve(); + }, function (message, exception) { + reject(exception); + }); + }); +} + +var glslang; +function glslang$1 () { + return _ref.apply(this, arguments); +} + +function _ref() { + _ref = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee() { + return regenerator.wrap(function _callee$(_context) { + while (1) { + switch (_context.prev = _context.next) { + case 0: + if (!glslang) { + _context.next = 2; + break; + } + + return _context.abrupt("return", glslang); + + case 2: + _context.next = 4; + return loadScriptAsync('https://preview.babylonjs.com/glslang/glslang.js'); + + case 4: + glslang = window.glslang('https://preview.babylonjs.com/glslang/glslang.wasm'); + return _context.abrupt("return", glslang); + + case 6: + case "end": + return _context.stop(); + } + } + }, _callee); + })); + return _ref.apply(this, arguments); +} + +var WebGPUAttribute = /*#__PURE__*/function () { + function WebGPUAttribute(engine, options) { + _classCallCheck(this, WebGPUAttribute); + + this.engine = engine; + this.options = options; + this.attribute = void 0; + this.buffer = void 0; + var _options = options, + buffer = _options.buffer, + offset = _options.offset, + stride = _options.stride, + normalized = _options.normalized, + size = _options.size, + divisor = _options.divisor, + arrayStride = _options.arrayStride, + attributes = _options.attributes, + stepMode = _options.stepMode; + this.buffer = buffer; + this.attribute = { + buffer: buffer.get(), + offset: offset || 0, + stride: stride || 0, + normalized: normalized || false, + divisor: divisor || 0, + arrayStride: arrayStride || 0, + // @ts-ignore + attributes: attributes, + stepMode: stepMode || 'vertex' + }; + + if (size) { + this.attribute.size = size; + } + } + + _createClass(WebGPUAttribute, [{ + key: "get", + value: function get() { + return this.attribute; + } + }, { + key: "updateBuffer", + value: function updateBuffer(options) { + this.buffer.subData(options); + } + }, { + key: "destroy", + value: function destroy() { + this.buffer.destroy(); + } + }]); + + return WebGPUAttribute; +}(); + +var WebGPUBuffer = /*#__PURE__*/function () { + function WebGPUBuffer(engine, options) { + _classCallCheck(this, WebGPUBuffer); + + this.engine = engine; + this.options = options; + this.buffer = void 0; + var _options = options, + data = _options.data, + usage = _options.usage; + _options.type; + this.buffer = this.createBuffer(data instanceof Array ? new Float32Array(data) : data, // TODO: WebGL 和 WebGPU buffer usage 映射关系 + usage || constants.BufferUsage.Vertex | constants.BufferUsage.CopyDst); + } + + _createClass(WebGPUBuffer, [{ + key: "get", + value: function get() { + return this.buffer; + } + }, { + key: "destroy", + value: function destroy() { + this.buffer.destroy(); + } + }, { + key: "subData", + value: function subData(_ref) { + var data = _ref.data, + offset = _ref.offset; + this.setSubData(this.buffer, offset, data instanceof Array ? new Float32Array(data) : data); + } + }, { + key: "createBuffer", + value: function createBuffer(view, flags) { + // @ts-ignore + var padding = view.byteLength % 4; + var verticesBufferDescriptor = { + // @ts-ignore + size: view.byteLength + padding, + usage: flags + }; + var buffer = this.engine.device.createBuffer(verticesBufferDescriptor); + this.setSubData(buffer, 0, view); + return buffer; + } + /** + * 不同于 Babylon.js 的版本，使用最新的 GPUQueue.writeBuffer 方法 + * @see https://gpuweb.github.io/gpuweb/#dom-gpuqueue-writebuffer + * 已废弃创建一个临时的 mapped buffer 用于拷贝数据 @see https://gpuweb.github.io/gpuweb/#GPUDevice-createBufferMapped + * @see https://github.com/gpuweb/gpuweb/blob/master/design/BufferOperations.md#updating-data-to-an-existing-buffer-like-webgls-buffersubdata + */ + + }, { + key: "setSubData", + value: function setSubData(destBuffer, destOffset, srcArrayBuffer) { + // deprecated API setSubData + // destBuffer.setSubData(0, srcArrayBuffer); + // deprecated API createBufferMapped + // use createBuffer & getMappedRange instead + // const [srcBuffer, arrayBuffer] = this.engine.device.createBufferMapped({ + // size: byteCount, + // usage: WebGPUConstants.BufferUsage.CopySrc, + // }); + var queue = isSafari ? // @ts-ignore + this.engine.device.getQueue() : this.engine.device.defaultQueue; // @ts-ignore + + queue.writeBuffer(destBuffer, destOffset, srcArrayBuffer); + } + }]); + + return WebGPUBuffer; +}(); + +function isNumber(value) { + return typeof value === 'number'; +} + +var WebGPUComputeModel = /*#__PURE__*/function () { + /** + * 用于后续渲染时动态更新 + */ + function WebGPUComputeModel(engine, context) { + _classCallCheck(this, WebGPUComputeModel); + + this.engine = engine; + this.context = context; + this.entity = createEntity(); + this.uniformGPUBufferLayout = []; + this.uniformBuffer = void 0; + this.vertexBuffers = {}; + this.outputBuffer = void 0; + this.bindGroupEntries = void 0; + this.bindGroup = void 0; + this.computePipeline = void 0; + } + + _createClass(WebGPUComputeModel, [{ + key: "init", + value: function () { + var _init = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee() { + var _this = this; + + var _yield$this$compileCo, computeStage, buffers, uniforms, bufferBindingIndex, offset, mergedUniformData; + + return regenerator.wrap(function _callee$(_context) { + while (1) { + switch (_context.prev = _context.next) { + case 0: + _context.next = 2; + return this.compileComputePipelineStageDescriptor(this.context.shader); + + case 2: + _yield$this$compileCo = _context.sent; + computeStage = _yield$this$compileCo.computeStage; + buffers = this.context.uniforms.filter(function (uniform) { + return uniform.storageClass === STORAGE_CLASS.StorageBuffer; + }); + uniforms = this.context.uniforms.filter(function (uniform) { + return uniform.storageClass === STORAGE_CLASS.Uniform; + }); + bufferBindingIndex = uniforms.length ? 1 : 0; + this.bindGroupEntries = []; + + if (bufferBindingIndex) { + offset = 0; // FIXME: 所有 uniform 合并成一个 buffer，固定使用 Float32Array 存储，确实会造成一些内存的浪费 + // we use std140 layout @see https://www.khronos.org/opengl/wiki/Interface_Block_(GLSL) + + mergedUniformData = []; + uniforms.forEach(function (uniform) { + if (isNumber(uniform.data)) { + _this.uniformGPUBufferLayout.push({ + name: uniform.name, + offset: offset + }); + + offset += 4; // @ts-ignore + + mergedUniformData.push(uniform.data); + } else { + var _uniform$data; + + // @ts-ignore + var originDataLength = ((_uniform$data = uniform.data) === null || _uniform$data === void 0 ? void 0 : _uniform$data.length) || 1; + + if (originDataLength === 3) { + // vec3 -> vec4 + // @see http://ptgmedia.pearsoncmg.com/images/9780321552624/downloads/0321552628_AppL.pdf + originDataLength = 4; // @ts-ignore + + uniform.data.push(0); + } // 4 elements per block/line + + + var padding = offset / 4 % 4; + + if (padding > 0) { + var space = 4 - padding; + + if (originDataLength > 1 && originDataLength <= space) { + if (originDataLength === 2) { + if (space === 3) { + offset += 4; + mergedUniformData.push(0); + } // @ts-ignore + + + mergedUniformData.push.apply(mergedUniformData, _toConsumableArray(uniform.data)); + + _this.uniformGPUBufferLayout.push({ + name: uniform.name, + offset: offset + }); + } + } else { + for (var i = 0; i < space; i++) { + offset += 4; + mergedUniformData.push(0); + } // @ts-ignore + + + mergedUniformData.push.apply(mergedUniformData, _toConsumableArray(uniform.data)); + + _this.uniformGPUBufferLayout.push({ + name: uniform.name, + offset: offset + }); + } + } + + offset += 4 * originDataLength; + } + }); + this.uniformBuffer = new WebGPUBuffer(this.engine, { + // TODO: 处理 Struct 和 boolean + // @ts-ignore + data: mergedUniformData instanceof Array ? // @ts-ignore + new Float32Array(mergedUniformData) : mergedUniformData, + usage: constants.BufferUsage.Uniform | constants.BufferUsage.CopyDst + }); + this.bindGroupEntries.push({ + binding: 0, + resource: { + buffer: this.uniformBuffer.get() + } + }); + } // create GPUBuffers for storeage buffers + + + buffers.forEach(function (buffer) { + if (buffer.data !== null) { + if (buffer.type === AST_TOKEN_TYPES.Vector4FloatArray || buffer.type === AST_TOKEN_TYPES.FloatArray) { + var gpuBuffer; + + if (buffer.name === _this.context.output.name) { + gpuBuffer = new WebGPUBuffer(_this.engine, { + // @ts-ignore + data: isFinite(Number(buffer.data)) ? [buffer.data] : buffer.data, + usage: constants.BufferUsage.Storage | constants.BufferUsage.CopyDst | constants.BufferUsage.CopySrc + }); + _this.outputBuffer = gpuBuffer; + _this.context.output = { + name: buffer.name, + // @ts-ignore + length: isFinite(Number(buffer.data)) ? 1 : buffer.data.length, + typedArrayConstructor: Float32Array, + gpuBuffer: gpuBuffer.get() + }; + } else { + if (buffer.isReferer) { + // @ts-ignore + if (buffer.data.model && buffer.data.model.outputBuffer) { + // @ts-ignore + gpuBuffer = buffer.data.model.outputBuffer; + } + } else { + gpuBuffer = new WebGPUBuffer(_this.engine, { + // @ts-ignore + data: isFinite(Number(buffer.data)) ? [buffer.data] : buffer.data, + usage: constants.BufferUsage.Storage | constants.BufferUsage.CopyDst | constants.BufferUsage.CopySrc + }); + } + } // @ts-ignore + + + _this.vertexBuffers[buffer.name] = gpuBuffer; + + _this.bindGroupEntries.push({ + binding: bufferBindingIndex, + resource: { + name: buffer.name, + refer: gpuBuffer ? undefined : buffer.data, + // @ts-ignore + buffer: gpuBuffer ? gpuBuffer.get() : undefined + } + }); + + bufferBindingIndex++; + } + } + }); // create compute pipeline layout + + this.computePipeline = this.engine.device.createComputePipeline({ + computeStage: computeStage + }); + console.log(this.bindGroupEntries); + this.bindGroup = this.engine.device.createBindGroup({ + layout: this.computePipeline.getBindGroupLayout(0), + entries: this.bindGroupEntries + }); + + case 13: + case "end": + return _context.stop(); + } + } + }, _callee, this); + })); + + function init() { + return _init.apply(this, arguments); + } + + return init; + }() + }, { + key: "destroy", + value: function destroy() { + var _this2 = this; + + if (this.uniformBuffer) { + this.uniformBuffer.destroy(); + } + + Object.keys(this.vertexBuffers).forEach(function (bufferName) { + return _this2.vertexBuffers[bufferName].destroy(); + }); + } + }, { + key: "readData", + value: function () { + var _readData = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee2() { + var output, length, typedArrayConstructor, gpuBuffer, byteCount, gpuReadBuffer, encoder, queue, arraybuffer, typedArray; + return regenerator.wrap(function _callee2$(_context2) { + while (1) { + switch (_context2.prev = _context2.next) { + case 0: + output = this.context.output; + + if (!output) { + _context2.next = 16; + break; + } + + length = output.length, typedArrayConstructor = output.typedArrayConstructor, gpuBuffer = output.gpuBuffer; + + if (!gpuBuffer) { + _context2.next = 16; + break; + } + + // await gpuBuffer.mapAsync(WebGPUConstants.MapMode.Read); + // const arraybuffer = gpuBuffer.getMappedRange(); + // let arraybuffer; + // if (isSafari) { + // arraybuffer = await gpuBuffer.mapReadAsync(); + // } else { + byteCount = length * typedArrayConstructor.BYTES_PER_ELEMENT; // @see https://developers.google.com/web/updates/2019/08/get-started-with-gpu-compute-on-the-web + + gpuReadBuffer = this.engine.device.createBuffer({ + size: byteCount, + usage: GPUBufferUsage.COPY_DST | GPUBufferUsage.MAP_READ + }); + encoder = this.engine.device.createCommandEncoder(); + encoder.copyBufferToBuffer(gpuBuffer, 0, gpuReadBuffer, 0, byteCount); + queue = isSafari ? // @ts-ignore + this.engine.device.getQueue() : this.engine.device.defaultQueue; + queue.submit([encoder.finish()]); + _context2.next = 12; + return gpuReadBuffer.mapAsync(constants.MapMode.Read); + + case 12: + arraybuffer = gpuReadBuffer.getMappedRange(); + typedArray = new typedArrayConstructor(arraybuffer.slice(0)); + gpuReadBuffer.unmap(); + return _context2.abrupt("return", typedArray); + + case 16: + return _context2.abrupt("return", new Float32Array()); + + case 17: + case "end": + return _context2.stop(); + } + } + }, _callee2, this); + })); + + function readData() { + return _readData.apply(this, arguments); + } + + return readData; + }() + }, { + key: "run", + value: function run() { + if (this.engine.currentComputePass) { + var _this$engine$currentC; + + this.engine.currentComputePass.setPipeline(this.computePipeline); // this.bindGroupEntries.forEach((entry) => { + // if (!entry.resource.buffer) { + // // get referred kernel's output + // const gpuBuffer = (entry.resource.refer.model as WebGPUComputeModel) + // .outputBuffer; + // this.vertexBuffers[entry.resource.name] = gpuBuffer; + // entry.resource.buffer = gpuBuffer.get(); + // } + // }); + // const bindGroup = this.engine.device.createBindGroup({ + // layout: this.computePipeline.getBindGroupLayout(0), + // entries: this.bindGroupEntries, + // }); + + this.engine.currentComputePass.setBindGroup(0, this.bindGroup); + + (_this$engine$currentC = this.engine.currentComputePass).dispatch.apply(_this$engine$currentC, _toConsumableArray(this.context.dispatch)); + } + } + }, { + key: "updateBuffer", + value: function updateBuffer(bufferName, data) { + var offset = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0; + var buffer = this.vertexBuffers[bufferName]; + + if (buffer) { + buffer.subData({ + data: data, + offset: offset + }); + } + } + }, { + key: "updateUniform", + value: function updateUniform(uniformName, data) { + var layout = this.uniformGPUBufferLayout.find(function (l) { + return l.name === uniformName; + }); + + if (layout) { + this.uniformBuffer.subData({ + data: Number.isFinite(data) ? new Float32Array([data]) : new Float32Array(data), + offset: layout.offset + }); + } + } + }, { + key: "confirmInput", + value: function confirmInput(model, inputName) { + // copy output GPUBuffer of kernel + var inputBuffer = this.vertexBuffers[inputName]; + var outputBuffer = model.outputBuffer; + + if (inputBuffer && outputBuffer && inputBuffer !== outputBuffer) { + var encoder = this.engine.device.createCommandEncoder(); + var _context$output = model.context.output, + length = _context$output.length, + typedArrayConstructor = _context$output.typedArrayConstructor; + var byteCount = length * typedArrayConstructor.BYTES_PER_ELEMENT; + encoder.copyBufferToBuffer(outputBuffer.get(), 0, inputBuffer.get(), 0, byteCount); + var queue = isSafari ? // @ts-ignore + this.engine.device.getQueue() : this.engine.device.defaultQueue; + queue.submit([encoder.finish()]); + } + } + }, { + key: "compileShaderToSpirV", + value: function compileShaderToSpirV(source, type, shaderVersion) { + return this.compileRawShaderToSpirV(shaderVersion + source, type); + } + }, { + key: "compileRawShaderToSpirV", + value: function compileRawShaderToSpirV(source, type) { + return this.engine.glslang.compileGLSL(source, type); + } + }, { + key: "compileComputePipelineStageDescriptor", + value: function () { + var _compileComputePipelineStageDescriptor = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee3(computeCode) { + var computeShader, shaderVersion; + return regenerator.wrap(function _callee3$(_context3) { + while (1) { + switch (_context3.prev = _context3.next) { + case 0: + computeShader = computeCode; + shaderVersion = '#version 450\n'; + + if (this.engine.options.useWGSL) { + _context3.next = 6; + break; + } + + _context3.next = 5; + return this.compileShaderToSpirV(computeCode, 'compute', shaderVersion); + + case 5: + computeShader = _context3.sent; + + case 6: + return _context3.abrupt("return", { + computeStage: { + module: this.engine.device.createShaderModule({ + code: computeShader, + // @ts-ignore + isWHLSL: isSafari + }), + entryPoint: 'main' + } + }); + + case 7: + case "end": + return _context3.stop(); + } + } + }, _callee3, this); + })); + + function compileComputePipelineStageDescriptor(_x) { + return _compileComputePipelineStageDescriptor.apply(this, arguments); + } + + return compileComputePipelineStageDescriptor; + }() + }]); + + return WebGPUComputeModel; +}(); + +var WebGPUElements = /*#__PURE__*/function () { + function WebGPUElements(engine, options) { + _classCallCheck(this, WebGPUElements); + + this.engine = engine; + this.options = options; + this.indexCount = void 0; + this.buffer = void 0; + var _options = options, + data = _options.data; + _options.usage; + _options.type; + var count = _options.count; + this.indexCount = count || 0; + this.buffer = new WebGPUBuffer(engine, { + // @ts-ignore + data: data instanceof Array ? new Uint16Array(data) : data, + usage: constants.BufferUsage.Index | constants.BufferUsage.CopyDst + }); + } + + _createClass(WebGPUElements, [{ + key: "get", + value: function get() { + return this.buffer; + } + }, { + key: "subData", + value: function subData(options) { + this.buffer.subData(options); + } + }, { + key: "destroy", + value: function destroy() { + this.buffer.destroy(); + } + }]); + + return WebGPUElements; +}(); + +var WebGPUFramebuffer = /*#__PURE__*/function () { + function WebGPUFramebuffer(engine, options) { + _classCallCheck(this, WebGPUFramebuffer); + + this.engine = engine; + this.options = options; + this.colorTexture = void 0; + this.depthTexture = void 0; + this.width = 0; + this.height = 0; + var _options = options; + _options.width; + _options.height; + var color = _options.color; + _options.colors; + var depth = _options.depth; + _options.stencil; + + if (color) { + this.colorTexture = color; + } + + if (depth) { + this.depthTexture = depth; + } // TODO: depth & stencil + + } + + _createClass(WebGPUFramebuffer, [{ + key: "get", + value: function get() { + var _this$colorTexture, _this$depthTexture; + + return { + color: (_this$colorTexture = this.colorTexture) === null || _this$colorTexture === void 0 ? void 0 : _this$colorTexture.get(), + depth: (_this$depthTexture = this.depthTexture) === null || _this$depthTexture === void 0 ? void 0 : _this$depthTexture.get() + }; + } + }, { + key: "destroy", + value: function destroy() { + var _this$colorTexture2, _this$depthTexture2; + + (_this$colorTexture2 = this.colorTexture) === null || _this$colorTexture2 === void 0 ? void 0 : _this$colorTexture2.destroy(); + (_this$depthTexture2 = this.depthTexture) === null || _this$depthTexture2 === void 0 ? void 0 : _this$depthTexture2.destroy(); + } + }, { + key: "resize", + value: function resize(_ref) { + var width = _ref.width, + height = _ref.height; + + if (width !== this.width || height !== this.height) { + var _this$colorTexture3, _this$depthTexture3; + + (_this$colorTexture3 = this.colorTexture) === null || _this$colorTexture3 === void 0 ? void 0 : _this$colorTexture3.resize({ + width: width, + height: height + }); + (_this$depthTexture3 = this.depthTexture) === null || _this$depthTexture3 === void 0 ? void 0 : _this$depthTexture3.resize({ + width: width, + height: height + }); + } + + this.width = width; + this.height = height; + } + }]); + + return WebGPUFramebuffer; +}(); + +var _primitiveMap, _depthFuncMap, _blendEquationMap, _blendFuncMap, _formatMap, _filterMap, _wrapModeMap; + +var primitiveMap = (_primitiveMap = {}, _defineProperty(_primitiveMap, gl.POINTS, constants.PrimitiveTopology.PointList), _defineProperty(_primitiveMap, gl.LINES, constants.PrimitiveTopology.LineList), _defineProperty(_primitiveMap, gl.LINE_LOOP, constants.PrimitiveTopology.LineList), _defineProperty(_primitiveMap, gl.LINE_STRIP, constants.PrimitiveTopology.LineStrip), _defineProperty(_primitiveMap, gl.TRIANGLES, constants.PrimitiveTopology.TriangleList), _defineProperty(_primitiveMap, gl.TRIANGLE_FAN, constants.PrimitiveTopology.TriangleList), _defineProperty(_primitiveMap, gl.TRIANGLE_STRIP, constants.PrimitiveTopology.TriangleStrip), _primitiveMap); +var depthFuncMap = (_depthFuncMap = {}, _defineProperty(_depthFuncMap, gl.NEVER, constants.CompareFunction.Never), _defineProperty(_depthFuncMap, gl.ALWAYS, constants.CompareFunction.Always), _defineProperty(_depthFuncMap, gl.LESS, constants.CompareFunction.Less), _defineProperty(_depthFuncMap, gl.LEQUAL, constants.CompareFunction.LessEqual), _defineProperty(_depthFuncMap, gl.GREATER, constants.CompareFunction.Greater), _defineProperty(_depthFuncMap, gl.GEQUAL, constants.CompareFunction.GreaterEqual), _defineProperty(_depthFuncMap, gl.EQUAL, constants.CompareFunction.Equal), _defineProperty(_depthFuncMap, gl.NOTEQUAL, constants.CompareFunction.NotEqual), _depthFuncMap); +var blendEquationMap = (_blendEquationMap = {}, _defineProperty(_blendEquationMap, gl.FUNC_ADD, constants.BlendOperation.Add), _defineProperty(_blendEquationMap, gl.MIN_EXT, constants.BlendOperation.Min), _defineProperty(_blendEquationMap, gl.MAX_EXT, constants.BlendOperation.Max), _defineProperty(_blendEquationMap, gl.FUNC_SUBTRACT, constants.BlendOperation.Subtract), _defineProperty(_blendEquationMap, gl.FUNC_REVERSE_SUBTRACT, constants.BlendOperation.ReverseSubtract), _blendEquationMap); // @see https://gpuweb.github.io/gpuweb/#blend-state +// 不支持 'constant alpha' 和 'one minus constant alpha' + +var blendFuncMap = (_blendFuncMap = {}, _defineProperty(_blendFuncMap, gl.ZERO, constants.BlendFactor.Zero), _defineProperty(_blendFuncMap, gl.ONE, constants.BlendFactor.One), _defineProperty(_blendFuncMap, gl.SRC_COLOR, constants.BlendFactor.SrcColor), _defineProperty(_blendFuncMap, gl.ONE_MINUS_SRC_COLOR, constants.BlendFactor.OneMinusSrcColor), _defineProperty(_blendFuncMap, gl.SRC_ALPHA, constants.BlendFactor.SrcAlpha), _defineProperty(_blendFuncMap, gl.ONE_MINUS_SRC_ALPHA, constants.BlendFactor.OneMinusSrcAlpha), _defineProperty(_blendFuncMap, gl.DST_COLOR, constants.BlendFactor.DstColor), _defineProperty(_blendFuncMap, gl.ONE_MINUS_DST_COLOR, constants.BlendFactor.OneMinusDstColor), _defineProperty(_blendFuncMap, gl.DST_ALPHA, constants.BlendFactor.DstAlpha), _defineProperty(_blendFuncMap, gl.ONE_MINUS_DST_ALPHA, constants.BlendFactor.OneMinusDstAlpha), _defineProperty(_blendFuncMap, gl.CONSTANT_COLOR, constants.BlendFactor.BlendColor), _defineProperty(_blendFuncMap, gl.ONE_MINUS_CONSTANT_COLOR, constants.BlendFactor.OneMinusBlendColor), _defineProperty(_blendFuncMap, gl.SRC_ALPHA_SATURATE, constants.BlendFactor.SrcAlphaSaturated), _blendFuncMap); // @see https://gpuweb.github.io/gpuweb/#texture-formats + +var formatMap = (_formatMap = {}, _defineProperty(_formatMap, gl.ALPHA, 'r8unorm'), _defineProperty(_formatMap, gl.RGBA, 'rgba8unorm'), _defineProperty(_formatMap, gl.DEPTH_COMPONENT, 'depth32float'), _defineProperty(_formatMap, gl.DEPTH_STENCIL, 'depth24plus-stencil8'), _formatMap); // @see https://gpuweb.github.io/gpuweb/#enumdef-gpufiltermode + +var filterMap = (_filterMap = {}, _defineProperty(_filterMap, gl.NEAREST, 'nearest'), _defineProperty(_filterMap, gl.LINEAR, 'linear'), _filterMap); // @see https://gpuweb.github.io/gpuweb/#enumdef-gpuaddressmode + +var wrapModeMap = (_wrapModeMap = {}, _defineProperty(_wrapModeMap, gl.REPEAT, 'repeat'), _defineProperty(_wrapModeMap, gl.CLAMP_TO_EDGE, 'clamp-to-edge'), _defineProperty(_wrapModeMap, gl.MIRRORED_REPEAT, 'mirror-repeat'), _wrapModeMap); +function getCullMode(_ref) { + var cull = _ref.cull; + + if (!cull || !cull.enable) { + return constants.CullMode.None; + } + + if (cull.face) { + return cull.face === gl.FRONT ? constants.CullMode.Front : constants.CullMode.Back; + } +} +function getDepthStencilStateDescriptor(_ref2) { + var depth = _ref2.depth; + _ref2.stencil; + // TODO: stencil + var stencilFrontBack = { + compare: constants.CompareFunction.Always, + depthFailOp: constants.StencilOperation.Keep, + failOp: constants.StencilOperation.Keep, + passOp: constants.StencilOperation.Keep + }; + return { + depthWriteEnabled: depth && depth.enable, + depthCompare: depthFuncMap[(depth === null || depth === void 0 ? void 0 : depth.func) || gl.ALWAYS], + format: constants.TextureFormat.Depth24PlusStencil8, + stencilFront: stencilFrontBack, + stencilBack: stencilFrontBack, + stencilReadMask: 0xffffffff, + stencilWriteMask: 0xffffffff + }; +} +/** + * @see https://gpuweb.github.io/gpuweb/#color-state + */ + +function getColorStateDescriptors(_ref3, swapChainFormat) { + var blend = _ref3.blend; + return [{ + format: swapChainFormat, + // https://gpuweb.github.io/gpuweb/#blend-state + alphaBlend: { + srcFactor: blendFuncMap[blend && blend.func && blend.func.srcAlpha || gl.ONE], + dstFactor: blendFuncMap[blend && blend.func && blend.func.dstAlpha || gl.ZERO], + operation: blendEquationMap[blend && blend.equation && blend.equation.alpha || gl.FUNC_ADD] + }, + colorBlend: { + srcFactor: blendFuncMap[blend && blend.func && blend.func.srcRGB || gl.ONE], + dstFactor: blendFuncMap[blend && blend.func && blend.func.dstRGB || gl.ZERO], + operation: blendEquationMap[blend && blend.equation && blend.equation.rgb || gl.FUNC_ADD] + }, + writeMask: constants.ColorWrite.All + }]; +} + +function ownKeys$3(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; } + +function _objectSpread$3(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$3(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$3(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; } + +// @ts-ignore +function concatenate(resultConstructor) { + var totalLength = 0; + + for (var _len = arguments.length, arrays = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) { + arrays[_key - 1] = arguments[_key]; + } + + for (var _i = 0, _arrays = arrays; _i < _arrays.length; _i++) { + var arr = _arrays[_i]; + totalLength += arr.length; + } + + var result = new resultConstructor(totalLength); + var offset = 0; + + for (var _i2 = 0, _arrays2 = arrays; _i2 < _arrays2.length; _i2++) { + var _arr = _arrays2[_i2]; + result.set(_arr, offset); + offset += _arr.length; + } + + return result; +} + +var WebGPUModel = /*#__PURE__*/function () { + /** + * 用于后续渲染时动态更新 + */ + + /** + * vertex + */ + + /** + * indices's buffer + */ + function WebGPUModel(engine, options) { + _classCallCheck(this, WebGPUModel); + + this.engine = engine; + this.options = options; + this.pipelineLayout = void 0; + this.renderPipeline = void 0; + this.uniformsBindGroupLayout = void 0; + this.uniformBindGroup = void 0; + this.uniformBuffer = void 0; + this.uniforms = {}; + this.uniformGPUBufferLayout = []; + this.attributeCache = {}; + this.indexBuffer = void 0; + this.indexCount = void 0; + } + + _createClass(WebGPUModel, [{ + key: "init", + value: function () { + var _init = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee() { + var _this = this; + + var _this$options, vs, fs, attributes, uniforms, primitive, elements, depth, blend, stencil, cull, _yield$this$compilePi, vertexStage, fragmentStage, vertexState, descriptor; + + return regenerator.wrap(function _callee$(_context) { + while (1) { + switch (_context.prev = _context.next) { + case 0: + _this$options = this.options, vs = _this$options.vs, fs = _this$options.fs, attributes = _this$options.attributes, uniforms = _this$options.uniforms, primitive = _this$options.primitive, elements = _this$options.elements, depth = _this$options.depth, blend = _this$options.blend, stencil = _this$options.stencil, cull = _this$options.cull; // build shaders first + + _context.next = 3; + return this.compilePipelineStageDescriptor(vs, fs, null); + + case 3: + _yield$this$compilePi = _context.sent; + vertexStage = _yield$this$compilePi.vertexStage; + fragmentStage = _yield$this$compilePi.fragmentStage; + + if (uniforms) { + // create uniform bind groups & layout + this.buildUniformBindGroup(uniforms); + } + + if (elements) { + this.indexBuffer = elements.get(); + this.indexCount = elements.indexCount; + } // TODO: instanced array + + + vertexState = { + vertexBuffers: Object.keys(attributes).map(function (attributeName, i) { + var attribute = attributes[attributeName]; + + var _attribute$get = attribute.get(), + arrayStride = _attribute$get.arrayStride, + stepMode = _attribute$get.stepMode, + ats = _attribute$get.attributes; + + _this.attributeCache[attributeName] = attribute; + return { + arrayStride: arrayStride, + stepMode: stepMode, + attributes: ats + }; + }) + }; + descriptor = { + sampleCount: this.engine.mainPassSampleCount, + primitiveTopology: primitiveMap[primitive || gl.TRIANGLES], + rasterizationState: _objectSpread$3(_objectSpread$3({}, this.getDefaultRasterizationStateDescriptor()), {}, { + // TODO: support frontface + cullMode: getCullMode({ + cull: cull + }) + }), + depthStencilState: getDepthStencilStateDescriptor({ + depth: depth, + stencil: stencil + }), + colorStates: getColorStateDescriptors({ + blend: blend + }, this.engine.options.swapChainFormat), + layout: this.pipelineLayout, + vertexStage: vertexStage, + fragmentStage: fragmentStage, + vertexState: vertexState + }; // create pipeline + + this.renderPipeline = this.engine.device.createRenderPipeline(descriptor); + + case 11: + case "end": + return _context.stop(); + } + } + }, _callee, this); + })); + + function init() { + return _init.apply(this, arguments); + } + + return init; + }() + }, { + key: "addUniforms", + value: function addUniforms(uniforms) { + this.uniforms = _objectSpread$3(_objectSpread$3({}, this.uniforms), extractUniforms(uniforms)); + } + }, { + key: "draw", + value: function draw(options) { + var _this2 = this; + + var renderPass = this.engine.getCurrentRenderPass(); + + var uniforms = _objectSpread$3(_objectSpread$3({}, this.uniforms), extractUniforms(options.uniforms || {})); + + var bindGroupBindings = []; // TODO: uniform 发生修改 + + Object.keys(uniforms).forEach(function (uniformName) { + var type = _typeof$1(uniforms[uniformName]); + + if (type === 'boolean' || type === 'number' || Array.isArray(uniforms[uniformName]) || // @ts-ignore + uniforms[uniformName].BYTES_PER_ELEMENT) { + var _this2$uniformGPUBuff; + + var offset = (_this2$uniformGPUBuff = _this2.uniformGPUBufferLayout.find(function (_ref) { + var name = _ref.name; + return name === uniformName; + })) === null || _this2$uniformGPUBuff === void 0 ? void 0 : _this2$uniformGPUBuff.offset; + + if (offset !== null) { + _this2.uniformBuffer.subData({ + // @ts-ignore + data: uniforms[uniformName], + // @ts-ignore + offset: offset + }); + } + } else { + var _this2$uniformGPUBuff2; + + var _offset = (_this2$uniformGPUBuff2 = _this2.uniformGPUBufferLayout.find(function (_ref2) { + var name = _ref2.name; + return name === uniformName; + })) === null || _this2$uniformGPUBuff2 === void 0 ? void 0 : _this2$uniformGPUBuff2.offset; + + if (_offset !== null) { + var textureOrFramebuffer = uniforms[uniformName].get(); + + var _ref3 = // @ts-ignore + textureOrFramebuffer.color || textureOrFramebuffer, + texture = _ref3.texture, + sampler = _ref3.sampler; + + if (sampler) { + bindGroupBindings.push({ + // @ts-ignore + binding: _offset, + resource: sampler + }); // @ts-ignore + + _offset++; + } + + bindGroupBindings.push({ + // @ts-ignore + binding: _offset, + resource: texture.createView() + }); + } + } + }); + + if (this.uniformBuffer) { + bindGroupBindings[0] = { + binding: 0, + resource: { + buffer: this.uniformBuffer.get() // 返回 GPUBuffer 原生对象 + + } + }; + } + + this.uniformBindGroup = this.engine.device.createBindGroup({ + layout: this.uniformsBindGroupLayout, + entries: bindGroupBindings + }); + + if (this.renderPipeline) { + renderPass.setPipeline(this.renderPipeline); + } + + renderPass.setBindGroup(0, this.uniformBindGroup); + + if (this.indexBuffer) { + renderPass.setIndexBuffer(this.indexBuffer.get(), constants.IndexFormat.Uint32, 0); + } + + Object.keys(this.attributeCache).forEach(function (attributeName, i) { + renderPass.setVertexBuffer(0 + i, _this2.attributeCache[attributeName].get().buffer, 0); + }); // renderPass.draw(verticesCount, instancesCount, verticesStart, 0); + + if (this.indexBuffer) { + renderPass.drawIndexed(this.indexCount, this.options.instances || 1, 0, 0, 0); + } else { + renderPass.draw(this.options.count || 0, this.options.instances || 0, 0, 0); + } + } + }, { + key: "destroy", + value: function destroy() { + throw new Error('Method not implemented.'); + } + }, { + key: "compilePipelineStageDescriptor", + value: function () { + var _compilePipelineStageDescriptor = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee2(vertexCode, fragmentCode, defines) { + var shaderVersion, vertexShader, fragmentShader; + return regenerator.wrap(function _callee2$(_context2) { + while (1) { + switch (_context2.prev = _context2.next) { + case 0: + shaderVersion = '#version 450\n'; + vertexShader = vertexCode; + fragmentShader = fragmentCode; + + if (this.engine.options.useWGSL) { + _context2.next = 10; + break; + } + + _context2.next = 6; + return this.compileShaderToSpirV(vertexCode, 'vertex', shaderVersion); + + case 6: + vertexShader = _context2.sent; + _context2.next = 9; + return this.compileShaderToSpirV(fragmentCode, 'fragment', shaderVersion); + + case 9: + fragmentShader = _context2.sent; + + case 10: + return _context2.abrupt("return", this.createPipelineStageDescriptor(vertexShader, fragmentShader)); + + case 11: + case "end": + return _context2.stop(); + } + } + }, _callee2, this); + })); + + function compilePipelineStageDescriptor(_x, _x2, _x3) { + return _compilePipelineStageDescriptor.apply(this, arguments); + } + + return compilePipelineStageDescriptor; + }() + }, { + key: "compileShaderToSpirV", + value: function compileShaderToSpirV(source, type, shaderVersion) { + return this.compileRawShaderToSpirV(shaderVersion + source, type); + } + }, { + key: "compileRawShaderToSpirV", + value: function compileRawShaderToSpirV(source, type) { + return this.engine.glslang.compileGLSL(source, type); + } + }, { + key: "createPipelineStageDescriptor", + value: function createPipelineStageDescriptor(vertexShader, fragmentShader) { + return { + vertexStage: { + module: this.engine.device.createShaderModule({ + code: vertexShader, + // @ts-ignore + isWHLSL: isSafari + }), + entryPoint: 'main' + }, + fragmentStage: { + module: this.engine.device.createShaderModule({ + code: fragmentShader, + // @ts-ignore + isWHLSL: isSafari + }), + entryPoint: 'main' + } + }; + } + /** + * @see https://gpuweb.github.io/gpuweb/#rasterization-state + */ + + }, { + key: "getDefaultRasterizationStateDescriptor", + value: function getDefaultRasterizationStateDescriptor() { + return { + frontFace: constants.FrontFace.CCW, + cullMode: constants.CullMode.None, + depthBias: 0, + depthBiasSlopeScale: 0, + depthBiasClamp: 0 + }; + } + }, { + key: "buildUniformBindGroup", + value: function buildUniformBindGroup(uniforms) { + var _this3 = this; + + var offset = 0; // FIXME: 所有 uniform 合并成一个 buffer，固定使用 Float32Array 存储，确实会造成一些内存的浪费 + + var mergedUniformData = concatenate.apply(void 0, [Float32Array].concat(_toConsumableArray(Object.keys(uniforms).map(function (uniformName) { + if (uniforms[uniformName]) { + _this3.uniformGPUBufferLayout.push({ + name: uniformName, + offset: offset + }); // @ts-ignore + + + offset += (uniforms[uniformName].length || 1) * 4; + return uniforms[uniformName]; + } else { + // texture & framebuffer + return []; + } + })))); + var entries = []; + var hasUniform = false; + + if (mergedUniformData.length) { + hasUniform = true; // TODO: 所有 uniform 绑定到 slot 0，通过解析 Shader 代码判定可见性 + + entries.push({ + // TODO: 暂时都绑定到 slot 0 + binding: 0, + visibility: constants.ShaderStage.Fragment | constants.ShaderStage.Vertex, + // TODO: 暂时 VS 和 FS 都可见 + type: constants.BindingType.UniformBuffer + }); + } // 声明 texture & sampler + + + Object.keys(uniforms).filter(function (uniformName) { + return uniforms[uniformName] === null; + }).forEach(function (uniformName, i) { + _this3.uniformGPUBufferLayout.push({ + name: uniformName, + offset: i * 2 + (hasUniform ? 1 : 0) + }); + + entries.push({ + // Sampler + binding: i * 2 + (hasUniform ? 1 : 0), + visibility: constants.ShaderStage.Fragment, + type: constants.BindingType.Sampler + }, { + // Texture view + binding: i * 2 + (hasUniform ? 1 : 0) + 1, + visibility: constants.ShaderStage.Fragment, + type: constants.BindingType.SampledTexture + }); + }); + this.uniformsBindGroupLayout = this.engine.device.createBindGroupLayout({ + // 最新 API 0.0.22 版本使用 entries。Chrome Canary 84.0.4110.0 已实现。 + // 使用 bindings 会报 Warning: GPUBindGroupLayoutDescriptor.bindings is deprecated: renamed to entries + // @see https://github.com/antvis/GWebGPUEngine/issues/5 + entries: entries + }); + this.pipelineLayout = this.engine.device.createPipelineLayout({ + bindGroupLayouts: [this.uniformsBindGroupLayout] + }); + + if (hasUniform) { + this.uniformBuffer = new WebGPUBuffer(this.engine, { + // TODO: 处理 Struct 和 boolean + // @ts-ignore + data: mergedUniformData instanceof Array ? // @ts-ignore + new Float32Array(mergedUniformData) : mergedUniformData, + usage: constants.BufferUsage.Uniform | constants.BufferUsage.CopyDst + }); + } + } + }]); + + return WebGPUModel; +}(); + +/** + * adaptor for regl.Buffer + * @see https://github.com/regl-project/regl/blob/gh-pages/API.md#buffers + */ + +var WebGPUTexture2D = /*#__PURE__*/function () { + function WebGPUTexture2D(engine, options) { + _classCallCheck(this, WebGPUTexture2D); + + this.engine = engine; + this.options = options; + this.texture = void 0; + this.sampler = void 0; + this.width = void 0; + this.height = void 0; + this.createTexture(); + } + + _createClass(WebGPUTexture2D, [{ + key: "get", + value: function get() { + return { + texture: this.texture, + sampler: this.sampler + }; + } + }, { + key: "update", + value: function update() {// TODO + } + }, { + key: "resize", + value: function resize(_ref) { + var width = _ref.width, + height = _ref.height; + + // TODO: it seems that Texture doesn't support `resize` + if (width !== this.width || height !== this.height) { + this.destroy(); + this.createTexture(); + } + + this.width = width; + this.height = height; + } + }, { + key: "destroy", + value: function destroy() { + if (this.texture) { + this.texture.destroy(); + } + } + }, { + key: "createTexture", + value: function createTexture() { + var _this$options = this.options; + _this$options.data; + var _this$options$type = _this$options.type; + _this$options$type === void 0 ? gl.UNSIGNED_BYTE : _this$options$type; + var width = _this$options.width, + height = _this$options.height; + _this$options.flipY; + var _this$options$format = _this$options.format, + format = _this$options$format === void 0 ? gl.RGBA : _this$options$format; + _this$options.mipmap; + var _this$options$wrapS = _this$options.wrapS, + wrapS = _this$options$wrapS === void 0 ? gl.CLAMP_TO_EDGE : _this$options$wrapS, + _this$options$wrapT = _this$options.wrapT, + wrapT = _this$options$wrapT === void 0 ? gl.CLAMP_TO_EDGE : _this$options$wrapT, + _this$options$aniso = _this$options.aniso, + aniso = _this$options$aniso === void 0 ? 0 : _this$options$aniso; + _this$options.alignment; + _this$options.premultiplyAlpha; + var _this$options$mag = _this$options.mag, + mag = _this$options$mag === void 0 ? gl.NEAREST : _this$options$mag, + _this$options$min = _this$options.min, + min = _this$options$min === void 0 ? gl.NEAREST : _this$options$min, + _this$options$colorSp = _this$options.colorSpace; + _this$options$colorSp === void 0 ? gl.BROWSER_DEFAULT_WEBGL : _this$options$colorSp; + var usage = _this$options.usage; + this.width = width; + this.height = height; + this.texture = this.engine.device.createTexture({ + size: [width, height, 1], + // TODO: arrayLayerCount is deprecated: use size.depth + // arrayLayerCount: 1, + mipLevelCount: 1, + // TODO: https://gpuweb.github.io/gpuweb/#dom-gputextureviewdescriptor-miplevelcount + sampleCount: 1, + dimension: constants.TextureDimension.E2d, + format: formatMap[format], + // could throw texture binding usage mismatch + usage: usage || constants.TextureUsage.Sampled | constants.TextureUsage.CopyDst + }); + + if (!usage || usage & constants.TextureUsage.Sampled) { + this.sampler = this.engine.device.createSampler({ + addressModeU: wrapModeMap[wrapS], + addressModeV: wrapModeMap[wrapT], + addressModeW: wrapModeMap[wrapS], + // TODO: same as addressModeU + magFilter: filterMap[mag], + minFilter: filterMap[min], + maxAnisotropy: aniso // @see https://gpuweb.github.io/gpuweb/#dom-gpusamplerdescriptor-maxanisotropy + + }); + } + } + }]); + + return WebGPUTexture2D; +}(); + +var _dec$e, _class$e, _temp$a; +var WebGPUEngine = (_dec$e = inversify.injectable(), _dec$e(_class$e = (_temp$a = /*#__PURE__*/function () { + function WebGPUEngine() { + var _this = this; + + _classCallCheck(this, WebGPUEngine); + + this.supportWebGPU = true; + this.useWGSL = false; + this.options = void 0; + this.canvas = void 0; + this.context = void 0; + this.glslang = void 0; + this.adapter = void 0; + this.device = void 0; + this.swapChain = void 0; + this.mainPassSampleCount = void 0; + this.mainTexture = void 0; + this.depthTexture = void 0; + this.mainColorAttachments = void 0; + this.mainTextureExtends = void 0; + this.mainDepthAttachment = void 0; + this.uploadEncoder = void 0; + this.renderEncoder = void 0; + this.computeEncoder = void 0; + this.renderTargetEncoder = void 0; + this.commandBuffers = new Array(4).fill(undefined); + this.currentRenderPass = null; + this.mainRenderPass = null; + this.currentRenderTargetViewDescriptor = void 0; + this.currentComputePass = null; + this.bundleEncoder = void 0; + this.tempBuffers = []; + this.currentRenderTarget = null; + this.uploadEncoderDescriptor = { + label: 'upload' + }; + this.renderEncoderDescriptor = { + label: 'render' + }; + this.renderTargetEncoderDescriptor = { + label: 'renderTarget' + }; + this.computeEncoderDescriptor = { + label: 'compute' + }; + this.pipelines = {}; + this.computePipelines = {}; + this.defaultSampleCount = 4; + this.clearDepthValue = 1; + this.clearStencilValue = 0; + this.transientViewport = { + x: Infinity, + y: 0, + width: 0, + height: 0 + }; + this.cachedViewport = { + x: 0, + y: 0, + width: 0, + height: 0 + }; + + this.clear = function (options) { + options.framebuffer; + var color = options.color, + depth = options.depth, + stencil = options.stencil; + + if (_this.options.supportCompute) { + _this.startComputePass(); + } // We need to recreate the render pass so that the new parameters for clear color / depth / stencil are taken into account + + + if (_this.currentRenderTarget) { + if (_this.currentRenderPass) { + _this.endRenderTargetRenderPass(); + } + + _this.startRenderTargetRenderPass(_this.currentRenderTarget, color ? color : null, !!depth, !!stencil); + } else { + // if (this.useReverseDepthBuffer) { + // this._depthCullingState.depthFunc = Constants.GREATER; + // } + _this.mainColorAttachments[0].loadValue = color ? color : constants.LoadOp.Load; + _this.mainDepthAttachment.depthLoadValue = depth ? depth : constants.LoadOp.Load; + _this.mainDepthAttachment.stencilLoadValue = stencil ? _this.clearStencilValue : constants.LoadOp.Load; + + if (_this.mainRenderPass) { + _this.endMainRenderPass(); + } + + _this.startMainRenderPass(); + } + }; + + this.createModel = /*#__PURE__*/function () { + var _ref = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee(options) { + var model; + return regenerator.wrap(function _callee$(_context) { + while (1) { + switch (_context.prev = _context.next) { + case 0: + model = new WebGPUModel(_this, options); + _context.next = 3; + return model.init(); + + case 3: + return _context.abrupt("return", model); + + case 4: + case "end": + return _context.stop(); + } + } + }, _callee); + })); + + return function (_x) { + return _ref.apply(this, arguments); + }; + }(); + + this.createAttribute = function (options) { + return new WebGPUAttribute(_this, options); + }; + + this.createBuffer = function (options) { + return new WebGPUBuffer(_this, options); + }; + + this.createElements = function (options) { + return new WebGPUElements(_this, options); + }; + + this.createTexture2D = function (options) { + return new WebGPUTexture2D(_this, options); + }; + + this.createFramebuffer = function (options) { + return new WebGPUFramebuffer(_this, options); + }; + + this.useFramebuffer = function (framebuffer, drawCommands) { + // bind + if (_this.currentRenderTarget) { + _this.unbindFramebuffer(_this.currentRenderTarget); + } + + _this.currentRenderTarget = framebuffer; // TODO: use mipmap options in framebuffer + + _this.currentRenderTargetViewDescriptor = { + dimension: constants.TextureViewDimension.E2d, + // mipLevelCount: bindWithMipMaps ? WebGPUTextureHelper.computeNumMipmapLevels(texture.width, texture.height) - lodLevel : 1, + // baseArrayLayer: faceIndex, + // baseMipLevel: lodLevel, + arrayLayerCount: 1, + aspect: constants.TextureAspect.All + }; + _this.currentRenderPass = null; + drawCommands(); + }; + + this.createComputeModel = /*#__PURE__*/function () { + var _ref2 = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee2(context) { + var model; + return regenerator.wrap(function _callee2$(_context2) { + while (1) { + switch (_context2.prev = _context2.next) { + case 0: + model = new WebGPUComputeModel(_this, context); + _context2.next = 3; + return model.init(); + + case 3: + return _context2.abrupt("return", model); + + case 4: + case "end": + return _context2.stop(); + } + } + }, _callee2); + })); + + return function (_x2) { + return _ref2.apply(this, arguments); + }; + }(); + + this.getCanvas = function () { + return _this.canvas; + }; + + this.getGLContext = function () { + throw new Error('Method not implemented.'); + }; + + this.viewport = function (_ref3) { + var x = _ref3.x, + y = _ref3.y, + width = _ref3.width, + height = _ref3.height; + + if (!_this.currentRenderPass) { + // call viewport() before current render pass created + _this.transientViewport = { + x: x, + y: y, + width: width, + height: height + }; + } else if (_this.transientViewport.x !== Infinity) { + var renderPass = _this.getCurrentRenderPass(); // @see https://gpuweb.github.io/gpuweb/#dom-gpurenderpassencoder-setviewport + + + renderPass.setViewport(_this.transientViewport.x, _this.transientViewport.y, _this.transientViewport.width, _this.transientViewport.height, 0, 1); + } else if (x !== _this.cachedViewport.x || y !== _this.cachedViewport.y || width !== _this.cachedViewport.width || height !== _this.cachedViewport.height) { + _this.cachedViewport = { + x: x, + y: y, + width: width, + height: height + }; + + var _renderPass = _this.getCurrentRenderPass(); + + _renderPass.setViewport(x, y, width, height, 0, 1); + } + }; + + this.readPixels = function (options) { + throw new Error('Method not implemented.'); + }; + } + + _createClass(WebGPUEngine, [{ + key: "isFloatSupported", + value: function isFloatSupported() { + return true; + } + }, { + key: "init", + value: function () { + var _init = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee3(config) { + return regenerator.wrap(function _callee3$(_context3) { + while (1) { + switch (_context3.prev = _context3.next) { + case 0: + this.canvas = config.canvas; + this.options = config; + this.useWGSL = !!config.useWGSL; + this.mainPassSampleCount = config.antialiasing ? this.defaultSampleCount : 1; + _context3.next = 6; + return this.initGlslang(); + + case 6: + this.initContextAndSwapChain(); + this.initMainAttachments(); + + case 8: + case "end": + return _context3.stop(); + } + } + }, _callee3, this); + })); + + function init(_x3) { + return _init.apply(this, arguments); + } + + return init; + }() + }, { + key: "setScissor", + value: function setScissor(scissor) { + throw new Error('Method not implemented.'); + } + }, { + key: "destroy", + value: function destroy() { + if (this.mainTexture) { + this.mainTexture.destroy(); + } + + if (this.depthTexture) { + this.depthTexture.destroy(); + } + + this.tempBuffers.forEach(function (buffer) { + return buffer.destroy(); + }); + this.tempBuffers = []; + } + }, { + key: "beginFrame", + value: function beginFrame() { + this.uploadEncoder = this.device.createCommandEncoder(this.uploadEncoderDescriptor); + this.renderEncoder = this.device.createCommandEncoder(this.renderEncoderDescriptor); + this.renderTargetEncoder = this.device.createCommandEncoder(this.renderTargetEncoderDescriptor); + + if (this.options.supportCompute) { + this.computeEncoder = this.device.createCommandEncoder(this.computeEncoderDescriptor); + } + } + }, { + key: "endFrame", + value: function endFrame() { + if (this.options.supportCompute) { + this.endComputePass(); + } + + this.endMainRenderPass(); + this.commandBuffers[0] = this.uploadEncoder.finish(); + this.commandBuffers[1] = this.renderEncoder.finish(); + + if (this.options.supportCompute) { + this.commandBuffers[2] = this.computeEncoder.finish(); + } + + this.commandBuffers[3] = this.renderTargetEncoder.finish(); + + if (isSafari) { + this.device // @ts-ignore + .getQueue().submit(this.commandBuffers.filter(function (buffer) { + return buffer; + })); + } else { + this.device.defaultQueue.submit(this.commandBuffers.filter(function (buffer) { + return buffer; + })); + } + } + }, { + key: "getCurrentRenderPass", + value: function getCurrentRenderPass() { + if (this.currentRenderTarget && !this.currentRenderPass) { + this.startRenderTargetRenderPass(this.currentRenderTarget, null, false, false); + } else if (!this.currentRenderPass) { + this.startMainRenderPass(); + } + + return this.currentRenderPass; + } + }, { + key: "initGlslang", + value: function () { + var _initGlslang = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee4() { + var _navigator, _navigator$gpu; + + return regenerator.wrap(function _callee4$(_context4) { + while (1) { + switch (_context4.prev = _context4.next) { + case 0: + _context4.next = 2; + return glslang$1(); + + case 2: + this.glslang = _context4.sent; + _context4.next = 5; + return (_navigator = navigator) === null || _navigator === void 0 ? void 0 : (_navigator$gpu = _navigator.gpu) === null || _navigator$gpu === void 0 ? void 0 : _navigator$gpu.requestAdapter(); + + case 5: + this.adapter = _context4.sent; + _context4.next = 8; + return this.adapter.requestDevice(); + + case 8: + this.device = _context4.sent; + + case 9: + case "end": + return _context4.stop(); + } + } + }, _callee4, this); + })); + + function initGlslang() { + return _initGlslang.apply(this, arguments); + } + + return initGlslang; + }() + }, { + key: "initContextAndSwapChain", + value: function initContextAndSwapChain() { + this.context = this.canvas.getContext(isSafari ? 'gpu' : 'gpupresent'); + this.swapChain = this.context.configureSwapChain({ + device: this.device, + format: this.options.swapChainFormat, + usage: constants.TextureUsage.OutputAttachment | constants.TextureUsage.CopySrc + }); + } + }, { + key: "initMainAttachments", + value: function initMainAttachments() { + this.mainTextureExtends = { + width: this.canvas.width, + height: this.canvas.height, + depth: 1 + }; + + if (this.options.antialiasing) { + var mainTextureDescriptor = { + size: this.mainTextureExtends, + // TODO: arrayLayerCount is deprecated: use size.depth + // arrayLayerCount: 1, + mipLevelCount: 1, + sampleCount: this.mainPassSampleCount, + dimension: constants.TextureDimension.E2d, + format: constants.TextureFormat.BGRA8Unorm, + usage: constants.TextureUsage.OutputAttachment + }; + + if (this.mainTexture) { + this.mainTexture.destroy(); + } + + this.mainTexture = this.device.createTexture(mainTextureDescriptor); + this.mainColorAttachments = [{ + attachment: isSafari ? // @ts-ignore + this.mainTexture.createDefaultView() : this.mainTexture.createView(), + loadValue: [0, 0, 0, 1], + storeOp: constants.StoreOp.Store + }]; + } else { + this.mainColorAttachments = [{ + attachment: isSafari ? // @ts-ignore + this.swapChain.getCurrentTexture().createDefaultView() : this.swapChain.getCurrentTexture().createView(), + loadValue: [0, 0, 0, 1], + storeOp: constants.StoreOp.Store + }]; + } + + var depthTextureDescriptor = { + size: this.mainTextureExtends, + // arrayLayerCount: 1, + mipLevelCount: 1, + sampleCount: this.mainPassSampleCount, + dimension: constants.TextureDimension.E2d, + format: isSafari ? 'depth32float-stencil8' : constants.TextureFormat.Depth24PlusStencil8, + usage: constants.TextureUsage.OutputAttachment + }; + + if (this.depthTexture) { + this.depthTexture.destroy(); + } + + this.depthTexture = this.device.createTexture( // @ts-ignore + depthTextureDescriptor); + this.mainDepthAttachment = { + attachment: isSafari ? // @ts-ignore + this.depthTexture.createDefaultView() : this.depthTexture.createView(), + depthLoadValue: this.clearDepthValue, + depthStoreOp: constants.StoreOp.Store, + stencilLoadValue: this.clearStencilValue, + stencilStoreOp: constants.StoreOp.Store + }; + } + }, { + key: "startComputePass", + value: function startComputePass() { + if (this.currentComputePass) { + this.endComputePass(); + } + + this.currentComputePass = this.computeEncoder.beginComputePass(); + } + }, { + key: "startMainRenderPass", + value: function startMainRenderPass() { + if (this.currentRenderPass && !this.currentRenderTarget) { + this.endMainRenderPass(); + } // Resolve in case of MSAA + + + if (this.options.antialiasing) { + this.mainColorAttachments[0].resolveTarget = isSafari ? // @ts-ignore + this.swapChain.getCurrentTexture().createDefaultView() : this.swapChain.getCurrentTexture().createView(); + } else { + this.mainColorAttachments[0].attachment = isSafari ? // @ts-ignore + this.swapChain.getCurrentTexture().createDefaultView() : this.swapChain.getCurrentTexture().createView(); + } + + this.currentRenderPass = this.renderEncoder.beginRenderPass({ + colorAttachments: this.mainColorAttachments, + depthStencilAttachment: this.mainDepthAttachment // TODO: use framebuffer's depth & stencil + + }); + this.mainRenderPass = this.currentRenderPass; + + if (this.cachedViewport) { + this.viewport(this.cachedViewport); + } + } + }, { + key: "startRenderTargetRenderPass", + value: function startRenderTargetRenderPass(renderTarget, clearColor, clearDepth) { + var _renderTarget$get$col, _renderTarget$get$dep; + + var clearStencil = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : false; + var gpuTexture = (_renderTarget$get$col = renderTarget.get().color) === null || _renderTarget$get$col === void 0 ? void 0 : _renderTarget$get$col.texture; + var colorTextureView; + + if (gpuTexture) { + colorTextureView = gpuTexture.createView(this.currentRenderTargetViewDescriptor); + } + + var depthStencilTexture = (_renderTarget$get$dep = renderTarget.get().depth) === null || _renderTarget$get$dep === void 0 ? void 0 : _renderTarget$get$dep.texture; + var depthStencilTextureView; + + if (depthStencilTexture) { + depthStencilTextureView = depthStencilTexture.createView(); + } + + var renderPass = this.renderTargetEncoder.beginRenderPass({ + colorAttachments: [{ + attachment: colorTextureView, + loadValue: clearColor !== null ? clearColor : constants.LoadOp.Load, + storeOp: constants.StoreOp.Store + }], + depthStencilAttachment: depthStencilTexture && depthStencilTextureView ? { + attachment: depthStencilTextureView, + depthLoadValue: clearDepth ? this.clearDepthValue : constants.LoadOp.Load, + depthStoreOp: constants.StoreOp.Store, + stencilLoadValue: clearStencil ? this.clearStencilValue : constants.LoadOp.Load, + stencilStoreOp: constants.StoreOp.Store + } : undefined + }); + this.currentRenderPass = renderPass; + + if (this.cachedViewport) { + this.viewport(this.cachedViewport); + } // TODO WEBGPU set the scissor rect and the stencil reference value + + } + }, { + key: "endMainRenderPass", + value: function endMainRenderPass() { + if (this.currentRenderPass === this.mainRenderPass && this.currentRenderPass !== null) { + this.currentRenderPass.endPass(); + this.resetCachedViewport(); + this.currentRenderPass = null; + this.mainRenderPass = null; + } + } + }, { + key: "endComputePass", + value: function endComputePass() { + if (this.currentComputePass) { + this.currentComputePass.endPass(); + this.currentComputePass = null; + } + } + }, { + key: "endRenderTargetRenderPass", + value: function endRenderTargetRenderPass() { + if (this.currentRenderPass) { + this.currentRenderPass.endPass(); + this.resetCachedViewport(); + } + } + }, { + key: "resetCachedViewport", + value: function resetCachedViewport() { + this.cachedViewport = { + x: 0, + y: 0, + width: 0, + height: 0 + }; + } + }, { + key: "unbindFramebuffer", + value: function unbindFramebuffer(framebuffer) { + // unbind + if (this.currentRenderPass && this.currentRenderPass !== this.mainRenderPass) { + this.endRenderTargetRenderPass(); + } + + this.transientViewport.x = Infinity; + this.currentRenderTarget = null; // if (texture.generateMipMaps && !disableGenerateMipMaps && !texture.isCube) { + // this._generateMipmaps(texture); + // } + + this.currentRenderPass = this.mainRenderPass; + } + }]); + + return WebGPUEngine; +}(), _temp$a)) || _class$e); + +var _dec$d, _class$d; + +function _createSuper$7(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$7(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; } + +function _isNativeReflectConstruct$7() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } +var primitiveUv1Padding = 4.0 / 64; +var primitiveUv1PaddingScale = 1.0 - primitiveUv1Padding * 2; +var +/** + * borrow from playcanvas: + * Creates a procedural box-shaped mesh + */ +Box = (_dec$d = inversify.injectable(), _dec$d(_class$d = /*#__PURE__*/function (_Geometry) { + _inherits(Box, _Geometry); + + var _super = _createSuper$7(Box); + + function Box() { + _classCallCheck(this, Box); + + return _super.apply(this, arguments); + } + + _createClass(Box, [{ + key: "onEntityCreated", + value: function onEntityCreated() { + var _this$config = this.config, + _this$config$widthSeg = _this$config.widthSegments, + widthSegments = _this$config$widthSeg === void 0 ? 1 : _this$config$widthSeg, + _this$config$heightSe = _this$config.heightSegments, + heightSegments = _this$config$heightSe === void 0 ? 1 : _this$config$heightSe, + _this$config$depthSeg = _this$config.depthSegments, + depthSegments = _this$config$depthSeg === void 0 ? 1 : _this$config$depthSeg, + _this$config$halfExte = _this$config.halfExtents, + halfExtents = _this$config$halfExte === void 0 ? fromValues$3(0.5, 0.5, 0.5) : _this$config$halfExte; + var ws = widthSegments; + var hs = heightSegments; + var ds = depthSegments; + + var _halfExtents = _slicedToArray(halfExtents, 3), + hex = _halfExtents[0], + hey = _halfExtents[1], + hez = _halfExtents[2]; + + var corners = [fromValues$3(-hex, -hey, hez), fromValues$3(hex, -hey, hez), fromValues$3(hex, hey, hez), fromValues$3(-hex, hey, hez), fromValues$3(hex, -hey, -hez), fromValues$3(-hex, -hey, -hez), fromValues$3(-hex, hey, -hez), fromValues$3(hex, hey, -hez)]; + var faceAxes = [[0, 1, 3], // FRONT + [4, 5, 7], // BACK + [3, 2, 6], // TOP + [1, 0, 4], // BOTTOM + [1, 4, 2], // RIGHT + [5, 0, 6] // LEFT + ]; + var faceNormals = [[0, 0, 1], // FRONT + [0, 0, -1], // BACK + [0, 1, 0], // TOP + [0, -1, 0], // BOTTOM + [1, 0, 0], // RIGHT + [-1, 0, 0] // LEFT + ]; + var sides = { + FRONT: 0, + BACK: 1, + TOP: 2, + BOTTOM: 3, + RIGHT: 4, + LEFT: 5 + }; + var positions = []; + var normals = []; + var uvs = []; + var indices = []; + var vcounter = 0; + + var generateFace = function generateFace(side, uSegments, vSegments) { + var u; + var v; + var i; + var j; + + for (i = 0; i <= uSegments; i++) { + for (j = 0; j <= vSegments; j++) { + var temp1 = create$4(); + var temp2 = create$4(); + var temp3 = create$4(); + var r = create$4(); + lerp$2(temp1, corners[faceAxes[side][0]], corners[faceAxes[side][1]], i / uSegments); + lerp$2(temp2, corners[faceAxes[side][0]], corners[faceAxes[side][2]], j / vSegments); + sub$2(temp3, temp2, corners[faceAxes[side][0]]); + add$4(r, temp1, temp3); + u = i / uSegments; + v = j / vSegments; + positions.push(r[0], r[1], r[2]); + normals.push(faceNormals[side][0], faceNormals[side][1], faceNormals[side][2]); + uvs.push(u, v); // pack as 3x2 + // 1/3 will be empty, but it's either that or stretched pixels + // TODO: generate non-rectangular lightMaps, so we could use space without stretching + + u /= 3; + v /= 3; + u = u * primitiveUv1PaddingScale + primitiveUv1Padding; + v = v * primitiveUv1PaddingScale + primitiveUv1Padding; + u += side % 3 / 3; + v += Math.floor(side / 3) / 3; + + if (i < uSegments && j < vSegments) { + indices.push(vcounter + vSegments + 1, vcounter + 1, vcounter); + indices.push(vcounter + vSegments + 1, vcounter + vSegments + 2, vcounter + 1); + } + + vcounter++; + } + } + }; + + generateFace(sides.FRONT, ws, hs); + generateFace(sides.BACK, ws, hs); + generateFace(sides.TOP, ws, ds); + generateFace(sides.BOTTOM, ws, ds); + generateFace(sides.RIGHT, ds, hs); + generateFace(sides.LEFT, ds, hs); // generate AABB + + var aabb = generateAABBFromVertices(positions); + var component = this.getComponent(); + component.indices = Uint32Array.from(indices); + component.aabb = aabb; + component.vertexCount = vcounter; + component.attributes = [{ + dirty: true, + name: 'position', + data: Float32Array.from(positions), + arrayStride: 4 * 3, + stepMode: 'vertex', + attributes: [{ + shaderLocation: 0, + offset: 0, + format: 'float3' + }] + }, { + dirty: true, + name: 'normal', + data: Float32Array.from(normals), + arrayStride: 4 * 3, + stepMode: 'vertex', + attributes: [{ + shaderLocation: 1, + offset: 0, + format: 'float3' + }] + }, { + dirty: true, + name: 'uv', + data: Float32Array.from(uvs), + arrayStride: 4 * 2, + stepMode: 'vertex', + attributes: [{ + shaderLocation: 2, + offset: 0, + format: 'float2' + }] + }]; // TODO: barycentric & tangent + } + }]); + + return Box; +}(Geometry)) || _class$d); + +function merge(a, b) { + // Checks for truthy values on both arrays + if (!a && !b) { + throw new Error('Please specify valid arguments for parameters a and b.'); + } // Checks for truthy values or empty arrays on each argument + // to avoid the unnecessary construction of a new array and + // the type comparison + + + if (!b || b.length === 0) { + return a; + } + + if (!a || a.length === 0) { + return b; + } // Make sure that both typed arrays are of the same type + + + if (Object.prototype.toString.call(a) !== Object.prototype.toString.call(b)) { + throw new Error('The types of the two arguments passed for parameters a and b do not match.'); + } // @ts-ignore + + + var c = new a.constructor(a.length + b.length); + c.set(a); + c.set(b, a.length); + return c; +} + +var _dec$c, _class$c; + +function _createSuper$6(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$6(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; } + +function _isNativeReflectConstruct$6() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } +var +/** + * merge many geometries into one, use a batch of draw calls + */ +Merged = (_dec$c = inversify.injectable(), _dec$c(_class$c = /*#__PURE__*/function (_Geometry) { + _inherits(Merged, _Geometry); + + var _super = _createSuper$6(Merged); + + function Merged() { + _classCallCheck(this, Merged); + + return _super.apply(this, arguments); + } + + _createClass(Merged, [{ + key: "onEntityCreated", + value: function onEntityCreated() { + var _this$config$geometri = this.config.geometries, + geometries = _this$config$geometri === void 0 ? [] : _this$config$geometri; + var mergedComponent = this.getComponent(); + mergedComponent.aabb = new AABB(); + var mergedAttributes = []; + var mergedIndices = []; + var indexOffset = 0; + geometries.forEach(function (geometry) { + var aabb = geometry.aabb, + indices = geometry.indices, + vertexCount = geometry.vertexCount, + attributes = geometry.attributes; // merge aabb + + mergedComponent.aabb.add(aabb); + mergedComponent.vertexCount += vertexCount; // merge indices + + if (indices) { + mergedIndices.push.apply(mergedIndices, _toConsumableArray(indices.map(function (index) { + return index + indexOffset; + }))); + } + + indexOffset += vertexCount; // merge attributes + + attributes.forEach(function (attribute, i) { + if (!mergedAttributes[i]) { + mergedAttributes[i] = attribute; + mergedAttributes[i].dirty = true; + } else { + if (attribute.data) { + if (isNumber$1(attribute.data)) { + // @ts-ignore + mergedAttributes[i].push(attribute.data); + } else if (isTypedArray$1(attribute.data)) { + // @ts-ignore + mergedAttributes[i].data = merge( // @ts-ignore + mergedAttributes[i].data, attribute.data); + } else { + // @ts-ignore + mergedAttributes[i].data = mergedAttributes[i].data.concat(attribute.data); + } + } + } + }); + }); + mergedComponent.attributes = mergedAttributes; + mergedComponent.indices = Uint32Array.from(mergedIndices); + mergedComponent.dirty = true; + } + }]); + + return Merged; +}(Geometry)) || _class$c); + +var _dec$b, _class$b; + +function _createSuper$5(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$5(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; } + +function _isNativeReflectConstruct$5() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } +var +/** + * borrow from playcanvas + */ +Plane = (_dec$b = inversify.injectable(), _dec$b(_class$b = /*#__PURE__*/function (_Geometry) { + _inherits(Plane, _Geometry); + + var _super = _createSuper$5(Plane); + + function Plane() { + _classCallCheck(this, Plane); + + return _super.apply(this, arguments); + } + + _createClass(Plane, [{ + key: "onEntityCreated", + value: function onEntityCreated() { + var _this$config = this.config, + _this$config$halfExte = _this$config.halfExtents, + halfExtents = _this$config$halfExte === void 0 ? [0.5, 0.5] : _this$config$halfExte, + _this$config$widthSeg = _this$config.widthSegments, + widthSegments = _this$config$widthSeg === void 0 ? 5 : _this$config$widthSeg, + _this$config$lengthSe = _this$config.lengthSegments, + lengthSegments = _this$config$lengthSe === void 0 ? 5 : _this$config$lengthSe; + var positions = []; + var normals = []; + var uvs = []; + var indices = []; + var vcounter = 0; + + for (var i = 0; i <= widthSegments; i++) { + for (var j = 0; j <= lengthSegments; j++) { + var x = -halfExtents[0] + 2.0 * halfExtents[0] * i / widthSegments; + var y = 0.0; + var z = -(-halfExtents[1] + 2.0 * halfExtents[1] * j / lengthSegments); + var u = i / widthSegments; + var v = j / lengthSegments; + positions.push(x, y, z); + normals.push(0.0, 1.0, 0.0); + uvs.push(u, v); + + if (i < widthSegments && j < lengthSegments) { + indices.push(vcounter + lengthSegments + 1, vcounter + 1, vcounter); + indices.push(vcounter + lengthSegments + 1, vcounter + lengthSegments + 2, vcounter + 1); + } + + vcounter++; + } + } // generate AABB + + + var aabb = generateAABBFromVertices(positions); + var component = this.getComponent(); + component.indices = Uint32Array.from(indices); + component.aabb = aabb; + component.vertexCount = vcounter; + component.attributes = [{ + dirty: true, + name: 'position', + data: Float32Array.from(positions), + arrayStride: 4 * 3, + stepMode: 'vertex', + attributes: [{ + shaderLocation: 0, + offset: 0, + format: 'float3' + }] + }, { + dirty: true, + name: 'normal', + data: Float32Array.from(normals), + arrayStride: 4 * 3, + stepMode: 'vertex', + attributes: [{ + shaderLocation: 1, + offset: 0, + format: 'float3' + }] + }, { + dirty: true, + name: 'uv', + data: Float32Array.from(uvs), + arrayStride: 4 * 2, + stepMode: 'vertex', + attributes: [{ + shaderLocation: 2, + offset: 0, + format: 'float2' + }] + }]; // TODO: barycentric & tangent + } + }]); + + return Plane; +}(Geometry)) || _class$b); + +var _dec$a, _class$a; + +function _createSuper$4(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$4(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; } + +function _isNativeReflectConstruct$4() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } +var +/** + * borrow from playcanvas + */ +Sphere = (_dec$a = inversify.injectable(), _dec$a(_class$a = /*#__PURE__*/function (_Geometry) { + _inherits(Sphere, _Geometry); + + var _super = _createSuper$4(Sphere); + + function Sphere() { + _classCallCheck(this, Sphere); + + return _super.apply(this, arguments); + } + + _createClass(Sphere, [{ + key: "onEntityCreated", + value: function onEntityCreated() { + var _this$config = this.config, + _this$config$radius = _this$config.radius, + radius = _this$config$radius === void 0 ? 0.5 : _this$config$radius, + _this$config$latitude = _this$config.latitudeBands, + latitudeBands = _this$config$latitude === void 0 ? 16 : _this$config$latitude, + _this$config$longitud = _this$config.longitudeBands, + longitudeBands = _this$config$longitud === void 0 ? 16 : _this$config$longitud; + var positions = []; + var normals = []; + var uvs = []; + var indices = []; + + for (var lat = 0; lat <= latitudeBands; lat++) { + var theta = lat * Math.PI / latitudeBands; + var sinTheta = Math.sin(theta); + var cosTheta = Math.cos(theta); + + for (var lon = 0; lon <= longitudeBands; lon++) { + // Sweep the sphere from the positive Z axis to match a 3DS Max sphere + var phi = lon * 2 * Math.PI / longitudeBands - Math.PI / 2.0; + var sinPhi = Math.sin(phi); + var cosPhi = Math.cos(phi); + var x = cosPhi * sinTheta; + var y = cosTheta; + var z = sinPhi * sinTheta; + var u = 1.0 - lon / longitudeBands; + var v = 1.0 - lat / latitudeBands; + positions.push(x * radius, y * radius, z * radius); + normals.push(x, y, z); + uvs.push(u, v); + } + } + + for (var _lat = 0; _lat < latitudeBands; ++_lat) { + for (var _lon = 0; _lon < longitudeBands; ++_lon) { + var first = _lat * (longitudeBands + 1) + _lon; + var second = first + longitudeBands + 1; + indices.push(first + 1, second, first); + indices.push(first + 1, second + 1, second); + } + } // generate AABB + + + var aabb = generateAABBFromVertices(positions); + var component = this.getComponent(); + component.indices = Uint32Array.from(indices); + component.aabb = aabb; + component.vertexCount = positions.length / 3; + component.attributes = [{ + dirty: true, + name: 'position', + data: Float32Array.from(positions), + arrayStride: 4 * 3, + stepMode: 'vertex', + attributes: [{ + shaderLocation: 0, + offset: 0, + format: 'float3' + }] + }, { + dirty: true, + name: 'normal', + data: Float32Array.from(normals), + arrayStride: 4 * 3, + stepMode: 'vertex', + attributes: [{ + shaderLocation: 1, + offset: 0, + format: 'float3' + }] + }, { + dirty: true, + name: 'uv', + data: Float32Array.from(uvs), + arrayStride: 4 * 2, + stepMode: 'vertex', + attributes: [{ + shaderLocation: 2, + offset: 0, + format: 'float2' + }] + }]; // TODO: barycentric & tangent + } + }]); + + return Sphere; +}(Geometry)) || _class$a); + +var _dec$9, _dec2$7, _dec3$6, _class$9, _class2$7, _descriptor$7, _descriptor2$5, _temp$9; + +function _createSuper$3(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$3(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; } + +function _isNativeReflectConstruct$3() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } + +/* babel-plugin-inline-import './shaders/webgl.basic.frag.glsl' */ +var webglFragmentShaderGLSL = "varying vec4 fragColor;\n\n#pragma include \"uv.frag.declaration\"\n#pragma include \"map.frag.declaration\"\n\nvoid main() {\n vec4 diffuseColor = fragColor;\n\n #pragma include \"map.frag.main\"\n\n gl_FragColor = diffuseColor;\n}"; + +/* babel-plugin-inline-import './shaders/webgl.basic.vert.glsl' */ +var webglVertexShaderGLSL = "attribute vec3 position;\nattribute vec3 normal;\n\nuniform mat4 projectionMatrix;\nuniform mat4 modelViewMatrix;\nuniform vec4 color;\n\nvarying vec4 fragColor;\n\n#pragma include \"uv.vert.declaration\"\n\nvoid main() {\n gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);\n fragColor = color;\n\n #pragma include \"uv.vert.main\"\n}"; + +/* babel-plugin-inline-import './shaders/webgpu.basic.frag.glsl' */ +var webgpuFragmentShaderGLSL = "// layout(set = 0, binding = 1) uniform WireframeUniforms {\n// float lineWidth;\n// vec4 lineColor;\n// } wireframe;\n\nlayout(location = 0) in vec4 fragColor;\n// layout(location = 1) in vec3 v_Barycentric;\n\nlayout(location = 0) out vec4 outColor;\n\n// wireframe\n// float edgeFactor() {\n// vec3 d = fwidth(v_Barycentric);\n// vec3 a3 = smoothstep(vec3(0.0), d * wireframe.lineWidth, v_Barycentric);\n// return min(min(a3.x, a3.y), a3.z);\n// }\n\nvoid main() {\n // outColor = mix(fragColor, wireframe.lineColor, (1.0 - edgeFactor()));\n outColor = fragColor;\n}"; + +/* babel-plugin-inline-import './shaders/webgpu.basic.vert.glsl' */ +var webgpuVertexShaderGLSL = "layout(set = 0, binding = 0) uniform Uniforms {\n vec4 color;\n mat4 projectionMatrix;\n mat4 modelViewMatrix;\n} uniforms;\n\nlayout(location = 0) in vec3 position;\n// layout(location = 1) in vec3 barycentric;\n\nlayout(location = 0) out vec4 fragColor;\n// layout(location = 1) out vec3 v_Barycentric;\n\nvoid main() {\n gl_Position = uniforms.projectionMatrix * uniforms.modelViewMatrix * vec4(position, 1.0);\n fragColor = uniforms.color;\n // v_Barycentric = barycentric;\n}"; +var +/** + * This material is not affected by lights. + * @see https://threejs.org/docs/#api/en/materials/MeshBasicMaterial + */ +Basic = (_dec$9 = inversify.injectable(), _dec2$7 = inversify.inject(IDENTIFIER.RenderEngine), _dec3$6 = inversify.inject(IDENTIFIER.ShaderModuleService), _dec$9(_class$9 = (_class2$7 = (_temp$9 = /*#__PURE__*/function (_Material) { + _inherits(Basic, _Material); + + var _super = _createSuper$3(Basic); + + function Basic() { + var _this; + + _classCallCheck(this, Basic); + + for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { + args[_key] = arguments[_key]; + } + + _this = _super.call.apply(_super, [this].concat(args)); + + _initializerDefineProperty(_this, "engine", _descriptor$7, _assertThisInitialized(_this)); + + _initializerDefineProperty(_this, "shaderModuleService", _descriptor2$5, _assertThisInitialized(_this)); + + return _this; + } + + _createClass(Basic, [{ + key: "onEntityCreated", + value: function onEntityCreated() { + var component = this.getComponent(); + var vertexShaderGLSL = this.engine.supportWebGPU ? webgpuVertexShaderGLSL : webglVertexShaderGLSL; + var fragmentShaderGLSL = this.engine.supportWebGPU ? webgpuFragmentShaderGLSL : webglFragmentShaderGLSL; + this.shaderModuleService.registerModule('material-basic', { + vs: vertexShaderGLSL, + fs: fragmentShaderGLSL + }); + + var _this$shaderModuleSer = this.shaderModuleService.getModule('material-basic'), + vs = _this$shaderModuleSer.vs, + fs = _this$shaderModuleSer.fs, + extractedUniforms = _this$shaderModuleSer.uniforms; + + component.vertexShaderGLSL = vs; + component.fragmentShaderGLSL = fs; // @ts-ignore + + component.setUniform(extractedUniforms); + + if (this.config.map) { + component.setDefines({ + USE_UV: 1, + USE_MAP: 1 + }); + component.setUniform({ + // @ts-ignore + map: this.config.map, + uvTransform: create$6() + }); + } + } + }]); + + return Basic; +}(Material), _temp$9), (_descriptor$7 = _applyDecoratedDescriptor(_class2$7.prototype, "engine", [_dec2$7], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor2$5 = _applyDecoratedDescriptor(_class2$7.prototype, "shaderModuleService", [_dec3$6], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +})), _class2$7)) || _class$9); + +var _dec$8, _dec2$6, _dec3$5, _dec4$3, _dec5$2, _dec6$2, _class$8, _class2$6, _descriptor$6, _descriptor2$4, _descriptor3$3, _temp$8; + +function _createSuper$2(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$2(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; } + +function _isNativeReflectConstruct$2() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } + +/* babel-plugin-inline-import './shaders/webgl.grid.frag.glsl' */ +var gridFrag = "// generate grid, borrow from clay.gl viewer\n// @see https://github.com/pissang/clay-viewer/blob/master/src/graphic/ground.glsl\n#extension GL_OES_standard_derivatives : enable\n\nvarying vec3 v_Position;\n// varying vec3 v_Normal;\n\nuniform float u_GridSize : 5;\nuniform float u_GridSize2 : .5;\nuniform vec4 u_GridColor : [0, 0, 0, 1];\nuniform vec4 u_GridColor2 : [0.3, 0.3, 0.3, 1];\nuniform bool u_GridEnabled : true;\n\n// uniform vec3 u_LightDirection;\n// uniform vec3 u_LightColor;\n// uniform vec3 u_Camera;\n\nvoid main() {\n // vec3 n = v_Normal;\n // vec3 l = normalize(u_LightDirection);\n // float NdotL = clamp(dot(n, l), 0.001, 1.0);\n\n gl_FragColor = vec4(1.);\n\n if (u_GridEnabled) {\n float wx = v_Position.x;\n float wz = v_Position.z;\n // float x0 = abs(fract(wx / u_GridSize - 0.5) - 0.5) / fwidth(wx) * u_GridSize / 2.0;\n // float z0 = abs(fract(wz / u_GridSize - 0.5) - 0.5) / fwidth(wz) * u_GridSize / 2.0;\n\n float x1 = abs(fract(wx / u_GridSize2 - 0.5) - 0.5) / fwidth(wx) * u_GridSize2;\n float z1 = abs(fract(wz / u_GridSize2 - 0.5) - 0.5) / fwidth(wz) * u_GridSize2;\n\n // float v0 = 1.0 - clamp(min(x0, z0), 0.0, 1.0);\n float v1 = 1.0 - clamp(min(x1, z1), 0.0, 1.0);\n // if (v0 > 0.1) {\n // gl_FragColor = mix(gl_FragColor, u_GridColor, v0);\n // }\n // else {\n gl_FragColor = mix(gl_FragColor, u_GridColor2, v1);\n // }\n }\n\n // float shadowFactor = calcShadow(u_ShadowMap, v_PositionFromLight, l, n);\n // vec3 diffuseColor = u_LightColor * NdotL * shadowFactor;\n\n // gl_FragColor.rgb *= diffuseColor;\n}"; + +/* babel-plugin-inline-import './shaders/webgl.grid.vert.glsl' */ +var gridVert = "attribute vec3 a_Position;\n\nvarying vec3 v_Position;\n\nuniform mat4 projectionMatrix;\nuniform mat4 modelViewMatrix;\n\nvoid main() {\n v_Position = a_Position;\n gl_Position = projectionMatrix * modelViewMatrix * vec4(a_Position, 1.);\n}"; +var Grid$2 = (_dec$8 = inversify.injectable(), _dec2$6 = inversify.inject(IDENTIFIER.Systems), _dec3$5 = inversify.named(IDENTIFIER.MaterialSystem), _dec4$3 = inversify.inject(IDENTIFIER.Systems), _dec5$2 = inversify.named(IDENTIFIER.GeometrySystem), _dec6$2 = inversify.inject(IDENTIFIER.ShaderModuleService), _dec$8(_class$8 = (_class2$6 = (_temp$8 = /*#__PURE__*/function (_Renderable) { + _inherits(Grid, _Renderable); + + var _super = _createSuper$2(Grid); + + function Grid() { + var _this; + + _classCallCheck(this, Grid); + + for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { + args[_key] = arguments[_key]; + } + + _this = _super.call.apply(_super, [this].concat(args)); + + _initializerDefineProperty(_this, "materialSystem", _descriptor$6, _assertThisInitialized(_this)); + + _initializerDefineProperty(_this, "geometrySystem", _descriptor2$4, _assertThisInitialized(_this)); + + _initializerDefineProperty(_this, "shaderModuleService", _descriptor3$3, _assertThisInitialized(_this)); + + return _this; + } + + _createClass(Grid, [{ + key: "onAttributeChanged", + value: function onAttributeChanged(_ref) { + var name = _ref.name, + data = _ref.data; + var mesh = this.getMeshComponent(); + + if (mesh && mesh.material) { + if (name === 'gridColor') { + mesh.material.setUniform('u_GridColor', data); + mesh.material.setUniform('u_GridColor2', data); + } else if (name === 'gridSize') { + mesh.material.setUniform('u_GridSize', data); + mesh.material.setUniform('u_GridSize2', data); + } + } + } + }, { + key: "onEntityCreated", + value: function onEntityCreated() { + this.shaderModuleService.registerModule('grid', { + vs: gridVert, + fs: gridFrag + }); + + var _this$shaderModuleSer = this.shaderModuleService.getModule('grid'), + vs = _this$shaderModuleSer.vs, + fs = _this$shaderModuleSer.fs, + extractedUniforms = _this$shaderModuleSer.uniforms; + + var material = this.materialSystem.createShaderMaterial({ + vertexShader: vs, + fragmentShader: fs + }); + this.setMaterial(material); + var geometry = this.geometrySystem.createBufferGeometry({ + vertexCount: 4 + }); + this.setGeometry(geometry); + material.setCull({ + enable: false, + face: gl.BACK + }).setDepth({ + enable: true, + func: gl.LESS + }); // @ts-ignore + + material.setUniform(extractedUniforms); + this.setAttributes({ + gridColor: this.config.gridColor, + gridSize: this.config.gridSize + }); + geometry.setIndex([0, 3, 2, 2, 1, 0]); + geometry.setAttribute('a_Position', Float32Array.from([-4, -1, -4, 4, -1, -4, 4, -1, 4, -4, -1, 4]), { + arrayStride: 4 * 2, + stepMode: 'vertex', + attributes: [{ + shaderLocation: 0, + offset: 0, + format: 'float2' + }] + }); + } + }]); + + return Grid; +}(Renderable), _temp$8), (_descriptor$6 = _applyDecoratedDescriptor(_class2$6.prototype, "materialSystem", [_dec2$6, _dec3$5], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor2$4 = _applyDecoratedDescriptor(_class2$6.prototype, "geometrySystem", [_dec4$3, _dec5$2], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor3$3 = _applyDecoratedDescriptor(_class2$6.prototype, "shaderModuleService", [_dec6$2], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +})), _class2$6)) || _class$8); + +var epsilon = 0.000001; + +var create_1 = create; + +/** + * Creates a new, empty vec2 + * + * @returns {vec2} a new 2D vector + */ +function create() { + var out = new Float32Array(2); + out[0] = 0; + out[1] = 0; + return out +} + +var clone_1 = clone; + +/** + * Creates a new vec2 initialized with values from an existing vector + * + * @param {vec2} a vector to clone + * @returns {vec2} a new 2D vector + */ +function clone(a) { + var out = new Float32Array(2); + out[0] = a[0]; + out[1] = a[1]; + return out +} + +var fromValues_1 = fromValues; + +/** + * Creates a new vec2 initialized with the given values + * + * @param {Number} x X component + * @param {Number} y Y component + * @returns {vec2} a new 2D vector + */ +function fromValues(x, y) { + var out = new Float32Array(2); + out[0] = x; + out[1] = y; + return out +} + +var copy_1 = copy; + +/** + * Copy the values from one vec2 to another + * + * @param {vec2} out the receiving vector + * @param {vec2} a the source vector + * @returns {vec2} out + */ +function copy(out, a) { + out[0] = a[0]; + out[1] = a[1]; + return out +} + +var set_1 = set$1; + +/** + * Set the components of a vec2 to the given values + * + * @param {vec2} out the receiving vector + * @param {Number} x X component + * @param {Number} y Y component + * @returns {vec2} out + */ +function set$1(out, x, y) { + out[0] = x; + out[1] = y; + return out +} + +var equals_1 = equals; + +var EPSILON = epsilon; + +/** + * Returns whether or not the vectors have approximately the same elements in the same position. + * + * @param {vec2} a The first vector. + * @param {vec2} b The second vector. + * @returns {Boolean} True if the vectors are equal, false otherwise. + */ +function equals(a, b) { + var a0 = a[0]; + var a1 = a[1]; + var b0 = b[0]; + var b1 = b[1]; + return (Math.abs(a0 - b0) <= EPSILON * Math.max(1.0, Math.abs(a0), Math.abs(b0)) && + Math.abs(a1 - b1) <= EPSILON * Math.max(1.0, Math.abs(a1), Math.abs(b1))) +} + +var exactEquals_1 = exactEquals; + +/** + * Returns whether or not the vectors exactly have the same elements in the same position (when compared with ===) + * + * @param {vec2} a The first vector. + * @param {vec2} b The second vector. + * @returns {Boolean} True if the vectors are equal, false otherwise. + */ +function exactEquals(a, b) { + return a[0] === b[0] && a[1] === b[1] +} + +var add_1 = add$1; + +/** + * Adds two vec2's + * + * @param {vec2} out the receiving vector + * @param {vec2} a the first operand + * @param {vec2} b the second operand + * @returns {vec2} out + */ +function add$1(out, a, b) { + out[0] = a[0] + b[0]; + out[1] = a[1] + b[1]; + return out +} + +var subtract_1 = subtract$1; + +/** + * Subtracts vector b from vector a + * + * @param {vec2} out the receiving vector + * @param {vec2} a the first operand + * @param {vec2} b the second operand + * @returns {vec2} out + */ +function subtract$1(out, a, b) { + out[0] = a[0] - b[0]; + out[1] = a[1] - b[1]; + return out +} + +var sub = subtract_1; + +var multiply_1 = multiply; + +/** + * Multiplies two vec2's + * + * @param {vec2} out the receiving vector + * @param {vec2} a the first operand + * @param {vec2} b the second operand + * @returns {vec2} out + */ +function multiply(out, a, b) { + out[0] = a[0] * b[0]; + out[1] = a[1] * b[1]; + return out +} + +var mul = multiply_1; + +var divide_1 = divide; + +/** + * Divides two vec2's + * + * @param {vec2} out the receiving vector + * @param {vec2} a the first operand + * @param {vec2} b the second operand + * @returns {vec2} out + */ +function divide(out, a, b) { + out[0] = a[0] / b[0]; + out[1] = a[1] / b[1]; + return out +} + +var div = divide_1; + +var inverse_1 = inverse; + +/** + * Returns the inverse of the components of a vec2 + * + * @param {vec2} out the receiving vector + * @param {vec2} a vector to invert + * @returns {vec2} out + */ +function inverse(out, a) { + out[0] = 1.0 / a[0]; + out[1] = 1.0 / a[1]; + return out +} + +var min_1 = min$1; + +/** + * Returns the minimum of two vec2's + * + * @param {vec2} out the receiving vector + * @param {vec2} a the first operand + * @param {vec2} b the second operand + * @returns {vec2} out + */ +function min$1(out, a, b) { + out[0] = Math.min(a[0], b[0]); + out[1] = Math.min(a[1], b[1]); + return out +} + +var max_1 = max$2; + +/** + * Returns the maximum of two vec2's + * + * @param {vec2} out the receiving vector + * @param {vec2} a the first operand + * @param {vec2} b the second operand + * @returns {vec2} out + */ +function max$2(out, a, b) { + out[0] = Math.max(a[0], b[0]); + out[1] = Math.max(a[1], b[1]); + return out +} + +var rotate_1 = rotate; + +/** + * Rotates a vec2 by an angle + * + * @param {vec2} out the receiving vector + * @param {vec2} a the vector to rotate + * @param {Number} angle the angle of rotation (in radians) + * @returns {vec2} out + */ +function rotate(out, a, angle) { + var c = Math.cos(angle), + s = Math.sin(angle); + var x = a[0], + y = a[1]; + + out[0] = x * c - y * s; + out[1] = x * s + y * c; + + return out +} + +var floor_1 = floor; + +/** + * Math.floor the components of a vec2 + * + * @param {vec2} out the receiving vector + * @param {vec2} a vector to floor + * @returns {vec2} out + */ +function floor(out, a) { + out[0] = Math.floor(a[0]); + out[1] = Math.floor(a[1]); + return out +} + +var ceil_1 = ceil; + +/** + * Math.ceil the components of a vec2 + * + * @param {vec2} out the receiving vector + * @param {vec2} a vector to ceil + * @returns {vec2} out + */ +function ceil(out, a) { + out[0] = Math.ceil(a[0]); + out[1] = Math.ceil(a[1]); + return out +} + +var round_1 = round; + +/** + * Math.round the components of a vec2 + * + * @param {vec2} out the receiving vector + * @param {vec2} a vector to round + * @returns {vec2} out + */ +function round(out, a) { + out[0] = Math.round(a[0]); + out[1] = Math.round(a[1]); + return out +} + +var scale_1 = scale; + +/** + * Scales a vec2 by a scalar number + * + * @param {vec2} out the receiving vector + * @param {vec2} a the vector to scale + * @param {Number} b amount to scale the vector by + * @returns {vec2} out + */ +function scale(out, a, b) { + out[0] = a[0] * b; + out[1] = a[1] * b; + return out +} + +var scaleAndAdd_1 = scaleAndAdd; + +/** + * Adds two vec2's after scaling the second operand by a scalar value + * + * @param {vec2} out the receiving vector + * @param {vec2} a the first operand + * @param {vec2} b the second operand + * @param {Number} scale the amount to scale b by before adding + * @returns {vec2} out + */ +function scaleAndAdd(out, a, b, scale) { + out[0] = a[0] + (b[0] * scale); + out[1] = a[1] + (b[1] * scale); + return out +} + +var distance_1 = distance$2; + +/** + * Calculates the euclidian distance between two vec2's + * + * @param {vec2} a the first operand + * @param {vec2} b the second operand + * @returns {Number} distance between a and b + */ +function distance$2(a, b) { + var x = b[0] - a[0], + y = b[1] - a[1]; + return Math.sqrt(x*x + y*y) +} + +var dist = distance_1; + +var squaredDistance_1 = squaredDistance; + +/** + * Calculates the squared euclidian distance between two vec2's + * + * @param {vec2} a the first operand + * @param {vec2} b the second operand + * @returns {Number} squared distance between a and b + */ +function squaredDistance(a, b) { + var x = b[0] - a[0], + y = b[1] - a[1]; + return x*x + y*y +} + +var sqrDist = squaredDistance_1; + +var length_1 = length; + +/** + * Calculates the length of a vec2 + * + * @param {vec2} a vector to calculate length of + * @returns {Number} length of a + */ +function length(a) { + var x = a[0], + y = a[1]; + return Math.sqrt(x*x + y*y) +} + +var len$1 = length_1; + +var squaredLength_1 = squaredLength; + +/** + * Calculates the squared length of a vec2 + * + * @param {vec2} a vector to calculate squared length of + * @returns {Number} squared length of a + */ +function squaredLength(a) { + var x = a[0], + y = a[1]; + return x*x + y*y +} + +var sqrLen = squaredLength_1; + +var negate_1 = negate; + +/** + * Negates the components of a vec2 + * + * @param {vec2} out the receiving vector + * @param {vec2} a vector to negate + * @returns {vec2} out + */ +function negate(out, a) { + out[0] = -a[0]; + out[1] = -a[1]; + return out +} + +var normalize_1 = normalize$1; + +/** + * Normalize a vec2 + * + * @param {vec2} out the receiving vector + * @param {vec2} a vector to normalize + * @returns {vec2} out + */ +function normalize$1(out, a) { + var x = a[0], + y = a[1]; + var len = x*x + y*y; + if (len > 0) { + //TODO: evaluate use of glm_invsqrt here? + len = 1 / Math.sqrt(len); + out[0] = a[0] * len; + out[1] = a[1] * len; + } + return out +} + +var dot_1 = dot$1; + +/** + * Calculates the dot product of two vec2's + * + * @param {vec2} a the first operand + * @param {vec2} b the second operand + * @returns {Number} dot product of a and b + */ +function dot$1(a, b) { + return a[0] * b[0] + a[1] * b[1] +} + +var cross_1 = cross; + +/** + * Computes the cross product of two vec2's + * Note that the cross product must by definition produce a 3D vector + * + * @param {vec3} out the receiving vector + * @param {vec2} a the first operand + * @param {vec2} b the second operand + * @returns {vec3} out + */ +function cross(out, a, b) { + var z = a[0] * b[1] - a[1] * b[0]; + out[0] = out[1] = 0; + out[2] = z; + return out +} + +var lerp_1 = lerp; + +/** + * Performs a linear interpolation between two vec2's + * + * @param {vec2} out the receiving vector + * @param {vec2} a the first operand + * @param {vec2} b the second operand + * @param {Number} t interpolation amount between the two inputs + * @returns {vec2} out + */ +function lerp(out, a, b, t) { + var ax = a[0], + ay = a[1]; + out[0] = ax + t * (b[0] - ax); + out[1] = ay + t * (b[1] - ay); + return out +} + +var random_1 = random; + +/** + * Generates a random vector with the given scale + * + * @param {vec2} out the receiving vector + * @param {Number} [scale] Length of the resulting vector. If ommitted, a unit vector will be returned + * @returns {vec2} out + */ +function random(out, scale) { + scale = scale || 1.0; + var r = Math.random() * 2.0 * Math.PI; + out[0] = Math.cos(r) * scale; + out[1] = Math.sin(r) * scale; + return out +} + +var transformMat2_1 = transformMat2; + +/** + * Transforms the vec2 with a mat2 + * + * @param {vec2} out the receiving vector + * @param {vec2} a the vector to transform + * @param {mat2} m matrix to transform with + * @returns {vec2} out + */ +function transformMat2(out, a, m) { + var x = a[0], + y = a[1]; + out[0] = m[0] * x + m[2] * y; + out[1] = m[1] * x + m[3] * y; + return out +} + +var transformMat2d_1 = transformMat2d; + +/** + * Transforms the vec2 with a mat2d + * + * @param {vec2} out the receiving vector + * @param {vec2} a the vector to transform + * @param {mat2d} m matrix to transform with + * @returns {vec2} out + */ +function transformMat2d(out, a, m) { + var x = a[0], + y = a[1]; + out[0] = m[0] * x + m[2] * y + m[4]; + out[1] = m[1] * x + m[3] * y + m[5]; + return out +} + +var transformMat3_1 = transformMat3; + +/** + * Transforms the vec2 with a mat3 + * 3rd vector component is implicitly '1' + * + * @param {vec2} out the receiving vector + * @param {vec2} a the vector to transform + * @param {mat3} m matrix to transform with + * @returns {vec2} out + */ +function transformMat3(out, a, m) { + var x = a[0], + y = a[1]; + out[0] = m[0] * x + m[3] * y + m[6]; + out[1] = m[1] * x + m[4] * y + m[7]; + return out +} + +var transformMat4_1 = transformMat4; + +/** + * Transforms the vec2 with a mat4 + * 3rd vector component is implicitly '0' + * 4th vector component is implicitly '1' + * + * @param {vec2} out the receiving vector + * @param {vec2} a the vector to transform + * @param {mat4} m matrix to transform with + * @returns {vec2} out + */ +function transformMat4(out, a, m) { + var x = a[0], + y = a[1]; + out[0] = m[0] * x + m[4] * y + m[12]; + out[1] = m[1] * x + m[5] * y + m[13]; + return out +} + +var forEach_1 = forEach; + +var vec = create_1(); + +/** + * Perform some operation over an array of vec2s. + * + * @param {Array} a the array of vectors to iterate over + * @param {Number} stride Number of elements between the start of each vec2. If 0 assumes tightly packed + * @param {Number} offset Number of elements to skip at the beginning of the array + * @param {Number} count Number of vec2s to iterate over. If 0 iterates over entire array + * @param {Function} fn Function to call for each vector in the array + * @param {Object} [arg] additional argument to pass to fn + * @returns {Array} a + * @function + */ +function forEach(a, stride, offset, count, fn, arg) { + var i, l; + if(!stride) { + stride = 2; + } + + if(!offset) { + offset = 0; + } + + if(count) { + l = Math.min((count * stride) + offset, a.length); + } else { + l = a.length; + } + + for(i = offset; i < l; i += stride) { + vec[0] = a[i]; + vec[1] = a[i+1]; + fn(vec, vec, arg); + a[i] = vec[0]; + a[i+1] = vec[1]; + } + + return a +} + +var limit_1 = limit; + +/** + * Limit the magnitude of this vector to the value used for the `max` + * parameter. + * + * @param {vec2} the vector to limit + * @param {Number} max the maximum magnitude for the vector + * @returns {vec2} out + */ +function limit(out, a, max) { + var mSq = a[0] * a[0] + a[1] * a[1]; + + if (mSq > max * max) { + var n = Math.sqrt(mSq); + out[0] = a[0] / n * max; + out[1] = a[1] / n * max; + } else { + out[0] = a[0]; + out[1] = a[1]; + } + + return out; +} + +var glVec2 = { + EPSILON: epsilon + , create: create_1 + , clone: clone_1 + , fromValues: fromValues_1 + , copy: copy_1 + , set: set_1 + , equals: equals_1 + , exactEquals: exactEquals_1 + , add: add_1 + , subtract: subtract_1 + , sub: sub + , multiply: multiply_1 + , mul: mul + , divide: divide_1 + , div: div + , inverse: inverse_1 + , min: min_1 + , max: max_1 + , rotate: rotate_1 + , floor: floor_1 + , ceil: ceil_1 + , round: round_1 + , scale: scale_1 + , scaleAndAdd: scaleAndAdd_1 + , distance: distance_1 + , dist: dist + , squaredDistance: squaredDistance_1 + , sqrDist: sqrDist + , length: length_1 + , len: len$1 + , squaredLength: squaredLength_1 + , sqrLen: sqrLen + , negate: negate_1 + , normalize: normalize_1 + , dot: dot_1 + , cross: cross_1 + , lerp: lerp_1 + , random: random_1 + , transformMat2: transformMat2_1 + , transformMat2d: transformMat2d_1 + , transformMat3: transformMat3_1 + , transformMat4: transformMat4_1 + , forEach: forEach_1 + , limit: limit_1 +}; + +var add = add_1; +var set = set_1; +var normalize = normalize_1; +var subtract = subtract_1; +var dot = dot_1; + +var tmp = [0, 0]; + +var computeMiter = function computeMiter(tangent, miter, lineA, lineB, halfThick) { + //get tangent line + add(tangent, lineA, lineB); + normalize(tangent, tangent); + + //get miter as a unit vector + set(miter, -tangent[1], tangent[0]); + set(tmp, -lineA[1], lineA[0]); + + //get the necessary length of our miter + return halfThick / dot(miter, tmp) +}; + +var normal = function normal(out, dir) { + //get perpendicular + set(out, -dir[1], dir[0]); + return out +}; + +var direction = function direction(out, a, b) { + //get unit dir of two lines + subtract(out, a, b); + normalize(out, out); + return out +}; + +// @ts-ignore + +function extrusions(positions, out, point, normal, scale) { + addNext(out, normal, -scale); + addNext(out, normal, scale); + positions.push(point); + positions.push(point); +} + +function addNext(out, normal, length) { + out.push([[normal[0], normal[1]], length]); +} + +function getNormals (points, closed, indexOffset) { + var lineA = [0, 0]; + var lineB = [0, 0]; + var tangent = [0, 0]; + var miter = [0, 0]; + + var _lastFlip = -1; + + var _started = false; + var _normal = null; + var tmp = glVec2.create(); + var count = indexOffset || 0; + var miterLimit = 3; + var out = []; + var attrPos = []; + var attrIndex = []; + var attrCounters = [0, 0]; + + if (closed) { + points = points.slice(); + points.push(points[0]); + } + + var total = points.length; + + for (var i = 1; i < total; i++) { + var index = count; + var last = points[i - 1]; + var cur = points[i]; + var next = i < points.length - 1 ? points[i + 1] : null; + attrCounters.push(i / total, i / total); + direction(lineA, cur, last); + + if (!_normal) { + _normal = [0, 0]; + normal(_normal, lineA); + } + + if (!_started) { + _started = true; + extrusions(attrPos, out, last, _normal, 1); + } + + attrIndex.push([index + 0, index + 1, index + 2]); + + if (!next) { + // no miter, simple segment + normal(_normal, lineA); // reset normal + + extrusions(attrPos, out, cur, _normal, 1); + attrIndex.push(_lastFlip === 1 ? [index, index + 2, index + 3] : [index + 2, index + 1, index + 3]); + count += 2; + } else { + // miter with last + // get unit dir of next line + direction(lineB, next, cur); // stores tangent & miter + + var miterLen = computeMiter(tangent, miter, lineA, lineB, 1); // get orientation + + var flip = glVec2.dot(tangent, _normal) < 0 ? -1 : 1; + var bevel = miterLen > miterLimit; // 处理相邻线段重叠的情况 + + if (!isFinite(miterLen)) { + normal(_normal, lineA); // reset normal + + extrusions(attrPos, out, cur, _normal, 1); + attrIndex.push(_lastFlip === 1 ? [index, index + 2, index + 3] : [index + 2, index + 1, index + 3]); + count += 2; + _lastFlip = flip; + continue; + } + + if (bevel) { + miterLen = miterLimit; + attrCounters.push(i / total); // next two points in our first segment + + addNext(out, _normal, -flip); + attrPos.push(cur); + addNext(out, miter, miterLen * flip); + attrPos.push(cur); + attrIndex.push(_lastFlip !== -flip ? [index, index + 2, index + 3] : [index + 2, index + 1, index + 3]); // now add the bevel triangle + + attrIndex.push([index + 2, index + 3, index + 4]); + normal(tmp, lineB); + glVec2.copy(_normal, tmp); // store normal for next round + + addNext(out, _normal, -flip); + attrPos.push(cur); // the miter is now the normal for our next join + + count += 3; + } else { + // miter + // next two points for our miter join + extrusions(attrPos, out, cur, miter, miterLen); + attrIndex.push(_lastFlip === 1 ? [index, index + 2, index + 3] : [index + 2, index + 1, index + 3]); + flip = -1; // the miter is now the normal for our next join + + glVec2.copy(_normal, miter); + count += 2; + } + + _lastFlip = flip; + } + } + + return { + normals: out, + attrIndex: attrIndex, + attrPos: attrPos, + attrCounters: attrCounters + }; +} + +var _dec$7, _dec2$5, _dec3$4, _dec4$2, _dec5$1, _dec6$1, _class$7, _class2$5, _descriptor$5, _descriptor2$3, _descriptor3$2, _temp$7; + +function _createSuper$1(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct$1(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; } + +function _isNativeReflectConstruct$1() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } + +/* babel-plugin-inline-import './shaders/webgl.line.frag.glsl' */ +var lineFrag = "uniform float u_dash_array : 0.02;\nuniform float u_dash_offset : 0;\nuniform float u_dash_ratio : 0;\nuniform float u_thickness : 0.02;\n\nvarying vec4 v_color;\nvarying vec2 v_normal;\nvarying float v_counters;\n\nvoid main() {\n float blur = 1. - smoothstep(0.98, 1., length(v_normal));\n\n gl_FragColor = v_color;\n gl_FragColor.a *= blur * ceil(mod(v_counters + u_dash_offset, u_dash_array) - (u_dash_array * u_dash_ratio));\n}"; + +/* babel-plugin-inline-import './shaders/webgl.line.vert.glsl' */ +var lineVert = "attribute vec2 a_pos;\nattribute vec4 a_color;\nattribute float a_line_miter;\nattribute vec2 a_line_normal;\nattribute float a_counters;\n\nuniform mat4 projectionMatrix;\nuniform mat4 modelViewMatrix;\nuniform float u_thickness : 0.02;\nuniform vec2 u_viewport;\n\nvarying vec4 v_color;\nvarying vec2 v_normal;\nvarying float v_counters;\n\nvoid main() {\n v_color = a_color;\n v_counters = a_counters;\n\n vec3 normal = normalize(vec3(a_line_normal, 0.0));\n\n vec4 offset = vec4(normal * u_thickness / 2.0 * a_line_miter, 0.0);\n\n v_normal = vec2(normal * sign(a_line_miter));\n\n gl_Position = projectionMatrix * modelViewMatrix * vec4(a_pos, 0.0, 1.0) + offset;\n}\n"; +var Line = (_dec$7 = inversify.injectable(), _dec2$5 = inversify.inject(IDENTIFIER.Systems), _dec3$4 = inversify.named(IDENTIFIER.MaterialSystem), _dec4$2 = inversify.inject(IDENTIFIER.Systems), _dec5$1 = inversify.named(IDENTIFIER.GeometrySystem), _dec6$1 = inversify.inject(IDENTIFIER.ShaderModuleService), _dec$7(_class$7 = (_class2$5 = (_temp$7 = /*#__PURE__*/function (_Renderable) { + _inherits(Line, _Renderable); + + var _super = _createSuper$1(Line); + + function Line() { + var _this; + + _classCallCheck(this, Line); + + for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { + args[_key] = arguments[_key]; + } + + _this = _super.call.apply(_super, [this].concat(args)); + + _initializerDefineProperty(_this, "materialSystem", _descriptor$5, _assertThisInitialized(_this)); + + _initializerDefineProperty(_this, "geometrySystem", _descriptor2$3, _assertThisInitialized(_this)); + + _initializerDefineProperty(_this, "shaderModuleService", _descriptor3$2, _assertThisInitialized(_this)); + + _this.vertexCount = void 0; + return _this; + } + + _createClass(Line, [{ + key: "onAttributeChanged", + value: function onAttributeChanged(_ref) { + var name = _ref.name, + data = _ref.data; + var mesh = this.getMeshComponent(); + + if (mesh && mesh.material) { + switch (name) { + case 'dashArray': + mesh.material.setUniform('u_dash_array', data); + break; + + case 'dashOffset': + mesh.material.setUniform('u_dash_offset', data); + break; + + case 'dashRatio': + mesh.material.setUniform('u_dash_ratio', data); + break; + + case 'thickness': + mesh.material.setUniform('u_thickness', data); + break; + + case 'color': + var colors = new Array(this.vertexCount).fill(undefined).map(function () { + return data; + }).reduce(function (prev, cur) { + // @ts-ignore + return [].concat(_toConsumableArray(prev), _toConsumableArray(cur)); + }, []); // @ts-ignore + + mesh.geometry.setAttribute('a_color', Float32Array.from(colors), { + arrayStride: 4 * 4, + stepMode: 'vertex', + attributes: [{ + shaderLocation: 1, + offset: 0, + format: 'float4' + }] + }); + break; + } + } + } + }, { + key: "onEntityCreated", + value: function onEntityCreated() { + var _this2 = this; + + this.shaderModuleService.registerModule('line', { + vs: lineVert, + fs: lineFrag + }); + + var _this$shaderModuleSer = this.shaderModuleService.getModule('line'), + vs = _this$shaderModuleSer.vs, + fs = _this$shaderModuleSer.fs, + extractedUniforms = _this$shaderModuleSer.uniforms; + + var material = this.materialSystem.createShaderMaterial({ + vertexShader: vs, + fragmentShader: fs + }); + + var _getNormals = getNormals(this.config.points, false), + normals = _getNormals.normals, + attrIndex = _getNormals.attrIndex, + attrPos = _getNormals.attrPos, + attrCounters = _getNormals.attrCounters; + + var vertexCount = attrPos.length; + this.vertexCount = vertexCount; + var geometry = this.geometrySystem.createBufferGeometry({ + vertexCount: vertexCount + }); + this.setMaterial(material); + this.setGeometry(geometry); + material.setCull({ + enable: false, + face: gl.BACK + }) // @ts-ignore + .setUniform(extractedUniforms); + this.setAttributes({ + dashArray: this.config.dashArray, + dashOffset: this.config.dashOffset, + dashRatio: this.config.dashRatio, + thickness: this.config.thickness + }); + var attrNormal = []; + var attrMiter = []; + normals.forEach(function (n) { + var norm = n[0]; + var miter = n[1]; + attrNormal.push([norm[0], norm[1]]); // @ts-ignore + + attrMiter.push(miter); + }); // [[0,1,2], [2,1,3]] + + geometry.setIndex(attrIndex.reduce(function (prev, cur) { + return [].concat(_toConsumableArray(prev), _toConsumableArray(cur)); + }, [])); + geometry.setAttribute('a_pos', Float32Array.from(attrPos.reduce(function (prev, cur) { + return [].concat(_toConsumableArray(prev), _toConsumableArray(cur)); + }, [])), { + arrayStride: 4 * 2, + stepMode: 'vertex', + attributes: [{ + shaderLocation: 0, + offset: 0, + format: 'float2' + }] + }); + var colors = new Array(vertexCount).fill(undefined).map(function () { + return _toConsumableArray(_this2.config.color); + }).reduce(function (prev, cur) { + return [].concat(_toConsumableArray(prev), _toConsumableArray(cur)); + }, []); + geometry.setAttribute('a_color', Float32Array.from(colors), { + arrayStride: 4 * 4, + stepMode: 'vertex', + attributes: [{ + shaderLocation: 1, + offset: 0, + format: 'float4' + }] + }); + geometry.setAttribute('a_line_miter', Float32Array.from(attrMiter), { + arrayStride: 4 * 1, + stepMode: 'vertex', + attributes: [{ + shaderLocation: 2, + offset: 0, + format: 'float' + }] + }); + geometry.setAttribute('a_line_normal', Float32Array.from(attrNormal.reduce(function (prev, cur) { + return [].concat(_toConsumableArray(prev), _toConsumableArray(cur)); + }, [])), { + arrayStride: 4 * 2, + stepMode: 'vertex', + attributes: [{ + shaderLocation: 3, + offset: 0, + format: 'float2' + }] + }); + geometry.setAttribute('a_counters', Float32Array.from(attrCounters), { + arrayStride: 4 * 1, + stepMode: 'vertex', + attributes: [{ + shaderLocation: 4, + offset: 0, + format: 'float' + }] + }); + } + }]); + + return Line; +}(Renderable), _temp$7), (_descriptor$5 = _applyDecoratedDescriptor(_class2$5.prototype, "materialSystem", [_dec2$5, _dec3$4], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor2$3 = _applyDecoratedDescriptor(_class2$5.prototype, "geometrySystem", [_dec4$2, _dec5$1], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor3$2 = _applyDecoratedDescriptor(_class2$5.prototype, "shaderModuleService", [_dec6$1], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +})), _class2$5)) || _class$7); + +function encodePickingColor(featureIdx) { + return [featureIdx + 1 & 255, featureIdx + 1 >> 8 & 255, featureIdx + 1 >> 8 >> 8 & 255]; +} + +var _dec$6, _dec2$4, _dec3$3, _dec4$1, _dec5, _dec6, _class$6, _class2$4, _descriptor$4, _descriptor2$2, _descriptor3$1, _temp$6; + +function ownKeys$2(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; } + +function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$2(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$2(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; } + +function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; } + +function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } + +/* babel-plugin-inline-import './shaders/webgl.point.frag.glsl' */ +var pointFrag = "uniform float u_blur : 0.05;\nuniform float u_opacity : 0.7;\nuniform float u_stroke_width : 0.01;\nuniform vec4 u_stroke_color : [0, 0, 0, 0];\nuniform float u_stroke_opacity : 1;\n\nvarying vec4 v_color;\nvarying vec4 v_data;\nvarying float v_radius;\n\n#pragma include \"sdf2d\"\n#pragma include \"picking\"\n\nvoid main() {\n int shape = int(floor(v_data.w + 0.5));\n\n float antialiasblur = v_data.z;\n float antialiased_blur = -max(u_blur, antialiasblur);\n float r = v_radius / (v_radius + u_stroke_width);\n\n float outer_df;\n float inner_df;\n // 'circle', 'triangle', 'square', 'pentagon', 'hexagon', 'octogon', 'hexagram', 'rhombus', 'vesica'\n // if (shape == 0) {\n outer_df = sdCircle(v_data.xy, 1.0);\n inner_df = sdCircle(v_data.xy, r);\n // } else if (shape == 1) {\n // outer_df = sdEquilateralTriangle(1.1 * v_data.xy);\n // inner_df = sdEquilateralTriangle(1.1 / r * v_data.xy);\n // } else if (shape == 2) {\n // outer_df = sdBox(v_data.xy, vec2(1.));\n // inner_df = sdBox(v_data.xy, vec2(r));\n // } else if (shape == 3) {\n // outer_df = sdPentagon(v_data.xy, 0.8);\n // inner_df = sdPentagon(v_data.xy, r * 0.8);\n // } else if (shape == 4) {\n // outer_df = sdHexagon(v_data.xy, 0.8);\n // inner_df = sdHexagon(v_data.xy, r * 0.8);\n // } else if (shape == 5) {\n // outer_df = sdOctogon(v_data.xy, 1.0);\n // inner_df = sdOctogon(v_data.xy, r);\n // } else if (shape == 6) {\n // outer_df = sdHexagram(v_data.xy, 0.52);\n // inner_df = sdHexagram(v_data.xy, r * 0.52);\n // } else if (shape == 7) {\n // outer_df = sdRhombus(v_data.xy, vec2(1.0));\n // inner_df = sdRhombus(v_data.xy, vec2(r));\n // } else if (shape == 8) {\n // outer_df = sdVesica(v_data.xy, 1.1, 0.8);\n // inner_df = sdVesica(v_data.xy, r * 1.1, r * 0.8);\n // }\n\n float opacity_t = smoothstep(0.0, antialiased_blur, outer_df);\n\n float color_t = u_stroke_width < 0.01 ? 0.0 : smoothstep(\n antialiased_blur,\n 0.0,\n inner_df\n );\n vec4 strokeColor = u_stroke_color == vec4(0) ? v_color : u_stroke_color;\n\n gl_FragColor = mix(vec4(v_color.rgb, v_color.a * u_opacity), strokeColor * u_stroke_opacity, color_t);\n gl_FragColor.a = gl_FragColor.a * opacity_t;\n\n gl_FragColor = filterColor(gl_FragColor);\n}"; + +/* babel-plugin-inline-import './shaders/webgl.point.vert.glsl' */ +var pointVert = "attribute vec2 position;\nattribute vec4 color;\nattribute float shape;\nattribute vec2 offset;\nattribute float size;\n\nuniform mat4 projectionMatrix;\nuniform mat4 modelViewMatrix;\n\nuniform float u_stroke_width : 0.01;\nuniform float u_device_pixel_ratio;\nuniform vec2 u_viewport;\n\nvarying vec4 v_color;\nvarying vec4 v_data;\nvarying float v_radius;\n\n#pragma include \"picking\"\n\nvoid main() {\n v_color = color;\n v_radius = size;\n\n lowp float antialiasblur = 1.0 / u_device_pixel_ratio * (size + u_stroke_width);\n\n // construct point coords\n v_data = vec4(position, antialiasblur, shape);\n\n gl_Position = projectionMatrix * modelViewMatrix\n * vec4(position * size + offset, 0.0, 1.0);\n\n setPickingColor(a_PickingColor);\n}"; +var pointShapes = ['circle', 'triangle', 'square', 'pentagon', 'hexagon', 'octogon', 'hexagram', 'rhombus', 'vesica']; +var Point = (_dec$6 = inversify.injectable(), _dec2$4 = inversify.inject(IDENTIFIER.Systems), _dec3$3 = inversify.named(IDENTIFIER.MaterialSystem), _dec4$1 = inversify.inject(IDENTIFIER.Systems), _dec5 = inversify.named(IDENTIFIER.GeometrySystem), _dec6 = inversify.inject(IDENTIFIER.ShaderModuleService), _dec$6(_class$6 = (_class2$4 = (_temp$6 = /*#__PURE__*/function (_Renderable) { + _inherits(Point, _Renderable); + + var _super = _createSuper(Point); + + function Point() { + var _this; + + _classCallCheck(this, Point); + + for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { + args[_key] = arguments[_key]; + } + + _this = _super.call.apply(_super, [this].concat(args)); + + _initializerDefineProperty(_this, "materialSystem", _descriptor$4, _assertThisInitialized(_this)); + + _initializerDefineProperty(_this, "geometrySystem", _descriptor2$2, _assertThisInitialized(_this)); + + _initializerDefineProperty(_this, "shaderModuleService", _descriptor3$1, _assertThisInitialized(_this)); + + return _this; + } + + _createClass(Point, [{ + key: "onAttributeChanged", + value: function onAttributeChanged(_ref) { + var name = _ref.name, + data = _ref.data; + var mesh = this.getMeshComponent(); + + if (mesh && mesh.material) { + if (name === 'strokeWidth') { + mesh.material.setUniform('u_stroke_width', data); + } else if (name === 'strokeColor') { + mesh.material.setUniform('u_stroke_color', data); + } else if (name === 'strokeOpacity') { + mesh.material.setUniform('u_stroke_opacity', data); + } else if (name === 'opacity') { + mesh.material.setUniform('u_opacity', data); + } else if (name === 'blur') { + mesh.material.setUniform('u_blur', data); + } + } + } + }, { + key: "onEntityCreated", + value: function onEntityCreated() { + this.shaderModuleService.registerModule('grid', { + vs: pointVert, + fs: pointFrag + }); + + var _this$shaderModuleSer = this.shaderModuleService.getModule('grid'), + vs = _this$shaderModuleSer.vs, + fs = _this$shaderModuleSer.fs, + extractedUniforms = _this$shaderModuleSer.uniforms; + + var material = this.materialSystem.createShaderMaterial({ + vertexShader: vs, + fragmentShader: fs, + cull: { + enable: false + }, + depth: { + enable: false + }, + blend: { + enable: true, + func: { + srcRGB: gl.SRC_ALPHA, + dstRGB: gl.ONE_MINUS_SRC_ALPHA, + srcAlpha: 1, + dstAlpha: 1 + } + } + }); // TODO: support define stroke-relative props per point + + material.setUniform(_objectSpread$2({ + u_device_pixel_ratio: window.devicePixelRatio + }, extractedUniforms)); + var attributes = this.buildAttributes(); + var geometry = this.geometrySystem.createInstancedBufferGeometry({ + maxInstancedCount: attributes.instancedOffsets.length / 2, + vertexCount: 6 + }); + geometry.setIndex([0, 2, 1, 0, 3, 2]); + geometry.setAttribute('position', Float32Array.from(attributes.positions), { + arrayStride: 4 * 2, + stepMode: 'vertex', + attributes: [{ + shaderLocation: 0, + offset: 0, + format: 'float2' + }] + }); + geometry.setAttribute('offset', Float32Array.from(attributes.instancedOffsets), { + arrayStride: 4 * 2, + stepMode: 'instance', + attributes: [{ + shaderLocation: 1, + offset: 0, + format: 'float2' + }] + }); + geometry.setAttribute('color', Float32Array.from(attributes.instancedColors), { + arrayStride: 4 * 4, + stepMode: 'instance', + attributes: [{ + shaderLocation: 2, + offset: 0, + format: 'float4' + }] + }); + geometry.setAttribute('size', Float32Array.from(attributes.instancedSizes), { + arrayStride: 4, + stepMode: 'instance', + attributes: [{ + shaderLocation: 3, + offset: 0, + format: 'float' + }] + }); + geometry.setAttribute('shape', Float32Array.from(attributes.instancedShapes), { + arrayStride: 4, + stepMode: 'instance', + attributes: [{ + shaderLocation: 4, + offset: 0, + format: 'float' + }] + }); + geometry.setAttribute('a_PickingColor', Float32Array.from(attributes.instancedPickingColors), { + arrayStride: 4 * 3, + stepMode: 'instance', + attributes: [{ + shaderLocation: 6, + offset: 0, + format: 'float3' + }] + }); + this.setMaterial(material); + this.setGeometry(geometry); + } + }, { + key: "buildAttribute", + value: function buildAttribute(config, attributes, index) { + var _attributes$instanced, _attributes$instanced2, _attributes$instanced3, _attributes$instanced4; + + (_attributes$instanced = attributes.instancedPickingColors).push.apply(_attributes$instanced, _toConsumableArray(encodePickingColor(config.id || index))); + + attributes.instancedShapes.push(pointShapes.indexOf(config.shape || 'circle')); + + (_attributes$instanced2 = attributes.instancedColors).push.apply(_attributes$instanced2, _toConsumableArray(config.color || [1, 0, 0, 1])); + + (_attributes$instanced3 = attributes.instancedOffsets).push.apply(_attributes$instanced3, _toConsumableArray(config.position || [0, 0])); + + (_attributes$instanced4 = attributes.instancedSizes).push.apply(_attributes$instanced4, _toConsumableArray(config.size || [0.2, 0.2])); + } + }, { + key: "buildAttributes", + value: function buildAttributes() { + var _this2 = this; + + var attributes = { + positions: [1, 1, 1, -1, -1, -1, -1, 1], + instancedOffsets: [], + instancedColors: [], + instancedSizes: [], + instancedShapes: [], + instancedPickingColors: [] + }; + + if (Array.isArray(this.config)) { + this.config.forEach(function (config, i) { + _this2.buildAttribute(config, attributes, i); + }); + } else { + this.buildAttribute(this.config, attributes, 0); + } + + return attributes; + } + }]); + + return Point; +}(Renderable), _temp$6), (_descriptor$4 = _applyDecoratedDescriptor(_class2$4.prototype, "materialSystem", [_dec2$4, _dec3$3], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor2$2 = _applyDecoratedDescriptor(_class2$4.prototype, "geometrySystem", [_dec4$1, _dec5], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor3$1 = _applyDecoratedDescriptor(_class2$4.prototype, "shaderModuleService", [_dec6], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +})), _class2$4)) || _class$6); + +var _dec$5, _dec2$3, _dec3$2, _dec4, _class$5, _class2$3, _descriptor$3, _descriptor2$1, _descriptor3, _temp$5; + +function _createForOfIteratorHelper(o, allowArrayLike) { var it; if (typeof Symbol === "undefined" || o[Symbol.iterator] == null) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = o[Symbol.iterator](); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; } + +function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); } + +function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; } + +/* babel-plugin-inline-import './material/shaders/map.frag.declaration.glsl' */ +var mapFragDeclaration = "#ifdef USE_MAP\n uniform sampler2D map;\n#endif"; + +/* babel-plugin-inline-import './material/shaders/map.frag.main.glsl' */ +var mapFragMain = "#ifdef USE_MAP\n vec4 texelColor = texture2D(map, vUv);\n // texelColor = mapTexelToLinear(texelColor);\n diffuseColor *= texelColor;\n#endif"; + +/* babel-plugin-inline-import './material/shaders/uv.frag.declaration.glsl' */ +var uvFragDeclaration = "#if (defined( USE_UV ) && ! defined( UVS_VERTEX_ONLY ))\n varying vec2 vUv;\n#endif"; + +/* babel-plugin-inline-import './material/shaders/uv.vert.declaration.glsl' */ +var uvVertDeclaration = "#ifdef USE_UV\n attribute vec2 uv;\n\t#ifdef UVS_VERTEX_ONLY\n vec2 vUv;\n\t#else\n\t\tvarying vec2 vUv;\n\t#endif\n\tuniform mat3 uvTransform;\n#endif"; + +/* babel-plugin-inline-import './material/shaders/uv.vert.main.glsl' */ +var uvVertMain = "#ifdef USE_UV\n vUv = (uvTransform * vec3(uv, 1)).xy;\n#endif"; +var Renderer = (_dec$5 = inversify.injectable(), _dec2$3 = inversify.inject(IDENTIFIER.RenderEngine), _dec3$2 = inversify.inject(IDENTIFIER.ShaderModuleService), _dec4 = inversify.inject(IDENTIFIER.ConfigService), _dec$5(_class$5 = (_class2$3 = (_temp$5 = /*#__PURE__*/function () { + function Renderer() { + _classCallCheck(this, Renderer); + + this.container = void 0; + + _initializerDefineProperty(this, "engine", _descriptor$3, this); + + _initializerDefineProperty(this, "shaderModule", _descriptor2$1, this); + + _initializerDefineProperty(this, "configService", _descriptor3, this); + + this.inited = false; + this.rendering = false; + this.pendings = []; + this.views = []; + this.size = void 0; + } + + _createClass(Renderer, [{ + key: "init", + value: function () { + var _init = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee() { + var systems, config, _iterator, _step, system; + + return regenerator.wrap(function _callee$(_context) { + while (1) { + switch (_context.prev = _context.next) { + case 0: + // 模块化处理 + this.shaderModule.registerBuiltinModules(); + this.shaderModule.registerModule('uv.vert.declaration', { + vs: uvVertDeclaration + }); + this.shaderModule.registerModule('uv.vert.main', { + vs: uvVertMain + }); + this.shaderModule.registerModule('uv.frag.declaration', { + fs: uvFragDeclaration + }); + this.shaderModule.registerModule('map.frag.declaration', { + fs: mapFragDeclaration + }); + this.shaderModule.registerModule('map.frag.main', { + fs: mapFragMain + }); + systems = this.container.getAll(IDENTIFIER.Systems); + config = this.configService.get(); + + if (!config.canvas) { + _context.next = 30; + break; + } + + _context.next = 11; + return this.engine.init({ + canvas: config.canvas, + swapChainFormat: constants.TextureFormat.BGRA8Unorm, + antialiasing: false + }); + + case 11: + _iterator = _createForOfIteratorHelper(systems); + _context.prev = 12; + + _iterator.s(); + + case 14: + if ((_step = _iterator.n()).done) { + _context.next = 21; + break; + } + + system = _step.value; + + if (!system.initialize) { + _context.next = 19; + break; + } + + _context.next = 19; + return system.initialize(); + + case 19: + _context.next = 14; + break; + + case 21: + _context.next = 26; + break; + + case 23: + _context.prev = 23; + _context.t0 = _context["catch"](12); + + _iterator.e(_context.t0); + + case 26: + _context.prev = 26; + + _iterator.f(); + + return _context.finish(26); + + case 29: + this.inited = true; + + case 30: + case "end": + return _context.stop(); + } + } + }, _callee, this, [[12, 23, 26, 29]]); + })); + + function init() { + return _init.apply(this, arguments); + } + + return init; + }() + }, { + key: "render", + value: function () { + var _render = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee2() { + var systems, + _len, + views, + _key, + _iterator2, + _step2, + system, + _args2 = arguments; + + return regenerator.wrap(function _callee2$(_context2) { + while (1) { + switch (_context2.prev = _context2.next) { + case 0: + if (!(!this.inited || this.rendering)) { + _context2.next = 2; + break; + } + + return _context2.abrupt("return"); + + case 2: + if (this.pendings.length) { + this.pendings.forEach(function (pending) { + pending(); + }); + } + + this.rendering = true; + this.engine.beginFrame(); + systems = this.container.getAll(IDENTIFIER.Systems); + + for (_len = _args2.length, views = new Array(_len), _key = 0; _key < _len; _key++) { + views[_key] = _args2[_key]; + } + + _iterator2 = _createForOfIteratorHelper(systems); + _context2.prev = 8; + + _iterator2.s(); + + case 10: + if ((_step2 = _iterator2.n()).done) { + _context2.next = 17; + break; + } + + system = _step2.value; + + if (!system.execute) { + _context2.next = 15; + break; + } + + _context2.next = 15; + return system.execute(views); + + case 15: + _context2.next = 10; + break; + + case 17: + _context2.next = 22; + break; + + case 19: + _context2.prev = 19; + _context2.t0 = _context2["catch"](8); + + _iterator2.e(_context2.t0); + + case 22: + _context2.prev = 22; + + _iterator2.f(); + + return _context2.finish(22); + + case 25: + // 录制一遍绘制命令，后续直接播放 + // if (this.useRenderBundle) { + // if (!this.renderBundleRecorded) { + // this.engine.startRecordBundle(); + // if (this.onUpdate) { + // await this.onUpdate(this.engine); + // } + // this.renderBundle = this.engine.stopRecordBundle(); + // this.renderBundleRecorded = true; + // } + // this.engine.executeBundles([this.renderBundle]); + // } else { + // if (this.onUpdate) { + // await this.onUpdate(this.engine); + // } + // } + this.engine.endFrame(); + this.rendering = false; + + case 27: + case "end": + return _context2.stop(); + } + } + }, _callee2, this, [[8, 19, 22, 25]]); + })); + + function render() { + return _render.apply(this, arguments); + } + + return render; + }() + }, { + key: "clear", + value: function clear(options) { + var _this = this; + + if (this.inited) { + this.engine.clear(options); + } else { + this.pendings.unshift(function () { + _this.engine.clear(options); + + _this.pendings.shift(); + }); + } + + return this; + } // public setScissor( + // scissor: Partial<{ + // enable: boolean; + // box: { + // x: number; + // y: number; + // width: number; + // height: number; + // }; + // }>, + // ) { + // this.engine.setScissor(scissor); + // return this; + // } + + }, { + key: "setSize", + value: function setSize(_ref) { + var width = _ref.width, + height = _ref.height; + var canvas = this.engine.getCanvas(); + this.size = { + width: width, + height: height + }; + canvas.width = width; + canvas.height = height; + return this; + } + }, { + key: "getSize", + value: function getSize() { + return this.size; + } + }]); + + return Renderer; +}(), _temp$5), (_descriptor$3 = _applyDecoratedDescriptor(_class2$3.prototype, "engine", [_dec2$3], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor2$1 = _applyDecoratedDescriptor(_class2$3.prototype, "shaderModule", [_dec3$2], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor3 = _applyDecoratedDescriptor(_class2$3.prototype, "configService", [_dec4], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +})), _class2$3)) || _class$5); + +var _dec$4, _class$4, _temp$4; +var Scene = (_dec$4 = inversify.injectable(), _dec$4(_class$4 = (_temp$4 = /*#__PURE__*/function () { + function Scene() { + _classCallCheck(this, Scene); + + this.entities = []; + } + + _createClass(Scene, [{ + key: "getEntities", + value: function getEntities() { + return this.entities; + } + }, { + key: "addRenderable", + value: function addRenderable(renderable) { + this.addEntity(renderable.getEntity()); + return this; + } + }, { + key: "removeRenderable", + value: function removeRenderable(renderable) { + this.removeEntity(renderable.getEntity()); + return this; + } + }, { + key: "addLight", + value: function addLight() {} + }, { + key: "addEntity", + value: function addEntity(entity) { + if (this.entities.indexOf(entity) === -1) { + this.entities.push(entity); + } + + return this; + } + }, { + key: "removeEntity", + value: function removeEntity(entity) { + var index = this.entities.indexOf(entity); + this.entities.splice(index, 1); + return this; + } + }]); + + return Scene; +}(), _temp$4)) || _class$4); + +var _dec$3, _class$3, _temp$3; +var TextureCache = (_dec$3 = inversify.injectable(), _dec$3(_class$3 = (_temp$3 = /*#__PURE__*/function () { + function TextureCache() { + _classCallCheck(this, TextureCache); + + this.cache = {}; + } + + _createClass(TextureCache, [{ + key: "get", + value: function get(name) { + return this.cache[name]; + } + }, { + key: "set", + value: function set(name, texture) { + this.cache[name] = texture; + } + }]); + + return TextureCache; +}(), _temp$3)) || _class$3); + +var _dec$2, _dec2$2, _dec3$1, _class$2, _class2$2, _descriptor$2, _descriptor2, _temp$2; + +function ownKeys$1(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; } + +function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys$1(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys$1(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; } +var Texture2D = (_dec$2 = inversify.injectable(), _dec2$2 = inversify.inject(TextureCache), _dec3$1 = inversify.inject(IDENTIFIER.RenderEngine), _dec$2(_class$2 = (_class2$2 = (_temp$2 = /*#__PURE__*/function () { + function Texture2D() { + _classCallCheck(this, Texture2D); + + _initializerDefineProperty(this, "textureCache", _descriptor$2, this); + + _initializerDefineProperty(this, "engine", _descriptor2, this); + + this.config = void 0; + this.loaded = false; + this.texture = void 0; + } + + _createClass(Texture2D, [{ + key: "setConfig", + value: function setConfig(config) { + this.config = config; + } + }, { + key: "isLoaded", + value: function isLoaded() { + return this.loaded; + } // public update(config: ITexture2DInitializationOptions) { + // if (this.loaded && this.texture) { + // const t = this.texture.get(); + // } + // } + + }, { + key: "load", + value: function () { + var _load = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee() { + var _this = this; + + return regenerator.wrap(function _callee$(_context) { + while (1) { + switch (_context.prev = _context.next) { + case 0: + if (!this.config.url) { + _context.next = 4; + break; + } + + return _context.abrupt("return", new Promise(function (resolve, reject) { + var existed = _this.textureCache.get(_this.config.url); + + if (existed) { + resolve(existed); + } else { + var image = new Image(); + image.crossOrigin = 'Anonymous'; + image.src = _this.config.url; + + image.onload = function () { + var texture = _this.engine.createTexture2D(_objectSpread$1(_objectSpread$1({}, _this.config), {}, { + data: image, + width: image.width, + height: image.height, + flipY: true + })); + + _this.textureCache.set(_this.config.url, texture); + + _this.texture = texture; + _this.loaded = true; + resolve(texture); + }; + + image.onerror = function () { + reject(); + }; + } + })); + + case 4: + this.loaded = true; + this.texture = this.engine.createTexture2D(this.config); + return _context.abrupt("return", this.texture); + + case 7: + case "end": + return _context.stop(); + } + } + }, _callee, this); + })); + + function load() { + return _load.apply(this, arguments); + } + + return load; + }() + }]); + + return Texture2D; +}(), _temp$2), (_descriptor$2 = _applyDecoratedDescriptor(_class2$2.prototype, "textureCache", [_dec2$2], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +}), _descriptor2 = _applyDecoratedDescriptor(_class2$2.prototype, "engine", [_dec3$1], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +})), _class2$2)) || _class$2); + +var _dec$1, _dec2$1, _dec3, _class$1, _class2$1, _descriptor$1, _temp$1; +var View = (_dec$1 = inversify.injectable(), _dec2$1 = inversify.inject(IDENTIFIER.Systems), _dec3 = inversify.named(IDENTIFIER.RendererSystem), _dec$1(_class$1 = (_class2$1 = (_temp$1 = /*#__PURE__*/function () { + function View() { + _classCallCheck(this, View); + + _initializerDefineProperty(this, "rendererSystem", _descriptor$1, this); + + this.camera = void 0; + this.scene = void 0; + this.viewport = { + x: 0, + y: 0, + width: 0, + height: 0 + }; + this.clearColor = [1, 1, 1, 1]; + } + + _createClass(View, [{ + key: "getCamera", + value: function getCamera() { + return this.camera; + } + }, { + key: "getScene", + value: function getScene() { + return this.scene; + } + }, { + key: "getViewport", + value: function getViewport() { + return this.viewport; + } + }, { + key: "getClearColor", + value: function getClearColor() { + return this.clearColor; + } + }, { + key: "setCamera", + value: function setCamera(camera) { + this.camera = camera; + return this; + } + }, { + key: "setScene", + value: function setScene(scene) { + this.scene = scene; + return this; + } + }, { + key: "setViewport", + value: function setViewport(viewport) { + this.viewport = viewport; + return this; + } + }, { + key: "setClearColor", + value: function setClearColor(clearColor) { + this.clearColor = clearColor; + return this; + } + }, { + key: "pick", + value: function pick(position) { + return this.rendererSystem.pick(position, this); + } + }]); + + return View; +}(), _temp$1), (_descriptor$1 = _applyDecoratedDescriptor(_class2$1.prototype, "rendererSystem", [_dec2$1, _dec3], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +})), _class2$1)) || _class$1); + +var _dec, _dec2, _class, _class2, _descriptor, _temp; + +function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; } + +function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; } +var World = (_dec = inversify.injectable(), _dec2 = inversify.inject(IDENTIFIER.ConfigService), _dec(_class = (_class2 = (_temp = /*#__PURE__*/function () { + function World() { + _classCallCheck(this, World); + + _initializerDefineProperty(this, "configService", _descriptor, this); + + this.container = void 0; + } + + _createClass(World, [{ + key: "getEngine", + value: function () { + var _getEngine = _asyncToGenerator( /*#__PURE__*/regenerator.mark(function _callee() { + var engine, _this$configService$g, canvas, engineOptions; + + return regenerator.wrap(function _callee$(_context) { + while (1) { + switch (_context.prev = _context.next) { + case 0: + engine = this.container.get(IDENTIFIER.RenderEngine); + _this$configService$g = this.configService.get(), canvas = _this$configService$g.canvas, engineOptions = _this$configService$g.engineOptions; + _context.next = 4; + return engine.init(_objectSpread({ + canvas: canvas || createCanvas(), + swapChainFormat: constants.TextureFormat.BGRA8Unorm, + antialiasing: false + }, engineOptions)); + + case 4: + return _context.abrupt("return", engine); + + case 5: + case "end": + return _context.stop(); + } + } + }, _callee, this); + })); + + function getEngine() { + return _getEngine.apply(this, arguments); + } + + return getEngine; + }() + /** + * get transform component + * @param entity + */ + + }, { + key: "getTransformComponent", + value: function getTransformComponent(entity) { + var manager = this.container.get(IDENTIFIER.TransformComponentManager); + return manager.getComponentByEntity(entity); + } + }, { + key: "getMeshComponent", + value: function getMeshComponent(entity) { + var manager = this.container.get(IDENTIFIER.MeshComponentManager); + return manager.getComponentByEntity(entity); + } + }, { + key: "setConfig", + value: function setConfig(config) { + this.configService.set(config); + } + }, { + key: "setContainer", + value: function setContainer(container) { + this.container = container; + } + }, { + key: "getContainer", + value: function getContainer() { + return this.container; + } + }, { + key: "createEntity", + value: function createEntity$1() { + return createEntity(); + } + }, { + key: "createScene", + value: function createScene() { + return this.container.get(Scene); + } + }, { + key: "createCamera", + value: function createCamera() { + return this.container.get(Camera); + } + }, { + key: "createView", + value: function createView() { + return this.container.get(View); + } // public createLight(type: string,) { + // return this.container.getNamed(IDENTIFIER.Light, type) + // } + + }, { + key: "createRenderable", + value: function createRenderable(type, config) { + var renderable = type ? this.container.getNamed(IDENTIFIER.Renderable, type) : this.container.get(Renderable); + + var entity = createEntity(); + + renderable.setConfig(config || {}); + renderable.setEntity(entity); + return renderable; + } + }, { + key: "createGeometry", + value: function createGeometry(type, config) { + var geometry = this.container.getNamed(IDENTIFIER.Geometry, type); + + var entity = createEntity(); + + geometry.setConfig(config || {}); + geometry.setEntity(entity); + return geometry.getComponent(); + } + }, { + key: "createMaterial", + value: function createMaterial(type, config) { + var material = this.container.getNamed(IDENTIFIER.Material, type); + + var entity = createEntity(); + + material.setConfig(config || {}); + material.setEntity(entity, type); + return material.getComponent(); + } + }, { + key: "createTexture2D", + value: function createTexture2D(config) { + var texture = this.container.get(Texture2D); + texture.setConfig(config); + return texture; + } + }, { + key: "createBufferGeometry", + value: function createBufferGeometry(params) { + var geometrySystem = this.container.getNamed(IDENTIFIER.Systems, IDENTIFIER.GeometrySystem); + return geometrySystem.createBufferGeometry(params); + } + }, { + key: "createInstancedBufferGeometry", + value: function createInstancedBufferGeometry(params) { + var geometrySystem = this.container.getNamed(IDENTIFIER.Systems, IDENTIFIER.GeometrySystem); + return geometrySystem.createInstancedBufferGeometry(params); + } + }, { + key: "createShaderMaterial", + value: function createShaderMaterial(params) { + var materialSystem = this.container.getNamed(IDENTIFIER.Systems, IDENTIFIER.MaterialSystem); + return materialSystem.createShaderMaterial(params); + } + }, { + key: "createKernel", + value: function createKernel(precompiledBundle) { + var kernel = this.container.get(Kernel); + + if (typeof precompiledBundle === 'string') { + kernel.setBundle(JSON.parse(precompiledBundle)); + } else { + kernel.setBundle(precompiledBundle); + } + + kernel.init(); + return kernel; + } + }, { + key: "createRenderer", + value: function createRenderer() { + var renderer = this.container.get(Renderer); + renderer.container = this.container; + renderer.init(); + return renderer; + } + }, { + key: "destroy", + value: function destroy() { + var systems = this.container.getAll(IDENTIFIER.Systems); + systems.forEach(function (system) { + if (system.tearDown) { + system.tearDown(); + } + }); + var engine = this.container.get(IDENTIFIER.RenderEngine); + engine.destroy(); + var interactor = this.container.get(IDENTIFIER.InteractorService); + interactor.destroy(); + } + }], [{ + key: "create", + value: function create() { + var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; + var worldContainer = createWorldContainer(); // bind render engine, fallback to WebGL + + var engineClazz = !navigator.gpu ? WebGLEngine : WebGPUEngine; + + if (!worldContainer.isBound(IDENTIFIER.RenderEngine)) { + worldContainer.bind(IDENTIFIER.RenderEngine) // @ts-ignore + .to(engineClazz).inSingletonScope(); + } + + worldContainer.bind(Renderer).toSelf(); + worldContainer.bind(Kernel).toSelf(); + worldContainer.bind(Renderable).toSelf(); + worldContainer.bind(View).toSelf(); + worldContainer.bind(Camera).toSelf(); + worldContainer.bind(Scene).toSelf(); + worldContainer.bind(World).toSelf(); + worldContainer.bind(TextureCache).toSelf(); + worldContainer.bind(Texture2D).toSelf(); // bind geometries + + worldContainer.bind(IDENTIFIER.Geometry).to(Box).whenTargetNamed(Geometry.BOX); + worldContainer.bind(IDENTIFIER.Geometry).to(Sphere).whenTargetNamed(Geometry.SPHERE); + worldContainer.bind(IDENTIFIER.Geometry).to(Plane).whenTargetNamed(Geometry.PLANE); + worldContainer.bind(IDENTIFIER.Geometry).to(Merged).whenTargetNamed(Geometry.MERGED); // bind materials + + worldContainer.bind(IDENTIFIER.Material).to(Basic).whenTargetNamed(Material.BASIC); // bind renderables + + worldContainer.bind(IDENTIFIER.Renderable).to(Point).whenTargetNamed(Renderable.POINT); + worldContainer.bind(IDENTIFIER.Renderable).to(Line).whenTargetNamed(Renderable.LINE); + worldContainer.bind(IDENTIFIER.Renderable).to(Grid$2).whenTargetNamed(Renderable.GRID); + var world = worldContainer.get(World); + world.setContainer(worldContainer); + world.setConfig(config); + return world; + } + }]); + + return World; +}(), _temp), (_descriptor = _applyDecoratedDescriptor(_class2.prototype, "configService", [_dec2], { + configurable: true, + enumerable: true, + writable: true, + initializer: null +})), _class2)) || _class); + +/** + * 将 number | Function 类型的参数转换为 return number 的 Function + * @param {number | Function} value 需要被转换的值 + * @param {number} defaultV 返回函数的默认返回值 + * @return {Function} 转换后的函数 + */ +const proccessToFunc$1 = (value, defaultV) => { + let func; + if (!value) { + func = () => { + return defaultV || 1; + }; + } + else if (isNumber$2(value)) { + func = () => { + return value; + }; + } + else { + func = value; + } + return func; +}; +/** + * 将节点和边数据转换为 GPU 可读的数组。并返回 maxEdgePerVetex，每个节点上最多的边数 + * @param {NodeConfig[]} nodes 需要被转换的值 + * @param {EdgeConfig[]} edges 返回函数的默认返回值 + * @return {Object} 转换后的数组及 maxEdgePerVetex 组成的对象 + */ +const buildTextureData$1 = (nodes, edges) => { + const dataArray = []; + const nodeDict = []; + const mapIdPos = {}; + let i = 0; + for (i = 0; i < nodes.length; i++) { + const n = nodes[i]; + mapIdPos[n.id] = i; + dataArray.push(n.x); + dataArray.push(n.y); + dataArray.push(0); + dataArray.push(0); + nodeDict.push([]); + } + for (i = 0; i < edges.length; i++) { + const e = edges[i]; + const source = getEdgeTerminal(e, 'source'); + const target = getEdgeTerminal(e, 'target'); + nodeDict[mapIdPos[source]].push(mapIdPos[target]); + nodeDict[mapIdPos[target]].push(mapIdPos[source]); + } + let maxEdgePerVetex = 0; + for (i = 0; i < nodes.length; i++) { + const offset = dataArray.length; + const dests = nodeDict[i]; + const len = dests.length; + dataArray[i * 4 + 2] = offset; + dataArray[i * 4 + 3] = dests.length; + maxEdgePerVetex = Math.max(maxEdgePerVetex, dests.length); + for (let j = 0; j < len; ++j) { + const dest = dests[j]; + dataArray.push(+dest); + } + } + while (dataArray.length % 4 !== 0) { + dataArray.push(0); + } + return { + maxEdgePerVetex, + array: new Float32Array(dataArray), + }; +}; +/** +* 将节点和边数据转换为 GPU 可读的数组，每条边带有一个属性。并返回 maxEdgePerVetex，每个节点上最多的边数 +* @param {NodeConfig[]} nodes 节点数组 +* @param {EdgeConfig[]} edges 边数组 +* @param {Function} attrs 读取边属性的函数 +* @return {Object} 转换后的数组及 maxEdgePerVetex 组成的对象 +*/ +// export const buildTextureDataWithOneEdgeAttr = (nodes: OutNode[], edges: Edge[], attrs: Function): { +// array: Float32Array, +// maxEdgePerVetex: number +// } => { +// const dataArray = []; +// const nodeDict: any = []; +// const mapIdPos: IndexMap = {}; +// let i = 0; +// for (i = 0; i < nodes.length; i++) { +// const n = nodes[i]; +// mapIdPos[n.id] = i; +// dataArray.push(n.x); +// dataArray.push(n.y); +// dataArray.push(0); +// dataArray.push(0); +// nodeDict.push([]); +// } +// for (i = 0; i < edges.length; i++) { +// const e = edges[i]; +// nodeDict[mapIdPos[e.source]].push(mapIdPos[e.target]); +// nodeDict[mapIdPos[e.source]].push(attrs(e)); // 理想边长，后续可以改成每条边不同 +// nodeDict[mapIdPos[e.target]].push(mapIdPos[e.source]); +// nodeDict[mapIdPos[e.target]].push(attrs(e)); // 理想边长，后续可以改成每条边不同 +// } +// let maxEdgePerVetex = 0; +// for (i = 0; i < nodes.length; i++) { +// const offset: number = dataArray.length; +// const dests = nodeDict[i]; // dest 中节点 id 与边长间隔存储，即一位节点 id，一位边长…… +// const len = dests.length; +// dataArray[i * 4 + 2] = offset; +// dataArray[i * 4 + 3] = len / 2; // 第四位存储与该节点相关的所有节点个数 +// maxEdgePerVetex = Math.max(maxEdgePerVetex, len / 2); +// for (let j = 0; j < len; ++j) { +// const dest = dests[j]; +// dataArray.push(+dest); +// } +// } +// // 不是 4 的倍数，填充 0 +// while (dataArray.length % 4 !== 0) { +// dataArray.push(0); +// } +// return { +// array: new Float32Array(dataArray), +// maxEdgePerVetex +// } +// } +/** +* 将节点和边数据转换为 GPU 可读的数组，每条边带有一个以上属性。并返回 maxEdgePerVetex，每个节点上最多的边数 +* @param {NodeConfig[]} nodes 节点数组 +* @param {EdgeConfig[]} edges 边数组 +* @param {Function} attrs 读取边属性的函数 +* @return {Object} 转换后的数组及 maxEdgePerVetex 组成的对象 +*/ +const buildTextureDataWithTwoEdgeAttr$1 = (nodes, edges, attrs1, attrs2) => { + const dataArray = []; + const nodeDict = []; + const mapIdPos = {}; + let i = 0; + for (i = 0; i < nodes.length; i++) { + const n = nodes[i]; + mapIdPos[n.id] = i; + dataArray.push(n.x); + dataArray.push(n.y); + dataArray.push(0); + dataArray.push(0); + nodeDict.push([]); + } + for (i = 0; i < edges.length; i++) { + const e = edges[i]; + const source = getEdgeTerminal(e, 'source'); + const target = getEdgeTerminal(e, 'target'); + nodeDict[mapIdPos[source]].push(mapIdPos[target]); + nodeDict[mapIdPos[source]].push(attrs1(e)); + nodeDict[mapIdPos[source]].push(attrs2(e)); + nodeDict[mapIdPos[source]].push(0); + nodeDict[mapIdPos[target]].push(mapIdPos[source]); + nodeDict[mapIdPos[target]].push(attrs1(e)); + nodeDict[mapIdPos[target]].push(attrs2(e)); + nodeDict[mapIdPos[target]].push(0); + } + let maxEdgePerVetex = 0; + for (i = 0; i < nodes.length; i++) { + const offset = dataArray.length; + const dests = nodeDict[i]; // dest 中节点 id 与边长间隔存储，即一位节点 id，一位边长…… + const len = dests.length; + // dataArray[i * 4 + 2] = offset; + // dataArray[i * 4 + 3] = len / 4; // 第四位存储与该节点相关的所有节点个数 + // pack offset & length into float32: offset 20bit, length 12bit + dataArray[i * 4 + 2] = offset + 1048576 * len / 4; + dataArray[i * 4 + 3] = 0; // 第四位存储与上一次的距离差值 + maxEdgePerVetex = Math.max(maxEdgePerVetex, len / 4); + for (let j = 0; j < len; ++j) { + const dest = dests[j]; + dataArray.push(+dest); + } + } + // 不是 4 的倍数，填充 0 + while (dataArray.length % 4 !== 0) { + dataArray.push(0); + } + return { + maxEdgePerVetex, + array: new Float32Array(dataArray), + }; +}; +/** +* transform the extended attributes of nodes or edges to a texture array +* @param {string[]} attributeNames attributes' name to be read from items and put into output array +* @param {ModelConfig[]} items the items to be read +* @return {Float32Array} the attributes' value array to be read by GPU +*/ +const attributesToTextureData$1 = (attributeNames, items) => { + const dataArray = []; + const attributeNum = attributeNames.length; + const attributteStringMap = {}; + items.forEach((item) => { + attributeNames.forEach((name, i) => { + if (attributteStringMap[item[name]] === undefined) { + attributteStringMap[item[name]] = Object.keys(attributteStringMap).length; + } + dataArray.push(attributteStringMap[item[name]]); + // insure each node's attributes take inter number of grids + if (i === attributeNum - 1) { + while (dataArray.length % 4 !== 0) { + dataArray.push(0); + } + } + }); + }); + return { + array: new Float32Array(dataArray), + count: Object.keys(attributteStringMap).length + }; +}; +/** +* transform the number array format of extended attributes of nodes or edges to a texture array +* @param {string[]} attributeNames attributes' name to be read from items and put into output array +* @return {Float32Array} the attributes' value array to be read by GPU +*/ +const arrayToTextureData$1 = (valueArrays) => { + const dataArray = []; + const attributeNum = valueArrays.length; + const itemNum = valueArrays[0].length; + for (let j = 0; j < itemNum; j++) { + valueArrays.forEach((valueArray, i) => { + dataArray.push(valueArray[j]); + // insure each node's attributes take inter number of grids + if (i === attributeNum - 1) { + while (dataArray.length % 4 !== 0) { + dataArray.push(0); + } + } + }); + } + return new Float32Array(dataArray); +}; + +const fruchtermanBundle = `{"shaders":{"WGSL":"import \\"GLSL.std.450\\" as std;\\n\\n\\n# var gWebGPUDebug : bool = false;\\n# var gWebGPUDebugOutput : vec4 = vec4(0.0);\\n\\n[[builtin global_invocation_id]] var globalInvocationID : vec3;\\n# [[builtin work_group_size]] var workGroupSize : vec3;\\n# [[builtin work_group_id]] var workGroupID : vec3;\\n[[builtin local_invocation_id]] var localInvocationID : vec3;\\n# [[builtin num_work_groups]] var numWorkGroups : vec3;\\n[[builtin local_invocation_idx]] var localInvocationIndex : u32;\\n\\ntype GWebGPUParams = [[block]] struct {\\n [[offset 0]] u_K : f32;\\n [[offset 4]] u_K2 : f32;\\n [[offset 8]] u_Center : vec2;\\n [[offset 16]] u_Gravity : f32;\\n [[offset 20]] u_ClusterGravity : f32;\\n [[offset 24]] u_Speed : f32;\\n [[offset 28]] u_MaxDisplace : f32;\\n [[offset 32]] u_Clustering : f32;\\n};\\n[[binding 0, set 0]] var gWebGPUUniformParams : GWebGPUParams;\\ntype GWebGPUBuffer0 = [[block]] struct {\\n [[offset 0]] u_Data : [[stride 16]] array>;\\n};\\n[[binding 1, set 0]] var gWebGPUBuffer0 : GWebGPUBuffer0;\\ntype GWebGPUBuffer1 = [[block]] struct {\\n [[offset 0]] u_AttributeArray : [[stride 16]] array>;\\n};\\n[[binding 2, set 0]] var gWebGPUBuffer1 : GWebGPUBuffer1;\\ntype GWebGPUBuffer2 = [[block]] struct {\\n [[offset 0]] u_ClusterCenters : [[stride 16]] array>;\\n};\\n[[binding 3, set 0]] var gWebGPUBuffer2 : GWebGPUBuffer2;\\n\\n\\n\\n\\n\\n\\n\\n\\n\\n\\n\\n\\n\\n\\n\\n\\n\\nfn calcRepulsive(i : i32, currentNode : vec4) -> vec2 {var dx : f32 = 0.0;\\nvar dy : f32 = 0.0;\\nfor (var j : i32 = 0; j < __DefineValuePlaceholder__VERTEX_COUNT; j = j + 1) {if (i != j) {var nextNode : vec4 = gWebGPUBuffer0.u_Data[j];\\nvar xDist : f32 = currentNode.x - nextNode.x;\\nvar yDist : f32 = currentNode.y - nextNode.y;\\nvar dist : f32 = ((xDist * xDist) + (yDist * yDist)) + 0.01;\\nvar param : f32 = gWebGPUUniformParams.u_K2 / dist;\\nif (dist > 0.0) {dx = dx + param * xDist;\\ndy = dy + param * yDist;\\nif ((xDist == 0.0) && (yDist == 0.0)) {var sign : f32 = select(1.0, -1.0, i < j);\\ndx = dx + param * std::sign;\\ndy = dy + param * std::sign;}}}}\\nreturn vec2(dx, dy);}\\nfn calcGravity(currentNode : vec4, nodeAttributes : vec4) -> vec2 {var dx : f32 = 0.0;\\nvar dy : f32 = 0.0;\\nvar vx : f32 = currentNode.x - gWebGPUUniformParams.u_Center.x;\\nvar vy : f32 = currentNode.y - gWebGPUUniformParams.u_Center.y;\\nvar gf : f32 = (0.01 * gWebGPUUniformParams.u_K) * gWebGPUUniformParams.u_Gravity;\\ndx = gf * vx;\\ndy = gf * vy;\\nif (gWebGPUUniformParams.u_Clustering == 1.0) {var clusterIdx : i32 = i32(nodeAttributes.x);\\nvar center : vec4 = gWebGPUBuffer2.u_ClusterCenters[clusterIdx];\\nvar cvx : f32 = currentNode.x - center.x;\\nvar cvy : f32 = currentNode.y - center.y;\\nvar dist : f32 = std::sqrt((cvx * cvx) + (cvy * cvy)) + 0.01;\\nvar parma : f32 = (gWebGPUUniformParams.u_K * gWebGPUUniformParams.u_ClusterGravity) / dist;\\ndx = dx + parma * cvx;\\ndy = dy + parma * cvy;}\\nreturn vec2(dx, dy);}\\nfn calcAttractive(i : i32, currentNode : vec4) -> vec2 {var dx : f32 = 0.0;\\nvar dy : f32 = 0.0;\\nvar arr_offset : i32 = i32(std::floor(currentNode.z + 0.5));\\nvar length : i32 = i32(std::floor(currentNode.w + 0.5));\\nvar node_buffer : vec4;\\nfor (var p : i32 = 0; p < __DefineValuePlaceholder__MAX_EDGE_PER_VERTEX; p = p + 1) {if (p >= length) {break;}\\nvar arr_idx : i32 = arr_offset + i32(p);\\nvar buf_offset : i32 = arr_idx - ((arr_idx / 4) * 4);\\nif ((p == 0) || (buf_offset == 0)) {node_buffer = gWebGPUBuffer0.u_Data[i32(arr_idx / 4)];}\\nvar float_j : f32 = select(node_buffer.x, select(node_buffer.y, select(node_buffer.z, node_buffer.w, buf_offset == 2), buf_offset == 1), buf_offset == 0);\\nvar nextNode : vec4 = gWebGPUBuffer0.u_Data[i32(float_j)];\\nvar xDist : f32 = currentNode.x - nextNode.x;\\nvar yDist : f32 = currentNode.y - nextNode.y;\\nvar dist : f32 = std::sqrt((xDist * xDist) + (yDist * yDist)) + 0.01;\\nvar attractiveF : f32 = dist / gWebGPUUniformParams.u_K;\\nif (dist > 0.0) {dx = dx - xDist * attractiveF;\\ndy = dy - yDist * attractiveF;\\nif ((xDist == 0.0) && (yDist == 0.0)) {var sign : f32 = select(1.0, -1.0, i < i32(float_j));\\ndx = dx - std::sign * attractiveF;\\ndy = dy - std::sign * attractiveF;}}}\\nreturn vec2(dx, dy);}\\nfn main() -> void {var i : i32 = globalInvocationID.x;\\nvar currentNode : vec4 = gWebGPUBuffer0.u_Data[i];\\nvar dx : f32 = 0.0;\\nvar dy : f32 = 0.0;\\nif (i >= __DefineValuePlaceholder__VERTEX_COUNT) {gWebGPUBuffer0.u_Data[i] = currentNode;\\nreturn ;}\\nvar nodeAttributes : vec4 = gWebGPUBuffer1.u_AttributeArray[i];\\nif ((nodeAttributes.y != 0.0) && (nodeAttributes.z != 0.0)) {gWebGPUBuffer0.u_Data[i] = vec4(nodeAttributes.y, nodeAttributes.z, currentNode.z, currentNode.w);\\nreturn ;}\\nvar repulsive : vec2 = calcRepulsive(i, currentNode);\\ndx = dx + repulsive.x;\\ndy = dy + repulsive.y;\\nvar attractive : vec2 = calcAttractive(i, currentNode);\\ndx = dx + attractive.x;\\ndy = dy + attractive.y;\\nvar gravity : vec2 = calcGravity(currentNode, nodeAttributes);\\ndx = dx - gravity.x;\\ndy = dy - gravity.y;\\ndx = dx * gWebGPUUniformParams.u_Speed;\\ndy = dy * gWebGPUUniformParams.u_Speed;\\nvar distLength : f32 = std::sqrt((dx * dx) + (dy * dy));\\nif (distLength > 0.0) {var limitedDist : f32 = std::min(gWebGPUUniformParams.u_MaxDisplace * gWebGPUUniformParams.u_Speed, distLength);\\ngWebGPUBuffer0.u_Data[i] = vec4(currentNode.x + ((dx / distLength) * limitedDist), currentNode.y + ((dy / distLength) * limitedDist), currentNode.z, currentNode.w);}\\nreturn;}\\n\\nentry_point compute as \\"main\\" = main;\\n","GLSL450":"\\n\\n\\nbool gWebGPUDebug = false;\\nvec4 gWebGPUDebugOutput = vec4(0.0);\\n\\nivec3 globalInvocationID = ivec3(gl_GlobalInvocationID);\\nivec3 workGroupSize = ivec3(1,1,1);\\nivec3 workGroupID = ivec3(gl_WorkGroupID);\\nivec3 localInvocationID = ivec3(gl_LocalInvocationID);\\nivec3 numWorkGroups = ivec3(gl_NumWorkGroups);\\nint localInvocationIndex = int(gl_LocalInvocationIndex);\\n\\nlayout(std140, set = 0, binding = 0) uniform GWebGPUParams {\\n float u_K;\\n float u_K2;\\n vec2 u_Center;\\n float u_Gravity;\\n float u_ClusterGravity;\\n float u_Speed;\\n float u_MaxDisplace;\\n float u_Clustering;\\n} gWebGPUUniformParams;\\nlayout(std430, set = 0, binding = 1) buffer GWebGPUBuffer0 {\\n vec4 u_Data[];\\n} gWebGPUBuffer0;\\n\\nlayout(std430, set = 0, binding = 2) buffer readonly GWebGPUBuffer1 {\\n vec4 u_AttributeArray[];\\n} gWebGPUBuffer1;\\n\\nlayout(std430, set = 0, binding = 3) buffer readonly GWebGPUBuffer2 {\\n vec4 u_ClusterCenters[];\\n} gWebGPUBuffer2;\\n\\n\\n\\n#define MAX_EDGE_PER_VERTEX __DefineValuePlaceholder__MAX_EDGE_PER_VERTEX\\n#define VERTEX_COUNT __DefineValuePlaceholder__VERTEX_COUNT\\nlayout (\\n local_size_x = 1,\\n local_size_y = 1,\\n local_size_z = 1\\n) in;\\n\\n\\n\\n\\n\\n\\n\\n\\n\\n\\n\\nvec2 calcRepulsive(int i, vec4 currentNode) {float dx = 0.0;\\nfloat dy = 0.0;\\nfor (int j = 0; j < VERTEX_COUNT; j++) {if (i != j) {vec4 nextNode = gWebGPUBuffer0.u_Data[j];\\nfloat xDist = currentNode.x - nextNode.x;\\nfloat yDist = currentNode.y - nextNode.y;\\nfloat dist = ((xDist * xDist) + (yDist * yDist)) + 0.01;\\nfloat param = gWebGPUUniformParams.u_K2 / dist;\\nif (dist > 0.0) {dx += param * xDist;\\ndy += param * yDist;\\nif ((xDist == 0.0) && (yDist == 0.0)) {float sign = (i < j) ? (1.0) : (-1.0);\\ndx += param * sign;\\ndy += param * sign;}}}}\\nreturn vec2(dx, dy);}\\nvec2 calcGravity(vec4 currentNode, vec4 nodeAttributes) {float dx = 0.0;\\nfloat dy = 0.0;\\nfloat vx = currentNode.x - gWebGPUUniformParams.u_Center.x;\\nfloat vy = currentNode.y - gWebGPUUniformParams.u_Center.y;\\nfloat gf = (0.01 * gWebGPUUniformParams.u_K) * gWebGPUUniformParams.u_Gravity;\\ndx = gf * vx;\\ndy = gf * vy;\\nif (gWebGPUUniformParams.u_Clustering == 1.0) {int clusterIdx = int(nodeAttributes.x);\\nvec4 center = gWebGPUBuffer2.u_ClusterCenters[clusterIdx];\\nfloat cvx = currentNode.x - center.x;\\nfloat cvy = currentNode.y - center.y;\\nfloat dist = sqrt((cvx * cvx) + (cvy * cvy)) + 0.01;\\nfloat parma = (gWebGPUUniformParams.u_K * gWebGPUUniformParams.u_ClusterGravity) / dist;\\ndx += parma * cvx;\\ndy += parma * cvy;}\\nreturn vec2(dx, dy);}\\nvec2 calcAttractive(int i, vec4 currentNode) {float dx = 0.0;\\nfloat dy = 0.0;\\nint arr_offset = int(floor(currentNode.z + 0.5));\\nint length = int(floor(currentNode.w + 0.5));\\nvec4 node_buffer;\\nfor (int p = 0; p < MAX_EDGE_PER_VERTEX; p++) {if (p >= length) {break;}\\nint arr_idx = arr_offset + int(p);\\nint buf_offset = arr_idx - ((arr_idx / 4) * 4);\\nif ((p == 0) || (buf_offset == 0)) {node_buffer = gWebGPUBuffer0.u_Data[int(arr_idx / 4)];}\\nfloat float_j = (buf_offset == 0) ? (node_buffer.x) : ((buf_offset == 1) ? (node_buffer.y) : ((buf_offset == 2) ? (node_buffer.z) : (node_buffer.w)));\\nvec4 nextNode = gWebGPUBuffer0.u_Data[int(float_j)];\\nfloat xDist = currentNode.x - nextNode.x;\\nfloat yDist = currentNode.y - nextNode.y;\\nfloat dist = sqrt((xDist * xDist) + (yDist * yDist)) + 0.01;\\nfloat attractiveF = dist / gWebGPUUniformParams.u_K;\\nif (dist > 0.0) {dx -= xDist * attractiveF;\\ndy -= yDist * attractiveF;\\nif ((xDist == 0.0) && (yDist == 0.0)) {float sign = (i < int(float_j)) ? (1.0) : (-1.0);\\ndx -= sign * attractiveF;\\ndy -= sign * attractiveF;}}}\\nreturn vec2(dx, dy);}\\nvoid main() {int i = globalInvocationID.x;\\nvec4 currentNode = gWebGPUBuffer0.u_Data[i];\\nfloat dx = 0.0;\\nfloat dy = 0.0;\\nif (i >= VERTEX_COUNT) {gWebGPUBuffer0.u_Data[i] = currentNode;\\nreturn ;}\\nvec4 nodeAttributes = gWebGPUBuffer1.u_AttributeArray[i];\\nif ((nodeAttributes.y != 0.0) && (nodeAttributes.z != 0.0)) {gWebGPUBuffer0.u_Data[i] = vec4(nodeAttributes.y, nodeAttributes.z, currentNode.z, currentNode.w);\\nreturn ;}\\nvec2 repulsive = calcRepulsive(i, currentNode);\\ndx += repulsive.x;\\ndy += repulsive.y;\\nvec2 attractive = calcAttractive(i, currentNode);\\ndx += attractive.x;\\ndy += attractive.y;\\nvec2 gravity = calcGravity(currentNode, nodeAttributes);\\ndx -= gravity.x;\\ndy -= gravity.y;\\ndx *= gWebGPUUniformParams.u_Speed;\\ndy *= gWebGPUUniformParams.u_Speed;\\nfloat distLength = sqrt((dx * dx) + (dy * dy));\\nif (distLength > 0.0) {float limitedDist = min(gWebGPUUniformParams.u_MaxDisplace * gWebGPUUniformParams.u_Speed, distLength);\\ngWebGPUBuffer0.u_Data[i] = vec4(currentNode.x + ((dx / distLength) * limitedDist), currentNode.y + ((dy / distLength) * limitedDist), currentNode.z, currentNode.w);}}\\n","GLSL100":"\\n\\nfloat epsilon = 0.00001;\\nvec2 addrTranslation_1Dto2D(float address1D, vec2 texSize) {\\n vec2 conv_const = vec2(1.0 / texSize.x, 1.0 / (texSize.x * texSize.y));\\n vec2 normAddr2D = float(address1D) * conv_const;\\n return vec2(fract(normAddr2D.x + epsilon), normAddr2D.y);\\n}\\n\\nvoid barrier() {}\\n \\n\\nuniform vec2 u_OutputTextureSize;\\nuniform int u_OutputTexelCount;\\nvarying vec2 v_TexCoord;\\n\\nbool gWebGPUDebug = false;\\nvec4 gWebGPUDebugOutput = vec4(0.0);\\n\\n#define MAX_EDGE_PER_VERTEX __DefineValuePlaceholder__MAX_EDGE_PER_VERTEX\\n#define VERTEX_COUNT __DefineValuePlaceholder__VERTEX_COUNT\\n\\nuniform sampler2D u_Data;\\nuniform vec2 u_DataSize;\\nvec4 getDatau_Data(vec2 address2D) {\\n return vec4(texture2D(u_Data, address2D).rgba);\\n}\\nvec4 getDatau_Data(float address1D) {\\n return getDatau_Data(addrTranslation_1Dto2D(address1D, u_DataSize));\\n}\\nvec4 getDatau_Data(int address1D) {\\n return getDatau_Data(float(address1D));\\n}\\nuniform float u_K;\\nuniform float u_K2;\\nuniform vec2 u_Center;\\nuniform float u_Gravity;\\nuniform float u_ClusterGravity;\\nuniform float u_Speed;\\nuniform float u_MaxDisplace;\\nuniform float u_Clustering;\\nuniform sampler2D u_AttributeArray;\\nuniform vec2 u_AttributeArraySize;\\nvec4 getDatau_AttributeArray(vec2 address2D) {\\n return vec4(texture2D(u_AttributeArray, address2D).rgba);\\n}\\nvec4 getDatau_AttributeArray(float address1D) {\\n return getDatau_AttributeArray(addrTranslation_1Dto2D(address1D, u_AttributeArraySize));\\n}\\nvec4 getDatau_AttributeArray(int address1D) {\\n return getDatau_AttributeArray(float(address1D));\\n}\\nuniform sampler2D u_ClusterCenters;\\nuniform vec2 u_ClusterCentersSize;\\nvec4 getDatau_ClusterCenters(vec2 address2D) {\\n return vec4(texture2D(u_ClusterCenters, address2D).rgba);\\n}\\nvec4 getDatau_ClusterCenters(float address1D) {\\n return getDatau_ClusterCenters(addrTranslation_1Dto2D(address1D, u_ClusterCentersSize));\\n}\\nvec4 getDatau_ClusterCenters(int address1D) {\\n return getDatau_ClusterCenters(float(address1D));\\n}\\nvec2 calcRepulsive(int i, vec4 currentNode) {\\nivec3 workGroupSize = ivec3(1, 1, 1);\\nivec3 numWorkGroups = ivec3(1, 1, 1); \\nint globalInvocationIndex = int(floor(v_TexCoord.x * u_OutputTextureSize.x))\\n + int(floor(v_TexCoord.y * u_OutputTextureSize.y)) * int(u_OutputTextureSize.x);\\nint workGroupIDLength = globalInvocationIndex / (workGroupSize.x * workGroupSize.y * workGroupSize.z);\\nivec3 workGroupID = ivec3(workGroupIDLength / numWorkGroups.y / numWorkGroups.z, workGroupIDLength / numWorkGroups.x / numWorkGroups.z, workGroupIDLength / numWorkGroups.x / numWorkGroups.y);\\nint localInvocationIDZ = globalInvocationIndex / (workGroupSize.x * workGroupSize.y);\\nint localInvocationIDY = (globalInvocationIndex - localInvocationIDZ * workGroupSize.x * workGroupSize.y) / workGroupSize.x;\\nint localInvocationIDX = globalInvocationIndex - localInvocationIDZ * workGroupSize.x * workGroupSize.y - localInvocationIDY * workGroupSize.x;\\nivec3 localInvocationID = ivec3(localInvocationIDX, localInvocationIDY, localInvocationIDZ);\\nivec3 globalInvocationID = workGroupID * workGroupSize + localInvocationID;\\nint localInvocationIndex = localInvocationID.z * workGroupSize.x * workGroupSize.y\\n + localInvocationID.y * workGroupSize.x + localInvocationID.x;\\nfloat dx = 0.0;\\nfloat dy = 0.0;\\nfor (int j = 0; j < VERTEX_COUNT; j++) {if (i != j) {vec4 nextNode = getDatau_Data(j);\\nfloat xDist = currentNode.x - nextNode.x;\\nfloat yDist = currentNode.y - nextNode.y;\\nfloat dist = ((xDist * xDist) + (yDist * yDist)) + 0.01;\\nfloat param = u_K2 / dist;\\nif (dist > 0.0) {dx += param * xDist;\\ndy += param * yDist;\\nif ((xDist == 0.0) && (yDist == 0.0)) {float sign = (i < j) ? (1.0) : (-1.0);\\ndx += param * sign;\\ndy += param * sign;}}}}\\nreturn vec2(dx, dy);}\\nvec2 calcGravity(vec4 currentNode, vec4 nodeAttributes) {\\nivec3 workGroupSize = ivec3(1, 1, 1);\\nivec3 numWorkGroups = ivec3(1, 1, 1); \\nint globalInvocationIndex = int(floor(v_TexCoord.x * u_OutputTextureSize.x))\\n + int(floor(v_TexCoord.y * u_OutputTextureSize.y)) * int(u_OutputTextureSize.x);\\nint workGroupIDLength = globalInvocationIndex / (workGroupSize.x * workGroupSize.y * workGroupSize.z);\\nivec3 workGroupID = ivec3(workGroupIDLength / numWorkGroups.y / numWorkGroups.z, workGroupIDLength / numWorkGroups.x / numWorkGroups.z, workGroupIDLength / numWorkGroups.x / numWorkGroups.y);\\nint localInvocationIDZ = globalInvocationIndex / (workGroupSize.x * workGroupSize.y);\\nint localInvocationIDY = (globalInvocationIndex - localInvocationIDZ * workGroupSize.x * workGroupSize.y) / workGroupSize.x;\\nint localInvocationIDX = globalInvocationIndex - localInvocationIDZ * workGroupSize.x * workGroupSize.y - localInvocationIDY * workGroupSize.x;\\nivec3 localInvocationID = ivec3(localInvocationIDX, localInvocationIDY, localInvocationIDZ);\\nivec3 globalInvocationID = workGroupID * workGroupSize + localInvocationID;\\nint localInvocationIndex = localInvocationID.z * workGroupSize.x * workGroupSize.y\\n + localInvocationID.y * workGroupSize.x + localInvocationID.x;\\nfloat dx = 0.0;\\nfloat dy = 0.0;\\nfloat vx = currentNode.x - u_Center.x;\\nfloat vy = currentNode.y - u_Center.y;\\nfloat gf = (0.01 * u_K) * u_Gravity;\\ndx = gf * vx;\\ndy = gf * vy;\\nif (u_Clustering == 1.0) {int clusterIdx = int(nodeAttributes.x);\\nvec4 center = getDatau_ClusterCenters(clusterIdx);\\nfloat cvx = currentNode.x - center.x;\\nfloat cvy = currentNode.y - center.y;\\nfloat dist = sqrt((cvx * cvx) + (cvy * cvy)) + 0.01;\\nfloat parma = (u_K * u_ClusterGravity) / dist;\\ndx += parma * cvx;\\ndy += parma * cvy;}\\nreturn vec2(dx, dy);}\\nvec2 calcAttractive(int i, vec4 currentNode) {\\nivec3 workGroupSize = ivec3(1, 1, 1);\\nivec3 numWorkGroups = ivec3(1, 1, 1); \\nint globalInvocationIndex = int(floor(v_TexCoord.x * u_OutputTextureSize.x))\\n + int(floor(v_TexCoord.y * u_OutputTextureSize.y)) * int(u_OutputTextureSize.x);\\nint workGroupIDLength = globalInvocationIndex / (workGroupSize.x * workGroupSize.y * workGroupSize.z);\\nivec3 workGroupID = ivec3(workGroupIDLength / numWorkGroups.y / numWorkGroups.z, workGroupIDLength / numWorkGroups.x / numWorkGroups.z, workGroupIDLength / numWorkGroups.x / numWorkGroups.y);\\nint localInvocationIDZ = globalInvocationIndex / (workGroupSize.x * workGroupSize.y);\\nint localInvocationIDY = (globalInvocationIndex - localInvocationIDZ * workGroupSize.x * workGroupSize.y) / workGroupSize.x;\\nint localInvocationIDX = globalInvocationIndex - localInvocationIDZ * workGroupSize.x * workGroupSize.y - localInvocationIDY * workGroupSize.x;\\nivec3 localInvocationID = ivec3(localInvocationIDX, localInvocationIDY, localInvocationIDZ);\\nivec3 globalInvocationID = workGroupID * workGroupSize + localInvocationID;\\nint localInvocationIndex = localInvocationID.z * workGroupSize.x * workGroupSize.y\\n + localInvocationID.y * workGroupSize.x + localInvocationID.x;\\nfloat dx = 0.0;\\nfloat dy = 0.0;\\nint arr_offset = int(floor(currentNode.z + 0.5));\\nint length = int(floor(currentNode.w + 0.5));\\nvec4 node_buffer;\\nfor (int p = 0; p < MAX_EDGE_PER_VERTEX; p++) {if (p >= length) {break;}\\nint arr_idx = arr_offset + int(p);\\nint buf_offset = arr_idx - ((arr_idx / 4) * 4);\\nif ((p == 0) || (buf_offset == 0)) {node_buffer = getDatau_Data(int(arr_idx / 4));}\\nfloat float_j = (buf_offset == 0) ? (node_buffer.x) : ((buf_offset == 1) ? (node_buffer.y) : ((buf_offset == 2) ? (node_buffer.z) : (node_buffer.w)));\\nvec4 nextNode = getDatau_Data(int(float_j));\\nfloat xDist = currentNode.x - nextNode.x;\\nfloat yDist = currentNode.y - nextNode.y;\\nfloat dist = sqrt((xDist * xDist) + (yDist * yDist)) + 0.01;\\nfloat attractiveF = dist / u_K;\\nif (dist > 0.0) {dx -= xDist * attractiveF;\\ndy -= yDist * attractiveF;\\nif ((xDist == 0.0) && (yDist == 0.0)) {float sign = (i < int(float_j)) ? (1.0) : (-1.0);\\ndx -= sign * attractiveF;\\ndy -= sign * attractiveF;}}}\\nreturn vec2(dx, dy);}\\nvoid main() {\\nivec3 workGroupSize = ivec3(1, 1, 1);\\nivec3 numWorkGroups = ivec3(1, 1, 1); \\nint globalInvocationIndex = int(floor(v_TexCoord.x * u_OutputTextureSize.x))\\n + int(floor(v_TexCoord.y * u_OutputTextureSize.y)) * int(u_OutputTextureSize.x);\\nint workGroupIDLength = globalInvocationIndex / (workGroupSize.x * workGroupSize.y * workGroupSize.z);\\nivec3 workGroupID = ivec3(workGroupIDLength / numWorkGroups.y / numWorkGroups.z, workGroupIDLength / numWorkGroups.x / numWorkGroups.z, workGroupIDLength / numWorkGroups.x / numWorkGroups.y);\\nint localInvocationIDZ = globalInvocationIndex / (workGroupSize.x * workGroupSize.y);\\nint localInvocationIDY = (globalInvocationIndex - localInvocationIDZ * workGroupSize.x * workGroupSize.y) / workGroupSize.x;\\nint localInvocationIDX = globalInvocationIndex - localInvocationIDZ * workGroupSize.x * workGroupSize.y - localInvocationIDY * workGroupSize.x;\\nivec3 localInvocationID = ivec3(localInvocationIDX, localInvocationIDY, localInvocationIDZ);\\nivec3 globalInvocationID = workGroupID * workGroupSize + localInvocationID;\\nint localInvocationIndex = localInvocationID.z * workGroupSize.x * workGroupSize.y\\n + localInvocationID.y * workGroupSize.x + localInvocationID.x;\\nint i = globalInvocationID.x;\\nvec4 currentNode = getDatau_Data(i);\\nfloat dx = 0.0;\\nfloat dy = 0.0;\\nif (i >= VERTEX_COUNT) {gl_FragColor = vec4(currentNode);\\nreturn ;}\\nvec4 nodeAttributes = getDatau_AttributeArray(i);\\nif ((nodeAttributes.y != 0.0) && (nodeAttributes.z != 0.0)) {gl_FragColor = vec4(vec4(nodeAttributes.y, nodeAttributes.z, currentNode.z, currentNode.w));\\nreturn ;}\\nvec2 repulsive = calcRepulsive(i, currentNode);\\ndx += repulsive.x;\\ndy += repulsive.y;\\nvec2 attractive = calcAttractive(i, currentNode);\\ndx += attractive.x;\\ndy += attractive.y;\\nvec2 gravity = calcGravity(currentNode, nodeAttributes);\\ndx -= gravity.x;\\ndy -= gravity.y;\\ndx *= u_Speed;\\ndy *= u_Speed;\\nfloat distLength = sqrt((dx * dx) + (dy * dy));\\nif (distLength > 0.0) {float limitedDist = min(u_MaxDisplace * u_Speed, distLength);\\ngl_FragColor = vec4(vec4(currentNode.x + ((dx / distLength) * limitedDist), currentNode.y + ((dy / distLength) * limitedDist), currentNode.z, currentNode.w));}if (gWebGPUDebug) {\\n gl_FragColor = gWebGPUDebugOutput;\\n}}\\n"},"context":{"name":"","dispatch":[1,1,1],"threadGroupSize":[1,1,1],"maxIteration":1,"defines":[{"name":"MAX_EDGE_PER_VERTEX","type":"Float","runtime":true},{"name":"VERTEX_COUNT","type":"Float","runtime":true}],"uniforms":[{"name":"u_Data","type":"vec4[]","storageClass":"StorageBuffer","readonly":false,"writeonly":false,"size":[1,1]},{"name":"u_K","type":"Float","storageClass":"Uniform","readonly":true,"writeonly":false,"size":[1,1]},{"name":"u_K2","type":"Float","storageClass":"Uniform","readonly":true,"writeonly":false,"size":[1,1]},{"name":"u_Center","type":"vec2","storageClass":"Uniform","readonly":true,"writeonly":false,"size":[1,1]},{"name":"u_Gravity","type":"Float","storageClass":"Uniform","readonly":true,"writeonly":false,"size":[1,1]},{"name":"u_ClusterGravity","type":"Float","storageClass":"Uniform","readonly":true,"writeonly":false,"size":[1,1]},{"name":"u_Speed","type":"Float","storageClass":"Uniform","readonly":true,"writeonly":false,"size":[1,1]},{"name":"u_MaxDisplace","type":"Float","storageClass":"Uniform","readonly":true,"writeonly":false,"size":[1,1]},{"name":"u_Clustering","type":"Float","storageClass":"Uniform","readonly":true,"writeonly":false,"size":[1,1]},{"name":"u_AttributeArray","type":"vec4[]","storageClass":"StorageBuffer","readonly":true,"writeonly":false,"size":[1,1]},{"name":"u_ClusterCenters","type":"vec4[]","storageClass":"StorageBuffer","readonly":true,"writeonly":false,"size":[1,1]}],"globalDeclarations":[],"output":{"name":"u_Data","size":[1,1],"length":1},"needPingpong":true}}`; +const clusterBundle = `{"shaders":{"WGSL":"import \\"GLSL.std.450\\" as std;\\n\\n\\n# var gWebGPUDebug : bool = false;\\n# var gWebGPUDebugOutput : vec4 = vec4(0.0);\\n\\n[[builtin global_invocation_id]] var globalInvocationID : vec3;\\n# [[builtin work_group_size]] var workGroupSize : vec3;\\n# [[builtin work_group_id]] var workGroupID : vec3;\\n[[builtin local_invocation_id]] var localInvocationID : vec3;\\n# [[builtin num_work_groups]] var numWorkGroups : vec3;\\n[[builtin local_invocation_idx]] var localInvocationIndex : u32;\\n\\n\\ntype GWebGPUBuffer0 = [[block]] struct {\\n [[offset 0]] u_Data : [[stride 16]] array>;\\n};\\n[[binding 0, set 0]] var gWebGPUBuffer0 : GWebGPUBuffer0;\\ntype GWebGPUBuffer1 = [[block]] struct {\\n [[offset 0]] u_NodeAttributes : [[stride 16]] array>;\\n};\\n[[binding 1, set 0]] var gWebGPUBuffer1 : GWebGPUBuffer1;\\ntype GWebGPUBuffer2 = [[block]] struct {\\n [[offset 0]] u_ClusterCenters : [[stride 16]] array>;\\n};\\n[[binding 2, set 0]] var gWebGPUBuffer2 : GWebGPUBuffer2;\\n\\n\\n\\n\\n\\n\\n\\n\\n\\nfn main() -> void {var i : i32 = globalInvocationID.x;\\nvar center : vec4 = gWebGPUBuffer2.u_ClusterCenters[i];\\nvar sumx : f32 = 0.0;\\nvar sumy : f32 = 0.0;\\nvar count : f32 = 0.0;\\nfor (var j : i32 = 0; j < __DefineValuePlaceholder__VERTEX_COUNT; j = j + 1) {var attributes : vec4 = gWebGPUBuffer1.u_NodeAttributes[j];\\nvar clusterIdx : i32 = i32(attributes.x);\\nvar vertex : vec4 = gWebGPUBuffer0.u_Data[j];\\nif (clusterIdx == i) {sumx = sumx + vertex.x;\\nsumy = sumy + vertex.y;\\ncount = count + 1.0;}}\\ngWebGPUBuffer2.u_ClusterCenters[i] = vec4(sumx / count, sumy / count, count, i);\\nreturn;}\\n\\nentry_point compute as \\"main\\" = main;\\n","GLSL450":"\\n\\n\\nbool gWebGPUDebug = false;\\nvec4 gWebGPUDebugOutput = vec4(0.0);\\n\\nivec3 globalInvocationID = ivec3(gl_GlobalInvocationID);\\nivec3 workGroupSize = ivec3(1,1,1);\\nivec3 workGroupID = ivec3(gl_WorkGroupID);\\nivec3 localInvocationID = ivec3(gl_LocalInvocationID);\\nivec3 numWorkGroups = ivec3(gl_NumWorkGroups);\\nint localInvocationIndex = int(gl_LocalInvocationIndex);\\n\\n\\nlayout(std430, set = 0, binding = 0) buffer readonly GWebGPUBuffer0 {\\n vec4 u_Data[];\\n} gWebGPUBuffer0;\\n\\nlayout(std430, set = 0, binding = 1) buffer readonly GWebGPUBuffer1 {\\n vec4 u_NodeAttributes[];\\n} gWebGPUBuffer1;\\n\\nlayout(std430, set = 0, binding = 2) buffer GWebGPUBuffer2 {\\n vec4 u_ClusterCenters[];\\n} gWebGPUBuffer2;\\n\\n\\n\\n#define VERTEX_COUNT __DefineValuePlaceholder__VERTEX_COUNT\\n#define CLUSTER_COUNT __DefineValuePlaceholder__CLUSTER_COUNT\\nlayout (\\n local_size_x = 1,\\n local_size_y = 1,\\n local_size_z = 1\\n) in;\\n\\n\\n\\nvoid main() {int i = globalInvocationID.x;\\nvec4 center = gWebGPUBuffer2.u_ClusterCenters[i];\\nfloat sumx = 0.0;\\nfloat sumy = 0.0;\\nfloat count = 0.0;\\nfor (int j = 0; j < VERTEX_COUNT; j++) {vec4 attributes = gWebGPUBuffer1.u_NodeAttributes[j];\\nint clusterIdx = int(attributes.x);\\nvec4 vertex = gWebGPUBuffer0.u_Data[j];\\nif (clusterIdx == i) {sumx += vertex.x;\\nsumy += vertex.y;\\ncount += 1.0;}}\\ngWebGPUBuffer2.u_ClusterCenters[i] = vec4(sumx / count, sumy / count, count, i);}\\n","GLSL100":"\\n\\nfloat epsilon = 0.00001;\\nvec2 addrTranslation_1Dto2D(float address1D, vec2 texSize) {\\n vec2 conv_const = vec2(1.0 / texSize.x, 1.0 / (texSize.x * texSize.y));\\n vec2 normAddr2D = float(address1D) * conv_const;\\n return vec2(fract(normAddr2D.x + epsilon), normAddr2D.y);\\n}\\n\\nvoid barrier() {}\\n \\n\\nuniform vec2 u_OutputTextureSize;\\nuniform int u_OutputTexelCount;\\nvarying vec2 v_TexCoord;\\n\\nbool gWebGPUDebug = false;\\nvec4 gWebGPUDebugOutput = vec4(0.0);\\n\\n#define VERTEX_COUNT __DefineValuePlaceholder__VERTEX_COUNT\\n#define CLUSTER_COUNT __DefineValuePlaceholder__CLUSTER_COUNT\\n\\nuniform sampler2D u_Data;\\nuniform vec2 u_DataSize;\\nvec4 getDatau_Data(vec2 address2D) {\\n return vec4(texture2D(u_Data, address2D).rgba);\\n}\\nvec4 getDatau_Data(float address1D) {\\n return getDatau_Data(addrTranslation_1Dto2D(address1D, u_DataSize));\\n}\\nvec4 getDatau_Data(int address1D) {\\n return getDatau_Data(float(address1D));\\n}\\nuniform sampler2D u_NodeAttributes;\\nuniform vec2 u_NodeAttributesSize;\\nvec4 getDatau_NodeAttributes(vec2 address2D) {\\n return vec4(texture2D(u_NodeAttributes, address2D).rgba);\\n}\\nvec4 getDatau_NodeAttributes(float address1D) {\\n return getDatau_NodeAttributes(addrTranslation_1Dto2D(address1D, u_NodeAttributesSize));\\n}\\nvec4 getDatau_NodeAttributes(int address1D) {\\n return getDatau_NodeAttributes(float(address1D));\\n}\\nuniform sampler2D u_ClusterCenters;\\nuniform vec2 u_ClusterCentersSize;\\nvec4 getDatau_ClusterCenters(vec2 address2D) {\\n return vec4(texture2D(u_ClusterCenters, address2D).rgba);\\n}\\nvec4 getDatau_ClusterCenters(float address1D) {\\n return getDatau_ClusterCenters(addrTranslation_1Dto2D(address1D, u_ClusterCentersSize));\\n}\\nvec4 getDatau_ClusterCenters(int address1D) {\\n return getDatau_ClusterCenters(float(address1D));\\n}\\nvoid main() {\\nivec3 workGroupSize = ivec3(1, 1, 1);\\nivec3 numWorkGroups = ivec3(1, 1, 1); \\nint globalInvocationIndex = int(floor(v_TexCoord.x * u_OutputTextureSize.x))\\n + int(floor(v_TexCoord.y * u_OutputTextureSize.y)) * int(u_OutputTextureSize.x);\\nint workGroupIDLength = globalInvocationIndex / (workGroupSize.x * workGroupSize.y * workGroupSize.z);\\nivec3 workGroupID = ivec3(workGroupIDLength / numWorkGroups.y / numWorkGroups.z, workGroupIDLength / numWorkGroups.x / numWorkGroups.z, workGroupIDLength / numWorkGroups.x / numWorkGroups.y);\\nint localInvocationIDZ = globalInvocationIndex / (workGroupSize.x * workGroupSize.y);\\nint localInvocationIDY = (globalInvocationIndex - localInvocationIDZ * workGroupSize.x * workGroupSize.y) / workGroupSize.x;\\nint localInvocationIDX = globalInvocationIndex - localInvocationIDZ * workGroupSize.x * workGroupSize.y - localInvocationIDY * workGroupSize.x;\\nivec3 localInvocationID = ivec3(localInvocationIDX, localInvocationIDY, localInvocationIDZ);\\nivec3 globalInvocationID = workGroupID * workGroupSize + localInvocationID;\\nint localInvocationIndex = localInvocationID.z * workGroupSize.x * workGroupSize.y\\n + localInvocationID.y * workGroupSize.x + localInvocationID.x;\\nint i = globalInvocationID.x;\\nvec4 center = getDatau_ClusterCenters(i);\\nfloat sumx = 0.0;\\nfloat sumy = 0.0;\\nfloat count = 0.0;\\nfor (int j = 0; j < VERTEX_COUNT; j++) {vec4 attributes = getDatau_NodeAttributes(j);\\nint clusterIdx = int(attributes.x);\\nvec4 vertex = getDatau_Data(j);\\nif (clusterIdx == i) {sumx += vertex.x;\\nsumy += vertex.y;\\ncount += 1.0;}}\\ngl_FragColor = vec4(vec4(sumx / count, sumy / count, count, i));if (gWebGPUDebug) {\\n gl_FragColor = gWebGPUDebugOutput;\\n}}\\n"},"context":{"name":"","dispatch":[1,1,1],"threadGroupSize":[1,1,1],"maxIteration":1,"defines":[{"name":"VERTEX_COUNT","type":"Float","runtime":true},{"name":"CLUSTER_COUNT","type":"Float","runtime":true}],"uniforms":[{"name":"u_Data","type":"vec4[]","storageClass":"StorageBuffer","readonly":true,"writeonly":false,"size":[1,1]},{"name":"u_NodeAttributes","type":"vec4[]","storageClass":"StorageBuffer","readonly":true,"writeonly":false,"size":[1,1]},{"name":"u_ClusterCenters","type":"vec4[]","storageClass":"StorageBuffer","readonly":false,"writeonly":false,"size":[1,1]}],"globalDeclarations":[],"output":{"name":"u_ClusterCenters","size":[1,1],"length":1},"needPingpong":true}}`; + +// @ts-nocheck +/** + * @fileOverview fruchterman layout + * @author shiwu.wyy@antfin.com + */ +var __awaiter$2 = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) { + function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); } + return new (P || (P = Promise))(function (resolve, reject) { + function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } } + function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } } + function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); } + step((generator = generator.apply(thisArg, _arguments || [])).next()); + }); +}; +/** + * fruchterman 布局 + */ +class FruchtermanGPULayout extends Base { + constructor(options) { + super(); + /** 停止迭代的最大迭代数 */ + this.maxIteration = 1000; + /** 重力大小，影响图的紧凑程度 */ + this.gravity = 10; + /** 速度 */ + this.speed = 1; + /** 是否产生聚类力 */ + this.clustering = false; + /** 根据哪个字段聚类 */ + this.clusterField = "cluster"; + /** 聚类力大小 */ + this.clusterGravity = 10; + /** 是否启用web worker。前提是在web worker里执行布局，否则无效 */ + this.workerEnabled = false; + this.nodes = []; + this.edges = []; + this.width = 300; + this.height = 300; + this.nodeMap = {}; + this.nodeIdxMap = {}; + this.updateCfg(options); + } + getDefaultCfg() { + return { + maxIteration: 1000, + gravity: 10, + speed: 1, + clustering: false, + clusterGravity: 10 + }; + } + /** + * 执行布局 + */ + execute() { + return __awaiter$2(this, void 0, void 0, function* () { + const self = this; + const nodes = self.nodes; + if (!nodes || nodes.length === 0) { + if (self.onLayoutEnd) + self.onLayoutEnd(); + return; + } + if (!self.width && typeof window !== "undefined") { + self.width = window.innerWidth; + } + if (!self.height && typeof window !== "undefined") { + self.height = window.innerHeight; + } + if (!self.center) { + self.center = [self.width / 2, self.height / 2]; + } + const center = self.center; + if (nodes.length === 1) { + nodes[0].x = center[0]; + nodes[0].y = center[1]; + if (self.onLayoutEnd) + self.onLayoutEnd(); + return; + } + const nodeMap = {}; + const nodeIdxMap = {}; + nodes.forEach((node, i) => { + if (!isNumber$2(node.x)) + node.x = Math.random() * this.width; + if (!isNumber$2(node.y)) + node.y = Math.random() * this.height; + nodeMap[node.id] = node; + nodeIdxMap[node.id] = i; + }); + self.nodeMap = nodeMap; + self.nodeIdxMap = nodeIdxMap; + // layout + yield self.run(); + }); + } + executeWithWorker(canvas, ctx) { + return __awaiter$2(this, void 0, void 0, function* () { + const self = this; + const nodes = self.nodes; + const center = self.center; + if (!nodes || nodes.length === 0) { + return; + } + if (nodes.length === 1) { + nodes[0].x = center[0]; + nodes[0].y = center[1]; + return; + } + const nodeMap = {}; + const nodeIdxMap = {}; + nodes.forEach((node, i) => { + if (!isNumber$2(node.x)) + node.x = Math.random() * this.width; + if (!isNumber$2(node.y)) + node.y = Math.random() * this.height; + nodeMap[node.id] = node; + nodeIdxMap[node.id] = i; + }); + self.nodeMap = nodeMap; + self.nodeIdxMap = nodeIdxMap; + // layout + yield self.run(canvas, ctx); + }); + } + run(canvas, ctx) { + return __awaiter$2(this, void 0, void 0, function* () { + const self = this; + const nodes = self.nodes; + const edges = self.edges; + const maxIteration = self.maxIteration; + const center = self.center; + const area = self.height * self.width; + let maxDisplace = Math.sqrt(area) / 10; + const k2 = area / (nodes.length + 1); + const k = Math.sqrt(k2); + const speed = self.speed; + const clustering = self.clustering; + const { array: attributeArray, count: clusterCount } = attributesToTextureData$1([self.clusterField], nodes); + // pushing the fx and fy + nodes.forEach((node, i) => { + let fx = 0; + let fy = 0; + if (isNumber$2(node.fx) && isNumber$2(node.fy)) { + fx = node.fx || 0.001; + fy = node.fy || 0.001; + } + attributeArray[4 * i + 1] = fx; + attributeArray[4 * i + 2] = fy; + }); + const numParticles = nodes.length; + const { maxEdgePerVetex, array: nodesEdgesArray } = buildTextureData$1(nodes, edges); + const workerEnabled = self.workerEnabled; + let world; + if (workerEnabled) { + world = World.create({ + canvas, + engineOptions: { + supportCompute: true + } + }); + } + else { + world = World.create({ + engineOptions: { + supportCompute: true + } + }); + } + // compile at runtime in dev mode + // const compiler = new Compiler() + // const fruchtermanBundle = compiler.compileBundle(fruchtermanCode) + // const clusterBundle = compiler.compileBundle(clusterCode) + // use compiled bundle in prod mode + // console.log(fruchtermanBundle.toString()) + // console.log(clusterBundle.toString()) + const onLayoutEnd = self.onLayoutEnd; + const clusterCenters = []; + for (let i = 0; i < clusterCount; i++) { + clusterCenters.push(0, 0, 0, 0); + } + const kernelFruchterman = world + .createKernel(fruchtermanBundle) + .setDispatch([numParticles, 1, 1]) + .setBinding({ + u_Data: nodesEdgesArray, + u_K: k, + u_K2: k2, + u_Gravity: self.gravity, + u_ClusterGravity: self.clusterGravity || self.gravity || 1, + u_Speed: speed, + u_MaxDisplace: maxDisplace, + u_Clustering: clustering ? 1 : 0, + u_Center: center, + u_AttributeArray: attributeArray, + u_ClusterCenters: clusterCenters, + MAX_EDGE_PER_VERTEX: maxEdgePerVetex, + VERTEX_COUNT: numParticles + }); + let kernelCluster; + if (clustering) { + kernelCluster = world + .createKernel(clusterBundle) + .setDispatch([clusterCount, 1, 1]) + .setBinding({ + u_Data: nodesEdgesArray, + u_NodeAttributes: attributeArray, + u_ClusterCenters: clusterCenters, + VERTEX_COUNT: numParticles, + CLUSTER_COUNT: clusterCount + }); + } + const execute = () => __awaiter$2(this, void 0, void 0, function* () { + for (let i = 0; i < maxIteration; i++) { + // eslint-disable-next-line no-await-in-loop + yield kernelFruchterman.execute(); + if (clustering) { + kernelCluster.setBinding({ + u_Data: kernelFruchterman + }); + // eslint-disable-next-line no-await-in-loop + yield kernelCluster.execute(); + kernelFruchterman.setBinding({ + u_ClusterCenters: kernelCluster + }); + } + kernelFruchterman.setBinding({ + u_MaxDisplace: maxDisplace *= 0.99 + }); + } + const finalParticleData = yield kernelFruchterman.getOutput(); + if (canvas) { + // 传递数据给主线程 + ctx.postMessage({ + type: LAYOUT_MESSAGE$1.GPUEND, + vertexEdgeData: finalParticleData + // edgeIndexBufferData, + }); + } + else { + nodes.forEach((node, i) => { + const x = finalParticleData[4 * i]; + const y = finalParticleData[4 * i + 1]; + node.x = x; + node.y = y; + }); + } + if (onLayoutEnd) + onLayoutEnd(); + }); + yield execute(); + }); + } + getType() { + return "fruchterman-gpu"; + } +} + +const gForceBundle = `{"shaders":{"WGSL":"import \\"GLSL.std.450\\" as std;\\n\\n\\n# var gWebGPUDebug : bool = false;\\n# var gWebGPUDebugOutput : vec4 = vec4(0.0);\\n\\n[[builtin global_invocation_id]] var globalInvocationID : vec3;\\n# [[builtin work_group_size]] var workGroupSize : vec3;\\n# [[builtin work_group_id]] var workGroupID : vec3;\\n[[builtin local_invocation_id]] var localInvocationID : vec3;\\n# [[builtin num_work_groups]] var numWorkGroups : vec3;\\n[[builtin local_invocation_idx]] var localInvocationIndex : u32;\\n\\ntype GWebGPUParams = [[block]] struct {\\n [[offset 0]] u_damping : f32;\\n [[offset 4]] u_maxSpeed : f32;\\n [[offset 8]] u_minMovement : f32;\\n \\n [[offset 12]] u_coulombDisScale : f32;\\n [[offset 16]] u_factor : f32;\\n \\n \\n [[offset 20]] u_interval : f32;\\n};\\n[[binding 0, set 0]] var gWebGPUUniformParams : GWebGPUParams;\\ntype GWebGPUBuffer0 = [[block]] struct {\\n [[offset 0]] u_Data : [[stride 16]] array>;\\n};\\n[[binding 1, set 0]] var gWebGPUBuffer0 : GWebGPUBuffer0;\\ntype GWebGPUBuffer1 = [[block]] struct {\\n [[offset 0]] u_AveMovement : [[stride 16]] array>;\\n};\\n[[binding 2, set 0]] var gWebGPUBuffer1 : GWebGPUBuffer1;\\ntype GWebGPUBuffer2 = [[block]] struct {\\n [[offset 0]] u_NodeAttributeArray1 : [[stride 16]] array>;\\n};\\n[[binding 3, set 0]] var gWebGPUBuffer2 : GWebGPUBuffer2;\\ntype GWebGPUBuffer3 = [[block]] struct {\\n [[offset 0]] u_NodeAttributeArray2 : [[stride 16]] array>;\\n};\\n[[binding 4, set 0]] var gWebGPUBuffer3 : GWebGPUBuffer3;\\n\\n\\n\\n\\n\\n\\n\\n\\n\\n\\n\\n\\n\\n\\n\\n\\n\\nfn unpack_float(packedValue : f32) -> vec2 {var packedIntValue : i32 = i32(packedValue);\\nvar v0 : i32 = packedIntValue / 1048576;\\nreturn vec2(v0, packedIntValue - (v0 * 1048576));}\\nfn calcRepulsive(i : i32, currentNode : vec4) -> vec2 {var ax : f32 = 0.0;\\nvar ay : f32 = 0.0;\\nfor (var j : i32 = 0; j < __DefineValuePlaceholder__VERTEX_COUNT; j = j + 1) {if (i != j) {var nextNode : vec4 = gWebGPUBuffer0.u_Data[j];\\nvar vx : f32 = currentNode.x - nextNode.x;\\nvar vy : f32 = currentNode.y - nextNode.y;\\nvar dist : f32 = std::sqrt((vx * vx) + (vy * vy)) + 0.01;\\nvar n_dist : f32 = (dist + 0.1) * gWebGPUUniformParams.u_coulombDisScale;\\nvar direx : f32 = vx / dist;\\nvar direy : f32 = vy / dist;\\nvar attributesi : vec4 = gWebGPUBuffer2.u_NodeAttributeArray1[i];\\nvar attributesj : vec4 = gWebGPUBuffer2.u_NodeAttributeArray1[j];\\nvar massi : f32 = attributesi.x;\\nvar nodeStrengthi : f32 = attributesi.z;\\nvar nodeStrengthj : f32 = attributesj.z;\\nvar nodeStrength : f32 = (nodeStrengthi + nodeStrengthj) / 2.0;\\nvar param : f32 = (nodeStrength * gWebGPUUniformParams.u_factor) / (n_dist * n_dist);\\nax = ax + direx * param;\\nay = ay + direy * param;}}\\nreturn vec2(ax, ay);}\\nfn calcGravity(i : i32, currentNode : vec4, attributes2 : vec4) -> vec2 {var vx : f32 = currentNode.x - attributes2.x;\\nvar vy : f32 = currentNode.y - attributes2.y;\\nvar ax : f32 = vx * attributes2.z;\\nvar ay : f32 = vy * attributes2.z;\\nreturn vec2(ax, ay);}\\nfn calcAttractive(i : i32, currentNode : vec4, attributes1 : vec4) -> vec2 {var mass : f32 = attributes1.x;\\nvar ax : f32 = 0.0;\\nvar ay : f32 = 0.0;\\nvar compressed : vec2 = unpack_float(currentNode.z);\\nvar length : i32 = compressed.x;\\nvar arr_offset : i32 = compressed.y;\\nvar node_buffer : vec4;\\nfor (var p : i32 = 0; p < __DefineValuePlaceholder__MAX_EDGE_PER_VERTEX; p = p + 1) {if (p >= length) {break;}\\nvar arr_idx : i32 = arr_offset + (4 * p);\\nvar buf_offset : i32 = arr_idx - ((arr_idx / 4) * 4);\\nif ((p == 0) || (buf_offset == 0)) {node_buffer = gWebGPUBuffer0.u_Data[i32(arr_idx / 4)];}\\nvar float_j : f32 = node_buffer.x;\\nvar nextNode : vec4 = gWebGPUBuffer0.u_Data[i32(float_j)];\\nvar vx : f32 = nextNode.x - currentNode.x;\\nvar vy : f32 = nextNode.y - currentNode.y;\\nvar dist : f32 = std::sqrt((vx * vx) + (vy * vy)) + 0.01;\\nvar direx : f32 = vx / dist;\\nvar direy : f32 = vy / dist;\\nvar edgeLength : f32 = node_buffer.y;\\nvar edgeStrength : f32 = node_buffer.z;\\nvar diff : f32 = edgeLength - dist;\\nvar param : f32 = (diff * edgeStrength) / mass;\\nax = ax - direx * param;\\nay = ay - direy * param;}\\nreturn vec2(ax, ay);}\\nfn main() -> void {var i : i32 = globalInvocationID.x;\\nvar currentNode : vec4 = gWebGPUBuffer0.u_Data[i];\\nvar movement : vec4 = gWebGPUBuffer1.u_AveMovement[0];\\nvar ax : f32 = 0.0;\\nvar ay : f32 = 0.0;\\nif ((i >= __DefineValuePlaceholder__VERTEX_COUNT) || (movement.x < gWebGPUUniformParams.u_minMovement)) {gWebGPUBuffer0.u_Data[i] = currentNode;\\nreturn ;}\\nvar nodeAttributes1 : vec4 = gWebGPUBuffer2.u_NodeAttributeArray1[i];\\nvar nodeAttributes2 : vec4 = gWebGPUBuffer3.u_NodeAttributeArray2[i];\\nvar repulsive : vec2 = calcRepulsive(i, currentNode);\\nax = ax + repulsive.x;\\nay = ay + repulsive.y;\\nvar attractive : vec2 = calcAttractive(i, currentNode, nodeAttributes1);\\nax = ax + attractive.x;\\nay = ay + attractive.y;\\nvar gravity : vec2 = calcGravity(i, currentNode, nodeAttributes2);\\nax = ax - gravity.x;\\nay = ay - gravity.y;\\nvar param : f32 = gWebGPUUniformParams.u_interval * gWebGPUUniformParams.u_damping;\\nvar vx : f32 = ax * param;\\nvar vy : f32 = ay * param;\\nvar vlength : f32 = std::sqrt((vx * vx) + (vy * vy)) + 0.0001;\\nif (vlength > gWebGPUUniformParams.u_maxSpeed) {var param2 : f32 = gWebGPUUniformParams.u_maxSpeed / vlength;\\nvx = param2 * vx;\\nvy = param2 * vy;}\\nvar distx : f32 = vx * gWebGPUUniformParams.u_interval;\\nvar disty : f32 = vy * gWebGPUUniformParams.u_interval;\\nvar distLength : f32 = std::sqrt((distx * distx) + (disty * disty));\\nif ((nodeAttributes1.w != 0.0) && (nodeAttributes2.w != 0.0)) {gWebGPUBuffer0.u_Data[i] = vec4(nodeAttributes1.w, nodeAttributes2.w, currentNode.z, 0.0);}else {gWebGPUBuffer0.u_Data[i] = vec4(currentNode.x + distx, currentNode.y + disty, currentNode.z, distLength);}\\nreturn;}\\n\\nentry_point compute as \\"main\\" = main;\\n","GLSL450":"\\n\\n\\nbool gWebGPUDebug = false;\\nvec4 gWebGPUDebugOutput = vec4(0.0);\\n\\nivec3 globalInvocationID = ivec3(gl_GlobalInvocationID);\\nivec3 workGroupSize = ivec3(1,1,1);\\nivec3 workGroupID = ivec3(gl_WorkGroupID);\\nivec3 localInvocationID = ivec3(gl_LocalInvocationID);\\nivec3 numWorkGroups = ivec3(gl_NumWorkGroups);\\nint localInvocationIndex = int(gl_LocalInvocationIndex);\\n\\nlayout(std140, set = 0, binding = 0) uniform GWebGPUParams {\\n float u_damping;\\n float u_maxSpeed;\\n float u_minMovement;\\n \\n float u_coulombDisScale;\\n float u_factor;\\n \\n \\n float u_interval;\\n} gWebGPUUniformParams;\\nlayout(std430, set = 0, binding = 1) buffer GWebGPUBuffer0 {\\n vec4 u_Data[];\\n} gWebGPUBuffer0;\\n\\nlayout(std430, set = 0, binding = 2) buffer readonly GWebGPUBuffer1 {\\n vec4 u_AveMovement[];\\n} gWebGPUBuffer1;\\n\\nlayout(std430, set = 0, binding = 3) buffer readonly GWebGPUBuffer2 {\\n vec4 u_NodeAttributeArray1[];\\n} gWebGPUBuffer2;\\n\\nlayout(std430, set = 0, binding = 4) buffer readonly GWebGPUBuffer3 {\\n vec4 u_NodeAttributeArray2[];\\n} gWebGPUBuffer3;\\n\\n\\n\\n#define MAX_EDGE_PER_VERTEX __DefineValuePlaceholder__MAX_EDGE_PER_VERTEX\\n#define VERTEX_COUNT __DefineValuePlaceholder__VERTEX_COUNT\\n#define SHIFT_20 1048576.0\\nlayout (\\n local_size_x = 1,\\n local_size_y = 1,\\n local_size_z = 1\\n) in;\\n\\n\\n\\n\\n\\n\\n\\n\\n\\n\\nivec2 unpack_float(float packedValue) {int packedIntValue = int(packedValue);\\nint v0 = packedIntValue / int(SHIFT_20);\\nreturn ivec2(v0, packedIntValue - (v0 * int(SHIFT_20)));}\\nvec2 calcRepulsive(int i, vec4 currentNode) {float ax = 0.0;\\nfloat ay = 0.0;\\nfor (int j = 0; j < VERTEX_COUNT; j++) {if (i != j) {vec4 nextNode = gWebGPUBuffer0.u_Data[j];\\nfloat vx = currentNode.x - nextNode.x;\\nfloat vy = currentNode.y - nextNode.y;\\nfloat dist = sqrt((vx * vx) + (vy * vy)) + 0.01;\\nfloat n_dist = (dist + 0.1) * gWebGPUUniformParams.u_coulombDisScale;\\nfloat direx = vx / dist;\\nfloat direy = vy / dist;\\nvec4 attributesi = gWebGPUBuffer2.u_NodeAttributeArray1[i];\\nvec4 attributesj = gWebGPUBuffer2.u_NodeAttributeArray1[j];\\nfloat massi = attributesi.x;\\nfloat nodeStrengthi = attributesi.z;\\nfloat nodeStrengthj = attributesj.z;\\nfloat nodeStrength = (nodeStrengthi + nodeStrengthj) / 2.0;\\nfloat param = (nodeStrength * gWebGPUUniformParams.u_factor) / (n_dist * n_dist);\\nax += direx * param;\\nay += direy * param;}}\\nreturn vec2(ax, ay);}\\nvec2 calcGravity(int i, vec4 currentNode, vec4 attributes2) {float vx = currentNode.x - attributes2.x;\\nfloat vy = currentNode.y - attributes2.y;\\nfloat ax = vx * attributes2.z;\\nfloat ay = vy * attributes2.z;\\nreturn vec2(ax, ay);}\\nvec2 calcAttractive(int i, vec4 currentNode, vec4 attributes1) {float mass = attributes1.x;\\nfloat ax = 0.0;\\nfloat ay = 0.0;\\nivec2 compressed = unpack_float(currentNode.z);\\nint length = compressed.x;\\nint arr_offset = compressed.y;\\nvec4 node_buffer;\\nfor (int p = 0; p < MAX_EDGE_PER_VERTEX; p++) {if (p >= length) {break;}\\nint arr_idx = arr_offset + (4 * p);\\nint buf_offset = arr_idx - ((arr_idx / 4) * 4);\\nif ((p == 0) || (buf_offset == 0)) {node_buffer = gWebGPUBuffer0.u_Data[int(arr_idx / 4)];}\\nfloat float_j = node_buffer.x;\\nvec4 nextNode = gWebGPUBuffer0.u_Data[int(float_j)];\\nfloat vx = nextNode.x - currentNode.x;\\nfloat vy = nextNode.y - currentNode.y;\\nfloat dist = sqrt((vx * vx) + (vy * vy)) + 0.01;\\nfloat direx = vx / dist;\\nfloat direy = vy / dist;\\nfloat edgeLength = node_buffer.y;\\nfloat edgeStrength = node_buffer.z;\\nfloat diff = edgeLength - dist;\\nfloat param = (diff * edgeStrength) / mass;\\nax -= direx * param;\\nay -= direy * param;}\\nreturn vec2(ax, ay);}\\nvoid main() {int i = globalInvocationID.x;\\nvec4 currentNode = gWebGPUBuffer0.u_Data[i];\\nvec4 movement = gWebGPUBuffer1.u_AveMovement[0];\\nfloat ax = 0.0;\\nfloat ay = 0.0;\\nif ((i >= VERTEX_COUNT) || (movement.x < gWebGPUUniformParams.u_minMovement)) {gWebGPUBuffer0.u_Data[i] = currentNode;\\nreturn ;}\\nvec4 nodeAttributes1 = gWebGPUBuffer2.u_NodeAttributeArray1[i];\\nvec4 nodeAttributes2 = gWebGPUBuffer3.u_NodeAttributeArray2[i];\\nvec2 repulsive = calcRepulsive(i, currentNode);\\nax += repulsive.x;\\nay += repulsive.y;\\nvec2 attractive = calcAttractive(i, currentNode, nodeAttributes1);\\nax += attractive.x;\\nay += attractive.y;\\nvec2 gravity = calcGravity(i, currentNode, nodeAttributes2);\\nax -= gravity.x;\\nay -= gravity.y;\\nfloat param = gWebGPUUniformParams.u_interval * gWebGPUUniformParams.u_damping;\\nfloat vx = ax * param;\\nfloat vy = ay * param;\\nfloat vlength = sqrt((vx * vx) + (vy * vy)) + 0.0001;\\nif (vlength > gWebGPUUniformParams.u_maxSpeed) {float param2 = gWebGPUUniformParams.u_maxSpeed / vlength;\\nvx = param2 * vx;\\nvy = param2 * vy;}\\nfloat distx = vx * gWebGPUUniformParams.u_interval;\\nfloat disty = vy * gWebGPUUniformParams.u_interval;\\nfloat distLength = sqrt((distx * distx) + (disty * disty));\\nif ((nodeAttributes1.w != 0.0) && (nodeAttributes2.w != 0.0)) {gWebGPUBuffer0.u_Data[i] = vec4(nodeAttributes1.w, nodeAttributes2.w, currentNode.z, 0.0);}else {gWebGPUBuffer0.u_Data[i] = vec4(currentNode.x + distx, currentNode.y + disty, currentNode.z, distLength);}}\\n","GLSL100":"\\n\\nfloat epsilon = 0.00001;\\nvec2 addrTranslation_1Dto2D(float address1D, vec2 texSize) {\\n vec2 conv_const = vec2(1.0 / texSize.x, 1.0 / (texSize.x * texSize.y));\\n vec2 normAddr2D = float(address1D) * conv_const;\\n return vec2(fract(normAddr2D.x + epsilon), normAddr2D.y);\\n}\\n\\nvoid barrier() {}\\n \\n\\nuniform vec2 u_OutputTextureSize;\\nuniform int u_OutputTexelCount;\\nvarying vec2 v_TexCoord;\\n\\nbool gWebGPUDebug = false;\\nvec4 gWebGPUDebugOutput = vec4(0.0);\\n\\n#define MAX_EDGE_PER_VERTEX __DefineValuePlaceholder__MAX_EDGE_PER_VERTEX\\n#define VERTEX_COUNT __DefineValuePlaceholder__VERTEX_COUNT\\n#define SHIFT_20 1048576.0\\n\\nuniform sampler2D u_Data;\\nuniform vec2 u_DataSize;\\nvec4 getDatau_Data(vec2 address2D) {\\n return vec4(texture2D(u_Data, address2D).rgba);\\n}\\nvec4 getDatau_Data(float address1D) {\\n return getDatau_Data(addrTranslation_1Dto2D(address1D, u_DataSize));\\n}\\nvec4 getDatau_Data(int address1D) {\\n return getDatau_Data(float(address1D));\\n}\\nuniform float u_damping;\\nuniform float u_maxSpeed;\\nuniform float u_minMovement;\\nuniform sampler2D u_AveMovement;\\nuniform vec2 u_AveMovementSize;\\nvec4 getDatau_AveMovement(vec2 address2D) {\\n return vec4(texture2D(u_AveMovement, address2D).rgba);\\n}\\nvec4 getDatau_AveMovement(float address1D) {\\n return getDatau_AveMovement(addrTranslation_1Dto2D(address1D, u_AveMovementSize));\\n}\\nvec4 getDatau_AveMovement(int address1D) {\\n return getDatau_AveMovement(float(address1D));\\n}\\nuniform float u_coulombDisScale;\\nuniform float u_factor;\\nuniform sampler2D u_NodeAttributeArray1;\\nuniform vec2 u_NodeAttributeArray1Size;\\nvec4 getDatau_NodeAttributeArray1(vec2 address2D) {\\n return vec4(texture2D(u_NodeAttributeArray1, address2D).rgba);\\n}\\nvec4 getDatau_NodeAttributeArray1(float address1D) {\\n return getDatau_NodeAttributeArray1(addrTranslation_1Dto2D(address1D, u_NodeAttributeArray1Size));\\n}\\nvec4 getDatau_NodeAttributeArray1(int address1D) {\\n return getDatau_NodeAttributeArray1(float(address1D));\\n}\\nuniform sampler2D u_NodeAttributeArray2;\\nuniform vec2 u_NodeAttributeArray2Size;\\nvec4 getDatau_NodeAttributeArray2(vec2 address2D) {\\n return vec4(texture2D(u_NodeAttributeArray2, address2D).rgba);\\n}\\nvec4 getDatau_NodeAttributeArray2(float address1D) {\\n return getDatau_NodeAttributeArray2(addrTranslation_1Dto2D(address1D, u_NodeAttributeArray2Size));\\n}\\nvec4 getDatau_NodeAttributeArray2(int address1D) {\\n return getDatau_NodeAttributeArray2(float(address1D));\\n}\\nuniform float u_interval;\\nivec2 unpack_float(float packedValue) {\\nivec3 workGroupSize = ivec3(1, 1, 1);\\nivec3 numWorkGroups = ivec3(1, 1, 1); \\nint globalInvocationIndex = int(floor(v_TexCoord.x * u_OutputTextureSize.x))\\n + int(floor(v_TexCoord.y * u_OutputTextureSize.y)) * int(u_OutputTextureSize.x);\\nint workGroupIDLength = globalInvocationIndex / (workGroupSize.x * workGroupSize.y * workGroupSize.z);\\nivec3 workGroupID = ivec3(workGroupIDLength / numWorkGroups.y / numWorkGroups.z, workGroupIDLength / numWorkGroups.x / numWorkGroups.z, workGroupIDLength / numWorkGroups.x / numWorkGroups.y);\\nint localInvocationIDZ = globalInvocationIndex / (workGroupSize.x * workGroupSize.y);\\nint localInvocationIDY = (globalInvocationIndex - localInvocationIDZ * workGroupSize.x * workGroupSize.y) / workGroupSize.x;\\nint localInvocationIDX = globalInvocationIndex - localInvocationIDZ * workGroupSize.x * workGroupSize.y - localInvocationIDY * workGroupSize.x;\\nivec3 localInvocationID = ivec3(localInvocationIDX, localInvocationIDY, localInvocationIDZ);\\nivec3 globalInvocationID = workGroupID * workGroupSize + localInvocationID;\\nint localInvocationIndex = localInvocationID.z * workGroupSize.x * workGroupSize.y\\n + localInvocationID.y * workGroupSize.x + localInvocationID.x;\\nint packedIntValue = int(packedValue);\\nint v0 = packedIntValue / int(SHIFT_20);\\nreturn ivec2(v0, packedIntValue - (v0 * int(SHIFT_20)));}\\nvec2 calcRepulsive(int i, vec4 currentNode) {\\nivec3 workGroupSize = ivec3(1, 1, 1);\\nivec3 numWorkGroups = ivec3(1, 1, 1); \\nint globalInvocationIndex = int(floor(v_TexCoord.x * u_OutputTextureSize.x))\\n + int(floor(v_TexCoord.y * u_OutputTextureSize.y)) * int(u_OutputTextureSize.x);\\nint workGroupIDLength = globalInvocationIndex / (workGroupSize.x * workGroupSize.y * workGroupSize.z);\\nivec3 workGroupID = ivec3(workGroupIDLength / numWorkGroups.y / numWorkGroups.z, workGroupIDLength / numWorkGroups.x / numWorkGroups.z, workGroupIDLength / numWorkGroups.x / numWorkGroups.y);\\nint localInvocationIDZ = globalInvocationIndex / (workGroupSize.x * workGroupSize.y);\\nint localInvocationIDY = (globalInvocationIndex - localInvocationIDZ * workGroupSize.x * workGroupSize.y) / workGroupSize.x;\\nint localInvocationIDX = globalInvocationIndex - localInvocationIDZ * workGroupSize.x * workGroupSize.y - localInvocationIDY * workGroupSize.x;\\nivec3 localInvocationID = ivec3(localInvocationIDX, localInvocationIDY, localInvocationIDZ);\\nivec3 globalInvocationID = workGroupID * workGroupSize + localInvocationID;\\nint localInvocationIndex = localInvocationID.z * workGroupSize.x * workGroupSize.y\\n + localInvocationID.y * workGroupSize.x + localInvocationID.x;\\nfloat ax = 0.0;\\nfloat ay = 0.0;\\nfor (int j = 0; j < VERTEX_COUNT; j++) {if (i != j) {vec4 nextNode = getDatau_Data(j);\\nfloat vx = currentNode.x - nextNode.x;\\nfloat vy = currentNode.y - nextNode.y;\\nfloat dist = sqrt((vx * vx) + (vy * vy)) + 0.01;\\nfloat n_dist = (dist + 0.1) * u_coulombDisScale;\\nfloat direx = vx / dist;\\nfloat direy = vy / dist;\\nvec4 attributesi = getDatau_NodeAttributeArray1(i);\\nvec4 attributesj = getDatau_NodeAttributeArray1(j);\\nfloat massi = attributesi.x;\\nfloat nodeStrengthi = attributesi.z;\\nfloat nodeStrengthj = attributesj.z;\\nfloat nodeStrength = (nodeStrengthi + nodeStrengthj) / 2.0;\\nfloat param = (nodeStrength * u_factor) / (n_dist * n_dist);\\nax += direx * param;\\nay += direy * param;}}\\nreturn vec2(ax, ay);}\\nvec2 calcGravity(int i, vec4 currentNode, vec4 attributes2) {\\nivec3 workGroupSize = ivec3(1, 1, 1);\\nivec3 numWorkGroups = ivec3(1, 1, 1); \\nint globalInvocationIndex = int(floor(v_TexCoord.x * u_OutputTextureSize.x))\\n + int(floor(v_TexCoord.y * u_OutputTextureSize.y)) * int(u_OutputTextureSize.x);\\nint workGroupIDLength = globalInvocationIndex / (workGroupSize.x * workGroupSize.y * workGroupSize.z);\\nivec3 workGroupID = ivec3(workGroupIDLength / numWorkGroups.y / numWorkGroups.z, workGroupIDLength / numWorkGroups.x / numWorkGroups.z, workGroupIDLength / numWorkGroups.x / numWorkGroups.y);\\nint localInvocationIDZ = globalInvocationIndex / (workGroupSize.x * workGroupSize.y);\\nint localInvocationIDY = (globalInvocationIndex - localInvocationIDZ * workGroupSize.x * workGroupSize.y) / workGroupSize.x;\\nint localInvocationIDX = globalInvocationIndex - localInvocationIDZ * workGroupSize.x * workGroupSize.y - localInvocationIDY * workGroupSize.x;\\nivec3 localInvocationID = ivec3(localInvocationIDX, localInvocationIDY, localInvocationIDZ);\\nivec3 globalInvocationID = workGroupID * workGroupSize + localInvocationID;\\nint localInvocationIndex = localInvocationID.z * workGroupSize.x * workGroupSize.y\\n + localInvocationID.y * workGroupSize.x + localInvocationID.x;\\nfloat vx = currentNode.x - attributes2.x;\\nfloat vy = currentNode.y - attributes2.y;\\nfloat ax = vx * attributes2.z;\\nfloat ay = vy * attributes2.z;\\nreturn vec2(ax, ay);}\\nvec2 calcAttractive(int i, vec4 currentNode, vec4 attributes1) {\\nivec3 workGroupSize = ivec3(1, 1, 1);\\nivec3 numWorkGroups = ivec3(1, 1, 1); \\nint globalInvocationIndex = int(floor(v_TexCoord.x * u_OutputTextureSize.x))\\n + int(floor(v_TexCoord.y * u_OutputTextureSize.y)) * int(u_OutputTextureSize.x);\\nint workGroupIDLength = globalInvocationIndex / (workGroupSize.x * workGroupSize.y * workGroupSize.z);\\nivec3 workGroupID = ivec3(workGroupIDLength / numWorkGroups.y / numWorkGroups.z, workGroupIDLength / numWorkGroups.x / numWorkGroups.z, workGroupIDLength / numWorkGroups.x / numWorkGroups.y);\\nint localInvocationIDZ = globalInvocationIndex / (workGroupSize.x * workGroupSize.y);\\nint localInvocationIDY = (globalInvocationIndex - localInvocationIDZ * workGroupSize.x * workGroupSize.y) / workGroupSize.x;\\nint localInvocationIDX = globalInvocationIndex - localInvocationIDZ * workGroupSize.x * workGroupSize.y - localInvocationIDY * workGroupSize.x;\\nivec3 localInvocationID = ivec3(localInvocationIDX, localInvocationIDY, localInvocationIDZ);\\nivec3 globalInvocationID = workGroupID * workGroupSize + localInvocationID;\\nint localInvocationIndex = localInvocationID.z * workGroupSize.x * workGroupSize.y\\n + localInvocationID.y * workGroupSize.x + localInvocationID.x;\\nfloat mass = attributes1.x;\\nfloat ax = 0.0;\\nfloat ay = 0.0;\\nivec2 compressed = unpack_float(currentNode.z);\\nint length = compressed.x;\\nint arr_offset = compressed.y;\\nvec4 node_buffer;\\nfor (int p = 0; p < MAX_EDGE_PER_VERTEX; p++) {if (p >= length) {break;}\\nint arr_idx = arr_offset + (4 * p);\\nint buf_offset = arr_idx - ((arr_idx / 4) * 4);\\nif ((p == 0) || (buf_offset == 0)) {node_buffer = getDatau_Data(int(arr_idx / 4));}\\nfloat float_j = node_buffer.x;\\nvec4 nextNode = getDatau_Data(int(float_j));\\nfloat vx = nextNode.x - currentNode.x;\\nfloat vy = nextNode.y - currentNode.y;\\nfloat dist = sqrt((vx * vx) + (vy * vy)) + 0.01;\\nfloat direx = vx / dist;\\nfloat direy = vy / dist;\\nfloat edgeLength = node_buffer.y;\\nfloat edgeStrength = node_buffer.z;\\nfloat diff = edgeLength - dist;\\nfloat param = (diff * edgeStrength) / mass;\\nax -= direx * param;\\nay -= direy * param;}\\nreturn vec2(ax, ay);}\\nvoid main() {\\nivec3 workGroupSize = ivec3(1, 1, 1);\\nivec3 numWorkGroups = ivec3(1, 1, 1); \\nint globalInvocationIndex = int(floor(v_TexCoord.x * u_OutputTextureSize.x))\\n + int(floor(v_TexCoord.y * u_OutputTextureSize.y)) * int(u_OutputTextureSize.x);\\nint workGroupIDLength = globalInvocationIndex / (workGroupSize.x * workGroupSize.y * workGroupSize.z);\\nivec3 workGroupID = ivec3(workGroupIDLength / numWorkGroups.y / numWorkGroups.z, workGroupIDLength / numWorkGroups.x / numWorkGroups.z, workGroupIDLength / numWorkGroups.x / numWorkGroups.y);\\nint localInvocationIDZ = globalInvocationIndex / (workGroupSize.x * workGroupSize.y);\\nint localInvocationIDY = (globalInvocationIndex - localInvocationIDZ * workGroupSize.x * workGroupSize.y) / workGroupSize.x;\\nint localInvocationIDX = globalInvocationIndex - localInvocationIDZ * workGroupSize.x * workGroupSize.y - localInvocationIDY * workGroupSize.x;\\nivec3 localInvocationID = ivec3(localInvocationIDX, localInvocationIDY, localInvocationIDZ);\\nivec3 globalInvocationID = workGroupID * workGroupSize + localInvocationID;\\nint localInvocationIndex = localInvocationID.z * workGroupSize.x * workGroupSize.y\\n + localInvocationID.y * workGroupSize.x + localInvocationID.x;\\nint i = globalInvocationID.x;\\nvec4 currentNode = getDatau_Data(i);\\nvec4 movement = getDatau_AveMovement(0.0);\\nfloat ax = 0.0;\\nfloat ay = 0.0;\\nif ((i >= VERTEX_COUNT) || (movement.x < u_minMovement)) {gl_FragColor = vec4(currentNode);\\nreturn ;}\\nvec4 nodeAttributes1 = getDatau_NodeAttributeArray1(i);\\nvec4 nodeAttributes2 = getDatau_NodeAttributeArray2(i);\\nvec2 repulsive = calcRepulsive(i, currentNode);\\nax += repulsive.x;\\nay += repulsive.y;\\nvec2 attractive = calcAttractive(i, currentNode, nodeAttributes1);\\nax += attractive.x;\\nay += attractive.y;\\nvec2 gravity = calcGravity(i, currentNode, nodeAttributes2);\\nax -= gravity.x;\\nay -= gravity.y;\\nfloat param = u_interval * u_damping;\\nfloat vx = ax * param;\\nfloat vy = ay * param;\\nfloat vlength = sqrt((vx * vx) + (vy * vy)) + 0.0001;\\nif (vlength > u_maxSpeed) {float param2 = u_maxSpeed / vlength;\\nvx = param2 * vx;\\nvy = param2 * vy;}\\nfloat distx = vx * u_interval;\\nfloat disty = vy * u_interval;\\nfloat distLength = sqrt((distx * distx) + (disty * disty));\\nif ((nodeAttributes1.w != 0.0) && (nodeAttributes2.w != 0.0)) {gl_FragColor = vec4(vec4(nodeAttributes1.w, nodeAttributes2.w, currentNode.z, 0.0));}else {gl_FragColor = vec4(vec4(currentNode.x + distx, currentNode.y + disty, currentNode.z, distLength));}if (gWebGPUDebug) {\\n gl_FragColor = gWebGPUDebugOutput;\\n}}\\n"},"context":{"name":"","dispatch":[1,1,1],"threadGroupSize":[1,1,1],"maxIteration":1,"defines":[{"name":"MAX_EDGE_PER_VERTEX","type":"Float","runtime":true},{"name":"VERTEX_COUNT","type":"Float","runtime":true},{"name":"SHIFT_20","type":"Float","value":1048576,"runtime":false}],"uniforms":[{"name":"u_Data","type":"vec4[]","storageClass":"StorageBuffer","readonly":false,"writeonly":false,"size":[1,1]},{"name":"u_damping","type":"Float","storageClass":"Uniform","readonly":true,"writeonly":false,"size":[1,1]},{"name":"u_maxSpeed","type":"Float","storageClass":"Uniform","readonly":true,"writeonly":false,"size":[1,1]},{"name":"u_minMovement","type":"Float","storageClass":"Uniform","readonly":true,"writeonly":false,"size":[1,1]},{"name":"u_AveMovement","type":"vec4[]","storageClass":"StorageBuffer","readonly":true,"writeonly":false,"size":[1,1]},{"name":"u_coulombDisScale","type":"Float","storageClass":"Uniform","readonly":true,"writeonly":false,"size":[1,1]},{"name":"u_factor","type":"Float","storageClass":"Uniform","readonly":true,"writeonly":false,"size":[1,1]},{"name":"u_NodeAttributeArray1","type":"vec4[]","storageClass":"StorageBuffer","readonly":true,"writeonly":false,"size":[1,1]},{"name":"u_NodeAttributeArray2","type":"vec4[]","storageClass":"StorageBuffer","readonly":true,"writeonly":false,"size":[1,1]},{"name":"u_interval","type":"Float","storageClass":"Uniform","readonly":true,"writeonly":false,"size":[1,1]}],"globalDeclarations":[],"output":{"name":"u_Data","size":[1,1],"length":1},"needPingpong":true}}`; +const aveMovementBundle = `{"shaders":{"WGSL":"import \\"GLSL.std.450\\" as std;\\n\\n\\n# var gWebGPUDebug : bool = false;\\n# var gWebGPUDebugOutput : vec4 = vec4(0.0);\\n\\n[[builtin global_invocation_id]] var globalInvocationID : vec3;\\n# [[builtin work_group_size]] var workGroupSize : vec3;\\n# [[builtin work_group_id]] var workGroupID : vec3;\\n[[builtin local_invocation_id]] var localInvocationID : vec3;\\n# [[builtin num_work_groups]] var numWorkGroups : vec3;\\n[[builtin local_invocation_idx]] var localInvocationIndex : u32;\\n\\ntype GWebGPUParams = [[block]] struct {\\n [[offset 0]] u_iter : f32;\\n};\\n[[binding 0, set 0]] var gWebGPUUniformParams : GWebGPUParams;\\ntype GWebGPUBuffer0 = [[block]] struct {\\n [[offset 0]] u_Data : [[stride 16]] array>;\\n};\\n[[binding 1, set 0]] var gWebGPUBuffer0 : GWebGPUBuffer0;\\ntype GWebGPUBuffer1 = [[block]] struct {\\n [[offset 0]] u_AveMovement : [[stride 16]] array>;\\n};\\n[[binding 2, set 0]] var gWebGPUBuffer1 : GWebGPUBuffer1;\\n\\n\\n\\n\\n\\n\\n\\n\\nfn main() -> void {var movement : f32 = 0.0;\\nfor (var j : i32 = 0; j < __DefineValuePlaceholder__VERTEX_COUNT; j = j + 1) {var vertex : vec4 = gWebGPUBuffer0.u_Data[j];\\nmovement = movement + vertex.w;}\\nmovement = movement / f32(__DefineValuePlaceholder__VERTEX_COUNT);\\ngWebGPUBuffer1.u_AveMovement[0] = vec4(movement, 0.0, 0.0, 0.0);\\nreturn;}\\n\\nentry_point compute as \\"main\\" = main;\\n","GLSL450":"\\n\\n\\nbool gWebGPUDebug = false;\\nvec4 gWebGPUDebugOutput = vec4(0.0);\\n\\nivec3 globalInvocationID = ivec3(gl_GlobalInvocationID);\\nivec3 workGroupSize = ivec3(1,1,1);\\nivec3 workGroupID = ivec3(gl_WorkGroupID);\\nivec3 localInvocationID = ivec3(gl_LocalInvocationID);\\nivec3 numWorkGroups = ivec3(gl_NumWorkGroups);\\nint localInvocationIndex = int(gl_LocalInvocationIndex);\\n\\nlayout(std140, set = 0, binding = 0) uniform GWebGPUParams {\\n float u_iter;\\n} gWebGPUUniformParams;\\nlayout(std430, set = 0, binding = 1) buffer readonly GWebGPUBuffer0 {\\n vec4 u_Data[];\\n} gWebGPUBuffer0;\\n\\nlayout(std430, set = 0, binding = 2) buffer GWebGPUBuffer1 {\\n vec4 u_AveMovement[];\\n} gWebGPUBuffer1;\\n\\n\\n\\n#define VERTEX_COUNT __DefineValuePlaceholder__VERTEX_COUNT\\nlayout (\\n local_size_x = 1,\\n local_size_y = 1,\\n local_size_z = 1\\n) in;\\n\\n\\n\\nvoid main() {float movement = 0.0;\\nfor (int j = 0; j < VERTEX_COUNT; j++) {vec4 vertex = gWebGPUBuffer0.u_Data[j];\\nmovement += vertex.w;}\\nmovement = movement / float(VERTEX_COUNT);\\ngWebGPUBuffer1.u_AveMovement[0] = vec4(movement, 0.0, 0.0, 0.0);}\\n","GLSL100":"\\n\\nfloat epsilon = 0.00001;\\nvec2 addrTranslation_1Dto2D(float address1D, vec2 texSize) {\\n vec2 conv_const = vec2(1.0 / texSize.x, 1.0 / (texSize.x * texSize.y));\\n vec2 normAddr2D = float(address1D) * conv_const;\\n return vec2(fract(normAddr2D.x + epsilon), normAddr2D.y);\\n}\\n\\nvoid barrier() {}\\n \\n\\nuniform vec2 u_OutputTextureSize;\\nuniform int u_OutputTexelCount;\\nvarying vec2 v_TexCoord;\\n\\nbool gWebGPUDebug = false;\\nvec4 gWebGPUDebugOutput = vec4(0.0);\\n\\n#define VERTEX_COUNT __DefineValuePlaceholder__VERTEX_COUNT\\n\\nuniform sampler2D u_Data;\\nuniform vec2 u_DataSize;\\nvec4 getDatau_Data(vec2 address2D) {\\n return vec4(texture2D(u_Data, address2D).rgba);\\n}\\nvec4 getDatau_Data(float address1D) {\\n return getDatau_Data(addrTranslation_1Dto2D(address1D, u_DataSize));\\n}\\nvec4 getDatau_Data(int address1D) {\\n return getDatau_Data(float(address1D));\\n}\\nuniform float u_iter;\\nuniform sampler2D u_AveMovement;\\nuniform vec2 u_AveMovementSize;\\nvec4 getDatau_AveMovement(vec2 address2D) {\\n return vec4(texture2D(u_AveMovement, address2D).rgba);\\n}\\nvec4 getDatau_AveMovement(float address1D) {\\n return getDatau_AveMovement(addrTranslation_1Dto2D(address1D, u_AveMovementSize));\\n}\\nvec4 getDatau_AveMovement(int address1D) {\\n return getDatau_AveMovement(float(address1D));\\n}\\nvoid main() {\\nivec3 workGroupSize = ivec3(1, 1, 1);\\nivec3 numWorkGroups = ivec3(1, 1, 1); \\nint globalInvocationIndex = int(floor(v_TexCoord.x * u_OutputTextureSize.x))\\n + int(floor(v_TexCoord.y * u_OutputTextureSize.y)) * int(u_OutputTextureSize.x);\\nint workGroupIDLength = globalInvocationIndex / (workGroupSize.x * workGroupSize.y * workGroupSize.z);\\nivec3 workGroupID = ivec3(workGroupIDLength / numWorkGroups.y / numWorkGroups.z, workGroupIDLength / numWorkGroups.x / numWorkGroups.z, workGroupIDLength / numWorkGroups.x / numWorkGroups.y);\\nint localInvocationIDZ = globalInvocationIndex / (workGroupSize.x * workGroupSize.y);\\nint localInvocationIDY = (globalInvocationIndex - localInvocationIDZ * workGroupSize.x * workGroupSize.y) / workGroupSize.x;\\nint localInvocationIDX = globalInvocationIndex - localInvocationIDZ * workGroupSize.x * workGroupSize.y - localInvocationIDY * workGroupSize.x;\\nivec3 localInvocationID = ivec3(localInvocationIDX, localInvocationIDY, localInvocationIDZ);\\nivec3 globalInvocationID = workGroupID * workGroupSize + localInvocationID;\\nint localInvocationIndex = localInvocationID.z * workGroupSize.x * workGroupSize.y\\n + localInvocationID.y * workGroupSize.x + localInvocationID.x;\\nfloat movement = 0.0;\\nfor (int j = 0; j < VERTEX_COUNT; j++) {vec4 vertex = getDatau_Data(j);\\nmovement += vertex.w;}\\nmovement = movement / float(VERTEX_COUNT);\\ngl_FragColor = vec4(vec4(movement, 0.0, 0.0, 0.0));if (gWebGPUDebug) {\\n gl_FragColor = gWebGPUDebugOutput;\\n}}\\n"},"context":{"name":"","dispatch":[1,1,1],"threadGroupSize":[1,1,1],"maxIteration":1,"defines":[{"name":"VERTEX_COUNT","type":"Float","runtime":true}],"uniforms":[{"name":"u_Data","type":"vec4[]","storageClass":"StorageBuffer","readonly":true,"writeonly":false,"size":[1,1]},{"name":"u_iter","type":"Float","storageClass":"Uniform","readonly":true,"writeonly":false,"size":[1,1]},{"name":"u_AveMovement","type":"vec4[]","storageClass":"StorageBuffer","readonly":false,"writeonly":false,"size":[1,1]}],"globalDeclarations":[],"output":{"name":"u_AveMovement","size":[1,1],"length":1},"needPingpong":true}}`; + +// @ts-nocheck +/** + * @fileOverview fruchterman layout + * @author shiwu.wyy@antfin.com + */ +var __awaiter$1 = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) { + function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); } + return new (P || (P = Promise))(function (resolve, reject) { + function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } } + function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } } + function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); } + step((generator = generator.apply(thisArg, _arguments || [])).next()); + }); +}; +/** + * graphin 中的 force 布局 + */ +class GForceGPULayout extends Base { + constructor(options) { + super(); + /** 停止迭代的最大迭代数 */ + this.maxIteration = 1000; + /** 弹簧引力系数 */ + this.edgeStrength = 200; + /** 斥力系数 */ + this.nodeStrength = 1000; + /** 库伦系数 */ + this.coulombDisScale = 0.005; + /** 阻尼系数 */ + this.damping = 0.9; + /** 最大速度 */ + this.maxSpeed = 1000; + /** 一次迭代的平均移动距离小于该值时停止迭代 */ + this.minMovement = 0.5; + /** 迭代中衰减 */ + this.interval = 0.02; + /** 斥力的一个系数 */ + this.factor = 1; + /** 理想边长 */ + this.linkDistance = 1; + /** 重力大小 */ + this.gravity = 10; + /** 是否启用web worker。前提是在web worker里执行布局，否则无效 */ + this.workerEnabled = false; + this.nodes = []; + this.edges = []; + this.width = 300; + this.height = 300; + this.nodeMap = {}; + this.nodeIdxMap = {}; + this.updateCfg(options); + } + getDefaultCfg() { + return { + maxIteration: 2000, + gravity: 10, + clustering: false, + clusterGravity: 10 + }; + } + /** + * 执行布局 + */ + execute() { + return __awaiter$1(this, void 0, void 0, function* () { + const self = this; + const nodes = self.nodes; + if (!nodes || nodes.length === 0) { + if (self.onLayoutEnd) + self.onLayoutEnd(); + return; + } + if (!self.width && typeof window !== "undefined") { + self.width = window.innerWidth; + } + if (!self.height && typeof window !== "undefined") { + self.height = window.innerHeight; + } + if (!self.center) { + self.center = [self.width / 2, self.height / 2]; + } + const center = self.center; + if (nodes.length === 1) { + nodes[0].x = center[0]; + nodes[0].y = center[1]; + if (self.onLayoutEnd) + self.onLayoutEnd(); + return; + } + const nodeMap = {}; + const nodeIdxMap = {}; + nodes.forEach((node, i) => { + if (!isNumber$2(node.x)) + node.x = Math.random() * self.width; + if (!isNumber$2(node.y)) + node.y = Math.random() * self.height; + nodeMap[node.id] = node; + nodeIdxMap[node.id] = i; + }); + self.nodeMap = nodeMap; + self.nodeIdxMap = nodeIdxMap; + self.nodeStrength = proccessToFunc$1(self.nodeStrength, 1); + self.edgeStrength = proccessToFunc$1(self.edgeStrength, 1); + // layout + yield self.run(); + }); + } + executeWithWorker(canvas, ctx) { + const self = this; + const nodes = self.nodes; + const center = self.center; + if (!nodes || nodes.length === 0) { + return; + } + if (nodes.length === 1) { + nodes[0].x = center[0]; + nodes[0].y = center[1]; + return; + } + const nodeMap = {}; + const nodeIdxMap = {}; + nodes.forEach((node, i) => { + if (!isNumber$2(node.x)) + node.x = Math.random() * self.width; + if (!isNumber$2(node.y)) + node.y = Math.random() * self.height; + nodeMap[node.id] = node; + nodeIdxMap[node.id] = i; + }); + self.nodeMap = nodeMap; + self.nodeIdxMap = nodeIdxMap; + self.nodeStrength = proccessToFunc$1(self.nodeStrength, 1); + self.edgeStrength = proccessToFunc$1(self.edgeStrength, 1); + // layout + self.run(canvas, ctx); + } + run(canvas, ctx) { + return __awaiter$1(this, void 0, void 0, function* () { + const self = this; + const nodes = self.nodes; + const edges = self.edges; + const maxIteration = self.maxIteration; + if (!self.width && typeof window !== "undefined") { + self.width = window.innerWidth; + } + if (!self.height && typeof window !== "undefined") { + self.height = window.innerHeight; + } + const numParticles = nodes.length; + self.linkDistance = proccessToFunc$1(self.linkDistance); + self.edgeStrength = proccessToFunc$1(self.edgeStrength); + const { maxEdgePerVetex, array: nodesEdgesArray } = buildTextureDataWithTwoEdgeAttr$1(nodes, edges, self.linkDistance, self.edgeStrength); + // init degree for mass + self.degrees = getDegree(nodes.length, self.nodeIdxMap, edges); + const masses = []; + const nodeStrengths = []; + const centerXs = []; + const centerYs = []; + const centerGravities = []; + const fxs = []; + const fys = []; + if (!self.getMass) { + self.getMass = (d) => { + return self.degrees[self.nodeIdxMap[d.id]] || 1; + }; + } + const gravity = self.gravity; + const center = self.center; + nodes.forEach((node, i) => { + masses.push(self.getMass(node)); + nodeStrengths.push(self.nodeStrength(node)); + if (!self.degrees[i]) + self.degrees[i] = 0; + let nodeGravity = [center[0], center[1], gravity]; + if (self.getCenter) { + const customCenter = self.getCenter(node, self.degrees[i]); + if (customCenter && + isNumber$2(customCenter[0]) && + isNumber$2(customCenter[1]) && + isNumber$2(customCenter[2])) { + nodeGravity = customCenter; + } + } + centerXs.push(nodeGravity[0]); + centerYs.push(nodeGravity[1]); + centerGravities.push(nodeGravity[2]); + if (isNumber$2(node.fx) && isNumber$2(node.fy)) { + fxs.push(node.fx || 0.001); + fys.push(node.fy || 0.001); + } + else { + fxs.push(0); + fys.push(0); + } + }); + // 每个节点的额外属性占两个数组各一格，nodeAttributeArray1 中是：mass, degree, nodeSterngth, 0 + const nodeAttributeArray1 = arrayToTextureData$1([ + masses, + self.degrees, + nodeStrengths, + fxs + ]); + // nodeAttributeArray2 中是：centerX, centerY, gravity, 0, + const nodeAttributeArray2 = arrayToTextureData$1([ + centerXs, + centerYs, + centerGravities, + fys + ]); + const workerEnabled = self.workerEnabled; + let world; + if (workerEnabled) { + world = World.create({ + canvas, + engineOptions: { + supportCompute: true + } + }); + } + else { + world = World.create({ + engineOptions: { + supportCompute: true + } + }); + } + // TODO: 最终的预编译代码放入到 gForceShader.ts 中直接引入，不再需要下面三行 + // const compiler = new Compiler(); + // const gForceBundle = compiler.compileBundle(gForceCode); + // console.log(gForceBundle.toString()); + const onLayoutEnd = self.onLayoutEnd; + const initPreviousData = []; + nodesEdgesArray.forEach((value) => { + initPreviousData.push(value); + }); + for (let i = 0; i < 4; i++) { + initPreviousData.push(0); + } + const kernelGForce = world + .createKernel(gForceBundle) + .setDispatch([numParticles, 1, 1]) + .setBinding({ + u_Data: nodesEdgesArray, + u_damping: self.damping, + u_maxSpeed: self.maxSpeed, + u_minMovement: self.minMovement, + u_coulombDisScale: self.coulombDisScale, + u_factor: self.factor, + u_NodeAttributeArray1: nodeAttributeArray1, + u_NodeAttributeArray2: nodeAttributeArray2, + MAX_EDGE_PER_VERTEX: maxEdgePerVetex, + VERTEX_COUNT: numParticles, + u_AveMovement: initPreviousData, + u_interval: self.interval // 每次迭代更新，首次设置为 interval，在 onIterationCompleted 中更新 + }); + // const aveMovementBundle = compiler.compileBundle(aveMovementCode); + // console.log(aveMovementBundle.toString()); + const kernelAveMovement = world + .createKernel(aveMovementBundle) + .setDispatch([1, 1, 1]) + .setBinding({ + u_Data: nodesEdgesArray, + VERTEX_COUNT: numParticles, + u_AveMovement: [0, 0, 0, 0] + }); + // 执行迭代 + // let midRes = nodesEdgesArray; + const execute = () => __awaiter$1(this, void 0, void 0, function* () { + for (let i = 0; i < maxIteration; i++) { + // TODO: 似乎都来自 kernelGForce 是一个引用 + // 当前坐标作为下一次迭代的 PreviousData + // if (i > 0) { + // kernelAveMovement.setBinding({ + // u_PreviousData: kernelGForce + // }); + // } + // eslint-disable-next-line no-await-in-loop + yield kernelGForce.execute(); + // midRes = await kernelGForce.getOutput(); + // 每次迭代完成后 + // 计算平均位移，用于提前终止迭代 + kernelAveMovement.setBinding({ + u_Data: kernelGForce + }); + // eslint-disable-next-line no-await-in-loop + yield kernelAveMovement.execute(); + // 更新衰减函数 + const stepInterval = Math.max(0.02, self.interval - i * 0.002); + kernelGForce.setBinding({ + u_interval: stepInterval, + u_AveMovement: kernelAveMovement + }); + } + const finalParticleData = yield kernelGForce.getOutput(); + // 所有迭代完成后 + if (canvas) { + // 传递数据给主线程 + ctx.postMessage({ + type: LAYOUT_MESSAGE$1.GPUEND, + vertexEdgeData: finalParticleData + // edgeIndexBufferData, + }); + } + else { + nodes.forEach((node, i) => { + const x = finalParticleData[4 * i]; + const y = finalParticleData[4 * i + 1]; + node.x = x; + node.y = y; + }); + } + if (onLayoutEnd) + onLayoutEnd(); + }); + yield execute(); + }); + } + getType() { + return "gForce-gpu"; + } +} + +/** + * @fileOverview Combo force layout + * @author shiwu.wyy@antfin.com + */ +/** + * force layout for graph with combos + */ +class ComboForceLayout extends Base { + constructor(options) { + super(); + /** 布局中心 */ + this.center = [0, 0]; + /** 停止迭代的最大迭代数 */ + this.maxIteration = 100; + /** 重力大小，影响图的紧凑程度 */ + this.gravity = 10; + /** 群组中心力大小 */ + this.comboGravity = 10; + /** 默认边长度 */ + this.linkDistance = 10; + /** 每次迭代位移的衰减相关参数 */ + this.alpha = 1; + this.alphaMin = 0.001; + this.alphaDecay = 1 - Math.pow(this.alphaMin, (1 / 300)); + this.alphaTarget = 0; + /** 节点运动速度衰减参数 */ + this.velocityDecay = 0.6; + /** 边引力大小 */ + this.edgeStrength = 0.6; + /** 节点引力大小 */ + this.nodeStrength = 30; + /** 是否开启防止重叠 */ + this.preventOverlap = false; + /** 是否开启节点之间的防止重叠 */ + this.preventNodeOverlap = false; + /** 是否开启 Combo 之间的防止重叠 */ + this.preventComboOverlap = false; + /** 防止重叠的碰撞力大小 */ + this.collideStrength = undefined; + /** 防止重叠的碰撞力大小 */ + this.nodeCollideStrength = 0.5; + /** 防止重叠的碰撞力大小 */ + this.comboCollideStrength = 0.5; + /** Combo 最小间距，防止重叠时的间隙 */ + this.comboSpacing = 20; + /** Combo 内部的 padding */ + this.comboPadding = 10; + /** 优化计算斥力的速度，两节点间距超过 optimizeRangeFactor * width 则不再计算斥力和重叠斥力 */ + this.optimizeRangeFactor = 1; + /** 每次迭代的回调函数 */ + this.onTick = () => { }; + /** 迭代结束的回调函数 */ + this.onLayoutEnd = () => { }; + /** 根据边两端节点层级差距的调整引力系数的因子，取值范围 [0, 1]。层级差距越大，引力越小 */ + this.depthAttractiveForceScale = 1; + /** 根据边两端节点层级差距的调整斥力系数的因子，取值范围 [1, Infinity]。层级差距越大，斥力越大 */ + this.depthRepulsiveForceScale = 2; + /** 内部计算参数 */ + this.nodes = []; + this.edges = []; + this.combos = []; + this.comboTrees = []; + this.width = 300; + this.height = 300; + this.bias = []; + this.nodeMap = {}; + this.oriComboMap = {}; + this.indexMap = {}; + this.comboMap = {}; + this.previousLayouted = false; + this.updateCfg(options); + } + getDefaultCfg() { + return { + maxIteration: 100, + center: [0, 0], + gravity: 10, + speed: 1, + comboGravity: 30, + preventOverlap: false, + preventComboOverlap: true, + preventNodeOverlap: true, + nodeSpacing: undefined, + collideStrength: undefined, + nodeCollideStrength: 0.5, + comboCollideStrength: 0.5, + comboSpacing: 20, + comboPadding: 10, + edgeStrength: 0.6, + nodeStrength: 30, + linkDistance: 10 + }; + } + /** + * 执行布局 + */ + execute() { + const self = this; + const nodes = self.nodes; + const center = self.center; + self.comboTree = { + id: "comboTreeRoot", + depth: -1, + children: self.comboTrees + }; + if (!nodes || nodes.length === 0) { + if (self.onLayoutEnd) + self.onLayoutEnd(); + return; + } + if (nodes.length === 1) { + nodes[0].x = center[0]; + nodes[0].y = center[1]; + if (self.onLayoutEnd) + self.onLayoutEnd(); + return; + } + self.initVals(); + // layout + self.run(); + if (self.onLayoutEnd) + self.onLayoutEnd(); + } + run() { + const self = this; + const nodes = self.nodes; + const maxIteration = self.previousLayouted + ? self.maxIteration / 5 + : self.maxIteration; + if (!self.width && typeof window !== "undefined") { + self.width = window.innerWidth; + } + if (!self.height && typeof window !== "undefined") { + self.height = window.innerHeight; + } + const center = self.center; + const velocityDecay = self.velocityDecay; + // init the positions to make the nodes with same combo gather around the combo + const comboMap = self.comboMap; + if (!self.previousLayouted) + self.initPos(comboMap); + // iterate + for (let i = 0; i < maxIteration; i++) { + const displacements = []; + nodes.forEach((_, j) => { + displacements[j] = { x: 0, y: 0 }; + }); + self.applyCalculate(displacements); + // gravity for combos + self.applyComboCenterForce(displacements); + // move + nodes.forEach((n, j) => { + if (!isNumber$2(n.x) || !isNumber$2(n.y)) + return; + n.x += displacements[j].x * velocityDecay; + n.y += displacements[j].y * velocityDecay; + }); + self.alpha += (self.alphaTarget - self.alpha) * self.alphaDecay; + self.onTick(); + } + // move to center + const meanCenter = [0, 0]; + nodes.forEach((n) => { + if (!isNumber$2(n.x) || !isNumber$2(n.y)) + return; + meanCenter[0] += n.x; + meanCenter[1] += n.y; + }); + meanCenter[0] /= nodes.length; + meanCenter[1] /= nodes.length; + const centerOffset = [center[0] - meanCenter[0], center[1] - meanCenter[1]]; + nodes.forEach((n, j) => { + if (!isNumber$2(n.x) || !isNumber$2(n.y)) + return; + n.x += centerOffset[0]; + n.y += centerOffset[1]; + }); + // arrange the empty combo + self.combos.forEach((combo) => { + const mapped = comboMap[combo.id]; + if (mapped && mapped.empty) { + combo.x = mapped.cx || combo.x; + combo.y = mapped.cy || combo.y; + } + }); + self.previousLayouted = true; + } + initVals() { + const self = this; + const edges = self.edges; + const nodes = self.nodes; + const combos = self.combos; + const count = {}; + const nodeMap = {}; + const indexMap = {}; + nodes.forEach((node, i) => { + nodeMap[node.id] = node; + indexMap[node.id] = i; + }); + self.nodeMap = nodeMap; + self.indexMap = indexMap; + const oriComboMap = {}; + combos.forEach((combo) => { + oriComboMap[combo.id] = combo; + }); + self.oriComboMap = oriComboMap; + self.comboMap = self.getComboMap(); + const preventOverlap = self.preventOverlap; + self.preventComboOverlap = self.preventComboOverlap || preventOverlap; + self.preventNodeOverlap = self.preventNodeOverlap || preventOverlap; + const collideStrength = self.collideStrength; + if (collideStrength) { + self.comboCollideStrength = collideStrength; + self.nodeCollideStrength = collideStrength; + } + self.comboCollideStrength = self.comboCollideStrength + ? self.comboCollideStrength + : 0; + self.nodeCollideStrength = self.nodeCollideStrength + ? self.nodeCollideStrength + : 0; + // get edge bias + for (let i = 0; i < edges.length; ++i) { + const source = getEdgeTerminal(edges[i], 'source'); + const target = getEdgeTerminal(edges[i], 'target'); + if (count[source]) + count[source]++; + else + count[source] = 1; + if (count[target]) + count[target]++; + else + count[target] = 1; + } + const bias = []; + for (let i = 0; i < edges.length; ++i) { + const source = getEdgeTerminal(edges[i], 'source'); + const target = getEdgeTerminal(edges[i], 'target'); + bias[i] = count[source] / (count[source] + count[target]); + } + this.bias = bias; + const nodeSize = self.nodeSize; + const nodeSpacing = self.nodeSpacing; + let nodeSizeFunc; + let nodeSpacingFunc; + // nodeSpacing to function + if (isNumber$2(nodeSpacing)) { + nodeSpacingFunc = () => nodeSpacing; + } + else if (isFunction$5(nodeSpacing)) { + nodeSpacingFunc = nodeSpacing; + } + else { + nodeSpacingFunc = () => 0; + } + this.nodeSpacing = nodeSpacingFunc; + // nodeSize to function + if (!nodeSize) { + nodeSizeFunc = (d) => { + if (d.size) { + if (isArray$l(d.size)) { + const res = d.size[0] > d.size[1] ? d.size[0] : d.size[1]; + return res / 2; + } + if (isObject$e(d.size)) { + const res = d.size.width > d.size.height ? d.size.width : d.size.height; + return res / 2; + } + return d.size / 2; + } + return 10; + }; + } + else if (isFunction$5(nodeSize)) { + nodeSizeFunc = (d) => { + return nodeSize(d); + }; + } + else if (isArray$l(nodeSize)) { + const larger = nodeSize[0] > nodeSize[1] ? nodeSize[0] : nodeSize[1]; + const radius = larger / 2; + nodeSizeFunc = (d) => radius; + } + else { + // number type + const radius = nodeSize / 2; + nodeSizeFunc = (d) => radius; + } + this.nodeSize = nodeSizeFunc; + // comboSpacing to function + const comboSpacing = self.comboSpacing; + let comboSpacingFunc; + if (isNumber$2(comboSpacing)) { + comboSpacingFunc = () => comboSpacing; + } + else if (isFunction$5(comboSpacing)) { + comboSpacingFunc = comboSpacing; + } + else { + // null type + comboSpacingFunc = () => 0; + } + this.comboSpacing = comboSpacingFunc; + // comboPadding to function + const comboPadding = self.comboPadding; + let comboPaddingFunc; + if (isNumber$2(comboPadding)) { + comboPaddingFunc = () => comboPadding; + } + else if (isArray$l(comboPadding)) { + comboPaddingFunc = () => Math.max.apply(null, comboPadding); + } + else if (isFunction$5(comboPadding)) { + comboPaddingFunc = comboPadding; + } + else { + // null type + comboPaddingFunc = () => 0; + } + this.comboPadding = comboPaddingFunc; + // linkDistance to function + let linkDistance = this.linkDistance; + let linkDistanceFunc; + if (!linkDistance) { + linkDistance = 10; + } + if (isNumber$2(linkDistance)) { + linkDistanceFunc = (d) => { + return linkDistance; + }; + } + else { + linkDistanceFunc = linkDistance; + } + this.linkDistance = linkDistanceFunc; + // linkStrength to function + let edgeStrength = this.edgeStrength; + let edgeStrengthFunc; + if (!edgeStrength) { + edgeStrength = 1; + } + if (isNumber$2(edgeStrength)) { + edgeStrengthFunc = (d) => { + return edgeStrength; + }; + } + else { + edgeStrengthFunc = edgeStrength; + } + this.edgeStrength = edgeStrengthFunc; + // nodeStrength to function + let nodeStrength = this.nodeStrength; + let nodeStrengthFunc; + if (!nodeStrength) { + nodeStrength = 30; + } + if (isNumber$2(nodeStrength)) { + nodeStrengthFunc = (d) => { + return nodeStrength; + }; + } + else { + nodeStrengthFunc = nodeStrength; + } + this.nodeStrength = nodeStrengthFunc; + } + initPos(comboMap) { + const self = this; + const nodes = self.nodes; + nodes.forEach((node, i) => { + const comboId = node.comboId; + const combo = comboMap[comboId]; + if (comboId && combo) { + node.x = combo.cx + 100 / (i + 1); + node.y = combo.cy + 100 / (i + 1); + } + else { + node.x = 100 / (i + 1); + node.y = 100 / (i + 1); + } + }); + } + getComboMap() { + const self = this; + const nodeMap = self.nodeMap; + const indexMap = self.indexMap; + const comboTrees = self.comboTrees; + const oriComboMap = self.oriComboMap; + const comboMap = {}; + (comboTrees || []).forEach((ctree) => { + const treeChildren = []; + traverseTreeUp(ctree, (treeNode) => { + if (treeNode.itemType === "node") + return true; // skip it + if (!oriComboMap[treeNode.id]) + return true; // means it is hidden, skip it + if (comboMap[treeNode.id] === undefined) { + const combo = { + id: treeNode.id, + name: treeNode.id, + cx: 0, + cy: 0, + count: 0, + depth: self.oriComboMap[treeNode.id].depth || 0, + children: [] + }; + comboMap[treeNode.id] = combo; + } + const children = treeNode.children; + if (children) { + children.forEach((child) => { + if (!comboMap[child.id] && !nodeMap[child.id]) + return true; // means it is hidden + treeChildren.push(child); + }); + } + const c = comboMap[treeNode.id]; + c.cx = 0; + c.cy = 0; + // In order to layout the empty combo, add a virtual node to it + if (treeChildren.length === 0) { + c.empty = true; + const oriCombo = oriComboMap[treeNode.id]; + const idx = Object.keys(nodeMap).length; + const virtualNodeId = `${treeNode.id}-visual-child-${idx}`; + const vnode = { + id: virtualNodeId, + x: oriCombo.x, + y: oriCombo.y, + depth: c.depth + 1, + itemType: "node" + }; + self.nodes.push(vnode); + nodeMap[virtualNodeId] = vnode; + indexMap[virtualNodeId] = idx; + c.cx = oriCombo.x; + c.cy = oriCombo.y; + treeChildren.push(vnode); + } + treeChildren.forEach((child) => { + c.count++; + if (child.itemType !== "node") { + const childCombo = comboMap[child.id]; + if (isNumber$2(childCombo.cx)) + c.cx += childCombo.cx; + if (isNumber$2(childCombo.cy)) + c.cy += childCombo.cy; + return; + } + const node = nodeMap[child.id]; + // means the node is hidden, skip it + if (!node) + return; + if (isNumber$2(node.x)) { + c.cx += node.x; + } + if (isNumber$2(node.y)) { + c.cy += node.y; + } + }); + c.cx /= c.count; + c.cy /= c.count; + c.children = treeChildren; + return true; + }); + }); + return comboMap; + } + applyComboCenterForce(displacements) { + const self = this; + const gravity = self.gravity; + const comboGravity = self.comboGravity || gravity; + const alpha = this.alpha; + const comboTrees = self.comboTrees; + const indexMap = self.indexMap; + const nodeMap = self.nodeMap; + const comboMap = self.comboMap; + (comboTrees || []).forEach((ctree) => { + traverseTreeUp(ctree, (treeNode) => { + if (treeNode.itemType === "node") + return true; // skip it + const combo = comboMap[treeNode.id]; + // means the combo is hidden, skip it + if (!combo) + return true; + const c = comboMap[treeNode.id]; + // higher depth the combo, larger the gravity + const gravityScale = ((c.depth + 1) / 10) * 0.5; + // apply combo center force for all the descend nodes in this combo + // and update the center position and count for this combo + const comboX = c.cx; + const comboY = c.cy; + c.cx = 0; + c.cy = 0; + c.children.forEach((child) => { + if (child.itemType !== "node") { + const childCombo = comboMap[child.id]; + if (childCombo && isNumber$2(childCombo.cx)) + c.cx += childCombo.cx; + if (childCombo && isNumber$2(childCombo.cy)) + c.cy += childCombo.cy; + return; + } + const node = nodeMap[child.id]; + const vecX = (node.x - comboX) || 0.005; + const vecY = (node.y - comboY) || 0.005; + const l = Math.sqrt(vecX * vecX + vecY * vecY); + const childIdx = indexMap[node.id]; + const params = ((comboGravity * alpha) / l) * gravityScale; + displacements[childIdx].x -= vecX * params; + displacements[childIdx].y -= vecY * params; + if (isNumber$2(node.x)) + c.cx += node.x; + if (isNumber$2(node.y)) + c.cy += node.y; + }); + c.cx /= c.count; + c.cy /= c.count; + return true; + }); + }); + } + applyCalculate(displacements) { + const self = this; + const comboMap = self.comboMap; + const nodes = self.nodes; + // store the vx, vy, and distance to reduce dulplicate calculation + const vecMap = {}; + nodes.forEach((v, i) => { + nodes.forEach((u, j) => { + if (i < j) + return; + const vx = (v.x - u.x) || 0.005; + const vy = (v.y - u.y) || 0.005; + let vl2 = vx * vx + vy * vy; + const vl = Math.sqrt(vl2); + if (vl2 < 1) + vl2 = vl; + vecMap[`${v.id}-${u.id}`] = { vx, vy, vl2, vl }; + vecMap[`${u.id}-${v.id}`] = { vl2, vl, vx: -vx, vy: -vy }; + }); + }); + // get the sizes of the combos + self.updateComboSizes(comboMap); + self.calRepulsive(displacements, vecMap); + self.calAttractive(displacements, vecMap); + const preventComboOverlap = self.preventComboOverlap; + if (preventComboOverlap) + self.comboNonOverlapping(displacements, comboMap); + } + /** + * Update the sizes of the combos according to their children + * Used for combos nonoverlap, but not re-render the combo shapes + */ + updateComboSizes(comboMap) { + const self = this; + const comboTrees = self.comboTrees; + const nodeMap = self.nodeMap; + const nodeSize = self.nodeSize; + const comboSpacing = self.comboSpacing; + const comboPadding = self.comboPadding; + (comboTrees || []).forEach((ctree) => { + const treeChildren = []; + traverseTreeUp(ctree, (treeNode) => { + if (treeNode.itemType === "node") + return true; // skip it + const c = comboMap[treeNode.id]; + // means the combo is hidden, skip it + if (!c) + return false; + const children = treeNode.children; + if (children) { + children.forEach((child) => { + // means the combo is hidden. + if (!comboMap[child.id] && !nodeMap[child.id]) + return; + treeChildren.push(child); + }); + } + c.minX = Infinity; + c.minY = Infinity; + c.maxX = -Infinity; + c.maxY = -Infinity; + treeChildren.forEach((child) => { + if (child.itemType !== "node") + return true; // skip it + const node = nodeMap[child.id]; + if (!node) + return true; // means it is hidden + const r = nodeSize(node); + const nodeMinX = node.x - r; + const nodeMinY = node.y - r; + const nodeMaxX = node.x + r; + const nodeMaxY = node.y + r; + if (c.minX > nodeMinX) + c.minX = nodeMinX; + if (c.minY > nodeMinY) + c.minY = nodeMinY; + if (c.maxX < nodeMaxX) + c.maxX = nodeMaxX; + if (c.maxY < nodeMaxY) + c.maxY = nodeMaxY; + }); + let minSize = self.oriComboMap[treeNode.id].size || 10; + if (isArray$l(minSize)) + minSize = minSize[0]; + const maxLength = Math.max(c.maxX - c.minX, c.maxY - c.minY, minSize); + c.r = maxLength / 2 + comboSpacing(c) / 2 + comboPadding(c); + return true; + }); + }); + } + /** + * prevent the overlappings among combos + */ + comboNonOverlapping(displacements, comboMap) { + const self = this; + const comboTree = self.comboTree; + const comboCollideStrength = self.comboCollideStrength; + const indexMap = self.indexMap; + const nodeMap = self.nodeMap; + traverseTreeUp(comboTree, (treeNode) => { + if (!comboMap[treeNode.id] && + !nodeMap[treeNode.id] && + treeNode.id !== "comboTreeRoot") { + return false; + } // means it is hidden + const children = treeNode.children; + // 同个子树下的子 combo 间两两对比 + if (children && children.length > 1) { + children.forEach((v, i) => { + if (v.itemType === "node") + return false; // skip it + const cv = comboMap[v.id]; + if (!cv) + return; // means it is hidden, skip it + children.forEach((u, j) => { + if (i <= j) + return false; + if (u.itemType === "node") + return false; // skip it + const cu = comboMap[u.id]; + if (!cu) + return false; // means it is hidden, skip it + const vx = (cv.cx - cu.cx) || 0.005; + const vy = (cv.cy - cu.cy) || 0.005; + const l = vx * vx + vy * vy; + const rv = cv.r || 1; + const ru = cu.r || 1; + const r = rv + ru; + const ru2 = ru * ru; + const rv2 = rv * rv; + // overlapping + if (l < r * r) { + const vnodes = v.children; + if (!vnodes || vnodes.length === 0) + return false; // skip it + const unodes = u.children; + if (!unodes || unodes.length === 0) + return false; // skip it + const sqrtl = Math.sqrt(l); + const ll = ((r - sqrtl) / sqrtl) * comboCollideStrength; + const xl = vx * ll; + const yl = vy * ll; + const rratio = ru2 / (rv2 + ru2); + const irratio = 1 - rratio; + // 两兄弟 combo 的子节点上施加斥力 + vnodes.forEach((vn) => { + if (vn.itemType !== "node") + return false; // skip it + if (!nodeMap[vn.id]) + return; // means it is hidden, skip it + const vindex = indexMap[vn.id]; + unodes.forEach((un) => { + if (un.itemType !== "node") + return false; + if (!nodeMap[un.id]) + return false; // means it is hidden, skip it + const uindex = indexMap[un.id]; + displacements[vindex].x += xl * rratio; + displacements[vindex].y += yl * rratio; + displacements[uindex].x -= xl * irratio; + displacements[uindex].y -= yl * irratio; + }); + }); + } + }); + }); + } + return true; + }); + } + /** + * Calculate the repulsive force between each node pair + * @param displacements The array stores the displacements for nodes + * @param vecMap The map stores vector between each node pair + */ + calRepulsive(displacements, vecMap) { + const self = this; + const nodes = self.nodes; + const max = self.width * self.optimizeRangeFactor; + const nodeStrength = self.nodeStrength; + const alpha = self.alpha; + const nodeCollideStrength = self.nodeCollideStrength; + const preventNodeOverlap = self.preventNodeOverlap; + const nodeSizeFunc = self.nodeSize; + const nodeSpacingFunc = self.nodeSpacing; + const scale = self.depthRepulsiveForceScale; + const center = self.center; + nodes.forEach((v, i) => { + if (!v.x || !v.y) + return; + // center gravity + if (center) { + const gravity = self.gravity; + const vecX = (v.x - center[0]) || 0.005; + const vecY = (v.y - center[1]) || 0.005; + const l = Math.sqrt(vecX * vecX + vecY * vecY); + displacements[i].x -= (vecX * gravity * alpha) / l; + displacements[i].y -= (vecY * gravity * alpha) / l; + } + nodes.forEach((u, j) => { + if (i === j) { + return; + } + if (!u.x || !u.y) + return; + const { vl2, vl } = vecMap[`${v.id}-${u.id}`]; + if (vl > max) + return; + const { vx, vy } = vecMap[`${v.id}-${u.id}`]; + let depthDiff = Math.log(Math.abs(u.depth - v.depth) / 10) + 1 || 1; + depthDiff = depthDiff < 1 ? 1 : depthDiff; + if (u.comboId !== v.comboId) + depthDiff += 1; + const depthParam = depthDiff ? Math.pow(scale, depthDiff) : 1; + const params = ((nodeStrength(u) * alpha) / vl2) * depthParam; + displacements[i].x += vx * params; + displacements[i].y += vy * params; + // prevent node overlappings + if (i < j && preventNodeOverlap) { + const ri = (nodeSizeFunc(v) + nodeSpacingFunc(v)) || 1; + const rj = (nodeSizeFunc(u) + nodeSpacingFunc(u)) || 1; + const r = ri + rj; + if (vl2 < r * r) { + const ll = ((r - vl) / vl) * nodeCollideStrength; + const rj2 = rj * rj; + let rratio = rj2 / (ri * ri + rj2); + const xl = vx * ll; + const yl = vy * ll; + displacements[i].x += xl * rratio; + displacements[i].y += yl * rratio; + rratio = 1 - rratio; + displacements[j].x -= xl * rratio; + displacements[j].y -= yl * rratio; + } + } + }); + }); + } + /** + * Calculate the attractive force between the node pair with edge + * @param displacements The array stores the displacements for nodes + * @param vecMap The map stores vector between each node pair + */ + calAttractive(displacements, vecMap) { + const self = this; + const edges = self.edges; + const linkDistance = self.linkDistance; + const alpha = self.alpha; + const edgeStrength = self.edgeStrength; + const bias = self.bias; + const scale = self.depthAttractiveForceScale; + edges.forEach((e, i) => { + const source = getEdgeTerminal(e, 'source'); + const target = getEdgeTerminal(e, 'target'); + if (!source || !target || source === target) + return; + const uIndex = self.indexMap[source]; + const vIndex = self.indexMap[target]; + const u = self.nodeMap[source]; + const v = self.nodeMap[target]; + if (!u || !v) + return; + let depthDiff = u.depth === v.depth ? 0 : Math.log(Math.abs(u.depth - v.depth) / 10); + if (u.comboId === v.comboId) { + depthDiff = depthDiff / 2; + } + let depthParam = depthDiff ? Math.pow(scale, depthDiff) : 1; + if (u.comboId !== v.comboId && depthParam === 1) { + depthParam = scale / 2; + } + else if (u.comboId === v.comboId) { + depthParam = 2; + } + if (!isNumber$2(v.x) || !isNumber$2(u.x) || !isNumber$2(v.y) || !isNumber$2(u.y)) { + return; + } + const { vl, vx, vy } = vecMap[`${target}-${source}`]; + const l = ((vl - linkDistance(e)) / vl) * alpha * edgeStrength(e) * depthParam; + const vecX = vx * l; + const vecY = vy * l; + const b = bias[i]; + displacements[vIndex].x -= vecX * b; + displacements[vIndex].y -= vecY * b; + displacements[uIndex].x += vecX * (1 - b); + displacements[uIndex].y += vecY * (1 - b); + }); + } + getType() { + return "comboForce"; + } +} + +// represents a body(a point mass) and its position +class Body { + constructor(params) { + /** + * the id of this body, the same with the node id + * @type {number} + */ + this.id = params.id || 0; + /** + * the position of this body + * @type {number} + */ + this.rx = params.rx; + /** + * the position of this body + * @type {number} + */ + this.ry = params.ry; + /** + * the force acting on this body + * @type {number} + */ + this.fx = 0; + /** + * the force acting on this body + * @type {number} + */ + this.fy = 0; + /** + * the mass of this body, =1 for a node + * @type {number} + */ + this.mass = params.mass; + /** + * the degree of the node represented by this body + * @type {number} + */ + this.degree = params.degree; + /** + * the parameter for repulsive force, = kr + * @type {number} + */ + this.g = params.g || 0; + } + // returns the euclidean distance + distanceTo(bo) { + const dx = this.rx - bo.rx; + const dy = this.ry - bo.ry; + return Math.hypot(dx, dy); + } + setPos(x, y) { + this.rx = x; + this.ry = y; + } + // resets the forces + resetForce() { + this.fx = 0; + this.fy = 0; + } + addForce(b) { + const dx = b.rx - this.rx; + const dy = b.ry - this.ry; + let dist = Math.hypot(dx, dy); + dist = dist < 0.0001 ? 0.0001 : dist; + // the repulsive defined by force atlas 2 + const F = (this.g * (this.degree + 1) * (b.degree + 1)) / dist; + this.fx += F * dx / dist; + this.fy += F * dy / dist; + } + // if quad contains this body + in(quad) { + return quad.contains(this.rx, this.ry); + } + // returns a new body + add(bo) { + const nenwMass = this.mass + bo.mass; + const x = (this.rx * this.mass + bo.rx * bo.mass) / nenwMass; + const y = (this.ry * this.mass + bo.ry * bo.mass) / nenwMass; + const dg = this.degree + bo.degree; + const params = { + rx: x, + ry: y, + mass: nenwMass, + degree: dg + }; + return new Body(params); + } +} + +class Quad { + constructor(params) { + /** + * the center position of this quad + * @type {number} + */ + this.xmid = params.xmid; + /** + * the center position of this quad + * @type {number} + */ + this.ymid = params.ymid; + /** + * the length of this quad + * @type {number} + */ + this.length = params.length; + /** + * the mass center of this quad + * @type {number} + */ + this.massCenter = params.massCenter || [0, 0]; + /** + * the mass of this quad + * @type {number} + */ + this.mass = params.mass || 1; + } + getLength() { + return this.length; + } + contains(x, y) { + const halfLen = this.length / 2; + return (x <= this.xmid + halfLen && + x >= this.xmid - halfLen && + y <= this.ymid + halfLen && + y >= this.ymid - halfLen); + } + // northwest quadrant + // tslint:disable-next-line + NW() { + const x = this.xmid - this.length / 4; + const y = this.ymid + this.length / 4; + const len = this.length / 2; + const params = { + xmid: x, + ymid: y, + length: len + }; + const NW = new Quad(params); + return NW; + } + // northeast + // tslint:disable-next-line + NE() { + const x = this.xmid + this.length / 4; + const y = this.ymid + this.length / 4; + const len = this.length / 2; + const params = { + xmid: x, + ymid: y, + length: len + }; + const NE = new Quad(params); + return NE; + } + // southwest + // tslint:disable-next-line + SW() { + const x = this.xmid - this.length / 4; + const y = this.ymid - this.length / 4; + const len = this.length / 2; + const params = { + xmid: x, + ymid: y, + length: len + }; + const SW = new Quad(params); + return SW; + } + // southeast + // tslint:disable-next-line + SE() { + const x = this.xmid + this.length / 4; + const y = this.ymid - this.length / 4; + const len = this.length / 2; + const params = { + xmid: x, + ymid: y, + length: len + }; + const SE = new Quad(params); + return SE; + } +} + +/** + * @fileOverview quadTree + * @author shiwu.wyy@antfin.com + */ +class QuadTree { + // each quadtree represents a quadrant and an aggregate body + // that represents all bodies inside the quadrant + constructor(param) { + /** + * (aggregated) body in this quad + * @type {object} + */ + this.body = null; + /** + * tree representing the northwest quadrant + * @type {object} + */ + this.quad = null; + this.NW = null; + this.NE = null; + this.SW = null; + this.SE = null; + /** + * threshold + * @type {number} + */ + this.theta = 0.5; + if (param != null) + this.quad = param; + } + // insert a body(node) into the tree + insert(bo) { + // if this node does not contain a body, put the new body bo here + if (this.body == null) { + this.body = bo; + return; + } + // internal node + if (!this._isExternal()) { + // update mass info + this.body = this.body.add(bo); + // insert body into quadrant + this._putBody(bo); + } + else { // external node + // divide this region into four children + if (this.quad) { + this.NW = new QuadTree(this.quad.NW()); + this.NE = new QuadTree(this.quad.NE()); + this.SW = new QuadTree(this.quad.SW()); + this.SE = new QuadTree(this.quad.SE()); + } + // insert this body and bo + this._putBody(this.body); + this._putBody(bo); + // update the mass info + this.body = this.body.add(bo); + } + } + // inserts bo into a quad + // tslint:disable-next-line + _putBody(bo) { + if (!this.quad) + return; + if (bo.in(this.quad.NW()) && this.NW) + this.NW.insert(bo); + else if (bo.in(this.quad.NE()) && this.NE) + this.NE.insert(bo); + else if (bo.in(this.quad.SW()) && this.SW) + this.SW.insert(bo); + else if (bo.in(this.quad.SE()) && this.SE) + this.SE.insert(bo); + } + // tslint:disable-next-line + _isExternal() { + // four children are null + return (this.NW == null && this.NE == null && this.SW == null && this.SE == null); + } + // update the forces + updateForce(bo) { + if (this.body == null || bo === this.body) { + return; + } + // if the current node is external + if (this._isExternal()) + bo.addForce(this.body); + // internal nodes + else { + const s = this.quad ? this.quad.getLength() : 0; + const d = this.body.distanceTo(bo); + // b is far enough + if ((s / d) < this.theta) + bo.addForce(this.body); + else { + this.NW && this.NW.updateForce(bo); + this.NE && this.NE.updateForce(bo); + this.SW && this.SW.updateForce(bo); + this.SE && this.SE.updateForce(bo); + } + } + } +} + +class ForceAtlas2Layout extends Base { + constructor(options) { + super(); + /** 布局中心 */ + this.center = [0, 0]; + /** 宽度 */ + this.width = 300; + /** 高度 */ + this.height = 300; + this.nodes = []; + this.edges = []; + /** + * the parameter for repulsive forces, + * it will scale the layout but won't change the layout + * larger the kr, looser the layout + * @type {number} + */ + this.kr = 5; + /** + * the parameter for gravity forces + * @type {number} + */ + this.kg = 1; + /** + * modes: + * 'normal' for normal using + * 'linlog' for compact clusters. + * @type {string} + */ + this.mode = 'normal'; + /** + * whether preventing the node overlapping + * @type {boolean} + */ + this.preventOverlap = false; + /** + * whether active the dissuade hub mode + * true: grant authorities (nodes with a high indegree) + * a more central position than hubs (nodes with a high outdegree) + * @type {boolean} + */ + this.dissuadeHubs = false; + /** + * whether active the barnes hut optimization on computing repulsive forces + * @type {boolean} + */ + this.barnesHut = undefined; + /** + * the max iteration number + * @type {number} + */ + this.maxIteration = 0; + /** + * control the global velocity + * defualt: 0.1(gephi) + * @type {number} + */ + this.ks = 0.1; + /** + * the max global velocity + * @type {number} + */ + this.ksmax = 10; + /** + * the tolerance for the global swinging + * @type {number} + */ + this.tao = 0.1; + /** + * the function of layout complete listener, display the legend and minimap after layout + * @type {function} + */ + this.onLayoutEnd = () => { }; + /** + * activate prune or not. + * prune the leaves during most iterations, layout the leaves in the last 50 iteraitons. + * if prune === '', it will be activated when the nodes number > 100 + * note that it will reduce the quality of the layout + * @type {boolean} + */ + this.prune = undefined; + this.updateCfg(options); + } + getDefaultCfg() { + return {}; + } + // execute the layout + execute() { + const self = this; + const { nodes, onLayoutEnd, prune, } = self; + let maxIteration = self.maxIteration; + if (!self.width && typeof window !== "undefined") { + self.width = window.innerWidth; + } + if (!self.height && typeof window !== "undefined") { + self.height = window.innerHeight; + } + // the whidth of each nodes + const sizes = []; + const nodeNum = nodes.length; + for (let i = 0; i < nodeNum; i += 1) { + const node = nodes[i]; + let nodeWidth = 10; + let nodeHeight = 10; + if (isNumber$2(node.size)) { + nodeWidth = node.size; + nodeHeight = node.size; + } + if (isArray$l(node.size)) { + if (!isNaN(node.size[0])) + nodeWidth = node.size[0]; + if (!isNaN(node.size[1])) + nodeHeight = node.size[1]; + } + else if (isObject$e(node.size)) { + nodeWidth = node.size.width; + nodeHeight = node.size.height; + } + if (self.getWidth && !isNaN(self.getWidth(node))) + nodeHeight = self.getWidth(node); + if (self.getHeight && !isNaN(self.getHeight(node))) + nodeWidth = self.getHeight(node); + const maxSize = Math.max(nodeWidth, nodeHeight); + sizes.push(maxSize); + } + if (self.barnesHut === undefined && nodeNum > 250) + self.barnesHut = true; + if (self.prune === undefined && nodeNum > 100) + self.prune = true; + if (this.maxIteration === 0 && !self.prune) { + maxIteration = 250; + if (nodeNum <= 200 && nodeNum > 100) + maxIteration = 1000; + else if (nodeNum > 200) + maxIteration = 1200; + this.maxIteration = maxIteration; + } + else if (this.maxIteration === 0 && prune) { + maxIteration = 100; + if (nodeNum <= 200 && nodeNum > 100) + maxIteration = 500; + else if (nodeNum > 200) + maxIteration = 950; + this.maxIteration = maxIteration; + } + if (!self.kr) { + self.kr = 50; + if (nodeNum > 100 && nodeNum <= 500) + self.kr = 20; + else if (nodeNum > 500) + self.kr = 1; + } + if (!self.kg) { + self.kg = 20; + if (nodeNum > 100 && nodeNum <= 500) + self.kg = 10; + else if (nodeNum > 500) + self.kg = 1; + } + this.nodes = self.updateNodesByForces(sizes); + onLayoutEnd(); + } + updateNodesByForces(sizes) { + const self = this; + const { edges, maxIteration } = self; + let nodes = self.nodes; + const nonLoopEdges = edges.filter((edge) => { + const source = getEdgeTerminal(edge, 'source'); + const target = getEdgeTerminal(edge, 'target'); + return source !== target; + }); + const size = nodes.length; + const esize = nonLoopEdges.length; + const degrees = []; + const idMap = {}; + const edgeEndsIdMap = {}; + // tslint:disable-next-line + const Es = []; + for (let i = 0; i < size; i += 1) { + idMap[nodes[i].id] = i; + degrees[i] = 0; + if (nodes[i].x === undefined || isNaN(nodes[i].x)) { + nodes[i].x = Math.random() * 1000; + } + if (nodes[i].y === undefined || isNaN(nodes[i].y)) { + nodes[i].y = Math.random() * 1000; + } + Es.push({ x: nodes[i].x, y: nodes[i].y }); + } + for (let i = 0; i < esize; i += 1) { + let node1; + let node2; + let sIdx = 0; + let tIdx = 0; + for (let j = 0; j < size; j += 1) { + const source = getEdgeTerminal(nonLoopEdges[i], 'source'); + const target = getEdgeTerminal(nonLoopEdges[i], 'target'); + if (nodes[j].id === source) { + node1 = nodes[j]; + sIdx = j; + } + else if (nodes[j].id === target) { + node2 = nodes[j]; + tIdx = j; + } + edgeEndsIdMap[i] = { sourceIdx: sIdx, targetIdx: tIdx }; + } + if (node1) + degrees[idMap[node1.id]] += 1; + if (node2) + degrees[idMap[node2.id]] += 1; + } + let iteration = maxIteration; + nodes = this.iterate(iteration, idMap, edgeEndsIdMap, esize, degrees, sizes); + // if prune, place the leaves around their parents, and then re-layout for several iterations. + if (self.prune) { + for (let j = 0; j < esize; j += 1) { + if (degrees[edgeEndsIdMap[j].sourceIdx] <= 1) { + nodes[edgeEndsIdMap[j].sourceIdx].x = nodes[edgeEndsIdMap[j].targetIdx].x; + nodes[edgeEndsIdMap[j].sourceIdx].y = nodes[edgeEndsIdMap[j].targetIdx].y; + } + else if (degrees[edgeEndsIdMap[j].targetIdx] <= 1) { + nodes[edgeEndsIdMap[j].targetIdx].x = nodes[edgeEndsIdMap[j].sourceIdx].x; + nodes[edgeEndsIdMap[j].targetIdx].y = nodes[edgeEndsIdMap[j].sourceIdx].y; + } + } + self.prune = false; + self.barnesHut = false; + iteration = 100; + nodes = this.iterate(iteration, idMap, edgeEndsIdMap, esize, degrees, sizes); + } + return nodes; + } + iterate(iteration, idMap, edgeEndsIdMap, esize, degrees, sizes) { + const self = this; + let { nodes } = self; + const { kr, preventOverlap } = self; + const { barnesHut } = self; + const nodeNum = nodes.length; + let sg = 0; + const krPrime = 100; + let iter = iteration; + const prevoIter = 50; + let forces = []; + const preForces = []; + const bodies = []; + for (let i = 0; i < nodeNum; i += 1) { + forces[2 * i] = 0; + forces[2 * i + 1] = 0; + if (barnesHut) { + const params = { + id: i, + rx: nodes[i].x, + ry: nodes[i].y, + mass: 1, + g: kr, + degree: degrees[i] + }; + bodies[i] = new Body(params); + } + } + while (iter > 0) { + for (let i = 0; i < nodeNum; i += 1) { + preForces[2 * i] = forces[2 * i]; + preForces[2 * i + 1] = forces[2 * i + 1]; + forces[2 * i] = 0; + forces[2 * i + 1] = 0; + } + // attractive forces, existing on every actual edge + forces = this.getAttrForces(iter, prevoIter, esize, idMap, edgeEndsIdMap, degrees, sizes, forces); + // repulsive forces and Gravity, existing on every node pair + // if preventOverlap, using the no-optimized method in the last prevoIter instead. + if (barnesHut && ((preventOverlap && iter > prevoIter) || !preventOverlap)) { + forces = this.getOptRepGraForces(forces, bodies, degrees); + } + else { + forces = this.getRepGraForces(iter, prevoIter, forces, krPrime, sizes, degrees); + } + // update the positions + const res = this.updatePos(forces, preForces, sg, degrees); + nodes = res.nodes; + sg = res.sg; + iter--; + if (self.tick) + self.tick(); + } + return nodes; + } + getAttrForces(iter, prevoIter, esize, idMap, edgeEndsIdMap, degrees, sizes, forces) { + const self = this; + const { nodes, preventOverlap, dissuadeHubs, mode, prune } = self; + for (let i = 0; i < esize; i += 1) { + const sourceNode = nodes[edgeEndsIdMap[i].sourceIdx]; + const sourceIdx = edgeEndsIdMap[i].sourceIdx; + const targetNode = nodes[edgeEndsIdMap[i].targetIdx]; + const targetIdx = edgeEndsIdMap[i].targetIdx; + if (prune && (degrees[sourceIdx] <= 1 || degrees[targetIdx] <= 1)) + continue; + const dir = [targetNode.x - sourceNode.x, targetNode.y - sourceNode.y]; + let eucliDis = Math.hypot(dir[0], dir[1]); + eucliDis = eucliDis < 0.0001 ? 0.0001 : eucliDis; + dir[0] = dir[0] / eucliDis; + dir[1] = dir[1] / eucliDis; + if (preventOverlap && iter < prevoIter) + eucliDis = eucliDis - sizes[sourceIdx] - sizes[targetIdx]; + let Fa1 = eucliDis; // tslint:disable-line + let Fa2 = Fa1; // tslint:disable-line + if (mode === 'linlog') { + Fa1 = Math.log(1 + eucliDis); + Fa2 = Fa1; + } + if (dissuadeHubs) { + Fa1 = eucliDis / degrees[sourceIdx]; + Fa2 = eucliDis / degrees[targetIdx]; + } + if (preventOverlap && iter < prevoIter && eucliDis <= 0) { + Fa1 = 0; + Fa2 = 0; + } + else if (preventOverlap && iter < prevoIter && eucliDis > 0) { + Fa1 = eucliDis; + Fa2 = eucliDis; + } + forces[2 * idMap[sourceNode.id]] += Fa1 * dir[0]; + forces[2 * idMap[targetNode.id]] -= Fa2 * dir[0]; + forces[2 * idMap[sourceNode.id] + 1] += Fa1 * dir[1]; + forces[2 * idMap[targetNode.id] + 1] -= Fa2 * dir[1]; + } + return forces; + } + getRepGraForces(iter, prevoIter, forces, krPrime, sizes, degrees) { + const self = this; + const { nodes, preventOverlap, kr, kg, center, prune } = self; + const nodeNum = nodes.length; + for (let i = 0; i < nodeNum; i += 1) { + for (let j = i + 1; j < nodeNum; j += 1) { + if (prune && (degrees[i] <= 1 || degrees[j] <= 1)) + continue; + const dir = [nodes[j].x - nodes[i].x, nodes[j].y - nodes[i].y]; + let eucliDis = Math.hypot(dir[0], dir[1]); + eucliDis = eucliDis < 0.0001 ? 0.0001 : eucliDis; + dir[0] = dir[0] / eucliDis; + dir[1] = dir[1] / eucliDis; + if (preventOverlap && iter < prevoIter) + eucliDis = eucliDis - sizes[i] - sizes[j]; + let Fr = kr * (degrees[i] + 1) * (degrees[j] + 1) / eucliDis; // tslint:disable-line + if (preventOverlap && iter < prevoIter && eucliDis < 0) { + Fr = krPrime * (degrees[i] + 1) * (degrees[j] + 1); + } + else if (preventOverlap && iter < prevoIter && eucliDis === 0) { + Fr = 0; + } + else if (preventOverlap && iter < prevoIter && eucliDis > 0) { + Fr = kr * (degrees[i] + 1) * (degrees[j] + 1) / eucliDis; + } + forces[2 * i] -= Fr * dir[0]; + forces[2 * j] += Fr * dir[0]; + forces[2 * i + 1] -= Fr * dir[1]; + forces[2 * j + 1] += Fr * dir[1]; + } + // gravity + const dir = [nodes[i].x - center[0], nodes[i].y - center[1]]; + const eucliDis = Math.hypot(dir[0], dir[1]); + dir[0] = dir[0] / eucliDis; + dir[1] = dir[1] / eucliDis; + const Fg = kg * (degrees[i] + 1); // tslint:disable-line + forces[2 * i] -= Fg * dir[0]; + forces[2 * i + 1] -= Fg * dir[1]; + } + return forces; + } + getOptRepGraForces(forces, bodies, degrees) { + const self = this; + const { nodes, kg, center, prune } = self; + const nodeNum = nodes.length; + let minx = 9e10; + let maxx = -9e10; + let miny = 9e10; + let maxy = -9e10; + for (let i = 0; i < nodeNum; i += 1) { + if (prune && (degrees[i] <= 1)) + continue; + bodies[i].setPos(nodes[i].x, nodes[i].y); + if (nodes[i].x >= maxx) + maxx = nodes[i].x; + if (nodes[i].x <= minx) + minx = nodes[i].x; + if (nodes[i].y >= maxy) + maxy = nodes[i].y; + if (nodes[i].y <= miny) + miny = nodes[i].y; + } + const width = Math.max(maxx - minx, maxy - miny); + const quadParams = { + xmid: (maxx + minx) / 2, + ymid: (maxy + miny) / 2, + length: width, + massCenter: center, + mass: nodeNum + }; + const quad = new Quad(quadParams); + const quadTree = new QuadTree(quad); + // build the tree, insert the nodes(quads) into the tree + for (let i = 0; i < nodeNum; i += 1) { + if (prune && (degrees[i] <= 1)) + continue; + if (bodies[i].in(quad)) + quadTree.insert(bodies[i]); + } + // update the repulsive forces and the gravity. + for (let i = 0; i < nodeNum; i += 1) { + if (prune && (degrees[i] <= 1)) + continue; + bodies[i].resetForce(); + quadTree.updateForce(bodies[i]); + forces[2 * i] -= bodies[i].fx; + forces[2 * i + 1] -= bodies[i].fy; + // gravity + const dir = [nodes[i].x - center[0], nodes[i].y - center[1]]; + let eucliDis = Math.hypot(dir[0], dir[1]); + eucliDis = eucliDis < 0.0001 ? 0.0001 : eucliDis; + dir[0] = dir[0] / eucliDis; + dir[1] = dir[1] / eucliDis; + const Fg = kg * (degrees[i] + 1); // tslint:disable-line + forces[2 * i] -= Fg * dir[0]; + forces[2 * i + 1] -= Fg * dir[1]; + } + return forces; + } + updatePos(forces, preForces, sg, degrees) { + const self = this; + const { nodes, ks, tao, prune, ksmax } = self; + const nodeNum = nodes.length; + const swgns = []; + const trans = []; + // swg(G) and tra(G) + let swgG = 0; + let traG = 0; + for (let i = 0; i < nodeNum; i += 1) { + if (prune && (degrees[i] <= 1)) + continue; + const minus = [forces[2 * i] - preForces[2 * i], + forces[2 * i + 1] - preForces[2 * i + 1] + ]; + const minusNorm = Math.hypot(minus[0], minus[1]); + const add = [forces[2 * i] + preForces[2 * i], + forces[2 * i + 1] + preForces[2 * i + 1] + ]; + const addNorm = Math.hypot(add[0], add[1]); + swgns[i] = minusNorm; + trans[i] = addNorm / 2; + swgG += (degrees[i] + 1) * swgns[i]; + traG += (degrees[i] + 1) * trans[i]; + } + const preSG = sg; + sg = tao * traG / swgG; // tslint:disable-line + if (preSG !== 0) { + sg = sg > (1.5 * preSG) ? (1.5 * preSG) : sg; // tslint:disable-line + } + // update the node positions + for (let i = 0; i < nodeNum; i += 1) { + if (prune && (degrees[i] <= 1)) + continue; + let sn = ks * sg / (1 + sg * Math.sqrt(swgns[i])); + let absForce = Math.hypot(forces[2 * i], forces[2 * i + 1]); + absForce = absForce < 0.0001 ? 0.0001 : absForce; + const max = ksmax / absForce; + sn = sn > max ? max : sn; + const dnx = sn * forces[2 * i]; + const dny = sn * forces[2 * i + 1]; + nodes[i].x += dnx; + nodes[i].y += dny; + } + return { nodes, sg }; + } +} + +// FIXME +// FOR G6 +// tslint:disable-next-line +const Layouts = new Proxy({}, { + // tslint:disable-line + get: (target, propKey) => { + return getLayoutByName(propKey); + }, + set: (target, propKey, value) => { + registerLayout$1(propKey, value); + return true; + } +}); + +registerLayout$1('grid', GridLayout); +registerLayout$1('random', RandomLayout); +registerLayout$1('force', ForceLayout); +registerLayout$1('circular', CircularLayout); +registerLayout$1('dagre', DagreLayout); +registerLayout$1('radial', RadialLayout); +registerLayout$1('concentric', ConcentricLayout); +registerLayout$1('mds', MDSLayout); +registerLayout$1('fruchterman', FruchtermanLayout); +registerLayout$1('fruchterman-gpu', FruchtermanGPULayout); +registerLayout$1('gForce', GForceLayout); +registerLayout$1('gForce-gpu', GForceGPULayout); +registerLayout$1('comboForce', ComboForceLayout); +registerLayout$1('forceAtlas2', ForceAtlas2Layout); + +var registerLayout = function registerLayout(name, layoutOverride) { + layoutOverride.isCustomLayout = true; + registerLayout$1(name, layoutOverride); +}; + +var WebWorker = +/** @class */ +function () { + function WebWorker(worker, workerScirptURL) { + var code = worker.toString(); + var blob = new Blob(["importScripts('" + workerScirptURL + "');(" + code + ")()"], { + type: 'text/javascript' + }); + return new Worker(URL.createObjectURL(blob)); + } + + return WebWorker; +}(); + +var LayoutWorker = function LayoutWorker(workerScriptURL) { + if (workerScriptURL === void 0) { + workerScriptURL = 'https://unpkg.com/@antv/layout@latest/dist/layout.min.js'; + } + + function workerCode() { + var LAYOUT_MESSAGE = { + // run layout + RUN: 'LAYOUT_RUN', + // layout ended with success + END: 'LAYOUT_END', + // layout error + ERROR: 'LAYOUT_ERROR', + // layout tick, used in force directed layout + TICK: 'LAYOUT_TICK', + GPURUN: 'GPU_LAYOUT_RUN', + GPUEND: 'GPU_LAYOUT_END' + }; // @ts-ignore + + layout.registerLayout('grid', layout.GridLayout); // @ts-ignore + + layout.registerLayout('random', layout.RandomLayout); // @ts-ignore + + layout.registerLayout('force', layout.ForceLayout); // @ts-ignore + + layout.registerLayout('circular', layout.CircularLayout); // @ts-ignore + + layout.registerLayout('dagre', layout.DagreLayout); // @ts-ignore + + layout.registerLayout('radial', layout.RadialLayout); // @ts-ignore + + layout.registerLayout('concentric', layout.ConcentricLayout); // @ts-ignore + + layout.registerLayout('mds', layout.MDSLayout); // @ts-ignore + + layout.registerLayout('fruchterman', layout.FruchtermanLayout); // @ts-ignore + + layout.registerLayout('fruchterman-gpu', layout.FruchtermanGPULayout); // @ts-ignore + + layout.registerLayout('gForce', layout.GForceLayout); // @ts-ignore + + layout.registerLayout('gForce-gpu', layout.GForceGPULayout); // @ts-ignore + + layout.registerLayout('comboForce', layout.ComboForceLayout); // @ts-ignore + + layout.registerLayout('forceAtlas2', layout.ForceAtlas2Layout); + + function isLayoutMessage(event) { + var type = event.data.type; + return type === LAYOUT_MESSAGE.RUN || type === LAYOUT_MESSAGE.GPURUN; + } + + function handleLayoutMessage(event) { + var _this = this; + + var type = event.data.type; + + switch (type) { + case LAYOUT_MESSAGE.RUN: + { + var _a = event.data, + nodes_1 = _a.nodes, + edges = _a.edges, + _b = _a.layoutCfg, + layoutCfg = _b === void 0 ? {} : _b; + var layoutType = layoutCfg.type; // @ts-ignore + + var LayoutClass = layout.getLayoutByName(layoutType); + + if (!LayoutClass) { + this.postMessage({ + type: LAYOUT_MESSAGE.ERROR, + message: "layout " + layoutType + " not found" + }); + break; + } + + var layoutMethod_1; + + layoutCfg.onLayoutEnd = function () { + _this.postMessage({ + type: LAYOUT_MESSAGE.END, + nodes: nodes_1 + }); + + layoutMethod_1 === null || layoutMethod_1 === void 0 ? void 0 : layoutMethod_1.destroy(); + }; + + layoutMethod_1 = new LayoutClass(layoutCfg); + layoutMethod_1.init({ + nodes: nodes_1, + edges: edges + }); + layoutMethod_1.execute(); + break; + } + + case LAYOUT_MESSAGE.GPURUN: + { + var _c = event.data, + nodes = _c.nodes, + edges = _c.edges, + _d = _c.layoutCfg, + layoutCfg = _d === void 0 ? {} : _d, + canvas = _c.canvas; + var layoutType = layoutCfg.type; // @ts-ignore + + var LayoutClass = layout.getLayoutByName(layoutType); + + if (!LayoutClass) { + this.postMessage({ + type: LAYOUT_MESSAGE.ERROR, + message: "layout " + layoutType + " not found" + }); + break; + } + + if (layoutType.split('-')[1] !== 'gpu') { + this.postMessage({ + type: LAYOUT_MESSAGE.ERROR, + message: "layout " + layoutType + " does not support GPU" + }); + break; + } + + var layoutMethod = new LayoutClass(layoutCfg); + layoutMethod.init({ + nodes: nodes, + edges: edges + }); + layoutMethod.executeWithWorker(canvas, this); + break; + } + } + } + + onmessage = function onmessage(event) { + if (isLayoutMessage(event)) { + handleLayoutMessage(event); + } + }; + } + + var layoutWorker = new WebWorker(workerCode, workerScriptURL); + return layoutWorker; +}; + +/** + * @fileoverview constants for layout + * @author changzhe.zb@antfin.com + */ + +/** layout message type */ +var LAYOUT_MESSAGE = { + // run layout + RUN: 'LAYOUT_RUN', + // layout ended with success + END: 'LAYOUT_END', + // layout error + ERROR: 'LAYOUT_ERROR', + // layout tick, used in force directed layout + TICK: 'LAYOUT_TICK', + GPURUN: 'GPU_LAYOUT_RUN', + GPUEND: 'GPU_LAYOUT_END' +}; + +/** + * 调用 gpuDetector.webgl 判断当前浏览器是否支持 webgl。（支持 gpgpu 的浏览器一定也支持 webgl） + */ +var gpuDetector = function gpuDetector() { + if (typeof window === 'undefined' || typeof document === 'undefined') return {}; + return { + canvas: !!window.CanvasRenderingContext2D, + webgl: function () { + try { + var canvas = document.createElement('canvas'); + return !!(window.WebGLRenderingContext && (canvas.getContext('webgl') || canvas.getContext('experimental-webgl'))); + } catch (e) { + return false; + } + }(), + workers: !!window.Worker, + fileapi: window.File && window.FileReader && window.FileList && window.Blob, + getWebGLErrorMessage: function getWebGLErrorMessage() { + var element = document.createElement('div'); + element.id = 'webgl-error-message'; + element.style.fontFamily = 'monospace'; + element.style.fontSize = '13px'; + element.style.fontWeight = 'normal'; + element.style.textAlign = 'center'; + element.style.background = '#fff'; + element.style.color = '#000'; + element.style.padding = '1.5em'; + element.style.width = '400px'; + element.style.margin = '5em auto 0'; + + if (!this.webgl) { + element.innerHTML = window.WebGLRenderingContext ? ['Your graphics card does not seem to support WebGL.
    ', 'Find out how to get it here.'].join('\n') : ['Your browser does not seem to support WebGL.
    ', 'Find out how to get it here.'].join('\n'); + } + + return element; + }, + addGetWebGLMessage: function addGetWebGLMessage(parameters) { + parameters = parameters || {}; + var parent = parameters.parent !== undefined ? parameters.parent : document.body; + var id = parameters.id !== undefined ? parameters.id : 'oldie'; + var element = gpuDetector().getWebGLErrorMessage(); + element.id = id; + parent.appendChild(element); + } + }; +}; + +var GpuUtil = /*#__PURE__*/Object.freeze({ + __proto__: null, + gpuDetector: gpuDetector +}); + +function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); } + +var mockRaf = function mockRaf(cb) { + return setTimeout(cb, 16); +}; + +var mockCaf = function mockCaf(reqId) { + return clearTimeout(reqId); +}; + +var helper = { + // pollyfill + requestAnimationFrame: function requestAnimationFrame(callback) { + var fn = typeof window !== 'undefined' ? window.requestAnimationFrame || window.webkitRequestAnimationFrame || mockRaf : mockRaf; + return fn(callback); + }, + cancelAnimationFrame: function cancelAnimationFrame(requestId) { + var fn = typeof window !== 'undefined' ? window.cancelAnimationFrame || window.webkitCancelAnimationFrame || mockCaf : mockCaf; + return fn(requestId); + } +}; +var GPULayoutNames = ['fruchterman', 'gForce']; +var LayoutPipesAdjustNames = ['force', 'grid', 'circular']; + +var LayoutController = +/** @class */ +function (_super) { + __extends$e(LayoutController, _super); // the configurations of the layout + // private layoutCfg: any; // LayoutOptions + // the type name of the layout + // private layoutType: string; + // private data: GraphData; + // private layoutMethods: typeof Layout; + + + function LayoutController(graph) { + var _this = _super.call(this, graph) || this; + + _this.graph = graph; + _this.layoutCfg = graph.get('layout') || {}; + _this.layoutType = _this.getLayoutType(); + _this.worker = null; + _this.workerData = {}; + + _this.initLayout(); + + return _this; + } // eslint-disable-next-line class-methods-use-this + + + LayoutController.prototype.initLayout = function () {// no data before rendering + }; // get layout worker and create one if not exists + + + LayoutController.prototype.getWorker = function () { + if (this.worker) { + return this.worker; + } + + if (typeof Worker === 'undefined') { + // 如果当前浏览器不支持 web worker，则不使用 web worker + console.warn('Web worker is not supported in current browser.'); + this.worker = null; + } else { + this.worker = LayoutWorker(this.layoutCfg.workerScriptURL); + } + + return this.worker; + }; // stop layout worker + + + LayoutController.prototype.stopWorker = function () { + var workerData = this.workerData; + + if (!this.worker) { + return; + } + + this.worker.terminate(); + this.worker = null; // 重新开始新的布局之前，先取消之前布局的requestAnimationFrame。 + + if (workerData.requestId) { + helper.cancelAnimationFrame(workerData.requestId); + workerData.requestId = null; + } + + if (workerData.requestId2) { + helper.cancelAnimationFrame(workerData.requestId2); + workerData.requestId2 = null; + } + }; + + LayoutController.prototype.execLayoutMethod = function (layoutCfg, order) { + var _this = this; + + return new Promise(function (reslove, reject) { + var graph = _this.graph; + var layoutType = layoutCfg.type; // 每个布局方法都需要注册 + + layoutCfg.onLayoutEnd = function () { + graph.emit('aftersublayout', { + type: layoutType + }); + reslove(); + }; // 若用户指定开启 gpu，且当前浏览器支持 webgl，且该算法存在 GPU 版本（目前仅支持 fruchterman 和 gForce），使用 gpu 版本的布局 + + + if (layoutType && _this.isGPU) { + if (!_this.hasGPUVersion(layoutType)) { + console.warn("The '" + layoutType + "' layout does not support GPU calculation for now, it will run in CPU."); + } else { + layoutType = layoutType + "-gpu"; + } + } + + var isForce = layoutType === 'force' || layoutType === 'g6force' || layoutType === 'gForce'; + + if (isForce) { + var onTick_1 = layoutCfg.onTick; + + var tick = function tick() { + if (onTick_1) { + onTick_1(); + } + + graph.refreshPositions(); + }; + + layoutCfg.tick = tick; + } else if (layoutCfg.type === 'comboForce') { + layoutCfg.comboTrees = graph.get('comboTrees'); + } + + var enableTick = false; + var layoutMethod; + + try { + layoutMethod = new Layouts[layoutType](layoutCfg); + } catch (e) { + console.warn("The layout method: '" + layoutType + "' does not exist! Please specify it first."); + reject(); + } // 是否需要迭代的方式完成布局。这里是来自布局对象的实例属性，是由布局的定义者在布局类定义的。 + + + enableTick = layoutMethod.enableTick; + + if (enableTick) { + var onTick_2 = layoutCfg.onTick; + + var tick = function tick() { + if (onTick_2) { + onTick_2(); + } + + graph.refreshPositions(); + }; + + layoutMethod.tick = tick; + } + + var layoutData = _this.filterLayoutData(_this.data, layoutCfg); + + addLayoutOrder(layoutData, order); + layoutMethod.init(layoutData); // 若存在节点没有位置信息，且没有设置 layout，在 initPositions 中 random 给出了所有节点的位置，不需要再次执行 random 布局 + // 所有节点都有位置信息，且指定了 layout，则执行布局（代表不是第一次进行布局） + + graph.emit('beforesublayout', { + type: layoutType + }); + layoutMethod.execute(); + if (layoutMethod.isCustomLayout && layoutCfg.onLayoutEnd) layoutCfg.onLayoutEnd(); + + _this.layoutMethods.push(layoutMethod); + }); + }; + + LayoutController.prototype.updateLayoutMethod = function (layoutMethod, layoutCfg) { + var _this = this; + + return new Promise(function (reslove, reject) { + var graph = _this.graph; + var layoutType = layoutCfg === null || layoutCfg === void 0 ? void 0 : layoutCfg.type; // 每个布局方法都需要注册 + + layoutCfg.onLayoutEnd = function () { + graph.emit('aftersublayout', { + type: layoutType + }); + reslove(); + }; + + var layoutData = _this.filterLayoutData(_this.data, layoutCfg); + + layoutMethod.init(layoutData); + layoutMethod.updateCfg(layoutCfg); + graph.emit('beforesublayout', { + type: layoutType + }); + layoutMethod.execute(); + if (layoutMethod.isCustomLayout && layoutCfg.onLayoutEnd) layoutCfg.onLayoutEnd(); + }); + }; + /** + * @param {function} success callback + * @return {boolean} 是否使用web worker布局 + */ + + + LayoutController.prototype.layout = function (success) { + var _this = this; + + var graph = this.graph; + this.data = this.setDataFromGraph(); + var _a = this.data, + nodes = _a.nodes, + hiddenNodes = _a.hiddenNodes; + + if (!nodes) { + return false; + } + + var width = graph.get('width'); + var height = graph.get('height'); + var layoutCfg = {}; + Object.assign(layoutCfg, { + width: width, + height: height, + center: [width / 2, height / 2] + }, this.layoutCfg); + this.layoutCfg = layoutCfg; + this.destoryLayoutMethods(); + graph.emit('beforelayout'); + this.initPositions(layoutCfg.center, nodes); // init hidden ndoes + + this.initPositions(layoutCfg.center, hiddenNodes); // 防止用户直接用 -gpu 结尾指定布局 + + var layoutType = layoutCfg.type; + + if (layoutType && layoutType.split('-')[1] === 'gpu') { + layoutType = layoutType.split('-')[0]; + layoutCfg.gpuEnabled = true; + } // 若用户指定开启 gpu，且当前浏览器支持 webgl，且该算法存在 GPU 版本（目前仅支持 fruchterman 和 gForce），使用 gpu 版本的布局 + + + var enableGPU = false; + + if (layoutCfg.gpuEnabled) { + enableGPU = true; // 打开下面语句将会导致 webworker 报找不到 window + + if (!gpuDetector().webgl) { + console.warn("Your browser does not support webGL or GPGPU. The layout will run in CPU."); + enableGPU = false; + } + } + + this.isGPU = enableGPU; // 在 onAllLayoutEnd 中执行用户自定义 onLayoutEnd，触发 afterlayout、更新节点位置、fitView/fitCenter、触发 afterrender + + var onLayoutEnd = layoutCfg.onLayoutEnd, + layoutEndFormatted = layoutCfg.layoutEndFormatted, + adjust = layoutCfg.adjust; + + if (!layoutEndFormatted) { + layoutCfg.layoutEndFormatted = true; + + layoutCfg.onAllLayoutEnd = function () { + return __awaiter$4(_this, void 0, void 0, function () { + return __generator$2(this, function (_a) { + switch (_a.label) { + case 0: + // 执行用户自定义 onLayoutEnd + if (onLayoutEnd) { + onLayoutEnd(); + } // 更新节点位置 + + + this.refreshLayout(); + if (!(adjust && layoutCfg.pipes)) return [3 + /*break*/ + , 2]; + return [4 + /*yield*/ + , this.adjustPipesBox(this.data, adjust)]; + + case 1: + _a.sent(); + + this.refreshLayout(); + _a.label = 2; + + case 2: + // 触发 afterlayout + graph.emit('afterlayout'); + return [2 + /*return*/ + ]; + } + }); + }); + }; + } + + this.stopWorker(); + + if (layoutCfg.workerEnabled && this.layoutWithWorker(this.data)) { + // 如果启用布局web worker并且浏览器支持web worker，用web worker布局。否则回退到不用web worker布局。 + return true; + } + + var start = Promise.resolve(); + + if (layoutCfg.type) { + start = start.then(function () { + return _this.execLayoutMethod(layoutCfg, 0); + }); + } else if (layoutCfg.pipes) { + layoutCfg.pipes.forEach(function (cfg, index) { + start = start.then(function () { + return _this.execLayoutMethod(cfg, index); + }); + }); + } // 最后统一在外部调用onAllLayoutEnd + + + start.then(function () { + if (layoutCfg.onAllLayoutEnd) layoutCfg.onAllLayoutEnd(); // 在执行 execute 后立即执行 success，且在 timeBar 中有 throttle，可以防止 timeBar 监听 afterrender 进行 changeData 后 layout，从而死循环 + // 对于 force 一类布局完成后的 fitView 需要用户自己在 onLayoutEnd 中配置 + + if (success) success(); + }).catch(function (error) { + console.warn('graph layout failed,', error); + }); + return false; + }; + /** + * layout with web worker + * @param {object} data graph data + * @return {boolean} 是否支持web worker + */ + + + LayoutController.prototype.layoutWithWorker = function (data) { + var _this = this; + + var _a = this, + layoutCfg = _a.layoutCfg, + graph = _a.graph; + + var worker = this.getWorker(); // 每次worker message event handler调用之间的共享数据，会被修改。 + + var workerData = this.workerData; + + if (!worker) { + return false; + } + + workerData.requestId = null; + workerData.requestId2 = null; + workerData.currentTick = null; + workerData.currentTickData = null; + graph.emit('beforelayout'); + var start = Promise.resolve(); + + if (layoutCfg.type) { + start = start.then(function () { + return _this.runWebworker(worker, data, layoutCfg); + }); + } else if (layoutCfg.pipes) { + var _loop_1 = function _loop_1(cfg) { + start = start.then(function () { + return _this.runWebworker(worker, data, cfg); + }); + }; + + for (var _i = 0, _b = layoutCfg.pipes; _i < _b.length; _i++) { + var cfg = _b[_i]; + + _loop_1(cfg); + } + } // 最后统一在外部调用onAllLayoutEnd + + + start.then(function () { + if (layoutCfg.onAllLayoutEnd) layoutCfg.onAllLayoutEnd(); + }).catch(function (error) { + console.error('layout failed', error); + }); + return true; + }; + + LayoutController.prototype.runWebworker = function (worker, allData, layoutCfg) { + var _this = this; + + var isGPU = this.isGPU; + var data = this.filterLayoutData(allData, layoutCfg); + var nodes = data.nodes, + edges = data.edges; + var offScreenCanvas = document.createElement('canvas'); + var gpuWorkerAbility = isGPU && typeof window !== 'undefined' && // eslint-disable-next-line @typescript-eslint/dot-notation + window.navigator && !navigator["gpu"] && // WebGPU 还不支持 OffscreenCanvas + 'OffscreenCanvas' in window && 'transferControlToOffscreen' in offScreenCanvas; // NOTE: postMessage的message参数里面不能包含函数，否则postMessage会报错， + // 例如：'function could not be cloned'。 + // 详情参考：https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API/Structured_clone_algorithm + // 所以这里需要把过滤layoutCfg里的函数字段过滤掉。 + + var filteredLayoutCfg = filterObject(layoutCfg, function (value) { + return typeof value !== 'function'; + }); + + if (!gpuWorkerAbility) { + worker.postMessage({ + type: LAYOUT_MESSAGE.RUN, + nodes: nodes, + edges: edges, + layoutCfg: filteredLayoutCfg + }); + } else { + var offscreen = offScreenCanvas.transferControlToOffscreen(); // filteredLayoutCfg.canvas = offscreen; + + filteredLayoutCfg.type = filteredLayoutCfg.type + "-gpu"; + worker.postMessage({ + type: LAYOUT_MESSAGE.GPURUN, + nodes: nodes, + edges: edges, + layoutCfg: filteredLayoutCfg, + canvas: offscreen + }, [offscreen]); + } + + return new Promise(function (reslove, reject) { + worker.onmessage = function (event) { + _this.handleWorkerMessage(reslove, reject, event, data, layoutCfg); + }; + }); + }; // success callback will be called when updating graph positions for the first time. + + + LayoutController.prototype.handleWorkerMessage = function (reslove, reject, event, data, layoutCfg) { + var _a = this, + graph = _a.graph, + workerData = _a.workerData; + + var eventData = event.data; + var type = eventData.type; + + var onTick = function onTick() { + if (layoutCfg.onTick) { + layoutCfg.onTick(); + } + }; + + switch (type) { + case LAYOUT_MESSAGE.TICK: + workerData.currentTick = eventData.currentTick; + workerData.currentTickData = eventData; + + if (!workerData.requestId) { + workerData.requestId = helper.requestAnimationFrame(function requestId() { + updateLayoutPosition(data, eventData); + graph.refreshPositions(); + onTick(); + + if (eventData.currentTick === eventData.totalTicks) { + // 如果是最后一次tick + reslove(); + } else if (workerData.currentTick === eventData.totalTicks) { + // 注意这里workerData.currentTick可能已经不再是前面赋值时候的值了， + // 因为在requestAnimationFrame等待时间里，可能产生新的tick。 + // 如果当前tick不是最后一次tick，并且所有的tick消息都已发出来了，那么需要用最后一次tick的数据再刷新一次。 + workerData.requestId2 = helper.requestAnimationFrame(function requestId2() { + updateLayoutPosition(data, workerData.currentTickData); + graph.refreshPositions(); + workerData.requestId2 = null; + onTick(); + reslove(); + }); + } + + workerData.requestId = null; + }); + } + + break; + + case LAYOUT_MESSAGE.END: + // 如果没有tick消息（非力导布局） + if (workerData.currentTick == null) { + updateLayoutPosition(data, eventData); + reslove(); + } + + break; + + case LAYOUT_MESSAGE.GPUEND: + // 如果没有tick消息（非力导布局） + if (workerData.currentTick == null) { + updateGPUWorkerLayoutPosition(data, eventData); + reslove(); + } + + break; + + case LAYOUT_MESSAGE.ERROR: + console.warn('Web-Worker layout error!', eventData.message); + reject(); + break; + + default: + reject(); + break; + } + }; // 更新布局参数 + + + LayoutController.prototype.updateLayoutCfg = function (cfg) { + var _this = this; + + var _a = this, + graph = _a.graph, + layoutMethods = _a.layoutMethods; + + var layoutCfg = mix({}, this.layoutCfg, cfg); + this.layoutCfg = layoutCfg; + + if (!(layoutMethods === null || layoutMethods === void 0 ? void 0 : layoutMethods.length)) { + this.layout(); + return; + } + + this.data = this.setDataFromGraph(); + this.stopWorker(); + + if (cfg.workerEnabled && this.layoutWithWorker(this.data)) { + // 如果启用布局web worker并且浏览器支持web worker，用web worker布局。否则回退到不用web worker布局。 + return; + } + + graph.emit('beforelayout'); + var start = Promise.resolve(); + + if (layoutMethods.length === 1) { + start = start.then(function () { + return _this.updateLayoutMethod(layoutMethods[0], layoutCfg); + }); + } else { + layoutMethods === null || layoutMethods === void 0 ? void 0 : layoutMethods.forEach(function (layoutMethod, index) { + var currentCfg = layoutCfg.pipes[index]; + start = start.then(function () { + return _this.updateLayoutMethod(layoutMethod, currentCfg); + }); + }); + } + + start.then(function () { + if (layoutCfg.onAllLayoutEnd) layoutCfg.onAllLayoutEnd(); + }).catch(function (error) { + console.warn('layout failed', error); + }); + }; + + LayoutController.prototype.adjustPipesBox = function (data, adjust) { + var _this = this; + + return new Promise(function (resolve) { + var nodes = data.nodes; + + if (!(nodes === null || nodes === void 0 ? void 0 : nodes.length)) { + resolve(); + } + + if (!LayoutPipesAdjustNames.includes(adjust)) { + console.warn("The adjust type " + adjust + " is not supported yet, please assign it with 'force', 'grid', or 'circular'."); + resolve(); + } + + var layoutCfg = { + center: _this.layoutCfg.center, + nodeSize: function nodeSize(d) { + return Math.max(d.height, d.width); + }, + preventOverlap: true, + onLayoutEnd: function onLayoutEnd() {} + }; // 计算出大单元 + + var _a = _this.getLayoutBBox(nodes), + groupNodes = _a.groupNodes, + layoutNodes = _a.layoutNodes; + + var preNodes = clone$7(layoutNodes); // 根据大单元坐标的变化，调整这里面每个小单元nodes + + layoutCfg.onLayoutEnd = function () { + layoutNodes === null || layoutNodes === void 0 ? void 0 : layoutNodes.forEach(function (ele, index) { + var _a, _b, _c; + + var dx = ele.x - ((_a = preNodes[index]) === null || _a === void 0 ? void 0 : _a.x); + var dy = ele.y - ((_b = preNodes[index]) === null || _b === void 0 ? void 0 : _b.y); + (_c = groupNodes[index]) === null || _c === void 0 ? void 0 : _c.forEach(function (n) { + n.x += dx; + n.y += dy; + }); + }); + resolve(); + }; + + var layoutMethod = new Layouts[adjust](layoutCfg); + layoutMethod.layout({ + nodes: layoutNodes + }); + }); + }; + + LayoutController.prototype.hasGPUVersion = function (layoutName) { + var length = GPULayoutNames.length; + + for (var i = 0; i < length; i++) { + if (GPULayoutNames[i] === layoutName) return true; + } + + return false; + }; + + LayoutController.prototype.destroy = function () { + this.destoryLayoutMethods(); + var worker = this.worker; + + if (worker) { + worker.terminate(); + this.worker = null; + } + + this.destroyed = true; + this.graph.set('layout', undefined); + this.layoutCfg = undefined; + this.layoutType = undefined; + this.layoutMethods = undefined; + this.graph = null; + }; + + return LayoutController; +}(LayoutController$1); + +function updateLayoutPosition(data, layoutData) { + var nodes = data.nodes; + var layoutNodes = layoutData.nodes; + var nodeLength = nodes.length; + + for (var i = 0; i < nodeLength; i++) { + var node = nodes[i]; + node.x = layoutNodes[i].x; + node.y = layoutNodes[i].y; + } +} + +function filterObject(collection, callback) { + var result = {}; + + if (collection && _typeof(collection) === 'object') { + Object.keys(collection).forEach(function (key) { + if (collection.hasOwnProperty(key) && callback(collection[key])) { + result[key] = collection[key]; + } + }); + return result; + } + + return collection; +} + +function updateGPUWorkerLayoutPosition(data, layoutData) { + var nodes = data.nodes; + var vertexEdgeData = layoutData.vertexEdgeData; + var nodeLength = nodes.length; + + for (var i = 0; i < nodeLength; i++) { + var node = nodes[i]; + var x = vertexEdgeData[4 * i]; + var y = vertexEdgeData[4 * i + 1]; + node.x = x; + node.y = y; + } +} + +function addLayoutOrder(data, order) { + var _a; + + if (!((_a = data === null || data === void 0 ? void 0 : data.nodes) === null || _a === void 0 ? void 0 : _a.length)) { + return; + } + + var nodes = data.nodes; + nodes.forEach(function (node) { + node.layoutOrder = order; + }); +} + +var transform$4 = transform$6; +var SVG$1 = 'svg'; + +var Graph = +/** @class */ +function (_super) { + __extends$e(Graph, _super); + + function Graph(cfg) { + var _this = _super.call(this, cfg) || this; + + var defaultNode = _this.get('defaultNode'); + + if (!defaultNode) { + _this.set('defaultNode', { + type: 'circle' + }); + } + + if (!defaultNode.type) { + defaultNode.type = 'circle'; + + _this.set('defaultNode', defaultNode); + } + + _this.destroyed = false; + return _this; + } + + Graph.prototype.initLayoutController = function () { + var layoutController = new LayoutController(this); + this.set({ + layoutController: layoutController + }); + }; + + Graph.prototype.initEventController = function () { + var eventController = new EventController(this); + this.set({ + eventController: eventController + }); + }; + + Graph.prototype.initCanvas = function () { + var container = this.get('container'); + + if (typeof container === 'string') { + container = document.getElementById(container); + this.set('container', container); + } + + if (!container) { + throw new Error('invalid container'); + } + + var width = this.get('width'); + var height = this.get('height'); + var renderer = this.get('renderer'); + var canvas; + + if (renderer === SVG$1) { + canvas = new Canvas({ + container: container, + width: width, + height: height + }); + } else { + var canvasCfg = { + container: container, + width: width, + height: height + }; + var pixelRatio = this.get('pixelRatio'); + + if (pixelRatio) { + canvasCfg.pixelRatio = pixelRatio; + } + + canvas = new Canvas$1(canvasCfg); + } + + this.set('canvas', canvas); + }; + + Graph.prototype.initPlugins = function () { + var self = this; + each$2(self.get('plugins'), function (plugin) { + if (!plugin.destroyed && plugin.initPlugin) { + plugin.initPlugin(self); + } + }); + }; + /** + * 返回可见区域的图的 dataUrl，用于生成图片 + * @param {String} type 图片类型，可选值："image/png" | "image/jpeg" | "image/webp" | "image/bmp" + * @param {string} backgroundColor 图片背景色 + * @return {string} 图片 dataURL + */ + + + Graph.prototype.toDataURL = function (type, backgroundColor) { + var canvas = this.get('canvas'); + var renderer = canvas.getRenderer(); + var canvasDom = canvas.get('el'); + if (!type) type = 'image/png'; + var dataURL = ''; + + if (renderer === 'svg') { + var cloneNode = canvasDom.cloneNode(true); + var svgDocType = document.implementation.createDocumentType('svg', '-//W3C//DTD SVG 1.1//EN', 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'); + var svgDoc = document.implementation.createDocument('http://www.w3.org/2000/svg', 'svg', svgDocType); + svgDoc.replaceChild(cloneNode, svgDoc.documentElement); + var svgData = new XMLSerializer().serializeToString(svgDoc); + dataURL = "data:image/svg+xml;charset=utf8," + encodeURIComponent(svgData); + } else { + var imageData = void 0; + var context = canvasDom.getContext('2d'); + var width = this.get('width'); + var height = this.get('height'); + var compositeOperation = void 0; + + if (backgroundColor) { + var pixelRatio = typeof window !== 'undefined' ? window.devicePixelRatio : 1; + imageData = context.getImageData(0, 0, width * pixelRatio, height * pixelRatio); + compositeOperation = context.globalCompositeOperation; + context.globalCompositeOperation = 'destination-over'; + context.fillStyle = backgroundColor; + context.fillRect(0, 0, width, height); + } + + dataURL = canvasDom.toDataURL(type); + + if (backgroundColor) { + context.clearRect(0, 0, width, height); + context.putImageData(imageData, 0, 0); + context.globalCompositeOperation = compositeOperation; + } + } + + return dataURL; + }; + /** + * 返回整个图（包括超出可见区域的部分）的 dataUrl，用于生成图片 + * @param {Function} callback 异步生成 dataUrl 完成后的回调函数，在这里处理生成的 dataUrl 字符串 + * @param {String} type 图片类型，可选值："image/png" | "image/jpeg" | "image/webp" | "image/bmp" + * @param {Object} imageConfig 图片配置项，包括背景色和上下左右的 padding + */ + + + Graph.prototype.toFullDataURL = function (callback, type, imageConfig) { + var bbox = this.get('group').getCanvasBBox(); + var height = bbox.height; + var width = bbox.width; + var renderer = this.get('renderer'); + var vContainerDOM = createDom$1(''); + var backgroundColor = imageConfig ? imageConfig.backgroundColor : undefined; + var padding = imageConfig ? imageConfig.padding : undefined; + if (!padding) padding = [0, 0, 0, 0];else if (isNumber$4(padding)) padding = [padding, padding, padding, padding]; + var vHeight = height + padding[0] + padding[2]; + var vWidth = width + padding[1] + padding[3]; + var canvasOptions = { + container: vContainerDOM, + height: vHeight, + width: vWidth, + quickHit: true + }; + var vCanvas = renderer === 'svg' ? new Canvas(canvasOptions) : new Canvas$1(canvasOptions); + var group = this.get('group'); + var vGroup = group.clone(); + var matrix = clone$7(vGroup.getMatrix()); + if (!matrix) matrix = [1, 0, 0, 0, 1, 0, 0, 0, 1]; + var centerX = (bbox.maxX + bbox.minX) / 2; + var centerY = (bbox.maxY + bbox.minY) / 2; + matrix = transform$4(matrix, [['t', -centerX, -centerY], ['t', width / 2 + padding[3], height / 2 + padding[0]]]); + vGroup.resetMatrix(); + vGroup.setMatrix(matrix); + vCanvas.add(vGroup); + var vCanvasEl = vCanvas.get('el'); + var dataURL = ''; + if (!type) type = 'image/png'; + setTimeout(function () { + if (renderer === 'svg') { + var cloneNode = vCanvasEl.cloneNode(true); + var svgDocType = document.implementation.createDocumentType('svg', '-//W3C//DTD SVG 1.1//EN', 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'); + var svgDoc = document.implementation.createDocument('http://www.w3.org/2000/svg', 'svg', svgDocType); + svgDoc.replaceChild(cloneNode, svgDoc.documentElement); + var svgData = new XMLSerializer().serializeToString(svgDoc); + dataURL = "data:image/svg+xml;charset=utf8," + encodeURIComponent(svgData); + } else { + var imageData = void 0; + var context = vCanvasEl.getContext('2d'); + var compositeOperation = void 0; + + if (backgroundColor) { + var pixelRatio = typeof window !== 'undefined' ? window.devicePixelRatio : 1; + imageData = context.getImageData(0, 0, vWidth * pixelRatio, vHeight * pixelRatio); + compositeOperation = context.globalCompositeOperation; + context.globalCompositeOperation = 'destination-over'; + context.fillStyle = backgroundColor; + context.fillRect(0, 0, vWidth, vHeight); + } + + dataURL = vCanvasEl.toDataURL(type); + + if (backgroundColor) { + context.clearRect(0, 0, vWidth, vHeight); + context.putImageData(imageData, 0, 0); + context.globalCompositeOperation = compositeOperation; + } + } + + if (callback) callback(dataURL); + }, 16); + }; + /** + * 导出包含全图的图片 + * @param {String} name 图片的名称 + * @param {String} type 图片类型，可选值："image/png" | "image/jpeg" | "image/webp" | "image/bmp" + * @param {Object} imageConfig 图片配置项，包括背景色和上下左右的 padding + */ + + + Graph.prototype.downloadFullImage = function (name, type, imageConfig) { + var _this = this; + + var bbox = this.get('group').getCanvasBBox(); + var height = bbox.height; + var width = bbox.width; + var renderer = this.get('renderer'); + var vContainerDOM = createDom$1(''); + var backgroundColor = imageConfig ? imageConfig.backgroundColor : undefined; + var padding = imageConfig ? imageConfig.padding : undefined; + if (!padding) padding = [0, 0, 0, 0];else if (isNumber$4(padding)) padding = [padding, padding, padding, padding]; + var vHeight = height + padding[0] + padding[2]; + var vWidth = width + padding[1] + padding[3]; + var canvasOptions = { + container: vContainerDOM, + height: vHeight, + width: vWidth + }; + var vCanvas = renderer === 'svg' ? new Canvas(canvasOptions) : new Canvas$1(canvasOptions); + var group = this.get('group'); + var vGroup = group.clone(); + var matrix = clone$7(vGroup.getMatrix()); + if (!matrix) matrix = [1, 0, 0, 0, 1, 0, 0, 0, 1]; + var centerX = (bbox.maxX + bbox.minX) / 2; + var centerY = (bbox.maxY + bbox.minY) / 2; + matrix = transform$4(matrix, [['t', -centerX, -centerY], ['t', width / 2 + padding[3], height / 2 + padding[0]]]); + vGroup.resetMatrix(); + vGroup.setMatrix(matrix); + vCanvas.add(vGroup); + var vCanvasEl = vCanvas.get('el'); + if (!type) type = 'image/png'; + setTimeout(function () { + var dataURL = ''; + + if (renderer === 'svg') { + var cloneNode = vCanvasEl.cloneNode(true); + var svgDocType = document.implementation.createDocumentType('svg', '-//W3C//DTD SVG 1.1//EN', 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'); + var svgDoc = document.implementation.createDocument('http://www.w3.org/2000/svg', 'svg', svgDocType); + svgDoc.replaceChild(cloneNode, svgDoc.documentElement); + var svgData = new XMLSerializer().serializeToString(svgDoc); + dataURL = "data:image/svg+xml;charset=utf8," + encodeURIComponent(svgData); + } else { + var imageData = void 0; + var context = vCanvasEl.getContext('2d'); + var compositeOperation = void 0; + + if (backgroundColor) { + var pixelRatio = typeof window !== 'undefined' ? window.devicePixelRatio : 1; + imageData = context.getImageData(0, 0, vWidth * pixelRatio, vHeight * pixelRatio); + compositeOperation = context.globalCompositeOperation; + context.globalCompositeOperation = 'destination-over'; + context.fillStyle = backgroundColor; + context.fillRect(0, 0, vWidth, vHeight); + } + + dataURL = vCanvasEl.toDataURL(type); + + if (backgroundColor) { + context.clearRect(0, 0, vWidth, vHeight); + context.putImageData(imageData, 0, 0); + context.globalCompositeOperation = compositeOperation; + } + } + + var link = document.createElement('a'); + var fileName = (name || 'graph') + (renderer === 'svg' ? '.svg' : "." + type.split('/')[1]); + + _this.dataURLToImage(dataURL, renderer, link, fileName); + + var e = document.createEvent('MouseEvents'); + e.initEvent('click', false, false); + link.dispatchEvent(e); + }, 16); + }; + /** + * 画布导出图片，图片仅包含画布可见区域部分内容 + * @param {String} name 图片的名称 + * @param {String} type 图片类型，可选值："image/png" | "image/jpeg" | "image/webp" | "image/bmp" + * @param {string} backgroundColor 图片背景色 + */ + + + Graph.prototype.downloadImage = function (name, type, backgroundColor) { + var _this = this; + + var self = this; + + if (self.isAnimating()) { + self.stopAnimate(); + } + + var canvas = self.get('canvas'); + var renderer = canvas.getRenderer(); + if (!type) type = 'image/png'; + var fileName = (name || 'graph') + (renderer === 'svg' ? '.svg' : type.split('/')[1]); + var link = document.createElement('a'); + setTimeout(function () { + var dataURL = self.toDataURL(type, backgroundColor); + + _this.dataURLToImage(dataURL, renderer, link, fileName); + + var e = document.createEvent('MouseEvents'); + e.initEvent('click', false, false); + link.dispatchEvent(e); + }, 16); + }; + + Graph.prototype.dataURLToImage = function (dataURL, renderer, link, fileName) { + if (typeof window !== 'undefined') { + if (window.Blob && window.URL && renderer !== 'svg') { + var arr = dataURL.split(','); + var mime = ''; + + if (arr && arr.length > 0) { + var match = arr[0].match(/:(.*?);/); // eslint-disable-next-line prefer-destructuring + + if (match && match.length >= 2) mime = match[1]; + } + + var bstr = atob(arr[1]); + var n = bstr.length; + var u8arr = new Uint8Array(n); + + while (n--) { + u8arr[n] = bstr.charCodeAt(n); + } + + var blobObj_1 = new Blob([u8arr], { + type: mime + }); + + if (window.navigator.msSaveBlob) { + window.navigator.msSaveBlob(blobObj_1, fileName); + } else { + link.addEventListener('click', function () { + link.download = fileName; + link.href = window.URL.createObjectURL(blobObj_1); + }); + } + } else { + link.addEventListener('click', function () { + link.download = fileName; + link.href = dataURL; + }); + } + } + }; + /** + * 添加插件 + * @param {object} plugin 插件实例 + */ + + + Graph.prototype.addPlugin = function (plugin) { + var self = this; + + if (plugin.destroyed) { + return; + } + + self.get('plugins').push(plugin); + plugin.initPlugin(self); + }; + /** + * 添加插件 + * @param {object} plugin 插件实例 + */ + + + Graph.prototype.removePlugin = function (plugin) { + var plugins = this.get('plugins'); + var index = plugins.indexOf(plugin); + + if (index >= 0) { + plugin.destroyPlugin(); + plugins.splice(index, 1); + } + }; + /** + * 设置图片水印 + * @param {string} imgURL 图片水印的url地址 + * @param {WaterMarkerConfig} config 文本水印的配置项 + */ + + + Graph.prototype.setImageWaterMarker = function (imgURL, config) { + if (imgURL === void 0) { + imgURL = Global.waterMarkerImage; + } + + var container = this.get('container'); + + if (isString$3(container)) { + container = document.getElementById(container); + } + + if (!container.style.position) { + container.style.position = 'relative'; + } + + var canvas = this.get('graphWaterMarker'); + var waterMarkerConfig = deepMix({}, Global.imageWaterMarkerConfig, config); + var width = waterMarkerConfig.width, + height = waterMarkerConfig.height, + compatible = waterMarkerConfig.compatible, + image = waterMarkerConfig.image; + + if (!canvas) { + var canvasCfg = { + container: container, + width: width, + height: height, + capture: false + }; + var pixelRatio = this.get('pixelRatio'); + + if (pixelRatio) { + canvasCfg.pixelRatio = pixelRatio; + } + + canvas = new Canvas$1(canvasCfg); + this.set('graphWaterMarker', canvas); + } + + canvas.get('el').style.display = 'none'; + var ctx = canvas.get('context'); + var rotate = image.rotate, + x = image.x, + y = image.y; // 旋转20度 + + ctx.rotate(-rotate * Math.PI / 180); + var img = new Image(); + img.crossOrigin = 'anonymous'; + img.src = imgURL; + + img.onload = function () { + ctx.drawImage(img, x, y, image.width, image.height); // 恢复旋转角度 + + ctx.rotate(rotate * Math.PI / 180); // 默认按照现代浏览器处理 + + if (!compatible) { + var box = document.querySelector('.g6-graph-watermarker'); + + if (!box) { + box = document.createElement('div'); + box.className = 'g6-graph-watermarker'; + } + + box.className = 'g6-graph-watermarker'; + + if (!canvas.destroyed) { + box.style.cssText = "background-image: url(" + canvas.get('el').toDataURL('image/png') + ");background-repeat:repeat;position:absolute;top:0;bottom:0;left:0;right:0;pointer-events:none;z-index:-1;"; + container.appendChild(box); + } + } else { + // 当需要兼容不支持 pointer-events属性的浏览器时，将 compatible 设置为 true + container.style.cssText = "background-image: url(" + canvas.get('el').toDataURL('image/png') + ");background-repeat:repeat;"; + } + }; + }; + /** + * 设置文本水印 + * @param {string[]} texts 水印的文本内容 + * @param {WaterMarkerConfig} config 文本水印的配置项 + */ + + + Graph.prototype.setTextWaterMarker = function (texts, config) { + var container = this.get('container'); + + if (isString$3(container)) { + container = document.getElementById(container); + } + + if (!container.style.position) { + container.style.position = 'relative'; + } + + var canvas = this.get('graphWaterMarker'); + var waterMarkerConfig = deepMix({}, Global.textWaterMarkerConfig, config); + var width = waterMarkerConfig.width, + height = waterMarkerConfig.height, + compatible = waterMarkerConfig.compatible, + text = waterMarkerConfig.text; + + if (!canvas) { + var canvasCfg = { + container: container, + width: width, + height: height, + capture: false + }; + var pixelRatio = this.get('pixelRatio'); + + if (pixelRatio) { + canvasCfg.pixelRatio = pixelRatio; + } + + canvas = new Canvas$1(canvasCfg); + this.set('graphWaterMarker', canvas); + } + + canvas.get('el').style.display = 'none'; + var ctx = canvas.get('context'); + var rotate = text.rotate, + fill = text.fill, + fontFamily = text.fontFamily, + fontSize = text.fontSize, + baseline = text.baseline, + x = text.x, + y = text.y, + lineHeight = text.lineHeight; // 旋转20度 + + ctx.rotate(-rotate * Math.PI / 180); // 设置文字样式 + + ctx.font = fontSize + "px " + fontFamily; // 设置文字颜色 + + ctx.fillStyle = fill; + ctx.textBaseline = baseline; + + for (var i = texts.length - 1; i >= 0; i--) { + // 将文字绘制到画布 + ctx.fillText(texts[i], x, y + i * lineHeight); + } // 恢复旋转角度 + + + ctx.rotate(rotate * Math.PI / 180); // 默认按照现代浏览器处理 + + if (!compatible) { + var box = document.querySelector('.g6-graph-watermarker'); + + if (!box) { + box = document.createElement('div'); + box.className = 'g6-graph-watermarker'; + } + + box.style.cssText = "background-image: url(" + canvas.get('el').toDataURL('image/png') + ");background-repeat:repeat;position:absolute;top:0;bottom:0;left:0;right:0;pointer-events:none;z-index:99;"; + container.appendChild(box); + } else { + // 当需要兼容不支持 pointer-events属性的浏览器时，将 compatible 设置为 true + container.style.cssText = "background-image: url(" + canvas.get('el').toDataURL('image/png') + ");background-repeat:repeat;"; + } + }; + /** + * 销毁画布 + */ + + + Graph.prototype.destroy = function () { + each$2(this.get('plugins'), function (plugin) { + plugin.destroyPlugin(); + }); // destroy tooltip doms, removed when upgrade G6 4.0 + + var tooltipDOMs = this.get('tooltips'); + + if (tooltipDOMs) { + for (var i = 0; i < tooltipDOMs.length; i++) { + var container = tooltipDOMs[i]; + if (!container) continue; + var parent_1 = container.parentElement; + if (!parent_1) continue; + parent_1.removeChild(container); + } + } + + this.get('eventController').destroy(); + this.get('layoutController').destroy(); // this.get('eventController').destroy(); + // this.get('itemController').destroy(); + // this.get('modeController').destroy(); + // this.get('viewController').destroy(); + // this.get('stateController').destroy(); + // this.get('canvas').destroy(); + + if (this.get('graphWaterMarker')) { + this.get('graphWaterMarker').destroy(); + } + + if (document.querySelector('.g6-graph-watermarker')) { + document.querySelector('.g6-graph-watermarker').remove(); + } + + _super.prototype.destroy.call(this); + }; + + return Graph; +}(AbstractGraph); + +var hierarchy = {exports: {}}; + +(function (module, exports) { +(function webpackUniversalModuleDefinition(root, factory) { + module.exports = factory(); +})(typeof self !== 'undefined' ? self : commonjsGlobal, function() { +return /******/ (function(modules) { // webpackBootstrap +/******/ // The module cache +/******/ var installedModules = {}; +/******/ +/******/ // The require function +/******/ function __webpack_require__(moduleId) { +/******/ +/******/ // Check if module is in cache +/******/ if(installedModules[moduleId]) { +/******/ return installedModules[moduleId].exports; +/******/ } +/******/ // Create a new module (and put it into the cache) +/******/ var module = installedModules[moduleId] = { +/******/ i: moduleId, +/******/ l: false, +/******/ exports: {} +/******/ }; +/******/ +/******/ // Execute the module function +/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); +/******/ +/******/ // Flag the module as loaded +/******/ module.l = true; +/******/ +/******/ // Return the exports of the module +/******/ return module.exports; +/******/ } +/******/ +/******/ +/******/ // expose the modules object (__webpack_modules__) +/******/ __webpack_require__.m = modules; +/******/ +/******/ // expose the module cache +/******/ __webpack_require__.c = installedModules; +/******/ +/******/ // define getter function for harmony exports +/******/ __webpack_require__.d = function(exports, name, getter) { +/******/ if(!__webpack_require__.o(exports, name)) { +/******/ Object.defineProperty(exports, name, { +/******/ configurable: false, +/******/ enumerable: true, +/******/ get: getter +/******/ }); +/******/ } +/******/ }; +/******/ +/******/ // getDefaultExport function for compatibility with non-harmony modules +/******/ __webpack_require__.n = function(module) { +/******/ var getter = module && module.__esModule ? +/******/ function getDefault() { return module['default']; } : +/******/ function getModuleExports() { return module; }; +/******/ __webpack_require__.d(getter, 'a', getter); +/******/ return getter; +/******/ }; +/******/ +/******/ // Object.prototype.hasOwnProperty.call +/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); }; +/******/ +/******/ // __webpack_public_path__ +/******/ __webpack_require__.p = ""; +/******/ +/******/ // Load entry module and return exports +/******/ return __webpack_require__(__webpack_require__.s = 31); +/******/ }) +/************************************************************************/ +/******/ ([ +/* 0 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_type__ = __webpack_require__(4); + +/* harmony default export */ __webpack_exports__["a"] = (function (value) { + return Array.isArray ? Array.isArray(value) : Object(__WEBPACK_IMPORTED_MODULE_0__is_type__["a" /* default */])(value, 'Array'); +}); + +/***/ }), +/* 1 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +var isArrayLike = function (value) { + /** + * isArrayLike([1, 2, 3]) => true + * isArrayLike(document.body.children) => true + * isArrayLike('abc') => true + * isArrayLike(Function) => false + */ + return value !== null && typeof value !== 'function' && isFinite(value.length); +}; + +/* harmony default export */ __webpack_exports__["a"] = (isArrayLike); + +/***/ }), +/* 2 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_array__ = __webpack_require__(0); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__is_object__ = __webpack_require__(13); + + + +function each(elements, func) { + if (!elements) { + return; + } + + var rst; + + if (Object(__WEBPACK_IMPORTED_MODULE_0__is_array__["a" /* default */])(elements)) { + for (var i = 0, len = elements.length; i < len; i++) { + rst = func(elements[i], i); + + if (rst === false) { + break; + } + } + } else if (Object(__WEBPACK_IMPORTED_MODULE_1__is_object__["a" /* default */])(elements)) { + for (var k in elements) { + if (elements.hasOwnProperty(k)) { + rst = func(elements[k], k); + + if (rst === false) { + break; + } + } + } + } +} + +/* harmony default export */ __webpack_exports__["a"] = (each); + +/***/ }), +/* 3 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_type__ = __webpack_require__(4); +/** + * 是否为函数 + * @param {*} fn 对象 + * @return {Boolean} 是否函数 + */ + +/* harmony default export */ __webpack_exports__["a"] = (function (value) { + return Object(__WEBPACK_IMPORTED_MODULE_0__is_type__["a" /* default */])(value, 'Function'); +}); + +/***/ }), +/* 4 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +var toString = {}.toString; + +var isType = function (value, type) { + return toString.call(value) === '[object ' + type + ']'; +}; + +/* harmony default export */ __webpack_exports__["a"] = (isType); + +/***/ }), +/* 5 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_type__ = __webpack_require__(4); +/** + * 判断是否数字 + * @return {Boolean} 是否数字 + */ + + +var isNumber = function (value) { + return Object(__WEBPACK_IMPORTED_MODULE_0__is_type__["a" /* default */])(value, 'Number'); +}; + +/* harmony default export */ __webpack_exports__["a"] = (isNumber); + +/***/ }), +/* 6 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +// isFinite, +var isNil = function (value) { + /** + * isNil(null) => true + * isNil() => true + */ + return value === null || value === undefined; +}; + +/* harmony default export */ __webpack_exports__["a"] = (isNil); + +/***/ }), +/* 7 */ +/***/ (function(module, exports, __webpack_require__) { + +var _require = __webpack_require__(33), + mix = _require.mix; + +module.exports = { + assign: mix +}; + +/***/ }), +/* 8 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_type__ = __webpack_require__(4); + +/* harmony default export */ __webpack_exports__["a"] = (function (str) { + return Object(__WEBPACK_IMPORTED_MODULE_0__is_type__["a" /* default */])(str, 'String'); +}); + +/***/ }), +/* 9 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_object_like__ = __webpack_require__(15); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__is_type__ = __webpack_require__(4); + + + +var isPlainObject = function (value) { + /** + * isObjectLike(new Foo) => false + * isObjectLike([1, 2, 3]) => false + * isObjectLike({ x: 0, y: 0 }) => true + * isObjectLike(Object.create(null)) => true + */ + if (!Object(__WEBPACK_IMPORTED_MODULE_0__is_object_like__["a" /* default */])(value) || !Object(__WEBPACK_IMPORTED_MODULE_1__is_type__["a" /* default */])(value, 'Object')) { + return false; + } + + if (Object.getPrototypeOf(value) === null) { + return true; + } + + var proto = value; + + while (Object.getPrototypeOf(proto) !== null) { + proto = Object.getPrototypeOf(proto); + } + + return Object.getPrototypeOf(value) === proto; +}; + +/* harmony default export */ __webpack_exports__["a"] = (isPlainObject); + +/***/ }), +/* 10 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_nil__ = __webpack_require__(6); + +/* harmony default export */ __webpack_exports__["a"] = (function (value) { + if (Object(__WEBPACK_IMPORTED_MODULE_0__is_nil__["a" /* default */])(value)) return ''; + return value.toString(); +}); + +/***/ }), +/* 11 */ +/***/ (function(module, exports, __webpack_require__) { + +var hierarchy = __webpack_require__(18); + +var Layout = /*#__PURE__*/function () { + function Layout(root, options) { + if (options === void 0) { + options = {}; + } + + var me = this; + me.options = options; + me.rootNode = hierarchy(root, options); + } + + var _proto = Layout.prototype; + + _proto.execute = function execute() { + throw new Error('please override this method'); + }; + + return Layout; +}(); + +module.exports = Layout; + +/***/ }), +/* 12 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_array_like__ = __webpack_require__(1); + + +var contains = function (arr, value) { + if (!Object(__WEBPACK_IMPORTED_MODULE_0__is_array_like__["a" /* default */])(arr)) { + return false; + } + + return arr.indexOf(value) > -1; +}; + +/* harmony default export */ __webpack_exports__["a"] = (contains); + +/***/ }), +/* 13 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony default export */ __webpack_exports__["a"] = (function (value) { + /** + * isObject({}) => true + * isObject([1, 2, 3]) => true + * isObject(Function) => true + * isObject(null) => false + */ + var type = typeof value; + return value !== null && type === 'object' || type === 'function'; +}); + +/***/ }), +/* 14 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__each__ = __webpack_require__(2); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__is_array_like__ = __webpack_require__(1); + + + +var filter = function (arr, func) { + if (!Object(__WEBPACK_IMPORTED_MODULE_1__is_array_like__["a" /* default */])(arr)) { + return arr; + } + + var result = []; + Object(__WEBPACK_IMPORTED_MODULE_0__each__["a" /* default */])(arr, function (value, index) { + if (func(value, index)) { + result.push(value); + } + }); + return result; +}; + +/* harmony default export */ __webpack_exports__["a"] = (filter); + +/***/ }), +/* 15 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +var isObjectLike = function (value) { + /** + * isObjectLike({}) => true + * isObjectLike([1, 2, 3]) => true + * isObjectLike(Function) => false + * isObjectLike(null) => false + */ + return typeof value === 'object' && value !== null; +}; + +/* harmony default export */ __webpack_exports__["a"] = (isObjectLike); + +/***/ }), +/* 16 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony export (immutable) */ __webpack_exports__["a"] = mix; +// FIXME: Mutable param should be forbidden in static lang. +function _mix(dist, obj) { + for (var key in obj) { + if (obj.hasOwnProperty(key) && key !== 'constructor' && obj[key] !== undefined) { + dist[key] = obj[key]; + } + } +} + +function mix(dist, src1, src2, src3) { + if (src1) _mix(dist, src1); + if (src2) _mix(dist, src2); + if (src3) _mix(dist, src3); + return dist; +} + +/***/ }), +/* 17 */ +/***/ (function(module, exports, __webpack_require__) { + +var separateTree = __webpack_require__(30); + +var VALID_DIRECTIONS = ['LR', // left to right +'RL', // right to left +'TB', // top to bottom +'BT', // bottom to top +'H', // horizontal +'V' // vertical +]; +var HORIZONTAL_DIRECTIONS = ['LR', 'RL', 'H']; + +var isHorizontal = function isHorizontal(direction) { + return HORIZONTAL_DIRECTIONS.indexOf(direction) > -1; +}; + +var DEFAULT_DIRECTION = VALID_DIRECTIONS[0]; + +module.exports = function (root, options, layoutAlgrithm) { + var direction = options.direction || DEFAULT_DIRECTION; + options.isHorizontal = isHorizontal(direction); + + if (direction && VALID_DIRECTIONS.indexOf(direction) === -1) { + throw new TypeError("Invalid direction: " + direction); + } + + if (direction === VALID_DIRECTIONS[0]) { + // LR + layoutAlgrithm(root, options); + } else if (direction === VALID_DIRECTIONS[1]) { + // RL + layoutAlgrithm(root, options); + root.right2left(); + } else if (direction === VALID_DIRECTIONS[2]) { + // TB + layoutAlgrithm(root, options); + } else if (direction === VALID_DIRECTIONS[3]) { + // BT + layoutAlgrithm(root, options); + root.bottom2top(); + } else if (direction === VALID_DIRECTIONS[4] || direction === VALID_DIRECTIONS[5]) { + // H or V + // separate into left and right trees + var _separateTree = separateTree(root, options), + left = _separateTree.left, + right = _separateTree.right; // do layout for left and right trees + + + layoutAlgrithm(left, options); + layoutAlgrithm(right, options); + options.isHorizontal ? left.right2left() : left.bottom2top(); // combine left and right trees + + right.translate(left.x - right.x, left.y - right.y); // translate root + + root.x = left.x; + root.y = right.y; + var bb = root.getBoundingBox(); + + if (options.isHorizontal) { + if (bb.top < 0) { + root.translate(0, -bb.top); + } + } else { + if (bb.left < 0) { + root.translate(-bb.left, 0); + } + } + } // fixed root position, default value is true + + + var fixedRoot = options.fixedRoot; + if (fixedRoot === undefined) fixedRoot = true; + + if (fixedRoot) { + root.translate(-(root.x + root.width / 2 + root.hgap), -(root.y + root.height / 2 + root.vgap)); + } + + return root; +}; + +/***/ }), +/* 18 */ +/***/ (function(module, exports, __webpack_require__) { + +/* eslint-disable no-cond-assign */ +var util = __webpack_require__(7); + +var PEM = 18; +var DEFAULT_HEIGHT = PEM * 2; +var DEFAULT_GAP = PEM; +var DEFAULT_OPTIONS = { + getId: function getId(d) { + return d.id || d.name; + }, + getPreH: function getPreH(d) { + return d.preH || 0; + }, + getPreV: function getPreV(d) { + return d.preV || 0; + }, + getHGap: function getHGap(d) { + return d.hgap || DEFAULT_GAP; + }, + getVGap: function getVGap(d) { + return d.vgap || DEFAULT_GAP; + }, + getChildren: function getChildren(d) { + return d.children; + }, + getHeight: function getHeight(d) { + return d.height || DEFAULT_HEIGHT; + }, + getWidth: function getWidth(d) { + var label = d.label || ' '; + return d.width || label.split('').length * PEM; // FIXME DO NOT get width like this + } +}; + +function Node(data, options) { + var me = this; + me.vgap = me.hgap = 0; + if (data instanceof Node) return data; + me.data = data; + /* + * Gaps: filling space between nodes + * (x, y) ---------------------- + * | vgap | + * | -------------------- h + * | h | | e + * | g | | i + * | a | | g + * | p | | h + * | --------------------- t + * | | + * -----------width------------ + */ + + var hgap = options.getHGap(data); + var vgap = options.getVGap(data); + me.preH = options.getPreH(data); + me.preV = options.getPreV(data); + me.width = options.getWidth(data); + me.height = options.getHeight(data); + me.width += me.preH; + me.height += me.preV; + me.id = options.getId(data); + me.x = me.y = 0; + me.depth = 0; + + if (!me.children) { + me.children = []; + } + + me.addGap(hgap, vgap); + return me; +} + +util.assign(Node.prototype, { + isRoot: function isRoot() { + return this.depth === 0; + }, + isLeaf: function isLeaf() { + return this.children.length === 0; + }, + addGap: function addGap(hgap, vgap) { + var me = this; + me.hgap += hgap; + me.vgap += vgap; + me.width += 2 * hgap; + me.height += 2 * vgap; + }, + eachNode: function eachNode(callback) { + // Depth First traverse + var me = this; + var nodes = [me]; + var current; + + while (current = nodes.shift()) { + callback(current); + nodes = current.children.concat(nodes); + } + }, + DFTraverse: function DFTraverse(callback) { + // Depth First traverse + this.eachNode(callback); + }, + BFTraverse: function BFTraverse(callback) { + // Breadth First traverse + var me = this; + var nodes = [me]; + var current; + + while (current = nodes.shift()) { + callback(current); + nodes = nodes.concat(current.children); + } + }, + getBoundingBox: function getBoundingBox() { + // BBox for just one tree node + var bb = { + left: Number.MAX_VALUE, + top: Number.MAX_VALUE, + width: 0, + height: 0 + }; + this.eachNode(function (node) { + bb.left = Math.min(bb.left, node.x); + bb.top = Math.min(bb.top, node.y); + bb.width = Math.max(bb.width, node.x + node.width); + bb.height = Math.max(bb.height, node.y + node.height); + }); + return bb; + }, + // translate + translate: function translate(tx, ty) { + if (tx === void 0) { + tx = 0; + } + + if (ty === void 0) { + ty = 0; + } + + this.eachNode(function (node) { + node.x += tx; + node.y += ty; + node.x += node.preH; + node.y += node.preV; + }); + }, + right2left: function right2left() { + var me = this; + var bb = me.getBoundingBox(); + me.eachNode(function (node) { + node.x = node.x - (node.x - bb.left) * 2 - node.width; // node.x = - node.x; + }); + me.translate(bb.width, 0); + }, + bottom2top: function bottom2top() { + var me = this; + var bb = me.getBoundingBox(); + me.eachNode(function (node) { + node.y = node.y - (node.y - bb.top) * 2 - node.height; // node.y = - node.y; + }); + me.translate(0, bb.height); + } +}); + +function hierarchy(data, options, isolated) { + if (options === void 0) { + options = {}; + } + + options = util.assign({}, DEFAULT_OPTIONS, options); + var root = new Node(data, options); + var nodes = [root]; + var node; + + if (!isolated && !data.collapsed) { + while (node = nodes.shift()) { + if (!node.data.collapsed) { + var children = options.getChildren(node.data); + var length = children ? children.length : 0; + node.children = new Array(length); + + if (children && length) { + for (var i = 0; i < length; i++) { + var child = new Node(children[i], options); + node.children[i] = child; + nodes.push(child); + child.parent = node; + child.depth = node.depth + 1; + } + } + } + } + } + + return root; +} + +module.exports = hierarchy; + +/***/ }), +/* 19 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_nil__ = __webpack_require__(6); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__keys__ = __webpack_require__(20); + + + +function isMatch(obj, attrs) { + var _keys = Object(__WEBPACK_IMPORTED_MODULE_1__keys__["a" /* default */])(attrs); + + var length = _keys.length; + if (Object(__WEBPACK_IMPORTED_MODULE_0__is_nil__["a" /* default */])(obj)) return !length; + + for (var i = 0; i < length; i += 1) { + var key = _keys[i]; + + if (attrs[key] !== obj[key] || !(key in obj)) { + return false; + } + } + + return true; +} + +/* harmony default export */ __webpack_exports__["a"] = (isMatch); + +/***/ }), +/* 20 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__each__ = __webpack_require__(2); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__is_function__ = __webpack_require__(3); + + +var keys = Object.keys ? function (obj) { + return Object.keys(obj); +} : function (obj) { + var result = []; + Object(__WEBPACK_IMPORTED_MODULE_0__each__["a" /* default */])(obj, function (value, key) { + if (!(Object(__WEBPACK_IMPORTED_MODULE_1__is_function__["a" /* default */])(obj) && key === 'prototype')) { + result.push(key); + } + }); + return result; +}; +/* harmony default export */ __webpack_exports__["a"] = (keys); + +/***/ }), +/* 21 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_array_like__ = __webpack_require__(1); + +var splice = Array.prototype.splice; + +var pullAt = function pullAt(arr, indexes) { + if (!Object(__WEBPACK_IMPORTED_MODULE_0__is_array_like__["a" /* default */])(arr)) { + return []; + } + + var length = arr ? indexes.length : 0; + var last = length - 1; + + while (length--) { + var previous = void 0; + var index = indexes[length]; + + if (length === last || index !== previous) { + previous = index; + splice.call(arr, index, 1); + } + } + + return arr; +}; + +/* harmony default export */ __webpack_exports__["a"] = (pullAt); + +/***/ }), +/* 22 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__contains__ = __webpack_require__(12); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__each__ = __webpack_require__(2); + + + +var uniq = function (arr) { + var resultArr = []; + Object(__WEBPACK_IMPORTED_MODULE_1__each__["a" /* default */])(arr, function (item) { + if (!Object(__WEBPACK_IMPORTED_MODULE_0__contains__["a" /* default */])(resultArr, item)) { + resultArr.push(item); + } + }); + return resultArr; +}; + +/* harmony default export */ __webpack_exports__["a"] = (uniq); + +/***/ }), +/* 23 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_array__ = __webpack_require__(0); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__is_function__ = __webpack_require__(3); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__group_by__ = __webpack_require__(24); + + + + +var groupToMap = function (data, condition) { + if (!condition) { + return { + 0: data + }; + } + + if (!Object(__WEBPACK_IMPORTED_MODULE_1__is_function__["a" /* default */])(condition)) { + var paramsCondition_1 = Object(__WEBPACK_IMPORTED_MODULE_0__is_array__["a" /* default */])(condition) ? condition : condition.replace(/\s+/g, '').split('*'); + + condition = function (row) { + var unique = '_'; // 避免出现数字作为Key的情况，会进行按照数字的排序 + + for (var i = 0, l = paramsCondition_1.length; i < l; i++) { + unique += row[paramsCondition_1[i]] && row[paramsCondition_1[i]].toString(); + } + + return unique; + }; + } + + var groups = Object(__WEBPACK_IMPORTED_MODULE_2__group_by__["a" /* default */])(data, condition); + return groups; +}; + +/* harmony default export */ __webpack_exports__["a"] = (groupToMap); + +/***/ }), +/* 24 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__each__ = __webpack_require__(2); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__is_array__ = __webpack_require__(0); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__is_function__ = __webpack_require__(3); + + + +var hasOwnProperty = Object.prototype.hasOwnProperty; + +function groupBy(data, condition) { + if (!condition || !Object(__WEBPACK_IMPORTED_MODULE_1__is_array__["a" /* default */])(data)) { + return {}; + } + + var result = {}; // 兼容方法和 字符串的写法 + + var predicate = Object(__WEBPACK_IMPORTED_MODULE_2__is_function__["a" /* default */])(condition) ? condition : function (item) { + return item[condition]; + }; + var key; + Object(__WEBPACK_IMPORTED_MODULE_0__each__["a" /* default */])(data, function (item) { + key = predicate(item); + + if (hasOwnProperty.call(result, key)) { + result[key].push(item); + } else { + result[key] = [item]; + } + }); + return result; +} + +/* harmony default export */ __webpack_exports__["a"] = (groupBy); + +/***/ }), +/* 25 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony default export */ __webpack_exports__["a"] = (function (obj, key) { + return obj.hasOwnProperty(key); +}); + +/***/ }), +/* 26 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__each__ = __webpack_require__(2); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__is_function__ = __webpack_require__(3); + + // @ts-ignore + +var values = Object.values ? function (obj) { + return Object.values(obj); +} : function (obj) { + var result = []; + Object(__WEBPACK_IMPORTED_MODULE_0__each__["a" /* default */])(obj, function (value, key) { + if (!(Object(__WEBPACK_IMPORTED_MODULE_1__is_function__["a" /* default */])(obj) && key === 'prototype')) { + result.push(value); + } + }); + return result; +}; +/* harmony default export */ __webpack_exports__["a"] = (values); + +/***/ }), +/* 27 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +var toString = {}.toString; + +var getType = function (value) { + return toString.call(value).replace(/^\[object /, '').replace(/]$/, ''); +}; + +/* harmony default export */ __webpack_exports__["a"] = (getType); + +/***/ }), +/* 28 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +var objectProto = Object.prototype; + +var isPrototype = function (value) { + var Ctor = value && value.constructor; + var proto = typeof Ctor === 'function' && Ctor.prototype || objectProto; + return value === proto; +}; + +/* harmony default export */ __webpack_exports__["a"] = (isPrototype); + +/***/ }), +/* 29 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_object_like__ = __webpack_require__(15); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__is_array_like__ = __webpack_require__(1); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__is_string__ = __webpack_require__(8); + + + + +var isEqual = function (value, other) { + if (value === other) { + return true; + } + + if (!value || !other) { + return false; + } + + if (Object(__WEBPACK_IMPORTED_MODULE_2__is_string__["a" /* default */])(value) || Object(__WEBPACK_IMPORTED_MODULE_2__is_string__["a" /* default */])(other)) { + return false; + } + + if (Object(__WEBPACK_IMPORTED_MODULE_1__is_array_like__["a" /* default */])(value) || Object(__WEBPACK_IMPORTED_MODULE_1__is_array_like__["a" /* default */])(other)) { + if (value.length !== other.length) { + return false; + } + + var rst = true; + + for (var i = 0; i < value.length; i++) { + rst = isEqual(value[i], other[i]); + + if (!rst) { + break; + } + } + + return rst; + } + + if (Object(__WEBPACK_IMPORTED_MODULE_0__is_object_like__["a" /* default */])(value) || Object(__WEBPACK_IMPORTED_MODULE_0__is_object_like__["a" /* default */])(other)) { + var valueKeys = Object.keys(value); + var otherKeys = Object.keys(other); + + if (valueKeys.length !== otherKeys.length) { + return false; + } + + var rst = true; + + for (var i = 0; i < valueKeys.length; i++) { + rst = isEqual(value[valueKeys[i]], other[valueKeys[i]]); + + if (!rst) { + break; + } + } + + return rst; + } + + return false; +}; + +/* harmony default export */ __webpack_exports__["a"] = (isEqual); + +/***/ }), +/* 30 */ +/***/ (function(module, exports, __webpack_require__) { + +var hierarchy = __webpack_require__(18); + +module.exports = function (root, options) { + // separate into left and right trees + var left = hierarchy(root.data, options, true); // root only + + var right = hierarchy(root.data, options, true); // root only + // automatically + + var treeSize = root.children.length; + var rightTreeSize = Math.round(treeSize / 2); // separate left and right tree by meta data + + var getSide = options.getSide || function (child, index) { + if (index < rightTreeSize) { + return 'right'; + } + + return 'left'; + }; + + for (var i = 0; i < treeSize; i++) { + var child = root.children[i]; + var side = getSide(child, i); + + if (side === 'right') { + right.children.push(child); + } else { + left.children.push(child); + } + } + + left.eachNode(function (node) { + if (!node.isRoot()) { + node.side = 'left'; + } + }); + right.eachNode(function (node) { + if (!node.isRoot()) { + node.side = 'right'; + } + }); + return { + left: left, + right: right + }; +}; + +/***/ }), +/* 31 */ +/***/ (function(module, exports, __webpack_require__) { + +var hierarchy = { + compactBox: __webpack_require__(32), + dendrogram: __webpack_require__(114), + indented: __webpack_require__(116), + mindmap: __webpack_require__(118) +}; +module.exports = hierarchy; + +/***/ }), +/* 32 */ +/***/ (function(module, exports, __webpack_require__) { + +function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; } + +var TreeLayout = __webpack_require__(11); + +var nonLayeredTidyTree = __webpack_require__(113); + +var doTreeLayout = __webpack_require__(17); + +var util = __webpack_require__(7); + +var CompactBoxTreeLayout = /*#__PURE__*/function (_TreeLayout) { + _inheritsLoose(CompactBoxTreeLayout, _TreeLayout); + + function CompactBoxTreeLayout() { + return _TreeLayout.apply(this, arguments) || this; + } + + var _proto = CompactBoxTreeLayout.prototype; + + _proto.execute = function execute() { + var me = this; + return doTreeLayout(me.rootNode, me.options, nonLayeredTidyTree); + }; + + return CompactBoxTreeLayout; +}(TreeLayout); + +var DEFAULT_OPTIONS = {}; + +function compactBoxLayout(root, options) { + options = util.assign({}, DEFAULT_OPTIONS, options); + return new CompactBoxTreeLayout(root, options).execute(); +} + +module.exports = compactBoxLayout; + +/***/ }), +/* 33 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +Object.defineProperty(__webpack_exports__, "__esModule", { value: true }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__contains__ = __webpack_require__(12); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "contains", function() { return __WEBPACK_IMPORTED_MODULE_0__contains__["a"]; }); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "includes", function() { return __WEBPACK_IMPORTED_MODULE_0__contains__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__difference__ = __webpack_require__(34); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "difference", function() { return __WEBPACK_IMPORTED_MODULE_1__difference__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__find__ = __webpack_require__(35); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "find", function() { return __WEBPACK_IMPORTED_MODULE_2__find__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__find_index__ = __webpack_require__(36); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "findIndex", function() { return __WEBPACK_IMPORTED_MODULE_3__find_index__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__first_value__ = __webpack_require__(37); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "firstValue", function() { return __WEBPACK_IMPORTED_MODULE_4__first_value__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_5__flatten__ = __webpack_require__(38); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "flatten", function() { return __WEBPACK_IMPORTED_MODULE_5__flatten__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_6__flatten_deep__ = __webpack_require__(39); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "flattenDeep", function() { return __WEBPACK_IMPORTED_MODULE_6__flatten_deep__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_7__get_range__ = __webpack_require__(40); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "getRange", function() { return __WEBPACK_IMPORTED_MODULE_7__get_range__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_8__pull__ = __webpack_require__(41); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "pull", function() { return __WEBPACK_IMPORTED_MODULE_8__pull__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_9__pull_at__ = __webpack_require__(21); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "pullAt", function() { return __WEBPACK_IMPORTED_MODULE_9__pull_at__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_10__reduce__ = __webpack_require__(42); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "reduce", function() { return __WEBPACK_IMPORTED_MODULE_10__reduce__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_11__remove__ = __webpack_require__(43); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "remove", function() { return __WEBPACK_IMPORTED_MODULE_11__remove__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_12__sort_by__ = __webpack_require__(44); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "sortBy", function() { return __WEBPACK_IMPORTED_MODULE_12__sort_by__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_13__union__ = __webpack_require__(45); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "union", function() { return __WEBPACK_IMPORTED_MODULE_13__union__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_14__uniq__ = __webpack_require__(22); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "uniq", function() { return __WEBPACK_IMPORTED_MODULE_14__uniq__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_15__values_of_key__ = __webpack_require__(46); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "valuesOfKey", function() { return __WEBPACK_IMPORTED_MODULE_15__values_of_key__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_16__head__ = __webpack_require__(47); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "head", function() { return __WEBPACK_IMPORTED_MODULE_16__head__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_17__last__ = __webpack_require__(48); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "last", function() { return __WEBPACK_IMPORTED_MODULE_17__last__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_18__starts_with__ = __webpack_require__(49); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "startsWith", function() { return __WEBPACK_IMPORTED_MODULE_18__starts_with__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_19__ends_with__ = __webpack_require__(50); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "endsWith", function() { return __WEBPACK_IMPORTED_MODULE_19__ends_with__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_20__filter__ = __webpack_require__(14); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "filter", function() { return __WEBPACK_IMPORTED_MODULE_20__filter__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_21__every__ = __webpack_require__(51); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "every", function() { return __WEBPACK_IMPORTED_MODULE_21__every__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_22__some__ = __webpack_require__(52); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "some", function() { return __WEBPACK_IMPORTED_MODULE_22__some__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_23__group__ = __webpack_require__(53); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "group", function() { return __WEBPACK_IMPORTED_MODULE_23__group__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_24__group_by__ = __webpack_require__(24); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "groupBy", function() { return __WEBPACK_IMPORTED_MODULE_24__group_by__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_25__group_to_map__ = __webpack_require__(23); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "groupToMap", function() { return __WEBPACK_IMPORTED_MODULE_25__group_to_map__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_26__get_wrap_behavior__ = __webpack_require__(54); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "getWrapBehavior", function() { return __WEBPACK_IMPORTED_MODULE_26__get_wrap_behavior__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_27__wrap_behavior__ = __webpack_require__(55); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "wrapBehavior", function() { return __WEBPACK_IMPORTED_MODULE_27__wrap_behavior__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_28__number2color__ = __webpack_require__(56); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "number2color", function() { return __WEBPACK_IMPORTED_MODULE_28__number2color__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_29__parse_radius__ = __webpack_require__(57); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "parseRadius", function() { return __WEBPACK_IMPORTED_MODULE_29__parse_radius__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_30__clamp__ = __webpack_require__(58); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "clamp", function() { return __WEBPACK_IMPORTED_MODULE_30__clamp__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_31__fixed_base__ = __webpack_require__(59); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "fixedBase", function() { return __WEBPACK_IMPORTED_MODULE_31__fixed_base__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_32__is_decimal__ = __webpack_require__(60); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isDecimal", function() { return __WEBPACK_IMPORTED_MODULE_32__is_decimal__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_33__is_even__ = __webpack_require__(61); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isEven", function() { return __WEBPACK_IMPORTED_MODULE_33__is_even__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_34__is_integer__ = __webpack_require__(62); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isInteger", function() { return __WEBPACK_IMPORTED_MODULE_34__is_integer__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_35__is_negative__ = __webpack_require__(63); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isNegative", function() { return __WEBPACK_IMPORTED_MODULE_35__is_negative__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_36__is_number_equal__ = __webpack_require__(64); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isNumberEqual", function() { return __WEBPACK_IMPORTED_MODULE_36__is_number_equal__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_37__is_odd__ = __webpack_require__(65); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isOdd", function() { return __WEBPACK_IMPORTED_MODULE_37__is_odd__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_38__is_positive__ = __webpack_require__(66); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isPositive", function() { return __WEBPACK_IMPORTED_MODULE_38__is_positive__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_39__max_by__ = __webpack_require__(67); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "maxBy", function() { return __WEBPACK_IMPORTED_MODULE_39__max_by__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_40__min_by__ = __webpack_require__(68); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "minBy", function() { return __WEBPACK_IMPORTED_MODULE_40__min_by__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_41__mod__ = __webpack_require__(69); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "mod", function() { return __WEBPACK_IMPORTED_MODULE_41__mod__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_42__to_degree__ = __webpack_require__(70); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "toDegree", function() { return __WEBPACK_IMPORTED_MODULE_42__to_degree__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_43__to_integer__ = __webpack_require__(71); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "toInteger", function() { return __WEBPACK_IMPORTED_MODULE_43__to_integer__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_44__to_radian__ = __webpack_require__(72); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "toRadian", function() { return __WEBPACK_IMPORTED_MODULE_44__to_radian__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_45__for_in__ = __webpack_require__(73); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "forIn", function() { return __WEBPACK_IMPORTED_MODULE_45__for_in__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_46__has__ = __webpack_require__(25); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "has", function() { return __WEBPACK_IMPORTED_MODULE_46__has__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_47__has_key__ = __webpack_require__(74); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "hasKey", function() { return __WEBPACK_IMPORTED_MODULE_47__has_key__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_48__has_value__ = __webpack_require__(75); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "hasValue", function() { return __WEBPACK_IMPORTED_MODULE_48__has_value__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_49__keys__ = __webpack_require__(20); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "keys", function() { return __WEBPACK_IMPORTED_MODULE_49__keys__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_50__is_match__ = __webpack_require__(19); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isMatch", function() { return __WEBPACK_IMPORTED_MODULE_50__is_match__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_51__values__ = __webpack_require__(26); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "values", function() { return __WEBPACK_IMPORTED_MODULE_51__values__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_52__lower_case__ = __webpack_require__(76); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "lowerCase", function() { return __WEBPACK_IMPORTED_MODULE_52__lower_case__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_53__lower_first__ = __webpack_require__(77); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "lowerFirst", function() { return __WEBPACK_IMPORTED_MODULE_53__lower_first__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_54__substitute__ = __webpack_require__(78); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "substitute", function() { return __WEBPACK_IMPORTED_MODULE_54__substitute__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_55__upper_case__ = __webpack_require__(79); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "upperCase", function() { return __WEBPACK_IMPORTED_MODULE_55__upper_case__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_56__upper_first__ = __webpack_require__(80); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "upperFirst", function() { return __WEBPACK_IMPORTED_MODULE_56__upper_first__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_57__get_type__ = __webpack_require__(27); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "getType", function() { return __WEBPACK_IMPORTED_MODULE_57__get_type__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_58__is_arguments__ = __webpack_require__(81); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isArguments", function() { return __WEBPACK_IMPORTED_MODULE_58__is_arguments__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_59__is_array__ = __webpack_require__(0); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isArray", function() { return __WEBPACK_IMPORTED_MODULE_59__is_array__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_60__is_array_like__ = __webpack_require__(1); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isArrayLike", function() { return __WEBPACK_IMPORTED_MODULE_60__is_array_like__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_61__is_boolean__ = __webpack_require__(82); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isBoolean", function() { return __WEBPACK_IMPORTED_MODULE_61__is_boolean__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_62__is_date__ = __webpack_require__(83); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isDate", function() { return __WEBPACK_IMPORTED_MODULE_62__is_date__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_63__is_error__ = __webpack_require__(84); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isError", function() { return __WEBPACK_IMPORTED_MODULE_63__is_error__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_64__is_function__ = __webpack_require__(3); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isFunction", function() { return __WEBPACK_IMPORTED_MODULE_64__is_function__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_65__is_finite__ = __webpack_require__(85); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isFinite", function() { return __WEBPACK_IMPORTED_MODULE_65__is_finite__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_66__is_nil__ = __webpack_require__(6); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isNil", function() { return __WEBPACK_IMPORTED_MODULE_66__is_nil__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_67__is_null__ = __webpack_require__(86); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isNull", function() { return __WEBPACK_IMPORTED_MODULE_67__is_null__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_68__is_number__ = __webpack_require__(5); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isNumber", function() { return __WEBPACK_IMPORTED_MODULE_68__is_number__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_69__is_object__ = __webpack_require__(13); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isObject", function() { return __WEBPACK_IMPORTED_MODULE_69__is_object__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_70__is_object_like__ = __webpack_require__(15); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isObjectLike", function() { return __WEBPACK_IMPORTED_MODULE_70__is_object_like__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_71__is_plain_object__ = __webpack_require__(9); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isPlainObject", function() { return __WEBPACK_IMPORTED_MODULE_71__is_plain_object__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_72__is_prototype__ = __webpack_require__(28); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isPrototype", function() { return __WEBPACK_IMPORTED_MODULE_72__is_prototype__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_73__is_reg_exp__ = __webpack_require__(87); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isRegExp", function() { return __WEBPACK_IMPORTED_MODULE_73__is_reg_exp__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_74__is_string__ = __webpack_require__(8); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isString", function() { return __WEBPACK_IMPORTED_MODULE_74__is_string__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_75__is_type__ = __webpack_require__(4); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isType", function() { return __WEBPACK_IMPORTED_MODULE_75__is_type__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_76__is_undefined__ = __webpack_require__(88); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isUndefined", function() { return __WEBPACK_IMPORTED_MODULE_76__is_undefined__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_77__is_element__ = __webpack_require__(89); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isElement", function() { return __WEBPACK_IMPORTED_MODULE_77__is_element__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_78__request_animation_frame__ = __webpack_require__(90); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "requestAnimationFrame", function() { return __WEBPACK_IMPORTED_MODULE_78__request_animation_frame__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_79__clear_animation_frame__ = __webpack_require__(91); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "clearAnimationFrame", function() { return __WEBPACK_IMPORTED_MODULE_79__clear_animation_frame__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_80__augment__ = __webpack_require__(92); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "augment", function() { return __WEBPACK_IMPORTED_MODULE_80__augment__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_81__clone__ = __webpack_require__(93); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "clone", function() { return __WEBPACK_IMPORTED_MODULE_81__clone__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_82__debounce__ = __webpack_require__(94); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "debounce", function() { return __WEBPACK_IMPORTED_MODULE_82__debounce__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_83__memoize__ = __webpack_require__(95); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "memoize", function() { return __WEBPACK_IMPORTED_MODULE_83__memoize__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_84__deep_mix__ = __webpack_require__(96); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "deepMix", function() { return __WEBPACK_IMPORTED_MODULE_84__deep_mix__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_85__each__ = __webpack_require__(2); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "each", function() { return __WEBPACK_IMPORTED_MODULE_85__each__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_86__extend__ = __webpack_require__(97); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "extend", function() { return __WEBPACK_IMPORTED_MODULE_86__extend__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_87__index_of__ = __webpack_require__(98); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "indexOf", function() { return __WEBPACK_IMPORTED_MODULE_87__index_of__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_88__is_empty__ = __webpack_require__(99); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isEmpty", function() { return __WEBPACK_IMPORTED_MODULE_88__is_empty__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_89__is_equal__ = __webpack_require__(29); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isEqual", function() { return __WEBPACK_IMPORTED_MODULE_89__is_equal__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_90__is_equal_with__ = __webpack_require__(100); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "isEqualWith", function() { return __WEBPACK_IMPORTED_MODULE_90__is_equal_with__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_91__map__ = __webpack_require__(101); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "map", function() { return __WEBPACK_IMPORTED_MODULE_91__map__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_92__map_values__ = __webpack_require__(102); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "mapValues", function() { return __WEBPACK_IMPORTED_MODULE_92__map_values__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_93__mix__ = __webpack_require__(16); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "mix", function() { return __WEBPACK_IMPORTED_MODULE_93__mix__["a"]; }); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "assign", function() { return __WEBPACK_IMPORTED_MODULE_93__mix__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_94__get__ = __webpack_require__(103); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "get", function() { return __WEBPACK_IMPORTED_MODULE_94__get__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_95__set__ = __webpack_require__(104); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "set", function() { return __WEBPACK_IMPORTED_MODULE_95__set__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_96__pick__ = __webpack_require__(105); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "pick", function() { return __WEBPACK_IMPORTED_MODULE_96__pick__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_97__throttle__ = __webpack_require__(106); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "throttle", function() { return __WEBPACK_IMPORTED_MODULE_97__throttle__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_98__to_array__ = __webpack_require__(107); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "toArray", function() { return __WEBPACK_IMPORTED_MODULE_98__to_array__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_99__to_string__ = __webpack_require__(10); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "toString", function() { return __WEBPACK_IMPORTED_MODULE_99__to_string__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_100__unique_id__ = __webpack_require__(108); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "uniqueId", function() { return __WEBPACK_IMPORTED_MODULE_100__unique_id__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_101__noop__ = __webpack_require__(109); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "noop", function() { return __WEBPACK_IMPORTED_MODULE_101__noop__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_102__identity__ = __webpack_require__(110); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "identity", function() { return __WEBPACK_IMPORTED_MODULE_102__identity__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_103__size__ = __webpack_require__(111); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "size", function() { return __WEBPACK_IMPORTED_MODULE_103__size__["a"]; }); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_104__cache__ = __webpack_require__(112); +/* harmony reexport (binding) */ __webpack_require__.d(__webpack_exports__, "Cache", function() { return __WEBPACK_IMPORTED_MODULE_104__cache__["a"]; }); +// array + + + + + + + + + + + + + + + + + + + + + + + + + + // event + + + // format + + + // math + + + + + + + + + + + + + + + + // object + + + + + + + + // string + + + + + + // type + + + + + + + + + + + + + + + + + + + + + + + + // other + + + + + + + + + + + + + + + + + + + + + + + + + // 不知道为什么，需要把这个 export，不然 ts 会报类型错误 + + + +/***/ }), +/* 34 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__filter__ = __webpack_require__(14); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__contains__ = __webpack_require__(12); + + +/** + * Flattens `array` a single level deep. + * + * @param {Array} arr The array to inspect. + * @param {Array} values The values to exclude. + * @return {Array} Returns the new array of filtered values. + * @example + * difference([2, 1], [2, 3]); // => [1] + */ + +var difference = function (arr, values) { + if (values === void 0) { + values = []; + } + + return Object(__WEBPACK_IMPORTED_MODULE_0__filter__["a" /* default */])(arr, function (value) { + return !Object(__WEBPACK_IMPORTED_MODULE_1__contains__["a" /* default */])(values, value); + }); +}; + +/* harmony default export */ __webpack_exports__["a"] = (difference); + +/***/ }), +/* 35 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_function__ = __webpack_require__(3); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__is_match__ = __webpack_require__(19); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__is_array__ = __webpack_require__(0); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__is_plain_object__ = __webpack_require__(9); + + + + + +function find(arr, predicate) { + if (!Object(__WEBPACK_IMPORTED_MODULE_2__is_array__["a" /* default */])(arr)) return null; + + var _predicate; + + if (Object(__WEBPACK_IMPORTED_MODULE_0__is_function__["a" /* default */])(predicate)) { + _predicate = predicate; + } + + if (Object(__WEBPACK_IMPORTED_MODULE_3__is_plain_object__["a" /* default */])(predicate)) { + _predicate = function (a) { + return Object(__WEBPACK_IMPORTED_MODULE_1__is_match__["a" /* default */])(a, predicate); + }; + } + + if (_predicate) { + for (var i = 0; i < arr.length; i += 1) { + if (_predicate(arr[i])) { + return arr[i]; + } + } + } + + return null; +} + +/* harmony default export */ __webpack_exports__["a"] = (find); + +/***/ }), +/* 36 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +function findIndex(arr, predicate, fromIndex) { + if (fromIndex === void 0) { + fromIndex = 0; + } + + for (var i = fromIndex; i < arr.length; i++) { + if (predicate(arr[i], i)) { + // 找到终止循环 + return i; + } + } + + return -1; +} + +/* harmony default export */ __webpack_exports__["a"] = (findIndex); + +/***/ }), +/* 37 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_nil__ = __webpack_require__(6); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__is_array__ = __webpack_require__(0); + + + +var firstValue = function (data, name) { + var rst = null; + + for (var i = 0; i < data.length; i++) { + var obj = data[i]; + var value = obj[name]; + + if (!Object(__WEBPACK_IMPORTED_MODULE_0__is_nil__["a" /* default */])(value)) { + if (Object(__WEBPACK_IMPORTED_MODULE_1__is_array__["a" /* default */])(value)) { + rst = value[0]; // todo 这里是否应该使用递归，调用 firstValue @绝云 + } else { + rst = value; + } + + break; + } + } + + return rst; +}; + +/* harmony default export */ __webpack_exports__["a"] = (firstValue); + +/***/ }), +/* 38 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_array__ = __webpack_require__(0); + +/** + * Flattens `array` a single level deep. + * + * @param {Array} arr The array to flatten. + * @return {Array} Returns the new flattened array. + * @example + * + * flatten([1, [2, [3, [4]], 5]]); // => [1, 2, [3, [4]], 5] + */ + +var flatten = function (arr) { + if (!Object(__WEBPACK_IMPORTED_MODULE_0__is_array__["a" /* default */])(arr)) { + return []; + } + + var rst = []; + + for (var i = 0; i < arr.length; i++) { + rst = rst.concat(arr[i]); + } + + return rst; +}; + +/* harmony default export */ __webpack_exports__["a"] = (flatten); + +/***/ }), +/* 39 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_array__ = __webpack_require__(0); + +/** + * Flattens `array` a single level deep. + * + * @param {Array} arr The array to flatten. + * @param {Array} result The array to return. + * @return {Array} Returns the new flattened array. + * @example + * + * flattenDeep([1, [2, [3, [4]], 5]]); // => [1, 2, 3, 4, 5] + */ + +var flattenDeep = function (arr, result) { + if (result === void 0) { + result = []; + } + + if (!Object(__WEBPACK_IMPORTED_MODULE_0__is_array__["a" /* default */])(arr)) { + result.push(arr); + } else { + for (var i = 0; i < arr.length; i += 1) { + flattenDeep(arr[i], result); + } + } + + return result; +}; + +/* harmony default export */ __webpack_exports__["a"] = (flattenDeep); + +/***/ }), +/* 40 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_array__ = __webpack_require__(0); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__filter__ = __webpack_require__(14); + + + +var getRange = function (values) { + // 存在 NaN 时，min,max 判定会出问题 + values = Object(__WEBPACK_IMPORTED_MODULE_1__filter__["a" /* default */])(values, function (v) { + return !isNaN(v); + }); + + if (!values.length) { + // 如果没有数值则直接返回0 + return { + min: 0, + max: 0 + }; + } + + if (Object(__WEBPACK_IMPORTED_MODULE_0__is_array__["a" /* default */])(values[0])) { + var tmp = []; + + for (var i = 0; i < values.length; i++) { + tmp = tmp.concat(values[i]); + } + + values = tmp; + } + + var max = Math.max.apply(null, values); + var min = Math.min.apply(null, values); + return { + min: min, + max: max + }; +}; + +/* harmony default export */ __webpack_exports__["a"] = (getRange); + +/***/ }), +/* 41 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +var arrPrototype = Array.prototype; +var splice = arrPrototype.splice; +var indexOf = arrPrototype.indexOf; + +var pull = function (arr) { + var values = []; + + for (var _i = 1; _i < arguments.length; _i++) { + values[_i - 1] = arguments[_i]; + } + + for (var i = 0; i < values.length; i++) { + var value = values[i]; + var fromIndex = -1; + + while ((fromIndex = indexOf.call(arr, value)) > -1) { + splice.call(arr, fromIndex, 1); + } + } + + return arr; +}; + +/* harmony default export */ __webpack_exports__["a"] = (pull); + +/***/ }), +/* 42 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__each__ = __webpack_require__(2); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__is_array__ = __webpack_require__(0); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__is_plain_object__ = __webpack_require__(9); + + + + +var reduce = function (arr, fn, init) { + if (!Object(__WEBPACK_IMPORTED_MODULE_1__is_array__["a" /* default */])(arr) && !Object(__WEBPACK_IMPORTED_MODULE_2__is_plain_object__["a" /* default */])(arr)) { + return arr; + } + + var result = init; + Object(__WEBPACK_IMPORTED_MODULE_0__each__["a" /* default */])(arr, function (data, i) { + result = fn(result, data, i); + }); + return result; +}; + +/* harmony default export */ __webpack_exports__["a"] = (reduce); + +/***/ }), +/* 43 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_array_like__ = __webpack_require__(1); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__pull_at__ = __webpack_require__(21); + + + +var remove = function (arr, predicate) { + /** + * const arr = [1, 2, 3, 4] + * const evens = remove(arr, n => n % 2 == 0) + * console.log(arr) // => [1, 3] + * console.log(evens) // => [2, 4] + */ + var result = []; + + if (!Object(__WEBPACK_IMPORTED_MODULE_0__is_array_like__["a" /* default */])(arr)) { + return result; + } + + var i = -1; + var indexes = []; + var length = arr.length; + + while (++i < length) { + var value = arr[i]; + + if (predicate(value, i, arr)) { + result.push(value); + indexes.push(i); + } + } + + Object(__WEBPACK_IMPORTED_MODULE_1__pull_at__["a" /* default */])(arr, indexes); + return result; +}; + +/* harmony default export */ __webpack_exports__["a"] = (remove); + +/***/ }), +/* 44 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_array__ = __webpack_require__(0); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__is_string__ = __webpack_require__(8); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__is_function__ = __webpack_require__(3); + + + + +function sortBy(arr, key) { + var comparer; + + if (Object(__WEBPACK_IMPORTED_MODULE_2__is_function__["a" /* default */])(key)) { + comparer = function (a, b) { + return key(a) - key(b); + }; + } else { + var keys_1 = []; + + if (Object(__WEBPACK_IMPORTED_MODULE_1__is_string__["a" /* default */])(key)) { + keys_1.push(key); + } else if (Object(__WEBPACK_IMPORTED_MODULE_0__is_array__["a" /* default */])(key)) { + keys_1 = key; + } + + comparer = function (a, b) { + for (var i = 0; i < keys_1.length; i += 1) { + var prop = keys_1[i]; + + if (a[prop] > b[prop]) { + return 1; + } + + if (a[prop] < b[prop]) { + return -1; + } + } + + return 0; + }; + } + + arr.sort(comparer); + return arr; +} + +/* harmony default export */ __webpack_exports__["a"] = (sortBy); + +/***/ }), +/* 45 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__uniq__ = __webpack_require__(22); + + +var union = function () { + var sources = []; + + for (var _i = 0; _i < arguments.length; _i++) { + sources[_i] = arguments[_i]; + } + + return Object(__WEBPACK_IMPORTED_MODULE_0__uniq__["a" /* default */])([].concat.apply([], sources)); +}; + +/* harmony default export */ __webpack_exports__["a"] = (union); + +/***/ }), +/* 46 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__each__ = __webpack_require__(2); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__is_array__ = __webpack_require__(0); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__is_nil__ = __webpack_require__(6); + + + +/* harmony default export */ __webpack_exports__["a"] = (function (data, name) { + var rst = []; + var tmpMap = {}; + data.forEach(function (obj) { + var value = obj[name]; + + if (!Object(__WEBPACK_IMPORTED_MODULE_2__is_nil__["a" /* default */])(value)) { + // flatten + if (!Object(__WEBPACK_IMPORTED_MODULE_1__is_array__["a" /* default */])(value)) { + value = [value]; + } + + Object(__WEBPACK_IMPORTED_MODULE_0__each__["a" /* default */])(value, function (val) { + // unique + if (!tmpMap[val]) { + rst.push(val); + tmpMap[val] = true; + } + }); + } + }); + return rst; +}); + +/***/ }), +/* 47 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony export (immutable) */ __webpack_exports__["a"] = head; +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_array_like__ = __webpack_require__(1); + +function head(o) { + if (Object(__WEBPACK_IMPORTED_MODULE_0__is_array_like__["a" /* default */])(o)) { + return o[0]; + } + + return undefined; +} + +/***/ }), +/* 48 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony export (immutable) */ __webpack_exports__["a"] = last; +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_array_like__ = __webpack_require__(1); + +function last(o) { + if (Object(__WEBPACK_IMPORTED_MODULE_0__is_array_like__["a" /* default */])(o)) { + var arr = o; + return arr[arr.length - 1]; + } + + return undefined; +} + +/***/ }), +/* 49 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_array__ = __webpack_require__(0); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__is_string__ = __webpack_require__(8); + + + +function startsWith(arr, e) { + return Object(__WEBPACK_IMPORTED_MODULE_0__is_array__["a" /* default */])(arr) || Object(__WEBPACK_IMPORTED_MODULE_1__is_string__["a" /* default */])(arr) ? arr[0] === e : false; +} + +/* harmony default export */ __webpack_exports__["a"] = (startsWith); + +/***/ }), +/* 50 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_array__ = __webpack_require__(0); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__is_string__ = __webpack_require__(8); + + + +function endsWith(arr, e) { + return Object(__WEBPACK_IMPORTED_MODULE_0__is_array__["a" /* default */])(arr) || Object(__WEBPACK_IMPORTED_MODULE_1__is_string__["a" /* default */])(arr) ? arr[arr.length - 1] === e : false; +} + +/* harmony default export */ __webpack_exports__["a"] = (endsWith); + +/***/ }), +/* 51 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/** + * 只要有一个不满足条件就返回 false + * @param arr + * @param func + */ +var every = function (arr, func) { + for (var i = 0; i < arr.length; i++) { + if (!func(arr[i], i)) return false; + } + + return true; +}; + +/* harmony default export */ __webpack_exports__["a"] = (every); + +/***/ }), +/* 52 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/** + * 只要有一个满足条件就返回 true + * @param arr + * @param func + */ +var some = function (arr, func) { + for (var i = 0; i < arr.length; i++) { + if (func(arr[i], i)) return true; + } + + return false; +}; + +/* harmony default export */ __webpack_exports__["a"] = (some); + +/***/ }), +/* 53 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__group_to_map__ = __webpack_require__(23); + +/* harmony default export */ __webpack_exports__["a"] = (function (data, condition) { + if (!condition) { + // 没有条件，则自身改成数组 + return [data]; + } + + var groups = Object(__WEBPACK_IMPORTED_MODULE_0__group_to_map__["a" /* default */])(data, condition); + var array = []; + + for (var i in groups) { + array.push(groups[i]); + } + + return array; +}); + +/***/ }), +/* 54 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/** + * 获取封装的事件 + * @protected + * @param {Object} obj 对象 + * @param {String} action 事件名称 + * @return {Function} 返回事件处理函数 + */ +function getWrapBehavior(obj, action) { + return obj['_wrap_' + action]; +} + +/* harmony default export */ __webpack_exports__["a"] = (getWrapBehavior); + +/***/ }), +/* 55 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/** + * 封装事件，便于使用上下文this,和便于解除事件时使用 + * @protected + * @param {Object} obj 对象 + * @param {String} action 事件名称 + * @return {Function} 返回事件处理函数 + */ +function wrapBehavior(obj, action) { + if (obj['_wrap_' + action]) { + return obj['_wrap_' + action]; + } + + var method = function (e) { + obj[action](e); + }; + + obj['_wrap_' + action] = method; + return method; +} + +/* harmony default export */ __webpack_exports__["a"] = (wrapBehavior); + +/***/ }), +/* 56 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +var numColorCache = {}; + +function numberToColor(num) { + // 增加缓存 + var color = numColorCache[num]; + + if (!color) { + var str = num.toString(16); + + for (var i = str.length; i < 6; i++) { + str = '0' + str; + } + + color = '#' + str; + numColorCache[num] = color; + } + + return color; +} + +/* harmony default export */ __webpack_exports__["a"] = (numberToColor); + +/***/ }), +/* 57 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_array__ = __webpack_require__(0); + + +function parseRadius(radius) { + var r1 = 0, + r2 = 0, + r3 = 0, + r4 = 0; + + if (Object(__WEBPACK_IMPORTED_MODULE_0__is_array__["a" /* default */])(radius)) { + if (radius.length === 1) { + r1 = r2 = r3 = r4 = radius[0]; + } else if (radius.length === 2) { + r1 = r3 = radius[0]; + r2 = r4 = radius[1]; + } else if (radius.length === 3) { + r1 = radius[0]; + r2 = r4 = radius[1]; + r3 = radius[2]; + } else { + r1 = radius[0]; + r2 = radius[1]; + r3 = radius[2]; + r4 = radius[3]; + } + } else { + r1 = r2 = r3 = r4 = radius; + } + + return { + r1: r1, + r2: r2, + r3: r3, + r4: r4 + }; +} + +/* harmony default export */ __webpack_exports__["a"] = (parseRadius); + +/***/ }), +/* 58 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +var clamp = function (a, min, max) { + if (a < min) { + return min; + } else if (a > max) { + return max; + } + + return a; +}; + +/* harmony default export */ __webpack_exports__["a"] = (clamp); + +/***/ }), +/* 59 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +var fixedBase = function (v, base) { + var str = base.toString(); + var index = str.indexOf('.'); + + if (index === -1) { + return Math.round(v); + } + + var length = str.substr(index + 1).length; + + if (length > 20) { + length = 20; + } + + return parseFloat(v.toFixed(length)); +}; + +/* harmony default export */ __webpack_exports__["a"] = (fixedBase); + +/***/ }), +/* 60 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_number__ = __webpack_require__(5); + + +var isDecimal = function (num) { + return Object(__WEBPACK_IMPORTED_MODULE_0__is_number__["a" /* default */])(num) && num % 1 !== 0; +}; + +/* harmony default export */ __webpack_exports__["a"] = (isDecimal); + +/***/ }), +/* 61 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_number__ = __webpack_require__(5); + + +var isEven = function (num) { + return Object(__WEBPACK_IMPORTED_MODULE_0__is_number__["a" /* default */])(num) && num % 2 === 0; +}; + +/* harmony default export */ __webpack_exports__["a"] = (isEven); + +/***/ }), +/* 62 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_number__ = __webpack_require__(5); + +var isInteger = Number.isInteger ? Number.isInteger : function (num) { + return Object(__WEBPACK_IMPORTED_MODULE_0__is_number__["a" /* default */])(num) && num % 1 === 0; +}; +/* harmony default export */ __webpack_exports__["a"] = (isInteger); + +/***/ }), +/* 63 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_number__ = __webpack_require__(5); + + +var isNegative = function (num) { + return Object(__WEBPACK_IMPORTED_MODULE_0__is_number__["a" /* default */])(num) && num < 0; +}; + +/* harmony default export */ __webpack_exports__["a"] = (isNegative); + +/***/ }), +/* 64 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony export (immutable) */ __webpack_exports__["a"] = isNumberEqual; +var PRECISION = 0.00001; // numbers less than this is considered as 0 + +function isNumberEqual(a, b, precision) { + if (precision === void 0) { + precision = PRECISION; + } + + return Math.abs(a - b) < precision; +} + +/***/ }), +/* 65 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_number__ = __webpack_require__(5); + + +var isOdd = function (num) { + return Object(__WEBPACK_IMPORTED_MODULE_0__is_number__["a" /* default */])(num) && num % 2 !== 0; +}; + +/* harmony default export */ __webpack_exports__["a"] = (isOdd); + +/***/ }), +/* 66 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_number__ = __webpack_require__(5); + + +var isPositive = function (num) { + return Object(__WEBPACK_IMPORTED_MODULE_0__is_number__["a" /* default */])(num) && num > 0; +}; + +/* harmony default export */ __webpack_exports__["a"] = (isPositive); + +/***/ }), +/* 67 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__each__ = __webpack_require__(2); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__is_array__ = __webpack_require__(0); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__is_function__ = __webpack_require__(3); + + + +/** + * @param {Array} arr The array to iterate over. + * @param {Function} [fn] The iteratee invoked per element. + * @return {*} Returns the maximum value. + * @example + * + * var objects = [{ 'n': 1 }, { 'n': 2 }]; + * + * maxBy(objects, function(o) { return o.n; }); + * // => { 'n': 2 } + * + * maxBy(objects, 'n'); + * // => { 'n': 2 } + */ + +/* harmony default export */ __webpack_exports__["a"] = (function (arr, fn) { + if (!Object(__WEBPACK_IMPORTED_MODULE_1__is_array__["a" /* default */])(arr)) { + return undefined; + } + + var max = arr[0]; + var maxData; + + if (Object(__WEBPACK_IMPORTED_MODULE_2__is_function__["a" /* default */])(fn)) { + maxData = fn(arr[0]); + } else { + maxData = arr[0][fn]; + } + + var data; + Object(__WEBPACK_IMPORTED_MODULE_0__each__["a" /* default */])(arr, function (val) { + if (Object(__WEBPACK_IMPORTED_MODULE_2__is_function__["a" /* default */])(fn)) { + data = fn(val); + } else { + data = val[fn]; + } + + if (data > maxData) { + max = val; + maxData = data; + } + }); + return max; +}); + +/***/ }), +/* 68 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__each__ = __webpack_require__(2); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__is_array__ = __webpack_require__(0); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__is_function__ = __webpack_require__(3); + + + +/** + * @param {Array} arr The array to iterate over. + * @param {Function} [fn] The iteratee invoked per element. + * @return {*} Returns the minimum value. + * @example + * + * var objects = [{ 'n': 1 }, { 'n': 2 }]; + * + * minBy(objects, function(o) { return o.n; }); + * // => { 'n': 1 } + * + * minBy(objects, 'n'); + * // => { 'n': 1 } + */ + +/* harmony default export */ __webpack_exports__["a"] = (function (arr, fn) { + if (!Object(__WEBPACK_IMPORTED_MODULE_1__is_array__["a" /* default */])(arr)) { + return undefined; + } + + var min = arr[0]; + var minData; + + if (Object(__WEBPACK_IMPORTED_MODULE_2__is_function__["a" /* default */])(fn)) { + minData = fn(arr[0]); + } else { + minData = arr[0][fn]; + } + + var data; + Object(__WEBPACK_IMPORTED_MODULE_0__each__["a" /* default */])(arr, function (val) { + if (Object(__WEBPACK_IMPORTED_MODULE_2__is_function__["a" /* default */])(fn)) { + data = fn(val); + } else { + data = val[fn]; + } + + if (data < minData) { + min = val; + minData = data; + } + }); + return min; +}); + +/***/ }), +/* 69 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +var mod = function (n, m) { + return (n % m + m) % m; +}; + +/* harmony default export */ __webpack_exports__["a"] = (mod); + +/***/ }), +/* 70 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +var DEGREE = 180 / Math.PI; + +var toDegree = function (radian) { + return DEGREE * radian; +}; + +/* harmony default export */ __webpack_exports__["a"] = (toDegree); + +/***/ }), +/* 71 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony default export */ __webpack_exports__["a"] = (parseInt); + +/***/ }), +/* 72 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +var RADIAN = Math.PI / 180; + +var toRadian = function (degree) { + return RADIAN * degree; +}; + +/* harmony default export */ __webpack_exports__["a"] = (toRadian); + +/***/ }), +/* 73 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__each__ = __webpack_require__(2); + +/* harmony default export */ __webpack_exports__["a"] = (__WEBPACK_IMPORTED_MODULE_0__each__["a" /* default */]); + +/***/ }), +/* 74 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__has__ = __webpack_require__(25); + +/* harmony default export */ __webpack_exports__["a"] = (__WEBPACK_IMPORTED_MODULE_0__has__["a" /* default */]); + +/***/ }), +/* 75 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__contains__ = __webpack_require__(12); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__values__ = __webpack_require__(26); + + +/* harmony default export */ __webpack_exports__["a"] = (function (obj, value) { + return Object(__WEBPACK_IMPORTED_MODULE_0__contains__["a" /* default */])(Object(__WEBPACK_IMPORTED_MODULE_1__values__["a" /* default */])(obj), value); +}); + +/***/ }), +/* 76 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__to_string__ = __webpack_require__(10); + + +var lowerCase = function (str) { + return Object(__WEBPACK_IMPORTED_MODULE_0__to_string__["a" /* default */])(str).toLowerCase(); +}; + +/* harmony default export */ __webpack_exports__["a"] = (lowerCase); + +/***/ }), +/* 77 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__to_string__ = __webpack_require__(10); + + +var lowerFirst = function (value) { + var str = Object(__WEBPACK_IMPORTED_MODULE_0__to_string__["a" /* default */])(value); + return str.charAt(0).toLowerCase() + str.substring(1); +}; + +/* harmony default export */ __webpack_exports__["a"] = (lowerFirst); + +/***/ }), +/* 78 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +function substitute(str, o) { + if (!str || !o) { + return str; + } + + return str.replace(/\\?\{([^{}]+)\}/g, function (match, name) { + if (match.charAt(0) === '\\') { + return match.slice(1); + } + + return o[name] === undefined ? '' : o[name]; + }); +} + +/* harmony default export */ __webpack_exports__["a"] = (substitute); + +/***/ }), +/* 79 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__to_string__ = __webpack_require__(10); + + +var upperCase = function (str) { + return Object(__WEBPACK_IMPORTED_MODULE_0__to_string__["a" /* default */])(str).toUpperCase(); +}; + +/* harmony default export */ __webpack_exports__["a"] = (upperCase); + +/***/ }), +/* 80 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__to_string__ = __webpack_require__(10); + + +var upperFirst = function (value) { + var str = Object(__WEBPACK_IMPORTED_MODULE_0__to_string__["a" /* default */])(value); + return str.charAt(0).toUpperCase() + str.substring(1); +}; + +/* harmony default export */ __webpack_exports__["a"] = (upperFirst); + +/***/ }), +/* 81 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_type__ = __webpack_require__(4); +/** + * 是否是参数类型 + * + * @param {Object} value 测试的值 + * @return {Boolean} + */ + + +var isArguments = function (value) { + return Object(__WEBPACK_IMPORTED_MODULE_0__is_type__["a" /* default */])(value, 'Arguments'); +}; + +/* harmony default export */ __webpack_exports__["a"] = (isArguments); + +/***/ }), +/* 82 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_type__ = __webpack_require__(4); +/** + * 是否是布尔类型 + * + * @param {Object} value 测试的值 + * @return {Boolean} + */ + + +var isBoolean = function (value) { + return Object(__WEBPACK_IMPORTED_MODULE_0__is_type__["a" /* default */])(value, 'Boolean'); +}; + +/* harmony default export */ __webpack_exports__["a"] = (isBoolean); + +/***/ }), +/* 83 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_type__ = __webpack_require__(4); + + +var isDate = function (value) { + return Object(__WEBPACK_IMPORTED_MODULE_0__is_type__["a" /* default */])(value, 'Date'); +}; + +/* harmony default export */ __webpack_exports__["a"] = (isDate); + +/***/ }), +/* 84 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_type__ = __webpack_require__(4); +/** + * 是否是参数类型 + * + * @param {Object} value 测试的值 + * @return {Boolean} + */ + + +var isError = function (value) { + return Object(__WEBPACK_IMPORTED_MODULE_0__is_type__["a" /* default */])(value, 'Error'); +}; + +/* harmony default export */ __webpack_exports__["a"] = (isError); + +/***/ }), +/* 85 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_number__ = __webpack_require__(5); +/** + * 判断是否为有限数 + * @return {Boolean} + */ + +/* harmony default export */ __webpack_exports__["a"] = (function (value) { + return Object(__WEBPACK_IMPORTED_MODULE_0__is_number__["a" /* default */])(value) && isFinite(value); +}); + +/***/ }), +/* 86 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +var isNull = function (value) { + return value === null; +}; + +/* harmony default export */ __webpack_exports__["a"] = (isNull); + +/***/ }), +/* 87 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_type__ = __webpack_require__(4); + + +var isRegExp = function (str) { + return Object(__WEBPACK_IMPORTED_MODULE_0__is_type__["a" /* default */])(str, 'RegExp'); +}; + +/* harmony default export */ __webpack_exports__["a"] = (isRegExp); + +/***/ }), +/* 88 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +var isUndefined = function (value) { + return value === undefined; +}; + +/* harmony default export */ __webpack_exports__["a"] = (isUndefined); + +/***/ }), +/* 89 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/** + * 判断是否HTML元素 + * @return {Boolean} 是否HTML元素 + */ +var isElement = function (o) { + return o instanceof Element || o instanceof HTMLDocument; +}; + +/* harmony default export */ __webpack_exports__["a"] = (isElement); + +/***/ }), +/* 90 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony export (immutable) */ __webpack_exports__["a"] = requestAnimationFrame; +function requestAnimationFrame(fn) { + var method = window.requestAnimationFrame || window.webkitRequestAnimationFrame || // @ts-ignore + window.mozRequestAnimationFrame || // @ts-ignore + window.msRequestAnimationFrame || function (f) { + return setTimeout(f, 16); + }; + + return method(fn); +} + +/***/ }), +/* 91 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony export (immutable) */ __webpack_exports__["a"] = cancelAnimationFrame; +function cancelAnimationFrame(handler) { + var method = window.cancelAnimationFrame || window.webkitCancelAnimationFrame || // @ts-ignore + window.mozCancelAnimationFrame || // @ts-ignore + window.msCancelAnimationFrame || clearTimeout; + method(handler); +} + +/***/ }), +/* 92 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__mix__ = __webpack_require__(16); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__is_function__ = __webpack_require__(3); + + + +var augment = function () { + var args = []; + + for (var _i = 0; _i < arguments.length; _i++) { + args[_i] = arguments[_i]; + } + + var c = args[0]; + + for (var i = 1; i < args.length; i++) { + var obj = args[i]; + + if (Object(__WEBPACK_IMPORTED_MODULE_1__is_function__["a" /* default */])(obj)) { + obj = obj.prototype; + } + + Object(__WEBPACK_IMPORTED_MODULE_0__mix__["a" /* default */])(c.prototype, obj); + } +}; + +/* harmony default export */ __webpack_exports__["a"] = (augment); + +/***/ }), +/* 93 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_array__ = __webpack_require__(0); + + +var clone = function (obj) { + if (typeof obj !== 'object' || obj === null) { + return obj; + } + + var rst; + + if (Object(__WEBPACK_IMPORTED_MODULE_0__is_array__["a" /* default */])(obj)) { + rst = []; + + for (var i = 0, l = obj.length; i < l; i++) { + if (typeof obj[i] === 'object' && obj[i] != null) { + rst[i] = clone(obj[i]); + } else { + rst[i] = obj[i]; + } + } + } else { + rst = {}; + + for (var k in obj) { + if (typeof obj[k] === 'object' && obj[k] != null) { + rst[k] = clone(obj[k]); + } else { + rst[k] = obj[k]; + } + } + } + + return rst; +}; + +/* harmony default export */ __webpack_exports__["a"] = (clone); + +/***/ }), +/* 94 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +function debounce(func, wait, immediate) { + var timeout; + return function () { + var context = this, + args = arguments; + + var later = function () { + timeout = null; + + if (!immediate) { + func.apply(context, args); + } + }; + + var callNow = immediate && !timeout; + clearTimeout(timeout); + timeout = setTimeout(later, wait); + + if (callNow) { + func.apply(context, args); + } + }; +} + +/* harmony default export */ __webpack_exports__["a"] = (debounce); + +/***/ }), +/* 95 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_function__ = __webpack_require__(3); + +/** + * _.memoize(calColor); + * _.memoize(calColor, (...args) => args[0]); + * @param f + * @param resolver + */ + +/* harmony default export */ __webpack_exports__["a"] = (function (f, resolver) { + if (!Object(__WEBPACK_IMPORTED_MODULE_0__is_function__["a" /* default */])(f)) { + throw new TypeError('Expected a function'); + } + + var memoized = function () { + var args = []; + + for (var _i = 0; _i < arguments.length; _i++) { + args[_i] = arguments[_i]; + } // 使用方法构造 key，如果不存在 resolver，则直接取第一个参数作为 key + + + var key = resolver ? resolver.apply(this, args) : args[0]; + var cache = memoized.cache; + + if (cache.has(key)) { + return cache.get(key); + } + + var result = f.apply(this, args); // 缓存起来 + + cache.set(key, result); + return result; + }; + + memoized.cache = new Map(); + return memoized; +}); + +/***/ }), +/* 96 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_array__ = __webpack_require__(0); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__is_plain_object__ = __webpack_require__(9); + + +var MAX_MIX_LEVEL = 5; + +function _deepMix(dist, src, level, maxLevel) { + level = level || 0; + maxLevel = maxLevel || MAX_MIX_LEVEL; + + for (var key in src) { + if (src.hasOwnProperty(key)) { + var value = src[key]; + + if (value !== null && Object(__WEBPACK_IMPORTED_MODULE_1__is_plain_object__["a" /* default */])(value)) { + if (!Object(__WEBPACK_IMPORTED_MODULE_1__is_plain_object__["a" /* default */])(dist[key])) { + dist[key] = {}; + } + + if (level < maxLevel) { + _deepMix(dist[key], value, level + 1, maxLevel); + } else { + dist[key] = src[key]; + } + } else if (Object(__WEBPACK_IMPORTED_MODULE_0__is_array__["a" /* default */])(value)) { + dist[key] = []; + dist[key] = dist[key].concat(value); + } else if (value !== undefined) { + dist[key] = value; + } + } + } +} // todo 重写 + + +var deepMix = function (rst) { + var args = []; + + for (var _i = 1; _i < arguments.length; _i++) { + args[_i - 1] = arguments[_i]; + } + + for (var i = 0; i < args.length; i += 1) { + _deepMix(rst, args[i]); + } + + return rst; +}; + +/* harmony default export */ __webpack_exports__["a"] = (deepMix); + +/***/ }), +/* 97 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__mix__ = __webpack_require__(16); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__is_function__ = __webpack_require__(3); + + + +var extend = function (subclass, superclass, overrides, staticOverrides) { + // 如果只提供父类构造函数，则自动生成子类构造函数 + if (!Object(__WEBPACK_IMPORTED_MODULE_1__is_function__["a" /* default */])(superclass)) { + overrides = superclass; + superclass = subclass; + + subclass = function () {}; + } + + var create = Object.create ? function (proto, c) { + return Object.create(proto, { + constructor: { + value: c + } + }); + } : function (proto, c) { + function Tmp() {} + + Tmp.prototype = proto; + var o = new Tmp(); + o.constructor = c; + return o; + }; + var superObj = create(superclass.prototype, subclass); // new superclass(),//实例化父类作为子类的prototype + + subclass.prototype = Object(__WEBPACK_IMPORTED_MODULE_0__mix__["a" /* default */])(superObj, subclass.prototype); // 指定子类的prototype + + subclass.superclass = create(superclass.prototype, superclass); + Object(__WEBPACK_IMPORTED_MODULE_0__mix__["a" /* default */])(superObj, overrides); + Object(__WEBPACK_IMPORTED_MODULE_0__mix__["a" /* default */])(subclass, staticOverrides); + return subclass; +}; + +/* harmony default export */ __webpack_exports__["a"] = (extend); + +/***/ }), +/* 98 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_array_like__ = __webpack_require__(1); + + +var indexOf = function (arr, obj) { + if (!Object(__WEBPACK_IMPORTED_MODULE_0__is_array_like__["a" /* default */])(arr)) { + return -1; + } + + var m = Array.prototype.indexOf; + + if (m) { + return m.call(arr, obj); + } + + var index = -1; + + for (var i = 0; i < arr.length; i++) { + if (arr[i] === obj) { + index = i; + break; + } + } + + return index; +}; + +/* harmony default export */ __webpack_exports__["a"] = (indexOf); + +/***/ }), +/* 99 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_nil__ = __webpack_require__(6); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__is_array_like__ = __webpack_require__(1); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__get_type__ = __webpack_require__(27); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__is_prototype__ = __webpack_require__(28); + + + + +var hasOwnProperty = Object.prototype.hasOwnProperty; + +function isEmpty(value) { + /** + * isEmpty(null) => true + * isEmpty() => true + * isEmpty(true) => true + * isEmpty(1) => true + * isEmpty([1, 2, 3]) => false + * isEmpty('abc') => false + * isEmpty({ a: 1 }) => false + */ + if (Object(__WEBPACK_IMPORTED_MODULE_0__is_nil__["a" /* default */])(value)) { + return true; + } + + if (Object(__WEBPACK_IMPORTED_MODULE_1__is_array_like__["a" /* default */])(value)) { + return !value.length; + } + + var type = Object(__WEBPACK_IMPORTED_MODULE_2__get_type__["a" /* default */])(value); + + if (type === 'Map' || type === 'Set') { + return !value.size; + } + + if (Object(__WEBPACK_IMPORTED_MODULE_3__is_prototype__["a" /* default */])(value)) { + return !Object.keys(value).length; + } + + for (var key in value) { + if (hasOwnProperty.call(value, key)) { + return false; + } + } + + return true; +} + +/* harmony default export */ __webpack_exports__["a"] = (isEmpty); + +/***/ }), +/* 100 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_function__ = __webpack_require__(3); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__is_equal__ = __webpack_require__(29); + + +/** + * @param {*} value The value to compare. + * @param {*} other The other value to compare. + * @param {Function} [fn] The function to customize comparisons. + * @returns {boolean} Returns `true` if the values are equivalent, else `false`. + * @example + * + * function isGreeting(value) { + * return /^h(?:i|ello)$/.test(value); + * } + * + * function customizer(objValue, othValue) { + * if (isGreeting(objValue) && isGreeting(othValue)) { + * return true; + * } + * } + * + * var array = ['hello', 'goodbye']; + * var other = ['hi', 'goodbye']; + * + * isEqualWith(array, other, customizer); // => true + */ + +/* harmony default export */ __webpack_exports__["a"] = (function (value, other, fn) { + if (!Object(__WEBPACK_IMPORTED_MODULE_0__is_function__["a" /* default */])(fn)) { + return Object(__WEBPACK_IMPORTED_MODULE_1__is_equal__["a" /* default */])(value, other); + } + + return !!fn(value, other); +}); + +/***/ }), +/* 101 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__each__ = __webpack_require__(2); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__is_array_like__ = __webpack_require__(1); + + + +var map = function (arr, func) { + if (!Object(__WEBPACK_IMPORTED_MODULE_1__is_array_like__["a" /* default */])(arr)) { + // @ts-ignore + return arr; + } + + var result = []; + Object(__WEBPACK_IMPORTED_MODULE_0__each__["a" /* default */])(arr, function (value, index) { + result.push(func(value, index)); + }); + return result; +}; + +/* harmony default export */ __webpack_exports__["a"] = (map); + +/***/ }), +/* 102 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_nil__ = __webpack_require__(6); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__is_object__ = __webpack_require__(13); + + + +var identity = function (v) { + return v; +}; + +/* harmony default export */ __webpack_exports__["a"] = (function (object, func) { + if (func === void 0) { + func = identity; + } + + var r = {}; + + if (Object(__WEBPACK_IMPORTED_MODULE_1__is_object__["a" /* default */])(object) && !Object(__WEBPACK_IMPORTED_MODULE_0__is_nil__["a" /* default */])(object)) { + Object.keys(object).forEach(function (key) { + // @ts-ignore + r[key] = func(object[key], key); + }); + } + + return r; +}); + +/***/ }), +/* 103 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_string__ = __webpack_require__(8); + +/** + * https://github.com/developit/dlv/blob/master/index.js + * @param obj + * @param key + * @param defaultValue + */ + +/* harmony default export */ __webpack_exports__["a"] = (function (obj, key, defaultValue) { + var p = 0; + var keyArr = Object(__WEBPACK_IMPORTED_MODULE_0__is_string__["a" /* default */])(key) ? key.split('.') : key; + + while (obj && p < keyArr.length) { + obj = obj[keyArr[p++]]; + } + + return obj === undefined || p < keyArr.length ? defaultValue : obj; +}); + +/***/ }), +/* 104 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_object__ = __webpack_require__(13); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__is_string__ = __webpack_require__(8); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__is_number__ = __webpack_require__(5); + + + +/** + * https://github.com/developit/dlv/blob/master/index.js + * @param obj + * @param path + * @param value + */ + +/* harmony default export */ __webpack_exports__["a"] = (function (obj, path, value) { + var o = obj; + var keyArr = Object(__WEBPACK_IMPORTED_MODULE_1__is_string__["a" /* default */])(path) ? path.split('.') : path; + keyArr.forEach(function (key, idx) { + // 不是最后一个 + if (idx < keyArr.length - 1) { + if (!Object(__WEBPACK_IMPORTED_MODULE_0__is_object__["a" /* default */])(o[key])) { + o[key] = Object(__WEBPACK_IMPORTED_MODULE_2__is_number__["a" /* default */])(keyArr[idx + 1]) ? [] : {}; + } + + o = o[key]; + } else { + o[key] = value; + } + }); + return obj; +}); + +/***/ }), +/* 105 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__each__ = __webpack_require__(2); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__is_plain_object__ = __webpack_require__(9); + + +var hasOwnProperty = Object.prototype.hasOwnProperty; +/* harmony default export */ __webpack_exports__["a"] = (function (object, keys) { + if (object === null || !Object(__WEBPACK_IMPORTED_MODULE_1__is_plain_object__["a" /* default */])(object)) { + return {}; + } + + var result = {}; + Object(__WEBPACK_IMPORTED_MODULE_0__each__["a" /* default */])(keys, function (key) { + if (hasOwnProperty.call(object, key)) { + result[key] = object[key]; + } + }); + return result; +}); + +/***/ }), +/* 106 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony default export */ __webpack_exports__["a"] = (function (func, wait, options) { + var timeout, context, args, result; + var previous = 0; + if (!options) options = {}; + + var later = function () { + previous = options.leading === false ? 0 : Date.now(); + timeout = null; + result = func.apply(context, args); + if (!timeout) context = args = null; + }; + + var throttled = function () { + var now = Date.now(); + if (!previous && options.leading === false) previous = now; + var remaining = wait - (now - previous); + context = this; + args = arguments; + + if (remaining <= 0 || remaining > wait) { + if (timeout) { + clearTimeout(timeout); + timeout = null; + } + + previous = now; + result = func.apply(context, args); + if (!timeout) context = args = null; + } else if (!timeout && options.trailing !== false) { + timeout = setTimeout(later, remaining); + } + + return result; + }; + + throttled.cancel = function () { + clearTimeout(timeout); + previous = 0; + timeout = context = args = null; + }; + + return throttled; +}); + +/***/ }), +/* 107 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_array_like__ = __webpack_require__(1); + +/* harmony default export */ __webpack_exports__["a"] = (function (value) { + return Object(__WEBPACK_IMPORTED_MODULE_0__is_array_like__["a" /* default */])(value) ? Array.prototype.slice.call(value) : []; +}); + +/***/ }), +/* 108 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +var map = {}; +/* harmony default export */ __webpack_exports__["a"] = (function (prefix) { + prefix = prefix || 'g'; + + if (!map[prefix]) { + map[prefix] = 1; + } else { + map[prefix] += 1; + } + + return prefix + map[prefix]; +}); + +/***/ }), +/* 109 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony default export */ __webpack_exports__["a"] = (function () {}); + +/***/ }), +/* 110 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony default export */ __webpack_exports__["a"] = (function (v) { + return v; +}); + +/***/ }), +/* 111 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/* harmony export (immutable) */ __webpack_exports__["a"] = size; +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__is_nil__ = __webpack_require__(6); +/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__is_array_like__ = __webpack_require__(1); + + +function size(o) { + if (Object(__WEBPACK_IMPORTED_MODULE_0__is_nil__["a" /* default */])(o)) { + return 0; + } + + if (Object(__WEBPACK_IMPORTED_MODULE_1__is_array_like__["a" /* default */])(o)) { + return o.length; + } + + return Object.keys(o).length; +} + +/***/ }), +/* 112 */ +/***/ (function(module, __webpack_exports__, __webpack_require__) { +/** + * k-v 存储 + */ +var default_1 = +/** @class */ +function () { + function default_1() { + this.map = {}; + } + + default_1.prototype.has = function (key) { + return this.map[key] !== undefined; + }; + + default_1.prototype.get = function (key, def) { + var v = this.map[key]; + return v === undefined ? def : v; + }; + + default_1.prototype.set = function (key, value) { + this.map[key] = value; + }; + + default_1.prototype.clear = function () { + this.map = {}; + }; + + default_1.prototype.delete = function (key) { + delete this.map[key]; + }; + + default_1.prototype.size = function () { + return Object.keys(this.map).length; + }; + + return default_1; +}(); + +/* harmony default export */ __webpack_exports__["a"] = (default_1); + +/***/ }), +/* 113 */ +/***/ (function(module, exports) { + +// wrap tree node +function WrappedTree(w, h, y, c) { + if (c === void 0) { + c = []; + } + + var me = this; // size + + me.w = w || 0; + me.h = h || 0; // position + + me.y = y || 0; + me.x = 0; // children + + me.c = c || []; + me.cs = c.length; // modified + + me.prelim = 0; + me.mod = 0; + me.shift = 0; + me.change = 0; // left/right tree + + me.tl = null; + me.tr = null; // extreme left/right tree + + me.el = null; + me.er = null; // modified left/right tree + + me.msel = 0; + me.mser = 0; +} + +WrappedTree.fromNode = function (root, isHorizontal) { + if (!root) return null; + var children = []; + root.children.forEach(function (child) { + children.push(WrappedTree.fromNode(child, isHorizontal)); + }); + if (isHorizontal) return new WrappedTree(root.height, root.width, root.x, children); + return new WrappedTree(root.width, root.height, root.y, children); +}; // node utils + + +function moveRight(node, move, isHorizontal) { + if (isHorizontal) { + node.y += move; + } else { + node.x += move; + } + + node.children.forEach(function (child) { + moveRight(child, move, isHorizontal); + }); +} + +function getMin(node, isHorizontal) { + var res = isHorizontal ? node.y : node.x; + node.children.forEach(function (child) { + res = Math.min(getMin(child, isHorizontal), res); + }); + return res; +} + +function normalize(node, isHorizontal) { + var min = getMin(node, isHorizontal); + moveRight(node, -min, isHorizontal); +} + +function convertBack(converted +/* WrappedTree */ +, root +/* TreeNode */ +, isHorizontal) { + if (isHorizontal) { + root.y = converted.x; + } else { + root.x = converted.x; + } + + converted.c.forEach(function (child, i) { + convertBack(child, root.children[i], isHorizontal); + }); +} + +function layer(node, isHorizontal, d) { + if (d === void 0) { + d = 0; + } + + if (isHorizontal) { + node.x = d; + d += node.width; + } else { + node.y = d; + d += node.height; + } + + node.children.forEach(function (child) { + layer(child, isHorizontal, d); + }); +} + +module.exports = function (root, options) { + if (options === void 0) { + options = {}; + } + + var isHorizontal = options.isHorizontal; + + function firstWalk(t) { + if (t.cs === 0) { + setExtremes(t); + return; + } + + firstWalk(t.c[0]); + var ih = updateIYL(bottom(t.c[0].el), 0, null); + + for (var i = 1; i < t.cs; ++i) { + firstWalk(t.c[i]); + var min = bottom(t.c[i].er); + separate(t, i, ih); + ih = updateIYL(min, i, ih); + } + + positionRoot(t); + setExtremes(t); + } + + function setExtremes(t) { + if (t.cs === 0) { + t.el = t; + t.er = t; + t.msel = t.mser = 0; + } else { + t.el = t.c[0].el; + t.msel = t.c[0].msel; + t.er = t.c[t.cs - 1].er; + t.mser = t.c[t.cs - 1].mser; + } + } + + function separate(t, i, ih) { + var sr = t.c[i - 1]; + var mssr = sr.mod; + var cl = t.c[i]; + var mscl = cl.mod; + + while (sr !== null && cl !== null) { + if (bottom(sr) > ih.low) ih = ih.nxt; + var dist = mssr + sr.prelim + sr.w - (mscl + cl.prelim); + + if (dist > 0) { + mscl += dist; + moveSubtree(t, i, ih.index, dist); + } + + var sy = bottom(sr); + var cy = bottom(cl); + + if (sy <= cy) { + sr = nextRightContour(sr); + if (sr !== null) mssr += sr.mod; + } + + if (sy >= cy) { + cl = nextLeftContour(cl); + if (cl !== null) mscl += cl.mod; + } + } + + if (!sr && !!cl) { + setLeftThread(t, i, cl, mscl); + } else if (!!sr && !cl) { + setRightThread(t, i, sr, mssr); + } + } + + function moveSubtree(t, i, si, dist) { + t.c[i].mod += dist; + t.c[i].msel += dist; + t.c[i].mser += dist; + distributeExtra(t, i, si, dist); + } + + function nextLeftContour(t) { + return t.cs === 0 ? t.tl : t.c[0]; + } + + function nextRightContour(t) { + return t.cs === 0 ? t.tr : t.c[t.cs - 1]; + } + + function bottom(t) { + return t.y + t.h; + } + + function setLeftThread(t, i, cl, modsumcl) { + var li = t.c[0].el; + li.tl = cl; + var diff = modsumcl - cl.mod - t.c[0].msel; + li.mod += diff; + li.prelim -= diff; + t.c[0].el = t.c[i].el; + t.c[0].msel = t.c[i].msel; + } + + function setRightThread(t, i, sr, modsumsr) { + var ri = t.c[i].er; + ri.tr = sr; + var diff = modsumsr - sr.mod - t.c[i].mser; + ri.mod += diff; + ri.prelim -= diff; + t.c[i].er = t.c[i - 1].er; + t.c[i].mser = t.c[i - 1].mser; + } + + function positionRoot(t) { + t.prelim = (t.c[0].prelim + t.c[0].mod + t.c[t.cs - 1].mod + t.c[t.cs - 1].prelim + t.c[t.cs - 1].w) / 2 - t.w / 2; + } + + function secondWalk(t, modsum) { + modsum += t.mod; + t.x = t.prelim + modsum; + addChildSpacing(t); + + for (var i = 0; i < t.cs; i++) { + secondWalk(t.c[i], modsum); + } + } + + function distributeExtra(t, i, si, dist) { + if (si !== i - 1) { + var nr = i - si; + t.c[si + 1].shift += dist / nr; + t.c[i].shift -= dist / nr; + t.c[i].change -= dist - dist / nr; + } + } + + function addChildSpacing(t) { + var d = 0; + var modsumdelta = 0; + + for (var i = 0; i < t.cs; i++) { + d += t.c[i].shift; + modsumdelta += d + t.c[i].change; + t.c[i].mod += modsumdelta; + } + } + + function updateIYL(low, index, ih) { + while (ih !== null && low >= ih.low) { + ih = ih.nxt; + } + + return { + low: low, + index: index, + nxt: ih + }; + } // do layout + + + layer(root, isHorizontal); + var wt = WrappedTree.fromNode(root, isHorizontal); + firstWalk(wt); + secondWalk(wt, 0); + convertBack(wt, root, isHorizontal); + normalize(root, isHorizontal); + return root; +}; + +/***/ }), +/* 114 */ +/***/ (function(module, exports, __webpack_require__) { + +function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; } + +var TreeLayout = __webpack_require__(11); + +var dendrogram = __webpack_require__(115); + +var doTreeLayout = __webpack_require__(17); + +var util = __webpack_require__(7); + +var DendrogramLayout = /*#__PURE__*/function (_TreeLayout) { + _inheritsLoose(DendrogramLayout, _TreeLayout); + + function DendrogramLayout() { + return _TreeLayout.apply(this, arguments) || this; + } + + var _proto = DendrogramLayout.prototype; + + _proto.execute = function execute() { + var me = this; + me.rootNode.width = 0; + return doTreeLayout(me.rootNode, me.options, dendrogram); + }; + + return DendrogramLayout; +}(TreeLayout); + +var DEFAULT_OPTIONS = {}; + +function dendrogramLayout(root, options) { + options = util.assign({}, DEFAULT_OPTIONS, options); + return new DendrogramLayout(root, options).execute(); +} + +module.exports = dendrogramLayout; + +/***/ }), +/* 115 */ +/***/ (function(module, exports, __webpack_require__) { + +// wrap tree node +// TODO considering size +var util = __webpack_require__(7); + +function WrappedTree(height, children) { + + if (children === void 0) { + children = []; + } + + var me = this; + me.x = me.y = 0; + me.leftChild = me.rightChild = null; + me.height = 0; + me.children = children; +} + +var DEFAULT_OPTIONS = { + isHorizontal: true, + nodeSep: 20, + nodeSize: 20, + rankSep: 200, + subTreeSep: 10 +}; + +function convertBack(converted +/* WrappedTree */ +, root +/* TreeNode */ +, isHorizontal) { + if (isHorizontal) { + root.x = converted.x; + root.y = converted.y; + } else { + root.x = converted.y; + root.y = converted.x; + } + + converted.children.forEach(function (child, i) { + convertBack(child, root.children[i], isHorizontal); + }); +} + +module.exports = function (root, options) { + if (options === void 0) { + options = {}; + } + + options = util.assign({}, DEFAULT_OPTIONS, options); + var maxDepth = 0; + + function wrappedTreeFromNode(n) { + if (!n) return null; + n.width = 0; + + if (n.depth && n.depth > maxDepth) { + maxDepth = n.depth; // get the max depth + } + + var children = n.children; + var childrenCount = children.length; + var t = new WrappedTree(n.height, []); + children.forEach(function (child, i) { + var childWT = wrappedTreeFromNode(child); + t.children.push(childWT); + + if (i === 0) { + // t.leftChild = childWT.leftChild ? childWT.leftChild : childWT + t.leftChild = childWT; + } + + if (i === childrenCount - 1) { + // t.rightChild = childWT.rightChild ? childWT.rightChild : childWT + t.rightChild = childWT; + } + }); + t.originNode = n; + t.isLeaf = n.isLeaf(); + return t; + } + + function getDrawingDepth(t) { + if (t.isLeaf || t.children.length === 0) { + t.drawingDepth = maxDepth; + } else { + var depths = t.children.map(function (child) { + return getDrawingDepth(child); + }); + var minChildDepth = Math.min.apply(null, depths); + t.drawingDepth = minChildDepth - 1; + } + + return t.drawingDepth; + } + + var prevLeaf; + + function position(t) { + t.x = t.drawingDepth * options.rankSep; + + if (t.isLeaf) { + t.y = 0; + + if (prevLeaf) { + t.y = prevLeaf.y + prevLeaf.height + options.nodeSep; + + if (t.originNode.parent !== prevLeaf.originNode.parent) { + t.y += options.subTreeSep; + } + } + + prevLeaf = t; + } else { + t.children.forEach(function (child) { + position(child); + }); + t.y = (t.leftChild.y + t.rightChild.y) / 2; + } + } // wrap node + + + var wt = wrappedTreeFromNode(root); // get depth for drawing + + getDrawingDepth(wt); // get position + + position(wt); // get x, y + + convertBack(wt, root, options.isHorizontal); + return root; +}; + +/***/ }), +/* 116 */ +/***/ (function(module, exports, __webpack_require__) { + +function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; } + +var TreeLayout = __webpack_require__(11); + +var indentedTree = __webpack_require__(117); + +var separateTree = __webpack_require__(30); + +var util = __webpack_require__(7); + +var VALID_DIRECTIONS = ['LR', // left to right +'RL', // right to left +'H' // horizontal +]; +var DEFAULT_DIRECTION = VALID_DIRECTIONS[0]; + +var IndentedLayout = /*#__PURE__*/function (_TreeLayout) { + _inheritsLoose(IndentedLayout, _TreeLayout); + + function IndentedLayout() { + return _TreeLayout.apply(this, arguments) || this; + } + + var _proto = IndentedLayout.prototype; + + _proto.execute = function execute() { + var me = this; + var options = me.options; + var root = me.rootNode; + options.isHorizontal = true; // default indent 20 and sink first children; + + var _options$indent = options.indent, + indent = _options$indent === void 0 ? 20 : _options$indent, + _options$dropCap = options.dropCap, + dropCap = _options$dropCap === void 0 ? true : _options$dropCap; + var direction = options.direction || DEFAULT_DIRECTION; + + if (direction && VALID_DIRECTIONS.indexOf(direction) === -1) { + throw new TypeError("Invalid direction: " + direction); + } + + if (direction === VALID_DIRECTIONS[0]) { + // LR + indentedTree(root, indent, dropCap); + } else if (direction === VALID_DIRECTIONS[1]) { + // RL + indentedTree(root, indent, dropCap); + root.right2left(); + } else if (direction === VALID_DIRECTIONS[2]) { + // H + // separate into left and right trees + var _separateTree = separateTree(root, options), + left = _separateTree.left, + right = _separateTree.right; + + indentedTree(left, indent, dropCap); + left.right2left(); + indentedTree(right, indent, dropCap); + var bbox = left.getBoundingBox(); + right.translate(bbox.width, 0); + root.x = right.x - root.width / 2; + } + + return root; + }; + + return IndentedLayout; +}(TreeLayout); + +var DEFAULT_OPTIONS = {}; + +function indentedLayout(root, options) { + options = util.assign({}, DEFAULT_OPTIONS, options); + return new IndentedLayout(root, options).execute(); +} + +module.exports = indentedLayout; + +/***/ }), +/* 117 */ +/***/ (function(module, exports) { + +function positionNode(node, previousNode, indent, dropCap) { + // caculate the node's horizontal offset DX, dx's type might be number or function + var displacementX = typeof indent === 'function' ? indent(node) : indent * node.depth; + + if (!dropCap) { + try { + if (node.id === node.parent.children[0].id) { + node.x += displacementX; + node.y = previousNode ? previousNode.y : 0; + return; + } + } catch (e) {// skip to normal when a node has no parent + } + } + + node.x += displacementX; + node.y = previousNode ? previousNode.y + previousNode.height : 0; + return; +} + +module.exports = function (root, indent, dropCap) { + var previousNode = null; + root.eachNode(function (node) { + positionNode(node, previousNode, indent, dropCap); + previousNode = node; + }); +}; + +/***/ }), +/* 118 */ +/***/ (function(module, exports, __webpack_require__) { + +function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; } + +var TreeLayout = __webpack_require__(11); + +var mindmap = __webpack_require__(119); + +var doTreeLayout = __webpack_require__(17); + +var util = __webpack_require__(7); + +var MindmapLayout = /*#__PURE__*/function (_TreeLayout) { + _inheritsLoose(MindmapLayout, _TreeLayout); + + function MindmapLayout() { + return _TreeLayout.apply(this, arguments) || this; + } + + var _proto = MindmapLayout.prototype; + + _proto.execute = function execute() { + var me = this; + return doTreeLayout(me.rootNode, me.options, mindmap); + }; + + return MindmapLayout; +}(TreeLayout); + +var DEFAULT_OPTIONS = {}; + +function mindmapLayout(root, options) { + options = util.assign({}, DEFAULT_OPTIONS, options); + return new MindmapLayout(root, options).execute(); +} + +module.exports = mindmapLayout; + +/***/ }), +/* 119 */ +/***/ (function(module, exports, __webpack_require__) { + +var util = __webpack_require__(7); + +function secondWalk(node, options) { + var totalHeight = 0; + + if (!node.children.length) { + totalHeight = node.height; + } else { + node.children.forEach(function (c) { + totalHeight += secondWalk(c, options); + }); + } + + node._subTreeSep = options.getSubTreeSep(node.data); + node.totalHeight = Math.max(node.height, totalHeight) + 2 * node._subTreeSep; + return node.totalHeight; +} + +function thirdWalk(node) { + var children = node.children; + var len = children.length; + + if (len) { + children.forEach(function (c) { + thirdWalk(c); + }); + var first = children[0]; + var last = children[len - 1]; + var childrenHeight = last.y - first.y + last.height; + var childrenTotalHeight = 0; + children.forEach(function (child) { + childrenTotalHeight += child.totalHeight; + }); + + if (childrenHeight > node.height) { + // 当子节点总高度大于父节点高度 + node.y = first.y + childrenHeight / 2 - node.height / 2; + } else if (children.length !== 1 || node.height > childrenTotalHeight) { + // 多于一个子节点或者父节点大于所有子节点的总高度 + var offset = node.y + (node.height - childrenHeight) / 2 - first.y; + children.forEach(function (c) { + c.translate(0, offset); + }); + } else { + // 只有一个子节点 + node.y = (first.y + first.height / 2 + last.y + last.height / 2) / 2 - node.height / 2; + } + } +} + +var DEFAULT_OPTIONS = { + getSubTreeSep: function getSubTreeSep() { + return 0; + } +}; + +module.exports = function (root, options) { + if (options === void 0) { + options = {}; + } + + options = util.assign({}, DEFAULT_OPTIONS, options); + root.parent = { + x: 0, + width: 0, + height: 0, + y: 0 + }; // first walk + + root.BFTraverse(function (node) { + node.x = node.parent.x + node.parent.width; // simply get x + }); + root.parent = null; // second walk + + secondWalk(root, options); // assign sub tree totalHeight + // adjusting + // separating nodes + + root.startY = 0; + root.y = root.totalHeight / 2 - root.height / 2; + root.eachNode(function (node) { + var children = node.children; + var len = children.length; + + if (len) { + var first = children[0]; + first.startY = node.startY + node._subTreeSep; + + if (len === 1) { + first.y = node.y + node.height / 2 - first.height / 2; + } else { + first.y = first.startY + first.totalHeight / 2 - first.height / 2; + + for (var i = 1; i < len; i++) { + var c = children[i]; + c.startY = children[i - 1].startY + children[i - 1].totalHeight; + c.y = c.startY + c.totalHeight / 2 - c.height / 2; + } + } + } + }); // third walk + + thirdWalk(root); +}; + +/***/ }) +/******/ ]); +}); + +}(hierarchy)); + +var Hierarchy = /*@__PURE__*/getDefaultExportFromCjs(hierarchy.exports); + +var traverseTree$1 = Util.traverseTree; +/** + * 将 number | Function 类型的参数转换为 return number 的 Function + * @param {number | Function} value 需要被转换的值 + * @param {number} defaultV 返回函数的默认返回值 + * @return {Function} 转换后的函数 + */ + +var proccessToFunc = function proccessToFunc(value, defaultV) { + var func; + + if (!value) { + func = function func(d) { + return defaultV || 1; + }; + } else if (isNumber$4(value)) { + func = function func(d) { + return value; + }; + } else { + func = value; + } + + return func; +}; +/** + * 将节点和边数据转换为 GPU 可读的数组。并返回 maxEdgePerVetex，每个节点上最多的边数 + * @param {NodeConfig[]} nodes 需要被转换的值 + * @param {EdgeConfig[]} edges 返回函数的默认返回值 + * @return {Object} 转换后的数组及 maxEdgePerVetex 组成的对象 + */ + +var buildTextureData = function buildTextureData(nodes, edges) { + var dataArray = []; + var nodeDict = []; + var mapIdPos = {}; + var i = 0; + + for (i = 0; i < nodes.length; i++) { + var n = nodes[i]; + mapIdPos[n.id] = i; + dataArray.push(n.x); + dataArray.push(n.y); + dataArray.push(0); + dataArray.push(0); + nodeDict.push([]); + } + + for (i = 0; i < edges.length; i++) { + var e = edges[i]; + nodeDict[mapIdPos[e.source]].push(mapIdPos[e.target]); + nodeDict[mapIdPos[e.target]].push(mapIdPos[e.source]); + } + + var maxEdgePerVetex = 0; + + for (i = 0; i < nodes.length; i++) { + var offset = dataArray.length; + var dests = nodeDict[i]; + var len = dests.length; + dataArray[i * 4 + 2] = offset; + dataArray[i * 4 + 3] = dests.length; + maxEdgePerVetex = Math.max(maxEdgePerVetex, dests.length); + + for (var j = 0; j < len; ++j) { + var dest = dests[j]; + dataArray.push(+dest); + } + } + + while (dataArray.length % 4 !== 0) { + dataArray.push(0); + } + + return { + array: new Float32Array(dataArray), + maxEdgePerVetex: maxEdgePerVetex + }; +}; +/** + * 将节点和边数据转换为 GPU 可读的数组，每条边带有一个属性。并返回 maxEdgePerVetex，每个节点上最多的边数 + * @param {NodeConfig[]} nodes 节点数组 + * @param {EdgeConfig[]} edges 边数组 + * @param {Function} attrs 读取边属性的函数 + * @return {Object} 转换后的数组及 maxEdgePerVetex 组成的对象 + */ + +var buildTextureDataWithOneEdgeAttr = function buildTextureDataWithOneEdgeAttr(nodes, edges, attrs) { + var dataArray = []; + var nodeDict = []; + var mapIdPos = {}; + var i = 0; + + for (i = 0; i < nodes.length; i++) { + var n = nodes[i]; + mapIdPos[n.id] = i; + dataArray.push(n.x); + dataArray.push(n.y); + dataArray.push(0); + dataArray.push(0); + nodeDict.push([]); + } + + for (i = 0; i < edges.length; i++) { + var e = edges[i]; + nodeDict[mapIdPos[e.source]].push(mapIdPos[e.target]); + nodeDict[mapIdPos[e.source]].push(attrs(e)); // 理想边长，后续可以改成每条边不同 + + nodeDict[mapIdPos[e.target]].push(mapIdPos[e.source]); + nodeDict[mapIdPos[e.target]].push(attrs(e)); // 理想边长，后续可以改成每条边不同 + } + + var maxEdgePerVetex = 0; + + for (i = 0; i < nodes.length; i++) { + var offset = dataArray.length; + var dests = nodeDict[i]; // dest 中节点 id 与边长间隔存储，即一位节点 id，一位边长…… + + var len = dests.length; + dataArray[i * 4 + 2] = offset; + dataArray[i * 4 + 3] = len / 2; // 第四位存储与该节点相关的所有节点个数 + + maxEdgePerVetex = Math.max(maxEdgePerVetex, len / 2); + + for (var j = 0; j < len; ++j) { + var dest = dests[j]; + dataArray.push(+dest); + } + } // 不是 4 的倍数，填充 0 + + + while (dataArray.length % 4 !== 0) { + dataArray.push(0); + } + + return { + array: new Float32Array(dataArray), + maxEdgePerVetex: maxEdgePerVetex + }; +}; +/** + * 将节点和边数据转换为 GPU 可读的数组，每条边带有一个以上属性。并返回 maxEdgePerVetex，每个节点上最多的边数 + * @param {NodeConfig[]} nodes 节点数组 + * @param {EdgeConfig[]} edges 边数组 + * @param {Function} attrs 读取边属性的函数 + * @return {Object} 转换后的数组及 maxEdgePerVetex 组成的对象 + */ + +var buildTextureDataWithTwoEdgeAttr = function buildTextureDataWithTwoEdgeAttr(nodes, edges, attrs1, attrs2) { + var dataArray = []; + var nodeDict = []; + var mapIdPos = {}; + var i = 0; + + for (i = 0; i < nodes.length; i++) { + var n = nodes[i]; + mapIdPos[n.id] = i; + dataArray.push(n.x); + dataArray.push(n.y); + dataArray.push(0); + dataArray.push(0); + nodeDict.push([]); + } + + for (i = 0; i < edges.length; i++) { + var e = edges[i]; + nodeDict[mapIdPos[e.source]].push(mapIdPos[e.target]); + nodeDict[mapIdPos[e.source]].push(attrs1(e)); + nodeDict[mapIdPos[e.source]].push(attrs2(e)); + nodeDict[mapIdPos[e.source]].push(0); + nodeDict[mapIdPos[e.target]].push(mapIdPos[e.source]); + nodeDict[mapIdPos[e.target]].push(attrs1(e)); + nodeDict[mapIdPos[e.target]].push(attrs2(e)); + nodeDict[mapIdPos[e.target]].push(0); + } + + var maxEdgePerVetex = 0; + + for (i = 0; i < nodes.length; i++) { + var offset = dataArray.length; + var dests = nodeDict[i]; // dest 中节点 id 与边长间隔存储，即一位节点 id，一位边长…… + + var len = dests.length; // dataArray[i * 4 + 2] = offset; + // dataArray[i * 4 + 3] = len / 4; // 第四位存储与该节点相关的所有节点个数 + // pack offset & length into float32: offset 20bit, length 12bit + + dataArray[i * 4 + 2] = offset + 1048576 * len / 4; + dataArray[i * 4 + 3] = 0; // 第四位存储与上一次的距离差值 + + maxEdgePerVetex = Math.max(maxEdgePerVetex, len / 4); + + for (var j = 0; j < len; ++j) { + var dest = dests[j]; + dataArray.push(+dest); + } + } // 不是 4 的倍数，填充 0 + + + while (dataArray.length % 4 !== 0) { + dataArray.push(0); + } + + return { + array: new Float32Array(dataArray), + maxEdgePerVetex: maxEdgePerVetex + }; +}; +/** + * transform the extended attributes of nodes or edges to a texture array + * @param {string[]} attributeNames attributes' name to be read from items and put into output array + * @param {ModelConfig[]} items the items to be read + * @return {Float32Array} the attributes' value array to be read by GPU + */ + +var attributesToTextureData = function attributesToTextureData(attributeNames, items) { + var dataArray = []; + var attributeNum = attributeNames.length; + var attributteStringMap = {}; + items.forEach(function (item) { + attributeNames.forEach(function (name, i) { + if (attributteStringMap[item[name]] === undefined) { + attributteStringMap[item[name]] = Object.keys(attributteStringMap).length; + } + + dataArray.push(attributteStringMap[item[name]]); // insure each node's attributes take inter number of grids + + if (i === attributeNum - 1) { + while (dataArray.length % 4 !== 0) { + dataArray.push(0); + } + } + }); + }); + return { + array: new Float32Array(dataArray), + count: Object.keys(attributteStringMap).length + }; +}; +/** + * transform the number array format of extended attributes of nodes or edges to a texture array + * @param {string[]} attributeNames attributes' name to be read from items and put into output array + * @return {Float32Array} the attributes' value array to be read by GPU + */ + +var arrayToTextureData = function arrayToTextureData(valueArrays) { + var dataArray = []; + var attributeNum = valueArrays.length; + var itemNum = valueArrays[0].length; + + var _loop_1 = function _loop_1(j) { + valueArrays.forEach(function (valueArray, i) { + dataArray.push(valueArray[j]); // insure each node's attributes take inter number of grids + + if (i === attributeNum - 1) { + while (dataArray.length % 4 !== 0) { + dataArray.push(0); + } + } + }); + }; + + for (var j = 0; j < itemNum; j++) { + _loop_1(j); + } + + return new Float32Array(dataArray); +}; +/** + * + * @param data Tree graph data + * @param layout + */ + +var radialLayout$1 = function radialLayout(data, layout) { + // 布局方式有 H / V / LR / RL / TB / BT + var VERTICAL_LAYOUTS = ['V', 'TB', 'BT']; + var min = { + x: Infinity, + y: Infinity + }; + var max = { + x: -Infinity, + y: -Infinity + }; // 默认布局是垂直布局TB，此时x对应rad，y对应r + + var rScale = 'x'; + var radScale = 'y'; + + if (layout && VERTICAL_LAYOUTS.indexOf(layout) >= 0) { + // 若是水平布局，y对应rad，x对应r + radScale = 'x'; + rScale = 'y'; + } + + var count = 0; + traverseTree$1(data, function (node) { + count++; + + if (node.x > max.x) { + max.x = node.x; + } + + if (node.x < min.x) { + min.x = node.x; + } + + if (node.y > max.y) { + max.y = node.y; + } + + if (node.y < min.y) { + min.y = node.y; + } + + return true; + }); + var avgRad = Math.PI * 2 / count; + var radDiff = max[radScale] - min[radScale]; + + if (radDiff === 0) { + return data; + } + + traverseTree$1(data, function (node) { + var radial = (node[radScale] - min[radScale]) / radDiff * (Math.PI * 2 - avgRad) + avgRad; + var r = Math.abs(rScale === 'x' ? node.x - data.x : node.y - data.y); + node.x = r * Math.cos(radial); + node.y = r * Math.sin(radial); + return true; + }); + return data; +}; + +var LayoutUtil = /*#__PURE__*/Object.freeze({ + __proto__: null, + proccessToFunc: proccessToFunc, + buildTextureData: buildTextureData, + buildTextureDataWithOneEdgeAttr: buildTextureDataWithOneEdgeAttr, + buildTextureDataWithTwoEdgeAttr: buildTextureDataWithTwoEdgeAttr, + attributesToTextureData: attributesToTextureData, + arrayToTextureData: arrayToTextureData, + radialLayout: radialLayout$1 +}); + +var G6Util = __assign$r(__assign$r(__assign$r(__assign$r({}, Util), ColorUtil), LayoutUtil), GpuUtil); + +var radialLayout = G6Util.radialLayout, + traverseTree = G6Util.traverseTree; + +var TreeGraph = +/** @class */ +function (_super) { + __extends$e(TreeGraph, _super); + + function TreeGraph(cfg) { + var _this = _super.call(this, cfg) || this; + + _this.layoutAnimating = false; // 用于缓存动画结束后需要删除的节点 + + _this.set('removeList', []); + + _this.set('layoutMethod', _this.getLayout()); + + return _this; + } + /** + * 通过 Layout 配置获取布局配置 + */ + + + TreeGraph.prototype.getLayout = function () { + var layout = this.get('layout'); + + if (!layout) { + return null; + } + + if (typeof layout === 'function') { + return layout; + } + + if (!layout.type) { + layout.type = 'dendrogram'; + } + + if (!layout.direction) { + layout.direction = 'TB'; + } + + if (layout.radial) { + return function (data) { + var layoutData = Hierarchy[layout.type](data, layout); + radialLayout(layoutData); + return layoutData; + }; + } + + return function (data) { + return Hierarchy[layout.type](data, layout); + }; + }; + /** + * 返回指定节点在树图数据中的索引 + * @param children 树图数据 + * @param child 树图中某一个 Item 的数据 + */ + + + TreeGraph.indexOfChild = function (children, id) { + var index = -1; // eslint-disable-next-line consistent-return + + each$2(children, function (former, i) { + if (id === former.id) { + index = i; + return false; + } + }); + return index; + }; + + TreeGraph.prototype.getDefaultCfg = function () { + var cfg = _super.prototype.getDefaultCfg.call(this); // 树图默认打开动画 + + + cfg.animate = true; + return cfg; + }; + /** + * 向🌲树中添加数据 + * @param treeData 树图数据 + * @param parent 父节点实例 + * @param animate 是否开启动画 + */ + + + TreeGraph.prototype.innerAddChild = function (treeData, parent, animate) { + var self = this; + var model = treeData.data; + + if (model) { + // model 中应存储真实的数据，特别是真实的 children + model.x = treeData.x; + model.y = treeData.y; + model.depth = treeData.depth; + } + + var node = self.addItem('node', model, false); + + if (parent) { + node.set('parent', parent); + + if (animate) { + var origin_1 = parent.get('originAttrs'); + + if (origin_1) { + node.set('originAttrs', origin_1); + } else { + var parentModel = parent.getModel(); + node.set('originAttrs', { + x: parentModel.x, + y: parentModel.y + }); + } + } + + var childrenList = parent.get('children'); + + if (!childrenList) { + parent.set('children', [node]); + } else { + childrenList.push(node); + } + + self.addItem('edge', { + source: parent, + target: node, + id: parent.get('id') + ":" + node.get('id') + }, false); + } // 渲染到视图上应参考布局的children, 避免多绘制了收起的节点 + + + each$2(treeData.children || [], function (child) { + self.innerAddChild(child, node, animate); + }); + self.emit('afteraddchild', { + item: node, + parent: parent + }); + return node; + }; + /** + * 将数据上的变更转换到视图上 + * @param data + * @param parent + * @param animate + */ + + + TreeGraph.prototype.innerUpdateChild = function (data, parent, animate) { + var self = this; + var current = self.findById(data.id); // 若子树不存在，整体添加即可 + + if (!current) { + self.innerAddChild(data, parent, animate); + return; + } // 更新新节点下所有子节点 + + + each$2(data.children || [], function (child) { + self.innerUpdateChild(child, current, animate); + }); // 用现在节点的children实例来删除移除的子节点 + + var children = current.get('children'); + + if (children) { + var len = children.length; + + if (len > 0) { + for (var i = children.length - 1; i >= 0; i--) { + var child = children[i].getModel(); + + if (TreeGraph.indexOfChild(data.children || [], child.id) === -1) { + self.innerRemoveChild(child.id, { + x: data.x, + y: data.y + }, animate); // 更新父节点下缓存的子节点 item 实例列表 + + children.splice(i, 1); + } + } + } + } + + var oriX; + var oriY; + + if (current.get('originAttrs')) { + oriX = current.get('originAttrs').x; + oriY = current.get('originAttrs').y; + } + + var model = current.getModel(); + + if (animate) { + // 如果有动画，先缓存节点运动再更新节点 + current.set('originAttrs', { + x: model.x, + y: model.y + }); + } + + current.set('model', data.data); + + if (oriX !== data.x || oriY !== data.y) { + current.updatePosition({ + x: data.x, + y: data.y + }); + } + }; + /** + * 删除子节点Item对象 + * @param id + * @param to + * @param animate + */ + + + TreeGraph.prototype.innerRemoveChild = function (id, to, animate) { + var self = this; + var node = self.findById(id); + + if (!node) { + return; + } + + each$2(node.get('children'), function (child) { + self.innerRemoveChild(child.getModel().id, to, animate); + }); + + if (animate) { + var model = node.getModel(); + node.set('to', to); + node.set('originAttrs', { + x: model.x, + y: model.y + }); + self.get('removeList').push(node); + } else { + self.removeItem(node); + } + }; + /** + * 更新数据模型，差量更新并重新渲染 + * @param {object} data 数据模型 + */ + + + TreeGraph.prototype.changeData = function (data) { + var self = this; // 更改数据源后，取消所有状态 + + this.getNodes().map(function (node) { + return self.clearItemStates(node); + }); + this.getEdges().map(function (edge) { + return self.clearItemStates(edge); + }); + + if (data) { + self.data(data); + self.render(); + } else { + self.layout(this.get('fitView')); + } + }; + /** + * 已更名为 updateLayout，为保持兼容暂且保留。 + * 更改并应用树布局算法 + * @param {object} layout 布局算法 + */ + + + TreeGraph.prototype.changeLayout = function (layout) { + // eslint-disable-next-line no-console + console.warn('Please call updateLayout instead of changeLayout. changeLayout will be discarded soon'); + var self = this; + self.updateLayout(layout); + }; + /** + * 更改并应用树布局算法 + * @param {object} layout 布局算法 + */ + + + TreeGraph.prototype.updateLayout = function (layout) { + var self = this; + + if (!layout) { + // eslint-disable-next-line no-console + console.warn('layout cannot be null'); + return; + } + + self.set('layout', layout); + self.set('layoutMethod', self.getLayout()); + self.layout(); + }; + /** + * 已更名为 layout，为保持兼容暂且保留。 + * 根据目前的 data 刷新布局，更新到画布上。用于变更数据之后刷新视图。 + * @param {boolean} fitView 更新布局时是否需要适应窗口 + */ + + + TreeGraph.prototype.refreshLayout = function (fitView) { + // eslint-disable-next-line no-console + console.warn('Please call layout instead of refreshLayout. refreshLayout will be discarded soon'); + var self = this; + self.layout(fitView); + }; + /** + * 根据目前的 data 刷新布局，更新到画布上。用于变更数据之后刷新视图。 + * @param {boolean} fitView 更新布局时是否需要适应窗口 + */ + + + TreeGraph.prototype.layout = function (fitView) { + var self = this; + var data = self.get('data'); + var layoutMethod = self.get('layoutMethod'); + var layoutData = layoutMethod(data, self.get('layout')); + var animate = self.get('animate'); + self.emit('beforerefreshlayout', { + data: data, + layoutData: layoutData + }); + self.emit('beforelayout'); + self.innerUpdateChild(layoutData, undefined, animate); + + if (fitView) { + var viewController = self.get('viewController'); + viewController.fitView(); + } + + if (!animate) { + // 如果没有动画，目前仅更新了节点的位置，刷新一下边的样式 + self.refresh(); + self.paint(); + } else { + self.layoutAnimate(layoutData); + } + + self.emit('afterrefreshlayout', { + data: data, + layoutData: layoutData + }); + self.emit('afterlayout'); + }; + /** + * 添加子树到对应 id 的节点 + * @param {TreeGraphData} data 子树数据模型 + * @param {string} parent 子树的父节点id + */ + + + TreeGraph.prototype.addChild = function (data, parent) { + var self = this; + self.emit('beforeaddchild', { + model: data, + parent: parent + }); // 将数据添加到源数据中，走changeData方法 + + if (!isString$3(parent)) { + parent = parent.get('id'); + } + + var parentData = self.findDataById(parent); + + if (parentData) { + if (!parentData.children) { + parentData.children = []; + } + + parentData.children.push(data); + self.changeData(); + } + }; + /** + * 更新某个节点下的所有子节点 + * @param {TreeGraphData[]} data 子树数据模型集合 + * @param {string} parent 子树的父节点id + */ + + + TreeGraph.prototype.updateChildren = function (data, parentId) { + var self = this; // 如果没有父节点或找不到该节点，是全量的更新，直接重置data + + if (!parentId || !self.findById(parentId)) { + console.warn("Update children failed! There is no node with id '" + parentId + "'"); + return; + } + + var parentModel = self.findDataById(parentId); + parentModel.children = data; + self.changeData(); + }; + /** + * 更新源数据，差量更新子树 + * @param {TreeGraphData} data 子树数据模型 + * @param {string} parentId 子树的父节点id + */ + + + TreeGraph.prototype.updateChild = function (data, parentId) { + var self = this; // 如果没有父节点或找不到该节点，是全量的更新，直接重置data + + if (!parentId || !self.findById(parentId)) { + self.changeData(data); + return; + } + + var parentModel = self.findDataById(parentId); + var current = self.findById(data.id); + + if (!parentModel.children) { + // 当 current 不存在时，children 为空数组 + parentModel.children = []; + } // 如果不存在该节点，则添加 + + + if (!current) { + parentModel.children.push(data); + } else { + var index = TreeGraph.indexOfChild(parentModel.children, data.id); + parentModel.children[index] = data; + } + + self.changeData(); + }; + /** + * 删除子树 + * @param {string} id 子树根节点id + */ + + + TreeGraph.prototype.removeChild = function (id) { + var self = this; + var node = self.findById(id); + + if (!node) { + return; + } + + var parent = node.get('parent'); + + if (parent && !parent.destroyed) { + var parentNode = self.findDataById(parent.get('id')); + var siblings = parentNode && parentNode.children || []; + var model = node.getModel(); + var index = TreeGraph.indexOfChild(siblings, model.id); + siblings.splice(index, 1); + } + + self.changeData(); + }; + /** + * 根据id获取对应的源数据 + * @param {string} id 元素id + * @param {TreeGraphData | undefined} parent 从哪个节点开始寻找，为空时从根节点开始查找 + * @return {TreeGraphData} 对应源数据 + */ + + + TreeGraph.prototype.findDataById = function (id, parent) { + var self = this; + + if (!parent) { + parent = self.get('data'); + } + + if (id === parent.id) { + return parent; + } + + var result = null; // eslint-disable-next-line consistent-return + + each$2(parent.children || [], function (child) { + if (child.id === id) { + result = child; + return false; + } + + result = self.findDataById(id, child); + + if (result) { + return false; + } + }); + return result; + }; + /** + * 布局动画接口，用于数据更新时做节点位置更新的动画 + * @param {TreeGraphData} data 更新的数据 + * @param {function} onFrame 定义节点位置更新时如何移动 + */ + + + TreeGraph.prototype.layoutAnimate = function (data, onFrame) { + var self = this; + var animateCfg = this.get('animateCfg'); + self.emit('beforeanimate', { + data: data + }); // 如果边中没有指定锚点，但是本身有锚点控制，在动画过程中保持锚点不变 + + self.getEdges().forEach(function (edge) { + var model = edge.get('model'); + + if (!model.sourceAnchor) { + model.sourceAnchor = edge.get('sourceAnchorIndex'); + } + }); + this.get('canvas').animate(function (ratio) { + traverseTree(data, function (child) { + var node = self.findById(child.id); // 只有当存在node的时候才执行 + + if (node) { + var origin_2 = node.get('originAttrs'); + var model = node.get('model'); + + if (!origin_2) { + origin_2 = { + x: model.x, + y: model.y + }; + node.set('originAttrs', origin_2); + } + + if (onFrame) { + var attrs = onFrame(node, ratio, origin_2, data); + node.set('model', Object.assign(model, attrs)); + } else { + model.x = origin_2.x + (child.x - origin_2.x) * ratio; + model.y = origin_2.y + (child.y - origin_2.y) * ratio; + } + } + + return true; + }); + each$2(self.get('removeList'), function (node) { + var model = node.getModel(); + var from = node.get('originAttrs'); + var to = node.get('to'); + model.x = from.x + (to.x - from.x) * ratio; + model.y = from.y + (to.y - from.y) * ratio; + }); + self.refreshPositions(); + }, { + duration: animateCfg.duration, + easing: animateCfg.ease, + callback: function callback() { + each$2(self.getNodes(), function (node) { + node.set('originAttrs', null); + }); + each$2(self.get('removeList'), function (node) { + self.removeItem(node); + }); + self.set('removeList', []); + + if (animateCfg.callback) { + animateCfg.callback(); + } + + self.emit('afteranimate', { + data: data + }); + }, + delay: animateCfg.delay + }); + }; + /** + * 立即停止布局动画 + */ + + + TreeGraph.prototype.stopLayoutAnimate = function () { + this.get('canvas').stopAnimate(); + this.emit('layoutanimateend', { + data: this.get('data') + }); + this.layoutAnimating = false; + }; + /** + * 是否在布局动画 + * @return {boolean} 是否有布局动画 + */ + + + TreeGraph.prototype.isLayoutAnimating = function () { + return this.layoutAnimating; + }; + /** + * 根据data接口的数据渲染视图 + */ + + + TreeGraph.prototype.render = function () { + var self = this; + var data = self.get('data'); + + if (!data) { + throw new Error('data must be defined first'); + } + + self.clear(); + self.emit('beforerender'); + self.layout(this.get('fitView')); + self.emit('afterrender'); + }; + /** + * 导出图数据 + * @return {object} data + */ + + + TreeGraph.prototype.save = function () { + return this.get('data'); + }; + + return TreeGraph; +}(Graph); + +var PluginBase = +/** @class */ +function () { + /** + * 插件基类的构造函数 + * @param cfgs 插件的配置项 + */ + function PluginBase(cfgs) { + this._cfgs = deepMix(this.getDefaultCfgs(), cfgs); + this._events = {}; + this.destroyed = false; + } + /** + * 获取默认的插件配置 + */ + + + PluginBase.prototype.getDefaultCfgs = function () { + return {}; + }; + /** + * 初始化插件 + * @param graph IGraph 实例 + */ + + + PluginBase.prototype.initPlugin = function (graph) { + var self = this; + self.set('graph', graph); + var events = self.getEvents(); + var bindEvents = {}; + each$2(events, function (v, k) { + var event = wrapBehavior(self, v); + bindEvents[k] = event; + graph.on(k, event); + }); + this._events = bindEvents; + this.init(); + }; + /** + * 获取插件中的事件和事件处理方法，供子类实现 + */ + + + PluginBase.prototype.getEvents = function () { + return {}; + }; + /** + * 获取配置项中的某个值 + * @param key 键值 + */ + + + PluginBase.prototype.get = function (key) { + return this._cfgs[key]; + }; + /** + * 将指定的值存储到 cfgs 中 + * @param key 键值 + * @param val 设置的值 + */ + + + PluginBase.prototype.set = function (key, val) { + this._cfgs[key] = val; + }; + /** + * 销毁方法，供子类复写 + */ + + + PluginBase.prototype.destroy = function () {}; + /** + * 销毁插件 + */ + + + PluginBase.prototype.destroyPlugin = function () { + this.destroy(); + var graph = this.get('graph'); + var events = this._events; + each$2(events, function (v, k) { + graph.off(k, v); + }); + this._events = null; + this._cfgs = null; + this.destroyed = true; + }; + + return PluginBase; +}(); + +var PluginBase$1 = PluginBase; + +var __extends$a = undefined && undefined.__extends || function () { + var _extendStatics = function extendStatics(d, b) { + _extendStatics = Object.setPrototypeOf || { + __proto__: [] + } instanceof Array && function (d, b) { + d.__proto__ = b; + } || function (d, b) { + for (var p in b) { + if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; + } + }; + + return _extendStatics(d, b); + }; + + return function (d, b) { + if (typeof b !== "function" && b !== null) throw new TypeError("Class extends value " + String(b) + " is not a constructor or null"); + + _extendStatics(d, b); + + function __() { + this.constructor = d; + } + + d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); + }; +}(); + +var GRID_PNG = 'url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDAiIGhlaWdodD0iNDAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PHBhdHRlcm4gaWQ9ImdyaWQiIHdpZHRoPSI0MCIgaGVpZ2h0PSI0MCIgcGF0dGVyblVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+PHBhdGggZD0iTSAwIDEwIEwgNDAgMTAgTSAxMCAwIEwgMTAgNDAgTSAwIDIwIEwgNDAgMjAgTSAyMCAwIEwgMjAgNDAgTSAwIDMwIEwgNDAgMzAgTSAzMCAwIEwgMzAgNDAiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2UwZTBlMCIgb3BhY2l0eT0iMC4yIiBzdHJva2Utd2lkdGg9IjEiLz48cGF0aCBkPSJNIDQwIDAgTCAwIDAgMCA0MCIgZmlsbD0ibm9uZSIgc3Ryb2tlPSIjZTBlMGUwIiBzdHJva2Utd2lkdGg9IjEiLz48L3BhdHRlcm4+PC9kZWZzPjxyZWN0IHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JpZCkiLz48L3N2Zz4=)'; + +var Grid = +/** @class */ +function (_super) { + __extends$a(Grid, _super); + + function Grid() { + return _super !== null && _super.apply(this, arguments) || this; + } + + Grid.prototype.getDefaultCfgs = function () { + return { + img: GRID_PNG + }; + }; + + Grid.prototype.init = function () { + var graph = this.get('graph'); + var minZoom = graph.get('minZoom'); + var graphContainer = graph.get('container'); + var canvas = graph.get('canvas').get('el'); + var width = graph.get('width'); + var height = graph.get('height'); + var img = this.get('img') || GRID_PNG; + var container = createDom$1("
    "); + var gridContainer = createDom$1("
    "); + container.appendChild(gridContainer); + modifyCSS(container, { + width: width + "px", + height: height + "px", + left: graphContainer.offsetLeft + "px", + top: graphContainer.offsetTop + "px" + }); + modifyCSS(gridContainer, { + width: width / minZoom + "px", + height: height / minZoom + "px", + left: "0px", + top: "0px" + }); + graphContainer.insertBefore(container, canvas); + this.set('container', container); + this.set('gridContainer', gridContainer); + }; // class-methods-use-this + + + Grid.prototype.getEvents = function () { + return { + viewportchange: 'updateGrid' + }; + }; + /** + * viewport change 事件的响应函数 + * @param param + */ + + + Grid.prototype.updateGrid = function (param) { + var gridContainer = this.get('gridContainer'); + var matrix = param.matrix; + if (!matrix) matrix = [1, 0, 0, 0, 1, 0, 0, 0, 1]; + var transform = "matrix(" + matrix[0] + ", " + matrix[1] + ", " + matrix[3] + ", " + matrix[4] + ", 0, 0)"; + modifyCSS(gridContainer, { + transform: transform + }); + }; + + Grid.prototype.getContainer = function () { + return this.get('container'); + }; + + Grid.prototype.destroy = function () { + var graph = this.get('graph'); + var graphContainer = graph.get('container'); + var container = this.get('container'); + graphContainer.removeChild(container); + }; + + return Grid; +}(PluginBase$1); + +var Grid$1 = Grid; + +var insertCss$2 = {exports: {}}; + +var containers = []; // will store container HTMLElement references +var styleElements = []; // will store {prepend: HTMLElement, append: HTMLElement} + +var usage = 'insert-css: You need to provide a CSS string. Usage: insertCss(cssString[, options]).'; + +function insertCss(css, options) { + options = options || {}; + + if (css === undefined) { + throw new Error(usage); + } + + var position = options.prepend === true ? 'prepend' : 'append'; + var container = options.container !== undefined ? options.container : document.querySelector('head'); + var containerId = containers.indexOf(container); + + // first time we see this container, create the necessary entries + if (containerId === -1) { + containerId = containers.push(container) - 1; + styleElements[containerId] = {}; + } + + // try to get the correponding container + position styleElement, create it otherwise + var styleElement; + + if (styleElements[containerId] !== undefined && styleElements[containerId][position] !== undefined) { + styleElement = styleElements[containerId][position]; + } else { + styleElement = styleElements[containerId][position] = createStyleElement(); + + if (position === 'prepend') { + container.insertBefore(styleElement, container.childNodes[0]); + } else { + container.appendChild(styleElement); + } + } + + // strip potential UTF-8 BOM if css was read from a file + if (css.charCodeAt(0) === 0xFEFF) { css = css.substr(1, css.length); } + + // actually add the stylesheet + if (styleElement.styleSheet) { + styleElement.styleSheet.cssText += css; + } else { + styleElement.textContent += css; + } + + return styleElement; +} +function createStyleElement() { + var styleElement = document.createElement('style'); + styleElement.setAttribute('type', 'text/css'); + return styleElement; +} + +insertCss$2.exports = insertCss; +insertCss$2.exports.insertCss = insertCss; + +var insertCss$1 = insertCss$2.exports; + +var __extends$9 = undefined && undefined.__extends || function () { + var _extendStatics = function extendStatics(d, b) { + _extendStatics = Object.setPrototypeOf || { + __proto__: [] + } instanceof Array && function (d, b) { + d.__proto__ = b; + } || function (d, b) { + for (var p in b) { + if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; + } + }; + + return _extendStatics(d, b); + }; + + return function (d, b) { + if (typeof b !== "function" && b !== null) throw new TypeError("Class extends value " + String(b) + " is not a constructor or null"); + + _extendStatics(d, b); + + function __() { + this.constructor = d; + } + + d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); + }; +}(); +insertCss$1("\n .g6-component-contextmenu {\n border: 1px solid #e2e2e2;\n border-radius: 4px;\n font-size: 12px;\n color: #545454;\n background-color: rgba(255, 255, 255, 0.9);\n padding: 10px 8px;\n box-shadow: rgb(174, 174, 174) 0px 0px 10px;\n }\n .g6-contextmenu-ul {\n padding: 0;\n margin: 0;\n list-style: none;\n }\n\n"); + +var Menu = +/** @class */ +function (_super) { + __extends$9(Menu, _super); + + function Menu() { + return _super !== null && _super.apply(this, arguments) || this; + } + + Menu.prototype.getDefaultCfgs = function () { + return { + offsetX: 6, + offsetY: 6, + handleMenuClick: undefined, + // 指定菜单内容，function(e) {...} + getContent: function getContent(e) { + return "\n
      \n
    • \u83DC\u5355\u98791
      • \n
    • \u83DC\u5355\u98792
      • \n
    \n "; + }, + shouldBegin: function shouldBegin(e) { + return true; + }, + // 菜单隐藏事件 + onHide: function onHide() { + return true; + }, + itemTypes: ['node', 'edge', 'combo'] + }; + }; // class-methods-use-this + + + Menu.prototype.getEvents = function () { + return { + contextmenu: 'onMenuShow' + }; + }; + + Menu.prototype.init = function () { + var className = this.get('className'); + var menu = createDom$1("
    "); + modifyCSS(menu, { + top: '0px', + position: 'absolute', + visibility: 'hidden' + }); + var container = this.get('container'); + + if (!container) { + container = this.get('graph').get('container'); + } + + if (isString$3(container)) { + container = document.getElementById(container); + } + + container.appendChild(menu); + this.set('menu', menu); + }; + + Menu.prototype.onMenuShow = function (e) { + var self = this; + e.preventDefault(); + e.stopPropagation(); + var itemTypes = this.get('itemTypes'); + + if (!e.item) { + if (itemTypes.indexOf('canvas') === -1) return; + } else { + if (e.item && e.item.getType && itemTypes.indexOf(e.item.getType()) === -1) { + self.onMenuHide(); + return; + } + } + + var shouldBegin = this.get('shouldBegin'); + if (!shouldBegin(e)) return; + var menuDom = this.get('menu'); + var getContent = this.get('getContent'); + var graph = this.get('graph'); + var menu = getContent(e, graph); + + if (isString$3(menu)) { + menuDom.innerHTML = menu; + } else { + menuDom.innerHTML = menu.outerHTML; + } // 清除之前监听的事件 + + + this.removeMenuEventListener(); + var handleMenuClick = this.get('handleMenuClick'); + + if (handleMenuClick) { + var handleMenuClickWrapper = function handleMenuClickWrapper(evt) { + handleMenuClick(evt.target, e.item, graph); + }; + + this.set('handleMenuClickWrapper', handleMenuClickWrapper); + menuDom.addEventListener('click', handleMenuClickWrapper); + } + + var width = graph.get('width'); + var height = graph.get('height'); + var bbox = menuDom.getBoundingClientRect(); + var offsetX = this.get('offsetX') || 0; + var offsetY = this.get('offsetY') || 0; + var graphTop = graph.getContainer().offsetTop; + var graphLeft = graph.getContainer().offsetLeft; + var x = e.canvasX + graphLeft + offsetX; + var y = e.canvasY + graphTop + offsetY; // when the menu is (part of) out of the canvas + + if (x + bbox.width > width) { + x = e.canvasX - bbox.width - offsetX + graphLeft; + } + + if (y + bbox.height > height) { + y = e.canvasY - bbox.height - offsetY + graphTop; + } + + modifyCSS(menuDom, { + top: y + "px", + left: x + "px", + visibility: 'visible' + }); + + var handler = function handler(evt) { + self.onMenuHide(); + }; // 如果在页面中其他任意地方进行click, 隐去菜单 + + + document.body.addEventListener('click', handler); + this.set('handler', handler); + }; + + Menu.prototype.removeMenuEventListener = function () { + var handleMenuClickWrapper = this.get('handleMenuClickWrapper'); + var handler = this.get('handler'); + + if (handleMenuClickWrapper) { + var menuDom = this.get('menu'); + menuDom.removeEventListener('click', handleMenuClickWrapper); + this.set('handleMenuClickWrapper', null); + } + + if (handler) { + document.body.removeEventListener('click', handler); + } + }; + + Menu.prototype.onMenuHide = function () { + var menuDom = this.get('menu'); + + if (menuDom) { + modifyCSS(menuDom, { + visibility: 'hidden' + }); + } // 隐藏菜单后需要移除事件监听 + + + this.removeMenuEventListener(); + }; + + Menu.prototype.destroy = function () { + var menu = this.get('menu'); + this.removeMenuEventListener(); + + if (menu) { + var container = this.get('container'); + + if (!container) { + container = this.get('graph').get('container'); + } + + if (isString$3(container)) { + container = document.getElementById(container); + } + + container.removeChild(menu); + } + }; + + return Menu; +}(PluginBase$1); + +var Menu$1 = Menu; + +/** + * @description 扩展方法，提供 gl-matrix 为提供的方法 + * */ +function leftTranslate(out, a, v) { + var transMat = [0, 0, 0, 0, 0, 0, 0, 0, 0]; + fromTranslation(transMat, v); + return multiply$4(out, transMat, a); +} +function leftRotate(out, a, rad) { + var rotateMat = [0, 0, 0, 0, 0, 0, 0, 0, 0]; + fromRotation(rotateMat, rad); + return multiply$4(out, rotateMat, a); +} +function leftScale(out, a, v) { + var scaleMat = [0, 0, 0, 0, 0, 0, 0, 0, 0]; + fromScaling(scaleMat, v); + return multiply$4(out, scaleMat, a); +} +function leftMultiply(out, a, a1) { + return multiply$4(out, a1, a); +} +/** + * 根据 actions 来做 transform + * @param m + * @param actions + */ +function transform$3(m, actions) { + var matrix = m ? [].concat(m) : [1, 0, 0, 0, 1, 0, 0, 0, 1]; + for (var i = 0, len = actions.length; i < len; i++) { + var action = actions[i]; + switch (action[0]) { + case 't': + leftTranslate(matrix, matrix, [action[1], action[2]]); + break; + case 's': + leftScale(matrix, matrix, [action[1], action[2]]); + break; + case 'r': + leftRotate(matrix, matrix, action[1]); + break; + case 'm': + leftMultiply(matrix, matrix, action[1]); + break; + } + } + return matrix; +} + +var __extends$8 = undefined && undefined.__extends || function () { + var _extendStatics = function extendStatics(d, b) { + _extendStatics = Object.setPrototypeOf || { + __proto__: [] + } instanceof Array && function (d, b) { + d.__proto__ = b; + } || function (d, b) { + for (var p in b) { + if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; + } + }; + + return _extendStatics(d, b); + }; + + return function (d, b) { + if (typeof b !== "function" && b !== null) throw new TypeError("Class extends value " + String(b) + " is not a constructor or null"); + + _extendStatics(d, b); + + function __() { + this.constructor = d; + } + + d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); + }; +}(); + +var __assign$n = undefined && undefined.__assign || function () { + __assign$n = Object.assign || function (t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + + for (var p in s) { + if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; + } + } + + return t; + }; + + return __assign$n.apply(this, arguments); +}; +var max$1 = Math.max; +var transform$2 = transform$3; +var DEFAULT_MODE = 'default'; +var KEYSHAPE_MODE = 'keyShape'; +var DELEGATE_MODE = 'delegate'; +var SVG = 'svg'; + +var MiniMap = +/** @class */ +function (_super) { + __extends$8(MiniMap, _super); + + function MiniMap() { + var _this = _super !== null && _super.apply(this, arguments) || this; + /** + * 主图更新的监听函数，使用 debounce 减少渲染频率 + * e.g. 拖拽节点只会在松手后的 100ms 后执行 updateCanvas + * e.g. render 时大量 addItem 也只会执行一次 updateCanvas + */ + + + _this.handleUpdateCanvas = debounce$1(function (event) { + var self = _this; + if (self.destroyed) return; + self.updateCanvas(); + }, 100, false); + return _this; + } + + MiniMap.prototype.getDefaultCfgs = function () { + return { + container: null, + className: 'g6-minimap', + viewportClassName: 'g6-minimap-viewport', + // Minimap 中默认展示和主图一样的内容，KeyShape 只展示节点和边的 key shape 部分，delegate表示展示自定义的rect，用户可自定义样式 + type: 'default', + padding: 50, + size: [200, 120], + delegateStyle: { + fill: '#40a9ff', + stroke: '#096dd9' + }, + refresh: true + }; + }; + + MiniMap.prototype.getEvents = function () { + return { + beforepaint: 'updateViewport', + beforeanimate: 'disableRefresh', + afteranimate: 'enableRefresh', + viewportchange: 'disableOneRefresh' + }; + }; // 若是正在进行动画，不刷新缩略图 + + + MiniMap.prototype.disableRefresh = function () { + this.set('refresh', false); + }; + + MiniMap.prototype.enableRefresh = function () { + this.set('refresh', true); + this.updateCanvas(); + }; + + MiniMap.prototype.disableOneRefresh = function () { + this.set('viewportChange', true); + }; + + MiniMap.prototype.initViewport = function () { + var _this = this; + + var cfgs = this._cfgs; + var size = cfgs.size, + graph = cfgs.graph; + if (this.destroyed) return; + var canvas = this.get('canvas'); + var containerDOM = canvas.get('container'); + var viewport = createDom$1("\n \n "); + var isFireFox = navigator.userAgent.toLowerCase().indexOf('firefox') > -1; // 计算拖拽水平方向距离 + + var x = 0; // 计算拖拽垂直方向距离 + + var y = 0; // 是否在拖拽minimap的视口 + + var dragging = false; // 缓存viewport当前对于画布的x + + var left = 0; // 缓存viewport当前对于画布的y + + var top = 0; // 缓存viewport当前宽度 + + var width = 0; // 缓存viewport当前高度 + + var height = 0; + var ratio = 0; + var zoom = 0; + viewport.addEventListener('dragstart', function (e) { + var _a, _b; + + if (e.dataTransfer) { + var img = new Image(); + img.src = "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' %3E%3Cpath /%3E%3C/svg%3E"; + (_b = (_a = e.dataTransfer).setDragImage) === null || _b === void 0 ? void 0 : _b.call(_a, img, 0, 0); + + try { + e.dataTransfer.setData('text/html', 'view-port-minimap'); + } catch (_c) { + // support IE + e.dataTransfer.setData('text', 'view-port-minimap'); + } + } + + cfgs.refresh = false; + + if (e.target !== viewport) { + return; + } // 如果视口已经最大了，不需要拖拽 + + + var style = viewport.style; + left = parseInt(style.left, 10); + top = parseInt(style.top, 10); + width = parseInt(style.width, 10); + height = parseInt(style.height, 10); + + if (width > size[0] || height > size[1]) { + return; + } + + zoom = graph.getZoom(); + ratio = _this.get('ratio'); + dragging = true; + x = e.clientX; + y = e.clientY; + }, false); + viewport.addEventListener(isFireFox ? 'dragover' : 'drag', function (e) { + if (!dragging || isNil(e.clientX) || isNil(e.clientY)) { + return; + } + + var dx = x - e.clientX; + var dy = y - e.clientY; // 若视口移动到最左边或最右边了,仅移动到边界 + + if (left - dx < 0 || left - dx + width >= size[0]) { + dx = 0; + } // 若视口移动到最上或最下边了，仅移动到边界 + + + if (top - dy < 0 || top - dy + height >= size[1]) { + dy = 0; + } + + left -= dx; + top -= dy; // 先移动视口，避免移动到边上以后出现视口闪烁 + + modifyCSS(viewport, { + left: left + "px", + top: top + "px" + }); // graph 移动需要偏移量 dx/dy * 缩放比例才会得到正确的移动距离 + + graph.translate(dx * zoom / ratio, dy * zoom / ratio); + x = e.clientX; + y = e.clientY; + }, false); + viewport.addEventListener('dragend', function () { + dragging = false; + cfgs.refresh = true; + }, false); + this.set('viewport', viewport); + containerDOM.appendChild(viewport); + }; + /** + * 更新 viewport 视图 + */ + + + MiniMap.prototype.updateViewport = function () { + if (this.destroyed) return; + var ratio = this.get('ratio'); + this.get('dx'); + this.get('dy'); + var totaldx = this.get('totaldx'); + var totaldy = this.get('totaldy'); + var graph = this.get('graph'); + var size = this.get('size'); + var graphWidth = graph.get('width'); + var graphHeight = graph.get('height'); + var topLeft = graph.getPointByCanvas(0, 0); + var bottomRight = graph.getPointByCanvas(graphWidth, graphHeight); + var viewport = this.get('viewport'); + + if (!viewport) { + this.initViewport(); + } + + graph.getZoom(); // viewport宽高,左上角点的计算 + + var width = (bottomRight.x - topLeft.x) * ratio; + var height = (bottomRight.y - topLeft.y) * ratio; + var left = topLeft.x * ratio + totaldx; + var top = topLeft.y * ratio + totaldy; + var right = left + width; + var bottom = top + height; + + if (left < 0) { + width += left; + left = 0; + } + + if (right > size[0]) { + width = width - (right - size[0]); + } + + if (top < 0) { + height += top; + top = 0; + } + + if (bottom > size[1]) { + height = height - (bottom - size[1]); + } // 缓存目前缩放比，在移动 minimap 视窗时就不用再计算大图的移动量 + + + this.set('ratio', ratio); + var correctLeft = left + "px"; + var correctTop = top + "px"; + modifyCSS(viewport, { + left: correctLeft, + top: correctTop, + width: width + "px", + height: height + "px" + }); + }; + /** + * 将主图上的图形完全复制到小图 + */ + + + MiniMap.prototype.updateGraphShapes = function () { + var graph = this._cfgs.graph; + var canvas = this.get('canvas'); + var graphGroup = graph.get('group'); + if (graphGroup.destroyed) return; + var clonedGroup = graphGroup.clone(); + clonedGroup.resetMatrix(); + canvas.clear(); + canvas.add(clonedGroup); // 当 renderer 是 svg，由于渲染引擎的 bug，这里需要将 visible 为 false 的元素手动隐藏 + + var renderer = graph.get('renderer'); + + if (renderer === SVG) { + // 递归更新子元素 + this.updateVisible(clonedGroup); + } + }; // svg 在 canvas.add(clonedGroup) 之后会出现 visible 为 false 的元素被展示出来，需要递归更新 + + + MiniMap.prototype.updateVisible = function (ele) { + var _this = this; + + if (!ele.isGroup() && !ele.get('visible')) { + ele.hide(); + } else { + var children = ele.get('children'); + if (!children || !children.length) return; + children.forEach(function (child) { + if (!child.get('visible')) child.hide(); + + _this.updateVisible(child); + }); + } + }; // 仅在 minimap 上绘制 keyShape + // FIXME 如果用户自定义绘制了其他内容，minimap上就无法画出 + + + MiniMap.prototype.updateKeyShapes = function () { + var _this = this; + + var graph = this._cfgs.graph; + each$2(graph.getEdges(), function (edge) { + _this.updateOneEdgeKeyShape(edge); + }); + each$2(graph.getNodes(), function (node) { + _this.updateOneNodeKeyShape(node); + }); + this.clearDestroyedShapes(); + }; + /** + * 增加/更新单个元素的 keyShape + * @param item INode 实例 + */ + + + MiniMap.prototype.updateOneNodeKeyShape = function (item) { + var canvas = this.get('canvas'); + var group = canvas.get('children')[0] || canvas.addGroup(); + var itemMap = this.get('itemMap') || {}; // 差量更新 minimap 上的一个节点，对应主图的 item + + var mappedItem = itemMap[item.get('id')]; + var bbox = item.getBBox(); // 计算了节点父组矩阵的 bbox + + var cKeyShape = item.get('keyShape').clone(); + var keyShapeStyle = cKeyShape.attr(); + var attrs = { + x: bbox.centerX, + y: bbox.centerY + }; + + if (!mappedItem) { + mappedItem = cKeyShape; + group.add(mappedItem); + } else { + attrs = Object.assign(keyShapeStyle, attrs); + } + + var shapeType = mappedItem.get('type'); + + if (shapeType === 'rect' || shapeType === 'image') { + attrs.x = bbox.minX; + attrs.y = bbox.minY; + } + + mappedItem.attr(attrs); + + if (!item.isVisible()) { + mappedItem.hide(); + } + + mappedItem.exist = true; + itemMap[item.get('id')] = mappedItem; + this.set('itemMap', itemMap); + }; + /** + * Minimap 中展示自定义的rect，支持用户自定义样式和节点大小 + */ + + + MiniMap.prototype.updateDelegateShapes = function () { + var _this = this; + + var graph = this._cfgs.graph; // 差量更新 minimap 上的节点和边 + + each$2(graph.getEdges(), function (edge) { + _this.updateOneEdgeKeyShape(edge); + }); + each$2(graph.getNodes(), function (node) { + _this.updateOneNodeDelegateShape(node); + }); + this.clearDestroyedShapes(); + }; + + MiniMap.prototype.clearDestroyedShapes = function () { + var itemMap = this.get('itemMap') || {}; + var keys = Object.keys(itemMap); + if (!keys || keys.length === 0) return; + + for (var i = keys.length - 1; i >= 0; i--) { + var shape = itemMap[keys[i]]; + var exist = shape.exist; + shape.exist = false; + + if (!exist) { + shape.remove(); + delete itemMap[keys[i]]; + } + } + }; + /** + * 设置只显示 edge 的 keyShape + * @param item IEdge 实例 + */ + + + MiniMap.prototype.updateOneEdgeKeyShape = function (item) { + var canvas = this.get('canvas'); + var group = canvas.get('children')[0] || canvas.addGroup(); + var itemMap = this.get('itemMap') || {}; // 差量更新 minimap 上的一个节点，对应主图的 item + + var mappedItem = itemMap[item.get('id')]; + + if (mappedItem) { + var path = item.get('keyShape').attr('path'); + mappedItem.attr('path', path); + } else { + mappedItem = item.get('keyShape').clone(); + group.add(mappedItem); + mappedItem.toBack(); + } + + if (!item.isVisible()) { + mappedItem.hide(); + } + + mappedItem.exist = true; + itemMap[item.get('id')] = mappedItem; + this.set('itemMap', itemMap); + }; + /** + * Minimap 中展示自定义的 rect，支持用户自定义样式和节点大小 + * 增加/更新单个元素 + * @param item INode 实例 + */ + + + MiniMap.prototype.updateOneNodeDelegateShape = function (item) { + var canvas = this.get('canvas'); + var group = canvas.get('children')[0] || canvas.addGroup(); + var delegateStyle = this.get('delegateStyle'); + var itemMap = this.get('itemMap') || {}; // 差量更新 minimap 上的一个节点，对应主图的 item + + var mappedItem = itemMap[item.get('id')]; + var bbox = item.getBBox(); // 计算了节点父组矩阵的 bbox + + if (mappedItem) { + var attrs = { + x: bbox.minX, + y: bbox.minY, + width: bbox.width, + height: bbox.height + }; + mappedItem.attr(attrs); + } else { + mappedItem = group.addShape('rect', { + attrs: __assign$n({ + x: bbox.minX, + y: bbox.minY, + width: bbox.width, + height: bbox.height + }, delegateStyle), + name: 'minimap-node-shape' + }); + } + + if (!item.isVisible()) { + mappedItem.hide(); + } + + mappedItem.exist = true; + itemMap[item.get('id')] = mappedItem; + this.set('itemMap', itemMap); + }; + + MiniMap.prototype.init = function () { + this.initContainer(); + this.get('graph').on('afterupdateitem', this.handleUpdateCanvas); + this.get('graph').on('afteritemstatechange', this.handleUpdateCanvas); + this.get('graph').on('afteradditem', this.handleUpdateCanvas); + this.get('graph').on('afterremoveitem', this.handleUpdateCanvas); + this.get('graph').on('afterrender', this.handleUpdateCanvas); + this.get('graph').on('afterlayout', this.handleUpdateCanvas); + }; + /** + * 初始化 Minimap 的容器 + */ + + + MiniMap.prototype.initContainer = function () { + var self = this; + var graph = self.get('graph'); + var size = self.get('size'); + var className = self.get('className'); + var parentNode = self.get('container'); + var container = createDom$1("
    "); + + if (isString$3(parentNode)) { + parentNode = document.getElementById(parentNode); + } + + if (parentNode) { + parentNode.appendChild(container); + } else { + graph.get('container').appendChild(container); + } + + self.set('container', container); + var containerDOM = createDom$1('
    '); + container.appendChild(containerDOM); + containerDOM.addEventListener('dragenter', function (e) { + e.preventDefault(); + }); + containerDOM.addEventListener('dragover', function (e) { + e.preventDefault(); + }); + var canvas; + var renderer = graph.get('renderer'); + + if (renderer === SVG) { + canvas = new Canvas({ + container: containerDOM, + width: size[0], + height: size[1] + }); + } else { + canvas = new Canvas$1({ + container: containerDOM, + width: size[0], + height: size[1] + }); + } + + self.set('canvas', canvas); + self.updateCanvas(); + }; + + MiniMap.prototype.updateCanvas = function () { + // 如果是在动画，则不刷新视图 + var isRefresh = this.get('refresh'); + + if (!isRefresh) { + return; + } + + var graph = this.get('graph'); + + if (graph.get('destroyed')) { + return; + } // 如果是视口变换，也不刷新视图，但是需要重置视口大小和位置 + + + if (this.get('viewportChange')) { + this.set('viewportChange', false); + this.updateViewport(); + } + + var size = this.get('size'); // 用户定义的 minimap size + + var canvas = this.get('canvas'); // minimap 的 canvas + + var type = this.get('type'); // minimap 的类型 + + var padding = this.get('padding'); // 用户额定义的 minimap 的 padding + + if (canvas.destroyed) { + return; + } + + switch (type) { + case DEFAULT_MODE: + this.updateGraphShapes(); + break; + + case KEYSHAPE_MODE: + this.updateKeyShapes(); + break; + + case DELEGATE_MODE: + // 得到的节点直接带有 x 和 y，每个节点不存在父 group，即每个节点位置不由父 group 控制 + this.updateDelegateShapes(); + break; + } + + var group = canvas.get('children')[0]; + if (!group) return; + group.resetMatrix(); // 该 bbox 是准确的，不计算 matrix 的包围盒 + + var bbox = group.getCanvasBBox(); // 主图的 bbox + + var graphBBox = graph.get('canvas').getCanvasBBox(); + var width = graphBBox.width; + var height = graphBBox.height; + + if (Number.isFinite(bbox.width)) { + // 刷新后bbox可能会变，需要重置画布矩阵以缩放到合适的大小 + width = max$1(bbox.width, width); + height = max$1(bbox.height, height); + } + + width += 2 * padding; + height += 2 * padding; + var ratio = Math.min(size[0] / width, size[1] / height); + var matrix = [1, 0, 0, 0, 1, 0, 0, 0, 1]; + var minX = 0; + var minY = 0; // 平移到左上角 + + if (Number.isFinite(bbox.minX)) { + minX = -bbox.minX; + } + + if (Number.isFinite(bbox.minY)) { + minY = -bbox.minY; + } // 缩放到适合视口后, 平移到画布中心 + + + var dx = (size[0] - (width - 2 * padding) * ratio) / 2; + var dy = (size[1] - (height - 2 * padding) * ratio) / 2; + matrix = transform$2(matrix, [['t', minX, minY], ['s', ratio, ratio], ['t', dx, dy] // 移动到画布中心 + ]); + group.setMatrix(matrix); // 更新minimap视口 + + this.set('ratio', ratio); + this.set('totaldx', dx + minX * ratio); + this.set('totaldy', dy + minY * ratio); + this.set('dx', dx); + this.set('dy', dy); + this.updateViewport(); + }; + /** + * 获取minimap的画布 + * @return {GCanvas} G的canvas实例 + */ + + + MiniMap.prototype.getCanvas = function () { + return this.get('canvas'); + }; + /** + * 获取minimap的窗口 + * @return {HTMLElement} 窗口的dom实例 + */ + + + MiniMap.prototype.getViewport = function () { + return this.get('viewport'); + }; + /** + * 获取minimap的容器dom + * @return {HTMLElement} dom + */ + + + MiniMap.prototype.getContainer = function () { + return this.get('container'); + }; + + MiniMap.prototype.destroy = function () { + this.get('canvas').destroy(); + var container = this.get('container'); + container.parentNode.removeChild(container); + }; + + return MiniMap; +}(PluginBase$1); + +var Minimap = MiniMap; + +var __extends$7 = undefined && undefined.__extends || function () { + var _extendStatics = function extendStatics(d, b) { + _extendStatics = Object.setPrototypeOf || { + __proto__: [] + } instanceof Array && function (d, b) { + d.__proto__ = b; + } || function (d, b) { + for (var p in b) { + if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; + } + }; + + return _extendStatics(d, b); + }; + + return function (d, b) { + if (typeof b !== "function" && b !== null) throw new TypeError("Class extends value " + String(b) + " is not a constructor or null"); + + _extendStatics(d, b); + + function __() { + this.constructor = d; + } + + d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); + }; +}(); + +function getEucliDis(pointA, pointB, eps) { + var vx = pointA.x - pointB.x; + var vy = pointA.y - pointB.y; + + if (!eps || Math.abs(vx) > eps || Math.abs(vy) > eps) { + return Math.sqrt(vx * vx + vy * vy); + } + + return eps; +} + +function getDotProduct(ei, ej) { + return ei.x * ej.x + ei.y * ej.y; +} + +function projectPointToEdge(p, e) { + var k = (e.source.y - e.target.y) / (e.source.x - e.target.x); + var x = (k * k * e.source.x + k * (p.y - e.source.y) + p.x) / (k * k + 1); + var y = k * (x - e.source.x) + e.source.y; + return { + x: x, + y: y + }; +} + +var Bundling = +/** @class */ +function (_super) { + __extends$7(Bundling, _super); + + function Bundling() { + return _super !== null && _super.apply(this, arguments) || this; + } + + Bundling.prototype.getDefaultCfgs = function () { + return { + edgeBundles: [], + edgePoints: [], + K: 0.1, + lambda: 0.1, + divisions: 1, + divRate: 2, + cycles: 6, + iterations: 90, + iterRate: 0.6666667, + bundleThreshold: 0.6, + eps: 1e-6, + onLayoutEnd: function onLayoutEnd() {}, + onTick: function onTick() {} + }; + }; + + Bundling.prototype.init = function () { + var graph = this.get('graph'); + var onTick = this.get('onTick'); + + var tick = function tick() { + if (onTick) { + onTick(); + } + + graph.refreshPositions(); + }; + + this.set('tick', tick); + }; + + Bundling.prototype.bundling = function (data) { + var self = this; + self.set('data', data); // 如果正在布局，忽略布局请求 + + if (self.isTicking()) { + return; + } + + var edges = data.edges || []; + var nodes = data.nodes || []; + var nodeIdMap = {}; + var error = false; + nodes.forEach(function (node) { + if (node.x === null || !node.y === null || node.x === undefined || !node.y === undefined) { + error = true; + } + + nodeIdMap[node.id] = node; + }); + if (error) throw new Error('please layout the graph or assign x and y for nodes first'); + self.set('nodeIdMap', nodeIdMap); // subdivide each edges + + var divisions = self.get('divisions'); + var divRate = self.get('divRate'); + var edgePoints = self.divideEdges(divisions); + self.set('edgePoints', edgePoints); // compute the bundles + + var edgeBundles = self.getEdgeBundles(); + self.set('edgeBundles', edgeBundles); // iterations + + var C = self.get('cycles'); + var iterations = self.get('iterations'); + var iterRate = self.get('iterRate'); + var lambda = self.get('lambda'); + + for (var i = 0; i < C; i++) { + var _loop_1 = function _loop_1(j) { + var forces = []; + edges.forEach(function (e, k) { + if (e.source === e.target) return; + var source = nodeIdMap[e.source]; + var target = nodeIdMap[e.target]; + forces[k] = self.getEdgeForces({ + source: source, + target: target + }, k, divisions, lambda); + + for (var p = 0; p < divisions + 1; p++) { + edgePoints[k][p].x += forces[k][p].x; + edgePoints[k][p].y += forces[k][p].y; + } + }); + }; + + for (var j = 0; j < iterations; j++) { + _loop_1(j); + } // parameters for nex cycle + + + lambda = lambda / 2; + divisions *= divRate; + iterations *= iterRate; + edgePoints = self.divideEdges(divisions); + self.set('edgePoints', edgePoints); + } // change the edges according to edgePoints + + + edges.forEach(function (e, i) { + if (e.source === e.target) return; + e.type = 'polyline'; + e.controlPoints = edgePoints[i].slice(1, edgePoints[i].length - 1); + }); + var graph = self.get('graph'); + graph.refresh(); + }; + + Bundling.prototype.updateBundling = function (cfg) { + var self = this; + var data = cfg.data; + + if (data) { + self.set('data', data); + } + + if (self.get('ticking')) { + self.set('ticking', false); + } + + Object.keys(cfg).forEach(function (key) { + self.set(key, cfg[key]); + }); + + if (cfg.onTick) { + var graph_1 = this.get('graph'); + self.set('tick', function () { + cfg.onTick(); + graph_1.refresh(); + }); + } + + self.bundling(data); + }; + + Bundling.prototype.divideEdges = function (divisions) { + var self = this; + var edges = self.get('data').edges; + var nodeIdMap = self.get('nodeIdMap'); + var edgePoints = self.get('edgePoints'); + if (!edgePoints || edgePoints === undefined) edgePoints = []; + edges.forEach(function (edge, i) { + if (!edgePoints[i] || edgePoints[i] === undefined) { + edgePoints[i] = []; + } + + var source = nodeIdMap[edge.source]; + var target = nodeIdMap[edge.target]; + + if (divisions === 1) { + edgePoints[i].push({ + x: source.x, + y: source.y + }); // source + + edgePoints[i].push({ + x: 0.5 * (source.x + target.x), + y: 0.5 * (source.y + target.y) + }); // mid + + edgePoints[i].push({ + x: target.x, + y: target.y + }); // target + } else { + var edgeLength = 0; + + if (!edgePoints[i] || edgePoints[i] === []) { + // it is a straight line + edgeLength = getEucliDis({ + x: source.x, + y: source.y + }, { + x: target.x, + y: target.y + }); + } else { + edgeLength = self.getEdgeLength(edgePoints[i]); + } + + var divisionLength_1 = edgeLength / (divisions + 1); + var currentDivisonLength_1 = divisionLength_1; + var newEdgePoints_1 = [{ + x: source.x, + y: source.y + }]; // source + + edgePoints[i].forEach(function (ep, j) { + if (j === 0) return; + var oriDivisionLength = getEucliDis(ep, edgePoints[i][j - 1]); + + while (oriDivisionLength > currentDivisonLength_1) { + var ratio = currentDivisonLength_1 / oriDivisionLength; + var edgePoint = { + x: edgePoints[i][j - 1].x, + y: edgePoints[i][j - 1].y + }; + edgePoint.x += ratio * (ep.x - edgePoints[i][j - 1].x); + edgePoint.y += ratio * (ep.y - edgePoints[i][j - 1].y); + newEdgePoints_1.push(edgePoint); + oriDivisionLength -= currentDivisonLength_1; + currentDivisonLength_1 = divisionLength_1; + } + + currentDivisonLength_1 -= oriDivisionLength; + }); + newEdgePoints_1.push({ + x: target.x, + y: target.y + }); // target + + edgePoints[i] = newEdgePoints_1; + } + }); + return edgePoints; + }; + /** + * 计算边的长度 + * @param points + */ + + + Bundling.prototype.getEdgeLength = function (points) { + var length = 0; + points.forEach(function (p, i) { + if (i === 0) return; + length += getEucliDis(p, points[i - 1]); + }); + return length; + }; + + Bundling.prototype.getEdgeBundles = function () { + var self = this; + var data = self.get('data'); + var edges = data.edges || []; + var bundleThreshold = self.get('bundleThreshold'); + var nodeIdMap = self.get('nodeIdMap'); + var edgeBundles = self.get('edgeBundles'); + if (!edgeBundles) edgeBundles = []; + edges.forEach(function (e, i) { + if (!edgeBundles[i] || edgeBundles[i] === undefined) { + edgeBundles[i] = []; + } + }); + edges.forEach(function (ei, i) { + var iSource = nodeIdMap[ei.source]; + var iTarget = nodeIdMap[ei.target]; + edges.forEach(function (ej, j) { + if (j <= i) return; + var jSource = nodeIdMap[ej.source]; + var jTarget = nodeIdMap[ej.target]; + var score = self.getBundleScore({ + source: iSource, + target: iTarget + }, { + source: jSource, + target: jTarget + }); + + if (score >= bundleThreshold) { + edgeBundles[i].push(j); + edgeBundles[j].push(i); + } + }); + }); + return edgeBundles; + }; + + Bundling.prototype.getBundleScore = function (ei, ej) { + var self = this; + ei.vx = ei.target.x - ei.source.x; + ei.vy = ei.target.y - ei.source.y; + ej.vx = ej.target.x - ej.source.x; + ej.vy = ej.target.y - ej.source.y; + ei.length = getEucliDis({ + x: ei.source.x, + y: ei.source.y + }, { + x: ei.target.x, + y: ei.target.y + }); + ej.length = getEucliDis({ + x: ej.source.x, + y: ej.source.y + }, { + x: ej.target.x, + y: ej.target.y + }); // angle score + + var aScore = self.getAngleScore(ei, ej); // scale score + + var sScore = self.getScaleScore(ei, ej); // position score + + var pScore = self.getPositionScore(ei, ej); // visibility socre + + var vScore = self.getVisibilityScore(ei, ej); + return aScore * sScore * pScore * vScore; + }; + + Bundling.prototype.getAngleScore = function (ei, ej) { + var dotProduct = getDotProduct({ + x: ei.vx, + y: ei.vy + }, { + x: ej.vx, + y: ej.vy + }); + return dotProduct / (ei.length * ej.length); + }; + + Bundling.prototype.getScaleScore = function (ei, ej) { + var aLength = (ei.length + ej.length) / 2; + var score = 2 / (aLength / Math.min(ei.length, ej.length) + Math.max(ei.length, ej.length) / aLength); + return score; + }; + + Bundling.prototype.getPositionScore = function (ei, ej) { + var aLength = (ei.length + ej.length) / 2; + var iMid = { + x: (ei.source.x + ei.target.x) / 2, + y: (ei.source.y + ei.target.y) / 2 + }; + var jMid = { + x: (ej.source.x + ej.target.x) / 2, + y: (ej.source.y + ej.target.y) / 2 + }; + var distance = getEucliDis(iMid, jMid); + return aLength / (aLength + distance); + }; + + Bundling.prototype.getVisibilityScore = function (ei, ej) { + var vij = this.getEdgeVisibility(ei, ej); + var vji = this.getEdgeVisibility(ej, ei); + return vij < vji ? vij : vji; + }; + + Bundling.prototype.getEdgeVisibility = function (ei, ej) { + var ps = projectPointToEdge(ej.source, ei); + var pt = projectPointToEdge(ej.target, ei); + var pMid = { + x: (ps.x + pt.x) / 2, + y: (ps.y + pt.y) / 2 + }; + var iMid = { + x: (ei.source.x + ei.target.x) / 2, + y: (ei.source.y + ei.target.y) / 2 + }; + return Math.max(0, 1 - 2 * getEucliDis(pMid, iMid) / getEucliDis(ps, pt)); + }; + + Bundling.prototype.getEdgeForces = function (e, eidx, divisions, lambda) { + var self = this; + var edgePoints = self.get('edgePoints'); + var K = self.get('K'); + var kp = K / (getEucliDis(e.source, e.target) * (divisions + 1)); + var edgePointForces = [{ + x: 0, + y: 0 + }]; + + for (var i = 1; i < divisions; i++) { + var force = { + x: 0, + y: 0 + }; + var spring = self.getSpringForce({ + pre: edgePoints[eidx][i - 1], + cur: edgePoints[eidx][i], + next: edgePoints[eidx][i + 1] + }, kp); + var electrostatic = self.getElectrostaticForce(i, eidx); + force.x = lambda * (spring.x + electrostatic.x); + force.y = lambda * (spring.y + electrostatic.y); + edgePointForces.push(force); + } + + edgePointForces.push({ + x: 0, + y: 0 + }); + return edgePointForces; + }; + + Bundling.prototype.getSpringForce = function (divisions, kp) { + var x = divisions.pre.x + divisions.next.x - 2 * divisions.cur.x; + var y = divisions.pre.y + divisions.next.y - 2 * divisions.cur.y; + x *= kp; + y *= kp; + return { + x: x, + y: y + }; + }; + + Bundling.prototype.getElectrostaticForce = function (pidx, eidx) { + var self = this; + var eps = self.get('eps'); + var edgeBundles = self.get('edgeBundles'); + var edgePoints = self.get('edgePoints'); + var edgeBundle = edgeBundles[eidx]; + var resForce = { + x: 0, + y: 0 + }; + edgeBundle.forEach(function (eb) { + var force = { + x: edgePoints[eb][pidx].x - edgePoints[eidx][pidx].x, + y: edgePoints[eb][pidx].y - edgePoints[eidx][pidx].y + }; + + if (Math.abs(force.x) > eps || Math.abs(force.y) > eps) { + var length_1 = getEucliDis(edgePoints[eb][pidx], edgePoints[eidx][pidx]); + var diff = 1 / length_1; + resForce.x += force.x * diff; + resForce.y += force.y * diff; + } + }); + return resForce; + }; + + Bundling.prototype.isTicking = function () { + return this.get('ticking'); + }; + + Bundling.prototype.getSimulation = function () { + return this.get('forceSimulation'); + }; + + Bundling.prototype.destroy = function () { + if (this.get('ticking')) { + this.getSimulation().stop(); + } + + _super.prototype.destroy.call(this); + }; + + return Bundling; +}(PluginBase$1); + +var Bundling$1 = Bundling; + +var __extends$6 = undefined && undefined.__extends || function () { + var _extendStatics = function extendStatics(d, b) { + _extendStatics = Object.setPrototypeOf || { + __proto__: [] + } instanceof Array && function (d, b) { + d.__proto__ = b; + } || function (d, b) { + for (var p in b) { + if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; + } + }; + + return _extendStatics(d, b); + }; + + return function (d, b) { + if (typeof b !== "function" && b !== null) throw new TypeError("Class extends value " + String(b) + " is not a constructor or null"); + + _extendStatics(d, b); + + function __() { + this.constructor = d; + } + + d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); + }; +}(); + +var __assign$m = undefined && undefined.__assign || function () { + __assign$m = Object.assign || function (t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + + for (var p in s) { + if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; + } + } + + return t; + }; + + return __assign$m.apply(this, arguments); +}; +var DELTA$3 = 0.05; +var lensDelegateStyle$1 = { + stroke: '#000', + strokeOpacity: 0.8, + lineWidth: 2, + fillOpacity: 0.1, + fill: '#ccc' +}; + +var Fisheye$1 = +/** @class */ +function (_super) { + __extends$6(Fisheye, _super); + + function Fisheye() { + return _super !== null && _super.apply(this, arguments) || this; + } + + Fisheye.prototype.getDefaultCfgs = function () { + return { + trigger: 'mousemove', + d: 1.5, + r: 300, + delegateStyle: clone$7(lensDelegateStyle$1), + showLabel: false, + maxD: 5, + minD: 0, + scaleRBy: 'unset', + scaleDBy: 'unset', + showDPercent: true + }; + }; // class-methods-use-this + + + Fisheye.prototype.getEvents = function () { + var events; + + switch (this.get('trigger')) { + case 'click': + events = { + click: 'magnify' + }; + break; + + case 'drag': + events = { + click: 'createDelegate' + }; + break; + + default: + events = { + mousemove: 'magnify' + }; + break; + } + + return events; + }; + + Fisheye.prototype.init = function () { + var self = this; + var r = self.get('r'); + self.set('cachedMagnifiedModels', []); + self.set('cachedOriginPositions', {}); + self.set('r2', r * r); + var d = self.get('d'); + self.set('molecularParam', (d + 1) * r); + }; // Create the delegate when the trigger is drag + + + Fisheye.prototype.createDelegate = function (e) { + var _this = this; + + var self = this; + var lensDelegate = self.get('delegate'); + + if (!lensDelegate || lensDelegate.destroyed) { + self.magnify(e); + lensDelegate = self.get('delegate'); // drag to move the lens + + lensDelegate.on('dragstart', function (evt) { + self.set('delegateCenterDiff', { + x: lensDelegate.attr('x') - evt.x, + y: lensDelegate.attr('y') - evt.y + }); + }); + lensDelegate.on('drag', function (evt) { + self.magnify(evt); + }); // 绑定调整范围（r）和缩放系数(d)的监听 + // 由于 drag 用于改变 lens 位置, 因此在此模式下, drag 不能用于调整 r 和 d + // scaling d + + if (this.get('scaleDBy') === 'wheel') { + lensDelegate.on('mousewheel', function (evt) { + _this.scaleDByWheel(evt); + }); + } // scaling r + + + if (this.get('scaleRBy') === 'wheel') { + lensDelegate.on('mousewheel', function (evt) { + self.scaleRByWheel(evt); + }); + } + } + }; + /** + * Scale the range by wheel + * @param e mouse wheel event + */ + + + Fisheye.prototype.scaleRByWheel = function (e) { + var self = this; + if (!e || !e.originalEvent) return; + if (e.preventDefault) e.preventDefault(); + var graph = self.get('graph'); + var ratio; + var lensDelegate = self.get('delegate'); + var lensCenter = lensDelegate ? { + x: lensDelegate.attr('x'), + y: lensDelegate.attr('y') + } : undefined; + var mousePos = lensCenter || graph.getPointByClient(e.clientX, e.clientY); + + if (e.originalEvent.wheelDelta < 0) { + ratio = 1 - DELTA$3; + } else { + ratio = 1 / (1 - DELTA$3); + } + + var maxR = self.get('maxR'); + var minR = self.get('minR'); + var r = self.get('r'); + + if (r > (maxR || graph.get('height')) && ratio > 1 || r < (minR || graph.get('height') * 0.05) && ratio < 1) { + ratio = 1; + } + + r *= ratio; + self.set('r', r); + self.set('r2', r * r); + var d = self.get('d'); + self.set('molecularParam', (d + 1) * r); + self.set('delegateCenterDiff', undefined); + self.magnify(e, mousePos); + }; + /** + * Scale the range by dragging + * @param e mouse event + */ + + + Fisheye.prototype.scaleRByDrag = function (e) { + var self = this; + if (!e) return; + var dragPrePos = self.get('dragPrePos'); + var graph = self.get('graph'); + var ratio; + var mousePos = graph.getPointByClient(e.clientX, e.clientY); + + if (e.x - dragPrePos.x < 0) { + ratio = 1 - DELTA$3; + } else { + ratio = 1 / (1 - DELTA$3); + } + + var maxR = self.get('maxR'); + var minR = self.get('minR'); + var r = self.get('r'); + + if (r > (maxR || graph.get('height')) && ratio > 1 || r < (minR || graph.get('height') * 0.05) && ratio < 1) { + ratio = 1; + } + + r *= ratio; + self.set('r', r); + self.set('r2', r * r); + var d = self.get('d'); + self.set('molecularParam', (d + 1) * r); + self.magnify(e, mousePos); + self.set('dragPrePos', { + x: e.x, + y: e.y + }); + }; + /** + * Scale the magnifying factor by wheel + * @param e mouse wheel event + */ + + + Fisheye.prototype.scaleDByWheel = function (evt) { + var self = this; + if (!evt && !evt.originalEvent) return; + if (evt.preventDefault) evt.preventDefault(); + var delta = 0; + + if (evt.originalEvent.wheelDelta < 0) { + delta = -0.1; + } else { + delta = 0.1; + } + + var d = self.get('d'); + var newD = d + delta; + var maxD = self.get('maxD'); + var minD = self.get('minD'); + + if (newD < maxD && newD > minD) { + self.set('d', newD); + var r = self.get('r'); + self.set('molecularParam', (newD + 1) * r); + var lensDelegate = self.get('delegate'); + var lensCenter = lensDelegate ? { + x: lensDelegate.attr('x'), + y: lensDelegate.attr('y') + } : undefined; + self.set('delegateCenterDiff', undefined); + self.magnify(evt, lensCenter); + } + }; + /** + * Scale the magnifying factor by dragging + * @param e mouse event + */ + + + Fisheye.prototype.scaleDByDrag = function (e) { + var self = this; + var dragPrePos = self.get('dragPrePos'); + var delta = e.x - dragPrePos.x > 0 ? 0.1 : -0.1; + var d = self.get('d'); + var newD = d + delta; + var maxD = self.get('maxD'); + var minD = self.get('minD'); + + if (newD < maxD && newD > minD) { + self.set('d', newD); + var r = self.get('r'); + self.set('molecularParam', (newD + 1) * r); + self.magnify(e); + } + + self.set('dragPrePos', { + x: e.x, + y: e.y + }); + }; + /** + * Response function for mousemove, click, or drag to magnify + * @param e mouse event + */ + + + Fisheye.prototype.magnify = function (e, mousePos) { + var self = this; + self.restoreCache(); + var graph = self.get('graph'); + var cachedMagnifiedModels = self.get('cachedMagnifiedModels'); + var cachedOriginPositions = self.get('cachedOriginPositions'); + var showLabel = self.get('showLabel'); + var r = self.get('r'); + var r2 = self.get('r2'); + var d = self.get('d'); + var molecularParam = self.get('molecularParam'); + var nodes = graph.getNodes(); + var nodeLength = nodes.length; + var mCenter = mousePos ? { + x: mousePos.x, + y: mousePos.y + } : { + x: e.x, + y: e.y + }; + + if (self.get('dragging') && (self.get('trigger') === 'mousemove' || self.get('trigger') === 'click')) { + mCenter = self.get('cacheCenter'); + } + + var delegateCenterDiff = self.get('delegateCenterDiff'); + + if (delegateCenterDiff) { + mCenter.x += delegateCenterDiff.x; + mCenter.y += delegateCenterDiff.y; + } + + self.updateDelegate(mCenter, r); + + for (var i = 0; i < nodeLength; i++) { + var model = nodes[i].getModel(); + var x = model.x, + y = model.y; + if (isNaN(x) || isNaN(y)) continue; // the square of the distance between the node and the magnified center + + var dist2 = (x - mCenter.x) * (x - mCenter.x) + (y - mCenter.y) * (y - mCenter.y); + + if (!isNaN(dist2) && dist2 < r2 && dist2 !== 0) { + var dist = Math.sqrt(dist2); // (r * (d + 1) * (dist / r)) / (d * (dist / r) + 1); + + var magnifiedDist = molecularParam * dist / (d * dist + r); + var cos = (x - mCenter.x) / dist; + var sin = (y - mCenter.y) / dist; + model.x = cos * magnifiedDist + mCenter.x; + model.y = sin * magnifiedDist + mCenter.y; + + if (!cachedOriginPositions[model.id]) { + cachedOriginPositions[model.id] = { + x: x, + y: y, + texts: [] + }; + } + + cachedMagnifiedModels.push(model); + + if (showLabel && 2 * dist < r) { + var node = nodes[i]; + var nodeGroup = node.getContainer(); + var shapes = nodeGroup.getChildren(); + var shapeLength = shapes.length; + + for (var j = 0; j < shapeLength; j++) { + var shape = shapes[j]; + + if (shape.get('type') === 'text') { + cachedOriginPositions[model.id].texts.push({ + visible: shape.get('visible'), + shape: shape + }); + shape.set('visible', true); + } + } + } + } + } + + graph.refreshPositions(); + }; + /** + * Restore the cache nodes while magnifying + */ + + + Fisheye.prototype.restoreCache = function () { + var self = this; + var cachedMagnifiedModels = self.get('cachedMagnifiedModels'); + var cachedOriginPositions = self.get('cachedOriginPositions'); + var cacheLength = cachedMagnifiedModels.length; + + for (var i = 0; i < cacheLength; i++) { + var node = cachedMagnifiedModels[i]; + var id = node.id; + var ori = cachedOriginPositions[id]; + node.x = ori.x; + node.y = ori.y; + var textLength = ori.texts.length; + + for (var j = 0; j < textLength; j++) { + var text = ori.texts[j]; + text.shape.set('visible', text.visible); + } + } + + self.set('cachedMagnifiedModels', []); + self.set('cachedOriginPositions', {}); + }; + /** + * Adjust part of the parameters, including trigger, d, r, maxR, minR, maxD, minD, scaleRBy, and scaleDBy + * @param {FisheyeConfig} cfg + */ + + + Fisheye.prototype.updateParams = function (cfg) { + var self = this; + var r = cfg.r, + d = cfg.d, + trigger = cfg.trigger, + minD = cfg.minD, + maxD = cfg.maxD, + minR = cfg.minR, + maxR = cfg.maxR, + scaleDBy = cfg.scaleDBy, + scaleRBy = cfg.scaleRBy; + + if (!isNaN(cfg.r)) { + self.set('r', r); + self.set('r2', r * r); + } + + if (!isNaN(d)) { + self.set('d', d); + } + + if (!isNaN(maxD)) { + self.set('maxD', maxD); + } + + if (!isNaN(minD)) { + self.set('minD', minD); + } + + if (!isNaN(maxR)) { + self.set('maxR', maxR); + } + + if (!isNaN(minR)) { + self.set('minR', minR); + } + + var nd = self.get('d'); + var nr = self.get('r'); + self.set('molecularParam', (nd + 1) * nr); + + if (trigger === 'mousemove' || trigger === 'click' || trigger === 'drag') { + self.set('trigger', trigger); + } + + if (scaleDBy === 'drag' || scaleDBy === 'wheel' || scaleDBy === 'unset') { + self.set('scaleDBy', scaleDBy); + self.get('delegate').remove(); + self.get('delegate').destroy(); + var dPercentText = self.get('dPercentText'); + + if (dPercentText) { + dPercentText.remove(); + dPercentText.destroy(); + } + } + + if (scaleRBy === 'drag' || scaleRBy === 'wheel' || scaleRBy === 'unset') { + self.set('scaleRBy', scaleRBy); + self.get('delegate').remove(); + self.get('delegate').destroy(); + var dPercentText = self.get('dPercentText'); + + if (dPercentText) { + dPercentText.remove(); + dPercentText.destroy(); + } + } + }; + /** + * Update the delegate shape of the lens + * @param {Point} mCenter the center of the shape + * @param {number} r the radius of the shape + */ + + + Fisheye.prototype.updateDelegate = function (mCenter, r) { + var _this = this; + + var self = this; + var graph = self.get('graph'); + var lensDelegate = self.get('delegate'); + + if (!lensDelegate || lensDelegate.destroyed) { + // 拖动多个 + var parent_1 = graph.get('group'); + var attrs = self.get('delegateStyle') || lensDelegateStyle$1; // model上的x, y是相对于图形中心的, delegateShape是g实例, x,y是绝对坐标 + + lensDelegate = parent_1.addShape('circle', { + attrs: __assign$m({ + r: r / 1.5, + x: mCenter.x, + y: mCenter.y + }, attrs), + name: 'lens-shape', + draggable: true + }); + + if (this.get('trigger') !== 'drag') { + // 调整范围 r 的监听 + if (this.get('scaleRBy') === 'wheel') { + // 使用滚轮调整 r + lensDelegate.on('mousewheel', function (evt) { + self.scaleRByWheel(evt); + }); + } else if (this.get('scaleRBy') === 'drag') { + // 使用拖拽调整 r + lensDelegate.on('dragstart', function (e) { + self.set('dragging', true); + self.set('cacheCenter', { + x: e.x, + y: e.y + }); + self.set('dragPrePos', { + x: e.x, + y: e.y + }); + }); + lensDelegate.on('drag', function (evt) { + self.scaleRByDrag(evt); + }); + lensDelegate.on('dragend', function (e) { + self.set('dragging', false); + }); + } // 调整缩放系数 d 的监听 + + + if (this.get('scaleDBy') === 'wheel') { + // 使用滚轮调整 d + lensDelegate.on('mousewheel', function (evt) { + _this.scaleDByWheel(evt); + }); + } else if (this.get('scaleDBy') === 'drag') { + // 使用拖拽调整 d + lensDelegate.on('dragstart', function (evt) { + self.set('dragging', true); + self.set('cacheCenter', { + x: evt.x, + y: evt.y + }); + self.set('dragPrePos', { + x: evt.x, + y: evt.y + }); + }); + lensDelegate.on('drag', function (evt) { + _this.scaleDByDrag(evt); + }); + lensDelegate.on('dragend', function (evt) { + self.set('dragging', false); + }); + } + } + } else { + lensDelegate.attr({ + x: mCenter.x, + y: mCenter.y, + r: r / 1.5 + }); + } // 绘制缩放系数百分比文本 + + + if (self.get('showDPercent')) { + var percent = Math.round((self.get('d') - self.get('minD')) / (self.get('maxD') - self.get('minD')) * 100); + var dPercentText = self.get('dPercentText'); + var textY = mCenter.y + r / 1.5 + 16; + + if (!dPercentText || dPercentText.destroyed) { + var parent_2 = graph.get('group'); + dPercentText = parent_2.addShape('text', { + attrs: { + text: percent + "%", + x: mCenter.x, + y: textY, + fill: '#aaa', + stroke: '#fff', + lineWidth: 1, + fontSize: 12 + } + }); + self.set('dPercentText', dPercentText); + } else { + dPercentText.attr({ + text: percent + "%", + x: mCenter.x, + y: textY + }); + } + } + + self.set('delegate', lensDelegate); + }; + /** + * Clear the fisheye lens + */ + + + Fisheye.prototype.clear = function () { + var graph = this.get('graph'); + this.restoreCache(); + graph.refreshPositions(); + var lensDelegate = this.get('delegate'); + + if (lensDelegate && !lensDelegate.destroyed) { + lensDelegate.remove(); + lensDelegate.destroy(); + } + + var dPercentText = this.get('dPercentText'); + + if (dPercentText && !dPercentText.destroyed) { + dPercentText.remove(); + dPercentText.destroy(); + } + }; + /** + * Destroy the component + */ + + + Fisheye.prototype.destroy = function () { + this.clear(); + }; + + return Fisheye; +}(PluginBase$1); + +var Fisheye$2 = Fisheye$1; + +var __extends$5 = undefined && undefined.__extends || function () { + var _extendStatics = function extendStatics(d, b) { + _extendStatics = Object.setPrototypeOf || { + __proto__: [] + } instanceof Array && function (d, b) { + d.__proto__ = b; + } || function (d, b) { + for (var p in b) { + if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; + } + }; + + return _extendStatics(d, b); + }; + + return function (d, b) { + if (typeof b !== "function" && b !== null) throw new TypeError("Class extends value " + String(b) + " is not a constructor or null"); + + _extendStatics(d, b); + + function __() { + this.constructor = d; + } + + d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); + }; +}(); +var DELTA$2 = 0.05; +insertCss$1("\n .g6-component-toolbar {\n position: absolute;\n list-style-type: none;\n padding: 6px;\n left: 0px;\n top: 0px;\n background-color: rgba(255, 255, 255, 0.9);\n border: 1px solid #e2e2e2;\n border-radius: 4px;\n font-size: 12px;\n color: #545454;\n margin: 0;\n }\n .g6-component-toolbar li {\n float: left;\n text-align: center;\n width: 35px;\n height: 24px;\n cursor: pointer;\n\t\tlist-style-type:none;\n list-style: none;\n margin-left: 0px;\n }\n .g6-component-toolbar li .icon {\n opacity: 0.7;\n }\n .g6-component-toolbar li .icon:hover {\n opacity: 1;\n }\n"); + +var getEventPath = function getEventPath(evt) { + if (!evt) { + return []; + } + + if (evt.composedPath) { + return evt.composedPath(); + } + + var path = []; + var el = evt.target; + + while (el) { + path.push(el); + + if (el.tagName === 'HTML') { + path.push(document, window); + return path; + } + + el = el.parentElement; + } + + return path; +}; + +var ToolBar = +/** @class */ +function (_super) { + __extends$5(ToolBar, _super); + + function ToolBar() { + return _super !== null && _super.apply(this, arguments) || this; + } + + ToolBar.prototype.getDefaultCfgs = function () { + return { + handleClick: undefined, + // 指定菜单内容，function(e) {...} + getContent: function getContent(graph) { + return "\n
      \n
    • \n \n \n \n
      • \n
    • \n \n \n \n
      • \n
    • \n \n \n \n
      • \n
    • \n \n \n \n
      • \n
    • \n \n \n \n
      • \n
    • \n \n \n \n
      • \n
    \n "; + }, + zoomSensitivity: 2 + }; + }; + + ToolBar.prototype.init = function () { + var _this = this; + + var graph = this.get('graph'); + var getContent = this.get('getContent'); + var toolBar = getContent(graph); + var toolBarDOM = toolBar; + + if (isString$3(toolBar)) { + toolBarDOM = createDom$1(toolBar); + } + + var className = this.get('className'); + toolBarDOM.setAttribute('class', className || 'g6-component-toolbar'); + var container = this.get('container'); + + if (!container) { + container = this.get('graph').get('container'); + } + + if (isString$3(container)) { + container = document.getElementById(container); + } + + container.appendChild(toolBarDOM); + this.set('toolBar', toolBarDOM); + var handleClick = this.get('handleClick'); + toolBarDOM.addEventListener('click', function (evt) { + var current = getEventPath(evt).filter(function (p) { + return p.nodeName === 'LI'; + }); + + if (current.length === 0) { + return; + } + + var code = current[0].getAttribute('code'); + + if (!code) { + return; + } + + if (handleClick) { + handleClick(code, graph); + } else { + _this.handleDefaultOperator(code, graph); + } + }); + var pos = this.get('position'); + + if (pos) { + modifyCSS(toolBarDOM, { + top: pos.y + "px", + left: pos.x + "px" + }); + } + + this.bindUndoRedo(); + }; + + ToolBar.prototype.bindUndoRedo = function () { + var graph = this.get('graph'); + var undoDom = document.querySelector('.g6-component-toolbar li[code="undo"]'); + var undoDomIcon = document.querySelector('.g6-component-toolbar li[code="undo"] svg'); + var redoDom = document.querySelector('.g6-component-toolbar li[code="redo"]'); + var redoDomIcon = document.querySelector('.g6-component-toolbar li[code="redo"] svg'); + + if (!undoDom || !undoDomIcon || !redoDom || !redoDomIcon) { + return; + } + + graph.on('stackchange', function (evt) { + var undoStack = evt.undoStack, + redoStack = evt.redoStack; + var undoStackLen = undoStack.length; + var redoStackLen = redoStack.length; // undo 不可用 + + if (undoStackLen === 1) { + undoDom.setAttribute('style', 'cursor: not-allowed'); + undoDomIcon.setAttribute('style', 'opacity: 0.4'); + } else { + undoDom.removeAttribute('style'); + undoDomIcon.removeAttribute('style'); + } // redo 不可用 + + + if (redoStackLen === 0) { + redoDom.setAttribute('style', 'cursor: not-allowed'); + redoDomIcon.setAttribute('style', 'opacity: 0.4'); + } else { + redoDom.removeAttribute('style'); + redoDomIcon.removeAttribute('style'); + } + }); + }; + /** + * undo 操作 + */ + + + ToolBar.prototype.undo = function () { + var graph = this.get('graph'); + var undoStack = graph.getUndoStack(); + + if (!undoStack || undoStack.length === 1) { + return; + } + + var currentData = undoStack.pop(); + + if (currentData) { + var action = currentData.action; + graph.pushStack(action, clone$7(currentData.data), 'redo'); + var data_1 = currentData.data.before; + + if (action === 'add') { + data_1 = currentData.data.after; + } + + if (!data_1) return; + + switch (action) { + case 'visible': + { + Object.keys(data_1).forEach(function (key) { + var array = data_1[key]; + if (!array) return; + array.forEach(function (model) { + var item = graph.findById(model.id); + + if (model.visible) { + graph.showItem(item, false); + } else { + graph.hideItem(item, false); + } + }); + }); + break; + } + + case 'render': + case 'update': + Object.keys(data_1).forEach(function (key) { + var array = data_1[key]; + if (!array) return; + array.forEach(function (model) { + graph.updateItem(model.id, model, false); + }); + }); + break; + + case 'changedata': + graph.changeData(data_1, false); + break; + + case 'delete': + { + Object.keys(data_1).forEach(function (key) { + var array = data_1[key]; + if (!array) return; + array.forEach(function (model) { + var itemType = model.itemType; + delete model.itemType; + graph.addItem(itemType, model, false); + }); + }); + break; + } + + case 'add': + Object.keys(data_1).forEach(function (key) { + var array = data_1[key]; + if (!array) return; + array.forEach(function (model) { + graph.removeItem(model.id, false); + }); + }); + break; + + case 'updateComboTree': + Object.keys(data_1).forEach(function (key) { + var array = data_1[key]; + if (!array) return; + array.forEach(function (model) { + graph.updateComboTree(model.id, model.parentId, false); + }); + }); + break; + } + } + }; + /** + * redo 操作 + */ + + + ToolBar.prototype.redo = function () { + var graph = this.get('graph'); + var redoStack = graph.getRedoStack(); + + if (!redoStack || redoStack.length === 0) { + return; + } + + var currentData = redoStack.pop(); + + if (currentData) { + var action = currentData.action; + var data_2 = currentData.data.after; + graph.pushStack(action, clone$7(currentData.data)); + + if (action === 'delete') { + data_2 = currentData.data.before; + } + + if (!data_2) return; + + switch (action) { + case 'visible': + { + Object.keys(data_2).forEach(function (key) { + var array = data_2[key]; + if (!array) return; + array.forEach(function (model) { + var item = graph.findById(model.id); + + if (model.visible) { + graph.showItem(item, false); + } else { + graph.hideItem(item, false); + } + }); + }); + break; + } + + case 'render': + case 'update': + Object.keys(data_2).forEach(function (key) { + var array = data_2[key]; + if (!array) return; + array.forEach(function (model) { + graph.updateItem(model.id, model, false); + }); + }); + break; + + case 'changedata': + graph.changeData(data_2, false); + break; + + case 'delete': + if (data_2.edges) { + data_2.edges.forEach(function (model) { + graph.removeItem(model.id, false); + }); + } + + if (data_2.nodes) { + data_2.nodes.forEach(function (model) { + graph.removeItem(model.id, false); + }); + } + + if (data_2.combos) { + data_2.combos.forEach(function (model) { + graph.removeItem(model.id, false); + }); + } + + break; + + case 'add': + { + Object.keys(data_2).forEach(function (key) { + var array = data_2[key]; + if (!array) return; + array.forEach(function (model) { + var itemType = model.itemType; + delete model.itemType; + graph.addItem(itemType, model, false); + }); + }); + break; + } + + case 'updateComboTree': + Object.keys(data_2).forEach(function (key) { + var array = data_2[key]; + if (!array) return; + array.forEach(function (model) { + graph.updateComboTree(model.id, model.parentId, false); + }); + }); + break; + } + } + }; + /** + * 根据 Toolbar 上不同类型对图进行操作 + * @param code 操作类型编码 + * @param graph Graph 实例 + */ + + + ToolBar.prototype.handleDefaultOperator = function (code, graph) { + var currentZoom = graph.getZoom(); + + switch (code) { + case 'redo': + this.redo(); + break; + + case 'undo': + this.undo(); + break; + + case 'zoomOut': + { + var ratioOut = 1 / (1 - DELTA$2 * this.get('zoomSensitivity')); + var maxZoom = this.get('maxZoom') || graph.get('maxZoom'); + + if (ratioOut * currentZoom > maxZoom) { + return; + } + + graph.zoomTo(currentZoom * ratioOut); + break; + } + + case 'zoomIn': + { + var ratioIn = 1 - DELTA$2 * this.get('zoomSensitivity'); + var minZoom = this.get('minZoom') || graph.get('minZoom'); + + if (ratioIn * currentZoom < minZoom) { + return; + } + + graph.zoomTo(currentZoom * ratioIn); + break; + } + + case 'realZoom': + graph.zoomTo(1); + break; + + case 'autoZoom': + graph.fitView([20, 20]); + break; + } + }; + + ToolBar.prototype.destroy = function () { + var toolBar = this.get('toolBar'); + + if (toolBar) { + var container = this.get('container'); + + if (!container) { + container = this.get('graph').get('container'); + } + + if (isString$3(container)) { + container = document.getElementById(container); + } + + container.removeChild(toolBar); + } + + var handleClick = this.get('handleClick'); + + if (handleClick) { + toolBar.removeEventListener('click', handleClick); + } + }; + + return ToolBar; +}(PluginBase$1); + +var ToolBar$1 = ToolBar; + +var __extends$4 = undefined && undefined.__extends || function () { + var _extendStatics = function extendStatics(d, b) { + _extendStatics = Object.setPrototypeOf || { + __proto__: [] + } instanceof Array && function (d, b) { + d.__proto__ = b; + } || function (d, b) { + for (var p in b) { + if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; + } + }; + + return _extendStatics(d, b); + }; + + return function (d, b) { + if (typeof b !== "function" && b !== null) throw new TypeError("Class extends value " + String(b) + " is not a constructor or null"); + + _extendStatics(d, b); + + function __() { + this.constructor = d; + } + + d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); + }; +}(); +insertCss$1("\n .g6-component-tooltip {\n border: 1px solid #e2e2e2;\n border-radius: 4px;\n font-size: 12px;\n color: #545454;\n background-color: rgba(255, 255, 255, 0.9);\n padding: 10px 8px;\n box-shadow: rgb(174, 174, 174) 0px 0px 10px;\n }\n .tooltip-type {\n padding: 0;\n margin: 0;\n }\n .tooltip-id {\n color: #531dab;\n }\n"); + +var Tooltip$1 = +/** @class */ +function (_super) { + __extends$4(Tooltip, _super); + + function Tooltip() { + return _super !== null && _super.apply(this, arguments) || this; + } + + Tooltip.prototype.getDefaultCfgs = function () { + return { + offsetX: 6, + offsetY: 6, + // 指定菜单内容，function(e) {...} + getContent: function getContent(e) { + return "\n

    \u7C7B\u578B\uFF1A" + e.item.getType() + "

    \n ID\uFF1A" + e.item.getID() + "\n "; + }, + shouldBegin: function shouldBegin(e) { + return true; + }, + itemTypes: ['node', 'edge', 'combo'], + trigger: 'mouseenter', + fixToNode: undefined + }; + }; // class-methods-use-this + + + Tooltip.prototype.getEvents = function () { + if (this.get('trigger') === 'click') { + return { + 'node:click': 'onClick', + 'edge:click': 'onClick', + 'combo:click': 'onClick', + 'canvas:click': 'onMouseLeave', + afterremoveitem: 'onMouseLeave', + contextmenu: 'onMouseLeave', + 'drag': 'onMouseLeave' + }; + } + + return { + 'node:mouseenter': 'onMouseEnter', + 'node:mouseleave': 'onMouseLeave', + 'node:mousemove': 'onMouseMove', + 'edge:mouseenter': 'onMouseEnter', + 'edge:mouseleave': 'onMouseLeave', + 'edge:mousemove': 'onMouseMove', + 'combo:mouseenter': 'onMouseEnter', + 'combo:mouseleave': 'onMouseLeave', + 'combo:mousemove': 'onMouseMove', + afterremoveitem: 'onMouseLeave', + contextmenu: 'onMouseLeave', + 'node:drag': 'onMouseLeave' + }; + }; + + Tooltip.prototype.init = function () { + var className = this.get('className') || 'g6-component-tooltip'; + var tooltip = createDom$1("
    "); + var container = this.get('container'); + + if (!container) { + container = this.get('graph').get('container'); + } + + if (isString$3(container)) { + container = document.getElementById(container); + } + + modifyCSS(tooltip, { + position: 'absolute', + visibility: 'hidden', + display: 'none' + }); + container.appendChild(tooltip); + this.set('tooltip', tooltip); + }; + + Tooltip.prototype.onClick = function (e) { + var itemTypes = this.get('itemTypes'); + if (e.item && e.item.getType && itemTypes.indexOf(e.item.getType()) === -1) return; + var item = e.item; + var graph = this.get('graph'); // 若与上一次同一 item，隐藏该 tooltip + + if (this.currentTarget === item) { + this.currentTarget = null; + this.hideTooltip(); + graph.emit('tooltipchange', { + item: e.item, + action: 'hide' + }); + } else { + this.currentTarget = item; + this.showTooltip(e); + graph.emit('tooltipchange', { + item: e.item, + action: 'show' + }); + } + }; + + Tooltip.prototype.onMouseEnter = function (e) { + var itemTypes = this.get('itemTypes'); + if (e.item && e.item.getType && itemTypes.indexOf(e.item.getType()) === -1) return; + var item = e.item; + var graph = this.get('graph'); + this.currentTarget = item; + this.showTooltip(e); + graph.emit('tooltipchange', { + item: e.item, + action: 'show' + }); + }; + + Tooltip.prototype.onMouseMove = function (e) { + var itemTypes = this.get('itemTypes'); + if (e.item && e.item.getType && itemTypes.indexOf(e.item.getType()) === -1) return; + + if (!this.currentTarget || e.item !== this.currentTarget) { + return; + } + + this.showTooltip(e); + }; + + Tooltip.prototype.onMouseLeave = function () { + this.hideTooltip(); + var graph = this.get('graph'); + graph.emit('tooltipchange', { + item: this.currentTarget, + action: 'hide' + }); + this.currentTarget = null; + }; + + Tooltip.prototype.showTooltip = function (e) { + if (!e.item) { + return; + } + + var itemTypes = this.get('itemTypes'); + if (e.item.getType && itemTypes.indexOf(e.item.getType()) === -1) return; + var container = this.get('tooltip'); + var getContent = this.get('getContent'); + var tooltip = getContent(e); + + if (isString$3(tooltip)) { + container.innerHTML = tooltip; + } else { + container.innerHTML = tooltip.outerHTML; + } + + this.updatePosition(e); + }; + + Tooltip.prototype.hideTooltip = function () { + var tooltip = this.get('tooltip'); + + if (tooltip) { + modifyCSS(tooltip, { + visibility: 'hidden', + display: 'none' + }); + } + }; + + Tooltip.prototype.updatePosition = function (e) { + var shouldBegin = this.get('shouldBegin'); + var tooltip = this.get('tooltip'); + + if (!shouldBegin(e)) { + modifyCSS(tooltip, { + visibility: 'hidden', + display: 'none' + }); + return; + } + + var graph = this.get('graph'); + var width = graph.get('width'); + var height = graph.get('height'); + var offsetX = this.get('offsetX') || 0; + var offsetY = this.get('offsetY') || 0; // const mousePos = graph.getPointByClient(e.clientX, e.clientY); + + var point = graph.getPointByClient(e.clientX, e.clientY); + var fixToNode = this.get('fixToNode'); + var item = e.item; + + if (item.getType && item.getType() === 'node' && fixToNode && isArray$n(fixToNode) && fixToNode.length >= 2) { + var itemBBox = item.getBBox(); + point = { + x: itemBBox.minX + itemBBox.width * fixToNode[0], + y: itemBBox.minY + itemBBox.height * fixToNode[1] + }; + } + + var _a = graph.getCanvasByPoint(point.x, point.y), + x = _a.x, + y = _a.y; + + var graphContainer = graph.getContainer(); + var res = { + x: x + graphContainer.offsetLeft + offsetX, + y: y + graphContainer.offsetTop + offsetY + }; // 先修改为 visible 方可正确计算 bbox + + modifyCSS(tooltip, { + visibility: 'visible', + display: 'unset' + }); + var bbox = tooltip.getBoundingClientRect(); + + if (x + bbox.width + offsetX > width) { + res.x -= bbox.width + offsetX; + } + + if (y + bbox.height + offsetY > height) { + res.y -= bbox.height + offsetY; + } + + modifyCSS(tooltip, { + left: res.x + "px", + top: res.y + "px" + }); + }; + + Tooltip.prototype.hide = function () { + this.onMouseLeave(); + }; + + Tooltip.prototype.destroy = function () { + var tooltip = this.get('tooltip'); + + if (tooltip) { + var container = this.get('container'); + + if (!container) { + container = this.get('graph').get('container'); + } + + if (isString$3(container)) { + container = document.getElementById(container); + } + + container.removeChild(tooltip); + } + }; + + return Tooltip; +}(PluginBase$1); + +var Tooltip$2 = Tooltip$1; + +var __spreadArray = undefined && undefined.__spreadArray || function (to, from) { + for (var i = 0, il = from.length, j = to.length; i < il; i++, j++) { + to[j] = from[i]; + } + + return to; +}; +/** + * 点数组转 path + * @param points + */ + +function pointsToPath(points) { + return map$4(points, function (p, idx) { + var command = idx === 0 ? 'M' : 'L'; + var x = p[0], + y = p[1]; + return [command, x, y]; + }); +} +/** + * 将点连接成路径 path + * @param points + */ + + +function getLinePath(points) { + return pointsToPath(points); +} +/** + * 将点连成平滑的曲线 + * @param points + */ + +function getSmoothLinePath(points) { + if (points.length <= 2) { + // 两点以内直接绘制成路径 + return getLinePath(points); + } + + var data = []; + each$2(points, function (p) { + // 当前点和上一个点一样的时候，忽略掉 + if (!isEqual$2(p, data.slice(data.length - 2))) { + data.push(p[0], p[1]); + } + }); + var path = catmullRom2Bezier(data, false); + + var _a = head(points), + x = _a[0], + y = _a[1]; + + path.unshift(['M', x, y]); + return path; +} +/** + * 将数据转成 path，利用 scale 的归一化能力 + * @param data + * @param width + * @param height + * @param smooth + */ + +function dataToPath(data, width, height, smooth) { + if (smooth === void 0) { + smooth = true; + } // 利用 scale 来获取 y 上的映射 + + + var y = new Linear({ + values: data + }); + var x = new Category$1({ + values: map$4(data, function (v, idx) { + return idx; + }) + }); + var points = map$4(data, function (v, idx) { + return [x.scale(idx) * width, height - y.scale(v) * height]; + }); + return smooth ? getSmoothLinePath(points) : getLinePath(points); +} +function dataToRectPath(data, width, height) { + // 利用 scale 来获取 y 上的映射 + var y = new Linear({ + values: data + }); + var x = new Category$1({ + values: map$4(data, function (v, idx) { + return idx; + }) + }); + var points = map$4(data, function (v, idx) { + return [x.scale(idx) * width, height - y.scale(v) * height]; + }); + var rectPoints = []; + + for (var i = 0; i < points.length; i++) { + var point = points[i]; + var param = { + x: point[0], + y: point[1], + y0: height, + size: 5 + }; + var rectPoint = getRectPoints(param); + rectPoints.push.apply(rectPoints, rectPoint); + } + + return getRectPath(rectPoints); +} +/** + * 获得 area 面积的横向连接线的 px 位置 + * @param data + * @param width + * @param height + */ + +function getAreaLineY(data, height) { + var y = new Linear({ + values: data + }); + var lineY = Math.max(0, y.min); + return height - y.scale(lineY) * height; +} +/** + * 线 path 转 area path + * @param path + * @param width + * @param height + */ + +function linePathToAreaPath(path, width, height, data) { + var areaPath = __spreadArray([], path); + + var lineYPx = getAreaLineY(data, height); + areaPath.push(['L', width, lineYPx]); + areaPath.push(['L', 0, lineYPx]); + areaPath.push(['Z']); + return areaPath; +} +/** + * @ignore + * 根据数据点生成矩形的四个关键点 + * @param pointInfo 数据点信息 + * @returns rect points 返回矩形四个顶点信息 + */ + +function getRectPoints(pointInfo) { + var x = pointInfo.x, + y = pointInfo.y, + y0 = pointInfo.y0, + size = pointInfo.size; // 有 4 种情况， + // 1. x, y 都不是数组 + // 2. y是数组，x不是 + // 3. x是数组，y不是 + // 4. x, y 都是数组 + + var yMin; + var yMax; + + if (isArray$n(y)) { + yMin = y[0], yMax = y[1]; + } else { + yMin = y0; + yMax = y; + } + + var xMin; + var xMax; + + if (isArray$n(x)) { + xMin = x[0], xMax = x[1]; + } else { + xMin = x - size / 2; + xMax = x + size / 2; + } + + var points = [{ + x: xMin, + y: yMin + }, { + x: xMin, + y: yMax + }]; // 矩形的四个关键点，结构如下（左下角顺时针连接） + // 1 ---- 2 + // | | + // 0 ---- 3 + + points.push({ + x: xMax, + y: yMax + }, { + x: xMax, + y: yMin + }); + return points; +} +/** + * @ignore + * 根据矩形关键点绘制 path + * @param points 关键点数组 + * @param isClosed path 是否需要闭合 + * @returns 返回矩形的 path + */ + +function getRectPath(points, isClosed) { + if (isClosed === void 0) { + isClosed = true; + } + + var path = []; + var firstPoint = points[0]; + path.push(['M', firstPoint.x, firstPoint.y]); + + for (var i = 1, len = points.length; i < len; i++) { + path.push(['L', points[i].x, points[i].y]); + } // 对于 shape="line" path 不应该闭合，否则会造成 lineCap 绘图属性失效 + + + if (isClosed) { + path.push(['L', firstPoint.x, firstPoint.y]); // 需要闭合 + + path.push(['z']); + } + + return path; +} + +var __assign$l = undefined && undefined.__assign || function () { + __assign$l = Object.assign || function (t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + + for (var p in s) { + if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; + } + } + + return t; + }; + + return __assign$l.apply(this, arguments); +}; +var LINE_STYLE = { + stroke: '#C5C5C5', + strokeOpacity: 0.85 +}; +var AREA_STYLE = { + fill: '#CACED4', + opacity: 0.85 +}; +/** + * 缩略趋势图 + */ + +var Trend = +/** @class */ +function () { + function Trend(cfg) { + var _a = cfg.x, + x = _a === void 0 ? 0 : _a, + _b = cfg.y, + y = _b === void 0 ? 0 : _b, + _c = cfg.width, + width = _c === void 0 ? 200 : _c, + _d = cfg.height, + height = _d === void 0 ? 26 : _d, + _e = cfg.smooth, + smooth = _e === void 0 ? true : _e, + _f = cfg.isArea, + isArea = _f === void 0 ? false : _f, + _g = cfg.data, + data = _g === void 0 ? [] : _g, + lineStyle = cfg.lineStyle, + areaStyle = cfg.areaStyle, + group = cfg.group, + _h = cfg.interval, + interval = _h === void 0 ? null : _h; + this.group = group; + this.x = x; + this.y = y; + this.width = width; + this.height = height; + this.data = data; + this.smooth = smooth; + this.isArea = isArea; + this.lineStyle = Object.assign({}, LINE_STYLE, lineStyle); + this.areaStyle = Object.assign({}, AREA_STYLE, areaStyle); + this.intervalConfig = interval; + this.renderLine(); + } + /** + * 构造 + * @private + */ + + + Trend.prototype.renderLine = function () { + var _a = this, + x = _a.x, + y = _a.y, + width = _a.width, + height = _a.height, + data = _a.data, + smooth = _a.smooth, + isArea = _a.isArea, + lineStyle = _a.lineStyle, + areaStyle = _a.areaStyle; + + var trendGroup = this.group.addGroup({ + name: 'trend-group' + }); + + if (data) { + var path = dataToPath(data, width, height, smooth); // 线 + + trendGroup.addShape('path', { + attrs: __assign$l({ + path: path + }, lineStyle) + }); // 在 line 的基础上，绘制面积图 + + if (isArea) { + var areaPath = linePathToAreaPath(path, width, height, data); + trendGroup.addShape('path', { + attrs: __assign$l({ + path: areaPath + }, areaStyle) + }); + } + } // 绘制柱状图📊 + + + if (this.intervalConfig) { + trendGroup.addShape('path', { + attrs: __assign$l({ + path: dataToRectPath(this.intervalConfig.data, width, height) + }, this.intervalConfig.style) + }); + } // 统一移动到对应的位置 + + + trendGroup.move(x, y); + }; + + Trend.prototype.destory = function () { + this.group.destroy(); + }; + + return Trend; +}(); + +var Trend$1 = Trend; + +var __assign$k = undefined && undefined.__assign || function () { + __assign$k = Object.assign || function (t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + + for (var p in s) { + if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; + } + } + + return t; + }; + + return __assign$k.apply(this, arguments); +}; +var DEFAULT_STYLE = { + fill: '#1890ff', + stroke: '#1890ff', + type: 'trend', + radius: 2, + opacity: 1, + cursor: 'ew-resize', + // 高亮的颜色 + highLightFill: '#0050b3' +}; +var SIMPLE_DEFAULT_STYLE = { + fill: '#fff', + stroke: '#1890ff', + radius: 2, + opacity: 1, + cursor: 'ew-resize' +}; + +var Handler = +/** @class */ +function () { + function Handler(cfg) { + var group = cfg.group, + name = cfg.name, + type = cfg.type, + _a = cfg.x, + x = _a === void 0 ? 0 : _a, + _b = cfg.y, + y = _b === void 0 ? 0 : _b, + _c = cfg.width, + width = _c === void 0 ? 2 : _c, + _d = cfg.height, + height = _d === void 0 ? 24 : _d, + _e = cfg.style, + style = _e === void 0 ? {} : _e; + this.group = group; + this.name = name; + this.handleType = type; + this.x = x; + this.y = y; + this.width = width; + this.height = height; + + if (type === 'trend') { + this.style = __assign$k(__assign$k({}, DEFAULT_STYLE), style); + } else if (type === 'simple') { + this.style = __assign$k(__assign$k({}, SIMPLE_DEFAULT_STYLE), style); + } + + this.renderHandle(); + } + /** + * 设置位置 x + * @param x + */ + + + Handler.prototype.setX = function (x) { + this.setXY(x, undefined); + }; + /** + * 设置位置 y + * @param y + */ + + + Handler.prototype.setY = function (y) { + this.setXY(undefined, y); + }; + + Handler.prototype.setXY = function (x, y) { + if (isNumber$4(x)) { + this.x = x; + } + + if (isNumber$4(y)) { + this.y = y; + } + + this.updateXY(); + }; + /** + * 初始化组件 + * @private + */ + + + Handler.prototype.renderHandle = function () { + var _a = this, + width = _a.width, + height = _a.height, + style = _a.style, + name = _a.name; + + var fill = style.fill, + stroke = style.stroke, + radius = style.radius, + opacity = style.opacity, + cursor = style.cursor; + this.handleGroup = this.group.addGroup(); // 趋势图时的 handle + + if (this.handleType === 'trend') { + // 垂直线 + this.verticalLine = this.handleGroup.addShape('rect', { + attrs: { + x: 0, + y: 0, + width: width, + height: height, + fill: fill, + stroke: stroke, + radius: radius, + opacity: opacity, + cursor: cursor + }, + name: name + "-handler" + }); + this.topCircle = this.handleGroup.addShape('circle', { + attrs: { + x: width / 2, + y: 0, + r: 2 * width, + fill: fill, + stroke: stroke, + radius: radius, + opacity: opacity, + cursor: cursor + }, + name: name + "-handler" + }); + this.bottomCircle = this.handleGroup.addShape('circle', { + attrs: { + x: width / 2, + y: height, + r: 2 * width, + fill: fill, + stroke: stroke, + radius: radius, + opacity: opacity, + cursor: cursor + }, + name: name + "-handler" + }); + } else if (this.handleType === 'simple') { + this.topCircle = this.handleGroup.addShape('circle', { + attrs: { + x: width / 2, + y: height / 2, + r: 2 * width, + fill: fill, + stroke: stroke, + radius: radius, + opacity: opacity, + cursor: cursor, + lineWidth: 2 + }, + name: name + "-handler" + }); + } // 移动到对应的位置 + + + this.updateXY(); + + if (this.handleType === 'trend') { + this.bindTrendEvents(); + } else if (this.handleType === 'simple') { + this.bindSimpleEvents(); + } + }; + + Handler.prototype.bindSimpleEvents = function () { + var _this = this; + + var name = this.name; + this.handleGroup.on(name + "-handler:mouseenter", function () { + var highLightFill = _this.style.highLightFill; + + _this.topCircle.attr('fill', highLightFill); + }); + this.handleGroup.on(name + "-handler:mouseleave", function () { + var fill = _this.style.fill; + + _this.topCircle.attr('fill', fill); + }); + }; + + Handler.prototype.bindTrendEvents = function () { + var _this = this; + + var name = this.name; + this.handleGroup.on(name + "-handler:mouseenter", function () { + var highLightFill = _this.style.highLightFill; + + _this.verticalLine.attr('fill', highLightFill); + + _this.topCircle.attr('fill', highLightFill); + + _this.bottomCircle.attr('fill', highLightFill); + }); + this.handleGroup.on(name + "-handler:mouseleave", function () { + var fill = _this.style.fill; + + _this.verticalLine.attr('fill', fill); + + _this.topCircle.attr('fill', fill); + + _this.bottomCircle.attr('fill', fill); + }); + }; + + Handler.prototype.show = function () { + this.handleGroup.show(); + }; + + Handler.prototype.hide = function () { + this.handleGroup.hide(); + }; + + Handler.prototype.updateXY = function () { + this.handleGroup.setMatrix([1, 0, 0, 0, 1, 0, this.x, this.y, 1]); + }; + + return Handler; +}(); + +var Handler$1 = Handler; + +var TIMELINE_START = 'timelinestart'; +var TIMELINE_END = 'timelineend'; +var VALUE_CHANGE = 'valueChange'; +var TIMEBAR_CONFIG_CHANGE = 'timebarConfigChanged'; +var PLAY_PAUSE_BTN = 'playPauseBtn'; +var NEXT_STEP_BTN = 'nextStepBtn'; +var PRE_STEP_BTN = 'preStepBtn'; + +/** + * 基于 G 的按钮组件 + */ +var __assign$j = undefined && undefined.__assign || function () { + __assign$j = Object.assign || function (t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + + for (var p in s) { + if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; + } + } + + return t; + }; + + return __assign$j.apply(this, arguments); +}; + +var Button = +/** @class */ +function () { + function Button(cfg) { + this.config = deepMix({}, cfg); + this.init(); + } + + Button.prototype.update = function (cfg) { + this.config = deepMix({}, this.config, cfg); + this.updateElement(); + this.renderMarker(); + }; + + Button.prototype.init = function () { + this.initElement(); + this.renderMarker(); + }; + + Button.prototype.initElement = function () { + var _a = this.config, + group = _a.group, + style = _a.style; + var _b = style.scale, + scale = _b === void 0 ? 1 : _b, + _c = style.offsetX, + offsetX = _c === void 0 ? 0 : _c, + _d = style.offsetY, + offsetY = _d === void 0 ? 0 : _d; + var x = this.config.x + offsetX; + var y = this.config.y + offsetY; + var buttonGroup = group.addGroup({ + name: PLAY_PAUSE_BTN + }); + this.startMarkerGroup = buttonGroup.addGroup({ + name: PLAY_PAUSE_BTN + }); + this.circle = group.addShape('circle', { + attrs: __assign$j({ + x: x, + y: y, + r: this.config.r * scale + }, style), + name: PLAY_PAUSE_BTN + }); + this.startMarker = this.startMarkerGroup.addShape('path', { + attrs: { + path: this.getStartMarkerPath(x, y, scale), + fill: style.stroke || '#aaa' + } + }); + this.pauseMarkerGroup = buttonGroup.addGroup({ + name: PLAY_PAUSE_BTN + }); + var width = 0.25 * this.config.r * scale; + var height = 0.5 * this.config.r * Math.sqrt(3) * scale; + this.pauseLeftMarker = this.pauseMarkerGroup.addShape('rect', { + attrs: { + x: x - 0.375 * this.config.r * scale, + y: y - height / 2, + width: width, + height: height, + fill: style.stroke || '#aaa', + lineWidth: 0 + } + }); + this.pauseRightMarker = this.pauseMarkerGroup.addShape('rect', { + attrs: { + x: x + 1 / 8 * this.config.r * scale, + y: y - height / 2, + width: width, + height: height, + fill: style.stroke || '#aaa', + lineWidth: 0 + } + }); + }; + + Button.prototype.updateElement = function () { + var _a = this.config.style, + _b = _a.scale, + scale = _b === void 0 ? 1 : _b, + _c = _a.offsetX, + offsetX = _c === void 0 ? 0 : _c, + _d = _a.offsetY, + offsetY = _d === void 0 ? 0 : _d; + var x = this.config.x + offsetX; + var y = this.config.y + offsetY; + this.circle.attr('x', x); + this.circle.attr('y', y); + this.circle.attr('r', this.config.r * scale); + this.startMarker.attr('path', this.getStartMarkerPath(x, y, scale)); + var width = 0.25 * this.config.r * scale; + var height = 0.5 * this.config.r * Math.sqrt(3) * scale; + this.pauseLeftMarker.attr('x', x - (1 / 4 + 1 / 8) * this.config.r * scale); + this.pauseLeftMarker.attr('y', y - height / 2); + this.pauseLeftMarker.attr('width', width); + this.pauseLeftMarker.attr('height', height); + this.pauseRightMarker.attr('x', x + 1 / 8 * this.config.r * scale); + this.pauseRightMarker.attr('y', y - height / 2); + this.pauseRightMarker.attr('width', width); + this.pauseRightMarker.attr('height', height); + }; + + Button.prototype.renderMarker = function () { + if (this.config.isPlay) { + this.startMarkerGroup.hide(); + this.pauseMarkerGroup.show(); + } else { + this.startMarkerGroup.show(); + this.pauseMarkerGroup.hide(); + } + }; + /** 获取播放键 marker path */ + + + Button.prototype.getStartMarkerPath = function (x, y, scale) { + var sideLength = 0.5 * this.config.r * Math.sqrt(3) * scale; + return [['M', x - sideLength / Math.sqrt(3) / 2, y - sideLength / 2], ['L', x + sideLength / Math.sqrt(3), y], ['L', x - sideLength / Math.sqrt(3) / 2, y + sideLength / 2]]; + }; + + return Button; +}(); + +var Button$1 = Button; + +var __assign$i = undefined && undefined.__assign || function () { + __assign$i = Object.assign || function (t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + + for (var p in s) { + if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; + } + } + + return t; + }; + + return __assign$i.apply(this, arguments); +}; +var transform$1 = transform$3; +var DEFAULT_RECT_FILL = '#aaa'; +var DEFAULT_RECT_STROKE = 'green'; +var DEFAULT_PLAYBTN_STYLE = { + fill: '#aaa', + fillOpacity: 0.35, + stroke: '#aaa' +}; +var DEFAULT_PREBTN_STYLE = { + fill: '#fff' +}; +var DEFAULT_NEXTBTN_STYLE = { + fill: 'green' +}; +var DEFAULT_SPEED_CONTROLLER_STYLE = { + pointer: { + fill: '#aaa', + lineWidth: 0 + }, + scroller: { + stroke: '#aaa', + fill: '#aaa', + lineWidth: 1, + lineAppendWidth: 5, + cursor: 'pointer' + }, + text: { + fill: '#aaa', + textBaseline: 'top' + } +}; +var DEFAULT_TIMETYPE_CONTROLLER_STYLE = { + check: { + stroke: 'green', + lineWidth: 3 + }, + box: { + fill: '#fff', + stroke: '#aaa', + lineWidth: 2, + radius: 3, + width: 12, + height: 12 + }, + text: { + fill: '#aaa', + fontSize: 12, + textBaseline: 'top' + } +}; +var DEFAULT_CONTROLLER_CONFIG = { + speed: 1, + loop: false, + fill: '#fff', + stroke: '#fff', + hideTimeTypeController: false, + preBtnStyle: { + fill: '#aaa', + stroke: '#aaa' + }, + nextBtnStyle: { + fill: '#aaa', + stroke: '#aaa' + }, + playBtnStyle: { + fill: '#aaa', + stroke: '#aaa', + fillOpacity: 0.05 + }, + speedControllerStyle: DEFAULT_SPEED_CONTROLLER_STYLE, + timeTypeControllerStyle: DEFAULT_TIMETYPE_CONTROLLER_STYLE +}; +var SPEED_CONTROLLER_OFFSET = 110; +var TOGGLE_MODEL_OFFSET = 50; + +var ControllerBtn = +/** @class */ +function () { + function ControllerBtn(cfg) { + this.controllerCfg = deepMix({}, DEFAULT_CONTROLLER_CONFIG, cfg); + this.group = cfg.group; + this.controllerGroup = this.group.addGroup({ + name: 'controller-group' + }); + this.speedAxisY = []; + this.currentSpeed = this.controllerCfg.speed; + this.currentType = 'range'; + this.fontFamily = cfg.fontFamily || 'Arial, sans-serif'; + this.init(); + } + + ControllerBtn.prototype.init = function () { + this.renderPlayButton(); + }; + /** 获取播放键 marker path */ + + + ControllerBtn.prototype.getNextMarkerPath = function (x, y, len) { + return [['M', x, y - len], ['L', x + len, y], ['L', x, y + len], ['Z', x, y - len], ['M', x, y], ['L', x - len, y - len], ['L', x - len, y + len], ['Z']]; + }; + + ControllerBtn.prototype.getPreMarkerPath = function (x, y, len) { + return [['M', x, y - len], ['L', x - len, y], ['L', x, y + len], ['L', x, y - len], ['M', x, y], ['L', x + len, y - len], ['L', x + len, y + len], ['Z']]; + }; + + ControllerBtn.prototype.renderPlayButton = function () { + var controllerCfg = this.controllerCfg; + var width = controllerCfg.width, + height = controllerCfg.height, + x = controllerCfg.x, + y = controllerCfg.y, + hideTimeTypeController = controllerCfg.hideTimeTypeController, + _a = controllerCfg.fill, + fill = _a === void 0 ? DEFAULT_RECT_FILL : _a, + _b = controllerCfg.stroke, + stroke = _b === void 0 ? DEFAULT_RECT_STROKE : _b; + + var playBtnStyle = __assign$i(__assign$i({}, DEFAULT_PLAYBTN_STYLE), controllerCfg.playBtnStyle || {}); + + var preBtnStyle = __assign$i(__assign$i({}, DEFAULT_PREBTN_STYLE), controllerCfg.preBtnStyle || {}); + + var nextBtnStyle = __assign$i(__assign$i({}, DEFAULT_NEXTBTN_STYLE), controllerCfg.nextBtnStyle || {}); + + var r = height / 2 - 5; + var realY = y + 10; // 绘制最外层的矩形包围框 + + var container = this.controllerGroup.addShape('rect', { + attrs: { + x: x, + y: realY, + width: width, + height: height, + stroke: stroke, + fill: fill + }, + name: 'container-rect' + }); + + if (this.playButton) { + this.playButton.update({ + x: width / 2, + y: realY, + r: r + }); + } else { + this.playButton = new Button$1({ + group: this.controllerGroup, + x: width / 2, + y: realY + r + 5, + r: r, + isPlay: this.isPlay, + style: playBtnStyle + }); + } // 后退按钮 + + + var prePaddingX = preBtnStyle.offsetX || 0; + var prePaddingY = preBtnStyle.offsetY || 0; + var preR = (preBtnStyle.scale || 1) * r; + this.controllerGroup.addShape('path', { + attrs: __assign$i({ + path: this.getPreMarkerPath(width / 2 - 5 * r + prePaddingX, realY + r + 5 + prePaddingY, preR * 0.5) + }, preBtnStyle), + name: PRE_STEP_BTN + }); // 前进按钮 + + var nxtPaddingX = nextBtnStyle.offsetX || 0; + var nxtPaddingY = nextBtnStyle.offsetY || 0; + var nxtR = (nextBtnStyle.scale || 1) * r; + this.controllerGroup.addShape('path', { + attrs: __assign$i({ + path: this.getNextMarkerPath(width / 2 + 5 * r + nxtPaddingX, realY + r + 5 + nxtPaddingY, nxtR * 0.5) + }, nextBtnStyle), + name: NEXT_STEP_BTN + }); + container.toBack(); // 调节speed的按钮 + + this.renderSpeedBtn(); + + if (!hideTimeTypeController) { + this.renderToggleTime(); + } + + this.bindEvent(); // 根据配置的 scale、offsetX，offsetY 缩放和移动控制栏 + + var _c = this.controllerCfg.scale, + scale = _c === void 0 ? 1 : _c; + var currentBBox = this.controllerGroup.getCanvasBBox(); + var centerX = (currentBBox.maxX + currentBBox.minX) / 2; + var centerY = (currentBBox.maxY + currentBBox.minY) / 2; + var matrix = transform$1([1, 0, 0, 0, 1, 0, 0, 0, 1], [['t', -centerX, -centerY], ['s', scale, scale], ['t', centerX, centerY]]); + this.controllerGroup.setMatrix(matrix); + }; + + ControllerBtn.prototype.renderSpeedBtn = function () { + var _a = this.controllerCfg, + y = _a.y, + width = _a.width, + hideTimeTypeController = _a.hideTimeTypeController; + + var speedControllerStyle = __assign$i(__assign$i({}, DEFAULT_SPEED_CONTROLLER_STYLE), this.controllerCfg.speedControllerStyle || {}); + + var _b = speedControllerStyle.scroller, + scroller = _b === void 0 ? {} : _b, + _c = speedControllerStyle.text, + text = _c === void 0 ? {} : _c, + _d = speedControllerStyle.pointer, + pointer = _d === void 0 ? {} : _d, + _e = speedControllerStyle.scale, + scale = _e === void 0 ? 1 : _e, + _f = speedControllerStyle.offsetX, + offsetX = _f === void 0 ? 0 : _f, + _g = speedControllerStyle.offsetY, + offsetY = _g === void 0 ? 0 : _g; + var speedGroup = this.controllerGroup.addGroup({ + name: 'speed-group' + }); + this.speedGroup = speedGroup; + var maxSpeed = 5; + this.speedAxisY = [19, 22, 26, 32, 39]; // 增加speed刻度 + + for (var i = 0; i < 5; i++) { + var axisY = y + this.speedAxisY[i]; // 灰色刻度 + + var startX = width - (!hideTimeTypeController ? SPEED_CONTROLLER_OFFSET : TOGGLE_MODEL_OFFSET); + speedGroup.addShape('line', { + attrs: __assign$i({ + x1: startX, + x2: startX + 15, + y1: axisY, + y2: axisY + }, scroller), + speed: maxSpeed, + name: 'speed-rect' + }); + this.speedAxisY[i] = axisY; + maxSpeed = maxSpeed - 1; + } // 速度文本 + + + this.speedText = speedGroup.addShape('text', { + attrs: __assign$i({ + x: width - (!hideTimeTypeController ? SPEED_CONTROLLER_OFFSET : TOGGLE_MODEL_OFFSET) + 20, + y: this.speedAxisY[0] + 4, + text: "1.0X", + fontFamily: this.fontFamily || 'Arial, sans-serif' + }, text) + }); + this.speedPoint = speedGroup.addShape('path', { + attrs: __assign$i({ + path: this.getPointerPath(width - (!hideTimeTypeController ? SPEED_CONTROLLER_OFFSET : TOGGLE_MODEL_OFFSET), 0), + matrix: [1, 0, 0, 0, 1, 0, 0, this.speedAxisY[4], 1] + }, pointer) + }); // 根据配置在 speedControllerStyle 中的 scale offsetX offsetY 缩放和移动速度控制器 + + var currentBBox = this.speedGroup.getCanvasBBox(); + var centerX = (currentBBox.maxX + currentBBox.minX) / 2; + var centerY = (currentBBox.maxY + currentBBox.minY) / 2; + var matrix = this.speedGroup.getMatrix() || [1, 0, 0, 0, 1, 0, 0, 0, 1]; + matrix = transform$1(matrix, [['t', -centerX, -centerY], ['s', scale, scale], ['t', centerX + offsetX * scale, centerY + offsetY * scale]]); + this.speedGroup.setMatrix(matrix); + }; + + ControllerBtn.prototype.getPointerPath = function (x, y) { + return [['M', x, y], ['L', x - 10, y - 4], ['L', x - 10, y + 4], ['Z']]; + }; + + ControllerBtn.prototype.renderToggleTime = function () { + var _a; + + var width = this.controllerCfg.width; + + var timeTypeControllerStyle = __assign$i(__assign$i({}, DEFAULT_TIMETYPE_CONTROLLER_STYLE), this.controllerCfg.timeTypeControllerStyle || {}); + + var _b = timeTypeControllerStyle.scale, + scale = _b === void 0 ? 1 : _b, + _c = timeTypeControllerStyle.offsetX, + offsetX = _c === void 0 ? 0 : _c, + _d = timeTypeControllerStyle.offsetY, + offsetY = _d === void 0 ? 0 : _d, + _e = timeTypeControllerStyle.box, + box = _e === void 0 ? {} : _e, + _f = timeTypeControllerStyle.check, + check = _f === void 0 ? {} : _f, + _g = timeTypeControllerStyle.text, + text = _g === void 0 ? {} : _g; + this.toggleGroup = this.controllerGroup.addGroup({ + name: 'toggle-group' + }); + this.toggleGroup.addShape('rect', { + attrs: __assign$i({ + x: width - TOGGLE_MODEL_OFFSET, + y: this.speedAxisY[0] + 3.5 + }, box), + isChecked: false, + name: 'toggle-model' + }); + this.checkedIcon = this.toggleGroup.addShape('path', { + attrs: __assign$i({ + path: [['M', width - TOGGLE_MODEL_OFFSET + 3, this.speedAxisY[1] + 6], ['L', width - TOGGLE_MODEL_OFFSET + 7, this.speedAxisY[1] + 10], ['L', width - TOGGLE_MODEL_OFFSET + 12, this.speedAxisY[1] + 4]] + }, check), + capture: false + }); + this.checkedIcon.hide(); + this.checkedText = this.toggleGroup.addShape('text', { + attrs: __assign$i({ + text: ((_a = this.controllerCfg) === null || _a === void 0 ? void 0 : _a.timePointControllerText) || '单一时间', + x: width - TOGGLE_MODEL_OFFSET + 15, + y: this.speedAxisY[0] + 4, + fontFamily: typeof window !== 'undefined' ? window.getComputedStyle(document.body, null).getPropertyValue('font-family') || 'Arial, sans-serif' : 'Arial, sans-serif' + }, text) + }); // 根据配置在 timeTypeControllerStyle 中的 scale offsetX offsetY 缩放和移动速度控制器 + + var currentBBox = this.toggleGroup.getCanvasBBox(); + var centerX = (currentBBox.maxX + currentBBox.minX) / 2; + var centerY = (currentBBox.maxY + currentBBox.minY) / 2; + var matrix = this.toggleGroup.getMatrix() || [1, 0, 0, 0, 1, 0, 0, 0, 1]; + matrix = transform$1(matrix, [['t', -centerX, -centerY], ['s', scale, scale], ['t', centerX + offsetX * scale, centerY + offsetY * scale]]); + this.toggleGroup.setMatrix(matrix); + }; + + ControllerBtn.prototype.bindEvent = function () { + var _this = this; + + this.speedGroup.on('speed-rect:click', function (evt) { + var currentPointerY = evt.target.attr('y1'); + + var pointerMatrix = _this.speedPoint.attr('matrix'); + + var currentYIdx = _this.speedAxisY.indexOf(pointerMatrix[7] || 0); + + var targetYIdx = _this.speedAxisY.indexOf(currentPointerY); + + var yDiff = _this.speedAxisY[targetYIdx] - _this.speedAxisY[currentYIdx]; + pointerMatrix = transform$1(pointerMatrix, [['t', 0, yDiff]]); + + _this.speedPoint.setMatrix(pointerMatrix); + + _this.currentSpeed = _this.speedAxisY.length - targetYIdx; + + _this.speedText.attr('text', _this.currentSpeed + ".0X"); + + _this.group.emit(TIMEBAR_CONFIG_CHANGE, { + speed: _this.currentSpeed, + type: _this.currentType + }); + }); + this.speedGroup.on('mousewheel', function (evt) { + evt.preventDefault(); + var pointerMatrix = _this.speedPoint.attr('matrix') || [1, 0, 0, 0, 1, 0, 0, 0, 1]; + var currentPointerY = pointerMatrix[7]; + + var currentYIdx = _this.speedAxisY.indexOf(currentPointerY); + + if (currentYIdx === -1) { + // 找到最近的一个 y + var minDist_1 = Infinity; + + _this.speedAxisY.forEach(function (y, idx) { + var dist = Math.abs(y - currentPointerY); + + if (minDist_1 > dist) { + minDist_1 = dist; + currentYIdx = idx; + } + }); + } + + if (evt.originalEvent.deltaY > 0) currentYIdx = Math.max(0, currentYIdx - 1);else currentYIdx = Math.min(_this.speedAxisY.length - 1, currentYIdx + 1); + var yDiff = _this.speedAxisY[currentYIdx] - currentPointerY; + pointerMatrix = transform$1(pointerMatrix, [['t', 0, yDiff]]); + + _this.speedPoint.setMatrix(pointerMatrix); + + _this.currentSpeed = _this.speedAxisY.length - currentYIdx; + + _this.speedText.attr('text', _this.currentSpeed + ".0X"); + + _this.group.emit(TIMEBAR_CONFIG_CHANGE, { + speed: _this.currentSpeed, + type: _this.currentType + }); + }); + + if (this.toggleGroup) { + this.toggleGroup.on('toggle-model:click', function (evt) { + var _a, _b; + + var isChecked = evt.target.get('isChecked'); + + if (!isChecked) { + _this.checkedIcon.show(); + + _this.checkedText.attr('text', ((_a = _this.controllerCfg) === null || _a === void 0 ? void 0 : _a.timeRangeControllerText) || '时间范围'); + + _this.currentType = 'single'; + } else { + _this.checkedIcon.hide(); + + _this.checkedText.attr('text', ((_b = _this.controllerCfg) === null || _b === void 0 ? void 0 : _b.timePointControllerText) || '单一时间'); + + _this.currentType = 'range'; + } + + evt.target.set('isChecked', !isChecked); + + _this.group.emit(TIMEBAR_CONFIG_CHANGE, { + type: _this.currentType, + speed: _this.currentSpeed + }); + }); + } + }; + + ControllerBtn.prototype.destroy = function () { + this.speedGroup.off('speed-rect:click'); + + if (this.toggleGroup) { + this.toggleGroup.off('toggle-model:click'); + this.toggleGroup.destroy(); + } + + this.speedGroup.destroy(); + }; + + return ControllerBtn; +}(); + +var ControllerBtn$1 = ControllerBtn; + +var __assign$h = undefined && undefined.__assign || function () { + __assign$h = Object.assign || function (t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + + for (var p in s) { + if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; + } + } + + return t; + }; + + return __assign$h.apply(this, arguments); +}; +/** + * 一些默认的样式配置 + */ + +var BACKGROUND_STYLE = { + fill: '#416180', + opacity: 0.05 +}; +var SIMPLE_BACKGROUND_STYLE = { + fill: '#416180', + opacity: 0.15, + radius: 5 +}; +var FOREGROUND_STYLE = { + fill: '#5B8FF9', + opacity: 0.3, + cursor: 'grab' +}; +var DEFAULT_HANDLER_WIDTH = 2; +var HANDLER_STYLE = { + width: DEFAULT_HANDLER_WIDTH, + height: 24 +}; +var TEXT_STYLE = { + textBaseline: 'middle', + fill: '#000', + opacity: 0.45 +}; +var TICK_LABEL_STYLE = { + textAlign: 'center', + textBaseline: 'top', + fill: '#607889', + opacity: 0.35 +}; +var TICK_LINE_STYLE = { + lineWidth: 1, + stroke: '#ccc' +}; + +var TrendTimeBar = +/** @class */ +function () { + function TrendTimeBar(cfg) { + var _this = this; + + this.prevX = 0; + + this.onMouseDown = function (handler) { + return function (e) { + // 1. 记录点击的滑块 + _this.currentHandler = handler; + var event = e.originalEvent; // 2. 存储当前点击位置 + + event.stopPropagation(); + event.preventDefault(); // 兼容移动端获取数据 + + _this.prevX = get$3(event, 'touches.0.pageX', event.pageX); // 3. 开始滑动的时候，绑定 move 和 up 事件 + + var containerDOM = _this.canvas.get('container'); + + containerDOM.addEventListener('mousemove', _this.onMouseMove); + containerDOM.addEventListener('mouseup', _this.onMouseUp); + containerDOM.addEventListener('mouseleave', _this.onMouseUp); // 移动端事件 + + containerDOM.addEventListener('touchmove', _this.onMouseMove); + containerDOM.addEventListener('touchend', _this.onMouseUp); + containerDOM.addEventListener('touchcancel', _this.onMouseUp); + }; + }; + + this.onMouseMove = function (e) { + // 滑动过程中，计算偏移，更新滑块，然后 emit 数据出去 + e.stopPropagation(); + e.preventDefault(); + var x = get$3(e, 'touches.0.pageX', e.pageX); // 横向的 slider 只处理 x + + var offsetX = x - _this.prevX; + + var offsetXRange = _this.adjustOffsetRange(offsetX / _this.width); // 更新 start end range 范围 + + + _this.updateStartEnd(offsetXRange); // 更新 ui + + + _this.updateUI(); + + _this.prevX = x; + }; + + this.onMouseUp = function () { + // 结束之后，取消绑定的事件 + if (_this.currentHandler) { + _this.currentHandler = undefined; + } + + var containerDOM = _this.canvas.get('container'); + + if (containerDOM) { + containerDOM.removeEventListener('mousemove', _this.onMouseMove); + containerDOM.removeEventListener('mouseup', _this.onMouseUp); // 防止滑动到 canvas 外部之后，状态丢失 + + containerDOM.removeEventListener('mouseleave', _this.onMouseUp); // 移动端事件 + + containerDOM.removeEventListener('touchmove', _this.onMouseMove); + containerDOM.removeEventListener('touchend', _this.onMouseUp); + containerDOM.removeEventListener('touchcancel', _this.onMouseUp); + } + }; + + var _a = cfg.x, + x = _a === void 0 ? 0 : _a, + _b = cfg.y, + y = _b === void 0 ? 0 : _b, + _c = cfg.width, + width = _c === void 0 ? 100 : _c, + height = cfg.height, + _d = cfg.padding, + padding = _d === void 0 ? 10 : _d, + trendCfg = cfg.trendCfg, + _e = cfg.controllerCfg, + controllerCfg = _e === void 0 ? { + speed: 1 + } : _e, + _f = cfg.backgroundStyle, + backgroundStyle = _f === void 0 ? {} : _f, + _g = cfg.foregroundStyle, + foregroundStyle = _g === void 0 ? {} : _g, + _h = cfg.handlerStyle, + handlerStyle = _h === void 0 ? {} : _h, + _j = cfg.textStyle, + textStyle = _j === void 0 ? {} : _j, + // 缩略轴的初始位置 + _k = cfg.start, + // 缩略轴的初始位置 + start = _k === void 0 ? 0 : _k, + _l = cfg.end, + end = _l === void 0 ? 1 : _l, + _m = cfg.minText, + minText = _m === void 0 ? '' : _m, + _o = cfg.maxText, + maxText = _o === void 0 ? '' : _o, + group = cfg.group, + graph = cfg.graph, + canvas = cfg.canvas, + _p = cfg.tick, + tick = _p === void 0 ? { + tickLabelStyle: {}, + tickLineStyle: {}, + tickLabelFormatter: function tickLabelFormatter(d) { + return d; + }, + ticks: [] + } : _p, + type = cfg.type; + this.graph = graph; + this.canvas = canvas; + this.group = group; + this.timeBarType = type; // position size + + this.x = x; + this.y = y; + this.width = width; + this.height = height; + this.padding = padding; + this.ticks = tick.ticks; + this.trendCfg = trendCfg; + this.controllerCfg = controllerCfg; + this.currentSpeed = controllerCfg.speed || 1; + this.tickLabelFormatter = tick.tickLabelFormatter; // style + + if (type === 'trend') { + this.backgroundStyle = __assign$h(__assign$h({}, BACKGROUND_STYLE), backgroundStyle); + } else if (type === 'simple') { + this.backgroundStyle = __assign$h(__assign$h({}, SIMPLE_BACKGROUND_STYLE), backgroundStyle); + } + + this.foregroundStyle = __assign$h(__assign$h({}, FOREGROUND_STYLE), foregroundStyle); + this.handlerStyle = __assign$h(__assign$h({}, HANDLER_STYLE), handlerStyle); + this.textStyle = __assign$h(__assign$h({}, TEXT_STYLE), textStyle); + this.tickLabelStyle = __assign$h(__assign$h({}, TICK_LABEL_STYLE), tick.tickLabelStyle); + this.tickLineStyle = __assign$h(__assign$h({}, TICK_LINE_STYLE), tick.tickLineStyle); + this.currentMode = 'range'; // 初始信息 + + this.start = start; + this.end = end; + this.minText = minText; + this.maxText = maxText; // 初始化 fontFamily，如果有浏览器，取 body 上的字体，防止文字更新时局部渲染造成的重影 + + this.fontFamily = typeof window !== 'undefined' ? window.getComputedStyle(document.body, null).getPropertyValue('font-family') || 'Arial, sans-serif' : 'Arial, sans-serif'; + this.renderSlider(); + } + /** + * 更新配置 + * @param cfg + */ + + + TrendTimeBar.prototype.update = function (cfg) { + var x = cfg.x, + y = cfg.y, + width = cfg.width, + height = cfg.height, + minText = cfg.minText, + maxText = cfg.maxText, + start = cfg.start, + end = cfg.end; // start、end 只能是 0~1 范围 + + this.start = Math.min(1, Math.max(start, 0)); + this.end = Math.min(1, Math.max(end, 0)); // 如果传了则更新，没有传则不更新 + // @ts-ignore + + mix(this, { + x: x, + y: y, + width: width, + height: height, + minText: minText, + maxText: maxText + }); // 更新 ui，不自动绘制 + + this.updateUI(); + }; + + TrendTimeBar.prototype.setText = function (minText, maxText) { + this.minTextShape.attr('text', minText); + this.maxTextShape.attr('text', maxText); + }; + /** + * 初始化组件结构 + * @private + */ + + + TrendTimeBar.prototype.renderSlider = function () { + var _this = this; + + var _a = this, + width = _a.width, + height = _a.height, + timeBarType = _a.timeBarType; // 趋势图数据 + + + if (timeBarType === 'trend' && size$1(get$3(this.trendCfg, 'data'))) { + var trendComponent = new Trend$1(__assign$h(__assign$h({ + x: this.x, + y: this.y, + width: width, + height: height + }, this.trendCfg), { + group: this.group + })); + this.trendComponent = trendComponent; + } + + var sliderGroup = this.group.addGroup({ + name: 'slider-group' + }); // 1. 背景 + + sliderGroup.addShape('rect', { + attrs: __assign$h({ + x: 0, + y: 0, + width: width, + height: height + }, this.backgroundStyle) + }); + var textGroup = this.group.addGroup(); // 2. 左右文字 + + if (timeBarType === 'trend') { + this.minTextShape = textGroup.addShape('text', { + attrs: __assign$h({ + x: 0, + y: height / 2 + this.y, + textAlign: 'right', + text: this.minText, + silent: false, + fontFamily: this.fontFamily || 'Arial, sans-serif' + }, this.textStyle), + capture: false + }); + this.maxTextShape = textGroup.addShape('text', { + attrs: __assign$h({ + y: height / 2 + this.y, + textAlign: 'left', + text: this.maxText, + silent: false, + fontFamily: this.fontFamily || 'Arial, sans-serif' + }, this.textStyle), + capture: false + }); + } else { + this.minTextShape = textGroup.addShape('text', { + attrs: __assign$h({ + x: 0, + y: this.y - 10, + textAlign: 'center', + text: this.minText, + silent: false, + fontFamily: this.fontFamily || 'Arial, sans-serif' + }, this.textStyle), + capture: false + }); + this.maxTextShape = textGroup.addShape('text', { + attrs: __assign$h({ + y: this.y - 10, + textAlign: 'center', + text: this.maxText, + silent: false, + fontFamily: this.fontFamily || 'Arial, sans-serif' + }, this.textStyle), + capture: false + }); + } // 3. 前景 选中背景框 + + + this.foregroundShape = this.group.addGroup().addShape('rect', { + attrs: __assign$h({ + x: 0, + y: this.y, + height: height + }, this.foregroundStyle) + }); + this.foregroundShape.on('mousedown', function (e) { + e.target.attr('cursor', 'grabbing'); + }); + this.foregroundShape.on('mouseup', function (e) { + e.target.attr('cursor', _this.foregroundStyle.cursor || 'grab'); + }); // 滑块相关的大小信息 + + var handlerWidth = get$3(this.handlerStyle, 'width', 2); + var handlerHeight = get$3(this.handlerStyle, 'height', 24); + var minHandleGroup = this.group.addGroup({ + name: 'minHandlerShape' + }); // 4. 左右滑块 + + this.minHandlerShape = new Handler$1({ + name: 'minHandlerShape', + group: minHandleGroup, + type: timeBarType, + x: this.x, + y: this.y, + width: handlerWidth, + height: handlerHeight, + style: this.handlerStyle + }); + var maxHandleGroup = this.group.addGroup({ + name: 'maxHandlerShape' + }); + this.maxHandlerShape = new Handler$1({ + name: 'maxHandlerShape', + group: maxHandleGroup, + type: timeBarType, + x: this.x, + y: this.y, + width: handlerWidth, + height: handlerHeight, + style: this.handlerStyle + }); // 缩略图下面的时间刻度 + + var tickData = this.ticks; + var interval = width / (tickData.length - 1); + this.tickPosList = []; + + if (this.textList && this.textList.length) { + this.textList.forEach(function (text) { + text.destroy(); + }); + } + + var lastX = -Infinity; + this.textList = tickData.map(function (data, index) { + _this.tickPosList.push(_this.x + index * interval); + + var label; + + if (_this.tickLabelFormatter) { + label = _this.tickLabelFormatter(data); + + if (!isString$3(label) && label) { + // return true + label = data.date; + } + } else { + label = data.date; + } // 文本刻度 + + + var text = _this.group.addShape('text', { + attrs: __assign$h({ + x: _this.x + index * interval, + y: _this.y + height + 5, + text: label, + fontFamily: _this.fontFamily || 'Arial, sans-serif' + }, _this.tickLabelStyle) + }); // 文本刻度上面的竖线 + + + var line = _this.group.addShape('line', { + attrs: __assign$h({ + x1: _this.x + index * interval, + y1: _this.y + height + 2, + x2: _this.x + index * interval, + y2: _this.y + height + 6 + }, _this.tickLineStyle) + }); + + line.toBack(); + var bbox = text.getBBox(); // 抽样，标签与标签间距不小于 10 + + if (bbox.minX > lastX) { + text.show(); + line.show(); + lastX = bbox.minX + bbox.width + 10; + } else { + text.hide(); + line.hide(); + } + + return text; + }); // 渲染播放、快进和后退的控制按钮 + + this.controllerBtnGroup = new ControllerBtn$1(__assign$h({ + group: this.group, + x: this.x, + y: this.y + height + 25, + width: width, + height: 35 + }, this.controllerCfg)); // 初始化 minText 和 maxText，方便计算它们的 bbox + + this.updateStartEnd(0); // 根据 start end 更新 ui 的位置信息 + + this.updateUI(); // 移动到对应的位置 + + sliderGroup.move(this.x, this.y); // 绑定事件鼠标事件 + + this.bindEvents(); + }; + /** + * 绑定事件： + * - 点击 + * - 滑动 + * - 拖拽 + * - 滚动 + * @private + */ + + + TrendTimeBar.prototype.bindEvents = function () { + var _this = this; // 1. 左滑块的滑动 + + + var minHandleShapeGroup = this.group.find(function (group) { + return group.get('name') === 'minHandlerShape'; + }); + + if (minHandleShapeGroup) { + minHandleShapeGroup.on('minHandlerShape-handler:mousedown', this.onMouseDown(this.minHandlerShape)); + minHandleShapeGroup.on('minHandlerShape-handler:touchstart', this.onMouseDown(this.minHandlerShape)); + } + + var maxHandleShapeGroup = this.group.find(function (group) { + return group.get('name') === 'maxHandlerShape'; + }); // 2. 右滑块的滑动 + + if (maxHandleShapeGroup) { + maxHandleShapeGroup.on('maxHandlerShape-handler:mousedown', this.onMouseDown(this.maxHandlerShape)); + maxHandleShapeGroup.on('maxHandlerShape-handler:touchstart', this.onMouseDown(this.maxHandlerShape)); + } // 3. 前景选中区域 + + + this.foregroundShape.on('mousedown', this.onMouseDown(this.foregroundShape)); + this.foregroundShape.on('touchstart', this.onMouseDown(this.foregroundShape)); // 播放区按钮控制 + + /** 播放/暂停事件 */ + + this.group.on(PLAY_PAUSE_BTN + ":click", function () { + _this.isPlay = !_this.isPlay; + _this.currentHandler = _this.maxHandlerShape; + + _this.changePlayStatus(); + }); // 处理前进一步的事件 + + this.group.on(NEXT_STEP_BTN + ":click", function () { + _this.currentHandler = _this.maxHandlerShape; + + _this.updateStartEnd(0.01); + + _this.updateUI(); + }); // 处理后退一步的事件 + + this.group.on(PRE_STEP_BTN + ":click", function () { + _this.currentHandler = _this.maxHandlerShape; + + _this.updateStartEnd(-0.01); + + _this.updateUI(); + }); + this.group.on(TIMEBAR_CONFIG_CHANGE, function (_a) { + var type = _a.type, + speed = _a.speed; + _this.currentSpeed = speed; + _this.currentMode = type; + + if (type === 'single') { + _this.minHandlerShape.hide(); + + _this.foregroundShape.hide(); + + _this.minTextShape.hide(); + } else if (type === 'range') { + _this.minHandlerShape.show(); + + _this.foregroundShape.show(); + + _this.minTextShape.show(); + } + }); + }; + /** 输入当前圆点位置，输出离哪个 tick 的位置最近 */ + + + TrendTimeBar.prototype.adjustTickIndex = function (timeSelectX) { + for (var i = 0; i < this.tickPosList.length - 1; i++) { + if (this.tickPosList[i] <= timeSelectX && timeSelectX <= this.tickPosList[i + 1]) { + return Math.abs(this.tickPosList[i] - timeSelectX) < Math.abs(timeSelectX - this.tickPosList[i + 1]) ? i : i + 1; + } + } + + return 0; + }; + /** + * 调整 offsetRange，因为一些范围的限制 + * @param offsetRange + */ + + + TrendTimeBar.prototype.adjustOffsetRange = function (offsetRange) { + // 针对不同的滑动组件，处理的方式不同 + switch (this.currentHandler) { + case this.minHandlerShape: + { + var min = 0 - this.start; + var max = 1 - this.start; + return Math.min(max, Math.max(min, offsetRange)); + } + + case this.maxHandlerShape: + { + var min = 0 - this.end; + var max = 1 - this.end; + return Math.min(max, Math.max(min, offsetRange)); + } + + case this.foregroundShape: + { + var min = 0 - this.start; + var max = 1 - this.end; + return Math.min(max, Math.max(min, offsetRange)); + } + + default: + return 0; + } + }; + /** + * 更新起始、结束的控制块位置、文本、范围值（原始值） + * @param offsetRange + */ + + + TrendTimeBar.prototype.updateStartEnd = function (offsetRange) { + var minData = this.ticks[this.adjustTickIndex(this.start * this.width)]; + var maxData = this.ticks[this.adjustTickIndex(this.end * this.width)]; + + if (!this.currentHandler) { + this.minText = this.tickLabelFormatter ? this.tickLabelFormatter(minData) : minData.date; + this.maxText = this.tickLabelFormatter ? this.tickLabelFormatter(maxData) : maxData.date; + return; + } // 操作不同的组件，反馈不一样 + + + switch (this.currentHandler) { + case this.minHandlerShape: + // 拖动最小滑块时使用当前最大值设置最大值的文本，以便恢复到默认值 + this.maxText = this.maxTextShape.attr('text'); + this.start += offsetRange; + this.minText = this.tickLabelFormatter ? this.tickLabelFormatter(minData) : minData.date; + break; + + case this.maxHandlerShape: + // 拖动最大滑块时使用当前最小值设置最小值的文本，以便恢复到默认值 + this.minText = this.minTextShape.attr('text'); + this.end += offsetRange; + this.maxText = this.tickLabelFormatter ? this.tickLabelFormatter(maxData) : maxData.date; + break; + + case this.foregroundShape: + this.start += offsetRange; + this.end += offsetRange; + this.minText = this.tickLabelFormatter ? this.tickLabelFormatter(minData) : minData.date; + this.maxText = this.tickLabelFormatter ? this.tickLabelFormatter(maxData) : maxData.date; + break; + } + }; + /** + * 根据移动的比例来更新 ui，更新范围（0-1 范围的比例值） + * @private + */ + + + TrendTimeBar.prototype.updateUI = function () { + var _this = this; + + if (this.start < 0) { + this.start = 0; + } + + if (this.end > 1) { + this.end = 1; + } + + var min = this.x + this.start * this.width; + var max = this.x + this.end * this.width; // 1. foreground + + this.foregroundShape.attr('x', min); + this.foregroundShape.attr('width', max - min); // 滑块相关的大小信息 + + var handlerWidth = get$3(this.handlerStyle, 'width', DEFAULT_HANDLER_WIDTH); // 设置文本 + + this.setText(this.minText, this.maxText); + + var _a = this.dodgeText([min, max]), + minAttrs = _a[0], + maxAttrs = _a[1]; // 2. 左侧滑块和文字位置 + + + this.minHandlerShape.setX(min - handlerWidth / 2); + each$2(minAttrs, function (v, k) { + return _this.minTextShape.attr(k, v); + }); // 3. 右侧滑块和文字位置 + + this.maxHandlerShape.setX(max - handlerWidth / 2); + each$2(maxAttrs, function (v, k) { + return _this.maxTextShape.attr(k, v); + }); + + if (this.currentMode === 'range') { + // 因为存储的 start、end 可能不一定是按大小存储的，所以排序一下，对外是 end >= start + this.graph.emit(VALUE_CHANGE, { + value: [this.start, this.end].sort() + }); + } else if (this.currentMode === 'single') { + this.graph.emit(VALUE_CHANGE, { + value: [this.end, this.end] + }); + } + }; + /** + * 调整 text 的位置，自动躲避 + * 根据位置，调整返回新的位置 + * @param range + */ + + + TrendTimeBar.prototype.dodgeText = function (range) { + var _a, _b; + + var TEXTPADDING = 2; + var handlerWidth = get$3(this.handlerStyle, 'width', DEFAULT_HANDLER_WIDTH); + var minTextShape = this.minTextShape; + var maxTextShape = this.maxTextShape; + var min = range[0], + max = range[1]; + var sorted = false; // 如果交换了位置，则对应的 min max 也交换 + + if (min > max) { + _a = [max, min], min = _a[0], max = _a[1]; + _b = [maxTextShape, minTextShape], minTextShape = _b[0], maxTextShape = _b[1]; + sorted = true; + } // 避让规则，优先显示在两侧，只有显示不下的时候，才显示在中间 + + + var minBBox = minTextShape.getBBox(); + var maxBBox = maxTextShape.getBBox(); + var minAttrs = null; + var maxAttrs = null; + + if (this.timeBarType === 'trend') { + minAttrs = min - minBBox.width < this.x + TEXTPADDING ? { + x: min + handlerWidth / 2 + TEXTPADDING, + textAlign: 'left' + } : { + x: min - handlerWidth / 2 - TEXTPADDING, + textAlign: 'right' + }; + maxAttrs = max + maxBBox.width > this.x + this.width ? { + x: max - handlerWidth / 2 - TEXTPADDING, + textAlign: 'right' + } : { + x: max + handlerWidth / 2 + TEXTPADDING, + textAlign: 'left' + }; + } else if (this.timeBarType === 'simple') { + minAttrs = minBBox.width > min - TEXTPADDING ? { + x: min + handlerWidth / 2 + TEXTPADDING, + textAlign: 'center' + } : { + x: min - handlerWidth / 2 - TEXTPADDING, + textAlign: 'center' + }; + maxAttrs = maxBBox.width > this.width - max - TEXTPADDING ? { + x: max - handlerWidth / 2 - TEXTPADDING, + textAlign: 'center' + } : { + x: max + handlerWidth / 2 + TEXTPADDING, + textAlign: 'center' + }; + } + + return !sorted ? [minAttrs, maxAttrs] : [maxAttrs, minAttrs]; + }; + + TrendTimeBar.prototype.startPlay = function () { + var _this = this; + + return typeof window !== 'undefined' ? window.requestAnimationFrame(function () { + var _a = _this, + ticks = _a.ticks, + width = _a.width; + var speed = _this.currentSpeed; + var tickInterval = width / ticks.length; + var offsetX = tickInterval / ((10 - speed) * 1000 / 60); + + var offsetXRange = _this.adjustOffsetRange(offsetX / _this.width); + + _this.updateStartEnd(offsetXRange); + + _this.updateUI(); + + if (_this.isPlay) { + _this.playHandler = _this.startPlay(); + } + }) : undefined; + }; + + TrendTimeBar.prototype.changePlayStatus = function (isSync) { + if (isSync === void 0) { + isSync = true; + } + + this.controllerBtnGroup.playButton.update({ + isPlay: this.isPlay + }); + + if (this.isPlay) { + // 开始播放 + this.playHandler = this.startPlay(); + this.graph.emit(TIMELINE_START, null); + } else { + // 结束播放 + if (this.playHandler) { + if (typeof window !== 'undefined') window.cancelAnimationFrame(this.playHandler); + + if (isSync) { + this.graph.emit(TIMELINE_END, null); + } + } + } + }; + + TrendTimeBar.prototype.destory = function () { + this.graph.off(VALUE_CHANGE); + var group = this.group; + var minHandleShapeGroup = group.find(function (g) { + return g.get('name') === 'minHandlerShape'; + }); + + if (minHandleShapeGroup) { + minHandleShapeGroup.off('minHandlerShape-handler:mousedown'); + minHandleShapeGroup.off('minHandlerShape-handler:touchstart'); + minHandleShapeGroup.destroy(); + } + + var maxHandleShapeGroup = group.find(function (g) { + return g.get('name') === 'maxHandlerShape'; + }); // 2. 右滑块的滑动 + + if (maxHandleShapeGroup) { + maxHandleShapeGroup.off('maxHandlerShape-handler:mousedown'); + maxHandleShapeGroup.off('maxHandlerShape-handler:touchstart'); + maxHandleShapeGroup.destroy(); + } // 3. 前景选中区域 + + + this.foregroundShape.off('mousedown'); + this.foregroundShape.off('touchstart'); + this.foregroundShape.destroy(); + group.off(PLAY_PAUSE_BTN + ":click"); + group.off(NEXT_STEP_BTN + ":click"); + group.off(PRE_STEP_BTN + ":click"); + group.off(TIMEBAR_CONFIG_CHANGE); + group.destroy(); + + if (this.trendComponent) { + this.trendComponent.destory(); + } + }; + + return TrendTimeBar; +}(); + +var TrendTimeBar$1 = TrendTimeBar; + +/** + * 缩略趋势图 + */ + +var TimeBarTooltip = +/** @class */ +function () { + function TimeBarTooltip(cfg) { + var _a = cfg.x, + x = _a === void 0 ? 0 : _a, + _b = cfg.y, + y = _b === void 0 ? 0 : _b, + container = cfg.container, + text = cfg.text, + _c = cfg.padding, + padding = _c === void 0 ? [4, 4, 4, 4] : _c, + _d = cfg.className, + className = _d === void 0 ? 'g6-component-timebar-tooltip' : _d, + _e = cfg.backgroundColor, + backgroundColor = _e === void 0 ? '#000' : _e, + _f = cfg.textColor, + textColor = _f === void 0 ? '#fff' : _f, + _g = cfg.opacity, + opacity = _g === void 0 ? 0.8 : _g, + _h = cfg.fontSize, + fontSize = _h === void 0 ? 12 : _h; + this.container = container; + this.className = className; + this.backgroundColor = backgroundColor; + this.textColor = textColor; + this.x = x; + this.y = y; + this.text = text; + this.padding = padding; + this.opacity = opacity; + this.fontSize = fontSize; + this.render(); + } + /** + * 首次渲染 + * @private + */ + + + TimeBarTooltip.prototype.render = function () { + var self = this; + var className = self.className; + self.x; + self.y; + var backgroundColor = self.backgroundColor, + textColor = self.textColor, + text = self.text, + padding = self.padding, + opacity = self.opacity, + fontSize = self.fontSize; + var parentNode = self.container; + var container = createDom$1("
    "); + + if (isString$3(parentNode)) { + parentNode = document.getElementById(parentNode); + } + + parentNode.appendChild(container); + self.parentHeight = parentNode.offsetHeight; + self.parentWidth = parentNode.offsetWidth; + modifyCSS(container, { + visibility: 'hidden', + top: 0, + left: 0 + }); + var background = createDom$1("\n
    "); + background.innerHTML = text; + container.appendChild(background); + self.backgroundDOM = background; + var arrow = createDom$1("
    "); + container.appendChild(arrow); + self.arrowDOM = arrow; + self.container = container; + }; + + TimeBarTooltip.prototype.show = function (cfg) { + var self = this; + var text = cfg.text, + x = cfg.x; + cfg.y; + cfg.clientX; + cfg.clientY; + self.backgroundDOM.innerHTML = text; + var backgroundWidth = self.backgroundDOM.offsetWidth; + var backgroundHeight = self.backgroundDOM.offsetHeight; + var arrowWidth = self.arrowDOM.offsetWidth; + var arrowHeight = self.arrowDOM.offsetHeight; + modifyCSS(self.container, { + top: -backgroundHeight - arrowHeight + "px", + left: x + "px", + visibility: 'visible' + }); + modifyCSS(self.backgroundDOM, { + marginLeft: -backgroundWidth / 2 + "px" + }); + modifyCSS(self.arrowDOM, { + marginLeft: -arrowWidth / 2 + "px", + top: backgroundHeight + "px" + }); + var left = x - backgroundWidth / 2; + var right = x + backgroundWidth / 2; + + if (left < 0) { + modifyCSS(self.backgroundDOM, { + marginLeft: -backgroundWidth / 2 - left + "px" + }); + } else if (right > self.parentWidth) { + modifyCSS(self.backgroundDOM, { + marginLeft: -backgroundWidth / 2 - right + self.parentWidth + 12 + "px" + }); + } + }; + + TimeBarTooltip.prototype.hide = function () { + modifyCSS(this.container, { + top: 0, + left: 0, + visibility: 'hidden' + }); + }; + + return TimeBarTooltip; +}(); + +var TimeBarTooltip$1 = TimeBarTooltip; + +var __assign$g = undefined && undefined.__assign || function () { + __assign$g = Object.assign || function (t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + + for (var p in s) { + if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; + } + } + + return t; + }; + + return __assign$g.apply(this, arguments); +}; +var DEFAULT_SELECTEDTICK_STYLE = { + fill: '#5B8FF9' +}; +var DEFAULT_UNSELECTEDTICK_STYLE = { + fill: '#e6e8e9' +}; + +var TimeBarSlice = +/** @class */ +function () { + function TimeBarSlice(cfgs) { + this.frameCount = 0; + this.fontFamily = 'Arial, sans-serif'; + var graph = cfgs.graph, + canvas = cfgs.canvas, + group = cfgs.group, + width = cfgs.width, + height = cfgs.height, + padding = cfgs.padding, + data = cfgs.data, + start = cfgs.start, + end = cfgs.end, + _a = cfgs.x, + x = _a === void 0 ? 0 : _a, + _b = cfgs.y, + y = _b === void 0 ? 0 : _b, + tickLabelFormatter = cfgs.tickLabelFormatter, + _c = cfgs.selectedTickStyle, + selectedTickStyle = _c === void 0 ? DEFAULT_SELECTEDTICK_STYLE : _c, + _d = cfgs.unselectedTickStyle, + unselectedTickStyle = _d === void 0 ? DEFAULT_UNSELECTEDTICK_STYLE : _d, + tooltipBackgroundColor = cfgs.tooltipBackgroundColor, + tooltipFomatter = cfgs.tooltipFomatter; + this.graph = graph; + this.group = group; + this.sliceGroup = group.addGroup({ + name: 'slice-group' + }); + this.canvas = canvas; + this.width = width; + this.height = height; + this.padding = padding; + this.data = data; + this.start = start; + this.end = end; + this.tickLabelFormatter = tickLabelFormatter; + this.selectedTickStyle = selectedTickStyle; + this.unselectedTickStyle = unselectedTickStyle; + this.x = x; + this.y = y; + this.tooltipBackgroundColor = tooltipBackgroundColor; + this.tooltipFomatter = tooltipFomatter; // 初始化 fontFamily，如果有浏览器，取 body 上的字体，防止文字更新时局部渲染造成的重影 + + this.fontFamily = typeof window !== 'undefined' ? window.getComputedStyle(document.body, null).getPropertyValue('font-family') || 'Arial, sans-serif' : 'Arial, sans-serif'; + this.renderSlices(); + this.initEvent(); + } + + TimeBarSlice.prototype.renderSlices = function () { + var _this = this; + + var _a = this, + width = _a.width, + height = _a.height, + padding = _a.padding, + data = _a.data, + start = _a.start, + end = _a.end, + tickLabelFormatter = _a.tickLabelFormatter, + selectedTickStyle = _a.selectedTickStyle, + unselectedTickStyle = _a.unselectedTickStyle; + + var realWidth = width - 2 * padding; + var fontSize = 10; + var labelLineHeight = 4; + var labelAreaHeight = 3 * padding + labelLineHeight + fontSize; + var ticksAreaHeight = height - labelAreaHeight - 2 * padding; + var gap = 2; + var ticksLength = data.length; + var tickWidth = (realWidth - gap * (ticksLength - 1)) / ticksLength; + this.tickWidth = tickWidth; + var sliceGroup = this.sliceGroup; + var tickRects = []; + var startTickId = Math.round(ticksLength * start); + var endTickId = Math.round(ticksLength * end); + this.startTickRectId = startTickId; + this.endTickRectId = endTickId; + data.forEach(function (d, i) { + // draw the tick rects + var selected = i >= startTickId && i <= endTickId; + var tickStyle = selected ? selectedTickStyle : unselectedTickStyle; + var rect = sliceGroup.addShape('rect', { + attrs: __assign$g({ + x: padding + i * (tickWidth + gap), + y: padding, + width: tickWidth, + height: ticksAreaHeight + }, tickStyle), + draggable: true, + name: "tick-rect-" + i + }); // draw the pick tick rects + + var pickRect = sliceGroup.addShape('rect', { + attrs: { + x: padding + i * tickWidth + gap * (2 * i - 1) / 2, + y: padding, + width: i === 0 || i === ticksLength - 1 ? tickWidth + gap / 2 : tickWidth + gap, + height: ticksAreaHeight, + fill: '#fff', + opacity: 0 + }, + draggable: true, + name: "pick-rect-" + i + }); + pickRect.toFront(); + var rectBBox = rect.getBBox(); + var centerX = (rectBBox.minX + rectBBox.maxX) / 2; + tickRects.push({ + rect: rect, + pickRect: pickRect, + value: d.date, + x: centerX, + y: rectBBox.minY + }); + var label; + + if (tickLabelFormatter) { + label = tickLabelFormatter(d); + + if (!isString$3(label) && label) { + // return true + label = d.date; + } + } else if (i % Math.round(ticksLength / 10) === 0) { + label = d.date; + } + + if (label) { + + var lineStartY = rectBBox.maxY + padding * 2; + sliceGroup.addShape('line', { + attrs: { + stroke: '#BFBFBF', + x1: centerX, + y1: lineStartY, + x2: centerX, + y2: lineStartY + labelLineHeight + } + }); + var labelStartY = lineStartY + labelLineHeight + padding; + var text = sliceGroup.addShape('text', { + attrs: { + fill: '#8c8c8c', + stroke: '#fff', + lineWidth: 1, + x: centerX, + y: labelStartY, + textAlign: 'center', + text: label, + textBaseline: 'top', + fontSize: 10, + fontFamily: _this.fontFamily || 'Arial, sans-serif' + }, + capture: false + }); + var textBBox = text.getBBox(); + + if (textBBox.maxX > width) { + text.attr('textAlign', 'right'); + } else if (textBBox.minX < 0) { + text.attr('textAlign', 'left'); + } // draw tick labels + + } + }); + this.tickRects = tickRects; // 渲染播放、快进和后退的控制按钮 + + var group = this.group; + this.currentSpeed = 1; + this.controllerBtnGroup = new ControllerBtn$1({ + group: group, + x: this.x, + y: this.y + height + 5, + width: width, + height: 40, + hideTimeTypeController: true, + speed: this.currentSpeed, + fontFamily: this.fontFamily || 'Arial, sans-serif' + }); + }; + + TimeBarSlice.prototype.initEvent = function () { + var _this = this; + + var sliceGroup = this.sliceGroup; + sliceGroup.on('click', function (e) { + var targetRect = e.target; + if (targetRect.get('type') !== 'rect' || !targetRect.get('name')) return; + var id = parseInt(targetRect.get('name').split('-')[2], 10); + + if (!isNaN(id)) { + var tickRects_1 = _this.tickRects; // cancel the selected ticks + + var unselectedTickStyle_1 = _this.unselectedTickStyle; + tickRects_1.forEach(function (tickRect) { + tickRect.rect.attr(unselectedTickStyle_1); + }); + var selectedTickStyle = _this.selectedTickStyle; + tickRects_1[id].rect.attr(selectedTickStyle); + _this.startTickRectId = id; + _this.endTickRectId = id; + var ticksLength = tickRects_1.length; + var start = id / ticksLength; + + _this.graph.emit(VALUE_CHANGE, { + value: [start, start] + }); + } + }); + sliceGroup.on('dragstart', function (e) { + var tickRects = _this.tickRects; // cancel the selected ticks + + var unselectedTickStyle = _this.unselectedTickStyle; + tickRects.forEach(function (tickRect) { + tickRect.rect.attr(unselectedTickStyle); + }); + var targetRect = e.target; + var id = parseInt(targetRect.get('name').split('-')[2], 10); + var selectedTickStyle = _this.selectedTickStyle; + tickRects[id].rect.attr(selectedTickStyle); + _this.startTickRectId = id; + var ticksLength = tickRects.length; + var start = id / ticksLength; + + _this.graph.emit(VALUE_CHANGE, { + value: [start, start] + }); + + _this.dragging = true; + }); + sliceGroup.on('dragover', function (e) { + if (!_this.dragging) return; + if (e.target.get('type') !== 'rect') return; + var id = parseInt(e.target.get('name').split('-')[2], 10); + var startTickRectId = _this.startTickRectId; + var tickRects = _this.tickRects; + var selectedTickStyle = _this.selectedTickStyle; + var unselectedTickStyle = _this.unselectedTickStyle; + + for (var i = 0; i < tickRects.length; i++) { + var style = i >= startTickRectId && i <= id ? selectedTickStyle : unselectedTickStyle; + tickRects[i].rect.attr(style); + } + + var ticksLength = tickRects.length; + _this.endTickRectId = id; + var start = startTickRectId / ticksLength; + var end = id / ticksLength; + + _this.graph.emit(VALUE_CHANGE, { + value: [start, end] + }); + }); + sliceGroup.on('drop', function (e) { + if (!_this.dragging) return; + _this.dragging = false; + if (e.target.get('type') !== 'rect') return; + var startTickRectId = _this.startTickRectId; + var id = parseInt(e.target.get('name').split('-')[2], 10); + if (id < startTickRectId) return; + var selectedTickStyle = _this.selectedTickStyle; + var tickRects = _this.tickRects; + tickRects[id].rect.attr(selectedTickStyle); + _this.endTickRectId = id; + var ticksLength = tickRects.length; + var start = startTickRectId / ticksLength; + var end = id / ticksLength; + + _this.graph.emit(VALUE_CHANGE, { + value: [start, end] + }); + }); // tooltip + + var _a = this, + tooltipBackgroundColor = _a.tooltipBackgroundColor, + tooltipFomatter = _a.tooltipFomatter, + canvas = _a.canvas; + + var tooltip = new TimeBarTooltip$1({ + container: canvas.get('container'), + backgroundColor: tooltipBackgroundColor + }); + var tickRects = this.tickRects; + tickRects.forEach(function (tickRect) { + var pickRect = tickRect.pickRect; + pickRect.on('mouseenter', function (e) { + var rect = e.target; + if (rect.get('type') !== 'rect') return; + var id = parseInt(rect.get('name').split('-')[2], 10); + var clientPoint = canvas.getClientByPoint(tickRects[id].x, tickRects[id].y); + tooltip.show({ + x: tickRects[id].x, + y: tickRects[id].y, + clientX: clientPoint.x, + clientY: clientPoint.y, + text: tooltipFomatter ? tooltipFomatter(tickRects[id].value) : tickRects[id].value + }); + }); + pickRect.on('mouseleave', function (e) { + tooltip.hide(); + }); + }); // play controller events + + var group = this.group; // 播放区按钮控制 + + /** 播放/暂停事件 */ + + group.on(PLAY_PAUSE_BTN + ":click", function () { + _this.isPlay = !_this.isPlay; + + _this.changePlayStatus(); + }); // 处理前进一步的事件 + + group.on(NEXT_STEP_BTN + ":click", function () { + _this.updateStartEnd(1); + }); // 处理后退一步的事件 + + group.on(PRE_STEP_BTN + ":click", function () { + _this.updateStartEnd(-1); + }); + group.on(TIMEBAR_CONFIG_CHANGE, function (_a) { + _a.type; + var speed = _a.speed; + _this.currentSpeed = speed; + }); + }; + + TimeBarSlice.prototype.changePlayStatus = function (isSync) { + if (isSync === void 0) { + isSync = true; + } + + this.controllerBtnGroup.playButton.update({ + isPlay: this.isPlay + }); + + if (this.isPlay) { + // 开始播放 + this.playHandler = this.startPlay(); + this.graph.emit(TIMELINE_START, null); + } else { + // 结束播放 + if (this.playHandler) { + if (typeof window !== 'undefined') window.cancelAnimationFrame(this.playHandler); + + if (isSync) { + this.graph.emit(TIMELINE_END, null); + } + } + } + }; + + TimeBarSlice.prototype.startPlay = function () { + var _this = this; + + return typeof window !== 'undefined' ? window.requestAnimationFrame(function () { + var speed = _this.currentSpeed; // 一分钟刷新一次 + + if (_this.frameCount % (60 / speed) === 0) { + _this.frameCount = 0; + + _this.updateStartEnd(1); + } + + _this.frameCount++; + + if (_this.isPlay) { + _this.playHandler = _this.startPlay(); + } + }) : undefined; + }; + + TimeBarSlice.prototype.updateStartEnd = function (sign) { + var self = this; + var tickRects = this.tickRects; + var ticksLength = tickRects.length; + var unselectedTickStyle = this.unselectedTickStyle; + var selectedTickStyle = this.selectedTickStyle; + var previousEndTickRectId = self.endTickRectId; + + if (sign > 0) { + self.endTickRectId++; + } else { + tickRects[self.endTickRectId].rect.attr(unselectedTickStyle); + self.endTickRectId--; + } // 若此时 start 与 end 不同，范围前进/后退/播放 + + + if (previousEndTickRectId !== self.startTickRectId) { + if (self.endTickRectId < self.startTickRectId) { + self.startTickRectId = self.endTickRectId; + } + } else { + // 否则是单帧的前进/后退/播放 + for (var i = self.startTickRectId; i <= self.endTickRectId - 1; i++) { + tickRects[i].rect.attr(unselectedTickStyle); + } + + self.startTickRectId = self.endTickRectId; + } + + if (tickRects[self.endTickRectId]) { + tickRects[self.endTickRectId].rect.attr(selectedTickStyle); + var start = self.startTickRectId / ticksLength; + var end = self.endTickRectId / ticksLength; + this.graph.emit(VALUE_CHANGE, { + value: [start, end] + }); + } + }; + + TimeBarSlice.prototype.destory = function () { + this.graph.off(VALUE_CHANGE); + var group = this.sliceGroup; + group.off('click'); + group.off('dragstart'); + group.off('dragover'); + group.off('drop'); + this.tickRects.forEach(function (tickRect) { + var pickRect = tickRect.pickRect; + pickRect.off('mouseenter'); + pickRect.off('mouseleave'); + }); + this.tickRects.length = 0; + group.off(PLAY_PAUSE_BTN + ":click"); + group.off(NEXT_STEP_BTN + ":click"); + group.off(PRE_STEP_BTN + ":click"); + group.off(TIMEBAR_CONFIG_CHANGE); + this.sliceGroup.destroy(); + }; + + return TimeBarSlice; +}(); + +var TimeBarSlice$1 = TimeBarSlice; + +var __extends$3 = undefined && undefined.__extends || function () { + var _extendStatics = function extendStatics(d, b) { + _extendStatics = Object.setPrototypeOf || { + __proto__: [] + } instanceof Array && function (d, b) { + d.__proto__ = b; + } || function (d, b) { + for (var p in b) { + if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; + } + }; + + return _extendStatics(d, b); + }; + + return function (d, b) { + if (typeof b !== "function" && b !== null) throw new TypeError("Class extends value " + String(b) + " is not a constructor or null"); + + _extendStatics(d, b); + + function __() { + this.constructor = d; + } + + d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); + }; +}(); + +var __assign$f = undefined && undefined.__assign || function () { + __assign$f = Object.assign || function (t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + + for (var p in s) { + if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; + } + } + + return t; + }; + + return __assign$f.apply(this, arguments); +}; + +var __rest$5 = undefined && undefined.__rest || function (s, e) { + var t = {}; + + for (var p in s) { + if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p]; + } + + if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]]; + } + return t; +}; + +var DEFAULT_SIMPLE_HEIGHT = 4; // trend 版本默认高度 + +var DEFAULT_TREND_HEIGHT = 26; + +var TimeBar$1 = +/** @class */ +function (_super) { + __extends$3(TimeBar, _super); + + function TimeBar() { + return _super !== null && _super.apply(this, arguments) || this; + } + + TimeBar.prototype.getDefaultCfgs = function () { + return { + container: null, + className: 'g6-component-timebar', + padding: 10, + type: 'trend', + trend: { + data: [], + isArea: false, + smooth: true + }, + controllerCfg: { + speed: 1, + loop: false + }, + slider: { + start: 0.1, + end: 0.9, + minText: 'min', + maxText: 'max' + }, + tick: { + start: 0.1, + end: 0.9, + data: [] + }, + textStyle: {}, + filterEdge: false + }; + }; + /** + * 初始化 TimeBar 的容器 + */ + + + TimeBar.prototype.initContainer = function () { + var graph = this.get('graph'); + var _a = this._cfgs, + width = _a.width, + height = _a.height; + var className = this.get('className') || 'g6-component-timebar'; + var container = this.get('container'); + var graphContainer = this.get('graph').get('container'); + var timeBarContainer; + + if (!container) { + timeBarContainer = createDom$1("
    "); + modifyCSS(timeBarContainer, { + position: 'relative' + }); + } else { + if (isString$3(container)) { + container = document.getElementById(container); + } + + timeBarContainer = container; + } + + graphContainer.appendChild(timeBarContainer); + this.set('timeBarContainer', timeBarContainer); + var canvas; + var renderer = graph.get('renderer'); + + if (renderer === 'SVG') { + canvas = new Canvas({ + container: timeBarContainer, + width: width, + height: height + }); + } else { + canvas = new Canvas$1({ + container: timeBarContainer, + width: width, + height: height + }); + } + + this.set('canvas', canvas); + }; + + TimeBar.prototype.init = function () { + this.initContainer(); + var canvas = this.get('canvas'); + var timeBarGroup = canvas.addGroup({ + name: 'timebar-group' + }); + this.set('timeBarGroup', timeBarGroup); + this.renderTrend(); + this.initEvent(); + var fontFamily = typeof window !== 'undefined' ? window.getComputedStyle(document.body, null).getPropertyValue('font-family') || 'Arial, sans-serif' : 'Arial, sans-serif'; + this.set('fontFamily', fontFamily); + }; + + TimeBar.prototype.renderTrend = function () { + var _a = this._cfgs, + width = _a.width, + x = _a.x, + y = _a.y, + padding = _a.padding, + type = _a.type, + trend = _a.trend, + slider = _a.slider, + controllerCfg = _a.controllerCfg, + textStyle = _a.textStyle, + tick = _a.tick, + backgroundStyle = _a.backgroundStyle, + foregroundStyle = _a.foregroundStyle; + + var data = trend.data, + other = __rest$5(trend, ["data"]); + + var realWidth = width - 2 * padding; + var defaultHeight = type === 'trend' ? DEFAULT_TREND_HEIGHT : DEFAULT_SIMPLE_HEIGHT; + var graph = this.get('graph'); + var group = this.get('timeBarGroup'); + var canvas = this.get('canvas'); + var timebar = null; + + if (type === 'trend' || type === 'simple') { + timebar = new TrendTimeBar$1(__assign$f(__assign$f({ + graph: graph, + canvas: canvas, + group: group, + type: type, + x: x + padding, + y: type === 'trend' ? y + padding : y + padding + 15, + width: realWidth, + height: defaultHeight, + padding: padding, + backgroundStyle: backgroundStyle, + foregroundStyle: foregroundStyle, + trendCfg: __assign$f(__assign$f({}, other), { + data: data.map(function (d) { + return d.value; + }) + }) + }, slider), { + tick: { + ticks: data, + tickLabelFormatter: tick.tickLabelFormatter, + tickLabelStyle: tick.tickLabelStyle, + tickLineStyle: tick.tickLineStyle + }, + handlerStyle: __assign$f(__assign$f({}, slider.handlerStyle), { + height: slider.height || defaultHeight + }), + controllerCfg: controllerCfg, + textStyle: textStyle + })); + } else if (type === 'tick') { + // 刻度时间轴 + timebar = new TimeBarSlice$1(__assign$f({ + graph: graph, + canvas: canvas, + group: group, + x: x + padding, + y: y + padding + }, tick)); + } + + this.set('timebar', timebar); + }; + + TimeBar.prototype.filterData = function (evt) { + var _a; + + var value = evt.value; + var trendData = null; + var type = this._cfgs.type; + + if (type === 'trend' || type === 'simple') { + trendData = this._cfgs.trend.data; + } else if (type === 'tick') { + trendData = this._cfgs.tick.data; + } + + if (!trendData || trendData.length === 0) { + console.warn('请配置 TimeBar 组件的数据'); + return; + } + + var rangeChange = this.get('rangeChange'); + var graph = this.get('graph'); + var min = Math.round(trendData.length * value[0]); + var max = Math.round(trendData.length * value[1]); + max = max >= trendData.length ? trendData.length - 1 : max; + min = min >= trendData.length ? trendData.length - 1 : min; + var tickLabelFormatter = (_a = this._cfgs.tick) === null || _a === void 0 ? void 0 : _a.tickLabelFormatter; + var minText = tickLabelFormatter ? tickLabelFormatter(trendData[min]) : trendData[min].date; + var maxText = tickLabelFormatter ? tickLabelFormatter(trendData[max]) : trendData[max].date; + + if (type !== 'tick') { + var timebar = this.get('timebar'); + timebar.setText(minText, maxText); + } + + if (rangeChange) { + rangeChange(graph, minText, maxText); + } else { + // 自动过滤数据，并渲染 graph + if (!this.cacheGraphData || this.cacheGraphData.nodes && this.cacheGraphData.nodes.length === 0) { + this.cacheGraphData = graph.get('data'); // graph.save() as GraphData; + } // 过滤不在 min 和 max 范围内的节点 + + + var filterData = this.cacheGraphData.nodes.filter(function (d) { + return d.date >= trendData[min].date && d.date <= trendData[max].date; + }); + var nodeIds_1 = filterData.map(function (node) { + return node.id; + }); + var fileterEdges = []; + + if (this.cacheGraphData.edges) { + // 过滤 source 或 target 不在 min 和 max 范围内的边 + fileterEdges = this.cacheGraphData.edges.filter(function (edge) { + return nodeIds_1.includes(edge.source) && nodeIds_1.includes(edge.target); + }); + + if (this.get('filterEdge')) { + fileterEdges = fileterEdges.filter(function (edge) { + return edge.date >= trendData[min].date && edge.date <= trendData[max].date; + }); + } + } + + graph.changeData({ + nodes: filterData, + edges: fileterEdges + }); + } + }; + + TimeBar.prototype.initEvent = function () { + var _this = this; + + var start = 0; + var end = 0; + var type = this._cfgs.type; + + if (!type || type === 'trend' || type === 'simple') { + start = this._cfgs.slider.start; + end = this._cfgs.slider.end; + } else if (type === 'tick') { + start = this._cfgs.tick.start; + end = this._cfgs.tick.end; + } + + var graph = this.get('graph'); + graph.on('afterrender', function (e) { + _this.filterData({ + value: [start, end] + }); + }); // 时间轴的值发生改变的事件 + + graph.on(VALUE_CHANGE, throttle(function (e) { + _this.filterData(e); + }, 200, { + trailing: true, + leading: true + })); + }; + + TimeBar.prototype.destroy = function () { + var timebar = this.get('timebar'); + + if (timebar && timebar.destory) { + timebar.destory(); + } + + _super.prototype.destroy.call(this); + + var timeBarContainer = this.get('timeBarContainer'); + + if (timeBarContainer) { + var container = this.get('container'); + + if (!container) { + container = this.get('graph').get('container'); + } + + if (isString$3(container)) { + container = document.getElementById(container); + } + + container.removeChild(timeBarContainer); + } + }; + + return TimeBar; +}(PluginBase$1); + +var TimeBar$2 = TimeBar$1; + +var __extends$2 = undefined && undefined.__extends || function () { + var _extendStatics = function extendStatics(d, b) { + _extendStatics = Object.setPrototypeOf || { + __proto__: [] + } instanceof Array && function (d, b) { + d.__proto__ = b; + } || function (d, b) { + for (var p in b) { + if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; + } + }; + + return _extendStatics(d, b); + }; + + return function (d, b) { + if (typeof b !== "function" && b !== null) throw new TypeError("Class extends value " + String(b) + " is not a constructor or null"); + + _extendStatics(d, b); + + function __() { + this.constructor = d; + } + + d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); + }; +}(); +var applyMatrix = Util.applyMatrix; + +function getImgNaturalDimension(img, callback) { + var nWidth, nHeight; + + if (img.naturalWidth) { + // 现代浏览器 + nWidth = img.naturalWidth; + nHeight = img.naturalHeight; + } else { + // IE6/7/8 + var image_1 = new Image(); + image_1.src = img.src; + + image_1.onload = function () { + if (callback) callback(image_1.width, image_1.height); + }; + } + + return [nWidth, nHeight]; +} + +var ImageMiniMap = +/** @class */ +function (_super) { + __extends$2(ImageMiniMap, _super); + + function ImageMiniMap() { + return _super !== null && _super.apply(this, arguments) || this; + } + + ImageMiniMap.prototype.getDefaultCfgs = function () { + return { + container: null, + className: 'g6-minimap', + viewportClassName: 'g6-minimap-viewport', + width: 200, + delegateStyle: { + fill: '#40a9ff', + stroke: '#096dd9' + }, + refresh: true + }; + }; + + ImageMiniMap.prototype.getEvents = function () { + return { + beforepaint: 'updateViewport', + beforeanimate: 'disableRefresh', + afteranimate: 'enableRefresh', + viewportchange: 'disableOneRefresh' + }; + }; // 若是正在进行动画，不刷新缩略图 + + + ImageMiniMap.prototype.disableRefresh = function () { + this.set('refresh', false); + }; + + ImageMiniMap.prototype.enableRefresh = function () { + this.set('refresh', true); + this.updateCanvas(); + }; + + ImageMiniMap.prototype.disableOneRefresh = function () { + this.set('viewportChange', true); + }; + + ImageMiniMap.prototype.initViewport = function () { + var _this = this; + + var cfgs = this._cfgs; // cWidth and cHeight are the width and height of the minimap's container + + var graph = cfgs.graph; + if (this.destroyed) return; + var containerDOM = this.get('container'); + + if (isString$3(containerDOM)) { + containerDOM = document.getElementById(containerDOM); + } + + var viewport = createDom$1("
    \n
    "); // 计算拖拽水平方向距离 + + var x = 0; // 计算拖拽垂直方向距离 + + var y = 0; // 是否在拖拽minimap的视口 + + var dragging = false; // 缓存viewport当前对于画布的x + + var left = 0; // 缓存viewport当前对于画布的y + + var top = 0; // 缓存viewport当前宽度 + + var width = 0; // 缓存viewport当前高度 + + var height = 0; + var ratio = 0; + var zoom = 0; + containerDOM.addEventListener('mousedown', function (e) { + cfgs.refresh = false; + + if (e.target !== viewport) { + return; + } // 如果视口已经最大了，不需要拖拽 + + + var style = viewport.style; + width = parseInt(style.width, 10); + height = parseInt(style.height, 10); + + var cWidth = _this.get('width'); + + var cHeight = _this.get('height'); + + if (width > cWidth || height > cHeight) { + return; + } + + zoom = graph.getZoom(); + ratio = _this.get('ratio'); + dragging = true; + x = e.clientX; + y = e.clientY; + }, false); + containerDOM.addEventListener('mousemove', function (e) { + if (!dragging || isNil(e.clientX) || isNil(e.clientY)) { + return; + } + + var cWidth = _this.get('width'); + + var cHeight = _this.get('height'); + + var style = viewport.style; + left = parseInt(style.left, 10); + top = parseInt(style.top, 10); + width = parseInt(style.width, 10); + height = parseInt(style.height, 10); + var dx = x - e.clientX; + var dy = y - e.clientY; // 若视口移动到最左边或最右边了,仅移动到边界 + + if (left - dx < 0) { + dx = left; + } else if (left - dx + width >= cWidth) { + dx = 0; + } // 若视口移动到最上或最下边了，仅移动到边界 + + + if (top - dy < 0) { + dy = top; + } else if (top - dy + height >= cHeight) { + dy = 0; + } + + left -= dx; + top -= dy; // 先移动视口，避免移动到边上以后出现视口闪烁 + + modifyCSS(viewport, { + left: left + "px", + top: top + "px" + }); // graph 移动需要偏移量 dx/dy * 缩放比例才会得到正确的移动距离 + + graph.translate(dx * zoom / ratio, dy * zoom / ratio); + x = e.clientX; + y = e.clientY; + }, false); + containerDOM.addEventListener('mouseleave', function () { + dragging = false; + cfgs.refresh = true; + }, false); + containerDOM.addEventListener('mouseup', function () { + dragging = false; + cfgs.refresh = true; + }, false); + this.set('viewport', viewport); + containerDOM.appendChild(viewport); + }; + /** + * 更新 viewport 视图 + */ + + + ImageMiniMap.prototype.updateViewport = function () { + if (this.destroyed) return; + var ratio = this.get('ratio'); + var cWidth = this.get('width'); + var cHeight = this.get('height'); + var graph = this.get('graph'); + var graphWidth = graph.get('width'); + var graphHeight = graph.get('height'); + var aspectRatio = graphWidth / graphHeight; + var graphGroup = graph.getGroup(); // 主图的 bbox（矩阵变换相关的 bbox） + + var graphCanvasBBox = graphGroup.getCanvasBBox(); // 扩展 graphBBox 到和 graphWidth / graphHeight 等比 + + var graphCanvasBBoxMean = [(graphCanvasBBox.minX + graphCanvasBBox.maxX) / 2, (graphCanvasBBox.minY + graphCanvasBBox.maxY) / 2]; + var graphCanvasBBoxSize = [graphCanvasBBox.maxX - graphCanvasBBox.minX, graphCanvasBBox.maxY - graphCanvasBBox.minY]; + var expandedGraphCanvasBBox = { + centerX: graphCanvasBBoxMean[0], + centerY: graphCanvasBBoxMean[1], + width: 0, + height: 0, + minX: 0, + minY: 0 + }; + + if (graphCanvasBBox[0] / graphCanvasBBox[1] > aspectRatio) { + expandedGraphCanvasBBox.width = graphCanvasBBoxSize[0]; + expandedGraphCanvasBBox.height = expandedGraphCanvasBBox.width / aspectRatio; + } else { + expandedGraphCanvasBBox.height = graphCanvasBBoxSize[1]; + expandedGraphCanvasBBox.width = expandedGraphCanvasBBox.height * aspectRatio; + } + + expandedGraphCanvasBBox.minX = graphCanvasBBoxMean[0] - expandedGraphCanvasBBox.width / 2; + expandedGraphCanvasBBox.minY = graphCanvasBBoxMean[1] - expandedGraphCanvasBBox.height / 2; + var graphMatrix = graphGroup.getMatrix(); + if (!graphMatrix) graphMatrix = [1, 0, 0, 0, 1, 0, 0, 0, 1]; + var invertGraphMatrix = invert$4([1, 0, 0, 0, 1, 0, 0, 0, 1], graphMatrix); + var minXY = applyMatrix({ + x: expandedGraphCanvasBBox.minX, + y: expandedGraphCanvasBBox.minY + }, invertGraphMatrix); // 扩展 graphBBox 后的 bbox 的左上角对应的 canvas container 坐标 + + var topLeft = graph.getCanvasByPoint(minXY.x, minXY.y); + var viewport = this.get('viewport'); + + if (!viewport) { + this.initViewport(); + } // Viewport 与 minimap container 的比例 = Graph container 与 expandedGraphBBox 比例 + + + var vpToMc = graphWidth / expandedGraphCanvasBBox.width; // viewport 宽高 = vpToMc * minimap container 宽高 + + var width = vpToMc * cWidth; + var height = vpToMc * cHeight; // vierport 左上角到 minimap container 的距离 / minimap container 宽高 + // = 主图 expandedBBox 左上角 canvas container 坐标距离 / expandedBBox 宽高 + + var left = cWidth * -topLeft.x / expandedGraphCanvasBBox.width; + var top = cHeight * -topLeft.y / expandedGraphCanvasBBox.height; + var right = left + width; + var bottom = top + height; + + if (left < 0) { + width += left; + left = 0; + } + + if (right > cWidth) { + width = width - (right - cWidth); + } + + if (top < 0) { + height += top; + top = 0; + } + + if (bottom > cHeight) { + height = height - (bottom - cHeight); + } // 缓存目前缩放比，在移动 minimap 视窗时就不用再计算大图的移动量 + + + this.set('ratio', ratio); + var correctLeft = left + "px"; + var correctTop = top + "px"; + modifyCSS(viewport, { + left: correctLeft, + top: correctTop, + width: width + "px", + height: height + "px" + }); + }; + + ImageMiniMap.prototype.init = function () { + this.initContainer(); + }; + /** + * 初始化 Minimap 的容器 + */ + + + ImageMiniMap.prototype.initContainer = function () { + var self = this; + var graph = self.get('graph'); + var graphWidth = graph.get('width'); + var graphHeight = graph.get('height'); + var aspectRatio = graphHeight / graphWidth; + var className = self.get('className'); + var parentNode = self.get('container'); // size of the minimap's container + + var cWidth = self.get('width'); + var cHeight = self.get('height'); + + if (!cWidth && !cHeight) { + cWidth = 200; + } + + if (cWidth) { + cHeight = aspectRatio * cWidth; + self.set('height', cHeight); + } else { + cWidth = 1 / aspectRatio * cHeight; + self.set('width', cWidth); + } + + var container = createDom$1("
    "); + + if (isString$3(parentNode)) { + parentNode = document.getElementById(parentNode); + } + + if (parentNode) { + parentNode.appendChild(container); + } else { + graph.get('container').appendChild(container); + } + + self.set('container', container); + var containerDOM = createDom$1("
    "); + container.appendChild(containerDOM); + var span = createDom$1(""); + containerDOM.appendChild(span); + self.set('containerDOM', containerDOM); + self.set('containerSpan', span); + var img = createDom$1("\"\""); + self.set('imgDOM', img); + self.updateImgSize(); + span.appendChild(img); + self.updateCanvas(); + }; + + ImageMiniMap.prototype.updateImgSize = function () { + var self = this; + var imgDOM = self.get('imgDOM'); + var cWidth = self.get('width'); + var cHeight = self.get('height'); + + imgDOM.onload = function () { + var naturalSize = getImgNaturalDimension(imgDOM); + + if (naturalSize[0] > naturalSize[1]) { + imgDOM.width = cWidth; + } else { + imgDOM.height = cHeight; + } + }; + }; + + ImageMiniMap.prototype.updateCanvas = function () { + // 如果是在动画，则不刷新视图 + var isRefresh = this.get('refresh'); + + if (!isRefresh) { + return; + } + + var graph = this.get('graph'); + + if (graph.get('destroyed')) { + return; + } // 如果是视口变换，也不刷新视图，但是需要重置视口大小和位置 + + + if (this.get('viewportChange')) { + this.set('viewportChange', false); + this.updateViewport(); + } + + var cWidth = this.get('width'); + var graphBBox = graph.get('canvas').getCanvasBBox(); + var width = graphBBox.width; + var ratio = cWidth / width; // // 更新minimap视口 + + this.set('ratio', ratio); + this.updateViewport(); + }; + /** + * 获取minimap的窗口 + * @return {HTMLElement} 窗口的dom实例 + */ + + + ImageMiniMap.prototype.getViewport = function () { + return this.get('viewport'); + }; + /** + * 获取minimap的容器dom + * @return {HTMLElement} dom + */ + + + ImageMiniMap.prototype.getContainer = function () { + return this.get('container'); + }; + + ImageMiniMap.prototype.updateGraphImg = function (img) { + var self = this; + var oriImgDOM = self.get('imgDOM'); + oriImgDOM.remove(); + self.set('graphImg', img); + var imgDOM = createDom$1("\"\""); + self.set('imgDOM', imgDOM); + imgDOM.src = img; + self.updateImgSize(); + var span = self.get('containerSpan'); + span.appendChild(imgDOM); + self.updateCanvas(); + }; + + ImageMiniMap.prototype.destroy = function () { + var container = this.get('container'); + container.parentNode.removeChild(container); + }; + + return ImageMiniMap; +}(PluginBase$1); + +var ImageMinimap$1 = ImageMiniMap; + +var __extends$1 = undefined && undefined.__extends || function () { + var _extendStatics = function extendStatics(d, b) { + _extendStatics = Object.setPrototypeOf || { + __proto__: [] + } instanceof Array && function (d, b) { + d.__proto__ = b; + } || function (d, b) { + for (var p in b) { + if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; + } + }; + + return _extendStatics(d, b); + }; + + return function (d, b) { + if (typeof b !== "function" && b !== null) throw new TypeError("Class extends value " + String(b) + " is not a constructor or null"); + + _extendStatics(d, b); + + function __() { + this.constructor = d; + } + + d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); + }; +}(); + +var __assign$e = undefined && undefined.__assign || function () { + __assign$e = Object.assign || function (t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + + for (var p in s) { + if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]; + } + } + + return t; + }; + + return __assign$e.apply(this, arguments); +}; +var distance$1 = Util.distance; +var DELTA$1 = 0.05; +var lensDelegateStyle = { + stroke: '#000', + strokeOpacity: 0.8, + lineWidth: 2, + fillOpacity: 1, + fill: '#fff' +}; + +var EdgeFilterLens$1 = +/** @class */ +function (_super) { + __extends$1(EdgeFilterLens, _super); + + function EdgeFilterLens() { + return _super !== null && _super.apply(this, arguments) || this; + } + + EdgeFilterLens.prototype.getDefaultCfgs = function () { + return { + type: 'both', + trigger: 'mousemove', + r: 60, + delegateStyle: clone$7(lensDelegateStyle), + showLabel: 'edge', + scaleRBy: 'wheel' + }; + }; // class-methods-use-this + + + EdgeFilterLens.prototype.getEvents = function () { + var events; + + switch (this.get('trigger')) { + case 'click': + events = { + click: 'filter' + }; + break; + + case 'drag': + events = { + click: 'createDelegate' + }; + break; + + default: + events = { + mousemove: 'filter' + }; + break; + } + + return events; + }; + + EdgeFilterLens.prototype.init = function () { + var self = this; + var showLabel = self.get('showLabel'); + var showNodeLabel = showLabel === 'node' || showLabel === 'both'; + var showEdgeLabel = showLabel === 'edge' || showLabel === 'both'; + self.set('showNodeLabel', showNodeLabel); + self.set('showEdgeLabel', showEdgeLabel); + var shouldShow = self.get('shouldShow'); + if (!shouldShow) self.set('shouldShow', function () { + return true; + }); + }; // Create the delegate when the trigger is drag + + + EdgeFilterLens.prototype.createDelegate = function (e) { + var self = this; + var lensDelegate = self.get('delegate'); + + if (!lensDelegate || lensDelegate.destroyed) { + self.filter(e); + lensDelegate = self.get('delegate'); // drag to move the lens + + lensDelegate.on('dragstart', function (evt) {}); + lensDelegate.on('drag', function (evt) { + self.filter(evt); + }); // 绑定调整范围（r） + // 由于 drag 用于改变 lens 位置，因此在此模式下，drag 不能用于调整 r + // scaling r + + if (this.get('scaleRBy') === 'wheel') { + lensDelegate.on('mousewheel', function (evt) { + self.scaleRByWheel(evt); + }); + } + } + }; + /** + * Scale the range by wheel + * @param e mouse wheel event + */ + + + EdgeFilterLens.prototype.scaleRByWheel = function (e) { + var self = this; + if (!e || !e.originalEvent) return; + if (e.preventDefault) e.preventDefault(); + var graph = self.get('graph'); + var ratio; + var lensDelegate = self.get('delegate'); + var lensCenter = lensDelegate ? { + x: lensDelegate.attr('x'), + y: lensDelegate.attr('y') + } : undefined; + lensCenter || graph.getPointByClient(e.clientX, e.clientY); + + if (e.originalEvent.wheelDelta < 0) { + ratio = 1 - DELTA$1; + } else { + ratio = 1 / (1 - DELTA$1); + } + + var maxR = self.get('maxR'); + var minR = self.get('minR'); + var r = self.get('r'); + + if (r > (maxR || graph.get('height')) && ratio > 1 || r < (minR || graph.get('height') * 0.05) && ratio < 1) { + ratio = 1; + } + + r *= ratio; + self.set('r', r); + self.filter(e); + }; + /** + * Response function for mousemove, click, or drag to filter out the edges + * @param e mouse event + */ + + + EdgeFilterLens.prototype.filter = function (e) { + var self = this; + var graph = self.get('graph'); + var nodes = graph.getNodes(); + var hitNodesMap = {}; + var r = self.get('r'); + var type = self.get('type'); + var fCenter = { + x: e.x, + y: e.y + }; + self.updateDelegate(fCenter, r); + var shouldShow = self.get('shouldShow'); + var vShapes = self.get('vShapes'); + + if (vShapes) { + vShapes.forEach(function (shape) { + shape.remove(); + shape.destroy(); + }); + } + + vShapes = []; + nodes.forEach(function (node) { + var model = node.getModel(); + var x = model.x, + y = model.y; + + if (distance$1({ + x: x, + y: y + }, fCenter) < r) { + hitNodesMap[model.id] = node; + } + }); + var edges = graph.getEdges(); + var hitEdges = []; + edges.forEach(function (edge) { + var model = edge.getModel(); + var sourceId = model.source; + var targetId = model.target; + + if (shouldShow(model)) { + if (type === 'only-source' || type === 'one') { + if (hitNodesMap[sourceId] && !hitNodesMap[targetId]) hitEdges.push(edge); + } else if (type === 'only-target' || type === 'one') { + if (hitNodesMap[targetId] && !hitNodesMap[sourceId]) hitEdges.push(edge); + } else if (type === 'both' && hitNodesMap[sourceId] && hitNodesMap[targetId]) { + hitEdges.push(edge); + } + } + }); + var showNodeLabel = self.get('showNodeLabel'); + var showEdgeLabel = self.get('showEdgelabel'); // copy the shapes in hitEdges + + var group = graph.get('group'); + hitEdges.forEach(function (edge) { + var shapes = edge.get('group').get('children'); + shapes.forEach(function (shape) { + var shapeType = shape.get('type'); + var vShape = group.addShape(shapeType, { + attrs: shape.attr() + }); + vShapes.push(vShape); + + if (showNodeLabel && shapeType === 'text') { + vShape.set('visible', true); + } + }); + }); // copy the shape sof hitNodes + + Object.keys(hitNodesMap).forEach(function (key) { + var node = hitNodesMap[key]; + var clonedGroup = node.get('group').clone(); + group.add(clonedGroup); + vShapes.push(clonedGroup); + + if (showEdgeLabel) { + var shapes = clonedGroup.get('children'); + + for (var j = 0; j < shapes.length; j++) { + var shape = shapes[j]; + + if (shape.get('type') === 'text') { + shape.set('visible', true); + } + } + } + }); + self.set('vShapes', vShapes); + }; + /** + * Adjust part of the parameters, including trigger, type, r, maxR, minR, shouldShow, showLabel, and scaleRBy + * @param {EdgeFilterLensConfig} cfg + */ + + + EdgeFilterLens.prototype.updateParams = function (cfg) { + var self = this; + var r = cfg.r, + trigger = cfg.trigger, + minR = cfg.minR, + maxR = cfg.maxR, + scaleRBy = cfg.scaleRBy, + showLabel = cfg.showLabel, + shouldShow = cfg.shouldShow; + + if (!isNaN(cfg.r)) { + self.set('r', r); + } + + if (!isNaN(maxR)) { + self.set('maxR', maxR); + } + + if (!isNaN(minR)) { + self.set('minR', minR); + } + + if (trigger === 'mousemove' || trigger === 'click') { + self.set('trigger', trigger); + } + + if (scaleRBy === 'wheel' || scaleRBy === 'unset') { + self.set('scaleRBy', scaleRBy); + self.get('delegate').remove(); + self.get('delegate').destroy(); + var dPercentText = self.get('dPercentText'); + + if (dPercentText) { + dPercentText.remove(); + dPercentText.destroy(); + } + } + + if (showLabel === 'node' || showLabel === 'both') { + self.set('showNodeLabel', true); + } + + if (showLabel === 'edge' || showLabel === 'both') { + self.set('showEdgeLabel', true); + } + + if (shouldShow) { + self.set('shouldShow', shouldShow); + } + }; + /** + * Update the delegate shape of the lens + * @param {Point} mCenter the center of the shape + * @param {number} r the radius of the shape + */ + + + EdgeFilterLens.prototype.updateDelegate = function (mCenter, r) { + var self = this; + var graph = self.get('graph'); + var lensDelegate = self.get('delegate'); + + if (!lensDelegate || lensDelegate.destroyed) { + // 拖动多个 + var parent_1 = graph.get('group'); + var attrs = self.get('delegateStyle') || lensDelegateStyle; // model上的x, y是相对于图形中心的，delegateShape是g实例，x,y是绝对坐标 + + lensDelegate = parent_1.addShape('circle', { + attrs: __assign$e({ + r: r, + x: mCenter.x, + y: mCenter.y + }, attrs), + name: 'lens-shape', + draggable: true + }); + + if (this.get('trigger') !== 'drag') { + // 调整范围 r 的监听 + if (this.get('scaleRBy') === 'wheel') { + // 使用滚轮调整 r + lensDelegate.on('mousewheel', function (evt) { + self.scaleRByWheel(evt); + }); + } + } + } else { + lensDelegate.attr({ + x: mCenter.x, + y: mCenter.y, + r: r + }); + } + + self.set('delegate', lensDelegate); + }; + /** + * Clear the filtering + */ + + + EdgeFilterLens.prototype.clear = function () { + var self = this; + var vShapes = self.get('vShapes'); + + if (vShapes) { + vShapes.forEach(function (shape) { + shape.remove(); + shape.destroy(); + }); + } + + vShapes = []; + self.set('vShapes', vShapes); + var lensDelegate = self.get('delegate'); + + if (lensDelegate && !lensDelegate.destroyed) { + lensDelegate.remove(); + lensDelegate.destroy(); + } + }; + /** + * Destroy the component + */ + + + EdgeFilterLens.prototype.destroy = function () { + this.clear(); + }; + + return EdgeFilterLens; +}(PluginBase$1); + +var EdgeFilterLens$2 = EdgeFilterLens$1; + +var Plugin = { + PluginBase: PluginBase$1, + Menu: Menu$1, + Grid: Grid$1, + Minimap: Minimap, + Bundling: Bundling$1, + ToolBar: ToolBar$1, + Tooltip: Tooltip$2, + Fisheye: Fisheye$2, + TimeBar: TimeBar$2, + ImageMinimap: ImageMinimap$1, + EdgeFilterLens: EdgeFilterLens$2 +}; +var Plugin$1 = Plugin; + +registerNode('circle', { + // 自定义节点时的配置 + options: { + size: BaseGlobal.defaultNode.size, + style: { + x: 0, + y: 0, + stroke: BaseGlobal.defaultNode.style.stroke, + fill: BaseGlobal.defaultNode.style.fill, + lineWidth: BaseGlobal.defaultNode.style.lineWidth + }, + labelCfg: { + style: { + fill: BaseGlobal.nodeLabel.style.fill, + fontSize: BaseGlobal.nodeLabel.style.fontSize + } + }, + // 节点上左右上下四个方向上的链接circle配置 + linkPoints: { + top: false, + right: false, + bottom: false, + left: false, + // circle的大小 + size: BaseGlobal.defaultNode.linkPoints.size, + lineWidth: BaseGlobal.defaultNode.linkPoints.lineWidth, + fill: BaseGlobal.defaultNode.linkPoints.fill, + stroke: BaseGlobal.defaultNode.linkPoints.stroke + }, + // 节点中icon配置 + icon: { + // 是否显示icon，值为 false 则不渲染icon + show: false, + // icon的地址，字符串类型 + img: 'https://gw.alipayobjects.com/zos/bmw-prod/5d015065-8505-4e7a-baec-976f81e3c41d.svg', + width: 20, + height: 20 + }, + stateStyles: __assign$r({}, BaseGlobal.nodeStateStyles) + }, + shapeType: 'circle', + // 文本位置 + labelPosition: 'center', + drawShape: function drawShape(cfg, group) { + var _a = this.getOptions(cfg).icon, + defaultIcon = _a === void 0 ? {} : _a; + var style = this.getShapeStyle(cfg); + var icon = deepMix({}, defaultIcon, cfg.icon); + var keyShape = group.addShape('circle', { + attrs: style, + className: this.type + "-keyShape", + draggable: true + }); + var width = icon.width, + height = icon.height, + show = icon.show; + + if (show) { + group.addShape('image', { + attrs: __assign$r({ + x: -width / 2, + y: -height / 2 + }, icon), + className: this.type + "-icon", + name: this.type + "-icon", + draggable: true + }); + } + + this.drawLinkPoints(cfg, group); + return keyShape; + }, + + /** + * 绘制节点上的LinkPoints + * @param {Object} cfg data数据配置项 + * @param {Group} group Group实例 + */ + drawLinkPoints: function drawLinkPoints(cfg, group) { + var _a = this.getOptions(cfg).linkPoints, + linkPoints = _a === void 0 ? {} : _a; + + var top = linkPoints.top, + left = linkPoints.left, + right = linkPoints.right, + bottom = linkPoints.bottom, + markSize = linkPoints.size, + markR = linkPoints.r, + markStyle = __rest$G(linkPoints, ["top", "left", "right", "bottom", "size", "r"]); + + var size = this.getSize(cfg); + var r = size[0] / 2; + + if (left) { + // left circle + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, markStyle), { + x: -r, + y: 0, + r: markSize / 2 || markR || 5 + }), + className: 'link-point-left', + name: 'link-point-left', + isAnchorPoint: true + }); + } + + if (right) { + // right circle + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, markStyle), { + x: r, + y: 0, + r: markSize / 2 || markR || 5 + }), + className: 'link-point-right', + name: 'link-point-right', + isAnchorPoint: true + }); + } + + if (top) { + // top circle + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, markStyle), { + x: 0, + y: -r, + r: markSize / 2 || markR || 5 + }), + className: 'link-point-top', + name: 'link-point-top', + isAnchorPoint: true + }); + } + + if (bottom) { + // bottom circle + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, markStyle), { + x: 0, + y: r, + r: markSize / 2 || markR || 5 + }), + className: 'link-point-bottom', + name: 'link-point-bottom', + isAnchorPoint: true + }); + } + }, + + /** + * 获取节点的样式，供基于该节点自定义时使用 + * @param {Object} cfg 节点数据模型 + * @return {Object} 节点的样式 + */ + getShapeStyle: function getShapeStyle(cfg) { + var defaultStyle = this.getOptions(cfg).style; + var strokeStyle = { + stroke: cfg.color + }; // 如果设置了color，则覆盖默认的stroke属性 + + var style = deepMix({}, defaultStyle, strokeStyle); + var size = this.getSize(cfg); + var r = size[0] / 2; + + var styles = __assign$r({ + x: 0, + y: 0, + r: r + }, style); + + return styles; + }, + update: function update(cfg, item) { + var group = item.getContainer(); + var size = this.getSize(cfg); // 下面这些属性需要覆盖默认样式与目前样式，但若在 cfg 中有指定则应该被 cfg 的相应配置覆盖。 + + var strokeStyle = { + stroke: cfg.color, + r: size[0] / 2 + }; // 与 getShapeStyle 不同在于，update 时需要获取到当前的 style 进行融合。即新传入的配置项中没有涉及的属性，保留当前的配置。 + + var keyShape = item.get('keyShape'); + var style = deepMix({}, keyShape.attr(), strokeStyle, cfg.style); + this.updateShape(cfg, item, style, true); + this.updateLinkPoints(cfg, group); + } +}, 'single-node'); + +registerNode('rect', { + // 自定义节点时的配置 + options: { + size: [100, 30], + style: { + radius: 0, + stroke: BaseGlobal.defaultNode.style.stroke, + fill: BaseGlobal.defaultNode.style.fill, + lineWidth: BaseGlobal.defaultNode.style.lineWidth + }, + // 文本样式配置 + labelCfg: { + style: { + fill: BaseGlobal.nodeLabel.style.fill, + fontSize: BaseGlobal.nodeLabel.style.fontSize + } + }, + // 节点上左右上下四个方向上的链接circle配置 + linkPoints: { + top: false, + right: false, + bottom: false, + left: false, + // circle的大小 + size: BaseGlobal.defaultNode.linkPoints.size, + lineWidth: BaseGlobal.defaultNode.linkPoints.lineWidth, + fill: BaseGlobal.defaultNode.linkPoints.fill, + stroke: BaseGlobal.defaultNode.linkPoints.stroke + }, + // 节点中icon配置 + icon: { + // 是否显示icon，值为 false 则不渲染icon + show: false, + // icon的地址，字符串类型 + img: 'https://gw.alipayobjects.com/zos/bmw-prod/5d015065-8505-4e7a-baec-976f81e3c41d.svg', + width: 20, + height: 20 + }, + // 连接点，默认为左右 + // anchorPoints: [{ x: 0, y: 0.5 }, { x: 1, y: 0.5 }] + anchorPoints: [[0, 0.5], [1, 0.5]], + stateStyles: __assign$r({}, BaseGlobal.nodeStateStyles) + }, + shapeType: 'rect', + labelPosition: 'center', + drawShape: function drawShape(cfg, group) { + var style = this.getShapeStyle(cfg); + var keyShape = group.addShape('rect', { + attrs: style, + className: this.type + "-keyShape", + name: this.type + "-keyShape", + draggable: true + }); + this.drawLinkPoints(cfg, group); + return keyShape; + }, + + /** + * 绘制节点上的LinkPoints + * @param {Object} cfg data数据配置项 + * @param {Group} group Group实例 + */ + drawLinkPoints: function drawLinkPoints(cfg, group) { + var _a = this.getOptions(cfg).linkPoints, + linkPoints = _a === void 0 ? {} : _a; + + var top = linkPoints.top, + left = linkPoints.left, + right = linkPoints.right, + bottom = linkPoints.bottom, + markSize = linkPoints.size, + markR = linkPoints.r, + markStyle = __rest$G(linkPoints, ["top", "left", "right", "bottom", "size", "r"]); + + var size = this.getSize(cfg); + var width = size[0]; + var height = size[1]; + + if (left) { + // left circle + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, markStyle), { + x: -width / 2, + y: 0, + r: markSize / 2 || markR || 5 + }), + className: 'link-point-left', + name: 'link-point-left', + isAnchorPoint: true + }); + } + + if (right) { + // right circle + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, markStyle), { + x: width / 2, + y: 0, + r: markSize / 2 || markR || 5 + }), + className: 'link-point-right', + name: 'link-point-right', + isAnchorPoint: true + }); + } + + if (top) { + // top circle + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, markStyle), { + x: 0, + y: -height / 2, + r: markSize / 2 || markR || 5 + }), + className: 'link-point-top', + name: 'link-point-top', + isAnchorPoint: true + }); + } + + if (bottom) { + // bottom circle + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, markStyle), { + x: 0, + y: height / 2, + r: markSize / 2 || markR || 5 + }), + className: 'link-point-bottom', + name: 'link-point-bottom', + isAnchorPoint: true + }); + } + }, + + /** + * 获取节点的样式，供基于该节点自定义时使用 + * @param {Object} cfg 节点数据模型 + * @return {Object} 节点的样式 + */ + getShapeStyle: function getShapeStyle(cfg) { + var defaultStyle = this.getOptions(cfg).style; + var strokeStyle = { + stroke: cfg.color + }; // 如果设置了color，则覆盖默认的stroke属性 + + var style = mix({}, defaultStyle, strokeStyle); + var size = this.getSize(cfg); + var width = style.width || size[0]; + var height = style.height || size[1]; + + var styles = __assign$r({ + x: -width / 2, + y: -height / 2, + width: width, + height: height + }, style); + + return styles; + }, + update: function update(cfg, item) { + var group = item.getContainer(); // 这里不传 cfg 参数是因为 cfg.style 需要最后覆盖样式 + + var defaultStyle = this.getOptions({}).style; + var size = this.getSize(cfg); + var keyShape = item.get('keyShape'); + + if (!cfg.size) { + size[0] = keyShape.attr('width') || defaultStyle.width; + size[1] = keyShape.attr('height') || defaultStyle.height; + } // 下面这些属性需要覆盖默认样式与目前样式，但若在 cfg 中有指定则应该被 cfg 的相应配置覆盖。 + + + var strokeStyle = { + stroke: cfg.color, + x: -size[0] / 2, + y: -size[1] / 2, + width: size[0], + height: size[1] + }; // 与 getShapeStyle 不同在于，update 时需要获取到当前的 style 进行融合。即新传入的配置项中没有涉及的属性，保留当前的配置。 + + var style = mix({}, defaultStyle, keyShape.attr(), strokeStyle); + style = mix(style, cfg.style); + this.updateShape(cfg, item, style, false); + this.updateLinkPoints(cfg, group); + } +}, 'single-node'); + +/** + * 基本的椭圆，可以添加文本，默认文本居中 + */ + +registerNode('ellipse', { + // 自定义节点时的配置 + options: { + size: [80, 40], + style: { + x: 0, + y: 0, + stroke: BaseGlobal.defaultNode.style.stroke, + fill: BaseGlobal.defaultNode.style.fill, + lineWidth: BaseGlobal.defaultNode.style.lineWidth + }, + // 文本样式配置 + labelCfg: { + style: { + fill: BaseGlobal.nodeLabel.style.fill, + fontSize: BaseGlobal.nodeLabel.style.fontSize + } + }, + // 节点上左右上下四个方向上的链接circle配置 + linkPoints: { + top: false, + right: false, + bottom: false, + left: false, + // circle的大小 + size: BaseGlobal.defaultNode.linkPoints.size, + lineWidth: BaseGlobal.defaultNode.linkPoints.lineWidth, + fill: BaseGlobal.defaultNode.linkPoints.fill, + stroke: BaseGlobal.defaultNode.linkPoints.stroke + }, + // 节点中icon配置 + icon: { + // 是否显示icon，值为 false 则不渲染icon + show: false, + // icon的地址，字符串类型 + img: 'https://gw.alipayobjects.com/zos/bmw-prod/5d015065-8505-4e7a-baec-976f81e3c41d.svg', + width: 20, + height: 20 + }, + stateStyles: __assign$r({}, BaseGlobal.nodeStateStyles) + }, + shapeType: 'ellipse', + // 文本位置 + labelPosition: 'center', + drawShape: function drawShape(cfg, group) { + var _a = this.getOptions(cfg).icon, + icon = _a === void 0 ? {} : _a; + var style = this.getShapeStyle(cfg); + var keyShape = group.addShape('ellipse', { + attrs: style, + className: 'ellipse-keyShape', + name: 'ellipse-keyShape', + draggable: true + }); + var width = icon.width, + height = icon.height, + show = icon.show; + + if (show) { + group.addShape('image', { + attrs: __assign$r({ + x: -width / 2, + y: -height / 2 + }, icon), + className: this.type + "-icon", + name: this.type + "-icon", + draggable: true + }); + } + + this.drawLinkPoints(cfg, group); + return keyShape; + }, + + /** + * 绘制节点上的LinkPoints + * @param {Object} cfg data数据配置项 + * @param {Group} group Group实例 + */ + drawLinkPoints: function drawLinkPoints(cfg, group) { + var _a = this.getOptions(cfg).linkPoints, + linkPoints = _a === void 0 ? {} : _a; + + var top = linkPoints.top, + left = linkPoints.left, + right = linkPoints.right, + bottom = linkPoints.bottom, + markSize = linkPoints.size, + markR = linkPoints.r, + markStyle = __rest$G(linkPoints, ["top", "left", "right", "bottom", "size", "r"]); + + var size = this.getSize(cfg); + var rx = size[0] / 2; + var ry = size[1] / 2; + + if (left) { + // left circle + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, markStyle), { + x: -rx, + y: 0, + r: markSize / 2 || markR || 5 + }), + className: 'link-point-left', + name: 'link-point-left', + isAnchorPoint: true + }); + } + + if (right) { + // right circle + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, markStyle), { + x: rx, + y: 0, + r: markSize / 2 || markR || 5 + }), + className: 'link-point-right', + name: 'link-point-right', + isAnchorPoint: true + }); + } + + if (top) { + // top circle + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, markStyle), { + x: 0, + y: -ry, + r: markSize / 2 || markR || 5 + }), + className: 'link-point-top', + name: 'link-point-top', + isAnchorPoint: true + }); + } + + if (bottom) { + // bottom circle + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, markStyle), { + x: 0, + y: ry, + r: markSize / 2 || markR || 5 + }), + className: 'link-point-bottom', + name: 'link-point-bottom', + isAnchorPoint: true + }); + } + }, + + /** + * 获取节点的样式，供基于该节点自定义时使用 + * @param {Object} cfg 节点数据模型 + * @return {Object} 节点的样式 + */ + getShapeStyle: function getShapeStyle(cfg) { + var defaultStyle = this.getOptions(cfg).style; + var strokeStyle = { + stroke: cfg.color + }; // 如果设置了color，则覆盖默认的stroke属性 + + var style = mix({}, defaultStyle, strokeStyle); + var size = this.getSize(cfg); + var rx = size[0] / 2; + var ry = size[1] / 2; + + var styles = __assign$r({ + x: 0, + y: 0, + rx: rx, + ry: ry + }, style); + + return styles; + }, + update: function update(cfg, item) { + var group = item.getContainer(); // 这里不传 cfg 参数是因为 cfg.style 需要最后覆盖样式 + + var defaultStyle = this.getOptions({}).style; + var size = this.getSize(cfg); + var strokeStyle = { + stroke: cfg.color, + rx: size[0] / 2, + ry: size[1] / 2 + }; // 与 getShapeStyle 不同在于，update 时需要获取到当前的 style 进行融合。即新传入的配置项中没有涉及的属性，保留当前的配置。 + + var keyShape = item.get('keyShape'); + var style = mix({}, defaultStyle, keyShape.attr(), strokeStyle); + style = mix(style, cfg.style); + this.updateShape(cfg, item, style, true); + this.updateLinkPoints(cfg, group); + } +}, 'single-node'); + +registerNode('diamond', { + // 自定义节点时的配置 + options: { + size: [80, 80], + style: { + stroke: BaseGlobal.defaultNode.style.stroke, + fill: BaseGlobal.defaultNode.style.fill, + lineWidth: BaseGlobal.defaultNode.style.lineWidth + }, + // 文本样式配置 + labelCfg: { + style: { + fill: BaseGlobal.nodeLabel.style.fill, + fontSize: BaseGlobal.nodeLabel.style.fontSize + } + }, + // 节点上左右上下四个方向上的链接circle配置 + linkPoints: { + top: false, + right: false, + bottom: false, + left: false, + // circle的大小 + size: BaseGlobal.defaultNode.linkPoints.size, + lineWidth: BaseGlobal.defaultNode.linkPoints.lineWidth, + fill: BaseGlobal.defaultNode.linkPoints.fill, + stroke: BaseGlobal.defaultNode.linkPoints.stroke + }, + // 节点中icon配置 + icon: { + // 是否显示icon，值为 false 则不渲染icon + show: false, + // icon的地址，字符串类型 + img: 'https://gw.alipayobjects.com/zos/bmw-prod/5d015065-8505-4e7a-baec-976f81e3c41d.svg', + width: 20, + height: 20 + }, + stateStyles: __assign$r({}, BaseGlobal.nodeStateStyles) + }, + shapeType: 'diamond', + // 文本位置 + labelPosition: 'center', + drawShape: function drawShape(cfg, group) { + var _a = this.getOptions(cfg).icon, + icon = _a === void 0 ? {} : _a; + var style = this.getShapeStyle(cfg); + var keyShape = group.addShape('path', { + attrs: style, + className: this.type + "-keyShape", + name: this.type + "-keyShape", + draggable: true + }); + var w = icon.width, + h = icon.height, + show = icon.show; + + if (show) { + group.addShape('image', { + attrs: __assign$r({ + x: -w / 2, + y: -h / 2 + }, icon), + className: this.type + "-icon", + name: this.type + "-icon", + draggable: true + }); + } + + this.drawLinkPoints(cfg, group); + return keyShape; + }, + + /** + * 绘制节点上的LinkPoints + * @param {Object} cfg data数据配置项 + * @param {Group} group Group实例 + */ + drawLinkPoints: function drawLinkPoints(cfg, group) { + var _a = this.getOptions(cfg).linkPoints, + linkPoints = _a === void 0 ? {} : _a; + + var top = linkPoints.top, + left = linkPoints.left, + right = linkPoints.right, + bottom = linkPoints.bottom, + markSize = linkPoints.size, + markR = linkPoints.r, + markStyle = __rest$G(linkPoints, ["top", "left", "right", "bottom", "size", "r"]); + + var size = this.getSize(cfg); + var width = size[0]; + var height = size[1]; + + if (left) { + // left circle + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, markStyle), { + x: -width / 2, + y: 0, + r: markSize / 2 || markR || 5 + }), + className: 'link-point-left', + name: 'link-point-left', + isAnchorPoint: true + }); + } + + if (right) { + // right circle + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, markStyle), { + x: width / 2, + y: 0, + r: markSize / 2 || markR || 5 + }), + className: 'link-point-right', + name: 'link-point-right', + isAnchorPoint: true + }); + } + + if (top) { + // top circle + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, markStyle), { + x: 0, + y: -height / 2, + r: markSize / 2 || markR || 5 + }), + className: 'link-point-top', + name: 'link-point-top', + isAnchorPoint: true + }); + } + + if (bottom) { + // bottom circle + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, markStyle), { + x: 0, + y: height / 2, + r: markSize / 2 || markR || 5 + }), + className: 'link-point-bottom', + name: 'link-point-bottom', + isAnchorPoint: true + }); + } + }, + getPath: function getPath(cfg) { + var size = this.getSize(cfg); + var width = size[0]; + var height = size[1]; + var path = [['M', 0, -height / 2], ['L', width / 2, 0], ['L', 0, height / 2], ['L', -width / 2, 0], ['Z'] // 封闭 + ]; + return path; + }, + + /** + * 获取节点的样式，供基于该节点自定义时使用 + * @param {Object} cfg 节点数据模型 + * @return {Object} 节点的样式 + */ + getShapeStyle: function getShapeStyle(cfg) { + var defaultStyle = this.getOptions(cfg).style; + var strokeStyle = { + stroke: cfg.color + }; // 如果设置了color，则覆盖默认的stroke属性 + + var style = mix({}, defaultStyle, strokeStyle); + var path = this.getPath(cfg); + + var styles = __assign$r({ + path: path + }, style); + + return styles; + }, + update: function update(cfg, item) { + var group = item.getContainer(); // 这里不传 cfg 参数是因为 cfg.style 需要最后覆盖样式 + + var defaultStyle = this.getOptions({}).style; + var path = this.getPath(cfg); // 下面这些属性需要覆盖默认样式与目前样式，但若在 cfg 中有指定则应该被 cfg 的相应配置覆盖。 + + var strokeStyle = { + stroke: cfg.color, + path: path + }; // 与 getShapeStyle 不同在于，update 时需要获取到当前的 style 进行融合。即新传入的配置项中没有涉及的属性，保留当前的配置。 + + var keyShape = item.get('keyShape'); + var style = mix({}, defaultStyle, keyShape.attr(), strokeStyle); + style = mix(style, cfg.style); + this.updateShape(cfg, item, style, true); + this.updateLinkPoints(cfg, group); + } +}, 'single-node'); + +registerNode('triangle', { + // 自定义节点时的配置 + options: { + size: 40, + direction: 'up', + style: { + stroke: BaseGlobal.defaultNode.style.stroke, + fill: BaseGlobal.defaultNode.style.fill, + lineWidth: BaseGlobal.defaultNode.style.lineWidth + }, + labelCfg: { + style: { + fill: BaseGlobal.nodeLabel.style.fill, + fontSize: BaseGlobal.nodeLabel.style.fontSize + }, + offset: 15 + }, + // 节点上左右上下四个方向上的链接circle配置 + linkPoints: { + top: false, + right: false, + bottom: false, + left: false, + // circle的大小 + size: BaseGlobal.defaultNode.linkPoints.size, + lineWidth: BaseGlobal.defaultNode.linkPoints.lineWidth, + fill: BaseGlobal.defaultNode.linkPoints.fill, + stroke: BaseGlobal.defaultNode.linkPoints.stroke + }, + // 节点中icon配置 + icon: { + // 是否显示icon，值为 false 则不渲染icon + show: false, + // icon的地址，字符串类型 + img: 'https://gw.alipayobjects.com/zos/bmw-prod/5d015065-8505-4e7a-baec-976f81e3c41d.svg', + width: 20, + height: 20, + offset: 6 + }, + stateStyles: __assign$r({}, BaseGlobal.nodeStateStyles) + }, + shapeType: 'triangle', + // 文本位置 + labelPosition: 'bottom', + drawShape: function drawShape(cfg, group) { + var _a = this.getOptions(cfg), + _b = _a.icon, + icon = _b === void 0 ? {} : _b, + defaultDirection = _a.direction; + + var style = this.getShapeStyle(cfg); + var direction = cfg.direction || defaultDirection; + var keyShape = group.addShape('path', { + attrs: style, + className: this.type + "-keyShape", + name: this.type + "-keyShape", + draggable: true + }); + var w = icon.width, + h = icon.height, + show = icon.show, + offset = icon.offset; + + if (show) { + var iconW = -w / 2; + var iconH = -h / 2; + + if (direction === 'up' || direction === 'down') { + iconH += offset; + } + + if (direction === 'left' || direction === 'right') { + iconW += offset; + } + + group.addShape('image', { + attrs: __assign$r({ + x: iconW, + y: iconH + }, icon), + className: this.type + "-icon", + name: this.type + "-icon", + draggable: true + }); + } + + this.drawLinkPoints(cfg, group); + return keyShape; + }, + + /** + * 绘制节点上的LinkPoints + * @param {Object} cfg data数据配置项 + * @param {Group} group Group实例 + */ + drawLinkPoints: function drawLinkPoints(cfg, group) { + var _a = this.getOptions(cfg), + _b = _a.linkPoints, + linkPoints = _b === void 0 ? {} : _b, + defaultDirection = _a.direction; + + var direction = cfg.direction || defaultDirection; + + var top = linkPoints.top, + left = linkPoints.left, + right = linkPoints.right, + bottom = linkPoints.bottom, + markSize = linkPoints.size, + markR = linkPoints.r, + markStyle = __rest$G(linkPoints, ["top", "left", "right", "bottom", "size", "r"]); + + var size = this.getSize(cfg); + var len = size[0]; + + if (left) { + // up down left right 四个方向的坐标均不相同 + var leftPos = null; + var diffY = len * Math.sin(1 / 3 * Math.PI); + var r = len * Math.sin(1 / 3 * Math.PI); + + if (direction === 'up') { + leftPos = [-r, diffY]; + } else if (direction === 'down') { + leftPos = [-r, -diffY]; + } else if (direction === 'left') { + leftPos = [-r, r - diffY]; + } + + if (leftPos) { + // left circle + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, markStyle), { + x: leftPos[0], + y: leftPos[1], + r: markSize / 2 || markR || 5 + }), + className: 'link-point-left', + name: 'link-point-left' + }); + } + } + + if (right) { + // right circle + // up down left right 四个方向的坐标均不相同 + var rightPos = null; + var diffY = len * Math.sin(1 / 3 * Math.PI); + var r = len * Math.sin(1 / 3 * Math.PI); + + if (direction === 'up') { + rightPos = [r, diffY]; + } else if (direction === 'down') { + rightPos = [r, -diffY]; + } else if (direction === 'right') { + rightPos = [r, r - diffY]; + } + + if (rightPos) { + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, markStyle), { + x: rightPos[0], + y: rightPos[1], + r: markSize / 2 || markR || 5 + }), + className: 'link-point-right', + name: 'link-point-right' + }); + } + } + + if (top) { + // up down left right 四个方向的坐标均不相同 + var topPos = null; + var diffY = len * Math.sin(1 / 3 * Math.PI); + var r = len * Math.sin(1 / 3 * Math.PI); + + if (direction === 'up') { + topPos = [r - diffY, -diffY]; + } else if (direction === 'left') { + topPos = [r, -diffY]; + } else if (direction === 'right') { + topPos = [-r, -diffY]; + } + + if (topPos) { + // top circle + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, markStyle), { + x: topPos[0], + y: topPos[1], + r: markSize / 2 || markR || 5 + }), + className: 'link-point-top', + name: 'link-point-top' + }); + } + } + + if (bottom) { + // up down left right 四个方向的坐标均不相同 + var bottomPos = null; + var diffY = len * Math.sin(1 / 3 * Math.PI); + var r = len * Math.sin(1 / 3 * Math.PI); + + if (direction === 'down') { + bottomPos = [-r + diffY, diffY]; + } else if (direction === 'left') { + bottomPos = [r, diffY]; + } else if (direction === 'right') { + bottomPos = [-r, diffY]; + } + + if (bottomPos) { + // bottom circle + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, markStyle), { + x: bottomPos[0], + y: bottomPos[1], + r: markSize / 2 || markR || 5 + }), + className: 'link-point-bottom', + name: 'link-point-bottom' + }); + } + } + }, + getPath: function getPath(cfg) { + var defaultDirection = this.getOptions(cfg).direction; + var direction = cfg.direction || defaultDirection; + var size = this.getSize(cfg); + var len = size[0]; + var diffY = len * Math.sin(1 / 3 * Math.PI); + var r = len * Math.sin(1 / 3 * Math.PI); + var path = [['M', -r, diffY], ['L', 0, -diffY], ['L', r, diffY], ['Z'] // 封闭 + ]; + + if (direction === 'down') { + path = [['M', -r, -diffY], ['L', r, -diffY], ['L', 0, diffY], ['Z'] // 封闭 + ]; + } else if (direction === 'left') { + path = [['M', -r, r - diffY], ['L', r, -r], ['L', r, r], ['Z'] // 封闭 + ]; + } else if (direction === 'right') { + path = [['M', r, r - diffY], ['L', -r, r], ['L', -r, -r], ['Z'] // 封闭 + ]; + } + + return path; + }, + + /** + * 获取节点的样式，供基于该节点自定义时使用 + * @param {Object} cfg 节点数据模型 + * @return {Object} 节点的样式 + */ + getShapeStyle: function getShapeStyle(cfg) { + var defaultStyle = this.getOptions(cfg).style; + var strokeStyle = { + stroke: cfg.color + }; // 如果设置了color，则覆盖默认的stroke属性 + + var style = mix({}, defaultStyle, strokeStyle); + var path = this.getPath(cfg); + + var styles = __assign$r({ + path: path + }, style); + + return styles; + }, + update: function update(cfg, item) { + var group = item.getContainer(); // 这里不传 cfg 参数是因为 cfg.style 需要最后覆盖样式 + + var defaultStyle = this.getOptions({}).style; + var path = this.getPath(cfg); // 下面这些属性需要覆盖默认样式与目前样式，但若在 cfg 中有指定则应该被 cfg 的相应配置覆盖。 + + var strokeStyle = { + stroke: cfg.color, + path: path + }; // 与 getShapeStyle 不同在于，update 时需要获取到当前的 style 进行融合。即新传入的配置项中没有涉及的属性，保留当前的配置。 + + var keyShape = item.get('keyShape'); + var style = mix({}, defaultStyle, keyShape.attr(), strokeStyle); + style = mix(style, cfg.style); + this.updateShape(cfg, item, style, true); + this.updateLinkPoints(cfg, group); + }, + + /** + * 更新linkPoints + * @param {Object} cfg 节点数据配置项 + * @param {Group} group Item所在的group + */ + updateLinkPoints: function updateLinkPoints(cfg, group) { + var _a = this.getOptions({}), + defaultLinkPoints = _a.linkPoints, + defaultDirection = _a.direction; + + var direction = cfg.direction || defaultDirection; + var markLeft = group.find(function (element) { + return element.get('className') === 'link-point-left'; + }); + var markRight = group.find(function (element) { + return element.get('className') === 'link-point-right'; + }); + var markTop = group.find(function (element) { + return element.get('className') === 'link-point-top'; + }); + var markBottom = group.find(function (element) { + return element.get('className') === 'link-point-bottom'; + }); + var currentLinkPoints = defaultLinkPoints; + var existLinkPoint = markLeft || markRight || markTop || markBottom; + + if (existLinkPoint) { + currentLinkPoints = existLinkPoint.attr(); + } + + var linkPoints = mix({}, currentLinkPoints, cfg.linkPoints); + var markFill = linkPoints.fill, + markStroke = linkPoints.stroke, + borderWidth = linkPoints.lineWidth; + var markSize = linkPoints.size / 2; + if (!markSize) markSize = linkPoints.r; + + var _b = cfg.linkPoints ? cfg.linkPoints : { + left: undefined, + right: undefined, + top: undefined, + bottom: undefined + }, + left = _b.left, + right = _b.right, + top = _b.top, + bottom = _b.bottom; + + var size = this.getSize(cfg); + var len = size[0]; + var styles = { + r: markSize, + fill: markFill, + stroke: markStroke, + lineWidth: borderWidth + }; + var leftPos = null; + var diffY = len * Math.sin(1 / 3 * Math.PI); + var r = len * Math.sin(1 / 3 * Math.PI); + + if (direction === 'up') { + leftPos = [-r, diffY]; + } else if (direction === 'down') { + leftPos = [-r, -diffY]; + } else if (direction === 'left') { + leftPos = [-r, r - diffY]; + } + + if (leftPos) { + if (markLeft) { + if (!left && left !== undefined) { + markLeft.remove(); + } else { + markLeft.attr(__assign$r(__assign$r({}, styles), { + x: leftPos[0], + y: leftPos[1] + })); + } + } else if (left) { + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, styles), { + x: leftPos[0], + y: leftPos[1] + }), + className: 'link-point-left', + name: 'link-point-left', + isAnchorPoint: true + }); + } + } + + var rightPos = null; + + if (direction === 'up') { + rightPos = [r, diffY]; + } else if (direction === 'down') { + rightPos = [r, -diffY]; + } else if (direction === 'right') { + rightPos = [r, r - diffY]; + } + + if (rightPos) { + if (markRight) { + if (!right && right !== undefined) { + markRight.remove(); + } else { + markRight.attr(__assign$r(__assign$r({}, styles), { + x: rightPos[0], + y: rightPos[1] + })); + } + } else if (right) { + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, styles), { + x: rightPos[0], + y: rightPos[1] + }), + className: 'link-point-right', + name: 'link-point-right', + isAnchorPoint: true + }); + } + } + + var topPos = null; + + if (direction === 'up') { + topPos = [r - diffY, -diffY]; + } else if (direction === 'left') { + topPos = [r, -diffY]; + } else if (direction === 'right') { + topPos = [-r, -diffY]; + } + + if (topPos) { + if (markTop) { + if (!top && top !== undefined) { + markTop.remove(); + } else { + // top circle + markTop.attr(__assign$r(__assign$r({}, styles), { + x: topPos[0], + y: topPos[1] + })); + } + } else if (top) { + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, styles), { + x: topPos[0], + y: topPos[1] + }), + className: 'link-point-top', + name: 'link-point-top', + isAnchorPoint: true + }); + } + } + + var bottomPos = null; + + if (direction === 'down') { + bottomPos = [-r + diffY, diffY]; + } else if (direction === 'left') { + bottomPos = [r, diffY]; + } else if (direction === 'right') { + bottomPos = [-r, diffY]; + } + + if (bottomPos) { + if (markBottom) { + if (!bottom && bottom !== undefined) { + markBottom.remove(); + } else { + markBottom.attr(__assign$r(__assign$r({}, styles), { + x: bottomPos[0], + y: bottomPos[1] + })); + } + } else if (bottom) { + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, styles), { + x: bottomPos[0], + y: bottomPos[1] + }), + className: 'link-point-bottom', + name: 'link-point-bottom', + isAnchorPoint: true + }); + } + } + } +}, 'single-node'); + +registerNode('modelRect', { + // 自定义节点时的配置 + options: { + size: [185, 70], + style: { + radius: 5, + stroke: '#69c0ff', + fill: '#ffffff', + lineWidth: BaseGlobal.defaultNode.style.lineWidth, + fillOpacity: 1 + }, + // 文本样式配置 + labelCfg: { + style: { + fill: '#595959', + fontSize: 14 + }, + offset: 30 // 距离左侧的 offset，没有设置 y 轴上移动的配置 + + }, + descriptionCfg: { + style: { + fontSize: 12, + fill: '#bfbfbf' + }, + paddingTop: 0 + }, + preRect: { + show: true, + width: 4, + fill: '#40a9ff', + radius: 2 + }, + // 节点上左右上下四个方向上的链接circle配置 + linkPoints: { + top: false, + right: false, + bottom: false, + left: false, + // circle的大小 + size: 10, + lineWidth: 1, + fill: '#72CC4A', + stroke: '#72CC4A' + }, + // 节点中icon配置 + logoIcon: { + // 是否显示icon，值为 false 则不渲染icon + show: true, + x: 0, + y: 0, + // icon的地址，字符串类型 + img: 'https://gw.alipayobjects.com/zos/basement_prod/4f81893c-1806-4de4-aff3-9a6b266bc8a2.svg', + width: 16, + height: 16, + // 用于调整图标的左右位置 + offset: 0 + }, + // 节点中表示状态的icon配置 + stateIcon: { + // 是否显示icon，值为 false 则不渲染icon + show: true, + x: 0, + y: 0, + // icon的地址，字符串类型 + img: 'https://gw.alipayobjects.com/zos/basement_prod/300a2523-67e0-4cbf-9d4a-67c077b40395.svg', + width: 16, + height: 16, + // 用于调整图标的左右位置 + offset: -5 + }, + // 连接点，默认为左右 + // anchorPoints: [{ x: 0, y: 0.5 }, { x: 1, y: 0.5 }] + anchorPoints: [[0, 0.5], [1, 0.5]] + }, + shapeType: 'modelRect', + drawShape: function drawShape(cfg, group) { + var _a = this.getOptions(cfg).preRect, + preRect = _a === void 0 ? {} : _a; + var style = this.getShapeStyle(cfg); + var size = this.getSize(cfg); + var width = size[0]; + var height = size[1]; + var keyShape = group.addShape('rect', { + attrs: style, + className: this.type + "-keyShape", + name: this.type + "-keyShape", + draggable: true + }); + + var preRectShow = preRect.show, + preRectStyle = __rest$G(preRect, ["show"]); + + if (preRectShow) { + group.addShape('rect', { + attrs: __assign$r({ + x: -width / 2, + y: -height / 2, + height: height + }, preRectStyle), + className: 'pre-rect', + name: 'pre-rect', + draggable: true + }); + } + + this.drawLogoIcon(cfg, group); + this.drawStateIcon(cfg, group); + this.drawLinkPoints(cfg, group); + return keyShape; + }, + + /** + * 绘制模型矩形左边的logo图标 + * @param {Object} cfg 数据配置项 + * @param {Group} group Group实例 + */ + drawLogoIcon: function drawLogoIcon(cfg, group) { + var _a = this.getOptions(cfg).logoIcon, + logoIcon = _a === void 0 ? {} : _a; + var size = this.getSize(cfg); + var width = size[0]; + + if (logoIcon.show) { + var w = logoIcon.width, + h = logoIcon.height, + x = logoIcon.x, + y = logoIcon.y, + offset = logoIcon.offset, + logoIconStyle = __rest$G(logoIcon, ["width", "height", "x", "y", "offset"]); + + group.addShape('image', { + attrs: __assign$r(__assign$r({}, logoIconStyle), { + x: x || -width / 2 + w + offset, + y: y || -h / 2, + width: w, + height: h + }), + className: 'rect-logo-icon', + name: 'rect-logo-icon', + draggable: true + }); + } + }, + + /** + * 绘制模型矩形右边的状态图标 + * @param {Object} cfg 数据配置项 + * @param {Group} group Group实例 + */ + drawStateIcon: function drawStateIcon(cfg, group) { + var _a = this.getOptions(cfg).stateIcon, + stateIcon = _a === void 0 ? {} : _a; + var size = this.getSize(cfg); + var width = size[0]; + + if (stateIcon.show) { + var w = stateIcon.width, + h = stateIcon.height, + x = stateIcon.x, + y = stateIcon.y, + offset = stateIcon.offset, + iconStyle = __rest$G(stateIcon, ["width", "height", "x", "y", "offset"]); + + group.addShape('image', { + attrs: __assign$r(__assign$r({}, iconStyle), { + x: x || width / 2 - w + offset, + y: y || -h / 2, + width: w, + height: h + }), + className: 'rect-state-icon', + name: 'rect-state-icon', + draggable: true + }); + } + }, + + /** + * 绘制节点上的LinkPoints + * @param {Object} cfg data数据配置项 + * @param {Group} group Group实例 + */ + drawLinkPoints: function drawLinkPoints(cfg, group) { + var _a = this.getOptions(cfg).linkPoints, + linkPoints = _a === void 0 ? {} : _a; + + var top = linkPoints.top, + left = linkPoints.left, + right = linkPoints.right, + bottom = linkPoints.bottom, + markSize = linkPoints.size, + markR = linkPoints.r, + markStyle = __rest$G(linkPoints, ["top", "left", "right", "bottom", "size", "r"]); + + var size = this.getSize(cfg); + var width = size[0]; + var height = size[1]; + + if (left) { + // left circle + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, markStyle), { + x: -width / 2, + y: 0, + r: markSize / 2 || markR || 5 + }), + className: 'link-point-left', + name: 'link-point-left', + isAnchorPoint: true + }); + } + + if (right) { + // right circle + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, markStyle), { + x: width / 2, + y: 0, + r: markSize / 2 || markR || 5 + }), + className: 'link-point-right', + name: 'link-point-right', + isAnchorPoint: true + }); + } + + if (top) { + // top circle + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, markStyle), { + x: 0, + y: -height / 2, + r: markSize / 2 || markR || 5 + }), + className: 'link-point-top', + name: 'link-point-top', + isAnchorPoint: true + }); + } + + if (bottom) { + // bottom circle + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, markStyle), { + x: 0, + y: height / 2, + r: markSize / 2 || markR || 5 + }), + className: 'link-point-bottom', + name: 'link-point-bottom', + isAnchorPoint: true + }); + } + }, + drawLabel: function drawLabel(cfg, group) { + var _a = this.getOptions(cfg), + _b = _a.labelCfg, + labelCfg = _b === void 0 ? {} : _b, + _c = _a.logoIcon, + logoIcon = _c === void 0 ? {} : _c, + _d = _a.descriptionCfg, + descriptionCfg = _d === void 0 ? {} : _d; + + var size = this.getSize(cfg); + var width = size[0]; + var label = null; + var show = logoIcon.show, + w = logoIcon.width; + var offsetX = -width / 2 + labelCfg.offset; + + if (show) { + offsetX = -width / 2 + w + labelCfg.offset; + } + + var fontStyle = labelCfg.style; + var descriptionStyle = descriptionCfg.style, + descriptionPaddingTop = descriptionCfg.paddingTop; + + if (isString$3(cfg.description)) { + label = group.addShape('text', { + attrs: __assign$r(__assign$r({}, fontStyle), { + x: offsetX, + y: -5, + text: cfg.label + }), + className: 'text-shape', + name: 'text-shape', + draggable: true + }); + group.addShape('text', { + attrs: __assign$r(__assign$r({}, descriptionStyle), { + x: offsetX, + y: 17 + (descriptionPaddingTop || 0), + text: cfg.description + }), + className: 'rect-description', + name: 'rect-description', + draggable: true + }); + } else { + label = group.addShape('text', { + attrs: __assign$r(__assign$r({}, fontStyle), { + x: offsetX, + y: 7, + text: cfg.label + }), + className: 'text-shape', + name: 'text-shape', + draggable: true + }); + } + + return label; + }, + + /** + * 获取节点的样式，供基于该节点自定义时使用 + * @param {Object} cfg 节点数据模型 + * @return {Object} 节点的样式 + */ + getShapeStyle: function getShapeStyle(cfg) { + var defaultStyle = this.getOptions(cfg).style; + var strokeStyle = { + stroke: cfg.color + }; // 如果设置了color，则覆盖默认的stroke属性 + + var style = mix({}, defaultStyle, strokeStyle); + var size = this.getSize(cfg); + var width = style.width || size[0]; + var height = style.height || size[1]; + + var styles = __assign$r({ + x: -width / 2, + y: -height / 2, + width: width, + height: height + }, style); + + return styles; + }, + update: function update(cfg, item) { + var _a = this.getOptions(cfg), + _b = _a.style, + style = _b === void 0 ? {} : _b, + _c = _a.labelCfg, + labelCfg = _c === void 0 ? {} : _c, + _d = _a.descriptionCfg, + descriptionCfg = _d === void 0 ? {} : _d; + + var size = this.getSize(cfg); + var width = size[0]; + var height = size[1]; + var keyShape = item.get('keyShape'); + keyShape.attr(__assign$r(__assign$r({}, style), { + x: -width / 2, + y: -height / 2, + width: width, + height: height + })); + var group = item.getContainer(); + var logoIconShape = group.find(function (element) { + return element.get('className') === 'rect-logo-icon'; + }); + var currentLogoIconAttr = logoIconShape ? logoIconShape.attr() : {}; + var logoIcon = mix({}, currentLogoIconAttr, cfg.logoIcon); + var w = logoIcon.width; + + if (w === undefined) { + w = this.options.logoIcon.width; + } + + var show = cfg.logoIcon ? cfg.logoIcon.show : undefined; + var offset = labelCfg.offset; + var offsetX = -width / 2 + w + offset; + + if (!show && show !== undefined) { + offsetX = -width / 2 + offset; + } + + var label = group.find(function (element) { + return element.get('className') === 'node-label'; + }); + var description = group.find(function (element) { + return element.get('className') === 'rect-description'; + }); + + if (cfg.label) { + if (!label) { + group.addShape('text', { + attrs: __assign$r(__assign$r({}, labelCfg.style), { + x: offsetX, + y: cfg.description ? -5 : 7, + text: cfg.label + }), + className: 'node-label', + name: 'node-label', + draggable: true + }); + } else { + var cfgStyle = cfg.labelCfg ? cfg.labelCfg.style : {}; + var labelStyle = mix({}, label.attr(), cfgStyle); + if (cfg.label) labelStyle.text = cfg.label; + labelStyle.x = offsetX; + if (isString$3(cfg.description)) labelStyle.y = -5; + + if (description) { + description.resetMatrix(); + description.attr({ + x: offsetX + }); + } + + label.resetMatrix(); + label.attr(labelStyle); + } + } + + if (isString$3(cfg.description)) { + var paddingTop = descriptionCfg.paddingTop; + + if (!description) { + group.addShape('text', { + attrs: __assign$r(__assign$r({}, descriptionCfg.style), { + x: offsetX, + y: 17 + (paddingTop || 0), + text: cfg.description + }), + className: 'rect-description', + name: 'rect-description', + draggable: true + }); + } else { + var cfgStyle = cfg.descriptionCfg ? cfg.descriptionCfg.style : {}; + var descriptionStyle = mix({}, description.attr(), cfgStyle); + if (isString$3(cfg.description)) descriptionStyle.text = cfg.description; + descriptionStyle.x = offsetX; + description.resetMatrix(); + description.attr(__assign$r(__assign$r({}, descriptionStyle), { + y: 17 + (paddingTop || 0) + })); + } + } + + var preRectShape = group.find(function (element) { + return element.get('className') === 'pre-rect'; + }); + + if (preRectShape) { + var preRect = mix({}, preRectShape.attr(), cfg.preRect); + preRectShape.attr(__assign$r(__assign$r({}, preRect), { + x: -width / 2, + y: -height / 2, + height: height + })); + } + + if (logoIconShape) { + if (!show && show !== undefined) { + logoIconShape.remove(); + } else { + var logoW = logoIcon.width, + h = logoIcon.height, + x = logoIcon.x, + y = logoIcon.y, + logoOffset = logoIcon.offset, + logoIconStyle = __rest$G(logoIcon, ["width", "height", "x", "y", "offset"]); + + logoIconShape.attr(__assign$r(__assign$r({}, logoIconStyle), { + x: x || -width / 2 + logoW + logoOffset, + y: y || -h / 2, + width: logoW, + height: h + })); + } + } else if (show) { + this.drawLogoIcon(cfg, group); + } + + var stateIconShape = group.find(function (element) { + return element.get('className') === 'rect-state-icon'; + }); + var currentStateIconAttr = stateIconShape ? stateIconShape.attr() : {}; + var stateIcon = mix({}, currentStateIconAttr, cfg.stateIcon); + + if (stateIconShape) { + if (!stateIcon.show && stateIcon.show !== undefined) { + stateIconShape.remove(); + } + + var stateW = stateIcon.width, + h = stateIcon.height, + x = stateIcon.x, + y = stateIcon.y, + stateOffset = stateIcon.offset, + stateIconStyle = __rest$G(stateIcon, ["width", "height", "x", "y", "offset"]); + + stateIconShape.attr(__assign$r(__assign$r({}, stateIconStyle), { + x: x || width / 2 - stateW + stateOffset, + y: y || -h / 2, + width: stateW, + height: h + })); + } else if (stateIcon.show) { + this.drawStateIcon(cfg, group); + } + + this.updateLinkPoints(cfg, group); + } +}, 'single-node'); + +registerNode('star', { + // 自定义节点时的配置 + options: { + size: 60, + style: { + stroke: BaseGlobal.defaultNode.style.stroke, + fill: BaseGlobal.defaultNode.style.fill, + lineWidth: BaseGlobal.defaultNode.style.lineWidth + }, + labelCfg: { + style: { + fill: BaseGlobal.nodeLabel.style.fill, + fontSize: BaseGlobal.nodeLabel.style.fontSize + } + }, + // 节点上左右上下四个方向上的链接circle配置 + linkPoints: { + top: false, + right: false, + bottom: false, + left: false, + // circle的大小 + size: BaseGlobal.defaultNode.linkPoints.size, + lineWidth: BaseGlobal.defaultNode.linkPoints.lineWidth, + fill: BaseGlobal.defaultNode.linkPoints.fill, + stroke: BaseGlobal.defaultNode.linkPoints.stroke + }, + // 节点中icon配置 + icon: { + // 是否显示icon，值为 false 则不渲染icon + show: false, + // icon的地址，字符串类型 + img: 'https://gw.alipayobjects.com/zos/bmw-prod/5d015065-8505-4e7a-baec-976f81e3c41d.svg', + width: 20, + height: 20 + }, + stateStyles: __assign$r({}, BaseGlobal.nodeStateStyles) + }, + shapeType: 'star', + // 文本位置 + labelPosition: 'center', + drawShape: function drawShape(cfg, group) { + var _a = this.getOptions(cfg).icon, + icon = _a === void 0 ? {} : _a; + var style = this.getShapeStyle(cfg); + var keyShape = group.addShape('path', { + attrs: style, + className: this.type + "-keyShape", + name: this.type + "-keyShape", + draggable: true + }); + var w = icon.width, + h = icon.height, + show = icon.show; + + if (show) { + group.addShape('image', { + attrs: __assign$r({ + x: -w / 2, + y: -h / 2 + }, icon), + className: this.type + "-icon", + name: this.type + "-icon", + draggable: true + }); + } + + this.drawLinkPoints(cfg, group); + return keyShape; + }, + + /** + * 绘制节点上的LinkPoints + * @param {Object} cfg data数据配置项 + * @param {Group} group Group实例 + */ + drawLinkPoints: function drawLinkPoints(cfg, group) { + var _a = this.getOptions(cfg).linkPoints, + linkPoints = _a === void 0 ? {} : _a; + + var top = linkPoints.top, + left = linkPoints.left, + right = linkPoints.right, + leftBottom = linkPoints.leftBottom, + rightBottom = linkPoints.rightBottom, + markSize = linkPoints.size, + markR = linkPoints.r, + markStyle = __rest$G(linkPoints, ["top", "left", "right", "leftBottom", "rightBottom", "size", "r"]); + + var size = this.getSize(cfg); + var outerR = size[0]; + + if (right) { + // right circle + // up down left right 四个方向的坐标均不相同 + var x1 = Math.cos((18 + 72 * 0) / 180 * Math.PI) * outerR; + var y1 = Math.sin((18 + 72 * 0) / 180 * Math.PI) * outerR; + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, markStyle), { + x: x1, + y: -y1, + r: markSize / 2 || markR || 5 + }), + className: 'link-point-right', + name: 'link-point-right' + }); + } + + if (top) { + // up down left right 四个方向的坐标均不相同 + var x1 = Math.cos((18 + 72 * 1) / 180 * Math.PI) * outerR; + var y1 = Math.sin((18 + 72 * 1) / 180 * Math.PI) * outerR; // top circle + + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, markStyle), { + x: x1, + y: -y1, + r: markSize / 2 || markR || 5 + }), + className: 'link-point-top', + name: 'link-point-top' + }); + } + + if (left) { + // up down left right 四个方向的坐标均不相同 + var x1 = Math.cos((18 + 72 * 2) / 180 * Math.PI) * outerR; + var y1 = Math.sin((18 + 72 * 2) / 180 * Math.PI) * outerR; // left circle + + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, markStyle), { + x: x1, + y: -y1, + r: markSize / 2 || markR || 5 + }), + className: 'link-point-left', + name: 'link-point-left' + }); + } + + if (leftBottom) { + // up down left right 四个方向的坐标均不相同 + var x1 = Math.cos((18 + 72 * 3) / 180 * Math.PI) * outerR; + var y1 = Math.sin((18 + 72 * 3) / 180 * Math.PI) * outerR; // left bottom circle + + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, markStyle), { + x: x1, + y: -y1, + r: markSize / 2 || markR || 5 + }), + className: 'link-point-left-bottom', + name: 'link-point-left-bottom' + }); + } + + if (rightBottom) { + // up down left right 四个方向的坐标均不相同 + var x1 = Math.cos((18 + 72 * 4) / 180 * Math.PI) * outerR; + var y1 = Math.sin((18 + 72 * 4) / 180 * Math.PI) * outerR; // left bottom circle + + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, markStyle), { + x: x1, + y: -y1, + r: markSize / 2 || markR || 5 + }), + className: 'link-point-right-bottom', + name: 'link-point-right-bottom' + }); + } + }, + getPath: function getPath(cfg) { + var size = this.getSize(cfg); + var outerR = size[0]; + var defaultInnerR = outerR * 3 / 8; + var innerR = cfg.innerR || defaultInnerR; + var path = []; + + for (var i = 0; i < 5; i++) { + var x1 = Math.cos((18 + 72 * i) / 180 * Math.PI) * outerR; + var y1 = Math.sin((18 + 72 * i) / 180 * Math.PI) * outerR; + var x2 = Math.cos((54 + 72 * i) / 180 * Math.PI) * innerR; + var y2 = Math.sin((54 + 72 * i) / 180 * Math.PI) * innerR; + + if (i === 0) { + path.push(['M', x1, -y1]); + } else { + path.push(['L', x1, -y1]); + } + + path.push(['L', x2, -y2]); + } + + path.push(['Z']); + return path; + }, + + /** + * 获取节点的样式，供基于该节点自定义时使用 + * @param {Object} cfg 节点数据模型 + * @return {Object} 节点的样式 + */ + getShapeStyle: function getShapeStyle(cfg) { + var defaultStyle = this.getOptions(cfg).style; + var strokeStyle = { + stroke: cfg.color + }; // 如果设置了color，则覆盖原来默认的 stroke 属性。但 cfg 中但 stroke 属性优先级更高 + + var style = mix({}, defaultStyle, strokeStyle); + var path = this.getPath(cfg); + + var styles = __assign$r({ + path: path + }, style); + + return styles; + }, + update: function update(cfg, item) { + var group = item.getContainer(); // 这里不传 cfg 参数是因为 cfg.style 需要最后覆盖样式 + + var defaultStyle = this.getOptions({}).style; + var path = this.getPath(cfg); // 下面这些属性需要覆盖默认样式与目前样式，但若在 cfg 中有指定则应该被 cfg 的相应配置覆盖。 + + var strokeStyle = { + stroke: cfg.color, + path: path + }; // 与 getShapeStyle 不同在于，update 时需要获取到当前的 style 进行融合。即新传入的配置项中没有涉及的属性，保留当前的配置。 + + var keyShape = item.get('keyShape'); + var style = mix({}, defaultStyle, keyShape.attr(), strokeStyle); + style = mix(style, cfg.style); + this.updateShape(cfg, item, style, true); + this.updateLinkPoints(cfg, group); + }, + + /** + * 更新linkPoints + * @param {Object} cfg 节点数据配置项 + * @param {Group} group Item所在的group + */ + updateLinkPoints: function updateLinkPoints(cfg, group) { + var defaultLinkPoints = this.getOptions({}).linkPoints; + var markLeft = group.find(function (element) { + return element.get('className') === 'link-point-left'; + }); + var markRight = group.find(function (element) { + return element.get('className') === 'link-point-right'; + }); + var markTop = group.find(function (element) { + return element.get('className') === 'link-point-top'; + }); + var markLeftBottom = group.find(function (element) { + return element.get('className') === 'link-point-left-bottom'; + }); + var markRightBottom = group.find(function (element) { + return element.get('className') === 'link-point-right-bottom'; + }); + var currentLinkPoints = defaultLinkPoints; + var existLinkPoint = markLeft || markRight || markTop || markLeftBottom || markRightBottom; + + if (existLinkPoint) { + currentLinkPoints = existLinkPoint.attr(); + } + + var linkPoints = mix({}, currentLinkPoints, cfg.linkPoints); + var markFill = linkPoints.fill, + markStroke = linkPoints.stroke, + borderWidth = linkPoints.lineWidth; + var markSize = linkPoints.size / 2; + if (!markSize) markSize = linkPoints.r; + + var _a = cfg.linkPoints ? cfg.linkPoints : { + left: undefined, + right: undefined, + top: undefined, + leftBottom: undefined, + rightBottom: undefined + }, + left = _a.left, + right = _a.right, + top = _a.top, + leftBottom = _a.leftBottom, + rightBottom = _a.rightBottom; + + var size = this.getSize(cfg); + var outerR = size[0]; + var styles = { + r: markSize, + fill: markFill, + stroke: markStroke, + lineWidth: borderWidth + }; + var x = Math.cos((18 + 72 * 0) / 180 * Math.PI) * outerR; + var y = Math.sin((18 + 72 * 0) / 180 * Math.PI) * outerR; + + if (markRight) { + if (!right && right !== undefined) { + markRight.remove(); + } else { + markRight.attr(__assign$r(__assign$r({}, styles), { + x: x, + y: -y + })); + } + } else if (right) { + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, styles), { + x: x, + y: -y + }), + className: 'link-point-right', + name: 'link-point-right', + isAnchorPoint: true + }); + } + + x = Math.cos((18 + 72 * 1) / 180 * Math.PI) * outerR; + y = Math.sin((18 + 72 * 1) / 180 * Math.PI) * outerR; + + if (markTop) { + if (!top && top !== undefined) { + markTop.remove(); + } else { + markTop.attr(__assign$r(__assign$r({}, styles), { + x: x, + y: -y + })); + } + } else if (top) { + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, styles), { + x: x, + y: -y + }), + className: 'link-point-top', + name: 'link-point-top', + isAnchorPoint: true + }); + } + + x = Math.cos((18 + 72 * 2) / 180 * Math.PI) * outerR; + y = Math.sin((18 + 72 * 2) / 180 * Math.PI) * outerR; + + if (markLeft) { + if (!left && left !== undefined) { + markLeft.remove(); + } else { + markLeft.attr(__assign$r(__assign$r({}, styles), { + x: x, + y: -y + })); + } + } else if (left) { + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, styles), { + x: x, + y: -y + }), + className: 'link-point-left', + name: 'link-point-left', + isAnchorPoint: true + }); + } + + x = Math.cos((18 + 72 * 3) / 180 * Math.PI) * outerR; + y = Math.sin((18 + 72 * 3) / 180 * Math.PI) * outerR; + + if (markLeftBottom) { + if (!leftBottom && leftBottom !== undefined) { + markLeftBottom.remove(); + } else { + markLeftBottom.attr(__assign$r(__assign$r({}, styles), { + x: x, + y: -y + })); + } + } else if (leftBottom) { + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, styles), { + x: x, + y: -y + }), + className: 'link-point-left-bottom', + name: 'link-point-left-bottom', + isAnchorPoint: true + }); + } + + x = Math.cos((18 + 72 * 4) / 180 * Math.PI) * outerR; + y = Math.sin((18 + 72 * 4) / 180 * Math.PI) * outerR; + + if (markRightBottom) { + if (!rightBottom && rightBottom !== undefined) { + markLeftBottom.remove(); + } else { + markRightBottom.attr(__assign$r(__assign$r({}, styles), { + x: x, + y: -y + })); + } + } else if (rightBottom) { + group.addShape('circle', { + attrs: __assign$r(__assign$r({}, styles), { + x: x, + y: -y + }), + className: 'link-point-right-bottom', + name: 'link-point-right-bottom', + isAnchorPoint: true + }); + } + } +}, 'single-node'); + +var getBBoxFromPoint = function getBBoxFromPoint(point) { + var x = point.x, + y = point.y; + return { + x: x, + y: y, + centerX: x, + centerY: y, + minX: x, + minY: y, + maxX: x, + maxY: y, + height: 0, + width: 0 + }; +}; +var getBBoxFromPoints = function getBBoxFromPoints(points) { + if (points === void 0) { + points = []; + } + + var xs = []; + var ys = []; + points.forEach(function (p) { + xs.push(p.x); + ys.push(p.y); + }); + var minX = Math.min.apply(Math, xs); + var maxX = Math.max.apply(Math, xs); + var minY = Math.min.apply(Math, ys); + var maxY = Math.max.apply(Math, ys); + return { + centerX: (minX + maxX) / 2, + centerY: (minY + maxY) / 2, + maxX: maxX, + maxY: maxY, + minX: minX, + minY: minY, + height: maxY - minY, + width: maxX - minX + }; +}; +var filterConnectPoints = function filterConnectPoints(points) { + // pre-process: remove duplicated points + var result = []; + var pointsMap = {}; + var pointsLength = points.length; + + for (var i = pointsLength - 1; i >= 0; i--) { + var p = points[i]; + p.id = p.x + "|||" + p.y; + pointsMap[p.id] = p; + result.push(p); + } + + return result; +}; +var simplifyPolyline = function simplifyPolyline(points) { + return filterConnectPoints(points); +}; +var getExpandedBBox = function getExpandedBBox(bbox, offset) { + if (bbox.width || bbox.height) { + return { + centerX: bbox.centerX, + centerY: bbox.centerY, + minX: bbox.minX - offset, + minY: bbox.minY - offset, + maxX: bbox.maxX + offset, + maxY: bbox.maxY + offset, + height: bbox.height + 2 * offset, + width: bbox.width + 2 * offset + }; + } // when it is a point + + + return bbox; +}; +var isHorizontalPort = function isHorizontalPort(port, bbox) { + var dx = Math.abs(port.x - bbox.centerX); + var dy = Math.abs(port.y - bbox.centerY); + if (dx === 0 && dy === 0) return 0; + return dx / bbox.width > dy / bbox.height; +}; +var getExpandedBBoxPoint = function getExpandedBBoxPoint(bbox, // 将原来节点 bbox 扩展了 offset 后的 bbox，且被 gridSize 格式化 +point, // 被 gridSize 格式化后的位置（anchorPoint） +anotherPoint) { + var isHorizontal = isHorizontalPort(point, bbox); + + if (isHorizontal === 0) { + // 说明锚点是节点中心，linkCenter: true。需要根据两个节点的相对关系决定方向 + var x = bbox.centerX; + var y = bbox.centerY; + + if (anotherPoint.y < point.y) { + // 另一端在左上/右上方时，总是从上方走 + y = bbox.minY; + } else if (anotherPoint.x > point.x) { + // 另一端在右下方，往右边走 + x = bbox.maxX; + } else if (anotherPoint.x < point.x) { + // 另一端在左下方，往左边走 + x = bbox.minX; + } else if (anotherPoint.x === point.x) { + // 另一段在正下方，往下走 + y = bbox.maxY; + } + + return { + x: x, + y: y + }; + } + + if (isHorizontal) { + return { + x: point.x > bbox.centerX ? bbox.maxX : bbox.minX, + y: point.y + }; + } + + return { + x: point.x, + y: point.y > bbox.centerY ? bbox.maxY : bbox.minY + }; +}; +/** + * + * @param b1 + * @param b2 + */ + +var mergeBBox = function mergeBBox(b1, b2) { + var minX = Math.min(b1.minX, b2.minX); + var minY = Math.min(b1.minY, b2.minY); + var maxX = Math.max(b1.maxX, b2.maxX); + var maxY = Math.max(b1.maxY, b2.maxY); + return { + centerX: (minX + maxX) / 2, + centerY: (minY + maxY) / 2, + minX: minX, + minY: minY, + maxX: maxX, + maxY: maxY, + height: maxY - minY, + width: maxX - minX + }; +}; +var getPointsFromBBox = function getPointsFromBBox(bbox) { + // anticlockwise + // const { minX, minY, maxX, maxY } = bbox; + return [{ + x: bbox.minX, + y: bbox.minY + }, { + x: bbox.maxX, + y: bbox.minY + }, { + x: bbox.maxX, + y: bbox.maxY + }, { + x: bbox.minX, + y: bbox.maxY + }]; +}; +var isPointOutsideBBox = function isPointOutsideBBox(point, bbox) { + var x = point.x, + y = point.y; + return x < bbox.minX || x > bbox.maxX || y < bbox.minY || y > bbox.maxY; +}; +var getBBoxXCrossPoints = function getBBoxXCrossPoints(bbox, x) { + if (x < bbox.minX || x > bbox.maxX) { + return []; + } + + return [{ + x: x, + y: bbox.minY + }, { + x: x, + y: bbox.maxY + }]; +}; +var getBBoxYCrossPoints = function getBBoxYCrossPoints(bbox, y) { + if (y < bbox.minY || y > bbox.maxY) { + return []; + } + + return [{ + x: bbox.minX, + y: y + }, { + x: bbox.maxX, + y: y + }]; +}; +var getBBoxCrossPointsByPoint = function getBBoxCrossPointsByPoint(bbox, point) { + return getBBoxXCrossPoints(bbox, point.x).concat(getBBoxYCrossPoints(bbox, point.y)); +}; +/** + * 曼哈顿距离 + */ + +var distance = function distance(p1, p2) { + return Math.abs(p1.x - p2.x) + Math.abs(p1.y - p2.y); +}; +/** + * 如果 points 中的一个节点 x 与 p 相等，则消耗 -2。y 同 + * 即优先选择和 points 在同一水平线 / 垂直线上的点 + */ +// eslint-disable-next-line @typescript-eslint/naming-convention + +var _costByPoints = function _costByPoints(p, points) { + var offset = -2; + var result = 0; + points.forEach(function (point) { + if (point) { + if (p.x === point.x) { + result += offset; + } + + if (p.y === point.y) { + result += offset; + } + } + }); + return result; +}; +/** + * ps 经过 p 到 pt 的距离，减去其他路过节点造成的消耗 + */ + +var heuristicCostEstimate = function heuristicCostEstimate(p, ps, pt, source, target) { + return distance(p, ps) + distance(p, pt) + _costByPoints(p, [ps, pt, source, target]); +}; +var reconstructPath = function reconstructPath(pathPoints, pointById, cameFrom, currentId, iterator) { + if (iterator === void 0) { + iterator = 0; + } + + pathPoints.unshift(pointById[currentId]); + + if (cameFrom[currentId] && cameFrom[currentId] !== currentId && iterator <= 100) { + reconstructPath(pathPoints, pointById, cameFrom, cameFrom[currentId], iterator + 1); + } +}; +/** + * 从 arr 中删去 item + */ + +var removeFrom = function removeFrom(arr, item) { + var index = arr.indexOf(item); + + if (index > -1) { + arr.splice(index, 1); + } +}; +var isSegmentsIntersected = function isSegmentsIntersected(p0, p1, p2, p3) { + var v1x = p2.x - p0.x; + var v1y = p2.y - p0.y; + var v2x = p3.x - p0.x; + var v2y = p3.y - p0.y; + var v3x = p2.x - p1.x; + var v3y = p2.y - p1.y; + var v4x = p3.x - p1.x; + var v4y = p3.y - p1.y; + var pd1 = v1x * v2y - v1y * v2x; + var pd2 = v3x * v4y - v3y * v4x; + var pd3 = v1x * v3y - v1y * v3x; + var pd4 = v2x * v4y - v2y * v4x; + return pd1 * pd2 <= 0 && pd3 * pd4 <= 0; +}; +var isSegmentCrossingBBox = function isSegmentCrossingBBox(p1, p2, bbox) { + if (bbox.width || bbox.height) { + var _a = getPointsFromBBox(bbox), + pa = _a[0], + pb = _a[1], + pc = _a[2], + pd = _a[3]; + + return isSegmentsIntersected(p1, p2, pa, pb) || isSegmentsIntersected(p1, p2, pa, pd) || isSegmentsIntersected(p1, p2, pb, pc) || isSegmentsIntersected(p1, p2, pc, pd); + } + + return false; +}; +/** + * 在 points 中找到满足 x 或 y 和 point 的 x 或 y 相等，且与 point 连线不经过 bbox1 与 bbox2 的点 + */ + +var getNeighborPoints = function getNeighborPoints(points, point, bbox1, bbox2) { + var neighbors = []; + points.forEach(function (p) { + if (p === point) return; + + if (p.x === point.x || p.y === point.y) { + if (isSegmentCrossingBBox(p, point, bbox1) || isSegmentCrossingBBox(p, point, bbox2)) return; + neighbors.push(p); + } + }); + return filterConnectPoints(neighbors); +}; +var pathFinder$1 = function pathFinder(points, start, goal, sBBox, tBBox, os, ot) { + // A-Star Algorithm + var closedSet = []; + var openSet = [start]; + var cameFrom = {}; + var gScore = {}; // all default values are Infinity + + var fScore = {}; // all default values are Infinity + + gScore[start.id] = 0; + fScore[start.id] = heuristicCostEstimate(start, goal, start); + var pointById = {}; + points.forEach(function (p) { + pointById[p.id] = p; + }); + var current, lowestFScore; + + while (openSet.length) { + current = undefined; + lowestFScore = Infinity; // 找到 openSet 中 fScore 最小的点 + + openSet.forEach(function (p) { + if (fScore[p.id] <= lowestFScore) { + lowestFScore = fScore[p.id]; + current = p; + } + }); // 若 openSet 中 fScore 最小的点就是终点 + + if (current === goal) { + // ending condition + var pathPoints = []; + reconstructPath(pathPoints, pointById, cameFrom, goal.id); + return pathPoints; + } + + removeFrom(openSet, current); + closedSet.push(current); + getNeighborPoints(points, current, sBBox, tBBox).forEach(function (neighbor) { + if (closedSet.indexOf(neighbor) !== -1) { + return; + } + + if (openSet.indexOf(neighbor) === -1) { + openSet.push(neighbor); + } + + var tentativeGScore = fScore[current.id] + distance(current, neighbor); // + distance(neighbor, goal); + + if (gScore[neighbor.id] && tentativeGScore >= gScore[neighbor.id]) { + return; + } + + cameFrom[neighbor.id] = current.id; + gScore[neighbor.id] = tentativeGScore; + fScore[neighbor.id] = gScore[neighbor.id] + heuristicCostEstimate(neighbor, goal, start, os, ot); + }); + } // throw new Error('Cannot find path'); + + + return [start, goal]; +}; +var isBending = function isBending(p0, p1, p2) { + return !(p0.x === p1.x && p1.x === p2.x || p0.y === p1.y && p1.y === p2.y); +}; +var getBorderRadiusPoints = function getBorderRadiusPoints(p0, p1, p2, r) { + var d0 = distance(p0, p1); + var d1 = distance(p2, p1); + + if (d0 < r) { + r = d0; + } + + if (d1 < r) { + r = d1; + } + + var ps = { + x: p1.x - r / d0 * (p1.x - p0.x), + y: p1.y - r / d0 * (p1.y - p0.y) + }; + var pt = { + x: p1.x - r / d1 * (p1.x - p2.x), + y: p1.y - r / d1 * (p1.y - p2.y) + }; + return [ps, pt]; +}; +var getPathWithBorderRadiusByPolyline = function getPathWithBorderRadiusByPolyline(points, borderRadius) { + var pathSegments = []; + var startPoint = points[0]; + pathSegments.push("M" + startPoint.x + " " + startPoint.y); + points.forEach(function (p, i) { + var p1 = points[i + 1]; + var p2 = points[i + 2]; + + if (p1 && p2) { + if (isBending(p, p1, p2)) { + var _a = getBorderRadiusPoints(p, p1, p2, borderRadius), + ps = _a[0], + pt = _a[1]; + + pathSegments.push("L" + ps.x + " " + ps.y); + pathSegments.push("Q" + p1.x + " " + p1.y + " " + pt.x + " " + pt.y); + pathSegments.push("L" + pt.x + " " + pt.y); + } else { + pathSegments.push("L" + p1.x + " " + p1.y); + } + } else if (p1) { + pathSegments.push("L" + p1.x + " " + p1.y); + } + }); + return pathSegments.join(''); +}; +var getPolylinePoints = function getPolylinePoints(start, end, sNode, tNode, offset) { + var sBBox, tBBox; + + if (!sNode || !sNode.getType()) { + sBBox = getBBoxFromPoint(start); + } else if (sNode.getType() === 'combo') { + var sNodeKeyShape = sNode.getKeyShape(); + sBBox = sNodeKeyShape.getCanvasBBox() || getBBoxFromPoint(start); + sBBox.centerX = (sBBox.minX + sBBox.maxX) / 2; + sBBox.centerY = (sBBox.minY + sBBox.maxY) / 2; + } else { + sBBox = sNode.getBBox(); + } + + if (!tNode || !tNode.getType()) { + tBBox = getBBoxFromPoint(end); + } else if (tNode.getType() === 'combo') { + var tNodeKeyShape = tNode.getKeyShape(); + tBBox = tNodeKeyShape.getCanvasBBox() || getBBoxFromPoint(end); + tBBox.centerX = (tBBox.minX + tBBox.maxX) / 2; + tBBox.centerY = (tBBox.minY + tBBox.maxY) / 2; + } else { + tBBox = tNode && tNode.getBBox(); + } // if (isBBoxesOverlapping(sBBox, tBBox)) { + // // source and target nodes are overlapping + // return simplifyPolyline(getSimplePolyline(start, end)); + // } + + + var sxBBox = getExpandedBBox(sBBox, offset); + var txBBox = getExpandedBBox(tBBox, offset); // if (isBBoxesOverlapping(sxBBox, txBBox)) { + // // the expanded bounding boxes of source and target nodes are overlapping + // return simplifyPolyline(getSimplePolyline(start, end)); + // } + + var sPoint = getExpandedBBoxPoint(sxBBox, start, end); + var tPoint = getExpandedBBoxPoint(txBBox, end, start); + var lineBBox = getBBoxFromPoints([sPoint, tPoint]); + var sMixBBox = mergeBBox(sxBBox, lineBBox); + var tMixBBox = mergeBBox(txBBox, lineBBox); + var connectPoints = []; + connectPoints = connectPoints.concat(getPointsFromBBox(sMixBBox)).concat(getPointsFromBBox(tMixBBox)); + var centerPoint = { + x: (start.x + end.x) / 2, + y: (start.y + end.y) / 2 + }; + [lineBBox, sMixBBox, tMixBBox].forEach(function (bbox) { + connectPoints = connectPoints.concat(getBBoxCrossPointsByPoint(bbox, centerPoint).filter(function (p) { + return isPointOutsideBBox(p, sxBBox) && isPointOutsideBBox(p, txBBox); + })); + }); + [{ + x: sPoint.x, + y: tPoint.y + }, { + x: tPoint.x, + y: sPoint.y + }].forEach(function (p) { + // impossible!! + if (isPointOutsideBBox(p, sxBBox) && isPointOutsideBBox(p, txBBox) // && + // isPointInsideBBox(p, sMixBBox) && isPointInsideBBox(p, tMixBBox) + ) { + connectPoints.push(p); + } + }); + connectPoints.unshift(sPoint); + connectPoints.push(tPoint); // filter out dulplicated points in connectPoints + + connectPoints = filterConnectPoints(connectPoints); // , sxBBox, txBBox, outerBBox + + var pathPoints = pathFinder$1(connectPoints, sPoint, tPoint, sBBox, tBBox, start, end); + pathPoints.unshift(start); + pathPoints.push(end); + return simplifyPolyline(pathPoints); +}; + +/** + * 通过配置不同的 costFunc, distFunc, constraints 可以得到不同效果的 router + * generalRouter: 不限制搜索时的移动方向，避开障碍即可 + * orthogonal: 线必须沿着竖直或水平方向（4个方向） + * octolinearRouter: 线沿着竖直、水平、对角线方向（8个方向） + */ + +var manhattanDist = function manhattanDist(p1, p2) { + return Math.abs(p1.x - p2.x) + Math.abs(p1.y - p2.y); +}; + +var simplePolyline = function simplePolyline(start, end, startNode, endNode, cfg) { + // console.warn('fallbackRoute: simple polyline path'); + return simplifyPolyline(getPolylinePoints(start, end, startNode, endNode, cfg.offset)); +}; // getPolylinePoints + + +var defaultCfg = { + offset: 20, + maxAllowedDirectionChange: Math.PI / 2, + maximumLoops: 2000, + gridSize: 10, + directions: [{ + stepX: 1, + stepY: 0 + }, { + stepX: -1, + stepY: 0 + }, { + stepX: 0, + stepY: 1 + }, { + stepX: 0, + stepY: -1 + } // top + ], + + get penalties() { + return { + 0: 0, + 45: this.gridSize / 2, + 90: this.gridSize / 2 + }; + }, + + distFunc: manhattanDist, + fallbackRoute: simplePolyline +}; + +var pos2GridIx = function pos2GridIx(pos, gridSize) { + var gridIx = Math.round(Math.abs(pos / gridSize)); + var sign = pos < 0 ? -1 : 1; + return gridIx < 0 ? 0 : sign * gridIx; +}; + +var getObstacleMap = function getObstacleMap(items, gridSize, offset) { + var map = {}; + items.forEach(function (item) { + // create-edge 时，当边类型为 polyline 时 endNode 为 null + if (!item) return; + var bbox = getExpandedBBox(item.getBBox(), offset); + + for (var x = pos2GridIx(bbox.minX, gridSize); x <= pos2GridIx(bbox.maxX, gridSize); x += 1) { + for (var y = pos2GridIx(bbox.minY, gridSize); y <= pos2GridIx(bbox.maxY, gridSize); y += 1) { + map[x + "|||" + y] = true; + } + } + }); + return map; +}; +/** + * 方向角：计算从 p1 到 p2 的射线与水平线形成的夹角度数（顺时针从右侧0°转到该射线的角度） + * @param p1 PolyPoint + * @param p2 PolyPoint + */ + + +var getDirectionAngle = function getDirectionAngle(p1, p2) { + var deltaX = p2.x - p1.x; + var deltaY = p2.y - p1.y; + + if (deltaX || deltaY) { + return Math.atan2(deltaY, deltaX); + } + + return 0; +}; +/** + * 方向角的改变，取小于180度角 + * @param angle1 + * @param angle2 + */ + + +var getAngleDiff = function getAngleDiff(angle1, angle2) { + var directionChange = Math.abs(angle1 - angle2); + return directionChange > Math.PI ? 2 * Math.PI - directionChange : directionChange; // return directionChange > 180 ? 360 - directionChange : directionChange; +}; // Path finder // + + +var estimateCost = function estimateCost(from, endPoints, distFunc) { + var min = Infinity; + + for (var i = 0, len = endPoints.length; i < len; i++) { + var cost = distFunc(from, endPoints[i]); + + if (cost < min) { + min = cost; + } + } + + return min; +}; // 计算考虑 offset 后的 BBox 上的连接点 + + +var getBoxPoints = function getBoxPoints(point, // 被 gridSize 格式化后的位置（anchorPoint） +oriPoint, // 未被 gridSize 格式化的位置（anchorPoint） +node, // 原始节点，用于获取 bbox +anotherPoint, // 另一端被 gridSize 格式化后的位置 +cfg) { + var points = []; // create-edge 生成边的过程中，endNode 为 null + + if (!node) { + return [point]; + } + + var directions = cfg.directions, + offset = cfg.offset; + var bbox = node.getBBox(); + var isInside = oriPoint.x > bbox.minX && oriPoint.x < bbox.maxX && oriPoint.y > bbox.minY && oriPoint.y < bbox.maxY; + var expandBBox = getExpandedBBox(bbox, offset); + + for (var i in expandBBox) { + expandBBox[i] = pos2GridIx(expandBBox[i], cfg.gridSize); + } + + if (isInside) { + // 如果 anchorPoint 在节点内部，允许第一段线穿过节点 + for (var _i = 0, directions_1 = directions; _i < directions_1.length; _i++) { + var dir = directions_1[_i]; + var bounds = [[{ + x: expandBBox.minX, + y: expandBBox.minY + }, { + x: expandBBox.maxX, + y: expandBBox.minY + }], [{ + x: expandBBox.minX, + y: expandBBox.minY + }, { + x: expandBBox.minX, + y: expandBBox.maxY + }], [{ + x: expandBBox.maxX, + y: expandBBox.minY + }, { + x: expandBBox.maxX, + y: expandBBox.maxY + }], [{ + x: expandBBox.minX, + y: expandBBox.maxY + }, { + x: expandBBox.maxX, + y: expandBBox.maxY + }]]; + + for (var i = 0; i < 4; i++) { + var boundLine = bounds[i]; + var insterctP_1 = Util.getLineIntersect(point, { + x: point.x + dir.stepX * expandBBox.width, + y: point.y + dir.stepY * expandBBox.height + }, boundLine[0], boundLine[1]); + + if (insterctP_1 && !isSegmentCrossingBBox(point, insterctP_1, bbox)) { + insterctP_1.id = insterctP_1.x + "|||" + insterctP_1.y; + points.push(insterctP_1); + } + } + } + + return points; + } // 如果 anchorPoint 在节点上，只有一个可选方向 + + + var insterctP = getExpandedBBoxPoint(expandBBox, point, anotherPoint); + insterctP.id = insterctP.x + "|||" + insterctP.y; + return [insterctP]; +}; + +var getDirectionChange = function getDirectionChange(current, neighbor, cameFrom, scaleStartPoint) { + var directionAngle = getDirectionAngle(current, neighbor); + + if (!cameFrom[current.id]) { + var startAngle = getDirectionAngle(scaleStartPoint, current); + return getAngleDiff(startAngle, directionAngle); + } + + var prevDirectionAngle = getDirectionAngle({ + x: cameFrom[current.id].x, + y: cameFrom[current.id].y + }, current); + return getAngleDiff(prevDirectionAngle, directionAngle); +}; + +var getControlPoints = function getControlPoints(current, cameFrom, scaleStartPoint, endPoint, startPoint, scaleEndPoint, gridSize) { + var controlPoints = [endPoint]; + var currentId = current.id; + var currentX = current.x; + var currentY = current.y; + var lastPoint = { + x: currentX, + y: currentY, + id: currentId + }; + + if (getDirectionChange(lastPoint, scaleEndPoint, cameFrom, scaleStartPoint)) { + // if (scaleEndPoint.x === endPoint.x && scaleEndPoint.y === endPoint.y) + // controlPoints.unshift({ + // x: endPoint.x, + // y: endPoint.y + // }) + // else + // controlPoints.unshift({ + // x: lastPoint.x * gridSize, + // y: lastPoint.y * gridSize, + // }); + controlPoints.unshift({ + x: scaleEndPoint.x === endPoint.x ? endPoint.x : lastPoint.x * gridSize, + y: scaleEndPoint.y === endPoint.y ? endPoint.y : lastPoint.y * gridSize + }); + } + + while (cameFrom[currentId] && cameFrom[currentId].id !== currentId) { + var point = { + x: currentX, + y: currentY, + id: currentId + }; + var preId = cameFrom[currentId].id; + var preX = cameFrom[currentId].x; + var preY = cameFrom[currentId].y; + var prePoint = { + x: preX, + y: preY, + id: preId + }; + var directionChange = getDirectionChange(prePoint, point, cameFrom, scaleStartPoint); + + if (directionChange) { + // if (prePoint.x === point.x && prePoint.y === point.y) + // controlPoints.unshift({ + // x: controlPoints[0].x, + // y: controlPoints[0].y + // }) + // else + // controlPoints.unshift({ + // x: prePoint.x * gridSize, + // y: prePoint.y * gridSize, + // }); + controlPoints.unshift({ + x: prePoint.x === point.x ? controlPoints[0].x : prePoint.x * gridSize, + y: prePoint.y === point.y ? controlPoints[0].y : prePoint.y * gridSize + }); + } + + currentId = preId; + currentX = preX; + currentY = preY; + } // 和startNode对齐 + + + var firstPoint = { + x: currentX, + y: currentY, + id: currentId + }; // if (firstPoint.x === scaleStartPoint.x && firstPoint.y === scaleStartPoint.y) { + // controlPoints[0].x = startPoint.x; + // controlPoints[0].y = startPoint.y; + // } + + controlPoints[0].x = firstPoint.x === scaleStartPoint.x ? startPoint.x : controlPoints[0].x; + controlPoints[0].y = firstPoint.y === scaleStartPoint.y ? startPoint.y : controlPoints[0].y; + controlPoints.unshift(startPoint); + return controlPoints; +}; + +var pathFinder = function pathFinder(startPoint, endPoint, startNode, endNode, routerCfg) { + if (isNaN(startPoint.x) || isNaN(endPoint.x)) return []; + var cfg = deepMix(defaultCfg, routerCfg); + cfg.obstacles = cfg.obstacles || []; + var gridSize = cfg.gridSize; + var map = getObstacleMap(cfg.obstacles.concat([startNode, endNode]), gridSize, cfg.offset); + var scaleStartPoint = { + x: pos2GridIx(startPoint.x, gridSize), + y: pos2GridIx(startPoint.y, gridSize) + }; + var scaleEndPoint = { + x: pos2GridIx(endPoint.x, gridSize), + y: pos2GridIx(endPoint.y, gridSize) + }; + startPoint.id = scaleStartPoint.x + "|||" + scaleStartPoint.y; + endPoint.id = scaleEndPoint.x + "|||" + scaleEndPoint.y; + var startPoints = getBoxPoints(scaleStartPoint, startPoint, startNode, scaleEndPoint, cfg); + var endPoints = getBoxPoints(scaleEndPoint, endPoint, endNode, scaleStartPoint, cfg); + startPoints.forEach(function (point) { + delete map[point.id]; + }); + endPoints.forEach(function (point) { + delete map[point.id]; + }); + var openSet = {}; + var closedSet = {}; + var cameFrom = {}; // 从起点到当前点已产生的 cost, default: Infinity + + var gScore = {}; // 起点经过当前点到达终点预估的 cost, default: Infinity + + var fScore = {}; // initialize + + for (var i = 0; i < startPoints.length; i++) { + var firstStep = startPoints[i]; + openSet[firstStep.id] = firstStep; // cameFrom[firstStep.id] = startPoint.id; + + gScore[firstStep.id] = 0; + fScore[firstStep.id] = estimateCost(firstStep, endPoints, cfg.distFunc); + } + + var remainLoops = cfg.maximumLoops; + var penalties = cfg.penalties; + var current, curCost, direction, neighbor, neighborCost, costFromStart, directionChange; + + while (Object.keys(openSet).length > 0 && remainLoops > 0) { + current = undefined; + curCost = Infinity; // 找到 openSet 中 fScore 最小的点 + + Object.keys(openSet).forEach(function (key) { + var id = openSet[key].id; + + if (fScore[id] <= curCost) { + curCost = fScore[id]; + current = openSet[id]; + } + }); + if (!current) break; // 如果 fScore 最小的点就是终点 + + if (endPoints.findIndex(function (point) { + return point.x === current.x && point.y === current.y; + }) > -1) { + return getControlPoints(current, cameFrom, scaleStartPoint, endPoint, startPoint, scaleEndPoint, gridSize); + } + + delete openSet[current.id]; + closedSet[current.id] = true; // 获取符合条件的下一步的候选连接点 + // 沿候选方向走一步 + + for (var i = 0; i < cfg.directions.length; i++) { + direction = cfg.directions[i]; + neighbor = { + x: current.x + direction.stepX, + y: current.y + direction.stepY, + id: Math.round(current.x) + direction.stepX + "|||" + (Math.round(current.y) + direction.stepY) + }; + if (closedSet[neighbor.id]) continue; + directionChange = getDirectionChange(current, neighbor, cameFrom, scaleStartPoint); + if (directionChange > cfg.maxAllowedDirectionChange) continue; + if (map[neighbor.id]) continue; // 如果交叉则跳过 + // 将候选点加入 openSet, 并计算每个候选点的 cost + + if (!openSet[neighbor.id]) { + openSet[neighbor.id] = neighbor; + } + + neighborCost = cfg.distFunc(current, neighbor) + (isNaN(penalties[directionChange]) ? gridSize : penalties[directionChange]); + costFromStart = gScore[current.id] + neighborCost; + + if (gScore[neighbor.id] && costFromStart >= gScore[neighbor.id]) { + continue; + } + + cameFrom[neighbor.id] = current; + gScore[neighbor.id] = costFromStart; + fScore[neighbor.id] = costFromStart + estimateCost(neighbor, endPoints, cfg.distFunc); + } + + remainLoops -= 1; + } + + return cfg.fallbackRoute(startPoint, endPoint, startNode, endNode, cfg); +}; + +registerEdge('polyline', { + options: { + color: BaseGlobal.defaultEdge.color, + size: BaseGlobal.defaultEdge.size, + style: { + radius: 0, + offset: 15, + x: 0, + y: 0, + stroke: BaseGlobal.defaultEdge.style.stroke, + lineAppendWidth: BaseGlobal.defaultEdge.style.lineAppendWidth + }, + // 文本样式配置 + labelCfg: { + style: { + fill: BaseGlobal.edgeLabel.style.fill, + fontSize: BaseGlobal.edgeLabel.style.fontSize + } + }, + routeCfg: { + obstacles: [], + maxAllowedDirectionChange: Math.PI, + maximumLoops: 500, + gridSize: 10 // 指定精度 + + }, + stateStyles: __assign$r({}, BaseGlobal.edgeStateStyles) + }, + shapeType: 'polyline', + // 文本位置 + labelPosition: 'center', + drawShape: function drawShape(cfg, group) { + var shapeStyle = this.getShapeStyle(cfg); + if (shapeStyle.radius === 0) delete shapeStyle.radius; + var keyShape = group.addShape('path', { + className: 'edge-shape', + name: 'edge-shape', + attrs: shapeStyle + }); + return keyShape; + }, + getShapeStyle: function getShapeStyle(cfg) { + var defaultStyle = this.options.style; + var strokeStyle = { + stroke: cfg.color + }; + var style = mix({}, defaultStyle, strokeStyle, cfg.style); + cfg = this.getPathPoints(cfg); + this.radius = style.radius; + this.offset = style.offset; + var startPoint = cfg.startPoint, + endPoint = cfg.endPoint; + var controlPoints = this.getControlPoints(cfg); + var points = [startPoint]; // 添加起始点 + // 添加控制点 + + if (controlPoints) { + points = points.concat(controlPoints); + } // 添加结束点 + + + points.push(endPoint); + var source = cfg.sourceNode; + var target = cfg.targetNode; + var radius = style.radius; + var defaultRouteCfg = this.options.routeCfg; + var routeCfg = mix({}, defaultRouteCfg, cfg.routeCfg); + routeCfg.offset = style.offset; + var path = this.getPath(points, source, target, radius, routeCfg); + + if (isArray$n(path) && path.length <= 1 || isString$3(path) && path.indexOf('L') === -1) { + path = 'M0 0, L0 0'; + } + + if (isNaN(startPoint.x) || isNaN(startPoint.y) || isNaN(endPoint.x) || isNaN(endPoint.y)) { + path = 'M0 0, L0 0'; + } + + var attrs = mix({}, BaseGlobal.defaultEdge.style, style, { + lineWidth: cfg.size, + path: path + }); + return attrs; + }, + updateShapeStyle: function updateShapeStyle(cfg, item) { + var group = item.getContainer(); + if (!item.isVisible()) return; + var strokeStyle = { + stroke: cfg.color + }; + var shape = group.find(function (element) { + return element.get('className') === 'edge-shape'; + }) || item.getKeyShape(); + var size = cfg.size; + cfg = this.getPathPoints(cfg); + var startPoint = cfg.startPoint, + endPoint = cfg.endPoint; + var controlPoints = this.getControlPoints(cfg); // || cfg.controlPoints; + + var points = [startPoint]; // 添加起始点 + // 添加控制点 + + if (controlPoints) { + points = points.concat(controlPoints); + } // 添加结束点 + + + points.push(endPoint); + var currentAttr = shape.attr(); + var previousStyle = mix({}, strokeStyle, currentAttr, cfg.style); + var source = cfg.sourceNode; + var target = cfg.targetNode; + var radius = previousStyle.radius; + var defaultRouteCfg = this.options.routeCfg; + var routeCfg = mix({}, defaultRouteCfg, cfg.routeCfg); + routeCfg.offset = previousStyle.offset; + var path = this.getPath(points, source, target, radius, routeCfg); + + if (isArray$n(path) && path.length <= 1 || isString$3(path) && path.indexOf('L') === -1) { + path = 'M0 0, L0 0'; + } + + if (isNaN(startPoint.x) || isNaN(startPoint.y) || isNaN(endPoint.x) || isNaN(endPoint.y)) { + path = 'M0 0, L0 0'; + } + + if (currentAttr.endArrow && previousStyle.endArrow === false) { + cfg.style.endArrow = { + path: '' + }; + } + + if (currentAttr.startArrow && previousStyle.startArrow === false) { + cfg.style.startArrow = { + path: '' + }; + } + + var style = mix(strokeStyle, shape.attr(), { + lineWidth: size, + path: path + }, cfg.style); + + if (shape) { + shape.attr(style); + } + }, + getPath: function getPath(points, source, target, radius, routeCfg) { + var offset = routeCfg.offset, + simple = routeCfg.simple; // 指定了控制点 + + if (!offset || points.length > 2) { + if (radius) { + return getPathWithBorderRadiusByPolyline(points, radius); + } + + var pathArray_1 = []; + each$2(points, function (point, index) { + if (index === 0) { + pathArray_1.push(['M', point.x, point.y]); + } else { + pathArray_1.push(['L', point.x, point.y]); + } + }); + return pathArray_1; + } // 未指定控制点 + + + var polylinePoints = simple ? getPolylinePoints(points[points.length - 1], points[0], target, source, offset) : pathFinder(points[0], points[points.length - 1], source, target, routeCfg); + if (!polylinePoints || !polylinePoints.length) return 'M0 0, L0 0'; + + if (radius) { + var res_1 = getPathWithBorderRadiusByPolyline(polylinePoints, radius); + return res_1; + } + + var res = Util.pointsToPolygon(polylinePoints); + return res; + } +}, 'single-edge'); + +var cloneEvent = G6Util.cloneEvent, + isNaN$1 = G6Util.isNaN; +var abs$1 = Math.abs; +var DRAG_OFFSET = 10; +var ALLOW_EVENTS$7 = ['shift', 'ctrl', 'alt', 'control']; +var DragCanvas = { + getDefaultCfg: function getDefaultCfg() { + return { + direction: 'both', + enableOptimize: false, + // drag-canvas 可拖动的扩展范围，默认为 0，即最多可以拖动一屏的位置 + // 当设置的值大于 0 时，即拖动可以超过一屏 + // 当设置的值小于 0 时，相当于缩小了可拖动范围 + // 具体实例可参考：https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*IFfoS67_HssAAAAAAAAAAAAAARQnAQ + scalableRange: 0, + allowDragOnItem: false + }; + }, + getEvents: function getEvents() { + return { + dragstart: 'onMouseDown', + drag: 'onMouseMove', + dragend: 'onMouseUp', + 'canvas:click': 'onMouseUp', + keyup: 'onKeyUp', + focus: 'onKeyUp', + keydown: 'onKeyDown', + touchstart: 'onTouchStart', + touchmove: 'onTouchMove', + touchend: 'onMouseUp' + }; + }, + updateViewport: function updateViewport(e) { + var origin = this.origin; + var clientX = +e.clientX; + var clientY = +e.clientY; + + if (isNaN$1(clientX) || isNaN$1(clientY)) { + return; + } + + var dx = clientX - origin.x; + var dy = clientY - origin.y; + + if (this.get('direction') === 'x') { + dy = 0; + } else if (this.get('direction') === 'y') { + dx = 0; + } + + this.origin = { + x: clientX, + y: clientY + }; + var width = this.graph.get('width'); + var height = this.graph.get('height'); + var graphCanvasBBox = this.graph.get('canvas').getCanvasBBox(); + + if (graphCanvasBBox.minX <= width + this.scalableRange && graphCanvasBBox.minX + dx > width + this.scalableRange || graphCanvasBBox.maxX + this.scalableRange >= 0 && graphCanvasBBox.maxX + this.scalableRange + dx < 0) { + dx = 0; + } + + if (graphCanvasBBox.minY <= height + this.scalableRange && graphCanvasBBox.minY + dy > height + this.scalableRange || graphCanvasBBox.maxY + this.scalableRange >= 0 && graphCanvasBBox.maxY + this.scalableRange + dy < 0) { + dy = 0; + } + + this.graph.translate(dx, dy); + }, + onTouchStart: function onTouchStart(e) { + var self = this; + var touches = e.originalEvent.touches; + var event1 = touches[0]; + var event2 = touches[1]; // 如果是双指操作，不允许拖拽画布 + + if (event1 && event2) { + return; + } + + e.preventDefault(); + self.onMouseDown(e); + }, + onMouseDown: function onMouseDown(e) { + var self = this; + var event = e.originalEvent; + + if (event && e.name !== G6Event.TOUCHSTART && event.button !== 0) { + return; + } + + if (e.name !== G6Event.TOUCHSTART && typeof window !== 'undefined' && window.event && !window.event.buttons && !window.event.button) { + return; + } + + if (!this.shouldBegin.call(this, e)) { + return; + } + + if (self.keydown) return; + var target = e.target; + var targetIsCanvas = target && target.isCanvas && target.isCanvas(); + if (!this.allowDragOnItem && !targetIsCanvas) return; + self.origin = { + x: e.clientX, + y: e.clientY + }; + self.dragging = false; + + if (this.enableOptimize) { + // 拖动 canvas 过程中隐藏所有的边及label + var graph = this.graph; + var edges = graph.getEdges(); + + for (var i = 0, len = edges.length; i < len; i++) { + var shapes = edges[i].get('group').get('children'); + if (!shapes) continue; + shapes.forEach(function (shape) { + shape.set('ori-visibility', shape.get('ori-visibility') || shape.get('visible')); + shape.hide(); + }); + } + + var nodes = graph.getNodes(); + + for (var j = 0, nodeLen = nodes.length; j < nodeLen; j++) { + var container = nodes[j].getContainer(); + var children = container.get('children'); + + for (var _i = 0, children_1 = children; _i < children_1.length; _i++) { + var child = children_1[_i]; + var isKeyShape = child.get('isKeyShape'); + + if (!isKeyShape) { + child.set('ori-visibility', child.get('ori-visibility') || child.get('visible')); + child.hide(); + } + } + } + } + }, + onTouchMove: function onTouchMove(e) { + var self = this; + var touches = e.originalEvent.touches; + var event1 = touches[0]; + var event2 = touches[1]; // 如果是双指操作，不允许拖拽画布，结束拖拽 + + if (event1 && event2) { + this.onMouseUp(e); + return; + } + + e.preventDefault(); + self.onMouseMove(e); + }, + onMouseMove: function onMouseMove(e) { + var graph = this.graph; + if (this.keydown) return; + var target = e.target; + var targetIsCanvas = target && target.isCanvas && target.isCanvas(); + if (!this.allowDragOnItem && !targetIsCanvas) return; + e = cloneEvent(e); + + if (!this.origin) { + return; + } + + if (!this.dragging) { + if (abs$1(this.origin.x - e.clientX) + abs$1(this.origin.y - e.clientY) < DRAG_OFFSET) { + return; + } + + if (this.shouldBegin.call(this, e)) { + e.type = 'dragstart'; + graph.emit('canvas:dragstart', e); + this.dragging = true; + } + } else { + e.type = 'drag'; + graph.emit('canvas:drag', e); + } + + if (this.shouldUpdate.call(this, e)) { + this.updateViewport(e); + } + }, + onMouseUp: function onMouseUp(e) { + var graph = this.graph; + if (this.keydown) return; + + if (this.enableOptimize) { + // 拖动结束后显示所有的边 + var edges = graph.getEdges(); + + for (var i = 0, len = edges.length; i < len; i++) { + var shapes = edges[i].get('group').get('children'); + if (!shapes) continue; + shapes.forEach(function (shape) { + var oriVis = shape.get('ori-visibility'); + if (oriVis) shape.show(); + }); + } + + var nodes = graph.getNodes(); + + for (var j = 0, nodeLen = nodes.length; j < nodeLen; j++) { + var container = nodes[j].getContainer(); + var children = container.get('children'); + + for (var _i = 0, children_2 = children; _i < children_2.length; _i++) { + var child = children_2[_i]; + var isKeyShape = child.get('isKeyShape'); + + if (!isKeyShape) { + var oriVis = child.get('ori-visibility'); + if (oriVis) child.show(); + } + } + } + } + + if (!this.dragging) { + this.origin = null; + return; + } + + e = cloneEvent(e); + + if (this.shouldEnd.call(this, e)) { + this.updateViewport(e); + } + + e.type = 'dragend'; + graph.emit('canvas:dragend', e); + this.endDrag(); + }, + endDrag: function endDrag() { + this.origin = null; + this.dragging = false; + this.dragbegin = false; + }, + onKeyDown: function onKeyDown(e) { + var self = this; + var code = e.key; + + if (!code) { + return; + } + + if (ALLOW_EVENTS$7.indexOf(code.toLowerCase()) > -1) { + self.keydown = true; + } else { + self.keydown = false; + } + }, + onKeyUp: function onKeyUp() { + this.keydown = false; + this.origin = null; + this.dragging = false; + this.dragbegin = false; + } +}; + +var DragNode = { + getDefaultCfg: function getDefaultCfg() { + return { + updateEdge: true, + delegateStyle: {}, + // 是否开启delegate + enableDelegate: false, + // 拖动节点过程中是否只改变 Combo 的大小，而不改变其结构 + onlyChangeComboSize: false, + // 拖动过程中目标 combo 状态样式 + comboActiveState: '', + selectedState: 'selected', + enableOptimize: false, + enableDebounce: false + }; + }, + getEvents: function getEvents() { + return { + 'node:dragstart': 'onDragStart', + 'node:drag': 'onDrag', + 'node:dragend': 'onDragEnd', + 'combo:dragenter': 'onDragEnter', + 'combo:dragleave': 'onDragLeave', + 'combo:drop': 'onDropCombo', + 'node:drop': 'onDropNode', + 'canvas:drop': 'onDropCanvas' + }; + }, + validationCombo: function validationCombo(item) { + if (!this.origin || !item || item.destroyed) { + return false; + } + + var type = item.getType(); + + if (type !== 'combo') { + return false; + } + + return true; + }, + + /** + * 开始拖动节点 + * @param evt + */ + onDragStart: function onDragStart(evt) { + var _this = this; + + if (!this.shouldBegin.call(this, evt)) { + return; + } + + var item = evt.item; + + if (!item || item.destroyed || item.hasLocked()) { + return; + } // 拖动时，设置拖动元素的 capture 为false，则不拾取拖动的元素 + + + var group = item.getContainer(); + group.set('capture', false); // 如果拖动的target 是linkPoints / anchorPoints 则不允许拖动 + + var target = evt.target; + + if (target) { + var isAnchorPoint = target.get('isAnchorPoint'); + + if (isAnchorPoint) { + return; + } + } + + var graph = this.graph; + this.targets = []; // 将节点拖入到指定的 Combo + + this.targetCombo = null; // 获取所有选中的元素 + + var nodes = graph.findAllByState('node', this.selectedState); + var currentNodeId = item.get('id'); // 当前拖动的节点是否是选中的节点 + + var dragNodes = nodes.filter(function (node) { + var nodeId = node.get('id'); + return currentNodeId === nodeId; + }); // 只拖动当前节点 + + if (dragNodes.length === 0) { + this.targets.push(item); + } else if (nodes.length > 1) { + // 拖动多个节点 + nodes.forEach(function (node) { + var locked = node.hasLocked(); + + if (!locked) { + _this.targets.push(node); + } + }); + } else { + this.targets.push(item); + } + + var beforeDragNodes = []; + this.targets.forEach(function (t) { + beforeDragNodes.push(clone$7(t.getModel())); + }); + this.set('beforeDragNodes', beforeDragNodes); + this.hidenEdge = {}; + + if (this.get('updateEdge') && this.enableOptimize && !this.enableDelegate) { + this.targets.forEach(function (node) { + var edges = node.getEdges(); + edges.forEach(function (edge) { + if (!edge.isVisible()) return; + _this.hidenEdge[edge] = true; + edge.hide(); + }); + }); + } + + this.origin = { + x: evt.x, + y: evt.y + }; + this.point = {}; + this.originPoint = {}; + }, + + /** + * 持续拖动节点 + * @param evt + */ + onDrag: function onDrag(evt) { + var _this = this; + + if (!this.origin) { + return; + } + + if (!this.shouldUpdate(this, evt)) { + return; + } + + if (this.get('enableDelegate')) { + this.updateDelegate(evt); + } else { + if (this.enableDebounce) this.debounceUpdate({ + targets: this.targets, + graph: this.graph, + point: this.point, + origin: this.origin, + evt: evt, + updateEdge: this.get('updateEdge') + });else this.targets.map(function (target) { + _this.update(target, evt); + }); + } + }, + + /** + * 拖动结束，设置拖动元素capture为true，更新元素位置，如果是拖动涉及到 combo，则更新 combo 结构 + * @param evt + */ + onDragEnd: function onDragEnd(evt) { + var _this = this; + + if (!this.origin || !this.shouldEnd.call(this, evt)) { + return; + } // 拖动结束后，设置拖动元素 group 的 capture 为 true，允许拾取拖动元素 + + + var item = evt.item; + + if (item) { + var group = item.getContainer(); + group.set('capture', true); + } + + if (this.delegateRect) { + this.delegateRect.remove(); + this.delegateRect = null; + } + + this.updatePositions(evt); + + if (this.get('updateEdge') && this.enableOptimize && !this.enableDelegate) { + this.targets.forEach(function (node) { + var edges = node.getEdges(); + edges.forEach(function (edge) { + if (_this.hidenEdge[edge]) edge.show(); + edge.refresh(); + }); + }); + } + + this.hidenEdge = {}; + var graph = this.graph; // 拖动结束后，入栈 + + if (graph.get('enabledStack')) { + var stackData_1 = { + before: { + nodes: [], + edges: [], + combos: [] + }, + after: { + nodes: [], + edges: [], + combos: [] + } + }; + this.get('beforeDragNodes').forEach(function (model) { + stackData_1.before.nodes.push({ + id: model.id, + x: model.x, + y: model.y + }); + }); + this.targets.forEach(function (target) { + var targetModel = target.getModel(); + stackData_1.after.nodes.push({ + id: targetModel.id, + x: targetModel.x, + y: targetModel.y + }); + }); + graph.pushStack('update', clone$7(stackData_1)); + } // 拖动结束后emit事件，将当前操作的节点抛出去，目标节点为null + + + graph.emit('dragnodeend', { + items: this.targets, + targetItem: null + }); + this.point = {}; + this.origin = null; + this.originPoint = {}; + this.targets.length = 0; + this.targetCombo = null; + }, + + /** + * 拖动过程中将节点放置到 combo 上 + * @param evt + */ + onDropCombo: function onDropCombo(evt) { + var item = evt.item; + if (!this.validationCombo(item)) return; + this.updatePositions(evt); + var graph = this.graph; + + if (this.comboActiveState) { + graph.setItemState(item, this.comboActiveState, false); + } + + this.targetCombo = item; // 拖动结束后是动态改变 Combo 大小还是将节点从 Combo 中删除 + + if (this.onlyChangeComboSize) { + // 拖动节点结束后，动态改变 Combo 的大小 + graph.updateCombos(); + } else { + var targetComboModel_1 = item.getModel(); + this.targets.map(function (node) { + var nodeModel = node.getModel(); + + if (nodeModel.comboId !== targetComboModel_1.id) { + graph.updateComboTree(node, targetComboModel_1.id); + } + }); + graph.updateCombo(item); + } // 将节点拖动到 combo 上面，emit事件抛出当前操作的节点及目标 combo + + + graph.emit('dragnodeend', { + items: this.targets, + targetItem: this.targetCombo + }); + }, + onDropCanvas: function onDropCanvas(evt) { + var graph = this.graph; + if (!this.targets || this.targets.length === 0) return; + this.updatePositions(evt); + + if (this.onlyChangeComboSize) { + // 拖动节点结束后，动态改变 Combo 的大小 + graph.updateCombos(); + } else { + this.targets.map(function (node) { + // 拖动的节点有 comboId，即是从其他 combo 中拖出时才处理 + var model = node.getModel(); + + if (model.comboId) { + graph.updateComboTree(node); + } + }); + } + }, + + /** + * 拖动放置到某个 combo 中的子 node 上 + * @param evt + */ + onDropNode: function onDropNode(evt) { + if (!this.targets || this.targets.length === 0) return; + var self = this; + var item = evt.item; + this.updatePositions(evt); + var graph = self.graph; + var comboId = item.getModel().comboId; + + if (comboId) { + if (this.onlyChangeComboSize) { + graph.updateCombos(); + } else { + var combo = graph.findById(comboId); + + if (self.comboActiveState) { + graph.setItemState(combo, self.comboActiveState, false); + } + + this.targets.map(function (node) { + var nodeModel = node.getModel(); + + if (comboId !== nodeModel.comboId) { + graph.updateComboTree(node, comboId); + } + }); + graph.updateCombo(combo); + } + } else { + this.targets.map(function (node) { + var model = node.getModel(); + + if (model.comboId) { + graph.updateComboTree(node); + } + }); + } // 将节点拖动到另外个节点上面，emit 事件抛出当前操作的节点及目标节点 + + + graph.emit('dragnodeend', { + items: this.targets, + targetItem: item + }); + }, + + /** + * 将节点拖入到 Combo 中 + * @param evt + */ + onDragEnter: function onDragEnter(evt) { + var item = evt.item; + if (!this.validationCombo(item)) return; + var graph = this.graph; + + if (this.comboActiveState) { + graph.setItemState(item, this.comboActiveState, true); + } + }, + + /** + * 将节点从 Combo 中拖出 + * @param evt + */ + onDragLeave: function onDragLeave(evt) { + var item = evt.item; + if (!this.validationCombo(item)) return; + var graph = this.graph; + + if (this.comboActiveState) { + graph.setItemState(item, this.comboActiveState, false); + } + }, + updatePositions: function updatePositions(evt) { + var _this = this; + + if (!this.targets || this.targets.length === 0) return; // 当开启 delegate 时，拖动结束后需要更新所有已选中节点的位置 + + if (this.get('enableDelegate')) { + if (this.enableDebounce) this.debounceUpdate({ + targets: this.targets, + graph: this.graph, + point: this.point, + origin: this.origin, + evt: evt, + updateEdge: this.get('updateEdge'), + updateFunc: this.update + });else this.targets.map(function (node) { + return _this.update(node, evt); + }); + } + }, + + /** + * 更新节点 + * @param item 拖动的节点实例 + * @param evt + */ + update: function update(item, evt) { + var origin = this.origin; + var model = item.get('model'); + var nodeId = item.get('id'); + + if (!this.point[nodeId]) { + this.point[nodeId] = { + x: model.x || 0, + y: model.y || 0 + }; + } + + var x = evt.x - origin.x + this.point[nodeId].x; + var y = evt.y - origin.y + this.point[nodeId].y; + var pos = { + x: x, + y: y + }; + + if (this.get('updateEdge')) { + this.graph.updateItem(item, pos, false); + } else { + item.updatePosition(pos); + } + }, + + /** + * 限流更新节点 + * @param item 拖动的节点实例 + * @param evt + */ + debounceUpdate: debounce$1(function (event) { + var targets = event.targets, + graph = event.graph, + point = event.point, + origin = event.origin, + evt = event.evt, + updateEdge = event.updateEdge; + event.updateFunc; + targets.map(function (item) { + var model = item.get('model'); + var nodeId = item.get('id'); + + if (!point[nodeId]) { + point[nodeId] = { + x: model.x || 0, + y: model.y || 0 + }; + } + + var x = evt.x - origin.x + point[nodeId].x; + var y = evt.y - origin.y + point[nodeId].y; + var pos = { + x: x, + y: y + }; + + if (updateEdge) { + graph.updateItem(item, pos, false); + } else { + item.updatePosition(pos); + } + }); + }, 50, true), + + /** + * 更新拖动元素时的delegate + * @param {Event} e 事件句柄 + * @param {number} x 拖动单个元素时候的x坐标 + * @param {number} y 拖动单个元素时候的y坐标 + */ + updateDelegate: function updateDelegate(e) { + var graph = this.graph; + + if (!this.delegateRect) { + // 拖动多个 + var parent_1 = graph.get('group'); + var attrs = deepMix({}, Global.delegateStyle, this.delegateStyle); + + var _a = this.calculationGroupPosition(e), + cx = _a.x, + cy = _a.y, + width = _a.width, + height = _a.height, + minX = _a.minX, + minY = _a.minY; + + this.originPoint = { + x: cx, + y: cy, + width: width, + height: height, + minX: minX, + minY: minY + }; // model上的x, y是相对于图形中心的，delegateShape是g实例，x,y是绝对坐标 + + this.delegateRect = parent_1.addShape('rect', { + attrs: __assign$r({ + width: width, + height: height, + x: cx, + y: cy + }, attrs), + name: 'rect-delegate-shape' + }); + this.delegate = this.delegateRect; + this.delegateRect.set('capture', false); + } else { + var clientX = e.x - this.origin.x + this.originPoint.minX; + var clientY = e.y - this.origin.y + this.originPoint.minY; + this.delegateRect.attr({ + x: clientX, + y: clientY + }); + } + }, + + /** + * 计算delegate位置，包括左上角左边及宽度和高度 + * @memberof ItemGroup + * @return {object} 计算出来的delegate坐标信息及宽高 + */ + calculationGroupPosition: function calculationGroupPosition(evt) { + var nodes = this.targets; + + if (nodes.length === 0) { + nodes.push(evt.item); + } + + var minx = Infinity; + var maxx = -Infinity; + var miny = Infinity; + var maxy = -Infinity; // 获取已节点的所有最大最小x y值 + + for (var i = 0; i < nodes.length; i++) { + var element = nodes[i]; + var bbox = element.getBBox(); + var minX = bbox.minX, + minY = bbox.minY, + maxX = bbox.maxX, + maxY = bbox.maxY; + + if (minX < minx) { + minx = minX; + } + + if (minY < miny) { + miny = minY; + } + + if (maxX > maxx) { + maxx = maxX; + } + + if (maxY > maxy) { + maxy = maxY; + } + } + + var x = Math.floor(minx); + var y = Math.floor(miny); + var width = Math.ceil(maxx) - Math.floor(minx); + var height = Math.ceil(maxy) - Math.floor(miny); + return { + x: x, + y: y, + width: width, + height: height, + minX: minx, + minY: miny + }; + } +}; + +var ActivateRelations = { + getDefaultCfg: function getDefaultCfg() { + return { + trigger: 'mouseenter', + activeState: 'active', + inactiveState: 'inactive', + resetSelected: false, + shouldUpdate: function shouldUpdate() { + return true; + } + }; + }, + getEvents: function getEvents() { + if (this.get('trigger') === 'mouseenter') { + return { + 'node:mouseenter': 'setAllItemStates', + 'combo:mouseenter': 'setAllItemStates', + 'node:mouseleave': 'clearActiveState', + 'combo:mouseleave': 'clearActiveState' + }; + } + + return { + 'node:click': 'setAllItemStates', + 'combo:click': 'setAllItemStates', + 'canvas:click': 'clearAllItemStates' + }; + }, + setAllItemStates: function setAllItemStates(e) { + var item = e.item; + var graph = this.graph; + this.item = item; + + if (!this.shouldUpdate(e.item, { + event: e, + action: 'activate' + })) { + return; + } + + var self = this; + var activeState = this.activeState; + var inactiveState = this.inactiveState; + var nodes = graph.getNodes(); + var combos = graph.getCombos(); + var edges = graph.getEdges(); + var vEdges = graph.get('vedges'); + var nodeLength = nodes.length; + var comboLength = combos.length; + var edgeLength = edges.length; + var vEdgeLength = vEdges.length; + + for (var i = 0; i < nodeLength; i++) { + var node = nodes[i]; + var hasSelected = node.hasState('selected'); + + if (self.resetSelected) { + if (hasSelected) { + graph.setItemState(node, 'selected', false); + } + } + + graph.setItemState(node, activeState, false); + + if (inactiveState) { + graph.setItemState(node, inactiveState, true); + } + } + + for (var i = 0; i < comboLength; i++) { + var combo = combos[i]; + var hasSelected = combo.hasState('selected'); + + if (self.resetSelected) { + if (hasSelected) { + graph.setItemState(combo, 'selected', false); + } + } + + graph.setItemState(combo, activeState, false); + + if (inactiveState) { + graph.setItemState(combo, inactiveState, true); + } + } + + for (var i = 0; i < edgeLength; i++) { + var edge = edges[i]; + graph.setItemState(edge, activeState, false); + + if (inactiveState) { + graph.setItemState(edge, inactiveState, true); + } + } + + for (var i = 0; i < vEdgeLength; i++) { + var vEdge = vEdges[i]; + graph.setItemState(vEdge, activeState, false); + + if (inactiveState) { + graph.setItemState(vEdge, inactiveState, true); + } + } + + if (inactiveState) { + graph.setItemState(item, inactiveState, false); + } + + graph.setItemState(item, activeState, true); + var rEdges = item.getEdges(); + var rEdgeLegnth = rEdges.length; + + for (var i = 0; i < rEdgeLegnth; i++) { + var edge = rEdges[i]; + var otherEnd = void 0; + + if (edge.getSource() === item) { + otherEnd = edge.getTarget(); + } else { + otherEnd = edge.getSource(); + } + + if (inactiveState) { + graph.setItemState(otherEnd, inactiveState, false); + } + + graph.setItemState(otherEnd, activeState, true); + graph.setItemState(edge, inactiveState, false); + graph.setItemState(edge, activeState, true); + edge.toFront(); + } + + graph.emit('afteractivaterelations', { + item: e.item, + action: 'activate' + }); + }, + clearActiveState: function clearActiveState(e) { + var self = this; + var graph = self.get('graph'); + + if (!self.shouldUpdate(e.item, { + event: e, + action: 'deactivate' + })) { + return; + } + + var activeState = this.activeState; + var inactiveState = this.inactiveState; + var autoPaint = graph.get('autoPaint'); + graph.setAutoPaint(false); + var nodes = graph.getNodes(); + var combos = graph.getCombos(); + var edges = graph.getEdges(); + var vEdges = graph.get('vedges'); + var nodeLength = nodes.length; + var comboLength = combos.length; + var edgeLength = edges.length; + var vEdgeLength = vEdges.length; + + for (var i = 0; i < nodeLength; i++) { + var node = nodes[i]; + graph.clearItemStates(node, [activeState, inactiveState]); + } + + for (var i = 0; i < comboLength; i++) { + var combo = combos[i]; + graph.clearItemStates(combo, [activeState, inactiveState]); + } + + for (var i = 0; i < edgeLength; i++) { + var edge = edges[i]; + graph.clearItemStates(edge, [activeState, inactiveState, 'deactivate']); + } + + for (var i = 0; i < vEdgeLength; i++) { + var vEdge = vEdges[i]; + graph.clearItemStates(vEdge, [activeState, inactiveState, 'deactivate']); + } + + graph.paint(); + graph.setAutoPaint(autoPaint); + graph.emit('afteractivaterelations', { + item: e.item || self.get('item'), + action: 'deactivate' + }); + }, + clearAllItemStates: function clearAllItemStates(e) { + var self = this; + var graph = self.graph; + + if (!self.shouldUpdate(e.item, { + event: e, + action: 'deactivate' + })) { + return; + } + + var activeState = this.activeState; + var inactiveState = this.inactiveState; + var nodes = graph.getNodes(); + var edges = graph.getEdges(); + var nodeLength = nodes.length; + var edgeLength = edges.length; + + for (var i = 0; i < nodeLength; i++) { + var node = nodes[i]; + graph.clearItemStates(node, [activeState, inactiveState]); + } + + for (var i = 0; i < edgeLength; i++) { + var edge = edges[i]; + graph.clearItemStates(edge, [activeState, inactiveState, 'deactivate']); + } + + graph.emit('afteractivaterelations', { + item: e.item || self.get('item'), + action: 'deactivate' + }); + } +}; + +var min = Math.min, + max = Math.max, + abs = Math.abs; +var DEFAULT_TRIGGER$6 = 'shift'; +var ALLOW_EVENTS$6 = ['drag', 'shift', 'ctrl', 'alt', 'control']; +var BrushSelect = { + getDefaultCfg: function getDefaultCfg() { + return { + brushStyle: { + fill: '#EEF6FF', + fillOpacity: 0.4, + stroke: '#DDEEFE', + lineWidth: 1 + }, + onSelect: function onSelect() {}, + onDeselect: function onDeselect() {}, + selectedState: 'selected', + trigger: DEFAULT_TRIGGER$6, + includeEdges: true, + selectedEdges: [], + selectedNodes: [] + }; + }, + getEvents: function getEvents() { + // 检测输入是否合法 + if (!(ALLOW_EVENTS$6.indexOf(this.trigger.toLowerCase()) > -1)) { + this.trigger = DEFAULT_TRIGGER$6; + console.warn("Behavior brush-select 的 trigger 参数不合法，请输入 'drag'、'shift'、'ctrl' 或 'alt'"); + } + + if (this.trigger === 'drag') { + return { + dragstart: 'onMouseDown', + drag: 'onMouseMove', + dragend: 'onMouseUp', + 'canvas:click': 'clearStates' + }; + } + + return { + dragstart: 'onMouseDown', + drag: 'onMouseMove', + dragend: 'onMouseUp', + 'canvas:click': 'clearStates', + keyup: 'onKeyUp', + keydown: 'onKeyDown' + }; + }, + onMouseDown: function onMouseDown(e) { + // 按在node上面拖动时候不应该是框选 + var item = e.item; + var brush = this.brush; + + if (item) { + return; + } + + if (this.trigger !== 'drag' && !this.keydown) { + return; + } + + if (this.selectedNodes && this.selectedNodes.length !== 0) { + this.clearStates(); + } + + if (!brush) { + brush = this.createBrush(); + } + + this.originPoint = { + x: e.canvasX, + y: e.canvasY + }; + brush.attr({ + width: 0, + height: 0 + }); + brush.show(); + this.dragging = true; + }, + onMouseMove: function onMouseMove(e) { + if (!this.dragging) { + return; + } + + if (this.trigger !== 'drag' && !this.keydown) { + return; + } + + this.updateBrush(e); + }, + onMouseUp: function onMouseUp(e) { + this.graph; // TODO: 触发了 canvas:click 导致 clearStates + + if (!this.brush && !this.dragging) { + return; + } + + if (this.trigger !== 'drag' && !this.keydown) { + return; + } + + this.brush.remove(true); // remove and destroy + + this.brush = null; + this.getSelectedNodes(e); + this.dragging = false; + }, + clearStates: function clearStates() { + var _a = this, + graph = _a.graph, + selectedState = _a.selectedState; + + var nodes = graph.findAllByState('node', selectedState); + var edges = graph.findAllByState('edge', selectedState); + nodes.forEach(function (node) { + return graph.setItemState(node, selectedState, false); + }); + edges.forEach(function (edge) { + return graph.setItemState(edge, selectedState, false); + }); + this.selectedNodes = []; + this.selectedEdges = []; + + if (this.onDeselect) { + this.onDeselect(this.selectedNodes, this.selectedEdges); + } + + graph.emit('nodeselectchange', { + selectedItems: { + nodes: [], + edges: [] + }, + select: false + }); + }, + getSelectedNodes: function getSelectedNodes(e) { + var _this = this; + + var _a = this, + graph = _a.graph, + originPoint = _a.originPoint, + shouldUpdate = _a.shouldUpdate; + + var state = this.selectedState; + var p1 = { + x: e.x, + y: e.y + }; + var p2 = graph.getPointByCanvas(originPoint.x, originPoint.y); + var left = min(p1.x, p2.x); + var right = max(p1.x, p2.x); + var top = min(p1.y, p2.y); + var bottom = max(p1.y, p2.y); + var selectedNodes = []; + var selectedIds = []; + graph.getNodes().forEach(function (node) { + var bbox = node.getBBox(); + + if (bbox.centerX >= left && bbox.centerX <= right && bbox.centerY >= top && bbox.centerY <= bottom) { + if (shouldUpdate(node, 'select')) { + selectedNodes.push(node); + var model = node.getModel(); + selectedIds.push(model.id); + graph.setItemState(node, state, true); + } + } + }); + var selectedEdges = []; + + if (this.includeEdges) { + // 选中边，边的source和target都在选中的节点中时才选中 + selectedNodes.forEach(function (node) { + var edges = node.getOutEdges(); + edges.forEach(function (edge) { + var model = edge.getModel(); + var source = model.source, + target = model.target; + + if (selectedIds.includes(source) && selectedIds.includes(target) && shouldUpdate(edge, 'select')) { + selectedEdges.push(edge); + graph.setItemState(edge, _this.selectedState, true); + } + }); + }); + } + + this.selectedEdges = selectedEdges; + this.selectedNodes = selectedNodes; + + if (this.onSelect) { + this.onSelect(selectedNodes, selectedEdges); + } + + graph.emit('nodeselectchange', { + selectedItems: { + nodes: selectedNodes, + edges: selectedEdges + }, + select: true + }); + }, + createBrush: function createBrush() { + var self = this; + var brush = self.graph.get('canvas').addShape('rect', { + attrs: self.brushStyle, + capture: false, + name: 'brush-shape' + }); + this.brush = brush; + this.delegate = brush; + return brush; + }, + updateBrush: function updateBrush(e) { + var originPoint = this.originPoint; + this.brush.attr({ + width: abs(e.canvasX - originPoint.x), + height: abs(e.canvasY - originPoint.y), + x: min(e.canvasX, originPoint.x), + y: min(e.canvasY, originPoint.y) + }); + }, + onKeyDown: function onKeyDown(e) { + var code = e.key; + + if (!code) { + return; + } + + var triggerLowerCase = this.trigger.toLowerCase(); + var codeLowerCase = code.toLowerCase(); // 按住 control 键时，允许用户设置 trigger 为 ctrl + + if (codeLowerCase === triggerLowerCase || codeLowerCase === 'control' && triggerLowerCase === 'ctrl' || codeLowerCase === 'ctrl' && triggerLowerCase === 'control') { + this.keydown = true; + } else { + this.keydown = false; + } + }, + onKeyUp: function onKeyUp() { + if (this.brush) { + // 清除所有选中状态后，设置拖得动状态为false，并清除框选的brush + this.brush.remove(true); + this.brush = null; + this.dragging = false; + } + + this.keydown = false; + } +}; + +var DEFAULT_TRIGGER$5 = 'shift'; +var ALLOW_EVENTS$5 = ['shift', 'ctrl', 'alt', 'control']; +var ClickSelect = { + getDefaultCfg: function getDefaultCfg() { + return { + multiple: true, + trigger: DEFAULT_TRIGGER$5, + selectedState: 'selected' + }; + }, + getEvents: function getEvents() { + var self = this; // 检测输入是否合法 + + if (!(ALLOW_EVENTS$5.indexOf(self.trigger.toLowerCase()) > -1)) { + self.trigger = DEFAULT_TRIGGER$5; // eslint-disable-next-line no-console + + console.warn("Behavior brush-select 的 trigger 参数不合法，请输入 'drag'、'shift'、'ctrl' 或 'alt'"); + } + + if (!self.multiple) { + return { + 'node:click': 'onClick', + 'combo:click': 'onClick', + 'canvas:click': 'onCanvasClick' + }; + } + + return { + 'node:click': 'onClick', + 'combo:click': 'onClick', + 'canvas:click': 'onCanvasClick', + keyup: 'onKeyUp', + keydown: 'onKeyDown' + }; + }, + onClick: function onClick(evt) { + var self = this; + var item = evt.item; + + if (!item || item.destroyed) { + return; + } + + var type = item.getType(); + var graph = self.graph, + keydown = self.keydown, + multiple = self.multiple, + shouldUpdate = self.shouldUpdate, + shouldBegin = self.shouldBegin; + + if (!shouldBegin.call(self, evt)) { + return; + } // allow to select multiple nodes but did not press a key || do not allow the select multiple nodes + + + if (!keydown || !multiple) { + var selected = graph.findAllByState(type, self.selectedState); + each$2(selected, function (combo) { + if (combo !== item) { + graph.setItemState(combo, self.selectedState, false); + } + }); + } + + if (item.hasState(self.selectedState)) { + if (shouldUpdate.call(self, evt)) { + graph.setItemState(item, self.selectedState, false); + } + + var selectedNodes = graph.findAllByState('node', self.selectedState); + var selectedCombos = graph.findAllByState('combo', self.selectedState); + graph.emit('nodeselectchange', { + target: item, + selectedItems: { + nodes: selectedNodes, + combos: selectedCombos + }, + select: false + }); + } else { + if (shouldUpdate.call(self, evt)) { + graph.setItemState(item, self.selectedState, true); + } + + var selectedNodes = graph.findAllByState('node', self.selectedState); + var selectedCombos = graph.findAllByState('combo', self.selectedState); + graph.emit('nodeselectchange', { + target: item, + selectedItems: { + nodes: selectedNodes, + combos: selectedCombos + }, + select: true + }); + } + }, + onCanvasClick: function onCanvasClick() { + var _this = this; + + var graph = this.graph; + var selected = graph.findAllByState('node', this.selectedState); + each$2(selected, function (node) { + graph.setItemState(node, _this.selectedState, false); + }); + var selectedCombos = graph.findAllByState('combo', this.selectedState); + each$2(selectedCombos, function (combo) { + graph.setItemState(combo, _this.selectedState, false); + }); + graph.emit('nodeselectchange', { + selectedItems: { + nodes: [], + edges: [], + combos: [] + }, + select: false + }); + }, + onKeyDown: function onKeyDown(e) { + var self = this; + var code = e.key; + + if (!code) { + return; + } + + if (code.toLowerCase() === this.trigger.toLowerCase() || code.toLowerCase() === 'control') { + self.keydown = true; + } else { + self.keydown = false; + } + }, + onKeyUp: function onKeyUp() { + var self = this; + self.keydown = false; + } +}; + +var transform = transform$6; +var DELTA = 0.05; +var ZoomCanvas = { + getDefaultCfg: function getDefaultCfg() { + return { + sensitivity: 2, + minZoom: undefined, + maxZoom: undefined, + enableOptimize: false, + optimizeZoom: 0.1, + fixSelectedItems: { + fixAll: false, + fixLineWidth: false, + fixLabel: false, + fixState: 'selected' + } + }; + }, + getEvents: function getEvents() { + var fixSelectedItems = this.fixSelectedItems; + if (!fixSelectedItems.fixState) fixSelectedItems.fixState = 'selected'; + + if (fixSelectedItems.fixAll) { + fixSelectedItems.fixLineWidth = true; + fixSelectedItems.fixLabel = true; + } + + return { + wheel: 'onWheel', + touchstart: 'onTouchStart', + touchmove: 'onTouchMove', + touchend: 'onTouchEnd' + }; + }, + onTouchStart: function onTouchStart(evt) { + var touches = evt.originalEvent.touches; + var event1 = touches[0]; + var event2 = touches[1]; + evt.preventDefault(); // 如果不是缩放事件则禁止继续执行 + + if (!event2) { + return; + } + + if (this.shouldBegin && !this.shouldBegin.call(this, evt)) { + return; + } // 第一个触摸点位置 + + + this.startPoint = { + pageX: event1.pageX, + pageY: event1.pageY + }; + this.moveable = true; + + if (event2) { + this.endPoint = { + pageX: event2.pageX, + pageY: event2.pageY + }; + } + + this.originScale = this.graph.getZoom() || this.currentScale || 1; + }, + onTouchMove: function onTouchMove(evt) { + if (!this.moveable) { + return; + } + + evt.preventDefault(); + var touches = evt.originalEvent.touches; + var event1 = touches[0]; + var event2 = touches[1]; + + if (!event2) { + return; + } + + if (!this.endPoint) { + this.endPoint = { + pageX: event2.pageX, + pageY: event2.pageY + }; + } // 获取坐标之间的距离 + + + var getDistance = function getDistance(start, end) { + return Math.hypot(end.x - start.x, end.y - start.y); + }; // 双指缩放比例 + + + var scale = getDistance({ + x: event1.pageX, + y: event1.pageY + }, { + x: event2.pageX, + y: event2.pageY + }) / getDistance({ + x: this.startPoint.pageX, + y: this.startPoint.pageY + }, { + x: this.endPoint.pageX, + y: this.endPoint.pageY + }); // 应用到画布上的缩放比例 + + var zoom = this.originScale * scale; // 缓存当前的缩放比例 + + this.currentScale = zoom; + var minZoom = this.get('minZoom') || this.graph.get('minZoom'); + var maxZoom = this.get('maxZoom') || this.graph.get('maxZoom'); + + if (zoom > maxZoom || zoom < minZoom) { + return; + } + + var canvas = this.graph.get('canvas'); + var point = canvas.getPointByClient(evt.clientX, evt.clientY); + this.graph.zoomTo(zoom, { + x: point.x, + y: point.y + }); + this.graph.emit('wheelzoom', evt); + }, + onTouchEnd: function onTouchEnd() { + this.moveable = false; + this.endPoint = null; + }, + onWheel: function onWheel(e) { + var _this = this; + + var _a = this, + graph = _a.graph, + fixSelectedItems = _a.fixSelectedItems; + + if (this.shouldBegin && !this.shouldBegin.call(this, e)) { + return; + } + + if (!this.shouldUpdate.call(this, e)) { + return; + } + + e.preventDefault(); + var canvas = graph.get('canvas'); + var point = canvas.getPointByClient(e.clientX, e.clientY); + var sensitivity = this.get('sensitivity'); + var graphZoom = graph.getZoom(); + var ratio = graphZoom; + var zoom = graphZoom; // 兼容IE、Firefox及Chrome + + if (e.wheelDelta < 0) { + ratio = 1 - DELTA * sensitivity; + } else { + ratio = 1 / (1 - DELTA * sensitivity); + } + + zoom = graphZoom * ratio; // const zoom = ratio * graphZoom; + + var minZoom = this.get('minZoom') || graph.get('minZoom'); + var maxZoom = this.get('maxZoom') || graph.get('maxZoom'); + + if (zoom > maxZoom || zoom < minZoom) { + return; + } // hide the shapes when the zoom ratio is smaller than optimizeZoom + // hide the shapes when zoomming + + + var enableOptimize = this.get('enableOptimize'); + + if (enableOptimize) { + var optimizeZoom_1 = this.get('optimizeZoom'); + var optimized = this.get('optimized'); + var nodes_1 = graph.getNodes(); + var edges_1 = graph.getEdges(); + var nodesLength_1 = nodes_1.length; + var edgesLength_1 = edges_1.length; // hiding + + if (!optimized) { + for (var n = 0; n < nodesLength_1; n++) { + var node = nodes_1[n]; + + if (!node.destroyed) { + var children = node.get('group').get('children'); + var childrenLength = children.length; + + for (var c = 0; c < childrenLength; c++) { + var shape = children[c]; + + if (!shape.destoryed && !shape.get('isKeyShape')) { + shape.set('ori-visibility', shape.get('ori-visibility') || shape.get('visible')); + shape.hide(); + } + } + } + } + + for (var edgeIndex = 0; edgeIndex < edgesLength_1; edgeIndex++) { + var edge = edges_1[edgeIndex]; + var children = edge.get('group').get('children'); + var childrenLength = children.length; + + for (var c = 0; c < childrenLength; c++) { + var shape = children[c]; + shape.set('ori-visibility', shape.get('ori-visibility') || shape.get('visible')); + shape.hide(); + } + } + + this.set('optimized', true); + } // showing after 100ms + + + clearTimeout(this.get('timeout')); + var timeout = setTimeout(function () { + var currentZoom = graph.getZoom(); + + var curOptimized = _this.get('optimized'); + + if (curOptimized) { + _this.set('optimized', false); + + for (var n = 0; n < nodesLength_1; n++) { + var node = nodes_1[n]; + var children = node.get('group').get('children'); + var childrenLength = children.length; + + if (currentZoom < optimizeZoom_1) { + var keyShape = node.getKeyShape(); + var oriVis = keyShape.get('ori-visibility'); + if (oriVis) keyShape.show(); + } else { + for (var c = 0; c < childrenLength; c++) { + var shape = children[c]; + var oriVis = shape.get('ori-visibility'); + + if (!shape.get('visible') && oriVis) { + if (oriVis) shape.show(); + } + } + } + } + + for (var edgeIndex = 0; edgeIndex < edgesLength_1; edgeIndex++) { + var edge = edges_1[edgeIndex]; + var children = edge.get('group').get('children'); + var childrenLength = children.length; + + if (currentZoom < optimizeZoom_1) { + var keyShape = edge.getKeyShape(); + var oriVis = keyShape.get('ori-visibility'); + if (oriVis) keyShape.show(); + } else { + for (var c = 0; c < childrenLength; c++) { + var shape = children[c]; + + if (!shape.get('visible')) { + var oriVis = shape.get('ori-visibility'); + if (oriVis) shape.show(); + } + } + } + } + } + }, 100); + this.set('timeout', timeout); + } // fix the items when zooming + + + if (graphZoom <= 1) { + var fixNodes = void 0, + fixEdges = void 0; + + if (fixSelectedItems.fixAll || fixSelectedItems.fixLineWidth || fixSelectedItems.fixLabel) { + fixNodes = graph.findAllByState('node', fixSelectedItems.fixState); + fixEdges = graph.findAllByState('edge', fixSelectedItems.fixState); + var scale = graphZoom / zoom; + var fixNodesLength = fixNodes.length; + + for (var fn = 0; fn < fixNodesLength; fn++) { + var node = fixNodes[fn]; + var group = node.getContainer(); + var nodeModel = node.getModel(); + var originStyle = node.getOriginStyle(); + var itemStateStyle = node.getStateStyle(fixSelectedItems.fixState); + var shapeStateStyle = node.get('shapeFactory').getShape(nodeModel.type).getStateStyle(fixSelectedItems.fixState, node)[fixSelectedItems.fixState]; + + if (fixSelectedItems.fixAll) { + if (zoom <= 1) { + var groupMatrix = clone$7(group.getMatrix()); + if (!groupMatrix) groupMatrix = [1, 0, 0, 0, 1, 0, 0, 0, 1]; + + var _b = node.getModel(), + x = _b.x, + y = _b.y; + + groupMatrix = transform(groupMatrix, [['t', -x, -y], ['s', scale, scale], ['t', x, y]]); + group.setMatrix(groupMatrix); + } + } else { + var children = group.get('children'); + var childrenLength = children.length; + + for (var c = 0; c < childrenLength; c++) { + var shape = children[c]; + var fontSize = void 0, + lineWidth = void 0; + + if (fixSelectedItems.fixLabel) { + var shapeType = shape.get('type'); + + if (shapeType === 'text') { + fontSize = shape.attr('fontSize') || 12; + var itemStyle = itemStateStyle[shape.get('name')]; + var shapeStyle = shapeStateStyle[shape.get('name')]; + var itemFontSize = itemStyle ? itemStyle.fontSize : 12; + var shapeFontSize = shapeStyle ? shapeStyle.fontSize : 12; + var oriFontSize = itemFontSize || shapeFontSize || 12; + if (zoom <= 1) shape.attr('fontSize', oriFontSize / zoom); // * graphZoom / zoom + + if (lineWidth) break; + } + } + + if (fixSelectedItems.fixLineWidth) { + if (shape.get('isKeyShape')) { + lineWidth = shape.attr('lineWidth') || 0; + var oriLineWidth = itemStateStyle.lineWidth || shapeStateStyle.lineWidth || originStyle.lineWidth || 0; + if (zoom <= 1) shape.attr('lineWidth', oriLineWidth / zoom); // * graphZoom / zoom + + if (fontSize) break; + } + } + } + } + } + + var fixEdgesLength = fixEdges.length; + + for (var fe = 0; fe < fixEdgesLength; fe++) { + var edge = fixEdges[fe]; + var group = edge.getContainer(); + var children = group.get('children'); + var nodeModel = edge.getModel(); + var itemStateStyle = edge.getStateStyle(fixSelectedItems.fixState); + var shapeStateStyle = edge.get('shapeFactory').getShape(nodeModel.type).getStateStyle(fixSelectedItems.fixState, edge)[fixSelectedItems.fixState]; + var childrenLength = children.length; + + for (var c = 0; c < childrenLength; c++) { + var shape = children[c]; + var fontSize = void 0, + lineWidth = void 0; + + if (fixSelectedItems.fixLabel || fixSelectedItems.fixAll) { + var shapeType = shape.get('type'); + + if (shapeType === 'text') { + fontSize = shape.attr('fontSize') || 12; + var itemStyle = itemStateStyle[shape.get('name')]; + var shapeStyle = shapeStateStyle[shape.get('name')]; + var itemFontSize = itemStyle ? itemStyle.fontSize : 12; + var shapeFontSize = shapeStyle ? shapeStyle.fontSize : 12; + var oriFontSize = itemFontSize || shapeFontSize || 12; + if (zoom <= 1) shape.attr('fontSize', oriFontSize / zoom); + if (lineWidth) break; + } + } + + if (fixSelectedItems.fixLineWidth || fixSelectedItems.fixAll) { + if (shape.get('isKeyShape')) { + lineWidth = shape.attr('lineWidth') || 0; + var oriLineWidth = itemStateStyle.lineWidth || shapeStateStyle.lineWidth || 1; + if (zoom <= 1) shape.attr('lineWidth', oriLineWidth / zoom); + if (fontSize) break; + } + } + } + } + } + } + + graph.zoomTo(zoom, { + x: point.x, + y: point.y + }); + graph.emit('wheelzoom', e); + } +}; + +var base = { + onMouseEnter: function onMouseEnter(e) { + var item = e.item; + this.currentTarget = item; + this.showTooltip(e); + this.graph.emit('tooltipchange', { + item: e.item, + action: 'show' + }); + }, + onMouseMove: function onMouseMove(e) { + if (!this.shouldUpdate(e)) { + this.hideTooltip(); + return; + } + + if (!this.currentTarget || e.item !== this.currentTarget) { + return; + } + + this.updatePosition(e); + }, + onMouseLeave: function onMouseLeave(e) { + if (!this.shouldEnd(e)) { + return; + } + + this.hideTooltip(); + this.graph.emit('tooltipchange', { + item: this.currentTarget, + action: 'hide' + }); + this.currentTarget = null; + }, + showTooltip: function showTooltip(e) { + var container = this.container; + + if (!e.item || e.item.destroyed) { + return; + } + + if (!container) { + container = this.createTooltip(this.graph.get('canvas')); + this.container = container; + } + + var text = this.formatText(e.item.get('model'), e); + container.innerHTML = text; + modifyCSS(this.container, { + visibility: 'visible' + }); + this.updatePosition(e); + }, + hideTooltip: function hideTooltip() { + modifyCSS(this.container, { + visibility: 'hidden' + }); + }, + updatePosition: function updatePosition(e) { + var shouldBegin = this.get('shouldBegin'); + + var _a = this, + width = _a.width, + height = _a.height, + container = _a.container, + graph = _a.graph; + + if (!shouldBegin(e)) { + modifyCSS(container, { + visibility: 'hidden' + }); + return; + } + + var point = graph.getPointByClient(e.clientX, e.clientY); + + var _b = graph.getCanvasByPoint(point.x, point.y), + x = _b.x, + y = _b.y; + + var bbox = container.getBoundingClientRect(); + + if (x > width / 2) { + x -= bbox.width; + } else { + x += this.offset; + } + + if (y > height / 2) { + y -= bbox.height; + } else { + y += this.offset; + } + + var left = x + "px"; + var top = y + "px"; + modifyCSS(this.container, { + left: left, + top: top, + visibility: 'visible' + }); + }, + createTooltip: function createTooltip(canvas) { + var el = canvas.get('el'); + el.style.position = 'relative'; + var container = createDom$1("
    "); + el.parentNode.appendChild(container); + modifyCSS(container, { + position: 'absolute', + visibility: 'visible' + }); + this.width = canvas.get('width'); + this.height = canvas.get('height'); + this.container = container; + this.graph.get('tooltips').push(container); + return container; + } +}; + +var Tooltip = __assign$r({ + getDefaultCfg: function getDefaultCfg() { + return { + item: 'node', + offset: 12, + formatText: function formatText(model) { + return model.label; + } + }; + }, + getEvents: function getEvents() { + return { + 'node:mouseenter': 'onMouseEnter', + 'node:mouseleave': 'onMouseLeave', + 'node:mousemove': 'onMouseMove', + afterremoveitem: 'onMouseLeave' + }; + } +}, base); + +var EdgeTooltip = __assign$r({ + getDefaultCfg: function getDefaultCfg() { + return { + item: 'edge', + offset: 12, + formatText: function formatText(model) { + return "source: " + model.source + " target: " + model.target; + } + }; + }, + getEvents: function getEvents() { + return { + 'edge:mouseenter': 'onMouseEnter', + 'edge:mouseleave': 'onMouseLeave', + 'edge:mousemove': 'onMouseMove', + afterremoveitem: 'onMouseLeave' + }; + } +}, base); + +var DEFAULT_TRIGGER$4 = 'click'; +var ALLOW_EVENTS$4 = ['click', 'dblclick']; +var CollapseExpand = { + getDefaultCfg: function getDefaultCfg() { + return { + /** + * 发生收缩/扩展变化时的回调 + */ + trigger: DEFAULT_TRIGGER$4, + onChange: function onChange() {} + }; + }, + getEvents: function getEvents() { + var _a; + + var trigger; // 检测输入是否合法 + + if (ALLOW_EVENTS$4.includes(this.trigger)) { + trigger = this.trigger; + } else { + trigger = DEFAULT_TRIGGER$4; // eslint-disable-next-line no-console + + console.warn("Behavior collapse-expand 的 trigger 参数不合法，请输入 'click' 或 'dblclick'"); + } + + return _a = {}, _a["node:" + trigger] = 'onNodeClick', // 支持移动端事件 + _a.touchstart = 'onNodeClick', _a; + }, + onNodeClick: function onNodeClick(e) { + var item = e.item; + if (!item) return; // 如果节点进行过更新，model 会进行 merge，直接改 model 就不能改布局，所以需要去改源数据 + + var sourceData = this.graph.findDataById(item.get('id')); + + if (!sourceData) { + return; + } + + var children = sourceData.children; // 叶子节点的收缩和展开没有意义 + + if (!children || children.length === 0) { + return; + } + + var collapsed = !sourceData.collapsed; + + if (!this.shouldBegin(e, collapsed)) { + return; + } + + sourceData.collapsed = collapsed; + item.getModel().collapsed = collapsed; + this.graph.emit('itemcollapsed', { + item: e.item, + collapsed: collapsed + }); + + if (!this.shouldUpdate(e, collapsed)) { + return; + } + + this.onChange(item, collapsed); + this.graph.layout(); + } +}; + +var calculationItemsBBox = G6Util.calculationItemsBBox; +/** + * 遍历拖动的 Combo 下的所有 Combo + * @param data 拖动的 Combo + * @param fn + */ + +var traverseCombo = function traverseCombo(data, fn) { + if (fn(data) === false) { + return; + } + + if (data) { + var combos = data.get('combos'); + + if (combos.length === 0) { + return false; + } + + each$2(combos, function (child) { + traverseCombo(child, fn); + }); + } +}; + +var DragCombo = { + getDefaultCfg: function getDefaultCfg() { + return { + enableDelegate: false, + delegateStyle: {}, + // 拖动节点过程中是否只改变 Combo 的大小，而不改变其结构 + onlyChangeComboSize: false, + // 拖动过程中目标 combo 状态样式 + activeState: '', + selectedState: 'selected' + }; + }, + getEvents: function getEvents() { + return { + 'combo:dragstart': 'onDragStart', + 'combo:drag': 'onDrag', + 'combo:dragend': 'onDragEnd', + 'combo:drop': 'onDrop', + 'node:drop': 'onNodeDrop', + 'combo:dragenter': 'onDragEnter', + 'combo:dragleave': 'onDragLeave' + }; + }, + validationCombo: function validationCombo(evt) { + var item = evt.item; + + if (!item || item.destroyed) { + return false; + } + + if (!this.shouldUpdate(this, evt)) { + return false; + } + + var type = item.getType(); + + if (type !== 'combo') { + return false; + } + + return true; + }, + onDragStart: function onDragStart(evt) { + var _this = this; + + var graph = this.graph; + var item = evt.item; + if (!this.validationCombo(evt)) return; + this.targets = []; // 获取所有选中的 Combo + + var combos = graph.findAllByState('combo', this.selectedState); + var currentCombo = item.get('id'); + var dragCombos = combos.filter(function (combo) { + var comboId = combo.get('id'); + return currentCombo === comboId; + }); + + if (dragCombos.length === 0) { + this.targets.push(item); + } else { + this.targets = combos; + } + + if (this.activeState) { + this.targets.map(function (combo) { + var model = combo.getModel(); + + if (model.parentId) { + var parentCombo = graph.findById(model.parentId); + + if (parentCombo) { + graph.setItemState(parentCombo, _this.activeState, true); + } + } + }); + } + + this.point = {}; + this.originPoint = {}; + this.origin = { + x: evt.x, + y: evt.y + }; + this.currentItemChildCombos = []; + traverseCombo(item, function (param) { + if (param.destroyed) { + return false; + } + + var model = param.getModel(); + + _this.currentItemChildCombos.push(model.id); + + return true; + }); + }, + onDrag: function onDrag(evt) { + var _this = this; + + if (!this.origin) { + return; + } + + if (!this.validationCombo(evt)) return; + + if (this.enableDelegate) { + this.updateDelegate(evt); + } else { + if (this.activeState) { + var graph_1 = this.graph; + var item = evt.item; + var model_1 = item.getModel(); // 拖动过程中实时计算距离 + + var combos = graph_1.getCombos(); + var sourceBBox = item.getBBox(); + var centerX_1 = sourceBBox.centerX, + centerY_1 = sourceBBox.centerY, + width_1 = sourceBBox.width; // 参与计算的 Combo，需要排除掉： + // 1、拖动 combo 自己 + // 2、拖动 combo 的 parent + // 3、拖动 Combo 的 children + + var calcCombos = combos.filter(function (combo) { + var cmodel = combo.getModel(); // 被拖动的是最外层的 Combo，无 parent，排除自身和子元素 + + if (!model_1.parentId) { + return cmodel.id !== model_1.id && !_this.currentItemChildCombos.includes(cmodel.id); + } + + return cmodel.id !== model_1.id && !_this.currentItemChildCombos.includes(cmodel.id); + }); + calcCombos.map(function (combo) { + var _a = combo.getBBox(), + cx = _a.centerX, + cy = _a.centerY, + w = _a.width; // 拖动的 combo 和要进入的 combo 之间的距离 + + + var disX = centerX_1 - cx; + var disY = centerY_1 - cy; // 圆心距离 + + var distance = 2 * Math.sqrt(disX * disX + disY * disY); + + if (width_1 + w - distance > 0.8 * width_1) { + graph_1.setItemState(combo, _this.activeState, true); + } else { + graph_1.setItemState(combo, _this.activeState, false); + } + }); + } + + each$2(this.targets, function (item) { + _this.updateCombo(item, evt); + }); + } + }, + updatePositions: function updatePositions(evt) { + var _this = this; // 当启用 delegate 时，拖动结束时需要更新 combo + + + if (this.enableDelegate) { + each$2(this.targets, function (item) { + _this.updateCombo(item, evt); + }); + } + }, + onDrop: function onDrop(evt) { + var _this = this; // 被放下的目标 combo + + + var item = evt.item; + + if (!item || !this.targets || item.destroyed) { + return; + } + + this.updatePositions(evt); + var graph = this.graph; + var targetModel = item.getModel(); + this.targets.map(function (combo) { + var model = combo.getModel(); + + if (model.parentId !== targetModel.id) { + if (_this.activeState) { + graph.setItemState(item, _this.activeState, false); + } // 将 Combo 放置到某个 Combo 上面时，只有当 onlyChangeComboSize 为 false 时候才更新 Combo 结构 + + + if (!_this.onlyChangeComboSize) { + graph.updateComboTree(combo, targetModel.id); + } else { + graph.updateCombo(combo); + } + } else { + graph.updateCombo(item); + } + }); + this.end(item, evt); // 如果已经拖放下了，则不需要再通过距离判断了 + + this.endComparison = true; + }, + onNodeDrop: function onNodeDrop(evt) { + var _this = this; + + if (!this.targets || this.targets.length === 0) return; + this.updatePositions(evt); + var graph = this.graph; + var item = evt.item; + var comboId = item.getModel().comboId; + var droppedCombo; // 如果被放置的的节点有 comboId，且这个 comboId 与正在被拖拽的 combo 的父 id 不相同，则更新父亲为 comboId + + if (comboId) { + if (this.activeState) { + var combo = graph.findById(comboId); + graph.setItemState(combo, this.activeState, false); + } + + this.targets.map(function (combo) { + if (!_this.onlyChangeComboSize) { + if (comboId !== combo.getID()) { + droppedCombo = graph.findById(comboId); + if (comboId !== combo.getModel().parentId) graph.updateComboTree(combo, comboId); + } + } else { + graph.updateCombo(combo); + } + }); + } else { + // 如果被放置的节点没有 comboId，且正在被拖拽的 combo 有父 id，则更新父亲为 undefined + this.targets.map(function (combo) { + if (!_this.onlyChangeComboSize) { + var model = combo.getModel(); + + if (model.comboId) { + graph.updateComboTree(combo); + } + } else { + graph.updateCombo(combo); + } + }); + } // 如果已经拖放下了，则不需要再通过距离判断了 + + + this.endComparison = true; + this.end(droppedCombo, evt); + }, + onDragEnter: function onDragEnter(evt) { + if (!this.origin) { + return; + } + + if (!this.validationCombo(evt)) return; + var item = evt.item; + var graph = this.graph; + + if (this.activeState) { + graph.setItemState(item, this.activeState, true); + } + }, + onDragLeave: function onDragLeave(evt) { + if (!this.origin) { + return; + } + + if (!this.validationCombo(evt)) return; + var item = evt.item; + var graph = this.graph; + + if (this.activeState) { + graph.setItemState(item, this.activeState, false); + } + }, + onDragEnd: function onDragEnd(evt) { + if (!this.targets || this.targets.length === 0) return; + var item = evt.item; + this.updatePositions(evt); + var parentCombo = this.getParentCombo(item.getModel().parentId); + var graph = this.graph; + + if (parentCombo && this.activeState) { + graph.setItemState(parentCombo, this.activeState, false); + } + + this.end(undefined, evt); + }, + end: function end(comboDropedOn, evt) { + var _this = this; + + if (!this.origin) return; + var graph = this.graph; // 删除delegate shape + + if (this.delegateShape) { + var delegateGroup = graph.get('delegateGroup'); + delegateGroup.clear(); + this.delegateShape = null; + } + + if (comboDropedOn && this.activeState) { + graph.setItemState(comboDropedOn, this.activeState, false); + } // 若没有被放置的 combo，则是被放置在画布上 + + + if (!comboDropedOn) { + this.targets.map(function (combo) { + // 将 Combo 放置到某个 Combo 上面时，只有当 onlyChangeComboSize 为 false 时候才更新 Combo 结构 + if (!_this.onlyChangeComboSize) { + graph.updateComboTree(combo); + } else { + graph.updateCombo(combo); + } + }); + } + + this.point = []; + this.origin = null; + this.originPoint = null; + this.targets.length = 0; + }, + + /** + * 遍历 comboTree，分别更新 node 和 combo + * @param data + * @param fn + */ + traverse: function traverse(data, fn) { + var _this = this; + + if (fn(data) === false) { + return; + } + + if (data) { + var combos = data.get('combos'); + each$2(combos, function (child) { + _this.traverse(child, fn); + }); + var nodes = data.get('nodes'); + each$2(nodes, function (child) { + _this.traverse(child, fn); + }); + } + }, + updateCombo: function updateCombo(item, evt) { + var _this = this; + + this.traverse(item, function (param) { + if (param.destroyed) { + return false; + } + + _this.updateSignleItem(param, evt); + + return true; + }); + }, + + /** + * + * @param item 当前正在拖动的元素 + * @param evt + */ + updateSignleItem: function updateSignleItem(item, evt) { + var origin = this.origin; + var graph = this.graph; + var model = item.getModel(); + var itemId = item.get('id'); + + if (!this.point[itemId]) { + this.point[itemId] = { + x: model.x, + y: model.y + }; + } + + var x = evt.x - origin.x + this.point[itemId].x; + var y = evt.y - origin.y + this.point[itemId].y; + graph.updateItem(item, { + x: x, + y: y + }); + }, + + /** + * 根据 ID 获取父 Combo + * @param parentId 父 Combo ID + */ + getParentCombo: function getParentCombo(parentId) { + var graph = this.graph; + + if (!parentId) { + return undefined; + } + + var parentCombo = graph.findById(parentId); + + if (!parentCombo) { + return undefined; + } + + return parentCombo; + }, + updateDelegate: function updateDelegate(evt) { + var graph = this.graph; // 当没有 delegate shape 时创建 + + if (!this.delegateShape) { + var delegateGroup = graph.get('delegateGroup'); + var bbox = null; + + if (this.targets.length > 1) { + bbox = calculationItemsBBox(this.targets); + } else { + bbox = this.targets[0].getBBox(); + } + + var x = bbox.x, + y = bbox.y, + width = bbox.width, + height = bbox.height, + minX = bbox.minX, + minY = bbox.minY; + this.originPoint = { + x: x, + y: y, + width: width, + height: height, + minX: minX, + minY: minY + }; + + var attrs = __assign$r(__assign$r({}, Global.delegateStyle), this.delegateStyle); + + this.delegateShape = delegateGroup.addShape('rect', { + attrs: __assign$r({ + width: bbox.width, + height: bbox.height, + x: bbox.x, + y: bbox.y + }, attrs), + name: 'combo-delegate-shape' + }); + this.delegate = this.delegateShape; + } else { + var clientX = evt.x - this.origin.x + this.originPoint.minX; + var clientY = evt.y - this.origin.y + this.originPoint.minY; + this.delegateShape.attr({ + x: clientX, + y: clientY + }); + } + } +}; + +/* + * @Author: Shiwu + * @Description: 收起和展开 Combo + */ +var DEFAULT_TRIGGER$3 = 'dblclick'; +var ALLOW_EVENTS$3 = ['click', 'dblclick']; +var CollapseExpandCombo = { + getDefaultCfg: function getDefaultCfg() { + return { + trigger: DEFAULT_TRIGGER$3, + relayout: true + }; + }, + getEvents: function getEvents() { + var _a; + + var trigger; // 检测输入是否合法 + + if (ALLOW_EVENTS$3.includes(this.trigger)) { + trigger = this.trigger; + } else { + trigger = DEFAULT_TRIGGER$3; // eslint-disable-next-line no-console + + console.warn("Behavior collapse-expand-group 的 trigger 参数不合法，请输入 'click' 或 'dblclick'"); + } + + return _a = {}, _a["combo:" + trigger] = 'onComboClick', _a; + }, + onComboClick: function onComboClick(evt) { + var item = evt.item; + + var _a = this, + graph = _a.graph, + relayout = _a.relayout; + + if (!item || item.destroyed || item.getType() !== 'combo') return; + var model = item.getModel(); + var comboId = model.id; + + if (!comboId) { + return; + } + + graph.collapseExpandCombo(comboId); + if (relayout && graph.get('layout')) graph.layout();else graph.refreshPositions(); + } +}; + +var isPolygonsIntersect = G6Util.isPolygonsIntersect, + pathToPoints = G6Util.pathToPoints; +var DEFAULT_TRIGGER$2 = 'shift'; +var ALLOW_EVENTS$2 = ['drag', 'shift', 'ctrl', 'alt', 'control']; + +var isItemIntersecPolygon = function isItemIntersecPolygon(item, polyPoints) { + var shapePoints; + var shape = item.getKeyShape(); + + if (item.get('type') === 'path') { + shapePoints = pathToPoints(shape.attr('path')); + } else { + var shapeBBox = shape.getCanvasBBox(); + shapePoints = [[shapeBBox.minX, shapeBBox.minY], [shapeBBox.maxX, shapeBBox.minY], [shapeBBox.maxX, shapeBBox.maxY], [shapeBBox.minX, shapeBBox.maxY]]; + } + + return isPolygonsIntersect(polyPoints, shapePoints); +}; + +var LassoSelect = { + getDefaultCfg: function getDefaultCfg() { + return { + delegateStyle: { + fill: '#EEF6FF', + fillOpacity: 0.4, + stroke: '#DDEEFE', + lineWidth: 1 + }, + onSelect: function onSelect() {}, + onDeselect: function onDeselect() {}, + selectedState: 'selected', + trigger: DEFAULT_TRIGGER$2, + includeEdges: true, + selectedEdges: [], + selectedNodes: [] // multiple: false, + + }; + }, + getEvents: function getEvents() { + // 检测输入是否合法 + if (!(ALLOW_EVENTS$2.indexOf(this.trigger.toLowerCase()) > -1)) { + this.trigger = DEFAULT_TRIGGER$2; + console.warn("Behavior lasso-select 的 trigger 参数不合法，请输入 'drag'、'shift'、'ctrl' 或 'alt'"); + } + + if (this.trigger === 'drag') { + return { + dragstart: 'onDragStart', + drag: 'onDragMove', + dragend: 'onDragEnd', + 'canvas:click': 'clearStates' + }; + } + + return { + dragstart: 'onDragStart', + drag: 'onDragMove', + dragend: 'onDragEnd', + keyup: 'onKeyUp', + keydown: 'onKeyDown', + 'canvas:click': 'clearStates' + }; + }, + onDragStart: function onDragStart(e) { + var lasso = this.lasso; + var item = e.item; // 排除在节点上拖动 + + if (item) { + return; + } + + if (this.trigger !== 'drag' && !this.keydown) { + return; + } + + if (this.selectedNodes && this.selectedNodes.length !== 0) { + this.clearStates(); + } + + if (!lasso) { + lasso = this.createLasso(); + } + + this.dragging = true; + this.originPoint = { + x: e.x, + y: e.y + }; + this.points.push(this.originPoint); + lasso.show(); + }, + onDragMove: function onDragMove(e) { + if (!this.dragging) { + return; + } + + if (this.trigger !== 'drag' && !this.keydown) { + return; + } + + this.points.push({ + x: e.x, + y: e.y + }); + this.updateLasso(e); + }, + onDragEnd: function onDragEnd(e) { + if (!this.lasso && !this.dragging) { + return; + } + + if (this.trigger !== 'drag' && !this.keydown) { + return; + } + + this.points.push(this.originPoint); + this.getSelectedItems(); + this.lasso.remove(true); + this.lasso = null; + this.points = []; + this.dragging = false; + }, + getLassoPath: function getLassoPath() { + var points = this.points; + var path = []; + + if (points.length) { + points.forEach(function (point, index) { + if (index === 0) { + path.push(['M', point.x, point.y]); + } else { + path.push(['L', point.x, point.y]); + } + }); + path.push(['L', points[0].x, points[0].y]); + } + + return path; + }, + clearStates: function clearStates() { + var _a = this, + graph = _a.graph, + selectedState = _a.selectedState; + + var nodes = graph.findAllByState('node', selectedState); + var edges = graph.findAllByState('edge', selectedState); + nodes.forEach(function (node) { + return graph.setItemState(node, selectedState, false); + }); + edges.forEach(function (edge) { + return graph.setItemState(edge, selectedState, false); + }); + + if (this.onDeselect) { + this.onDeselect(this.selectedNodes, this.selectedEdges); + } + + this.selectedNodes = []; + this.selectedEdges = []; + graph.emit('nodeselectchange', { + selectedItems: { + nodes: [], + edges: [] + }, + select: false + }); + }, + getSelectedItems: function getSelectedItems() { + var _this = this; + + var _a = this, + graph = _a.graph, + shouldUpdate = _a.shouldUpdate; + + var lassoContour = this.points.map(function (point) { + return [graph.getCanvasByPoint(point.x, point.y).x, graph.getCanvasByPoint(point.x, point.y).y]; + }); + var state = this.selectedState; + var selectedNodes = []; + var selectedIds = []; + graph.getNodes().forEach(function (node) { + if (isItemIntersecPolygon(node, lassoContour)) { + if (shouldUpdate(node, 'select')) { + selectedNodes.push(node); + var model = node.getModel(); + selectedIds.push(model.id); + graph.setItemState(node, state, true); + } + } + }); + var selectedEdges = []; + + if (this.includeEdges) { + // 选中边，边的source和target都在选中的节点中时才选中 + selectedNodes.forEach(function (node) { + var edges = node.getOutEdges(); + edges.forEach(function (edge) { + var model = edge.getModel(); + var source = model.source, + target = model.target; + + if (selectedIds.includes(source) && selectedIds.includes(target) && shouldUpdate(edge, 'select')) { + selectedEdges.push(edge); + graph.setItemState(edge, _this.selectedState, true); + } + }); + }); + } + + this.selectedEdges = selectedEdges; + this.selectedNodes = selectedNodes; + + if (this.onSelect) { + this.onSelect(selectedNodes, selectedEdges); + } + + graph.emit('nodeselectchange', { + selectedItems: { + nodes: selectedNodes, + edges: selectedEdges + }, + select: true + }); + }, + createLasso: function createLasso() { + var self = this; + var lasso = self.graph.get('delegateGroup').addShape('path', { + attrs: __assign$r({ + path: [] + }, self.delegateStyle), + capture: false, + name: 'lasso-shape' + }); + this.lasso = lasso; + this.delegate = lasso; + this.points = []; + return lasso; + }, + updateLasso: function updateLasso(e) { + var self = this; + this.lasso.attr({ + path: self.getLassoPath() + }); + }, + onKeyDown: function onKeyDown(e) { + var code = e.key; + + if (!code) { + return; + } // if (this.selectedNodes && this.selectedNodes.length !== 0) { + // this.clearStates(); + // } + + + if (code.toLowerCase() === this.trigger.toLowerCase()) { + this.keydown = true; + } else { + this.keydown = false; + } + }, + onKeyUp: function onKeyUp() { + if (this.lasso) { + // 清除所有选中状态后，设置拖得动状态为false，并清除框选的lasso + this.lasso.remove(true); + this.lasso = null; + this.points = []; + this.dragging = false; + } + + this.keydown = false; + } +}; + +var DEFAULT_TRIGGER$1 = 'click'; +var ALLOW_EVENTS$1 = ['click', 'drag']; +var DEFAULT_KEY = undefined; +var ALLOW_KEYS = ['shift', 'ctrl', 'control', 'alt', 'meta', undefined]; +var CreateEdge = { + getDefaultCfg: function getDefaultCfg() { + return { + trigger: DEFAULT_TRIGGER$1, + key: DEFAULT_KEY, + edgeConfig: {}, + getEdgeConfig: undefined + }; + }, + getEvents: function getEvents() { + var self = this; // 检测输入是否合法 + + if (!(ALLOW_EVENTS$1.indexOf(self.trigger.toLowerCase()) > -1)) { + self.trigger = DEFAULT_TRIGGER$1; // eslint-disable-next-line no-console + + console.warn("Behavior create-edge 的 trigger 参数不合法，请输入 'click'，'drag'"); + } + + if (self.key && ALLOW_KEYS.indexOf(self.key.toLowerCase()) === -1) { + self.trigger = DEFAULT_KEY; // eslint-disable-next-line no-console + + console.warn("Behavior create-edge 的 key 参数不合法，请输入 'shift'，'ctrl'，'alt'，'control'，或 undefined"); + } + + var events; + + if (self.trigger === 'drag') { + events = { + 'node:dragstart': 'onClick', + 'combo:dragstart': 'onClick', + drag: 'updateEndPoint', + 'node:drop': 'onClick', + 'combo:drop': 'onClick', + dragend: 'onDragEnd' + }; + } else if (self.trigger === 'click') { + events = { + 'node:click': 'onClick', + mousemove: 'updateEndPoint', + 'edge:click': 'cancelCreating', + 'canvas:click': 'cancelCreating', + 'combo:click': 'onClick' + }; + } + + if (self.key) { + events.keydown = 'onKeyDown'; + events.keyup = 'onKeyUp'; + } + + return events; + }, + onDragEnd: function onDragEnd(ev) { + var self = this; + if (self.key && !self.keydown) return; + var item = ev.item; + if (!item || item.getID() === self.source || item.getType() !== 'node') self.cancelCreating({ + item: self.edge, + x: ev.x, + y: ev.y + }); + }, + // 如果边的起点没有指定，则根据起点创建新边；如果起点已经指定而终点未指定，则指定终点 + onClick: function onClick(ev) { + var self = this; + if (self.key && !self.keydown) return; + var node = ev.item; + var graph = self.graph; + var model = node.getModel(); + var getEdgeConfig = self.getEdgeConfig; // 如果起点已经指定而终点未指定，则指定终点 + + if (self.addingEdge && self.edge) { + if (!self.shouldEnd.call(self, ev)) return; + var edgeConfig = void 0; + + if (getEdgeConfig && isFunction$6(getEdgeConfig)) { + edgeConfig = getEdgeConfig({ + source: self.source, + target: model.id + }); + } else { + edgeConfig = self.edgeConfig; + } + + var updateCfg = __assign$r({ + target: model.id + }, edgeConfig); + + if (self.source === model.id) { + updateCfg.type = 'loop'; + } + + graph.emit('beforecreateedge', {}); + graph.updateItem(self.edge, updateCfg, false); + + if (graph.get('enabledStack')) { + var addedModel = __assign$r(__assign$r({}, self.edge.getModel()), { + itemType: 'edge' + }); + + var after = {}; + after.edges = [addedModel]; + graph.pushStack('add', { + before: {}, + after: after + }); + } + + graph.emit('aftercreateedge', { + edge: self.edge + }); // 暂时将该边的 capture 恢复为 true + + self.edge.getKeyShape().set('capture', true); + self.edge = null; + self.addingEdge = false; + } else { + // 如果边的起点没有指定，则根据起点创建新边 + if (!self.shouldBegin.call(self, ev)) return; // 获取自定义 edge 配置 + + var edgeConfig = void 0; + + if (getEdgeConfig && isFunction$6(getEdgeConfig)) { + edgeConfig = getEdgeConfig({ + source: model.id, + target: model.id + }); + } else { + edgeConfig = self.edgeConfig; + } + + self.edge = graph.addItem('edge', __assign$r({ + source: model.id, + target: model.id + }, edgeConfig), false); + self.source = model.id; + self.addingEdge = true; // 暂时将该边的 capture 设置为 false，这样可以拾取到后面的元素 + + self.edge.getKeyShape().set('capture', false); + } + }, + // 边的起点已经确定，边的末端跟随鼠标移动 + updateEndPoint: function updateEndPoint(ev) { + var self = this; + if (self.key && !self.keydown) return; + var point = { + x: ev.x, + y: ev.y + }; // 若此时 source 节点已经被移除，结束添加边 + + if (!self.graph.findById(self.source)) { + self.addingEdge = false; + return; + } + + if (self.addingEdge && self.edge) { + // 更新边的终点为鼠标位置 + self.graph.updateItem(self.edge, { + target: point + }, false); + } + }, + // 取消增加边，删除该边；或指定终点 + cancelCreating: function cancelCreating(ev) { + var self = this; + if (self.key && !self.keydown) return; + var graph = self.graph; + var currentEdge = ev.item; + + if (self.addingEdge && ev.target && ev.target.isCanvas && ev.target.isCanvas()) { + graph.removeItem(self.edge, false); + self.edge = null; + self.addingEdge = false; + return; + } + + if (self.addingEdge && self.edge === currentEdge) { + graph.removeItem(self.edge, false); + self.edge = null; + self.addingEdge = false; + } + }, + onKeyDown: function onKeyDown(e) { + var self = this; + var code = e.key; + + if (!code) { + return; + } + + if (code.toLowerCase() === self.key.toLowerCase()) { + self.keydown = true; + } else { + self.keydown = false; + } + }, + onKeyUp: function onKeyUp() { + var self = this; + + if (self.addingEdge && self.edge) { + // 清除正在增加的边 + self.graph.removeItem(self.edge, false); + self.addingEdge = false; + self.edge = null; + } + + this.keydown = false; + } +}; + +var DEFAULT_TRIGGER = 'ctrl'; +var ALLOW_EVENTS = ['shift', 'ctrl', 'alt', 'control']; +var DEFAULT_COMBINED_KEY = '1'; +var ShortcutsCall = { + getDefaultCfg: function getDefaultCfg() { + return { + trigger: DEFAULT_TRIGGER, + combinedKey: DEFAULT_COMBINED_KEY, + functionName: 'fitView', + functionParams: [] + }; + }, + getEvents: function getEvents() { + // 检测输入是否合法 + if (!(ALLOW_EVENTS.indexOf(this.trigger.toLowerCase()) > -1)) { + this.trigger = DEFAULT_TRIGGER; + console.warn("Behavior shortcuts-fit-view \u7684 trigger \u53C2\u6570 '" + this.trigger + "' \u4E0D\u5408\u6CD5\uFF0C\u8BF7\u8F93\u5165 'drag'\u3001'shift'\u3001'ctrl' \u6216 'alt'"); + } + + if (this.combinedKey === this.trigger) { + this.combinedKey = undefined; + } + + return { + keyup: 'onKeyUp', + keydown: 'onKeyDown' + }; + }, + onKeyDown: function onKeyDown(e) { + var code = e.key; + + if (!code) { + return; + } + + var triggerLowerCase = this.trigger.toLowerCase(); + var codeLowerCase = code.toLowerCase(); // 按住 control 键时，允许用户设置 trigger 为 ctrl + + if (!this.triggerKeydown) { + if (codeLowerCase === triggerLowerCase || codeLowerCase === 'control' && triggerLowerCase === 'ctrl' || codeLowerCase === 'ctrl' && triggerLowerCase === 'control') { + this.triggerKeydown = true; + } else { + this.triggerKeydown = false; + } + } + + var graph = this.graph; + + if (!graph[this.functionName]) { + console.warn("Behavior shortcuts-fit-view \u7684 functionName \u53C2\u6570 '" + this.functionName + "' \u4E0D\u5408\u6CD5\uFF0C\u5B83\u4E0D\u662F Graph \u7684\u4E00\u4E2A\u51FD\u6570\u540D"); + return {}; + } // 未配置 combinedKey，直接 fitView + + + if (this.triggerKeydown && !this.combinedKey) { + if (this.functionParams && this.functionParams.length) graph[this.functionName].apply(graph, this.functionParams);else graph[this.functionName](); + return; + } + + var combinedKeyLowerCase = this.combinedKey.toLowerCase(); + + if (this.triggerKeydown) { + if (codeLowerCase === combinedKeyLowerCase || codeLowerCase === 'control' && combinedKeyLowerCase === 'ctrl' || codeLowerCase === 'ctrl' && combinedKeyLowerCase === 'control') { + if (this.functionParams && this.functionParams.length) graph[this.functionName].apply(graph, this.functionParams);else graph[this.functionName](); + } + } + }, + onKeyUp: function onKeyUp() { + if (this.brush) { + // 清除所有选中状态后，设置拖得动状态为false，并清除框选的brush + this.brush.remove(true); + this.brush = null; + this.dragging = false; + } + + this.triggerKeydown = false; + } +}; + +var behaviors = { + 'drag-canvas': DragCanvas, + 'zoom-canvas': ZoomCanvas, + 'drag-node': DragNode, + 'activate-relations': ActivateRelations, + 'brush-select': BrushSelect, + 'click-select': ClickSelect, + 'lasso-select': LassoSelect, + tooltip: Tooltip, + 'edge-tooltip': EdgeTooltip, + 'collapse-expand': CollapseExpand, + 'drag-combo': DragCombo, + 'collapse-expand-combo': CollapseExpandCombo, + 'create-edge': CreateEdge, + 'shortcuts-call': ShortcutsCall +}; +each$2(behaviors, function (behavior, type) { + registerBehavior(type, behavior); +}); // export default Behavior; + +Plugin$1.Minimap; +Plugin$1.Grid; +Plugin$1.Bundling; +Plugin$1.Menu; +var Fisheye = Plugin$1.Fisheye; +Plugin$1.ToolBar; +Plugin$1.Tooltip; +var TimeBar = Plugin$1.TimeBar; +var ImageMinimap = Plugin$1.ImageMinimap; +var EdgeFilterLens = Plugin$1.EdgeFilterLens; +var G6 = { + version: Global.version, + Graph: Graph, + TreeGraph: TreeGraph, + Util: G6Util, + Layout: Layouts, + registerLayout: registerLayout, + Global: Global, + registerBehavior: registerBehavior, + registerCombo: registerCombo, + registerEdge: registerEdge, + registerNode: registerNode, + Minimap: Plugin$1.Minimap, + Grid: Plugin$1.Grid, + Bundling: Plugin$1.Bundling, + Menu: Plugin$1.Menu, + ToolBar: Plugin$1.ToolBar, + Tooltip: Plugin$1.Tooltip, + TimeBar: TimeBar, + Fisheye: Fisheye, + ImageMinimap: ImageMinimap, + EdgeFilterLens: EdgeFilterLens, + Algorithm: Algorithm, + Arrow: Arrow, + Marker: Marker, + Shape: Shape +}; + +G6.version = '4.2.4'; + +// 默认交互状态 +var defaultStateStyles$2 = { + hover: { + stroke: '#1890ff', + lineWidth: 2, + }, +}; +// card 默认节点大小 +var defaultNodeSize$3 = [120, 40]; +// 默认节点样式 +var defaultNodeStyle$7 = { + stroke: '#40a9ff', +}; +// 默认 anchor 连接点 +var defaultFlowGraphAnchorPoints = [ + [0, 0.5], + [1, 0.5], +]; +// card body|footer 默认样式 +var defaultLabelStyle$1 = { + fill: '#000', + fontSize: 12, +}; +// 缩略图默认配置 +var defaultMinimapCfg$2 = { + show: false, + size: [150, 100], + type: 'keyShape', +}; +// card 默认样式 +var defaultCardStyle = { + fill: '#fff', + stroke: '#40a9ff', + radius: 2, +}; +// card 内部 padding | margin | 行间距 +var defaultMargin = 6; +// 打标前缀 +var prefix = 'g'; + +var __assign$d = (undefined && undefined.__assign) || function () { + __assign$d = Object.assign || function(t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) + t[p] = s[p]; + } + return t; + }; + return __assign$d.apply(this, arguments); +}; +var __awaiter = (undefined && undefined.__awaiter) || function (thisArg, _arguments, P, generator) { + function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); } + return new (P || (P = Promise))(function (resolve, reject) { + function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } } + function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } } + function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); } + step((generator = generator.apply(thisArg, _arguments || [])).next()); + }); +}; +var __generator = (undefined && undefined.__generator) || function (thisArg, body) { + var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g; + return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g; + function verb(n) { return function (v) { return step([n, v]); }; } + function step(op) { + if (f) throw new TypeError("Generator is already executing."); + while (_) try { + if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t; + if (y = 0, t) op = [op[0] & 2, t.value]; + switch (op[0]) { + case 0: case 1: t = op; break; + case 4: _.label++; return { value: op[1], done: false }; + case 5: _.label++; y = op[1]; op = [0]; continue; + case 7: op = _.ops.pop(); _.trys.pop(); continue; + default: + if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; } + if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; } + if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; } + if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; } + if (t[2]) _.ops.pop(); + _.trys.pop(); continue; + } + op = body.call(thisArg, _); + } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; } + if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true }; + } +}; +var getGraphSize$2 = function (width, height, container) { + var CANVAS_WIDTH; + var CANVAS_HEIGHT; + if (container && container.current) { + CANVAS_WIDTH = container.current.offsetWidth; + CANVAS_HEIGHT = container.current.offsetHeight || 500; + } + if ((!width && !CANVAS_WIDTH) || (!height && !CANVAS_HEIGHT)) { + console.warn('请为 Graph 指定 width 与 height！否则将使用默认值 500 * 500'); + return [500, 500]; + } + return [width || CANVAS_WIDTH || 500, height || CANVAS_HEIGHT || 500]; +}; +var EventData = /** @class */ (function () { + function EventData(data) { + data && this.setData(data); + } + EventData.prototype.getData = function () { + return this.data; + }; + EventData.prototype.setData = function (data) { + this.data = data; + }; + return EventData; +}()); +// 展开&折叠事件 +var bindDefaultEvents$1 = function (graph, level, getChildren) { + var onClick = function (e) { return __awaiter(void 0, void 0, void 0, function () { + var item, _a, collapsed, g_currentPath_1, _b, children, g_parentId_1, g_level_1, id_1, appendChildren, appendChildrenData, currentData; + var _c; + return __generator(this, function (_d) { + switch (_d.label) { + case 0: + item = e.item; + if (!(e.target.get('name') === 'collapse-icon')) return [3 /*break*/, 3]; + _a = item.getModel(), collapsed = _a.collapsed, g_currentPath_1 = _a.g_currentPath, _b = _a.children, children = _b === void 0 ? [] : _b, g_parentId_1 = _a.g_parentId, g_level_1 = _a.g_level, id_1 = _a.id; + appendChildren = level && + !children.length && + getChildrenData(graph.get('eventData').getData(), g_currentPath_1); + if (!(getChildren && !((_c = children) === null || _c === void 0 ? void 0 : _c.length) && !(appendChildren === null || appendChildren === void 0 ? void 0 : appendChildren.length))) return [3 /*break*/, 2]; + createLoading(); + return [4 /*yield*/, getChildren(item.getModel())]; + case 1: + appendChildrenData = _d.sent(); + if (appendChildrenData) { + appendChildrenData = appendChildrenData.map(function (t, index) { + var _a; + return __assign$d((_a = {}, _a[prefix + "_level"] = g_level_1 + 1, _a[prefix + "_parentId"] = g_parentId_1 + "-" + id_1, _a[prefix + "_currentPath"] = g_currentPath_1 + "-" + index, _a), t); + }); + setLevelData(graph, appendChildrenData, g_currentPath_1); + } + appendChildren = appendChildrenData; + closeLoading(); + _d.label = 2; + case 2: + if ((appendChildren === null || appendChildren === void 0 ? void 0 : appendChildren.length) > 0) { + currentData = setParentChildren(graph.get('data'), g_currentPath_1, appendChildren); + graph.changeData(currentData); + if (graph.get('fitCenter')) { + graph.fitCenter(); + } + } + else { + graph.updateItem(item, { + collapsed: !collapsed, + }); + graph.layout(); + } + _d.label = 3; + case 3: return [2 /*return*/]; + } + }); + }); }; + graph.on('node:click', function (e) { + onClick(e); + }); + graph.on('node:touchstart', function (e) { + onClick(e); + }); +}; +var renderGraph$2 = function (graph, data, level) { + var originData = deepClone(data); + var tagData = originData; + if (level) { + tagData = setTag(data); + originData = getLevelData(tagData, level); + } + graph.data(originData); + graph.set('eventData', new EventData(tagData)); + graph.render(); + // 关闭局部刷新，各种 bug + graph.get('canvas').set('localRefresh', false); +}; +var grapgMinmapMaps = {}; +var processMinimap$2 = function (cfg, graph) { + if (cfg === void 0) { cfg = {}; } + var graphId = graph === null || graph === void 0 ? void 0 : graph.get('id'); + if (!graph || graph.destroyed) { + grapgMinmapMaps[graphId] = null; + return; + } + if ((!cfg || !cfg.show) && grapgMinmapMaps[graphId]) { + var pluginMinimap = graph.get('plugins')[0]; + if (pluginMinimap) { + graph.removePlugin(pluginMinimap); + } + grapgMinmapMaps[graphId] = null; + } + if (cfg.show && !grapgMinmapMaps[graphId]) { + var curMminimapCfg = Object.assign(defaultMinimapCfg$2, cfg); + var minimap = new G6.Minimap(__assign$d(__assign$d({}, curMminimapCfg), { id: graphId })); + graph.addPlugin(minimap); + grapgMinmapMaps[graphId] = minimap; + return minimap; + } + return null; +}; +var getUuid = function () { + return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) { + var r = (Math.random() * 16) | 0; + var v = c == 'x' ? r : (r & 0x3) | 0x8; + return v.toString(16); + }); +}; +// 同一页面存在多 graph 时需要指定 graphId +var getGraphId$2 = function (graph) { + if (graph.current) { + return graph.current; + } + graph.current = "graph-" + getUuid(); + return graph.current; +}; +var getMarkerPosition$1 = function (direction, size) { + if (direction === void 0) { direction = 'right'; } + var width = size[0], height = size[1]; + var x = 0; + var y = 0; + switch (direction) { + case 'top': + x = width / 2; + y = 0; + break; + case 'right': + x = width; + y = height / 2; + break; + case 'bottom': + x = width / 2; + y = height; + break; + case 'left': + x = 0; + y = height / 2; + break; + } + return { x: x, y: y }; +}; +var bindSourceMapCollapseEvents = function (graph) { + var onClick = function (e) { + var _a; + var controlData = graph.get('eventData').getData(); + if (e.target.get('name') === 'collapse-icon') { + var item = e.item; + var collapsed = item.getModel().collapsed; + if (!isType$1(collapsed, 'Boolean')) { + // @ts-ignore + collapsed = (_a = item._cfg.group + .getChildren() + .find(function (item) { return item.get('name') === 'main-box'; })) === null || _a === void 0 ? void 0 : _a.attr('defaultCollapsed'); + } + // @ts-ignore + e.item._cfg.group.getChildren().find(function (item) { return item.cfg.type === 'marker'; }); + var _b = (controlData !== null && controlData !== void 0 ? controlData : {}).edges, fullEdges_1 = _b === void 0 ? [] : _b; + var nodeId = item.getModel().id; + var targetNodeIds_1 = []; + var updateItems_1 = []; + var updateIds_1 = []; + var getLinkedId_1 = function (currentId) { + fullEdges_1.forEach(function (edge) { + var source = edge.source, target = edge.target; + if (source === currentId) { + targetNodeIds_1.push(target); + getLinkedId_1(target); + } + }); + }; + getLinkedId_1(nodeId); + if (!collapsed) { + // collapse + graph + .findAll('node', function (node) { return targetNodeIds_1.includes(node.get('id')); }) + .forEach(function (node) { return graph.hideItem(node); }); + controlData.nodes.forEach(function (node) { + var _a = node.collapsedLevel, collapsedLevel = _a === void 0 ? 0 : _a, id = node.id; + if (targetNodeIds_1.includes(id)) { + node.collapsedLevel = collapsedLevel + 1; + } + }); + } + else { + // expand + graph + .findAll('node', function (node) { + var collapsedLevel = controlData.nodes.find(function (item) { return item.id === node.get('id'); }).collapsedLevel; + return (targetNodeIds_1.includes(node.get('id')) && (!collapsedLevel || collapsedLevel < 2)); + }) + .forEach(function (node) { return graph.showItem(node); }); + controlData.nodes.forEach(function (node) { + var _a = node.collapsedLevel, collapsedLevel = _a === void 0 ? 0 : _a, id = node.id; + if (targetNodeIds_1.includes(id)) { + node.collapsedLevel = collapsedLevel - 1; + } + }); + } + fullEdges_1.forEach(function (edge) { + var source = edge.source, target = edge.target; + if (targetNodeIds_1.includes(target)) { + updateIds_1.push(source); + } + }); + updateIds_1 = Array.from(new Set(updateIds_1)); + updateIds_1.forEach(function (id) { + updateItems_1.push(graph.find('node', function (node) { return node.get('id') === id; })); + }); + updateItems_1.forEach(function (nodeItem) { + graph.updateItem(nodeItem, { + collapsed: !nodeItem.getModel().collapsed, + }); + graph.refreshItem(nodeItem); + }); + } + }; + graph.on('node:click', function (e) { + onClick(e); + }); + graph.on('node:touchstart', function (e) { + onClick(e); + }); +}; +/** + * padding | margin 按 CSS 规则转换 + */ +var getCssPadding = function (padding) { + if (typeof padding === 'number') { + return [padding, padding, padding, padding]; + } + var result = []; + switch (padding.length) { + case 1: + result = [padding[0], padding[0], padding[0], padding[0]]; + break; + case 2: + result = [padding[0], padding[1], padding[0], padding[1]]; + break; + case 3: + result = [padding[0], padding[1], padding[2], padding[1]]; + break; + case 4: + result = padding; + break; + } + return result; +}; +// 默认箭头样式 +var getArrowCfg = function (arrowCfg, edge) { + if (!arrowCfg) { + return; + } + if (typeof arrowCfg === 'object' && (arrowCfg === null || arrowCfg === void 0 ? void 0 : arrowCfg.show) === false) { + return; + } + var cfg = typeof arrowCfg === 'function' ? arrowCfg(edge) : arrowCfg; + var _a = cfg.type, type = _a === void 0 ? 'vee' : _a, _b = cfg.d, d = _b === void 0 ? 0 : _b, _c = cfg.size, size = _c === void 0 ? 10 : _c; + return __assign$d({ path: G6.Arrow[type](size, size, d), fill: '#ccc', d: d }, cfg); +}; +// 交互 +var bindStateEvents = function (graph, cfg) { + var _a = cfg !== null && cfg !== void 0 ? cfg : {}, _b = _a.nodeCfg, nodeCfg = _b === void 0 ? {} : _b, _c = _a.edgeCfg, edgeCfg = _c === void 0 ? {} : _c; + var nodeStateStyles = nodeCfg.nodeStateStyles; + var edgeStateStyles = edgeCfg.edgeStateStyles; + /** + * 存储交互状态 + * id: [[endActive, endDefalut], [startActive, startDefalut]] + */ + var statusCache = {}; + var updateArrowFill = function (item, endArrowFill, stratArrowFill) { + graph.updateItem(item, { + style: { + endArrow: !!endArrowFill && { + fill: endArrowFill, + }, + startArrow: !!stratArrowFill && { + fill: stratArrowFill, + }, + }, + }); + }; + var setState = function (item, name, status) { + var _a, _b, _c; + status ? item.toFront() : item.toBack(); + var _d = (_a = item.getModel().style) !== null && _a !== void 0 ? _a : {}, endArrow = _d.endArrow, startArrow = _d.startArrow; + if (endArrow || startArrow) { + if (!statusCache[item.getID()]) { + // @ts-ignore + var endArrowFill = (endArrow !== null && endArrow !== void 0 ? endArrow : {}).fill; + // @ts-ignore + var startArrowFill = (startArrow !== null && startArrow !== void 0 ? startArrow : {}).fill; + var hoverStatus = (_c = (_b = item.getModel().style) === null || _b === void 0 ? void 0 : _b[name]) === null || _c === void 0 ? void 0 : _c.stroke; + statusCache[item.getID()] = [ + [hoverStatus !== null && hoverStatus !== void 0 ? hoverStatus : endArrowFill, endArrowFill], + [hoverStatus !== null && hoverStatus !== void 0 ? hoverStatus : startArrowFill, startArrowFill], + ]; + } + var fill = statusCache[item.getID()]; + updateArrowFill(item, endArrow && fill[0][status ? 0 : 1], startArrow && fill[1][status ? 0 : 1]); + } + graph.setItemState(item, name, status); + }; + var getRelationItems = function (currentItem, name, status, type) { + var relationItems = type === 'node' + ? graph.findAll('edge', function (edge) { return edge.getSource() === currentItem || edge.getTarget() === currentItem; }) + : graph.findAll('node', function (node) { + return currentItem.getSource().get('id') === node.get('id') || + currentItem.getTarget().get('id') === node.get('id'); + }); + var highlightItems = [currentItem].concat(relationItems); + highlightItems.forEach(function (item) { + setState(item, name, status); + }); + }; + if (nodeStateStyles) { + graph.on('node:mouseenter', function (evt) { + var item = evt.item; + getRelationItems(item, 'hover', true, 'node'); + }); + graph.on('node:mouseleave', function (evt) { + var item = evt.item; + getRelationItems(item, 'hover', false, 'node'); + }); + } + if (edgeStateStyles) { + graph.on('edge:mouseenter', function (evt) { + var item = evt.item; + getRelationItems(item, 'hover', true, 'edge'); + }); + graph.on('edge:mouseleave', function (evt) { + var item = evt.item; + getRelationItems(item, 'hover', false, 'edge'); + }); + } +}; +// 统一处理 config，支持回调 +var getStyle = function (source, cfg, item, current) { + if (typeof source === 'function') { + return source(cfg, item, current); + } + return source || {}; +}; +// 统一处理 config，支持回调 +var getCommonConfig = function (cfg, item, graph) { + if (typeof cfg === 'function') { + return cfg(item, graph); + } + return cfg; +}; +var getSize = function (size) { + if (Array.isArray(size)) { + return size; + } + return size ? [size, size] : defaultNodeSize$3; +}; +// status bar 的默认宽度 +var DefaultStatusBarWidth = 4; +/** + * card status 对布局的影响，直接加到 padding 中 + */ +var getStatusBBox = function (cfg) { + if (!cfg) { + return [0, 0, 0, 0]; + } + var _a = cfg.size, size = _a === void 0 ? [] : _a, _b = cfg.position, position = _b === void 0 ? 'left' : _b; + var _c = getSize(size), width = _c[0], height = _c[1]; + var appendPadding = []; + switch (position) { + case 'top': + appendPadding.push(height !== null && height !== void 0 ? height : DefaultStatusBarWidth, 0, 0, 0); + break; + case 'right': + appendPadding.push(0, width !== null && width !== void 0 ? width : DefaultStatusBarWidth, 0, 0); + break; + case 'bottom': + appendPadding.push(0, 0, height !== null && height !== void 0 ? height : DefaultStatusBarWidth, 0); + break; + case 'left': + appendPadding.push(0, 0, 0, width !== null && width !== void 0 ? width : DefaultStatusBarWidth); + break; + } + return appendPadding; +}; +var getStatusCfg = function (cfg, cardSize) { + var _a = cfg !== null && cfg !== void 0 ? cfg : {}, _b = _a.size, size = _b === void 0 ? [] : _b, _c = _a.position, position = _c === void 0 ? 'left' : _c; + var _d = getSize(size), width = _d[0], height = _d[1]; + var cardWidth = cardSize[0], cardHeight = cardSize[1]; + var x = 0; + var y = 0; + var w = 0; + var h = 0; + switch (position) { + case 'top': + x = 0; + y = 0; + w = width !== null && width !== void 0 ? width : cardWidth; + h = height !== null && height !== void 0 ? height : DefaultStatusBarWidth; + break; + case 'left': + x = 0; + y = 0; + w = width !== null && width !== void 0 ? width : DefaultStatusBarWidth; + h = height !== null && height !== void 0 ? height : cardHeight; + break; + case 'right': + x = cardWidth - (isNumber$4(width) ? width : DefaultStatusBarWidth); + y = 0; + w = width !== null && width !== void 0 ? width : DefaultStatusBarWidth; + h = height !== null && height !== void 0 ? height : cardHeight; + break; + case 'bottom': + x = 0; + y = cardHeight - (isNumber$4(height) ? height : DefaultStatusBarWidth); + w = width !== null && width !== void 0 ? width : cardWidth; + h = height !== null && height !== void 0 ? height : DefaultStatusBarWidth; + break; + } + return { + x: x, + y: y, + width: w, + height: h, + }; +}; +var createMarker = function (cfg, group, size) { + var show = cfg.show, position = cfg.position, collapsed = cfg.collapsed, style = cfg.style; + if (show) { + group.addShape('marker', { + attrs: __assign$d(__assign$d(__assign$d({}, getMarkerPosition$1(position, size)), { r: 6, cursor: 'pointer', symbol: collapsed ? G6.Marker.expand : G6.Marker.collapse, stroke: defaultCardStyle.stroke, lineWidth: 1, fill: '#fff' }), style), + defaultCollapsed: false, + name: 'collapse-icon', + }); + } +}; +var cloneBesidesImg = function (obj) { + var clonedObj = {}; + Object.keys(obj).forEach(function (key1) { + var obj2 = obj[key1]; + if (isObject$f(obj2)) { + var clonedObj2_1 = {}; + Object.keys(obj2).forEach(function (key2) { + var v = obj2[key2]; + if (key2 === 'img' && !isString$3(v)) + return; + clonedObj2_1[key2] = clone$7(v); + }); + clonedObj[key1] = clonedObj2_1; + } + else { + clonedObj[key1] = clone$7(obj2); + } + }); + return clonedObj; +}; +var setStyles = function (container, style) { + if (style === void 0) { style = {}; } + var keys = Object.keys(style); + keys.forEach(function (key) { + container.style[key] = style[key]; + }); +}; +/** + * 对数据进行打标，加上 level 和 parentId + */ +var setTag = function (data, level, parentId, path) { + var _a; + if (level === void 0) { level = 0; } + if (parentId === void 0) { parentId = ''; } + if (path === void 0) { path = ''; } + var id = data.id, _b = data.children, children = _b === void 0 ? [] : _b; + return __assign$d(__assign$d((_a = {}, _a[prefix + "_level"] = level, _a[prefix + "_parentId"] = parentId, _a[prefix + "_currentPath"] = path, _a), data), { children: children === null || children === void 0 ? void 0 : children.map(function (item, index) { + return setTag(item, level + 1, parentId ? parentId + "-" + id : id, path + "-" + index); + }) }); +}; +/** + * 根据 level 获取相关数据 + */ +var getLevelData = function (data, level) { + var _a = data.children, children = _a === void 0 ? [] : _a, _b = data.g_level, g_level = _b === void 0 ? 0 : _b; + if (level <= 0) { + return data; + } + return __assign$d(__assign$d({}, data), { children: g_level + 1 < level + ? children === null || children === void 0 ? void 0 : children.map(function (item) { + return getLevelData(item, level); + }) + : [] }); +}; +/** + * 挂载异步数据到全局 data + */ +var setLevelData = function (graph, data, currentPath) { + var currentData = graph.get('eventData').getData(); + // 打标时已经做了编码，这直接取值即可 + var path = currentPath.split('-'); + path.shift(); // 根节点没有 path + var current = currentData; + path.forEach(function (childrenIndex) { + current = current.children[Number(childrenIndex)]; + }); + current.children = data; +}; +/** + * get children + * 获取相关路径下的一级节点 + */ +var getChildrenData = function (data, currentPath) { + // 打标时已经做了编码，这直接取值即可 + var path = currentPath.split('-'); + path.shift(); // 根节点没有 path + var current = data; + path.forEach(function (childrenIndex) { + current = current.children[Number(childrenIndex)]; + }); + if (!(current === null || current === void 0 ? void 0 : current.children)) { + return []; + } + return current.children.map(function (item) { return (__assign$d(__assign$d({}, item), { children: [] })); }); +}; +/** + * 将查询到的节点挂载到当前图数据上 + */ +var setParentChildren = function (parendData, currentPath, children) { + var path = currentPath.split('-'); + path.shift(); + var current = parendData; + path.forEach(function (childrenIndex) { + current = current.children[Number(childrenIndex)]; + }); + current.children = children; + return parendData; +}; +/** 超出省略 */ +var useEllipsis = function (text, fontSize, contentWidth) { + if (fontSize === void 0) { fontSize = 12; } + if (contentWidth === void 0) { contentWidth = 120; } + var size = isNumber$4(fontSize) ? fontSize : Number(fontSize.replace('px', '')); + var maxWords = Math.floor(contentWidth / size); + if (text.length <= maxWords) { + return text; + } + return text.slice(0, maxWords - 1) + '...'; +}; +/** 开启加载动画， 不支持同时存在多个 */ +var createLoading = function () { + var container = document.createElement('div'); + container.className = prefix + "-antd-loading"; + var styles = { + position: 'fixed', + left: '0', + top: '0', + width: '100vw', + height: '100vh', + display: 'flex', + alignItems: 'center', + justifyContent: 'center', + background: 'rgba(0,0,0, 0.25)', + color: '#fff', + fontSize: '16px', + zIndex: 999, + }; + var span = document.createElement('span'); + span.innerText = 'loading...'; + setStyles(container, styles); + container.appendChild(span); + document.body.appendChild(container); +}; +/** 关闭加载动画 */ +var closeLoading = function () { + var hideContainer = document.getElementsByClassName(prefix + "-antd-loading"); + Array.from(hideContainer).forEach(function (el) { + document.body.removeChild(el); + }); +}; + +var __assign$c = (undefined && undefined.__assign) || function () { + __assign$c = Object.assign || function(t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) + t[p] = s[p]; + } + return t; + }; + return __assign$c.apply(this, arguments); +}; +function useGraph$1(graphInstance, config, container) { + var graphHook = s(); + var data = config.data, width = config.width, height = config.height, layout = config.layout, minimapCfg = config.minimapCfg, behaviors = config.behaviors, fitCenter = config.fitCenter, nodeCfg = config.nodeCfg, edgeCfg = config.edgeCfg, markerCfg = config.markerCfg, level = config.level; + var graphOptions = s(); + // data 单独处理，会被 G6 修改 + var graphData = s(); + /** 隐藏孤立边 */ + var setEdgesState = function (edges) { + edges.forEach(function (edge) { + var _a, _b; + var _c = edge.getModel(), source = _c.source, target = _c.target; + var sourceVisible = (_a = graphInstance === null || graphInstance === void 0 ? void 0 : graphInstance.findById(source)) === null || _a === void 0 ? void 0 : _a.get('visible'); + var targetVisible = (_b = graphInstance === null || graphInstance === void 0 ? void 0 : graphInstance.findById(target)) === null || _b === void 0 ? void 0 : _b.get('visible'); + if (sourceVisible === false || targetVisible === false) { + edge.changeVisibility(false); + } + }); + }; + var changeData = function () { + var _a; + if (!graphInstance) { + return; + } + var currentData = data; + if (level) { + currentData = setTag(data); + } + graphInstance.changeData(level ? getLevelData(currentData, level) : data); + (_a = graphInstance.get('eventData')) === null || _a === void 0 ? void 0 : _a.setData(currentData); + setEdgesState(graphInstance.getEdges()); + if (fitCenter) { + graphInstance.fitCenter(); + } + }; + var updateLayout = function () { + graphInstance === null || graphInstance === void 0 ? void 0 : graphInstance.updateLayout(layout); + if (fitCenter) { + graphInstance === null || graphInstance === void 0 ? void 0 : graphInstance.fitCenter(); + } + }; + var updateNodes = function () { + if (!graphInstance) { + return; + } + var _a = nodeCfg !== null && nodeCfg !== void 0 ? nodeCfg : {}, nodeType = _a.type, nodeAnchorPoints = _a.anchorPoints, nodeStyle = _a.style, nodeLabelCfg = _a.title; + graphInstance.getNodes().forEach(function (node) { + graphInstance.updateItem(node, { + nodeCfg: nodeCfg, + markerCfg: markerCfg, + type: nodeType, + style: nodeStyle, + anchorPoints: nodeAnchorPoints, + labelCfg: nodeLabelCfg, + }); + }); + }; + var updateEdges = function () { + if (!graphInstance) { + return; + } + var _a = edgeCfg !== null && edgeCfg !== void 0 ? edgeCfg : {}, edgeType = _a.type, edgeStyle = _a.style, startArrowCfg = _a.startArrow, endArrowCfg = _a.endArrow, labelCfg = _a.label; + graphInstance.getEdges().forEach(function (edge) { + // 资金流向图 + if (edgeType === 'fund-line') { + graphInstance.updateItem(edge, { + edgeCfg: edgeCfg, + }); + } + else { + var edgeCfgModel = edge.getModel(); + var startArrow = getArrowCfg(startArrowCfg, edgeCfgModel); + var endArrow = getArrowCfg(endArrowCfg, edgeCfgModel); + var _a = labelCfg !== null && labelCfg !== void 0 ? labelCfg : {}, style = _a.style, content = _a.content; + graphInstance.updateItem(edge, { + type: edgeType, + label: getCommonConfig(content, edgeCfgModel, graphInstance), + labelCfg: { + style: getCommonConfig(style, edgeCfgModel, graphInstance), + }, + style: __assign$c({ stroke: '#ccc', startArrow: startArrow, endArrow: endArrow }, (typeof edgeStyle === 'function' + ? edgeStyle(edgeCfgModel, graphInstance) + : edgeStyle)), + }); + } + }); + }; + // 目前仅支持更新位置 + var updateMarker = function () { + if (!graphInstance) { + return; + } + graphInstance.getNodes().forEach(function (node) { + var _a = (typeof markerCfg === 'function' ? markerCfg(node.getModel(), node.get('group')) : markerCfg).position, position = _a === void 0 ? 'right' : _a; + var _b = node.getBBox(), width = _b.width, height = _b.height; + var markerShape = node + .get('group') + .get('children') + .find(function (item) { return item.get('name') === 'collapse-icon'; }); + if (markerShape) { + markerShape === null || markerShape === void 0 ? void 0 : markerShape.attr(__assign$c({}, getMarkerPosition$1(position, [width, height]))); + } + }); + }; + y$3(function () { + if (graphInstance && !graphInstance.destroyed) { + if (isEqual$2(data, graphData.current)) { + return; + } + graphData.current = deepClone(data); + changeData(); + } + }, [data]); + y$3(function () { + var _a, _b, _c, _d, _e; + if (graphInstance && !graphInstance.destroyed) { + if (isEqual$2(config, graphOptions.current)) { + return; + } + if (!isEqual$2(layout, (_a = graphOptions.current) === null || _a === void 0 ? void 0 : _a.layout)) { + updateLayout(); + } + if (!isEqual$2(minimapCfg, (_b = graphOptions.current) === null || _b === void 0 ? void 0 : _b.minimapCfg)) { + processMinimap$2(minimapCfg, graphInstance); + } + if (!isEqual$2(nodeCfg, (_c = graphOptions.current) === null || _c === void 0 ? void 0 : _c.nodeCfg)) { + updateNodes(); + } + if (!isEqual$2(edgeCfg, (_d = graphOptions.current) === null || _d === void 0 ? void 0 : _d.edgeCfg)) { + updateEdges(); + } + if (!isEqual$2(markerCfg, (_e = graphOptions.current) === null || _e === void 0 ? void 0 : _e.markerCfg)) { + updateMarker(); + } + graphOptions.current = config; + } + }, [config]); + y$3(function () { + if (graphInstance && !graphInstance.destroyed) { + var graphSize = getGraphSize$2(width, height, container); + graphInstance.changeSize(graphSize[0], graphSize[1]); + } + }, [container, width, height]); + y$3(function () { + if (graphInstance && !graphInstance.destroyed) { + var defaultMode = graphInstance.get('modes').default; + var removingBehaviors_1 = []; + defaultMode.forEach(function (be) { + if (isObject$f(be)) { + removingBehaviors_1.push(be.type); + } + else if (isString$3(be)) { + removingBehaviors_1.push(be); + } + }); + graphInstance.removeBehaviors(removingBehaviors_1, 'default'); + graphInstance.addBehaviors(behaviors, 'default'); + } + }, [behaviors]); + y$3(function () { + graphHook.current = graphInstance; + return function () { + if (graphInstance && !graphInstance.destroyed) { + graphInstance.destroy(); + graphInstance = undefined; + } + }; + }, []); + return { + graphHook: graphHook, + }; +} + +var __assign$b = (undefined && undefined.__assign) || function () { + __assign$b = Object.assign || function(t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) + t[p] = s[p]; + } + return t; + }; + return __assign$b.apply(this, arguments); +}; +var registerCustomItems = function () { + G6.registerNode('card-node', { + draw: function (cfg, group) { + var _a; + if (cfg === void 0) { cfg = {}; } + var size = cfg.size || [100, 30]; + if (typeof size === 'number') + size = [size, size]; + var style = __assign$b({ radius: 2, fill: '#fff' }, cfg.style); + var color = style.stroke || cfg.color || '#5B8FF9'; + var r = style.radius || 0; + var shape = group.addShape('rect', { + attrs: __assign$b({ x: 0, y: 0, width: size[0], height: size[1], stroke: color }, style), + name: 'main-box', + draggable: true, + }); + // title text + var title = cfg.title || cfg.label; + var titleTextShape; + var labelStyle = ((_a = cfg.labelCfg) === null || _a === void 0 ? void 0 : _a.style) || {}; + if (title) { + var titleStyle = __assign$b({ fill: '#fff' }, labelStyle); + titleTextShape = group.addShape('text', { + attrs: __assign$b(__assign$b({ textBaseline: 'top', x: 8, y: 2, + // lineHeight: 20, + text: title }, titleStyle), { fill: '#fff' }), + name: 'title', + }); + } + var titleBox = titleTextShape ? titleTextShape.getBBox() : { height: size[1] / 2 }; + // title rect + var titleRectShape = group.addShape('rect', { + attrs: { + x: 0, + y: 0, + width: size[0], + height: titleBox.height + 4, + fill: color, + radius: [r, r, 0, 0], + }, + name: 'title-rect', + draggable: true, + }); + titleTextShape === null || titleTextShape === void 0 ? void 0 : titleTextShape.toFront(); + // marker + var markerShape; + if (cfg === null || cfg === void 0 ? void 0 : cfg.children) { + markerShape = group.addShape('marker', { + attrs: { + x: size[0] / 2, + y: 0, + r: 6, + cursor: 'pointer', + symbol: cfg.collapsed ? G6.Marker.expand : G6.Marker.collapse, + stroke: color, + lineWidth: 1, + fill: '#fff', + }, + name: 'collapse-icon', + }); + } + // description + var description = cfg && cfg.description ? cfg.description : undefined; + var titleRectBox = titleRectShape.getBBox(); + var descriptionTextShape; + if (description) { + descriptionTextShape = group.addShape('text', { + attrs: __assign$b({ textBaseline: 'top', x: 8, y: titleRectBox.height + 8, text: description }, labelStyle), + name: "description", + }); + } + if (descriptionTextShape) { + var desTextShapeBBox = descriptionTextShape.getBBox(); + var height = titleRectBox.height + 16 + desTextShapeBBox.height; + var width = size[0] > desTextShapeBBox.width + 16 ? size[0] : desTextShapeBBox.width + 16; + shape.attr({ width: width, height: height }); + titleRectShape === null || titleRectShape === void 0 ? void 0 : titleRectShape.attr('width', width); + markerShape === null || markerShape === void 0 ? void 0 : markerShape.attr({ + x: width, + y: height / 2, + }); + } + return shape; + }, + update: undefined, + }, 'single-node'); + G6.registerNode('round-rect', { + drawShape: function (cfg, group) { + if (cfg === void 0) { cfg = {}; } + var size = cfg.size || [100, 30]; + if (typeof size === 'number') + size = [size, size]; + var style = cfg.style || {}; + var color = style.stroke || cfg.color || '#5B8FF9'; + var fill = style.fill || '#fff'; + style = __assign$b({ width: size[0], height: size[1], radius: size[1] / 2, fill: fill, lineWidth: 1.2, stroke: color }, style); + var rect = group.addShape('rect', { + attrs: __assign$b({ x: -size[0] / 2, y: -size[1] / 2 }, style), + name: 'rect-shape', + }); + // circles for anchor points + group.addShape('circle', { + attrs: { + x: -size[0] / 2, + y: 0, + r: 3, + fill: style.stroke, + }, + name: 'circle-shape', + }); + group.addShape('circle', { + attrs: { + x: size[0] / 2, + y: 0, + r: 3, + fill: style.stroke, + }, + name: 'circle-shape2', + }); + return rect; + }, + getAnchorPoints: function getAnchorPoints() { + return [ + [0, 0.5], + [1, 0.5], + ]; + }, + update: function update(cfg, item) { + var _a; + if (cfg === void 0) { cfg = {}; } + var group = item.getContainer(); + var children = group.get('children'); + var node = children[0]; + var circleLeft = children[1]; + var circleRight = children[2]; + var stroke = ((_a = cfg.style) === null || _a === void 0 ? void 0 : _a.stroke) || '#5B8FF9'; + if (stroke) { + node.attr('stroke', stroke); + circleLeft.attr('fill', stroke); + circleRight.attr('fill', stroke); + } + }, + }, 'single-node'); + G6.registerEdge('fund-polyline', { + draw: function draw(cfg, group) { + var _a; + if (cfg === void 0) { cfg = {}; } + var startPoint = cfg.startPoint; + var endPoint = cfg.endPoint; + var Ydiff = endPoint.y - startPoint.y; + var slope = Ydiff !== 0 ? Math.min(500 / Math.abs(Ydiff), 20) : 0; + var cpOffset = slope > 15 ? 0 : 16; + var offset = Ydiff < 0 ? cpOffset : -cpOffset; + var line1EndPoint = { + x: startPoint.x + slope, + y: endPoint.y + offset, + }; + var line2StartPoint = { + x: line1EndPoint.x + cpOffset, + y: endPoint.y, + }; + // 控制点坐标 + var controlPoint = { + x: ((line1EndPoint.x - startPoint.x) * (endPoint.y - startPoint.y)) / + (line1EndPoint.y - startPoint.y) + + startPoint.x, + y: endPoint.y, + }; + var path = [ + ['M', startPoint.x, startPoint.y], + ['L', line1EndPoint.x, line1EndPoint.y], + ['Q', controlPoint.x, controlPoint.y, line2StartPoint.x, line2StartPoint.y], + ['L', endPoint.x, endPoint.y], + ]; + if (Math.abs(Ydiff) <= 5) { + path = [ + ['M', startPoint.x, startPoint.y], + ['L', endPoint.x, endPoint.y], + ]; + } + var style = cfg.style; + var stroke = style.stroke || ((cfg === null || cfg === void 0 ? void 0 : cfg.colorMap) && cfg.colorMap[cfg.dataType]) + ? (cfg === null || cfg === void 0 ? void 0 : cfg.colorMap)[cfg === null || cfg === void 0 ? void 0 : cfg.dataType] + : '#5B8FF9'; + var endArrow = ((_a = cfg.style) === null || _a === void 0 ? void 0 : _a.endArrow) || false; + if (isObject$f(endArrow)) + endArrow.fill = stroke; + var line = group.addShape('path', { + attrs: { + path: path, + stroke: stroke, + lineWidth: style.lineWidth || 1.2, + endArrow: endArrow, + }, + name: 'path-shape', + }); + var labelLeftOffset = 0; + var labelTopOffset = 8; + // label + var labelTextShape; + var textBeginX = line2StartPoint.x + labelLeftOffset; + if (cfg === null || cfg === void 0 ? void 0 : cfg.label) { + labelTextShape = group.addShape('text', { + attrs: { + text: cfg.label, + x: textBeginX, + y: endPoint.y - labelTopOffset - 2, + fontSize: 14, + textAlign: 'left', + textBaseline: 'middle', + fill: '#000', + }, + name: 'text-shape-label', + }); + } + // dataType + if (cfg === null || cfg === void 0 ? void 0 : cfg.dataType) { + var labelTextShapeBBox = labelTextShape ? labelTextShape.getBBox() : { height: 0 }; + group.addShape('text', { + attrs: { + text: cfg.dataType, + x: textBeginX, + y: endPoint.y - labelTopOffset - labelTextShapeBBox.height - 2, + fontSize: 10, + textAlign: 'left', + textBaseline: 'middle', + fill: '#000', + }, + name: 'text-shape-type', + }); + } + // subLabel + if (cfg === null || cfg === void 0 ? void 0 : cfg.subLabel) { + group.addShape('text', { + attrs: { + text: cfg.subLabel, + x: textBeginX, + y: endPoint.y + labelTopOffset + 4, + fontSize: 12, + fontWeight: 300, + textAlign: 'left', + textBaseline: 'middle', + fill: '#000', + }, + name: 'text-shape-sub-label', + }); + } + return line; + }, + update: undefined, + }, 'single-edge'); + G6.registerEdge('flow-line', { + draw: function (cfg, group) { + if (cfg === void 0) { cfg = {}; } + var startPoint = cfg.startPoint, endPoint = cfg.endPoint; + var _a = cfg.style, style = _a === void 0 ? {} : _a; + var shape = group.addShape('path', { + attrs: { + stroke: style.stroke, + endArrow: style.endArrow, + path: [ + ['M', startPoint.x, startPoint.y], + ['L', startPoint.x, (startPoint.y + endPoint.y) / 2], + ['L', endPoint.x, (startPoint.y + endPoint.y) / 2], + ['L', endPoint.x, endPoint.y], + ], + }, + }); + return shape; + }, + }); +}; +var customIconNode = function (params) { + G6.registerNode('icon-node', { + options: { + size: [60, 20], + stroke: '#91d5ff', + fill: '#91d5ff', + }, + draw: function (cfg, group) { + if (cfg === void 0) { cfg = {}; } + // @ts-ignore + var styles = this.getShapeStyle(cfg); + var _a = cfg.labelCfg, labelCfg = _a === void 0 ? {} : _a; + var keyShape = group.addShape('rect', { + attrs: __assign$b(__assign$b({}, styles), { x: 0, y: 0 }), + }); + /** + * leftIcon 格式如下： + * { + * style: ShapeStyle; + * img: '' + * } + */ + var style = { + fill: '#e6fffb', + }; + var img = 'https://g.alicdn.com/cm-design/arms-trace/1.0.155/styles/armsTrace/images/TAIR.png'; + if (cfg.leftIcon) { + style = __assign$b(__assign$b({}, style), cfg.leftIcon.style); + img = cfg.leftIcon.img; + } + group.addShape('rect', { + attrs: __assign$b({ x: 1, y: 1, width: 38, height: styles.height - 2 }, style), + }); + group.addShape('image', { + attrs: { + x: 8, + y: 8, + width: 24, + height: 24, + img: img, + }, + name: 'image-shape', + }); + if (params.enableEdit) { + group.addShape('marker', { + attrs: { + x: styles.width / 3, + y: styles.height + 6, + r: 6, + stroke: '#73d13d', + cursor: 'pointer', + symbol: G6.Marker.expand, + }, + name: 'add-item', + }); + group.addShape('marker', { + attrs: { + x: (styles.width * 2) / 3, + y: styles.height + 6, + r: 6, + stroke: '#ff4d4f', + cursor: 'pointer', + symbol: G6.Marker.collapse, + }, + name: 'remove-item', + }); + } + if (cfg.label) { + group.addShape('text', { + attrs: __assign$b(__assign$b({}, labelCfg.style), { text: cfg.label, x: styles.width / 2, y: styles.height / 1.5 }), + }); + } + return keyShape; + }, + }, 'rect'); +}; + +var defaultLabelCfg$1 = { + style: { + fill: '#000', + fontSize: 12, + }, +}; +var defaultEdgeStyle$2 = { + stroke: '#91d5ff', + endArrow: { + path: G6.Arrow.vee(10, 10), + }, +}; +var defaultNodeAnchorPoints$2 = [ + [0.5, 0], + [0.5, 1], +]; +var defaultStateStyles$1 = { + hover: { + stroke: '#1890ff', + lineWidth: 2, + }, +}; +var defaultNodeSize$2 = [120, 40]; + +var __assign$a = (undefined && undefined.__assign) || function () { + __assign$a = Object.assign || function(t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) + t[p] = s[p]; + } + return t; + }; + return __assign$a.apply(this, arguments); +}; +var defaultMinimapCfg$1 = { + show: false, + size: [150, 100], + type: 'keyShape', +}; +var getGraphSize$1 = function (width, height, container) { + var CANVAS_WIDTH; + var CANVAS_HEIGHT; + if (container && container.current) { + CANVAS_WIDTH = container.current.offsetWidth; + CANVAS_HEIGHT = container.current.offsetHeight || 500; + } + if ((!width && !CANVAS_WIDTH) || (!height && !CANVAS_HEIGHT)) { + console.warn('请为 Graph 指定 width 与 height！否则将使用默认值 500 * 500'); + return [500, 500]; + } + return [width || CANVAS_WIDTH || 500, height || CANVAS_HEIGHT || 500]; +}; +var processMinimap$1 = function (cfg, graph) { + if (!graph || graph.destroyed) + return; + if (cfg && cfg.show) { + var curMminimapCfg = Object.assign(defaultMinimapCfg$1, cfg); + var minimap = new G6.Minimap(__assign$a({}, curMminimapCfg)); + graph.addPlugin(minimap); + return minimap; + } + return null; +}; +var uuid$1 = function () { + return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) { + var r = (Math.random() * 16) | 0; + var v = c == 'x' ? r : (r & 0x3) | 0x8; + return v.toString(16); + }); +}; +// 同一页面存在多 graph 时需要指定 graphId +var getGraphId$1 = function (graph) { + if (graph.current) { + return graph.current; + } + graph.current = "IndentedTreeGraph-" + uuid$1(); + return graph.current; +}; +var renderGraph$1 = function (graph, data) { + var originData = deepClone(data); + graph.data(originData); + graph.render(); +}; +// 事件绑定，兼容历史数据 +var bindEvents = function (graph, props) { + var handleEdgeClick = props.handleEdgeClick, handleEdgeHover = props.handleEdgeHover, handleEdgeUnHover = props.handleEdgeUnHover, handleNodeClick = props.handleNodeClick, handleNodeHover = props.handleNodeHover, handleNodeUnHover = props.handleNodeUnHover, handleCanvasClick = props.handleCanvasClick; + graph.on('edge:mouseenter', function (evt) { + var item = evt.item; + graph.setItemState(item, 'hover', true); + handleEdgeHover === null || handleEdgeHover === void 0 ? void 0 : handleEdgeHover(item, graph); + }); + graph.on('edge:mouseleave', function (evt) { + var item = evt.item; + graph.setItemState(item, 'hover', false); + handleEdgeUnHover === null || handleEdgeUnHover === void 0 ? void 0 : handleEdgeUnHover(item, graph); + }); + graph.on('edge:click', function (evt) { + var item = evt.item; + handleEdgeClick === null || handleEdgeClick === void 0 ? void 0 : handleEdgeClick(item, graph); + }); + graph.on('edge:touchstart', function (evt) { + var item = evt.item; + handleEdgeClick === null || handleEdgeClick === void 0 ? void 0 : handleEdgeClick(item, graph); + }); + graph.on('node:mouseenter', function (evt) { + var item = evt.item; + graph.setItemState(item, 'hover', true); + handleNodeHover === null || handleNodeHover === void 0 ? void 0 : handleNodeHover(item, graph); + }); + graph.on('node:mouseleave', function (evt) { + var item = evt.item; + graph.setItemState(item, 'hover', false); + handleNodeUnHover === null || handleNodeUnHover === void 0 ? void 0 : handleNodeUnHover(item, graph); + }); + graph.on('node:click', function (evt) { + var item = evt.item; + handleNodeClick === null || handleNodeClick === void 0 ? void 0 : handleNodeClick(item, graph); + }); + graph.on('canvas:click', function () { + handleCanvasClick === null || handleCanvasClick === void 0 ? void 0 : handleCanvasClick(graph); + }); + graph.on('canvas:touchstart', function () { + handleCanvasClick === null || handleCanvasClick === void 0 ? void 0 : handleCanvasClick(graph); + }); +}; +/** + * 设置 props 默认值 + * props 会在对应图表和 hooks 里面使用，不想加个很长的赋值表达式。 + * layout 使用 merge + */ +var useProps$2 = function (props, defaultProps) { + return __assign$a(__assign$a(__assign$a({}, defaultProps), props), { layout: __assign$a(__assign$a({}, defaultProps === null || defaultProps === void 0 ? void 0 : defaultProps.layout), props === null || props === void 0 ? void 0 : props.layout) }); +}; + +var defaultNodeStyle$6 = { + fill: '#91d5ff', + stroke: '#40a9ff', + radius: 2, +}; +var defaultEdgeStyle$1 = { + stroke: '#91d5ff', + endArrow: { + path: 'M 0,0 L 12, 6 L 9,0 L 12, -6 Z', + fill: '#91d5ff', + d: -20, + }, +}; +var defaultLayout$b = { + type: 'compactBox', + direction: 'TB', + getId: function getId(d) { + return d.id; + }, + getHeight: function getHeight() { + return 16; + }, + getWidth: function getWidth() { + return 16; + }, + getVGap: function getVGap() { + return 40; + }, + getHGap: function getHGap() { + return 70; + }, +}; +var defaultProps$b = { + nodeType: 'rect', + edgeType: 'flow-line', + collapseExpand: false, + nodeSize: [120, 40], + nodeLabelCfg: defaultLabelCfg$1, + edgeLabelCfg: defaultLabelCfg$1, + layout: defaultLayout$b, + enableEdit: false, + nodeStyle: defaultNodeStyle$6, + edgeStyle: defaultEdgeStyle$1, + nodeStateStyles: defaultStateStyles$1, + edgeStateStyles: defaultStateStyles$1, + autoFit: true, +}; +var graphs$6 = {}; +var OrganizationTreeGraphComponent = function (props) { + var uProps = useProps$2(props, defaultProps$b); + var data = uProps.data, className = uProps.className, style = uProps.style, width = uProps.width, height = uProps.height, _a = uProps.nodeType, nodeType = _a === void 0 ? 'rect' : _a, _b = uProps.edgeType, edgeType = _b === void 0 ? 'flow-line' : _b, _c = uProps.collapseExpand, collapseExpand = _c === void 0 ? false : _c, _d = uProps.nodeSize, nodeSize = _d === void 0 ? [120, 40] : _d, _e = uProps.nodeLabelCfg, nodeLabelCfg = _e === void 0 ? defaultLabelCfg$1 : _e, _f = uProps.edgeLabelCfg, edgeLabelCfg = _f === void 0 ? defaultLabelCfg$1 : _f, _g = uProps.layout, layout = _g === void 0 ? defaultLayout$b : _g, _h = uProps.enableEdit, enableEdit = _h === void 0 ? false : _h, minimapCfg = uProps.minimapCfg, _j = uProps.nodeStyle, nodeStyle = _j === void 0 ? defaultNodeStyle$6 : _j, _k = uProps.edgeStyle, edgeStyle = _k === void 0 ? defaultEdgeStyle$1 : _k, _l = uProps.nodeStateStyles, nodeStateStyles = _l === void 0 ? defaultStateStyles$1 : _l, _m = uProps.edgeStateStyles, edgeStateStyles = _m === void 0 ? defaultStateStyles$1 : _m, _o = uProps.autoFit, autoFit = _o === void 0 ? true : _o, graphRef = uProps.graphRef, onReady = uProps.onReady, loading = uProps.loading, loadingTemplate = uProps.loadingTemplate, errorTemplate = uProps.errorTemplate; + var container = React.useRef(null); + var graph = React.useRef(null); + var graphId = getGraphId$1(graph); + useGraph$1(graphs$6[graphId], uProps, container); + y$3(function () { + var graphSize = getGraphSize$1(width, height, container); + if (nodeType === 'icon-node') { + customIconNode({ enableEdit: enableEdit }); + } + var graph = graphs$6[graphId]; + if (!graph) { + graph = new G6.TreeGraph({ + container: container.current, + width: graphSize[0], + height: graphSize[1], + linkCenter: true, + modes: { + default: ['drag-canvas', 'zoom-canvas'], + }, + defaultNode: { + type: nodeType, + size: nodeSize, + style: nodeStyle, + labelCfg: nodeLabelCfg, + }, + defaultEdge: { + type: edgeType, + style: edgeStyle, + labelCfg: edgeLabelCfg, + }, + nodeStateStyles: nodeStateStyles, + edgeStateStyles: edgeStateStyles, + layout: layout, + fitView: autoFit, + }); + graphs$6[graphId] = graph; + } + if (graphRef) { + graphRef.current = graph; + } + processMinimap$1(minimapCfg, graph); + renderGraph$1(graph, data); + if (onReady) { + onReady(graph); + } + if (collapseExpand) { + graph.addBehaviors({ + type: 'collapse-expand', + }, 'default'); + } + bindEvents(graph, props); + return function () { + if (graphs$6[graphId]) { + graphs$6[graphId].destroy(); + delete graphs$6[graphId]; + } + }; + }, []); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}; +var OrganizationTreeGraph = OrganizationTreeGraphComponent; + +// 默认交互状态 +var defaultStateStyles = { + hover: { + stroke: '#1890ff', + lineWidth: 2, + }, +}; +// card 默认节点大小 +var defaultNodeSize$1 = [120, 40]; +// 默认节点样式 +var defaultNodeStyle$5 = { + stroke: '#40a9ff', +}; +// 默认 anchor 连接点 +var defaultNodeAnchorPoints$1 = [ + [0, 0.5], + [1, 0.5], +]; +// card 内部 padding | margin +var Margin = 6; +// card title 默认样式 +var defaultTitleLabelCfg = { + fill: '#fff', + fontSize: 12, +}; +var cardTitlePadding = 2; +// card body|footer 默认样式 +var defaultLabelStyle = { + fill: '#000', + fontSize: 12, +}; +var defaultMinimapCfg = { + show: false, + size: [150, 100], + type: 'keyShape', +}; + +var __assign$9 = (undefined && undefined.__assign) || function () { + __assign$9 = Object.assign || function(t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) + t[p] = s[p]; + } + return t; + }; + return __assign$9.apply(this, arguments); +}; +var getGraphSize = function (width, height, container) { + var CANVAS_WIDTH; + var CANVAS_HEIGHT; + if (container && container.current) { + CANVAS_WIDTH = container.current.offsetWidth; + CANVAS_HEIGHT = container.current.offsetHeight || 500; + } + if ((!width && !CANVAS_WIDTH) || (!height && !CANVAS_HEIGHT)) { + console.warn('请为 Graph 指定 width 与 height！否则将使用默认值 500 * 500'); + return [500, 500]; + } + return [width || CANVAS_WIDTH || 500, height || CANVAS_HEIGHT || 500]; +}; +// 展开&折叠事件 +var bindDefaultEvents = function (graph, collapseExpand) { + if (collapseExpand) { + var onClick_1 = function (e) { + var item = e.item; + if (e.target.get('name') === 'collapse-icon') { + graph.updateItem(item, { + collapsed: !item.getModel().collapsed, + }); + graph.layout(); + } + }; + graph.on('node:click', function (e) { + onClick_1(e); + }); + graph.on('node:touchstart', function (e) { + onClick_1(e); + }); + } +}; +// 默认箭头样式 +var getDefaultEdgeArrowCfg = function (d, arrowType, fill) { + if (d === void 0) { d = 0; } + if (arrowType === void 0) { arrowType = 'vee'; } + if (fill === void 0) { fill = '#ccc'; } + return { + endArrow: { + path: G6.Arrow[arrowType](10, 10, d), + fill: fill, + d: d, + }, + }; +}; +// 统一处理 text&style +var getContentAndStyle = function (cfg) { + if (typeof cfg === 'string' || typeof cfg === 'number') { + return { + text: cfg, + }; + } + var content = cfg.content, style = cfg.style; + return { + text: content, + style: style, + }; +}; +// 统一处理 config，支持回调 +var getConfig = function (source, item, cfg) { + if (typeof source === 'function') { + return source(item, cfg); + } + return source || {}; +}; +var uuid = function () { + return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) { + var r = (Math.random() * 16) | 0; + var v = c == 'x' ? r : (r & 0x3) | 0x8; + return v.toString(16); + }); +}; +// 同一页面存在多 graph 时需要指定 graphId +var getGraphId = function (graph) { + if (graph.current) { + return graph.current; + } + graph.current = "IndentedTreeGraph-" + uuid(); + return graph.current; +}; +var renderGraph = function (graph, data) { + var originData = deepClone(data); + graph.data(originData); + graph.render(); +}; +var processMinimap = function (cfg, graph) { + if (cfg === void 0) { cfg = {}; } + if (!graph || graph.destroyed) + return; + if (cfg.show) { + var curMminimapCfg = Object.assign(defaultMinimapCfg, cfg); + var minimap = new G6.Minimap(__assign$9({}, curMminimapCfg)); + graph.addPlugin(minimap); + return minimap; + } + return null; +}; +/** + * min ma + */ +var getMarkerPosition = function (direction, size) { + if (direction === void 0) { direction = 'right'; } + var width = size[0], height = size[1]; + var x = 0; + var y = 0; + switch (direction) { + case 'top': + x = width / 2; + y = 0; + break; + case 'right': + x = width; + y = height / 2; + break; + case 'bottom': + x = width / 2; + y = height; + break; + case 'left': + x = 0; + y = height / 2; + break; + } + return { x: x, y: y }; +}; +/** + * 设置 props 默认值 + * props 会在对应图表和 hooks 里面使用，不想加个很长的赋值表达式。 + * layout 使用 merge + */ +var useProps$1 = function (props, defaultProps) { + return __assign$9(__assign$9(__assign$9({}, defaultProps), props), { layout: __assign$9(__assign$9({}, defaultProps === null || defaultProps === void 0 ? void 0 : defaultProps.layout), props === null || props === void 0 ? void 0 : props.layout) }); +}; + +var __assign$8 = (undefined && undefined.__assign) || function () { + __assign$8 = Object.assign || function(t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) + t[p] = s[p]; + } + return t; + }; + return __assign$8.apply(this, arguments); +}; +var registerCardNode = function () { + G6.registerNode('card', { + draw: function (cfg, group) { + var _a; + if (cfg === void 0) { cfg = {}; } + var title = cfg.title, body = cfg.body, footer = cfg.footer, collapseExpand = cfg.collapseExpand, children = cfg.children, markerPosition = cfg.markerPosition; + var size = cfg.size || [100, 30]; + var height = 0; // 统计容器总高度，动态设置 + if (typeof size === 'number') + size = [size, size]; + var style = __assign$8({ radius: 2, fill: '#fff' }, cfg.style); + var color = style.stroke || cfg.color || '#5B8FF9'; + var radius = style.radius; + // node box + var shape = group.addShape('rect', { + attrs: __assign$8({ x: 0, y: 0, width: size[0], height: size[1], stroke: color }, style), + name: 'main-box', + draggable: true, + }); + // node title + var titleTextShape; + if (title) { + var _b = getContentAndStyle(title), text = _b.text, _c = _b.style, titleStyle = _c === void 0 ? cfg.titleStyle : _c; + titleTextShape = group.addShape('text', { + attrs: __assign$8(__assign$8({ textBaseline: 'top', x: Margin, y: cardTitlePadding, text: text }, defaultTitleLabelCfg), getConfig(titleStyle, group)), + name: 'title', + }); + } + var titleHeight = (titleTextShape + ? titleTextShape.getBBox() + : { height: size[1] / 2 }).height; + // title rect + var titleRectShape = group.addShape('rect', { + attrs: { + x: 0, + y: 0, + width: size[0], + height: titleHeight + 2 * cardTitlePadding, + fill: color, + radius: [radius, radius, 0, 0], + }, + name: 'title-rect', + draggable: true, + }); + titleTextShape === null || titleTextShape === void 0 ? void 0 : titleTextShape.toFront(); + // collapse marker + var markerShape; + if (collapseExpand && children) { + markerShape = group.addShape('marker', { + attrs: __assign$8(__assign$8(__assign$8({}, getMarkerPosition(markerPosition, size)), { r: 6, cursor: 'pointer', symbol: cfg.collapsed ? G6.Marker.expand : G6.Marker.collapse, stroke: color, lineWidth: 1, fill: '#fff' }), getConfig(cfg.markerStyle, group, __assign$8(__assign$8({}, cfg), { name: 'collapse-icon' }))), + name: 'collapse-icon', + }); + } + var titleRectBoxHeight = titleRectShape.getBBox().height; + height += titleRectBoxHeight; + // body + var bodyShape; + if (body) { + var _d = getContentAndStyle(body), text = _d.text, _e = _d.style, bodyStyle = _e === void 0 ? cfg.bodyStyle : _e; + bodyShape = group.addShape('text', { + attrs: __assign$8(__assign$8({ textBaseline: 'top', x: Margin, y: height + Margin, text: text }, defaultLabelStyle), getConfig(bodyStyle, group)), + name: "body", + }); + height += bodyShape.getBBox().height; + } + // footer + var footerTextShape; + if (footer) { + if (bodyShape) { + height += Margin; + } + var _f = getContentAndStyle(footer), labelText = _f.text, _g = _f.style, labelStyle = _g === void 0 ? cfg.footerStyle : _g; + footerTextShape = group.addShape('text', { + attrs: __assign$8(__assign$8({ textBaseline: 'top', x: Margin, y: height + Margin, text: labelText }, defaultLabelStyle), getConfig(labelStyle, group)), + name: "footer-label", + }); + var _h = footerTextShape.getBBox(), width = _h.width, contentHeight = _h.height; + var footerValueHeight = 0; + if (typeof cfg.footer === 'object' && ((_a = cfg.footer) === null || _a === void 0 ? void 0 : _a.value)) { + var _j = getContentAndStyle({ + content: cfg.footer.value, + style: cfg.footer.valueStyle, + }), valueText = _j.text, _k = _j.style, valueStyle = _k === void 0 ? cfg.footerValueStyle || cfg.footerStyle : _k; + var valueTextShape = group.addShape('text', { + attrs: __assign$8(__assign$8({ textBaseline: 'top', x: width + Margin * 2, y: height + Margin, text: valueText }, defaultLabelStyle), getConfig(valueStyle, group)), + name: "footer-value", + }); + var valueHeight = valueTextShape.getBBox().height; + footerValueHeight = valueHeight; + } + height += Math.max(contentHeight, footerValueHeight); + } + // 调整容器宽高 + if (bodyShape) { + var desTextShapeBBox = bodyShape.getBBox(); + var width = size[0] > desTextShapeBBox.width + 16 ? size[0] : desTextShapeBBox.width + 16; + shape.attr({ width: width, height: height + 16 }); + titleRectShape === null || titleRectShape === void 0 ? void 0 : titleRectShape.attr('width', width); + markerShape === null || markerShape === void 0 ? void 0 : markerShape.attr(__assign$8({}, getMarkerPosition(markerPosition, [ + width, + height + titleHeight + 2 * cardTitlePadding, + ]))); + } + return shape; + }, + update: undefined, + }, 'single-node'); +}; +var registerIconNode = function () { + G6.registerNode('icon-node', { + options: { + size: [60, 20], + stroke: '#91d5ff', + fill: '#91d5ff', + }, + draw: function (cfg, group) { + if (cfg === void 0) { cfg = {}; } + // @ts-ignore + var styles = this.getShapeStyle(cfg); + var _a = cfg.labelCfg, labelCfg = _a === void 0 ? {} : _a, labelStyle = cfg.labelStyle, label = cfg.label, markerStyle = cfg.markerStyle, showMarker = cfg.showMarker, title = cfg.title, titleStyle = cfg.titleStyle; + var keyShape = group.addShape('rect', { + attrs: __assign$8(__assign$8({}, styles), { x: 0, y: 0 }), + }); + var keyShapeHeight = keyShape.getBBox().height; + var headShape; + if (cfg.leftIcon) { + var _b = cfg.leftIcon, _c = _b.x, x = _c === void 0 ? 8 : _c, y = _b.y, _d = _b.width, width = _d === void 0 ? 24 : _d, _e = _b.height, height = _e === void 0 ? 24 : _e, style = _b.style; + if (style) { + group.addShape('rect', { + attrs: __assign$8({ x: 1, y: 1, width: 38, height: styles.height - 2 }, style), + }); + } + headShape = group.addShape('image', { + attrs: { + x: x, + y: y || keyShapeHeight / 2 - height / 2, + width: width, + height: height, + img: cfg.leftIcon.img, + }, + name: 'image-shape', + }); + } + if (showMarker) { + group.addShape('marker', { + attrs: __assign$8({ x: styles.width / 3, y: styles.height + 6, r: 6, stroke: '#73d13d', cursor: 'pointer', symbol: G6.Marker.expand }, getConfig(markerStyle, group, __assign$8(__assign$8({}, cfg), { name: 'add-item' }))), + name: 'add-item', + }); + group.addShape('marker', { + attrs: __assign$8({ x: (styles.width * 2) / 3, y: styles.height + 6, r: 6, stroke: '#ff4d4f', cursor: 'pointer', symbol: G6.Marker.collapse }, getConfig(markerStyle, group, __assign$8(__assign$8({}, cfg), { name: 'remove-item' }))), + name: 'remove-item', + }); + } + if (label) { + var textCfg = labelStyle ? getConfig(labelStyle, group, cfg) : labelCfg.style; + var y = title + ? styles.height / 2 - (textCfg.fontSize * 1 || 12) - Margin / 2 + : styles.height / 2; + group.addShape('text', { + attrs: __assign$8({ text: label, x: styles.width / 2, y: y, textAlign: headShape ? 'start' : 'center', textBaseline: title ? 'top' : 'middle' }, textCfg), + }); + } + if (title) { + var titleCfg = titleStyle ? getConfig(titleStyle, group, cfg) : labelCfg.style; + group.addShape('text', { + attrs: __assign$8({ text: title, x: styles.width / 2, y: styles.height / 2 + Margin / 2, textAlign: headShape ? 'start' : 'center', textBaseline: 'top' }, titleCfg), + }); + } + return keyShape; + }, + }, 'rect'); +}; + +registerCustomItems(); +registerCardNode(); +var defaultNodeStyle$4 = { + stroke: '#40a9ff', +}; +var defaultLayout$a = { + type: 'dagre', + rankdir: 'TB', + nodesepFunc: function () { return 0; }, + ranksepFunc: function () { return 0; }, + controlPoints: true, +}; +var defaultProps$a = { + nodeType: 'modelRect', + edgeType: 'polyline', + behaviors: ['zoom-canvas', 'drag-canvas'], + nodeSize: defaultNodeSize$2, + nodeLabelCfg: defaultLabelCfg$1, + edgeLabelCfg: defaultLabelCfg$1, + nodeAnchorPoints: defaultNodeAnchorPoints$2, + layout: defaultLayout$a, + nodeStyle: defaultNodeStyle$4, + edgeStyle: defaultEdgeStyle$2, + nodeStateStyles: defaultStateStyles$1, + edgeStateStyles: defaultStateStyles$1, + autoFit: true, +}; +var graphs$5 = {}; +var DagreGraph = function (props) { + var uProps = useProps$2(props, defaultProps$a); + var data = uProps.data, className = uProps.className, style = uProps.style, width = uProps.width, height = uProps.height, _a = uProps.nodeType, nodeType = _a === void 0 ? 'modelRect' : _a, _b = uProps.edgeType, edgeType = _b === void 0 ? 'polyline' : _b, _c = uProps.behaviors, behaviors = _c === void 0 ? ['zoom-canvas', 'drag-canvas'] : _c, _d = uProps.nodeSize, nodeSize = _d === void 0 ? defaultNodeSize$2 : _d, _e = uProps.nodeLabelCfg, nodeLabelCfg = _e === void 0 ? defaultLabelCfg$1 : _e, _f = uProps.edgeLabelCfg, edgeLabelCfg = _f === void 0 ? defaultLabelCfg$1 : _f, _g = uProps.nodeAnchorPoints, nodeAnchorPoints = _g === void 0 ? defaultNodeAnchorPoints$2 : _g, _h = uProps.layout, layout = _h === void 0 ? defaultLayout$a : _h, minimapCfg = uProps.minimapCfg, _j = uProps.nodeStyle, nodeStyle = _j === void 0 ? defaultNodeStyle$4 : _j, _k = uProps.edgeStyle, edgeStyle = _k === void 0 ? defaultEdgeStyle$2 : _k, _l = uProps.nodeStateStyles, nodeStateStyles = _l === void 0 ? defaultStateStyles$1 : _l, _m = uProps.edgeStateStyles, edgeStateStyles = _m === void 0 ? defaultStateStyles$1 : _m, _o = uProps.autoFit, autoFit = _o === void 0 ? true : _o, graphRef = uProps.graphRef, onReady = uProps.onReady, loading = uProps.loading, loadingTemplate = uProps.loadingTemplate, errorTemplate = uProps.errorTemplate; + var container = React.useRef(null); + var graph = React.useRef(null); + var graphId = getGraphId$1(graph); + useGraph$1(graphs$5[graphId], uProps, container); + y$3(function () { + var graphSize = getGraphSize$1(width, height, container); + var graph = graphs$5[graphId]; + if (!graph) { + graph = new G6.Graph({ + container: container.current, + width: graphSize[0], + height: graphSize[1], + modes: { + default: behaviors, + }, + defaultNode: { + type: nodeType, + size: nodeSize, + style: nodeStyle, + anchorPoints: nodeAnchorPoints, + labelCfg: nodeLabelCfg, + }, + defaultEdge: { + type: edgeType, + style: edgeStyle, + labelCfg: edgeLabelCfg, + }, + nodeStateStyles: nodeStateStyles, + edgeStateStyles: edgeStateStyles, + layout: layout, + fitView: autoFit, + }); + graphs$5[graphId] = graph; + } + if (graphRef) { + graphRef.current = graph; + } + processMinimap$1(minimapCfg, graph); + renderGraph$1(graph, data); + if (onReady) { + onReady(graph); + } + bindEvents(graph, props); + return function () { + if (graphs$5[graphId]) { + graphs$5[graphId].destroy(); + delete graphs$5[graphId]; + } + }; + }, []); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}; +var DagreGraph$1 = DagreGraph; + +registerCustomItems(); +var defaultNodeSize = [150, 30]; +var defaultNodeStyle$3 = { + stroke: '#72CC4A', + fill: '#f00', +}; +var defaultLayout$9 = { + type: 'dagre', + rankdir: 'LR', + nodesep: 30, + ranksep: 50, +}; +var defaultLabelCfg = { + style: { + fill: '#000000A6', + fontSize: 10, + }, +}; +var defaultProps$9 = { + nodeType: 'round-rect', + edgeType: 'fund-polyline', + behaviors: ['zoom-canvas', 'drag-canvas'], + nodeSize: defaultNodeSize, + nodeLabelCfg: defaultLabelCfg, + edgeLabelCfg: defaultLabelCfg, + nodeAnchorPoints: defaultNodeAnchorPoints$2, + layout: defaultLayout$9, + nodeStyle: defaultNodeStyle$3, + edgeStyle: defaultEdgeStyle$2, + nodeStateStyles: defaultStateStyles$1, + edgeStateStyles: defaultStateStyles$1, + colorMap: {}, + autoFit: true, +}; +var graphs$4 = {}; +var DagreFundFlowGraph = function (props) { + var uProps = useProps$2(props, defaultProps$9); + var data = uProps.data, className = uProps.className, style = uProps.style, width = uProps.width, height = uProps.height, _a = uProps.nodeType, nodeType = _a === void 0 ? 'round-rect' : _a, _b = uProps.edgeType, edgeType = _b === void 0 ? 'fund-polyline' : _b, _c = uProps.behaviors, behaviors = _c === void 0 ? ['zoom-canvas', 'drag-canvas'] : _c, _d = uProps.nodeSize, nodeSize = _d === void 0 ? defaultNodeSize : _d, _e = uProps.nodeLabelCfg, nodeLabelCfg = _e === void 0 ? defaultLabelCfg : _e, _f = uProps.edgeLabelCfg, edgeLabelCfg = _f === void 0 ? defaultLabelCfg : _f, _g = uProps.nodeAnchorPoints, nodeAnchorPoints = _g === void 0 ? defaultNodeAnchorPoints$2 : _g, _h = uProps.layout, layout = _h === void 0 ? defaultLayout$9 : _h, minimapCfg = uProps.minimapCfg, _j = uProps.nodeStyle, nodeStyle = _j === void 0 ? defaultNodeStyle$3 : _j, _k = uProps.edgeStyle, edgeStyle = _k === void 0 ? defaultEdgeStyle$2 : _k, _l = uProps.nodeStateStyles, nodeStateStyles = _l === void 0 ? defaultStateStyles$1 : _l, _m = uProps.edgeStateStyles, edgeStateStyles = _m === void 0 ? defaultStateStyles$1 : _m, _o = uProps.colorMap, colorMap = _o === void 0 ? {} : _o, _p = uProps.autoFit, autoFit = _p === void 0 ? true : _p, graphRef = uProps.graphRef, onReady = uProps.onReady, loading = uProps.loading, loadingTemplate = uProps.loadingTemplate, errorTemplate = uProps.errorTemplate; + var container = React.useRef(null); + var graph = React.useRef(null); + var graphId = getGraphId$1(graph); + useGraph$1(graphs$4[graphId], uProps, container); + y$3(function () { + var graphSize = getGraphSize$1(width, height, container); + var graph = graphs$4[graphId]; + if (!graph) { + graph = new G6.Graph({ + container: container.current, + width: graphSize[0], + height: graphSize[1], + modes: { + default: behaviors, + }, + defaultNode: { + type: nodeType, + size: nodeSize, + style: nodeStyle, + anchorPoints: nodeAnchorPoints, + labelCfg: nodeLabelCfg, + }, + defaultEdge: { + type: edgeType, + style: edgeStyle, + colorMap: colorMap, + labelCfg: edgeLabelCfg, + }, + nodeStateStyles: nodeStateStyles, + edgeStateStyles: edgeStateStyles, + layout: layout, + fitView: autoFit, + }); + graphs$4[graphId] = graph; + } + if (graphRef) { + graphRef.current = graph; + } + processMinimap$1(minimapCfg, graph); + var originData = deepClone(data); + graph.data(originData); + graph.render(); + if (onReady) { + onReady(graph); + } + // modify the node color according to the in edge + var edges = graph.getEdges(); + // @ts-ignore + edges.forEach(function (edge) { + var line = edge.getKeyShape(); + var stroke = line.attr('stroke'); + var targetNode = edge.getTarget(); + targetNode.update({ + style: { + stroke: stroke, + }, + }); + }); + bindEvents(graph, props); + return function () { + if (graphs$4[graphId]) { + graphs$4[graphId].destroy(); + delete graphs$4[graphId]; + } + }; + }, []); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}; +var DagreFundFlowGraph$1 = DagreFundFlowGraph; + +registerCustomItems(); +var defaultNodeStyle$2 = { + stroke: '#40a9ff', +}; +var defaultNodeAnchorPoints = [ + [0, 0.5], + [1, 0.5], +]; +var defaultEdgeStyle = { + stroke: '#ccc', + endArrow: { + path: G6.Arrow.vee(10, 10), + fill: '#ccc', + }, +}; +var defaultLayout$8 = { + type: 'indented', + direction: 'LR', + dropCap: false, + indent: 250, + getHeight: function () { + return 60; + }, + getWidth: function () { + return 100; + }, +}; +var defaultProps$8 = { + nodeType: 'card-node', + edgeType: 'cubic-horizontal', + behaviors: ['zoom-canvas', 'drag-canvas'], + nodeSize: defaultNodeSize$2, + nodeLabelCfg: defaultLabelCfg$1, + nodeAnchorPoints: defaultNodeAnchorPoints, + layout: defaultLayout$8, + nodeStyle: defaultNodeStyle$2, + edgeStyle: defaultEdgeStyle, + nodeStateStyles: defaultStateStyles$1, + edgeStateStyles: defaultStateStyles$1, + collapseExpand: true, + autoFit: true, +}; +var graphs$3 = {}; +var IndentedTree = function (props) { + var uProps = useProps$2(props, defaultProps$8); + var data = uProps.data, className = uProps.className, style = uProps.style, width = uProps.width, height = uProps.height, _a = uProps.nodeType, nodeType = _a === void 0 ? 'card-node' : _a, _b = uProps.edgeType, edgeType = _b === void 0 ? 'cubic-horizontal' : _b, _c = uProps.behaviors, behaviors = _c === void 0 ? ['zoom-canvas', 'drag-canvas'] : _c, _d = uProps.nodeSize, nodeSize = _d === void 0 ? defaultNodeSize$2 : _d, _e = uProps.nodeLabelCfg, nodeLabelCfg = _e === void 0 ? defaultLabelCfg$1 : _e, _f = uProps.nodeAnchorPoints, nodeAnchorPoints = _f === void 0 ? defaultNodeAnchorPoints : _f, _g = uProps.layout, layout = _g === void 0 ? defaultLayout$8 : _g, minimapCfg = uProps.minimapCfg, _h = uProps.nodeStyle, nodeStyle = _h === void 0 ? defaultNodeStyle$2 : _h, _j = uProps.edgeStyle, edgeStyle = _j === void 0 ? defaultEdgeStyle : _j, _k = uProps.nodeStateStyles, nodeStateStyles = _k === void 0 ? defaultStateStyles$1 : _k, _l = uProps.edgeStateStyles, edgeStateStyles = _l === void 0 ? defaultStateStyles$1 : _l, _m = uProps.collapseExpand, collapseExpand = _m === void 0 ? true : _m, _o = uProps.autoFit, autoFit = _o === void 0 ? true : _o, handleNodeClick = uProps.handleNodeClick, graphRef = uProps.graphRef, onReady = uProps.onReady, loading = uProps.loading, loadingTemplate = uProps.loadingTemplate, errorTemplate = uProps.errorTemplate; + var graph = React.useRef(null); + var graphId = getGraphId$1(graph); + var container = React.useRef(null); + useGraph$1(graphs$3[graphId], uProps, container); + y$3(function () { + var graphSize = getGraphSize$1(width, height, container); + var graph = graphs$3[graphId]; + if (!graph) { + graph = new G6.TreeGraph({ + container: container.current, + width: graphSize[0], + height: graphSize[1], + modes: { + default: behaviors, + }, + defaultNode: { + type: nodeType, + size: nodeSize, + style: nodeStyle, + anchorPoints: nodeAnchorPoints, + labelCfg: nodeLabelCfg, + }, + defaultEdge: { + type: edgeType, + style: edgeStyle, + }, + nodeStateStyles: nodeStateStyles, + edgeStateStyles: edgeStateStyles, + layout: layout, + fitView: autoFit, + }); + graphs$3[graphId] = graph; + } + if (graphRef) { + graphRef.current = graph; + } + processMinimap$1(minimapCfg, graph); + renderGraph$1(graph, data); + if (onReady) { + onReady(graph); + } + if (collapseExpand) { + var onClick_1 = function (e) { + var item = e.item; + if (e.target.get('name') === 'collapse-icon') { + graph.updateItem(item, { + collapsed: !item.getModel().collapsed, + }); + graph.layout(); + } + else if (handleNodeClick) { + handleNodeClick(item, graph); + } + }; + graph.on('node:click', function (e) { + onClick_1(e); + }); + graph.on('node:touchstart', function (e) { + onClick_1(e); + }); + } + bindEvents(graph, props); + return function () { + if (graphs$3[graphId]) { + graphs$3[graphId].destroy(); + delete graphs$3[graphId]; + } + }; + }, []); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}; +var IndentedTree$1 = IndentedTree; + +var __assign$7 = (undefined && undefined.__assign) || function () { + __assign$7 = Object.assign || function(t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) + t[p] = s[p]; + } + return t; + }; + return __assign$7.apply(this, arguments); +}; +var graphs$2 = {}; +registerCardNode(); +var defaultLayout$7 = { + type: 'compactBox', + direction: 'LR', + getId: function (d) { + return d.id; + }, + getHeight: function () { + return 60; + }, + getWidth: function () { + return 16; + }, + getVGap: function () { + return 16; + }, + getHGap: function () { + return 100; + }, +}; +var defaultProps$7 = { + nodeType: 'card', + edgeType: 'cubic-horizontal', + behaviors: ['zoom-canvas', 'drag-canvas'], + nodeAnchorPoints: defaultNodeAnchorPoints$1, + nodeSize: defaultNodeSize$1, + layout: defaultLayout$7, + animate: true, + markerPosition: 'right', + nodeStateStyles: defaultStateStyles, + edgeStateStyles: defaultStateStyles, + collapseExpand: true, + showArrow: true, + arrowType: 'vee', + autoFit: true, + style: { + height: 'inherit', + }, +}; +var IndentedTreeGraph = function (props) { + var uProps = useProps$1(props, defaultProps$7); + var data = uProps.data, className = uProps.className, style = uProps.style, width = uProps.width, height = uProps.height, _a = uProps.nodeType, nodeType = _a === void 0 ? 'card' : _a, _b = uProps.edgeType, edgeType = _b === void 0 ? 'cubic-horizontal' : _b, _c = uProps.behaviors, behaviors = _c === void 0 ? ['zoom-canvas', 'drag-canvas'] : _c, _d = uProps.nodeAnchorPoints, nodeAnchorPoints = _d === void 0 ? defaultNodeAnchorPoints$1 : _d, _e = uProps.nodeSize, nodeSize = _e === void 0 ? defaultNodeSize$1 : _e, layout = uProps.layout, _f = uProps.animate, animate = _f === void 0 ? true : _f, nodeStyle = uProps.nodeStyle, edgeStyle = uProps.edgeStyle, edgeCfg = uProps.edgeCfg, markerStyle = uProps.markerStyle, _g = uProps.markerPosition, markerPosition = _g === void 0 ? 'right' : _g, _h = uProps.nodeStateStyles, nodeStateStyles = _h === void 0 ? defaultStateStyles : _h, _j = uProps.edgeStateStyles, edgeStateStyles = _j === void 0 ? defaultStateStyles : _j, _k = uProps.collapseExpand, collapseExpand = _k === void 0 ? true : _k, titleStyle = uProps.titleStyle, bodyStyle = uProps.bodyStyle, footerStyle = uProps.footerStyle, footerValueStyle = uProps.footerValueStyle, _l = uProps.showArrow, showArrow = _l === void 0 ? true : _l, _m = uProps.arrowType, arrowType = _m === void 0 ? 'vee' : _m, _o = uProps.autoFit, autoFit = _o === void 0 ? true : _o, onReady = uProps.onReady, loading = uProps.loading, loadingTemplate = uProps.loadingTemplate, errorTemplate = uProps.errorTemplate; + var container = React.useRef(null); + var graph = React.useRef(null); + var graphId = getGraphId(graph); + useGraph$1(graphs$2[graphId], uProps, container); + y$3(function () { + var graphSize = getGraphSize(width, height, container); + var graph = graphs$2[graphId]; + if (!graph) { + graph = new G6.TreeGraph({ + container: container.current, + width: graphSize[0], + height: graphSize[1], + animate: animate, + modes: { + default: behaviors, + }, + defaultNode: { + type: nodeType, + size: nodeSize, + anchorPoints: nodeAnchorPoints, + titleStyle: titleStyle, + bodyStyle: bodyStyle, + footerStyle: footerStyle, + footerValueStyle: footerValueStyle, + markerStyle: markerStyle, + collapseExpand: collapseExpand, + markerPosition: markerPosition, + }, + defaultEdge: { + type: edgeType, + }, + nodeStateStyles: nodeStateStyles, + edgeStateStyles: edgeStateStyles, + layout: layout, + fitView: autoFit, + }); + graphs$2[graphId] = graph; + } + graph.node(function (node) { + if (typeof nodeStyle === 'function') { + return { + style: nodeStyle(node, graph), + }; + } + return { + style: __assign$7(__assign$7({}, defaultNodeStyle$5), nodeStyle), + }; + }); + graph.edge(function (edge) { + if (edgeCfg) { + return typeof edgeCfg === 'function' ? edgeCfg(edge, graph) : edgeCfg; + } + if (typeof edgeStyle === 'function') { + return { + style: edgeStyle(edge, graph), + }; + } + return { + style: __assign$7(__assign$7({ stroke: '#ccc' }, (showArrow && getDefaultEdgeArrowCfg(0, arrowType))), edgeStyle), + }; + }); + if (collapseExpand) { + bindDefaultEvents(graph, collapseExpand); + } + renderGraph(graph, data); + if (onReady) { + onReady(graph); + } + return function () { + if (graphs$2[graphId]) { + graphs$2[graphId].destroy(); + delete graphs$2[graphId]; + } + }; + }, []); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}; +var IndentedTreeGraph$1 = IndentedTreeGraph; + +var __assign$6 = (undefined && undefined.__assign) || function () { + __assign$6 = Object.assign || function(t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) + t[p] = s[p]; + } + return t; + }; + return __assign$6.apply(this, arguments); +}; +var defaultNodeStyle$1 = { + fill: '#91d5ff', + stroke: '#40a9ff', + radius: 2, +}; +var defaultLayout$6 = { + type: 'compactBox', + direction: 'TB', + getId: function getId(d) { + return d.id; + }, + getHeight: function getHeight() { + return 16; + }, + getWidth: function getWidth() { + return 16; + }, + getVGap: function getVGap() { + return 40; + }, + getHGap: function getHGap() { + return 70; + }, +}; +var defaultProps$6 = { + animate: true, + nodeType: 'rect', + edgeType: 'polyline', + nodeSize: defaultNodeSize$1, + behaviors: ['drag-canvas', 'zoom-canvas'], + nodeLabelCfg: { + style: defaultLabelStyle, + }, + layout: defaultLayout$6, + showMarker: false, + showArrow: true, + arrowType: 'triangle', + nodeStateStyles: defaultStateStyles, + edgeStateStyles: defaultStateStyles, + autoFit: true, + style: { + height: 'inherit', + }, +}; +var graphs$1 = {}; +var OrganizationalGraph = function (props) { + var uProps = useProps$1(props, defaultProps$6); + var data = uProps.data, className = uProps.className, style = uProps.style, width = uProps.width, height = uProps.height, _a = uProps.animate, animate = _a === void 0 ? true : _a, _b = uProps.nodeType, nodeType = _b === void 0 ? 'rect' : _b, _c = uProps.edgeType, edgeType = _c === void 0 ? 'polyline' : _c, _d = uProps.nodeSize, nodeSize = _d === void 0 ? defaultNodeSize$1 : _d, _e = uProps.behaviors, behaviors = _e === void 0 ? ['drag-canvas', 'zoom-canvas'] : _e, nodeLabelCfg = uProps.nodeLabelCfg, nodeCfg = uProps.nodeCfg, _f = uProps.layout, layout = _f === void 0 ? defaultLayout$6 : _f, _g = uProps.showMarker, showMarker = _g === void 0 ? false : _g, _h = uProps.showArrow, showArrow = _h === void 0 ? true : _h, _j = uProps.arrowType, arrowType = _j === void 0 ? 'triangle' : _j, minimapCfg = uProps.minimapCfg, edgeCfg = uProps.edgeCfg, markerStyle = uProps.markerStyle, _k = uProps.nodeStateStyles, nodeStateStyles = _k === void 0 ? defaultStateStyles : _k, _l = uProps.edgeStateStyles, edgeStateStyles = _l === void 0 ? defaultStateStyles : _l, _m = uProps.autoFit, autoFit = _m === void 0 ? true : _m, onReady = uProps.onReady, loading = uProps.loading, loadingTemplate = uProps.loadingTemplate, errorTemplate = uProps.errorTemplate; + var container = React.useRef(null); + var graph = React.useRef(null); + var graphId = getGraphId(graph); + useGraph$1(graphs$1[graphId], uProps, container); + var arrowOffset = (Array.isArray(nodeSize) ? nodeSize[1] : nodeSize) / 2; + y$3(function () { + var graphSize = getGraphSize(width, height, container); + if (nodeType === 'icon-node') { + registerIconNode(); + } + var graph = graphs$1[graphId]; + if (!graph) { + graph = new G6.TreeGraph({ + container: container.current, + width: graphSize[0], + height: graphSize[1], + linkCenter: true, + animate: animate, + modes: { + default: behaviors, + }, + defaultNode: { + type: nodeType, + size: nodeSize, + labelCfg: nodeLabelCfg, + markerStyle: markerStyle, + showMarker: showMarker, + }, + defaultEdge: { + type: edgeType, + }, + nodeStateStyles: nodeStateStyles, + edgeStateStyles: edgeStateStyles, + layout: layout, + fitView: autoFit, + }); + graphs$1[graphId] = graph; + } + graph.node(function (node) { + if (typeof nodeCfg === 'function') { + return nodeCfg(node, graph); + } + return { + style: __assign$6(__assign$6({}, defaultNodeStyle$1), nodeCfg === null || nodeCfg === void 0 ? void 0 : nodeCfg.style), + }; + }); + graph.edge(function (edge) { + if (typeof edgeCfg === 'function') { + return edgeCfg(edge, graph); + } + return __assign$6(__assign$6({}, edgeCfg), { style: __assign$6(__assign$6({ stroke: '#91d5ff' }, (showArrow && getDefaultEdgeArrowCfg(arrowOffset, arrowType, '#91d5ff'))), edgeCfg === null || edgeCfg === void 0 ? void 0 : edgeCfg.style) }); + }); + processMinimap(minimapCfg, graph); + renderGraph(graph, data); + if (onReady) { + onReady(graph); + } + return function () { + if (graphs$1[graphId]) { + graphs$1[graphId].destroy(); + delete graphs$1[graphId]; + } + }; + }, []); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}; +var OrganizationalGraph$1 = OrganizationalGraph; + +var __assign$5 = (undefined && undefined.__assign) || function () { + __assign$5 = Object.assign || function(t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) + t[p] = s[p]; + } + return t; + }; + return __assign$5.apply(this, arguments); +}; +var graphs = {}; +var defaultLayout$5 = { + type: 'dendrogram', + direction: 'LR', + nodeSep: 20, + rankSep: 100, + radial: true, +}; +var defaultProps$5 = { + nodeType: 'circle', + linkCenter: true, + edgeType: 'line', + behaviors: ['zoom-canvas', 'drag-canvas'], + nodeAnchorPoints: defaultNodeAnchorPoints$1, + nodeSize: 30, + layout: defaultLayout$5, + animate: true, + nodeStateStyles: defaultStateStyles, + edgeStateStyles: defaultStateStyles, + showArrow: false, + arrowType: 'triangle', + autoFit: true, +}; +var RadialGraph = function (props) { + var uProps = useProps$1(props, defaultProps$5); + var data = uProps.data, className = uProps.className, style = uProps.style, width = uProps.width, height = uProps.height, _a = uProps.nodeType, nodeType = _a === void 0 ? 'circle' : _a, _b = uProps.linkCenter, linkCenter = _b === void 0 ? true : _b, _c = uProps.edgeType, edgeType = _c === void 0 ? 'line' : _c, _d = uProps.behaviors, behaviors = _d === void 0 ? ['zoom-canvas', 'drag-canvas'] : _d, _e = uProps.nodeAnchorPoints, nodeAnchorPoints = _e === void 0 ? defaultNodeAnchorPoints$1 : _e, _f = uProps.nodeSize, nodeSize = _f === void 0 ? 30 : _f, layout = uProps.layout, _g = uProps.animate, animate = _g === void 0 ? true : _g, nodeCfg = uProps.nodeCfg, edgeCfg = uProps.edgeCfg, _h = uProps.nodeStateStyles, nodeStateStyles = _h === void 0 ? defaultStateStyles : _h, _j = uProps.edgeStateStyles, edgeStateStyles = _j === void 0 ? defaultStateStyles : _j, _k = uProps.showArrow, showArrow = _k === void 0 ? false : _k, _l = uProps.arrowType, arrowType = _l === void 0 ? 'triangle' : _l, _m = uProps.autoFit, autoFit = _m === void 0 ? true : _m, onReady = uProps.onReady, loading = uProps.loading, loadingTemplate = uProps.loadingTemplate, errorTemplate = uProps.errorTemplate; + var container = React.useRef(null); + var graph = React.useRef(null); + var graphId = getGraphId(graph); + useGraph$1(graphs[graphId], uProps, container); + var arrowOffset = (Array.isArray(nodeSize) ? nodeSize[0] : nodeSize) / 2; + y$3(function () { + var graphSize = getGraphSize(width, height, container); + var graph = graphs[graphId]; + if (!graph) { + graph = new G6.TreeGraph({ + container: container.current, + width: graphSize[0], + height: graphSize[1], + animate: animate, + linkCenter: linkCenter, + modes: { + default: behaviors, + }, + defaultNode: { + type: nodeType, + size: nodeSize, + anchorPoints: nodeAnchorPoints, + }, + defaultEdge: { + type: edgeType, + }, + nodeStateStyles: nodeStateStyles, + edgeStateStyles: edgeStateStyles, + layout: layout, + fitView: autoFit, + }); + graphs[graphId] = graph; + } + graph.node(function (node) { + if (typeof nodeCfg === 'function') { + return nodeCfg(node, graph); + } + return __assign$5(__assign$5({}, nodeCfg), { style: __assign$5(__assign$5({}, defaultNodeStyle$5), nodeCfg === null || nodeCfg === void 0 ? void 0 : nodeCfg.style) }); + }); + graph.edge(function (edge) { + if (typeof edgeCfg === 'function') { + return edgeCfg(edge, graph); + } + return { + style: __assign$5(__assign$5({ stroke: '#ccc' }, (showArrow && getDefaultEdgeArrowCfg(arrowOffset, arrowType))), edgeCfg === null || edgeCfg === void 0 ? void 0 : edgeCfg.style), + }; + }); + renderGraph(graph, data); + if (onReady) { + onReady(graph); + } + return function () { + if (graphs[graphId]) { + graphs[graphId].destroy(); + delete graphs[graphId]; + } + }; + }, []); + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}; +var RadialGraph$1 = RadialGraph; + +var useFullscreen = function (el) { + var _a = l(false), fullscreen = _a[0], setFullscreen = _a[1]; + var handleFullScreenChange = function () { + // if exit fullscreen + if (!document.fullscreenElement) { + setFullscreen(false); + } + }; + var enterFullscreen = function () { + if (el && el.requestFullscreen) { + el.requestFullscreen() + .then(function () { + setFullscreen(true); + }) + .catch(function (err) { + console.error('requestFullscreen error: ', err); + }); + } + }; + var exitFullscreen = function () { + if (document.exitFullscreen) { + document + .exitFullscreen() + .then(function () { + setFullscreen(false); + }) + .catch(function (err) { + console.error('exitFullscreen error: ', err); + }); + } + }; + var toggleFullscreen = function () { + // 切换是否全屏 + if (!el) { + console.error('need dom'); + return; + } + if (!fullscreen) { + enterFullscreen(); + } + else { + exitFullscreen(); + } + }; + y$3(function () { + // 用户按Esc键退出全屏 或者 退出全屏都会触发这个事件 + document.addEventListener('fullscreenchange', handleFullScreenChange, false); + return function () { + document.removeEventListener('fullscreenchange', handleFullScreenChange); + }; + }, []); + return [fullscreen, toggleFullscreen]; +}; +var useFullscreen$1 = useFullscreen; + +var Toolbar = function (_a) { + var toolbarCfg = _a.toolbarCfg, container = _a.container, graph = _a.graph; + var useGraph = s(); + var width = s(); + var height = s(); + var zoom = s(1); + var _b = toolbarCfg.zoomFactor, zoomFactor = _b === void 0 ? 0.25 : _b, renderIcon = toolbarCfg.renderIcon; + var _c = useFullscreen$1(container), fullscreen = _c[0], toggleFullscreen = _c[1]; + // 获取当全屏时的窗口大小 + var getWindow = function () { + return [window.outerWidth, window.outerHeight]; + }; + // 切换全屏时保存 graph 尺寸 + var toggleWidth = function (f) { + var _a; + var size = f ? getWindow() : [width.current, height.current]; + (_a = useGraph.current) === null || _a === void 0 ? void 0 : _a.changeSize(size[0], size[1]); + }; + // 获取缩放中心 + var getCenter = function () { + if (!container) { + return { + x: 0, + y: 0, + }; + } + return { + x: container.clientWidth / 2, + y: container.clientHeight / 2, + }; + }; + // in 放大 + var zoomIn = function () { + var _a; + (_a = useGraph.current) === null || _a === void 0 ? void 0 : _a.zoom(Math.min(zoom.current + zoomFactor, 5), getCenter()); + }; + // out 缩小 + var zoomOut = function () { + var _a; + (_a = useGraph.current) === null || _a === void 0 ? void 0 : _a.zoom(Math.max(zoom.current - zoomFactor, 0.25), getCenter()); + }; + y$3(function () { + if (graph) { + useGraph.current = graph; + width.current = container === null || container === void 0 ? void 0 : container.clientWidth; + height.current = container === null || container === void 0 ? void 0 : container.clientHeight; + } + }, [graph]); + var setToggleFullscreen = function () { + toggleFullscreen(); + toggleWidth(!document.fullscreenElement); + }; + if (renderIcon) { + return renderIcon(zoomIn, zoomOut, toggleFullscreen); + } + return (React.createElement(d$1, null, + !fullscreen ? (React.createElement("span", { style: { + cursor: 'pointer', + }, onClick: setToggleFullscreen }, "\u2610")) : (React.createElement("span", { style: { + cursor: 'pointer', + }, onClick: setToggleFullscreen }, "\u2684")), + React.createElement("span", { style: { + cursor: 'pointer', + }, onClick: zoomIn }, "+"), + React.createElement("span", { style: { + cursor: 'pointer', + }, onClick: zoomIn }, "-"))); +}; +var createToolbar = function (_a) { + var _b; + var graph = _a.graph, container = _a.container, toolbarCfg = _a.toolbarCfg; + var style = toolbarCfg.style, show = toolbarCfg.show, className = toolbarCfg.className; + var toolbarId = graph.get('id') + "-toolbar"; + var exist = document.querySelector("#" + toolbarId); + if (exist) { + (_b = exist.parentNode) === null || _b === void 0 ? void 0 : _b.removeChild(exist); + } + if (!show) { + return; + } + var defaultStyle = { + position: 'absolute', + right: '12px', + top: '12px', + display: 'flex', + flexDirection: 'column', + padding: '6px', + borderRadius: '2px', + fontSize: '24px', + textAlign: 'center', + lineHeight: '24px', + color: 'rgba(0,0,0,.65)', + backgroundColor: '#fff', + boxShadow: '0 0 3px #ccc', + }; + var mountPoint = document.createElement('div'); + mountPoint.id = toolbarId; + mountPoint.className = className !== null && className !== void 0 ? className : 'charts-toolbar'; + setStyles(mountPoint, defaultStyle); + setStyles(mountPoint, style); + React.render(React.createElement(Toolbar, { graph: graph, container: container, toolbarCfg: toolbarCfg }), mountPoint); + // @ts-ignore + container.appendChild(mountPoint); +}; + +var createTooltip = function (_a) { + var graph = _a.graph, container = _a.container, tooltipCfg = _a.tooltipCfg, nodeCfg = _a.nodeCfg; + var _b = nodeCfg.size, size = _b === void 0 ? [120, 40] : _b; + var style = tooltipCfg.style, show = tooltipCfg.show, className = tooltipCfg.className, customContent = tooltipCfg.customContent; + if (typeof size === 'number') + size = [size, size]; + var nodeWidth = size[0], nodeHeight = size[1]; + var createTooltipContainer = function (positionStyle, item) { + var _a; + var tooltipId = graph.get('id') + "-toolitp"; + var exist = document.querySelector("#" + tooltipId); + if (exist) { + (_a = exist.parentNode) === null || _a === void 0 ? void 0 : _a.removeChild(exist); + } + if (!show || !positionStyle) { + return; + } + var defaultStyle = { + position: 'absolute', + width: nodeWidth + "px", + padding: '6px', + borderRadius: '2px', + fontSize: '24px', + backgroundColor: '#fff', + boxShadow: '0 0 3px #ccc', + minHeight: '40px', + boxSizing: 'border-box', + }; + var mountPoint = document.createElement('div'); + mountPoint.id = tooltipId; + mountPoint.className = className !== null && className !== void 0 ? className : 'charts-toolbar'; + setStyles(mountPoint, defaultStyle); + setStyles(mountPoint, positionStyle); + setStyles(mountPoint, style); + React.render(customContent(item), mountPoint); + // @ts-ignore + container.appendChild(mountPoint); + }; + var bindEvents = function () { + var currentNode = { + current: '', + }; + graph.on('node:mousemove', function (evt) { + var _a, _b, _c; + if (!currentNode.current) { + // 这里有瑕疵，获取的 minX 不一定是最外层的容器 + var _d = (_a = get$3(evt, 'shape.cfg.canvasBBox')) !== null && _a !== void 0 ? _a : {}, minX = _d.minX, minY = _d.minY; + if (!minX) { + return; + } + var modelId = get$3((_b = evt.item) === null || _b === void 0 ? void 0 : _b.getModel(), 'id', ''); + if (modelId) { + currentNode.current = modelId; + } + createTooltipContainer({ + left: Math.min(Math.max(minX, 0), graph.getWidth() - nodeWidth) + "px", + bottom: graph.getHeight() - minY + nodeHeight + "px", + }, (_c = evt.item) === null || _c === void 0 ? void 0 : _c.getModel()); + } + }); + graph.on('node:mouseleave', function () { + currentNode.current = ''; + createTooltipContainer(); + }); + }; + bindEvents(); +}; + +var __assign$4 = (undefined && undefined.__assign) || function () { + __assign$4 = Object.assign || function(t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) + t[p] = s[p]; + } + return t; + }; + return __assign$4.apply(this, arguments); +}; +function useGraph(graphClass, config, extra) { + if (extra === void 0) { extra = {}; } + var container = s(null); + var graphRef = s(); + var graphOptions = s(); + // data 单独处理，会被 G6 修改 + var graphData = s(); + var data = config.data, width = config.width, height = config.height, layout = config.layout, minimapCfg = config.minimapCfg, behaviors = config.behaviors, fitCenter = config.fitCenter, nodeCfg = config.nodeCfg, edgeCfg = config.edgeCfg, markerCfg = config.markerCfg, level = config.level, toolbarCfg = config.toolbarCfg, tooltipCfg = config.tooltipCfg; + var graph = graphRef.current; + /** 隐藏孤立边 */ + var setEdgesState = function (edges) { + edges.forEach(function (edge) { + var _a, _b; + var _c = edge.getModel(), source = _c.source, target = _c.target; + var sourceVisible = (_a = graph === null || graph === void 0 ? void 0 : graph.findById(source)) === null || _a === void 0 ? void 0 : _a.get('visible'); + var targetVisible = (_b = graph === null || graph === void 0 ? void 0 : graph.findById(target)) === null || _b === void 0 ? void 0 : _b.get('visible'); + if (sourceVisible === false || targetVisible === false) { + edge.changeVisibility(false); + } + }); + }; + var changeData = function () { + var _a; + if (!graph) { + return; + } + var currentData = data; + if (level) { + currentData = setTag(data); + } + graph.changeData(level ? getLevelData(currentData, level) : data); + (_a = graph.get('eventData')) === null || _a === void 0 ? void 0 : _a.setData(currentData); + setEdgesState(graph.getEdges()); + if (fitCenter) { + graph.fitCenter(); + } + }; + var updateLayout = function () { + graph === null || graph === void 0 ? void 0 : graph.updateLayout(layout); + if (fitCenter) { + graph === null || graph === void 0 ? void 0 : graph.fitCenter(); + } + }; + var updateNodes = function () { + if (!graph) { + return; + } + var _a = nodeCfg !== null && nodeCfg !== void 0 ? nodeCfg : {}, nodeType = _a.type, nodeAnchorPoints = _a.anchorPoints, nodeStyle = _a.style, nodeLabelCfg = _a.title; + graph.getNodes().forEach(function (node) { + graph.updateItem(node, { + nodeCfg: nodeCfg, + markerCfg: markerCfg, + type: nodeType, + style: nodeStyle, + anchorPoints: nodeAnchorPoints, + labelCfg: nodeLabelCfg, + }); + }); + }; + var updateEdges = function () { + if (!graph) { + return; + } + var _a = edgeCfg !== null && edgeCfg !== void 0 ? edgeCfg : {}, edgeType = _a.type, edgeStyle = _a.style, startArrowCfg = _a.startArrow, endArrowCfg = _a.endArrow, labelCfg = _a.label; + graph.getEdges().forEach(function (edge) { + // 资金流向图 + if (edgeType === 'fund-line') { + graph.updateItem(edge, { + edgeCfg: edgeCfg, + }); + } + else { + var edgeCfgModel = edge.getModel(); + var startArrow = getArrowCfg(startArrowCfg, edgeCfgModel); + var endArrow = getArrowCfg(endArrowCfg, edgeCfgModel); + var _a = labelCfg !== null && labelCfg !== void 0 ? labelCfg : {}, style = _a.style, content = _a.content; + graph.updateItem(edge, { + type: edgeType, + label: getCommonConfig(content, edgeCfgModel, graph), + labelCfg: { + style: getCommonConfig(style, edgeCfgModel, graph), + }, + style: __assign$4({ stroke: '#ccc', startArrow: startArrow, endArrow: endArrow }, (typeof edgeStyle === 'function' ? edgeStyle(edgeCfgModel, graph) : edgeStyle)), + }); + } + }); + }; + // 目前仅支持更新位置 + var updateMarker = function () { + if (!graph) { + return; + } + graph.getNodes().forEach(function (node) { + var _a = (typeof markerCfg === 'function' ? markerCfg(node.getModel(), node.get('group')) : markerCfg).position, position = _a === void 0 ? 'right' : _a; + var _b = node.getBBox(), width = _b.width, height = _b.height; + var markerShape = node + .get('group') + .get('children') + .find(function (item) { return item.get('name') === 'collapse-icon'; }); + if (markerShape) { + markerShape === null || markerShape === void 0 ? void 0 : markerShape.attr(__assign$4({}, getMarkerPosition$1(position, [width, height]))); + } + }); + }; + var getEdgeStateStyles = function (edgeStateStyles) { + var _a = extra.name, name = _a === void 0 ? '' : _a; + if (name !== 'FundFlowGraph') { + return edgeStateStyles; + } + if (!edgeStateStyles) { + return; + } + var _b = edgeStateStyles.hover, hover = _b === void 0 ? {} : _b; + var endArrow = hover.endArrow, startArrow = hover.startArrow; + if (!endArrow && !startArrow) { + return edgeStateStyles; + } + return { + hover: __assign$4(__assign$4({}, hover), { endArrow: endArrow ? getArrowCfg(endArrow) : false, startArrow: startArrow ? getArrowCfg(startArrow) : false }), + }; + }; + y$3(function () { + if (graph && !graph.destroyed) { + if (isEqual$2(data, graphData.current)) { + return; + } + graphData.current = deepClone(data); + changeData(); + } + }, [data]); + y$3(function () { + var _a, _b, _c, _d, _e; + if (graph && !graph.destroyed) { + if (isEqual$2(config, graphOptions.current)) { + return; + } + if (!isEqual$2(layout, (_a = graphOptions.current) === null || _a === void 0 ? void 0 : _a.layout)) { + updateLayout(); + } + if (!isEqual$2(minimapCfg, (_b = graphOptions.current) === null || _b === void 0 ? void 0 : _b.minimapCfg)) { + processMinimap$2(minimapCfg, graph); + } + if (!isEqual$2(nodeCfg, (_c = graphOptions.current) === null || _c === void 0 ? void 0 : _c.nodeCfg)) { + updateNodes(); + } + if (!isEqual$2(edgeCfg, (_d = graphOptions.current) === null || _d === void 0 ? void 0 : _d.edgeCfg)) { + updateEdges(); + } + if (!isEqual$2(markerCfg, (_e = graphOptions.current) === null || _e === void 0 ? void 0 : _e.markerCfg)) { + updateMarker(); + } + graphOptions.current = config; + } + }, [config]); + y$3(function () { + if (graph && !graph.destroyed) { + var graphSize = getGraphSize$2(width, height, container); + graph.changeSize(graphSize[0], graphSize[1]); + } + }, [container, width, height]); + y$3(function () { + if (graph && !graph.destroyed) { + var defaultMode = graph.get('modes').default; + var removingBehaviors_1 = []; + defaultMode.forEach(function (be) { + if (isObject$f(be)) { + removingBehaviors_1.push(be.type); + } + else if (isString$3(be)) { + removingBehaviors_1.push(be); + } + }); + graph.removeBehaviors(removingBehaviors_1, 'default'); + graph.addBehaviors(behaviors, 'default'); + } + }, [behaviors]); + y$3(function () { + if (container.current && graphClass) { + var _a = extra.name, name_1 = _a === void 0 ? '' : _a; + var graphSize = getGraphSize$2(width, height, container); + var nodeCfg_1 = config.nodeCfg, edgeCfg_1 = config.edgeCfg, behaviors_1 = config.behaviors, layout_1 = config.layout, animate = config.animate, autoFit = config.autoFit, fitCenter_1 = config.fitCenter, onReady = config.onReady; + var _b = nodeCfg_1 !== null && nodeCfg_1 !== void 0 ? nodeCfg_1 : {}, nodeType_1 = _b.type, nodeSize = _b.size, nodeAnchorPoints = _b.anchorPoints, nodeStateStyles = _b.nodeStateStyles, nodeStyle_1 = _b.style, nodeLabelCfg_1 = _b.title, linkCenter = _b.linkCenter, getChildren = _b.getChildren; + var _c = edgeCfg_1 !== null && edgeCfg_1 !== void 0 ? edgeCfg_1 : {}, edgeType = _c.type, edgeStyle_1 = _c.style, startArrowCfg_1 = _c.startArrow, endArrowCfg_1 = _c.endArrow, labelCfg_1 = _c.label, edgeStateStyles = _c.edgeStateStyles; + graphRef.current = new G6[graphClass]({ + container: container.current, + width: graphSize[0], + height: graphSize[1], + animate: animate, + linkCenter: linkCenter, + modes: { + default: behaviors_1, + }, + defaultNode: { + type: nodeType_1, + size: nodeSize, + anchorPoints: nodeAnchorPoints, + nodeCfg: nodeCfg_1, + }, + defaultEdge: { + type: edgeType, + edgeCfg: edgeCfg_1, + labelCfg: labelCfg_1 === null || labelCfg_1 === void 0 ? void 0 : labelCfg_1.style, + }, + nodeStateStyles: nodeStateStyles, + edgeStateStyles: getEdgeStateStyles(edgeStateStyles), + layout: layout_1, + fitView: autoFit, + fitCenter: fitCenter_1, + }); + var graphId = getGraphId$2(graphRef.current); + var graph_1 = graphRef.current; + graph_1.set('id', graphId); + var getLabel_1 = function (value) { + // 辐射树图 + if (isString$3(value)) { + return value; + } + if (name_1 === 'FundFlowGraph') { + return value === null || value === void 0 ? void 0 : value.text; + } + return value === null || value === void 0 ? void 0 : value.title; + }; + var customNode_1 = ['fund-card', 'indicator-card']; + // defaultNode 默认只能绑定 plainObject，针对 Function 类型需要通过该模式绑定 + graph_1.node(function (node) { + if (customNode_1.includes(nodeType_1) || name_1 === 'OrganizationGraph') { + node.markerCfg = markerCfg; + return {}; + } + var style = (nodeLabelCfg_1 !== null && nodeLabelCfg_1 !== void 0 ? nodeLabelCfg_1 : {}).style; + return { + label: getLabel_1(node.value), + labelCfg: { + style: getCommonConfig(style, node, graph_1), + }, + style: __assign$4({ stroke: '#ccc' }, (typeof nodeStyle_1 === 'function' ? nodeStyle_1(node, graph_1) : nodeStyle_1)), + }; + }); + var getEdgeLabel_1 = function (edge) { + var content = (labelCfg_1 !== null && labelCfg_1 !== void 0 ? labelCfg_1 : {}).content; + if (['DecompositionTreeGraph', 'OrganizationGraph', 'RadialTreeGraph'].includes(name_1)) { + return getCommonConfig(content, edge, graph_1); + } + if (name_1 === 'FundFlowGraph') { + var value = edge.value; + // @ts-ignore + return typeof value === 'object' ? value === null || value === void 0 ? void 0 : value.text : value; + } + return edge.value; + }; + if (edgeType !== 'fund-line') { + graph_1.edge(function (edge) { + var startArrow = getArrowCfg(startArrowCfg_1, edge); + var endArrow = getArrowCfg(endArrowCfg_1, edge); + var style = (labelCfg_1 !== null && labelCfg_1 !== void 0 ? labelCfg_1 : {}).style; + return { + label: getEdgeLabel_1(edge), + labelCfg: { + style: getCommonConfig(style, edge, graph_1), + }, + style: __assign$4({ stroke: '#ccc', startArrow: startArrow, endArrow: endArrow }, (typeof edgeStyle_1 === 'function' ? edgeStyle_1(edge, graph_1) : edgeStyle_1)), + }; + }); + } + processMinimap$2(minimapCfg, graph_1); + bindStateEvents(graph_1, config); + if (markerCfg) { + var sourceGraph = ['FlowAnalysisGraph', 'FundFlowGraph']; + sourceGraph.includes(name_1) + ? bindSourceMapCollapseEvents(graph_1) + : bindDefaultEvents$1(graph_1, level, getChildren); + } + renderGraph$2(graph_1, data, level); + if (fitCenter_1) { + graph_1.fitCenter(); + } + if (onReady) { + onReady(graph_1); + } + } + }, []); + y$3(function () { + if (graphRef.current && toolbarCfg) { + createToolbar({ graph: graphRef.current, container: container.current, toolbarCfg: toolbarCfg }); + } + }, [graphRef, toolbarCfg]); + y$3(function () { + if (graphRef.current && tooltipCfg) { + createTooltip({ graph: graphRef.current, container: container.current, tooltipCfg: tooltipCfg, nodeCfg: nodeCfg }); + } + }, [graphRef, tooltipCfg]); + y$3(function () { + return function () { + if ((graph === null || graph === void 0 ? void 0 : graph.current) && !graph.current.destroyed) { + graph.current.destroy(); + } + }; + }, []); + return { + container: container, + }; +} + +var __assign$3 = (undefined && undefined.__assign) || function () { + __assign$3 = Object.assign || function(t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) + t[p] = s[p]; + } + return t; + }; + return __assign$3.apply(this, arguments); +}; +function useProps(props, defaultProps) { + var cloneProps = deepClone(props); + var mergeProps = A$1(function (p, defaultProps) { + var config = __assign$3({}, defaultProps); + var propsKeys = Object.keys(p); + propsKeys.forEach(function (key) { + if (getType(p[key]) === 'Object') { + config[key] = __assign$3(__assign$3({}, defaultProps[key]), p[key]); + } + else { + config[key] = p[key]; + } + }); + return config; + }, [props, defaultProps]); + var uProps = mergeProps(cloneProps, defaultProps); + return { + uProps: uProps, + }; +} + +var __assign$2 = (undefined && undefined.__assign) || function () { + __assign$2 = Object.assign || function(t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) + t[p] = s[p]; + } + return t; + }; + return __assign$2.apply(this, arguments); +}; +// 组织架构图 +var registerOrganizationCardNode = function () { + var defaultIconStyle = { + width: 12, + height: 12, + }; + G6.registerNode('organization-card', { + draw: function (cfg, group) { + if (cfg === void 0) { cfg = {}; } + var _a = cfg.value, value = _a === void 0 ? {} : _a, nodeCfg = cfg.nodeCfg, markerCfg = cfg.markerCfg; + var _b = nodeCfg, style = _b.style, _c = _b.padding, padding = _c === void 0 ? 0 : _c, _d = _b.label, label = _d === void 0 ? {} : _d, customContent = _b.customContent; + var labelStyle = label.style; + var paddingArray = getCssPadding(padding); + var size = ((cfg === null || cfg === void 0 ? void 0 : cfg.size) || [100, 30]); + if (typeof size === 'number') + size = [size, size]; + var height = 0; // 统计容器总高度，动态设置，宽度不做调整 + var contentWidth = size[0] - paddingArray[1] - paddingArray[3]; + // card box + var cardStyle = getStyle(style, cfg, group); + var shape = group.addShape('rect', { + attrs: __assign$2(__assign$2({ x: 0, y: 0, width: size[0], height: size[1] }, defaultCardStyle), cardStyle), + name: 'main-box', + draggable: true, + }); + if (value) { + height += paddingArray[0]; + var createRowItems_1 = function (item, contentWidth, startX, index) { + if (index === void 0) { index = 0; } + var iconWidth = 0; + var rowHeight = []; + var keys = ['icon', 'text', 'value']; + var getXY = function (type, layoutCfg) { + var _a = layoutCfg.fontSize, fontSize = _a === void 0 ? 12 : _a; + var x = 0; + var y = 0; + switch (type) { + case 'icon': + x = startX; + y = height; + break; + case 'text': + x = startX + (contentWidth + iconWidth) / 2; + y = item.value ? paddingArray[0] : (size[1] - fontSize) / 2; + break; + case 'value': + x = startX + (contentWidth + iconWidth) / 2; + y = item.text + ? paddingArray[0] + rowHeight[1] + defaultMargin + : (size[1] - fontSize) / 2; + break; + } + return { x: x, y: y }; + }; + keys.forEach(function (key, keyIndex) { + var isIcon = key.startsWith('icon'); + var shapeStyle = getStyle(labelStyle, cfg, group, key); + if (key === 'icon' && item[key]) { + iconWidth = shapeStyle.width || 32; + } + var keyShape = group.addShape(isIcon ? 'image' : 'text', { + attrs: __assign$2(__assign$2(__assign$2(__assign$2({ textBaseline: 'top', textAlign: 'center' }, getXY(key, shapeStyle)), { text: item[key], img: item[key] }), (isIcon ? defaultIconStyle : defaultLabelStyle$1)), shapeStyle), + name: key + "-" + index + "-" + keyIndex, + }); + rowHeight.push(keyShape.getBBox().height); + }); + return rowHeight; + }; + var createItems = function (item, index) { + var _a; + if (index === void 0) { index = 0; } + var itemsHeight = []; + if (customContent) { + itemsHeight.push((_a = customContent(item, group, { + startX: paddingArray[3], + startY: height, + width: contentWidth, + })) !== null && _a !== void 0 ? _a : 0); + } + else { + itemsHeight.push.apply(itemsHeight, createRowItems_1(item, contentWidth, paddingArray[3], index)); + } + height += Math.max.apply(Math, itemsHeight); + }; + createItems(value); + } + shape === null || shape === void 0 ? void 0 : shape.attr('height', Math.max(height + paddingArray[2], size[1])); + // collapse marker + if (markerCfg) { + var _e = shape.getBBox(), shapeWidth = _e.width, shapeHeight = _e.height; + var _f = typeof markerCfg === 'function' ? markerCfg(cfg, group) : markerCfg, show = _f.show, _g = _f.position, position = _g === void 0 ? 'right' : _g, collapsed = _f.collapsed, markerStyle = _f.style; + createMarker({ + show: show, + position: position, + collapsed: collapsed, + style: markerStyle, + }, group, [shapeWidth, shapeHeight]); + shape.attr('defaultCollapsed', collapsed); + } + return shape; + }, + }, 'single-node'); +}; + +var __rest$4 = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +registerOrganizationCardNode(); +var defaultNodeStyle = { + fill: '#91d5ff', + stroke: '#40a9ff', + radius: 2, +}; +var defaultLayout$4 = { + type: 'compactBox', + direction: 'TB', + getId: function getId(d) { + return d.id; + }, + getHeight: function getHeight() { + return 16; + }, + getWidth: function getWidth() { + return 16; + }, + getVGap: function getVGap() { + return 40; + }, + getHGap: function getHGap() { + return 70; + }, +}; +var defaultProps$4 = { + nodeCfg: { + type: 'organization-card', + size: [100, 44], + style: defaultNodeStyle, + padding: 6, + anchorPoints: [ + [0.5, 0], + [0.5, 1], + ], + nodeStateStyles: defaultStateStyles$2, + label: { + style: function (cfg, group, type) { + var styles = { + icon: { + width: 32, + height: 32, + }, + value: { + fill: '#fff', + }, + text: { + fill: '#000', + }, + }; + return type ? styles[type] : {}; + }, + }, + }, + edgeCfg: { + type: 'polyline', + endArrow: { + type: 'triangle', + fill: '#91d5ff', + }, + edgeStateStyles: defaultStateStyles$2, + style: { + stroke: '#91d5ff', + }, + }, + behaviors: ['zoom-canvas', 'drag-canvas'], + layout: defaultLayout$4, + animate: true, + markerPosition: 'right', + autoFit: true, + fitCenter: true, + style: { + position: 'relative', + height: 'inherit', + backgroundColor: '#fff', + }, +}; +var OrganizationGraph = function (props) { + var uProps = useProps(props, defaultProps$4).uProps; + var className = uProps.className, style = uProps.style, loading = uProps.loading, loadingTemplate = uProps.loadingTemplate, errorTemplate = uProps.errorTemplate, rest = __rest$4(uProps, ["className", "style", "loading", "loadingTemplate", "errorTemplate"]); + var container = useGraph('TreeGraph', rest, { name: 'OrganizationGraph' }).container; + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}; +var OrganizationGraph$1 = OrganizationGraph; + +var __rest$3 = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +var defaultLayout$3 = { + type: 'dendrogram', + direction: 'LR', + nodeSep: 20, + rankSep: 100, + radial: true, +}; +var defaultProps$3 = { + nodeCfg: { + type: 'circle', + size: 30, + anchorPoints: defaultFlowGraphAnchorPoints, + linkCenter: true, + nodeStateStyles: defaultStateStyles$2, + style: defaultNodeStyle$7, + }, + edgeCfg: { + type: 'line', + edgeStateStyles: defaultStateStyles$2, + }, + behaviors: ['zoom-canvas', 'drag-canvas'], + layout: defaultLayout$3, + animate: true, + markerPosition: 'right', + autoFit: true, + fitCenter: true, + style: { + position: 'relative', + height: 'inherit', + backgroundColor: '#fff', + }, +}; +var RadialTreeGraph = function (props) { + var uProps = useProps(props, defaultProps$3).uProps; + var className = uProps.className, style = uProps.style, loading = uProps.loading, loadingTemplate = uProps.loadingTemplate, errorTemplate = uProps.errorTemplate, rest = __rest$3(uProps, ["className", "style", "loading", "loadingTemplate", "errorTemplate"]); + var container = useGraph('TreeGraph', rest, { name: 'RadialTreeGraph' }).container; + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}; +var RadialTreeGraph$1 = RadialTreeGraph; + +var __assign$1 = (undefined && undefined.__assign) || function () { + __assign$1 = Object.assign || function(t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) + t[p] = s[p]; + } + return t; + }; + return __assign$1.apply(this, arguments); +}; +// 通用指标卡 +var registerIndicatorCardNode = function () { + var defaultTitleLabelStyle = { + fill: '#fff', + fontSize: 12, + }; + var defaultTitleRectStyle = { + fill: '#40a9ff', + radius: [2, 2, 0, 0], + }; + var defaultIconStyle = { + width: 12, + height: 12, + }; + var ARROWS = ['startArrow', 'endArrow']; + var SHAPE_DEFAULT_ATTRS = { + lineWidth: 1, + stroke: undefined, + fill: undefined, + lineAppendWidth: 1, + opacity: undefined, + strokeOpacity: undefined, + fillOpacity: undefined, + x: 0, + y: 0, + r: 10, + width: 20, + height: 20, + shadowColor: undefined, + shadowBlur: 0, + shadowOffsetX: 0, + shadowOffsetY: 0, + }; + var PATH_SHAPE_DEFAULT_ATTRS = { + lineWidth: 1, + stroke: '#000', + lineDash: undefined, + startArrow: false, + endArrow: false, + opacity: undefined, + strokeOpacity: undefined, + fillOpacity: undefined, + shadowColor: undefined, + shadowBlur: 0, + shadowOffsetX: 0, + shadowOffsetY: 0, + }; + var SHAPES_DEFAULT_ATTRS = { + edge: PATH_SHAPE_DEFAULT_ATTRS, + node: SHAPE_DEFAULT_ATTRS, + }; + G6.registerNode('indicator-card', { + // @ts-ignore + draw: function (cfg, group) { + var _a, _b; + if (cfg === void 0) { cfg = {}; } + var _c = cfg.value, value = _c === void 0 ? {} : _c, nodeCfg = cfg.nodeCfg, markerCfg = cfg.markerCfg; + var _d = nodeCfg, titleCfg = _d.title, itemsCfg = _d.items, _e = _d.label, label = _e === void 0 ? {} : _e, style = _d.style, _f = _d.padding, padding = _f === void 0 ? 0 : _f, badge = _d.badge, customContent = _d.customContent; + var appendPadding = getStatusBBox(badge); + var labelStyle = label.style; + var cardPadding = getCssPadding(padding); + var paddingArray = cardPadding.map(function (item, index) { return item + appendPadding[index]; }); + var _g = titleCfg !== null && titleCfg !== void 0 ? titleCfg : {}, titleStyle = _g.style, titleContainerStyle = _g.containerStyle, _h = _g.autoEllipsis, autoEllipsis = _h === void 0 ? true : _h; + var _j = itemsCfg !== null && itemsCfg !== void 0 ? itemsCfg : {}, itemStyle = _j.style, itemContainerStyle = _j.containerStyle, layout = _j.layout, _k = _j.itemSpacing, itemSpacing = _k === void 0 ? 4 : _k, sort = _j.sort, _l = _j.padding, itemPadding = _l === void 0 ? [6, 0, 0] : _l; + var itemPaddingArray = getCssPadding(itemPadding); + var _m = value, title = _m.title, items = _m.items; + var size = (cfg === null || cfg === void 0 ? void 0 : cfg.size) || [100, 30]; + if (typeof size === 'number') + size = [size, size]; + var height = 0; // 统计容器总高度，动态设置 + var shapeWidth = size[0]; + var contentWidth = shapeWidth - paddingArray[1] - paddingArray[3]; + // card box + var cardStyle = getStyle(style, cfg, group); + var shape = group.addShape('rect', { + attrs: __assign$1(__assign$1({ x: 0, y: 0, width: size[0], height: size[1] }, defaultCardStyle), cardStyle), + name: 'main-box', + draggable: true, + }); + // node title + var titleTextShape; + var itemShape; + var titleShape; + if (title) { + // title rect + titleShape = group.addShape('rect', { + attrs: __assign$1(__assign$1({ x: 0, y: 0, width: size[0], height: 0 }, defaultTitleRectStyle), getStyle(titleContainerStyle, cfg, group)), + name: 'title-rect', + draggable: true, + }); + var textStyle = __assign$1(__assign$1({}, defaultTitleLabelStyle), getStyle(titleStyle, cfg, group)); + titleTextShape = group.addShape('text', { + attrs: __assign$1({ x: paddingArray[3], y: paddingArray[0], textBaseline: 'top', text: autoEllipsis ? useEllipsis(title, textStyle === null || textStyle === void 0 ? void 0 : textStyle.fontSize, contentWidth) : title }, textStyle), + name: 'title', + }); + var titleHeight_1 = (titleTextShape + ? titleTextShape.getBBox() + : { height: size[1] / 2 }).height; + titleShape === null || titleShape === void 0 ? void 0 : titleShape.attr('height', titleHeight_1 + paddingArray[0] + paddingArray[2]); + height += titleShape.getBBox().height; + } + if (items) { + if (!titleShape) { + height += paddingArray[0]; + } + itemShape = group.addShape('rect', { + attrs: __assign$1({ x: paddingArray[3], y: height, width: contentWidth, height: 0 }, getStyle(itemContainerStyle, cfg, group)), + name: 'item-box', + draggable: true, + }); + height += itemPaddingArray[0]; + var itemContentWidth_1 = contentWidth - itemPaddingArray[1] - itemPaddingArray[3]; + var isArray_1 = Array.isArray(items); + var createRowItems_1 = function (item, contentWidth, startX, index) { + if (index === void 0) { index = 0; } + var rowHeight = []; + var valueShapeWidth = 0; + var keys = sort ? Object.keys(item) : ['text', 'value', 'icon']; + keys.forEach(function (key, keyIndex) { + var x; + var isIcon = key.startsWith('icon'); + // sort 直接均分，简单化 + if (sort || layout === 'flex') { + x = (keyIndex * contentWidth) / keys.length; + } + else if (layout === 'follow') { + x = valueShapeWidth; + } + else { + // layout === 'bundled' + // 直接均分，icon 紧随 value + x = key === 'text' ? 0 : contentWidth / 2; + x += isIcon ? valueShapeWidth : 0; + } + var keyShape = group.addShape(isIcon ? 'image' : 'text', { + attrs: __assign$1(__assign$1({ textBaseline: 'top', x: startX + x, y: height, text: item[key], img: item[key] }, (isIcon ? defaultIconStyle : defaultLabelStyle$1)), getStyle(itemStyle || labelStyle, cfg, group, key)), + name: key + "-" + index + "-" + keyIndex, + }); + if (key === 'value' || layout === 'follow') { + valueShapeWidth += keyShape.getBBox().width; + valueShapeWidth += layout === 'follow' ? itemSpacing : 0; + } + rowHeight.push(keyShape.getBBox().height); + }); + return rowHeight; + }; + var createItems_1 = function (item, index) { + var _a; + if (index === void 0) { index = 0; } + var itemsHeight = []; + if (customContent) { + itemsHeight.push((_a = customContent(item, group, { + startX: paddingArray[3] + itemPaddingArray[3], + startY: height, + width: itemContentWidth_1, + })) !== null && _a !== void 0 ? _a : 0); + } + else { + itemsHeight.push.apply(itemsHeight, createRowItems_1(item, itemContentWidth_1, paddingArray[3] + itemPaddingArray[3], index)); + } + height += Math.max.apply(Math, itemsHeight); + if (isArray_1 && index !== items.length - 1) { + height += defaultMargin; + } + }; + if (Array.isArray(items)) { + items.forEach(function (item, index) { + createItems_1(item, index); + }); + } + else { + createItems_1(items); + } + } + var titleHeight = (titleShape === null || titleShape === void 0 ? void 0 : titleShape.getBBox().height) || 0; + itemShape === null || itemShape === void 0 ? void 0 : itemShape.attr('height', Math.max(height - titleHeight + itemPaddingArray[2], size[1])); + var itemHeight = (itemShape === null || itemShape === void 0 ? void 0 : itemShape.getBBox().height) || 0; + var shapeHeight = items + ? (titleHeight || paddingArray[0]) + itemHeight + paddingArray[2] + : titleHeight + itemHeight; + shape === null || shape === void 0 ? void 0 : shape.attr('height', shapeHeight); + if (badge) { + var statusConfig = getStatusCfg(badge, [size[0], shapeHeight]); + group.addShape('rect', { + attrs: __assign$1(__assign$1({ fill: '#40a9ff' }, statusConfig), getStyle(badge.style, cfg, group)), + name: 'status-rect', + }); + } + // collapse marker + if (markerCfg) { + var stateCollapsed = ((_b = (_a = group === null || group === void 0 ? void 0 : group.get('item')) === null || _a === void 0 ? void 0 : _a.getModel()) !== null && _b !== void 0 ? _b : {}).collapsed; + var _o = shape.getBBox(), shapeWidth_1 = _o.width, shapeHeight_1 = _o.height; + var _p = typeof markerCfg === 'function' ? markerCfg(cfg, group) : markerCfg, show = _p.show, _q = _p.position, position = _q === void 0 ? 'right' : _q, collapsed = _p.collapsed, markerStyle = _p.style; + createMarker({ + show: show, + position: position, + collapsed: stateCollapsed !== null && stateCollapsed !== void 0 ? stateCollapsed : collapsed, + style: markerStyle, + }, group, [shapeWidth_1, shapeHeight_1]); + shape.attr('defaultCollapsed', collapsed); + } + return shape; + }, + /** + * 更新节点，包含文本 + * @override + * @param {Object} cfg 节点的配置项 + * @param {Node} node 节点 + */ + // @ts-ignore + update: undefined, + // @ts-ignore + setState: function (name, value, item) { + var _a, _b; + var shape = item.get('keyShape'); + if (!shape || shape.destroyed) + return; + var type = item.getType(); + var stateName = isBoolean(value) ? name : name + ":" + value; + var itemStateStyle = item.getStateStyle(stateName); + // const originStyle = item.getOriginStyle(); + // 不允许设置一个不存在的状态 + if (!itemStateStyle) { + return; + } + // 要设置或取消的状态的样式 + // 当没有 state 状态时，默认使用 model.stateStyles 中的样式 + var styles = Object.assign({}, itemStateStyle); + var group = item.getContainer(); + // 从图元素现有的样式中删除本次要取消的 states 中存在的属性值。使用对象检索更快 + var keptAttrs = { x: 1, y: 1, cx: 1, cy: 1 }; + if (value) { + var _loop_1 = function (key) { + var _c; + var style = styles[key]; + if (isPlainObject$3(style) && !ARROWS.includes(key)) { + var subShape = group.find(function (element) { return element.get('name') === key; }); + if (subShape) { + subShape.attr(style); + } + } + else { + // 非纯对象，则认为是设置到 keyShape 上面的 + shape.attr((_c = {}, + _c[key] = style, + _c)); + } + }; + // style 为要设置的状态的样式 + for (var key in styles) { + _loop_1(key); + } + } + else { + // 所有生效的 state 的样式 + var enableStatesStyle = cloneBesidesImg(item.getCurrentStatesStyle()); + var model = item.getModel(); + // 原始样式 + var originStyle_1 = mix({}, model.style, cloneBesidesImg(item.getOriginStyle())); + var keyShapeName_1 = shape.get('name'); + // cloning shape.attr(), keys.forEach to avoid cloning the img attr, which leads to maximum clone heap #2383 + // const keyShapeStyles = clone(shape.attr()) + var shapeAttrs_1 = shape.attr(); + var keyShapeStyles_1 = {}; + Object.keys(shapeAttrs_1).forEach(function (key) { + if (key === 'img') + return; + var attr = shapeAttrs_1[key]; + if (attr && typeof attr === 'object') { + keyShapeStyles_1[key] = clone$7(attr); + } + else { + keyShapeStyles_1[key] = attr; + } + }); + // 已有样式 - 要取消的状态的样式 + var filtetDisableStatesStyle = {}; + var _loop_2 = function (p) { + var style = styles[p]; + if (isPlainObject$3(style) && !ARROWS.includes(p)) { + var subShape_1 = group.find(function (element) { return element.get('name') === p; }); + if (subShape_1) { + var subShapeStyles_1 = clone$7(subShape_1.attr()); + each$2(style, function (v, key) { + if (p === keyShapeName_1 && keyShapeStyles_1[key] && !keptAttrs[key]) { + delete keyShapeStyles_1[key]; + var value_1 = originStyle_1[p][key] || SHAPES_DEFAULT_ATTRS[type][key]; + shape.attr(key, value_1); + } + else if (subShapeStyles_1[key] || subShapeStyles_1[key] === 0) { + delete subShapeStyles_1[key]; + var value_2 = originStyle_1[p][key] || SHAPES_DEFAULT_ATTRS[type][key]; + subShape_1.attr(key, value_2); + } + }); + filtetDisableStatesStyle[p] = subShapeStyles_1; + } + } + else { + if (keyShapeStyles_1[p] && !keptAttrs[p]) { + delete keyShapeStyles_1[p]; + var value_3 = originStyle_1[p] || + (originStyle_1[keyShapeName_1] ? originStyle_1[keyShapeName_1][p] : undefined) || + SHAPES_DEFAULT_ATTRS[type][p]; + shape.attr(p, value_3); + } + } + }; + // styles 为要取消的状态的样式 + for (var p in styles) { + _loop_2(p); + } + // 从图元素现有的样式中删除本次要取消的 states 中存在的属性值后， + // 如果 keyShape 有 name 属性，则 filtetDisableStatesStyle 的格式为 { keyShapeName: {} } + // 否则为普通对象 + if (!keyShapeName_1) { + mix(filtetDisableStatesStyle, keyShapeStyles_1); + } + else { + filtetDisableStatesStyle[keyShapeName_1] = keyShapeStyles_1; + } + for (var key in enableStatesStyle) { + if (keptAttrs[key]) + continue; + var enableStyle = enableStatesStyle[key]; + if (!isPlainObject$3(enableStyle) || ARROWS.includes(key)) { + // 把样式属性merge到keyShape中 + if (!keyShapeName_1) { + mix(originStyle_1, (_a = {}, + _a[key] = enableStyle, + _a)); + } + else { + mix(originStyle_1[keyShapeName_1], (_b = {}, + _b[key] = enableStyle, + _b)); + delete originStyle_1[key]; + } + delete enableStatesStyle[key]; + } + } + var originstyles = {}; + deepMix(originstyles, originStyle_1, filtetDisableStatesStyle, enableStatesStyle); + var keyShapeSetted = false; + var _loop_3 = function (originKey) { + var _d; + var style = originstyles[originKey]; + if (isPlainObject$3(style) && !ARROWS.includes(originKey)) { + var subShape = group.find(function (element) { return element.get('name') === originKey; }); + if (subShape) { + if (originKey === keyShapeName_1) { + keyShapeSetted = true; + } + if (originKey !== 'collapse-icon') + subShape.attr(style); + } + } + else if (!keyShapeSetted) { + var value_4 = style || SHAPES_DEFAULT_ATTRS[type][originKey]; + shape.attr((_d = {}, + _d[originKey] = value_4, + _d)); + } + }; + for (var originKey in originstyles) { + _loop_3(originKey); + } + } + }, + }, 'single-node'); +}; + +var __rest$2 = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +registerIndicatorCardNode(); +var defaultLayout$2 = { + type: 'dagre', + rankdir: 'LR', + center: [0, 0], + nodesepFunc: function () { return 1; }, + ranksepFunc: function () { return 1; }, +}; +var defaultProps$2 = { + nodeCfg: { + type: 'indicator-card', + size: defaultNodeSize$3, + style: defaultNodeStyle$7, + anchorPoints: defaultFlowGraphAnchorPoints, + padding: 6, + layout: 'bundled', + nodeStateStyles: defaultStateStyles$2, + }, + edgeCfg: { + type: 'cubic-horizontal', + edgeStateStyles: defaultStateStyles$2, + }, + behaviors: ['zoom-canvas', 'drag-canvas'], + layout: defaultLayout$2, + animate: true, + markerPosition: 'right', + autoFit: true, + fitCenter: true, + style: { + position: 'relative', + height: 'inherit', + backgroundColor: '#fff', + }, +}; +var FlowAnalysisGraph = function (props) { + var uProps = useProps(props, defaultProps$2).uProps; + var className = uProps.className, style = uProps.style, loading = uProps.loading, loadingTemplate = uProps.loadingTemplate, errorTemplate = uProps.errorTemplate, rest = __rest$2(uProps, ["className", "style", "loading", "loadingTemplate", "errorTemplate"]); + var container = useGraph('Graph', rest, { name: 'FlowAnalysisGraph' }).container; + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}; +var FlowAnalysisGraph$1 = FlowAnalysisGraph; + +var __rest$1 = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +registerIndicatorCardNode(); +var defaultLayout$1 = { + type: 'compactBox', + direction: 'LR', + getId: function (d) { + return d.id; + }, + getHeight: function () { + return 60; + }, + getWidth: function () { + return 16; + }, + getVGap: function () { + return 16; + }, + getHGap: function () { + return 100; + }, +}; +var defaultProps$1 = { + nodeCfg: { + type: 'indicator-card', + size: defaultNodeSize$3, + style: defaultNodeStyle$7, + anchorPoints: defaultFlowGraphAnchorPoints, + padding: 6, + layout: 'bundled', + nodeStateStyles: defaultStateStyles$2, + label: { + style: function (cfg, group, type) { + var styles = { + icon: { + width: 10, + height: 10, + }, + value: { + fill: '#000', + }, + text: { + fill: '#aaa', + }, + }; + return type ? styles[type] : {}; + }, + }, + }, + edgeCfg: { + type: 'cubic-horizontal', + endArrow: { + type: 'vee', + }, + edgeStateStyles: defaultStateStyles$2, + }, + behaviors: ['zoom-canvas', 'drag-canvas'], + layout: defaultLayout$1, + animate: true, + autoFit: true, + fitCenter: true, + style: { + position: 'relative', + height: 'inherit', + backgroundColor: '#fff', + }, + level: 100, +}; +var DecompositionTreeGraph = function (props) { + var uProps = useProps(props, defaultProps$1).uProps; + var className = uProps.className, style = uProps.style, loading = uProps.loading, loadingTemplate = uProps.loadingTemplate, errorTemplate = uProps.errorTemplate, rest = __rest$1(uProps, ["className", "style", "loading", "loadingTemplate", "errorTemplate"]); + var container = useGraph('TreeGraph', rest, { + name: 'DecompositionTreeGraph', + }).container; + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}; +var DecompositionTreeGraph$1 = DecompositionTreeGraph; + +var __assign = (undefined && undefined.__assign) || function () { + __assign = Object.assign || function(t) { + for (var s, i = 1, n = arguments.length; i < n; i++) { + s = arguments[i]; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) + t[p] = s[p]; + } + return t; + }; + return __assign.apply(this, arguments); +}; +var getPathInfo = function (cfg) { + var edgeCfg = cfg.edgeCfg; + var startPoint = cfg.startPoint; + var endPoint = cfg.endPoint; + var startX = startPoint.x, startY = startPoint.y; + var endX = endPoint.x, endY = endPoint.y; + var Ydiff = endY - startY; + var slope = Ydiff !== 0 ? Math.min(500 / Math.abs(Ydiff), 20) : 0; + var cpOffset = slope > 15 ? 0 : 16; + var offset = Ydiff < 0 ? cpOffset : -cpOffset; + var line1EndPoint = { + x: startX + slope, + y: endY + offset, + }; + var line2StartPoint = { + x: line1EndPoint.x + cpOffset, + y: endY, + }; + // 控制点坐标 + var controlPoint = { + x: ((line1EndPoint.x - startX) * (endY - startY)) / (line1EndPoint.y - startY) + startX, + y: endY, + }; + var path = [ + ['M', startX, startY], + ['L', line1EndPoint.x, line1EndPoint.y], + ['Q', controlPoint.x, controlPoint.y, line2StartPoint.x, line2StartPoint.y], + ['L', endX, endY], + ]; + if (Math.abs(Ydiff) <= 5) { + path = [ + ['M', startX, startY], + ['L', endX, endY], + ]; + } + var _a = edgeCfg, startArrowCfg = _a.startArrow, endArrowCfg = _a.endArrow; + var startArrow = getArrowCfg(startArrowCfg, cfg); + var endArrow = getArrowCfg(endArrowCfg, cfg); + return { + startArrow: startArrow, + endArrow: endArrow, + path: path, + line2StartPoint: line2StartPoint, + endY: endY, + }; +}; +var getPathText = function (value) { + var text; + var subText; + if (value instanceof Object) { + text = value.text; + subText = value.subText; + } + else { + text = value; + } + return { text: text, subText: subText }; +}; +// 资金流向图 +var registerFundFlowItems = function () { + // 注册节点 + G6.registerNode('fund-card', { + // @ts-ignore + draw: function (cfg, group) { + var _a, _b; + if (cfg === void 0) { cfg = {}; } + var _c = cfg.value, value = _c === void 0 ? {} : _c, nodeCfg = cfg.nodeCfg, markerCfg = cfg.markerCfg; + var _d = nodeCfg, _e = _d.label, label = _e === void 0 ? {} : _e, style = _d.style, _f = _d.padding, padding = _f === void 0 ? 0 : _f, customContent = _d.customContent; + var labelStyle = label.style; + var paddingArray = getCssPadding(padding); + var size = getSize(cfg.size); + var height = 0; // 统计容器总高度，动态设置 + var shapeWidth = size[0]; + var contentWidth = shapeWidth - paddingArray[1] - paddingArray[3]; + var contentHeight = size[1] - paddingArray[0] - paddingArray[2]; + // card box + var cardStyle = getStyle(style, cfg, group); + var shape = group.addShape('rect', { + attrs: __assign({ x: 0, y: 0, width: size[0], height: size[1], radius: size[1] / 2, fill: '#fff', stroke: '#40a9ff' }, cardStyle), + name: 'main-box', + draggable: true, + }); + if (value) { + height += paddingArray[0]; + var createRowItems_1 = function (item, contentWidth, startX) { + var _a, _b; + var text = item.text, icon = item.icon; + var textShape; + var iconShape; + if (icon) { + iconShape = group.addShape('image', { + attrs: __assign({ x: startX, y: height, img: icon, width: contentHeight, height: contentHeight }, getStyle(labelStyle, cfg, group, 'icon')), + name: 'fund-icon', + }); + } + textShape = group === null || group === void 0 ? void 0 : group.addShape('text', { + attrs: __assign(__assign({ textBaseline: 'middle', textAlign: iconShape ? 'start' : 'center', x: startX + + (iconShape ? (iconShape === null || iconShape === void 0 ? void 0 : iconShape.getBBox().width) + defaultMargin : contentWidth / 2), y: paddingArray[0] + contentHeight / 2, text: text }, defaultLabelStyle$1), getStyle(labelStyle, cfg, group, 'text')), + name: "fund-text", + }); + return [(_a = textShape === null || textShape === void 0 ? void 0 : textShape.getBBox().height) !== null && _a !== void 0 ? _a : 0, (_b = iconShape === null || iconShape === void 0 ? void 0 : iconShape.getBBox().height) !== null && _b !== void 0 ? _b : 0]; + }; + var createItems = function (item) { + var _a; + var itemsHeight = []; + if (customContent) { + itemsHeight.push((_a = customContent(item, group, { + startX: paddingArray[3], + startY: height, + width: contentWidth, + })) !== null && _a !== void 0 ? _a : 0); + } + else { + itemsHeight.push.apply(itemsHeight, createRowItems_1(item, contentWidth, paddingArray[3])); + } + height += Math.max.apply(Math, itemsHeight); + }; + createItems(value); + } + shape === null || shape === void 0 ? void 0 : shape.attr('height', Math.max(size[1], height + paddingArray[2])); + // collapse marker + if (markerCfg) { + var stateCollapsed = ((_b = (_a = group === null || group === void 0 ? void 0 : group.get('item')) === null || _a === void 0 ? void 0 : _a.getModel()) !== null && _b !== void 0 ? _b : {}).collapsed; + var _g = shape.getBBox(), shapeWidth_1 = _g.width, shapeHeight = _g.height; + var _h = typeof markerCfg === 'function' ? markerCfg(cfg, group) : markerCfg, show = _h.show, _j = _h.position, position = _j === void 0 ? 'right' : _j, collapsed = _h.collapsed, markerStyle = _h.style; + createMarker({ + show: show, + position: position, + collapsed: stateCollapsed !== null && stateCollapsed !== void 0 ? stateCollapsed : collapsed, + style: markerStyle, + }, group, [shapeWidth_1, shapeHeight]); + shape.attr('defaultCollapsed', collapsed); + } + return shape; + }, + /** + * 更新节点，包含文本 + * @override + * @param {Object} cfg 节点的配置项 + * @param {Node} node 节点 + */ + update: undefined, + }, 'single-node'); + // 注册边 + G6.registerEdge('fund-line', { + // @ts-ignore + draw: function draw(cfg, group) { + if (cfg === void 0) { cfg = {}; } + var edgeCfg = cfg.edgeCfg, value = cfg.value; + var _a = getPathText(value), text = _a.text, subText = _a.subText; + var _b = edgeCfg, edgeStyle = _b.style, labelCfg = _b.label; + var _c = getPathInfo(cfg), startArrow = _c.startArrow, endArrow = _c.endArrow, path = _c.path, line2StartPoint = _c.line2StartPoint, endY = _c.endY; + var labelStyle = (labelCfg !== null && labelCfg !== void 0 ? labelCfg : {}).style; + var line = group.addShape('path', { + attrs: __assign({ path: path, stroke: '#ccc', startArrow: startArrow, endArrow: endArrow }, (typeof edgeStyle === 'function' ? edgeStyle(cfg, group) : edgeStyle)), + name: 'path-shape', + }); + var createItem = function (itemText, key) { + group.addShape('text', { + attrs: __assign(__assign({ text: itemText, x: line2StartPoint.x, y: key === 'text' ? endY - 4 : endY + 16 }, defaultLabelStyle$1), getStyle(labelStyle, cfg, group, key)), + name: "line-text-" + key, + }); + }; + text && createItem(text, 'text'); + subText && createItem(subText, 'subText'); + return line; + }, + // @ts-ignore + update: function (cfg, edge) { + var edgeCfg = cfg.edgeCfg, value = cfg.value; + var _a = getPathText(value), text = _a.text, subText = _a.subText; + var group = edge.getContainer(); + var getShape = function (shapeName) { + return group.get('children').find(function (item) { return item.get('name') === shapeName; }); + }; + // const { startArrow, endArrow } = getPathInfo(cfg); + var _b = getPathInfo(cfg), startArrow = _b.startArrow, endArrow = _b.endArrow, path = _b.path, line2StartPoint = _b.line2StartPoint, endY = _b.endY; + var _c = edgeCfg, edgeStyle = _c.style, labelCfg = _c.label; + var labelStyle = (labelCfg !== null && labelCfg !== void 0 ? labelCfg : {}).style; + // path + var pathShape = getShape('path-shape'); + pathShape === null || pathShape === void 0 ? void 0 : pathShape.attr(__assign({ path: path, stroke: '#ccc', startArrow: startArrow, endArrow: endArrow }, (typeof edgeStyle === 'function' ? edgeStyle(cfg, group) : edgeStyle))); + // path text + var texts = ['text', 'subText']; + texts.forEach(function (key) { + var textShape = getShape("line-text-" + key); + textShape === null || textShape === void 0 ? void 0 : textShape.attr(__assign(__assign({ x: line2StartPoint.x, y: key === 'text' ? endY - 4 : endY + 16, text: key === 'text' ? text : subText }, defaultLabelStyle$1), getStyle(labelStyle, cfg, group, key))); + }); + }, + }, 'single-edge'); +}; + +var __rest = (undefined && undefined.__rest) || function (s, e) { + var t = {}; + for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) + t[p] = s[p]; + if (s != null && typeof Object.getOwnPropertySymbols === "function") + for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) { + if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) + t[p[i]] = s[p[i]]; + } + return t; +}; +registerFundFlowItems(); +var defaultLayout = { + type: 'dagre', + rankdir: 'LR', + nodesep: 30, + ranksep: 50, +}; +var defaultProps = { + nodeCfg: { + type: 'fund-card', + size: defaultNodeSize$3, + style: defaultNodeStyle$7, + anchorPoints: defaultFlowGraphAnchorPoints, + nodeStateStyles: defaultStateStyles$2, + padding: 6, + }, + edgeCfg: { + type: 'fund-line', + edgeStateStyles: defaultStateStyles$2, + style: { + stroke: '#40a9ff', + }, + endArrow: { + fill: '#40a9ff', + }, + }, + behaviors: ['zoom-canvas', 'drag-canvas'], + layout: defaultLayout, + animate: true, + autoFit: true, + fitCenter: true, + style: { + position: 'relative', + height: 'inherit', + backgroundColor: '#fff', + }, +}; +var FundFlowGraph = function (props) { + var uProps = useProps(props, defaultProps).uProps; + var className = uProps.className, style = uProps.style, loading = uProps.loading, loadingTemplate = uProps.loadingTemplate, errorTemplate = uProps.errorTemplate, rest = __rest(uProps, ["className", "style", "loading", "loadingTemplate", "errorTemplate"]); + var container = useGraph('Graph', rest, { name: 'FundFlowGraph' }).container; + return (React.createElement(ErrorBoundary$2, { errorTemplate: errorTemplate }, + loading && React.createElement(ChartLoading$1, { loadingTemplate: loadingTemplate }), + React.createElement("div", { className: className, style: style, ref: container }))); +}; +var FundFlowGraph$1 = FundFlowGraph; + +var Charts = { + Area: Area, + Bar: Bar, + Box: Box$1, + Bullet: Bullet, + Column: Column, + Funnel: Funnel, + Histogram: Histogram, + Line: Line$2, + Liquid: Liquid, + Heatmap: Heatmap, + Pie: Pie, + Progress: Progress, + Radar: Radar, + Facet: Facet, + RingProgress: RingProgress, + Rose: Rose, + Chord: Chord, + Scatter: Scatter, + TinyArea: TinyArea, + TinyColumn: TinyColumn, + TinyLine: TinyLine, + Waterfall: Waterfall, + WordCloud: WordCloud, + Sunburst: Sunburst, + DualAxes: DualAxes, + Stock: Stock, + RadialBar: RadialBar, + Gauge: Gauge, + Sankey: Sankey, + Treemap: Treemap, + Violin: Violin, + MultiView: Mix, + Mix: Mix, + Venn: Venn, + BidirectionalBar: BidirectionalBar, + OrganizationTreeGraph: OrganizationTreeGraph, + DagreGraph: DagreGraph$1, + IndentedTree: IndentedTree$1, + DagreFundFlowGraph: DagreFundFlowGraph$1, + IndentedTreeGraph: IndentedTreeGraph$1, + FlowAnalysisGraph: FlowAnalysisGraph$1, + RadialTreeGraph: RadialTreeGraph$1, + DecompositionTreeGraph: DecompositionTreeGraph$1, + OrganizationGraph: OrganizationGraph$1, + OrganizationalGraph: OrganizationalGraph$1, + RadialGraph: RadialGraph$1, + FundFlowGraph: FundFlowGraph$1, + G2: G2, + flow: flow, + measureTextWidth: measureTextWidth, + adaptors: adaptors, +}; + +var errorBoundary = {}; + +var require$$0 = /*@__PURE__*/getAugmentedNamespace(index_module); + +var __extends = (commonjsGlobal && commonjsGlobal.__extends) || (function () { + var extendStatics = function (d, b) { + extendStatics = Object.setPrototypeOf || + ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) || + function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; }; + return extendStatics(d, b); + }; + return function (d, b) { + if (typeof b !== "function" && b !== null) + throw new TypeError("Class extends value " + String(b) + " is not a constructor or null"); + extendStatics(d, b); + function __() { this.constructor = d; } + d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); + }; +})(); +var __createBinding = (commonjsGlobal && commonjsGlobal.__createBinding) || (Object.create ? (function(o, m, k, k2) { + if (k2 === undefined) k2 = k; + Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } }); +}) : (function(o, m, k, k2) { + if (k2 === undefined) k2 = k; + o[k2] = m[k]; +})); +var __setModuleDefault = (commonjsGlobal && commonjsGlobal.__setModuleDefault) || (Object.create ? (function(o, v) { + Object.defineProperty(o, "default", { enumerable: true, value: v }); +}) : function(o, v) { + o["default"] = v; +}); +var __importStar = (commonjsGlobal && commonjsGlobal.__importStar) || function (mod) { + if (mod && mod.__esModule) return mod; + var result = {}; + if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k); + __setModuleDefault(result, mod); + return result; +}; +Object.defineProperty(errorBoundary, "__esModule", { value: true }); +var react_1 = __importStar(require$$0); +var ErrorBoundary = /** @class */ (function (_super) { + __extends(ErrorBoundary, _super); + function ErrorBoundary() { + var _this = _super !== null && _super.apply(this, arguments) || this; + _this.state = { + hasError: false, + }; + _this.renderError = function (e) { + var errorTemplate = _this.props.errorTemplate; + switch (e) { + default: + // fallback + return errorTemplate && typeof errorTemplate === 'function' ? (errorTemplate(e)) : (react_1.default.createElement("h5", null, + "\u7EC4\u4EF6\u51FA\u9519\u4E86\uFF0C\u8BF7\u6838\u67E5\u540E\u91CD\u8BD5\uFF1A ", + e.message)); + } + }; + return _this; + } + ErrorBoundary.getDerivedStateFromError = function (error) { + return { hasError: true, error: error }; + }; + ErrorBoundary.getDerivedStateFromProps = function (nextProps, state) { + if (state.children !== nextProps.children) { + return { + children: nextProps.children, + hasError: false, + error: undefined, + }; + } + return null; + }; + ErrorBoundary.prototype.render = function () { + if (this.state.hasError) { + return this.renderError(this.state.error); + } + return react_1.default.createElement(react_1.Fragment, null, this.props.children); + }; + return ErrorBoundary; +}(react_1.default.Component)); +var _default = errorBoundary.default = ErrorBoundary; + +Charts.G2.registerTheme("theme1", { + colors10: ["#FF6B3B", "#626681", "#FFC100", "#9FB40F", "#76523B", "#DAD5B5", "#0E8E89", "#E19348", "#F383A2", "#247FEA"], + colors20: ["#FF6B3B", "#626681", "#FFC100", "#9FB40F", "#76523B", "#DAD5B5", "#0E8E89", "#E19348", "#F383A2", "#247FEA", "#2BCB95", "#B1ABF4", "#1D42C2", "#1D9ED1", "#D64BC0", "#255634", "#8C8C47", "#8CDAE5", "#8E283B", "#791DC9"] +}); +Charts.G2.registerTheme("theme2", { + "colors10": ["#025DF4", "#DB6BCF", "#2498D1", "#BBBDE6", "#4045B2", "#21A97A", "#FF745A", "#007E99", "#FFA8A8", "#2391FF"], + "colors20": ["#025DF4", "#DB6BCF", "#2498D1", "#BBBDE6", "#4045B2", "#21A97A", "#FF745A", "#007E99", "#FFA8A8", "#2391FF", "#FFC328", "#A0DC2C", "#946DFF", "#626681", "#EB4185", "#CD8150", "#36BCCB", "#327039", "#803488", "#83BC99"] +}); +const Chart = ({ type, config }) => { + // @ts-ignore + const Component = Charts[type]; + return (React.createElement(_default, null, + React.createElement(Component, Object.assign({}, config, { onReady: + // @ts-ignore + (chart) => { + if (chart instanceof Plot) { + const custom = {}; + if (config.theme && config.backgroundColor) { + custom.theme = { background: config.backgroundColor }; + } + if (config.padding) { + custom.padding = config.padding; + } + if (custom.theme || config.padding) { + chart.update(custom); + } + } + } })))); +}; + +var papaparse_min = {exports: {}}; + +/* @license +Papa Parse +v5.3.1 +https://github.com/mholt/PapaParse +License: MIT +*/ + +(function (module, exports) { +!function(e,t){module.exports=t();}(commonjsGlobal,function s(){var f="undefined"!=typeof self?self:"undefined"!=typeof window?window:void 0!==f?f:{};var n=!f.document&&!!f.postMessage,o=n&&/blob:/i.test((f.location||{}).protocol),a={},h=0,b={parse:function(e,t){var i=(t=t||{}).dynamicTyping||!1;M(i)&&(t.dynamicTypingFunction=i,i={});if(t.dynamicTyping=i,t.transform=!!M(t.transform)&&t.transform,t.worker&&b.WORKERS_SUPPORTED){var r=function(){if(!b.WORKERS_SUPPORTED)return !1;var e=(i=f.URL||f.webkitURL||null,r=s.toString(),b.BLOB_URL||(b.BLOB_URL=i.createObjectURL(new Blob(["(",r,")();"],{type:"text/javascript"})))),t=new f.Worker(e);var i,r;return t.onmessage=_,t.id=h++,a[t.id]=t}();return r.userStep=t.step,r.userChunk=t.chunk,r.userComplete=t.complete,r.userError=t.error,t.step=M(t.step),t.chunk=M(t.chunk),t.complete=M(t.complete),t.error=M(t.error),delete t.worker,void r.postMessage({input:e,config:t,workerId:r.id})}var n=null;b.NODE_STREAM_INPUT,"string"==typeof e?n=t.download?new l(t):new p(t):!0===e.readable&&M(e.read)&&M(e.on)?n=new g(t):(f.File&&e instanceof File||e instanceof Object)&&(n=new c(t));return n.stream(e)},unparse:function(e,t){var n=!1,_=!0,m=",",y="\r\n",s='"',a=s+s,i=!1,r=null,o=!1;!function(){if("object"!=typeof t)return;"string"!=typeof t.delimiter||b.BAD_DELIMITERS.filter(function(e){return -1!==t.delimiter.indexOf(e)}).length||(m=t.delimiter);("boolean"==typeof t.quotes||"function"==typeof t.quotes||Array.isArray(t.quotes))&&(n=t.quotes);"boolean"!=typeof t.skipEmptyLines&&"string"!=typeof t.skipEmptyLines||(i=t.skipEmptyLines);"string"==typeof t.newline&&(y=t.newline);"string"==typeof t.quoteChar&&(s=t.quoteChar);"boolean"==typeof t.header&&(_=t.header);if(Array.isArray(t.columns)){if(0===t.columns.length)throw new Error("Option columns is empty");r=t.columns;}void 0!==t.escapeChar&&(a=t.escapeChar+s);"boolean"==typeof t.escapeFormulae&&(o=t.escapeFormulae);}();var h=new RegExp(j(s),"g");"string"==typeof e&&(e=JSON.parse(e));if(Array.isArray(e)){if(!e.length||Array.isArray(e[0]))return u(null,e,i);if("object"==typeof e[0])return u(r||Object.keys(e[0]),e,i)}else if("object"==typeof e)return "string"==typeof e.data&&(e.data=JSON.parse(e.data)),Array.isArray(e.data)&&(e.fields||(e.fields=e.meta&&e.meta.fields),e.fields||(e.fields=Array.isArray(e.data[0])?e.fields:"object"==typeof e.data[0]?Object.keys(e.data[0]):[]),Array.isArray(e.data[0])||"object"==typeof e.data[0]||(e.data=[e.data])),u(e.fields||[],e.data||[],i);throw new Error("Unable to serialize unrecognized input");function u(e,t,i){var r="";"string"==typeof e&&(e=JSON.parse(e)),"string"==typeof t&&(t=JSON.parse(t));var n=Array.isArray(e)&&0=this._config.preview;if(o)f.postMessage({results:n,workerId:b.WORKER_ID,finished:a});else if(M(this._config.chunk)&&!t){if(this._config.chunk(n,this._handle),this._handle.paused()||this._handle.aborted())return void(this._halted=!0);n=void 0,this._completeResults=void 0;}return this._config.step||this._config.chunk||(this._completeResults.data=this._completeResults.data.concat(n.data),this._completeResults.errors=this._completeResults.errors.concat(n.errors),this._completeResults.meta=n.meta),this._completed||!a||!M(this._config.complete)||n&&n.meta.aborted||(this._config.complete(this._completeResults,this._input),this._completed=!0),a||n&&n.meta.paused||this._nextChunk(),n}this._halted=!0;},this._sendError=function(e){M(this._config.error)?this._config.error(e):o&&this._config.error&&f.postMessage({workerId:b.WORKER_ID,error:e,finished:!1});};}function l(e){var r;(e=e||{}).chunkSize||(e.chunkSize=b.RemoteChunkSize),u.call(this,e),this._nextChunk=n?function(){this._readChunk(),this._chunkLoaded();}:function(){this._readChunk();},this.stream=function(e){this._input=e,this._nextChunk();},this._readChunk=function(){if(this._finished)this._chunkLoaded();else {if(r=new XMLHttpRequest,this._config.withCredentials&&(r.withCredentials=this._config.withCredentials),n||(r.onload=v(this._chunkLoaded,this),r.onerror=v(this._chunkError,this)),r.open(this._config.downloadRequestBody?"POST":"GET",this._input,!n),this._config.downloadRequestHeaders){var e=this._config.downloadRequestHeaders;for(var t in e)r.setRequestHeader(t,e[t]);}if(this._config.chunkSize){var i=this._start+this._config.chunkSize-1;r.setRequestHeader("Range","bytes="+this._start+"-"+i);}try{r.send(this._config.downloadRequestBody);}catch(e){this._chunkError(e.message);}n&&0===r.status&&this._chunkError();}},this._chunkLoaded=function(){4===r.readyState&&(r.status<200||400<=r.status?this._chunkError():(this._start+=this._config.chunkSize?this._config.chunkSize:r.responseText.length,this._finished=!this._config.chunkSize||this._start>=function(e){var t=e.getResponseHeader("Content-Range");if(null===t)return -1;return parseInt(t.substring(t.lastIndexOf("/")+1))}(r),this.parseChunk(r.responseText)));},this._chunkError=function(e){var t=r.statusText||e;this._sendError(new Error(t));};}function c(e){var r,n;(e=e||{}).chunkSize||(e.chunkSize=b.LocalChunkSize),u.call(this,e);var s="undefined"!=typeof FileReader;this.stream=function(e){this._input=e,n=e.slice||e.webkitSlice||e.mozSlice,s?((r=new FileReader).onload=v(this._chunkLoaded,this),r.onerror=v(this._chunkError,this)):r=new FileReaderSync,this._nextChunk();},this._nextChunk=function(){this._finished||this._config.preview&&!(this._rowCount=this._input.size,this.parseChunk(e.target.result);},this._chunkError=function(){this._sendError(r.error);};}function p(e){var i;u.call(this,e=e||{}),this.stream=function(e){return i=e,this._nextChunk()},this._nextChunk=function(){if(!this._finished){var e,t=this._config.chunkSize;return t?(e=i.substring(0,t),i=i.substring(t)):(e=i,i=""),this._finished=!i,this.parseChunk(e)}};}function g(e){u.call(this,e=e||{});var t=[],i=!0,r=!1;this.pause=function(){u.prototype.pause.apply(this,arguments),this._input.pause();},this.resume=function(){u.prototype.resume.apply(this,arguments),this._input.resume();},this.stream=function(e){this._input=e,this._input.on("data",this._streamData),this._input.on("end",this._streamEnd),this._input.on("error",this._streamError);},this._checkIsFinished=function(){r&&1===t.length&&(this._finished=!0);},this._nextChunk=function(){this._checkIsFinished(),t.length?this.parseChunk(t.shift()):i=!0;},this._streamData=v(function(e){try{t.push("string"==typeof e?e:e.toString(this._config.encoding)),i&&(i=!1,this._checkIsFinished(),this.parseChunk(t.shift()));}catch(e){this._streamError(e);}},this),this._streamError=v(function(e){this._streamCleanUp(),this._sendError(e);},this),this._streamEnd=v(function(){this._streamCleanUp(),r=!0,this._streamData("");},this),this._streamCleanUp=v(function(){this._input.removeListener("data",this._streamData),this._input.removeListener("end",this._streamEnd),this._input.removeListener("error",this._streamError);},this);}function i(m){var a,o,h,r=Math.pow(2,53),n=-r,s=/^\s*-?(\d+\.?|\.\d+|\d+\.\d+)([eE][-+]?\d+)?\s*$/,u=/^(\d{4}-[01]\d-[0-3]\dT[0-2]\d:[0-5]\d:[0-5]\d\.\d+([+-][0-2]\d:[0-5]\d|Z))|(\d{4}-[01]\d-[0-3]\dT[0-2]\d:[0-5]\d:[0-5]\d([+-][0-2]\d:[0-5]\d|Z))|(\d{4}-[01]\d-[0-3]\dT[0-2]\d:[0-5]\d([+-][0-2]\d:[0-5]\d|Z))$/,t=this,i=0,f=0,d=!1,e=!1,l=[],c={data:[],errors:[],meta:{}};if(M(m.step)){var p=m.step;m.step=function(e){if(c=e,_())g();else {if(g(),0===c.data.length)return;i+=e.data.length,m.preview&&i>m.preview?o.abort():(c.data=c.data[0],p(c,t));}};}function y(e){return "greedy"===m.skipEmptyLines?""===e.join("").trim():1===e.length&&0===e[0].length}function g(){if(c&&h&&(k("Delimiter","UndetectableDelimiter","Unable to auto-detect delimiting character; defaulted to '"+b.DefaultDelimiter+"'"),h=!1),m.skipEmptyLines)for(var e=0;e=l.length?"__parsed_extra":l[i]),m.transform&&(s=m.transform(s,n)),s=v(n,s),"__parsed_extra"===n?(r[n]=r[n]||[],r[n].push(s)):r[n]=s;}return m.header&&(i>l.length?k("FieldMismatch","TooManyFields","Too many fields: expected "+l.length+" fields but parsed "+i,f+t):i=r.length/2?"\r\n":"\r"}(e,r)),h=!1,m.delimiter)M(m.delimiter)&&(m.delimiter=m.delimiter(e),c.meta.delimiter=m.delimiter);else {var n=function(e,t,i,r,n){var s,a,o,h;n=n||[",","\t","|",";",b.RECORD_SEP,b.UNIT_SEP];for(var u=0;u=D)return C(!0)}else for(m=F,F++;;){if(-1===(m=r.indexOf(S,m+1)))return i||u.push({type:"Quotes",code:"MissingQuotes",message:"Quoted field unterminated",row:h.length,index:F}),E();if(m===n-1)return E(r.substring(F,m).replace(_,S));if(S!==L||r[m+1]!==L){if(S===L||0===m||r[m-1]!==L){-1!==p&&p=D)return C(!0);break}u.push({type:"Quotes",code:"InvalidQuotes",message:"Trailing quote on quoted field is malformed",row:h.length,index:F}),m++;}}else m++;}return E();function k(e){h.push(e),d=F;}function b(e){var t=0;if(-1!==e){var i=r.substring(m+1,e);i&&""===i.trim()&&(t=i.length);}return t}function E(e){return i||(void 0===e&&(e=r.substring(F)),f.push(e),F=n,k(f),o&&R()),C()}function w(e){F=e,k(f),f=[],g=r.indexOf(x,F);}function C(e){return {data:h,errors:u,meta:{delimiter:O,linebreak:x,aborted:z,truncated:!!e,cursor:d+(t||0)}}}function R(){T(C()),h=[],u=[];}},this.abort=function(){z=!0;},this.getCharIndex=function(){return F};}function _(e){var t=e.data,i=a[t.workerId],r=!1;if(t.error)i.userError(t.error,t.file);else if(t.results&&t.results.data){var n={abort:function(){r=!0,m(t.workerId,{data:[],errors:[],meta:{aborted:!0}});},pause:y,resume:y};if(M(i.userStep)){for(var s=0;s { + if (f instanceof obsidian.TFolder) { + options[f.path] = f.path; + } + }); + return options; +} +function parseCsv(content) { + return Papa.parse(content, { + header: true, + skipEmptyLines: true, + comments: false, + dynamicTyping: true, + }).data; +} +/** + * From better-word-count by Luke Leppan (https://github.com/lukeleppan/better-word-count) + * @returns + */ +function getWordCountRegex() { + const spaceDelimitedChars = /A-Za-z\u00AA\u00B5\u00BA\u00C0-\u00D6\u00D8-\u00F6\u00F8-\u02C1\u02C6-\u02D1\u02E0-\u02E4\u02EC\u02EE\u0370-\u0374\u0376\u0377\u037A-\u037D\u037F\u0386\u0388-\u038A\u038C\u038E-\u03A1\u03A3-\u03F5\u03F7-\u0481\u048A-\u052F\u0531-\u0556\u0559\u0561-\u0587\u05D0-\u05EA\u05F0-\u05F2\u0620-\u064A\u066E\u066F\u0671-\u06D3\u06D5\u06E5\u06E6\u06EE\u06EF\u06FA-\u06FC\u06FF\u0710\u0712-\u072F\u074D-\u07A5\u07B1\u07CA-\u07EA\u07F4\u07F5\u07FA\u0800-\u0815\u081A\u0824\u0828\u0840-\u0858\u08A0-\u08B4\u0904-\u0939\u093D\u0950\u0958-\u0961\u0971-\u0980\u0985-\u098C\u098F\u0990\u0993-\u09A8\u09AA-\u09B0\u09B2\u09B6-\u09B9\u09BD\u09CE\u09DC\u09DD\u09DF-\u09E1\u09F0\u09F1\u0A05-\u0A0A\u0A0F\u0A10\u0A13-\u0A28\u0A2A-\u0A30\u0A32\u0A33\u0A35\u0A36\u0A38\u0A39\u0A59-\u0A5C\u0A5E\u0A72-\u0A74\u0A85-\u0A8D\u0A8F-\u0A91\u0A93-\u0AA8\u0AAA-\u0AB0\u0AB2\u0AB3\u0AB5-\u0AB9\u0ABD\u0AD0\u0AE0\u0AE1\u0AF9\u0B05-\u0B0C\u0B0F\u0B10\u0B13-\u0B28\u0B2A-\u0B30\u0B32\u0B33\u0B35-\u0B39\u0B3D\u0B5C\u0B5D\u0B5F-\u0B61\u0B71\u0B83\u0B85-\u0B8A\u0B8E-\u0B90\u0B92-\u0B95\u0B99\u0B9A\u0B9C\u0B9E\u0B9F\u0BA3\u0BA4\u0BA8-\u0BAA\u0BAE-\u0BB9\u0BD0\u0C05-\u0C0C\u0C0E-\u0C10\u0C12-\u0C28\u0C2A-\u0C39\u0C3D\u0C58-\u0C5A\u0C60\u0C61\u0C85-\u0C8C\u0C8E-\u0C90\u0C92-\u0CA8\u0CAA-\u0CB3\u0CB5-\u0CB9\u0CBD\u0CDE\u0CE0\u0CE1\u0CF1\u0CF2\u0D05-\u0D0C\u0D0E-\u0D10\u0D12-\u0D3A\u0D3D\u0D4E\u0D5F-\u0D61\u0D7A-\u0D7F\u0D85-\u0D96\u0D9A-\u0DB1\u0DB3-\u0DBB\u0DBD\u0DC0-\u0DC6\u0E01-\u0E30\u0E32\u0E33\u0E40-\u0E46\u0E81\u0E82\u0E84\u0E87\u0E88\u0E8A\u0E8D\u0E94-\u0E97\u0E99-\u0E9F\u0EA1-\u0EA3\u0EA5\u0EA7\u0EAA\u0EAB\u0EAD-\u0EB0\u0EB2\u0EB3\u0EBD\u0EC0-\u0EC4\u0EC6\u0EDC-\u0EDF\u0F00\u0F40-\u0F47\u0F49-\u0F6C\u0F88-\u0F8C\u1000-\u102A\u103F\u1050-\u1055\u105A-\u105D\u1061\u1065\u1066\u106E-\u1070\u1075-\u1081\u108E\u10A0-\u10C5\u10C7\u10CD\u10D0-\u10FA\u10FC-\u1248\u124A-\u124D\u1250-\u1256\u1258\u125A-\u125D\u1260-\u1288\u128A-\u128D\u1290-\u12B0\u12B2-\u12B5\u12B8-\u12BE\u12C0\u12C2-\u12C5\u12C8-\u12D6\u12D8-\u1310\u1312-\u1315\u1318-\u135A\u1380-\u138F\u13A0-\u13F5\u13F8-\u13FD\u1401-\u166C\u166F-\u167F\u1681-\u169A\u16A0-\u16EA\u16F1-\u16F8\u1700-\u170C\u170E-\u1711\u1720-\u1731\u1740-\u1751\u1760-\u176C\u176E-\u1770\u1780-\u17B3\u17D7\u17DC\u1820-\u1877\u1880-\u18A8\u18AA\u18B0-\u18F5\u1900-\u191E\u1950-\u196D\u1970-\u1974\u1980-\u19AB\u19B0-\u19C9\u1A00-\u1A16\u1A20-\u1A54\u1AA7\u1B05-\u1B33\u1B45-\u1B4B\u1B83-\u1BA0\u1BAE\u1BAF\u1BBA-\u1BE5\u1C00-\u1C23\u1C4D-\u1C4F\u1C5A-\u1C7D\u1CE9-\u1CEC\u1CEE-\u1CF1\u1CF5\u1CF6\u1D00-\u1DBF\u1E00-\u1F15\u1F18-\u1F1D\u1F20-\u1F45\u1F48-\u1F4D\u1F50-\u1F57\u1F59\u1F5B\u1F5D\u1F5F-\u1F7D\u1F80-\u1FB4\u1FB6-\u1FBC\u1FBE\u1FC2-\u1FC4\u1FC6-\u1FCC\u1FD0-\u1FD3\u1FD6-\u1FDB\u1FE0-\u1FEC\u1FF2-\u1FF4\u1FF6-\u1FFC\u2071\u207F\u2090-\u209C\u2102\u2107\u210A-\u2113\u2115\u2119-\u211D\u2124\u2126\u2128\u212A-\u212D\u212F-\u2139\u213C-\u213F\u2145-\u2149\u214E\u2183\u2184\u2C00-\u2C2E\u2C30-\u2C5E\u2C60-\u2CE4\u2CEB-\u2CEE\u2CF2\u2CF3\u2D00-\u2D25\u2D27\u2D2D\u2D30-\u2D67\u2D6F\u2D80-\u2D96\u2DA0-\u2DA6\u2DA8-\u2DAE\u2DB0-\u2DB6\u2DB8-\u2DBE\u2DC0-\u2DC6\u2DC8-\u2DCE\u2DD0-\u2DD6\u2DD8-\u2DDE\u2E2F\u3005\u3006\u3031-\u3035\u303B\u303C\u3105-\u312D\u3131-\u318E\u31A0-\u31BA\u31F0-\u31FF\u3400-\u4DB5\uA000-\uA48C\uA4D0-\uA4FD\uA500-\uA60C\uA610-\uA61F\uA62A\uA62B\uA640-\uA66E\uA67F-\uA69D\uA6A0-\uA6E5\uA717-\uA71F\uA722-\uA788\uA78B-\uA7AD\uA7B0-\uA7B7\uA7F7-\uA801\uA803-\uA805\uA807-\uA80A\uA80C-\uA822\uA840-\uA873\uA882-\uA8B3\uA8F2-\uA8F7\uA8FB\uA8FD\uA90A-\uA925\uA930-\uA946\uA960-\uA97C\uA984-\uA9B2\uA9CF\uA9E0-\uA9E4\uA9E6-\uA9EF\uA9FA-\uA9FE\uAA00-\uAA28\uAA40-\uAA42\uAA44-\uAA4B\uAA60-\uAA76\uAA7A\uAA7E-\uAAAF\uAAB1\uAAB5\uAAB6\uAAB9-\uAABD\uAAC0\uAAC2\uAADB-\uAADD\uAAE0-\uAAEA\uAAF2-\uAAF4\uAB01-\uAB06\uAB09-\uAB0E\uAB11-\uAB16\uAB20-\uAB26\uAB28-\uAB2E\uAB30-\uAB5A\uAB5C-\uAB65\uAB70-\uABE2\uAC00-\uD7A3\uD7B0-\uD7C6\uD7CB-\uD7FB\uF900-\uFA6D\uFA70-\uFAD9\uFB00-\uFB06\uFB13-\uFB17\uFB1D\uFB1F-\uFB28\uFB2A-\uFB36\uFB38-\uFB3C\uFB3E\uFB40\uFB41\uFB43\uFB44\uFB46-\uFBB1\uFBD3-\uFD3D\uFD50-\uFD8F\uFD92-\uFDC7\uFDF0-\uFDFB\uFE70-\uFE74\uFE76-\uFEFC\uFF21-\uFF3A\uFF41-\uFF5A\uFF66-\uFFBE\uFFC2-\uFFC7\uFFCA-\uFFCF\uFFD2-\uFFD7\uFFDA-\uFFDC/ + .source; + const nonSpaceDelimitedWords = /\u3041-\u3096\u309D-\u309F\u30A1-\u30FA\u30FC-\u30FF\u4E00-\u9FD5/.source; + const nonSpaceDelimitedWordsOther = /[\u3041-\u3096\u309D-\u309F\u30A1-\u30FA\u30FC-\u30FF\u4E00-\u9FD5]{1}/ + .source; + return new RegExp([ + `(?:[0-9]+(?:(?:,|\\.)[0-9]+)*|[\\-${spaceDelimitedChars}])+`, + nonSpaceDelimitedWords, + nonSpaceDelimitedWordsOther, + ].join("|"), "g"); +} +function getWordCount(text, filter) { + const words = {}; + const matchs = text.match(getWordCountRegex()); + if (matchs) { + matchs.forEach(match => { + match = match.toLowerCase(); + words[match] = words[match] ? words[match] + 1 : 1; + }); + } + const wordCount = []; + const ignoreRegex = new RegExp(filter.split("\n").map(e => ['^', e.trim(), '$'].join('')).join('|'), "i"); + for (const word in words) { + if (!ignoreRegex.test(word)) { + wordCount.push({ word: word, count: words[word] }); + } + } + return wordCount; +} + +const functionRegex = /^[\s\n]*function[\s\n]+[\w\W]*\([\w\W]*\)[\s\n]*\{[\w\W]*\}[\s\n]*/i; +function parseConfig(content, plugin) { + return __awaiter$4(this, void 0, void 0, function* () { + const dataProps = obsidian.parseYaml(content); + const type = dataProps["type"]; + const chart = Charts[type]; + if (chart === undefined) { + throw new Error(`Unsupported chart type ${type}.`); + } + const data = dataProps["data"]; + const options = stringToFunction(dataProps["options"] || {}); + if (type == "MultiView" || type == "Mix") { + return { + type, + config: yield parseMultiViewConfig(dataProps, data, options, plugin) + }; + } + else { + return { + type, + config: Object.assign({ data: yield loadFromFile(data, plugin) }, options) + }; + } + }); +} +function stringToFunction(options) { + for (const key in options) { + const value = options[key]; + if (value) { + if (typeof value === "string" && functionRegex.test(value)) { + options[key] = eval(`(${value})`); + } + else if (Array.isArray(value)) { + options[key] = value.map(stringToFunction); + } + else if (typeof value === "object") { + options[key] = stringToFunction(value); + } + } + } + return options; +} +function parseMultiViewConfig(dataProps, data, options, plugin) { + return __awaiter$4(this, void 0, void 0, function* () { + const temp = new Map(); + const views = []; + for (const key in dataProps) { + const keyParts = key.split("."); + if (keyParts.length !== 2 + || (keyParts[0] !== "options" && keyParts[0] !== "data")) { + continue; + } + const viewType = keyParts[1]; + const view = temp.get(viewType) || {}; + view[keyParts[0]] = dataProps[key]; + temp.set(viewType, view); + } + for (let v of temp.values()) { + views.push(Object.assign({ data: (yield loadFromFile(v["data"], plugin)) || data }, v["options"])); + } + return Object.assign({ views }, options); + }); +} +function loadFromFile(data, plugin) { + return __awaiter$4(this, void 0, void 0, function* () { + if (typeof data === "string") { + if (data.startsWith("wordcount:")) { + return loadFromMdWordCount(data.replace("wordcount:", ""), plugin); + } + else { + return loadFromCsv(data, plugin); + } + } + else { + return data; + } + }); +} +function loadFromMdWordCount(fileName, plugin) { + return __awaiter$4(this, void 0, void 0, function* () { + for (const file of plugin.app.vault.getMarkdownFiles()) { + if (file.basename == fileName) { + const content = yield plugin.app.vault.cachedRead(file); + return getWordCount(content, plugin.settings.wordCountFilter); + } + } + throw new Error(`Note not found.`); + }); +} +function loadFromCsv(data, plugin) { + return __awaiter$4(this, void 0, void 0, function* () { + const csvFileNames = data.split(","); + const value = []; + for (let name of csvFileNames.values()) { + const file = plugin.app.vault.getAbstractFileByPath(plugin.settings.dataPath + "/" + name.trim()); + if (file instanceof obsidian.TFile) { + value.push(parseCsv(yield plugin.app.vault.read(file))); + } + else { + value.push({}); + } + } + if (value.length == 0) { + return {}; + } + if (value.length == 1) { + return value[0]; + } + return value; + }); +} + +const DEFAULT_SETTINGS = { + theme: 'default', + dataPath: '', + backgroundColor: 'transparent', + paddingTop: 30, + paddingRight: 30, + paddingBottom: 30, + paddingLeft: 30, + wordCountFilter: `[A-z]{1,2} +[0-9]+ +(?=[MDCLXVI])M*(C[MD]|D?C*)(X[CL]|L?X*)(I[XV]|V?I*) +and +are +but +did +for +get +got +had +has +her +him +his +its +not +our +she +the +was +you +been +from +have +into +mine +ours +that +them +they +this +went +were +with +these +those` +}; +class ChartsViewSettingTab extends obsidian.PluginSettingTab { + constructor(app, plugin) { + super(app, plugin); + this.plugin = plugin; + } + display() { + let { containerEl } = this; + containerEl.empty(); + containerEl.createEl('h2', { text: 'Charts View Settings' }); + new obsidian.Setting(containerEl) + .setName("Theme") + .setDesc("Choose default color scheme.") + .addDropdown(dropdown => dropdown + .addOption("default", "default") + .addOption("dark", "dark") + .addOption("theme1", "Theme #1") + .addOption("theme2", "Theme #2") + .setValue(this.plugin.settings.theme) + .onChange((value) => __awaiter$4(this, void 0, void 0, function* () { + this.plugin.settings.theme = value; + yield this.plugin.saveSettings(); + }))); + new obsidian.Setting(containerEl) + .setName("Background Color") + .setDesc("Change the background color of chart. e.g., #FFFFFF") + .addText(text => text + .setPlaceholder("transparent") + .setValue(this.plugin.settings.backgroundColor) + .onChange((value) => __awaiter$4(this, void 0, void 0, function* () { + this.plugin.settings.backgroundColor = value; + yield this.plugin.saveSettings(); + }))); + new obsidian.Setting(containerEl) + .setName("Chart Padding") + .setDesc("Change the padding of chart. (Top, Right, Bottom, Left)") + .addText(text => { + text.inputEl.size = 5; + text + .setPlaceholder("30") + .setValue(String(this.plugin.settings.paddingTop)) + .onChange((value) => __awaiter$4(this, void 0, void 0, function* () { + this.plugin.settings.paddingTop = Number(value); + yield this.plugin.saveSettings(); + })); + }) + .addText(text => { + text.inputEl.size = 5; + text + .setPlaceholder("30") + .setValue(String(this.plugin.settings.paddingRight)) + .onChange((value) => __awaiter$4(this, void 0, void 0, function* () { + this.plugin.settings.paddingRight = Number(value); + yield this.plugin.saveSettings(); + })); + }) + .addText(text => { + text.inputEl.size = 5; + text + .setPlaceholder("30") + .setValue(String(this.plugin.settings.paddingBottom)) + .onChange((value) => __awaiter$4(this, void 0, void 0, function* () { + this.plugin.settings.paddingBottom = Number(value); + yield this.plugin.saveSettings(); + })); + }) + .addText(text => { + text.inputEl.size = 5; + text + .setPlaceholder("30") + .setValue(String(this.plugin.settings.paddingLeft)) + .onChange((value) => __awaiter$4(this, void 0, void 0, function* () { + this.plugin.settings.paddingLeft = Number(value); + yield this.plugin.saveSettings(); + })); + }); + new obsidian.Setting(containerEl) + .setName("Data Folder") + .setDesc("Choose default folder for loading chart datas.") + .addDropdown(dropdown => dropdown + .addOptions(getFolderOptions(this.app)) + .setValue(this.plugin.settings.dataPath) + .onChange((value) => __awaiter$4(this, void 0, void 0, function* () { + this.plugin.settings.dataPath = value; + yield this.plugin.saveSettings(); + }))); + new obsidian.Setting(containerEl) + .setName("Word Filter") + .setDesc("For word count, any words in the list will be ignored.") + .addTextArea(text => { + text.inputEl.rows = 6; + text + .setValue(this.plugin.settings.wordCountFilter) + .onChange((value) => __awaiter$4(this, void 0, void 0, function* () { + this.plugin.settings.wordCountFilter = value; + yield this.plugin.saveSettings(); + })); + }); + if (obsidian.Platform.isDesktopApp) { + React.render(React.createElement(React.Fragment, null, + React.createElement("p", null, "Make a donation to support Charts View plugin development."), + React.createElement("p", null, "\u2764\uFE0F Thank you for your support. \u2764\uFE0F"), + React.createElement("a", { href: "https://paypal.me/caronchenhz", className: "paypal" }, + React.createElement("svg", { width: "145px", height: "37px", viewBox: "0 0 145 37", version: "1.1", xmlns: "http://www.w3.org/2000/svg", xmlnsXlink: "http://www.w3.org/1999/xlink" }, + React.createElement("defs", null, + React.createElement("polygon", { id: "path-1", points: "0 0.30377 29.7890799 0.30377 29.7890799 36.629778 0 36.629778" }), + React.createElement("polygon", { id: "path-3", points: "0 0.30377 27.0026179 0.30377 27.0026179 32.599368 0 32.599368" }), + React.createElement("polygon", { id: "path-5", points: "0 0.30377 27.0025944 0.30377 27.0025944 32.599368 0 32.599368" })), + React.createElement("g", { id: "Page-1", stroke: "none", strokeWidth: "1", fill: "none", fillRule: "evenodd" }, + React.createElement("g", { id: "01.2---Corp-Landing---Sticky-Nav", transform: "translate(-80.000000, -21.000000)" }, + React.createElement("g", { id: "logo-paypal", transform: "translate(80.000000, 21.000000)" }, + React.createElement("path", { d: "M112.489747,16.203225 C112.054389,19.158415 109.870796,19.158415 107.758093,19.158415 L106.556562,19.158415 L107.399352,13.640975 C107.450549,13.307605 107.728735,13.061925 108.055253,13.061925 L108.606253,13.061925 C110.04408,13.061925 111.402426,13.061925 112.102364,13.908485 C112.521611,14.415015 112.647994,15.165745 112.489747,16.203225 M111.570698,8.493535 L103.60429,8.493535 C103.059735,8.493535 102.595735,8.903125 102.511241,9.458865 L99.2897346,30.568475 C99.2260062,30.985095 99.5374877,31.362125 99.9456358,31.362125 L104.033204,31.362125 C104.414142,31.362125 104.739228,31.075005 104.798302,30.686135 L105.711623,24.701385 C105.796833,24.145275 106.260475,23.735315 106.805031,23.735315 L109.325525,23.735315 C114.572735,23.735315 117.600907,21.111645 118.3925,15.910185 C118.748735,13.635425 118.406821,11.847955 117.376068,10.596615 C116.243278,9.220955 114.235475,8.493535 111.570698,8.493535", id: "Fill-1", fill: "#009CDE" }), + React.createElement("path", { d: "M55.6725531,16.203225 C55.2371951,19.158415 53.0532444,19.158415 50.9412568,19.158415 L49.7393679,19.158415 L50.582158,13.640975 C50.6333556,13.307605 50.9115407,13.061925 51.2380593,13.061925 L51.7890593,13.061925 C53.2268864,13.061925 54.5852321,13.061925 55.2851704,13.908485 C55.7040593,14.415015 55.8308,15.165745 55.6725531,16.203225 M54.7535037,8.493535 L46.7870963,8.493535 C46.2425407,8.493535 45.7788988,8.903125 45.6936889,9.458865 L42.4725407,30.568475 C42.4091704,30.985095 42.7206519,31.362125 43.128442,31.362125 L46.9320963,31.362125 C47.4766519,31.362125 47.9402938,30.952165 48.0255037,30.396055 L48.8944296,24.701385 C48.9792815,24.145275 49.4432815,23.735315 49.987837,23.735315 L52.5086889,23.735315 C57.7555407,23.735315 60.7840716,21.111645 61.5753062,15.910185 C61.9315407,13.635425 61.5896272,11.847955 60.5592321,10.596615 C59.426084,9.220955 57.4182815,8.493535 54.7535037,8.493535", id: "Fill-3", fill: "#003087" }), + React.createElement("path", { d: "M73.2472333,23.781713 C72.8788259,26.034273 71.1484926,27.546093 68.9416284,27.546093 C67.8353321,27.546093 66.949579,27.178313 66.3803198,26.482343 C65.8160728,25.791923 65.6034062,24.808093 65.7824185,23.712893 C66.1261222,21.480683 67.8840235,19.919653 70.0572333,19.919653 C71.140616,19.919653 72.0199247,20.291133 72.6002827,20.994133 C73.184579,21.701943 73.4144309,22.692063 73.2472333,23.781713 M78.563184,16.108653 L74.7487889,16.108653 C74.4219123,16.108653 74.1437272,16.354333 74.0925296,16.688073 L73.9253321,17.790303 L73.6582457,17.391073 C72.8322827,16.151573 70.9913198,15.737913 69.1525049,15.737913 C64.9385543,15.737913 61.338616,19.038313 60.6379617,23.667013 C60.2731346,25.976553 60.7908383,28.183233 62.0578877,29.723543 C63.222184,31.138793 64.8830605,31.727833 66.862221,31.727833 C70.2588012,31.727833 72.1430852,29.472683 72.1430852,29.472683 L71.9726654,30.568253 C71.908937,30.984873 72.2204185,31.361903 72.6285667,31.361903 L76.0638136,31.361903 C76.6083691,31.361903 77.0720111,30.952683 77.156863,30.396573 L79.2190852,16.901563 C79.2824556,16.485313 78.9709741,16.108653 78.563184,16.108653", id: "Fill-5", fill: "#003087" }), + React.createElement("path", { d: "M130.064427,23.781713 C129.69602,26.034273 127.966044,27.546093 125.75918,27.546093 C124.652526,27.546093 123.766773,27.178313 123.197156,26.482343 C122.633267,25.791923 122.4206,24.808093 122.599612,23.712893 C122.943316,21.480683 124.701217,19.919653 126.874427,19.919653 C127.957452,19.919653 128.837119,20.291133 129.417477,20.994133 C130.001773,21.701943 130.231625,22.692063 130.064427,23.781713 M135.380378,16.108653 L131.565983,16.108653 C131.239106,16.108653 130.960921,16.354333 130.909723,16.688073 L130.742526,17.790303 L130.47544,17.391073 C129.649477,16.151573 127.808156,15.737913 125.969699,15.737913 C121.755748,15.737913 118.15581,19.038313 117.455156,23.667013 C117.090686,25.976553 117.608032,28.183233 118.875081,29.723543 C120.03902,31.138793 121.700254,31.727833 123.679415,31.727833 C127.075995,31.727833 128.960279,29.472683 128.960279,29.472683 L128.789859,30.568253 C128.726131,30.984873 129.037612,31.361903 129.44576,31.361903 L132.881007,31.361903 C133.425563,31.361903 133.889205,30.952683 133.974057,30.396573 L136.036279,16.901563 C136.099649,16.485313 135.788168,16.108653 135.380378,16.108653", id: "Fill-7", fill: "#009CDE" }), + React.createElement("path", { d: "M98.8795457,16.108727 L95.0454593,16.108727 C94.678842,16.108727 94.3358543,16.296687 94.1296321,16.610077 L88.8408914,24.660167 L86.5992988,16.924947 C86.4593111,16.440617 86.0278914,16.108727 85.5391877,16.108727 L81.7702617,16.108727 C81.3148543,16.108727 80.9951383,16.571227 81.1415704,17.016707 L85.3633975,29.823147 L81.3925457,35.613277 C81.0807062,36.068007 81.3954099,36.696267 81.9345951,36.696267 L85.7647432,36.696267 C86.1277802,36.696267 86.4675457,36.512377 86.674484,36.204167 L99.4251753,17.186167 C99.7302123,16.731067 99.4151506,16.108727 98.8795457,16.108727", id: "Fill-9", fill: "#003087" }), + React.createElement("path", { d: "M139.876523,9.07314 L136.606684,30.56903 C136.543314,30.98565 136.855153,31.36194 137.262585,31.36194 L140.551042,31.36194 C141.095598,31.36194 141.55924,30.95235 141.644091,30.39661 L144.867746,9.287 C144.931474,8.87038 144.619993,8.49372 144.211844,8.49372 L140.532425,8.49372 C140.205548,8.49372 139.927363,8.7394 139.876523,9.07314", id: "Fill-11", fill: "#009CDE" }), + React.createElement("g", { id: "Group-15", transform: "translate(0.000000, 0.066415)" }, + React.createElement("mask", { id: "mask-2", fill: "white" }, + React.createElement("use", { xlinkHref: "#path-1" })), + React.createElement("g", { id: "Clip-14" }), + React.createElement("path", { d: "M26.8450852,9.532828 C27.2739988,6.706768 26.842221,4.784248 25.363221,3.042288 C23.7349247,1.124948 20.7933938,0.303548 17.0294802,0.303548 L6.10471481,0.303548 C5.33567778,0.303548 4.68085062,0.881858 4.56091235,1.667368 L0.0114925926,31.479008 C-0.0780135802,32.067308 0.361998765,32.599368 0.938060494,32.599368 L7.68252963,32.599368 L7.21709753,35.650018 C7.13869012,36.164688 7.52320864,36.629778 8.02730741,36.629778 L13.7120235,36.629778 C14.3851099,36.629778 14.9579494,36.123988 15.0628506,35.437268 L15.1187025,35.138308 L16.1895543,28.120148 L16.2586531,27.732388 C16.3635543,27.045668 16.9363938,26.539508 17.6091222,26.539508 L18.4594309,26.539508 C23.9669247,26.539508 28.2793321,24.227378 29.539221,17.539998 C30.0658753,14.745388 29.7934185,12.413278 28.4014185,10.773438 C27.9800235,10.277268 27.4562333,9.867308 26.8450852,9.532828", id: "Fill-13", fill: "#009CDE", mask: "url(#mask-2)" })), + React.createElement("g", { id: "Group-18", transform: "translate(0.000000, 0.066415)" }, + React.createElement("mask", { id: "mask-4", fill: "white" }, + React.createElement("use", { xlinkHref: "#path-3" })), + React.createElement("g", { id: "Clip-17" }), + React.createElement("path", { d: "M26.8450852,9.532828 C27.2739988,6.706768 26.842221,4.784248 25.363221,3.042288 C23.7349247,1.124948 20.7933938,0.303548 17.0294802,0.303548 L6.10471481,0.303548 C5.33567778,0.303548 4.68085062,0.881858 4.56091235,1.667368 L0.0114925926,31.479008 C-0.0780135802,32.067308 0.361998765,32.599368 0.938060494,32.599368 L7.68252963,32.599368 L9.37670247,21.496778 L9.32407284,21.844948 C9.44401111,21.059808 10.0931099,20.481498 10.8625049,20.481498 L14.0679,20.481498 C20.3634062,20.481498 25.2930481,17.838218 26.7333815,10.194018 C26.7759864,9.967578 26.8125049,9.748538 26.8450852,9.532828", id: "Fill-16", fill: "#012169", mask: "url(#mask-4)" })), + React.createElement("g", { id: "Group-21", transform: "translate(0.000000, 0.066415)" }, + React.createElement("mask", { id: "mask-6", fill: "white" }, + React.createElement("use", { xlinkHref: "#path-5" })), + React.createElement("g", { id: "Clip-20" }), + React.createElement("path", { d: "M11.196721,9.570198 C11.268684,9.098078 11.5622642,8.711058 11.9571654,8.515698 C12.1365358,8.426898 12.3370296,8.377318 12.5471901,8.377318 L21.1107827,8.377318 C22.1254247,8.377318 23.0713259,8.445768 23.9363136,8.590068 C24.1833506,8.630768 24.4239432,8.678128 24.6573753,8.731778 C24.8911654,8.785428 25.1177951,8.845368 25.3372642,8.911598 C25.4471778,8.944898 25.5549432,8.979678 25.6612765,9.015938 C26.0858938,9.161718 26.4811531,9.333398 26.8452642,9.532828 C27.2738198,6.706768 26.842042,4.783878 25.363042,3.042288 C23.7351037,1.124948 20.7932148,0.303548 17.0296593,0.303548 L6.10489383,0.303548 C5.33549877,0.303548 4.6806716,0.881858 4.56073333,1.667368 L0.0116716049,31.479008 C-0.0781925926,32.067308 0.361819753,32.599368 0.937881481,32.599368 L7.68270864,32.599368 L9.37688148,21.496778 L11.196721,9.570198 Z", id: "Fill-19", fill: "#003087", mask: "url(#mask-6)" })))))))), containerEl.createDiv({ cls: "chartsview-donation" })); + } + } +} + +var ChartTemplateType; +(function (ChartTemplateType) { + ChartTemplateType["Bar"] = "YGBgY2hhcnRzdmlldwojLS0tLS0tLS0tLS0tLS0tLS0jCiMtIGNoYXJ0IHR5cGUgICAgLSMKIy0tLS0tLS0tLS0tLS0tLS0tIwp0eXBlOiBCYXIKCiMtLS0tLS0tLS0tLS0tLS0tLSMKIy0gY2hhcnQgZGF0YSAgICAtIwojLS0tLS0tLS0tLS0tLS0tLS0jCmRhdGE6CiAgLSBhY3Rpb246ICJCcm93c2UgdGhlIHdlYnNpdGUiCiAgICBwdjogNTAwMDAKICAtIGFjdGlvbjogIkFkZCB0byBjYXJ0IgogICAgcHY6IDM1MDAwCiAgLSBhY3Rpb246ICJHZW5lcmF0ZSBvcmRlcnMiCiAgICBwdjogMjUwMDAKICAtIGFjdGlvbjogIlBheSBvcmRlciIKICAgIHB2OiAxNTAwMAogIC0gYWN0aW9uOiAiU2VhbCB0aGUgZGVhbCIKICAgIHB2OiA4NTAwCgojLS0tLS0tLS0tLS0tLS0tLS0jCiMtIGNoYXJ0IG9wdGlvbnMgLSMKIy0tLS0tLS0tLS0tLS0tLS0tIwpvcHRpb25zOgogIHhGaWVsZDogInB2IgogIHlGaWVsZDogImFjdGlvbiIKICBjb252ZXJzaW9uVGFnOiB7fQpgYGA="; + ChartTemplateType["Pie"] = "YGBgY2hhcnRzdmlldwojLS0tLS0tLS0tLS0tLS0tLS0jCiMtIGNoYXJ0IHR5cGUgICAgLSMKIy0tLS0tLS0tLS0tLS0tLS0tIwp0eXBlOiBQaWUKCiMtLS0tLS0tLS0tLS0tLS0tLSMKIy0gY2hhcnQgZGF0YSAgICAtIwojLS0tLS0tLS0tLS0tLS0tLS0jCmRhdGE6CiAgLSB0eXBlOiAiV2FnZSBpbmNvbWUgcGVyIGNhcGl0YSAowqUpIgogICAgdmFsdWU6IDE3OTE3CiAgLSB0eXBlOiAiT3BlcmF0aW5nIG5ldCBpbmNvbWUgcGVyIGNhcGl0YSAowqUpIgogICAgdmFsdWU6IDUzMDcKICAtIHR5cGU6ICJQcm9wZXJ0eSBQZXIgQ2FwaXRhIE5ldCBJbmNvbWUgKMKlKSIKICAgIHZhbHVlOiAyNzkxCiAgLSB0eXBlOiAiVHJhbnNmZXIgb2YgbmV0IGluY29tZSBwZXIgY2FwaXRhICjCpSkiCiAgICB2YWx1ZTogNjE3MwoKIy0tLS0tLS0tLS0tLS0tLS0tIwojLSBjaGFydCBvcHRpb25zIC0jCiMtLS0tLS0tLS0tLS0tLS0tLSMKb3B0aW9uczoKICBhbmdsZUZpZWxkOiAidmFsdWUiCiAgY29sb3JGaWVsZDogInR5cGUiCiAgcmFkaXVzOiAwLjUKICBsYWJlbDoKCXR5cGU6ICJzcGlkZXIiCgljb250ZW50OiAie3BlcmNlbnRhZ2V9XG57bmFtZX0iCiAgbGVnZW5kOgoJbGF5b3V0OiAiaG9yaXpvbnRhbCIKCXBvc2l0aW9uOiAiYm90dG9tIgpgYGAK"; + ChartTemplateType["WordCloud"] = "YGBgY2hhcnRzdmlldwojLS0tLS0tLS0tLS0tLS0tLS0jCiMtIGNoYXJ0IHR5cGUgICAgLSMKIy0tLS0tLS0tLS0tLS0tLS0tIwp0eXBlOiBXb3JkQ2xvdWQKCiMtLS0tLS0tLS0tLS0tLS0tLSMKIy0gY2hhcnQgZGF0YSAgICAtIwojLS0tLS0tLS0tLS0tLS0tLS0jCmRhdGE6CiAgLSB4OiAiQ2hpbmEiCiAgICB2YWx1ZTogMjM4MzIyMDAwMAogICAgY2F0ZWdvcnk6ICJhc2lhIgogIC0geDogIkluZG9uZXNpYSIKICAgIHZhbHVlOiAyNjM1MTAwMDAKICAgIGNhdGVnb3J5OiAiYXNpYSIKICAtIHg6ICJQYWtpc3RhbiIKICAgIHZhbHVlOiAzOTY0NTkwMDAKICAgIGNhdGVnb3J5OiAiYXNpYSIKICAtIHg6ICJSdXNzaWEiCiAgICB2YWx1ZTogNTQ2ODA0MzcyCiAgICBjYXRlZ29yeTogImV1cm9wZSIKICAtIHg6ICJKYXBhbiIKICAgIHZhbHVlOiAxMjY3OTAwMDAKICAgIGNhdGVnb3J5OiAiYXNpYSIKICAtIHg6ICJWaWV0bmFtIgogICAgdmFsdWU6IDkyNzAwMDAwCiAgICBjYXRlZ29yeTogImFzaWEiCiAgLSB4OiAiR2VybWFueSIKICAgIHZhbHVlOiA4MjgwMDAwMAogICAgY2F0ZWdvcnk6ICJldXJvcGUiCiAgLSB4OiAiSXJhbiIKICAgIHZhbHVlOiA4MDEzNTQwMAogICAgY2F0ZWdvcnk6ICJhc2lhIgogIC0geDogIlRoYWlsYW5kIgogICAgdmFsdWU6IDY4Mjk4MDAwCiAgICBjYXRlZ29yeTogImFzaWEiCiAgLSB4OiAiRnJhbmNlIgogICAgdmFsdWU6IDY3MDEzMDAwCiAgICBjYXRlZ29yeTogImV1cm9wZSIKICAtIHg6ICJJdGFseSIKICAgIHZhbHVlOiA2MDU5OTkzNgogICAgY2F0ZWdvcnk6ICJldXJvcGUiCiAgLSB4OiAiU291dGggS29yZWEiCiAgICB2YWx1ZTogNTE0NDYyMDEKICAgIGNhdGVnb3J5OiAiYXNpYSIKICAtIHg6ICJLZW55YSIKICAgIHZhbHVlOiA0ODQ2NzAwMAogICAgY2F0ZWdvcnk6ICJhZnJpY2EiCiAgLSB4OiAiU3BhaW4iCiAgICB2YWx1ZTogNDY4MTIwMDAKICAgIGNhdGVnb3J5OiAiZXVyb3BlIgogIC0geDogIlN1ZGFuIgogICAgdmFsdWU6IDQyMTc2MDAwCiAgICBjYXRlZ29yeTogImFmcmljYSIKICAtIHg6ICJJcmFxIgogICAgdmFsdWU6IDQ3ODgzNTQzCiAgICBjYXRlZ29yeTogImFzaWEiCiAgLSB4OiAiTmVwYWwiCiAgICB2YWx1ZTogMjg4MjU3MDkKICAgIGNhdGVnb3J5OiAiYXNpYSIKICAtIHg6ICJOb3J0aCBLb3JlYSIKICAgIHZhbHVlOiAyNDIxMzUxMAogICAgY2F0ZWdvcnk6ICJhc2lhIgogIC0geDogIkNoaWxlIgogICAgdmFsdWU6IDI4MTkxOTAwCiAgICBjYXRlZ29yeTogImFtZXJpY2EiCgojLS0tLS0tLS0tLS0tLS0tLS0jCiMtIGNoYXJ0IG9wdGlvbnMgLSMKIy0tLS0tLS0tLS0tLS0tLS0tIwpvcHRpb25zOgogIHdvcmRGaWVsZDogIngiCiAgd2VpZ2h0RmllbGQ6ICJ2YWx1ZSIKICBjb2xvcjogIiMxMjJjNmEiCiAgd29yZFN0eWxlOgoJZm9udEZhbWlseTogIlZlcmRhbmEiCglmb250U2l6ZTogWzI0LCA4MF0KICBpbnRlcmFjdGlvbnM6Cgl0eXBlOiAiZWxlbWVudC1hY3RpdmUiCiAgc3R5bGU6CiAgICBiYWNrZ3JvdW5kQ29sb3I6ICJ3aGl0ZSIKICBzdGF0ZToKCWFjdGl2ZToKCSAgc3R5bGU6CgkgICAgbGluZVdpZHRoOiAzCmBgYA=="; + ChartTemplateType["WordCount"] = "YGBgY2hhcnRzdmlldwojLS0tLS0tLS0tLS0tLS0tLS0jCiMtIGNoYXJ0IHR5cGUgICAgLSMKIy0tLS0tLS0tLS0tLS0tLS0tIwp0eXBlOiBXb3JkQ2xvdWQKCiMtLS0tLS0tLS0tLS0tLS0tLSMKIy0gY2hhcnQgZGF0YSAgICAtIwojLS0tLS0tLS0tLS0tLS0tLS0jCmRhdGE6ICJ3b3JkY291bnQ6bm90ZS1uYW1lLWhlcmUtd2l0aG91dC1mb2xkLXBhdGgiCgojLS0tLS0tLS0tLS0tLS0tLS0jCiMtIGNoYXJ0IG9wdGlvbnMgLSMKIy0tLS0tLS0tLS0tLS0tLS0tIwpvcHRpb25zOgogIHdvcmRGaWVsZDogIndvcmQiCiAgd2VpZ2h0RmllbGQ6ICJjb3VudCIKICBjb2xvckZpZWxkOiAiY291bnQiCiAgd29yZFN0eWxlOgogICAgcm90YXRpb246IDMwCmBgYA=="; + ChartTemplateType["Treemap"] = "YGBgY2hhcnRzdmlldwojLS0tLS0tLS0tLS0tLS0tLS0jCiMtIGNoYXJ0IHR5cGUgICAgLSMKIy0tLS0tLS0tLS0tLS0tLS0tIwp0eXBlOiBUcmVlbWFwCgojLS0tLS0tLS0tLS0tLS0tLS0jCiMtIGNoYXJ0IGRhdGEgICAgLSMKIy0tLS0tLS0tLS0tLS0tLS0tIwpkYXRhOgogIG5hbWU6ICdyb290JwogIGNoaWxkcmVuOgogICAgLSBuYW1lOiAnRm9sZGVyIDEnCiAgICAgIHZhbHVlOiA1NjAKICAgIC0gbmFtZTogJ0ZvbGRlciAyJwogICAgICB2YWx1ZTogNTAwCiAgICAtIG5hbWU6ICdGb2xkZXIgMycKICAgICAgdmFsdWU6IDE1MAogICAgLSBuYW1lOiAnRm9sZGVyIDQnCiAgICAgIHZhbHVlOiAxNDAKICAgIC0gbmFtZTogJ0ZvbGRlciA1JwogICAgICB2YWx1ZTogMTE1CiAgICAtIG5hbWU6ICdGb2xkZXIgNicKICAgICAgdmFsdWU6IDk1CiAgICAtIG5hbWU6ICdGb2xkZXIgNycKICAgICAgdmFsdWU6IDkwCiAgICAtIG5hbWU6ICdGb2xkZXIgOCcKICAgICAgdmFsdWU6IDc1CiAgICAtIG5hbWU6ICdGb2xkZXIgOScKICAgICAgdmFsdWU6IDk4CiAgICAtIG5hbWU6ICdGb2xkZXIgMTAnCiAgICAgIHZhbHVlOiA2MAogICAgLSBuYW1lOiAnRm9sZGVyIDExJwogICAgICB2YWx1ZTogNDUKICAgIC0gbmFtZTogJ0ZvbGRlciAxMicKICAgICAgdmFsdWU6IDQwCiAgICAtIG5hbWU6ICdGb2xkZXIgMTMnCiAgICAgIHZhbHVlOiA0MAogICAgLSBuYW1lOiAnRm9sZGVyIDE0JwogICAgICB2YWx1ZTogMzUKICAgIC0gbmFtZTogJ0ZvbGRlciAxNScKICAgICAgdmFsdWU6IDQwCiAgICAtIG5hbWU6ICdGb2xkZXIgMTYnCiAgICAgIHZhbHVlOiA0MAogICAgLSBuYW1lOiAnRm9sZGVyIDE3JwogICAgICB2YWx1ZTogNDAKICAgIC0gbmFtZTogJ0ZvbGRlciAxOCcKICAgICAgdmFsdWU6IDMwCiAgICAtIG5hbWU6ICdGb2xkZXIgMTknCiAgICAgIHZhbHVlOiAyOAogICAgLSBuYW1lOiAnRm9sZGVyIDIwJwogICAgICB2YWx1ZTogMTYKCiMtLS0tLS0tLS0tLS0tLS0tLSMKIy0gY2hhcnQgb3B0aW9ucyAtIwojLS0tLS0tLS0tLS0tLS0tLS0jCm9wdGlvbnM6CiAgY29sb3JGaWVsZDogIm5hbWUiCmBgYAo="; + ChartTemplateType["DualAxes"] = "YGBgY2hhcnRzdmlldwojLS0tLS0tLS0tLS0tLS0tLS0jCiMtIGNoYXJ0IHR5cGUgICAgLSMKIy0tLS0tLS0tLS0tLS0tLS0tIwp0eXBlOiBEdWFsQXhlcwoKIy0tLS0tLS0tLS0tLS0tLS0tIwojLSBjaGFydCBkYXRhICAgIC0jCiMtLS0tLS0tLS0tLS0tLS0tLSMKZGF0YToKICAtCiAgICAtIHRpbWU6ICIyMDE5LTAzIgogICAgICB2YWx1ZTogMzUwCiAgICAgIGNvdW50OiA4MDAKICAgIC0gdGltZTogIjIwMTktMDQiCiAgICAgIHZhbHVlOiA5MDAKICAgICAgY291bnQ6IDYwMAogICAgLSB0aW1lOiAiMjAxOS0wNSIKICAgICAgdmFsdWU6IDMwMAogICAgICBjb3VudDogNDAwCiAgICAtIHRpbWU6ICIyMDE5LTA2IgogICAgICB2YWx1ZTogNDUwCiAgICAgIGNvdW50OiAzODAKICAgIC0gdGltZTogIjIwMTktMDciCiAgICAgIHZhbHVlOiA0NzAKICAgICAgY291bnQ6IDIyCiAgLQogICAgLSB0aW1lOiAiMjAxOS0wMyIKICAgICAgdmFsdWU6IDM1MAogICAgICBjb3VudDogODAwCiAgICAtIHRpbWU6ICIyMDE5LTA0IgogICAgICB2YWx1ZTogOTAwCiAgICAgIGNvdW50OiA2MDAKICAgIC0gdGltZTogIjIwMTktMDUiCiAgICAgIHZhbHVlOiAzMDAKICAgICAgY291bnQ6IDQwMAogICAgLSB0aW1lOiAiMjAxOS0wNiIKICAgICAgdmFsdWU6IDQ1MAogICAgICBjb3VudDogMzgwCiAgICAtIHRpbWU6ICIyMDE5LTA3IgogICAgICB2YWx1ZTogNDcwCiAgICAgIGNvdW50OiAyMgoKIy0tLS0tLS0tLS0tLS0tLS0tIwojLSBjaGFydCBvcHRpb25zIC0jCiMtLS0tLS0tLS0tLS0tLS0tLSMKb3B0aW9uczoKICB4RmllbGQ6ICd0aW1lJwogIHlGaWVsZDogWyd2YWx1ZScsICdjb3VudCddCiAgeUF4aXM6CiAgICB2YWx1ZToKICAgICAgbWluOiAwCiAgICAgIGxhYmVsOgogICAgICAgIGZvcm1hdHRlcjoKICAgICAgICAgIGZ1bmN0aW9uIGZvcm1hdHRlcih2YWwpIHsKICAgICAgICAgICAgcmV0dXJuICcnLmNvbmNhdCh2YWwsICfkuKonKTsKICAgICAgICAgIH0KICBnZW9tZXRyeU9wdGlvbnM6CiAgICAtIGdlb21ldHJ5OiAnY29sdW1uJwogICAgLSBnZW9tZXRyeTogJ2xpbmUnCiAgICAgIGxpbmVTdHlsZToKCSAgICBsaW5lV2lkdGg6IDIKYGBgCg=="; + ChartTemplateType["Mix"] = "YGBgY2hhcnRzdmlldwojLS0tLS0tLS0tLS0tLS0tLS0jCiMtIGNoYXJ0IHR5cGUgICAgLSMKIy0tLS0tLS0tLS0tLS0tLS0tIwp0eXBlOiBNaXgKCiMtLS0tLS0tLS0tLS0tLS0tLSMKIy0gY2hhcnQgZGF0YSAgICAtIwojLS0tLS0tLS0tLS0tLS0tLS0jCmRhdGEuYXJlYToKICAtIHRpbWU6IDEyNDY0MDY0MDAwMDAKICAgIHRlbXBlcmF0dXJlOiBbMTQuMywgMjcuN10KICAtIHRpbWU6IDEyNDY0OTI4MDAwMDAKICAgIHRlbXBlcmF0dXJlOiBbMTQuNSwgMjcuOF0KICAtIHRpbWU6IDEyNDY1NzkyMDAwMDAKICAgIHRlbXBlcmF0dXJlOiBbMTUuNSwgMjkuNl0KICAtIHRpbWU6IDEyNDY2NjU2MDAwMDAKICAgIHRlbXBlcmF0dXJlOiBbMTYuNywgMzAuN10KICAtIHRpbWU6IDEyNDY3NTIwMDAwMDAKICAgIHRlbXBlcmF0dXJlOiBbMTYuNSwgMjUuMF0KICAtIHRpbWU6IDEyNDY4Mzg0MDAwMDAKICAgIHRlbXBlcmF0dXJlOiBbMTcuOCwgMjUuN10KCmRhdGEubGluZToKICAtIHRpbWU6IDEyNDY0MDY0MDAwMDAKICAgIHRlbXBlcmF0dXJlOiAyMS41CiAgLSB0aW1lOiAxMjQ2NDkyODAwMDAwCiAgICB0ZW1wZXJhdHVyZTogMjIuMQogIC0gdGltZTogMTI0NjU3OTIwMDAwMAogICAgdGVtcGVyYXR1cmU6IDIzCiAgLSB0aW1lOiAxMjQ2NjY1NjAwMDAwCiAgICB0ZW1wZXJhdHVyZTogMjMuOAogIC0gdGltZTogMTI0Njc1MjAwMDAwMAogICAgdGVtcGVyYXR1cmU6IDIxLjQKICAtIHRpbWU6IDEyNDY4Mzg0MDAwMDAKICAgIHRlbXBlcmF0dXJlOiAyMS4zCgojLS0tLS0tLS0tLS0tLS0tLS0jCiMtIGNoYXJ0IG9wdGlvbnMgLSMKIy0tLS0tLS0tLS0tLS0tLS0tIwpvcHRpb25zOgogIGFwcGVuZFBhZGRpbmc6IDgKICBzeW5jVmlld1BhZGRpbmc6IHRydWUKICB0b29sdGlwOgogICAgc2hhcmVkOiB0cnVlCiAgICBzaG93TWFya2VyczogZmFsc2UKICAgIHNob3dDcm9zc2hhaXJzOiB0cnVlCiAgICBvZmZzZXRZOiAtNTAKCm9wdGlvbnMuYXJlYToKICBheGVzOiB7fQogIG1ldGE6CiAgICB0aW1lOgogICAgICB0eXBlOiAndGltZScKICAgICAgbWFzazogJ01NLUREJwogICAgICBuaWNlOiB0cnVlCiAgICAgIHRpY2tJbnRlcnZhbDogMTcyODAwMDAwCiAgICAgIHJhbmdlOiBbMCwgMV0KICAgIHRlbXBlcmF0dXJlOgogICAgICBuaWNlOiB0cnVlCiAgICAgIHN5bmM6IHRydWUKICAgICAgYWxpYXM6ICfmuKnluqbojIPlm7QnCiAgZ2VvbWV0cmllczoKICAgIC0gdHlwZTogJ2FyZWEnCiAgICAgIHhGaWVsZDogJ3RpbWUnCiAgICAgIHlGaWVsZDogJ3RlbXBlcmF0dXJlJwogICAgICBtYXBwaW5nOiB7fQoKb3B0aW9ucy5saW5lOgogIGF4ZXM6IGZhbHNlCiAgbWV0YToKICAgIHRpbWU6CiAgICAgIHR5cGU6ICd0aW1lJwogICAgICBtYXNrOiAnTU0tREQnCiAgICAgIG5pY2U6IHRydWUKICAgICAgdGlja0ludGVydmFsOiAxNzI4MDAwMDAKICAgICAgcmFuZ2U6IFswLCAxXQogICAgdGVtcGVyYXR1cmU6CiAgICAgIHN5bmM6ICd0ZW1wZXJhdHVyZScKICAgICAgYWxpYXM6ICfmuKnluqYnCiAgZ2VvbWV0cmllczoKICAgIC0gdHlwZTogJ2xpbmUnCiAgICAgIHhGaWVsZDogJ3RpbWUnCiAgICAgIHlGaWVsZDogJ3RlbXBlcmF0dXJlJwogICAgICBtYXBwaW5nOiB7fQogICAgLSB0eXBlOiAncG9pbnQnCiAgICAgIHhGaWVsZDogJ3RpbWUnCiAgICAgIHlGaWVsZDogJ3RlbXBlcmF0dXJlJwogICAgICBtYXBwaW5nOgogICAgICAgIHNoYXBlOiAnY2lyY2xlJwogICAgICAgIHN0eWxlOgogICAgICAgICAgZmlsbE9wYWNpdHk6IDEKYGBg"; + ChartTemplateType["OrganizationTreeGraph"] = "YGBgY2hhcnRzdmlldwojLS0tLS0tLS0tLS0tLS0tLS0jCiMtIGNoYXJ0IHR5cGUgICAgLSMKIy0tLS0tLS0tLS0tLS0tLS0tIwp0eXBlOiBPcmdhbml6YXRpb25UcmVlR3JhcGgKCiMtLS0tLS0tLS0tLS0tLS0tLSMKIy0gY2hhcnQgZGF0YSAgICAtIwojLS0tLS0tLS0tLS0tLS0tLS0jCmRhdGE6CiAgaWQ6ICJyb290IgogIGxhYmVsOiAiUm9vdCIKICBjaGlsZHJlbjoKICAgIC0gaWQ6ICJjMSIKICAgICAgbGFiZWw6ICJDMSIKICAgICAgY2hpbGRyZW46CiAgICAgICAgLSBpZDogImMxLTEiCiAgICAgICAgICBsYWJlbDogIkMxLTEiCiAgICAgICAgICBjaGlsZHJlbjoKICAgICAgICAgICAgLSBpZDogImMxLTEtMSIKICAgICAgICAgICAgICBsYWJlbDogIkMxLTEtMSIKICAgICAgICAgICAgLSBpZDogImMxLTEtMiIKICAgICAgICAgICAgICBsYWJlbDogIkMxLTEtMiIKICAgICAgICAtIGlkOiAiYzEtMiIKICAgICAgICAgIGxhYmVsOiAiQzEtMiIKICAgICAgICAgIGNoaWxkcmVuOgogICAgICAgICAgICAtIGlkOiAiYzEtMi0xIgogICAgICAgICAgICAgIGxhYmVsOiAiQzEtMi0xIgogICAgICAgICAgICAtIGlkOiAiYzEtMi0yIgogICAgICAgICAgICAgIGxhYmVsOiAiQzEtMi0yIgogICAgLSBpZDogImMyIgogICAgICBsYWJlbDogIkMyIgogICAgICBjaGlsZHJlbjoKICAgICAgICAtIGlkOiAiYzItMSIKICAgICAgICAgIGxhYmVsOiAiQzItMSIKICAgICAgICAgIGNoaWxkcmVuOgogICAgICAgICAgICAtIGlkOiAiYzItMS0xIgogICAgICAgICAgICAgIGxhYmVsOiAiQzItMS0xIgoKIy0tLS0tLS0tLS0tLS0tLS0tIwojLSBjaGFydCBvcHRpb25zIC0jCiMtLS0tLS0tLS0tLS0tLS0tLSMKb3B0aW9uczoge30KYGBg"; + ChartTemplateType["Radar"] = "YGBgY2hhcnRzdmlldwojLS0tLS0tLS0tLS0tLS0tLS0jCiMtIGNoYXJ0IHR5cGUgICAgLSMKIy0tLS0tLS0tLS0tLS0tLS0tIwp0eXBlOiBSYWRhcgoKIy0tLS0tLS0tLS0tLS0tLS0tIwojLSBjaGFydCBkYXRhICAgIC0jCiMtLS0tLS0tLS0tLS0tLS0tLSMKZGF0YToKICAtIGl0ZW06ICJEZXNpZ24iCiAgICB1c2VyOiAiYSIKICAgIHNjb3JlOiA3MAogIC0gaXRlbTogIkRlc2lnbiIKICAgIHVzZXI6ICJiIgogICAgc2NvcmU6IDMwCiAgLSBpdGVtOiAiTWFya2V0aW5nIgogICAgdXNlcjogImEiCiAgICBzY29yZTogNTAKICAtIGl0ZW06ICJNYXJrZXRpbmciCiAgICB1c2VyOiAiYiIKICAgIHNjb3JlOiA2MAogIC0gaXRlbTogIlRlY2hub2xvZ3kiCiAgICB1c2VyOiAiYSIKICAgIHNjb3JlOiA1MAogIC0gaXRlbTogIlRlY2hub2xvZ3kiCiAgICB1c2VyOiAiYiIKICAgIHNjb3JlOiA0MAogIC0gaXRlbTogIlN1cHBvcnQiCiAgICB1c2VyOiAiYSIKICAgIHNjb3JlOiAzMAogIC0gaXRlbTogIlN1cHBvcnQiCiAgICB1c2VyOiAiYiIKICAgIHNjb3JlOiA0MAogIC0gaXRlbTogIlNhbGVzIgogICAgdXNlcjogImEiCiAgICBzY29yZTogNjAKICAtIGl0ZW06ICJTYWxlcyIKICAgIHVzZXI6ICJiIgogICAgc2NvcmU6IDQwCgojLS0tLS0tLS0tLS0tLS0tLS0jCiMtIGNoYXJ0IG9wdGlvbnMgLSMKIy0tLS0tLS0tLS0tLS0tLS0tIwpvcHRpb25zOgogIHhGaWVsZDogIml0ZW0iCiAgeUZpZWxkOiAic2NvcmUiCiAgc2VyaWVzRmllbGQ6ICJ1c2VyIgogIG1ldGE6CiAgICBzY29yZToKICAgICAgYWxpYXM6ICJTY29yZSIKICAgICAgbWluOiAwCiAgICAgIG5pY2U6IHRydWUKICB4QXhpczoKICAgIGxpbmU6IG51bGwKICAgIHRpY2tMaW5lOiBudWxsCiAgeUF4aXM6CiAgICBsYWJlbDogZmFsc2UKICAgIGdyaWQ6CiAgICAgIGFsdGVybmF0ZUNvbG9yOiAicmdiYSgwLCAwLCAwLCAwLjA0KSIKICBwb2ludDoge30KICBhcmVhOiB7fQpgYGA="; + ChartTemplateType["TinyLine"] = "YGBgY2hhcnRzdmlldwojLS0tLS0tLS0tLS0tLS0tLS0jCiMtIGNoYXJ0IHR5cGUgICAgLSMKIy0tLS0tLS0tLS0tLS0tLS0tIwp0eXBlOiBUaW55TGluZQoKIy0tLS0tLS0tLS0tLS0tLS0tIwojLSBjaGFydCBkYXRhICAgIC0jCiMtLS0tLS0tLS0tLS0tLS0tLSMKZGF0YTogWzI2NCwgNDE3LCA0MzgsIDg4NywgMzA5LCAzOTcsIDU1MCwgNTc1LCA1NjMsIDQzMCwgNTI1LCA1OTIsIDQ5MiwgNDY3LCA1MTMsIDU0NiwgOTgzLCAzNDAsIDUzOSwgMjQzLCAyMjYsIDE5Ml0KCiMtLS0tLS0tLS0tLS0tLS0tLSMKIy0gY2hhcnQgb3B0aW9ucyAtIwojLS0tLS0tLS0tLS0tLS0tLS0jCm9wdGlvbnM6CiAgaGVpZ2h0OiA2MAogIGF1dG9GaXQ6IGZhbHNlCiAgc21vb3RoOiB0cnVlCiAgdG9vbHRpcDogZmFsc2UKICBhbm5vdGF0aW9uczoKICAgIC0gdHlwZTogImxpbmUiCiAgICAgIHN0YXJ0OiBbIm1pbiIsICJtZWFuIl0KICAgICAgZW5kOiBbIm1heCIsICJtZWFuIl0KICAgICAgc3R5bGU6CiAgICAgICAgc3Ryb2tlOiAicmdiYSgwLCAwLCAwLCAwLjQ1KSIKICAgICAgdGV4dDoKICAgICAgICBjb250ZW50OiAiQXZlcmFnZSIKICAgICAgICBvZmZzZXRZOiAtMgogICAgICAgIHN0eWxlOgogICAgICAgICAgdGV4dEFsaWduOiAibGVmdCIKICAgICAgICAgIGZvbnRTaXplOiAxMAogICAgICAgICAgZmlsbDogInJnYmEoNDQsIDUzLCA2NiwgMC40NSkiCiAgICAgICAgICB0ZXh0QmFzZWxpbmU6ICJib3R0b20iCiAgICAtIHR5cGU6ICJsaW5lIgogICAgICBzdGFydDogWyJtaW4iLCA4MDBdCiAgICAgIGVuZDogWyJtYXgiLCA4MDBdCiAgICAgIHN0eWxlOgogICAgICAgIHN0cm9rZTogInJnYmEoMjAwLCAwLCAwLCAwLjU1KSIKICAgICAgdGV4dDoKICAgICAgICBjb250ZW50OiAiVGFyZ2V0IgogICAgICAgIG9mZnNldFk6IC0yCiAgICAgICAgc3R5bGU6CiAgICAgICAgICB0ZXh0QWxpZ246ICJsZWZ0IgogICAgICAgICAgZm9udFNpemU6IDEwCiAgICAgICAgICBmaWxsOiAicmdiYSg0NCwgNTMsIDY2LCAwLjQ1KSIKICAgICAgICAgIHRleHRCYXNlbGluZTogImJvdHRvbSIKYGBg"; +})(ChartTemplateType || (ChartTemplateType = {})); + +var buffer = {}; + +var base64Js = {}; + +base64Js.byteLength = byteLength; +base64Js.toByteArray = toByteArray; +base64Js.fromByteArray = fromByteArray; + +var lookup = []; +var revLookup = []; +var Arr = typeof Uint8Array !== 'undefined' ? Uint8Array : Array; + +var code = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/'; +for (var i = 0, len = code.length; i < len; ++i) { + lookup[i] = code[i]; + revLookup[code.charCodeAt(i)] = i; +} + +// Support decoding URL-safe base64 strings, as Node.js does. +// See: https://en.wikipedia.org/wiki/Base64#URL_applications +revLookup['-'.charCodeAt(0)] = 62; +revLookup['_'.charCodeAt(0)] = 63; + +function getLens (b64) { + var len = b64.length; + + if (len % 4 > 0) { + throw new Error('Invalid string. Length must be a multiple of 4') + } + + // Trim off extra bytes after placeholder bytes are found + // See: https://github.com/beatgammit/base64-js/issues/42 + var validLen = b64.indexOf('='); + if (validLen === -1) validLen = len; + + var placeHoldersLen = validLen === len + ? 0 + : 4 - (validLen % 4); + + return [validLen, placeHoldersLen] +} + +// base64 is 4/3 + up to two characters of the original data +function byteLength (b64) { + var lens = getLens(b64); + var validLen = lens[0]; + var placeHoldersLen = lens[1]; + return ((validLen + placeHoldersLen) * 3 / 4) - placeHoldersLen +} + +function _byteLength (b64, validLen, placeHoldersLen) { + return ((validLen + placeHoldersLen) * 3 / 4) - placeHoldersLen +} + +function toByteArray (b64) { + var tmp; + var lens = getLens(b64); + var validLen = lens[0]; + var placeHoldersLen = lens[1]; + + var arr = new Arr(_byteLength(b64, validLen, placeHoldersLen)); + + var curByte = 0; + + // if there are placeholders, only get up to the last complete 4 chars + var len = placeHoldersLen > 0 + ? validLen - 4 + : validLen; + + var i; + for (i = 0; i < len; i += 4) { + tmp = + (revLookup[b64.charCodeAt(i)] << 18) | + (revLookup[b64.charCodeAt(i + 1)] << 12) | + (revLookup[b64.charCodeAt(i + 2)] << 6) | + revLookup[b64.charCodeAt(i + 3)]; + arr[curByte++] = (tmp >> 16) & 0xFF; + arr[curByte++] = (tmp >> 8) & 0xFF; + arr[curByte++] = tmp & 0xFF; + } + + if (placeHoldersLen === 2) { + tmp = + (revLookup[b64.charCodeAt(i)] << 2) | + (revLookup[b64.charCodeAt(i + 1)] >> 4); + arr[curByte++] = tmp & 0xFF; + } + + if (placeHoldersLen === 1) { + tmp = + (revLookup[b64.charCodeAt(i)] << 10) | + (revLookup[b64.charCodeAt(i + 1)] << 4) | + (revLookup[b64.charCodeAt(i + 2)] >> 2); + arr[curByte++] = (tmp >> 8) & 0xFF; + arr[curByte++] = tmp & 0xFF; + } + + return arr +} + +function tripletToBase64 (num) { + return lookup[num >> 18 & 0x3F] + + lookup[num >> 12 & 0x3F] + + lookup[num >> 6 & 0x3F] + + lookup[num & 0x3F] +} + +function encodeChunk (uint8, start, end) { + var tmp; + var output = []; + for (var i = start; i < end; i += 3) { + tmp = + ((uint8[i] << 16) & 0xFF0000) + + ((uint8[i + 1] << 8) & 0xFF00) + + (uint8[i + 2] & 0xFF); + output.push(tripletToBase64(tmp)); + } + return output.join('') +} + +function fromByteArray (uint8) { + var tmp; + var len = uint8.length; + var extraBytes = len % 3; // if we have 1 byte left, pad 2 bytes + var parts = []; + var maxChunkLength = 16383; // must be multiple of 3 + + // go through the array every three bytes, we'll deal with trailing stuff later + for (var i = 0, len2 = len - extraBytes; i < len2; i += maxChunkLength) { + parts.push(encodeChunk(uint8, i, (i + maxChunkLength) > len2 ? len2 : (i + maxChunkLength))); + } + + // pad the end with zeros, but make sure to not forget the extra bytes + if (extraBytes === 1) { + tmp = uint8[len - 1]; + parts.push( + lookup[tmp >> 2] + + lookup[(tmp << 4) & 0x3F] + + '==' + ); + } else if (extraBytes === 2) { + tmp = (uint8[len - 2] << 8) + uint8[len - 1]; + parts.push( + lookup[tmp >> 10] + + lookup[(tmp >> 4) & 0x3F] + + lookup[(tmp << 2) & 0x3F] + + '=' + ); + } + + return parts.join('') +} + +var ieee754 = {}; + +/*! ieee754. BSD-3-Clause License. Feross Aboukhadijeh */ + +ieee754.read = function (buffer, offset, isLE, mLen, nBytes) { + var e, m; + var eLen = (nBytes * 8) - mLen - 1; + var eMax = (1 << eLen) - 1; + var eBias = eMax >> 1; + var nBits = -7; + var i = isLE ? (nBytes - 1) : 0; + var d = isLE ? -1 : 1; + var s = buffer[offset + i]; + + i += d; + + e = s & ((1 << (-nBits)) - 1); + s >>= (-nBits); + nBits += eLen; + for (; nBits > 0; e = (e * 256) + buffer[offset + i], i += d, nBits -= 8) {} + + m = e & ((1 << (-nBits)) - 1); + e >>= (-nBits); + nBits += mLen; + for (; nBits > 0; m = (m * 256) + buffer[offset + i], i += d, nBits -= 8) {} + + if (e === 0) { + e = 1 - eBias; + } else if (e === eMax) { + return m ? NaN : ((s ? -1 : 1) * Infinity) + } else { + m = m + Math.pow(2, mLen); + e = e - eBias; + } + return (s ? -1 : 1) * m * Math.pow(2, e - mLen) +}; + +ieee754.write = function (buffer, value, offset, isLE, mLen, nBytes) { + var e, m, c; + var eLen = (nBytes * 8) - mLen - 1; + var eMax = (1 << eLen) - 1; + var eBias = eMax >> 1; + var rt = (mLen === 23 ? Math.pow(2, -24) - Math.pow(2, -77) : 0); + var i = isLE ? 0 : (nBytes - 1); + var d = isLE ? 1 : -1; + var s = value < 0 || (value === 0 && 1 / value < 0) ? 1 : 0; + + value = Math.abs(value); + + if (isNaN(value) || value === Infinity) { + m = isNaN(value) ? 1 : 0; + e = eMax; + } else { + e = Math.floor(Math.log(value) / Math.LN2); + if (value * (c = Math.pow(2, -e)) < 1) { + e--; + c *= 2; + } + if (e + eBias >= 1) { + value += rt / c; + } else { + value += rt * Math.pow(2, 1 - eBias); + } + if (value * c >= 2) { + e++; + c /= 2; + } + + if (e + eBias >= eMax) { + m = 0; + e = eMax; + } else if (e + eBias >= 1) { + m = ((value * c) - 1) * Math.pow(2, mLen); + e = e + eBias; + } else { + m = value * Math.pow(2, eBias - 1) * Math.pow(2, mLen); + e = 0; + } + } + + for (; mLen >= 8; buffer[offset + i] = m & 0xff, i += d, m /= 256, mLen -= 8) {} + + e = (e << mLen) | m; + eLen += mLen; + for (; eLen > 0; buffer[offset + i] = e & 0xff, i += d, e /= 256, eLen -= 8) {} + + buffer[offset + i - d] |= s * 128; +}; + +/*! + * The buffer module from node.js, for the browser. + * + * @author Feross Aboukhadijeh + * @license MIT + */ + +(function (exports) { + +const base64 = base64Js; +const ieee754$1 = ieee754; +const customInspectSymbol = + (typeof Symbol === 'function' && typeof Symbol['for'] === 'function') // eslint-disable-line dot-notation + ? Symbol['for']('nodejs.util.inspect.custom') // eslint-disable-line dot-notation + : null; + +exports.Buffer = Buffer; +exports.SlowBuffer = SlowBuffer; +exports.INSPECT_MAX_BYTES = 50; + +const K_MAX_LENGTH = 0x7fffffff; +exports.kMaxLength = K_MAX_LENGTH; + +/** + * If `Buffer.TYPED_ARRAY_SUPPORT`: + * === true Use Uint8Array implementation (fastest) + * === false Print warning and recommend using `buffer` v4.x which has an Object + * implementation (most compatible, even IE6) + * + * Browsers that support typed arrays are IE 10+, Firefox 4+, Chrome 7+, Safari 5.1+, + * Opera 11.6+, iOS 4.2+. + * + * We report that the browser does not support typed arrays if the are not subclassable + * using __proto__. Firefox 4-29 lacks support for adding new properties to `Uint8Array` + * (See: https://bugzilla.mozilla.org/show_bug.cgi?id=695438). IE 10 lacks support + * for __proto__ and has a buggy typed array implementation. + */ +Buffer.TYPED_ARRAY_SUPPORT = typedArraySupport(); + +if (!Buffer.TYPED_ARRAY_SUPPORT && typeof console !== 'undefined' && + typeof console.error === 'function') { + console.error( + 'This browser lacks typed array (Uint8Array) support which is required by ' + + '`buffer` v5.x. Use `buffer` v4.x if you require old browser support.' + ); +} + +function typedArraySupport () { + // Can typed array instances can be augmented? + try { + const arr = new Uint8Array(1); + const proto = { foo: function () { return 42 } }; + Object.setPrototypeOf(proto, Uint8Array.prototype); + Object.setPrototypeOf(arr, proto); + return arr.foo() === 42 + } catch (e) { + return false + } +} + +Object.defineProperty(Buffer.prototype, 'parent', { + enumerable: true, + get: function () { + if (!Buffer.isBuffer(this)) return undefined + return this.buffer + } +}); + +Object.defineProperty(Buffer.prototype, 'offset', { + enumerable: true, + get: function () { + if (!Buffer.isBuffer(this)) return undefined + return this.byteOffset + } +}); + +function createBuffer (length) { + if (length > K_MAX_LENGTH) { + throw new RangeError('The value "' + length + '" is invalid for option "size"') + } + // Return an augmented `Uint8Array` instance + const buf = new Uint8Array(length); + Object.setPrototypeOf(buf, Buffer.prototype); + return buf +} + +/** + * The Buffer constructor returns instances of `Uint8Array` that have their + * prototype changed to `Buffer.prototype`. Furthermore, `Buffer` is a subclass of + * `Uint8Array`, so the returned instances will have all the node `Buffer` methods + * and the `Uint8Array` methods. Square bracket notation works as expected -- it + * returns a single octet. + * + * The `Uint8Array` prototype remains unmodified. + */ + +function Buffer (arg, encodingOrOffset, length) { + // Common case. + if (typeof arg === 'number') { + if (typeof encodingOrOffset === 'string') { + throw new TypeError( + 'The "string" argument must be of type string. Received type number' + ) + } + return allocUnsafe(arg) + } + return from(arg, encodingOrOffset, length) +} + +Buffer.poolSize = 8192; // not used by this implementation + +function from (value, encodingOrOffset, length) { + if (typeof value === 'string') { + return fromString(value, encodingOrOffset) + } + + if (ArrayBuffer.isView(value)) { + return fromArrayView(value) + } + + if (value == null) { + throw new TypeError( + 'The first argument must be one of type string, Buffer, ArrayBuffer, Array, ' + + 'or Array-like Object. Received type ' + (typeof value) + ) + } + + if (isInstance(value, ArrayBuffer) || + (value && isInstance(value.buffer, ArrayBuffer))) { + return fromArrayBuffer(value, encodingOrOffset, length) + } + + if (typeof SharedArrayBuffer !== 'undefined' && + (isInstance(value, SharedArrayBuffer) || + (value && isInstance(value.buffer, SharedArrayBuffer)))) { + return fromArrayBuffer(value, encodingOrOffset, length) + } + + if (typeof value === 'number') { + throw new TypeError( + 'The "value" argument must not be of type number. Received type number' + ) + } + + const valueOf = value.valueOf && value.valueOf(); + if (valueOf != null && valueOf !== value) { + return Buffer.from(valueOf, encodingOrOffset, length) + } + + const b = fromObject(value); + if (b) return b + + if (typeof Symbol !== 'undefined' && Symbol.toPrimitive != null && + typeof value[Symbol.toPrimitive] === 'function') { + return Buffer.from(value[Symbol.toPrimitive]('string'), encodingOrOffset, length) + } + + throw new TypeError( + 'The first argument must be one of type string, Buffer, ArrayBuffer, Array, ' + + 'or Array-like Object. Received type ' + (typeof value) + ) +} + +/** + * Functionally equivalent to Buffer(arg, encoding) but throws a TypeError + * if value is a number. + * Buffer.from(str[, encoding]) + * Buffer.from(array) + * Buffer.from(buffer) + * Buffer.from(arrayBuffer[, byteOffset[, length]]) + **/ +Buffer.from = function (value, encodingOrOffset, length) { + return from(value, encodingOrOffset, length) +}; + +// Note: Change prototype *after* Buffer.from is defined to workaround Chrome bug: +// https://github.com/feross/buffer/pull/148 +Object.setPrototypeOf(Buffer.prototype, Uint8Array.prototype); +Object.setPrototypeOf(Buffer, Uint8Array); + +function assertSize (size) { + if (typeof size !== 'number') { + throw new TypeError('"size" argument must be of type number') + } else if (size < 0) { + throw new RangeError('The value "' + size + '" is invalid for option "size"') + } +} + +function alloc (size, fill, encoding) { + assertSize(size); + if (size <= 0) { + return createBuffer(size) + } + if (fill !== undefined) { + // Only pay attention to encoding if it's a string. This + // prevents accidentally sending in a number that would + // be interpreted as a start offset. + return typeof encoding === 'string' + ? createBuffer(size).fill(fill, encoding) + : createBuffer(size).fill(fill) + } + return createBuffer(size) +} + +/** + * Creates a new filled Buffer instance. + * alloc(size[, fill[, encoding]]) + **/ +Buffer.alloc = function (size, fill, encoding) { + return alloc(size, fill, encoding) +}; + +function allocUnsafe (size) { + assertSize(size); + return createBuffer(size < 0 ? 0 : checked(size) | 0) +} + +/** + * Equivalent to Buffer(num), by default creates a non-zero-filled Buffer instance. + * */ +Buffer.allocUnsafe = function (size) { + return allocUnsafe(size) +}; +/** + * Equivalent to SlowBuffer(num), by default creates a non-zero-filled Buffer instance. + */ +Buffer.allocUnsafeSlow = function (size) { + return allocUnsafe(size) +}; + +function fromString (string, encoding) { + if (typeof encoding !== 'string' || encoding === '') { + encoding = 'utf8'; + } + + if (!Buffer.isEncoding(encoding)) { + throw new TypeError('Unknown encoding: ' + encoding) + } + + const length = byteLength(string, encoding) | 0; + let buf = createBuffer(length); + + const actual = buf.write(string, encoding); + + if (actual !== length) { + // Writing a hex string, for example, that contains invalid characters will + // cause everything after the first invalid character to be ignored. (e.g. + // 'abxxcd' will be treated as 'ab') + buf = buf.slice(0, actual); + } + + return buf +} + +function fromArrayLike (array) { + const length = array.length < 0 ? 0 : checked(array.length) | 0; + const buf = createBuffer(length); + for (let i = 0; i < length; i += 1) { + buf[i] = array[i] & 255; + } + return buf +} + +function fromArrayView (arrayView) { + if (isInstance(arrayView, Uint8Array)) { + const copy = new Uint8Array(arrayView); + return fromArrayBuffer(copy.buffer, copy.byteOffset, copy.byteLength) + } + return fromArrayLike(arrayView) +} + +function fromArrayBuffer (array, byteOffset, length) { + if (byteOffset < 0 || array.byteLength < byteOffset) { + throw new RangeError('"offset" is outside of buffer bounds') + } + + if (array.byteLength < byteOffset + (length || 0)) { + throw new RangeError('"length" is outside of buffer bounds') + } + + let buf; + if (byteOffset === undefined && length === undefined) { + buf = new Uint8Array(array); + } else if (length === undefined) { + buf = new Uint8Array(array, byteOffset); + } else { + buf = new Uint8Array(array, byteOffset, length); + } + + // Return an augmented `Uint8Array` instance + Object.setPrototypeOf(buf, Buffer.prototype); + + return buf +} + +function fromObject (obj) { + if (Buffer.isBuffer(obj)) { + const len = checked(obj.length) | 0; + const buf = createBuffer(len); + + if (buf.length === 0) { + return buf + } + + obj.copy(buf, 0, 0, len); + return buf + } + + if (obj.length !== undefined) { + if (typeof obj.length !== 'number' || numberIsNaN(obj.length)) { + return createBuffer(0) + } + return fromArrayLike(obj) + } + + if (obj.type === 'Buffer' && Array.isArray(obj.data)) { + return fromArrayLike(obj.data) + } +} + +function checked (length) { + // Note: cannot use `length < K_MAX_LENGTH` here because that fails when + // length is NaN (which is otherwise coerced to zero.) + if (length >= K_MAX_LENGTH) { + throw new RangeError('Attempt to allocate Buffer larger than maximum ' + + 'size: 0x' + K_MAX_LENGTH.toString(16) + ' bytes') + } + return length | 0 +} + +function SlowBuffer (length) { + if (+length != length) { // eslint-disable-line eqeqeq + length = 0; + } + return Buffer.alloc(+length) +} + +Buffer.isBuffer = function isBuffer (b) { + return b != null && b._isBuffer === true && + b !== Buffer.prototype // so Buffer.isBuffer(Buffer.prototype) will be false +}; + +Buffer.compare = function compare (a, b) { + if (isInstance(a, Uint8Array)) a = Buffer.from(a, a.offset, a.byteLength); + if (isInstance(b, Uint8Array)) b = Buffer.from(b, b.offset, b.byteLength); + if (!Buffer.isBuffer(a) || !Buffer.isBuffer(b)) { + throw new TypeError( + 'The "buf1", "buf2" arguments must be one of type Buffer or Uint8Array' + ) + } + + if (a === b) return 0 + + let x = a.length; + let y = b.length; + + for (let i = 0, len = Math.min(x, y); i < len; ++i) { + if (a[i] !== b[i]) { + x = a[i]; + y = b[i]; + break + } + } + + if (x < y) return -1 + if (y < x) return 1 + return 0 +}; + +Buffer.isEncoding = function isEncoding (encoding) { + switch (String(encoding).toLowerCase()) { + case 'hex': + case 'utf8': + case 'utf-8': + case 'ascii': + case 'latin1': + case 'binary': + case 'base64': + case 'ucs2': + case 'ucs-2': + case 'utf16le': + case 'utf-16le': + return true + default: + return false + } +}; + +Buffer.concat = function concat (list, length) { + if (!Array.isArray(list)) { + throw new TypeError('"list" argument must be an Array of Buffers') + } + + if (list.length === 0) { + return Buffer.alloc(0) + } + + let i; + if (length === undefined) { + length = 0; + for (i = 0; i < list.length; ++i) { + length += list[i].length; + } + } + + const buffer = Buffer.allocUnsafe(length); + let pos = 0; + for (i = 0; i < list.length; ++i) { + let buf = list[i]; + if (isInstance(buf, Uint8Array)) { + if (pos + buf.length > buffer.length) { + if (!Buffer.isBuffer(buf)) buf = Buffer.from(buf); + buf.copy(buffer, pos); + } else { + Uint8Array.prototype.set.call( + buffer, + buf, + pos + ); + } + } else if (!Buffer.isBuffer(buf)) { + throw new TypeError('"list" argument must be an Array of Buffers') + } else { + buf.copy(buffer, pos); + } + pos += buf.length; + } + return buffer +}; + +function byteLength (string, encoding) { + if (Buffer.isBuffer(string)) { + return string.length + } + if (ArrayBuffer.isView(string) || isInstance(string, ArrayBuffer)) { + return string.byteLength + } + if (typeof string !== 'string') { + throw new TypeError( + 'The "string" argument must be one of type string, Buffer, or ArrayBuffer. ' + + 'Received type ' + typeof string + ) + } + + const len = string.length; + const mustMatch = (arguments.length > 2 && arguments[2] === true); + if (!mustMatch && len === 0) return 0 + + // Use a for loop to avoid recursion + let loweredCase = false; + for (;;) { + switch (encoding) { + case 'ascii': + case 'latin1': + case 'binary': + return len + case 'utf8': + case 'utf-8': + return utf8ToBytes(string).length + case 'ucs2': + case 'ucs-2': + case 'utf16le': + case 'utf-16le': + return len * 2 + case 'hex': + return len >>> 1 + case 'base64': + return base64ToBytes(string).length + default: + if (loweredCase) { + return mustMatch ? -1 : utf8ToBytes(string).length // assume utf8 + } + encoding = ('' + encoding).toLowerCase(); + loweredCase = true; + } + } +} +Buffer.byteLength = byteLength; + +function slowToString (encoding, start, end) { + let loweredCase = false; + + // No need to verify that "this.length <= MAX_UINT32" since it's a read-only + // property of a typed array. + + // This behaves neither like String nor Uint8Array in that we set start/end + // to their upper/lower bounds if the value passed is out of range. + // undefined is handled specially as per ECMA-262 6th Edition, + // Section 13.3.3.7 Runtime Semantics: KeyedBindingInitialization. + if (start === undefined || start < 0) { + start = 0; + } + // Return early if start > this.length. Done here to prevent potential uint32 + // coercion fail below. + if (start > this.length) { + return '' + } + + if (end === undefined || end > this.length) { + end = this.length; + } + + if (end <= 0) { + return '' + } + + // Force coercion to uint32. This will also coerce falsey/NaN values to 0. + end >>>= 0; + start >>>= 0; + + if (end <= start) { + return '' + } + + if (!encoding) encoding = 'utf8'; + + while (true) { + switch (encoding) { + case 'hex': + return hexSlice(this, start, end) + + case 'utf8': + case 'utf-8': + return utf8Slice(this, start, end) + + case 'ascii': + return asciiSlice(this, start, end) + + case 'latin1': + case 'binary': + return latin1Slice(this, start, end) + + case 'base64': + return base64Slice(this, start, end) + + case 'ucs2': + case 'ucs-2': + case 'utf16le': + case 'utf-16le': + return utf16leSlice(this, start, end) + + default: + if (loweredCase) throw new TypeError('Unknown encoding: ' + encoding) + encoding = (encoding + '').toLowerCase(); + loweredCase = true; + } + } +} + +// This property is used by `Buffer.isBuffer` (and the `is-buffer` npm package) +// to detect a Buffer instance. It's not possible to use `instanceof Buffer` +// reliably in a browserify context because there could be multiple different +// copies of the 'buffer' package in use. This method works even for Buffer +// instances that were created from another copy of the `buffer` package. +// See: https://github.com/feross/buffer/issues/154 +Buffer.prototype._isBuffer = true; + +function swap (b, n, m) { + const i = b[n]; + b[n] = b[m]; + b[m] = i; +} + +Buffer.prototype.swap16 = function swap16 () { + const len = this.length; + if (len % 2 !== 0) { + throw new RangeError('Buffer size must be a multiple of 16-bits') + } + for (let i = 0; i < len; i += 2) { + swap(this, i, i + 1); + } + return this +}; + +Buffer.prototype.swap32 = function swap32 () { + const len = this.length; + if (len % 4 !== 0) { + throw new RangeError('Buffer size must be a multiple of 32-bits') + } + for (let i = 0; i < len; i += 4) { + swap(this, i, i + 3); + swap(this, i + 1, i + 2); + } + return this +}; + +Buffer.prototype.swap64 = function swap64 () { + const len = this.length; + if (len % 8 !== 0) { + throw new RangeError('Buffer size must be a multiple of 64-bits') + } + for (let i = 0; i < len; i += 8) { + swap(this, i, i + 7); + swap(this, i + 1, i + 6); + swap(this, i + 2, i + 5); + swap(this, i + 3, i + 4); + } + return this +}; + +Buffer.prototype.toString = function toString () { + const length = this.length; + if (length === 0) return '' + if (arguments.length === 0) return utf8Slice(this, 0, length) + return slowToString.apply(this, arguments) +}; + +Buffer.prototype.toLocaleString = Buffer.prototype.toString; + +Buffer.prototype.equals = function equals (b) { + if (!Buffer.isBuffer(b)) throw new TypeError('Argument must be a Buffer') + if (this === b) return true + return Buffer.compare(this, b) === 0 +}; + +Buffer.prototype.inspect = function inspect () { + let str = ''; + const max = exports.INSPECT_MAX_BYTES; + str = this.toString('hex', 0, max).replace(/(.{2})/g, '$1 ').trim(); + if (this.length > max) str += ' ... '; + return '' +}; +if (customInspectSymbol) { + Buffer.prototype[customInspectSymbol] = Buffer.prototype.inspect; +} + +Buffer.prototype.compare = function compare (target, start, end, thisStart, thisEnd) { + if (isInstance(target, Uint8Array)) { + target = Buffer.from(target, target.offset, target.byteLength); + } + if (!Buffer.isBuffer(target)) { + throw new TypeError( + 'The "target" argument must be one of type Buffer or Uint8Array. ' + + 'Received type ' + (typeof target) + ) + } + + if (start === undefined) { + start = 0; + } + if (end === undefined) { + end = target ? target.length : 0; + } + if (thisStart === undefined) { + thisStart = 0; + } + if (thisEnd === undefined) { + thisEnd = this.length; + } + + if (start < 0 || end > target.length || thisStart < 0 || thisEnd > this.length) { + throw new RangeError('out of range index') + } + + if (thisStart >= thisEnd && start >= end) { + return 0 + } + if (thisStart >= thisEnd) { + return -1 + } + if (start >= end) { + return 1 + } + + start >>>= 0; + end >>>= 0; + thisStart >>>= 0; + thisEnd >>>= 0; + + if (this === target) return 0 + + let x = thisEnd - thisStart; + let y = end - start; + const len = Math.min(x, y); + + const thisCopy = this.slice(thisStart, thisEnd); + const targetCopy = target.slice(start, end); + + for (let i = 0; i < len; ++i) { + if (thisCopy[i] !== targetCopy[i]) { + x = thisCopy[i]; + y = targetCopy[i]; + break + } + } + + if (x < y) return -1 + if (y < x) return 1 + return 0 +}; + +// Finds either the first index of `val` in `buffer` at offset >= `byteOffset`, +// OR the last index of `val` in `buffer` at offset <= `byteOffset`. +// +// Arguments: +// - buffer - a Buffer to search +// - val - a string, Buffer, or number +// - byteOffset - an index into `buffer`; will be clamped to an int32 +// - encoding - an optional encoding, relevant is val is a string +// - dir - true for indexOf, false for lastIndexOf +function bidirectionalIndexOf (buffer, val, byteOffset, encoding, dir) { + // Empty buffer means no match + if (buffer.length === 0) return -1 + + // Normalize byteOffset + if (typeof byteOffset === 'string') { + encoding = byteOffset; + byteOffset = 0; + } else if (byteOffset > 0x7fffffff) { + byteOffset = 0x7fffffff; + } else if (byteOffset < -0x80000000) { + byteOffset = -0x80000000; + } + byteOffset = +byteOffset; // Coerce to Number. + if (numberIsNaN(byteOffset)) { + // byteOffset: it it's undefined, null, NaN, "foo", etc, search whole buffer + byteOffset = dir ? 0 : (buffer.length - 1); + } + + // Normalize byteOffset: negative offsets start from the end of the buffer + if (byteOffset < 0) byteOffset = buffer.length + byteOffset; + if (byteOffset >= buffer.length) { + if (dir) return -1 + else byteOffset = buffer.length - 1; + } else if (byteOffset < 0) { + if (dir) byteOffset = 0; + else return -1 + } + + // Normalize val + if (typeof val === 'string') { + val = Buffer.from(val, encoding); + } + + // Finally, search either indexOf (if dir is true) or lastIndexOf + if (Buffer.isBuffer(val)) { + // Special case: looking for empty string/buffer always fails + if (val.length === 0) { + return -1 + } + return arrayIndexOf(buffer, val, byteOffset, encoding, dir) + } else if (typeof val === 'number') { + val = val & 0xFF; // Search for a byte value [0-255] + if (typeof Uint8Array.prototype.indexOf === 'function') { + if (dir) { + return Uint8Array.prototype.indexOf.call(buffer, val, byteOffset) + } else { + return Uint8Array.prototype.lastIndexOf.call(buffer, val, byteOffset) + } + } + return arrayIndexOf(buffer, [val], byteOffset, encoding, dir) + } + + throw new TypeError('val must be string, number or Buffer') +} + +function arrayIndexOf (arr, val, byteOffset, encoding, dir) { + let indexSize = 1; + let arrLength = arr.length; + let valLength = val.length; + + if (encoding !== undefined) { + encoding = String(encoding).toLowerCase(); + if (encoding === 'ucs2' || encoding === 'ucs-2' || + encoding === 'utf16le' || encoding === 'utf-16le') { + if (arr.length < 2 || val.length < 2) { + return -1 + } + indexSize = 2; + arrLength /= 2; + valLength /= 2; + byteOffset /= 2; + } + } + + function read (buf, i) { + if (indexSize === 1) { + return buf[i] + } else { + return buf.readUInt16BE(i * indexSize) + } + } + + let i; + if (dir) { + let foundIndex = -1; + for (i = byteOffset; i < arrLength; i++) { + if (read(arr, i) === read(val, foundIndex === -1 ? 0 : i - foundIndex)) { + if (foundIndex === -1) foundIndex = i; + if (i - foundIndex + 1 === valLength) return foundIndex * indexSize + } else { + if (foundIndex !== -1) i -= i - foundIndex; + foundIndex = -1; + } + } + } else { + if (byteOffset + valLength > arrLength) byteOffset = arrLength - valLength; + for (i = byteOffset; i >= 0; i--) { + let found = true; + for (let j = 0; j < valLength; j++) { + if (read(arr, i + j) !== read(val, j)) { + found = false; + break + } + } + if (found) return i + } + } + + return -1 +} + +Buffer.prototype.includes = function includes (val, byteOffset, encoding) { + return this.indexOf(val, byteOffset, encoding) !== -1 +}; + +Buffer.prototype.indexOf = function indexOf (val, byteOffset, encoding) { + return bidirectionalIndexOf(this, val, byteOffset, encoding, true) +}; + +Buffer.prototype.lastIndexOf = function lastIndexOf (val, byteOffset, encoding) { + return bidirectionalIndexOf(this, val, byteOffset, encoding, false) +}; + +function hexWrite (buf, string, offset, length) { + offset = Number(offset) || 0; + const remaining = buf.length - offset; + if (!length) { + length = remaining; + } else { + length = Number(length); + if (length > remaining) { + length = remaining; + } + } + + const strLen = string.length; + + if (length > strLen / 2) { + length = strLen / 2; + } + let i; + for (i = 0; i < length; ++i) { + const parsed = parseInt(string.substr(i * 2, 2), 16); + if (numberIsNaN(parsed)) return i + buf[offset + i] = parsed; + } + return i +} + +function utf8Write (buf, string, offset, length) { + return blitBuffer(utf8ToBytes(string, buf.length - offset), buf, offset, length) +} + +function asciiWrite (buf, string, offset, length) { + return blitBuffer(asciiToBytes(string), buf, offset, length) +} + +function base64Write (buf, string, offset, length) { + return blitBuffer(base64ToBytes(string), buf, offset, length) +} + +function ucs2Write (buf, string, offset, length) { + return blitBuffer(utf16leToBytes(string, buf.length - offset), buf, offset, length) +} + +Buffer.prototype.write = function write (string, offset, length, encoding) { + // Buffer#write(string) + if (offset === undefined) { + encoding = 'utf8'; + length = this.length; + offset = 0; + // Buffer#write(string, encoding) + } else if (length === undefined && typeof offset === 'string') { + encoding = offset; + length = this.length; + offset = 0; + // Buffer#write(string, offset[, length][, encoding]) + } else if (isFinite(offset)) { + offset = offset >>> 0; + if (isFinite(length)) { + length = length >>> 0; + if (encoding === undefined) encoding = 'utf8'; + } else { + encoding = length; + length = undefined; + } + } else { + throw new Error( + 'Buffer.write(string, encoding, offset[, length]) is no longer supported' + ) + } + + const remaining = this.length - offset; + if (length === undefined || length > remaining) length = remaining; + + if ((string.length > 0 && (length < 0 || offset < 0)) || offset > this.length) { + throw new RangeError('Attempt to write outside buffer bounds') + } + + if (!encoding) encoding = 'utf8'; + + let loweredCase = false; + for (;;) { + switch (encoding) { + case 'hex': + return hexWrite(this, string, offset, length) + + case 'utf8': + case 'utf-8': + return utf8Write(this, string, offset, length) + + case 'ascii': + case 'latin1': + case 'binary': + return asciiWrite(this, string, offset, length) + + case 'base64': + // Warning: maxLength not taken into account in base64Write + return base64Write(this, string, offset, length) + + case 'ucs2': + case 'ucs-2': + case 'utf16le': + case 'utf-16le': + return ucs2Write(this, string, offset, length) + + default: + if (loweredCase) throw new TypeError('Unknown encoding: ' + encoding) + encoding = ('' + encoding).toLowerCase(); + loweredCase = true; + } + } +}; + +Buffer.prototype.toJSON = function toJSON () { + return { + type: 'Buffer', + data: Array.prototype.slice.call(this._arr || this, 0) + } +}; + +function base64Slice (buf, start, end) { + if (start === 0 && end === buf.length) { + return base64.fromByteArray(buf) + } else { + return base64.fromByteArray(buf.slice(start, end)) + } +} + +function utf8Slice (buf, start, end) { + end = Math.min(buf.length, end); + const res = []; + + let i = start; + while (i < end) { + const firstByte = buf[i]; + let codePoint = null; + let bytesPerSequence = (firstByte > 0xEF) + ? 4 + : (firstByte > 0xDF) + ? 3 + : (firstByte > 0xBF) + ? 2 + : 1; + + if (i + bytesPerSequence <= end) { + let secondByte, thirdByte, fourthByte, tempCodePoint; + + switch (bytesPerSequence) { + case 1: + if (firstByte < 0x80) { + codePoint = firstByte; + } + break + case 2: + secondByte = buf[i + 1]; + if ((secondByte & 0xC0) === 0x80) { + tempCodePoint = (firstByte & 0x1F) << 0x6 | (secondByte & 0x3F); + if (tempCodePoint > 0x7F) { + codePoint = tempCodePoint; + } + } + break + case 3: + secondByte = buf[i + 1]; + thirdByte = buf[i + 2]; + if ((secondByte & 0xC0) === 0x80 && (thirdByte & 0xC0) === 0x80) { + tempCodePoint = (firstByte & 0xF) << 0xC | (secondByte & 0x3F) << 0x6 | (thirdByte & 0x3F); + if (tempCodePoint > 0x7FF && (tempCodePoint < 0xD800 || tempCodePoint > 0xDFFF)) { + codePoint = tempCodePoint; + } + } + break + case 4: + secondByte = buf[i + 1]; + thirdByte = buf[i + 2]; + fourthByte = buf[i + 3]; + if ((secondByte & 0xC0) === 0x80 && (thirdByte & 0xC0) === 0x80 && (fourthByte & 0xC0) === 0x80) { + tempCodePoint = (firstByte & 0xF) << 0x12 | (secondByte & 0x3F) << 0xC | (thirdByte & 0x3F) << 0x6 | (fourthByte & 0x3F); + if (tempCodePoint > 0xFFFF && tempCodePoint < 0x110000) { + codePoint = tempCodePoint; + } + } + } + } + + if (codePoint === null) { + // we did not generate a valid codePoint so insert a + // replacement char (U+FFFD) and advance only 1 byte + codePoint = 0xFFFD; + bytesPerSequence = 1; + } else if (codePoint > 0xFFFF) { + // encode to utf16 (surrogate pair dance) + codePoint -= 0x10000; + res.push(codePoint >>> 10 & 0x3FF | 0xD800); + codePoint = 0xDC00 | codePoint & 0x3FF; + } + + res.push(codePoint); + i += bytesPerSequence; + } + + return decodeCodePointsArray(res) +} + +// Based on http://stackoverflow.com/a/22747272/680742, the browser with +// the lowest limit is Chrome, with 0x10000 args. +// We go 1 magnitude less, for safety +const MAX_ARGUMENTS_LENGTH = 0x1000; + +function decodeCodePointsArray (codePoints) { + const len = codePoints.length; + if (len <= MAX_ARGUMENTS_LENGTH) { + return String.fromCharCode.apply(String, codePoints) // avoid extra slice() + } + + // Decode in chunks to avoid "call stack size exceeded". + let res = ''; + let i = 0; + while (i < len) { + res += String.fromCharCode.apply( + String, + codePoints.slice(i, i += MAX_ARGUMENTS_LENGTH) + ); + } + return res +} + +function asciiSlice (buf, start, end) { + let ret = ''; + end = Math.min(buf.length, end); + + for (let i = start; i < end; ++i) { + ret += String.fromCharCode(buf[i] & 0x7F); + } + return ret +} + +function latin1Slice (buf, start, end) { + let ret = ''; + end = Math.min(buf.length, end); + + for (let i = start; i < end; ++i) { + ret += String.fromCharCode(buf[i]); + } + return ret +} + +function hexSlice (buf, start, end) { + const len = buf.length; + + if (!start || start < 0) start = 0; + if (!end || end < 0 || end > len) end = len; + + let out = ''; + for (let i = start; i < end; ++i) { + out += hexSliceLookupTable[buf[i]]; + } + return out +} + +function utf16leSlice (buf, start, end) { + const bytes = buf.slice(start, end); + let res = ''; + // If bytes.length is odd, the last 8 bits must be ignored (same as node.js) + for (let i = 0; i < bytes.length - 1; i += 2) { + res += String.fromCharCode(bytes[i] + (bytes[i + 1] * 256)); + } + return res +} + +Buffer.prototype.slice = function slice (start, end) { + const len = this.length; + start = ~~start; + end = end === undefined ? len : ~~end; + + if (start < 0) { + start += len; + if (start < 0) start = 0; + } else if (start > len) { + start = len; + } + + if (end < 0) { + end += len; + if (end < 0) end = 0; + } else if (end > len) { + end = len; + } + + if (end < start) end = start; + + const newBuf = this.subarray(start, end); + // Return an augmented `Uint8Array` instance + Object.setPrototypeOf(newBuf, Buffer.prototype); + + return newBuf +}; + +/* + * Need to make sure that buffer isn't trying to write out of bounds. + */ +function checkOffset (offset, ext, length) { + if ((offset % 1) !== 0 || offset < 0) throw new RangeError('offset is not uint') + if (offset + ext > length) throw new RangeError('Trying to access beyond buffer length') +} + +Buffer.prototype.readUintLE = +Buffer.prototype.readUIntLE = function readUIntLE (offset, byteLength, noAssert) { + offset = offset >>> 0; + byteLength = byteLength >>> 0; + if (!noAssert) checkOffset(offset, byteLength, this.length); + + let val = this[offset]; + let mul = 1; + let i = 0; + while (++i < byteLength && (mul *= 0x100)) { + val += this[offset + i] * mul; + } + + return val +}; + +Buffer.prototype.readUintBE = +Buffer.prototype.readUIntBE = function readUIntBE (offset, byteLength, noAssert) { + offset = offset >>> 0; + byteLength = byteLength >>> 0; + if (!noAssert) { + checkOffset(offset, byteLength, this.length); + } + + let val = this[offset + --byteLength]; + let mul = 1; + while (byteLength > 0 && (mul *= 0x100)) { + val += this[offset + --byteLength] * mul; + } + + return val +}; + +Buffer.prototype.readUint8 = +Buffer.prototype.readUInt8 = function readUInt8 (offset, noAssert) { + offset = offset >>> 0; + if (!noAssert) checkOffset(offset, 1, this.length); + return this[offset] +}; + +Buffer.prototype.readUint16LE = +Buffer.prototype.readUInt16LE = function readUInt16LE (offset, noAssert) { + offset = offset >>> 0; + if (!noAssert) checkOffset(offset, 2, this.length); + return this[offset] | (this[offset + 1] << 8) +}; + +Buffer.prototype.readUint16BE = +Buffer.prototype.readUInt16BE = function readUInt16BE (offset, noAssert) { + offset = offset >>> 0; + if (!noAssert) checkOffset(offset, 2, this.length); + return (this[offset] << 8) | this[offset + 1] +}; + +Buffer.prototype.readUint32LE = +Buffer.prototype.readUInt32LE = function readUInt32LE (offset, noAssert) { + offset = offset >>> 0; + if (!noAssert) checkOffset(offset, 4, this.length); + + return ((this[offset]) | + (this[offset + 1] << 8) | + (this[offset + 2] << 16)) + + (this[offset + 3] * 0x1000000) +}; + +Buffer.prototype.readUint32BE = +Buffer.prototype.readUInt32BE = function readUInt32BE (offset, noAssert) { + offset = offset >>> 0; + if (!noAssert) checkOffset(offset, 4, this.length); + + return (this[offset] * 0x1000000) + + ((this[offset + 1] << 16) | + (this[offset + 2] << 8) | + this[offset + 3]) +}; + +Buffer.prototype.readBigUInt64LE = defineBigIntMethod(function readBigUInt64LE (offset) { + offset = offset >>> 0; + validateNumber(offset, 'offset'); + const first = this[offset]; + const last = this[offset + 7]; + if (first === undefined || last === undefined) { + boundsError(offset, this.length - 8); + } + + const lo = first + + this[++offset] * 2 ** 8 + + this[++offset] * 2 ** 16 + + this[++offset] * 2 ** 24; + + const hi = this[++offset] + + this[++offset] * 2 ** 8 + + this[++offset] * 2 ** 16 + + last * 2 ** 24; + + return BigInt(lo) + (BigInt(hi) << BigInt(32)) +}); + +Buffer.prototype.readBigUInt64BE = defineBigIntMethod(function readBigUInt64BE (offset) { + offset = offset >>> 0; + validateNumber(offset, 'offset'); + const first = this[offset]; + const last = this[offset + 7]; + if (first === undefined || last === undefined) { + boundsError(offset, this.length - 8); + } + + const hi = first * 2 ** 24 + + this[++offset] * 2 ** 16 + + this[++offset] * 2 ** 8 + + this[++offset]; + + const lo = this[++offset] * 2 ** 24 + + this[++offset] * 2 ** 16 + + this[++offset] * 2 ** 8 + + last; + + return (BigInt(hi) << BigInt(32)) + BigInt(lo) +}); + +Buffer.prototype.readIntLE = function readIntLE (offset, byteLength, noAssert) { + offset = offset >>> 0; + byteLength = byteLength >>> 0; + if (!noAssert) checkOffset(offset, byteLength, this.length); + + let val = this[offset]; + let mul = 1; + let i = 0; + while (++i < byteLength && (mul *= 0x100)) { + val += this[offset + i] * mul; + } + mul *= 0x80; + + if (val >= mul) val -= Math.pow(2, 8 * byteLength); + + return val +}; + +Buffer.prototype.readIntBE = function readIntBE (offset, byteLength, noAssert) { + offset = offset >>> 0; + byteLength = byteLength >>> 0; + if (!noAssert) checkOffset(offset, byteLength, this.length); + + let i = byteLength; + let mul = 1; + let val = this[offset + --i]; + while (i > 0 && (mul *= 0x100)) { + val += this[offset + --i] * mul; + } + mul *= 0x80; + + if (val >= mul) val -= Math.pow(2, 8 * byteLength); + + return val +}; + +Buffer.prototype.readInt8 = function readInt8 (offset, noAssert) { + offset = offset >>> 0; + if (!noAssert) checkOffset(offset, 1, this.length); + if (!(this[offset] & 0x80)) return (this[offset]) + return ((0xff - this[offset] + 1) * -1) +}; + +Buffer.prototype.readInt16LE = function readInt16LE (offset, noAssert) { + offset = offset >>> 0; + if (!noAssert) checkOffset(offset, 2, this.length); + const val = this[offset] | (this[offset + 1] << 8); + return (val & 0x8000) ? val | 0xFFFF0000 : val +}; + +Buffer.prototype.readInt16BE = function readInt16BE (offset, noAssert) { + offset = offset >>> 0; + if (!noAssert) checkOffset(offset, 2, this.length); + const val = this[offset + 1] | (this[offset] << 8); + return (val & 0x8000) ? val | 0xFFFF0000 : val +}; + +Buffer.prototype.readInt32LE = function readInt32LE (offset, noAssert) { + offset = offset >>> 0; + if (!noAssert) checkOffset(offset, 4, this.length); + + return (this[offset]) | + (this[offset + 1] << 8) | + (this[offset + 2] << 16) | + (this[offset + 3] << 24) +}; + +Buffer.prototype.readInt32BE = function readInt32BE (offset, noAssert) { + offset = offset >>> 0; + if (!noAssert) checkOffset(offset, 4, this.length); + + return (this[offset] << 24) | + (this[offset + 1] << 16) | + (this[offset + 2] << 8) | + (this[offset + 3]) +}; + +Buffer.prototype.readBigInt64LE = defineBigIntMethod(function readBigInt64LE (offset) { + offset = offset >>> 0; + validateNumber(offset, 'offset'); + const first = this[offset]; + const last = this[offset + 7]; + if (first === undefined || last === undefined) { + boundsError(offset, this.length - 8); + } + + const val = this[offset + 4] + + this[offset + 5] * 2 ** 8 + + this[offset + 6] * 2 ** 16 + + (last << 24); // Overflow + + return (BigInt(val) << BigInt(32)) + + BigInt(first + + this[++offset] * 2 ** 8 + + this[++offset] * 2 ** 16 + + this[++offset] * 2 ** 24) +}); + +Buffer.prototype.readBigInt64BE = defineBigIntMethod(function readBigInt64BE (offset) { + offset = offset >>> 0; + validateNumber(offset, 'offset'); + const first = this[offset]; + const last = this[offset + 7]; + if (first === undefined || last === undefined) { + boundsError(offset, this.length - 8); + } + + const val = (first << 24) + // Overflow + this[++offset] * 2 ** 16 + + this[++offset] * 2 ** 8 + + this[++offset]; + + return (BigInt(val) << BigInt(32)) + + BigInt(this[++offset] * 2 ** 24 + + this[++offset] * 2 ** 16 + + this[++offset] * 2 ** 8 + + last) +}); + +Buffer.prototype.readFloatLE = function readFloatLE (offset, noAssert) { + offset = offset >>> 0; + if (!noAssert) checkOffset(offset, 4, this.length); + return ieee754$1.read(this, offset, true, 23, 4) +}; + +Buffer.prototype.readFloatBE = function readFloatBE (offset, noAssert) { + offset = offset >>> 0; + if (!noAssert) checkOffset(offset, 4, this.length); + return ieee754$1.read(this, offset, false, 23, 4) +}; + +Buffer.prototype.readDoubleLE = function readDoubleLE (offset, noAssert) { + offset = offset >>> 0; + if (!noAssert) checkOffset(offset, 8, this.length); + return ieee754$1.read(this, offset, true, 52, 8) +}; + +Buffer.prototype.readDoubleBE = function readDoubleBE (offset, noAssert) { + offset = offset >>> 0; + if (!noAssert) checkOffset(offset, 8, this.length); + return ieee754$1.read(this, offset, false, 52, 8) +}; + +function checkInt (buf, value, offset, ext, max, min) { + if (!Buffer.isBuffer(buf)) throw new TypeError('"buffer" argument must be a Buffer instance') + if (value > max || value < min) throw new RangeError('"value" argument is out of bounds') + if (offset + ext > buf.length) throw new RangeError('Index out of range') +} + +Buffer.prototype.writeUintLE = +Buffer.prototype.writeUIntLE = function writeUIntLE (value, offset, byteLength, noAssert) { + value = +value; + offset = offset >>> 0; + byteLength = byteLength >>> 0; + if (!noAssert) { + const maxBytes = Math.pow(2, 8 * byteLength) - 1; + checkInt(this, value, offset, byteLength, maxBytes, 0); + } + + let mul = 1; + let i = 0; + this[offset] = value & 0xFF; + while (++i < byteLength && (mul *= 0x100)) { + this[offset + i] = (value / mul) & 0xFF; + } + + return offset + byteLength +}; + +Buffer.prototype.writeUintBE = +Buffer.prototype.writeUIntBE = function writeUIntBE (value, offset, byteLength, noAssert) { + value = +value; + offset = offset >>> 0; + byteLength = byteLength >>> 0; + if (!noAssert) { + const maxBytes = Math.pow(2, 8 * byteLength) - 1; + checkInt(this, value, offset, byteLength, maxBytes, 0); + } + + let i = byteLength - 1; + let mul = 1; + this[offset + i] = value & 0xFF; + while (--i >= 0 && (mul *= 0x100)) { + this[offset + i] = (value / mul) & 0xFF; + } + + return offset + byteLength +}; + +Buffer.prototype.writeUint8 = +Buffer.prototype.writeUInt8 = function writeUInt8 (value, offset, noAssert) { + value = +value; + offset = offset >>> 0; + if (!noAssert) checkInt(this, value, offset, 1, 0xff, 0); + this[offset] = (value & 0xff); + return offset + 1 +}; + +Buffer.prototype.writeUint16LE = +Buffer.prototype.writeUInt16LE = function writeUInt16LE (value, offset, noAssert) { + value = +value; + offset = offset >>> 0; + if (!noAssert) checkInt(this, value, offset, 2, 0xffff, 0); + this[offset] = (value & 0xff); + this[offset + 1] = (value >>> 8); + return offset + 2 +}; + +Buffer.prototype.writeUint16BE = +Buffer.prototype.writeUInt16BE = function writeUInt16BE (value, offset, noAssert) { + value = +value; + offset = offset >>> 0; + if (!noAssert) checkInt(this, value, offset, 2, 0xffff, 0); + this[offset] = (value >>> 8); + this[offset + 1] = (value & 0xff); + return offset + 2 +}; + +Buffer.prototype.writeUint32LE = +Buffer.prototype.writeUInt32LE = function writeUInt32LE (value, offset, noAssert) { + value = +value; + offset = offset >>> 0; + if (!noAssert) checkInt(this, value, offset, 4, 0xffffffff, 0); + this[offset + 3] = (value >>> 24); + this[offset + 2] = (value >>> 16); + this[offset + 1] = (value >>> 8); + this[offset] = (value & 0xff); + return offset + 4 +}; + +Buffer.prototype.writeUint32BE = +Buffer.prototype.writeUInt32BE = function writeUInt32BE (value, offset, noAssert) { + value = +value; + offset = offset >>> 0; + if (!noAssert) checkInt(this, value, offset, 4, 0xffffffff, 0); + this[offset] = (value >>> 24); + this[offset + 1] = (value >>> 16); + this[offset + 2] = (value >>> 8); + this[offset + 3] = (value & 0xff); + return offset + 4 +}; + +function wrtBigUInt64LE (buf, value, offset, min, max) { + checkIntBI(value, min, max, buf, offset, 7); + + let lo = Number(value & BigInt(0xffffffff)); + buf[offset++] = lo; + lo = lo >> 8; + buf[offset++] = lo; + lo = lo >> 8; + buf[offset++] = lo; + lo = lo >> 8; + buf[offset++] = lo; + let hi = Number(value >> BigInt(32) & BigInt(0xffffffff)); + buf[offset++] = hi; + hi = hi >> 8; + buf[offset++] = hi; + hi = hi >> 8; + buf[offset++] = hi; + hi = hi >> 8; + buf[offset++] = hi; + return offset +} + +function wrtBigUInt64BE (buf, value, offset, min, max) { + checkIntBI(value, min, max, buf, offset, 7); + + let lo = Number(value & BigInt(0xffffffff)); + buf[offset + 7] = lo; + lo = lo >> 8; + buf[offset + 6] = lo; + lo = lo >> 8; + buf[offset + 5] = lo; + lo = lo >> 8; + buf[offset + 4] = lo; + let hi = Number(value >> BigInt(32) & BigInt(0xffffffff)); + buf[offset + 3] = hi; + hi = hi >> 8; + buf[offset + 2] = hi; + hi = hi >> 8; + buf[offset + 1] = hi; + hi = hi >> 8; + buf[offset] = hi; + return offset + 8 +} + +Buffer.prototype.writeBigUInt64LE = defineBigIntMethod(function writeBigUInt64LE (value, offset = 0) { + return wrtBigUInt64LE(this, value, offset, BigInt(0), BigInt('0xffffffffffffffff')) +}); + +Buffer.prototype.writeBigUInt64BE = defineBigIntMethod(function writeBigUInt64BE (value, offset = 0) { + return wrtBigUInt64BE(this, value, offset, BigInt(0), BigInt('0xffffffffffffffff')) +}); + +Buffer.prototype.writeIntLE = function writeIntLE (value, offset, byteLength, noAssert) { + value = +value; + offset = offset >>> 0; + if (!noAssert) { + const limit = Math.pow(2, (8 * byteLength) - 1); + + checkInt(this, value, offset, byteLength, limit - 1, -limit); + } + + let i = 0; + let mul = 1; + let sub = 0; + this[offset] = value & 0xFF; + while (++i < byteLength && (mul *= 0x100)) { + if (value < 0 && sub === 0 && this[offset + i - 1] !== 0) { + sub = 1; + } + this[offset + i] = ((value / mul) >> 0) - sub & 0xFF; + } + + return offset + byteLength +}; + +Buffer.prototype.writeIntBE = function writeIntBE (value, offset, byteLength, noAssert) { + value = +value; + offset = offset >>> 0; + if (!noAssert) { + const limit = Math.pow(2, (8 * byteLength) - 1); + + checkInt(this, value, offset, byteLength, limit - 1, -limit); + } + + let i = byteLength - 1; + let mul = 1; + let sub = 0; + this[offset + i] = value & 0xFF; + while (--i >= 0 && (mul *= 0x100)) { + if (value < 0 && sub === 0 && this[offset + i + 1] !== 0) { + sub = 1; + } + this[offset + i] = ((value / mul) >> 0) - sub & 0xFF; + } + + return offset + byteLength +}; + +Buffer.prototype.writeInt8 = function writeInt8 (value, offset, noAssert) { + value = +value; + offset = offset >>> 0; + if (!noAssert) checkInt(this, value, offset, 1, 0x7f, -0x80); + if (value < 0) value = 0xff + value + 1; + this[offset] = (value & 0xff); + return offset + 1 +}; + +Buffer.prototype.writeInt16LE = function writeInt16LE (value, offset, noAssert) { + value = +value; + offset = offset >>> 0; + if (!noAssert) checkInt(this, value, offset, 2, 0x7fff, -0x8000); + this[offset] = (value & 0xff); + this[offset + 1] = (value >>> 8); + return offset + 2 +}; + +Buffer.prototype.writeInt16BE = function writeInt16BE (value, offset, noAssert) { + value = +value; + offset = offset >>> 0; + if (!noAssert) checkInt(this, value, offset, 2, 0x7fff, -0x8000); + this[offset] = (value >>> 8); + this[offset + 1] = (value & 0xff); + return offset + 2 +}; + +Buffer.prototype.writeInt32LE = function writeInt32LE (value, offset, noAssert) { + value = +value; + offset = offset >>> 0; + if (!noAssert) checkInt(this, value, offset, 4, 0x7fffffff, -0x80000000); + this[offset] = (value & 0xff); + this[offset + 1] = (value >>> 8); + this[offset + 2] = (value >>> 16); + this[offset + 3] = (value >>> 24); + return offset + 4 +}; + +Buffer.prototype.writeInt32BE = function writeInt32BE (value, offset, noAssert) { + value = +value; + offset = offset >>> 0; + if (!noAssert) checkInt(this, value, offset, 4, 0x7fffffff, -0x80000000); + if (value < 0) value = 0xffffffff + value + 1; + this[offset] = (value >>> 24); + this[offset + 1] = (value >>> 16); + this[offset + 2] = (value >>> 8); + this[offset + 3] = (value & 0xff); + return offset + 4 +}; + +Buffer.prototype.writeBigInt64LE = defineBigIntMethod(function writeBigInt64LE (value, offset = 0) { + return wrtBigUInt64LE(this, value, offset, -BigInt('0x8000000000000000'), BigInt('0x7fffffffffffffff')) +}); + +Buffer.prototype.writeBigInt64BE = defineBigIntMethod(function writeBigInt64BE (value, offset = 0) { + return wrtBigUInt64BE(this, value, offset, -BigInt('0x8000000000000000'), BigInt('0x7fffffffffffffff')) +}); + +function checkIEEE754 (buf, value, offset, ext, max, min) { + if (offset + ext > buf.length) throw new RangeError('Index out of range') + if (offset < 0) throw new RangeError('Index out of range') +} + +function writeFloat (buf, value, offset, littleEndian, noAssert) { + value = +value; + offset = offset >>> 0; + if (!noAssert) { + checkIEEE754(buf, value, offset, 4); + } + ieee754$1.write(buf, value, offset, littleEndian, 23, 4); + return offset + 4 +} + +Buffer.prototype.writeFloatLE = function writeFloatLE (value, offset, noAssert) { + return writeFloat(this, value, offset, true, noAssert) +}; + +Buffer.prototype.writeFloatBE = function writeFloatBE (value, offset, noAssert) { + return writeFloat(this, value, offset, false, noAssert) +}; + +function writeDouble (buf, value, offset, littleEndian, noAssert) { + value = +value; + offset = offset >>> 0; + if (!noAssert) { + checkIEEE754(buf, value, offset, 8); + } + ieee754$1.write(buf, value, offset, littleEndian, 52, 8); + return offset + 8 +} + +Buffer.prototype.writeDoubleLE = function writeDoubleLE (value, offset, noAssert) { + return writeDouble(this, value, offset, true, noAssert) +}; + +Buffer.prototype.writeDoubleBE = function writeDoubleBE (value, offset, noAssert) { + return writeDouble(this, value, offset, false, noAssert) +}; + +// copy(targetBuffer, targetStart=0, sourceStart=0, sourceEnd=buffer.length) +Buffer.prototype.copy = function copy (target, targetStart, start, end) { + if (!Buffer.isBuffer(target)) throw new TypeError('argument should be a Buffer') + if (!start) start = 0; + if (!end && end !== 0) end = this.length; + if (targetStart >= target.length) targetStart = target.length; + if (!targetStart) targetStart = 0; + if (end > 0 && end < start) end = start; + + // Copy 0 bytes; we're done + if (end === start) return 0 + if (target.length === 0 || this.length === 0) return 0 + + // Fatal error conditions + if (targetStart < 0) { + throw new RangeError('targetStart out of bounds') + } + if (start < 0 || start >= this.length) throw new RangeError('Index out of range') + if (end < 0) throw new RangeError('sourceEnd out of bounds') + + // Are we oob? + if (end > this.length) end = this.length; + if (target.length - targetStart < end - start) { + end = target.length - targetStart + start; + } + + const len = end - start; + + if (this === target && typeof Uint8Array.prototype.copyWithin === 'function') { + // Use built-in when available, missing from IE11 + this.copyWithin(targetStart, start, end); + } else { + Uint8Array.prototype.set.call( + target, + this.subarray(start, end), + targetStart + ); + } + + return len +}; + +// Usage: +// buffer.fill(number[, offset[, end]]) +// buffer.fill(buffer[, offset[, end]]) +// buffer.fill(string[, offset[, end]][, encoding]) +Buffer.prototype.fill = function fill (val, start, end, encoding) { + // Handle string cases: + if (typeof val === 'string') { + if (typeof start === 'string') { + encoding = start; + start = 0; + end = this.length; + } else if (typeof end === 'string') { + encoding = end; + end = this.length; + } + if (encoding !== undefined && typeof encoding !== 'string') { + throw new TypeError('encoding must be a string') + } + if (typeof encoding === 'string' && !Buffer.isEncoding(encoding)) { + throw new TypeError('Unknown encoding: ' + encoding) + } + if (val.length === 1) { + const code = val.charCodeAt(0); + if ((encoding === 'utf8' && code < 128) || + encoding === 'latin1') { + // Fast path: If `val` fits into a single byte, use that numeric value. + val = code; + } + } + } else if (typeof val === 'number') { + val = val & 255; + } else if (typeof val === 'boolean') { + val = Number(val); + } + + // Invalid ranges are not set to a default, so can range check early. + if (start < 0 || this.length < start || this.length < end) { + throw new RangeError('Out of range index') + } + + if (end <= start) { + return this + } + + start = start >>> 0; + end = end === undefined ? this.length : end >>> 0; + + if (!val) val = 0; + + let i; + if (typeof val === 'number') { + for (i = start; i < end; ++i) { + this[i] = val; + } + } else { + const bytes = Buffer.isBuffer(val) + ? val + : Buffer.from(val, encoding); + const len = bytes.length; + if (len === 0) { + throw new TypeError('The value "' + val + + '" is invalid for argument "value"') + } + for (i = 0; i < end - start; ++i) { + this[i + start] = bytes[i % len]; + } + } + + return this +}; + +// CUSTOM ERRORS +// ============= + +// Simplified versions from Node, changed for Buffer-only usage +const errors = {}; +function E (sym, getMessage, Base) { + errors[sym] = class NodeError extends Base { + constructor () { + super(); + + Object.defineProperty(this, 'message', { + value: getMessage.apply(this, arguments), + writable: true, + configurable: true + }); + + // Add the error code to the name to include it in the stack trace. + this.name = `${this.name} [${sym}]`; + // Access the stack to generate the error message including the error code + // from the name. + this.stack; // eslint-disable-line no-unused-expressions + // Reset the name to the actual name. + delete this.name; + } + + get code () { + return sym + } + + set code (value) { + Object.defineProperty(this, 'code', { + configurable: true, + enumerable: true, + value, + writable: true + }); + } + + toString () { + return `${this.name} [${sym}]: ${this.message}` + } + }; +} + +E('ERR_BUFFER_OUT_OF_BOUNDS', + function (name) { + if (name) { + return `${name} is outside of buffer bounds` + } + + return 'Attempt to access memory outside buffer bounds' + }, RangeError); +E('ERR_INVALID_ARG_TYPE', + function (name, actual) { + return `The "${name}" argument must be of type number. Received type ${typeof actual}` + }, TypeError); +E('ERR_OUT_OF_RANGE', + function (str, range, input) { + let msg = `The value of "${str}" is out of range.`; + let received = input; + if (Number.isInteger(input) && Math.abs(input) > 2 ** 32) { + received = addNumericalSeparator(String(input)); + } else if (typeof input === 'bigint') { + received = String(input); + if (input > BigInt(2) ** BigInt(32) || input < -(BigInt(2) ** BigInt(32))) { + received = addNumericalSeparator(received); + } + received += 'n'; + } + msg += ` It must be ${range}. Received ${received}`; + return msg + }, RangeError); + +function addNumericalSeparator (val) { + let res = ''; + let i = val.length; + const start = val[0] === '-' ? 1 : 0; + for (; i >= start + 4; i -= 3) { + res = `_${val.slice(i - 3, i)}${res}`; + } + return `${val.slice(0, i)}${res}` +} + +// CHECK FUNCTIONS +// =============== + +function checkBounds (buf, offset, byteLength) { + validateNumber(offset, 'offset'); + if (buf[offset] === undefined || buf[offset + byteLength] === undefined) { + boundsError(offset, buf.length - (byteLength + 1)); + } +} + +function checkIntBI (value, min, max, buf, offset, byteLength) { + if (value > max || value < min) { + const n = typeof min === 'bigint' ? 'n' : ''; + let range; + if (byteLength > 3) { + if (min === 0 || min === BigInt(0)) { + range = `>= 0${n} and < 2${n} ** ${(byteLength + 1) * 8}${n}`; + } else { + range = `>= -(2${n} ** ${(byteLength + 1) * 8 - 1}${n}) and < 2 ** ` + + `${(byteLength + 1) * 8 - 1}${n}`; + } + } else { + range = `>= ${min}${n} and <= ${max}${n}`; + } + throw new errors.ERR_OUT_OF_RANGE('value', range, value) + } + checkBounds(buf, offset, byteLength); +} + +function validateNumber (value, name) { + if (typeof value !== 'number') { + throw new errors.ERR_INVALID_ARG_TYPE(name, 'number', value) + } +} + +function boundsError (value, length, type) { + if (Math.floor(value) !== value) { + validateNumber(value, type); + throw new errors.ERR_OUT_OF_RANGE(type || 'offset', 'an integer', value) + } + + if (length < 0) { + throw new errors.ERR_BUFFER_OUT_OF_BOUNDS() + } + + throw new errors.ERR_OUT_OF_RANGE(type || 'offset', + `>= ${type ? 1 : 0} and <= ${length}`, + value) +} + +// HELPER FUNCTIONS +// ================ + +const INVALID_BASE64_RE = /[^+/0-9A-Za-z-_]/g; + +function base64clean (str) { + // Node takes equal signs as end of the Base64 encoding + str = str.split('=')[0]; + // Node strips out invalid characters like \n and \t from the string, base64-js does not + str = str.trim().replace(INVALID_BASE64_RE, ''); + // Node converts strings with length < 2 to '' + if (str.length < 2) return '' + // Node allows for non-padded base64 strings (missing trailing ===), base64-js does not + while (str.length % 4 !== 0) { + str = str + '='; + } + return str +} + +function utf8ToBytes (string, units) { + units = units || Infinity; + let codePoint; + const length = string.length; + let leadSurrogate = null; + const bytes = []; + + for (let i = 0; i < length; ++i) { + codePoint = string.charCodeAt(i); + + // is surrogate component + if (codePoint > 0xD7FF && codePoint < 0xE000) { + // last char was a lead + if (!leadSurrogate) { + // no lead yet + if (codePoint > 0xDBFF) { + // unexpected trail + if ((units -= 3) > -1) bytes.push(0xEF, 0xBF, 0xBD); + continue + } else if (i + 1 === length) { + // unpaired lead + if ((units -= 3) > -1) bytes.push(0xEF, 0xBF, 0xBD); + continue + } + + // valid lead + leadSurrogate = codePoint; + + continue + } + + // 2 leads in a row + if (codePoint < 0xDC00) { + if ((units -= 3) > -1) bytes.push(0xEF, 0xBF, 0xBD); + leadSurrogate = codePoint; + continue + } + + // valid surrogate pair + codePoint = (leadSurrogate - 0xD800 << 10 | codePoint - 0xDC00) + 0x10000; + } else if (leadSurrogate) { + // valid bmp char, but last char was a lead + if ((units -= 3) > -1) bytes.push(0xEF, 0xBF, 0xBD); + } + + leadSurrogate = null; + + // encode utf8 + if (codePoint < 0x80) { + if ((units -= 1) < 0) break + bytes.push(codePoint); + } else if (codePoint < 0x800) { + if ((units -= 2) < 0) break + bytes.push( + codePoint >> 0x6 | 0xC0, + codePoint & 0x3F | 0x80 + ); + } else if (codePoint < 0x10000) { + if ((units -= 3) < 0) break + bytes.push( + codePoint >> 0xC | 0xE0, + codePoint >> 0x6 & 0x3F | 0x80, + codePoint & 0x3F | 0x80 + ); + } else if (codePoint < 0x110000) { + if ((units -= 4) < 0) break + bytes.push( + codePoint >> 0x12 | 0xF0, + codePoint >> 0xC & 0x3F | 0x80, + codePoint >> 0x6 & 0x3F | 0x80, + codePoint & 0x3F | 0x80 + ); + } else { + throw new Error('Invalid code point') + } + } + + return bytes +} + +function asciiToBytes (str) { + const byteArray = []; + for (let i = 0; i < str.length; ++i) { + // Node's code seems to be doing this and not & 0x7F.. + byteArray.push(str.charCodeAt(i) & 0xFF); + } + return byteArray +} + +function utf16leToBytes (str, units) { + let c, hi, lo; + const byteArray = []; + for (let i = 0; i < str.length; ++i) { + if ((units -= 2) < 0) break + + c = str.charCodeAt(i); + hi = c >> 8; + lo = c % 256; + byteArray.push(lo); + byteArray.push(hi); + } + + return byteArray +} + +function base64ToBytes (str) { + return base64.toByteArray(base64clean(str)) +} + +function blitBuffer (src, dst, offset, length) { + let i; + for (i = 0; i < length; ++i) { + if ((i + offset >= dst.length) || (i >= src.length)) break + dst[i + offset] = src[i]; + } + return i +} + +// ArrayBuffer or Uint8Array objects from other contexts (i.e. iframes) do not pass +// the `instanceof` check but they should be treated as of that type. +// See: https://github.com/feross/buffer/issues/166 +function isInstance (obj, type) { + return obj instanceof type || + (obj != null && obj.constructor != null && obj.constructor.name != null && + obj.constructor.name === type.name) +} +function numberIsNaN (obj) { + // For IE11 support + return obj !== obj // eslint-disable-line no-self-compare +} + +// Create lookup table for `toString('hex')` +// See: https://github.com/feross/buffer/issues/219 +const hexSliceLookupTable = (function () { + const alphabet = '0123456789abcdef'; + const table = new Array(256); + for (let i = 0; i < 16; ++i) { + const i16 = i * 16; + for (let j = 0; j < 16; ++j) { + table[i16 + j] = alphabet[i] + alphabet[j]; + } + } + return table +})(); + +// Return not function with Error if BigInt not supported +function defineBigIntMethod (fn) { + return typeof BigInt === 'undefined' ? BufferBigIntNotDefined : fn +} + +function BufferBigIntNotDefined () { + throw new Error('BigInt not supported') +} +}(buffer)); + +class ChartTemplateSuggestModal extends obsidian.FuzzySuggestModal { + constructor(app, editor) { + super(app); + this.editor = editor; + } + getItems() { + return Object.entries(ChartTemplateType); + } + getItemText(item) { + return item[0]; + } + onChooseItem(item) { + insertEditor(this.editor, buffer.Buffer.from(item[1], "base64").toString("utf8")); + } +} + +const CSV_FILE_EXTENSION = "csv"; +const VIEW_TYPE_CSV = "csv"; +class ChartsViewPlugin extends obsidian.Plugin { + ChartsViewProcessor(source, el, ctx) { + return __awaiter$4(this, void 0, void 0, function* () { + React.unmountComponentAtNode(el); + try { + const chartProps = yield parseConfig(source, this); + const cfg = chartProps.config; + const isBackgroundColorCustomed = cfg.theme && (cfg.theme.background || (cfg.theme.styleSheet && cfg.theme.styleSheet.backgroundColor)); + const isPaddingCustomed = cfg.padding; + cfg.theme = cfg.theme || getTheme(this.settings.theme); + cfg.backgroundColor = isBackgroundColorCustomed ? undefined : this.settings.backgroundColor; + cfg.padding = isPaddingCustomed ? undefined : [this.settings.paddingTop, this.settings.paddingRight, + this.settings.paddingBottom, this.settings.paddingLeft]; + React.render(React.createElement(Chart, Object.assign({}, chartProps)), el); + } + catch (e) { + React.render(React.createElement("div", { style: { color: 'var(--text-title-h1)' } }, e.toString()), el); + } + }); + } + ; + onload() { + return __awaiter$4(this, void 0, void 0, function* () { + try { + yield this.loadSettings(); + this.addSettingTab(new ChartsViewSettingTab(this.app, this)); + this.registerMarkdownCodeBlockProcessor("chartsview", this.ChartsViewProcessor.bind(this)); + this.addCommand({ + id: 'insert-chartsview-template', + name: 'Insert Template ...', + editorCallback: (editor) => { + new ChartTemplateSuggestModal(this.app, editor).open(); + } + }); + if (obsidian.Platform.isDesktopApp) { + this.addCommand({ + id: `import-chartsview-data-csv`, + name: `Import data from external CSV file`, + editorCallback: (editor) => __awaiter$4(this, void 0, void 0, function* () { + const file = yield r$2({ accept: '.csv', strict: true }); + const content = yield file.text(); + const records = parseCsv(content); + insertEditor(editor, jsYaml.dump(records, { quotingType: '"', noRefs: true }) + .replace(/\n/g, "\n" + " ".repeat(editor.getCursor().ch))); + }) + }); + } + } + catch (error) { + console.log(`Load error. ${error}`); + } + try { + this.registerExtensions([CSV_FILE_EXTENSION], VIEW_TYPE_CSV); + } + catch (error) { + console.log(`Existing file extension ${CSV_FILE_EXTENSION}`); + } + console.log('Loaded Charts View plugin'); + }); + } + onunload() { + console.log('Unloading Charts View plugin'); + } + loadSettings() { + return __awaiter$4(this, void 0, void 0, function* () { + this.settings = Object.assign(DEFAULT_SETTINGS, yield this.loadData()); + }); + } + saveSettings() { + return __awaiter$4(this, void 0, void 0, function* () { + yield this.saveData(this.settings); + }); + } +} + +module.exports = ChartsViewPlugin; diff --git a/notes/.obsidian/plugins/obsidian-chartsview-plugin/manifest.json b/notes/.obsidian/plugins/obsidian-chartsview-plugin/manifest.json new file mode 100644 index 0000000..57a83dd --- /dev/null +++ b/notes/.obsidian/plugins/obsidian-chartsview-plugin/manifest.json @@ -0,0 +1,10 @@ +{ + "id": "obsidian-chartsview-plugin", + "name": "Charts View", + "version": "1.0.12", + "minAppVersion": "0.9.12", + "description": "This is a charts view plugin for Obsidian.", + "author": "caronchen", + "authorUrl": "https://github.com/caronchen/obsidian-chartsview-plugin", + "isDesktopOnly": false +} diff --git a/notes/.obsidian/plugins/obsidian-chartsview-plugin/styles.css b/notes/.obsidian/plugins/obsidian-chartsview-plugin/styles.css new file mode 100644 index 0000000..ca4e243 --- /dev/null +++ b/notes/.obsidian/plugins/obsidian-chartsview-plugin/styles.css @@ -0,0 +1,13 @@ +.chartsview-donation { + width: fit-content; + margin: 25px auto; + text-align: center; + position: absolute; + left: 200px; + right: 0; + bottom: 0; +} + +.chartsview-donation a.paypal { + display: inline-block; +} diff --git a/notes/.trash/Průnik množin.md b/notes/.trash/Průnik množin.md new file mode 100644 index 0000000..0f5895e --- /dev/null +++ b/notes/.trash/Průnik množin.md @@ -0,0 +1 @@ +# Průnik množin diff --git a/notes/README.md b/notes/README.md index 77b9d81..4dab399 100644 --- a/notes/README.md +++ b/notes/README.md @@ -1,4 +1,4 @@ -# Poznámky +# README Jednoduchý web na moje poznámky ze školy. SSPŠ kybernetická bezbečnost. diff --git a/notes/ang/Testy.md b/notes/ang/Testy.md new file mode 100644 index 0000000..eff5d36 --- /dev/null +++ b/notes/ang/Testy.md @@ -0,0 +1,11 @@ +--- +tags: + - ang/testy + - testy +--- +# Testy +## 20.10.2021 +Vocabulary test + +SB p. 12/2,3,5 13/10 +WB p. 9/3 10/5,6,7 \ No newline at end of file diff --git a/notes/ang/listening 1.md b/notes/ang/listening 1.md deleted file mode 100644 index f378a14..0000000 --- a/notes/ang/listening 1.md +++ /dev/null @@ -1,16 +0,0 @@ -# listening 1 -1. A -2. C -3. B -4. D - -1. g -2. e -3. a -4. b -5. j -6. h -7. d -8. i -9. c -10. f \ No newline at end of file diff --git a/notes/ang/listening.md b/notes/ang/listening.md new file mode 100644 index 0000000..3e83c2e --- /dev/null +++ b/notes/ang/listening.md @@ -0,0 +1,43 @@ +--- +tags: + - ang/listening +--- +# listening +1. A +2. C +3. B +4. D +--- +1. g +2. e +3. a +4. b +5. j +6. h +7. d +8. i +9. c + +--- + +1. oh dear +2. absolutely +3. fair enough +4. oh you're kidding +5. that's great +6. good for you + +--- +uč s. 20-21 +1. j +2. b +3. c +4. c +5. a +6. c +7. c +8. b +9. c +10. a +11. a +12. b \ No newline at end of file diff --git a/notes/ang/slovesa.md b/notes/ang/slovesa.md index 5bcf311..ac8adb0 100644 --- a/notes/ang/slovesa.md +++ b/notes/ang/slovesa.md @@ -1,3 +1,7 @@ +--- +tags: + - ang/slovesa +--- # slovesa 1. beat, beat, beaten 2. catch caught caught diff --git a/notes/cjl/jmeno.md b/notes/cjl/jména.md similarity index 97% rename from notes/cjl/jmeno.md rename to notes/cjl/jména.md index fb237e4..c957063 100644 --- a/notes/cjl/jmeno.md +++ b/notes/cjl/jména.md @@ -1,4 +1,8 @@ -# Význam jména +--- +tags: + - cjl/jména +--- +# jména ## Daniel diff --git a/notes/cjl/literatura/Tropy a figury.md b/notes/cjl/literatura/Tropy a figury.md index eab03c9..d8ed7be 100644 --- a/notes/cjl/literatura/Tropy a figury.md +++ b/notes/cjl/literatura/Tropy a figury.md @@ -1,3 +1,8 @@ +--- +tags: + - cjl/literatura/tropy + - cjl/literatura/figury +--- # Tropy a figury - tu zní, tam volá a burácí všady -> Gradace diff --git a/notes/cjl/literatura/Základní literaturní pojmy.md b/notes/cjl/literatura/Základní literaturní pojmy.md index 1b2fa2b..e51bbab 100644 --- a/notes/cjl/literatura/Základní literaturní pojmy.md +++ b/notes/cjl/literatura/Základní literaturní pojmy.md @@ -1,3 +1,8 @@ +--- +tags: + - cjl/literatura/pojmy + - cjl/literatura/žánry +--- # Základní literaturní pojmy ## Literatura - soubor všech zapsaných textů diff --git a/notes/cjl/literatura/poznávání žánrů.md b/notes/cjl/literatura/poznávání žánrů.md index 7ad10f2..73933e8 100644 --- a/notes/cjl/literatura/poznávání žánrů.md +++ b/notes/cjl/literatura/poznávání žánrů.md @@ -1,3 +1,8 @@ +--- +tags: + - cjl/literatura +--- +# poznávání žánrů 1. lyrika - kaligram 2. lyrika - epigram 3. lyrika - elegie diff --git a/notes/dej/Hrad Kalich.md b/notes/dej/Hrad Kalich.md index 6739cb2..192b328 100644 --- a/notes/dej/Hrad Kalich.md +++ b/notes/dej/Hrad Kalich.md @@ -1,3 +1,7 @@ +--- +tags: + - dej +--- # Hrad Kalich 1. Kdo a proč si nechal hrad Kalich postavit? -> Janem Žižkou diff --git a/notes/dej/moderní/1. světová válka.md b/notes/dej/moderní/1. světová válka.md index 9416d63..2232f9e 100644 --- a/notes/dej/moderní/1. světová válka.md +++ b/notes/dej/moderní/1. světová válka.md @@ -1,4 +1,8 @@ -# První světová válka +--- +tags: + - dej/moderní/první-světová +--- +# 1. světová válka ## Zájmy velmocí na Balkáně - od 70. let 19. st. hl. postavou evropského dění **Otto von Bismarck** - Balkánský poloostrov - styčné území Turecka, Ruska a Rakouska-Uherska diff --git a/notes/dej/moderní/1. světová válka/Použití plynů.md b/notes/dej/moderní/1. světová válka/Použití plynů.md new file mode 100644 index 0000000..6237c46 --- /dev/null +++ b/notes/dej/moderní/1. světová válka/Použití plynů.md @@ -0,0 +1,16 @@ +--- +tags: + - dej/moderní/první-světová/plyny +--- +# Použití plynů +Francie byla první zemí, která použila proti nepříteli plyn cloraceton, dne 3. srpna 1914. + +Němci použili podobnou bojovou látku v říjnu 1914 u Nouve Chapelle. + +## Yperit + +Yperit (horčičný plyn) je vojenský plyn který použili Němci u belgického města Ypres. + +Yperit byl naposledy použit vojáky ISIS proti kurdům v roce 2015. + +Yperit leptá sliznici, poškozuje DNA a způsobuje puchýře. \ No newline at end of file diff --git a/notes/dej/moderní/1. světová válka/Sarajevský atentát.md b/notes/dej/moderní/1. světová válka/Sarajevský atentát.md index 56afb9f..aef531e 100644 --- a/notes/dej/moderní/1. světová válka/Sarajevský atentát.md +++ b/notes/dej/moderní/1. světová válka/Sarajevský atentát.md @@ -1,5 +1,7 @@ --- date: 28. 06. 1914 +tags: + - dej/moderní/první-světová/atentát --- # Sarajevský atentát 28.6.1914 diff --git a/notes/dej/moderní/1. světová válka/Východní fronta.md b/notes/dej/moderní/1. světová válka/Východní fronta.md index 31d064c..9855d2f 100644 --- a/notes/dej/moderní/1. světová válka/Východní fronta.md +++ b/notes/dej/moderní/1. světová válka/Východní fronta.md @@ -1,3 +1,7 @@ +--- +tags: + - dej/moderní/první-světová/východní-fronta +--- # Východní fronta - bitva u Tannenburgu a Mazurských jezer (1914) - Paul von Hindenburg, Erich Ludendorff diff --git a/notes/dej/moderní/1. světová válka/Zbraně.md b/notes/dej/moderní/1. světová válka/Zbraně.md new file mode 100644 index 0000000..ef1b125 --- /dev/null +++ b/notes/dej/moderní/1. světová válka/Zbraně.md @@ -0,0 +1,10 @@ +--- +tags: + - dej/moderní/první-světová/zbraně +--- +# Zbraně +- **strojní pušky** (kulomety), dělostřelectvo, minomety, granáty, plamenomety +- **ponorky** - využívají zejména Němci (Středozemní moře, kolem V. Británie) +- **tanky** - reakce na bezvýchodnost zákopové války, poprvé v září 1916 na Sommě. +- **letadla** - z průzkumných prostředků se stává účinná zbraň -> rytířské souboje, bombardování +- **chemické zbraně** - jedovaté plyny: chlor, yperit \ No newline at end of file diff --git a/notes/dej/moderní/1. světová válka/Západní fronta.md b/notes/dej/moderní/1. světová válka/Západní fronta.md index f38e3e6..2f895d5 100644 --- a/notes/dej/moderní/1. světová válka/Západní fronta.md +++ b/notes/dej/moderní/1. světová válka/Západní fronta.md @@ -1,3 +1,7 @@ +--- +tags: + - dej/moderní/první-světová/západní-fronta +--- # Západní fronta - blesková a zákopová válka, patová situace - fronta od belgického pobřeží přes Flandry, údolí Sommy, Champagne až k hranicím Švýcarska diff --git a/notes/dej/uvod.md b/notes/dej/uvod.md index 096f970..d1155f2 100644 --- a/notes/dej/uvod.md +++ b/notes/dej/uvod.md @@ -1,4 +1,8 @@ -# Úvod do dějepisu +--- +tags: + - dej +--- +# uvod - humanitní a společenská věda - dějiny člověka a jeho civilizace diff --git a/notes/ele/Náboj, proud, napětí a odpor.md b/notes/ele/Náboj, proud, napětí a odpor.md index 41b4eeb..54a8de6 100644 --- a/notes/ele/Náboj, proud, napětí a odpor.md +++ b/notes/ele/Náboj, proud, napětí a odpor.md @@ -1,3 +1,10 @@ +--- +tags: + - ele + - ele/náboj + - ele/proud + - ele/napětí +--- # Náboj, proud, napětí a odpor ![[Pasted image 20210920101314.png]] @@ -52,7 +59,15 @@ Viz [[Vodiče]] - vodiče, polovodiče, nevodiče ## Příklady +--- $$t=24$$ $$P=27/24=1.125$$ $$U=230V$$ -$$W=100000J=100000Ws=27Wh$$ \ No newline at end of file +$$W=100000J=100000Ws=27Wh$$ +--- +$$W=I*U*t/P*t$$ +$$U=230V$$ +$$t=10h=36000s$$ +$$I=500mA=0.5A$$ +$$W=0.5*230*36000=4140000J=4140kJ$$ +--- \ No newline at end of file diff --git a/notes/ele/Polovodiče.md b/notes/ele/Polovodiče.md index 9f0b163..f7bab33 100644 --- a/notes/ele/Polovodiče.md +++ b/notes/ele/Polovodiče.md @@ -1,2 +1,8 @@ +--- +tags: + - ele + - ele/vodiče + - ele/vodiče/polovodiče +--- # Polovodiče Polovodiče mají valenční elektrony za normálních podmínek pevně vázané. Elektrický proud vedou za změny podmínek. \ No newline at end of file diff --git a/notes/ele/Vodiče.md b/notes/ele/Vodiče.md index b2ac7c9..965d584 100644 --- a/notes/ele/Vodiče.md +++ b/notes/ele/Vodiče.md @@ -1,3 +1,10 @@ +--- +tags: + - ele + - ele/vodiče + - ele/vodiče/polovodiče + - ele/vodiče/izolanty +--- # Vodiče Rozdělení: ## Vodiče @@ -9,7 +16,7 @@ Vedou proud. - Sn - cín (součástí pájky -> cín + olovo) ### Vlastnosti - zvýšení teploty se odpor zvýší (narozdíl od [polovodičů](#polovodiče)) -## Polovodiče +## [[Polovodiče]] Vedou proud za určitých podmínek, při splnění podmínkách se stávají supravodiči. ### Příklady - Se - Selen diff --git a/notes/har/CPU.md b/notes/har/CPU.md new file mode 100644 index 0000000..188445e --- /dev/null +++ b/notes/har/CPU.md @@ -0,0 +1,26 @@ +# CPU +Základní úlohou mikroprocesoru je pracovat podle pokynů určitého programu nebo hardwaru v počítači či jiném podobném zařízení (tablet, smart phone...) + +Využívá různě složitých programových instrukcí, které jsou zpracovány na základě jednoduchých logický operací. + +Je mozkem počítače, kvalita CPU zásadně ovlivňuje výkon celého počítače. + +## Sekce CPU +Hlavní část procesoru je jeho jádro (integrovaný obvod) + +Toto jádro je připevněno na základnu procesoru (plošný spoj) s piny. + +Jádro CPU je ukryto v pouzdře (kov, keramické sloučeniny), které odvádí zbytkové teplo a také poskytuje ochranu jemným obvodům jádra. + +### Arithmetic-logic unit - ALU +Jedna ze základních komponent procesoru, ve které se provádějí všechny aritmetické a logické výpočty. +### Floating-point unit - FPU +Matematický koprocesor určený na vykonávání operací s čísly s pohyblivou řadovou čárku. +### Graphic processing unit - GPU +Většina moderních procesorů má v sobě základní grafickou výpočetní jednotku dostačující pro běžnou práci a multimédia. +### řadič - CPU controller +Elektronická řídící jednotka, realizovaná sekvenčním obvodem, která řídí činnost všech částí počítače. +### registry +Malá úložitě dat umístěná v mikroprocesoru, jejichž obsah lze načíst mnohem rychleji, než data uložená kdekoliv jinde v počítači. +### vyrovnávací paměť - Cache +Je vlastně jakýmsi překladištěm dat mezi rychlejším a pomalejším zařízením v počítači a slouží jako dočasná paměť. \ No newline at end of file diff --git a/notes/mat/Druhá odmocnina.md b/notes/mat/Druhá odmocnina.md index 53a3b85..4c749ba 100644 --- a/notes/mat/Druhá odmocnina.md +++ b/notes/mat/Druhá odmocnina.md @@ -1,3 +1,7 @@ +--- +tags: + - mat/druhá-odmocnina +--- # Druhá odmocnina $\sqrt{x}$ - $x\ge0$ $x \epsilon R$ (což je stejné jako toto:) diff --git a/notes/mat/Množiny.md b/notes/mat/Množiny.md index 3749a3c..53f2d02 100644 --- a/notes/mat/Množiny.md +++ b/notes/mat/Množiny.md @@ -1,6 +1,58 @@ +--- +tags: + - mat/množiny + - mat/množiny/průnik + - mat/množiny/podmnožina + - mat/množiny/sjednocení + - mat/množiny/doplněk + - mat/množiny/rozdíl +--- # Množiny Množina je souhrn nějakých předmětů (prvků množiny). - $x \in A$ - $x$ je prvkem množiny $a$ - $x \notin A$ - $x$ nenní prvkem množiny $a$ +[[Číselné obory]] +Prázdná množina nemá žádný prvek, píčeme $C = \varnothing$ nebo jen $\varnothing$, nebo prázdnou množinu $\{\}$ -Prázdná množina nemá žádný prvek, píčeme $C = \varnothing$ nebo jen $\varnothing$, nebo prázdnou množinu $\{\}$ \ No newline at end of file +## Průnik množin +$\cap$ + +$$ +A \cap B = \{\forall x \in M : x \in A \wedge x \in B\} +$$ +- $\wedge$ - a zároveň +- $\forall$ - pro všechny + +## Podmnožina +$\subseteq$ +$$ +A \subseteq B \Leftrightarrow \forall x \in A : x \in B +$$ +Množina A je podmnožinou množiny B právě tehdy, když pro všechna x ležící v A platí že x je prvkem množiny B. + +## Sjednocení množin +$\cup$ +$$ +A \cup B = \{\forall x \in M: x \in A \wedge x \in B\} +$$ +Sjednocení množin A, B je množina všech prvků které patří alespoň do jedné z množin A, B. +## Doplněk množiny +$a'$ +$$ +A' = \{ \forall x \in M: x \notin A \} +$$ +Doplnění množiny o prvky které nejsou v původní množině. +## Rozdíl množin +$a-b$ +$$ +A-B = \{ \forall x \in A \wedge x \notin B\} +$$ +Všechny prvky množiny A které nejsou v množině B. + +## Příklady +$$ +A \cap (B \cup C) = { \forall x \in M : x \in A \wedge (x \in B \wedge x \in C)} +$$ +$$ +(A \cap B) \cup (B \cap C) \cup (A \cap C) - A \cap (B \cap C) +$$ \ No newline at end of file diff --git a/notes/mat/Násobek a dělitel.md b/notes/mat/Násobek a dělitel.md index 68af386..d010e92 100644 --- a/notes/mat/Násobek a dělitel.md +++ b/notes/mat/Násobek a dělitel.md @@ -1,3 +1,8 @@ +--- +tags: + - mat/násobek + - mat/dělitel +--- # Násobek a dělitel Číslo $a$ je násobkem čísla $b$ (číslo $b$ je dělitel čísla $a$) právě tehdy, když existuje přirozené číslo $k$ takové, že $a = k * b$. ## Prvočíslo diff --git a/notes/mat/Průnik množin $cap$.md b/notes/mat/Průnik množin $cap$.md deleted file mode 100644 index d628173..0000000 --- a/notes/mat/Průnik množin $cap$.md +++ /dev/null @@ -1,37 +0,0 @@ -# Průnik množin $\cap$ - -$$ -A \cap B = \{\forall x \in M : x \in A \wedge x \in B\} -$$ -- $\wedge$ - a zároveň -- $\forall$ - pro všechny - -## Podmnožina $\subseteq$ -$$ -A \subseteq B \Leftrightarrow \forall x \in A : x \in B -$$ -Množina A je podmnožinou množiny B právě tehdy, když pro všechna x ležící v A platí že x je prvkem množiny B. - -## Sjednocení množin $\cup$ -$$ -A \cup B = \{\forall x \in M: x \in A \wedge x \in B\} -$$ -Sjednocení množin A, B je množina všech prvků které patří alespoň do jedné z množin A, B. -## Doplněk množiny $a'$ -$$ -A' = \{ \forall x \in M: x \notin A \} -$$ -Doplnění množiny o prvky které nejsou v původní množině. -## Rozdíl množin $a-b$ -$$ -A-B = \{ \forall x \in A \wedge x \notin B\} -$$ -Všechny prvky množiny A které nejsou v množině B. - -## Příklady -$$ -A \cap (B \cup C) = { \forall x \in M : x \in A \wedge (x \in B \wedge x \in C)} -$$ -$$ -(A \cap B) \cup (B \cap C) \cup (A \cap C) - A \cap (B \cap C) -$$ \ No newline at end of file diff --git a/notes/mat/Příklady.md b/notes/mat/Příklady.md new file mode 100644 index 0000000..d5d9ba3 --- /dev/null +++ b/notes/mat/Příklady.md @@ -0,0 +1,23 @@ +--- +tags: + - mat +--- +# Příklady +--- +Třída 1.K odjížděla na lyžařský kurs do Krkonoš, na který byly, jako povinné vybavení, předepsány běžecké a sjezdové lyže. Škola nabídla žákům možnost zapůjčení obou druhů lyží ze školního skladu. Alespoň jeden druh lyží si vypůjčilo celkem 14 studentů. Běžky si vypůjčilo o 5 studentů více, než bylo studentů, kteří se vypůjčili sjezdovky. Pouze jeden druh lyží si vypůjčilo o 4 studenty více, než bylo studentů, kteří si vypůjčili oba druhy lyží. Studentů, kteří si vypůjčili pouze běžky, bylo o 3 méně, než studentů, kteří měli vlastní vybavení a nemuseli si vypůjčit nic. Kolik studentů se zúčastnilo lyžařského kurzu? +$$a+b+c=14$$ +$$c+b-5 = a+b$$ +$$a+c-4=b$$ +$$c+3=d$$ +$$c-5+c-5+c-4+c=14$$ +$$4c-14=14$$ +$$4c=28$$ +$$c=7$$ +$$d=10$$ +$$a=c-5=2$$ +$$b=5$$ +Odpověď: 24 + +--- +Písemná práce z matematiky, které se zúčastnilo 35 studentů, obsahovala tři úlohy. Dva studenti vyřešili jenom první úlohu a tři studenti jenom druhou úlohu. První a druhou úlohu vyřešilo 16 studentů, druhou a třetí 14 studentů. Všechny úlohy vyřešilo 10 studentů, první nebo třetí 31 studentů a 3 studenti nevyřešili ani první ani druhou úlohu. Kolik stůdentů vyřešilo: a) aspoň dvě úlohy, b) aspoň jednu úlohu? + diff --git a/notes/mat/Rozklad složených čísel na součin prvočísel.md b/notes/mat/Rozklad složených čísel na součin prvočísel.md index cb66358..369d990 100644 --- a/notes/mat/Rozklad složených čísel na součin prvočísel.md +++ b/notes/mat/Rozklad složených čísel na součin prvočísel.md @@ -1,4 +1,8 @@ -# Rozklad složených čísel na součin provčísel +--- +tags: + - mat/prvočísla/rozklad +--- +# Rozklad složených čísel na součin prvočísel ## Základní věta aritmetiky Každé přírozené číslo $n$ větší než $1$ lze zapsat jediným způsobem ve tvaru $n=p_1^{r_1} * p_2^{r_2} \dots$ kde $p_1 \lt p_2 \lt p_3 \dots$, jsou prvočísla a $r_1, r_2 \dots$ jsou přirozená čísla. diff --git a/notes/mat/Zakrouhlení.md b/notes/mat/Zakrouhlení.md index 1478a15..5a2bc34 100644 --- a/notes/mat/Zakrouhlení.md +++ b/notes/mat/Zakrouhlení.md @@ -1,4 +1,8 @@ -# Příklady zakrouhlení +--- +tags: + - mat/zakrouhlení +--- +# Zakrouhlení $$ 0.000000006328 = 6.328*10^{-9} $$ $$ 3 425 328 567 \dot{=} 3.43 * 10^9 $$ $$ 10.352 = 1.0352 * 10^1 $$ \ No newline at end of file diff --git a/notes/mat/Zlomky.md b/notes/mat/Zlomky.md index aec17b7..aa5501b 100644 --- a/notes/mat/Zlomky.md +++ b/notes/mat/Zlomky.md @@ -1,3 +1,8 @@ +--- +tags: + - mat/zlomky +--- +# Zlomky $$ \frac{x}{3} - 20 = \frac{x}{7} $$ diff --git a/notes/mat/ucitel.md b/notes/mat/ucitel.md deleted file mode 100644 index 2f75e66..0000000 --- a/notes/mat/ucitel.md +++ /dev/null @@ -1 +0,0 @@ -# Tkáč \ No newline at end of file diff --git a/notes/mat/učitel.md b/notes/mat/učitel.md new file mode 100644 index 0000000..3fce266 --- /dev/null +++ b/notes/mat/učitel.md @@ -0,0 +1,7 @@ +--- +tags: + - mat/učitel + - učitelé/tkáč +--- +# učitel +Tkáč \ No newline at end of file diff --git a/notes/mat/Číselné obory.md b/notes/mat/Číselné obory.md index 7d88c5b..44b0647 100644 --- a/notes/mat/Číselné obory.md +++ b/notes/mat/Číselné obory.md @@ -1,3 +1,8 @@ +--- +tags: + - mat/číselné-obory + - mat/imaginárni-číslo +--- # Číselné obory ## **N** přirozená čísla diff --git a/notes/mat/Číselné soustavy.md b/notes/mat/Číselné soustavy.md index d241e14..c7cae39 100644 --- a/notes/mat/Číselné soustavy.md +++ b/notes/mat/Číselné soustavy.md @@ -1,3 +1,7 @@ +--- +tags: + - mat/číselne-soustavy +--- # Číselné soustavy ## Používané - decimální / desítková diff --git a/notes/pdv/30let linuxu.md b/notes/pdv/30let linuxu.md index b2d7511..8839fd2 100644 --- a/notes/pdv/30let linuxu.md +++ b/notes/pdv/30let linuxu.md @@ -1,4 +1,9 @@ -# 30 let Linuxu +--- +tags: + - pdv + - pdv/linux +--- +# 30let linuxu Necelé 2 týdny zpátky (v době psaní) bylo výročí 30 let od oznámení linuxu. Linus Torvalds 25. srpna poslal email kde psal o tom, jak pracuje na operačním systému pro procesory řady 386/486, a taky napsal že to nebude nic velkého a profesionálního jako GNU (ironicky). Napsal že Linux není portovatelný, protože používá hodně funkcí specifických pro 386 procesory. Nedávno byl naportován na VRChat shader (pomocí emulace RISC-V procesoru, který má úplně jinou architekturu než 386). > It will never be the professional OS that Hurd will be. > — Linus Torvalds diff --git a/notes/pdv/Procesory AMD x Intel.md b/notes/pdv/Procesory AMD x Intel.md index fe87e7c..bd3b4e1 100644 --- a/notes/pdv/Procesory AMD x Intel.md +++ b/notes/pdv/Procesory AMD x Intel.md @@ -1 +1,6 @@ +--- +tags: + - pdv + - pdv/procesor +--- # Procesory AMD x Intel diff --git a/notes/psi/Základy komunikace.md b/notes/psi/Základy komunikace.md index f87d5fa..0078744 100644 --- a/notes/psi/Základy komunikace.md +++ b/notes/psi/Základy komunikace.md @@ -1,3 +1,15 @@ +--- +tags: + - psi + - psi/protokol + - psi/isoosi + - psi/tcp + - psi/ip + - psi/udp + - psi/mac + - psi/router + - psi/switch +--- # Základy komunikace ![[tcpudp.jpg]] ## 3 prvky