9款很棒的网页绘制图表JavaScript框架脚本

所属分类: 网页制作 / 应用技巧 阅读数: 1242
收藏 0 赞 0 分享

9款很棒的网页绘制图表JavaScript框架脚本

title

1.Flot

javascript-chart-01

Flot是基于 jQuery框架绘制图表的纯Javascript框架。它可在客户端即时绘制并生成各种图形。重要的是它使用简便(还有很多可选的设置)、吸引人的视觉 效果和交互功能,如图表缩放和鼠标跟踪等。该javascript框架适用于我们所熟知的 Internet Explorer 6/7/8, Firefox 2.x+, Safari 3.0+, Opera 9.5+ and Konqueror 4.x+浏览器。 查看图表样例

2.JS Charts

javascript-chart-02

JS Chart是需要一些简 单或无需手工书写编码的基于Javascript的免费图表生成器。使用JS Chart可以很简单很容易的完成你的生成图表任务,因为你只需要使用客户端脚本(即浏览器端),无需多余的插件或服务器端模块。你只需要准备好JS Chart脚本、包含图表数据的XML或Javascript数组,你的图表就准备就绪了。

3. TableToChart

javascript-chart-03

TableToChart 是基于MooTools JS框架的网页图表生成器,它通过包含在HTML table中的值来绘制图形图表。您可以使用Table标签来生成图表,条、线和饼都可以。

4.PlotKit

javascript-chart-04

PlotKit是一款绘制图表图形的Javascript框架。它支持HTML Canvas、基于Adobe SVG Viewer的SVG和本地浏览器。

5. Yahoo UI Charts Control

javascript-chart-051

YUI图表管理可以在网页中以垂直条、横条、线、饼等形式可视化呈现图表。主要特色包括支持DataSource、鼠标悬停数据提示、组合图表和皮肤功能。

6. ProtoChart

javascript-chart-061

ProtoChart是基于Prototype和Canvas可创建非常漂亮图表的开源框架。它支持线、条、饼、曲线、混杂(mix)、面图表等多种数据串联在统一图形中。它支持IE6/7, FF2/3 和 Safari 甚至可以在 iPhone上工作.

7. EJSChart

javascript-chart-07

EJSChart支持鼠标跟踪、鼠标事件、键盘跟踪和事件、缩放、滚动、十字线增加交互感并为网页图表的用户体验提升了一个档次。您可以选择多种图表类型:线、面、分散数据、饼和函数级数。图表的每个细节都可以自定制。

8.fgCharting

javascript-chart-08 

fgCharting是基于jQuery框架的简便图表生成器,它也支持各种图表类型并可以自定义参数。

9. 纯Css数据图表

javascript-chart-09

纯CSS代码实现的图表,怎么样,难以置信吧,想知道如何实现的吗?那就来看看这篇纯CSS制作图表的教程吧。

英文原文:Useful scripts to plot charts in web pages

更多精彩内容其他人还在看

网页设计技巧:iframe自适应高度的问题

所谓iframe自适应高度,就是,基于界面美观和交互的考虑,隐藏了iframe的border和scrollbar,让人看不出它是个iframe
收藏 0 赞 0 分享

网页色彩对比与调和技巧分享

在对比状态下,色彩相互作用与单一色彩所带给人的感觉不一样,这种现象是由视觉残影引起的。当我们长时间注视某一彩色图像之后,再看白色背景时,眼前会出现色相、明度关系大体相仿的补色图像
收藏 0 赞 0 分享

网页色彩性质的分类

任何颜色都可以使用三原色——红、绿、蓝组合而成,三原色中只有红色是暖色,所以要判断作品颜色的冷暖,可以依据红色成分的多少而定。色调主要由明度与彩度组合而成,用来表示颜色的状态
收藏 0 赞 0 分享

使用Photoshop 制作网页线框图简单实用

这篇文章向大家介绍一套免费的Photoshop 线框图套件,这个线框图套件中包括通知、图片和视频,表单字段,标题,段落,项目符号列表,导航,广告横幅和普通网站的元素,如:搜索框,电子邮件注册表单等等
收藏 0 赞 0 分享

CSS使用技巧总结

偶尔看到一篇CSS常用技巧的总结文章,本人整理了一下,晒出来和大家分享,希望可以帮助你们
收藏 0 赞 0 分享

Web设计师如何制作Retina显屏设备的图片

到目前为止,我们知道苹果设备中支持Retina屏幕技术的有“iPhone”、“iPod”、“iPad”和“Macbook Pro”,这些设备能为用户呈现更细腻、平滑和高质量的图片效果,提高了用户的视觉体验。做为一名Web设计师如何为你的网站创建这些适合Retina显屏设备的图片呢
收藏 0 赞 0 分享

JPG,GIF及PNG各类型的图片格式详细解说

大家都知道网页上面的图像一般用jpg、gif和png这几种格式,他们有什么区别以及在什么场合下使用进行详细介绍看了下面的内容后你可能会有了自己的结论
收藏 0 赞 0 分享

组件化的前端开发流程详细说明

做前端的同学都知道,做的页面多了,东西就会乱,因此我们需要统一一个开发流程,开发流程的好坏,直接影响着页面开发的效率,间接影响游戏的时间为了更好的开发,我们做了一下总结
收藏 0 赞 0 分享

我们在囧途之UI工程师职业感慨

我是一名还不算特别优秀的UI工程师;这个要先说明一下UI不是美工,美工是以图片方案设计为主的岗位,而UI是指用户交互体验的设计
收藏 0 赞 0 分享

分享8款提高网页设计出色的CSS工具

当一个人需要编辑或修改网站设计,CSS发挥着重要的作用;今天就给大家分享8款非常出色的CSS工具,这些工具都是很出名的,能够解决开发当中常见的棘手问题,希望对你开发有所帮助
收藏 0 赞 0 分享
查看更多