Zoom Behaviour: disabling zoom.click and zoom.dblclick doesn't actually stop zoom behaviour from firing.

[michealroberts]

Really not sure exactly how to explain this one, but when tapping on a trackpad or similar, the click and double click events still trigger the zooming behaviour.

I'm using d3-zoom with Vue 3 in the following:

const isClicking = ref(false);

  const isDragging = ref(false);

  const zoomBehavior = computed(() => {
    return zoom()
      .scaleExtent([min, max])
      .on('start', (event) => {
        isDragging.value = event.sourceEvent?.type === 'mousedown';
      })
      .on('zoom.click', () => {
        isClicking.value = true;
      })
      .on('zoom.dblclick', () => {
        isClicking.value = true;
      })
      .on('zoom.wheel', (event) => {
        if (!transformContainer.value) {
          return;
        }

        setTransformation(transformContainer.value, event.transform.k, {
          x: event.transform.x,
          y: event.transform.y,
        });
      })
      .on('zoom.touchstart', (event) => {
        if (!transformContainer.value) {
          return;
        }

        setTransformation(transformContainer.value, event.transform.k, {
          x: event.transform.x,
          y: event.transform.y,
        });
      })
      .on('zoom.touchmove', (event) => {
        if (!transformContainer.value) {
          return;
        }

        setTransformation(transformContainer.value, event.transform.k, {
          x: event.transform.x,
          y: event.transform.y,
        });
      })
      .on('end', () => {
        isDragging.value = false;
        isClicking.value = false;
      });
  });

Essentially, what is the process to only allow zooming on either the swipe gesture or mouse scroll?

I've tried multiple different iterations of the above, but when clicking on an element inside the transformContainer, the container still transforms and zooms ...

Any pro-tips would be greatly received ... unless this is actually a bug.