diff --git a/index.html b/index.html
index 8958817..2273f7c 100644
--- a/index.html
+++ b/index.html
@@ -15,12 +15,11 @@ qtip: '/js/jquery.qtip.min.js'
// Colors
const cOrange = '#F79621';
const cGray = '#333';
+ const cWhite = '#FFF';
const cDarkGray = '#222';
const cDarkOrange = '#735000';
const cDarkWhite = '#BBB';
- var pathColors = [];
-
// initialize tooltips
$.fn.qtip.defaults.style.classes = 'ui-tooltip-bootstrap';
$.fn.qtip.defaults.style.def = false;
@@ -58,6 +57,13 @@ qtip: '/js/jquery.qtip.min.js'
function isOrange(iso) {
return orangeCountryCodes.includes(iso);
}
+ function getColor(iso) {
+ let country = countries.find(c => c.alpha3 == iso);
+ if (country && country.link) {
+ return country.external ? cWhite : cOrange;
+ }
+ return cGray;
+ }
map.addLayer('countries', {
title: function (d) { return d.name },
@@ -73,7 +79,7 @@ qtip: '/js/jquery.qtip.min.js'
},
mouseleave: function (d, path) {
if (!isOrange(d.iso)) {
- path.animate({ fill: pathColors[d.iso] }, 1000);
+ path.animate({ fill: getColor(d.iso) }, 1000);
}
return;
},
@@ -88,8 +94,7 @@ qtip: '/js/jquery.qtip.min.js'
});
map.getLayer('countries').style('fill', function (data) {
- pathColors[data.iso] = isOrange(data.iso) ? cOrange : cGray;
- return pathColors[data.iso];
+ return getColor(data.iso);
});
}
});