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

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

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

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>

posted @ 2012-11-21 14:59 flashlala 阅读(287) 评论(0) 编辑收藏举报

会员力量，点亮园子希望

刷新页面返回顶部

Flash图表

分享flash图表相关控件使用心得、示例文档、应用教程欢迎加群交流：301644590

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

公告

Flash图表

分享flash图表相关控件使用心得、示例文档、应用教程 欢迎加群交流：301644590

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

公告

分享flash图表相关控件使用心得、示例文档、应用教程欢迎加群交流：301644590