9 个基于JavaScript 和 CSS 的 Web 图表框架

17个WebGL框架及Web3D图形库 WebGL是基于OpenGL的JavaScript API库,允许Web浏览器在浏览器中渲染3D / 2D图形,WebGL可以通过浏览器设置或使用特殊插件来禁用或启用。 阅读详情

jQuery, MooTools, Prototype 等优秀的 JavaScript 框架拥有各种强大的功能,包括绘制 Web 图表,使用这些框架以及相应插件,我们可以非常轻松地实现曲线图,圆饼图,柱状图等 Web 图表的绘制,而不必象以往那样通过复杂的 Flash 技术实现。本文介绍了9个优秀的基于 JavaScript 与 CSS 的 Web 图表框架。

1. Flot

Flot 是一个纯粹的 jQuery JavaScript 绘图库,可以在客户端即时生成图形,使用非常简单,支持放大缩小以及鼠标追踪等交互功能。该插件支持 IE6/7/8, Firefox 2.x+, Safari 3.0+, Opera 9.5+ 以及 Konqueror 4.x+。使用的是 Safari 最先引入的 Canvas 对象,目前所有主流浏览器都支持该对象,除了 IE, 因此在 IE中使用 JavaScript 进行模拟。这里有一些实例。

2. JS Charts

JS Charts 是一个免费的基于 JavaScript 的图表生成器,表格绘制非常简单,几乎不需要编码,也不需要插件和服务器模块,使用XML 或 JavaScript 数组缓存数据。

3. TableToChart

TableToChart 是一个 MooTools 脚本,可以将 HTML Table 对象中存储的数据绘制成图表。你可以使用 table 标签生成图表,柱状图,曲线图,圆饼图等。

4. PlotKit

PlotKit 是一个 JavaScript 绘图库,支持 HTML Canvas 标签,也支持 SVG。

5. Yahoo UI Charts Control

YUI Charts Control 可以在网页上将表格数据转换为图表,支持柱状图,曲线图以及圆饼图。支持 DataSource 工具,可设置的轴,鼠标盘旋提示,图表组合,以及皮肤等功能。

6. ProtoChart

ProtoChart 是一个基于 Prototype 和 Canvas 标签的开源库,这个库深受 Flot, Flotr, Plotkit 等启发,支持曲线图,柱状图,圆饼图等,可以在同一个图表上显示多套数据,支持可定制的图例,网格,边界以及背景图。支持 IE6/7, Firefox 2/3 以及 Safari,甚至支持 iPhone.

7. EJSChart

EJSChart 支持鼠标追踪,鼠标事件,按键追踪与事件,缩放,滚动,交互等功能,将用户体验上升到一个新高度。支持曲线图,面积图,离散图,圆饼图,柱状图等形式,拥有完备文档的属性和方法可以帮助实现很好的定制。

8. fgCharting

fgCharting 是一个很出色的 jQuery 插件,支持多种图形。

9. Pure Css Data Chart

以往的数据展示往往通过 flash 实现,现在,我们可以通过纯粹的 CSS 实现类似的功能。CSSGlobe 有一个非常实用的教程帮你实现基于 CSS 的绘图,甚至不需要 JavaScript。

本文国际来源:http://woork.blogspot.com/2009/03/useful-scripts-to-plot-charts-in-web.html
中文翻译来源:COMSHARP CMS 官方网站

JavaScript有哪些图形图像处理的框架? 常用的JS图像库收集整理 阅读详情

相关推荐

基于javascript实现按圆形排列DIV元素(三)

$(this).css({left:Math.sin((ahd*index+ainhd))*radius+dotLeft,top:Math.cos((ahd*index+ainhd))*radius+dotTop}); 效果图: 分析图: 上图中: 黑色:是外层容器; 黄色:是需要按椭圆运动的图片 橙色:每个图片元素距离容器顶部的距离 紫色:长半径或短半径; 蓝色:图片距离容器顶部最大的距离 绿色:坐标轴; 白色:椭圆运动轨迹; 一、原理分析:   1.1按椭圆运运   前面两个随笔分析了“圆形排列”和“按圆形运动”,知道了“排列”和“运动”这两个以后,再来看这个实例应该就有基础了

WebGL 可视化3D绘图框架:Three.js 零基础上手实战

相对于Flash,Flex,Silverlight等富客户端技术,WebGL之ThreeJS:通过OpenGL ES 2.0,WebGL可以为HTML5 Canvas提供硬件3D加速渲染,这样Web开发人员就可以借助系统显卡来在浏览器里更流畅地展示3D场景和模型了,还能创建复杂的导航和数据视觉化。这是未来的网游趋势,如果你想做可视化动画三维企业应用,又不想用复杂的C++程序,那么 Three.js 将会是你最好的选择。  本课程主要的功效就是让你学习完本教程后,能够写出在浏览器上流畅运行的3D程序,包括但不限于:大数据可视化,360度全景展示,3D游戏,完成这些事情,会比c++用更少的代码。而且更容易,更酷。 在本课程中,我们将由浅入深的讲解这些效果的实现,这能让你迅速提高开发技能,在职场中处于不败之地。课程共十三章,大大小小贯穿了近10个案例,只要你具备基础的HTML和JavaScript基础即可学习。

