Skip to content

Instantly share code, notes, and snippets.

@seagoj

seagoj/canada.html

Last active August 29, 2015 14:17
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save seagoj/216d798e6cd7bc4c639e to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save seagoj/216d798e6cd7bc4c639e to your computer and use it in GitHub Desktop.
Download ZIP
Canada
Raw
canada.html
<!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 rel="stylesheet" href="../ammap/ammap.css" type="text/css">
<script src="../ammap/ammap.js" type="text/javascript"></script>
<script src='https://code.jquery.com/jquery-2.1.3.min.js'></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/jquery.fancybox.pack.js"></script>
<link rel="stylesheet" type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/jquery.fancybox.min.css"/>
<script src="../ammap/maps/js/canadaLow.js" type="text/javascript"></script>
<script type="text/javascript">
var map = AmCharts.makeChart("mapdiv", {
type: "map",
pathToImages: "../ammap/images/",
balloon: {
color: "#000000"
},
dataProvider: {
map: "canadaLow",
getAreasFromMap: true
},
areasSettings: {
autoZoom: true,
selectedColor: "#CC0000"
},
smallMap: {}
});
map.addListener("clickMapObject", function (event) {
var content = '<strong>' + event.mapObject.title + '</strong>';
switch(event.mapObject.title) {
case 'Alberta':
/* ===== EDIT HERE ===== */
content += (
'<ul>'
+ '<li>Fancy Fact #1</li>'
+ '<li>Fancy Fact #2</li>'
+ '<li>Fancy Fact #3</li>'
+ '</ul>'
);
/* ===== END EDIT ===== */
break;
case 'Quebec':
/* ===== EDIT HERE ===== */
content += (
'<ul>'
+ '<li>Fancy Fact #1</li>'
+ '<li>Fancy Fact #2</li>'
+ '<li>Fancy Fact #3</li>'
+ '</ul>'
);
break;
/* ===== END EDIT ===== */
case 'Newfoundland and Labrador':
/* ===== EDIT HERE ===== */
content += (
'<ul>'
+ '<li>Fancy Fact #1</li>'
+ '<li>Fancy Fact #2</li>'
+ '<li>Fancy Fact #3</li>'
+ '</ul>'
);
break;
/* ===== END EDIT ===== */
case 'Nunavut':
/* ===== EDIT HERE ===== */
content += (
'<ul>'
+ '<li>Fancy Fact #1</li>'
+ '<li>Fancy Fact #2</li>'
+ '<li>Fancy Fact #3</li>'
+ '</ul>'
);
break;
/* ===== END EDIT ===== */
case 'Ontario':
/* ===== EDIT HERE ===== */
content += (
'<ul>'
+ '<li>Fancy Fact #1</li>'
+ '<li>Fancy Fact #2</li>'
+ '<li>Fancy Fact #3</li>'
+ '</ul>'
);
break;
/* ===== END EDIT ===== */
case 'Manitoba':
/* ===== EDIT HERE ===== */
content += (
'<ul>'
+ '<li>Fancy Fact #1</li>'
+ '<li>Fancy Fact #2</li>'
+ '<li>Fancy Fact #3</li>'
+ '</ul>'
);
break;
/* ===== END EDIT ===== */
case 'Saskatchewan':
/* ===== EDIT HERE ===== */
content += (
'<ul>'
+ '<li>Fancy Fact #1</li>'
+ '<li>Fancy Fact #2</li>'
+ '<li>Fancy Fact #3</li>'
+ '</ul>'
);
break;
/* ===== END EDIT ===== */
case 'Northwest Territories':
/* ===== EDIT HERE ===== */
content += (
'<ul>'
+ '<li>Fancy Fact #1</li>'
+ '<li>Fancy Fact #2</li>'
+ '<li>Fancy Fact #3</li>'
+ '</ul>'
);
break;
/* ===== END EDIT ===== */
case 'New Brunswick':
/* ===== EDIT HERE ===== */
content += (
'<ul>'
+ '<li>Fancy Fact #1</li>'
+ '<li>Fancy Fact #2</li>'
+ '<li>Fancy Fact #3</li>'
+ '</ul>'
);
/* ===== END EDIT ===== */
break;
case 'Prince Edward Island':
/* ===== EDIT HERE ===== */
content += (
'<ul>'
+ '<li>Fancy Fact #1</li>'
+ '<li>Fancy Fact #2</li>'
+ '<li>Fancy Fact #3</li>'
+ '</ul>'
);
/* ===== END EDIT ===== */
break;
case 'Nova Scotia':
/* ===== EDIT HERE ===== */
content += (
'<ul>'
+ '<li>Fancy Fact #1</li>'
+ '<li>Fancy Fact #2</li>'
+ '<li>Fancy Fact #3</li>'
+ '</ul>'
);
/* ===== END EDIT ===== */
break;
case 'Yukon':
/* ===== EDIT HERE ===== */
content += (
'<ul>'
+ '<li>Fancy Fact #1</li>'
+ '<li>Fancy Fact #2</li>'
+ '<li>Fancy Fact #3</li>'
+ '</ul>'
);
/* ===== END EDIT ===== */
break;
case 'British Columbia':
/* ===== EDIT HERE ===== */
content += (
'<ul>'
+ '<li>Fancy Fact #1</li>'
+ '<li>Fancy Fact #2</li>'
+ '<li>Fancy Fact #3</li>'
+ '</ul>'
);
/* ===== END EDIT ===== */
break;
default:
content += '<div>No Facts, yet...</div>';
break;
}
$.fancybox({
'type': 'iframe',
'content': content,
'width': '100',
'height': '20'
});
});
map.addListener('rollOverMapObject', function (event) {
console.log(event.mapObject);
});
/* 'href': 'http://en.wikipedia.org/wiki/'+event.mapObject.title, */
</script>
</head>
<body>
<div id="mapdiv" style="width: 800px; background-color:#EEEEEE; height: 500px;"></div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment