Naksha Components React Restructured

Mapbox GL Components for IndiaBiodiversity

This is a restructured version of the Naksha Components React which is available at: https://www.npmjs.com/package/naksha-components-react

Whats New

• This implements integration with new restructured API
• Changes in TOC

As of now full documentation is only available via TypeScript autocomplete but we are working on adding complete documentation

Grid Layer

Grid layer that accepts geohashes and plots grid according to it

Geoserver Vector Layer

Vector layer that shows geoserver vector layer

• Render grid layer from geohashed data (ideal for elasticsearch)

• Render vector tiles directly from geoserver

• Multiple View

• Multi Style

📦 Setup

git clone https://github.com/strandls/naksha-components-react.git

cd naksha-components-react

yarn install

📚 Storybook

yarn storybook

This loads the stories from ./stories.

📦 Usage

import Naksha from  "naksha-components-react";

  

<Naksha

viewPort={{ latitude: 20, longitude: 79, zoom: 3, bearing: 0, pitch: 0 }}

loadToC={true}

showToC={false}

mapboxApiAccessToken="pk.xxx"

nakshaApiEndpoint="/naksha-api/api"

geoserver={{ endpoint: "/geoserver", store: "ibp", workspace: "biodiv" }}

layers={[

{

id: "global-observations",

title: "Global Observations",

isAdded: true,

source: {

type: "grid",

endpoint:

"/your-api-endpoint?t={top}&l={left}&b={bottom}&r={right}&p={precision}"

}

}

]}

/>;

🔧 Configuration

Code quality checks are done with prettier, husky, and lint-staged.

🤠 Credits

• tsdx

• typescript

• chakra-ui

• react-map-gl

🙏 Contributing

Contributions/Suggestions are always welcome!

📄 License

Apache-2.0 © Strand Life Sciences