`

使用XML/SWF charts 报表——解决“多层圆环图“的需求

 
阅读更多


粗糙使用XML/SWF charts进行报表

1、使用XML/SWF Charts

A）官方地址http://www.maani.us/xml_charts/index.php

B）学习材料：官方网站里面很详细，在左侧导航中“Reference”。

C）使用方式

       1、在“Download”目录下面下载最新版本：Download - XML/SWF Charts 5.120

       2、解压开来，拿出来这些文件，并把文件放置到项目对应文件夹中res/js 和 res/swf
                     1、charts.swf

              2、charts_library

              3、AC_RunActiveContent.js

                    4、sample.html

                    5、sample.xml

            3、将sample.html改成我们想要的名称，比如a.jsp（请注意划线部分）

<HTML>
<script language="javascript">AC_FL_RunContent = 0;</script>
<script language="javascript"> DetectFlashVer = 0; </script>
<script src="../res/js/AC_RunActiveContent.js" language="javascript"></script>
<script language="JavaScript" type="text/javascript">
<!--
var requiredMajorVersion = 10;
var requiredMinorVersion = 0;
var requiredRevision = 45;
-->
</script>
<head>
	<style type="text/css">
		.div1 {
			background-color: #000000;
			filter: alpha(opacity=10);
			-moz-opacity: 0.1;
			opacity: 0.1;
			width: 1000px;
			height: 400px;
			position: absolute;
			left: 30px;
			top: 20px;
			z-index: 2;
		}
		.div2 {
			position: absolute;
			left: 30px;
			top: 20px;
			z-index: 1;
		}
	</style>
</head>
<BODY>

<div class="div1">

</div>
<div class="div2">
<script language="JavaScript" type="text/javascript">
<!--
if (AC_FL_RunContent == 0 || DetectFlashVer == 0) {
	alert("This page requires AC_RunActiveContent.js");
} else {
	var hasRightVersion = DetectFlashVer(requiredMajorVersion, requiredMinorVersion, requiredRevision);
	if(hasRightVersion) { 
		AC_FL_RunContent(
			'codebase', '',
			'width', '400',
			'height', '250',
			'scale', 'noscale',
			'salign', 'TL',
			'bgcolor', '#777788',
			'wmode', 'opaque',
			'movie', '../res/swf/charts',
			'src', '../res/swf/charts',
			'FlashVars', 'library_path=../res/swf/charts_library&xml_source=../project/milepost!haha.action', 
			'id', 'my_chart',
			'name', 'my_chart',
			'menu', 'true',
			'allowFullScreen', 'true',
			'allowScriptAccess','always',
			'quality', 'high',
			'align', 'middle',
			'pluginspage', '',
			'play', 'true',
			'devicefont', 'false'
			); 
	} else { 
		var alternateContent = 'This content requires the Adobe Flash Player. '
		+ '<u>Get Flash</u>.';
		document.write(alternateContent); 
	}
}
// -->
</script>
<noscript>
	<P>This content requires JavaScript.</P>
</noscript>
</div>
</BODY>
</HTML>

 注意：跟我们的例子不同的地方有红色部分和深蓝色部分。红色部分是路径的修改，深蓝色部分是解决点击flash会连接到官网的一个办法。该办法即：层的覆盖。（这个是免费版的问题，除非破解，或者购买）

 

      

       4、调用struts2的action的haha方法

              在上面代码中可以发现，我们的xml_source对action同样有效。。（这方面参考官网：“ XML Source “）

'FlashVars', 'library_path=../res/swf/charts_library&xml_source=../project/milepost!haha.action',

         5、action中的haha方法

              这里的action方法，就是我们平常的struts2的一个方法，此方法返回到一个sample.jsp页面。其实返回的应该是xml格式的jsp。内容即官网例子中的sample.xml。

下面这个是“多层圆环图“的xml数据。具体的细节，参考官网。
<!--[if !supportLineBreakNewLine]-->

<chart>

	<chart_data>
		<row>
			<null/>
			<string></string>
			<string></string>
			<string></string>
			<string></string>
			<string></string>
			<string></string>
		</row>
		<row>
			<string>2007</string>
			<number tooltip='region A' line_color='eeffee' line_thickness='2' line_alpha='50'>75</number>
			<number tooltip='region B' line_color='eeffee' line_thickness='2' line_alpha='50'>25</number>
			<number tooltip='region C' line_color='eeffee' line_thickness='2' line_alpha='50'>10</number>
			<null/>
			<null/>
			<null/>
		</row>
		<row>
			<string>2008</string>
			<number tooltip='region A' line_color='eeffee' line_thickness='2' line_alpha='50'>35</number>
			<number tooltip='region B' line_color='eeffee' line_thickness='2' line_alpha='50'>10</number>
			<number tooltip='region C' line_color='eeffee' line_thickness='2' line_alpha='50'>20</number>
			<null/>
			<null/>
			<null/>
		</row>
		<row>
			<string>2009</string>
			<number tooltip='region A' line_color='eeffee' line_thickness='2' line_alpha='50'>10</number>
			<number tooltip='region B' line_color='eeffee' line_thickness='2' line_alpha='50'>25</number>
			<number tooltip='region C' line_color='eeffee' line_thickness='2' line_alpha='50'>10</number>
			<number tooltip='region D' line_color='eeffee' line_thickness='2' line_alpha='50'>10</number>
			<number tooltip='region E' line_color='eeffee' line_thickness='2' line_alpha='50'>10</number>
			<number tooltip='region F' line_color='eeffee' line_thickness='2' line_alpha='50'>10</number>
		</row>
	</chart_data>
	<chart_label shadow='low' color='000000' alpha='75' size='9' position='inside' as_percentage='true' />
	<chart_pref bevel='bg' select='true' empty_center='true' />
	<chart_type>donut</chart_type>

	<draw>
		<circle layer='background' x='250' y='157' radius='112' fill_color='eeffee' fill_alpha='100' line_thickness='0' bevel='bg' />
		<circle layer='background' x='250' y='157' radius='24' fill_color='eeffee' fill_alpha='100' line_thickness='0' shadow='inner' />
		<text shadow='high' x='-20' y='295' width='400' size='100' color='0' rotation='-90' alpha='5'>donut</text>	
	</draw>
	<filter>
		<shadow id='low' distance='2' angle='45' color='0' alpha='20' blurX='5' blurY='5' />
		<shadow id='high' distance='5' angle='90' color='0' alpha='50' blurX='10' blurY='10' />
		<shadow id='inner' distance='5' angle='45' color='0' alpha='30' blurX='10' blurY='10' inner='true' />
		<bevel id='bg' angle='45' blurX='35' blurY='35' distance='10' highlightColor='eeeeff' highlightAlpha='100' shadowColor='0' shadowAlpha='15' type='full' />
	</filter>
	
	<legend shadow='low' transition='dissolve' x='360' width='50' height='60' bevel='low' fill_alpha='0' line_alpha='0' bullet='line' size='12' alpha='75' />
	<tooltip color='000000' alpha='75' size='12' background_color_1='ffffff' background_color_2='ddeedd' background_alpha='85' shadow='low' />

</chart>
  <!--[endif]-->

 

 

分享到：
| JAVA导出excel报表
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    maani XML/SWF Charts

    "maani XML/SWF Charts"是一个功能强大的图表生成解决方案，它结合了PHP的动态性、XML的数据灵活性和Flash的可视化能力，为Web开发者提供了一种高效、易用的方式来创建互动图表，尤其适用于需要展示股票K线图和其他...

    XML/SWF Charts 4.6 破解版+实例

    博文链接：https://kenter1643.iteye.com/blog/161083

    XML/SWF Charts 基于Flash的图表统计插件 5.08

    内容索引:脚本资源,Ajax/JavaScript,统计图表,Js图表　这是一套基于FLASH/XML、Javascript技术共同打造的图形图表统计显示系统，适用于ASP/PHP/，有着比较准确、形象的统计显示体验，国内不少网站有它的身影，而且它...

    XML_SWF_Charts_4.6

    XML_SWF_Charts_4.6 XML_SWF_Charts_4.6

    使用Fusion Charts制作报表（dom4j生成XML）

    这篇博客"使用Fusion Charts制作报表（dom4j生成XML）"主要介绍了如何利用Fusion Charts结合DOM4J库来生成XML数据，从而创建动态报表。 首先，我们需要理解Fusion Charts的核心概念。Fusion Charts提供了一系列预定...

    danielgindi/Charts折线图柱形图饼图用法Demo

    《danielgindi/Charts折线图柱形图饼图用法Demo》 在iOS开发中，图表是一种非常常见的数据可视化工具，它可以帮助用户更好地理解复杂的数据信息。danielgindi/Charts是GitHub上一个非常知名的开源库，专门用于创建...

    ExtJs charts.swf源码

    1. 多样化的图表类型：ExtJs charts.swf支持折线图、柱状图、饼图、散点图等多种图表类型，满足不同数据展示需求。 2. 动态交互：用户可以与图表进行交互，如点击、拖拽、缩放等，以便更深入地探索数据。 3. 自定义...

    Chart 极品web报表控件收集（Flot,AmCharts, Emprise JavaScript Charts...)

    PHP/SWF Charts - PHP/SWF 是一个简单支持web图表的强大工具，你能使用 PHP 来收集数据，并发送给flash，支持很多图表类型： Line, Column, Stacked column, Floating column, 3D column, Stacked 3D column, ...

    WPF环形图表

    1. **XAML布局**: 使用XAML（eXtensible Application Markup Language）来设计UI，包括定义环形图的容器、控件和样式。 2. **图形绘制**: 利用`Path`、`Polygon`或`PieSlice`等元素来绘制环形图的各个部分。每个...

    flex charts 图形集合实例（读取XML）

    在“flex charts 图形集合实例（读取XML）”中，我们探讨的是如何使用Flex Charts来展示数据，并且这些数据是从XML文件中读取的。XML因其结构化和可扩展性，常被用作数据交换格式。以下是对这一主题的详细说明： 1....

    YUI 2.8.0 charts.swf

    用于替换Extjs生成图表的charts.swf文件。实现图表的另存为图片的功能

    轻量级图形报表插件JSCharts

    **JSCharts：轻量级图形报表插件** JSCharts是一款高效、轻量级的JavaScript图表库，专为创建各种类型的图形报表而设计。它提供了丰富的图表类型，包括柱状图、圆饼图和线性图，使开发者能够轻松地在网页上实现数据...

    qtcharts-opensource-src-5.7.0.zip

    QtCharts模块提供了多种图表类型，包括但不限于折线图、柱状图、饼图、散点图、面积图、热力图以及甘特图等。这些图表不仅外观专业，而且可以定制化程度高，支持自定义颜色、样式、数据绑定以及动画效果。通过Qt...

    qiun-data-charts

    《使用vue版u-charts插件进行数据可视化》 在当今的数据驱动时代，数据可视化是理解和传达信息的关键工具。在开发过程中，我们经常会遇到需要在Web应用中展示各种图表的需求。对于基于Vue.js的项目，特别是使用uni-...

    Web Chart 极品web报表控件收集Web+Chart

    PHP/SWF Charts - PHP/SWF 是一个简单支持web图表的强大工具，你能使用 PHP 来收集数据，并发送给flash，支持很多图表类型： Line, Column, Stacked column, Floating column, 3D column, Stacked 3D column, ...

    Maani PHP SWF Charts v4.6注册机

    Maani PHP SWF Charts v4.6注册机，很好用的php图标制作工具

Magicbox
Global site tag (gtag.js) - Google Analytics