fusioncharts入门系列5之renderer参数

最新推荐文章于 2020-11-20 12:20:54 发布

daxiang12092205

最新推荐文章于 2020-11-20 12:20:54 发布

阅读量3.1k

点赞数

分类专栏：前端文章标签： fusioncharts renderer 滚轮无效 insertfusioncharts setCurrentRenderer

本文链接：https://blog.csdn.net/daxiang12092205/article/details/17711763

版权

前端专栏收录该内容

44 篇文章 0 订阅

订阅专栏

问题：鼠标移到圆形图上方时，滚轮失效，ie8 chrome下均存在该问题，问了下朋友，原来是fusioncharts的一个bug。

解决方法：设置图表渲染参数renderer为javascript，不使用flash进行渲染。

问题产生原因：未知，有了解的朋友，欢迎留言。

注：使用默认样式进行渲染时，flash与javascript渲染效果略有差异，如图表标题字体类型等。

代码：

<!DOCTYPE html>
<html>
<head>

</head>
<body>
	<div id="mychart1"></div>
	<div id="mychart2"></div>
</body>
	<script type="text/javascript" src="../common/js/jquery-1.9.1.min.js"></script>
	<script type="text/javascript" src="../common/js/json2.js"></script>
	<script type="text/javascript" src="../component/fusioncharts/FusionCharts.js"></script>
	<script type="text/javascript" src="../component/fusioncharts/jquery-fusionCharts.js"></script>
	<script type="text/javascript">
		var jsonCircleStr = '{' +
			'"chart":{' +
				'"caption"				:"",' +
				'"xAxisName"			:"",' +
				'"yAxisName"			:"",' +
				'"animation"			:"1",' +
				'"palette"				:"2",' +
				'"bgColor"				:"FFFFFF",' +
				'"placeValuesInside"	:"1"' +
			'},"data":[]' +
		'}';
		$(document).ready(function(){
			var jsondata = JSON.parse(jsonCircleStr);
			var elemset = {"label":"aa","value":10};
			jsondata.data.push(elemset);
			elemset = {"label":"bb","value":20};
			jsondata.data.push(elemset);
			var prefix = "../component/fusioncharts/";

			/*
			 * 使用setCurrentRenderer实现
			 * 注setCurrentRenderer为静态方法，不能写为chart.setCurrentRenderer()，报js错误
			 */
			FusionCharts.setCurrentRenderer("javascript");
			var chart = new FusionCharts(prefix+"Pie2D.swf", new Date().getTime(),"500","500","0","1");
			chart.setJSONData(jsondata);
			chart.render("mychart1");

			/*
			 * 使用insertFusionCharts()实现，直接设置参数renderer为javascript
			 */
			$("#mychart2").empty().insertFusionCharts({
				// 图表类型设置的两种方法
				//swfUrl	: prefix + "Pie2D.swf",
				type		: "Pie2D",
				dataSource	: jsondata,
				dataFormat	: "json",
				width		: "500",
				height		: "500",
				renderer	: "javascript",
				id			: new Date().getTime()+1});
		});

	</script>
</html>

daxiang12092205

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
3
评论
fusioncharts入门系列5之renderer参数

问题：鼠标移到圆形图上方时，滚轮失效，ie8 chrome下均存在该问题，问了下朋友，原来是fusioncharts的一个bug。解决方法：设置图表渲染参数renderer为javascript，不使用flash进行渲染。问题产生原因：未知，有了解的朋友，欢迎留言。注：使用默认样式进行渲染时，flash与javascript渲染效果略有差异，如图表标题字体类型等。代码：
复制链接

扫一扫