@the_basketcase/image-zoom v0.0.4

image-zoom

Welcome to the Image Zoom library. This library provides a responsive React image viewer library with panning and zoom.

Getting started

yarn add @the_basketcase/image-zoom

Usage

<ImageZoom
  imgTitle={imgTitle}
  imgUrl={imgUrl}
  toolbar={false}
  containerWidth='70vh'
  containerHeight='70vh'
  moveOn1={true}
  onImageError={onImageError}
  zoomScale={1}
  maxZoom={6}
/>

Parameters

containerWidth, containerHeight

width and height of the outside container (around the image)

imgUrl: required

url or img path

imgAltTag: required

alt tag for img

maxZoom: (default: 4)

the maximum zoom amount for the image

moveOn1: (default: true)

image is movable when the zoom === 1

onImageError

callback when img loading fails

styles

css styles for the outside container

showToolbar: (default: false)

show built in toolbar component

zoomScale: (default: 0.01)

zoom scale for the tool bar buttons

License

MIT