Naksha Components React Restructured

!Dependencies

!Bundle Size



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

!Grid Layer

#### Geoserver Vector Layer

Vector layer that shows geoserver vector layer

!Geoserver Vector Layer

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

- Render vector tiles directly from geoserver

- Multiple View

- Multi Style

$3

``sh

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

cd naksha-components-react

yarn install

`

$3

`

yarn storybook

`

This loads the stories from ./stories.

$3

`tsx

import Naksha from "naksha-components-react";

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}"

}

}

]}

/>;

`

$3

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

$3

- tsdx

- typescript

- chakra-ui

- react-map-gl

$3

Contributions/Suggestions are always welcome!

$3

Apache-2.0 © Strand Life Sciences