a_adli/colouring-montreal
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #573 from mz8i/feature/538-planning-update

Browse Source 
Feature 538: planning update
This commit is contained in:
Tom Russell 2020-04-09 13:22:15 +01:00 committed by GitHub
commit 218155ccdd
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 185 additions and 99 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

116
app/map_styles/polygon.xml
View File

@ -125,87 +125,113 @@
</Style>
<Style name="date_year">
<Rule>
<Filter>[date_year] &gt;= 2000</Filter>
<PolygonSymbolizer fill="#f0eaba" />
<Filter>[date_year] &gt;= 2020</Filter>
<PolygonSymbolizer fill="#fff9b8" />
</Rule>
<Rule>
<Filter>[date_year] &gt;= 1980 and [date_year] &lt; 2000</Filter>
<Filter>[date_year] &gt;= 2000 and [date_year] &lt; 2020</Filter>
<PolygonSymbolizer fill="#fae269" />
</Rule>
<Rule>
<Filter>[date_year] &gt;= 1960 and [date_year] &lt; 1980</Filter>
<Filter>[date_year] &gt;= 1980 and [date_year] &lt; 2000</Filter>
<PolygonSymbolizer fill="#fbaf27" />
</Rule>
<Rule>
<Filter>[date_year] &gt;= 1940 and [date_year] &lt; 1960</Filter>
<Filter>[date_year] &gt;= 1960 and [date_year] &lt; 1980</Filter>
<PolygonSymbolizer fill="#e6711d" />
</Rule>
<Rule>
<Filter>[date_year] &gt;= 1940 and [date_year] &lt; 1960</Filter>
<PolygonSymbolizer fill="#cc1212" />
</Rule>
<Rule>
<Filter>[date_year] &gt;= 1920 and [date_year] &lt; 1940</Filter>
<PolygonSymbolizer fill="#d73d3a" />
<PolygonSymbolizer fill="#8f0303" />
</Rule>
<Rule>
<Filter>[date_year] &gt;= 1900 and [date_year] &lt; 1920</Filter>
<PolygonSymbolizer fill="#ba221c" />
</Rule>
<Rule>
<Filter>[date_year] &gt;= 1880 and [date_year] &lt; 1900</Filter>
<PolygonSymbolizer fill="#bb859b" />
</Rule>
<Rule>
<Filter>[date_year] &gt;= 1860 and [date_year] &lt; 1880</Filter>
<PolygonSymbolizer fill="#8b3654" />
</Rule>
<Rule>
<Filter>[date_year] &gt;= 1840 and [date_year] &lt; 1860</Filter>
<PolygonSymbolizer fill="#8f5385" />
</Rule>
<Rule>
<Filter>[date_year] &gt;= 1880 and [date_year] &lt; 1900</Filter>
<PolygonSymbolizer fill="#c3e1eb" />
</Rule>
<Rule>
<Filter>[date_year] &gt;= 1860 and [date_year] &lt; 1880</Filter>
<PolygonSymbolizer fill="#6a9dba" />
</Rule>
<Rule>
<Filter>[date_year] &gt;= 1840 and [date_year] &lt; 1860</Filter>
<PolygonSymbolizer fill="#3b74a3" />
</Rule>
<Rule>
<Filter>[date_year] &gt;= 1820 and [date_year] &lt; 1840</Filter>
<PolygonSymbolizer fill="#56619b" />
<PolygonSymbolizer fill="#95ded8" />
</Rule>
<Rule>
<Filter>[date_year] &gt;= 1800 and [date_year] &lt; 1820</Filter>
<PolygonSymbolizer fill="#6793b2" />
<PolygonSymbolizer fill="#68aba5" />
</Rule>
<Rule>
<Filter>[date_year] &gt;= 1780 and [date_year] &lt; 1800</Filter>
<PolygonSymbolizer fill="#83c3b3" />
<Filter>[date_year] &gt;= 1750 and [date_year] &lt; 1800</Filter>
<PolygonSymbolizer fill="#acc98f" />
</Rule>
<Rule>
<Filter>[date_year] &gt;= 1760 and [date_year] &lt; 1780</Filter>
<PolygonSymbolizer fill="#adc88f" />
<Filter>[date_year] &gt;= 1700 and [date_year] &lt; 1750</Filter>
<PolygonSymbolizer fill="#6d8a51" />
</Rule>
<Rule>
<Filter>[date_year] &gt;= 1740 and [date_year] &lt; 1760</Filter>
<PolygonSymbolizer fill="#83a663" />
</Rule>
<Rule>
<Filter>[date_year] &gt;= 1720 and [date_year] &lt; 1740</Filter>
<PolygonSymbolizer fill="#77852d" />
</Rule>
<Rule>
<Filter>[date_year] &gt;= 1700 and [date_year] &lt; 1720</Filter>
<PolygonSymbolizer fill="#69814e" />
</Rule>
<Rule>
<Filter>[date_year] &gt;= 1680 and [date_year] &lt; 1700</Filter>
<Filter>[date_year] &lt; 1700</Filter>
<PolygonSymbolizer fill="#d0c291" />
</Rule>
<Rule>
<Filter>[date_year] &gt;= 1660 and [date_year] &lt; 1680</Filter>
<PolygonSymbolizer fill="#918158" />
</Rule>
<Rule>
<Filter>[date_year] &lt; 1660</Filter>
<PolygonSymbolizer fill="#7a5732" />
</Rule>
</Style>
<Style name="conservation_area">
<Rule>
<PolygonSymbolizer fill="#73ebaf" />
</Rule>
</Style>
<Style name="planning_combined">
<Rule>
<Filter>[planning_in_conservation_area] = true</Filter>
<PolygonSymbolizer fill="#95beba"/>
</Rule>
<Rule>
<Filter>[listing_type] = "Grade I Listed"</Filter>
<PolygonSymbolizer fill="#c72e08"/>
</Rule>
<Rule>
<Filter>[listing_type] = "Grade II* Listed"</Filter>
<PolygonSymbolizer fill="#e75b42"/>
</Rule>
<Rule>
<Filter>[listing_type] = "Grade II Listed"</Filter>
<PolygonSymbolizer fill="#ffbea1"/>
</Rule>
<Rule>
<Filter>[listing_type] = "Locally Listed"</Filter>
<PolygonSymbolizer fill="#858ed4"/>
</Rule>
<!-- Conservation area outline -->
<Rule>
<Filter>[listing_type] != "None" and [planning_in_conservation_area] = true</Filter>
<MaxScaleDenominator>34100</MaxScaleDenominator>
<MinScaleDenominator>17061</MinScaleDenominator>
<LineSymbolizer stroke="#95beba" stroke-width="0.5"/>
</Rule>
<Rule>
<Filter>[listing_type] != "None" and [planning_in_conservation_area] = true</Filter>
<MaxScaleDenominator>17061</MaxScaleDenominator>
<MinScaleDenominator>8530</MinScaleDenominator>
<LineSymbolizer stroke="#95beba" stroke-width="1.0"/>
</Rule>
<Rule>
<Filter>[listing_type] != "None" and [planning_in_conservation_area] = true</Filter>
<MaxScaleDenominator>8530</MaxScaleDenominator>
<MinScaleDenominator>0</MinScaleDenominator>
<LineSymbolizer stroke="#95beba" stroke-width="2.5"/>
</Rule>
</Style>
<Style name="sust_dec">
<Rule>
<Filter>[sust_dec] = A</Filter>

