diff --git a/data/core.yaml b/data/core.yaml index b3fdc7399..9795047bf 100644 --- a/data/core.yaml +++ b/data/core.yaml @@ -319,8 +319,6 @@ en: metric: Metric imperial: Imperial node_count: Number of nodes - coordinate_pair: "{latitude}, {longitude}" - area_pair: "{area1} ({area2})" geometry: point: point vertex: vertex @@ -1068,3 +1066,5 @@ en: square_meters: "{quantity} m²" square_kilometers: "{quantity} km²" hectares: "{quantity} ha" + area_pair: "{area1} ({area2})" + coordinate_pair: "{latitude}, {longitude}" diff --git a/dist/locales/en.json b/dist/locales/en.json index 24831e3ba..7f9170fd3 100644 --- a/dist/locales/en.json +++ b/dist/locales/en.json @@ -398,9 +398,7 @@ "location": "Location", "metric": "Metric", "imperial": "Imperial", - "node_count": "Number of nodes", - "coordinate_pair": "{latitude}, {longitude}", - "area_pair": "{area1} ({area2})" + "node_count": "Number of nodes" } }, "geometry": { @@ -1233,7 +1231,9 @@ "kilometers": "{quantity} km", "square_meters": "{quantity} m²", "square_kilometers": "{quantity} km²", - "hectares": "{quantity} ha" + "hectares": "{quantity} ha", + "area_pair": "{area1} ({area2})", + "coordinate_pair": "{latitude}, {longitude}" }, "presets": { "categories": { diff --git a/modules/ui/panels/location.js b/modules/ui/panels/location.js index 42bda702e..3a866a5bf 100644 --- a/modules/ui/panels/location.js +++ b/modules/ui/panels/location.js @@ -1,23 +1,12 @@ import _debounce from 'lodash-es/debounce'; +import { displayCoordinatePair } from '../../util/units'; import { t } from '../../util/locale'; import { services } from '../../services'; export function uiPanelLocation(context) { var currLocation = ''; - var OSM_PRECISION = 7; - - - function wrap(x, min, max) { - var d = max - min; - return ((x - min) % d + d) % d + min; - } - - - function clamp(x, min, max) { - return Math.max(min, Math.min(x, max)); - } function redraw(selection) { @@ -32,9 +21,7 @@ export function uiPanelLocation(context) { coord = context.map().center(); } - var coordStr = - clamp(coord[1], -90, 90).toFixed(OSM_PRECISION) + ', ' + - wrap(coord[0], -180, 180).toFixed(OSM_PRECISION); + var coordStr = displayCoordinatePair(coord); list .append('li') diff --git a/modules/ui/panels/measurement.js b/modules/ui/panels/measurement.js index e9ccfa467..4300a55af 100644 --- a/modules/ui/panels/measurement.js +++ b/modules/ui/panels/measurement.js @@ -8,6 +8,7 @@ import { } from 'd3-geo'; import { t } from '../../util/locale'; +import { displayArea, displayLength, displayCoordinatePair } from '../../util/units'; import { geoExtent } from '../../geo'; import { utilDetect } from '../../util/detect'; @@ -16,7 +17,6 @@ import { utilDetect } from '../../util/detect'; export function uiPanelMeasurement(context) { var locale = utilDetect().locale, isImperial = (locale.toLowerCase() === 'en-us'); - var OSM_PRECISION = 7; function radiansToMeters(r) { @@ -52,82 +52,6 @@ export function uiPanelMeasurement(context) { } - function displayLength(m) { - var d = m * (isImperial ? 3.28084 : 1), - unit; - - if (isImperial) { - if (d >= 5280) { - d /= 5280; - unit = 'miles'; - } else { - unit = 'feet'; - } - } else { - if (d >= 1000) { - d /= 1000; - unit = 'kilometers'; - } else { - unit = 'meters'; - } - } - - return t('units.' + unit, { - quantity: d.toLocaleString(locale, { maximumSignificantDigits: 4 }) - }); - } - - - function displayArea(m2) { - var d = m2 * (isImperial ? 10.7639111056 : 1), - d1, d2, unit1, unit2, area; - - if (isImperial) { - if (d >= 6969600) { // > 0.25mi² show mi² - d1 = d / 27878400; - unit1 = 'square_miles'; - } else { - d1 = d; - unit1 = 'square_feet'; - } - - if (d > 4356 && d < 43560000) { // 0.1 - 1000 acres - d2 = d / 43560; - unit2 = 'acres'; - } - - } else { - if (d >= 250000) { // > 0.25km² show km² - d1 = d / 1000000; - unit1 = 'square_kilometers'; - } else { - d1 = d; - unit1 = 'square_meters'; - } - - if (d > 1000 && d < 10000000) { // 0.1 - 1000 hectares - d2 = d / 10000; - unit2 = 'hectares'; - } - } - - area = t('units.' + unit1, { - quantity: d1.toLocaleString(locale, { maximumSignificantDigits: 4 }) - }); - - if (d2) { - return t('info_panels.measurement.area_pair', { - area1: area, - area2: t('units.' + unit2, { - quantity: d2.toLocaleString(locale, { maximumSignificantDigits: 2 }) - }) - }); - } else { - return area; - } - } - - function redraw(selection) { var resolver = context.graph(); var selected = _filter(context.selectedIDs(), function(e) { return context.hasEntity(e); }); @@ -161,12 +85,7 @@ export function uiPanelMeasurement(context) { .append('li') .text(t('info_panels.measurement.center') + ':') .append('span') - .text( - t('info_panels.measurement.coordinate_pair', { - latitude: center[1].toLocaleString(locale, { maximumFractionDigits: OSM_PRECISION }), - longitude: center[0].toLocaleString(locale, { maximumFractionDigits: OSM_PRECISION }) - }) - ); + .text(displayCoordinatePair(center)); return; } @@ -203,7 +122,7 @@ export function uiPanelMeasurement(context) { .append('li') .text(t('info_panels.measurement.area') + ':') .append('span') - .text(displayArea(area)); + .text(displayArea(area, isImperial)); } @@ -211,18 +130,13 @@ export function uiPanelMeasurement(context) { .append('li') .text(lengthLabel + ':') .append('span') - .text(displayLength(length)); + .text(displayLength(length, isImperial)); list .append('li') .text(t('info_panels.measurement.centroid') + ':') .append('span') - .text( - t('info_panels.measurement.coordinate_pair', { - latitude: centroid[1].toLocaleString(locale, { maximumFractionDigits: OSM_PRECISION }), - longitude: centroid[0].toLocaleString(locale, { maximumFractionDigits: OSM_PRECISION }) - }) - ); + .text(displayCoordinatePair(centroid)); var toggle = isImperial ? 'imperial' : 'metric'; @@ -250,9 +164,7 @@ export function uiPanelMeasurement(context) { .append('li') .text(centerLabel + ':') .append('span') - .text( - center[1].toFixed(OSM_PRECISION) + ', ' + center[0].toFixed(OSM_PRECISION) - ); + .text(displayCoordinatePair(center)); } } diff --git a/modules/ui/scale.js b/modules/ui/scale.js index 7693a784a..953dc1f66 100644 --- a/modules/ui/scale.js +++ b/modules/ui/scale.js @@ -1,12 +1,11 @@ +import { displayLength } from '../util/units'; import { geoLonToMeters, geoMetersToLon } from '../geo'; -import { t } from '../util/locale'; import { utilDetect } from '../util/detect'; export function uiScale(context) { var projection = context.projection, - locale = utilDetect().locale, - isImperial = (locale.toLowerCase() === 'en-us'), + isImperial = (utilDetect().locale.toLowerCase() === 'en-us'), maxLength = 180, tickHeight = 8; @@ -16,7 +15,7 @@ export function uiScale(context) { conversion = (isImperial ? 3.28084 : 1), dist = geoLonToMeters(loc2[0] - loc1[0], lat) * conversion, scale = { dist: 0, px: 0, text: '' }, - buckets, i, val, dLon, unit; + buckets, i, val, dLon; if (isImperial) { buckets = [5280000, 528000, 52800, 5280, 500, 50, 5, 1]; @@ -38,22 +37,7 @@ export function uiScale(context) { dLon = geoMetersToLon(scale.dist / conversion, lat); scale.px = Math.round(projection([loc1[0] + dLon, loc1[1]])[0]); - if (isImperial) { - if (scale.dist >= 5280) { - scale.dist /= 5280; - unit = 'miles'; - } else { - unit = 'feet'; - } - } else { - if (scale.dist >= 1000) { - scale.dist /= 1000; - unit = 'kilometers'; - } else { - unit = 'meters'; - } - } - scale.text = t('units.' + unit, { quantity: scale.dist.toLocaleString(locale) }); + scale.text = displayLength(scale.dist / conversion, isImperial); return scale; } diff --git a/modules/util/units.js b/modules/util/units.js new file mode 100644 index 000000000..7ea5a2304 --- /dev/null +++ b/modules/util/units.js @@ -0,0 +1,95 @@ +import { t } from 'locale'; +import { utilDetect } from 'detect'; + +var OSM_PRECISION = 7; +var locale = utilDetect().locale; + +export function displayLength(m, isImperial) { + var d = m * (isImperial ? 3.28084 : 1), + unit; + + if (isImperial) { + if (d >= 5280) { + d /= 5280; + unit = 'miles'; + } else { + unit = 'feet'; + } + } else { + if (d >= 1000) { + d /= 1000; + unit = 'kilometers'; + } else { + unit = 'meters'; + } + } + + return t('units.' + unit, { + quantity: d.toLocaleString(locale, { maximumSignificantDigits: 4 }) + }); +} + +export function displayArea(m2, isImperial) { + var d = m2 * (isImperial ? 10.7639111056 : 1), + d1, d2, unit1, unit2, area; + + if (isImperial) { + if (d >= 6969600) { // > 0.25mi² show mi² + d1 = d / 27878400; + unit1 = 'square_miles'; + } else { + d1 = d; + unit1 = 'square_feet'; + } + + if (d > 4356 && d < 43560000) { // 0.1 - 1000 acres + d2 = d / 43560; + unit2 = 'acres'; + } + + } else { + if (d >= 250000) { // > 0.25km² show km² + d1 = d / 1000000; + unit1 = 'square_kilometers'; + } else { + d1 = d; + unit1 = 'square_meters'; + } + + if (d > 1000 && d < 10000000) { // 0.1 - 1000 hectares + d2 = d / 10000; + unit2 = 'hectares'; + } + } + + area = t('units.' + unit1, { + quantity: d1.toLocaleString(locale, { maximumSignificantDigits: 4 }) + }); + + if (d2) { + return t('units.area_pair', { + area1: area, + area2: t('units.' + unit2, { + quantity: d2.toLocaleString(locale, { maximumSignificantDigits: 2 }) + }) + }); + } else { + return area; + } +} + +function wrap(x, min, max) { + var d = max - min; + return ((x - min) % d + d) % d + min; +} + +function clamp(x, min, max) { + return Math.max(min, Math.min(x, max)); +} + +export function displayCoordinatePair(coord) { + return t('units.coordinate_pair', { + latitude: clamp(coord[1], -90, 90).toLocaleString(locale, { maximumFractionDigits: OSM_PRECISION }), + longitude: wrap(coord[0], -180, 180).toLocaleString(locale, { maximumFractionDigits: OSM_PRECISION }) + }); +}