render()

in packages/showcase/interaction/interaction-examples.js [79:105]


  render() {
    const {index} = this.state;
    return (
      <XYPlot
        {...defaultProps}
        onMouseLeave={() => this.setState({index: null})}
      >
        {lineData.map((d, i) => (
          <LineSeries
            data={d}
            key={`${i}`}
            stroke={i === index ? 'orange' : undefined}
          />
        ))}
        {lineData.map((d, i) => (
          <LineSeries
            data={d}
            key={`${i}-mouseover`}
            onSeriesMouseOut={() => this.setState({index: null})}
            onSeriesMouseOver={() => this.setState({index: i})}
            strokeWidth={10}
            stroke={index === i ? 'rgba(0,0,0,0.2)' : 'transparent'}
          />
        ))}
      </XYPlot>
    );
  }