如果你已经看了前面的关于曲线和柱状图的实现,饼图你看看效果和代码就行了!
?
动态柱状图实现
?
动态曲线实现
?
效果如下:
?
?
直接运行该JSP,你会看到效果,代码如下:
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <html> <head> <title>Highcharts Example</title> <script language="javascript" type="text/javascript" src="jquery.min.js"></script> <script language="javascript" type="text/javascript" src="highcharts.js"></script> <script language="javascript" type="text/javascript" src="exporting.js"></script> <script type="text/javascript"> var chart; $(document).ready(function() { chart = new Highcharts.Chart({ chart: { renderTo: 'container', plotBackgroundColor: null, plotBorderWidth: null, plotShadow: false, events: { load: function() { // set up the updating of the chart each second var series = this.series[0]; setInterval(function() { var data = []; data.push(['Firefox', Math.random()]); data.push(['IE', Math.random()]); data.push(['Safari', Math.random()]); data.push(['Opera', Math.random()]); data.push(['Others', Math.random()]); series.setData(data); }, 2000); } } }, title: { text: '<b>Java小强制作</b>' }, tooltip: { formatter: function() { return '<b>'+ this.point.name +'</b>: '+ this.percentage +' %'; } }, plotOptions: { pie: { allowPointSelect: true, cursor: 'pointer', dataLabels: { enabled: true, color: '#000000', connectorColor: '#000000', formatter: function() { return '<b>'+ this.point.name +'</b>: '+ this.percentage +' %'; } } } }, series: [{ type: 'pie', name: 'Browser share', data: [ ['Firefox', 45.8], ['IE', 26.8], ['Safari', 8.5], ['Opera', 6.2], ['Others', 12.7] ] }] }); }); </script> </head> <body> <div id="container" style="width: 800px;height: 400px"></div> </body> </html>
?
废话不再多说!
?
由于近期大量小网站在未经同意情况下使用文章,现将我的博客地址公布如下,请您到ITEYE网站看原创,谢谢!
http://cuisuqiang.iteye.com/?!
?
1 楼
023photon
2012-06-09
截图功能后台Java代码能不能写个啊?
2 楼
cuisuqiang
2012-06-09
023photon 写道
截图功能后台Java代码能不能写个啊?
这与当前内容无关吧!
3 楼
qqxiaodi
2012-06-20
这个商用是收费的
4 楼
qqxiaodi
2012-06-20
后台有生成图片的源码 上官网上下就可以了
5 楼
cuisuqiang
2012-06-20
qqxiaodi 写道
后台有生成图片的源码 上官网上下就可以了
在JS里面改动一下可以把打印和生成图片按钮去掉,我已经去掉了
6 楼
cuisuqiang
2012-06-20
qqxiaodi 写道
这个商用是收费的
没办法!