#8602

by amcharts

HTML

<script type="text/javascript" src="http://www.amcharts.com/lib/3/ammap.js"></script>
<script type="text/javascript" src="http://www.amcharts.com/lib/3/maps/js/worldHigh.js"></script>
<script type="text/javascript" src="http://www.amcharts.com/lib/3/themes/none.js"></script>
<div id="mapdiv" style="width: 1000px; height: 450px;"></div>
<div style="width: 1000px; font-size: 70%; padding: 5px 0; text-align: center; background-color: #535364; margin-top: 1px; color: #CDCDCD;"><a href="http://www.amcharts.com/visited_countries/" style="color: #CDCDCD;">Create your own visited countries map</a> or check out the <a href="http://www.amcharts.com/" style="color: #CDCDCD;">JavaScript Charts</a>.</div>

CSS

body {
    font-family: Verdana;
    font-size: 12px;
}

JavaScript

var map;
AmCharts.ready(function () {
    map = new AmCharts.AmMap();
    map.pathToImages = "http://www.amcharts.com/lib/3/images/";
    map.panEventsEnabled = true;
    map.backgroundColor = "#535364";
    map.backgroundAlpha = 1;

    map.zoomControl.panControlEnabled = true;
    map.zoomControl.zoomControlEnabled = true;

    var dataProvider = {
        mapVar: AmCharts.maps.worldHigh,
        getAreasFromMap: true,
        areas: [{
            id: 'FR',
            showAsSelected: true
        }, {
            id: 'DE',
            showAsSelected: true
        }, {
            id: 'IT',
            showAsSelected: true
        }, {
            id: 'PL',
            showAsSelected: true
        }, {
            id: 'ES',
            showAsSelected: true
        }, {
            id: 'CH',
            showAsSelected: true
        }, {
            id: 'GB',
            showAsSelected: true
        }, {
            id: 'BR',
            showAsSelected: true
        }, {
            id: 'AO',
            showAsSelected: true
        }, {
            id: 'BJ',
            showAsSelected: true
        }, {
            id: 'EG',
            showAsSelected: true
        }, {
            id: 'GM',
            showAsSelected: true
        }, {
            id: 'GH',
            showAsSelected: true
        }, {
            id: 'GN',
            showAsSelected: true
        }, {
            id: 'GW',
            showAsSelected: true
        }, {
            id: 'KE',
            showAsSelected: true
        }, {
            id: 'MG',
            showAsSelected: true
        }, {
            id: 'MZ',
            showAsSelected: true
        }, {
            id: 'NG',
            showAsSelected: true
        }, {
            id: 'ZA',
            showAsSelected: true
        }, {
            id: 'SD',
            showAsSelected: true
        }, {
            id: 'TZ',
            showAsSelected: true
        }, {
            id: 'UG',
            showAsSelected: true
   ...