renderLayers()

in showcases/graph/graph-layer/graph-layer.js [71:158]
75 lines of code
13 McCabe index (conditional complexity)

  renderLayers() {
    const {id} = this.props;
    const {nodes, links, layoutTime} = this.state;

    // Accessor props for underlying layers
    const {
      getLinkPosition,
      getLinkColor,
      getLinkWidth,
      getNodePosition,
      getNodeColor,
      getNodeSize,
      nodeIconAccessors
    } = this.props;
    const {getIcon, iconAtlas, iconMapping, sizeScale} = nodeIconAccessors || {};

    // base layer props
    const {opacity, pickable, visible} = this.props;

    // viewport props
    const {coordinateSystem} = this.props;

    const drawLinks = links && links.length > 0;
    const drawNodes = nodes && nodes.length > 0;

    // only draw icons if all required accessors are present
    const drawIcons = drawNodes && getIcon && iconAtlas && iconMapping;

    const linksLayer =
      drawLinks &&
      new LineLayer({
        id: `${id}-link-layer`,
        data: links,
        getSourcePosition: d => getLinkPosition(d).sourcePosition,
        getTargetPosition: d => getLinkPosition(d).targetPosition,
        getColor: e => (e.highlighting ? [255, 0, 0, 200] : getLinkColor(e)),
        strokeWidth: getLinkWidth(),
        opacity,
        pickable,
        coordinateSystem,
        updateTriggers: {
          getSourcePosition: layoutTime,
          getTargetPosition: layoutTime,
          getColor: layoutTime
        }
      });

    const nodesLayer =
      drawNodes &&
      new ScatterplotLayer({
        id: `${id}-${drawIcons ? 'node-bg-layer' : 'node-layer'}`,
        data: nodes,
        getPosition: getNodePosition,
        getRadius: getNodeSize,
        getFillColor: n => (n.highlighting ? [255, 255, 0, 255] : getNodeColor(n)),
        opacity,
        pickable,
        coordinateSystem,
        updateTriggers: {
          getPosition: layoutTime,
          getFillColor: layoutTime
        },
        visible
      });

    const nodeIconsLayer =
      drawIcons &&
      new IconLayer({
        id: `${id}-node-icon-layer`,
        data: nodes,
        getColor: getNodeColor,
        getIcon,
        getPosition: getNodePosition,
        getSize: getNodeSize,
        iconAtlas,
        iconMapping,
        opacity,
        pickable,
        coordinateSystem,
        sizeScale,
        updateTriggers: {
          getPosition: layoutTime
        },
        visible
      });

    return [linksLayer, nodesLayer, nodeIconsLayer];
  }