jquery.tochart.js
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的更多相关文章
- jquery和Js的区别和基础操作
jqery的语法和js的语法一样,算是把js升级了一下,这两种语法可以一起使用,只不过是用jqery更加方便 一个页面想要使用jqery的话,先要引入一下jqery包,jqery包从网上下一个就可以, ...
- jQuery.template.js 简单使用
之前看了一篇文章<我们为什么要尝试前后端分离>,深有同感,并有了下面的评论: 我最近也和前端同事在讨论这个问题,比如有时候前端写好页面给后端了,然后后端把这些页面拆分成很多的 views, ...
- 修改 jquery.validate.js 支持非form标签
尝试使用markdown来写一篇blog,啦啦啦 源代码传送门:github 在特殊情况下我们使用jquery.validate.js对用户输入的内容做验证的时候,表单并不是一定包含在form之中,有 ...
- 表单验证插件之jquery.validate.js
提到表单验证的插件,第一个想到的就是jquery.validate.js,所以小生想在这里稍微详细地说一下这款插件的具体使用方法,便于理解,我直接附上整段demo的代码(没怎么调样式,主要是看js): ...
- 延迟加载外部js文件,延迟加载图片(jquery.lazyload.js和echo,js)
js里一说到延迟加载,大都离不开两种情形,即外部Js文件的延迟加载,以及网页图片的延迟加载: 1.首先简单说一下js文件的3种延迟加载方式: (1)<script type="text ...
- 初探jquery.slimscroll.js和iscroll5.js
网上关于实现各种滚动效果的插件不胜枚举,这里,我简单介绍一下自己用过的两款比较有代表性的插件: 1.jquery.slimscroll.js,需要先引入jquery类库,主要用于模拟传统的浏览器滚动条 ...
- 动态生成二维码插件 jquery.qrcode.js
前段时间做项目,需要动态生成一个二维码,于是就在网上找了一下发现一个jquery插件jquery.qrcode.js,所以今天就简单说一下这个插件的使用: jquery.qrcode.js是依赖jqu ...
- Jquery客户端校验——jquery.validate.js
jQuery Validate 插件为表单提供了强大的验证功能,让客户端表单验证变得更简单,同时提供了大量的定制选项,满足应用程序各种需求.该插件捆绑了一套有用的验证方法,包括 URL 和电子邮件验证 ...
- 懒加载插件- jquery.lazyload.js
Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预 ...
随机推荐
- DevExpress之列表控件
listBoxControl和checkedListBoxControl 常用属性 DataSource---------数据源 DisplayMember-----默认显示成员 这两个属性是list ...
- Verilog之i2c合约
说明:i2c乔布斯.有这么多的事情在网上参考. 时刻:2014年5一个月6周二星期 1.问题叙述性说明: 正如图.已知的时钟clk为100k,rst为复位信号.上升沿有效,基于Verilog HDL或 ...
- uva 11825 Hackers' Crackdown (状压dp,子集枚举)
题目链接:uva 11825 题意: 你是一个黑客,侵入了n台计算机(每台计算机有同样的n种服务),对每台计算机,你能够选择终止一项服务,则他与其相邻的这项服务都终止.你的目标是让很多其它的服务瘫痪( ...
- SEOer怎样安排一天的工作
昨天一文谈到seo车型优化恐惧了,一些兄弟果断说,不玩seo.妮子不是吓人的,希望大家好好看清自己如今行业现状,怎样突破下步,如今仅仅剩下竞价和B2B付费平台了吗?每天坚持博客更新,尽管不像那些名博那 ...
- C复习手记(Day2)
1.共用体 共用体是一种特殊的结构,允许在相同的位置存储不同的数据类型.可以定义一个带有多成员的共同体,但是任何时候只能有一个成员带有值. 定义共用体: union Data { int i; flo ...
- XAML 命名空间和命名空间映射
本主题将介绍大部分 XAML 文件的根元素中存在的 XML/XAML 命名空间 (xmlns) 映射.它还将介绍如何为自定义类型和程序集生成类似的映射. XAML 命名空间如何与代码定义和类型库相关 ...
- 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. ...
- FeatureClass对象
概述: 在讲述FeatureClass对象之前,首先说明与FeatureClass对象相关的对象: Table对象,是不具有空间信息的二维表,是一张仅能在ArcMap的Table Of Content ...
- Android小试牛刀之遇到的问题
1.运行出错 创建项目时没有使用Empty Activity,创建. 2.创建第一个工程 选择Empty Activity才会自动创建Hello Word代码块 3.appcompat_v7的说明 在 ...
- 使用Jquery解决Asp.Net中下拉列表值改变后访问服务器刷新界面。
使用DropDownList控件时,改变选项时,获取服务端数据库数据并刷新界面数据. 1. 绑定DropDownList控件SelectedIndexChanged事件. 2. AutoPortBac ...