h5优秀控件_HTML5优秀图表控件

h5优秀控件_HTML5优秀图表控件不管是哪个领域的开发 都有机会用到图表来做统计分析 以更直观的表现形式来代替传统的文字 在以前 图表控件主要有使用程序代码生成的静态图片 或者是使用 flash 实现的图表控件 在 HTML5 非常流行的当下 现代浏览器提供越来越强大的功能 涌现出许多优秀的图表控件 它们基于 Canvas SVG 技术来绘制图表 低版本 IE 使用 VML 技术 不再需要 flash 等额外的插件 提供丰富的表现形式以及交互方式 而且

不管是哪个领域的开发,都有机会用到图表来做统计分析,以更直观的表现形式来代替传统的文字。在以前,图表控件主要有使用程序代码生成的静态图片,或者是使用flash实现的图表控件。

在HTML5非常流行的当下,现代浏览器提供越来越强大的功能,涌现出许多优秀的图表控件,它们基于Canvas/SVG技术来绘制图表(低版本IE使用VML技术),不再需要flash等额外的插件,提供丰富的表现形式以及交互方式,而且性能更加优越。

对于不支持Canvas的浏览器(主要是针对IE),一般都是使用excanvas来适配,它会自动转化成vml来兼容。

Raphaël

一个小型的js库,但是功能非常强大,可以用它在页面上绘制任意类型的图形,以及对图形进行一些操作。

D3

以数据驱动的方式来构建可视化图表,但是操作起来并不简单,而且只支持现代浏览器(古董浏览器就白白吧)

Highcharts

纯js实现,兼容所有现代浏览器,包括iPhone/iPad的移动浏览器,甚至包括古董的IE6。

主要使用SVG技术来渲染,IE8及以下使用VML技术。内置jQuery的支持,对于Mootools和PrototypeJS也提供适配。更详细的兼容性请看:http://www.highcharts.com/documentation/compatibility

支持折线图、样条图、面积图、面积样条图、柱形图、条形图、饼图、散点图、极坐标图、仪表图、范围图表系列等图表类型。

Chart.js

轻量级的js控件(4.5k),不依赖任何js库如jQuery等,有较多的选项可以控制,良好的表现效果。

主要提供折线图、条形图、雷达图、饼图、极坐标图、圆环图。

gRaphaël

基于raphaeljs创建折线图、条形图、柱状图、饼状图等,兼容所有主流浏览器。

RGraph

基于HTML5 Canvas,支持超过20种不同类型的图表:条形、现状、饼图、仪表图,用于计划管理的甘特图、漏斗图、瀑布图等。

morris.js

基于jQuery和Raphaeljs,支持折线图、柱状图、面积图、圆环图等。

xCharts

基于D3的图表,支持折线图、柱状图、时序图等。

dhtmlxChart

跨浏览器的HTML5图表,支持折线图、柱状图、面积图、饼图等,支持XML/JSON等格式的数据源。此外,还有dhtmlxGantt专门用于显示甘特图。

GoJS

使用canvas,用于创建交互式图表(主要是在网页中连接各种元素),功能相当强大。

jsPlumb

用于在网页中连接UI元素,支持主流浏览器。

InfoVis

用于创建各种交互式图表,如面积图、条形图和饼图,但主要是用于创建一些图形,并对他们进行连接。

Flot

基于jQuery的图表库,支持折线图、柱形图、时序图等,并可以通过插件扩展不同的图表类型。

Cubism.js

D3的插件,用于显示时序图。

peity

jQuery插件,生成迷你的折线图、饼图、条形图、时序图等,使用非常灵活。

jQuery Sparklines

jQuery插件,用于生成迷你图表如折线图、柱状图等。

Timeline

交互式的时间轴图表,可以自由移动、拖动、放大以及在时间轴中编辑。

Smoothie Charts

迷你的时序图

jQuery.Gantt

基于jQuery的甘特图插件,支持编辑、缩放等。

jQuery.ganttView

基于jQuery的甘特图插件,支持拖拽以及调整大小。

JointJS

用于创建各种图表并对它们进行连接,支持所有现代标准浏览器,但是对古董浏览器支持不太好(ie9-)。

arbor.js

用于创建动态的连接图,在IE下无法工作。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/209594.html原文链接:https://javaforall.net

(0)
上一篇 2026年3月19日 上午8:53
下一篇 2026年3月19日 上午8:53


相关推荐

  • Mininet教程(三):Mininet命令操作

    Mininet教程(三):Mininet命令操作Mininet 命令共分为网络构建启动参数 内部交互命令 外部运行参数三部分 1 网络构建启动参数 topo custom switch controller mac 等等 2 内部交互命令 dump net nodes links dpctl iperf 等等 3 外部运行参数 c 清除配置信息 h 帮助 等 一 mn 网络构建使用参数介绍 topo 定义拓扑结构 a

    2026年3月18日
    2
  • 万能量产工具_u盘量产工具怎样使用

    万能量产工具_u盘量产工具怎样使用MPALLv3.23.00版本量产工具可以用来给16G金士顿U盘(PS2251-50)主控刷固件量产。当然也适合其他ps22XX主控的量产只是不用刷固件,一般是量产坏了或者量产不了才涉及到刷固件。做设置分区数量,制作u盘启动盘、低级格式化等不需要刷固件即可成功量产。包含固件为50的固件:BN50V313M-8K.BIN BN50V3122KM-2@4k.BIN FW50FF01

    2025年10月12日
    5
  • Hadoop之FileSystem使用

    Hadoop之FileSystem使用前言 在对 hadoop 的 HDFS 文件系统进行操作的时候 我们使用 HADOOP HOME bin hdfsdfs command 该 command 指的就是相应的文件操作 这是使用 shell 的方式 同样 hadoop 也提供了使用 java 来操作 HDFS 文件的方法本次 我们就来简单看下如何使用 java 来操作 HDFS 准备工作 创建一个 mav

    2026年3月19日
    2
  • 【转】Js 数组转JSON格式

    【转】Js 数组转JSON格式要点 1 转化函数 JSON stringify 要点 2 在 js 里写数组的时候是 vardata newArray 但是你如果是要转 json 显示的时候就要写成 vardata 不然转出来的 json 全是空的 先看一种错误格式 script 定义一个数组 vardata newArray for v script

    2026年2月6日
    2
  • 用过上百款编程MCP,只有这15个真正好用,Claude Code与Codex配置MCP详细教程

    用过上百款编程MCP,只有这15个真正好用,Claude Code与Codex配置MCP详细教程

    2026年3月16日
    3
  • MySQL的InnoDB存储引擎

    MySQL的InnoDB存储引擎InnoDB 的版本在 MySQL5 1 版本中 MySQL 数据库允许存储引擎以动态形式加载 存储引擎的更新不受 MySQL 数据库版本的限制 所有在 MySQL5 1 版本中存在两个版本的 InnoDB 一个是静态的 InnoDB 另外一个是动态加载的 InnoDB 也称之为 InnoDBPlugin 也称之为 InnoDB1 0 X 版本 随后 MySQL5 5 版本中 InnoDB 升级为 InnoDB1 1 X 版本 MySQL5 6 版本中 InnoDB 升级为 InnoDB1 2 X 版本 主要不同如下 版本 功能 老版本

    2026年3月16日
    2

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号