(function (global, factory) {
    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
        typeof define === 'function' && define.amd ? define(['exports'], factory) :
        (global = global || self, factory(global.kdorg = global.kdorg || {}));
}(this, function (exports) {
    'use strict';

    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);
    }

    function _instanceof(left, right) {
        if (right != null && typeof Symbol !== "undefined" && right[Symbol.hasInstance]) {
            return !!right[Symbol.hasInstance](left);
        } else {
            return left instanceof right;
        }
    }

    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 _setPrototypeOf(o, p) {
        _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
            o.__proto__ = p;
            return o;
        };
        return _setPrototypeOf(o, p);
    }

    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 _possibleConstructorReturn(self, call) {
        if (call && (_typeof(call) === "object" || typeof call === "function")) {
            return call;
        }
        return _assertThisInitialized(self);
    }

    function _assertThisInitialized(self) {
        if (self === void 0) {
            throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
        }
        return self;
    }

    function _isNativeReflectConstruct() {
        if (typeof Reflect === "undefined" || !Reflect.construct) return false;
        if (Reflect.construct.sham) return false;
        if (typeof Proxy === "function") return true;
        try {
            Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));
            return true;
        } catch (e) {
            return false;
        }
    }

    function _getPrototypeOf(o) {
        _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) {
            return o.__proto__ || Object.getPrototypeOf(o);
        };
        return _getPrototypeOf(o);
    }

    function _classCallCheck(instance, Constructor) {
        if (!_instanceof(instance, 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;
    }

    var version = "1.1.8";

    function init(params) {
        if (!params.dom) {
            console.error("容器DOM必填");
            return;
        }

        params.dom.innerHTML = "";
        var _params$config = params.config,
            nodeBox = _params$config.nodeBox,
            isVertical = _params$config.isVertical,
            level = _params$config.level;
        var ochart = new ChartObj({
            dom: params.dom,
            data: JSON.parse(JSON.stringify(params.data)),
            boxLine: params.boxLine,
            pathLine: params.pathLine,
            toggleCallBack: params.toggleCallBack,
            flagToggle: params.flagToggle,
            selectCardModel: params.selectCardModel,
            cardModel: params.cardModel,
            isVertical: isVertical,
            nodeBox: nodeBox,
            level: level
        });
        ochart.init();
        return ochart;
    }

    var ChartObj = /*#__PURE__*/ function () {
        "use strict";

        function ChartObj() {
            var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
                dom = _ref.dom,
                _ref$isVertical = _ref.isVertical,
                isVertical = _ref$isVertical === void 0 ? true : _ref$isVertical,
                _ref$nodeBox = _ref.nodeBox,
                nodeBox = _ref$nodeBox === void 0 ? {
                    width: 120,
                    height: 40,
                    spaceX: 16,
                    spaceY: 30
                } : _ref$nodeBox,
                _ref$data = _ref.data,
                data = _ref$data === void 0 ? {} : _ref$data,
                _ref$cardModel = _ref.cardModel,
                cardModel = _ref$cardModel === void 0 ? [] : _ref$cardModel,
                _ref$flagToggle = _ref.flagToggle,
                flagToggle = _ref$flagToggle === void 0 ? function () {
                    return false;
                } : _ref$flagToggle,
                _ref$toggleCallBack = _ref.toggleCallBack,
                toggleCallBack = _ref$toggleCallBack === void 0 ? function () {} : _ref$toggleCallBack,
                _ref$boxLine = _ref.boxLine,
                boxLine = _ref$boxLine === void 0 ? function () {
                    return false;
                } : _ref$boxLine,
                _ref$pathLine = _ref.pathLine,
                pathLine = _ref$pathLine === void 0 ? function () {
                    return false;
                } : _ref$pathLine,
                _ref$selectCardModel = _ref.selectCardModel,
                selectCardModel = _ref$selectCardModel === void 0 ? function () {
                    return "normal";
                } : _ref$selectCardModel,
                _ref$level = _ref.level,
                level = _ref$level === void 0 ? 3 : _ref$level;

            _classCallCheck(this, ChartObj);

            this.dom = dom;
            this.treeData = data;
            this.isVertical = isVertical;
            this.boxLine = boxLine;
            this.toggleCallBack = toggleCallBack;
            this.flagToggle = flagToggle;
            this.pathLine = pathLine;
            this.selectCardModel = selectCardModel;
            this.level = level;
            this.nodeBox = nodeBox;
            this.pptmodel = cardModel;
            this.cardModel = this.setCardModel(cardModel);
            this.theme = {
                svg: {
                    fill: '#fff' // √

                },
                card: {
                    bdColor: "#fff",
                    // √
                    activeBg: "#eee"
                },
                line: {
                    normalColor: "#555",
                    // √
                    dottedColor: "#999",
                    // √
                    width: 1 // √

                }
            };
            this.openThumb = true;
            this.initData();
            this.initMain();

            if (this.openThumb) {
                this.initThumb();
            }

            this.initDom();
        }

        _createClass(ChartObj, [{
            key: "init",
            value: function init() {
                if (this.openThumb) {
                    this.thumb = new ThumbChart({
                        dom: this.thumDom,
                        svgBox: this.thumbSvgBox,
                        wrapperBox: this.thumbBox,
                        publicConfig: this,
                        thumbDragBox: this.thumbDragBox,
                        scale: this.thumbScale
                    });
                    this.thumb.init();
                } else {
                    this.thumb = new Proxy({}, {
                        get: function get() {
                            return function () {};
                        }
                    });
                }

                this.main = new MainChart({
                    dom: this.mainDom,
                    svgBox: this.mainSvgBox,
                    wrapperBox: this.mainBox,
                    publicConfig: this
                });
                this.main.init();
            }
        }, {
            key: "initData",
            value: function initData() {
                //node size
                this.layoutNodeBox = {
                    dx: this.isVertical ? this.nodeBox.width + this.nodeBox.spaceX : this.nodeBox.height + this.nodeBox.spaceY,
                    dy: this.isVertical ? this.nodeBox.height + this.nodeBox.spaceY : this.nodeBox.width + this.nodeBox.spaceX
                }; //main box size

                this.mainBox = {
                    width: this.dom.offsetWidth,
                    height: this.dom.offsetHeight
                }; //初始root

                this.root = this.computedTree(this.treeData); //折叠处理

                this.toggleNodeLevel(this.level);
            }
        }, {
            key: "initMain",
            value: function initMain() {
                // main svg box size
                this.mainSvgBox = this.getMainSvgBox(this.level);
            }
        }, {
            key: "initThumb",
            value: function initThumb() {
                var thumbBoxW = 240;
                var thumbBoxH = thumbBoxW * this.mainSvgBox.height / this.mainSvgBox.width;
                this.thumbScale = thumbBoxW / this.mainSvgBox.width;
                this.thumbSvgBox = {
                    width: thumbBoxW,
                    height: thumbBoxH
                };
                this.thumbBox = {
                    width: thumbBoxW,
                    height: thumbBoxH
                };
                this.thumbDragBox = {
                    width: this.mainBox.width * this.thumbScale,
                    height: this.mainBox.height * this.thumbScale
                };
            }
        }, {
            key: "initDom",
            value: function initDom() {
                var _this = this;

                //main box
                this.mainDom = d3.create("div").attr("class", "svg_wrapper").style("width", this.mainBox.width + "px").style("height", this.mainBox.height + "px").style("box-sizing", "border-box").style("position", "relative").style("overflow", "hidden");
                this.dom.append(this.mainDom.node());

                if (this.openThumb) {
                    //thumb box
                    this.thumDom = d3.create("div").attr("class", "thumBox").style("width", this.thumbBox.width + "px").style("height", this.thumbBox.height + "px").style("position", "absolute").style("right", "15px").style("top", "44px").style("border-radius", "2px").style("border", "1px solid #ccc").style("overflow", "hidden").style("z-index", 1).style("background", "#fff").style("margin", "1px");
                    this.mainDom.append(function () {
                        return _this.thumDom.node();
                    });
                }
            }
        }, {
            key: "getPPTData",
            value: function getPPTData() {
                var pptData = [];
                var pptPath = [];
                var tarIndex = 0;
                this.root.descendants().map(function (node) {
                    pptData.push({
                        data: node.data,
                        x: node.x,
                        y: node.y,
                        height: node.height
                    });
                });
                this.root.links().map(function (path) {
                    var childList = path.source.children || [];

                    for (var i = 0; i < childList.length; i++) {
                        if (childList[i].id === path.target.id) {
                            tarIndex = i;
                        }
                    }

                    pptPath.push({
                        source: {
                            x: path.source.x,
                            y: path.source.y,
                            isleafpar: path.source.isleafpar || false,
                            childlen: path.source.children.length
                        },
                        target: {
                            x: path.target.x,
                            y: path.target.y,
                            tarIndex: tarIndex
                        }
                    });
                });
                return {
                    pptData: pptData,
                    pptPath: pptPath
                };
            }
        }, {
            key: "downPPT",
            value: function downPPT() {
                var config = {
                    isVertical: this.isVertical,
                    data: this.getPPTData(),
                    rect: {
                        w: this.nodeBox.width,
                        h: this.nodeBox.height
                    },
                    cardModel: this.pptmodel,
                    selectCardModel: this.selectCardModel,
                    maxBoundary: this.getBoundary(99)
                };
                var sppt = new SavePPT(config);
                sppt.down();
            }
        }, {
            key: "zoom",
            value: function zoom(k) {
                this.main.zoomGroup(k);
                this.thumb.zoomGroup(k);
            }
        }, {
            key: "toggleNodeLevel",
            value: function toggleNodeLevel() {
                var _this2 = this;

                var level = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 2;
                this.root.descendants().reverse().map(function (node) {
                    if (node.depth >= level - 1 && node.children) {
                        _this2.toggleTreeData(node);
                    }
                });
                this.diffData(this.root.descendants(), this.computedTree(this.treeData).descendants(), "toggleNode");
            }
        }, {
            key: "toggleNode",
            value: function toggleNode(node) {
                if (node._children) {
                    this.toggleTreeData(node);
                    this.diffData(this.root.descendants(), this.computedTree(this.treeData).descendants(), "toggleNode");
                    this.resetSvgBox(node);
                }

                this.toggleCallBack(node);
            }
        }, {
            key: "toggleTreeData",
            value: function toggleTreeData(currNode) {
                currNode.children = currNode.children ? null : currNode._children;
                var currNodeObj = this.objInData(currNode);

                if (currNode.children) {
                    //展开
                    currNodeObj.children = currNodeObj._children;
                } else {
                    //收缩
                    currNodeObj._children = currNodeObj.children;
                    delete currNodeObj.children;
                }
            }
        }, {
            key: "moveGroup",
            value: function moveGroup(d) {
                this.main.moveGroup(d);
                this.thumb.moveThumbPre(d); // this.thumb.moveGroup(d)
            }
        }, {
            key: "wheelGroup",
            value: function wheelGroup(d) {
                this.main.wheelGroup(d);
                this.thumb.thumbWheel(d);
            }
        }, {
            key: "dragNodeStart",
            value: function dragNodeStart(event, d) {
                this.main.dragNodeStart(event, d); // this.thumb.dragNodeStart(event, d)
            }
        }, {
            key: "dragNode",
            value: function dragNode(event, d, dragType) {
                this.main.dragNode(event, d, dragType);
                this.thumb.dragNode(event, d, dragType);
            }
        }, {
            key: "moveRange",
            value: function moveRange(param) {
                this.main.moveRange(param);
            }
        }, {
            key: "addNewNode",
            value: function addNewNode(currNode) {
                var newNodeList = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
                var currNodeObj = this.objInData(currNode);
                currNodeObj.preChildren = newNodeList.length > 0;

                if (!currNodeObj.children && !currNodeObj._children) {
                    currNodeObj.children = [];
                }

                if (!currNodeObj.children && currNodeObj._children) {
                    currNodeObj.children = currNodeObj._children;
                }

                newNodeList.map(function (newNode) {
                    currNodeObj.children.push(newNode);
                });
                this.addTreeData(this.root.descendants(), this.computedTree(this.treeData).descendants(), currNode);
                this.resetSvgBox(currNode);
            }
        }, {
            key: "getBoundary",
            value: function getBoundary(level) {
                var maxX = 0,
                    maxY = 0,
                    minX = 0,
                    minY = 0;
                this.root.descendants().map(function (node) {
                    if (node.depth < level) {
                        maxX = Math.max(node.x, maxX);
                        maxY = Math.max(node.y, maxY);
                        minX = Math.min(node.x, minX);
                        minY = Math.min(node.y, minY);
                    }
                });
                maxX = Math.max(Math.abs(minX), Math.abs(maxX));
                maxY = Math.max(Math.abs(minY), Math.abs(maxY));
                return {
                    maxX: maxX,
                    maxY: maxY
                };
            }
        }, {
            key: "getMainSvgBox",
            value: function getMainSvgBox() {
                var level = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 99;

                var _this$getBoundary = this.getBoundary(level),
                    maxX = _this$getBoundary.maxX,
                    maxY = _this$getBoundary.maxY;

                var width = Math.max(maxX * 2 + this.nodeBox.width, this.mainBox.width);
                width += 100 - (width % 100 === 0 ? 100 : width % 100);
                var height = Math.max(maxY + this.nodeBox.height, this.mainBox.height);
                height += 100 - (height % 100 === 0 ? 100 : height % 100);

                if (this.isVertical) {
                    height = Math.max(height, width * 0.3);
                } else {
                    var _ref2 = [height, width];
                    width = _ref2[0];
                    height = _ref2[1];
                    width = Math.max(width, this.mainBox.width);
                }

                return {
                    width: width,
                    height: height
                };
            }
        }, {
            key: "computedTree",
            value: function computedTree(treeData) {
                var _this3 = this;

                var data = JSON.parse(JSON.stringify(treeData));
                var root = d3.hierarchy(data); //计算坐标的副本数据

                var compareRoot = d3.hierarchy(data);
                var maxDepth = 0;
                compareRoot.descendants().forEach(function (d) {
                    maxDepth = Math.max(maxDepth, d.depth);
                }); //删除不参与计算坐标的叶子节点

                compareRoot.descendants().forEach(function (d) {
                    if (d.height === 1 && d.depth === maxDepth - 1) {
                        d.children.splice(2);
                    }
                });
                var tree = d3.tree().nodeSize([this.layoutNodeBox.dx, this.layoutNodeBox.dy]);
                tree(compareRoot);
                tree(root);
                var compareRootObj = {};
                compareRoot.descendants().forEach(function (d) {
                    compareRootObj[d.data.id] = {
                        x: d.x,
                        y: d.y
                    };
                });
                root.descendants().forEach(function (d) {
                    d.id = d.data.id;
                    d._children = d.children; // --------替换坐标------start-----------------

                    if (compareRootObj[d.data.id]) {
                        d.x = compareRootObj[d.data.id].x;
                        d.y = compareRootObj[d.data.id].y;
                    }

                    if (d.height === 1 && d.depth === maxDepth - 1) {
                        d.isleafpar = true;
                        d.children.map(function (cnode, index) {
                            if (index + 1 === d.children.length && d.children.length % 2 === 1) {
                                cnode.x = d.x;
                            } else {
                                cnode.x = d.x + (index % 2 === 0 ? -1 : 1) * _this3.layoutNodeBox.dx / 2;
                            }

                            cnode.y = d.y + _this3.layoutNodeBox.dy * Math.ceil((index + 1) / 2);
                        });
                    } // --------------end-----------------


                    if (_this3.isVertical) {
                        d.y += 50;
                    } else {
                        var _ref3 = [d.y, d.x];
                        d.x = _ref3[0];
                        d.y = _ref3[1];
                    }
                });
                root.x0 = root.x;
                root.y0 = root.y;
                return root;
            }
        }, {
            key: "compareNode",
            value: function compareNode(pNode, currNode) {
                var currParentObj = this.objInData(currNode.parent);
                var changeDataObj;

                for (var i = 0; i < currParentObj.children.length; i++) {
                    var item = currParentObj.children[i];

                    if (item.id === currNode.id) {
                        changeDataObj = currParentObj.children.splice(i, 1)[0];

                        if (currParentObj.children.length === 0) {
                            currParentObj.children = undefined;
                            currParentObj._children = currParentObj.childrens;
                        }

                        break;
                    }
                }

                var pObj = this.objInData(pNode);

                if (!pObj.children) {
                    pObj.children = [];
                }

                pObj.children.push(changeDataObj);
                this.diffData(this.root.descendants(), this.computedTree(this.treeData).descendants(), "moveNode", currNode.id, currNode.parent.id, pNode.id);
                this.resetSvgBox(currNode);
            }
        }, {
            key: "objInData",
            value: function objInData(node) {
                var treeData = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : this.treeData;
                var pids = this.getPIDs(node);
                var nodeObj = treeData;
                var pid = pids.pop();

                if (nodeObj.id === pid) {
                    while (pid = pids.pop()) {
                        nodeObj.children.map(function (item, i) {
                            if (item.id === pid) {
                                nodeObj = item;
                            }
                        });
                    }
                }

                return nodeObj;
            }
        }, {
            key: "resetSvgBox",
            value: function resetSvgBox(node) {
                var potw = 0;
                var poth = 0;

                if (this.isVertical) {
                    potw = (this.mainSvgBox.width - this.nodeBox.width) / 2;
                } else {
                    poth = (this.mainSvgBox.height - this.nodeBox.height) / 2;
                }

                this.reOffset = {
                    x: this.main.groupLoc.x - potw,
                    y: this.main.groupLoc.y - poth
                };
                this.main.upSvgBox(node);
                this.main.updateTree(node);
                this.thumb.upSvgBox(node);
                this.thumb.updateTree(node);
            }
        }, {
            key: "diffData",
            value: function diffData(oldData, newData) {
                var type = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : "moveNode";
                var currid = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : "";
                var currPid = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : "";
                var pid = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : "";
                var newObj = {};
                var oldObj = {};
                var maxDepth = 0;

                for (var i = 0; i < newData.length; i++) {
                    newObj[newData[i].id] = newData[i];
                    maxDepth = Math.max(maxDepth, newData[i].depth);
                }

                for (var _i = 0; _i < oldData.length; _i++) {
                    oldObj[oldData[_i].id] = oldData[_i];
                }

                for (var _i2 = 0; _i2 < oldData.length; _i2++) {
                    var id = oldData[_i2].id;
                    oldObj[id].height = newObj[id].height;
                    oldObj[id].depth = newObj[id].depth;
                    oldObj[id].x = newObj[id].x;
                    oldObj[id].y = newObj[id].y;
                    oldObj[id].isleafpar = false;

                    if (newObj[id].height === 1 && newObj[id].depth === maxDepth - 1) {
                        oldObj[id].isleafpar = true;
                    }
                }

                if (type === "moveNode") {
                    // change parent
                    oldObj[currid].parent = oldObj[pid];

                    if (!oldObj[pid].children) {
                        oldObj[pid].children = [];
                    }

                    oldObj[pid].children.push(oldObj[currid]);
                    oldObj[pid]._children = oldObj[pid].children;

                    for (var j = 0; j < oldObj[currPid].children.length; j++) {
                        var item = oldObj[currPid].children[j];

                        if (item.id === currid) {
                            oldObj[currPid].children.splice(j, 1);
                            oldObj[currPid]._children = oldObj[currPid].children;
                            break;
                        }
                    }
                }
            }
        }, {
            key: "getPIDs",
            value: function getPIDs(node) {
                var pIDs = [];
                pIDs.push(node.id);

                while (node = node.parent) {
                    pIDs.push(node.id);
                }

                return pIDs;
            }
        }, {
            key: "addTreeData",
            value: function addTreeData(oldData, newData, currNode) {
                var oldObj = {};

                for (var i = 0; i < oldData.length; i++) {
                    oldObj[oldData[i].id] = oldData[i];
                }

                for (var _i3 = 0; _i3 < newData.length; _i3++) {
                    var id = newData[_i3].id;

                    if (!oldObj[id]) {
                        if (newData[_i3].depth === currNode.depth + 1) {
                            if (!currNode.children) {
                                currNode.children = [];
                            }

                            currNode.children.push(newData[_i3]);
                            newData[_i3].parent = currNode;
                            currNode._children = currNode.children;
                            newData[_i3]._children = newData[_i3].children;
                        }
                    }

                    if (oldObj[id]) {
                        oldObj[id].height = newData[_i3].height;
                        oldObj[id].depth = newData[_i3].depth;
                        oldObj[id].x = newData[_i3].x;
                        oldObj[id].y = newData[_i3].y;
                        oldObj[id].isleafpar = newData[_i3].isleafpar;
                    }
                }
            }
        }, {
            key: "setCardModel",
            value: function setCardModel(cardModel) {
                var res = [];
                var keys = Object.keys(cardModel);
                keys.map(function (key) {
                    cardModel[key].map(function (item) {
                        item.key = key;
                        res.push(item);
                    });
                });
                return res;
            }
        }]);

        return ChartObj;
    }();

    var TreeChart = /*#__PURE__*/ function () {
        "use strict";

        function TreeChart() {
            var _ref4 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
                svgBox = _ref4.svgBox,
                wrapperBox = _ref4.wrapperBox,
                _ref4$scale = _ref4.scale,
                scale = _ref4$scale === void 0 ? 1 : _ref4$scale,
                dom = _ref4.dom,
                publicConfig = _ref4.publicConfig;

            _classCallCheck(this, TreeChart);

            this.data = publicConfig.treeData;
            this.root = publicConfig.root;
            this.publicConfig = publicConfig;
            this.isVertical = publicConfig.isVertical;
            this.nodeBox = publicConfig.nodeBox;
            this.theme = publicConfig.theme;
            this.params = {
                dom: dom,
                scale: scale
            };
            this.svgBox = svgBox;
            this.wrapperBox = wrapperBox;
        }

        _createClass(TreeChart, [{
            key: "init",
            value: function init() {
                var _this4 = this;

                this.params.dom.append(function () {
                    return _this4.initChart();
                });
            }
        }, {
            key: "updateTree",
            value: function updateTree(currNode) {
                this.initNodesLinks();
                this.initPaint(currNode, 500);
            }
        }, {
            key: "initNodesLinks",
            value: function initNodesLinks() {
                var _this5 = this;

                this.nodes = this.root.descendants().reverse().filter(function (node) {
                    node.data.lineType = _this5.publicConfig.boxLine(node);
                    node.data.pathType = _this5.publicConfig.pathLine(node);
                    return node.id == 0 || !!node.id;
                });
                this.links = this.root.links();
            }
        }, {
            key: "locSvgGroup",
            value: function locSvgGroup() {
                this.svg.style("width", this.svgBox.width + "px").style("height", this.svgBox.height + "px").style("transform", "translate(".concat(this.svgBox.translateX, "px,").concat(this.svgBox.translateY, "px)")); //架构图group

                this.group.attr("transform", "translate(" + this.groupLoc.x + "," + this.groupLoc.y + ") scale(" + this.groupLoc.k + ")");
            }
        }, {
            key: "paintCardInfo",
            value: function paintCardInfo(node, g) {
                var _this6 = this;

                var key = this.publicConfig.selectCardModel(node);
                this.publicConfig.cardModel.map(function (config, index) {
                    if (config.key === key) {
                        var res = _this6.appendDom(node, config, index, key);

                        g.append(res.node());

                        if (typeof config.bind === "function") {
                            res.on(config.on || "click", function () {
                                return config.bind(node);
                            });
                        }
                    }
                });
            }
        }, {
            key: "zoomGroup",
            value: function zoomGroup(k) {
                console.log("zoomGroup");
                this.groupLoc.k = this.params.scale * k;
                this.group.attr('transform', 'translate(' + this.groupLoc.x + ',' + this.groupLoc.y + ') scale(' + this.groupLoc.k + ')');
            }
        }, {
            key: "initElbow",
            value: function initElbow(currNode) {
                // 初始连线，根节点 => 根节点 （画一个点，不画线）
                if (!currNode.x0) {
                    currNode.x0 = currNode.x;
                }

                if (!currNode.y0) {
                    currNode.y0 = currNode.y;
                } // let [sourceX, sourceY] = this.isVertical ? [currNode.x0 + this.nodeBox.width / 2, currNode.y0 + this.nodeBox.height] : [currNode.x0 + this.nodeBox.width, currNode.y0 + this.nodeBox.height / 2]


                var sourceX = currNode.x0 + this.nodeBox.width / 2,
                    sourceY = currNode.y0 + this.nodeBox.height / 2;
                return this.isVertical ? 'M' + sourceX + ',' + sourceY + ' V' + sourceY + ' H' + sourceX + ' V' + sourceY : 'M' + sourceX + ',' + sourceY + ' H' + sourceX + ' V' + sourceY + ' H' + sourceX;
            }
        }, {
            key: "elbow",
            value: function elbow(d) {
                // let [sourceX, sourceY] = this.isVertical ? [d.source.x + this.nodeBox.width / 2, d.source.y + this.nodeBox.height/2] : [d.source.x + this.nodeBox.width, d.source.y + this.nodeBox.height / 2]
                // let [targetX, targetY] = this.isVertical ? [d.target.x + this.nodeBox.width / 2, d.target.y] : [d.target.x, d.target.y + this.nodeBox.height / 2]
                var sourceX = d.source.x + this.nodeBox.width / 2,
                    sourceY = d.source.y + this.nodeBox.height / 2;
                var targetX = d.target.x + this.nodeBox.width / 2,
                    targetY = d.target.y + this.nodeBox.height / 2;

                if (d.source.isleafpar) {
                    return this.isVertical ? 'M' + sourceX + ',' + sourceY + ' V' + targetY + ' H' + targetX + ' V' + targetY : 'M' + sourceX + ',' + sourceY + ' H' + targetX + ' V' + targetY + ' H' + targetX;
                } else {
                    return this.isVertical ? 'M' + sourceX + ',' + sourceY + ' V' + ((targetY - sourceY) / 2 + sourceY) + ' H' + targetX + ' V' + targetY : 'M' + sourceX + ',' + sourceY + ' H' + ((targetX - sourceX) / 2 + sourceX) + ' V' + targetY + ' H' + targetX;
                }
            }
        }, {
            key: "endElbow",
            value: function endElbow(currNode) {
                //折叠后的连线，折叠点 => 折叠点 （画一个点，删除线）
                // let [sourceX, sourceY] = this.isVertical ? [currNode.x + this.nodeBox.width / 2, currNode.y + this.nodeBox.height] : [currNode.x + this.nodeBox.width, currNode.y + this.nodeBox.height / 2]
                var sourceX = currNode.x + this.nodeBox.width / 2,
                    sourceY = currNode.y + this.nodeBox.height / 2;
                return this.isVertical ? 'M' + sourceX + ',' + sourceY + ' V' + sourceY + ' H' + sourceX + ' V' + sourceY : 'M' + sourceX + ',' + sourceY + ' H' + sourceX + ' V' + sourceY + ' H' + sourceX;
            }
        }, {
            key: "getTxtLoc",
            value: function getTxtLoc(config) {
                var x = 0;
                var y = 0;

                if (typeof config.x === "string") {
                    x = this.nodeBox.width * (parseInt(config.x) / 100);
                } else {
                    x = config.x;
                }

                if (typeof config.y === "string") {
                    y = this.nodeBox.height * (parseInt(config.y) / 100);
                } else {
                    y = config.y;
                }

                return {
                    x: x,
                    y: y
                };
            }
        }, {
            key: "getTxtNums",
            value: function getTxtNums(fontSize, config, x, y) {
                var wMode = config.wMode || "lr";

                if (wMode === "lr") {
                    return Math.floor((this.nodeBox.width - x) / fontSize);
                } else {
                    return Math.floor((this.nodeBox.height - y) / (fontSize + 1) - 1);
                }
            }
        }, {
            key: "getTxtFill",
            value: function getTxtFill(config, d) {
                var fill = "#000";

                if (typeof config.fill === "function") {
                    fill = config.fill(d.data);
                } else {
                    fill = config.fill;
                }

                return fill;
            }
        }]);

        return TreeChart;
    }();

    var MainChart = /*#__PURE__*/ function (_TreeChart) {
        "use strict";

        _inherits(MainChart, _TreeChart);

        var _super = _createSuper(MainChart);

        function MainChart() {
            var _this7;

            var _ref5 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
                svgBox = _ref5.svgBox,
                wrapperBox = _ref5.wrapperBox,
                _ref5$scale = _ref5.scale,
                scale = _ref5$scale === void 0 ? 1 : _ref5$scale,
                dom = _ref5.dom,
                publicConfig = _ref5.publicConfig;

            _classCallCheck(this, MainChart);

            _this7 = _super.call(this, {
                svgBox: svgBox,
                wrapperBox: wrapperBox,
                scale: scale,
                dom: dom,
                publicConfig: publicConfig
            }); //-------------------------------

            _this7.layoutNodeBox = publicConfig.dobj;
            _this7.selectId = null;
            _this7.maxScale = 1.25;
            _this7.minScale = 0.5;
            _this7.paintNodeInfoTime = 0;
            _this7.moveGroupStep = {
                x: 0,
                y: 0
            };

            _this7.initData();

            return _this7;
        }

        _createClass(MainChart, [{
            key: "initData",
            value: function initData() {
                //svg box loc, group loc
                if (this.publicConfig.isVertical) {
                    this.svgBox.translateX = -(this.svgBox.width - this.wrapperBox.width) / 2;
                    this.svgBox.translateY = 0;
                    this.groupLoc = {
                        x: (this.svgBox.width - this.nodeBox.width * this.params.scale) / 2,
                        y: 0,
                        k: this.params.scale
                    };
                } else {
                    this.svgBox.translateX = 0;
                    this.svgBox.translateY = -(this.svgBox.height - this.wrapperBox.height) / 2;
                    this.groupLoc = {
                        x: 0,
                        y: (this.svgBox.height - this.nodeBox.height * this.params.scale) / 2,
                        k: this.params.scale
                    };
                }
            }
        }, {
            key: "initChart",
            value: function initChart() {
                this.svg = d3.create("svg").style("background", this.theme.svg.fill).style("user-select", "none");
                this.group = this.svg.append("g");
                this.locSvgGroup(); //卡片阴影标签

                this.piantFilter(this.svg, "rbFilter", "0 0 0 0 0.2 0 0 0 0 0.2 0 0 0 0 0.2 0 0 0 1 0"); //绑定svg的zoom click事件

                this.bindSvgEvent(this.svg); //连线

                this.gLink = this.group.append("g").attr("fill", "none").attr("stroke", this.theme.line.normalColor).attr("stroke-opacity", 1).attr("stroke-width", this.theme.line.width); //节点

                this.gNode = this.group.append("g").attr("cursor", "pointer").attr("pointer-events", "all");
                this.updateTree(this.root);
                return this.svg.node();
            }
        }, {
            key: "initPaint",
            value: function initPaint(currNode) {
                var _this8 = this;

                var duration = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 500;
                var transition = this.group.transition().duration(duration);
                this.node = this.gNode.selectAll("g").data(this.nodes, function (d) {
                    return d.id;
                });
                this.nodeEnter = this.node.enter().append("g").attr("transform", "translate(".concat(currNode.x0, ",").concat(currNode.y0, ")"));
                this.nodeUpdate = this.node.merge(this.nodeEnter);
                this.nodeUpdate.transition(transition).attr("transform", function (d) {
                    return "translate(".concat(d.x, ",").concat(d.y, ")");
                }).attr("fill-opacity", 1).attr("stroke-opacity", 1);
                this.nodeUpdate.select("rect.bgrect").attr("class", function (d) {
                    return d.id === _this8.selectId ? "selectedRect" : "";
                }).attr("fill", function (d) {
                    return d.fillColor || _this8.publicConfig.theme.card.bdColor;
                }).attr("stroke", function (d) {
                    return d.id === _this8.selectId ? "#308AF0" : d.data.lineType ? "#ccc" : '#eee';
                }); //卡片信息绘制

                this.paintRun(); //卡片文字排版

                this.textLayout(); //group绑定拖拽

                this.bindDrag(); //折叠按钮绑定更新

                this.updateToggle(); //节点收缩或移除

                this.node.exit().transition(transition).remove().attr("transform", "translate(".concat(currNode.x, ",").concat(currNode.y, ")")).attr("fill-opacity", 0).attr("stroke-opacity", 0); //连线

                this.paintLinkLine(currNode);
                this.root.eachBefore(function (d) {
                    d.x0 = d.x;
                    d.y0 = d.y;
                });
            }
        }, {
            key: "paintLinkLine",
            value: function paintLinkLine(currNode) {
                var _this9 = this;

                var duration = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 500;
                var transition = this.group.transition().duration(duration);
                var link = this.gLink.selectAll("path").data(this.links, function (d) {
                    return d.target.id;
                });
                this.linkEnter = link.enter().append("path").attr("cursor", "move").attr("stroke", function (l) {
                    return l.target.data.pathType ? _this9.theme.line.dottedColor : _this9.theme.line.normalColor;
                }).attr("stroke-width", this.theme.line.width).attr("stroke-dasharray", function (l) {
                    return l.target.data.pathType ? "1 0 1" : "";
                }).attr("d", this.initElbow(currNode));
                this.linkupdate = link.merge(this.linkEnter);
                this.linkupdate.transition(transition).attr("d", function (d) {
                    return _this9.elbow(d);
                });
                link.exit().transition(transition).remove().attr("d", this.endElbow(currNode));
            } //幕布事件

        }, {
            key: "bindSvgEvent",
            value: function bindSvgEvent(svg) {
                var _this10 = this;

                var currK = 1;
                var realK = 1;
                var preK = 1;
                svg.call(d3.zoom().on("zoom", function () {
                    var d = d3.event;

                    if (d.sourceEvent.type === "mousemove") {
                        _this10.publicConfig.moveGroup(d);
                    }

                    if (d.sourceEvent.type === "wheel") {
                        if (d.transform.k > currK) {
                            realK += 0.25;
                            realK = Math.min(realK, _this10.maxScale);
                        } else {
                            realK -= 0.25;
                            realK = Math.max(realK, _this10.minScale);
                        }

                        currK = d.transform.k;

                        if (preK !== realK) {
                            preK = realK;

                            _this10.publicConfig.wheelGroup(realK);
                        }
                    }
                })).on("dblclick.zoom", function () {}).on("click.zoom", function () {
                    var isSvg = d3.event.target.localName === "svg";

                    if (isSvg) {
                        _this10.selectId = null;
                        d3.select("rect.selectedRect").attr("stroke", function (node) {
                            return node.data.lineType ? "#ccc" : '#eee';
                        }).attr("class", "");
                    }
                });
            } //渲染范围

        }, {
            key: "isInPaintView",
            value: function isInPaintView(node) {
                if (this.publicConfig.isVertical) {
                    this.groupPot = {
                        x: (this.svgBox.width - this.nodeBox.width * this.params.scale) / 2,
                        y: 0
                    };
                } else {
                    this.groupPot = {
                        x: 0,
                        y: (this.svgBox.height - this.nodeBox.height * this.params.scale) / 2
                    };
                }

                var isin = true;
                var minX = -this.publicConfig.mainBox.width * 0.7;
                var maxX = this.publicConfig.mainBox.width * (this.isVertical ? 0.7 : 0.9);
                var minY = -this.publicConfig.mainBox.height * (this.isVertical ? 0.2 : 1.2);
                var maxY = this.publicConfig.mainBox.height * 1.2; //groupPot也是变动的

                var flagX = node.x * this.groupLoc.k + (this.groupLoc.x - this.groupPot.x);
                var flagY = node.y * this.groupLoc.k + (this.groupLoc.y - this.groupPot.y);
                isin = flagX > minX && flagX < maxX && flagY > minY && flagY < maxY;
                return isin;
            } //绘制卡片信息,节流处理

        }, {
            key: "paintNodeInfoPreTime",
            value: function paintNodeInfoPreTime() {
                var _this11 = this;

                var flagTxtLayout = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
                var st;

                if (st) {
                    clearTimeout(st);
                }

                if (new Date() - 300 > this.paintNodeInfoTime) {
                    this.paintRun(flagTxtLayout);
                } else {
                    st = setTimeout(function () {
                        _this11.paintRun(flagTxtLayout);
                    }, 10);
                }
            }
        }, {
            key: "paintRun",
            value: function paintRun() {
                var flagTxtLayout = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
                console.log("piant run");
                this.paintNodeInfoTime = new Date(); //渲染新进入视图节点

                this.paintNodeInfo();

                if (flagTxtLayout) {
                    //文字重新布局
                    this.textLayout();
                } //折叠按钮重新布局


                this.updateToggle();
            }
        }, {
            key: "paintNodeInfo",
            value: function paintNodeInfo() {
                var _this12 = this;

                this.nodeUpdate._groups[0].map(function (g) {
                    var d = g.__data__;

                    if (_this12.isInPaintView(d)) {
                        if (g.childNodes.length <= 0) {
                            // 添加背景板
                            _this12.paintRect(d, g); //添加折叠按钮


                            _this12.paintToggle(d, g); // 添加卡片内容


                            _this12.paintCardInfo(d, g);
                        }
                    } else {
                        if (g.childNodes.length > 0) {
                            g.innerHTML = "";
                        }
                    }
                });
            }
        }, {
            key: "paintRect",
            value: function paintRect(node, g) {
                var _this13 = this;

                var bgrect = d3.create("svg:rect").attr("width", this.nodeBox.width - 1).attr("height", this.nodeBox.height - 1).attr("rx", "4px").attr("fill", this.publicConfig.theme.card.bdColor).attr("filter", "url(#rbFilter)").attr("opacity", node.lineType ? "0" : '1');
                g.append(bgrect.node());
                var rect = d3.create("svg:rect").attr("width", this.nodeBox.width).attr("height", this.nodeBox.height).attr("class", "bgrect").attr("rx", "4px").attr("fill-opacity", "1").attr("fill", this.publicConfig.theme.card.bdColor).attr("stroke", node.data.lineType ? "#ccc" : '#eee').attr("stroke-dasharray", node.data.lineType ? "0 2" : '').attr("stroke-linecap", "round").attr("stroke-width", 1).on("click", function () {
                    _this13.selectId = node.id;
                    d3.select("rect.selectedRect").attr("stroke", node.data.lineType ? "#ccc" : '#eee').attr("class", "");
                    rect.attr("class", "selectedRect").attr("stroke", "#308AF0");
                });
                rect.node().__data__ = node;
                g.append(rect.node());
            }
        }, {
            key: "piantFilter",
            value: function piantFilter(svg, id, matrixValue) {
                var def = svg.append("defs");
                var bgFilter = def.append("filter").attr("id", id).attr("x", "0").attr("y", "0");
                bgFilter.append("feGaussianBlur").attr("in", "SourceAlpha").attr("stdDeviation", 2).attr("result", "blur");
                bgFilter.append("feOffset").attr("in", "blur").attr("dx", 1).attr("dy", 1).attr("result", "offsetBlur");
                var feMerge = bgFilter.append("feMerge");
                feMerge.append("feMergeNode").attr("in", "offsetBlur");
                feMerge.append("feMergeNode").attr("in", "SourceGraphic");
                bgFilter.append("feColorMatrix").attr("type", "matrix").attr("values", matrixValue);
                return bgFilter;
            } //绘制折叠按钮

        }, {
            key: "paintToggle",
            value: function paintToggle(node, g) {
                var _this14 = this;

                var cx = this.publicConfig.isVertical ? this.nodeBox.width / 2 : this.nodeBox.width;
                var cy = this.publicConfig.isVertical ? this.nodeBox.height : this.nodeBox.height / 2;
                var scale = this.getFontSizeScale();
                var c = d3.create("svg:circle").attr("r", 7).attr("cx", cx).attr("cy", cy).attr("class", "tcircle").attr("fill", "#fff").attr("stroke", "#333").attr("fill-opacity", node._children || this.publicConfig.flagToggle(node) ? 1 : 0).attr("stroke-opacity", node._children || this.publicConfig.flagToggle(node) ? 1 : 0).attr("r", 7 / scale);
                c.node().__data__ = node;
                g.append(c.node());
                var preFlag = this.publicConfig.flagToggle(node);
                var t = d3.create("svg:text").on("click", function (node) {
                    return _this14.publicConfig.toggleNode(node);
                }).text("-").attr("x", cx - 3).attr("y", cy + 3).attr("class", "coll").attr("fill", "#000").attr("font-size", 16).text(function () {
                    return node._children ? node.children ? "-" : "+" : preFlag ? "+" : "";
                }).attr("font-size", 16 / scale).attr("x", function () {
                    return node._children ? node.children ? cx - 3.5 / scale : cx - 5.7 / scale : cx - 5.7 / scale;
                }).attr("y", cy + 4.3 / scale).attr("fill-opacity", function () {
                    return node._children || preFlag ? 1 : 0;
                });
                t.node().__data__ = node;
                g.append(t.node());
            }
        }, {
            key: "updateToggle",
            value: function updateToggle() {
                var _this15 = this;

                var cx = this.publicConfig.isVertical ? this.nodeBox.width / 2 : this.nodeBox.width;
                var cy = this.publicConfig.isVertical ? this.nodeBox.height : this.nodeBox.height / 2;
                var scale = this.getFontSizeScale();
                this.nodeUpdate.selectAll("text.coll").text(function (d) {
                    var preFlag = _this15.publicConfig.flagToggle(d);

                    return d._children ? d.children ? "-" : "+" : preFlag ? "+" : "";
                }).attr("font-size", 16 / scale).attr("x", function (d) {
                    return d._children ? d.children ? cx - 3.5 / scale : cx - 5.7 / scale : cx - 5.7 / scale;
                }).attr("y", cy + 4.3 / scale).attr("fill-opacity", function (d) {
                    return d._children || _this15.publicConfig.flagToggle(d) ? 1 : 0;
                });
                this.nodeUpdate.selectAll(".tcircle").attr("fill-opacity", function (d) {
                    return d._children || _this15.publicConfig.flagToggle(d) ? 1 : 0;
                }).attr("stroke-opacity", function (d) {
                    return d._children || _this15.publicConfig.flagToggle(d) ? 1 : 0;
                }).attr("r", 7 / scale);
            }
        }, {
            key: "upSvgBox",
            value: function upSvgBox() {
                var newSvgBox = this.publicConfig.getMainSvgBox(this.level);

                if (newSvgBox.width !== this.svgBox.width || newSvgBox.height !== this.svgBox.height) {
                    this.svgBox.width = newSvgBox.width;
                    this.svgBox.height = newSvgBox.height; // ----------start--------

                    if (this.publicConfig.isVertical) {
                        this.svgBox.translateX = -(this.svgBox.width - this.wrapperBox.width) / 2;
                        this.svgBox.translateY = 0;
                        this.groupLoc.x = (this.svgBox.width - this.nodeBox.width * this.params.scale) / 2;
                        this.groupLoc.y = 0;
                    } else {
                        this.svgBox.translateX = 0;
                        this.svgBox.translateY = -(this.svgBox.height - this.wrapperBox.height) / 2;
                        this.groupLoc.x = 0;
                        this.groupLoc.y = (this.svgBox.height - this.nodeBox.height * this.params.scale) / 2;
                    }

                    this.groupLoc.x += this.publicConfig.reOffset.x * this.params.scale;
                    this.groupLoc.y += this.publicConfig.reOffset.y * this.params.scale; // ----------end----------

                    this.locSvgGroup();
                }
            }
        }, {
            key: "textLayout",
            value: function textLayout() {
                var _this16 = this;

                // 文字排版
                this.publicConfig.cardModel.map(function (config, index) {
                    if (config.tag === "text") {
                        var scale = _this16.getFontSizeScale(config.fontSize);

                        var wMode = config.wMode || "lr";
                        var fontSize = config.fontSize / scale;
                        var lineNums = config.lineNums || 1;

                        var _this16$getTxtLoc = _this16.getTxtLoc(config),
                            x = _this16$getTxtLoc.x,
                            y = _this16$getTxtLoc.y;

                        _this16.nodeUpdate.selectAll("." + config.tag + index).text(function (d, index, nodeList) {
                            lineNums = Math.min(Math.floor(_this16.nodeBox.height / fontSize), lineNums);
                            var allTxt = nodeList[index].attributes.allTxt.nodeValue;

                            var txtArr = _this16.computedTxt(allTxt, fontSize, config, x, y, lineNums);

                            var flag = _this16.getTxtFlag(nodeList, lineNums, fontSize, wMode, x, y, index, scale).flag;

                            return flag ? txtArr[index] : "";
                        }).attr("y", function (d, index, nodeList) {
                            if (wMode === "lr") {
                                var textOffset = y / (scale < 1 ? scale : 1) + config.fontSize * index / scale;

                                var _this16$getTxtFlag = _this16.getTxtFlag(nodeList, lineNums, fontSize, wMode, x, y, index, scale),
                                    flag = _this16$getTxtFlag.flag,
                                    alignOffset = _this16$getTxtFlag.alignOffset;

                                return textOffset + alignOffset;
                            }

                            if (wMode === "tb") {
                                return y;
                            }
                        }).attr("x", function (d, index, nodeList) {
                            if (wMode === "tb") {
                                var textOffset = x / (scale < 1 ? scale : 1) + config.fontSize * index / scale;

                                var alignOffset = _this16.getTxtFlag(nodeList, lineNums, fontSize, wMode, x, y, index, scale).alignOffset;

                                return textOffset + alignOffset;
                            }

                            if (wMode === "lr") {
                                return x;
                            }
                        }).attr("font-size", fontSize);
                    }
                });
            }
        }, {
            key: "nodeTxtLayout",
            value: function nodeTxtLayout(txtArr, config, wMode, fontSize, scale, x, y, index) {
                var lineNums = config.lineNums || 1;
                var currY = y;
                var currX = x;

                var _this$getTxtFlag = this.getTxtFlag(txtArr, lineNums, fontSize, wMode, x, y, index, scale),
                    flag = _this$getTxtFlag.flag,
                    alignOffset = _this$getTxtFlag.alignOffset;

                if (wMode === "tb") {
                    var textOffset = x / (scale < 1 ? scale : 1) + config.fontSize * index / scale;

                    if (!flag && alignOffset > 0) {
                        alignOffset = 0;
                    }

                    currX = textOffset + alignOffset;
                }

                if (wMode === "lr") {
                    var _textOffset = y / (scale < 1 ? scale : 1) + config.fontSize * index / scale;

                    if (!flag && alignOffset > 0) {
                        alignOffset = 0;
                    }

                    currY = _textOffset + alignOffset;
                }

                return {
                    currX: currX,
                    currY: currY,
                    currtxt: flag ? txtArr[index] : ""
                };
            }
        }, {
            key: "getFontSizeScale",
            value: function getFontSizeScale() {
                var fontSize = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 14;
                fontSize += 2;
                var scale = this.groupLoc.k > 5 ? 5 : this.groupLoc.k < 0.5 ? 0.5 : this.groupLoc.k;
                var scalex = scale * this.nodeBox.width < fontSize ? fontSize / this.nodeBox.width : scale;
                var scaley = scale * this.nodeBox.height < fontSize ? fontSize / this.nodeBox.height : scale;
                return Math.max(scale, scalex, scaley);
            }
        }, {
            key: "getTxtFlag",
            value: function getTxtFlag(nodeList, lineNums, fontSize, wMode, x, y, index, scale) {
                //该行文字与原坐标的偏移距离
                //处理文字换行，居中
                var alignOffset = lineNums >= 2 ? (lineNums - nodeList.length) / 2 * (fontSize + 2 / scale) : 0;
                var flag = true; //flag 改行文字是否显示
                //缩放后的框，空间不足，需要自适应布局

                if (wMode === "lr") {
                    var currY = y + alignOffset + fontSize * index;
                    var currHeight = this.nodeBox.height * scale;
                    flag = currY <= currHeight;
                }

                if (wMode === "tb") {
                    var currX = x + alignOffset + fontSize * index;
                    var currWidth = this.nodeBox.width * scale;
                    flag = currX <= currWidth;
                }

                if (!flag && alignOffset > 0) {
                    flag = true;
                }

                return {
                    flag: flag,
                    alignOffset: alignOffset
                };
            }
        }, {
            key: "moveGroup",
            value: function moveGroup(d) {
                this.moveRange({
                    translateX: d.sourceEvent.movementX * this.params.scale,
                    translateY: d.sourceEvent.movementY * this.params.scale
                });
            }
        }, {
            key: "moveRange",
            value: function moveRange(param) {
                this.groupLoc.x += param.translateX;
                this.groupLoc.y += param.translateY;
                this.group.attr('transform', 'translate(' + this.groupLoc.x + ',' + this.groupLoc.y + ')   scale(' + this.groupLoc.k + ')'); // 节流操作:加载即将进入视图区的节点

                this.moveGroupStep.x += Math.abs(param.translateX);
                this.moveGroupStep.y += Math.abs(param.translateY);

                if (this.moveGroupStep.x > this.publicConfig.mainBox.width * 0.2 || this.moveGroupStep.y > this.publicConfig.mainBox.height * 0.2) {
                    this.moveGroupStep.x = 0;
                    this.moveGroupStep.y = 0;
                    this.paintNodeInfoPreTime(false);
                }
            } // 滚轮

        }, {
            key: "wheelGroup",
            value: function wheelGroup(k) {
                console.log("wheelGroup");
                this.groupLoc.k = k * this.params.scale;
                this.group.attr('transform', 'translate(' + this.groupLoc.x + ',' + this.groupLoc.y + ') scale(' + this.groupLoc.k + ')');
                this.paintNodeInfoPreTime();
            }
        }, {
            key: "dragNodeStart",
            value: function dragNodeStart(event, d) {
                this.diffBoxX = event.sourceEvent.offsetX / this.groupLoc.k - d.x;
                this.diffBoxY = event.sourceEvent.offsetY / this.groupLoc.k - d.y;
            }
        }, {
            key: "dragNode",
            value: function dragNode(event, d, dragType) {
                if (dragType === 2) {
                    d.x1 = (event.sourceEvent.offsetX / this.groupLoc.k - this.diffBoxX) * this.params.scale;
                    d.y1 = (event.sourceEvent.offsetY / this.groupLoc.k - this.diffBoxY) * this.params.scale;
                }

                this.moveNode(d, dragType, event);
            }
        }, {
            key: "moveNode",
            value: function moveNode(currNode, dragType, event) {
                var _this17 = this;

                if (dragType === 2) {
                    currNode.x = currNode.x1;
                    currNode.y = currNode.y1;

                    this.nodeUpdate._groups[0].map(function (node) {
                        var data = node.__data__;

                        if (data.id === currNode.id) {
                            node.setAttribute("transform", "translate(".concat(currNode.x, ",").concat(currNode.y, ")"));
                        }
                    });

                    this.linkupdate._groups[0].map(function (path) {
                        var data = path.__data__;

                        if (data.source.id === currNode.id || data.target.id === currNode.id) {
                            path.setAttribute("d", _this17.elbow(data));
                        }
                    });
                }
            } //节点拖拽

        }, {
            key: "bindDrag",
            value: function bindDrag() {
                var _this18 = this;

                this.nodeUpdate.call(d3.drag().on("start", function (d) {
                    _this18.dragNodeStep = 0;
                    _this18.dragNodeSt = null;

                    _this18.publicConfig.dragNodeStart(d3.event, d);
                }).on("drag", function (d) {
                    if (_this18.dragNodeSt) {
                        clearTimeout(_this18.dragNodeSt);
                    }

                    _this18.dragNodeStep++;

                    if (_this18.dragNodeStep >= 3) {
                        _this18.dragNodeStep = 0;

                        _this18.publicConfig.dragNode(d3.event, d, 2);
                    } else {
                        var event = d3.event;
                        _this18.dragNodeSt = setTimeout(function () {
                            _this18.dragNodeStep = 0;

                            _this18.publicConfig.dragNode(event, d, 2);
                        }, 10);
                    }
                }).on("end", function (d) {
                    _this18.publicConfig.dragNode(d3.event, d, 3);
                }));
            }
        }, {
            key: "appendDom",
            value: function appendDom(d, config) {
                var _this19 = this;

                var level = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
                var resDom = "";
                var className = config.tag + "" + level;

                var _this$getTxtLoc = this.getTxtLoc(config),
                    x = _this$getTxtLoc.x,
                    y = _this$getTxtLoc.y;

                switch (config.tag) {
                    case "text":
                        var scale = this.getFontSizeScale(config.fontSize);
                        var fontSize = config.fontSize / scale;
                        var wMode = config.wMode || "lr";
                        var allTxt = config.text(d.data);
                        var lineNums = config.lineNums || 1;
                        var txtArr = this.computedTxt(allTxt, fontSize, config, x, y, lineNums);
                        var fill = this.getTxtFill(config, d);
                        var text = d3.create("svg:text").attr("allTxt", allTxt).attr("config", JSON.stringify(config)).attr("style", config.style).attr("writing-mode", wMode).attr("fill", fill).attr("font-size", fontSize);

                        if (txtArr.length === 1) {
                            var _this$nodeTxtLayout = this.nodeTxtLayout(txtArr, config, wMode, fontSize, scale, x, y, 0),
                                currX = _this$nodeTxtLayout.currX,
                                currY = _this$nodeTxtLayout.currY,
                                currtxt = _this$nodeTxtLayout.currtxt;

                            text.text(currtxt).attr("x", currX).attr("y", currY).attr("class", className);
                        } else {
                            txtArr.map(function (txt, cindex) {
                                var _this19$nodeTxtLayout = _this19.nodeTxtLayout(txtArr, config, wMode, fontSize, scale, x, y, cindex),
                                    currX = _this19$nodeTxtLayout.currX,
                                    currY = _this19$nodeTxtLayout.currY,
                                    currtxt = _this19$nodeTxtLayout.currtxt;

                                text.append("svg:tspan").text(currtxt).attr("allTxt", allTxt).attr("x", currX).attr("y", currY).attr("class", className);
                            });
                        }

                        resDom = text;
                        break;

                    case "img":
                        resDom = d3.create("svg:image").attr("xlink:href", function (d) {
                            if (config.url) {
                                return config.url;
                            }

                            if (config.value) {
                                return d.data[config.value];
                            }

                            return "null";
                        }).attr("width", config.width).attr("height", config.height).attr("x", x).attr("y", y).attr("class", className);
                        break;
                }

                return resDom;
            }
        }, {
            key: "computedTxt",
            value: function computedTxt(txt, fontSize, config, x, y, lineNums) {
                var txtNums = this.getTxtNums(fontSize, config, x, y);
                txtNums = txtNums <= 0 ? 1 : txtNums;
                var len = txt.length;
                var res = [];
                var start = 0;
                lineNums--;

                while (len > txtNums) {
                    res.push(txt.slice(start, start + txtNums));
                    len -= txtNums;
                    start += txtNums;
                }

                res.push(txt.slice(start, start + txtNums));

                if (res[lineNums] && res[lineNums].length === txtNums) {
                    res[lineNums] = res[lineNums].slice(0, txtNums - 2) + "……";
                }

                return res.splice(0, lineNums + 1);
            }
        }]);

        return MainChart;
    }(TreeChart);

    var ThumbChart = /*#__PURE__*/ function (_TreeChart2) {
        "use strict";

        _inherits(ThumbChart, _TreeChart2);

        var _super2 = _createSuper(ThumbChart);

        function ThumbChart() {
            var _this20;

            var _ref6 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
                svgBox = _ref6.svgBox,
                wrapperBox = _ref6.wrapperBox,
                _ref6$thumbDragBox = _ref6.thumbDragBox,
                thumbDragBox = _ref6$thumbDragBox === void 0 ? {} : _ref6$thumbDragBox,
                _ref6$scale = _ref6.scale,
                scale = _ref6$scale === void 0 ? 1 : _ref6$scale,
                dom = _ref6.dom,
                publicConfig = _ref6.publicConfig;

            _classCallCheck(this, ThumbChart);

            _this20 = _super2.call(this, {
                svgBox: svgBox,
                wrapperBox: wrapperBox,
                scale: scale,
                dom: dom,
                publicConfig: publicConfig
            }); //-------------------------------

            _this20.thumbDragBox = thumbDragBox;
            _this20.thumbTheme = {
                card: {
                    borderColor: "#000"
                },
                line: {
                    normalColor: "#000"
                }
            };

            _this20.initData();

            return _this20;
        }

        _createClass(ThumbChart, [{
            key: "init",
            value: function init() {
                var _this21 = this;

                this.params.dom.append(function () {
                    return _this21.initChart();
                });
            }
        }, {
            key: "initData",
            value: function initData() {
                //svg box loc,group loc
                if (this.publicConfig.isVertical) {
                    this.svgBox.translateX = -(this.svgBox.width - this.wrapperBox.width) / 2;
                    this.svgBox.translateY = 0;
                    this.groupLoc = {
                        x: (this.svgBox.width - this.nodeBox.width * this.params.scale) / 2,
                        y: 0,
                        k: this.params.scale
                    };
                    this.groupPot = {
                        x: (this.svgBox.width - this.nodeBox.width * this.params.scale) / 2,
                        y: 0
                    };
                    this.dragBoxLoc = {
                        x: this.groupLoc.x,
                        y: this.groupLoc.y,
                        rx: -this.groupLoc.x + (this.wrapperBox.width - this.thumbDragBox.width) / 2,
                        ry: -this.groupLoc.y,
                        k: 1
                    };
                } else {
                    this.svgBox.translateX = 0;
                    this.svgBox.translateY = -(this.svgBox.height - this.wrapperBox.height) / 2;
                    this.groupLoc = {
                        x: 0,
                        y: (this.svgBox.height - this.nodeBox.height * this.params.scale) / 2,
                        k: this.params.scale
                    };
                    this.groupPot = {
                        x: 0,
                        y: (this.svgBox.height - this.nodeBox.height * this.params.scale) / 2
                    };
                    this.dragBoxLoc = {
                        x: this.groupLoc.x,
                        y: this.groupLoc.y,
                        rx: -this.groupLoc.x,
                        ry: -this.groupLoc.y + (this.wrapperBox.height - this.thumbDragBox.height) / 2,
                        k: 1
                    };
                }
            }
        }, {
            key: "initChart",
            value: function initChart() {
                this.svg = d3.create("svg").style("background", this.theme.svg.fill).style("user-select", "none");
                this.group = this.svg.append("g");
                this.locSvgGroup(); //缩略图 drag box

                this.paintThumbSvg(this.svg); //连线

                this.gLink = this.group.append("g").attr("fill", "none").attr("stroke", this.thumbTheme.line.normalColor).attr("stroke-width", 1); //节点

                this.gNode = this.group.append("g");
                this.updateTree(this.root);
                return this.svg.node();
            }
        }, {
            key: "initPaint",
            value: function initPaint(currNode) {
                var _this22 = this;

                var duration = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 500;
                var transition = this.group.transition().duration(duration);
                var node = this.gNode.selectAll("g").data(this.nodes, function (d) {
                    return d.id;
                });
                var nodeEnter = node.enter().append("g").attr("transform", "translate(".concat(currNode.x0, ",").concat(currNode.y0, ")")); //all nodes init location is root's(0,0)

                nodeEnter._groups[0].map(function (g) {
                    var d = g.__data__; // 添加背景板

                    _this22.paintRect(d, g); // 添加卡片内容


                    _this22.paintCardInfo(d, g);
                }); // merge is compare update and enter


                this.nodeUpdate = node.merge(nodeEnter);
                this.nodeUpdate.transition(transition).attr("transform", function (d) {
                        return "translate(".concat(d.x, ",").concat(d.y, ")");
                    }) //last truly loaction
                    .attr("fill-opacity", 1).attr("stroke-opacity", 1); //节点收缩或移除

                node.exit().transition(transition).remove().attr("transform", "translate(".concat(currNode.x, ",").concat(currNode.y, ")")).attr("fill-opacity", 0).attr("stroke-opacity", 0); //连线

                this.paintLinkLine(currNode, transition);
                this.root.eachBefore(function (d) {
                    d.x0 = d.x;
                    d.y0 = d.y;
                });
            }
        }, {
            key: "upSvgBox",
            value: function upSvgBox() {
                var newSvgBox = this.publicConfig.getMainSvgBox(this.level);

                if (newSvgBox.width !== this.svgBox.width || newSvgBox.height !== this.svgBox.height) {
                    this.params.scale = this.svgBox.width / newSvgBox.width;
                    this.svgBox.height = this.svgBox.width * newSvgBox.height / newSvgBox.width;
                    this.thumbDragBox = {
                        width: this.publicConfig.mainBox.width * this.params.scale,
                        height: this.publicConfig.mainBox.height * this.params.scale
                    }; // ----------start--------

                    if (this.publicConfig.isVertical) {
                        this.svgBox.translateX = -(this.svgBox.width - this.wrapperBox.width) / 2;
                        this.svgBox.translateY = 0;
                        this.groupLoc = {
                            x: (this.svgBox.width - this.nodeBox.width * this.params.scale) / 2,
                            y: 0,
                            k: this.params.scale
                        };
                    } else {
                        this.svgBox.translateX = 0;
                        this.svgBox.translateY = -(this.svgBox.height - this.wrapperBox.height) / 2;
                        this.groupLoc = {
                            x: 0,
                            y: (this.svgBox.height - this.nodeBox.height * this.params.scale) / 2,
                            k: this.params.scale
                        };
                    }

                    this.dragBoxLoc.x = this.groupLoc.x;
                    this.dragBoxLoc.y = this.groupLoc.y;

                    if (this.publicConfig.isVertical) {
                        this.dragBoxLoc.rx = -this.groupLoc.x + (this.wrapperBox.width - this.thumbDragBox.width) / 2 - this.publicConfig.reOffset.x * this.params.scale;
                        this.dragBoxLoc.ry = -this.groupLoc.y - this.publicConfig.reOffset.y * this.params.scale;
                    } else {
                        this.dragBoxLoc.rx = -this.groupLoc.x - this.publicConfig.reOffset.x * this.params.scale;
                        this.dragBoxLoc.ry = -this.groupLoc.y + (this.wrapperBox.height - this.thumbDragBox.height) / 2 - this.publicConfig.reOffset.y * this.params.scale;
                    } // ----------end----------


                    this.locSvgGroup();
                    this.upThumbSvg();
                }
            }
        }, {
            key: "paintThumbSvg",
            value: function paintThumbSvg(svg) {
                var _this23 = this;

                this.dragBox = svg.append("g").call(d3.drag().on("start", function () {}).on("drag", function () {
                    _this23.moveThumbRect(d3.event.dx, d3.event.dy);

                    _this23.publicConfig.moveRange({
                        translateX: d3.event.dx / _this23.params.scale * -1,
                        translateY: d3.event.dy / _this23.params.scale * -1
                    });
                }).on("end", function () {}));
                this.dragBox.append("rect").attr("class", "thumbRect").attr("cursor", "move").attr("stroke-opacity", ".4").attr("stroke", "#308AF0").attr("fill", "#ccc").attr("fill-opacity", ".5").attr("stroke-width", 1).attr("width", this.thumbDragBox.width).attr("height", this.thumbDragBox.height).attr("transform", "translate(" + this.dragBoxLoc.rx + "," + this.dragBoxLoc.ry + ")");
                this.upThumbSvg();
            }
        }, {
            key: "upThumbSvg",
            value: function upThumbSvg() {
                this.dragBox.attr("transform", "translate(" + this.dragBoxLoc.x + "," + this.dragBoxLoc.y + ")");
                d3.select("rect.thumbRect").attr("width", this.thumbDragBox.width).attr("height", this.thumbDragBox.height).attr("transform", "translate(" + this.dragBoxLoc.rx + "," + this.dragBoxLoc.ry + ")");
            }
        }, {
            key: "moveThumbPre",
            value: function moveThumbPre(d) {
                this.moveThumbRect(-d.sourceEvent.movementX * this.params.scale, -d.sourceEvent.movementY * this.params.scale);
            }
        }, {
            key: "moveThumbRect",
            value: function moveThumbRect(rx, ry) {
                this.dragBoxLoc.rx += rx;
                this.dragBoxLoc.ry += ry;
                d3.select("rect.thumbRect").attr("transform", "translate(" + this.dragBoxLoc.rx + "," + this.dragBoxLoc.ry + ")");
            }
        }, {
            key: "paintCardInfo_bak",
            value: function paintCardInfo_bak(node, g) {
                var _this24 = this;

                var key = this.publicConfig.selectCardModel(node);
                this.publicConfig.cardModel.map(function (config, index) {
                    if (config.key === key) {
                        g.append(_this24.appendDom(node, config, index, key).node());
                    }
                });
            }
        }, {
            key: "paintRect",
            value: function paintRect(node, g) {
                var rect = d3.create("svg:rect").attr("width", this.nodeBox.width).attr("height", this.nodeBox.height).attr("class", "bgrect").attr("rx", "4px").attr("fill-opacity", "1").attr("fill", this.publicConfig.theme.card.bdColor).attr("stroke", this.thumbTheme.card.borderColor).attr("stroke-dasharray", node.data.lineType ? "0 2" : '').attr("stroke-linecap", "round").attr("stroke-width", 1);
                g.append(rect.node());
            }
        }, {
            key: "paintLinkLine",
            value: function paintLinkLine(currNode, transition) {
                var _this25 = this;

                var link = this.gLink.selectAll("path").data(this.links, function (d) {
                    return d.target.id;
                });
                link.enter().append("path").attr("stroke-width", this.theme.line.width).attr("stroke", function (l) {
                    return l.target.data.pathType ? "#ccc" : "#333";
                }).attr("cursor", "move").attr("d", function () {
                    return _this25.initElbow(currNode);
                }).attr("stroke-dasharray", function (l) {
                    return l.target.data.pathType ? "1 0 1" : "";
                });
                link.merge(this.gLink.selectAll("path")).transition(transition).attr("d", function (d) {
                    return _this25.elbow(d);
                });
                link.exit().transition(transition).remove().attr("d", function () {
                    return _this25.endElbow(currNode);
                });
            }
        }, {
            key: "thumbWheel",
            value: function thumbWheel(k) {
                this.dragBoxLoc.k = 1 / k;
                this.dragBox.attr('transform', 'translate(' + this.dragBoxLoc.x + ',' + this.dragBoxLoc.y + ') scale(' + this.dragBoxLoc.k + ')');
            }
        }, {
            key: "dragNodeStart",
            value: function dragNodeStart(event, d) {}
        }, {
            key: "dragNode",
            value: function dragNode(event, d, dragType) {
                this.moveNode(d, dragType, event);
            }
        }, {
            key: "moveNode",
            value: function moveNode(currNode, dragType) {
                if (dragType === 2) {
                    this.initPaint(currNode, 10);
                }
            }
        }, {
            key: "appendDom",
            value: function appendDom(d, config) {
                var level = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 0;
                var resDom = null;

                var _this$getTxtLoc2 = this.getTxtLoc(config),
                    x = _this$getTxtLoc2.x,
                    y = _this$getTxtLoc2.y;

                switch (config.tag) {
                    case "text":
                        var fontSize = config.fontSize;
                        var wMode = config.wMode || "lr";
                        var allTxt = config.text(d.data);
                        var txtNums = this.getTxtNums(fontSize, config, x, y);
                        var showTxt = allTxt.substr(0, txtNums);
                        var fill = this.getTxtFill(config, d);
                        var text = d3.create("svg:text").attr("style", config.style).attr("writing-mode", wMode).attr("fill", fill).attr("font-size", fontSize).text(showTxt).attr("allTxt", allTxt).attr("x", x).attr("y", y);
                        resDom = text;
                        break;

                    case "img":
                        resDom = d3.create("svg:image").attr("xlink:href", function (d) {
                            if (config.url) {
                                return config.url;
                            }

                            if (config.value) {
                                return d.data[config.value];
                            }

                            return "null";
                        }).attr("width", config.width).attr("height", config.height).attr("x", x).attr("y", y);
                        break;
                }

                return resDom;
            }
        }]);

        return ThumbChart;
    }(TreeChart);

    exports.init = init;
    exports.version = version;
}))