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. DevExpress之列表控件

    listBoxControl和checkedListBoxControl 常用属性 DataSource---------数据源 DisplayMember-----默认显示成员 这两个属性是list ...

  2. Verilog之i2c合约

    说明:i2c乔布斯.有这么多的事情在网上参考. 时刻:2014年5一个月6周二星期 1.问题叙述性说明: 正如图.已知的时钟clk为100k,rst为复位信号.上升沿有效,基于Verilog HDL或 ...

  3. uva 11825 Hackers&#39; Crackdown (状压dp,子集枚举)

    题目链接:uva 11825 题意: 你是一个黑客,侵入了n台计算机(每台计算机有同样的n种服务),对每台计算机,你能够选择终止一项服务,则他与其相邻的这项服务都终止.你的目标是让很多其它的服务瘫痪( ...

  4. SEOer怎样安排一天的工作

    昨天一文谈到seo车型优化恐惧了,一些兄弟果断说,不玩seo.妮子不是吓人的,希望大家好好看清自己如今行业现状,怎样突破下步,如今仅仅剩下竞价和B2B付费平台了吗?每天坚持博客更新,尽管不像那些名博那 ...

  5. C复习手记(Day2)

    1.共用体 共用体是一种特殊的结构,允许在相同的位置存储不同的数据类型.可以定义一个带有多成员的共同体,但是任何时候只能有一个成员带有值. 定义共用体: union Data { int i; flo ...

  6. XAML 命名空间和命名空间映射

    本主题将介绍大部分 XAML 文件的根元素中存在的 XML/XAML 命名空间 (xmlns) 映射.它还将介绍如何为自定义类型和程序集生成类似的映射. XAML 命名空间如何与代码定义和类型库相关 ...

  7. The type or namespace name 'Script' does not exist in the namespace 'System.Web' (are you missing an assembly reference?)

    应该说是 .net4 的bug,没有所谓的 System.Web.Extensions.dll 库文件,需要将项目的 Target Framework修改为 3.5版本,才能加载System.Web. ...

  8. FeatureClass对象

    概述: 在讲述FeatureClass对象之前,首先说明与FeatureClass对象相关的对象: Table对象,是不具有空间信息的二维表,是一张仅能在ArcMap的Table Of Content ...

  9. Android小试牛刀之遇到的问题

    1.运行出错 创建项目时没有使用Empty Activity,创建. 2.创建第一个工程 选择Empty Activity才会自动创建Hello Word代码块 3.appcompat_v7的说明 在 ...

  10. 使用Jquery解决Asp.Net中下拉列表值改变后访问服务器刷新界面。

    使用DropDownList控件时,改变选项时,获取服务端数据库数据并刷新界面数据. 1. 绑定DropDownList控件SelectedIndexChanged事件. 2. AutoPortBac ...