@antv/g6/lib/util/graph.js

graph visualization frame work

/**
 * @fileOverview graph util
 * @author huangtonger@aliyun.com
 */

var BaseUtil = require('./base');
var DomUtil = require('./dom');

module.exports = {
  /**
   * determine whether a node
   * @param  {object}  item item
   * @return {boolean} bool
   */
  isNode: function isNode(item) {
    return item && BaseUtil.isObject(item) && item.type === 'node';
  },

  /**
   * determine whether a edge
   * @param  {object}  item item
   * @return {boolean} bool
   */
  isEdge: function isEdge(item) {
    return item && BaseUtil.isObject(item) && item.type === 'edge';
  },

  /**
   * determine whether a group
   * @param  {object}  item item
   * @return {boolean} bool
   */
  isGroup: function isGroup(item) {
    return item && BaseUtil.isObject(item) && item.type === 'group';
  },

  /**
   * graph to Canvas
   * @param  {object}  options item
   * @return {domobject} canvas
   */
  graph2Canvas: function graph2Canvas(options) {
    options = BaseUtil.mix({
      graph: null,
      width: null,
      height: null,
      canvas: null,
      minMaxZoom: Infinity,
      minMinZoom: 0,
      pixelRatio: 2,
      beforeTransform: function beforeTransform() {},
      afterTransform: function afterTransform() {}
    }, options);
    var _options = options,
        graph = _options.graph,
        width = _options.width,
        height = _options.height,
        canvas = _options.canvas,
        minMaxZoom = _options.minMaxZoom,
        minMinZoom = _options.minMinZoom,
        pixelRatio = _options.pixelRatio,
        beforeTransform = _options.beforeTransform,
        afterTransform = _options.afterTransform;

    var graphCanvas = graph.getCanvas();
    var tranScale = void 0;
    if (!canvas) {
      var containerDOM = DomUtil.createDOM('<canvas></canvas>');
      var graphPixelRatio = graphCanvas.get('pixelRatio');
      tranScale = pixelRatio / graphPixelRatio;
      graphCanvas.scale(tranScale, tranScale);
      var Constructor = graph.getConstructor('Canvas');
      canvas = new Constructor({
        containerDOM: containerDOM,
        width: width * tranScale,
        height: height * tranScale
      });
    }
    var miniMapCanvasContext = canvas.get('context');
    var graphCanvasContext = graphCanvas.get('context');
    var graphWidth = graph.get('width');
    var graphHeight = graph.get('height');
    var matrixCache = BaseUtil.cloneDeep(graph.getMatrix());
    var maxZoom = graph.get('maxZoom');
    var minZoom = graph.get('minZoom');
    var rootGroup = graph.getRootGroup();
    var events = graph._events;
    rootGroup.setSilent('freezable', false);
    graph.set('maxZoom', minMaxZoom);
    graph.set('minZoom', minMinZoom);
    graph.set('width', width);
    graph.set('height', height);
    graph._events = []; // tamper with the event
    if (graph.getItems().length > 0) {
      beforeTransform(graph);
      graphCanvas.set('context', miniMapCanvasContext);
      graph.autoZoom();
      canvas.matrix = BaseUtil.cloneDeep(graph.getMatrix());
    }

    graphCanvas.set('context', miniMapCanvasContext);
    graphCanvas.beforeDraw();
    graphCanvas.constructor.superclass.draw.call(graphCanvas, miniMapCanvasContext);
    rootGroup.setSilent('freezable', true);
    graph.set('width', graphWidth);
    graph.set('height', graphHeight);
    graph.set('maxZoom', maxZoom);
    graph.set('minZoom', minZoom);
    graph.updateMatrix(matrixCache);
    if (tranScale) {
      afterTransform(graph);
      graphCanvas.scale(1 / tranScale, 1 / tranScale);
    }
    graph._events = events;
    graphCanvas.set('context', graphCanvasContext);
    graphCanvas.draw();
    return canvas.get('el');
  }
};