add outline for historic map on top of it

This commit is contained in:
Mateusz Konieczny 2022-11-18 17:28:54 +01:00
parent 8f1a03222c
commit 19770cd343
5 changed files with 19 additions and 5 deletions

View File

@ -19,6 +19,13 @@
<MinScaleDenominator>0</MinScaleDenominator> <MinScaleDenominator>0</MinScaleDenominator>
</Rule> </Rule>
</Style> </Style>
<Style name="base_night_outlines">
<Rule>
<LineSymbolizer stroke="#ffccccaa" stroke-width="0.5" />
<MaxScaleDenominator>17000</MaxScaleDenominator>
<MinScaleDenominator>0</MinScaleDenominator>
</Rule>
</Style>
<Style name="number_labels"> <Style name="number_labels">
<Rule> <Rule>
<TextSymbolizer <TextSymbolizer

View File

@ -8,7 +8,7 @@ export const initialMapViewport: MapViewport = {
zoom: 16, zoom: 16,
}; };
export type MapTheme = 'light' | 'night'; export type MapTheme = 'light' | 'night' | 'night_outlines';
export type BoroughEnablementState = 'enabled' | 'disabled'; export type BoroughEnablementState = 'enabled' | 'disabled';
@ -22,5 +22,6 @@ export type HistoricDataEnablementState = 'enabled' | 'disabled';
export const mapBackgroundColor: Record<MapTheme, string> = { export const mapBackgroundColor: Record<MapTheme, string> = {
light: '#F0EEEB', light: '#F0EEEB',
night: '#162639' night: '#162639',
night_outlines: '#162639'
}; };

View File

@ -21,6 +21,6 @@ export type BuildingMapTileset = 'date_year' |
'dynamics_demolished_count' | 'dynamics_demolished_count' |
'team'; 'team';
export type SpecialMapTileset = 'base_light' | 'base_night' | 'highlight' | 'number_labels'; export type SpecialMapTileset = 'base_light' | 'base_night' | 'base_night_outlines' | 'highlight' | 'number_labels';
export type MapTileset = BuildingMapTileset | SpecialMapTileset; export type MapTileset = BuildingMapTileset | SpecialMapTileset;

View File

@ -1,13 +1,14 @@
import * as React from 'react'; import * as React from 'react';
import { TileLayer } from 'react-leaflet'; import { TileLayer } from 'react-leaflet';
import { HistoricDataEnablementState } from '../../config/map-config'; import { HistoricDataEnablementState } from '../../config/map-config';
import { BuildingBaseLayer } from './building-base-layer';
export function HistoricDataLayer({enablement}: {enablement: HistoricDataEnablementState}) { export function HistoricDataLayer({enablement}: {enablement: HistoricDataEnablementState}) {
if(enablement == "enabled") { if(enablement == "enabled") {
return <TileLayer return <><TileLayer
url="https://mapseries-tilesets.s3.amazonaws.com/london_1890s/{z}/{x}/{y}.png" url="https://mapseries-tilesets.s3.amazonaws.com/london_1890s/{z}/{x}/{y}.png"
attribution='&copy; CC BY 4.0 - Reproduced with the permission of the <a href="https://maps.nls.uk/">National Library of Scotland</a>' attribution='&copy; CC BY 4.0 - Reproduced with the permission of the <a href="https://maps.nls.uk/">National Library of Scotland</a>'
/> /><BuildingBaseLayer theme="night_outlines" /></>
} else { } else {
return null; return null;
} }

View File

@ -13,6 +13,11 @@ const LAYER_QUERIES = {
geometry_id geometry_id
FROM FROM
buildings`, buildings`,
base_night_outlines: `
SELECT
geometry_id
FROM
buildings`,
number_labels:` number_labels:`
SELECT SELECT
geometry_id, geometry_id,