You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
259 lines
7.6 KiB
259 lines
7.6 KiB
1 year ago
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
|
||
|
|
<html>
|
||
|
|
|
||
|
|
<head>
|
||
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||
|
|
<title>amMap example</title>
|
||
|
|
<link href='http://fonts.googleapis.com/css?family=Covered+By+Your+Grace' rel='stylesheet' type='text/css'>
|
||
|
|
<link rel="stylesheet" href="../ammap/ammap.css" type="text/css">
|
||
|
|
<link rel="stylesheet" href="style.css" type="text/css">
|
||
|
|
|
||
|
|
<script src="../ammap/ammap.js" type="text/javascript"></script>
|
||
|
|
<!-- map file should be included after ammap.js -->
|
||
|
|
<script src="../ammap/maps/js/worldLow.js" type="text/javascript"></script>
|
||
|
|
<!-- theme files. you only need to include the theme you use.
|
||
|
|
feel free to modify themes and create your own themes -->
|
||
|
|
<script src="../ammap/themes/light.js" type="text/javascript"></script>
|
||
|
|
<script src="../ammap/themes/dark.js" type="text/javascript"></script>
|
||
|
|
<script src="../ammap/themes/black.js" type="text/javascript"></script>
|
||
|
|
<script src="../ammap/themes/chalk.js" type="text/javascript"></script>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
|
||
|
|
// in order to set theme for a chart, all you need to include theme file
|
||
|
|
// located in amcharts/themes folder and set theme property for the chart.
|
||
|
|
|
||
|
|
var map;
|
||
|
|
makeMap("light", "#FFFFFF");
|
||
|
|
|
||
|
|
// Theme can only be applied when creating chart instance - this means
|
||
|
|
// that if you need to change theme at run time, youhave to create whole
|
||
|
|
// chart object once again.
|
||
|
|
|
||
|
|
function makeMap(theme, bgColor, bgImage) {
|
||
|
|
|
||
|
|
if (map) {
|
||
|
|
map.clear();
|
||
|
|
}
|
||
|
|
|
||
|
|
// background
|
||
|
|
if(document.body){
|
||
|
|
document.body.style.backgroundColor = bgColor;
|
||
|
|
document.body.style.backgroundImage = "url(" + bgImage + ")";
|
||
|
|
}
|
||
|
|
|
||
|
|
map = AmCharts.makeChart("mapdiv", {
|
||
|
|
type: "map",
|
||
|
|
theme: theme,
|
||
|
|
|
||
|
|
creditsPosition: "top-right",
|
||
|
|
|
||
|
|
dataProvider: {
|
||
|
|
map: "worldLow",
|
||
|
|
zoomLevel: 3.5,
|
||
|
|
zoomLongitude: 10,
|
||
|
|
zoomLatitude: 52,
|
||
|
|
areas: [{
|
||
|
|
title: "Austria",
|
||
|
|
id: "AT",
|
||
|
|
color: "#3366CC",
|
||
|
|
customData: "1995",
|
||
|
|
groupId: "before2004"
|
||
|
|
}, {
|
||
|
|
title: "Ireland",
|
||
|
|
id: "IE",
|
||
|
|
color: "#3366CC",
|
||
|
|
customData: "1973",
|
||
|
|
groupId: "before2004"
|
||
|
|
}, {
|
||
|
|
title: "Denmark",
|
||
|
|
id: "DK",
|
||
|
|
color: "#3366CC",
|
||
|
|
customData: "1973",
|
||
|
|
groupId: "before2004"
|
||
|
|
}, {
|
||
|
|
title: "Finland",
|
||
|
|
id: "FI",
|
||
|
|
color: "#3366CC",
|
||
|
|
customData: "1995",
|
||
|
|
groupId: "before2004"
|
||
|
|
}, {
|
||
|
|
title: "Sweden",
|
||
|
|
id: "SE",
|
||
|
|
color: "#3366CC",
|
||
|
|
customData: "1995",
|
||
|
|
groupId: "before2004"
|
||
|
|
}, {
|
||
|
|
title: "Great Britain",
|
||
|
|
id: "GB",
|
||
|
|
color: "#3366CC",
|
||
|
|
customData: "1973",
|
||
|
|
groupId: "before2004"
|
||
|
|
}, {
|
||
|
|
title: "Italy",
|
||
|
|
id: "IT",
|
||
|
|
color: "#3366CC",
|
||
|
|
customData: "1957",
|
||
|
|
groupId: "before2004"
|
||
|
|
}, {
|
||
|
|
title: "France",
|
||
|
|
id: "FR",
|
||
|
|
color: "#3366CC",
|
||
|
|
customData: "1957",
|
||
|
|
groupId: "before2004"
|
||
|
|
}, {
|
||
|
|
title: "Spain",
|
||
|
|
id: "ES",
|
||
|
|
color: "#3366CC",
|
||
|
|
customData: "1986",
|
||
|
|
groupId: "before2004"
|
||
|
|
}, {
|
||
|
|
title: "Greece",
|
||
|
|
id: "GR",
|
||
|
|
color: "#3366CC",
|
||
|
|
customData: "1981",
|
||
|
|
groupId: "before2004"
|
||
|
|
}, {
|
||
|
|
title: "Germany",
|
||
|
|
id: "DE",
|
||
|
|
color: "#3366CC",
|
||
|
|
customData: "1957",
|
||
|
|
groupId: "before2004"
|
||
|
|
}, {
|
||
|
|
title: "Belgium",
|
||
|
|
id: "BE",
|
||
|
|
color: "#3366CC",
|
||
|
|
customData: "1957",
|
||
|
|
groupId: "before2004"
|
||
|
|
}, {
|
||
|
|
title: "Luxembourg",
|
||
|
|
id: "LU",
|
||
|
|
color: "#3366CC",
|
||
|
|
customData: "1957",
|
||
|
|
groupId: "before2004"
|
||
|
|
}, {
|
||
|
|
title: "Netherlands",
|
||
|
|
id: "NL",
|
||
|
|
color: "#3366CC",
|
||
|
|
customData: "1957",
|
||
|
|
groupId: "before2004"
|
||
|
|
}, {
|
||
|
|
title: "Portugal",
|
||
|
|
id: "PT",
|
||
|
|
color: "#3366CC",
|
||
|
|
customData: "1986",
|
||
|
|
groupId: "before2004"
|
||
|
|
}, {
|
||
|
|
title: "Lithuania",
|
||
|
|
id: "LT",
|
||
|
|
color: "#FFCC33",
|
||
|
|
customData: "2004",
|
||
|
|
groupId: "2004"
|
||
|
|
}, {
|
||
|
|
title: "Latvia",
|
||
|
|
id: "LV",
|
||
|
|
color: "#FFCC33",
|
||
|
|
customData: "2004",
|
||
|
|
groupId: "2004"
|
||
|
|
}, {
|
||
|
|
title: "Czech Republic ",
|
||
|
|
id: "CZ",
|
||
|
|
color: "#FFCC33",
|
||
|
|
customData: "2004",
|
||
|
|
groupId: "2004"
|
||
|
|
}, {
|
||
|
|
title: "Slovakia",
|
||
|
|
id: "SK",
|
||
|
|
color: "#FFCC33",
|
||
|
|
customData: "2004",
|
||
|
|
groupId: "2004"
|
||
|
|
}, {
|
||
|
|
title: "Slovenia",
|
||
|
|
id: "SI",
|
||
|
|
color: "#FFCC33",
|
||
|
|
customData: "2004",
|
||
|
|
groupId: "2004"
|
||
|
|
}, {
|
||
|
|
title: "Estonia",
|
||
|
|
id: "EE",
|
||
|
|
color: "#FFCC33",
|
||
|
|
customData: "2004",
|
||
|
|
groupId: "2004"
|
||
|
|
}, {
|
||
|
|
title: "Hungary",
|
||
|
|
id: "HU",
|
||
|
|
color: "#FFCC33",
|
||
|
|
customData: "2004",
|
||
|
|
groupId: "2004"
|
||
|
|
}, {
|
||
|
|
title: "Cyprus",
|
||
|
|
id: "CY",
|
||
|
|
color: "#FFCC33",
|
||
|
|
customData: "2004",
|
||
|
|
groupId: "2004"
|
||
|
|
}, {
|
||
|
|
title: "Malta",
|
||
|
|
id: "MT",
|
||
|
|
color: "#FFCC33",
|
||
|
|
customData: "2004",
|
||
|
|
groupId: "2004"
|
||
|
|
}, {
|
||
|
|
title: "Poland",
|
||
|
|
id: "PL",
|
||
|
|
color: "#FFCC33",
|
||
|
|
customData: "2004",
|
||
|
|
groupId: "2004"
|
||
|
|
}, {
|
||
|
|
title: "Romania",
|
||
|
|
id: "RO",
|
||
|
|
color: "#66CC99",
|
||
|
|
customData: "2007",
|
||
|
|
groupId: "2007"
|
||
|
|
}, {
|
||
|
|
title: "Bulgaria",
|
||
|
|
id: "BG",
|
||
|
|
color: "#66CC99",
|
||
|
|
customData: "2007",
|
||
|
|
groupId: "2007"
|
||
|
|
}
|
||
|
|
]
|
||
|
|
},
|
||
|
|
|
||
|
|
areasSettings: {
|
||
|
|
balloonText: "[[title]] joined EU at [[customData]]"
|
||
|
|
},
|
||
|
|
|
||
|
|
|
||
|
|
legend: {
|
||
|
|
width: "100%",
|
||
|
|
bottom: 15,
|
||
|
|
left: 15,
|
||
|
|
horizontalGap: 10,
|
||
|
|
data: [{
|
||
|
|
title: "Joined EU before 2004",
|
||
|
|
color: "#3366CC"
|
||
|
|
}, {
|
||
|
|
title: "Joined EU at 2004",
|
||
|
|
color: "#FFCC33"
|
||
|
|
}, {
|
||
|
|
title: "Joined EU at 2007",
|
||
|
|
color: "#66CC99"
|
||
|
|
}]
|
||
|
|
}
|
||
|
|
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
</script>
|
||
|
|
</head>
|
||
|
|
|
||
|
|
<body style="font-size:15px;">Select theme:
|
||
|
|
<a href="#" onclick="makeMap('light', '#ffffff');">Light</a> |
|
||
|
|
<a href="#" onclick="makeMap('dark', '#282828')">Dark</a> |
|
||
|
|
<a href="#" onclick="makeMap('black', '#222222')">Black</a> |
|
||
|
|
<a href="#" onclick="makeMap('chalk', '#282828', 'images/board.jpg')">Chalk</a>
|
||
|
|
<br><br>
|
||
|
|
<div id="mapdiv" style="width: 800px; height: 500px;"></div>
|
||
|
|
</body>
|
||
|
|
|
||
|
|
</html>
|