您好,欢迎访问一九零五行业门户网

如何在 HTML 页面上显示出有交互的统计图?

想单纯画一些简单的统计图,比如柱状图 饼状图等
但是r画出来的图始终感觉交互性不强,不互动,只是一张一张的图,串起来很难形象。而且始终有些不方便。
我想在网页上显示一些统计图(数据来源是数据库统计我用perlcgi应该没问题),并且可以有一些互动,比如点击饼状图一部分,会出现该部分的柱状图之类的。
我应该如何开始学习?
回复内容:1 open flash chart是一个开源的flash制图组件。
主页:http://teethgrinder.co.uk/open-flash-chart/
下载:http://teethgrinder.co.uk/open-flash-chart/download.php
示例:http://teethgrinder.co.uk/open-flash-chart/
2 xml swf charts是一个简单,但强大,利用flash和动态生成xml数据来产生web chart的工具。当前支持的charts类型包括:
linecolumnstacked columnfloating column3d columnstacked 3d columnparallel 3d columnpie3d piebarstacked barfloating barareastacked areacandlestickscatterpolarmixedcompositejoined
主页:http://www.maani.us/xml_charts/
下载:http://www.maani.us/xml_charts/index.php?menu=download
示例:http://www.maani.us/xml_charts/index.php?menu=gallery
3 flotr是一个基于prototype开发的javascript绘图工具。支持图例,鼠标跟踪,图片区域选择,图片缩放,添加事件钩子(event hook),通过css设置样式等。
主页:http://solutoire.com/flotr/
下载:http://code.google.com/p/flotr/
示例:http://code.google.com/p/flotr/
4 open flash chart2是依据open flash chart1.x完全重新构建的一个flash图表绘制组件。与1.x版本最大不同之处在于把数据格式改成json,以实现一些更酷的功能。该版本全部采用actionscript3开发,adobe flex编译。
主页:http://teethgrinder.co.uk/open-flash-chart-2/
下载:http://teethgrinder.co.uk/open-flash-chart-2/downloads.php
示例:http://teethgrinder.co.uk/open-flash-chart-2/area-hollow.php
5 visifire是一组开源的microsoft silverlight图表制作组件。 visifire让你利用asp、http://asp.net、php、jsp、coldfusion、ruby on rails或是只有html都能快速制作出“惊人”的图表(charts)。不需要懂得任何silverlight知识,只要具备基础的html知识,就能够使用该强大的silverlight图表制作组件。
主页:http://www.visifire.com/
下载:http://www.visifire.com/download_silverlight_charts.php
示例:http://www.visifire.com/
6 fusioncharts free是一个制图组件用于创建好看,数据驱动,拥有动画效果的flash charts。它能够与php、python、ruby on rails、asp、http://asp.net、jsp、coldfusion、html页面等一起使用。这个组件是fusioncharts的免费版,但功能仍然很强大。它能够生成的图表类型包括:
2d/3d column & bar charts2d/3d pie & doughnut chartsline chartsarea chartsstacked chartsgantt charts 主页:fusioncharts free
下载:http://www.fusioncharts.com/free/download.asp
示例:http://www.atblabs.com/jquery.corners.html
7 js charts是一个javascript制图组件。支持的图表类型包括:柱状图,圆饼图,曲线图等。js charts支持的数据源可以是xml或javascript数组。
主页:http://www.jscharts.com/
下载:http://www.jscharts.com/free-download
示例:http://www.jscharts.com/examples
8 axiis是一个基于degrafa,flex&actionscript3.0开发的开源数据图表组件。
主页:http://www.axiis.org/index.html
下载:http://code.google.com/p/axiis/downloads/list
示例:http://www.axiis.org/examples.html
9 jqplot是一个jquery绘图插件,可以利用它制作漂亮的线状图和柱状图。jqplot支持为图表设置各种不同的样式。提供tooltips,数据点高亮显示等功能。
主页:http://www.jqplot.com/
下载:http://www.bitbucket.org/cleonello/jqplot/downloads/
示例:http://www.jqplot.com/tests/
10 highcharts js是一个纯javascript制图library,支持的图表类型包括:line、spline、area、areaspline、column、bar、pie和scatter。当鼠标移到图表上时会利用一个tooltip展示每一点或区域上相关的文本信息。可以放大图表,查看某部分更详细的数据。highcharts支持大部分浏览器包括iphone和ie6。
主页:highcharts - interactive javascript charts for your webpage
下载:http://www.highcharts.com/downloads/zips/highcharts.zip
示例:http://www.highcharts.com/demo/
先提供这十个吧,不知道是不是你想要的,玩会了其中几个就行了。
echarts妥妥的,国产又强大,拿来就能用。
文档齐全,样例众多,有bug或者疑问可以直接问作者。百度做的echarts相当的不错 看一下highcharts要先学习js代码,用js先做出 饼状图和柱形图,这样实现链接跳转就很简单了 ,只要精通js这些都可以实现!简单到令人发指。
把你的饼所要点选的区域都切出来,然后用定位或浮动拼一块,再设置下伪类,搞掂。
其它类似信息

推荐信息