AnyChart使用指南三：生成动态图像

AnyChart主要工作原理是有一个.swf文件作为对象，数据和设置存放在.xml文件中，然后在.html文件里通过JS来调用，生成动态图像。

由于想使用到struts中去，xml文件自动生成，有个叫jdom的包能够实现这样的功能，于是在网上找jdom的使用教程，终于写好了第一个生成xml的java文件，示例代码如下：

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

java：import java.io.FileWriter;

import org.jdom.Document;

import org.jdom.Element;

import org.jdom.output.Format;

import org.jdom.output.XMLOutputter;

import com.whbs.xz.oswf.actionforms.WFStatisticForm;

import java.util.ArrayList;

import org.jdom.Text;

public class CreateXMLChart {

public static void createPieChart(ArrayList al) {

try {

Document doc = new Document(); //构建xml框架

Element root = new Element("root");

doc.setRootElement(root); Element TYPE = new Element("type");

Element DATA = new Element("data");

Element OBJECTS = new Element("objects"); Element et1 = new Element("system"); //TYPE

Element et2 = new Element("workspace");

Element et3 = new Element("chart");

Element et4 = new Element("legend");//文字区域set中文字的输出

Element et5 = new Element("block"); //DATA

Element et6 = new Element("text"); //OBJECTS Element es1 = new Element("refresh"); //et1

Element es2 = new Element("background"); //et2

Element es3 = new Element("chart_area");

Element es4 = new Element("base_area");//底部区域

Element es5 = new Element("animation"); //et3

Element es6 = new Element("names");

Element es7 = new Element("values");

Element es8 = new Element("pie_chart");

Element es9 = new Element("hints");

Element es10 = new Element("background"); //et4

Element es11 = new Element("border");

Element es12 = new Element("scroller");

Element es13 = new Element("names");

Element es14 = new Element("values");

Element es15 = new Element("header");

Element es16 = new Element("font"); //et5

Element es17 = new Element("border"); Element ef1 = new Element("colors");

Element ef2 = new Element("alphas");

Element ef3 = new Element("ratios");

Element ef4 = new Element("matrix");

Element ef5 = new Element("border");

Element ef6 = new Element("border");

Element ef7 = new Element("background"); Element ee1 = new Element("color").addContent("0xFFFFFF");

Element ee2 = new Element("color").addContent("0xF4E1C4");

Element ee3 = new Element("alpha").addContent("100");

Element ee4 = new Element("alpha").addContent("100");

Element ee5 = new Element("ratio").addContent("0");

Element ee6 = new Element("ratio").addContent("0xFF"); root.addContent(TYPE);

root.addContent(DATA);

root.addContent(OBJECTS); TYPE.addContent(et1);

TYPE.addContent(et2);

TYPE.addContent(et3);

TYPE.addContent(et4);

DATA.addContent(et5);

OBJECTS.addContent(et6); et1.addContent(es1);

et2.addContent(es2);

et2.addContent(es3);

et2.addContent(es4);

et3.addContent(es5);

et3.addContent(es6);

et3.addContent(es7);

et3.addContent(es8);

et3.addContent(es9);

et4.addContent(es10);

et4.addContent(es11);

et4.addContent(es12);

et4.addContent(es13);

et4.addContent(es14);

et4.addContent(es15); //设置数据处

for (int i = 0; i < al.size(); i++) {

Element SET = new Element("set");

SET.setAttribute("name", "column " + i);

SET.setAttribute("value", "" + al.get(i));

SET.setAttribute("color", "0xAFD8F8");

et5.addContent(SET);

} et6.addContent(es16);

et6.addContent(es17); es2.addContent(ef1);

es2.addContent(ef2);

es2.addContent(ef3);

es2.addContent(ef4);

es8.addContent(ef5);

es9.addContent(ef6);

es9.addContent(ef7); ef1.addContent(ee1);

ef1.addContent(ee2);

ef2.addContent(ee3);

ef2.addContent(ee4);

ef3.addContent(ee5);

ef3.addContent(ee6); //设置标签中的属性

et3.setAttribute("type", "3DPie"); //chart

et4.setAttribute("enabled", "yes"); //legend

et4.setAttribute("x", "22");

et4.setAttribute("y", "60");

et6.setAttribute("text", "sillyPieChart"); //text

et6.setAttribute("auto_size", "yes");

et6.setAttribute("x", "20");

et6.setAttribute("y", "380");

et6.setAttribute("url", "./pieChart.xml"); es1.setAttribute("enabled", "yes"); //refresh

es2.setAttribute("enabled", "yes"); //background

es2.setAttribute("type", "gradient");

es2.setAttribute("gradient_type", "linear");

es3.setAttribute("width", "400"); //chart_area

es3.setAttribute("height", "240");

es3.setAttribute("x", "20");

es3.setAttribute("y", "30");

es3.setAttribute("enabled", "no");

es4.setAttribute("enabled", "no"); //base_area

es5.setAttribute("enabled", "yes"); //animation

es5.setAttribute("speed", "10");

es5.setAttribute("type", "step");

es6.setAttribute("show", "no"); //names

es7.setAttribute("show", "no"); //values

es7.setAttribute("postfix", "%");

es8.setAttribute("radius", "100"); //pie_chart

es8.setAttribute("x", "340");

es8.setAttribute("y", "150");

es8.setAttribute("rotation", "360");

es9.setAttribute("width", "170"); //hints

es10.setAttribute("enabled", "no"); //background

es11.setAttribute("enabled", "no"); //border

es12.setAttribute("enabled", "no"); //scroller

es13.setAttribute("width", "120"); //names

es14.setAttribute("width", "40"); //values

es15.setAttribute("values", "%"); //header

es15.setAttribute("names", "Name");

es16.setAttribute("size", "12"); //font

es16.setAttribute("align", "center");

es16.setAttribute("type", "Verdana");

es17.setAttribute("enabled", "no"); //border ef4.setAttribute("r", "1.7"); //matrix

ef5.setAttribute("enabled", "yes"); //border

ef5.setAttribute("color", "0xF4E1C4");

ef6.setAttribute("color", "0xB54001"); //border

ef7.setAttribute("background", "0xF4E1C4"); //background Format format = Format.getCompactFormat();

format.setEncoding("gb2312"); //设置xml文件的字符为gb2312

format.setIndent(" "); XMLOutputter outputter = new XMLOutputter(format); outputter.output(doc,

new FileWriter(

"E:/JBWorkplaces/osworkflow-xml/xz/xz/oswf/pieChart.xml"));

} catch (Exception e) {

System.out.println(e);

}

生成的xml文件如下：

<?xml version="1.0" encoding="gb2312"?>
<root>
<type>
<system>
<refresh enabled="yes" />
</system>
<workspace>  //整个工作区<background enabled="yes" type="gradient" gradient_type="linear">
<colors>
<color>0xFFFFFF</color>
<color>0xF4E1C4</color></colors>
<alphas>
<alpha>100</alpha>
<alpha>100</alpha></alphas>
<ratios><ratio>0</ratio>
<ratio>0xFF</ratio></ratios>
<matrix r="1.7" />
</background>
<chart_area width="400" height="240" x="20" y="30" enabled="no" />
<base_area enabled="no" />
</workspace>
<chart type="3DPie">  //输出图形部分<animation enabled="yes" speed="10" type="step" />
<names show="no" />
<values show="no" postfix="%" />
<pie_chart radius="100" x="340" y="150" rotation="360">
<border enabled="yes" color="0xF4E1C4" />
</pie_chart>
<hints width="170">
<border color="0xB54001" />
<background background="0xF4E1C4" />
</hints>
</chart>
<legend enabled="yes" x="22" y="60">  //输出文字部分<background enabled="no" />
<border enabled="no" />
<scroller enabled="no" />
<names width="120" />
<values width="40" />
<header values="%" names="Name" />
</legend>
</type>
<data>
<block>
<set name="column 0" value="4" color="0xAFD8F8" />
<set name="column 1" value="17" color="0xAFD8F8" />
</block>
</data>
<objects>
<text text="sillyPieChart" auto_size="yes" x="20" y="380" url="./pieChart.xml">
<font size="12" align="center" type="Verdana" />
<border enabled="no" />
</text>
</objects>
</root>

转载于:https://www.cnblogs.com/flashcharts/archive/2012/11/21/Anychart_dynamicImage.html

AnyChart使用指南三：生成动态图像相关推荐

Python之数据分析（生成动态图像、示波器效果）
文章目录 1.效果展示 2.动画分析 3.案例源码 1.效果展示动态更新波形图: 静态图: 2.动画分析这是一个使用了生成器的动画效果,生成器里面会不断生成新的值,然后放到更新函数里面在指定的in ...
利用ASP.NET一般处理程序动态生成Web图像（转）
摘自:http://www.cnblogs.com/zhouhb/archive/2011/02/15/1955262.html 一般处理程序的扩展名为ashx,它实现了IHttpHandler接口, ...
利用ASP.NET一般处理程序动态生成Web图像
一般处理程序的扩展名为ashx,它实现了IHttpHandler接口,可以响应HTTP请求.我们可以用一般处理程序来动态生成Web图像. <%@ WebHandler Language=&quo ...
利用R，G，B三通道对图像分别生成mask并叠加，最终得到背景和书两种区域
利用R,G,B三通道对图像分别生成mask并叠加,最终得到背景和书两种区域实验室的学长TQL,这个三色道方法是他教我的 import os import os.path as osp import ...
特征线性可分styleGan（粗中细三层次改变图像特征）生成模型有什么用可以模拟数据的分布进而转化为判别模型
不敢相信,上面这些人脸,全都是假的. 是英伟达的AI生成的. 借用风格迁移的思路,团队为GAN创造了一种新的生成器. 连GAN之父Goodfellow老师也忍不住发推称赞优秀! 这个结构不需要人类监督 ...
Jasper Report 6.8 根据后台数据生成动态报表（JRXML文件实现）（三）JRXML文件生成过程（支持json,bean,map list数据源）
1.生成头信息及页面 protected Element createPageXmlFileRoot( ) {DftRptMaster dftRptMaster = rptInfo.getDftRpt ...
antd tree 动态添加_一文了解Matlab如何制作动态图像
今天的推文,我们主要来介绍matlab中几种绘制动态图像的方法.首先,以之前介绍过的心形图为例,来说明在matlab中如何将绘图过程保存为gif动态图像. 1. Matlab绘制GIF图像 Step1 ...
GAN能生成3D图像啦！朱俊彦团队公布最新研究成果
晓查发自凹非寺量子位出品 | 公众号 QbitAI GAN现在可以合成3D图像了! 最近,MIT计算机科学与AI实验室的朱俊彦团队,发表了一篇论文<Visual Object Netwo ...
英伟达用GAN生成脑瘤图像，训练出的AI医生，准确率提高16%
栗子脑发自凹非寺量子位出品 | 公众号 QbitAI 辅助医生做疾病诊断的AI,已越来越常见. 从前,每只AI要吃下来自放射科的许多许多图像数据,学好图中的特征,才可能出师. 数据集越大越好, ...

AnyChart使用指南三：生成动态图像

AnyChart使用指南三：生成动态图像相关推荐

最新文章

热门文章