react-tinymap

Welcome to react-tinymap 👋

This is derived from a repo that has not been maintained for a long time and needs to be used in the project, so it has been implemented with hooks for long-term maintenance

Install

yarn install react-tinymap

Usage

<TinyMap placement='topRight' selector='.box' keepAspectRatio={false}>
  <Block className='box' style={{position: 'absolute', left: '400px', top: '100px'}}/>
  <Block className='box' style={{position: 'absolute', left: '800px', top: '100px'}}/>
</TinyMap>

example

Properties

property	type	description	default
selector	string	css selector to find the displayed node	undefined
className	string	wrapper class name	undefined
miniMapClassName	string	minimap view pointer box class name	undefined
keepAspectRatio	boolean	keep aspect ratio	false
renderChild	({ left: number, top: number, width: number, height: number }) => FC	render block	undefined
renderViewPort	({ left: number, top: number, width: number, height: number }) => FC	render view port	undefined
width	number	view port width	200
height	number	view port height	200
placement	topLeft | topRight | bottomLeft | bottomRight	view port placement	bottomRight

Author

👤 波比小金刚

Show your support

Give a ⭐️ if this project helped you!

---

This README was generated with ❤️ by readme-md-generator