Transform Scale and Translate Math

I am using images to create my tab backgrounds. The center image is one pixel in width. To stretch it the length of the text on the tab. The problem is I don't understand the math I need to figure out the x value (below its 1-8.5) that will place the image back in the correct position.
Can someone help me with the math I need to calculate its original X position?
Also, how do I find the current width of a Text object? I have seen examples that used text.currentWidth, but it does not appear to be available anymore.
var center = ImageView {
     image: Image { url: "file:images/tab_center.gif"}
     x: bind left.getBoundsX() + left.getBoundsWidth()
     transform: [Scale.scale(50, 1), Translate.translate(-18.5, 0)]
-chris worley

Chris,
You could try this: [http://coffeejolts.com/site/2008/08/fxcontainer-v01.html], it may save you some time.
-Coffeejolts

Similar Messages

App uses -moz-transform:scale and touch registration is out unless double tap to zoom in.

I'm having awful trouble with scaling. When I get the screen resolution of my tablet is says 1280x800. However if I scale my page to fit using -moz-transform:scale it overflows the page and I need to scale it down by 0.76 to make it fit. Strangely if I use portrait which reports as 800x1024 the page is then too small and I need to scale it up by 1.23 (note its -0.23 and +0.23 for landscape and portrait respectively).
If I avoid scaling by making the page the right size (adjusted by 0.76) then in landscape touch registration is correct with relation to the page. In portrait if I do the same then I can't press the buttons unless I double tap to zoom in.
I can't change the way this app works as it works perfectly well across all Windows and Linux platforms but I have these bizarre things happening on Android.
The main issue is touch not registering correctly. However, when its not working if I hold a button down I get a javascript message pop up offering 'Copy link' and 'Bookmark link' with the correct javascript reference but the function is not called.
Any hints on how to work this out very welcome.
Bob

''bobcowdery [[#question-1042217|said]]''
<blockquote>
I'm having awful trouble with scaling. When I get the screen resolution of my tablet is says 1280x800. However if I scale my page to fit using -moz-transform:scale it overflows the page and I need to scale it down by 0.76 to make it fit. Strangely if I use portrait which reports as 800x1024 the page is then too small and I need to scale it up by 1.23 (note its -0.23 and +0.23 for landscape and portrait respectively).
If I avoid scaling by making the page the right size (adjusted by 0.76) then in landscape touch registration is correct with relation to the page. In portrait if I do the same then I can't press the buttons unless I double tap to zoom in.
I can't change the way this app works as it works perfectly well across all Windows and Linux platforms but I have these bizarre things happening on Android.
The main issue is touch not registering correctly. However, when its not working if I hold a button down I get a javascript message pop up offering 'Copy link' and 'Bookmark link' with the correct javascript reference but the function is not called.
Any hints on how to work this out very welcome.
Bob
</blockquote>
Slightly closer. I've added <META name="viewport" content="width=device-width, height=device-width, initial-scale=1.0, maximum-scale=1.0"> to my top level container. This seems to stop firefox from doing an auto-zoom so my page is now properly displayed in both orientations. In landscape all works fine. In portrait however my navigation buttons at the bottom have no touch response unless I double tap to zoom in and then they work. Strangely, the buttons in the content area that are generated on the fly work correctly even after I zoom out again.
Any ideas anyone?
Bob

Wavelet transform scale and time information

Hi there -
I am using the wavelet transform for a non-stationary signal. I am not having trouble getting the coefficients from the transfrom but is there I way I can find the scale/frequency and time information from just the wavelet VI. I see no way I can get at this information. Also, I am pretty certain Labview uses the DWT when computing the transform but does Labview have the option to do the CWT?
The reason is because I want to plot time vs. frequency vs. amplitude and I need all three to do it properly.
Thanks for your help,
Cameron

Hi, Cameron.
This screenshot shows one DWT and one CWT VI, and you'll notice that the CWT has an output called scale info which contains the time information and the scale (frequency) information. (In addition, LabVIEW has several other wavelet VIs.)
If this doesn't answer your question, please let me know. Have a nice afternoon!
Message Edited by sarahk on 08-16-2006 03:59 PM
Sarah K.
Search PME
National Instruments
Attachments:
scale info.JPG ‏37 KB

Problem with very slow scale, rotate and translate

Hi -
Here is the basic problem. I want to take a bufferedImage (read from a jpeg earlier on) and then rotate it according to an angle value (radians) and then resize it to fit within a specifically sized box. My code works fine, but... I have to do this in a loop up to 200 times. The process is often taking several minutes to complete. If this is simply a consequence of what I am trying to do, then I'll accept that, but surely I am just doing something wrong? Please help!
Thanks - here is the (working but very slow) code
    public Graphics2D get_shape_image(Graphics2D g, BufferedImage b, double shaperotation, double space_width, double space_height,
            float x_scale_factor, float y_scale_factor, float shapeTransparency){
        // Work out the boundimg box size of the rotated image
        double imageWidth = (double) b.getWidth();
        double imageHeight = (double) b.getHeight();
        double cos = Math.abs( Math.cos(shaperotation));
        double sin = Math.abs( Math.sin(shaperotation));
        int new_width = (int) Math.floor(imageWidth * cos + imageHeight * sin);
        int new_height = (int) Math.floor(imageHeight * cos + imageWidth * sin);
        // Create the new bufferedImage of the right size
        BufferedImage transformed = new BufferedImage((int) new_width, (int) new_height, BufferedImage.TYPE_INT_RGB);
        // Create the transform and associated AffineTransformOperation
        AffineTransform at = new AffineTransform();
        AffineTransformOp affine_op;
        // Make sure our image to be rotated is in the middle of the new image
        double x_movement = ((double) (new_width / 2.0d)) - ((double) imageWidth / 2.0d);
        double y_movement = ((double) (new_height / 2.0d)) - ((double) imageHeight / 2.0d);
        at.setToTranslation(x_movement, y_movement);
        affine_op = new AffineTransformOp(at, AffineTransformOp.TYPE_BILINEAR);
        transformed = affine_op.filter(b, null);
        // Now we need to rotate the image according to the input rotation angle
        BufferedImage rotated = new BufferedImage((int) new_width, (int) new_height, BufferedImage.TYPE_INT_RGB);
        at.setToRotation(shaperotation, (double) new_width / 2.0d, new_height / 2.0d);
        affine_op = new AffineTransformOp(at, AffineTransformOp.TYPE_BILINEAR);
        rotated = affine_op.filter(transformed, null);
        // Do the scaling so that we fit into the grid sizes
        BufferedImage sizedImage = new BufferedImage((int) (space_width * x_scale_factor), (int) (space_height * y_scale_factor), BufferedImage.TYPE_INT_RGB);
        double xScale = (double) (space_width * x_scale_factor) / (double) new_width;
        double yScale = (double) (space_height * y_scale_factor) / (double) new_height;
        at.setToScale(xScale, yScale);
        affine_op = new AffineTransformOp(at, AffineTransformOp.TYPE_BILINEAR);
        sizedImage = affine_op.filter(rotated, null);
        // Finally translate the image to the correct position after scaling
        double x_adjust = (space_width / 2.0d) - ((space_width * x_scale_factor) / 2.0d);
        double y_adjust = (space_height / 2.0d) - ((space_height * y_scale_factor) / 2.0d);
        // Set the transparency
        AlphaComposite ac = AlphaComposite.getInstance(AlphaComposite.SRC_OVER, shapeTransparency);
        g.setComposite(ac);
        // Draw the image as long as it's above 0 size
        if (sizedImage.getWidth() > 0 && sizedImage.getHeight() > 0)
            g.drawImage(sizedImage, null, (int) x_adjust, (int) y_adjust);
        return g;
    }

Your code worked okay in my system: busy at 200fps using 1.0f for alpha and
the x/y scale_factor values.
Here's another approach that isn't quite as busy.
import java.awt.*;
import java.awt.geom.*;
import java.awt.image.BufferedImage;
import java.io.*;
import javax.imageio.ImageIO;
import javax.swing.*;
public class XTest extends JPanel
    BufferedImage image;
    int gridWidth = 100;
    int gridHeight = 100;
    double theta   = 0;
    double thetaInc;
    public XTest(BufferedImage image)
        this.image = image;
        thetaInc = Math.toRadians(1);
    protected void paintComponent(Graphics g)
        super.paintComponent(g);
        Graphics2D g2 = (Graphics2D)g;
        g2.setRenderingHint(RenderingHints.KEY_ANTIALIASING,
                            RenderingHints.VALUE_ANTIALIAS_ON);
        g2.setRenderingHint(RenderingHints.KEY_INTERPOLATION,
                            RenderingHints.VALUE_INTERPOLATION_BICUBIC);
        int w = getWidth();
        int h = getHeight();
        int imageW = image.getWidth();
        int imageH = image.getHeight();
        // rather than making a new BufferedImage for each step of
        // the rotation and scaling let's try to rotate, scale and
        // fit the source image directly into the grid by using
        // transforms...
        // rotation
        AffineTransform rotateXform = new AffineTransform();
        double x = (w - imageW)/2;
        double y = (h - imageH)/2;
        rotateXform.setToTranslation(x,y);
        rotateXform.rotate(theta, imageW/2.0, imageH/2.0);
        // get rotated size for source
        double cos = Math.abs( Math.cos(theta));
        double sin = Math.abs( Math.sin(theta));
        double rw = Math.rint(imageW * cos + imageH * sin);
        double rh = Math.rint(imageH * cos + imageW * sin);
        // scale factors to fit image into grid
        double xScale = gridWidth / rw;
        double yScale = gridHeight / rh;
        // scale from center
        x = (1.0 - xScale)*w/2;
        y = (1.0 - yScale)*h/2;
        AffineTransform scaleXform = AffineTransform.getTranslateInstance(x,y);
        scaleXform.scale(xScale, yScale);
        scaleXform.concatenate(rotateXform);
        g2.drawRenderedImage(image, scaleXform);
        // markers
        // grid
        g2.setPaint(Color.red);
        int gx = (w - gridWidth)/2;
        int gy = (h - gridHeight)/2;
        g2.drawRect(gx, gy, gridWidth, gridHeight);
        // bounds of unscaled, rotated source image
        g2.setPaint(Color.blue);
        double rx = (w - rw)/2;
        double ry = (h - rh)/2;
        g2.draw(new Rectangle2D.Double(rx, ry, rw, rh));
    public void rotate()
        theta += thetaInc;
        repaint();
    public static void main(String[] args) throws IOException
        BufferedImage bi = ImageIO.read(new File("images/bclynx.jpg"));
        XTest test = new XTest(bi);
        Activator activator = new Activator(test);
        JFrame f = new JFrame();
        f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        f.setContentPane(test);
        f.setSize(400,400);
        f.setLocation(200,200);
        f.setVisible(true);
        activator.start();
class Activator implements Runnable
    XTest xTest;
    Thread thread;
    boolean animate;
    public Activator(XTest xt)
        xTest = xt;
        animate = false;
    public void run()
        while(animate)
            try
                Thread.sleep(50);
            catch(InterruptedException ie)
                animate = false;
                System.out.println("interrupt");
            xTest.rotate();
    public void start()
        if(!animate)
            animate = true;
            thread = new Thread(this);
            thread.setPriority(Thread.NORM_PRIORITY);
            thread.start();
    public void stop()
        animate = false;
        thread = null;
}

All of a sudden the transform tool and free transform tool are grayed out and will not allow me to scale, rotate, or do anything to an image I just scaled?

I've been using Photoshop for years, but tonight I ran into an issue that I don't understand. I was working with a file that I had been working with for months. I added a new image and resized it to fit as I needed just as I always have (select layer with image > EDIT > TRANSFORM > SCALE.) All was working fine. I added a second image to the file I was working on (I added it by dragging it into the file from another window just as I had added the first image.) However, this time when I tried to select EDIT > TRANSFORM > SCALE this option was not available to me. Only the FREE TRANSFORM PATH or TRANSFORM PATH options were available. When I selected the SCALE in the TRANSFORM PATH menu (just to see what would happen) it started to scale a completely unrelated layer that DID have a path to it. However, the layer of my image was still selected and NOT the layer with the path. This image layer has no path even on it or around it in any way. I tried to select the folder layer and the same thing happened. It selected this one path and tried to scale it. I selected the layer I just previously scaled and tried to scale it again and it will only allow me to select the transform path option. I selected it to see again what would happen and once again it selected this completely unrelated path on a completely different layer. WHAT????? This makes absolutely no sense! I have tried restarting both my computer and PS and it won't stop happening! I really need to get this file finished and uploaded to my developer ASAP so I really hope that someone has some insight as to why this is happening.

hedger,
How do you expect anyone to help when we don't know a darned thing about the file, abut your setup, exact version of Photoshop and your OS, machine specs, etc.?
BOILERPLATE TEXT:
Note that this is boilerplate text.
If you give complete and detailed information about your setup and the issue at hand,
such as your platform (Mac or Win),
exact versions of your OS, of Photoshop (not just "CS6", but something like CS6v.13.0.6) and of Bridge,
your settings in Photoshop > Preference > Performance
the type of file you were working on,
machine specs, such as total installed RAM, scratch file HDs, total available HD space, video card specs, including total VRAM installed,
what troubleshooting steps you have taken so far,
what error message(s) you receive,
if having issues opening raw files also the exact camera make and model that generated them,
if you're having printing issues, indicate the exact make and model of your printer, paper size, image dimensions in pixels (so many pixels wide by so many pixels high). if going through a RIP, specify that too.
etc.,
someone may be able to help you (not necessarily this poster, who is not a Windows user).
a screen shot of your settings or of the image could be very helpful too.
Please read this FAQ for advice on how to ask your questions correctly for quicker and better answers:
http://forums.adobe.com/thread/419981?tstart=0
Thanks!

Rotate, scale and print an image

I'm trying to rotate, scale and then print an image with the following code.
public int print(Graphics g, PageFormat pageFormat, int pageIndex)
                double DPI=72.0;
     if (pageIndex > 0)
          return(NO_SUCH_PAGE);
     else
          Graphics2D g2d = (Graphics2D)g;
          Paper paper = pageFormat.getPaper();
          int pWidth=(int) (DPI*paper.getWidth()/72.0);
          int piw=(int) (DPI*pageFormat.getImageableWidth()/72.0);
          int pih =(int ) (DPI*pageFormat.getImageableHeight()/72.0);
          int xi=(int) (DPI*pageFormat.getImageableX()/72.0);
          int yi=(int) (DPI*pageFormat.getImageableY()/72.0);
          g2d.translate(0, pWidth);
          g2d.rotate(-Math.toRadians(90));
          g2d.drawImage(image, yi, xi. pih+yi,piw+xi, 0,0,image.getWidth(null), image.getHeight(null),null);
          g2d.rotate(Math.toRadians(90));
          g2d.translate(0, -pWidth);
}The image is shifted to the right and has some extra space on the left when it is printed out . I couldn't figure out why it does that.

Hmmmm That seems OK.
Are you sure the origin point of the central sprite is at a
locV that is
inbetween the orbiting sprites' min / max locV values? This
should do what
you need if the central object is at the right locV on stage
in relation to
the orbit path of the other sprites. Try moving it down in
relation to the
orbit sprite maybe?
Or try this on the central sprite to create an offset...
property my
on beginSprite me
my = sprite(me.spritenum)
end
on enterFrame me
my.locZ = my.locV + 50
end
Tinker with the 50 value until it looks right.
Cheers
Richard

Flash content loaded in IFRAME gets disappeared while applying transform:scale css property

I have an iframe loaded with a flash content inside, and i have to resize the iframe while browser window width changes. So i tried changing transform:scale() property on different media query cut-offs. But unfortunately firefox makes the flash content disappear while applying transform-scale property. Is there any way to overcome this?

Sorry, i don't know how to visualize this. I can paste a sample code here, will it help?
'''HTML:'''
<iframe width="900px" class="iframeStyle" align="middle" height="1200px" frameborder="0" src="http://linktoFlashContainingHtml.html"> </iframe>
'''CSS'''
.iframeStyle {
transform:scale(0.5);
While applying this tranform:scale property, iframe get scaled but flash content inside the page loaded in IFRAME disappears

How to Scale and Crop

I'm working on animating some screen capture footage. I'm trying to crop out part of the screen and replace it with my own background, and then do some moves. However, when I zoom in to the footage, it throws off my crop - the crop moves with the zoom instead of staying stationary like I want it to. In other words, I want my custom background to stay the same size and for the box that the screen capture is in to stay the same size (crop the clip). What it's doing instead is cropping the image itself, so that if I scale the image up, the crop moves along with it.
How do I apply the crop on top of the scale, as part of the clip itself rather than just cropping the image? I'd rather mess with compound clips.
Thanks!

Compound clips are nothing more than "groups". In order to supercede clip level edits, sometimes it's necessary to edit the group instead.
Crop is part of the media, as is scaling. Scaling the media scales the crop.
Here are three ways to accomplish the effect you're looking for:
1)
Select your clip and type Option-G (make compound ["group"])
Add the cropping you need to the compound level and not the clip itself
2)
Select your clip and make compound
Add Effects > Keying > Mask to the the compound level (optional rounded corners and feathering)
3)
Place a Generator > Elements > Shapes at the top level (over the clip you want cropped)
[Select Square and use Video > Transform > Scale to alter the "aspect"]
Set the Video > Compositing > Blend Mode to Stencil Alpha
Select the generator and your clip and make a compound clip (option-G) [creating the compound here is simply to "stop" the action of the Alpha blend mode from "cutting through" the entire project
HTH

Scale and Stroke Effects

I'm trying to manipulate my stroke and see the option for
AI > Preferences > General > Scale and Stroke Effects
though after checking it, it does not seem to change anything. What does it do?
Thanks.

Read it again.
The preference is not Scale and Stroke Effects. It's Scale Strokes and Effects. It determines whether Strokes and Effects are scaled when you scale the object(s) to which they are applied. It is also selectable in the Transform palette's flyout menu.
JET

Scale and copy problem

hey I was wondering if anyone can help me, im trying to do a tutorial in a magazine and one portion of the work needs me to scale and copy using the command shift+alt problem is this doesnt work, the shift key alone does constrain the proportions and holding alt with shift contrains it from the centre point but it doesnt copy, holding alt alone does copy thou... this command doesnt work , I can do this using the scale tool but it the work needs to be very precise and the scale tool is more awkward cos i need to keep setting the point and its not always exactly the same... so basically why doesnt shift+alt constrain and copy a shape? any help would be great. my comp is new and dont have any bugs or other issues.. any help will be great! thanks

lucillecasamadera,
I've been using Illustrator since 1988. I have been an Adobe Certifed Expert in Illustrator since CS2. I can assure you you've either misunderstood the tutorial or the tutorial is simply wrong. (that does happen)
Dragging a transform handle with the Alt key will never result in a copy. Illustrator simply does not work that way. There's nothing wrong with your version. You are trying to do something Illustrator does not do.
You must use a dedicated tool (scale, rotate, skew, selection) in order for the Alt key to generate copies when dragging.
You can argue it all you want... but that's the answer. Sorry it's not the one you wanted to hear.

Scale and rotate a tiff image

How do you scale and rotate a tiff image without running out of memory?
I have been trying to scale the image and rotate it before i pass it to the DisplayJAI but i keep running out of memory.
code i use to rotate the image.
private Image rotateImage(boolean rotateRight)
Image img = imageHolder.getInUseImageIcon().getImage();
Image rot = null;
int imageWidth = imageHolder.getInUseImageIcon().getIconWidth();
int imageHeight = imageHolder.getInUseImageIcon().getIconHeight();
int buffer[] = new int[imageWidth * imageHeight];
int rotate[] = new int[imageWidth * imageHeight];
try
MediaTracker tracker = new MediaTracker (this);
tracker.addImage (img, 0);
tracker.waitForAll();
PixelGrabber grabber = new PixelGrabber(img, 0, 0, imageWidth, imageHeight, buffer, 0, imageWidth);
try {
grabber.grabPixels();
catch(InterruptedException e) {
e.printStackTrace();
if(rotateRight)
for(int x = 0; x < imageWidth; x++)
for(int y = 0; y < imageHeight; y++)
rotate[(x*imageHeight)+y] = buffer[((imageHeight-y-1)*imageWidth)+x];
else
for(int y = 0; y < imageHeight; y++)
for(int x = 0; x < imageWidth; x++)
buffer[(y*imageWidth)+x] = rotate[((imageWidth-x-1)*imageHeight)+y];
for(int y = 0; y < imageHeight; y++)
for(int x = 0; x < imageWidth; x++)
rotate[((imageWidth-x-1)*imageHeight)+y] = buffer[(y*imageWidth)+x];
rot = createImage(new MemoryImageSource(imageHeight, imageWidth, rotate, 0, imageHeight));
catch (Exception e)
e.printStackTrace();
return rot;
this is the code i use to scaled the image.
Image scaled = originalImage.getImage().getScaledInstance(
(int)(currentWidth * 1.5),
(int)(currentHeight * 1.5),
Image.SCALE_FAST);
I tried this method, it works and does what i want but the scrolling and loading is too slow.
public void paintComponent(Graphics g)
Graphics2D g2D = (Graphics2D)g;
g2D.rotate(Math.PI/2, (int)dimension.getWidth()/2, (int)dimension.getHeight()/2);
g2D.drawImage(image, 0,0,(int)dimension.getWidth(), (int)dimension.getHeight(), this);
Help plss.

Nvm got the answer :)

Transforming Layers and Paths at the same time

Hi
Does anyone know how I can transform(scale,perspective,distort,etc.) a layer and a path at the same time?
Thanks

1. Draw your path
2. Make it a vector mask linked to the layer you want to transform (Make layer active, then Layer>Vector Mask>Current Path)
3. Hide the path (command-H)
4. Command-T
5. Command-H again to make the path (vector mask) visible
6. Do your transform

Transforms-Scale is broken after update?

My half finished masterpiece suddenly does not work after updating to 1.1. The scaling of polygons using Transforms-Scale just does nothing.
Is it possible something changed in the update or did my cat walk on the keyboard when i wasn't looking?

Below is the class Hexagon (which I wrote)
and below that a typical instantiation
The scale and position are now (after update) as if the instantiation has a scale of 1
There are many other examples of Hexagon{}. They all now appear with a scale and position as if scale = 1.
I hope this is enough for you to get an idea.
public class Hexagon extends CustomNode {
public var p1x : Number;
public var p1y : Number;
public var strkcol : Color;
public var rotangle : Number;
public var scaler : Number;
public var StW : Number;
public var ColorIndex : Integer on replace {ColorChanger(ColorIndex)};
var p2x = p1x - 43;
var p3x = p1x + 43;
var p2y = p1y + 25;
var p3y = p1y + 75;
var p4y = p1y + 100;
var cy = p1y + 50;
bound function ColorChanger ( I : Integer) : Color {
if (I == 0)
then {
Color.LIGHTGREY
else {
if (I == 1)
then {
Main.PickedColor1
else {
if (I == 2)
then {
Main.PickedColor2
else {
if (I == 3)
then {
Main.PickedColor3
else { // I is 4
Main.PickedColor4
public override function create(): Node {
return Group {
content: [
Polygon {
points: [ p1x,p1y, p3x,p2y, p3x,p3y, p1x,p4y, p2x,p3y, p2x,p2y ];
fill: bind ColorChanger(ColorIndex);
stroke: strkcol
strokeWidth: StW
transforms: Rotate {
pivotX: p1x,
pivotY: cy,
angle: rotangle
transforms: Scale{
x: scaler,
y: scaler
hexone = Hexagon {
p1x: BigHexX
p1y: 30
ColorIndex: 1
rotangle: 0
scaler: 1.5
cursor: Cursor.HAND
onMouseClicked: function( e: MouseEvent ):Void {
colorpicker1.visible = not colorpicker1.visible;
HexagonNumber = 1;
};

On iOS 7 when I try to set a new wallpaper why can't I scale and move my photo? Anybody else having this problem?, On iOS 7 when I try to set a new wallpaper why can't I scale and move my photo? Anybody else having this problem?

On iOS 7 when I try to set a new wallpaper why can't I scale and move my photo? Why does it chop off the heads? Anybody else having this problem?

Hi CollBA,
See More Like This to the right. This issue has been discussed several times on this forum.
Cheers,
GB

I need to map my garden. I need to draw it to scale and locate plants ties to a list of plants.

I need to map my garden. I need to draw it to scale and locate plants that ties to a list of plant names.

A quick google search for gardening apps gave a surprisingly large number of hits. I saw at least three distinct garden planner apps (from $2 to $10) without half trying. These are mostly for iOS - iPad and/or iPhone - though there may be equivalents for Mac OS.
I suggest you hit the app store and start doing some searches. I suspect you'll find something appealing fairly quickly.

Transform Scale and Translate Math

Similar Messages

Maybe you are looking for