This is a react component for adding a quick base map selector with a happy path for using UGRC's Discover Service.
Install with npm
npm install @ugrc/layer-selector
{
view: PropTypes.object.isRequired,
quadWord: PropTypes.string,
baseLayers: PropTypes.arrayOf(
PropTypes.oneOfType([
PropTypes.oneOf([
'Hybrid',
'Lite',
'Terrain',
'Topo',
'Color IR',
'Address Points',
'Overlay',
'Imagery',
]),
PropTypes.shape({
Factory: PropTypes.oneOfType([PropTypes.func, PropTypes.string])
.isRequired,
urlTemplate: PropTypes.string,
url: PropTypes.string,
id: PropTypes.string.isRequired,
tileInfo: PropTypes.object,
linked: PropTypes.arrayOf(PropTypes.string),
}),
PropTypes.shape({
token: PropTypes.oneOf([
'Hybrid',
'Lite',
'Terrain',
'Topo',
'Color IR',
'Address Points',
'Overlay',
]).isRequired,
selected: PropTypes.bool,
linked: PropTypes.arrayOf(PropTypes.string),
}),
])
).isRequired,
overlays: PropTypes.arrayOf(
PropTypes.oneOfType([
PropTypes.oneOf(['Address Points', 'Overlay']),
PropTypes.shape({
Factory: PropTypes.oneOfType([PropTypes.func, PropTypes.string])
.isRequired,
urlTemplate: PropTypes.string,
url: PropTypes.string,
id: PropTypes.string.isRequired,
tileInfo: PropTypes.object,
linked: PropTypes.arrayOf(PropTypes.string),
}),
])
),
position: PropTypes.oneOf([
'bottom-leading',
'bottom-left',
'bottom-right',
'bottom-trailing',
'top-leading',
'top-left',
'top-right',
'top-trailing',
]),
makeExpandable: PropTypes.bool,
layerType: PropTypes.string,
id: PropTypes.string,
}
{
makeExpandable: true,
position: 'top-right',
}