2.0.1 • Published 1 year ago

wcsmap v2.0.1

Weekly downloads
-
License
-
Repository
-
Last release
1 year ago

WCS's Impact Platform Map Component

Developed by ICA

Install

Install using npm install wcsmap

Usage

In a React app, use the Map component:
import WCSMap from 'wcsmap'

Props

NameTypeDescription
basemapsObject[]array of objects that describe basemaps, see documentation for example.
layersObjectobject that describes all the layers to be loaded, see documentation for example.
activeBasemapstringid of basemap, has to belong to basemaps Array.
mapZoomintegerlevel of initial zoom.
mapCenterObjectobject that contains latitude and longitude, see documentation for example.
customCssstringurl with custom css.
languagestringstring that describes language of map component, can be: 'en-US', 'fr-FR' or 'es-ES'.
clusterSymbolObjectobject that defines the style of the cluster marker.
clusterLabelObjectobject that defines the style of the cluster label.
cmsIntegrationbooleanflag to tell the map component if it's standalone or CMS integrated.
messagesObjectobject that contains all translations that are used in the map component, see documentation for example.
map3Dbooleanflag to tell the map component if the map will be 2D or 3D.
shapefilePolygonSymbolObjectobject that defines the style of the uploaded polygons via shapefile.
shapefilePointSymbolObjectobject that defines the style of the uploaded points via shapefile.

mapZoom:

3

mapCenterCoordinates:

{ latitude: 0, longitude: 0 },

clusterSymbol:

{
    type: "simple-marker",  // don't change
    color: [116, 21, 48, 1],
    outline: { 
      color: [116, 21, 48, 0.5],
      width: "0.5px"
    }
}

clusterLabel:

{
    type: "text", // don't change
    color: "#f3f6f4",
    font: {
      weight: "bold",
      family: "Noto Sans",
      size: "12px"
    }
}

shapefilePolygonSymbol:

{
    type: "simple-fill", // don't change
    color: [255, 255, 0, 0],
    style: "solid",
    outline: {
        color: "#008000",
        width: 3
    }
}

shapefilePointSymbol:

{
    type: "simple-marker", // don't change
    style: "circle", // don't change
    color: [0, 128, 0],
    size: "8px"
}
1.8.0

1 year ago

2.0.1

1 year ago

2.0.0

1 year ago

1.7.0

1 year ago

1.6.0

1 year ago

1.5.0

2 years ago

1.4.0

2 years ago

1.2.0

2 years ago

1.1.0

2 years ago

1.3.0

2 years ago

0.25.0

2 years ago

0.24.0

2 years ago

0.23.0

2 years ago

0.22.0

2 years ago

0.21.0

2 years ago

0.20.0

2 years ago

0.19.0

2 years ago

0.18.0

2 years ago

0.17.0

2 years ago

0.16.0

2 years ago

0.15.0

2 years ago

0.14.0

2 years ago

0.13.0

2 years ago

0.12.0

2 years ago

0.11.0

2 years ago

0.10.0

2 years ago

0.9.0

2 years ago

0.8.0

2 years ago

0.7.0

2 years ago

0.6.0

2 years ago

0.5.0

2 years ago

0.4.0

2 years ago

0.3.0

2 years ago

0.2.0

2 years ago

0.1.0

2 years ago