如何栅格化包含路径数据的图形？答案

【问题标题】：How do I rasterize a graphic that contains path data?如何栅格化包含路径数据的图形？
【发布时间】：2015-02-25 18:07:51
【问题描述】：

我正在尝试将一些 SVG 数据栅格化为 PNG，但它无法正常工作。有人可以告诉我我做错了什么吗？

这段代码在 BitmapData 对象中似乎没有任何数据。

 var color:uint = Math.floor( (Math.random() * 0xFFFF00) + 0x0000FF);
 var graphic:Graphic = new Graphic();
 graphic.graphics.beginFill(color);

 var pathData:String = "M 0 0 L 0 40 L 40 40 L 40 40 Z";
 var path:Path = new Path();
 path.data = pathData;
 path.x =0;
 path.y=0;
 path.width = 40;
 path.height = 40;
 path.stroke=new SolidColorStroke(100);
 path.fill=new SolidColor(100);
 path.winding = GraphicsPathWinding.EVEN_ODD;
 graphic.addElement(path);
 graphic.width = 40;
 graphic.height = 40;
 graphic.validateNow();
 var FillColor = 0x00000000;
 var bitMapData:BitmapData = new BitmapData(graphic.width,graphic.height, true, FillColor);
 bitMapData.draw(graphic);

但是这段代码可以：

var graphic:Graphic = new Graphic();
graphic.graphics.beginFill(color);
var width:Number = Math.floor(Math.random() * (MAXWIDTH-MINWIDTH)) + MINWIDTH;
var height:Number = Math.floor(Math.random() * (MAXHEIGHT-MINHIEGHT)) + MINHIEGHT;
var radius:Number = Math.floor( (Math.random()*(MAXRADIUS-MINRADIUS)))+MINRADIUS;
width = height = radius*2;
graphic.graphics.drawCircle(radius, radius,radius );
graphic.graphics.endFill();

var FillColor = 0x00000000;
var bitMapData:BitmapData = new BitmapData(graphic.width,graphic.height, true, FillColor);
bitMapData.draw(graphic);

如果我这样做：

 var temp:Graphic = new Graphic();
    temp.graphics.beginFill(0x000000);
    temp.graphics.drawRect(0,0,width/2, height/2);
    temp.graphics.endFill();
    sprite.graphics.drawRect(0,0,width, height);
    sprite.addElement(temp);

两个矩形都在画布上绘制，但是

BitMapData.draw(sprite);

只显示顶级精灵。

【问题讨论】：

试试addChild(graphic) 看看有没有什么可以画的？
addChild(graphic) 时可以在画布上看到它。
我看到的唯一区别是，在第二种情况下，您直接使用graphic.graphics，而在第一种情况下，您使用addElement() 和validateNow()。这可能是原因，因为addElement 的代码未知。此外，'validateNow()' 是否有可能以某种方式延迟工作，所以在您执行 draw() 到 BitmapData 的那一刻，图形仍然是空的？
你也可以尝试：addChild(graphics) 到一些Sprite，然后将Sprite 绘制成BitmapData
那也没用。我想知道问题是否出在渲染容器上。

标签： actionscript-3 svg rasterize

【解决方案1】：

所以我想通了。路径使用 BeforeDraw()、Draw() 和 EndDraw()，它们执行填充和描边操作。问题是这些函数在路径被渲染到画布上之前不会被调用。所以，我扩展了我的路径类并覆盖了 EndDraw() 函数。在这个函数中，我调度了一个事件。然后，当我捕捉到事件时，我可以从路径（现在已填充）中获取 DisplayObject，并将该对象传递给 BitmapData()。

【讨论】：