<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<div class="container">
<div class="row">
<br />
<div id="chart_div" style="width: 100%; height: 100%;"></div>
<br />
<br />
</div>
</div>
$(document).ready(function(){
//------başlangıç
google.charts.load('current', {
packages: ['corechart']
}).then(function () {
var data = google.visualization.arrayToDataTable([
['', 'Views'],
['dat1', 40],
['dat2', 10],
['dat3', 10]
]);
var options = {
legend: 'none',
pieSliceText: 'label',
width: 200,
height: 200,
chartArea: {'width': '80%', 'height': '80%'},
legend: {
position: 'bottom',
// style paging text and arrows
pagingTextStyle: {
color: '#616161'
},
scrollArrows:{
activeColor: '#616161',
inactiveColor:'#e0e0e0'
}
},
backgroundColor: {fill: 'transparent'},
pieSliceBorderColor: 'transparent',
colors: ['#950021', '#2b9b38', '#050D8E']
};
var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
chart.draw(data, options);
});
//--------------bitiş
});
