render()

in packages/showcase/plot/labeled-heatmap.js [56:100]

• 44 lines of code
• 2 McCabe index (conditional complexity)

  render() {
    const {value} = this.state;
    const exampleColorScale = scaleLinear()
      .domain([min, (min + max) / 2, max])
      .range(['orange', 'white', 'cyan']);

    return (
      <XYPlot
        xType="ordinal"
        xDomain={alphabet.map(letter => `${letter}1`)}
        yType="ordinal"
        yDomain={alphabet.map(letter => `${letter}2`).reverse()}
        margin={50}
        width={500}
        height={500}
      >
        <XAxis orientation="top" />
        <YAxis />
        <HeatmapSeries
          colorType="literal"
          getColor={d => exampleColorScale(d.color)}
          style={{
            stroke: 'white',
            strokeWidth: '2px',
            rectStyle: {
              rx: 10,
              ry: 10
            }
          }}
          className="heatmap-series-example"
          data={data}
          onValueMouseOver={v => this.setState({value: v})}
          onSeriesMouseOut={() => this.setState({value: false})}
        />
        <LabelSeries
          style={{pointerEvents: 'none'}}
          data={data}
          labelAnchorX="middle"
          labelAnchorY="baseline"
          getLabel={d => `${d.color}`}
        />
        {value !== false && <Hint value={value} />}
      </XYPlot>
    );
  }