From 76a59b215142a91a9a5c2b77ed01cf178861d316 Mon Sep 17 00:00:00 2001
From: Bruce Crevensten <bruce.crevensten@gmail.com>
Date: Mon, 25 Nov 2024 12:05:38 -0800
Subject: [PATCH] Demographic Adjustments (#682)

---
 assets/scss/main.scss                         |  14 ++
 .../demographics/DemographicsAgesChart.vue    |  29 +++--
 .../demographics/DemographicsHealthChart.vue  |  60 ++++++---
 .../demographics/DemographicsOther.vue        |  95 ++++++++++----
 .../DemographicsRaceEthnicityChart.vue        |  38 +++++-
 .../demographics/DemographicsReport.vue       |  20 +--
 pages/credits.vue                             |  22 +++-
 pages/data.vue                                | 103 +++++++--------
 store/demographics.js                         | 121 +++++++++---------
 utils/http_errors.js                          |   2 +
 10 files changed, 324 insertions(+), 180 deletions(-)

diff --git a/assets/scss/main.scss b/assets/scss/main.scss
index 72b35297..6d88eb12 100644
--- a/assets/scss/main.scss
+++ b/assets/scss/main.scss
@@ -24,12 +24,26 @@ label.label {
   font-weight: 500;
 }
 
+.block-centered {
+  margin-left: auto;
+  margin-right: auto;
+}
+
 .content-wrapper {
   max-width: 50rem;
   margin-left: auto;
   margin-right: auto;
 }
 
+// Some lighter formatting for the demographic tables, still more
+// like other tables
+table.table.demographic {
+  td {
+    font-family: 'IBM Plex Mono', monospace;
+    font-weight: 500;
+  }
+}
+
 // Formatting common for report tables (temp/precip, indicators)
 table.table.report-table {
   width: 100%;
diff --git a/components/reports/demographics/DemographicsAgesChart.vue b/components/reports/demographics/DemographicsAgesChart.vue
index eced87bb..ea7fe223 100644
--- a/components/reports/demographics/DemographicsAgesChart.vue
+++ b/components/reports/demographics/DemographicsAgesChart.vue
@@ -1,16 +1,20 @@
 <template>
   <div class="block">
     <div class="content is-size-5">
-      Computed from the 2020 US Census Demographics and Housing Characteristics File (DHC). Data are shown both as a chart and as a table, below.
+      Computed from the 2020 U.S. Census Demographics and Housing
+      Characteristics File (DHC). Data are shown both as a chart and as a table,
+      below.
     </div>
+
     <div id="demographics-ages-chart" />
+
     <div class="block">
-      <table class="table mt-6">
+      <table class="block-centered table demographic mt-6">
         <caption>
-          Age, by category,
+          Age distribution,
           {{
             placeName
-          }}
+          }}, compared to Alaska and U.S.
         </caption>
         <thead>
           <tr>
@@ -33,7 +37,12 @@
   </div>
 </template>
 
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+#demographics-ages-chart {
+  width: 1200px;
+  margin: 0 auto;
+}
+</style>
 
 <script>
 import _ from 'lodash'
@@ -72,7 +81,7 @@ export default {
               abc[key][demo] = Number(
                 this.demographics[demo]['pct_under_18'] -
                   this.demographics[demo]['pct_under_5']
-              ).toPrecision(4)
+              ).toPrecision(3)
               break
 
             case 'pct_18_to_64':
@@ -80,7 +89,7 @@ export default {
                 100 -
                   this.demographics[demo]['pct_65_plus'] -
                   this.demographics[demo]['pct_under_18']
-              ).toPrecision(4)
+              ).toPrecision(3)
               break
 
             case 'pct_65_plus':
