_renderSeries()

in modules/monochrome/src/metric-card/chart.js [194:246]


  _renderSeries() {
    const {data, dataFilter, highlightSeries, getX, getY0, getY, xDomain} = this.props;
    const areas = [];
    const lines = [];

    Object.keys(data).forEach(key => {
      if (!dataFilter(key)) {
        return;
      }

      // Temporary patch until vis-gl fixes issue with rendering data outside of domain
      // https://github.com/uber/react-vis/issues/627
      const datums = xDomain
        ? data[key].filter(point => {
            const x = getX(point);
            return x >= xDomain[0] && x <= xDomain[1];
          })
        : data[key];

      if (!datums.length) {
        return;
      }

      const isArea = Number.isFinite(getY0(datums[0]));
      const Type = isArea ? AreaSeries : LineSeries;
      const color = this._getColor(key);

      const series = (
        <Type
          key={`value-${key}-line`}
          data={datums}
          getX={getX}
          getY={getY}
          getY0={getY0}
          color={color}
          fill={color}
          strokeWidth={highlightSeries === key ? 4 : 2}
          onNearestX={this.props.onNearestX.bind(this, key)}
          onSeriesMouseOver={() => this.props.onSeriesMouseOver(key)}
          onSeriesMouseOut={() => this.props.onSeriesMouseOut(key)}
        />
      );

      if (isArea) {
        areas.push(series);
      } else {
        lines.push(series);
      }
    });

    // Render lines on top
    return areas.concat(lines);
  }