88
app/src/frontend/building/data-containers/planning.tsx
View File

@ -1,5 +1,6 @@
import React, { Fragment } from 'react';
import InfoBox from '../../components/info-box';
import { dataFields } from '../../data_fields';
import CheckboxDataEntry from '../data-components/checkbox-data-entry';
import DataEntry from '../data-components/data-entry';
@ -22,7 +23,59 @@ const PlanningView: React.FunctionComponent<CategoryViewProps> = (props) => (
copy={props.copy}
onChange={props.onChange}
/>
<DataEntryGroup name="Listing and protections" >
<DataEntryGroup name="Planning Status">
<CheckboxDataEntry
title="Is a planning application live for this site?"
slug="planning_live_application"
value={null}
disabled={true}
/>
<CheckboxDataEntry
title={dataFields.planning_demolition_proposed.title}
slug="planning_demolition_proposed"
value={props.building.planning_demolition_proposed}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
disabled={true}
/>
<CheckboxDataEntry
title="Has this application recently been been approved/refused?"
slug="planning_recent_outcome"
value={null}
disabled={true}
/>
<CheckboxDataEntry
title="Has the work been carried out?"
slug="planning_carried_out"
value={null}
disabled={true}
/>
<InfoBox msg="For historical planning applications see Planning Portal link" />
{/*
Move to Demolition:
<CheckboxDataEntry
title={dataFields.planning_demolition_complete.title}
slug="planning_demolition_complete"
value={props.building.planning_demolition_complete}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
disabled={true}
/>
<DataEntry
title={dataFields.planning_demolition_history.title}
slug="planning_demolition_history"
value={props.building.planning_demolition_history}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
disabled={true}
/>
*/}
</DataEntryGroup>
<DataEntryGroup name="Designation and Protection" collapsed={false} >
<CheckboxDataEntry
title={dataFields.planning_in_conservation_area.title}
slug="planning_in_conservation_area"
@ -44,6 +97,7 @@ const PlanningView: React.FunctionComponent<CategoryViewProps> = (props) => (
slug="planning_in_list"
value={props.building.planning_in_list}
mode={props.mode}
disabled={true}
copy={props.copy}
onChange={props.onChange}
/>
@ -52,6 +106,7 @@ const PlanningView: React.FunctionComponent<CategoryViewProps> = (props) => (
slug="planning_list_id"
value={props.building.planning_list_id}
mode={props.mode}
disabled={true}
copy={props.copy}
onChange={props.onChange}
/>
@ -60,6 +115,7 @@ const PlanningView: React.FunctionComponent<CategoryViewProps> = (props) => (
slug="planning_list_cat"
value={props.building.planning_list_cat}
mode={props.mode}
disabled={true}
copy={props.copy}
onChange={props.onChange}
options={[
@ -75,6 +131,7 @@ const PlanningView: React.FunctionComponent<CategoryViewProps> = (props) => (
slug="planning_list_grade"
value={props.building.planning_list_grade}
mode={props.mode}
disabled={true}
copy={props.copy}
onChange={props.onChange}
options={[
@ -173,35 +230,6 @@ const PlanningView: React.FunctionComponent<CategoryViewProps> = (props) => (
onChange={props.onChange}
/>
</DataEntryGroup>
<DataEntryGroup name="Demolition and demolition history">
<CheckboxDataEntry
title={dataFields.planning_demolition_proposed.title}
slug="planning_demolition_proposed"
value={props.building.planning_demolition_proposed}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
disabled={true}
/>
<CheckboxDataEntry
title={dataFields.planning_demolition_complete.title}
slug="planning_demolition_complete"
value={props.building.planning_demolition_complete}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
disabled={true}
/>
<DataEntry
title={dataFields.planning_demolition_history.title}
slug="planning_demolition_history"
value={props.building.planning_demolition_history}
mode={props.mode}
copy={props.copy}
onChange={props.onChange}
disabled={true}
/>
</DataEntryGroup>
</Fragment>
);
const PlanningContainer = withCopyEdit(PlanningView);

8
app/src/frontend/map/legend.css
View File

@ -7,7 +7,8 @@
right: 10px;
z-index: 1000;
min-width: 12rem;
min-width: 14rem;
max-width: 14rem;
max-height: 60%;
display: flex;
@ -63,6 +64,11 @@
.map-legend p {
margin: 0.25rem 0 0.5rem;
}
.map-legend .legend-disclaimer {
font-size: 0.8em;
padding:0;
}
.data-legend {
overflow: auto;
list-style: none;

49
app/src/frontend/map/legend.tsx
View File

@ -43,25 +43,21 @@ const LEGEND_CONFIG = {
age: {
title: 'Age',
elements: [
{ color: '#f0eaba', text: '≥2000' },
{ color: '#fae269', text: '1980–2000' },
{ color: '#fbaf27', text: '1960–1980' },
{ color: '#e6711d', text: '1940–1960' },
{ color: '#d73d3a', text: '1920–1940' },
{ color: '#ba221c', text: '1900–1920' },
{ color: '#bb859b', text: '1880–1900' },
{ color: '#8b3654', text: '1860–1880' },
{ color: '#8f5385', text: '1840–1860' },
{ color: '#56619b', text: '1820–1840' },
{ color: '#6793b2', text: '1800–1820' },
{ color: '#83c3b3', text: '1780–1800' },
{ color: '#adc88f', text: '1760–1780' },
{ color: '#83a663', text: '1740–1760' },
{ color: '#77852d', text: '1720–1740' },
{ color: '#69814e', text: '1700–1720' },
{ color: '#d0c291', text: '1680–1700' },
{ color: '#918158', text: '1660–1680' },
{ color: '#7a5732', text: '<1660' },
{ color: '#fff9b8', text: '>2020' },
{ color: '#fae269', text: '2000-2019' },
{ color: '#fbaf27', text: '1980-1999' },
{ color: '#e6711d', text: '1960-1979' },
{ color: '#cc1212', text: '1940-1959' },
{ color: '#8f0303', text: '1920-1939' },
{ color: '#8f5385', text: '1900-1919' },
{ color: '#c3e1eb', text: '1880-1899' },
{ color: '#6a9dba', text: '1860-1879' },
{ color: '#3b74a3', text: '1840-1859' },
{ color: '#95ded8', text: '1820-1839' },
{ color: '#68aba5', text: '1800-1819' },
{ color: '#acc98f', text: '1750-1799' },
{ color: '#6d8a51', text: '1700-1749' },
{ color: '#d0c291', text: '<1700' },
]
},
size: {
@ -103,9 +99,14 @@ const LEGEND_CONFIG = {
elements: []
},
planning: {
title: 'Planning',
title: 'Statutory protections',
disclaimer: 'All data relating to designated buildings should be checked on the National Heritage List for England or local authority websites where used for planning or development purposes',
elements: [
{ color: '#73ebaf', text: 'within conservation area' },
{ color: '#95beba', text: 'In conservation area'},
{ color: '#c72e08', text: 'Grade I listed'},
{ color: '#e75b42', text: 'Grade II* listed'},
{ color: '#ffbea1', text: 'Grade II listed'},
{ color: '#858ed4', text: 'Locally listed'},
]
},
community: {
@ -200,11 +201,15 @@ class Legend extends React.Component<LegendProps, LegendState> {
{
elements.length?
<ul className={this.state.collapseList ? 'collapse data-legend' : 'data-legend'} >
{
details.disclaimer &&
<p className='legend-disclaimer'>{details.disclaimer}</p>
}
{
elements.map((item) => (
<li key={item.color} >
<span className="key" style={ { background: item.color } }>-</span>
<span className="key" style={ { background: item.color, border: item.border } }>-</span>
{ item.text }
</li>

2
app/src/frontend/map/map.tsx
View File

@ -133,7 +133,7 @@ class ColouringMap extends Component<ColouringMapProps, ColouringMapState> {
size: 'size_height',
location: 'location',
like: 'likes',
planning: 'conservation_area',
planning: 'planning_combined',
sustainability: 'sust_dec',
type: 'building_attachment_form',
use: 'landuse'

21
app/src/tiles/dataDefinition.ts
View File

@ -87,6 +87,27 @@ const BUILDING_LAYER_DEFINITIONS = {
g.geometry_id = b.geometry_id
AND b.likes_total > 0
) as likes`,
planning_combined: `(
SELECT
g.geometry_geom,
(
CASE
WHEN b.planning_list_cat = 'Listed Building' and b.planning_list_grade = 'I' THEN 'Grade I Listed'
WHEN b.planning_list_cat = 'Listed Building' and b.planning_list_grade = 'II*' THEN 'Grade II* Listed'
WHEN b.planning_list_cat = 'Listed Building' and b.planning_list_grade = 'II' THEN 'Grade II Listed'
WHEN b.planning_in_local_list THEN 'Locally Listed'
ELSE 'None'
END
) as listing_type,
b.planning_in_conservation_area
FROM geometries as g
JOIN buildings as b
ON g.geometry_id = b.geometry_id
WHERE
b.planning_in_conservation_area
OR b.planning_in_local_list
OR b.planning_list_cat is not null
) as planning_combined`,
conservation_area: `(
SELECT
g.geometry_geom