@@ -237,7 +246,10 @@ export default {
       var dataTraces = [trace0, trace1, trace2, trace3]
 
       var layout = {
-        title: 'Age, by category',
+        title:
+          'Age distribution, ' +
+          this.placeName +
+          ', compared to Alaska and U.S.',
         barmode: 'stack',
 
         margin: {
@@ -247,7 +259,6 @@ export default {
           l: 200,
         },
         height: 250,
-        width: 1200,
         legend: {
           orientation: 'h',
           traceorder: 'normal',
diff --git a/components/reports/demographics/DemographicsHealthChart.vue b/components/reports/demographics/DemographicsHealthChart.vue
index 05088ae0..cad07434 100644
--- a/components/reports/demographics/DemographicsHealthChart.vue
+++ b/components/reports/demographics/DemographicsHealthChart.vue
@@ -3,13 +3,18 @@
     <h5 class="title is-5">Health conditions</h5>
     <div class="block" v-if="healthConditionsPresent">
       <div class="content is-size-5">
-        <p>Data from the 2023 CDC PLACES dataset.</p>
+        <p>
+          Data from the 2024 CDC PLACES dataset. Values are crude prevalence,
+          and the 95% confidence interval is shown in parentheses for each
+          value.
+        </p>
       </div>
-      <table class="table">
+      <table class="table block-centered demographic">
         <caption>
-          Health conditions<br /><span class="clause"
-            >crude prevalence, 95% confidence interval</span
-          >
+          Health conditions among adults aged &ge;18 years,
+          {{
+            placeName
+          }}, compared to Alaska and U.S.
         </caption>
         <thead>
           <th scope="col">Condition</th>
@@ -20,9 +25,30 @@
         <tbody>
           <tr v-for="(conditionName, key) in conditions">
             <th scope="row" v-html="conditionName"></th>
-            <td>{{ demographics['place'][key] }}%</td>
-            <td>{{ demographics['alaska'][key] }}%</td>
-            <td>{{ demographics['us'][key] }}%</td>
+            <td>
+              {{ demographics['place'][key] }}%
+              <span class="ci">
+                ({{ demographics['place'][key + '_low'] }}&ndash;{{
+                  demographics['place'][key + '_high']
+                }})
+              </span>
+            </td>
+            <td>
+              {{ demographics['alaska'][key] }}%
+              <span class="ci">
+                ({{ demographics['alaska'][key + '_low'] }}&ndash;{{
+                  demographics['alaska'][key + '_high']
+                }})
+              </span>
+            </td>
+            <td>
+              {{ demographics['us'][key] }}%
+              <span class="ci">
+                ({{ demographics['us'][key + '_low'] }}&ndash;{{
+                  demographics['us'][key + '_high']
+                }})
+              </span>
+            </td>
           </tr>
         </tbody>
       </table>
@@ -53,6 +79,9 @@ table {
     }
   }
 }
+span.ci {
+  font-weight: 400;
+}
 </style>
 
 <script>
@@ -66,13 +95,12 @@ export default {
   data() {
     return {
       conditions: {
-        pct_asthma: 'Current asthma among adults aged &ge;18 years',
-        pct_copd:
-          'Chronic obstructive pulmonary disease among adults aged &ge;18 years',
-        pct_hd: 'Coronary heart disease among adults aged &ge;18 years',
-        pct_stroke: 'Stroke among adults aged &ge;18 years',
-        pct_diabetes: 'Diagnosed diabetes among adults aged &ge;18 years',
-        pct_kd: 'Chronic kidney disease among adults aged &ge;18 years',
+        pct_asthma: 'Current asthma',
+        pct_copd: 'Chronic obstructive pulmonary disease',
+        pct_hd: 'Coronary heart disease',
+        pct_diabetes: 'Diagnosed diabetes',
+        pct_stroke: 'Stroke',
+        pct_mh: 'Frequent mental distress',
       },
     }
   },
@@ -81,7 +109,7 @@ export default {
       if (this.demographics) {
         let sum = 0
         Object.keys(this.conditions).forEach(k => {
-          sum += this.demographics['place'][k]
+          sum += Number.parseFloat(this.demographics['place'][k])
         })
         return sum > 0
       }
diff --git a/components/reports/demographics/DemographicsOther.vue b/components/reports/demographics/DemographicsOther.vue
index 072249b0..1893c2ef 100644
--- a/components/reports/demographics/DemographicsOther.vue
+++ b/components/reports/demographics/DemographicsOther.vue
@@ -3,9 +3,17 @@
     <h5 class="title is-5 mt-6">Social Determinants of Health</h5>
     <div class="block" v-if="otherPresent">
       <div class="content is-size-5">
-        <p>Data from the 2017-2021 CDC Social Determinants of Health (SDOH) dataset.</p>
+        <p>
+          Data from the 2017-2021 CDC Social Determinants of Health (SDOH) dataset and from the 2024 CDC PLACES dataset.
+        </p>
       </div>
-      <table class="table">
+      <table class="table block-centered demographic">
+        <caption>
+          Social determinants of health,
+          {{
+            placeName
+          }}, compared to Alaska and U.S.
+        </caption>
         <thead>
           <th scope="col"></th>
           <th scope="col">{{ placeName }}</th>
@@ -26,8 +34,8 @@
       <div class="content is-size-5">
         <p>
           Some social determinants of health (minority status, high school
-          diploma, living below 150% of poverty line, and broadband) are not
-          available for this location.
+          diploma, living below 150% of poverty line, broadband and more) are
+          not available for this location.
         </p>
       </div>
     </div>
@@ -35,10 +43,19 @@
       <div v-if="disabilityInsurancePresent">
         <div class="content is-size-5">
           <p>
-            Data in this section were taken from the 2017&ndash;2021 US Census American Community Survey (ACS) 5-year dataset. Values are estimated, and the margin of error is shown in parentheses for each value. Based on the total, civilian non-institutionalized population.
+            Data from the 2017&ndash;2021 U.S. Census American Community Survey
+            (ACS) 5-year dataset. Values are estimated, and the margin of error
+            is shown in parentheses for each value. Based on the total, civilian
+            non-institutionalized population.
           </p>
         </div>
-        <table class="table">
+        <table class="table block-centered demographic">
+          <caption>
+            Disability and insurance status,
+            {{
+              placeName
+            }}, compared to Alaska and U.S.
+          </caption>
           <thead>
             <th scope="col"></th>
             <th scope="col">{{ placeName }}</th>
@@ -49,19 +66,25 @@
             <tr v-for="(name, key) in acs">
               <th scope="row" v-html="name"></th>
               <td>
-                {{ demographics['place'][key] }}% ({{
-                  demographics['place']['moe_' + key]
-                }}%)
+                {{ demographics['place'][key] }}% <span class="ci">
+                  ({{
+                    demographics['place']['moe_' + key]
+                  }})
+                </span>
               </td>
               <td>
-                {{ demographics['alaska'][key] }}% ({{
-                  demographics['alaska']['moe_' + key]
-                }}%)
+                {{ demographics['alaska'][key] }}% <span class="ci">
+                  ({{
+                    demographics['alaska']['moe_' + key]
+                  }})
+                </span>
               </td>
               <td>
-                {{ demographics['us'][key] }}% ({{
-                  demographics['us']['moe_' + key]
-                }}%)
+                {{ demographics['us'][key] }}% <span class="ci">
+                  ({{
+                    demographics['us']['moe_' + key]
+                  }})
+                </span>
               </td>
             </tr>
           </tbody>
@@ -70,8 +93,8 @@
       <div v-else>
         <div class="content is-size-5">
           <p>
-            Demographic information for insurance status and people with a
-            disability are not available for this location.
+            Demographic information for social determinants of health and
+            disability status are not available for this location.
           </p>
         </div>
       </div>
@@ -79,7 +102,24 @@
   </div>
 </template>
 
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+table {
+  th[scope='row'] {
+    max-width: 30rem;
+  }
+  caption {
+    font-size: 110%;
+    font-weight: 500;
+    .clause {
+      font-size: 100%;
+      font-weight: 400;
+    }
+  }
+}
+span.ci {
+  font-weight: 400;
+}
+</style>
 
 <script>
 import _ from 'lodash'
@@ -94,7 +134,7 @@ export default {
       if (this.demographics) {
         let sum = 0
         Object.keys(this.otherDemographics).forEach(k => {
-          sum += this.demographics['place'][k]
+          sum += Number.parseFloat(this.demographics['place'][k])
         })
         return sum > 0
       }
@@ -104,7 +144,7 @@ export default {
       if (this.demographics) {
         let sum = 0
         Object.keys(this.acs).forEach(k => {
-          sum += this.demographics['place'][k]
+          sum += Number.parseFloat(this.demographics['place'][k])
         })
         return sum > 0
       }
@@ -121,15 +161,18 @@ export default {
         pct_no_hsdiploma:
           'No high school diploma among adults aged 25 years or older',
         pct_below_150pov: 'Persons living below 150% of the poverty level',
+        pct_unemployed: 'Unemployment among people aged 16 years or older',
+        pct_foodstamps: 'Received food stamps in the past 12 months',
+        pct_single_parent: 'Single parent households',
         pct_no_bband: 'No broadband internet subscription among households',
+        pct_crowding: 'Crowding',
+        pct_hcost: 'Housing cost burden',
+        pct_emospt: 'Lack of social and emotional support',
       },
       acs: {
-        pct_w_disability:
-          'Percent with a disability, estimate, total civilian noninstitutionalized population',
-        pct_insured:
-          'Percent insured, estimate, civilian noninstitutionalized population',
-        pct_uninsured:
-          'Percent uninsured, estimate, civilian noninstitutionalized population',
+        pct_w_disability: 'Percent with a disability',
+        pct_insured: 'Percent insured',
+        pct_uninsured: 'Percent uninsured',
       },
     }
   },
diff --git a/components/reports/demographics/DemographicsRaceEthnicityChart.vue b/components/reports/demographics/DemographicsRaceEthnicityChart.vue
index 3c8969a8..ccd14896 100644
--- a/components/reports/demographics/DemographicsRaceEthnicityChart.vue
+++ b/components/reports/demographics/DemographicsRaceEthnicityChart.vue
@@ -2,19 +2,21 @@
   <div>
     <div class="content is-size-5">
       <p>
-        Computed from the 2020 US Census Demographics and Housing
+        Computed from the 2020 U.S. Census Demographics and Housing
         Characteristics File (DHC). Data are shown both as a chart and as a
         table, below.
       </p>
     </div>
+
     <div id="demographics-race-ethnicity-chart" />
+
     <div class="block">
-      <table class="table mt-6">
+      <table class="table mt-6 block-centered demographic">
         <caption>
           Race and ethnicity,
           {{
             placeName
-          }}
+          }}, compared to Alaska and U.S.
         </caption>
         <thead>
           <tr>
@@ -37,7 +39,25 @@
   </div>
 </template>
 
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+#demographics-race-ethnicity-chart {
+  width: 1000px;
+  margin: 0 auto;
+}
+table {
+  th[scope='row'] {
+    max-width: 30rem;
+  }
+  caption {
+    font-size: 110%;
+    font-weight: 500;
+    .clause {
+      font-size: 100%;
+      font-weight: 400;
+    }
+  }
+}
+</style>
 
 <script>
 import _ from 'lodash'
