From c1d62e7b5e1d962f2826f9470ac6a8d73b1d3ddf Mon Sep 17 00:00:00 2001 From: Clay Smalley Date: Sat, 30 Jul 2022 13:13:22 -0400 Subject: [PATCH] Combine railway fill layers --- src/americana.js | 57 ++------------ src/layer/rail.js | 197 ++++++++++++++++++++-------------------------- 2 files changed, 90 insertions(+), 164 deletions(-) diff --git a/src/americana.js b/src/americana.js index 7e23ce0d6..ac0735b20 100644 --- a/src/americana.js +++ b/src/americana.js @@ -60,40 +60,25 @@ americanaLayers.push( lyrBackground.pierArea, lyrBackground.pierLine, - lyrRail.railTunnel.fill(), lyrRail.railTunnel.dashes(), - lyrRail.railServiceTunnel.fill(), lyrRail.railServiceTunnel.dashes(), - lyrRail.narrowGaugeTunnel.fill(), lyrRail.narrowGaugeTunnel.dashes(), - lyrRail.narrowGaugeServiceTunnel.fill(), lyrRail.narrowGaugeServiceTunnel.dashes(), - lyrRail.preservedTunnel.fill(), lyrRail.preservedTunnel.dashes(), - lyrRail.preservedServiceTunnel.fill(), lyrRail.preservedServiceTunnel.dashes(), - lyrRail.subwayTunnel.fill(), - lyrRail.subwayServiceTunnel.fill(), - - lyrRail.monorailTunnel.fill(), - lyrRail.monorailServiceTunnel.fill(), - - lyrRail.lightRailTunnel.fill(), lyrRail.lightRailTunnel.dashes(), - lyrRail.lightRailServiceTunnel.fill(), lyrRail.lightRailServiceTunnel.dashes(), - lyrRail.tramTunnel.fill(), lyrRail.tramTunnel.dashes(), - lyrRail.tramServiceTunnel.fill(), lyrRail.tramServiceTunnel.dashes(), - lyrRail.funicularTunnel.fill(), lyrRail.funicularTunnel.dashes(), + lyrRail.railwayTunnel.fill(), + lyrConstruction.road, lyrRoad.motorwayLinkTunnel.casing(), @@ -257,40 +242,25 @@ americanaLayers.push( lyrRoad.secondaryToll.surface(), lyrRoad.primaryToll.surface(), - lyrRail.rail.fill(), lyrRail.rail.dashes(), - lyrRail.railService.fill(), lyrRail.railService.dashes(), - lyrRail.narrowGauge.fill(), lyrRail.narrowGauge.dashes(), - lyrRail.narrowGaugeService.fill(), lyrRail.narrowGaugeService.dashes(), - lyrRail.preserved.fill(), lyrRail.preserved.dashes(), - lyrRail.preservedService.fill(), lyrRail.preservedService.dashes(), - lyrRail.subway.fill(), - lyrRail.subwayService.fill(), - - lyrRail.monorail.fill(), - lyrRail.monorailService.fill(), - - lyrRail.lightRail.fill(), lyrRail.lightRail.dashes(), - lyrRail.lightRailService.fill(), lyrRail.lightRailService.dashes(), - lyrRail.tram.fill(), lyrRail.tram.dashes(), - lyrRail.tramService.fill(), lyrRail.tramService.dashes(), - lyrRail.funicular.fill(), lyrRail.funicular.dashes(), + lyrRail.railway.fill(), + lyrOneway.road, lyrOneway.link ); @@ -381,40 +351,25 @@ var bridgeLayers = [ lyrRoad.secondaryTollBridge.surface(), lyrRoad.primaryTollBridge.surface(), - lyrRail.railBridge.fill(), lyrRail.railBridge.dashes(), - lyrRail.railServiceBridge.fill(), lyrRail.railServiceBridge.dashes(), - lyrRail.narrowGaugeBridge.fill(), lyrRail.narrowGaugeBridge.dashes(), - lyrRail.narrowGaugeServiceBridge.fill(), lyrRail.narrowGaugeServiceBridge.dashes(), - lyrRail.preservedBridge.fill(), lyrRail.preservedBridge.dashes(), - lyrRail.preservedServiceBridge.fill(), lyrRail.preservedServiceBridge.dashes(), - lyrRail.subwayBridge.fill(), - lyrRail.subwayServiceBridge.fill(), - - lyrRail.monorailBridge.fill(), - lyrRail.monorailServiceBridge.fill(), - - lyrRail.lightRailBridge.fill(), lyrRail.lightRailBridge.dashes(), - lyrRail.lightRailServiceBridge.fill(), lyrRail.lightRailServiceBridge.dashes(), - lyrRail.tramBridge.fill(), lyrRail.tramBridge.dashes(), - lyrRail.tramServiceBridge.fill(), lyrRail.tramServiceBridge.dashes(), - lyrRail.funicularBridge.fill(), lyrRail.funicularBridge.dashes(), + lyrRail.railwayBridge.fill(), + lyrOneway.bridge, lyrOneway.bridgeLink, ]; diff --git a/src/layer/rail.js b/src/layer/rail.js index 61a800b07..b2ac8ae70 100644 --- a/src/layer/rail.js +++ b/src/layer/rail.js @@ -39,15 +39,13 @@ function zoomInterpolate(widthZ20) { } // Helper function to create a "filter" block for a particular railway class. -function filterRail(railClass, service, brunnel) { +function filterRail(brunnel) { return [ "all", brunnel === "surface" ? ["!in", "brunnel", "bridge", "tunnel"] : ["==", "brunnel", brunnel], ["in", "class", "rail", "transit"], - ["==", "subclass", railClass], - [service ? "in" : "!in", "service", "siding", "spur", "yard"], ]; } @@ -59,6 +57,36 @@ var defRail = { }; var serviceSelector = ["match", ["get", "service"], ["siding", "spur", "yard"]]; +var isService = ["in", "service", "siding", "spur", "yard"]; +var isNotService = ["!in", "service", "siding", "spur", "yard"]; + +var lineColor = [ + "match", + ["get", "brunnel"], + "tunnel", + "hsl(0, 0%, 90%)", + [ + "match", + ["get", "subclass"], + ["preserved", "subway", "light_rail", "monorail", "funicular"], + "hsl(0, 0%, 50%)", + "hsl(0, 0%, 60%)", + ], +]; + +var lineWidth = [ + "match", + ["get", "subclass"], + ["rail", "narrow_gauge", "subway"], + [...serviceSelector, 2, 4], + "monorail", + [...serviceSelector, 1.6, 3.2], + "preserved", + [...serviceSelector, 0.8, 1.6], + [...serviceSelector, 1.25, 2.5], +]; + +var lineGapWidth = ["match", ["get", "subclass"], "preserved", 1.6, 0]; // Bridge casing layers export const bridgeCasing = { @@ -89,10 +117,8 @@ export const bridgeCasing = { }; // Generate a unique layer ID -function uniqueLayerID(railClass, service, part, brunnel, constraints) { - var layerID = [railClass, service ? "service" : "rail", part, brunnel].join( - "_" - ); +function uniqueLayerID(part, brunnel, constraints) { + var layerID = ["rail", part, brunnel].join("_"); if (constraints != null) { layerID += "_" + constraints.join("_").replaceAll("=", "").replaceAll("-", "_"); @@ -100,20 +126,9 @@ function uniqueLayerID(railClass, service, part, brunnel, constraints) { return layerID; } -function baseRailLayer( - railClass, - id, - brunnel, - minzoom, - maxzoom, - service, - constraints -) { - var layer = Util.layerClone( - defRail, - uniqueLayerID(railClass, service, id, brunnel, constraints) - ); - layer.filter = filterRail(railClass, service, brunnel); +function baseRailLayer(id, brunnel, minzoom, maxzoom, constraints) { + var layer = Util.layerClone(defRail, uniqueLayerID(id, brunnel, constraints)); + layer.filter = filterRail(brunnel); layer.minzoom = minzoom; if (maxzoom) { layer.maxzoom = maxzoom; @@ -124,14 +139,16 @@ function baseRailLayer( // Base railway class class Railway { + constructor() { + this.brunnel = "surface"; + this.minZoom = 10; + } fill = function () { var layer = baseRailLayer( - this.railClass, "fill", this.brunnel, this.minZoom, null, - this.service, this.constraints ); layer.layout = { @@ -140,11 +157,9 @@ class Railway { visibility: "visible", }; layer.paint = { - "line-color": `hsl(0, 0%, ${this.lightness}%)`, - "line-gap-width": this.gapWidthZ20 - ? zoomInterpolate(this.gapWidthZ20) - : 0, - "line-width": zoomInterpolate(this.widthZ20), + "line-color": lineColor, + "line-gap-width": zoomInterpolate(lineGapWidth), + "line-width": zoomInterpolate(lineWidth), }; if (this.constraints != null) { layer.filter.push(this.constraints); @@ -153,12 +168,10 @@ class Railway { }; dashes = function () { var layer = baseRailLayer( - this.railClass, "dashes", this.brunnel, this.minZoom, null, - this.service, this.constraints ); layer.layout = { @@ -167,8 +180,10 @@ class Railway { visibility: "visible", }; layer.paint = { - "line-color": `hsl(0, 0%, ${this.lightness}%)`, - "line-width": zoomInterpolate(this.widthZ20 * this.dashWidthFactor), + "line-color": lineColor, + "line-width": zoomInterpolate( + multiplyMatchExpression(lineWidth, this.dashWidthFactor) + ), "line-dasharray": this.dashArray.map( (stop) => stop / 2 / this.dashWidthFactor ), @@ -181,41 +196,51 @@ class Railway { }; } +class RailwayBridge extends Railway { + constructor() { + super(); + this.brunnel = "bridge"; + } +} + +class RailwayTunnel extends Railway { + constructor() { + super(); + this.brunnel = "tunnel"; + } +} + // Railway class styles class Rail extends Railway { constructor() { super(); - this.railClass = "rail"; + this.constraints = ["all", ["==", "subclass", "rail"], isNotService]; this.brunnel = "surface"; - this.service = false; - this.minZoom = 10; this.dashWidthFactor = 3; this.dashArray = [1, 25]; - - this.widthZ20 = 4; - - this.lightness = 60; } } class RailService extends Rail { constructor() { super(); - this.service = true; + this.constraints = ["all", ["==", "subclass", "rail"], isService]; this.dashWidthFactor = 4; this.dashArray = [1, 50]; - - this.widthZ20 = 2; } } class NarrowGauge extends Rail { constructor() { super(); - this.railClass = "narrow_gauge"; + this.constraints = [ + "all", + ["==", "subclass", "narrow_gauge"], + isNotService, + ]; this.dashWidthFactor = 2; this.dashArray = [1, 1, 1, 15]; @@ -225,165 +250,122 @@ class NarrowGauge extends Rail { class NarrowGaugeService extends NarrowGauge { constructor() { super(); - this.service = true; + this.constraints = ["all", ["==", "subclass", "narrow_gauge"], isService]; this.dashWidthFactor = 3; this.dashArray = [1, 2, 1, 30]; - - this.widthZ20 = 2; } } class Preserved extends Railway { constructor() { super(); - this.railClass = "preserved"; + this.constraints = ["all", ["==", "subclass", "preserved"], isNotService]; this.brunnel = "surface"; - this.service = false; this.minZoom = 14; this.dashWidthFactor = 4; this.dashArray = [1, 8]; - - this.widthZ20 = 1.6; - this.gapWidthZ20 = 1.6; - - this.lightness = 50; } } class PreservedService extends Preserved { constructor() { super(); - this.service = true; + this.constraints = ["all", ["==", "subclass", "preserved"], isService]; this.dashWidthFactor = 6; this.dashArray = [1, 16]; - - this.widthZ20 = 0.8; } } class Subway extends Railway { constructor() { super(); - this.railClass = "subway"; + this.constraints = ["all", ["==", "subclass", "subway"], isNotService]; this.brunnel = "surface"; - this.service = false; this.minZoom = 14; - - this.widthZ20 = 4; - - this.lightness = 50; } } class SubwayService extends Subway { constructor() { super(); - this.service = true; - - this.widthZ20 = 2; + this.constraints = ["all", ["==", "subclass", "subway"], isService]; } } class Monorail extends Railway { constructor() { super(); - this.railClass = "monorail"; + this.constraints = ["all", ["==", "subclass", "monorail"], isNotService]; this.brunnel = "surface"; - this.service = false; this.minZoom = 14; - - this.widthZ20 = 3.2; - - this.lightness = 50; } } class MonorailService extends Monorail { constructor() { super(); - this.service = true; - - this.widthZ20 = 1.6; + this.constraints = ["all", ["==", "subclass", "monorail"], isService]; } } class LightRail extends Railway { constructor() { super(); - this.railClass = "light_rail"; + this.constraints = ["all", ["==", "subclass", "light_rail"], isNotService]; this.brunnel = "surface"; - this.service = false; this.minZoom = 14; this.dashWidthFactor = 2; this.dashArray = [1, 6]; - - this.widthZ20 = 2.5; - - this.lightness = 50; } } class LightRailService extends LightRail { constructor() { super(); - this.service = true; + this.constraints = ["all", ["==", "subclass", "light_rail"], isService]; this.dashWidthFactor = 3; this.dashArray = [1, 12]; - - this.widthZ20 = 1.25; } } class Tram extends Railway { constructor() { super(); - this.railClass = "tram"; + this.constraints = ["all", ["==", "subclass", "tram"], isNotService]; this.brunnel = "surface"; - this.service = false; this.minZoom = 14; this.dashWidthFactor = 2; this.dashArray = [1, 6]; - - this.widthZ20 = 2.5; - - this.lightness = 60; } } class TramService extends Tram { constructor() { super(); - this.service = true; + this.constraints = ["all", ["==", "subclass", "tram"], isService]; this.dashWidthFactor = 3; this.dashArray = [1, 12]; - - this.widthZ20 = 1.25; } } class Funicular extends Railway { constructor() { super(); - this.railClass = "funicular"; + this.constraints = ["==", "subclass", "funicular"]; this.brunnel = "surface"; - this.service = false; this.minZoom = 14; this.dashWidthFactor = 2.3; this.dashArray = [1, 2]; - - this.widthZ20 = 2.5; - - this.lightness = 50; } } @@ -509,7 +491,6 @@ class RailTunnel extends Rail { constructor() { super(); this.brunnel = "tunnel"; - this.lightness = 90; } } @@ -517,7 +498,6 @@ class RailServiceTunnel extends RailService { constructor() { super(); this.brunnel = "tunnel"; - this.lightness = 90; } } @@ -525,7 +505,6 @@ class NarrowGaugeTunnel extends NarrowGauge { constructor() { super(); this.brunnel = "tunnel"; - this.lightness = 90; } } @@ -533,7 +512,6 @@ class NarrowGaugeServiceTunnel extends NarrowGaugeService { constructor() { super(); this.brunnel = "tunnel"; - this.lightness = 90; } } @@ -541,7 +519,6 @@ class PreservedTunnel extends Preserved { constructor() { super(); this.brunnel = "tunnel"; - this.lightness = 90; } } @@ -549,7 +526,6 @@ class PreservedServiceTunnel extends PreservedService { constructor() { super(); this.brunnel = "tunnel"; - this.lightness = 90; } } @@ -557,7 +533,6 @@ class SubwayTunnel extends Subway { constructor() { super(); this.brunnel = "tunnel"; - this.lightness = 90; } } @@ -565,7 +540,6 @@ class SubwayServiceTunnel extends SubwayService { constructor() { super(); this.brunnel = "tunnel"; - this.lightness = 90; } } @@ -573,7 +547,6 @@ class MonorailTunnel extends Monorail { constructor() { super(); this.brunnel = "tunnel"; - this.lightness = 90; } } @@ -581,7 +554,6 @@ class MonorailServiceTunnel extends MonorailService { constructor() { super(); this.brunnel = "tunnel"; - this.lightness = 90; } } @@ -589,7 +561,6 @@ class LightRailTunnel extends LightRail { constructor() { super(); this.brunnel = "tunnel"; - this.lightness = 90; } } @@ -597,7 +568,6 @@ class LightRailServiceTunnel extends LightRailService { constructor() { super(); this.brunnel = "tunnel"; - this.lightness = 90; } } @@ -605,7 +575,6 @@ class FunicularTunnel extends Funicular { constructor() { super(); this.brunnel = "tunnel"; - this.lightness = 90; } } @@ -613,7 +582,6 @@ class TramTunnel extends Tram { constructor() { super(); this.brunnel = "tunnel"; - this.lightness = 90; } } @@ -621,10 +589,13 @@ class TramServiceTunnel extends TramService { constructor() { super(); this.brunnel = "tunnel"; - this.lightness = 90; } } +export const railway = new Railway(); +export const railwayBridge = new RailwayBridge(); +export const railwayTunnel = new RailwayTunnel(); + export const rail = new Rail(); export const railBridge = new RailBridge(); export const railTunnel = new RailTunnel();