How to use the plottable.Interactions function in plottable

// Initializing tooltip anchor
    const tooltipAnchorSelection = plot.foreground().append('circle');
    tooltipAnchorSelection.attr({
      r: 3,
      opacity: 0,
    });
    const tooltipAnchor = $(tooltipAnchorSelection.node());
    tooltipAnchor.tooltip({
      animation: false,
      container: 'body',
      placement: 'auto',
      trigger: 'manual',
    });
    // Setup Interaction.Pointer
    const pointer = new Plottable.Interactions.Pointer();
    pointer.onPointerMove((p) => {
      const closest = plot.entityNearest(p);
      if (closest) {
        tooltipAnchor.tooltip('show');
        tooltipAnchor.attr('cx', closest.position.x);
        tooltipAnchor.attr('cy', closest.position.y);
        tooltipAnchor.attr('data-original-title', closest.datum.val + ' tickets');
      }
    });

    pointer.onPointerExit(() => {
      tooltipAnchor.tooltip('hide');
    });

    pointer.attachTo(plot);

const selectedData = (selected) ? [selected.value] : []
    this.selectedDataset = new Plottable.Dataset(selectedData)
    const rectangle = new Plottable.Plots.Rectangle()
      .addDataset(this.selectedDataset)
      .x((datum) => datum, xScale)
      .y(0)
      .y2((datum) => rectangle.height())
      .attr('fill', '#f99300')
      .attr('opacity', 0.3)

    xScale.innerPadding(0.4) // See https://github.com/palantir/plottable/issues/3426

    const group = new Plottable.Components.Group([ this.plot, rectangle ])

    if (onSelect) {
      const interaction = new Plottable.Interactions.Click()
      interaction.onClick(this.onClickPlot.bind(this))
      interaction.attachTo(this.plot)
    }

    const table = new Plottable.Components.Table([
      [group],
      [xAxis]
    ])

    table.renderTo(this.container)
  }
  onClickPlot (point) {