diff --git a/src/worldmap.test.ts b/src/worldmap.test.ts
index 58008d1..903007e 100644
--- a/src/worldmap.test.ts
+++ b/src/worldmap.test.ts
@@ -138,6 +138,28 @@ describe('Worldmap', () => {
});
});
+ describe('when the data has multiple metrics', () => {
+ beforeEach(() => {
+ ctrl.data = new DataBuilder()
+ .withCountryAndValue('SE', 1, {
+ __field_device_urn: 'safecast:903348716',
+ '__field_ingest.location': 'wecnv3p07bjj',
+ '__field_Average pms_pm02_5': 33,
+ '__field_Average lnd_7318u': 110,
+ })
+ .build();
+
+ ctrl.panel.esGeoPoint = 'ingest.location';
+ ctrl.panel.esLocationName = 'device_urn';
+ ctrl.panel.esMetric = 'Average pms_pm02_5';
+ worldMap.drawCircles();
+ });
+
+ it('should create a circle popup with additional metrics', () => {
+ expect(worldMap.circles[0]._popup._content).toBe('Sweden: 1
Average lnd_7318u: 110');
+ });
+ });
+
describe('when the data has three points', () => {
beforeEach(() => {
ctrl.data = new DataBuilder()
diff --git a/src/worldmap.ts b/src/worldmap.ts
index fcb478a..4408531 100644
--- a/src/worldmap.ts
+++ b/src/worldmap.ts
@@ -297,7 +297,7 @@ export default class WorldMap {
});
this.createClickthrough(circle, dataPoint);
- const content = this.getPopupContent(dataPoint.locationName, dataPoint.valueRounded);
+ const content = this.getPopupContent(dataPoint);
this.createPopup(circle, content);
return circle;
}
@@ -319,7 +319,7 @@ export default class WorldMap {
// Re-create popup.
circle.unbindPopup();
- const content = this.getPopupContent(dataPoint.locationName, dataPoint.valueRounded);
+ const content = this.getPopupContent(dataPoint);
this.createPopup(circle, content);
// Re-create clickthrough-link.
@@ -418,12 +418,16 @@ export default class WorldMap {
extendPopupContent(circle, dataPoint) {
const popup = circle.getPopup();
let popupContent = popup._content;
- popupContent += `\n${this.getPopupContent(dataPoint.locationName, dataPoint.valueRounded)}`;
+ popupContent += `\n${this.getPopupContent(dataPoint)}`;
circle.setPopupContent(popupContent);
}
- getPopupContent(locationName, value) {
+ getPopupContent(dataPoint) {
let unit;
+
+ let locationName = dataPoint.locationName;
+ let value = dataPoint.value;
+
if (_.isNaN(value)) {
value = 'n/a';
} else {
@@ -433,7 +437,27 @@ export default class WorldMap {
if (this.ctrl.settings.formatOmitEmptyValue && value === 'n/a') {
return `${locationName}`.trim();
} else {
- return `${locationName}: ${value} ${unit || ''}`.trim();
+ let fieldPrefix = '__field_';
+
+ let specialFields = [
+ fieldPrefix + this.ctrl.settings.esLocationName,
+ fieldPrefix + this.ctrl.settings.esMetric,
+ fieldPrefix + this.ctrl.settings.esGeoPoint,
+ ];
+
+ let freeDataFields = Object.keys(dataPoint).filter(
+ (key: string) => key.startsWith(fieldPrefix) && !specialFields.includes(key)
+ );
+
+ let freeDataDisplay = freeDataFields
+ .map((field: string) => {
+ let name = field.slice(fieldPrefix.length);
+ let value = dataPoint[field];
+ return `
${name}: ${value}`;
+ })
+ .join('');
+
+ return `${locationName}: ${value} ${unit || ''}${freeDataDisplay}`.trim();
}
}
diff --git a/test/data_builder.ts b/test/data_builder.ts
index 6d04f2f..9703abf 100644
--- a/test/data_builder.ts
+++ b/test/data_builder.ts
@@ -7,7 +7,7 @@ export default class DataBuilder {
this.data.categories = [];
}
- withCountryAndValue(countryCode, value) {
+ withCountryAndValue(countryCode, value, overrides?: {[key: string]: any}) {
let dataPoint;
if (countryCode === 'SE') {
dataPoint = {
@@ -39,7 +39,7 @@ export default class DataBuilder {
} else {
throw new Error(`Unable to create fixture for country code ${countryCode}`);
}
- this.data.push(dataPoint);
+ this.data.push({...dataPoint, ...overrides});
return this;
}