SS Test
HTML
<script src="http://jvectormap.com/js/jquery-jvectormap-1.2.2.min.js"></script>
<script src="http://jvectormap.com/js/jquery-jvectormap-world-mill-en.js"></script>
<div class="regional_vacancies">
<div class="map"></div>
</div>
<script>
var MapCountries = [{
"code": "za",
"region": "South Africa",
"url": "/careers-regional_vacancies-opportunities.html"
}, {
"code": "gb",
"region": "United Kingdom",
"url": "/careers/viewRegion.jsp?regionMap=europe"
}, {
"code": "bm",
"region": "Bermuda",
"url": "/careers/viewRegion.jsp?regionMap=americas"
}, {
"code": "sz",
"region": "Swaziland",
"url": "/careers/viewRegion.jsp?regionMap=africaAndAsia"
}, {
"code": "co",
"region": "Colombia",
"url": "/careers/viewRegion.jsp?regionMap=americas"
}, {
"code": "cn",
"region": "China",
"url": "/careers/viewRegion.jsp?regionMap=africaAndAsia"
}, {
"code": "ae",
"region": "United Arab Emirates",
"url": "/careers/viewRegion.jsp?regionMap=africaAndAsia"
}, {
"code": "fr",
"region": "France",
"url": "/careers/viewRegion.jsp?regionMap=europe"
}, {
"code": "ke",
"region": "Kenya",
"url": "/careers/viewRegion.jsp?regionMap=africaAndAsia"
}, {
"code": "us",
"region": "United States of America",
"url": "/careers/viewRegion.jsp?regionMap=americas"
}, {
"code": "de",
"region": "Germany",
"url": "/careers/viewRegion.jsp?regionMap=europe"
}, {
"code": "mw",
"region": "Malawi",
"url": "/careers/viewRegion.jsp?regionMap=africaAndAsia"
}, {
"code": "zw",
"region": "Zimbabwe",
"url": "/careers/viewRegion.jsp?regionMap=africaAndAsia"
}, {
"code": "ie",
"region": "Ireland",
"url": "/careers/viewRegion.jsp?regionMap=europe"
}, {
"code": "mx",
"region": "Mexico",
"url":...
CSS
.regional_vacancies .map {
width: 600px;
height: 400px;
}
JavaScript
var colors = {};
var popup = false;
for (i = 0; i < MapCountries.length - 1; i++) {
code = MapCountries[i].code.toUpperCase();
colors[code] = "#006150";
}
function regionCheck(code, display) {
code = code.toLowerCase();
for (i = 0; i < MapCountries.length - 1; i++) {
switch (code) {
case MapCountries[i].code:
if (display == "region") {
if (MapCountries[i].url) {
return MapCountries[i].url;
} else {
return MapCountries[i].region;
}
} else {
return true;
}
break;
default:
break;
}
}
}
$map = $('.map');
var map = new jvm.WorldMap({
map: 'world_mill_en',
container: $map,
normalizeFunction: 'polynomial',
zoomButtons: false,
zoomOnScroll: false,
hoverOpacity: 1,
hoverColor: false,
backgroundColor: '#fff',
regionStyle: {
initial: {
fill: '#cdcccc',
"fill-opacity": 1,
stroke: 'white',
"stroke-width": 0,
"stroke-opacity": 1
},
hover: {
"fill-opacity": 1
},
selected: {
fill: '#6eab24'
}
},
series: {
regions: [{
attribute: 'fill'
}]
},
regionsSelectable: true,
regionsSelectableOne: true,
onRegionLabelShow: function (event, label, code) {
code = code.toLowerCase();
var content = regionCheck(code, "region");
if (content) {
label.css('left', -200);
$("path", $(this)).css("cursor", "pointer");
} else {
event.preventDefault();
label.text("");
$("path",...