jquery.flot.js简介
Flot是一个Jquery下图表插件,具有简单使用,交互效果,具有吸引力外观特点。目前支持 Internet Explorer 6+, Chrome, Firefox 2+, Safari 3+ and Opera 9.5+ 等浏览器,是一个基于Javascript和Jquery纯客端户的脚本库,下面看一个简单的示例,先插入js:
<script language="javascript" type="text/javascript" src="../jquery.js"></script>
<script language="javascript" type="text/javascript" src="../jquery.flot.js"></script>
如果要支持IE9以下的浏览器,您需要使用Excanvas, 一个canvas 模拟器,所以还需要加入这段标签:
<!--[if lte IE 8]><script language="javascript" type="text/javascript" src="excanvas.min.js"></script><![endif]-->
然后放置一个DIV:
<div id="placeholder" style="width:600px;height:300px;"></div>
接着Data:
<script type="text/javascript">
$(function () {
var d1 = [];
for (var i = 0; i < 14; i += 0.5)
d1.push([i, Math.sin(i)]);
var d2 = [[0, 3], [4, 8], [8, 5], [9, 13]];
// a null signifies separate line segments
var d3 = [[0, 12], [7, 12], null, [7, 2.5], [12, 2.5]];
$.plot($("#placeholder"), [ d1, d2, d3 ]);
});
</script>
打开页面你就能看到这样的效果了:
这是一个简单的示例,它的特色之一是支持Ajax动态显示,请查看官方的示例,支持JSON的数据格式。同样,它也是开源的,您可以在这儿找到它的源代码
希望对您Web开发有帮助。
jquery.flot.js简介的更多相关文章
- jQuery遮罩插件jQuery.blockUI.js简介
利用Jquery.blockui.js创建可拖动.自定义内容的弹出层 利用Jquery.blockui.js创建可拖动.自定义内容的弹出层 目标 : 1 . 弹出层的内容可以自定义任意的HTML元素 ...
- jquery.peity.js简介
jQuery简单图表peity.js <html xmlns="http://www.w3.org/1999/xhtml"> <head> <titl ...
- jquery.easypiechart.js简介
此插件主要是用来统计新的访问.跳出率.服务器负载.使用的RAM等,功能很强大,带有HTML5的动画效果,效果非常炫,看效果吧easyPieChart一款新型的EASY饼图数据统计Jquery插件截图: ...
- jquery.sparkline.js简介
jQuery线状图插件Sparkline 官网地址:http://omnipotent.net/jquery.sparkline/ 文档地址:http://omnipotent.net/jquery. ...
- jquery.gritter.js简介
Gritter 是一个小型的 jQuery 消息通知插件,通知效果如下图所示: 参考网
- jQuery.Flot开发手记
目录 介绍 使用 自定义参数 自定义图例 自定义坐标 自定义数据序列 自定义网格 其他 鼠标停留在图表节点时显示tooltip 介绍 项目地址:http://www.flotcharts.org/ A ...
- flot - jQuery 图表插件(jquery.flot)使用
Flot是纯Javascript实现的基于jQuery的图表插件,主要支持线状图和柱状图的绘制(通过插件也可以支持饼状图). 特别注意Flot使用的是UTC时间,最好修改flot.js去掉所有的UTC ...
- 当 jquery.unobtrusive-ajax.js 遇上Web API
最近在熟悉Abp框架,其基于DDD领域驱动设计...前段可以绕过mvc直接调用根据app层动态生成的webapi,有点神奇~,Web API之前有简单接触过,WCF的轻量级版,一般用于做一写开发性的服 ...
- Vue.js简介
Vue.js简介 Vue.js的作者为Evan You(尤雨溪),任职于Google Creative Lab,虽然是Vue是一个个人项目,但在发展前景上个人认为绝不输于Google的AngularJ ...
随机推荐
- Swing用户界面开发工具包开发记录
Swing是一个用于开发Java应用程序用户界面的开发工具包. 以抽象窗口工具包(AWT)为基础使跨平台应用程序可以使用任何可插拔的外观风格. Swing开发人员只用很少的代码就可以利用Swing丰富 ...
- 九章算法:BAT国内班 - 课程大纲
第1章 国内笔试面试风格及准备方法 --- 分享面试经验,通过例题分析国内面试的风格及准备方法 · 1) C/C++部分: 实现 memcpy 函数 STL 中 vector 的实现原理 · 2)概率 ...
- Ubuntu 12.04安装Java开发环境(jdk1.7 + Eclipse)
首先,去官网下载linux版本的jdk和eclipse tar包,并将其解压出来.我将jdk包发在了/usr/java/目录下,eclipse放在了/opt/目录下. 然后,配置java开发环境,即安 ...
- Cisco交换机配置VLAN
Cisco IOS中有两种方式创建vlan,在全局模式下使用vlan vlanid命令,如switch(config)#vlan 10; 在vlan database 下创建vlan ,如 switc ...
- ISAPI和CGI限制中没有ASP.NET v4.0 ; vS2013检测到在集成的托管管道模式下不适用的 ASP.NET 设置。
统确实自带了ASP.NET v4.0,但是ISAPI中没有这个选项,导致服务器开不起来 解决方法如下: 1.确保安装IIS时确实安装了ASP.NET,如果没有的话,勾上重新装一下,一般出现404.2时 ...
- LVS 实现负载均衡原理及安装配置详解
负载均衡集群是 load balance 集群的简写,翻译成中文就是负载均衡集群.常用的负载均衡开源软件有nginx.lvs.haproxy,商业的硬件负载均衡设备F5.Netscale.这里主要是学 ...
- linux stat 命令查看文件信息
在Linux中,没有文件创建时间的概念.只有文件的访问时间.修改时间.状态改变时间.也就是说不能知道文件的创建时间.但如果文件创建后就没有修改过,修改时间=创建时间;如果文件创建后,状态就没有改变过, ...
- opengl deferred shading
原文地址:http://www.verydemo.com/demo_c284_i6147.html 一.Deferred shading技术简介 Deferred shading是这样一种技术:将光照 ...
- android 自己定义TextView"会发脾气的TextView"
转载请注明出处王亟亟的大牛路 Git上看到的一个自己定义控件就搞来研究研究.蛮可爱的. 项目结构: 执行效果:非常Q谈.谈的图片什么都 都能够换哦 自己定义View: public class Jel ...
- Javascript实例教程:querySelector()方法接受一个CSS查询并返回匹配模式的第一个子孙元素,如果没有匹配的元素则返回null。
文章简介:querySelector()方法接受一个CSS查询并返回匹配模式的第一个子孙元素,如果没有匹配的元素则返回null. querySelector()方法接受一个CSS查询并返回匹配模式的第 ...