【学習メモ】円グラフのコード【Google Chartsの練習】

HTML/CSS

<!DOCTYPE html>
<html lang="ja">
<head>
	<meta charset="UTF-8">
	<title>Chart Tools</title>
</head>
	<body>
		<div id="target"></div>
		<script src="https://www.gstatic.com/charts/loader.js"></script>
		<script>
		(function() {
			'use strict';
			function drawChart() {
				var target = document.getElementById('target');
				var data;
				var options = {
					title: 'My Chart',
					width: 500,
					height: 300,
					backgroundColor: '#f8f8f8',
					colors: ['#aaa','#bbb', '#ccc'],
					slices: [1, {offset: 0.2}],
					is3D: true
				    };
				var chart = new google.visualization.PieChart(target);
				data = new google.visualization.arrayToDataTable([
					['Language', 'Votes'],
					['PHP' ,100],
					['Ruby' ,20],
					['Python' ,10]
				    ]);
				chart.draw(data, options);
			    }
			google.charts.load('current', {packages: ['corechart']});
			google.charts.setOnLoadCallback(drawChart);
		    })();
		</script>
	</body>
</html>

 

【おさかなび-osakanav-】では、この記事の感想!おさかなへの応援メッセージ!おさかなに聞きたい事、質問!記事にしてほしい内容!などを大募集中!

「氏名」「メールアドレス」「内容」の3点をご記入の上「osakana1699@gmail.com」までご応募ください!

この記事は役に立ちましたか?

タイトルとURLをコピーしました