4 Replies Latest reply on Feb 17, 2012 5:20 AM by JJMack

    Ratio of square sizes


      So I'm out of my league on this math problem. I'll try to explain as simply as possible. Any help would be awesome.


      I have a template that is built on a 4200 x 4200 square. That template draws squares based on coordinates contained within that template {L,T,R,B}. The template can be applied to any document size. If that document size is not square, my ratios are off. It's obviously an issue with my math so here is the script:


      Thanks for any help you may have with my math deficiencies!!


      var wd = width of template
      var hd = height of template
      var maxWidth = (activeDocument.width);     //width of active document
      var maxHeight = parseFloat(activeDocument.height);  //height of active document
      var ratioRec = wd/hd; //aspect ratio of template  
      var ratioView = maxWidth/maxHeight; //aspect ratio of document
      var ratio = ratioView/ratioRec;
      var ratioW = maxWidth/wd; 
      var ratioT = (maxHeight/hd); 
      //Sizing variables, this is where the problem is
      var left      = (left * ratioW);
      var right     = (right  * ratioW) ;
      var top      = (top * ratioT);
      var bottom =  (bottom  * ratioT) ;

        • 1. Re: Ratio of square sizes
          JJMack Most Valuable Participant

          Square ratio is 1:1 if  you want to draw square in a none square area you would need to come up with some common denonator that devides equally into the width and height of that area and use that number as the width and height of the squares. Is my guess.


          Like for a 16"x20" area you could use 4"   there would be four colums and five rows of 4" squares


          Rags Gardner wrote a templat builder script you could use to build templates with square inside the would equalize excess pixels.  I have modified it and included a modified version in my collage toolkit


          Photo Collage Toolkit UPDATED Sept 24, 2011 added a script to replace a Populated Layered Collage Smart Object Image with an other image with resizing.

          Photoshop scripting is powerful and I believe this package demonstrates this.

          The package includes four simple rules to follow when making Photo Collage Template PSD files so they will be compatible with my Photoshop scripts.

          There are eight scripts in this package they provide the following functions:

          1. TestCollageTemplate.jsx - Used to test a Photo Collage Template while you are making it with Photoshop.
          2. CollageTemplateBuilder.jsx - Can build Templates compatible with this toolkit's scripts.
          3. LayerToAlphaChan.jsx - Used to convert a Prototype Image Layer stack into a template document.
          4. InteractivePopulateCollage.jsx - Used to interactively populate Any Photo Collage template. Offers most user control inserting pictures and text.
          5. ReplaceCollageImage.jsx - use to replace a populated collage image Smart Object layer with an other image correctly resized and positioned.
          6. PopulateCollageTemplate.jsx - Used to Automatically populate a Photo Collage template and leave the populated copy open in Photoshop.
          7. BatchOneImageCollage.jsx - Used to Automatically Batch Populate Collage templates that only have one image inserted. The Collage or Image may be stamped with text.
          8. BatchMultiImageCollage.jsx - Used to Automatically Batch Populate Any Photo Collage template with images in a source image folder. Easier to use than the interactive script. Saved collages can be tweaked.

          Note: Rags Gardner www.rags-int-inc.com Photoshop Collage Template Builder script Copyright (c) 2006 builds layered Photo Collage Template psd files. Rags's has given me permission to include a modified version of his script in my package. The modification converts Rags's layered image template document into a flattened template compatible with Photoshop "Photo Collage Toolkit" package. There is also an option that will instead create a layered image stack like Rags's templates are these are also produced if you attempt to create a template with more then 53 images.

          Photoshop only supports up to 53 Alpha channels therefore with its design the Photo Collage Toolkit can only support collages with 1 to 53 images. I do not feel this is a big limitation for if you put 53 3:2 aspect ratio images on a large 16" x 20" paper they would need to be less then 1.9" x 2.86" in size if you wanted a frame around each and less then .95" x 1.43" on a 8" x 10" year book page size.


          Documentation and Examples


          • 2. Re: Ratio of square sizes
            bungdaddy6667 Level 1

            Thanks JJMack


            So the template provides coordinates for (Left, Top, Right, Bottom)  and the template is 4200x4200


            The extension takes the template and draws that template in the activeDocument


            As long as I am working in a square activeDocument my ratio works fine. However, if I move to a longer x or y  axis my proportions of the drawn template are either too long or too wide depending on which is longer the x or the y axis. I tried this by taking percentages of the (L,T,R,B) as well an still having the same issue.


            var arrDoc = arrData[4].substring(arrData[4].indexOf('(')+1, arrData[4].indexOf(')'));
                 arrDoc = arrDoc.split(',');
             var wd     = parseFloat(arrDoc[0]); //width of template
             var hd     = parseFloat(arrDoc[1]); // height of template
             var solution = parseFloat(arrDoc[2]); //resolution of template
             var maxWidth = parseFloat(activeDocument.width)/2;    //width of active document divided in half
             var maxHeight = parseFloat(activeDocument.height);  //height of active document
              for (var i = 0; i < arrsubstr.length; i++ ) {
              var dataRec = arrsubstr[i].substring(arrsubstr[i].indexOf('(')+1, arrsubstr[i].lastIndexOf(')')).split(',');
              var left     = dataRec[1];
              var top     = dataRec[2];
              var right     = dataRec[3];
              var bottom     = dataRec[4];
              var strtRulerUnits = app.preferences.rulerUnits; 
              var strtTypeUnits = app.preferences.typeUnits; 
              app.preferences.rulerUnits = Units.PIXELS; 
              app.preferences.typeUnits = TypeUnits.PIXELS;
               var perc_tempLeft = dataRec[1]/wd
               var perc_tempTop = dataRec[2]/hd
               var perc_tempRight = dataRec[3]/wd
               var perc_tempBottom = dataRec[4]/hd
               var left = (maxWidth * perc_tempLeft);
               var right = (maxWidth * perc_tempRight);
               var top = (maxHeight * perc_tempTop);
               var bottom = (maxHeight * perc_tempBottom);
            • 3. Re: Ratio of square sizes
              bungdaddy6667 Level 1

              Just got your update, i'll look deeper into it as well. Thanks

              • 4. Re: Ratio of square sizes
                JJMack Most Valuable Participant

                If you want to tile some aspect ratio image onto a canvas you need to select a tile size that fits perfectly or the tiles will need to be cut or arranged so the grout/mat area between them will space the tiles so no cutting of the tiles is needed.  You need to pick a tile size well how many rows and colomns will fit within the canvas then evenly space the within the canvas. You asked about square tiles that a 1:1 aspect ratio.  Take a unit of measurement like 1" that a relative size when it come to a digital canvas depends on the dpi being used.  Take you first example 4200px by 4200px at 100DPI that is 42" x 42" at 200DPI that is 21"x21" at 300DPI that is 14"x14".  If you want no space grout mat the tilse must be an exact fit. With these DPI you could use 7"x7" tiles this cases the 100DPI tiles would tile 6x6 Rows and Columns, the 200DPI tiles would be 3x3 Rows and columns and the 300DPI 2x2...


                You can also use other aspect ratio tiles look at the 42"x42" Canvas concider a tile Aspect Ratio  2:3 a comon image aspect ratio and a tile sixe 2"x3" would tile perfectly be 21 columns by 12 rows portrait or 12Columns by 21 rows landscape. However 2:3 aspect ratio tile with a tiles size 4"x6" would not tile perfectly.  For 4 does not go into 42 evenly.


                A 2:3 Aspect Ratio tile will not tile perfectly in a 21" x 21" space for 2 does not go into 21 evenly there would 1 unit left that would need to be spaced out. and a 2:3 tile would not work perfectly in a 14"x14" canvas for 3 does not go into 14 evenly there would be 2 units left over the would need to be spaced out.