`

funsionCharts jQuery

阅读更多

<script type="text/javascript" src="http://libs.baidu.com/jquery/1.8.3/jquery.js"></script>

<script type="text/javascript" src="http://libs.baidu.com/underscore/1.3.3/underscore.js"></script>

如果要使用返回funsionCharts 使用的json数据需添加jquery.xml2json.js

/*
 * fusionChart 自动拼接XML
 * autor  
 * Date 2013年12月27日
 */


(function($) {
	$._NH_Chart = function(option) {
		var settings = {
			datas: [], //数据
			chart: "", //
			other: "", //sytle等其他xml配置
			series: [], //图例--默认自动加载
			cate: [], // 描述--默认自动加载
			color: [], //颜色不带#的颜色值
			isSliced: [], //饼图哪个切片分开[0,1......]   //单系列使用
			link: "", //添加click钻取功能
			dataFormat: "xml", //返回的数据格式,xml返回xml,json返回json默认xml
			chartType: "Single", //报表的类型  Single 单系列 Multi 多系列,Point 为散点图
			num: "999", //柱形折线组合图,默认柱形图,当值小于图例数,则显示折线,多系列图中使用
			fn_Color: "", //通过阀值控制颜色   //单系列使用
			setPro: "" //dataset中的样式
		};
		option = option || {};
		options = $.extend(true, settings, option);
		return $._NH_Chart.init(options);
	};
	$.extend($._NH_Chart, {
		init: function(options) {
			var data;
			switch (options.chartType) {
				case "Single":
					data = $._NH_Chart.fitSingleChart(options);
					break;
				case "Multi":
					data = $._NH_Chart.fitMultiChart(options)
					break;
				case "Point":
					data = $._NH_Chart.fitPointChart(options);
					break;
				default:
					break;
			}
			if (options.dataFormat === "json") {
				data = "<xml>" + data + "</xml>";
				data = $.xml2json(data)
			}
			return data;
		},
		fitSingleChart: function(opts) {
			var xml = "<chart " + opts.chart + ">\n";
			_.each(opts.datas, function(item, index) {
				var mapData = _.map(item, function(value, key) {
					return value;
				});
				xml += "<set label='" + mapData[0] + "' value='" + mapData[1] + "'";
				if (_.contains(opts.isSliced, index)) {
					xml += " isSliced='1'";
				}
				if (opts.color.length > 0) {
					xml += " color='" + opts.color[index] + "'"
				}
				if (typeof opts.fn_Color === "function") {
					xml += " color='" + opts.fn_Color(mapData[1]) + "'"
				}
				if (opts.link != "") {
					xml += " link='javascript:" + opts.link + "(\"" + mapData[0] + "\",\"" + mapData[1] + "\")'";
				}
				xml += " />\n";
			});
			xml += opts.other + "</chart>";
			return xml;
		},
		fitMultiChart: function(opts) {
			var xml = "<chart  " + opts.chart + "";
			xml += "legendBorderThickness='0'  legendBorderAlpha='0' legendShadow='0' showLegend='1' legendBgColor='072e4f'";
			xml += "divLineIsDashed='1' divLineThickness='5' formatNumberScale='0' unescapeLinks='0'";
			xml += ">\n";
			var categories = [];
			var seriesNames = [];
			//循环去重
			_.each(opts.datas, function(item) {
				var mapData = _.map(item, function(value, key) {
					return value;
				});
				if (!_.contains(categories, mapData[1])) {
					categories.push(mapData[1]);
				}
				if (!_.contains(seriesNames, mapData[0])) {
					seriesNames.push(mapData[0]);
				}
			});
			//自定义图例和 label
			if ("object" == typeof opts.series && opts.series.length > 0) {
				seriesNames = opts.series;
			}
			if ("object" == typeof opts.cate && opts.cate.length > 0) {
				categories = opts.cate;
			}

			xml += "<categories>\n";
			_.each(categories, function(category) {
				xml += "<category label = '" + category + "' />\n"
			});
			xml += "</categories>\n";

			_.each(seriesNames, function(seriesName, index) {
				if (index < opts.num) {
					xml += "<dataset color='" + opts.color[index] + "' seriesName='" + seriesName + "' showValues='0'>\n";
					_.each(categories, function(category) {
						var flag = 0;
						_.each(opts.datas, function(item) {
							var dataEach = _.map(item, function(value, key) {
								return value;
							});
							if (dataEach[0] == seriesName && dataEach[1] == category) {
								if (options.link != '') {
									xml += "<set value='" + dataEach[2] + "' link='javascript:" + opts.link + "(\"" + dataEach[0] + "\",\"" + dataEach[1] + "\",\"" + dataEach[2] + "\")'  />\n";
								} else {
									xml += "<set value='" + dataEach[2] + "'  />\n";
								}
								flag = 1;
							}
						});
						if (flag == 0) {
							xml += "<set />";
						}
					});
					xml += "</dataset>\n";
				} else {
					xml += "<dataset color='" + opts.color[index] + "' seriesName='" + seriesName + "' showValues='0' renderAs='Line'>\n";
					_.each(categories, function(category) {
						var flag = 0;
						_.each(opts.datas, function(item) {
							var dataEach = _.map(item, function(value, key) {
								return value;
							});
							if (dataEach[0] == seriesName && dataEach[1] == category) {
								xml += "<set value='" + dataEach[2] + "'/>\n";
								flag = 1;
							}
						});
						if (flag == 0) {
							xml += "<set />";
						}
					});
					xml += "</dataset>\n";
				}
			});
			xml += opts.other + "\n</chart>";
			return xml;
		},
		fitPointChart: function(opts) {


		}
	});
})(jQuery);

 暂时完成单系列和多系列的

 

分享到:
评论

相关推荐

    S变换+Sockwell R G , Mansinha L , Lowe R P . Localization of the complex spectrum: the S transformJ

    s变换用的高斯窗函数( 高斯窗是指数窗的一种,它也无负的旁瓣,而且没有旁瓣波动,因而不回引起计算谱中假的极大值或极小值,而且高斯窗频率窗函数的主瓣比指数窗的主瓣窄,分辨率比指数窗有所提高。

    2021科大讯飞车辆贷违预测大赛冠军源码+全部资料.zip

    2021科大讯飞车辆贷违预测大赛冠军源码+全部资料.zip [资源说明] 1、该项目是团队成员近期最新开发,代码完整,资料齐全,含设计文档等 2、上传的项目源码经过严格测试,功能完善且能正常运行,请放心下载使用! 3、本项目适合计算机相关专业(人工智能、通信工程、自动化、电子信息、物联网等)的高校学生、教师、科研工作者、行业从业者下载使用,可借鉴学习,也可直接作为毕业设计、课程设计、作业、项目初期立项演示等,也适合小白学习进阶,遇到问题不懂就问,欢迎交流。 4、如果基础还行,可以在此代码基础上进行修改,以实现其他功能,也可直接用于毕设、课设、作业等。 5、不懂配置和运行,可远程教学 欢迎下载,学习使用!

    AI图像处理工具包-一键抠图、背景切换、旧照片修复、人像漫画化、视频卡通化(Python+OpenCV+Dlib+TensorFlow).zip

    AI图像处理工具包-一键抠图、背景切换、旧照片修复、人像漫画化、视频卡通化(Python+OpenCV+Dlib+TensorFlow).zip [资源说明] 1、该项目是团队成员近期最新开发,代码完整,资料齐全,含设计文档等 2、上传的项目源码经过严格测试,功能完善且能正常运行,请放心下载使用! 3、本项目适合计算机相关专业(人工智能、通信工程、自动化、电子信息、物联网等)的高校学生、教师、科研工作者、行业从业者下载使用,可借鉴学习,也可直接作为毕业设计、课程设计、作业、项目初期立项演示等,也适合小白学习进阶,遇到问题不懂就问,欢迎交流。 4、如果基础还行,可以在此代码基础上进行修改,以实现其他功能,也可直接用于毕设、课设、作业等。 5、不懂配置和运行,可远程教学 欢迎下载,学习使用!

    基于java+springboot+vue+mysql的远程教育网站设计与实现.docx

    基于java+springboot+vue+mysql的远程教育网站设计与实现.docx

    springboot005学生心理咨询评估系统(源码+数据库+论文+PPT+包调试+一对一指导)

    毕业设计资料,计算机毕业设计,源码,毕业论文,毕业答辩,答辩PPT,Java毕业设计,php毕业设计,ASP.NET毕业设计,毕业指导,计算机作业,php作业,java作业,ASP.NET作业,编程作业,管理系统,网站,app,毕业设计学习,Java学习,php学习,ASP.NET学习,java课程,php课程,ASP.NET课程,答辩技巧,SQLSERVER数据库,Mysql数据库,jdbc,SSM框架,SpringBoot框架,Html5,小程序

    蓝牙串口助手,可以连接HC-05等蓝牙模块,实现单片机设备与手机通讯,安卓手机,蓝牙调试助手,具有按键功能!

    蓝牙串口助手,可以连接HC-05等蓝牙模块,实现单片机设备与手机通讯,安卓手机,蓝牙调试助手,具有按键功能!

    TriLib-2-Model-Loading-Package-2.3.7.unitypackage

    TriLib 2 是一个跨平台的运行时 3D 模型导入器

    “人力资源+大数据+薪酬报告+涨薪调薪”

    人力资源+大数据+薪酬报告+涨薪调薪,在学习、工作生活中,越来越多的事务都会使用到报告,通常情况下,报告的内容含量大、篇幅较长。那么什么样的薪酬报告才是有效的呢?以下是小编精心整理的调薪申请报告,欢迎大家分享。相信老板看到这样的报告,一定会考虑涨薪的哦。

Global site tag (gtag.js) - Google Analytics