jeudi 2 février 2017

How to scale GraphicsPathCommand data?

Context: For a legacy Flex/Actionscript drawing app, I need to add scaling of simple symbols. The app uses the Graffiti for drawing and the resulting shape data is stored as GraphicsPathCommands serialized to XML using the Degrafa lib for save and reload. I need to enable the user to scale these graphics and then get updated path data which can be serialized. The symbols are simple but more complicated than simple geometry. For example:

enter image description here

Question: I converted the SVG data for this symbol to Actionscript GraphicsPathCommands and am able to draw it, and of course translation is easy – but I don't know how I would scale it, given a bounding box defined by a user dragging out a marquee rectangle in the app.

Does anyone know of either an Actionscript way of transforming the command data, or a Javascript snippet for scaling SVG which I can port to Actionscript?

For reference, an example of the Actionscript GraphicsPathCommands for drawing a star is below.


public function DrawPathExample()
    {
        var star_commands:Vector.<int> = new Vector.<int>(5, true);

        star_commands[0] = GraphicsPathCommand.MOVE_TO;
        star_commands[1] = GraphicsPathCommand.LINE_TO;
        star_commands[2] = GraphicsPathCommand.LINE_TO;
        star_commands[3] = GraphicsPathCommand.LINE_TO;
        star_commands[4] = GraphicsPathCommand.LINE_TO;

        var star_coord:Vector.<Number> = new Vector.<Number>(10, true);
        star_coord[0] = 66; //x
        star_coord[1] = 10; //y 
        star_coord[2] = 23; 
        star_coord[3] = 127; 
        star_coord[4] = 122; 
        star_coord[5] = 50; 
        star_coord[6] = 10; 
        star_coord[7] = 49; 
        star_coord[8] = 109; 
        star_coord[9] = 127;

        graphics.beginFill(0x003366);
        graphics.drawPath(star_commands, star_coord);
    }

Aucun commentaire:

Enregistrer un commentaire