#8349

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/usaLow.js"></script>
<script type="text/javascript" src="http://www.amcharts.com/lib/3/themes/none.js"></script>
<div id="chartdiv"></div>

CSS

#chartdiv {
	width	: 100%;
	height	: 500px;
}

JavaScript

var map = AmCharts.makeChart("chartdiv", {
	type: "map",
    "theme": "none",
    pathToImages: "http://www.amcharts.com/lib/3/images/",

	colorSteps: 10,

	dataProvider: {
		map: "usaLow",
		areas: [{
			id: "US-AL",
            color: "#c00",
            url: "http://en.wikipedia.org/wiki/Alabama"
		}, {
			id: "US-AK",
            color: "#0c0",
            url: "http://en.wikipedia.org/wiki/Alaska"
		}, {
			id: "US-AZ",
            color: "#00c",
            url: "http://en.wikipedia.org/wiki/Arizona"
		}]
	},

	areasSettings: {
		autoZoom: true
	},
    
    zoomControl: {
        zoomControlEnabled: false,
        panControlEnabled: false
    }

});