首页 > web前端 > H5教程 > 正文

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

php中文网
发布: 2016-06-07 08:45:11
原创
3708人浏览过

想单纯画一些简单的统计图,比如柱状图 饼状图等
但是R画出来的图始终感觉交互性不强,不互动,只是一张一张的图,串起来很难形象。而且始终有些不方便。
我想在网页上显示一些统计图(数据来源是数据库统计我用perlCGI应该没问题),并且可以有一些互动,比如点击饼状图一部分,会出现该部分的柱状图之类的。
我应该如何开始学习?

回复内容:

1 Open Flash Chart是一个开源的Flash制图组件。 如何在 HTML 页面上显示出有交互的统计图?

主页:teethgrinder.co.uk/open


下载:teethgrinder.co.uk/open


示例:teethgrinder.co.uk/open

2 XML SWF Charts是一个简单,但强大,利用Flash和动态生成XML数据来产生web chart的工具。当前支持的Charts类型包括:

  • Line
  • Column
  • Stacked column
  • Floating column
  • 3D column
  • Stacked 3D column
  • Parallel 3D column
  • Pie
  • 3D Pie
  • Bar
  • Stacked bar
  • Floating bar
  • Area
  • Stacked area
  • Candlestick
  • Scatter
  • Polar
  • Mixed
  • Composite
  • Joined
  • 如何在 HTML 页面上显示出有交互的统计图?

    主页:maani.us/xml_charts/

    立即学习前端免费学习笔记(深入)”;


    下载:maani.us/xml_charts/ind


    示例:maani.us/xml_charts/ind


    3 Flotr是一个基于Prototype开发的javascript绘图工具。支持图例,鼠标跟踪,图片区域选择,图片缩放,添加事件钩子(event hook),通过CSS设置样式等。

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

    主页:solutoire.com/flotr/


    下载:code.google.com/p/flotr


    示例:code.google.com/p/flotr


    4 Open Flash Chart2是依据Open Flash Chart1.x完全重新构建的一个Flash图表绘制组件。与1.x版本最大不同之处在于把数据格式改成JSON,以实现一些更酷的功能。该版本全部采用Actionscript3开发,Adobe Flex编译。

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

    主页:teethgrinder.co.uk/open


    下载:teethgrinder.co.uk/open


    示例:teethgrinder.co.uk/open


    5 Visifire是一组开源的Microsoft Silverlight图表制作组件。 Visifire让你利用ASP、ASP.Net、PHP、JSP、ColdFusion、Ruby on Rails或是只有HTML都能快速制作出“惊人”的图表(Charts)。不需要懂得任何Silverlight知识,只要具备基础的HTML知识,就能够使用该强大的Silverlight图表制作组件。

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

    主页:visifire.com/


    下载:visifire.com/download_s


    示例:visifire.com/


    6 FusionCharts Free是一个制图组件用于创建好看,数据驱动,拥有动画效果的Flash charts。它能够与PHP、Python、Ruby on Rails、ASP、ASP.NET、JSP、ColdFusion、HTML页面等一起使用。这个组件是FusionCharts的免费版,但功能仍然很强大。它能够生成的图表类型包括:

    影缘版商城
    影缘版商城

    率先引入语言包机制,可在1小时内制作出任何语言版本,程序所有应用文字皆引自LANG目录下的语言包文件,独特的套图更换功能,三级物品分类,购物车帖心设计,在国内率先将购物车与商品显示页面完美结合,完善的商品管理,具备上架、下架缺货及特价商品设置功能多多,商城名、消费税、最低购物金额、货币符号、商城货币名称全部后台设定,多级用户考虑,管理员只需要设置用户级别、不同级别用户之返点系统自动判断用户应得返还

    影缘版商城 0
    查看详情 影缘版商城
  • 2D/3D column & bar charts
  • 2D/3D pie & doughnut charts
  • Line charts
  • Area charts
  • Stacked charts
  • Gantt charts
  • 如何在 HTML 页面上显示出有交互的统计图?

    主页:FusionCharts Free

    下载:fusioncharts.com/free/D

    示例:atblabs.com/jquery.corn


    7 JS Charts是一个JavaScript制图组件。支持的图表类型包括:柱状图,圆饼图,曲线图等。JS Charts支持的数据源可以是XML或JavaScript数组。
    如何在 HTML 页面上显示出有交互的统计图?

    主页:jscharts.com/

    下载:jscharts.com/free-downl

    示例:jscharts.com/examples


    8 Axiis是一个基于Degrafa,Flex&ActionScript3.0开发的开源数据图表组件。

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

    主页:axiis.org/index.html

    下载:code.google.com/p/axiis

    示例:axiis.org/examples.html

    9 jqPlot是一个jQuery绘图插件,可以利用它制作漂亮的线状图和柱状图。jqPlot支持为图表设置各种不同的样式。提供Tooltips,数据点高亮显示等功能。

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

    主页:jqplot.com/


    下载:bitbucket.org/cleonello


    示例:jqplot.com/tests/


    10 Highcharts JS是一个纯JavaScript制图Library,支持的图表类型包括:line、spline、area、areaspline、column、bar、pie和scatter。当鼠标移到图表上时会利用一个tooltip展示每一点或区域上相关的文本信息。可以放大图表,查看某部分更详细的数据。Highcharts支持大部分浏览器包括iPhone和IE6。

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

    主页:Highcharts - Interactive JavaScript charts for your webpage

    下载:highcharts.com/download

    示例:highcharts.com/demo/


    先提供这十个吧,不知道是不是你想要的,玩会了其中几个就行了。

    echarts妥妥的,国产又强大,拿来就能用。
    文档齐全,样例众多,有bug或者疑问可以直接问作者。 百度做的Echarts相当的不错 看一下highcharts 要先学习JS代码,用JS先做出 饼状图和柱形图,这样实现链接跳转就很简单了 ,只要精通JS这些都可以实现! 简单到令人发指。

    把你的饼所要点选的区域都切出来,然后用定位或浮动拼一块,再设置下伪类,搞掂。
    HTML速学教程(入门课程)
    HTML速学教程(入门课程)

    HTML怎么学习?HTML怎么入门?HTML在哪学?HTML怎么学才快?不用担心,这里为大家提供了HTML速学教程(入门课程),有需要的小伙伴保存下载就能学习啦!

    下载
    来源:php中文网
    本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
    最新问题
    开源免费商场系统广告
    热门教程
    更多>
    最新下载
    更多>
    网站特效
    网站源码
    网站素材
    前端模板
    关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
    php中文网:公益在线php培训,帮助PHP学习者快速成长!
    关注服务号 技术交流群
    PHP中文网订阅号
    每天精选资源文章推送
    PHP中文网APP
    随时随地碎片化学习

    Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号