How to disable double click zoom

[goinnovise]

I am using react-simple-maps 3.0.0-beta.6

I am using the useZoomPan hook to create a control.

I am disabling zoom on scroll with filterZoomEvent, but also noticed that there's zoom-in behavior on double-click. It'd like to disable this.

I've tried handling the click event for geographies and running event.preventDefault() with no luck. I've also noticed that geography.onDoubleClick no longer fires after adding a ZoomableGroup.

My CustomizableZoomGroup:

import { useZoomPan } from 'react-simple-maps'

const handleZoomFilter = ev => {  
  const disableTypes = ['wheel', 'mousedown']  
  return !disableTypes.includes(ev.type)
}

const width = 800
const height = 600
const CustomizableZoomGroup = ({ children }) => {

  const { mapRef, transformString, position } = useZoomPan({
    center: [0, 0],
    filterZoomEvent: handleZoomFilter,
    scaleExtent: [1, 3],
    translateExtent: [
      [0, -height],
      [width, height],
    ],
  })

  return (
    <g ref={mapRef}>
      <g transform={transformString}>{children(position)}</g>
    </g>
  )
}

export default CustomizableZoomGroup

[EvgeniyT13]

I am using react-simple-maps 3.0.0-beta.6

I am using the useZoomPan hook to create a control.

I am disabling zoom on scroll with filterZoomEvent, but also noticed that there's zoom-in behavior on double-click. It'd like to disable this.

I've tried handling the click event for geographies and running event.preventDefault() with no luck. I've also noticed that geography.onDoubleClick no longer fires after adding a ZoomableGroup.

My CustomizableZoomGroup:

import { useZoomPan } from 'react-simple-maps'

const handleZoomFilter = ev => {  
  const disableTypes = ['wheel', 'mousedown']  
  return !disableTypes.includes(ev.type)
}

const width = 800
const height = 600
const CustomizableZoomGroup = ({ children }) => {

  const { mapRef, transformString, position } = useZoomPan({
    center: [0, 0],
    filterZoomEvent: handleZoomFilter,
    scaleExtent: [1, 3],
    translateExtent: [
      [0, -height],
      [width, height],
    ],
  })

  return (
    <g ref={mapRef}>
      <g transform={transformString}>{children(position)}</g>
    </g>
  )
}

export default CustomizableZoomGroup

I also have this issue. But I used 'dblclick' in array and double click is disabled.