mirror of
https://github.com/DOI-DO/j40-cejst-2.git
synced 2025-07-30 07:41:19 -07:00
Make source/layer comments correspond
- getOSBaseMap and Map*Layers should have the same layer comments - modify constants to have matching styles between Tribal and Tracts
This commit is contained in:
parent
31a9bf51d5
commit
e1b5c598da
4 changed files with 77 additions and 76 deletions
|
@ -88,7 +88,7 @@ const MapTractLayers = ({
|
|||
minzoom={constants.GLOBAL_MIN_ZOOM_LOW}
|
||||
>
|
||||
|
||||
{/* Low zoom layer - prioritized features only */}
|
||||
{/* Low zoom layer (static) - prioritized features only */}
|
||||
<Layer
|
||||
id={constants.LOW_ZOOM_LAYER_ID}
|
||||
source-layer={constants.SCORE_SOURCE_LAYER}
|
||||
|
@ -112,7 +112,7 @@ const MapTractLayers = ({
|
|||
minzoom={constants.GLOBAL_MIN_ZOOM_HIGH}
|
||||
>
|
||||
|
||||
{/* High zoom layer - non-prioritized features only */}
|
||||
{/* High zoom layer (static) - non-prioritized features only */}
|
||||
<Layer
|
||||
id={constants.HIGH_ZOOM_LAYER_ID}
|
||||
source-layer={constants.SCORE_SOURCE_LAYER}
|
||||
|
@ -124,7 +124,7 @@ const MapTractLayers = ({
|
|||
minzoom={constants.GLOBAL_MIN_ZOOM_HIGH}
|
||||
/>
|
||||
|
||||
{/* High zoom layer - prioritized features only */}
|
||||
{/* High zoom layer (static) - prioritized features only */}
|
||||
<Layer
|
||||
id={constants.PRIORITIZED_HIGH_ZOOM_LAYER_ID}
|
||||
source-layer={constants.SCORE_SOURCE_LAYER}
|
||||
|
@ -137,7 +137,7 @@ const MapTractLayers = ({
|
|||
minzoom={constants.GLOBAL_MIN_ZOOM_HIGH}
|
||||
/>
|
||||
|
||||
{/* High zoom layer - controls the border between features */}
|
||||
{/* High zoom layer (static) - controls the border between features */}
|
||||
<Layer
|
||||
id={constants.FEATURE_BORDER_LAYER_ID}
|
||||
source-layer={constants.SCORE_SOURCE_LAYER}
|
||||
|
@ -151,18 +151,6 @@ const MapTractLayers = ({
|
|||
minzoom={constants.GLOBAL_MIN_ZOOM_FEATURE_BORDER}
|
||||
/>
|
||||
|
||||
{/* High zoom layer - border styling around the selected feature */}
|
||||
<Layer
|
||||
id={constants.SELECTED_FEATURE_BORDER_LAYER_ID}
|
||||
source-layer={constants.SCORE_SOURCE_LAYER}
|
||||
filter={filter} // This filter filters out all other features except the selected feature.
|
||||
type='line'
|
||||
paint={{
|
||||
'line-color': constants.SELECTED_FEATURE_BORDER_COLOR,
|
||||
'line-width': constants.SELECTED_FEATURE_BORDER_WIDTH,
|
||||
}}
|
||||
minzoom={constants.GLOBAL_MIN_ZOOM_HIGH}
|
||||
/>
|
||||
</Source>
|
||||
</>
|
||||
): (
|
||||
|
@ -180,7 +168,7 @@ const MapTractLayers = ({
|
|||
minzoom={constants.GLOBAL_MIN_ZOOM_HIGH}
|
||||
>
|
||||
|
||||
{/* High zoom layer - border styling around the selected feature */}
|
||||
{/* High zoom layer (dynamic) - border styling around the selected feature */}
|
||||
<Layer
|
||||
id={constants.SELECTED_FEATURE_BORDER_LAYER_ID}
|
||||
source-layer={constants.SCORE_SOURCE_LAYER}
|
||||
|
|
|
@ -62,7 +62,7 @@ const MapTribalLayer = ({
|
|||
source-layer={constants.TRIBAL_SOURCE_LAYER}
|
||||
type='fill'
|
||||
paint={{
|
||||
'fill-color': constants.TRIBAL_FILL_COLOR,
|
||||
'fill-color': constants.PRIORITIZED_FEATURE_FILL_COLOR,
|
||||
'fill-opacity': constants.TRIBAL_FEATURE_FILL_OPACITY}}
|
||||
minzoom={constants.TRIBAL_MIN_ZOOM}
|
||||
maxzoom={constants.TRIBAL_MAX_ZOOM}
|
||||
|
@ -104,7 +104,7 @@ const MapTribalLayer = ({
|
|||
type='circle'
|
||||
paint={{
|
||||
'circle-radius': constants.TRIBAL_ALASKA_CIRCLE_RADIUS,
|
||||
'circle-color': constants.TRIBAL_ALASKA_CIRCLE_FILL_COLOR,
|
||||
'circle-color': constants.PRIORITIZED_FEATURE_FILL_COLOR,
|
||||
}}
|
||||
minzoom={constants.TRIBAL_MIN_ZOOM}
|
||||
maxzoom={constants.TRIBAL_MAX_ZOOM}
|
||||
|
|
|
@ -241,11 +241,12 @@ export const TRIBAL_BORDER_COLOR = '##4EA5CF';
|
|||
export const SELECTED_TRIBAL_BORDER_COLOR = '#1A4480';
|
||||
export const TRIBAL_FILL_COLOR = '#768FB3';
|
||||
export const TRIBAL_ALASKA_CIRCLE_FILL_COLOR = '#768FB3';
|
||||
export const TRIBAL_ALASKA_CIRCLE_RADIUS = 10;
|
||||
export const TRIBAL_ALASKA_CIRCLE_RADIUS = 5;
|
||||
|
||||
// Widths
|
||||
export const FEATURE_BORDER_WIDTH = 0.8;
|
||||
export const SELECTED_FEATURE_BORDER_WIDTH = 5.0;
|
||||
export const ALAKSA_POINTS_STROKE_WIDTH = 1.0;
|
||||
|
||||
// Bounds - these bounds can be obtained by using the getCurrentMapBoundingBox() function in the map
|
||||
export const GLOBAL_MAX_BOUNDS: LngLatBoundsLike = [
|
||||
|
|
|
@ -105,8 +105,8 @@ export const getOSBaseMap = (
|
|||
'source-layer': constants.TRIBAL_SOURCE_LAYER,
|
||||
'type': 'fill',
|
||||
'paint': {
|
||||
'fill-color': constants.TRIBAL_FILL_COLOR,
|
||||
'fill-opacity': constants.TRIBAL_FEATURE_FILL_OPACITY,
|
||||
'fill-color': constants.PRIORITIZED_FEATURE_FILL_COLOR,
|
||||
'fill-opacity': constants.HIGH_ZOOM_PRIORITIZED_FEATURE_FILL_OPACITY,
|
||||
},
|
||||
'minzoom': constants.TRIBAL_MIN_ZOOM,
|
||||
'maxzoom': constants.TRIBAL_MAX_ZOOM,
|
||||
|
@ -139,7 +139,11 @@ export const getOSBaseMap = (
|
|||
'filter': ['==', ['geometry-type'], 'Point'],
|
||||
'paint': {
|
||||
'circle-radius': constants.TRIBAL_ALASKA_CIRCLE_RADIUS,
|
||||
'circle-color': constants.TRIBAL_ALASKA_CIRCLE_FILL_COLOR,
|
||||
'circle-color': constants.PRIORITIZED_FEATURE_FILL_COLOR,
|
||||
'circle-opacity': constants.HIGH_ZOOM_PRIORITIZED_FEATURE_FILL_OPACITY,
|
||||
'circle-stroke-color': constants.FEATURE_BORDER_COLOR,
|
||||
'circle-stroke-width': constants.ALAKSA_POINTS_STROKE_WIDTH,
|
||||
'circle-stroke-opacity': constants.FEATURE_BORDER_OPACITY,
|
||||
},
|
||||
'minzoom': constants.TRIBAL_MIN_ZOOM,
|
||||
'maxzoom': constants.TRIBAL_MAX_ZOOM,
|
||||
|
@ -212,55 +216,19 @@ export const getOSBaseMap = (
|
|||
'maxzoom': constants.GLOBAL_MAX_ZOOM,
|
||||
},
|
||||
|
||||
/**
|
||||
* High zoom layer - non-prioritized features only
|
||||
*/
|
||||
// A layer for labels only
|
||||
{
|
||||
'id': constants.HIGH_ZOOM_LAYER_ID,
|
||||
'source': constants.HIGH_ZOOM_SOURCE_NAME,
|
||||
'source-layer': constants.SCORE_SOURCE_LAYER,
|
||||
/**
|
||||
* This shows features where the high score < score boundary threshold.
|
||||
* In other words, this filter out prioritized features
|
||||
*/
|
||||
'filter': ['all',
|
||||
['<', constants.SCORE_PROPERTY_HIGH, constants.SCORE_BOUNDARY_THRESHOLD],
|
||||
],
|
||||
|
||||
'type': 'fill',
|
||||
'paint': {
|
||||
'fill-opacity': constants.NON_PRIORITIZED_FEATURE_FILL_OPACITY,
|
||||
'id': 'labels-only-layer',
|
||||
'source': 'labels',
|
||||
'type': 'raster',
|
||||
'layout': {
|
||||
'visibility': 'visible',
|
||||
},
|
||||
'minzoom': constants.GLOBAL_MIN_ZOOM_HIGH,
|
||||
'minzoom': constants.GLOBAL_MIN_ZOOM,
|
||||
'maxzoom': constants.GLOBAL_MAX_ZOOM,
|
||||
},
|
||||
|
||||
/**
|
||||
* High zoom layer - prioritized features only
|
||||
*/
|
||||
{
|
||||
'id': constants.PRIORITIZED_HIGH_ZOOM_LAYER_ID,
|
||||
'source': constants.HIGH_ZOOM_SOURCE_NAME,
|
||||
'source-layer': constants.SCORE_SOURCE_LAYER,
|
||||
/**
|
||||
* This shows features where the high score > score boundary threshold.
|
||||
* In other words, this filter out non-prioritized features
|
||||
*/
|
||||
'filter': ['all',
|
||||
['>', constants.SCORE_PROPERTY_HIGH, constants.SCORE_BOUNDARY_THRESHOLD],
|
||||
],
|
||||
|
||||
'type': 'fill',
|
||||
'paint': {
|
||||
'fill-color': constants.PRIORITIZED_FEATURE_FILL_COLOR,
|
||||
'fill-opacity': constants.HIGH_ZOOM_PRIORITIZED_FEATURE_FILL_OPACITY,
|
||||
},
|
||||
'minzoom': constants.GLOBAL_MIN_ZOOM_HIGH,
|
||||
},
|
||||
|
||||
|
||||
/**
|
||||
* Low zoom layer - prioritized features only
|
||||
*/
|
||||
// Low zoom layer (static) - prioritized features only
|
||||
{
|
||||
'id': constants.LOW_ZOOM_LAYER_ID,
|
||||
'source': constants.LOW_ZOOM_SOURCE_NAME,
|
||||
|
@ -282,16 +250,60 @@ export const getOSBaseMap = (
|
|||
'maxzoom': constants.GLOBAL_MAX_ZOOM_LOW,
|
||||
},
|
||||
|
||||
// A layer for labels only
|
||||
// High zoom layer (static) - non-prioritized features only
|
||||
{
|
||||
'id': 'labels-only-layer',
|
||||
'source': 'labels',
|
||||
'type': 'raster',
|
||||
'layout': {
|
||||
'visibility': 'visible',
|
||||
'id': constants.HIGH_ZOOM_LAYER_ID,
|
||||
'source': constants.HIGH_ZOOM_SOURCE_NAME,
|
||||
'source-layer': constants.SCORE_SOURCE_LAYER,
|
||||
/**
|
||||
* This shows features where the high score < score boundary threshold.
|
||||
* In other words, this filter out prioritized features
|
||||
*/
|
||||
'filter': ['all',
|
||||
['<', constants.SCORE_PROPERTY_HIGH, constants.SCORE_BOUNDARY_THRESHOLD],
|
||||
],
|
||||
|
||||
'type': 'fill',
|
||||
'paint': {
|
||||
'fill-opacity': constants.NON_PRIORITIZED_FEATURE_FILL_OPACITY,
|
||||
},
|
||||
'minzoom': constants.GLOBAL_MIN_ZOOM,
|
||||
'maxzoom': constants.GLOBAL_MAX_ZOOM,
|
||||
'minzoom': constants.GLOBAL_MIN_ZOOM_HIGH,
|
||||
},
|
||||
|
||||
// High zoom layer (static) - prioritized features only
|
||||
{
|
||||
'id': constants.PRIORITIZED_HIGH_ZOOM_LAYER_ID,
|
||||
'source': constants.HIGH_ZOOM_SOURCE_NAME,
|
||||
'source-layer': constants.SCORE_SOURCE_LAYER,
|
||||
/**
|
||||
* This shows features where the high score > score boundary threshold.
|
||||
* In other words, this filter out non-prioritized features
|
||||
*/
|
||||
'filter': ['all',
|
||||
['>', constants.SCORE_PROPERTY_HIGH, constants.SCORE_BOUNDARY_THRESHOLD],
|
||||
],
|
||||
|
||||
'type': 'fill',
|
||||
'paint': {
|
||||
'fill-color': constants.PRIORITIZED_FEATURE_FILL_COLOR,
|
||||
'fill-opacity': constants.HIGH_ZOOM_PRIORITIZED_FEATURE_FILL_OPACITY,
|
||||
},
|
||||
'minzoom': constants.GLOBAL_MIN_ZOOM_HIGH,
|
||||
},
|
||||
|
||||
// High zoom layer (static) - controls the border between features
|
||||
{
|
||||
'id': constants.FEATURE_BORDER_LAYER_ID,
|
||||
'source': constants.HIGH_ZOOM_SOURCE_NAME,
|
||||
'source-layer': constants.SCORE_SOURCE_LAYER,
|
||||
'type': 'line',
|
||||
'paint': {
|
||||
'line-color': constants.FEATURE_BORDER_COLOR,
|
||||
'line-width': constants.FEATURE_BORDER_WIDTH,
|
||||
'line-opacity': constants.FEATURE_BORDER_OPACITY,
|
||||
},
|
||||
'minzoom': constants.GLOBAL_MIN_ZOOM_FEATURE_BORDER,
|
||||
'maxzoom': constants.GLOBAL_MAX_ZOOM_FEATURE_BORDER,
|
||||
},
|
||||
],
|
||||
};
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue