How to use the @bentley/geometry-core.Point2d function in @bentley/geometry-core

function saveImage(vp: Viewport) {
  const buffer = vp.readImage(undefined, new Point2d(768, 768), true); // flip vertically...
  if (undefined === buffer) {
    alert("Failed to read image");
    return;
  }

  const url = imageBufferToPngDataUrl(buffer, false);
  if (undefined === url) {
    alert("Failed to produce PNG");
    return;
  }

  openImageDataUrlInNewWindow(url, "Saved View");
}

const sorted: IncidentMarker[] = [];
    const maxLen = 10;
    cluster.markers.forEach((marker) => {
      if (maxLen > sorted.length || marker.severity > sorted[sorted.length - 1].severity) {
        const index = sorted.findIndex((val) => val.severity < marker.severity);
        if (index === -1)
          sorted.push(marker);
        else
          sorted.splice(index, 0, marker);
        if (sorted.length > maxLen)
          sorted.length = maxLen;
      }
    });

    this.imageOffset = new Point3d(0, 28);
    this.imageSize = new Point2d(30, 30);
    this.label = cluster.markers.length.toLocaleString();
    this.labelColor = "black";
    this.labelFont = "bold 14px san-serif";

    let title = "";
    sorted.forEach((marker) => {
      if (title !== "")
        title += "<br>";
      title += "Severity: " + marker.severity + " Id: " + marker.id;
    });
    if (cluster.markers.length &gt; maxLen)
      title += "<br>...";

    const div = document.createElement("div"); // Use HTML as markup isn't supported for string.
    div.innerHTML = title;
    this.title = div;

public doPick(vp: ScreenViewport, pickPointWorld: Point3d, pickRadiusView: number, options: LocateOptions): number {
    if (this.hitList && this.hitList.length > 0 && vp === this.viewport && pickPointWorld.isAlmostEqual(this.pickPointWorld)) {
      this.hitList.resetCurrentHit();
      return this.hitList.length;
    }

    this.empty(); // empty the hit list
    this.viewport = vp;
    this.pickPointWorld.setFrom(pickPointWorld);

    const pickPointView = vp.worldToView(pickPointWorld);
    const testPointView = new Point2d(Math.floor(pickPointView.x + 0.5), Math.floor(pickPointView.y + 0.5));
    let pixelRadius = Math.floor(pickRadiusView + 0.5);
    const rect = new ViewRect(testPointView.x - pixelRadius, testPointView.y - pixelRadius, testPointView.x + pixelRadius, testPointView.y + pixelRadius);
    let result: number = 0;
    vp.readPixels(rect, Pixel.Selector.All, (pixels) => {
      if (undefined === pixels)
        return;

      testPointView.x = cssPixelsToDevicePixels(testPointView.x);
      testPointView.y = cssPixelsToDevicePixels(testPointView.y);
      pixelRadius = cssPixelsToDevicePixels(pixelRadius);

      const elmHits = new Map();
      const testPoint = Point2d.createZero();
      for (testPoint.x = testPointView.x - pixelRadius; testPoint.x <= testPointView.x + pixelRadius; ++testPoint.x) {
        for (testPoint.y = testPointView.y - pixelRadius; testPoint.y <= testPointView.y + pixelRadius; ++testPoint.y) {
          const pixel = pixels.getPixel(testPoint.x, testPoint.y);

constructor(worldLocation: XYAndZ, distanceLabel: string) {
    this.worldLocation = Point3d.createFrom(worldLocation);
    this.size = Point2d.createFrom(DistanceMarker._size);
    this.position = new Point3d();
    this.label = distanceLabel;
    const offset: Point2d = new Point2d(0, 20);
    this.labelOffset = offset;
  }

constructor(worldLocation: XYAndZ, distanceLabel: string) {
    this.worldLocation = Point3d.createFrom(worldLocation);
    this.size = Point2d.createFrom(DistanceMarker._size);
    this.position = new Point3d();
    this.label = distanceLabel;
    const offset: Point2d = new Point2d(0, 20);
    this.labelOffset = offset;
  }

public unquantize(index: number, out?: Point2d): Point2d {
    assert(index < this.length);
    if (index < this.length) {
      return this._list[index].unquantize(this.params, out);
    } else {
      return undefined !== out ? out : new Point2d();
    }
  }

export function canvasToResizedCanvasWithBars(canvasIn: HTMLCanvasElement, targetSize: Point2d, barSize = new Point2d(0, 0), barStyle = "#C0C0C0"): HTMLCanvasElement {
  const canvasOut = document.createElement("canvas");
  canvasOut.width = targetSize.x + barSize.x;
  canvasOut.height = targetSize.y + barSize.y;

  let adjustImageX = barSize.x / 2;
  let adjustImageY = barSize.y / 2;

  if (1 === barSize.x % 2) {
    adjustImageX += 0.5;
  }
  if (1 === barSize.y % 2) {
    adjustImageY += 0.5;
  }

  const context = canvasOut.getContext("2d")!;
  context.fillStyle = barStyle;

protected selectByPointsProcess(origin: Point3d, corner: Point3d, ev: BeButtonEvent, method: SelectionMethod, overlap: boolean) {
    const vp = ev.viewport;
    if (!vp)
      return;
    const pts: Point2d[] = [];
    pts[0] = new Point2d(Math.floor(origin.x + 0.5), Math.floor(origin.y + 0.5));
    pts[1] = new Point2d(Math.floor(corner.x + 0.5), Math.floor(corner.y + 0.5));
    const range = Range2d.createArray(pts);

    const rect = new ViewRect();
    rect.initFromRange(range);
    vp.readPixels(rect, Pixel.Selector.Feature, (pixels) => {
      if (undefined === pixels)
        return;

      const sRange = Range2d.createNull();
      sRange.extendPoint(Point2d.create(cssPixelsToDevicePixels(range.low.x), cssPixelsToDevicePixels(range.low.y)));
      sRange.extendPoint(Point2d.create(cssPixelsToDevicePixels(range.high.x), cssPixelsToDevicePixels(range.high.y)));

      let contents = new Set();
      const testPoint = Point2d.createZero();

  return imageElementFromImageSource(source).then((image) => new Point2d(image.naturalWidth, image.naturalHeight));
}