React Image Map Area

A react custom hook that makes HTML Image Maps responsive, automatically stay scaled to the size of the image they are attached to. It detects the window being resized and updates the co-ordinates of the image map accordingly.

Usage

import useImgMapArea from 'react-img-map-area'

export default function MyComponent() {

  useImgMapArea()

  return (
    <>
      <img src='...' useMap='#myMap'/>
      <map name='myMap'></map>
    </>
  )
}