Rev 23 | Blame | Compare with Previous | Last modification | View Log | RSS feed
<!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><!-- map file should be included after ammap.js --><script src="../ammap/maps/js/worldLow.js" type="text/javascript"></script><script src="../ammap/themes/black.js" type="text/javascript"></script><script>AmCharts.theme = AmCharts.themes.black;// add all your code to this method, as this will ensure that page is loadedAmCharts.ready(function() {// create AmMap objectvar map = new AmCharts.AmMap();// set path to images/* create data provider objectmapVar tells the map name of the variable of the map data. You have toview source of the map file you included in order to find the name of thevariable - it's the very first line after commented lines.getAreasFromMap indicates that amMap should read all the areas availablein the map data and treat them as they are included in your data provider.in case you don't set it to true, all the areas except listed in dataprovider will be treated as unlisted.*/var dataProvider = {mapVar: AmCharts.maps.worldLow,getAreasFromMap:true};// pass data provider to the map objectmap.dataProvider = dataProvider;/* create areas settings* autoZoom set to true means that the map will zoom-in when clicked on the area* selectedColor indicates color of the clicked area.*/map.areasSettings = {autoZoom: true,rollOverBrightness:10,selectedBrightness:20};// let's say we want a small map to be displayed, so let's create and add it to the mapmap.smallMap = new AmCharts.SmallMap();// write the map to container divmap.write("mapdiv");});</script></head><body><div id="mapdiv" style="width: 100%; background-color:#222222; height: 500px;"></div></body></html>