Internationalized measurement panel

This commit is contained in:
Minh Nguyễn
2018-01-09 00:58:58 -08:00
parent bc5cbc7dfd
commit d75aa7d04a
3 changed files with 61 additions and 32 deletions

View File

@@ -319,6 +319,8 @@ en:
metric: Metric
imperial: Imperial
node_count: Number of nodes
coordinate_pair: "{latitude}, {longitude}"
area_pair: "{area1} ({area2})"
geometry:
point: point
vertex: vertex
@@ -1056,7 +1058,13 @@ en:
location: "Toggle location panel"
measurement: "Toggle measurement panel"
units:
miles: "{quantity} mi"
feet: "{quantity} ft"
kilometers: "{quantity} km"
miles: "{quantity} mi"
square_feet: "{quantity} sq ft"
square_miles: "{quantity} sq mi"
acres: "{quantity} ac"
meters: "{quantity} m"
kilometers: "{quantity} km"
square_meters: "{quantity} m²"
square_kilometers: "{quantity} km²"
hectares: "{quantity} ha"

14
dist/locales/en.json vendored
View File

@@ -398,7 +398,9 @@
"location": "Location",
"metric": "Metric",
"imperial": "Imperial",
"node_count": "Number of nodes"
"node_count": "Number of nodes",
"coordinate_pair": "{latitude}, {longitude}",
"area_pair": "{area1} ({area2})"
}
},
"geometry": {
@@ -1222,10 +1224,16 @@
}
},
"units": {
"miles": "{quantity} mi",
"feet": "{quantity} ft",
"miles": "{quantity} mi",
"square_feet": "{quantity} sq ft",
"square_miles": "{quantity} sq mi",
"acres": "{quantity} ac",
"meters": "{quantity} m",
"kilometers": "{quantity} km",
"meters": "{quantity} m"
"square_meters": "{quantity} m²",
"square_kilometers": "{quantity} km²",
"hectares": "{quantity} ha"
},
"presets": {
"categories": {

View File

@@ -14,7 +14,8 @@ import { utilDetect } from '../../util/detect';
export function uiPanelMeasurement(context) {
var isImperial = (utilDetect().locale.toLowerCase() === 'en-us');
var locale = utilDetect().locale,
isImperial = (locale.toLowerCase() === 'en-us');
var OSM_PRECISION = 7;
@@ -53,70 +54,77 @@ export function uiPanelMeasurement(context) {
function displayLength(m) {
var d = m * (isImperial ? 3.28084 : 1),
p, unit;
unit;
if (isImperial) {
if (d >= 5280) {
d /= 5280;
unit = 'mi';
unit = 'miles';
} else {
unit = 'ft';
unit = 'feet';
}
} else {
if (d >= 1000) {
d /= 1000;
unit = 'km';
unit = 'kilometers';
} else {
unit = 'm';
unit = 'meters';
}
}
// drop unnecessary precision
p = d > 1000 ? 0 : d > 100 ? 1 : 2;
return String(d.toFixed(p)) + ' ' + unit;
return t('units.' + unit, {
quantity: d.toLocaleString(locale, { maximumSignificantDigits: 4 })
});
}
function displayArea(m2) {
var d = m2 * (isImperial ? 10.7639111056 : 1),
d1, d2, p1, p2, unit1, unit2;
d1, d2, unit1, unit2, area;
if (isImperial) {
if (d >= 6969600) { // > 0.25mi² show mi²
d1 = d / 27878400;
unit1 = 'mi²';
unit1 = 'square_miles';
} else {
d1 = d;
unit1 = 'ft²';
unit1 = 'square_feet';
}
if (d > 4356 && d < 43560000) { // 0.1 - 1000 acres
d2 = d / 43560;
unit2 = 'ac';
unit2 = 'acres';
}
} else {
if (d >= 250000) { // > 0.25km² show km²
d1 = d / 1000000;
unit1 = 'km²';
unit1 = 'square_kilometers';
} else {
d1 = d;
unit1 = '';
unit1 = 'square_meters';
}
if (d > 1000 && d < 10000000) { // 0.1 - 1000 hectares
d2 = d / 10000;
unit2 = 'ha';
unit2 = 'hectares';
}
}
// drop unnecessary precision
p1 = d1 > 1000 ? 0 : d1 > 100 ? 1 : 2;
p2 = d2 > 1000 ? 0 : d2 > 100 ? 1 : 2;
area = t('units.' + unit1, {
quantity: d1.toLocaleString(locale, { maximumSignificantDigits: 4 })
});
return String(d1.toFixed(p1)) + ' ' + unit1 +
(d2 ? ' (' + String(d2.toFixed(p2)) + ' ' + unit2 + ')' : '');
if (d2) {
return t('info_panels.measurement.area_pair', {
area1: area,
area2: t('units.' + unit2, {
quantity: d2.toLocaleString(locale, { maximumSignificantDigits: 2 })
})
});
} else {
return area;
}
}
@@ -132,7 +140,7 @@ export function uiPanelMeasurement(context) {
selection
.append('h4')
.attr('class', 'measurement-heading')
.text(singular || t('info_panels.measurement.selected', { n: selected.length }));
.text(singular || t('info_panels.measurement.selected', { n: selected.length.toLocaleString(locale) }));
if (!selected.length) return;
@@ -154,7 +162,10 @@ export function uiPanelMeasurement(context) {
.text(t('info_panels.measurement.center') + ':')
.append('span')
.text(
center[1].toFixed(OSM_PRECISION) + ', ' + center[0].toFixed(OSM_PRECISION)
t('info_panels.measurement.coordinate_pair', {
latitude: center[1].toLocaleString(locale, { maximumFractionDigits: OSM_PRECISION }),
longitude: center[0].toLocaleString(locale, { maximumFractionDigits: OSM_PRECISION })
})
);
return;
}
@@ -183,8 +194,7 @@ export function uiPanelMeasurement(context) {
.append('li')
.text(t('info_panels.measurement.node_count') + ':')
.append('span')
.text(nodeCount(feature)
);
.text(nodeCount(feature).toLocaleString(locale));
}
if (closed) {
@@ -208,7 +218,10 @@ export function uiPanelMeasurement(context) {
.text(t('info_panels.measurement.centroid') + ':')
.append('span')
.text(
centroid[1].toFixed(OSM_PRECISION) + ', ' + centroid[0].toFixed(OSM_PRECISION)
t('info_panels.measurement.coordinate_pair', {
latitude: centroid[1].toLocaleString(locale, { maximumFractionDigits: OSM_PRECISION }),
longitude: centroid[0].toLocaleString(locale, { maximumFractionDigits: OSM_PRECISION })
})
);
var toggle = isImperial ? 'imperial' : 'metric';