推荐一个很棒的JS绘图库Flot
Flot是Ole Laursen开发的基于JQuery的纯JavaScript实现的绘图库,Flot使用起来非常简单,绘图效果相当绚丽,而且还支持一些图片的操作功能,例如图片的缩放。可以看一下Flot的demo:

.gif)
绘制上面的图形所编写的JS也非常简单易读:
[code="js"]
<script language="javascript" type="text/javascript" id="source">
$(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]];
var d3 = [];
for (var i = 0; i < 14; i += 0.5)
d3.push([i, Math.cos(i)]);
var d4 = [];
for (var i = 0; i < 14; i += 0.5)
d4.push([i, Math.sqrt(i * 10)]);
var d5 = [];
for (var i = 0; i < 14; i += 0.5)
d5.push([i, Math.sqrt(i)]);
$.plot($("#placeholder"), [
{
data: d1,
lines: { show: true, fill: true }
},
{
data: d2,
bars: { show: true }
},
{
data: d3,
points: { show: true }
},
{
data: d4,
lines: { show: true }
},
{
data: d5,
lines: { show: true },
points: { show: true }
}
]);
});
</script>
[/code]
.gif)


.gif)
Flot的网站:
推荐一个很棒的JS绘图库Flot的更多相关文章
- 推荐一个很棒的开源工作流elsa-core
开源项目orchard主要开发人员Sipke Schoorstra 开源了一个netcore 工作流项目,地址:https://github.com/elsa-workflows/elsa-core, ...
- 国外大神制作的一个很棒的matplotlib 可视化教程
国外大神制作的一个很棒的matplotlib 可视化教程 参考:https://www.machinelearningplus.com/plots/top-50-matplotlib-visualiz ...
- vis.js绘图库的一个BUG以及源码修正
1. BUG 1.1 BUG触发情况 在使用vis.js绘图时,加入两个节点A和B之间既存在一条从A指向B的边,同时也存在一条从B指向A的边,那么这个绘图库就会崩溃. 1.2 BUG解析 vis.js ...
- Makefile经典教程(一个很棒很清晰的讲解)【转】
转自:https://blog.csdn.net/seven_amber/article/details/70216216 该篇文章为转载,是对原作者系列文章的总汇加上标注. 支持原创,请移步陈浩大神 ...
- 一些很棒的js代码
本来是想放在博客园首页的,貌似篇幅不够被移除掉了.后来慢慢补上,看这篇文章吧:一些优秀的代码分析与学习[持续更新],里面的内容会持续更新,这篇文章作废了 1.jQuery初始化代码段 技术亮点:jQu ...
- 推荐一个很好的富文本web编辑器UEditor
前天产品提了一个编辑器的bug,本人找是找到了问题的症结,就是不好改.框架是压缩兼混淆后的代码.查一下,好多年前的框架... 咨询了一个同事有关旧框架的事情,他也建议我升级编辑器并帮忙帮我找了UEdi ...
- 一个很好的JS,ASP二级下拉框联动。
在我们制作网站会员注册信息时,一般会涉及到填写自己所在省/市,如果用input或textarea做成填写形式不太理想.所以大部分网站都会选择联动下来列表形式,做起来也不算很复杂,同时看上去也很轻松. ...
- MD4C/CO46/MD04一个很棒的工单缺料分析
大家好~~~ 之前在MD04物料分析的时候,看到有订单预留,双击有个订单报告可以显示一个订单物料是否缺料清单 这个单独的工单分析可以在T-code:MD4C,CO46查看,如果只是单独的使用,那么这两 ...
- Linux 下一个很棒的命令行工具
导读 Taskwarrior 是 Ubuntu/Linux 下一个简单而直接的基于命令行的 TODO 工具.这个开源软件是我曾用过的最简单的基于命令行的工具之一.Taskwarrior 可以帮助你更好 ...
随机推荐
- Android ADB命令大全(通过ADB命令查看wifi密码、MAC地址、设备信息、操作文件、查看文件、日志信息、卸载、启动和安装APK等)
ADB很强大,记住一些ADB命令有助于提高工作效率. 获取序列号: adb get-serialno 查看连接计算机的设备: adb devices 重启机器: adb reboot 重启到bootl ...
- nginx: [emerg] getpwnam(“www”) failed
在配置nginx 时提示如下错误时:nginx: [emerg] getpwnam(“www”) failed 解决方案一 在nginx.conf中 把user nobody的注释去掉既可 解决方案二 ...
- TortoiseSVN中图标的含义
今天在使用svn时发现有好多不认识了,所以查了下svn帮助手册.借此总结了下 svn 中图标的含义 一个新检出的工作复本使用绿色的勾做重载.表示Subversion状态 正常. 在开始编辑一个文件后, ...
- macbook air电池保养方法
转自: http://bbs.feng.com/read-htm-tid-5819895.html http://www.zhihu.com/question/22628030
- ASP.NET MVC 的URL路由介绍
在这个教程中,向你介绍每个ASP.NET MVC一个重要的特点叫做URL路由.URL路由模块是负责映射从浏览器请求到特定的控制器动作. 在教程的第一部分,你将学习标准路由表如何映射到控制器的动作.在教 ...
- OpenStack
[官网]http://www.openstack.org/ [视频教程1]http://blog.csdn.net/u010973404/article/details/16841229 [视频教程2 ...
- 【JAVA、C++】LeetCode 011 Container With Most Water
Given n non-negative integers a1, a2, ..., an, where each represents a point at coordinate (i, ai). ...
- Android数据存储之sharedpreferences与Content Provider
android中对数据操作包含有: file, sqlite3, Preferences, ContectResolver与ContentProvider前三种数据操作方式都只是针对本应用内数据,程序 ...
- grep -C n "匹配字符串" 匹配字符串上下N行
[root@xxxxx ~]# grep -C 'ip_whitelist' /etc/gitlab/gitlab.rb # 'PATH' => "/opt/gitlab/bin:/o ...
- Js 正则表达式特殊字符含义
字符 匹配 \o null \t 制表符 \n 换行符 \v 垂直制表符 \f 换页符 \r 回车符 \xnn 由十六进制nn指定的拉丁字符 ...