diff --git a/src/components/AlluvialImportExport/AlluvialImportExport.js b/src/components/AlluvialImportExport/AlluvialImportExport.js
index 8178afff..33762a29 100644
--- a/src/components/AlluvialImportExport/AlluvialImportExport.js
+++ b/src/components/AlluvialImportExport/AlluvialImportExport.js
@@ -560,7 +560,7 @@ export default function AlluvialImportExport({
{isTooSmallForText === false &&
- {formatNumber(value) + ' lt.'}
+ {formatNumber(value, lang) + ' lt.'}
}
@@ -675,7 +675,7 @@ export default function AlluvialImportExport({
>
}
- {isTooSmallForText === false && {`${formatNumber(value)} lt. ${isFraude ? ' (fraude ?)' : ''}`}}
+ {isTooSmallForText === false && {`${formatNumber(value, lang)} lt. ${isFraude ? ' (fraude ?)' : ''}`}}
)
})
diff --git a/src/components/RadarChart/VisObject.js b/src/components/RadarChart/VisObject.js
index 42d92a42..39d21e9f 100644
--- a/src/components/RadarChart/VisObject.js
+++ b/src/components/RadarChart/VisObject.js
@@ -106,7 +106,7 @@ const VisObject = ({
})
.map(([key, portion]) => `
- ${key} : ${(portion * 100).toFixed(2)}% (${formatNumber(absoluteData[key])} lt)
+ ${key} : ${(portion * 100).toFixed(2)}% (${formatNumber(absoluteData[key], lang)} lt)
`).join('\n')
}
diff --git a/src/components/TradeDynamicsChart/LongitudinalTradeChart.js b/src/components/TradeDynamicsChart/LongitudinalTradeChart.js
index e96c3b8a..702f023d 100644
--- a/src/components/TradeDynamicsChart/LongitudinalTradeChart.js
+++ b/src/components/TradeDynamicsChart/LongitudinalTradeChart.js
@@ -8,36 +8,10 @@ import cx from "classnames";
import ReactTooltip from "react-tooltip";
import colorsPalettes from "../../utils/colorPalettes";
-import { fixSvgDimension } from "../../utils/misc";
+import { fixSvgDimension, formatNumber } from "../../utils/misc";
const {marseilleColor} = colorsPalettes;
-/**
- * Improve the display of numbers
- * @param {string|number} str - the number to prettify
- * @returns {string}
- */
-const prettifyValue = (str) => {
- const inted = Math.round(+str) + "";
- let finalStr = "";
- let count = 0;
- for (let i = inted.length - 1; i >= 0; i--) {
- const char = inted[i];
- count++;
-
- finalStr = char + finalStr;
- if (count === 3) {
- count = 0;
- finalStr = " " + finalStr;
- }
- }
- if (finalStr[0] === ",") {
- finalStr = finalStr.slice(1);
- }
-
- return finalStr;
-};
-
/**
* Displays a double diagram displaying a histogram and a linechart, with optional additional annotations
* @param {array} data
@@ -88,6 +62,7 @@ const LongitudinalTradeChart = ({
colorScaleMessages,
annotations = [],
margins,
+ lang,
}) => {
const data = useMemo(
() =>
@@ -441,8 +416,8 @@ const LongitudinalTradeChart = ({
r: width * 0.005,
}}
fill={"transparent"}
- data-tip={`${datum.year} : ${prettifyValue(
- +datum[absoluteField]
+ data-tip={`${datum.year} : ${formatNumber(
+ parseInt(+datum[absoluteField]), lang
)} livres tournois.`}
data-for={cityName}
data-class="bar-tooltip"
@@ -508,12 +483,12 @@ const LongitudinalTradeChart = ({
stroke={colorsPalettes.generic.accent1}
title={`${datum.year}-${next.year}`}
strokeWidth={2}
- data-tip={`${datum.year} → ${prettifyValue(
- +datum[absoluteField]
+ data-tip={`${datum.year} → ${formatNumber(
+ parseInt(+datum[absoluteField]), lang
)} livres tournois
${
next.year
- } → ${prettifyValue(
- +next[absoluteField]
+ } → ${formatNumber(
+ parseInt(+next[absoluteField]), lang
)} livres tournois
(${
ratio > 0 ? "+" : ""
}${Math.round(ratio * 100)}%)`}
diff --git a/src/components/TradeDynamicsChart/TradeDynamicsChart.js b/src/components/TradeDynamicsChart/TradeDynamicsChart.js
index 45c10142..6200a050 100644
--- a/src/components/TradeDynamicsChart/TradeDynamicsChart.js
+++ b/src/components/TradeDynamicsChart/TradeDynamicsChart.js
@@ -184,6 +184,7 @@ const TradeDynamicsChart = (props) => {
{...{
startYear,
endYear,
+ lang,
}}
/>
);
@@ -227,6 +228,7 @@ const TradeDynamicsChart = (props) => {
{...{
startYear,
endYear,
+ lang
}}
/>
);
diff --git a/src/visualizations/EffetsGuerreSurLevant/EffetsGuerreSurLevant.js b/src/visualizations/EffetsGuerreSurLevant/EffetsGuerreSurLevant.js
index 6b11f8e7..3fe47ab5 100644
--- a/src/visualizations/EffetsGuerreSurLevant/EffetsGuerreSurLevant.js
+++ b/src/visualizations/EffetsGuerreSurLevant/EffetsGuerreSurLevant.js
@@ -124,15 +124,15 @@ export default function EffetsGuerreSurLevant({
title: translate('EffetsGuerreSurLevant', 'top-y-axis', lang),
// tickSpan: 100000000,
// domain: [0, 200000000],
- tickFormat: d => formatNumber(d) + ' lt.'
+ tickFormat: d => formatNumber(d, lang) + ' lt.'
},
tooltip: d => translate('EffetsGuerreSurLevant', 'top-tooltip', lang, {
year: d.year,
- value: formatNumber(parseInt(d.value)),
+ value: formatNumber(parseInt(d.value), lang),
particule: d.group === 'total' ? 'au' : 'de',
group: d.group
})
- // `En ${d.year}, Marseille a importé ${formatNumber(parseInt(d.value))} lt. depuis les partenaires ${d.group === 'total' ? 'au' : 'de'} ${d.group}`
+ // `En ${d.year}, Marseille a importé ${formatNumber(parseInt(d.value, lang))} lt. depuis les partenaires ${d.group === 'total' ? 'au' : 'de'} ${d.group}`
}
}
/>
diff --git a/src/visualizations/ExportationsSudEst/ExportationsSudEst.js b/src/visualizations/ExportationsSudEst/ExportationsSudEst.js
index bfff968f..5ac4c4e1 100644
--- a/src/visualizations/ExportationsSudEst/ExportationsSudEst.js
+++ b/src/visualizations/ExportationsSudEst/ExportationsSudEst.js
@@ -296,7 +296,7 @@ export default function ExportationsSudEst({
y={0}
fontSize={nationalFontScale(value)}
>
- {label === 'inconnue' ? translate('exportations-sud-est', 'unknown', lang) : label} ({formatNumber(parseInt(value))} lt.)
+ {label === 'inconnue' ? translate('exportations-sud-est', 'unknown', lang) : label} ({formatNumber(parseInt(value), lang)} lt.)
: null
@@ -347,7 +347,7 @@ export default function ExportationsSudEst({
y={0}
fontSize={localFontScale(value)}
>
- {label} ({formatNumber(parseInt(value))} lt.)
+ {label} ({formatNumber(parseInt(value), lang)} lt.)
: null
diff --git a/src/visualizations/GuerreEtCroissance/GuerreEtCroissance.js b/src/visualizations/GuerreEtCroissance/GuerreEtCroissance.js
index 2de9eea2..91a21416 100644
--- a/src/visualizations/GuerreEtCroissance/GuerreEtCroissance.js
+++ b/src/visualizations/GuerreEtCroissance/GuerreEtCroissance.js
@@ -98,28 +98,28 @@ export default function GuerreEtCroissance({
id: 'carrière',
source: 'Carriere',
label: translate('GuerreEtCroissance', 'navigation-interface-carriere', lang),
- tickFormat: d => formatNumber(d) + ' u.',
+ tickFormat: d => formatNumber(d, lang) + ' u.',
unit: 'u.',
},
{
id: 'entrées',
source: 'Navigo entrées',
label: translate('GuerreEtCroissance', 'navigation-interface-arrivals', lang),
- tickFormat: d => formatNumber(d) + ' u.',
+ tickFormat: d => formatNumber(d, lang) + ' u.',
unit: 'u.',
},
{
id: 'tonnage',
source: 'Navigo tonnage',
label: translate('GuerreEtCroissance', 'navigation-interface-tonnage', lang),
- tickFormat: d => formatNumber(d) + ' tx.',
+ tickFormat: d => formatNumber(d, lang) + ' tx.',
unit: 'tx.',
},
{
id: 'mileage',
source: 'Navigo mileage_total',
label: translate('GuerreEtCroissance', 'navigation-interface-distance', lang),
- tickFormat: d => formatNumber(d) + ' m.',
+ tickFormat: d => formatNumber(d, lang) + ' m.',
unit: 'm.',
},
];
@@ -346,7 +346,7 @@ export default function GuerreEtCroissance({
data={data[seriesId].filter(d => d.direction_ferme === direction)}
xScale={xScale}
yDomain={[0, 350000000]}
- tickFormat={d => formatNumber(d / 1000) + ' k lt.'}
+ tickFormat={d => formatNumber(d / 1000, lang) + ' k lt.'}
activeYear={activeYear}
onSetActiveYear={y => setActiveYear(y)}
gutter={gutter}
diff --git a/src/visualizations/GuerreEtCroissance/LineSeries.js b/src/visualizations/GuerreEtCroissance/LineSeries.js
index 16ebeab4..2524939c 100644
--- a/src/visualizations/GuerreEtCroissance/LineSeries.js
+++ b/src/visualizations/GuerreEtCroissance/LineSeries.js
@@ -227,10 +227,10 @@ const LineSeries = ({
translate('GuerreEtCroissance', 'tooltip', lang, {
year,
unit,
- value: formatNumber(parseInt(value)),
- loss: formatNumber(parseInt(data.find(d => d.year === year).peace_reg_memory))
+ value: formatNumber(parseInt(value, lang)),
+ loss: formatNumber(parseInt(data.find(d => d.year === year, lang).peace_reg_memory))
})
- // `En ${year}, valeur de ${formatNumber(parseInt(value))} (perte de ${formatNumber(parseInt(data.find(d => d.year === year).peace_reg_memory))})`
+ // `En ${year}, valeur de ${formatNumber(parseInt(value, lang))} (perte de ${formatNumber(parseInt(data.find(d => d.year === year, lang).peace_reg_memory))})`
}
/>
{
- translate('Intro', 'n-travels', lang, {count: formatNumber(maxShips)})
+ translate('Intro', 'n-travels', lang, {count: formatNumber(maxShips, lang)})
}
@@ -130,7 +130,7 @@ const Legend = ({
className="legend-indicator"
>
- {translate('Intro', 'n-travels', lang, {count: formatNumber(maxShips / 2)})}
+ {translate('Intro', 'n-travels', lang, {count: formatNumber(maxShips / 2, lang)})}
- {formatNumber(maxTonnage)} tx.
+ {formatNumber(maxTonnage, lang)} tx.
- {formatNumber(maxTonnage / 2)} tx.
+ {formatNumber(maxTonnage / 2, lang)} tx.
>
:
@@ -218,7 +218,7 @@ const Legend = ({
y={3}
className="legend-indicator"
>
- {formatNumber(maxAreaValue)} lt.
+ {formatNumber(maxAreaValue, lang)} lt.
- {formatNumber(minAreaValue)} lt.
+ {formatNumber(minAreaValue, lang)} lt.
>
diff --git a/src/visualizations/Intro/PartnersObjects.js b/src/visualizations/Intro/PartnersObjects.js
index 078aa895..098707e9 100644
--- a/src/visualizations/Intro/PartnersObjects.js
+++ b/src/visualizations/Intro/PartnersObjects.js
@@ -125,31 +125,31 @@ const PartnersObjects = ({
let tooltipText = '';
if (dataType === 'toflit18') {
if (dataScope === 'world') {
- // tooltipText = `La direction des fermes de Marseille a effectué un commerce total de ${formatNumber(parseInt(toflit_value))} lt. avec le partenaire ${partner} en 1789.`
+ // tooltipText = `La direction des fermes de Marseille a effectué un commerce total de ${formatNumber(parseInt(toflit_value, lang))} lt. avec le partenaire ${partner} en 1789.`
tooltipText = translate('Intro', 'tooltip-trade-world', lang, {
- count: formatNumber(parseInt(toflit_value)),
+ count: formatNumber(parseInt(toflit_value), lang),
partner
});
} else {
- // tooltipText = `La direction des fermes de ${partner} a effectué un commerce total de ${formatNumber(parseInt(toflit_value))} lt. en 1789.`
+ // tooltipText = `La direction des fermes de ${partner} a effectué un commerce total de ${formatNumber(parseInt(toflit_value, lang))} lt. en 1789.`
tooltipText = translate('Intro', 'tooltip-trade-france', lang, {
- count: formatNumber(parseInt(toflit_value)),
+ count: formatNumber(parseInt(toflit_value), lang),
partner
});
}
} else {
if (dataScope === 'world') {
- // tooltipText = `${formatNumber(parseInt(navigo_nb_ships))} voyages ont été effectués depuis les ports du partenaire ${partner} vers Marseille en 1789, pour un tonnage moyen de ${formatNumber(parseInt(navigo_mean_tonnage))} tonneaux.`
+ // tooltipText = `${formatNumber(parseInt(navigo_nb_ships, lang))} voyages ont été effectués depuis les ports du partenaire ${partner} vers Marseille en 1789, pour un tonnage moyen de ${formatNumber(parseInt(navigo_mean_tonnage, lang))} tonneaux.`
tooltipText = translate('Intro', 'tooltip-navigo-world', lang, {
- nb_ships: formatNumber(parseInt(navigo_nb_ships)),
- tonnage: formatNumber(parseInt(navigo_mean_tonnage)),
+ nb_ships: formatNumber(parseInt(navigo_nb_ships, lang)),
+ tonnage: formatNumber(parseInt(navigo_mean_tonnage, lang)),
partner
});
} else {
- // tooltipText = `${formatNumber(parseInt(navigo_nb_ships))} voyages ont été effectués depuis le port de ${partner} en 1787, pour un tonnage moyen de ${formatNumber(parseInt(navigo_mean_tonnage))} tonneaux.`
+ // tooltipText = `${formatNumber(parseInt(navigo_nb_ships, lang))} voyages ont été effectués depuis le port de ${partner} en 1787, pour un tonnage moyen de ${formatNumber(parseInt(navigo_mean_tonnage, lang))} tonneaux.`
tooltipText = translate('Intro', 'tooltip-navigo-france', lang, {
- nb_ships: formatNumber(parseInt(navigo_nb_ships)),
- tonnage: formatNumber(parseInt(navigo_mean_tonnage)),
+ nb_ships: formatNumber(parseInt(navigo_nb_ships, lang)),
+ tonnage: formatNumber(parseInt(navigo_mean_tonnage, lang)),
partner
});
}
diff --git a/src/visualizations/LevantNavigation/LevantNavigation.js b/src/visualizations/LevantNavigation/LevantNavigation.js
index 81de9c2c..27d37e8d 100644
--- a/src/visualizations/LevantNavigation/LevantNavigation.js
+++ b/src/visualizations/LevantNavigation/LevantNavigation.js
@@ -203,9 +203,9 @@ export default function LevantNavigation({
translate('LevantNavigation', 'tooltip', lang, {
count,
port,
- tonnage: formatNumber(tonnage)
+ tonnage: formatNumber(tonnage, lang)
})
- // `Selon le registre des patentes de Marseille, ${count} navires se sont rendus depuis le port de ${port} vers port phocéen dans les sept années étudiées, pour un total estimé de ${formatNumber(tonnage)} tonneaux cumulés.`
+ // `Selon le registre des patentes de Marseille, ${count} navires se sont rendus depuis le port de ${port} vers port phocéen dans les sept années étudiées, pour un total estimé de ${formatNumber(tonnage, lang)} tonneaux cumulés.`
}
>
- 40 000 tx.
+ {formatNumber(legendMaxTonnage, lang)} tx.
@@ -322,7 +322,7 @@ export default function LevantNavigation({
className="legend-label"
style={{ fontSize: gutter }}
>
- 20 000 tx.
+ {formatNumber(legendMinTonnage, lang)} tx.
diff --git a/src/visualizations/PartDesEtrangersDansNavigation/PartDesEtrangersDansNavigation.js b/src/visualizations/PartDesEtrangersDansNavigation/PartDesEtrangersDansNavigation.js
index 4f8bd25f..7a04bf3d 100644
--- a/src/visualizations/PartDesEtrangersDansNavigation/PartDesEtrangersDansNavigation.js
+++ b/src/visualizations/PartDesEtrangersDansNavigation/PartDesEtrangersDansNavigation.js
@@ -247,9 +247,9 @@ const flagToNationality = {
{label} ({parseInt(tonnage / marseilleSum * 100)}%)
diff --git a/src/visualizations/PartDesFrancaisDansProvenance/PartDesFrancaisDansProvenance.js b/src/visualizations/PartDesFrancaisDansProvenance/PartDesFrancaisDansProvenance.js
index f933a37f..5e29ae2d 100644
--- a/src/visualizations/PartDesFrancaisDansProvenance/PartDesFrancaisDansProvenance.js
+++ b/src/visualizations/PartDesFrancaisDansProvenance/PartDesFrancaisDansProvenance.js
@@ -95,9 +95,9 @@ export default function PartDesFrancaisDansProvenance({
year: d.year,
share: d.share_of_french.toFixed(2),
state: d.state,
- tonnage: formatNumber(d.tonnage_french)
+ tonnage: formatNumber(d.tonnage_french, lang)
})
- // `En ${d.year}, ${d.share_of_french.toFixed(2)}% des voyages partis de ports de ${d.state} et arrivés à Marseille étaient assurés par des navires français (${formatNumber(d.tonnage_french)} tx. cumulés)`
+ // `En ${d.year}, ${d.share_of_french.toFixed(2)}% des voyages partis de ports de ${d.state} et arrivés à Marseille étaient assurés par des navires français (${formatNumber(d.tonnage_french, lang)} tx. cumulés)`
}
}
/>
@@ -121,7 +121,7 @@ export default function PartDesFrancaisDansProvenance({
},
y: {
field: 'tonnage_french',
- tickFormat: d => formatNumber(d) + ' tx',
+ tickFormat: d => formatNumber(d, lang) + ' tx',
// domain: [0, 100],
title: translate('PartDesFrancaisDansProvenance', 'bottom-y-axis', lang),
sort: {
@@ -134,9 +134,9 @@ export default function PartDesFrancaisDansProvenance({
year: d.year,
share: d.share_of_french.toFixed(2),
state: d.state,
- tonnage: formatNumber(d.tonnage_french)
+ tonnage: formatNumber(d.tonnage_french, lang)
})
- // `En ${d.year}, ${d.share_of_french.toFixed(2)}% des voyages partis de ports de ${d.state} et arrivés à Marseille étaient assurés par des navires français (${formatNumber(d.tonnage_french)} tx. cumulés)`
+ // `En ${d.year}, ${d.share_of_french.toFixed(2)}% des voyages partis de ports de ${d.state} et arrivés à Marseille étaient assurés par des navires français (${formatNumber(d.tonnage_french, lang)} tx. cumulés)`
}
}
/>
diff --git a/src/visualizations/StylesNavigation/StylesNavigation.js b/src/visualizations/StylesNavigation/StylesNavigation.js
index 02fc77fb..56e53cae 100644
--- a/src/visualizations/StylesNavigation/StylesNavigation.js
+++ b/src/visualizations/StylesNavigation/StylesNavigation.js
@@ -204,7 +204,7 @@ const Provinces = ({
xmlns="http://www.w3.org/1999/xhtml"
className="legend-label"
>
- {translate('StylesNavigation', 'travels-tick', lang, {count: legendValues[0]})}
+ {translate('StylesNavigation', 'travels-tick', lang, {count: formatNumber(legendValues[0], lang)})}
@@ -218,7 +218,7 @@ const Provinces = ({
xmlns="http://www.w3.org/1999/xhtml"
className="legend-label"
>
- {translate('StylesNavigation', 'travels-tick', lang, {count: legendValues[1]})}
+ {translate('StylesNavigation', 'travels-tick', lang, {count: formatNumber(legendValues[1], lang)})}
@@ -438,8 +438,8 @@ export default function StylesNavigation({
width: cellWidth,
height: cellHeight,
id: 'méditerranée',
- title: translate('StylesNavigation', 'title-mediterrannee', lang, { count: formatNumber(travelsSums['méditerranée occidentale']) }),
- // title: `Europe méditerranéenne (${formatNumber(travelsSums['méditerranée occidentale'])} voyages vers Marseille consignés en temps de paix)`,
+ title: translate('StylesNavigation', 'title-mediterrannee', lang, { count: formatNumber(travelsSums['méditerranée occidentale'], lang) }),
+ // title: `Europe méditerranéenne (${formatNumber(travelsSums['méditerranée occidentale'], lang)} voyages vers Marseille consignés en temps de paix)`,
data: data.filter(({ category }) => category === 'méditerranée occidentale'),
color: colors['méditerranée occidentale'],
legendStep: 250,
@@ -462,8 +462,8 @@ export default function StylesNavigation({
width: cellWidth,
height: cellHeight,
id: 'ponant',
- title: translate('StylesNavigation', 'title-ponant', lang, { count: formatNumber(travelsSums['Ponant']) }),
- // title: `Ponant et Terre-Neuve (${formatNumber(travelsSums['Ponant'])} voyages vers Marseille consignés en temps de paix)`,
+ title: translate('StylesNavigation', 'title-ponant', lang, { count: formatNumber(travelsSums['Ponant'], lang) }),
+ // title: `Ponant et Terre-Neuve (${formatNumber(travelsSums['Ponant'], lang)} voyages vers Marseille consignés en temps de paix)`,
data: data.filter(({ category }) => category === 'Ponant'),
color: colors['Ponant'],
legendStep: 40,
@@ -484,8 +484,8 @@ export default function StylesNavigation({
width: cellWidth,
height: cellHeight,
id: 'empire',
- // title: `Empire ottoman et mer Noire (${formatNumber(travelsSums['empire ottoman'])} voyages vers Marseille consignés en temps de paix)`,
- title: translate('StylesNavigation', 'title-ottoman', lang, { count: formatNumber(travelsSums['empire ottoman']) }),
+ // title: `Empire ottoman et mer Noire (${formatNumber(travelsSums['empire ottoman'], lang)} voyages vers Marseille consignés en temps de paix)`,
+ title: translate('StylesNavigation', 'title-ottoman', lang, { count: formatNumber(travelsSums['empire ottoman'], lang) }),
data: data.filter(({ category }) => category === 'empire ottoman'),
color: colors['empire ottoman'],
tonnageValues,