leewillis77 · March 28, 2012 20:08
diff --git a/flotdonut.php b/flotdonut.php
 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
 <html>
 <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Flot Pie Examples</title>
 	<!--[if lte IE 8]><script language="javascript" type="text/javascript" src="flot/excanvas.min.js"></script><![endif]-->
    <script language="javascript" type="text/javascript" src="flot/jquery.js"></script>
 	<script language="javascript" type="text/javascript" src="flot/jquery.flot.js"></script>
    <script language="javascript" type="text/javascript" src="flot/jquery.flot.pie.js"></script>
 	<?php $percentage = rand(1,100); ?>
 	<script type="text/javascript">
 	$(function () {
 		// data
 		var data = [];
 		var series = 2;
 		var success = <?php echo $percentage; ?>;
 		data[0] = { label: "Series"+(0+1), data: success, color: '#d1d600' };
 		data[1] = { label: "Series"+(1+1), data: 100-success, color: '#e8e7e3' };
 		

 		// DEFAULT
 	    $.plot($("#pie"), data, 
 		{
 			series: {
 				pie: { 
 					show: true,
 					label: {
 						show: false,
 					}
 				}
 			},
 			legend: {
 				show: false
 			}
 		});
 	});
 	</script>

 	<style type="text/css">
 		* {
 		  font-family: sans-serif;
 		}
 		
 		body
 		{
 			padding: 0 1em 1em 1em;
 		}
 		
 		div.graph
 		{
 			width: 9em;
 			height: 9em;
 			float: left;
 		}
 		
 		label
 		{
 			display: block;
 			margin-left: 400px;
 			padding-left: 1em;
 		}
 		
 		h2
 		{
 			padding-top: 1em;
 			margin-bottom: 0;
 			clear: both;
 			color: #ccc;
 		}
 		
 		code
 		{
 			display: block;
 			background-color: #eee;
 			border: 1px dashed #999;
 			padding: 0.5em;
 			margin: 0.5em;
 			color: #666;
 			font-size: 10pt;
 		}
 		
 		code b
 		{
 			color: black;
 		}
 		
 		ul
 		{
 			font-size: 10pt;
 		}
 		
 		ul li
 		{
 			margin-bottom: 0.5em;
 		}
 		
 		ul.options li
 		{
 			list-style: none;
 			margin-bottom: 1em;
 		}
 		
 		ul li i
 		{
 			color: #999;
 		}

 		#piewrap {
 			position: relative;
 		}
 		#percentage {
 			position: absolute;
 			top: 2em;
 			left: 2em;
 			text-align: center;
 			width: 3em;
 			height: 3em;
 			background: #fff;
 			padding: 1em;
 			border-radius: 50%;
 			line-height: 3em;
 			font-weight: bold;
 		}
 	</style>
 	</head>
 	<body>
 			<div id="piewrap">
    			<div id="pie" class="graph"></div>
    			<div id="percentage"><?php echo $percentage; ?>%</div>
    		</div>
 	</body>
 </html>
	<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
	<html>
	<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
	<title>Flot Pie Examples</title>
	<!--[if lte IE 8]><script language="javascript" type="text/javascript" src="flot/excanvas.min.js"></script><![endif]-->
	<script language="javascript" type="text/javascript" src="flot/jquery.js"></script>
	<script language="javascript" type="text/javascript" src="flot/jquery.flot.js"></script>
	<script language="javascript" type="text/javascript" src="flot/jquery.flot.pie.js"></script>
	<?php $percentage = rand(1,100); ?>
	<script type="text/javascript">
	$(function () {
	// data
	var data = [];
	var series = 2;
	var success = <?php echo $percentage; ?>;
	data[0] = { label: "Series"+(0+1), data: success, color: '#d1d600' };
	data[1] = { label: "Series"+(1+1), data: 100-success, color: '#e8e7e3' };


	// DEFAULT
	$.plot($("#pie"), data,
	{
	series: {
	pie: {
	show: true,
	label: {
	show: false,
	}
	}
	},
	legend: {
	show: false
	}
	});
	});
	</script>

	<style type="text/css">
	* {
	font-family: sans-serif;
	}

	body
	{
	padding: 0 1em 1em 1em;
	}

	div.graph
	{
	width: 9em;
	height: 9em;
	float: left;
	}

	label
	{
	display: block;
	margin-left: 400px;
	padding-left: 1em;
	}

	h2
	{
	padding-top: 1em;
	margin-bottom: 0;
	clear: both;
	color: #ccc;
	}

	code
	{
	display: block;
	background-color: #eee;
	border: 1px dashed #999;
	padding: 0.5em;
	margin: 0.5em;
	color: #666;
	font-size: 10pt;
	}

	code b
	{
	color: black;
	}

	ul
	{
	font-size: 10pt;
	}

	ul li
	{
	margin-bottom: 0.5em;
	}

	ul.options li
	{
	list-style: none;
	margin-bottom: 1em;
	}

	ul li i
	{
	color: #999;
	}

	#piewrap {
	position: relative;
	}
	#percentage {
	position: absolute;
	top: 2em;
	left: 2em;
	text-align: center;
	width: 3em;
	height: 3em;
	background: #fff;
	padding: 1em;
	border-radius: 50%;
	line-height: 3em;
	font-weight: bold;
	}
	</style>
	</head>
	<body>
	<div id="piewrap">
	<div id="pie" class="graph"></div>
	<div id="percentage"><?php echo $percentage; ?>%</div>
	</div>
	</body>
	</html>