用Logisim搞定华科计组实验:单总线CPU设计从微程序到硬布线的保姆级通关攻略

本文详细介绍了如何使用Logisim完成华中科技大学计算机组成原理实验中的单总线CPU设计,涵盖从微程序控制器到硬布线控制器的完整实现过程。通过MIPS指令译码器设计、微程序控制原理、状态机实现等关键步骤的保姆级教程,帮助学生掌握CPU设计的核心技能,并提供Educoder平台提交与调试的实用技巧。

weixin_30897233的博客 478

绘图框架(relation-graph、jsPlumb、mxGraph、GoJS、Vis.js)

绘图框架(relation-graph、jsPlumb、mxGraph、GoJS)

qq_40407998的博客 1508

基于企业微信客服与GPT-3构建合规微信AI助手:从原理到部署实践

在人工智能与即时通讯融合的浪潮中,自然语言处理(NLP)与API集成成为构建智能对话系统的核心技术。其原理在于通过API网关接收用户输入,调用云端大语言模型进行处理,再将结果返回给用户,实现自动化交互。这项技术的核心价值在于将前沿AI能力无缝嵌入到日常高频应用场景中,极大地提升了客服自动化、智能问答与个性化服务的效率与体验。企业微信作为官方认可的企服平台,其开放的客服API接口为开发者提供了稳定、合规的消息通道,是连接微信生态与外部AI服务的理想桥梁。本文聚焦于如何利用企业微信客服API与OpenAI的GP

weixin_28727943的博客 628

反相器(inverter)和缓冲器(buffer)---附加与非门原理图

下面是对反相器(Inverter)和缓冲器(Buffer)从面积、驱动能力、时序等多个角度的详细对比,列出的是一般情况下的比较,具体情况可能会受到工艺节点、设计库和特定设计要求的影响。缓冲器(Buffer)是数字电路中常见的逻辑门之一,用于增强信号的驱动能力,而不改变信号的逻辑状态。如下图所示的CMOS反相器,由一个NMOS和PMOS组成,栅端gate相连作为输入端Vin,漏端相连作为输出端Vout,NMOS的源端接地,PMOS的源端接电源VDD.与反相器不同,缓冲器的输出与输入保持相同的逻辑状态。

hzmscut的博客 1万+

9款网页绘图javascript框架

向大家推荐9款很棒的可在网页中绘制图表的JavaScript脚本,这些有趣的JS脚本可以帮助你快速方便的绘制图表(线、面、饼、条…),其中包括jQuery、MooTools、Prototype和一些其它的JavaScript框架。 1.FlotFlot是基于jQuery框架绘制图表的纯Javascript框架。它可在客户端即时绘制并生成各种图形。重要的是它使用简

路向何方 2158

【博弈论】势博弈(potential game)、EPG以及最佳响应、Nash均衡和帕累托(pareto)最优的理解

文章目录前言一、Potential game二、Nash均衡和Pareto-optimal(帕累托最优)1.Nash 均衡2.Pareto最优三、Best response(最佳响应)四、Exact potential game(EPG)1.合作-傀儡博弈2.合作博弈3.傀儡博弈4.自激博弈5.双边对称交互博弈使用理解 前言 本文主要详细讲解potential game的概念以及Exact potential game 的定义和分类,以及这么博弈方法是如何在论文中引入并使用的,本文仅是对自己在该模块

weixin_44535200的博客 2万+

9个基于JavaScript和CSS的Web图表框架

"jQuery, MooTools, Prototype 等优秀的 JavaScript 框架拥有各种强大的功能,包括绘制 Web 图表,使用这些框架以及相应插件,我们可以非常轻松地实现曲线图,圆饼图,柱状图等 Web 图表的绘制,而不必象以往那样通过复杂的 Flash 技术实现。本文介绍了9个优秀的基于 JavaScript 与 CSS 的 Web 图表框架(图文版 )。 " ...

xiaofengtoo的专栏 175

医疗影像配准与融合: 使用MATLAB对医学影像进行配准和融合,实现不同影像模态之间的对准和结构信息融合等

医疗影像配准与融合是医学影像处理的重要技术,它用于将不同来源、不同时间或不同模态的医学影像进行配准和融合,以获得更加完整、准确的患者解剖信息。基于MATLAB的医疗影像配准与融合可以帮助医生更准确地诊断疾病,制定更有效的治疗方案。医疗影像配准与融合是医学影像处理的关键技术,它对于提高医学影像诊断和治疗的准确性至关重要。MATLAB是一种功能强大的数学和科学计算软件,它可以为医疗影像配准与融合提供强大的工具和支持。

走向CTO的路上... 716

XDMA流传输模式

XDMA 流传输模式(Streaming DMA)​ 是 Xilinx FPGA 通过 PCIe 与主机进行 ​实时流式数据传输 的核心机制,

浩瀚之水的专栏 3436
上一篇: Tim Berners-Lee 与早期的 Web
下一篇: PHP 开源 CMS 三剑客论剑 SXSW 展会
comsharp
博客等级 码龄20年 1475粉丝 41原创
评论 1
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值