Exit
  • Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
  • 한국 커뮤니티
0

How do I rasterize a graphic that contains path data?

Community Beginner ,
Feb 25, 2015 Feb 25, 2015

In this function, when I have type=5 (create the path object), the path object appears on canvas, but the BitmapData is blank. What am I doing wrong?

    public function createRandomObject():Object

    {

        var MAXX:Number = 700;

        var MAXY:Number = 500;

        var MINRADIUS:Number = 20;

        var MAXRADIUS:Number = 100;

        var MAXHEIGHT:Number = 100;

        var MAXWIDTH:Number = 100;

        var MINHIEGHT:Number= 20;

        var MINWIDTH:Number= 20;

        var NUMTYPES:Number = 5;

        var xPos = Math.floor(Math.random() * MAXX);

        var yPos = Math.floor(Math.random() * MAXY);

        var type = Math.floor(Math.random() * NUMTYPES) + 1;

        var color:uint = Math.floor( (Math.random() * 0xFFFF00) + 0x0000FF);

        var graphic:Graphic = new Graphic();

        graphic.graphics.beginFill(color);

    //type=5;

        var width:Number = Math.floor(Math.random() * (MAXWIDTH-MINWIDTH)) + MINWIDTH;

        var height:Number = Math.floor(Math.random() * (MAXHEIGHT-MINHIEGHT)) + MINHIEGHT;

        switch(type)

        {

            case 1: //circle

            {

                var radius:Number = Math.floor( (Math.random()*(MAXRADIUS-MINRADIUS)))+MINRADIUS;

                width = height = radius*2;

                graphic.graphics.drawCircle(radius, radius,radius );

                break;

            }

            case 2: //square

            {

                height = width;

                graphic.graphics.drawRect(0,0,width, height);

                break;

            }

            case 3: //rect

            {

                graphic.graphics.drawRect(0,0,width, height);

                break;

            }

            case 4://ellipse

            {

                graphic.graphics.drawEllipse(0,0,width, height);

                break;

            }

            case 5://SVG Path

            {

                //var pathData:String = "M 0 0 L 0 40 L 40 40 L 40 0 Z";

                var pathData:String = "M 247 153 L 0 400 400 800 609 800 695 800 696 801 722 873 749 802 774 827 801 801 827 827 852 802 879 873 905 801 906 800 993 800 1201 800 1601 400 1201 0 801 400 400 0 247 153 Z";

                var path:Path = new Path();

                path.data = pathData;

                path.x =0;

                path.y=0;

                path.width = 200;

                path.height = 200;

                path.stroke=new SolidColorStroke();

                path.fill=new SolidColor(0xFFFFFF);

                path.winding = GraphicsPathWinding.EVEN_ODD;

                path.validateNow();

                graphic.addElement(path);

                graphic.width = 200;

                graphic.height = 200;

                width = path.width;

                height = path.height;

            }

        }

        graphic.graphics.endFill();

        var FillColor = 0xFF000000;

        mainCanvas.addElement(graphic);

      

        var bitMapData:BitmapData = new BitmapData(width,height, false);

        bitMapData.draw(graphic); //this is empty when type=5 (path data)

      

        graphic.x = xPos;

        graphic.y = yPos;

        var dataObject:Object = new Object();

        dataObject.bitMapData = bitMapData;

        dataObject.XPos = xPos;

        dataObject.YPos = yPos;

        dataObject.spriteName = graphic.name;

        return dataObject;

    }

TOPICS
ActionScript
256
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Community Beginner , Feb 26, 2015 Feb 26, 2015

So I figured it out. Paths use BeforeDraw(), Draw(), and EndDraw(), which performs the fill and stroke operations. The problem is that these functions dont get called until the path gets rendered on the canvas. So, I extended my path class and over-rode the EndDraw() function. In this function I dispatched an event. Then, when I catch the event I can get the DisplayObject from the path (which is now filled in) and pass that object into BitmapData().

Translate
Community Expert ,
Feb 25, 2015 Feb 25, 2015

is that for a flex app?

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Feb 26, 2015 Feb 26, 2015

Yes, for a flex app

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Feb 26, 2015 Feb 26, 2015

if you see no errors, what happens when you use your commented-out pathData string instead of the problematic one?

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Feb 26, 2015 Feb 26, 2015
LATEST

So I figured it out. Paths use BeforeDraw(), Draw(), and EndDraw(), which performs the fill and stroke operations. The problem is that these functions dont get called until the path gets rendered on the canvas. So, I extended my path class and over-rode the EndDraw() function. In this function I dispatched an event. Then, when I catch the event I can get the DisplayObject from the path (which is now filled in) and pass that object into BitmapData().

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines