Every transformation method returns the figure or figures that were transformed so you can chain them.
Basic transformation on figures, the deg parameter in scaleFrom and shearAround applies the transform in a rotated space.
figure.translate(x,y); // figure.translate(offset);figure.scaleFrom(point,sx,sy [,deg]);figure.rotateAround(point,angle);figure.shearAround(point,sx,sy [,deg]);figure.transform(matrix);
Cx.translate(figures, x,y); // Cx.translate(figures, offset);Cx.scaleFrom(figures, point,sx,sy [,deg]);Cx.rotateAround(figures, point,angle);Cx.shearAround(figures, point,sx,sy [,deg]);Cx.transform(figures, matrix);
Transformations using the center of the figures bounds as the pivot. We need to use metrics here so these operations are asynchronous.
figure.rotate$(angle);figure.scale$(sx, sy);figure.mirrorX$();figure.mirrorY$();
Cx.rotate$(figures, angle);Cx.scale$(figures, sx, sy);Cx.mirrorX$(figures);Cx.mirrorY$(figures);
Alignment
figure.center$( to );Cx.center$( figures, to );
Center a figure or a figures list. to can be a point or anything that has a center (bounds, frame, other figures).
figure.align$( alignment, to [, margin] );
Align the figure against a given bounds.
- alignment any combination of Left, Center, Right with Top, Middle, Bottom. Examples: “TopLeft”, “Center”, “Bottom”, “CenterMiddle”. It doesn’t matter the order or if you put a space or a comma between them (this is ok: “Top Right”).
- to a bounds object of something we can get bounds from (canvas,frame,other figures).
- margin optional margin for the alignment
Cx.align$( figures, alignment [, to, margin] );
Align a group of figures to a given bounds. If you call it without a to parameter it will align the figures against themselves.
Cx.groupedAlign$( figures, alignment, to [,margin] );
Align the figures without loosing their relative distances.
Examples:
// Center figures in CanvasCx.center$( figures, canvas );// Align figures to the top of the Canvas (respecting relative distances)Cx.groupedAlign$( figures, 'Top', canvas );// Align figures baselinesCx.align$( figures, 'bottom' );
Fitting
Cx.fit$(figures, to,{ locked:[bool], fit:['Max'/'Min'/'Mean'] });
Fits a group of figures to a bounds object or anything that has bounds.
Examples:
// Fit figures to cover the Canvas visible areaCx.fit$(figures, canvas);// Fit figures to cover all the figures in the documentCx.fit$(figures, doc.activePageFigures());
Cx.setSize$(figures, { width:[n], height:[n], locked:[bool], fit:['Max'/'Min'/'Mean'], pin:[point] });
Examples:
// Set the width of the selected figures, preserving aspect ratio.Cx.setSize$(canvas.selectedFigures(),{width:400})// Set the width and height of the figures, preserving aspect ratio and area of the bounds.Cx.setSize$(figures,{width:500,fit:'Mean'});// Set width and height, do not preserve aspect ratioCx.setSize$(figures,{width:100,height:100,locked:false});
Boolean operations
Cx.reshape$(figures,action) .then(function( newFigures ) { // ...
Performs a reshape action on a list of figures. The action can be any of Cx.E.ReshapeAction: ‘Combine’, ‘Weld’, ‘Condense’, ‘FrontMinusBack’, ‘BackMinusFront’, ‘BreakApart’, ‘BreakApartRegions’ and ‘BreakApartByColor’
Cx.combine$(figures) .then(function( newFigure ){ ...Cx.weld$(figures) .then(function( newFigure ){ ...Cx.condense$(figures) .then(function( newFigure ){ ...Cx.frontMinusBack$(figures) .then(function( newFigure ){ ...Cx.backMinusFront$(figures) .then(function( newFigure ){ ...
Direct functions for combine type operations. Get a list of figures and return one composed figure.
Working with colors
Cx.forEachColor(figures,function(color){ ... },context);
Iterate through every color of a list of figures.
var zones = Cx.uniqueColorZones(figures, { collapseTags:[bool] });
Returns a list of unique color zones composed of a solid color (both from pens and brushes) and with textures. Each zone has a value member that can be a Cx.Color or a Cx.TextureBrush.
Cx.changeColorZone(figures, zone, newValue);
Replaces a color zone with a new value.
var map = function(color) { return newColor -or- color; }; Cx.convertColors(figures, map);
Converts the colors in the figures using the function map.
Cx.colorAt$(figures, point).then( function(color) ) { // ...
Gets the color at the given point for a list of figures.