diff --git a/css/25_areas.css b/css/25_areas.css index 2b2abe0c4..85f886bef 100644 --- a/css/25_areas.css +++ b/css/25_areas.css @@ -199,7 +199,11 @@ path.fill.tag-power-plant { } /* Teal things */ -.pattern-color-wetland { +.pattern-color-wetland, +.pattern-color-wetland_marsh, +.pattern-color-wetland_swamp, +.pattern-color-wetland_bog, +.pattern-color-wetland_reedbed { fill: rgba(153, 225, 170, 0.3); } path.stroke.tag-natural-wetland { diff --git a/dist/img/pattern/bushes.png b/dist/img/pattern/bushes.png new file mode 100644 index 000000000..c9df1a23d Binary files /dev/null and b/dist/img/pattern/bushes.png differ diff --git a/dist/img/pattern/wetland.png b/dist/img/pattern/wetland.png index c9df1a23d..41be0c436 100644 Binary files a/dist/img/pattern/wetland.png and b/dist/img/pattern/wetland.png differ diff --git a/dist/img/pattern/wetland_bog.png b/dist/img/pattern/wetland_bog.png new file mode 100644 index 000000000..c0c70ba7c Binary files /dev/null and b/dist/img/pattern/wetland_bog.png differ diff --git a/dist/img/pattern/wetland_marsh.png b/dist/img/pattern/wetland_marsh.png new file mode 100644 index 000000000..1da40147e Binary files /dev/null and b/dist/img/pattern/wetland_marsh.png differ diff --git a/dist/img/pattern/wetland_reedbed.png b/dist/img/pattern/wetland_reedbed.png new file mode 100644 index 000000000..19a61fe79 Binary files /dev/null and b/dist/img/pattern/wetland_reedbed.png differ diff --git a/dist/img/pattern/wetland_swamp.png b/dist/img/pattern/wetland_swamp.png new file mode 100644 index 000000000..da4a44a93 Binary files /dev/null and b/dist/img/pattern/wetland_swamp.png differ diff --git a/modules/svg/areas.js b/modules/svg/areas.js index 7e1e0af1c..77613460c 100644 --- a/modules/svg/areas.js +++ b/modules/svg/areas.js @@ -11,7 +11,11 @@ export function svgAreas(projection, context) { // Patterns only work in Firefox when set directly on element. // (This is not a bug: https://bugzilla.mozilla.org/show_bug.cgi?id=750632) var patterns = { - // tag - value - rules (pattern) + // tag - value - rules (optional tag-values, pattern name) + // (matches earlier rules first, so fallback should be last entry) + amenity: { + grave_yard: [ { pattern: 'cemetery' } ] + }, landuse: { cemetery: [ { pattern: 'cemetery' } ], construction: [ { pattern: 'construction' } ], @@ -31,9 +35,16 @@ export function svgAreas(projection, context) { }, natural: { beach: [ { pattern: 'beach' } ], + grassland: [ { pattern: 'grass' } ], sand: [ { pattern: 'beach' } ], scrub: [ { pattern: 'scrub' } ], - wetland: [ { pattern: 'wetland' } ], + wetland: [ + { wetland: 'marsh', pattern: 'wetland_marsh' }, + { wetland: 'swamp', pattern: 'wetland_swamp' }, + { wetland: 'bog', pattern: 'wetland_bog' }, + { wetland: 'reedbed', pattern: 'wetland_reedbed' }, + { pattern: 'wetland' } + ], wood: [ { leaf_type: 'broadleaved', pattern: 'forest_broadleaved' }, { leaf_type: 'needleleaved', pattern: 'forest_needleleaved' }, @@ -50,34 +61,34 @@ export function svgAreas(projection, context) { return; } - for (var p in patterns) { // this iterates over potential tag values - if (patterns.hasOwnProperty(p)) { - var value = d.tags[p]; - if (value) { - var rules = patterns[p]; - for (var r in rules) { // this iterates over potential tag values - if (rules.hasOwnProperty(r)) { - if (value === r) { - var cases = rules[r]; - for (var c in cases) { // this iterates over rules for a tag-value pair - var match = cases[c]; + for (var tag in patterns) { + if (patterns.hasOwnProperty(tag)) { + var entityValue = d.tags[tag]; + if (entityValue) { - var matched = true; - for (var m in match) { // this iterates over any additional rules for a tag-value pair - if (m !== 'pattern' && match.hasOwnProperty(m)) { - // The only rule is a required tag-value pair - var v = d.tags[m]; - if (!v || v !== match[m]) { - matched = false; - break; - } + var values = patterns[tag]; + for (var value in values) { + if (entityValue === value) { + + var rules = values[value]; + for (var ruleKey in rules) { + var rule = rules[ruleKey]; + + var pass = true; + for (var criterion in rule) { + if (criterion !== 'pattern') { // reserved for pattern name + // The only rule is a required tag-value pair + var v = d.tags[criterion]; + if (!v || v !== rule[criterion]) { + pass = false; + break; } } + } - if (matched) { - this.style.fill = this.style.stroke = 'url("#pattern-' + match.pattern + '")'; - return; - } + if (pass) { + this.style.fill = this.style.stroke = 'url("#pattern-' + rule.pattern + '")'; + return; } } } diff --git a/modules/svg/defs.js b/modules/svg/defs.js index e81b7f8c8..f8a3b1e98 100644 --- a/modules/svg/defs.js +++ b/modules/svg/defs.js @@ -73,7 +73,11 @@ export function svgDefs(context) { .data([ // pattern name, pattern image name ['wetland', 'wetland'], - ['scrub', 'wetland'], + ['wetland_marsh', 'wetland_marsh'], + ['wetland_swamp', 'wetland_swamp'], + ['wetland_bog', 'wetland_bog'], + ['wetland_reedbed', 'wetland_reedbed'], + ['scrub', 'bushes'], ['construction', 'construction'], ['cemetery', 'cemetery'], ['orchard', 'orchard'], @@ -84,8 +88,7 @@ export function svgDefs(context) { ['forest', 'forest'], ['forest_broadleaved', 'forest_broadleaved'], ['forest_needleleaved', 'forest_needleleaved'], - ['forest_leafless', 'forest_leafless'], - ['wood', 'forest'] + ['forest_leafless', 'forest_leafless'] ]) .enter() .append('pattern')