@@ -120,7 +140,7 @@ export default {
       traces[2].marker = { color: '#b2df8a' }
 
       let layout = {
-        title: 'Race & Ethnicity, ' + place,
+        title: 'Race and ethnicity, ' + place + ', compared to Alaska and U.S.',
         barmode: 'group',
         margin: {
           t: 40,
@@ -129,7 +149,6 @@ export default {
           l: 200,
         },
         height: 800,
-        width: 1000,
         legend: {
           orientation: 'h',
           traceorder: 'reversed',
@@ -145,7 +164,12 @@ export default {
           },
           ticksuffix: '  ', // spacing
         },
-        xaxis: { fixedrange: true, zeroline: false },
+        xaxis: {
+          fixedrange: true,
+          zeroline: false,
+          ticksuffix: '%',
+          title: { text: 'Percent of population' },
+        },
       }
 
       let plotSettings = getPlotSettings()
diff --git a/components/reports/demographics/DemographicsReport.vue b/components/reports/demographics/DemographicsReport.vue
index e57cf19e..ba036c51 100644
--- a/components/reports/demographics/DemographicsReport.vue
+++ b/components/reports/demographics/DemographicsReport.vue
@@ -19,8 +19,8 @@
     <DemographicsMap />
     <div class="content is-size-4 mt-6">
       <p>
-        Demographic data is presented only regionally, at the level of boroughs,
-        census-designated places (CDPs), incorporated places, and census tracts.
+        Demographic data is presented regionally, at the level of borough,
+        census-designated place (CDPs), incorporated place, or census tracts.
       </p>
       <p>
         <strong>This section shows {{ commentEdited }}</strong
@@ -76,7 +76,6 @@
     />
   </div>
 </template>
-<style></style>
 <script>
 import { mapGetters } from 'vuex'
 import { formatting } from '~/mixins/formatting'
@@ -101,11 +100,16 @@ export default {
   mixins: [formatting],
   computed: {
     commentEdited() {
-      return this.demographics.place.comment
-        .replace('Data for this place represent ', '')
-        .replace('Data represent ', '')
-        .replace('.', '')
-        .replace('county', 'borough')
+      if (!this.demographics.place.comment) {
+        // It's a borough or census designated place
+        return 'the ' + this.demographics.place.name
+      } else {
+        return this.demographics.place.comment
+          .replace('Data for this place represent ', '')
+          .replace('Data represent ', '')
+          .replace('.', '')
+          .replace('county', 'borough')
+      }
     },
     adultPopulation() {
       let totalPopulation = this.demographics.place.total_population
diff --git a/pages/credits.vue b/pages/credits.vue
index 9d9e8920..0264aead 100644
--- a/pages/credits.vue
+++ b/pages/credits.vue
@@ -310,10 +310,30 @@
           </p>
         </div>
       </div>
+    
       <div class="columns mb-6">
         <div class="column is-three-fifths is-offset-one-fifth">
-          <h4 class="title is-4">Rasdaman raster database</h4>
           <div class="content is-size-5">
+          <h3>Additional contributors</h3>
+          <p>
+            Substantial additional contributions were made by the following
+            people and organizations:
+          </p>
+            <ul>
+              <li><a href="https://health.alaska.gov/dph/Epi/eph/Pages/default.aspx" >Alaska Department of Health Environmental Public Health Program</a ></li>
+              <li><a href="https://www.muni.org/Departments/health/Admin/environment/Pages/default.aspx" >Anchorage Health Department Environmental Health Program</a ></li>
+              <li><a href="https://www.anthc.org/what-we-do/community-environment-and-health/healthy-homes/" >Alaska Native Tribal Health Consortium Air &amp; Healthy Homes Program</a ></li>
+              <li><a href="https://www.anthc.org/what-we-do/climate-initiatives/center-for-climate-and-health/" >Alaska Native Tribal Health Consortium Center for Climate &amp; Health</a ></li>
+              <li><a href="https://crnative.org/">Copper River Native Association</a></li>
+              <li><a href="https://www.igiugig.com/tribal-government/8-igiugig-tribal-council" >Igiugig Village Council</a></li>
+              
+              <li><a href="https://www.loudentribe.org/">Louden Tribe</a></li>
+              <li><a href="https://nvgakona.com/">Native Village of Gakona</a></li>
+              <li>Theresa Vertigan (<a href="https://www.uaa.alaska.edu/academics/college-of-health/departments/population-health-sciences/institute-for-circumpolar-health-studies/index.cshtml" >UAA Institute for Circumpolar Health Studies</a >)</li>
+            </ul>
+          
+          <h4 class="title is-4 mt-6">Rasdaman raster database</h4>
+          
             <p>
               This tool uses the
               <a href="http://www.rasdaman.org/">rasdaman</a> array database
diff --git a/pages/data.vue b/pages/data.vue
index df25e411..33a352d2 100644
--- a/pages/data.vue
+++ b/pages/data.vue
@@ -22,7 +22,58 @@
                 <th scope="col">Source + academic reference</th>
               </tr>
             </thead>
-            <thead>
+            <tbody>
+              <tr>
+                <th scope="row">Demographics and Health</th>
+                <td>
+                  Borough/census tract(s), census-designated place (CDP),
+                  incorporated place
+                </td>
+                <td>
+                  <p>
+                    Derived from the 2020 U.S. Census Demographics and Housing
+                    Characteristics File (DHC), the 2017-2021 U.S. Census
+                    American Community Survey (ACS) 5-year dataset, the 2024 CDC
+                    PLACES dataset, and the 2017-2021 CDC Social Determinants of
+                    Health (SDOH) dataset.
+                  </p>
+                  <p>Citations:</p>
+                  <ul>
+                    <li>
+                      U.S. Census Bureau (2020). Demographics and Housing
+                      Characteristics File. Accessed November 2024, from
+                      <a
+                        href="https://www.census.gov/data/tables/2023/dec/2020-census-dhc.html"
+                        >https://www.census.gov/data/tables/2023/dec/2020-census-dhc.html</a
+                      >
+                    </li>
+                    <li>
+                      U.S. Census Bureau (2021). 2017-2021 American Community
+                      Survey 5-year estimates. Accessed May 2024, from
+                      <a
+                        href="https://www.census.gov/programs-surveys/acs/data.html"
+                        >https://www.census.gov/programs-surveys/acs/data.html</a
+                      >
+                    </li>
+                    <li>
+                      PLACES. Centers for Disease Control and Prevention.
+                      Accessed November 2024, from
+                      <a href="https://www.cdc.gov/places"
+                        >https://www.cdc.gov/places</a
+                      >
+                    </li>
+                    <li>
+                      Healthy People 2030, U.S. Department of Health and Human
+                      Services, Office of Disease Prevention and Health
+                      Promotion. Accessed November 2024, from
+                      <a
+                        href="https://health.gov/healthypeople/objectives-and-data/social-determinants-health"
+                        >https://health.gov/healthypeople/objectives-and-data/social-determinants-health</a
+                      >
+                    </li>
+                  </ul>
+                </td>
+              </tr>
               <tr>
                 <th scope="row">Elevation</th>
                 <td>30&#8239;m</td>
@@ -259,55 +310,7 @@
                   </blockquote>
                 </td>
               </tr>
-              <tr>
-                <th scope="row">Demographics and Health</th>
-                <td>Borough/census tract(s)</td>
-                <td>
-                  <p>
-                    Derived from the 2020 US Census Demographics and Housing
-                    Characteristics File (DHC), the 2017-2021 US Census American
-                    Community Survey (ACS) 5-year dataset, the 2023 CDC PLACES
-                    dataset, and the 2017-2021 CDC Social Determinants of Health
-                    (SDOH) dataset.
-                  </p>
-                  <p>Citations:</p>
-                  <ul>
-                    <li>
-                      U.S. Census Bureau (2020). Demographics and Housing
-                      Characteristics File. Accessed May 2024, from
-                      <a
-                        href="https://www.census.gov/data/tables/2023/dec/2020-census-dhc.html"
-                        >https://www.census.gov/data/tables/2023/dec/2020-census-dhc.html</a
-                      >
-                    </li>
-                    <li>
-                      U.S. Census Bureau (2021). 2017-2021 American Community
-                      Survey 5-year estimates. Accessed May 2024, from
-                      <a
-                        href="https://www.census.gov/programs-surveys/acs/data.html"
-                        >https://www.census.gov/programs-surveys/acs/data.html</a
-                      >
-                    </li>
-                    <li>
-                      PLACES. Centers for Disease Control and Prevention.
-                      Accessed May 2024, from
-                      <a href="https://www.cdc.gov/places"
-                        >https://www.cdc.gov/places</a
-                      >
-                    </li>
-                    <li>
-                      Healthy People 2030, U.S. Department of Health and Human
-                      Services, Office of Disease Prevention and Health
-                      Promotion. Accessed May 2024, from
-                      <a
-                        href="https://health.gov/healthypeople/objectives-and-data/social-determinants-health"
-                        >https://health.gov/healthypeople/objectives-and-data/social-determinants-health</a
-                      >
-                    </li>
-                  </ul>
-                </td>
-              </tr>
-            </thead>
+            </tbody>
           </table>
         </div>
       </div>
diff --git a/store/demographics.js b/store/demographics.js
index 883d2ad0..727b2b1d 100644
--- a/store/demographics.js
+++ b/store/demographics.js
@@ -37,78 +37,73 @@ export const mutations = {
 
 export const actions = {
   async fetch(context) {
-    let placeId = context.rootGetters['place/communityId']
-    let queryUrl =
+    let placeId
+
+    // We want places of type community | borough | census_area
+    let placeType = context.rootGetters['place/type']
+
+    if (placeType == 'community') {
+      placeId = context.rootGetters['place/communityId']
+    } else if (placeType == 'borough' || placeType == 'census_area') {
+      placeId = context.rootGetters['place/areaId']
+    }
+
+    // If placeId isn't defined, we don't have demographics for
+    // this place.
+    if (!placeId) {
+      return
+    }
+
+    let queryUrl = process.env.apiUrl + '/demographics/' + placeId
+    let returnedData = await $axios
+      .get(queryUrl, { timeout: 60000 })
+      .catch(function (error) {
+        if (error.response.status === 403) {
+          // Forbidden means adult population < 50
+          context.commit('setHttpError', 'low_population')
+        } else {
+          console.error(error)
+          context.commit('setHttpError', 'no_data')
+        }
+      })
+
+    // If we have an HTTP error, bail.
+    if (context.getters['httpError']) {
+      return
+    }
+
+    // We query for the geometry of the place separately
+    let geometryQueryUrl =
       "https://gs.mapventure.org/geoserver/wfs?service=WFS&version=1.0.0&request=GetFeature&typeName=demographics:demographics&outputFormat=application/json&cql_filter=id='" +
       placeId +
       "'"
-    let returnedData = await $axios
-      .get(queryUrl, { timeout: 60000 })
+    let returnedGeometry = await $axios
+      .get(geometryQueryUrl, { timeout: 60000 })
       .catch(err => {
         console.error(err)
         context.commit('setHttpError', 'no_data')
       })
 
-    // Test for a valid & non-empty response object
-    if (
-      _.isObject(returnedData.data) &&
-      _.isArray(returnedData.data.features) &&
-      _.isObject(returnedData.data.features[0]) &&
-      _.isObject(returnedData.data.features[0].properties) &&
-      _.isObject(returnedData.data.features[0].geometry)
-    ) {
-      // Valid response.
+    if (returnedData && returnedGeometry) {
+      // Make the data returns a bit more regular
+      let processed = _.mapValuesDeep(returnedData.data, (value, key) => {
+        if(key == 'total_population') {
+          // Skip this particular value.
+          return value
+        }
+        if(_.isNumber(value)) {
+          return Number.parseFloat(value).toFixed(1)
+        } else {
+          return value
+        }
+      })
+
       context.commit('setDemographicsData', {
-        // Sculpt the incoming field names to match nicer-to-read keys,
-        // field names from the shapefile are limited in length
-        // This won't necessarily be needed after we adapt the code
-        // to read from the API instead of a direct WFS query.
-        place: {
-          id: returnedData.data.features[0].properties.id,
-          name: returnedData.data.features[0].properties.name,
-          areatype: returnedData.data.features[0].properties.areatype,
-          placename: returnedData.data.features[0].properties.placename,
-          GEOID: returnedData.data.features[0].properties.GEOID,
-          total_population: returnedData.data.features[0].properties.total_popu,
-          pct_65_plus: returnedData.data.features[0].properties.pct_65_plu,
-          pct_under_18: returnedData.data.features[0].properties.pct_under_,
-          pct_under_5: returnedData.data.features[0].properties.pct_unde_1,
-          pct_hispanic_latino:
-            returnedData.data.features[0].properties.pct_hispan,
-          pct_white: returnedData.data.features[0].properties.pct_white,
-          pct_african_american:
-            returnedData.data.features[0].properties.pct_africa,
-          pct_amer_indian_ak_native:
-            returnedData.data.features[0].properties.pct_amer_i,
-          pct_asian: returnedData.data.features[0].properties.pct_asian,
-          pct_hawaiian_pacislander:
-            returnedData.data.features[0].properties.pct_hawaii,
-          pct_other: returnedData.data.features[0].properties.pct_other,
-          pct_multi: returnedData.data.features[0].properties.pct_multi,
-          pct_w_disability: returnedData.data.features[0].properties.pct_w_disa,
-          moe_pct_w_disability:
-            returnedData.data.features[0].properties.moe_pct_w_,
-          pct_insured: returnedData.data.features[0].properties.pct_insure,
-          moe_pct_insured: returnedData.data.features[0].properties.moe_pct_in,
-          pct_uninsured: returnedData.data.features[0].properties.pct_uninsu,
-          moe_pct_uninsured:
-            returnedData.data.features[0].properties.moe_pct_un,
-          pct_asthma: returnedData.data.features[0].properties.pct_asthma,
-          pct_copd: returnedData.data.features[0].properties.pct_copd,
-          pct_hd: returnedData.data.features[0].properties.pct_hd,
-          pct_stroke: returnedData.data.features[0].properties.pct_stroke,
-          pct_diabetes: returnedData.data.features[0].properties.pct_diabet,
-          pct_kd: returnedData.data.features[0].properties.pct_kd,
-          pct_minority: returnedData.data.features[0].properties.pct_minori,
-          pct_no_hsdiploma: returnedData.data.features[0].properties.pct_no_hsd,
-          pct_below_150pov: returnedData.data.features[0].properties.pct_below_,
-          pct_no_bband: returnedData.data.features[0].properties.pct_no_bba,
-          comment: returnedData.data.features[0].properties.comment,
-        },
-        alaska: demographics['AK0'],
-        us: demographics['US0'],
-        geometry: returnedData.data.features[0].geometry,
-      }) 
+        place: processed[placeId],
+        alaska: processed['AK0'],
+        us: processed['US0'],
+        geometry: returnedGeometry.data.features[0].geometry,
+      })
     } else {
       // No demographics for this place.
       context.commit('setHttpError', 'no_data')
diff --git a/utils/http_errors.js b/utils/http_errors.js
index 322b5d80..8289f6dd 100644
--- a/utils/http_errors.js
+++ b/utils/http_errors.js
@@ -5,6 +5,8 @@ export let httpErrors = {
     'Provided coordinates or area are not included in coverage',
   timeout: 'Data request timed out',
   server_error: 'A problem occurred while requesting data',
+  low_population:
+    'The adult population for the requested community is less than 50 people. To protect privacy of community members, no data is shared for this location.',
 }
 
 export const getHttpError = function (error) {