var _jq, _hc;
var jqsrc = "http://code.jquery.com/jquery-1.7.min.js";
var hcsrc = "http://code.highcharts.com/highcharts.js"; function checkJquery() {
if(typeof(jQuery) == "function") {
window.clearInterval(_jq);
initHighcharts();
}
}
function checkHighcharts() {
if(typeof(jQuery("body").highcharts) == "function") {
window.clearInterval(_hc);
initTochart();
}
}
function initJquery() {
if(typeof(jQuery) != "function") {
var jq = document.createElement("script");
jq.type = "text/javascript";
jq.src = jqsrc;
document.body.appendChild(jq); _jq = window.setInterval(checkJquery, 500);
} else {
initHighcharts();
}
}
function initHighcharts() {
if(typeof(jQuery("body").highcharts) != "function") {
var hc = document.createElement("script");
hc.type = "text/javascript";
hc.src = hcsrc;
document.body.appendChild(hc); _hc = window.setInterval(checkHighcharts, 500);
} else {
initTochart();
}
}
function initTochart() {
jQuery.fn.tochart = function(options) {
var defaults = {x: 0, sort: null, include: [], exclude: []};
var opts = $.extend(defaults, options); var title = {}, rtitle = {};
jQuery.each(jQuery(this).find("tr:first").find("th"), function(i, o) {
title[i] = jQuery(o).text();
rtitle[jQuery(o).text()] = i;
}); var include = [], exclude = []; if(!opts.x) opts.x = 0;
else if(typeof(opts.x) == "string") opts.x = rtitle[opts.x] || 0;
else if(!typeof(opts.x) != "number") opts.x = 0; if(opts.include instanceof Array) {
for(var i = 0; i < opts.include.length; i++) {
var c = opts.include[i];
if(typeof(c) == "number") include.push(c);
else if(typeof(c) == "string" && rtitle[c] != undefined) include.push(rtitle[c]);
}
} if(opts.exclude instanceof Array) {
for(var i = 0; i < opts.exclude.length; i++) {
var c = opts.exclude[i];
if(typeof(c) == "number") exclude.push(c);
else if(typeof(c) == "string" && rtitle[c] != undefined) exclude.push(rtitle[c]);
}
} var rows = jQuery(this).find("tr");
if(typeof(opts.sort) == "boolean") {
rows.sort(function(a, b) {
return jQuery(a).find("td:eq(" + opts.x + ")").text().localeCompare(jQuery(b).find("td:eq(" + opts.x + ")").text()) * (opts.sort ? 1 : -1);
});
} var data = {};
jQuery.each(rows, function(i, o) {
jQuery.each(jQuery(o).find("td"), function(j, p) {
if(data[j] == undefined) {
data[j] = [];
}
if(j == opts.x) {
data[j].push(jQuery(p).text());
} else if(!isNaN(jQuery(p).text())) {
data[j].push(parseFloat(jQuery(p).text()));
} else {
data[j].push(0);
}
});
}); var ys = [];
for(var c in title) {
var i = parseInt(c);
if(i != opts.x && (include.length == 0 || include.indexOf(i) != -1) && (exclude.length == 0 || exclude.indexOf(i) == -1)) {
ys.push({name: title[i], data: data[i]});
}
} jQuery("body").append("<div id=\"__chart\" style=\"display: block;\"></div>");
jQuery("#__chart").highcharts({
title: {
text: ""
},
credits: {
enabled: false
},
xAxis: {
categories: data[opts.x]
},
series: ys,
tooltip: {
formatter: function() {
return this.x + "<br />" + this.series.name + ": " + this.y;
}
}
});
}
} initJquery();

用法: $('table').tochart({x:'日期',sort:true,exclude:['ID']})

