diff --git a/css/80_app.css b/css/80_app.css index c7a7a885d..041f1340f 100644 --- a/css/80_app.css +++ b/css/80_app.css @@ -3043,7 +3043,7 @@ img.tile-debug { .nocolor { color: rgba(0, 0, 0, 0); } .red { color: rgba(255, 0, 0, 0.75); } .green { color: rgba(0, 255, 0, 0.75); } -.blue { color: rgba(0, 0, 255, 0.75); } +.blue { color: rgba(176, 176, 255, 0.75); } .yellow { color: rgba(255, 255, 0, 0.75); } .cyan { color: rgba(0, 255, 255, 0.75); } .magenta { color: rgba(255, 0, 255, 0.75); } diff --git a/data/index.js b/data/index.js index f2ae2544b..efe68ee9e 100644 --- a/data/index.js +++ b/data/index.js @@ -12,6 +12,11 @@ export { default as dataImperial } from './imperial.json'; export { default as dataDriveLeft } from './drive-left.json'; export { en as dataEn } from '../dist/locales/en.json'; +import { + features as ociFeatures, + resources as ociResources +} from 'osm-community-index'; + import { dataImagery } from './imagery.json'; import { presets } from './presets/presets.json'; import { defaults } from './presets/defaults.json'; @@ -22,6 +27,10 @@ import maki from '@mapbox/maki'; export var dataFeatureIcons = maki.layouts.all.all; export var data = { + community: { + features: ociFeatures, + resources: ociResources + }, imagery: dataImagery, presets: { presets: presets, diff --git a/modules/core/context.js b/modules/core/context.js index 72e5ecd00..cffed7bef 100644 --- a/modules/core/context.js +++ b/modules/core/context.js @@ -316,6 +316,7 @@ export function coreContext() { tile: false, // tile boundaries collision: false, // label collision bounding boxes imagery: false, // imagery bounding polygons + community: false, // community bounding polygons imperial: false, // imperial (not metric) bounding polygons driveLeft: false, // driveLeft bounding polygons target: false // touch targets diff --git a/modules/svg/debug.js b/modules/svg/debug.js index 71f007417..26e6e112e 100644 --- a/modules/svg/debug.js +++ b/modules/svg/debug.js @@ -1,3 +1,5 @@ +import _values from 'lodash-es/values'; + import { select as d3_select } from 'd3-selection'; import { geoPolygonIntersectsPolygon } from '../geo'; @@ -20,6 +22,7 @@ export function svgDebug(projection, context) { var showsTile = context.getDebug('tile'); var showsCollision = context.getDebug('collision'); var showsImagery = context.getDebug('imagery'); + var showsCommunity = context.getDebug('community'); var showsImperial = context.getDebug('imperial'); var showsDriveLeft = context.getDebug('driveLeft'); var showsTouchTargets = context.getDebug('target'); @@ -34,6 +37,9 @@ export function svgDebug(projection, context) { if (showsImagery) { debugData.push({ class: 'orange', label: 'imagery' }); } + if (showsCommunity) { + debugData.push({ class: 'blue', label: 'community' }); + } if (showsImperial) { debugData.push({ class: 'cyan', label: 'imperial' }); } @@ -71,7 +77,7 @@ export function svgDebug(projection, context) { var layer = selection.selectAll('.layer-debug') - .data(showsImagery || showsImperial || showsDriveLeft ? [0] : []); + .data(showsImagery || showsCommunity || showsImperial || showsDriveLeft ? [0] : []); layer.exit() .remove(); @@ -102,6 +108,17 @@ export function svgDebug(projection, context) { .attr('class', 'debug-imagery debug orange'); + var community = layer.selectAll('path.debug-community') + .data(showsCommunity ? _values(data.community.features) : []); + + community.exit() + .remove(); + + community.enter() + .append('path') + .attr('class', 'debug-community debug blue'); + + var imperial = layer .selectAll('path.debug-imperial') .data(showsImperial ? [dataImperial] : []); diff --git a/package.json b/package.json index 973e062a4..7ab950f56 100644 --- a/package.json +++ b/package.json @@ -58,6 +58,7 @@ "mocha-phantomjs-core": "^2.1.0", "name-suggestion-index": "0.1.5", "npm-run-all": "^4.0.0", + "osm-community-index": "~0.3.0", "phantomjs-prebuilt": "~2.1.11", "request": "^2.85.0", "rollup": "~0.57.0",