Creating constants file and moving property there, using Score D

This commit is contained in:
Nat Hillard 2021-06-29 19:12:08 -04:00
parent 568989d807
commit bf18256a51
4 changed files with 12 additions and 7 deletions

View file

@ -5,6 +5,7 @@ import {Table} from '@trussworks/react-uswds';
import {Coordinate} from 'ol/Coordinate';
import Map from 'ol/Map';
import {FeatureLike} from 'ol/Feature';
import * as constants from '../data/constants';
interface IMapPopupProps {
map: Map,
@ -62,7 +63,7 @@ const MapPopup = ({map, selectedFeature, position}: IMapPopupProps) => {
const getTitleContent = () => {
const properties = selectedFeature.getProperties();
const blockGroup = properties['GEOID10'];
const score = properties['Score C (percentile)'];
const score = properties[constants.SCORE_PROPERTY];
return (
<table>
<tbody>

View file

@ -2,6 +2,7 @@ import * as React from 'react';
import {useFlags} from '../contexts/FlagContext';
import MapboxMap from './mapboxMap';
import OpenLayersMap from './openlayersMap';
import * as constants from '../data/constants';
const MapWrapper = () => {
const flags = useFlags();
@ -12,6 +13,7 @@ const MapWrapper = () => {
<MapboxMap /> :
<OpenLayersMap features={[]}/>
}
<p>Current Score Property: {constants.SCORE_PROPERTY}</p>
</div>
);
};

View file

@ -0,0 +1 @@
export const SCORE_PROPERTY = 'Score D (percentile)';

View file

@ -1,5 +1,6 @@
import {Style, FillPaint} from 'mapbox-gl';
import chroma from 'chroma-js';
import * as constants from '../data/constants';
// eslint-disable-next-line require-jsdoc
function hexToHSLA(hex:string, alpha:number) {
@ -98,7 +99,7 @@ const mapStyle : Style = {
'custom': {
'type': 'vector',
'tiles': [
'https://d2zjid6n5ja2pt.cloudfront.net/0624_demo/{z}/{x}/{y}.pbf',
'https://d2zjid6n5ja2pt.cloudfront.net/0629_demo/{z}/{x}/{y}.pbf',
// For local development, use:
// 'http://localhost:8080/data/tl_2010_bg_with_data/{z}/{x}/{y}.pbf',
],
@ -138,11 +139,11 @@ const mapStyle : Style = {
'source-layer': 'blocks',
'type': 'fill',
'filter': ['all',
['>', 'Score C (percentile)', 0.6],
['>', constants.SCORE_PROPERTY, 0.6],
// ['in', 'STATEFP10', '01', '30', '34', '35', '36'],
],
'paint': makePaint({
field: 'Score C (percentile)',
field: constants.SCORE_PROPERTY,
minRamp: 0,
medRamp: 0.6,
maxRamp: 0.75,
@ -155,11 +156,11 @@ const mapStyle : Style = {
'source-layer': 'blocks',
'type': 'fill',
'filter': ['all',
['>', 'Score C (percentile)', 0.6],
['in', 'STATEFP10', '01', '30', '34', '35', '36'],
['>', constants.SCORE_PROPERTY, 0.6],
// ['in', 'STATEFP10', '01', '30', '34', '35', '36'],
],
'paint': makePaint({
field: 'Score C (percentile)',
field: constants.SCORE_PROPERTY,
minRamp: 0,
medRamp: 0.6,
maxRamp: 1.0,