constructor()

in showcases/graph/app.js [22:99]


  constructor(props) {
    super(props);

    this._resize = this._resize.bind(this);
    this._animate = this._animate.bind(this);
    this._onHover = this._onHover.bind(this);
    this._onClick = this._onClick.bind(this);
    this._onMouseDown = this._onMouseDown.bind(this);
    this._onMouseMove = this._onMouseMove.bind(this);
    this._onMouseUp = this._onMouseUp.bind(this);
    this._getNodeColor = this._getNodeColor.bind(this);

    // set initial state
    this.state = {
      viewport: {
        width: 500,
        height: 500
      },
      data: null,
      iconMapping: null,
      hovered: null,
      clicked: null,
      dragging: null,
      lastDragged: null
    };

    /* eslint-disable max-len */
    const dataConfig = [
      {
        data:
          'https://raw.githubusercontent.com/visgl/deck.gl-data/master/examples/graph/sample-graph.json',
        loader: requestJSON,
        adaptor: GraphBasic,
        hasNodeTypes: true
      },
      {
        data:
          'https://raw.githubusercontent.com/visgl/deck.gl-data/master/examples/graph/flare.json',
        loader: requestJSON,
        adaptor: GraphFlare,
        hasNodeTypes: false
      },
      {
        data:
          'https://raw.githubusercontent.com/visgl/deck.gl-data/master/examples/graph/facebook-SNAP.csv',
        loader: requestCSV,
        adaptor: GraphSNAP,
        hasNodeTypes: false
      }
    ];
    /* eslint-enable max-len */

    const loader = dataConfig[DATASET].loader;
    loader(dataConfig[DATASET].data, (error, response) => {
      if (!error) {
        // "adaptors" are used to parse data into the format
        // required by your layout (e.g. nodes and links arrays for d3-force),
        // and to manage addition / removal of graph elements.
        const GraphAdaptor = dataConfig[DATASET].adaptor;
        const graph = new GraphAdaptor(response);
        this.setState({
          data: [graph]
        });
      }
    });

    // only set up icon accessors for sample datasets that have types to be represented as icons.
    if (dataConfig[DATASET].hasNodeTypes) {
      // load icon atlas
      requestJSON('./data/node-icon-atlas.json', (error, response) => {
        if (!error) {
          this.setState({
            iconMapping: response
          });
        }
      });
    }
  }