publicdata/j40-cejst-2
1
0
Fork 0
mirror of https://github.com/DOI-DO/j40-cejst-2.git synced 2025-08-30 07:11:39 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions

Followup styling fixes (#335)

Browse source 
* Followup to add proper score property to popup
* Adding Additional property name constants
This commit is contained in:
Nat Hillard 2021-07-13 11:17:49 -04:00 • committed by GitHub
commit 6c8d71c5b9
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 10 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

1
client/src/data/constants.tsx
View file

@ -16,6 +16,7 @@ export const HIGH_SCORE_SOURCE_NAME = 'score-high';
export const HIGH_SCORE_LAYER_NAME = 'score-high-layer';
export const LOW_SCORE_SOURCE_NAME = 'score-low';
export const LOW_SCORE_LAYER_NAME = 'score-low-layer';
export const SELECTED_PROPERTY = 'selected';
// The name of the layer within the tiles that contains the score
export const SCORE_SOURCE_LAYER = 'blocks';

12
client/src/data/mapStyle.tsx
View file

@ -68,7 +68,7 @@ const mapStyle : Style = {
'minzoom': constants.GLOBAL_MIN_ZOOM,
'maxzoom': constants.GLOBAL_MAX_ZOOM,
},
'score-high': {
[constants.HIGH_SCORE_SOURCE_NAME]: {
// "Score-high" represents the full set of data
// at the census block group level. It is only shown
// at high zoom levels to avoid performance issues at lower zooms
@ -85,7 +85,7 @@ const mapStyle : Style = {
'minzoom': constants.GLOBAL_MIN_ZOOM_HIGH,
'maxzoom': constants.GLOBAL_MAX_ZOOM_HIGH,
},
'score-low': {
[constants.LOW_SCORE_SOURCE_NAME]: {
// "Score-low" represents a tileset at the level of bucketed tracts.
// census block group information is `dissolve`d into tracts, then
// each tract is `dissolve`d into one of ten buckets. It is meant
@ -165,7 +165,7 @@ const mapStyle : Style = {
{
// "Score-highlights" represents the border
// around given tiles that appears at higher zooms
'id': 'score-highlights',
'id': 'score-highlights-layer',
'source': constants.HIGH_SCORE_SOURCE_NAME,
'source-layer': constants.SCORE_SOURCE_LAYER,
'type': 'line',
@ -185,7 +185,7 @@ const mapStyle : Style = {
{
// "score-border-highlight" is used to highlight
// the currently-selected feature
'id': 'score-border-highlight',
'id': 'score-border-highlight-layer',
'type': 'line',
'source': constants.HIGH_SCORE_SOURCE_NAME,
'source-layer': constants.SCORE_SOURCE_LAYER,
@ -194,7 +194,7 @@ const mapStyle : Style = {
'line-color': constants.BORDER_HIGHLIGHT_COLOR,
'line-width': [
'case',
['boolean', ['feature-state', 'selected'], false],
['boolean', ['feature-state', constants.SELECTED_PROPERTY], false],
constants.HIGHLIGHT_BORDER_WIDTH,
0,
],
@ -204,7 +204,7 @@ const mapStyle : Style = {
},
{
// We put labels last to ensure prominence
'id': 'labels-only',
'id': 'labels-only-layer',
'type': 'raster',
'source': 'labels',
'minzoom': constants.GLOBAL_MIN_ZOOM,