jquery.tochart.js的更多相关文章

  1. jquery和Js的区别和基础操作

    jqery的语法和js的语法一样,算是把js升级了一下,这两种语法可以一起使用,只不过是用jqery更加方便 一个页面想要使用jqery的话,先要引入一下jqery包,jqery包从网上下一个就可以, ...

  2. jQuery.template.js 简单使用

    之前看了一篇文章<我们为什么要尝试前后端分离>,深有同感,并有了下面的评论: 我最近也和前端同事在讨论这个问题,比如有时候前端写好页面给后端了,然后后端把这些页面拆分成很多的 views, ...

  3. 修改 jquery.validate.js 支持非form标签

    尝试使用markdown来写一篇blog,啦啦啦 源代码传送门:github 在特殊情况下我们使用jquery.validate.js对用户输入的内容做验证的时候,表单并不是一定包含在form之中,有 ...

  4. 表单验证插件之jquery.validate.js

    提到表单验证的插件,第一个想到的就是jquery.validate.js,所以小生想在这里稍微详细地说一下这款插件的具体使用方法,便于理解,我直接附上整段demo的代码(没怎么调样式,主要是看js): ...

  5. 延迟加载外部js文件,延迟加载图片(jquery.lazyload.js和echo,js)

    js里一说到延迟加载,大都离不开两种情形,即外部Js文件的延迟加载,以及网页图片的延迟加载: 1.首先简单说一下js文件的3种延迟加载方式: (1)<script type="text ...

  6. 初探jquery.slimscroll.js和iscroll5.js

    网上关于实现各种滚动效果的插件不胜枚举,这里,我简单介绍一下自己用过的两款比较有代表性的插件: 1.jquery.slimscroll.js,需要先引入jquery类库,主要用于模拟传统的浏览器滚动条 ...

  7. 动态生成二维码插件 jquery.qrcode.js

    前段时间做项目,需要动态生成一个二维码,于是就在网上找了一下发现一个jquery插件jquery.qrcode.js,所以今天就简单说一下这个插件的使用: jquery.qrcode.js是依赖jqu ...

  8. Jquery客户端校验——jquery.validate.js

    jQuery Validate 插件为表单提供了强大的验证功能,让客户端表单验证变得更简单,同时提供了大量的定制选项,满足应用程序各种需求.该插件捆绑了一套有用的验证方法,包括 URL 和电子邮件验证 ...

  9. 懒加载插件- jquery.lazyload.js

    Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预 ...

随机推荐

  1. POJ 2449 Remmarguts' Date (SPFA + A星算法) - from lanshui_Yang

    题目大意:给你一个有向图,并给你三个数s.t 和 k ,让你求从点 s 到 点 t 的第 k 短的路径.如果第 k 短路不存在,则输出“-1” ,否则,输出第 k 短路的长度. 解题思路:这道题是一道 ...

  2. 福昕阅读器drm加密解密总结

    drm是数字版权保护的一种方式,前一段时间在做四川文轩数字图书馆项目的时候用到了相关的知识,感觉这东西对于一些在线阅读和视频播放还是有很大用处的. 对于其工作原理我也很好奇,先摘抄度娘的内容如下,当然 ...

  3. [Python爬虫笔记][随意找个博客入门(一)]

    [Python爬虫笔记][随意找个博客入门(一)] 标签(空格分隔): Python 爬虫 2016年暑假 来源博客:挣脱不足与蒙昧 1.简单的爬取特定url的html代码 import urllib ...

  4. MenuButton( 菜单按钮)

    一. 加载方式//class 加载方式<a href="javascript:void(0)" id="edit" class="easyui- ...

  5. (转)反射发送实战(-)InvokeMember

    反射是.net中的高级功能之一,利用反射可以实现许多以前看来匪夷所思的功能,下面是我看了<Programming C#>(O'Reilly)之后对于反射的一点实践,本想直接做个应用程序来说 ...

  6. 如何让MyEclispe中英文切换

    我们通过网上的一些汉化办法汉化了我们的MyEclipse,可是我们有时候想切回英文版怎么办? 方法一:我们可以通过修改MyEclipse配置文件的办法来从中文恢复到英文, -Duser.languag ...

  7. iOS ui界面vtf 开发

    addConstraints 添加约束的步奏 添加控件到view中 设置translateResizeLayoutintoautolayout = false 添加约束 注意 约束 : 出现 有父子关 ...

  8. jQuery 2.2 和 1.12 新版本发布

    新年新气象,jQuery 团队于昨日发布了两个新版本:1.12 和 2.2.这两个版本都包含了大量的Bug修正和功能改进.基本上这会是3.0之前最后一次发布.不过由于3.0不做向下兼容,所以届时 jQ ...

  9. 讨论一下PHP相关技能的层次

    1.PHP编程能力 由于PHP的入门较为简单,所以暂时只有熟悉和精通两个级别. 1.熟悉PHP:精通PHP语法,掌握常用的函数,熟悉PHP5下的OOP应用,这个是基础,也没什么好说的. 2.精通PHP ...

  10. python 微信推送模板消息

    #!/usr/bin/env python #-*- coding: utf-8 -*- import httplib import json import MySQLdb #从数据库中获取acces ...