Donut chart

Donut or Doughnut chart is just a simple pie chart with a hole inside. You can define hole radius to any size you need, both in percent or pixels. <h2>Donut chart with patterns</h2> Click on PATTERNS theme above the chart - you will see that our pie or donut chart supports patterns. There are several pre-build patterns in our package or you can easily build your own fancy patterns and use them with our charts.

HTML

<script src="https://www.amcharts.com/lib/3/amcharts.js"></script>
<script src="https://www.amcharts.com/lib/3/pie.js"></script>
<script src="https://www.amcharts.com/lib/3/plugins/export/export.min.js"></script>
<link rel="stylesheet" href="https://www.amcharts.com/lib/3/plugins/export/export.css" type="text/css" media="all" />
<script src="https://www.amcharts.com/lib/3/themes/light.js"></script>
<div id="chartdiv"></div>

CSS

#chartdiv {
	width		: 100%;
	height		: 500px;
	font-size	: 11px;
}

JavaScript

AmCharts.makeChart("chartdiv", {
  "type": "pie",
  "theme": "light",

  "dataProvider": [{
    "title": "contract",
    "value": 10,
    "color": "#67b7dc"
  }, {
    "title": "permanent",
    "value": 90,
    "color": "#67b7dc"
  }],
  "titleField": "title",
  "valueField": "value",
  "labelRadius": -130,
  "radius": "30%",
  "innerRadius": "70%",
  "labelText": ""
});