现在位置首页 / 项目实战 /正文

fusioncharts 图片2种方式使用java导出

作者: IT小兵 | 2014年5月27日| 热度:℃ | 评论: |参与:

fusioncharts 图片2种方式导出:

百度网盘下载demo:

链接:http://pan.baidu.com/s/1jGGAOrO   密码:7a6y 

提供服务器保存 和 客户端保存 

test.jsp 和 test.html是客户端保存

index.jsp是服务器端保存(请参见fusioncharts_export.properties)

请在服务端运行程序!!切记


代码:

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
request.setAttribute("basePath",basePath);
%>
<html>
<head>
<script type="text/javascript" src = "js/FusionCharts.js"></script>
	<script type="text/javascript" src = "js/FusionChartsExportComponent.js"></script>
</head>
<body bgcolor="#ffffff">
<div id="chartdiv" align="center">The chart will appear within this DIV. This text will be replaced by the chart.</div>
<script type="text/javascript">
//Create the chart.
//Note that you necessarily need to set the registerWithJS attribute as 1, as JavaScript is used for client-
//side communication between the chart and FusionCharts Exporter Component.
var myChart = new FusionCharts("flashChart/Column3D.swf", "myChartId", "500", "300", "0", "1");
myChart.setXMLUrl("SimpleExample.xml");
myChart.render("chartdiv");
</script>
<!-- We also create a DIV to contain the FusionCharts client-side exporter component -->
<div id="fcexpDiv" align="center">FusionCharts Export Handler Component</div>
<script type="text/javascript">
//Render the export component in this
//Note: fcExporter1 is the DOM ID of the DIV and should be specified as value of exportHandler
//attribute of chart XML.
var myExportComponent = new FusionChartsExportObject("fcExporter1", "flashChart/FCExporter.swf");
//Render the exporter SWF in our DIV fcexpDiv
myExportComponent.Render("fcexpDiv");
</script>
</body>
</html>
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
request.setAttribute("basePath",basePath);
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'index.jsp' starting page</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
	<script type="text/javascript" src = "${basePath}/js/FusionCharts.js"></script>
	<script type="text/javascript" src = "${basepath}/js/FusionChartsExportComponent.js"></script>
	<script type="text/javascript">
	function FC_Exported(objRtn)
	{     
       if(objRtn.statusCode=="1")
       {   
          alert("The chart with DOM Id " + objRtn.DOMId + " was successfully saved on server. The file can be accessed from" + objRtn.fileName);   
	   }
	   else
	   {   
	       alert("The chart with DOM Id " + objRtn.DOMId + " could not be saved on server. There was an error. Description : " + objRtn.statusMessage);   
	   }   
	}   
	//导出图片调用的方法   
	function startExport()
	{  
	     var chart = getChartFromId("myFusionExport");   //生成的FusionCharts图表本身的标识
	     if (chart.hasRendered())
	     {   
             chart.exportChart();   
	     }
	     else
	     {   
	         alert("Please wait for the chart to finish rendering, before you can invoke exporting");   
	     }
	}
	function showFusionCharts()
	{    
       var xmlData = "<chart palette='2' caption='按地市统计报表-不达标数' xAxisName='地市' "
                   + "yAxisName='' showToolTip='0' showValues='1' "
                   + "formatNumberScale='0' rotateNames='0' decimals='0' "
                   + "useRoundEdges='1' exportEnabled='1' exportAtClient='0' "  
                   + "exportAction='save' exportFileName='test' " 
	               + "exportDialogMessage='正在导出,请稍候...' " 
                   + "exportHandler='FCExporter'"
                   + "exportShowMenuItem='1'> " +   
                   + "<set name='Jan' value='462' color='AFD8F8' /> " 
                   + "<set name='Feb' value='857' color='F6BD0F' /> " 
                   + "<set name='Mar' value='671' color='8BBA00' /> " 
                   + "</chart>";   
        var chart = new FusionCharts("${basePath}/flashChart/Column3D.swf", "myFusionExport", "450", "280", "0", "0");   
        chart.setDataXML(xmlData);   
	    chart.render("myFusion");  //放置图表的DIV的ID   
	 }		
	</script>
  </head>
  <body>
  	 <input type='button' value='生成FusionCharts图表' onClick="javascript:showFusionCharts();" />  
     <input type='button' value='导出FusionCharts图片' onClick="javascript:startExport();"/>
     <div id="myFusion"></div>  
  </body>
</html>


点击阅读本文所属分类的更多文章: 项目实战 。和高手一起交流:346717337
友荐云推荐

未注明转发、原文均为本站原创。分享本文请注明 原文链接

给您更多信息和帮助

在这里您可以找到更多:

技术交流群:346717337 Jquery插件交流

投稿:suchso@vip.qq.com

承接:企业网站门户/微网站/微商城/CMS系统/微信公众号运营/业务咨询

抢天猫双11红包
推荐使用阿里云服务器
echarts教程系列
本月最热文章

微信扫一扫,徜徉悠嘻网,您的休闲乐园

微信公众号:快乐每一天

随机文章
标签

技术交流群:346717337

投稿:suchso@vip.qq.com

专业专注:企业网站门户/微网站/微商城/CMS系统/微信公众号运营/付费问题咨询