<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>EASY饼图数据统计Jquery插件</title>
<script src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.easy-pie-chart.js"></script>
<style>
.easyPieChart{position:relative;text-align:center}.easyPieChart canvas{position:absolute;top:0;left:0}
</style>
<script type="text/javascript">
var initPieChart = function() {
$('.percentage-light').easyPieChart({
barColor: "red",
trackColor: '#ccc',
scaleColor: false,
lineCap: 'butt',
size:100,
lineWidth: 10,
animate: 1000
});
};
</script>
</head>
<body onLoad="initPieChart();">
<div class="container">
<h1>EASY饼图</h1>
<div class="dark">
<div class="chart">
<div class="percentage-light" data-percent="55"><span>55</span>%</div>
<div class="label">新的访问</div>
</div>
</div>
</div>
<embed src="http://cdn.abowman.com/widgets/dog/dog.swf?3?"
width="300" height="220"></embed>
<object type="application/x-shockwave-flash" data="http://cdn.abowman.com/widgets/dog/dog.swf?3?" width="300" height="225"><param name="movie" value="http://cdn.abowman.com/widgets/dog/dog.swf?3?"></param><param name="AllowScriptAccess" value="always"></param><param name="wmode" value="opaque"></param><param name="bgcolor" value="FFFFFF"/></object>
<object type="application/x-shockwave-flash" style="outline:none;" data="http://cdn.abowman.com/widgets/newtonscradle/newtonsCradle.swf?" width="300" height="225"><param name="movie" value="http://cdn.abowman.com/widgets/newtonscradle/newtonsCradle.swf?"></param><param name="AllowScriptAccess" value="always"></param><param name="wmode" value="opaque"></param></object>
</body>
</html>
圆环-进度图
最新推荐文章于 2024-05-20 11:40:56 发布