office-viewer 0.3.13 → 0.3.15

package/lib/node_modules/echarts/lib/chart/treemap/TreemapView.js

@@ -1,817 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var tslib = require('tslib');
-var util = require('../../../../zrender/lib/core/util.js');
-require('../../util/graphic.js');
-var innerStore = require('../../util/innerStore.js');
-var states = require('../../util/states.js');
-var DataDiffer = require('../../data/DataDiffer.js');
-var treeHelper = require('../helper/treeHelper.js');
-var Breadcrumb = require('./Breadcrumb.js');
-var RoamController = require('../../component/helper/RoamController.js');
-var BoundingRect = require('../../../../zrender/lib/core/BoundingRect.js');
-var matrix = require('../../../../zrender/lib/core/matrix.js');
-var animation = require('../../util/animation.js');
-var makeStyleMapper = require('../../model/mixin/makeStyleMapper.js');
-var Chart = require('../../view/Chart.js');
-var Displayable = require('../../../../zrender/lib/graphic/Displayable.js');
-var model = require('../../util/model.js');
-var format = require('../../util/format.js');
-var labelStyle = require('../../label/labelStyle.js');
-var Group$1 = require('../../../../zrender/lib/graphic/Group.js');
-var Rect$1 = require('../../../../zrender/lib/graphic/shape/Rect.js');
-
-var Group = Group$1["default"];
-var Rect = Rect$1["default"];
-var DRAG_THRESHOLD = 3;
-var PATH_LABEL_NOAMAL = 'label';
-var PATH_UPPERLABEL_NORMAL = 'upperLabel';
-// Should larger than emphasis states lift z
-var Z2_BASE = states.Z2_EMPHASIS_LIFT * 10; // Should bigger than every z2.
-var Z2_BG = states.Z2_EMPHASIS_LIFT * 2;
-var Z2_CONTENT = states.Z2_EMPHASIS_LIFT * 3;
-var getStateItemStyle = makeStyleMapper["default"]([['fill', 'color'],
-// `borderColor` and `borderWidth` has been occupied,
-// so use `stroke` to indicate the stroke of the rect.
-['stroke', 'strokeColor'], ['lineWidth', 'strokeWidth'], ['shadowBlur'], ['shadowOffsetX'], ['shadowOffsetY'], ['shadowColor']
-// Option decal is in `DecalObject` but style.decal is in `PatternObject`.
-// So do not transfer decal directly.
-]);
-
-var getItemStyleNormal = function (model) {
-  // Normal style props should include emphasis style props.
-  var itemStyle = getStateItemStyle(model);
-  // Clear styles set by emphasis.
-  itemStyle.stroke = itemStyle.fill = itemStyle.lineWidth = null;
-  return itemStyle;
-};
-var inner = model.makeInner();
-var TreemapView = /** @class */function (_super) {
-  tslib.__extends(TreemapView, _super);
-  function TreemapView() {
-    var _this = _super !== null && _super.apply(this, arguments) || this;
-    _this.type = TreemapView.type;
-    _this._state = 'ready';
-    _this._storage = createStorage();
-    return _this;
-  }
-  /**
-   * @override
-   */
-  TreemapView.prototype.render = function (seriesModel, ecModel, api, payload) {
-    var models = ecModel.findComponents({
-      mainType: 'series',
-      subType: 'treemap',
-      query: payload
-    });
-    if (util.indexOf(models, seriesModel) < 0) {
-      return;
-    }
-    this.seriesModel = seriesModel;
-    this.api = api;
-    this.ecModel = ecModel;
-    var types = ['treemapZoomToNode', 'treemapRootToNode'];
-    var targetInfo = treeHelper.retrieveTargetInfo(payload, types, seriesModel);
-    var payloadType = payload && payload.type;
-    var layoutInfo = seriesModel.layoutInfo;
-    var isInit = !this._oldTree;
-    var thisStorage = this._storage;
-    // Mark new root when action is treemapRootToNode.
-    var reRoot = payloadType === 'treemapRootToNode' && targetInfo && thisStorage ? {
-      rootNodeGroup: thisStorage.nodeGroup[targetInfo.node.getRawIndex()],
-      direction: payload.direction
-    } : null;
-    var containerGroup = this._giveContainerGroup(layoutInfo);
-    var hasAnimation = seriesModel.get('animation');
-    var renderResult = this._doRender(containerGroup, seriesModel, reRoot);
-    hasAnimation && !isInit && (!payloadType || payloadType === 'treemapZoomToNode' || payloadType === 'treemapRootToNode') ? this._doAnimation(containerGroup, renderResult, seriesModel, reRoot) : renderResult.renderFinally();
-    this._resetController(api);
-    this._renderBreadcrumb(seriesModel, api, targetInfo);
-  };
-  TreemapView.prototype._giveContainerGroup = function (layoutInfo) {
-    var containerGroup = this._containerGroup;
-    if (!containerGroup) {
-      // FIXME
-      // 加一层containerGroup是为了clip，但是现在clip功能并没有实现。
-      containerGroup = this._containerGroup = new Group();
-      this._initEvents(containerGroup);
-      this.group.add(containerGroup);
-    }
-    containerGroup.x = layoutInfo.x;
-    containerGroup.y = layoutInfo.y;
-    return containerGroup;
-  };
-  TreemapView.prototype._doRender = function (containerGroup, seriesModel, reRoot) {
-    var thisTree = seriesModel.getData().tree;
-    var oldTree = this._oldTree;
-    // Clear last shape records.
-    var lastsForAnimation = createStorage();
-    var thisStorage = createStorage();
-    var oldStorage = this._storage;
-    var willInvisibleEls = [];
-    function doRenderNode(thisNode, oldNode, parentGroup, depth) {
-      return renderNode(seriesModel, thisStorage, oldStorage, reRoot, lastsForAnimation, willInvisibleEls, thisNode, oldNode, parentGroup, depth);
-    }
-    // Notice: When thisTree and oldTree are the same tree (see list.cloneShallow),
-    // the oldTree is actually losted, so we cannot find all of the old graphic
-    // elements from tree. So we use this strategy: make element storage, move
-    // from old storage to new storage, clear old storage.
-    dualTravel(thisTree.root ? [thisTree.root] : [], oldTree && oldTree.root ? [oldTree.root] : [], containerGroup, thisTree === oldTree || !oldTree, 0);
-    // Process all removing.
-    var willDeleteEls = clearStorage(oldStorage);
-    this._oldTree = thisTree;
-    this._storage = thisStorage;
-    return {
-      lastsForAnimation: lastsForAnimation,
-      willDeleteEls: willDeleteEls,
-      renderFinally: renderFinally
-    };
-    function dualTravel(thisViewChildren, oldViewChildren, parentGroup, sameTree, depth) {
-      // When 'render' is triggered by action,
-      // 'this' and 'old' may be the same tree,
-      // we use rawIndex in that case.
-      if (sameTree) {
-        oldViewChildren = thisViewChildren;
-        util.each(thisViewChildren, function (child, index) {
-          !child.isRemoved() && processNode(index, index);
-        });
-      }
-      // Diff hierarchically (diff only in each subtree, but not whole).
-      // because, consistency of view is important.
-      else {
-        new DataDiffer["default"](oldViewChildren, thisViewChildren, getKey, getKey).add(processNode).update(processNode).remove(util.curry(processNode, null)).execute();
-      }
-      function getKey(node) {
-        // Identify by name or raw index.
-        return node.getId();
-      }
-      function processNode(newIndex, oldIndex) {
-        var thisNode = newIndex != null ? thisViewChildren[newIndex] : null;
-        var oldNode = oldIndex != null ? oldViewChildren[oldIndex] : null;
-        var group = doRenderNode(thisNode, oldNode, parentGroup, depth);
-        group && dualTravel(thisNode && thisNode.viewChildren || [], oldNode && oldNode.viewChildren || [], group, sameTree, depth + 1);
-      }
-    }
-    function clearStorage(storage) {
-      var willDeleteEls = createStorage();
-      storage && util.each(storage, function (store, storageName) {
-        var delEls = willDeleteEls[storageName];
-        util.each(store, function (el) {
-          el && (delEls.push(el), inner(el).willDelete = true);
-        });
-      });
-      return willDeleteEls;
-    }
-    function renderFinally() {
-      util.each(willDeleteEls, function (els) {
-        util.each(els, function (el) {
-          el.parent && el.parent.remove(el);
-        });
-      });
-      util.each(willInvisibleEls, function (el) {
-        el.invisible = true;
-        // Setting invisible is for optimizing, so no need to set dirty,
-        // just mark as invisible.
-        el.dirty();
-      });
-    }
-  };
-  TreemapView.prototype._doAnimation = function (containerGroup, renderResult, seriesModel, reRoot) {
-    var durationOption = seriesModel.get('animationDurationUpdate');
-    var easingOption = seriesModel.get('animationEasing');
-    // TODO: do not support function until necessary.
-    var duration = (util.isFunction(durationOption) ? 0 : durationOption) || 0;
-    var easing = (util.isFunction(easingOption) ? null : easingOption) || 'cubicOut';
-    var animationWrap = animation.createWrap();
-    // Make delete animations.
-    util.each(renderResult.willDeleteEls, function (store, storageName) {
-      util.each(store, function (el, rawIndex) {
-        if (el.invisible) {
-          return;
-        }
-        var parent = el.parent; // Always has parent, and parent is nodeGroup.
-        var target;
-        var innerStore = inner(parent);
-        if (reRoot && reRoot.direction === 'drillDown') {
-          target = parent === reRoot.rootNodeGroup
-          // This is the content element of view root.
-          // Only `content` will enter this branch, because
-          // `background` and `nodeGroup` will not be deleted.
-          ? {
-            shape: {
-              x: 0,
-              y: 0,
-              width: innerStore.nodeWidth,
-              height: innerStore.nodeHeight
-            },
-            style: {
-              opacity: 0
-            }
-          }
-          // Others.
-          : {
-            style: {
-              opacity: 0
-            }
-          };
-        } else {
-          var targetX = 0;
-          var targetY = 0;
-          if (!innerStore.willDelete) {
-            // Let node animate to right-bottom corner, cooperating with fadeout,
-            // which is appropriate for user understanding.
-            // Divided by 2 for reRoot rolling up effect.
-            targetX = innerStore.nodeWidth / 2;
-            targetY = innerStore.nodeHeight / 2;
-          }
-          target = storageName === 'nodeGroup' ? {
-            x: targetX,
-            y: targetY,
-            style: {
-              opacity: 0
-            }
-          } : {
-            shape: {
-              x: targetX,
-              y: targetY,
-              width: 0,
-              height: 0
-            },
-            style: {
-              opacity: 0
-            }
-          };
-        }
-        // TODO: do not support delay until necessary.
-        target && animationWrap.add(el, target, duration, 0, easing);
-      });
-    });
-    // Make other animations
-    util.each(this._storage, function (store, storageName) {
-      util.each(store, function (el, rawIndex) {
-        var last = renderResult.lastsForAnimation[storageName][rawIndex];
-        var target = {};
-        if (!last) {
-          return;
-        }
-        if (el instanceof Group$1["default"]) {
-          if (last.oldX != null) {
-            target.x = el.x;
-            target.y = el.y;
-            el.x = last.oldX;
-            el.y = last.oldY;
-          }
-        } else {
-          if (last.oldShape) {
-            target.shape = util.extend({}, el.shape);
-            el.setShape(last.oldShape);
-          }
-          if (last.fadein) {
-            el.setStyle('opacity', 0);
-            target.style = {
-              opacity: 1
-            };
-          }
-          // When animation is stopped for succedent animation starting,
-          // el.style.opacity might not be 1
-          else if (el.style.opacity !== 1) {
-            target.style = {
-              opacity: 1
-            };
-          }
-        }
-        animationWrap.add(el, target, duration, 0, easing);
-      });
-    }, this);
-    this._state = 'animating';
-    animationWrap.finished(util.bind(function () {
-      this._state = 'ready';
-      renderResult.renderFinally();
-    }, this)).start();
-  };
-  TreemapView.prototype._resetController = function (api) {
-    var controller = this._controller;
-    // Init controller.
-    if (!controller) {
-      controller = this._controller = new RoamController["default"](api.getZr());
-      controller.enable(this.seriesModel.get('roam'));
-      controller.on('pan', util.bind(this._onPan, this));
-      controller.on('zoom', util.bind(this._onZoom, this));
-    }
-    var rect = new BoundingRect["default"](0, 0, api.getWidth(), api.getHeight());
-    controller.setPointerChecker(function (e, x, y) {
-      return rect.contain(x, y);
-    });
-  };
-  TreemapView.prototype._clearController = function () {
-    var controller = this._controller;
-    if (controller) {
-      controller.dispose();
-      controller = null;
-    }
-  };
-  TreemapView.prototype._onPan = function (e) {
-    if (this._state !== 'animating' && (Math.abs(e.dx) > DRAG_THRESHOLD || Math.abs(e.dy) > DRAG_THRESHOLD)) {
-      // These param must not be cached.
-      var root = this.seriesModel.getData().tree.root;
-      if (!root) {
-        return;
-      }
-      var rootLayout = root.getLayout();
-      if (!rootLayout) {
-        return;
-      }
-      this.api.dispatchAction({
-        type: 'treemapMove',
-        from: this.uid,
-        seriesId: this.seriesModel.id,
-        rootRect: {
-          x: rootLayout.x + e.dx,
-          y: rootLayout.y + e.dy,
-          width: rootLayout.width,
-          height: rootLayout.height
-        }
-      });
-    }
-  };
-  TreemapView.prototype._onZoom = function (e) {
-    var mouseX = e.originX;
-    var mouseY = e.originY;
-    if (this._state !== 'animating') {
-      // These param must not be cached.
-      var root = this.seriesModel.getData().tree.root;
-      if (!root) {
-        return;
-      }
-      var rootLayout = root.getLayout();
-      if (!rootLayout) {
-        return;
-      }
-      var rect = new BoundingRect["default"](rootLayout.x, rootLayout.y, rootLayout.width, rootLayout.height);
-      var layoutInfo = this.seriesModel.layoutInfo;
-      // Transform mouse coord from global to containerGroup.
-      mouseX -= layoutInfo.x;
-      mouseY -= layoutInfo.y;
-      // Scale root bounding rect.
-      var m = matrix.create();
-      matrix.translate(m, m, [-mouseX, -mouseY]);
-      matrix.scale(m, m, [e.scale, e.scale]);
-      matrix.translate(m, m, [mouseX, mouseY]);
-      rect.applyTransform(m);
-      this.api.dispatchAction({
-        type: 'treemapRender',
-        from: this.uid,
-        seriesId: this.seriesModel.id,
-        rootRect: {
-          x: rect.x,
-          y: rect.y,
-          width: rect.width,
-          height: rect.height
-        }
-      });
-    }
-  };
-  TreemapView.prototype._initEvents = function (containerGroup) {
-    var _this = this;
-    containerGroup.on('click', function (e) {
-      if (_this._state !== 'ready') {
-        return;
-      }
-      var nodeClick = _this.seriesModel.get('nodeClick', true);
-      if (!nodeClick) {
-        return;
-      }
-      var targetInfo = _this.findTarget(e.offsetX, e.offsetY);
-      if (!targetInfo) {
-        return;
-      }
-      var node = targetInfo.node;
-      if (node.getLayout().isLeafRoot) {
-        _this._rootToNode(targetInfo);
-      } else {
-        if (nodeClick === 'zoomToNode') {
-          _this._zoomToNode(targetInfo);
-        } else if (nodeClick === 'link') {
-          var itemModel = node.hostTree.data.getItemModel(node.dataIndex);
-          var link = itemModel.get('link', true);
-          var linkTarget = itemModel.get('target', true) || 'blank';
-          link && format.windowOpen(link, linkTarget);
-        }
-      }
-    }, this);
-  };
-  TreemapView.prototype._renderBreadcrumb = function (seriesModel, api, targetInfo) {
-    var _this = this;
-    if (!targetInfo) {
-      targetInfo = seriesModel.get('leafDepth', true) != null ? {
-        node: seriesModel.getViewRoot()
-      }
-      // FIXME
-      // better way?
-      // Find breadcrumb tail on center of containerGroup.
-      : this.findTarget(api.getWidth() / 2, api.getHeight() / 2);
-      if (!targetInfo) {
-        targetInfo = {
-          node: seriesModel.getData().tree.root
-        };
-      }
-    }
-    (this._breadcrumb || (this._breadcrumb = new Breadcrumb["default"](this.group))).render(seriesModel, api, targetInfo.node, function (node) {
-      if (_this._state !== 'animating') {
-        treeHelper.aboveViewRoot(seriesModel.getViewRoot(), node) ? _this._rootToNode({
-          node: node
-        }) : _this._zoomToNode({
-          node: node
-        });
-      }
-    });
-  };
-  /**
-   * @override
-   */
-  TreemapView.prototype.remove = function () {
-    this._clearController();
-    this._containerGroup && this._containerGroup.removeAll();
-    this._storage = createStorage();
-    this._state = 'ready';
-    this._breadcrumb && this._breadcrumb.remove();
-  };
-  TreemapView.prototype.dispose = function () {
-    this._clearController();
-  };
-  TreemapView.prototype._zoomToNode = function (targetInfo) {
-    this.api.dispatchAction({
-      type: 'treemapZoomToNode',
-      from: this.uid,
-      seriesId: this.seriesModel.id,
-      targetNode: targetInfo.node
-    });
-  };
-  TreemapView.prototype._rootToNode = function (targetInfo) {
-    this.api.dispatchAction({
-      type: 'treemapRootToNode',
-      from: this.uid,
-      seriesId: this.seriesModel.id,
-      targetNode: targetInfo.node
-    });
-  };
-  /**
-   * @public
-   * @param {number} x Global coord x.
-   * @param {number} y Global coord y.
-   * @return {Object} info If not found, return undefined;
-   * @return {number} info.node Target node.
-   * @return {number} info.offsetX x refer to target node.
-   * @return {number} info.offsetY y refer to target node.
-   */
-  TreemapView.prototype.findTarget = function (x, y) {
-    var targetInfo;
-    var viewRoot = this.seriesModel.getViewRoot();
-    viewRoot.eachNode({
-      attr: 'viewChildren',
-      order: 'preorder'
-    }, function (node) {
-      var bgEl = this._storage.background[node.getRawIndex()];
-      // If invisible, there might be no element.
-      if (bgEl) {
-        var point = bgEl.transformCoordToLocal(x, y);
-        var shape = bgEl.shape;
-        // For performance consideration, don't use 'getBoundingRect'.
-        if (shape.x <= point[0] && point[0] <= shape.x + shape.width && shape.y <= point[1] && point[1] <= shape.y + shape.height) {
-          targetInfo = {
-            node: node,
-            offsetX: point[0],
-            offsetY: point[1]
-          };
-        } else {
-          return false; // Suppress visit subtree.
-        }
-      }
-    }, this);
-    return targetInfo;
-  };
-  TreemapView.type = 'treemap';
-  return TreemapView;
-}(Chart["default"]);
-/**
- * @inner
- */
-function createStorage() {
-  return {
-    nodeGroup: [],
-    background: [],
-    content: []
-  };
-}
-/**
- * @inner
- * @return Return undefined means do not travel further.
- */
-function renderNode(seriesModel, thisStorage, oldStorage, reRoot, lastsForAnimation, willInvisibleEls, thisNode, oldNode, parentGroup, depth) {
-  // Whether under viewRoot.
-  if (!thisNode) {
-    // Deleting nodes will be performed finally. This method just find
-    // element from old storage, or create new element, set them to new
-    // storage, and set styles.
-    return;
-  }
-  // -------------------------------------------------------------------
-  // Start of closure variables available in "Procedures in renderNode".
-  var thisLayout = thisNode.getLayout();
-  var data = seriesModel.getData();
-  var nodeModel = thisNode.getModel();
-  // Only for enabling highlight/downplay. Clear firstly.
-  // Because some node will not be rendered.
-  data.setItemGraphicEl(thisNode.dataIndex, null);
-  if (!thisLayout || !thisLayout.isInView) {
-    return;
-  }
-  var thisWidth = thisLayout.width;
-  var thisHeight = thisLayout.height;
-  var borderWidth = thisLayout.borderWidth;
-  var thisInvisible = thisLayout.invisible;
-  var thisRawIndex = thisNode.getRawIndex();
-  var oldRawIndex = oldNode && oldNode.getRawIndex();
-  var thisViewChildren = thisNode.viewChildren;
-  var upperHeight = thisLayout.upperHeight;
-  var isParent = thisViewChildren && thisViewChildren.length;
-  var itemStyleNormalModel = nodeModel.getModel('itemStyle');
-  var itemStyleEmphasisModel = nodeModel.getModel(['emphasis', 'itemStyle']);
-  var itemStyleBlurModel = nodeModel.getModel(['blur', 'itemStyle']);
-  var itemStyleSelectModel = nodeModel.getModel(['select', 'itemStyle']);
-  var borderRadius = itemStyleNormalModel.get('borderRadius') || 0;
-  // End of closure ariables available in "Procedures in renderNode".
-  // -----------------------------------------------------------------
-  // Node group
-  var group = giveGraphic('nodeGroup', Group);
-  if (!group) {
-    return;
-  }
-  parentGroup.add(group);
-  // x,y are not set when el is above view root.
-  group.x = thisLayout.x || 0;
-  group.y = thisLayout.y || 0;
-  group.markRedraw();
-  inner(group).nodeWidth = thisWidth;
-  inner(group).nodeHeight = thisHeight;
-  if (thisLayout.isAboveViewRoot) {
-    return group;
-  }
-  // Background
-  var bg = giveGraphic('background', Rect, depth, Z2_BG);
-  bg && renderBackground(group, bg, isParent && thisLayout.upperLabelHeight);
-  var emphasisModel = nodeModel.getModel('emphasis');
-  var focus = emphasisModel.get('focus');
-  var blurScope = emphasisModel.get('blurScope');
-  var isDisabled = emphasisModel.get('disabled');
-  var focusOrIndices = focus === 'ancestor' ? thisNode.getAncestorsIndices() : focus === 'descendant' ? thisNode.getDescendantIndices() : focus;
-  // No children, render content.
-  if (isParent) {
-    // Because of the implementation about "traverse" in graphic hover style, we
-    // can not set hover listener on the "group" of non-leaf node. Otherwise the
-    // hover event from the descendents will be listenered.
-    if (states.isHighDownDispatcher(group)) {
-      states.setAsHighDownDispatcher(group, false);
-    }
-    if (bg) {
-      states.setAsHighDownDispatcher(bg, !isDisabled);
-      // Only for enabling highlight/downplay.
-      data.setItemGraphicEl(thisNode.dataIndex, bg);
-      states.enableHoverFocus(bg, focusOrIndices, blurScope);
-    }
-  } else {
-    var content = giveGraphic('content', Rect, depth, Z2_CONTENT);
-    content && renderContent(group, content);
-    bg.disableMorphing = true;
-    if (bg && states.isHighDownDispatcher(bg)) {
-      states.setAsHighDownDispatcher(bg, false);
-    }
-    states.setAsHighDownDispatcher(group, !isDisabled);
-    // Only for enabling highlight/downplay.
-    data.setItemGraphicEl(thisNode.dataIndex, group);
-    states.enableHoverFocus(group, focusOrIndices, blurScope);
-  }
-  return group;
-  // ----------------------------
-  // | Procedures in renderNode |
-  // ----------------------------
-  function renderBackground(group, bg, useUpperLabel) {
-    var ecData = innerStore.getECData(bg);
-    // For tooltip.
-    ecData.dataIndex = thisNode.dataIndex;
-    ecData.seriesIndex = seriesModel.seriesIndex;
-    bg.setShape({
-      x: 0,
-      y: 0,
-      width: thisWidth,
-      height: thisHeight,
-      r: borderRadius
-    });
-    if (thisInvisible) {
-      // If invisible, do not set visual, otherwise the element will
-      // change immediately before animation. We think it is OK to
-      // remain its origin color when moving out of the view window.
-      processInvisible(bg);
-    } else {
-      bg.invisible = false;
-      var style = thisNode.getVisual('style');
-      var visualBorderColor = style.stroke;
-      var normalStyle = getItemStyleNormal(itemStyleNormalModel);
-      normalStyle.fill = visualBorderColor;
-      var emphasisStyle = getStateItemStyle(itemStyleEmphasisModel);
-      emphasisStyle.fill = itemStyleEmphasisModel.get('borderColor');
-      var blurStyle = getStateItemStyle(itemStyleBlurModel);
-      blurStyle.fill = itemStyleBlurModel.get('borderColor');
-      var selectStyle = getStateItemStyle(itemStyleSelectModel);
-      selectStyle.fill = itemStyleSelectModel.get('borderColor');
-      if (useUpperLabel) {
-        var upperLabelWidth = thisWidth - 2 * borderWidth;
-        prepareText(
-        // PENDING: convert ZRColor to ColorString for text.
-        bg, visualBorderColor, style.opacity, {
-          x: borderWidth,
-          y: 0,
-          width: upperLabelWidth,
-          height: upperHeight
-        });
-      }
-      // For old bg.
-      else {
-        bg.removeTextContent();
-      }
-      bg.setStyle(normalStyle);
-      bg.ensureState('emphasis').style = emphasisStyle;
-      bg.ensureState('blur').style = blurStyle;
-      bg.ensureState('select').style = selectStyle;
-      states.setDefaultStateProxy(bg);
-    }
-    group.add(bg);
-  }
-  function renderContent(group, content) {
-    var ecData = innerStore.getECData(content);
-    // For tooltip.
-    ecData.dataIndex = thisNode.dataIndex;
-    ecData.seriesIndex = seriesModel.seriesIndex;
-    var contentWidth = Math.max(thisWidth - 2 * borderWidth, 0);
-    var contentHeight = Math.max(thisHeight - 2 * borderWidth, 0);
-    content.culling = true;
-    content.setShape({
-      x: borderWidth,
-      y: borderWidth,
-      width: contentWidth,
-      height: contentHeight,
-      r: borderRadius
-    });
-    if (thisInvisible) {
-      // If invisible, do not set visual, otherwise the element will
-      // change immediately before animation. We think it is OK to
-      // remain its origin color when moving out of the view window.
-      processInvisible(content);
-    } else {
-      content.invisible = false;
-      var nodeStyle = thisNode.getVisual('style');
-      var visualColor = nodeStyle.fill;
-      var normalStyle = getItemStyleNormal(itemStyleNormalModel);
-      normalStyle.fill = visualColor;
-      normalStyle.decal = nodeStyle.decal;
-      var emphasisStyle = getStateItemStyle(itemStyleEmphasisModel);
-      var blurStyle = getStateItemStyle(itemStyleBlurModel);
-      var selectStyle = getStateItemStyle(itemStyleSelectModel);
-      // PENDING: convert ZRColor to ColorString for text.
-      prepareText(content, visualColor, nodeStyle.opacity, null);
-      content.setStyle(normalStyle);
-      content.ensureState('emphasis').style = emphasisStyle;
-      content.ensureState('blur').style = blurStyle;
-      content.ensureState('select').style = selectStyle;
-      states.setDefaultStateProxy(content);
-    }
-    group.add(content);
-  }
-  function processInvisible(element) {
-    // Delay invisible setting utill animation finished,
-    // avoid element vanish suddenly before animation.
-    !element.invisible && willInvisibleEls.push(element);
-  }
-  function prepareText(rectEl, visualColor, visualOpacity,
-  // Can be null/undefined
-  upperLabelRect) {
-    var normalLabelModel = nodeModel.getModel(upperLabelRect ? PATH_UPPERLABEL_NORMAL : PATH_LABEL_NOAMAL);
-    var defaultText = model.convertOptionIdName(nodeModel.get('name'), null);
-    var isShow = normalLabelModel.getShallow('show');
-    labelStyle.setLabelStyle(rectEl, labelStyle.getLabelStatesModels(nodeModel, upperLabelRect ? PATH_UPPERLABEL_NORMAL : PATH_LABEL_NOAMAL), {
-      defaultText: isShow ? defaultText : null,
-      inheritColor: visualColor,
-      defaultOpacity: visualOpacity,
-      labelFetcher: seriesModel,
-      labelDataIndex: thisNode.dataIndex
-    });
-    var textEl = rectEl.getTextContent();
-    if (!textEl) {
-      return;
-    }
-    var textStyle = textEl.style;
-    var textPadding = util.normalizeCssArray(textStyle.padding || 0);
-    if (upperLabelRect) {
-      rectEl.setTextConfig({
-        layoutRect: upperLabelRect
-      });
-      textEl.disableLabelLayout = true;
-    }
-    textEl.beforeUpdate = function () {
-      var width = Math.max((upperLabelRect ? upperLabelRect.width : rectEl.shape.width) - textPadding[1] - textPadding[3], 0);
-      var height = Math.max((upperLabelRect ? upperLabelRect.height : rectEl.shape.height) - textPadding[0] - textPadding[2], 0);
-      if (textStyle.width !== width || textStyle.height !== height) {
-        textEl.setStyle({
-          width: width,
-          height: height
-        });
-      }
-    };
-    textStyle.truncateMinChar = 2;
-    textStyle.lineOverflow = 'truncate';
-    addDrillDownIcon(textStyle, upperLabelRect, thisLayout);
-    var textEmphasisState = textEl.getState('emphasis');
-    addDrillDownIcon(textEmphasisState ? textEmphasisState.style : null, upperLabelRect, thisLayout);
-  }
-  function addDrillDownIcon(style, upperLabelRect, thisLayout) {
-    var text = style ? style.text : null;
-    if (!upperLabelRect && thisLayout.isLeafRoot && text != null) {
-      var iconChar = seriesModel.get('drillDownIcon', true);
-      style.text = iconChar ? iconChar + ' ' + text : text;
-    }
-  }
-  function giveGraphic(storageName, Ctor, depth, z) {
-    var element = oldRawIndex != null && oldStorage[storageName][oldRawIndex];
-    var lasts = lastsForAnimation[storageName];
-    if (element) {
-      // Remove from oldStorage
-      oldStorage[storageName][oldRawIndex] = null;
-      prepareAnimationWhenHasOld(lasts, element);
-    }
-    // If invisible and no old element, do not create new element (for optimizing).
-    else if (!thisInvisible) {
-      element = new Ctor();
-      if (element instanceof Displayable["default"]) {
-        element.z2 = calculateZ2(depth, z);
-      }
-      prepareAnimationWhenNoOld(lasts, element);
-    }
-    // Set to thisStorage
-    return thisStorage[storageName][thisRawIndex] = element;
-  }
-  function prepareAnimationWhenHasOld(lasts, element) {
-    var lastCfg = lasts[thisRawIndex] = {};
-    if (element instanceof Group) {
-      lastCfg.oldX = element.x;
-      lastCfg.oldY = element.y;
-    } else {
-      lastCfg.oldShape = util.extend({}, element.shape);
-    }
-  }
-  // If a element is new, we need to find the animation start point carefully,
-  // otherwise it will looks strange when 'zoomToNode'.
-  function prepareAnimationWhenNoOld(lasts, element) {
-    var lastCfg = lasts[thisRawIndex] = {};
-    var parentNode = thisNode.parentNode;
-    var isGroup = element instanceof Group$1["default"];
-    if (parentNode && (!reRoot || reRoot.direction === 'drillDown')) {
-      var parentOldX = 0;
-      var parentOldY = 0;
-      // New nodes appear from right-bottom corner in 'zoomToNode' animation.
-      // For convenience, get old bounding rect from background.
-      var parentOldBg = lastsForAnimation.background[parentNode.getRawIndex()];
-      if (!reRoot && parentOldBg && parentOldBg.oldShape) {
-        parentOldX = parentOldBg.oldShape.width;
-        parentOldY = parentOldBg.oldShape.height;
-      }
-      // When no parent old shape found, its parent is new too,
-      // so we can just use {x:0, y:0}.
-      if (isGroup) {
-        lastCfg.oldX = 0;
-        lastCfg.oldY = parentOldY;
-      } else {
-        lastCfg.oldShape = {
-          x: parentOldX,
-          y: parentOldY,
-          width: 0,
-          height: 0
-        };
-      }
-    }
-    // Fade in, user can be aware that these nodes are new.
-    lastCfg.fadein = !isGroup;
-  }
-}
-// We cannot set all background with the same z, because the behaviour of
-// drill down and roll up differ background creation sequence from tree
-// hierarchy sequence, which cause lower background elements to overlap
-// upper ones. So we calculate z based on depth.
-// Moreover, we try to shrink down z interval to [0, 1] to avoid that
-// treemap with large z overlaps other components.
-function calculateZ2(depth, z2InLevel) {
-  return depth * Z2_BASE + z2InLevel;
-}
-
-exports["default"] = TreemapView;