@madup-inc/react-imagemarker
    TypeScript icon, indicating that this package has built-in type declarations

    0.0.13 • Public • Published

    react-imagemarker

    Made with create-react-library

    NPM JavaScript Style Guide

    Install

    npm install --save @madup-inc/react-imagemarker

    Usage

    import React from 'react'
    import ImageMarker from '@madup-inc/react-imagemarker'
    import '@madup-inc/react-imagemarker/dist/index.css'
    
    const markers = [
      {
        x: 20,
        y: 40,
        id: 1,
      },
      {
        x: 40,
        y: 40,
        id: 2,
      },
      {
        x: 70,
        y: 55,
        id: 3,
        render: () => <div style={{ fontSize: 30 }}>🙂</div>,
      },
    ]
    
    const App = () => {
      return (
        <div style={{ width: 500, height: 500 }}>
          <ImageMarker
            src="https://lever.me/statics/image/introduce/Group16.svg"
            markers={markers}
            onImageClick={({ x, y }, clickEvent, wrapperDom) => {
              console.log({ x, y, clickEvent, wrapperDom })
            }}
          />
        </div>
      )
    }
    
    export default App

    Output 🙂

    License

    MIT © Madup

    Install

    npm i @madup-inc/react-imagemarker

    DownloadsWeekly Downloads

    16

    Version

    0.0.13

    License

    MIT

    Unpacked Size

    16.3 kB

    Total Files

    10

    Last publish

    Collaborators

    • keating529
    • madup-frontend