render()

in src/XAxis.js [197:267]

• 61 lines of code
• 12 McCabe index (conditional complexity)

  render() {
    const {
      width,
      height,
      position,
      spacingTop,
      spacingBottom,
      spacingLeft,
      spacingRight,
      tickLength,
      titleDistance,
      labelDistance,
      showTitle,
      showLabels,
      showTicks,
      showGrid,
      showLine,
      lineStyle,
    } = this.props;

    const {
      ticksProps,
      gridProps,
      labelsProps,
      titleProps,
    } = getAxisChildProps(this.props);

    labelsProps.distance = labelDistance + (showTicks ? tickLength : 0);

    if (showTitle && showLabels) {
      // todo optimize so we don't generate labels twice
      const labelsMargin = XAxisLabels.getMargin(labelsProps);
      titleProps.distance =
        titleDistance + labelsMargin[`margin${upperFirst(position)}`];
    } else if (showTitle && showTicks) {
      titleProps.distance = titleDistance + tickLength;
    }

    const axisLineY =
      position === 'bottom' ? height + spacingBottom : -spacingTop;

    return (
      <g
        className="rct-chart-axis rct-chart-axis-x"
        aria-hidden="true"
        onMouseMove={this.handleOnMouseMove}
        onMouseEnter={this.handleOnMouseEnter}
        onMouseLeave={this.handleOnMouseLeave}
        onClick={this.handleOnClick}
      >
        {showGrid ? <XGrid {...gridProps} /> : null}

        {showTicks ? <XTicks {...ticksProps} /> : null}

        {showLabels ? <XAxisLabels {...labelsProps} /> : null}

        {showTitle ? <XAxisTitle {...titleProps} /> : null}

        {showLine ? (
          <line
            className="rct-chart-axis-line rct-chart-axis-line-x"
            x1={-spacingLeft}
            x2={width + spacingRight}
            y1={axisLineY}
            y2={axisLineY}
            style={lineStyle}
          />
        ) : null}
      </g>
    );
  }