如何缩放n张图像以适应一定的宽度?

发布于 2024-12-04 16:33:04 字数 194 浏览 0 评论 0原文

我有 3 个图像,我想在网页上水平并排放置,它们的比例不同,我希望它们最终共享特定的高度(待计算)。假设我的页面宽度是“t”,图像的当前尺寸是 h1 x w1、h2 x w2、h3 x w3

我计算出了 2 个图像的公式,但我无法理解 3 或更多的:

(h1*h2*t) / (w1*h2 + h1*w2)

I've got 3 images I want to fit on a web page horizontally side by side, they are of various proportions and I want them to end up sharing a particular height (to be calculated). So let's say the width of my page is 't' and the current dimensions of the images are h1 x w1, h2 x w2, h3 x w3

I worked out a formula for 2 images but I can't get my head around 3 or more:

(h1*h2*t) / (w1*h2 + h1*w2)

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

懷念過去 2024-12-11 16:33:04

您必须遵守的条件是:

k1*w1 + k2*w2 + ... + kn*wn = t

其中 kn 是应用于宽度的缩放常数,以保持图像的原始比例及其新高度。

我们可以说,

kn = h_new / hn

其中 h_new 是所有图像的新高度。从那里开始,一切都是替代和隔离,

h_new*w1/h1 + h_new*w2/h2 + ... + h_new*wn/hn = t
h_new * (w1/h1 + w2/h2 + ... + wn/hn) = t
h_new = t / (w1/h1 + w2/h2 + ... + wn/hn)

我认为应该是这样,如果我完全错了,请回复! :)

The condition you must respect is:

k1*w1 + k2*w2 + ... + kn*wn = t

where kn is the scaling constant applied to the width to keep the original proportion of the image with its new height.

We can say that

kn = h_new / hn

where h_new is the new height for all images. From there it's all substitution and isolation

h_new*w1/h1 + h_new*w2/h2 + ... + h_new*wn/hn = t
h_new * (w1/h1 + w2/h2 + ... + wn/hn) = t
h_new = t / (w1/h1 + w2/h2 + ... + wn/hn)

I think that should be it, reply if I'm completely wrong! :)

无远思近则忧 2024-12-11 16:33:04

我用 javascript 编写了一个 Photoshop CS5 脚本,用于根据 @vache 的公式调整大小并保存打开的图像。希望有人觉得它有用:

var outputFolder = Folder.selectDialog("Select a folder for the output files")

if(outputFolder != null) {
    var startRulerUnits = app.preferences.rulerUnits 
    var startDisplayDialogs = app.displayDialogs
    // Set Adobe Photoshop CS5 to use pixels and display no dialogs 
    app.preferences.rulerUnits = Units.PIXELS 
    app.displayDialogs = DialogModes.NO

    do {
        var totalWidth = parseInt( prompt("How wide do they need to fit into?", 844) );
    }
    while(totalWidth <= 0 || isNaN(totalWidth));
    var DL = documents.length;
    var totalArea = 0;

    for(a=0;a<DL;a++){
        var cur = documents[a];
        totalArea += cur.width / cur.height;
    }
    var newHeight = totalWidth / totalArea;

    for(a=1;a<=DL;a++){

        activeDocument = documents[a-1];
        var AD=activeDocument;
        // bring to front
        app.activeDocument = AD;
        AD.changeMode(ChangeMode.RGB);
        var imgName= AD.name.toLowerCase();
        imgName = imgName.substr(0, imgName.length -4);
        AD.flatten();

        AD.resizeImage(null,UnitValue(newHeight,"px"),null,ResampleMethod.BICUBIC);
        //AD.resizeImage(UnitValue(newWidth,"px"),null,null,ResampleMethod.BICUBIC);

        saveForWeb(outputFolder, imgName, AD);              
    }

    // Close all the open documents 
    while (app.documents.length) {
       app.activeDocument.close(SaveOptions.DONOTSAVECHANGES)
    }
    // Reset the application preferences 
    app.preferences.rulerUnits = startRulerUnits;
    app.displayDialogs = startDisplayDialogs;
}

function saveForWeb(outputFolderStr, filename, AD)
{
    var opts, file;
    opts = new ExportOptionsSaveForWeb();
    opts.format = SaveDocumentType.JPEG;
    opts.quality = 80;
    if (filename.length > 27) {
        file = new File(outputFolderStr + "/temp.jpg");
        AD.exportDocument(file, ExportType.SAVEFORWEB, opts);
        file.rename(filename + ".jpg");
    }
    else {
        file = new File(outputFolderStr + "/" + filename + ".jpg");
        AD.exportDocument(file, ExportType.SAVEFORWEB, opts);
    }
}

I wrote a photoshop CS5 script in javascript to resize and save out the open images based on @vache's formula. Hope someone finds it useful:

var outputFolder = Folder.selectDialog("Select a folder for the output files")

if(outputFolder != null) {
    var startRulerUnits = app.preferences.rulerUnits 
    var startDisplayDialogs = app.displayDialogs
    // Set Adobe Photoshop CS5 to use pixels and display no dialogs 
    app.preferences.rulerUnits = Units.PIXELS 
    app.displayDialogs = DialogModes.NO

    do {
        var totalWidth = parseInt( prompt("How wide do they need to fit into?", 844) );
    }
    while(totalWidth <= 0 || isNaN(totalWidth));
    var DL = documents.length;
    var totalArea = 0;

    for(a=0;a<DL;a++){
        var cur = documents[a];
        totalArea += cur.width / cur.height;
    }
    var newHeight = totalWidth / totalArea;

    for(a=1;a<=DL;a++){

        activeDocument = documents[a-1];
        var AD=activeDocument;
        // bring to front
        app.activeDocument = AD;
        AD.changeMode(ChangeMode.RGB);
        var imgName= AD.name.toLowerCase();
        imgName = imgName.substr(0, imgName.length -4);
        AD.flatten();

        AD.resizeImage(null,UnitValue(newHeight,"px"),null,ResampleMethod.BICUBIC);
        //AD.resizeImage(UnitValue(newWidth,"px"),null,null,ResampleMethod.BICUBIC);

        saveForWeb(outputFolder, imgName, AD);              
    }

    // Close all the open documents 
    while (app.documents.length) {
       app.activeDocument.close(SaveOptions.DONOTSAVECHANGES)
    }
    // Reset the application preferences 
    app.preferences.rulerUnits = startRulerUnits;
    app.displayDialogs = startDisplayDialogs;
}

function saveForWeb(outputFolderStr, filename, AD)
{
    var opts, file;
    opts = new ExportOptionsSaveForWeb();
    opts.format = SaveDocumentType.JPEG;
    opts.quality = 80;
    if (filename.length > 27) {
        file = new File(outputFolderStr + "/temp.jpg");
        AD.exportDocument(file, ExportType.SAVEFORWEB, opts);
        file.rename(filename + ".jpg");
    }
    else {
        file = new File(outputFolderStr + "/" + filename + ".jpg");
        AD.exportDocument(file, ExportType.SAVEFORWEB, opts);
    }
}
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文