render()

in packages/showcase/interaction/interaction-examples.js [113:150]

• 37 lines of code
• 3 McCabe index (conditional complexity)

  render() {
    const {pointUsed, highlightedSeries} = this.state;
    const data = allData.map((d, i) => ({
      ...d,
      color: i === pointUsed ? 'rgba(0,0,0,0.2)' : 'transparent'
    }));

    return (
      <XYPlot
        {...defaultProps}
        onMouseLeave={() =>
          this.setState({
            highlightedSeries: null,
            pointUsed: null
          })
        }
      >
        {lineData.map((d, i) => (
          <LineSeries
            data={d}
            key={`${i}`}
            stroke={i === highlightedSeries ? 'orange' : undefined}
          />
        ))}
        <MarkSeries
          data={data}
          colorType="literal"
          size={10}
          onNearestXY={({seriesNb}, {index}) =>
            this.setState({
              highlightedSeries: seriesNb,
              pointUsed: index
            })
          }
        />
      </XYPlot>
    );
  }