svg-map-extra
Version:
svg-map-extra is an extended JavaScript library that lets you easily create an interactable world map comparing customizable data for each country inspired by the original svgMap.
35 lines (30 loc) • 1.43 kB
HTML
<title>Localize country names</title>
<meta charset="utf-8">
<script>var svgMap = function () {};</script>
<script src="../src/js/svgMap/countries.js"></script>
<script>var svgMapCountries = new svgMap();</script>
<div style="padding: 20px 80px; font-family: monospace; font-size: 12px">
<b>Missing translations</b>
<div id="missing-countries" style="padding: 15px 0; color: #DD0000"></div>
<b>Translated countries</b>
<div style="padding: 15px 0; word-break: break-all; white-space: pre">var svgMapCountryNames = {<div id="data"></div>};</div>
</div>
<script src="./countries.js"></script>
<script>
var missingCountriesOutput = document.getElementById('missing-countries');
var dataOutput = document.getElementById('data');
var map = document.getElementById('map');
var countriesEN = svgMapCountries.countries;
Object.keys(countriesEN).forEach(function (countryID, index) {
if (!countries || !countries[countryID]) {
var element = document.createElement('div');
element.innerHTML = countryID + ' | ' + countriesEN[countryID];
missingCountriesOutput.appendChild(element);
return;
}
var element = document.createElement('div');
element.innerHTML = ' ' + countryID + ': \'' + countries[countryID] + '\'' + (index + 1 < Object.keys(countriesEN).length ? ',' : '');
dataOutput.appendChild(element);
});
</script>