@antv/g6/lib/item/item.js

graph visualization frame work

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

/**
 * @fileOverview item
 * @author huangtonger@aliyun.com
 */

var Util = require('../util/');
function getCollapsedParent(node, dataMap) {
  var parent = dataMap[node.parent];
  if (!parent) {
    return false;
  }
  if (parent) {
    var rst = getCollapsedParent(parent, dataMap);
    if (rst) {
      return rst;
    }
  }
  if (parent.collapsed) {
    return parent;
  }
}

var Item = function () {
  function Item(cfg) {
    _classCallCheck(this, Item);

    var defaultCfg = {
      /**
       * id
       * @type {string}
       */
      id: '',

      /**
       * 类型
       * @type {string}
       */
      type: null,

      /**
       * data model
       * @type {object}
       */
      model: {},

      /**
       * g group
       * @type {G.Group}
       */
      group: null,

      /**
       * is open animate
       * @type {boolean}
       */
      animate: false,

      /**
       * cache model for diff
       * @type {object}
       */
      modelCache: {}
    };
    Util.mix(this, defaultCfg, cfg);
    this._init();
  }

  Item.prototype._init = function _init() {
    this._setIndex();
    this._mapping();
    this._setShapeObj();
    this._initGroup();
    this.draw();
  };

  Item.prototype._setIndex = function _setIndex() {
    var model = this.model;
    if (Util.isNil(model.index)) {
      model.index = this.zIndex;
    }
  };

  Item.prototype._mapping = function _mapping() {
    var mapper = this.mapper;
    var model = this.model;
    mapper.mapping(model);
  };

  Item.prototype._initGroup = function _initGroup() {
    var group = this.group;
    var model = this.model;
    var type = this.type;
    group.isItemContainer = true;
    group.id = model.id;
    group.itemType = type;
    group.model = model;
  };

  Item.prototype._calculateBBox = function _calculateBBox() {
    var keyShape = this.keyShape;
    var group = this.group;
    var bbox = Util.getBBox(keyShape, group);
    bbox.width = bbox.maxX - bbox.minX;
    bbox.height = bbox.maxY - bbox.minY;
    bbox.centerX = (bbox.minX + bbox.maxX) / 2;
    bbox.centerY = (bbox.minY + bbox.maxY) / 2;
    return bbox;
  };

  Item.prototype.getLabel = function getLabel() {
    var group = this.group;
    return group.findByClass('label')[0];
  };

  Item.prototype.getGraph = function getGraph() {
    return this.graph;
  };

  Item.prototype.getEnterAnimate = function getEnterAnimate() {
    var shapeObj = this.shapeObj;
    var graph = this.graph;
    return shapeObj.enterAnimate ? shapeObj.enterAnimate : graph.get('_enterAnimate');
  };

  Item.prototype.getLeaveAnimate = function getLeaveAnimate() {
    var shapeObj = this.shapeObj;
    var graph = this.graph;
    return shapeObj.leaveAnimate ? shapeObj.leaveAnimate : graph.get('_leaveAnimate');
  };

  Item.prototype._setShapeObj = function _setShapeObj() {
    var graph = this.graph;
    var type = this.type;
    var model = this.getModel();
    this.shapeObj = graph.getShapeObj(type, model);
  };

  Item.prototype._afterDraw = function _afterDraw() {
    var graph = this.graph;
    this._setGId();
    this._cacheModel();
    graph.emit('afteritemdraw', {
      item: this
    });
  };

  Item.prototype._cacheModel = function _cacheModel() {
    this.modelCache = Util.mix({}, this.model);
  };

  Item.prototype._setGId = function _setGId() {
    var group = this.group;
    var id = this.id;
    var type = this.type;
    group.gid = id;
    group.deepEach(function (child, parent, index) {
      var parentGid = parent.gid;
      child.id = id;
      child.eventPreFix = type;
      child.gid = parentGid + '-' + index;
    });
  };

  Item.prototype._beforeDraw = function _beforeDraw() {
    var graph = this.graph;
    graph.emit('beforeitemdraw', {
      item: this
    });
    this.updateCollapsedParent();
    this._setShapeObj();
  };

  Item.prototype._shouldDraw = function _shouldDraw() {
    return true;
  };

  Item.prototype._getDiff = function _getDiff() {
    var diff = [];
    var model = this.model;
    var modelCache = this.modelCache;

    Util.each(model, function (v, k) {
      if (!Util.isEqual(v, modelCache[k])) {
        diff.push(k);
      }
    });
    if (diff.length === 0) {
      return false;
    }
    return diff;
  };

  Item.prototype._drawInner = function _drawInner() {
    var animate = this.animate;
    var group = this.group;
    group.clear(!animate);
    var shapeObj = this.shapeObj;
    var keyShape = shapeObj.draw(this);
    if (keyShape) {
      keyShape.isKeyShape = true;
      this.keyShape = keyShape;
    }
    shapeObj.afterDraw && shapeObj.afterDraw(this);
  };

  Item.prototype.deepEach = function deepEach(callback, getParent) {
    Util.traverseTree(this, callback, getParent ? getParent : function (parent) {
      return parent.getChildren();
    });
  };

  Item.prototype.getShapeObj = function getShapeObj() {
    return this.shapeObj;
  };

  Item.prototype.updateCollapsedParent = function updateCollapsedParent() {
    var dataMap = this.dataMap;
    this.collapsedParent = getCollapsedParent(this.model, dataMap);
  };

  Item.prototype.isVisible = function isVisible() {
    var group = this.group;
    return group.get('visible');
  };

  Item.prototype.hide = function hide() {
    var group = this.group;
    var graph = this.graph;
    graph.emit('beforeitemhide', {
      item: this
    });
    group.hide();
    graph.emit('afteritemhide', {
      item: this
    });
  };

  Item.prototype.show = function show() {
    var group = this.group;
    var graph = this.graph;
    graph.emit('beforeitemshow', {
      item: this
    });
    group.show();
    graph.emit('afteritemshow', {
      item: this
    });
  };

  Item.prototype.draw = function draw() {
    this._beforeDraw();
    if (this._shouldDraw()) {
      this._drawInner();
    }
    this._afterDraw();
  };

  Item.prototype.forceUpdate = function forceUpdate() {
    this._beforeDraw();
    this._drawInner();
    this._afterDraw();
  };

  Item.prototype.getCenter = function getCenter() {
    var bbox = this.getBBox();
    return {
      x: bbox.centerX,
      y: bbox.centerY
    };
  };

  Item.prototype.getBBox = function getBBox() {
    return this.bbox || this._calculateBBox();
  };

  Item.prototype.layoutUpdate = function layoutUpdate() {
    this.draw();
  };

  Item.prototype.update = function update() {
    this.draw();
  };

  Item.prototype.getModel = function getModel() {
    return this.model;
  };

  Item.prototype.getKeyShape = function getKeyShape() {
    return this.keyShape;
  };

  Item.prototype.getGraphicGroup = function getGraphicGroup() {
    return this.group;
  };

  Item.prototype.getHierarchy = function getHierarchy() {
    var graph = this.graph;
    return graph.getHierarchy(this);
  };

  Item.prototype.getParent = function getParent() {
    var model = this.model;
    var itemMap = this.itemMap;
    return itemMap[model.parent];
  };

  Item.prototype.getAllParents = function getAllParents() {
    var model = this.model;
    var itemMap = this.itemMap;
    var parents = [];
    var parentModel = model.parent;
    while (parentModel && itemMap[parentModel]) {
      parents.push(itemMap[parentModel]);
      parentModel = parentModel.parent;
    }
    return parents;
  };
  // deep get all children


  Item.prototype.getAllChildren = function getAllChildren() {
    var rst = [];
    this.deepEach(function (child) {
      rst.push(child);
    });
    return rst;
  };
  // get children


  Item.prototype.getChildren = function getChildren() {
    var id = this.id;
    var graph = this.graph;
    var items = graph.getItems();

    return items.filter(function (item) {
      return item.model.parent === id;
    });
  };

  Item.prototype.destroy = function destroy() {
    if (!this.destroyed) {
      var animate = this.animate;
      var graph = this.graph;
      graph.emit('beforeitemdestroy', {
        item: this
      });
      this.group.remove(!animate);
      this.destroyed = true;
      graph.emit('afteritemdestroy', {
        item: this
      });
    }
  };

  return Item;
}();

module.exports = Item;