How to use the d3-selection.event.transform function in d3-selection

}
      }

      // if somebody is dragging along a 1d track, do value scale moving
      if (trackOrientation === '1d-horizontal'
        && event.sourceEvent.movementY) {
        this.valueScaleMove(event.sourceEvent.movementY);
      } else if (trackOrientation === '1d-vertical'
        && event.sourceEvent.movementX) {
        this.valueScaleMove(event.sourceEvent.movementX);
      }
    }

    this.zoomTransform = !this.currentProps.zoomable
      ? zoomIdentity
      : event.transform;

    const zooming = this.prevZoomTransform.k !== this.zoomTransform.k;

    // if there is dragging along a 1d track, only allow panning
    // along the axis of the track
    if (!zooming) {
      if (trackOrientation === '1d-horizontal') {
        // horizontal tracks shouldn't allow movement in the y direction
        // don't move along y axis
        this.zoomTransform = zoomIdentity.translate(
          this.zoomTransform.x, this.prevZoomTransform.y
        ).scale(this.zoomTransform.k);
      } else if (trackOrientation === '1d-vertical') {
        // vertical tracks shouldn't allow movement in the x axis
        this.zoomTransform = zoomIdentity.translate(
          this.prevZoomTransform.x, this.zoomTransform.y

function zoomed()
{
    zoomCount += 1
    const z = d3event.transform.toString()

    if (z != newZoom)
    {
        newZoom = z
		newZoomT = zoomAffineTransform(d3event.transform)
        draw()
    }
}

const zoomed = () => {
          this.zoomedEl.attr('transform', d3Event.transform);
        };

const zoomHandler = zoom().on("zoom", () => {
    svgGroup.attr("transform", event.transform)
  })
  svg.call(zoomHandler)

.on("zoom", function (evt) {
                if (d3Event && d3Event.transform) {
                    context.zoomed(context._d3Zoom, [d3Event.transform.x, d3Event.transform.y], d3Event.transform.k);
                }
            })
            ;

const zoomed = function zoomed() {
            if (!this.initialTransformX && !this.initialTransformY) {
                this.initialTransformX = d3event.transform.x;
                this.initialTransformY = d3event.transform.y;
            }

            gContent.attr(
                'transform',
                `translate(${d3event.transform.x -
                    this.initialTransformX}, ${d3event.transform.y -
                    this.initialTransformY})scale(${d3event.transform.k}, ${
                    d3event.transform.k
                })`
            );
        };

    onZoom = () => this.updateZoom(currentEvent.transform);

const zoomed = function zoomed() {
            if (!this.initialTransformX && !this.initialTransformY) {
                this.initialTransformX = d3event.transform.x;
                this.initialTransformY = d3event.transform.y;
            }

            gContent.attr(
                'transform',
                `translate(${d3event.transform.x -
                    this.initialTransformX}, ${d3event.transform.y -
                    this.initialTransformY})scale(${d3event.transform.k}, ${
                    d3event.transform.k
                })`
            );
        };

var move = function() {
					g.select(".view")
					.attr("transform", "translate(" + event.transform.x + ",0)"
														 + "scale(" + event.transform.k + " 1)");

					g.selectAll(".timeline-xAxis")
						.attr("transform", function(d) {
							 return "translate(" + event.transform.x + ", " + timeAxisYPosition + ")"
										+ "scale(" + event.transform.k + " 1)";
						});

					var new_xScale = event.transform.rescaleX(xScale);
					g.selectAll('.timeline-xAxis').call(function(d) { xAxis.scale(new_xScale); });

					var xpos = -event.transform.x;
					scroll(xpos, xScale);
				};
			};

zoomHandler() {
    const translateX = d3Event.transform.x;
    const translateY = d3Event.transform.y;
    const scale = d3Event.transform.k;
    this.props.updateMapPosition({ translateX, translateY, scale });
  }