#8267

HTML

<script type="text/javascript" src="http://www.amcharts.com/lib/3/amcharts.js"></script>
<script type="text/javascript" src="http://www.amcharts.com/lib/3/serial.js"></script>
<script type="text/javascript" src="http://www.amcharts.com/lib/3/pie.js"></script>

<div id="donutcharts">
    <div id="chartdiv2"></div>
    <div id="chartdiv3"></div>
</div>

CSS

body {
    font-family: Verdana;
    font-size: auto;
    background: #000;
}
#chartdiv {
	width		: 400px;
	height		: 300px;
    float: left;
    font-size: 70px;
}
#donutcharts {
	width		: 400px;
	height		: 300px;
    float: left;
    position: relative;    
}
#chartdiv2, #chartdiv3 {
	width		: 300px;
	height		: 300px;
    position: absolute;
    top: 0;
    left: 0;
    font-size: 70px;
}

JavaScript

var columnChart = AmCharts.makeChart("chartdiv", {
    "type": "serial",
    "theme": "none",
    "color": "#fff",
    "creditsPosition": "bottom-right",
    "dataProvider": [{
        "country": "USA",
        "visits": 20
    }, {
        "country": "China",
        "visits": 15
    }],
    "valueAxes": [{
        "gridColor":"#FFFFFF",
		"gridAlpha": 0,
		"dashLength": 0,
        "labelsEnabled": false,
        "axisAlpha": 0
    }],
    "gridAboveGraphs": true,
    "startDuration": 1,
    "graphs": [{
        "balloonText": "[[category]]: <b>[[value]]</b>",
        "labelText": "[[value]]",
        "fontSize": 70,
        "fillAlphas": 0.8,
        "fillColors": ['#1fc072', '#1fc072', '#1fc072', '#1fc072', '#1fc072', '#1fc072', '#1fc072', '#1fc072', '#1fc072', '#1fc072', '#1fc072', '#1fc072', '#1fc072', '#1fc072', '#1fc072', '#1fc072', '#1fc072', '#1fc072', '#1fc072', '#1fc072', '#349862', '#349862', '#349862', '#349862', '#349862', '#349862', '#349862', '#349862', '#349862', '#349862', '#349862', '#349862', '#349862', '#349862', '#349862', '#349862', '#349862', '#349862', '#349862', '#349862'],
        "gradientOrientation": "horizontal",
        "lineAlpha": 0.2,
        "type": "column",
        "valueField": "visits"		
    }],
    "chartCursor": {
        "categoryBalloonEnabled": false,
        "cursorAlpha": 0,
        "zoomable": false
    },
    "categoryField": "country",
    "categoryAxis": {
        "gridPosition": "start",
        "gridAlpha": 0,
         "tickPosition":"start",
         "tickLength":20,
        "labelsEnabled": false,
        "axisAlpha": 0
    }
});

// donut chart
var donutChart1 = AmCharts.makeChart("chartdiv2", {
    "type": "pie",
    "theme": "none",
    "balloonText": "",
    "colors": ["#5c5855", "#fe413f"],
    "dataProvider": [{
        "title": "New",
        "value": 4852
    }, {
        "title": "Returning",
        "value": 9899
    }],
    "titleField": "title",
    "valueField": "value",
    "labelRadius": 5,
   ...