• 2008-10-31

    flex 图表 - [Flex]

    flex chart 包是收费的,还有几个免费的也挺不错。amcharts,fusionCharts Free,Open Flash Chart,地址的话自己google一下就出来了。

  • 转载自:http://madinsect.blogbus.com/logs/24042051.html 
       
    有了actionscript3,有许多不可思议的图片操作都可以实现。能把flash中的显示对象转换成一张jpeg图片就是其中之一,这要感谢在AS3 Core Library(一个as3开源库)中所提供的JPEG格式编译类,有了它,要实现前面的那个构想将变得十分简单。在下文中,我将向你展示如何编写一个flash,使他能够把movieclip转换为一张jpeg图片并可以下载到用户电脑。

    为了给你一个程序的大体概念,请试试下面的这个画图板。

     

     

    首先要做的重要准备

    在我们开始之前,取保你已经下载了ActionScript 3 Core Library。这个核心库包涵了许多类和功能模块,他们提供了诸如MD5,日期格式化,图像编码等功能(这里只列举了其中几个)。当你获得了这个库之后,你只需要把它放到你的类文件夹中,就可以使用它提供的这些功能了。现在我们可以导入JPGEncoder这个类了。

    import com.adobe.images.JPGEncoder;

    编译一个MovieClip

           在这个例子中,我们假设我们感兴趣的那个MovieClip名为sketch_mc,为了能使用JPGEncoder进行操作,我们需要先把MovieClip转换为一个Bitmap对象。要实现这一步,我们将使用到BitmapData这个类。该类的构造函数需要两个参数,宽和高。因为我们想要这张jpeg图片的大小和sketch_mc的大小一样,所以我们用sketch_mc的宽高属性。然后通过传递sketch_mc参数给draw方法,我们的MovieClip就转换为一个Bitmap对象了。

    import com.adobe.images.JPGEncoder;
    var jpgSource:BitmapData = new BitmapData (sketch_mc.width, sketch_mc.height);
    jpgSource.draw(sketch_mc);

    现在sketch_mc的图像已经有位图实例了,我们就可以使用JPGEncoder了。在创建这个类的一个新实例的时候,你可以通过传递1-100的数字参数来设置图片压缩的等级。接下来我们来创建jpeg图片,调用encode方法,并且把上面的位图实例作为参数传递进去。该方法将以ByteArray的数据格式返回jpeg,可见这个类和AS3中其他操作二进制数据的类一样简单方便。

    import com.adobe.images.JPGEncoder;
    var jpgSource:BitmapData = new BitmapData (sketch_mc.width, sketch_mc.height);
    jpgSource.draw(sketch_mc);
    var jpgEncoder:JPGEncoder = new JPGEncoder(85);
    var jpgStream:ByteArray = jpgEncoder.encode(jpgSource);

    Flash Player到硬盘

           ActionScript 3已经完成了所有将MovieClip转换为jpeg的必要工作,但是现在还需要一些小步骤来实习图片的下载。为此我们需要用URLRequest这个类把我们得到的二进制数据传递给服务器端的脚步。因为我们post的是二进制数据,所以必须设置content-type“application/octet-stream”。当然,当图片被下载的时候它还需要一个名字,所以我们同样需要把这个参数作为查询字符床也传递给服务器端的脚步。

    import com.adobe.images.JPGEncoder;
    var jpgSource:BitmapData = new BitmapData (sketch_mc.width, sketch_mc.height);
    jpgSource.draw(sketch_mc);
    var jpgEncoder:JPGEncoder = new JPGEncoder(85);
    var jpgStream:ByteArray = jpgEncoder.encode(jpgSource);
    var header:URLRequestHeader = new URLRequestHeader("Content-type", "application/octet-stream");
    var jpgURLRequest:URLRequest = new URLRequest("jpg_encoder_download.php?name=sketch.jpg");
    jpgURLRequest.requestHeaders.push(header);
    jpgURLRequest.method = URLRequestMethod.POST;
    jpgURLRequest.data = jpgStream;
    navigateToURL(jpgURLRequest, "_blank");

    下面是我们的jpg数据将要post去的php页面的脚步。我选择php作为例子,但其实任何服务器端的脚步都是可以的。

    if (isset($GLOBALS["HTTP_RAW_POST_DATA"]))
    {
              // get bytearray
              $jpg = $GLOBALS["HTTP_RAW_POST_DATA"];
              // add headers for download dialog-box
              header(’Content-Type: image/jpeg’);
              header(”Content-Disposition: attachment; filename=”.$_GET['name']);
              echo $jpg;
    }

    总结一下思路,其实说穿了就那么几步:
    1. 将玩家画出的图形使用bitmapdata 的draw 方法写入
    2. 然后使用 corelib中的图形编码类将数据转换为bytearry
    3. 将bytearray传给服务器
    4. 服务器转给客户端保存下来
    Tag:Flash
  • 需求:把客户端处理过的图片返还给服务器
    Flash端代码
    01 package {
    02     import com.adobe.images.JPGEncoder;   
    03     import flash.display.Sprite;
    04     import flash.events.Event;
    05     import flash.events.IOErrorEvent;
    06     import flash.net.URLLoader;
    07     import flash.net.URLRequest;
    08     import flash.net.URLRequestMethod;
    09     import flash.text.TextField;
    10     import flash.utils.ByteArray;   
    11     import mx.core.BitmapAsset;
    12
    13     [SWC(width='400',height='400',backgroundColor='0x4c4c4c',frameRate='30')]
    14     public class Base extends Sprite
    15     {
    16         [Embed(source="../1.jpg")]  // same png / gif files
    17         private var Photo:Class ;
    18        
    19         private var url:String = "http://localhost:8080/PicSample/aaa" ;
    20         private var _loader:URLLoader = new URLLoader();;
    21         private var reposeTxt:TextField;
    22        
    23         public function Base()
    24         {
    25             reposeTxt = new TextField();
    26             addChild(reposeTxt);
    27             reposeTxt.text = "waiting....";
    28            
    29             var photo:BitmapAsset = new Photo();
    30             var urlRequest:URLRequest = new URLRequest(url);
    31                        
    32             var JPG:JPGEncoder = new JPGEncoder(70);
    33             var bary:ByteArray = JPG.encode(photo.bitmapData);           
    34             urlRequest.data=bary;
    35             urlRequest.method=URLRequestMethod.POST;
    36             urlRequest.contentType = "application/octet-stream";
    37             _loader.addEventListener(Event.COMPLETE,completeHandler);
    38             _loader.addEventListener(IOErrorEvent.IO_ERROR,ioErrorHandler);
    39             _loader.load(urlRequest);
    40            
    41         }
    42         private function completeHandler(evt:Event):void {
    43             reposeTxt.text = "成功";
    44         }
    45         private function ioErrorHandler(evt:IOErrorEvent):void {
    46             reposeTxt.text = "失败";
    47         }
    48     }
    49 }

     

    01 @Override
    02     protected void doPost(HttpServletRequest request, HttpServletResponse response)
    03             throws ServletException, IOException {
    04        
    05         ServletInputStream in = request.getInputStream();
    06         OutputStream outStream = new FileOutputStream("e:/m34.jpg");
    07         int b =0;
    08         while(b!= -1)
    09         {
    10             in.available();
    11             b = in.read();
    12             if(b!= -1)
    13                 outStream.write(b);
    14         }
    15         outStream.close();
    16     }
    Tag:Flash