React-datamaps-india NPM

react-datamaps-india 🇮🇳

Datamaps for india region

✨ Demo

🏠 Homepage

Installation

pnpm add react-datamaps-india

or with other package manager like npm

npm install react-datamaps-india

Usage

import DatamapsIndia from 'react-datamaps-india'

const Example = () => {
  return (
    <DatamapsIndia
      regionData={{
        Maharashtra: {
          value: 10,
        },
      }}
      hoverComponent={({ value }) => {
        return (
          <>
            <p>{value.name}</p>
            <p>{value.value}</p>
          </>
        )
      }}
      mapLayout={{
        title: 'Title',
        legendTitle: 'Legend Title',
        startColor: '#FFDAB9',
        endColor: '#FF6347',
        hoverTitle: 'Count',
        noDataColor: '#f5f5f5',
        borderColor: '#8D8D8D',
        hoverBorderColor: '#8D8D8D',
        hoverColor: 'green',
      }}
    />
  )
}

Available Props

regionData (optional)

Object of valid states with count. Find valid states below

mapLayout (optional)

Object of map layout props

title: '',
legendTitle: '',
startColor: 'blue',
endColor: 'red',
hoverTitle: 'Count',
noDataColor: '#f5f5f5',
borderColor: '#8D8D8D',
hoverColor: 'green'
hoverBorderColor: 'green'

Valid States

Andaman & Nicobar Island
Andhra Pradesh
Arunachal Pradesh
Assam
Bihar
Chandigarh
Chhattisgarh
Dadara & Nagar Haveli
Daman & Diu
Delhi
Goa
Gujarat
Haryana
Himachal Pradesh
Jammu & Kashmir
Jharkhand
Karnataka
Kerala
Lakshadweep
Madhya Pradesh
Maharashtra
Manipur
Meghalaya
Mizoram
Nagaland
Odisha
Puducherry
Punjab
Rajasthan
Sikkim
Tamil Nadu
Telangana
Tripura
Uttar Pradesh
Uttarakhand
West Bengal