_renderTip()

in modules/core/src/components/log-viewer/perspective-popup.js [65:123]


  _renderTip(positionType) {
    const anchorPosition = ANCHOR_POSITION[positionType];
    const {theme, style} = this.props;
    const {objectLabelTipSize = 30, objectLabelColor = theme.background} = style;

    const styleProps = {
      ...this.props.styleProps,
      theme,
      color: objectLabelColor,
      position: positionType
    };

    const tipSize = evaluateStyle(objectLabelTipSize, styleProps);

    const tipStyle = {
      width: tipSize,
      height: tipSize,
      position: 'relative',
      border: 'none'
    };

    const tipCircleStyle = {};
    const tipLineStyle = {};

    switch (anchorPosition.x) {
      case 0.5:
        tipCircleStyle.left = '50%';
        tipLineStyle.left = '50%';
        break;
      case 1:
        tipCircleStyle.right = 0;
        tipLineStyle.right = 0;
        break;
      case 0:
      default:
    }

    switch (anchorPosition.y) {
      case 0.5:
        tipLineStyle.width = '100%';
        tipCircleStyle.top = '50%';
        tipLineStyle.top = '50%';
        break;
      case 1:
        tipCircleStyle.bottom = 0;
        tipLineStyle.height = '100%';
        break;
      case 0:
      default:
        tipLineStyle.height = '100%';
    }

    return (
      <div key="tip" className="mapboxgl-popup-tip" style={tipStyle}>
        <PopupTip style={tipCircleStyle} {...styleProps} userStyle={style.objectLabelTip} />
        <PopupLine style={tipLineStyle} {...styleProps} userStyle={style.objectLabelLine} />
      </div>
    );
  }