团队在做一个Flex的框架,其中做了统计柱状图、饼图、表格,表格利用第三方包已完成导出,今天重点解决导出饼图、柱状图。
首先在网上搜索导出amchart的资料,amchart 的flex组件没有内置的导出功能,需要自己去写,最先找到的解决方法,也就是网上比较的多就是,利用servlet的方式完成导出,
代码如下:
前台代码:
private function selectSave(event:Event):void{
var bitmapData:BitmapData = new BitmapData(amChart.width,amChart.height,false,getStyle('backgroundColor'));
bitmapData.draw(amChart);
var jpg:JPEGEncoder = new JPEGEncoder();
var jpgByteArray:ByteArray = jpg.encode(bitmapData);
//var jpgByteArray:ByteArray = jpg.encode(ImageSnapshot.captureBitmapData(amChart));
var header:URLRequestHeader = new URLRequestHeader("Content-type", "application/octet-stream");
var request:URLRequest = new URLRequest("http://localhost:8080/ytgis/upload/servlet"); //自己的servlet代替
request.requestHeaders.push(header);
request.contentType = 'applicatoin/octet-stream';
request.data = jpgByteArray;
request.method = URLRequestMethod.POST;
navigateToURL(request);
}
后台servlet代码:
public class exportAmchart extends HttpServlet {
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp)
throws ServletException, IOException {
// TODO Auto-generated method stub
saveImage(req, resp);
}
@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp)
throws ServletException, IOException {
// TODO Auto-generated method stub
saveImage(req, resp);
}
@SuppressWarnings("unused")
private void saveImage(HttpServletRequest request,HttpServletResponse response ) throws IOException{
String fileName = "D://" + System.currentTimeMillis() + ".jpg";
BufferedImage bufferedImage = ImageIO.read(request.getInputStream());
if (bufferedImage != null) {
ImageIO.write(bufferedImage, "jpeg", new File(fileName));
}
}
}
这种利用servlet导出的方式,不灵活,而且用户体验性也很差!后又看了下Flex自己提供了导出组件为图片的功能,利用这种方式还是比较好的,代码如下:
private function selectSave(event:Event):void{
var bitmapData:BitmapData = new BitmapData(amChart.width,amChart.height,false,getStyle('backgroundColor'));
bitmapData.draw(amChart);
var jpg:JPEGEncoder = new JPEGEncoder();
var jpgByteArray:ByteArray = jpg.encode(bitmapData);
//var jpgByteArray:ByteArray = jpg.encode(ImageSnapshot.captureBitmapData(amChart));//这句话可替代上面这些代码
var fileSave:FileReference = new FileReference();
fileSave.save(jpgByteArray,"统计.jpg");
}
就这些代码就搞定了,是不是很强大,Flex自有强大处啊!