在asp.net中将三个图像组合成一个图像

Question

在我的 Web 应用程序中，我需要将 3 个图像组合成一个图像（垂直对齐）图像。我将两个图像的代码合并为单个图像，但它们并排合并。我需要上下以及如何添加第三张图片。

我在网上找到的代码：

我尝试了 2 张图片的代码：

.aspx:

<div>
    <asp:Button ID="Button1" runat="server" Text="Merge" onclick="Button1_Click"/>    
    <asp:Image ID="Image1" runat="server"  ImageUrl="~/Images/Flower2.jpg"  Height="129px" Width="210px"/><br />
    <asp:Image ID="image2" runat="server" ImageUrl="~/Images/Flower4.jpg"  Height="129px" Width="210px"/><br />       
    <asp:Image ID="MergedCombinedImage" runat="server" />
</div>

.cs

protected void Button1_Click(object sender, EventArgs e)
{
    string img1path = MapPath("~/Images/Flower2.jpg");
    string img2path = MapPath("~/Images/Flower4.jpg");         

    // Load two Images to be combined into Image Objects

    System.Drawing.Image img1= System.Drawing.Image.FromFile(img1path);
    System.Drawing.Image img2= System.Drawing.Image.FromFile(img2path);

    // Create a Resultant Image that’ll hold the above two Images
    //Here i am creating the final image with width as combined width of img1 and img2 and height as largest height among img1 and img2

    using (Bitmap FinalBitmap = new Bitmap(img1.Width + img2.Width, img2.Height > img1.Height ? img2.Height : img1.Height)) //This condition how can i add img3 
    {
        using (Graphics FinalImage = Graphics.FromImage(FinalBitmap))
        {
            // Draw the first image staring at point (0,0) with actual width and height of the image, in final image
            FinalImage.DrawImage(img1, new Rectangle(0, 0, img1.Width, img1.Height));                 
            // and Draw the second image staring at point where first image ends in the final image and save changes
            FinalImage.DrawImage(img2, img1.Width, 0);
            FinalImage.Save();
            // Write the bitmap to an image file and you’re done
            FinalBitmap.Save(MapPath("~/ResultImages/Outputimg.jpg"));
            MergedCombinedImage.ImageUrl = "~/ResultImages/Outputimg.jpg";
        }
    }
}

Answer 1

好吧，您拥有的代码正在将它并排合并。其实，这一切都是。我猜你不是自己写的，而是从某个地方抓取的。你真正需要做的只是逻辑上的一个小交换，你就完成了：

• 您实例化的新位图是两个宽度的总和，并且选择了两个图像的最大高度。您需要将其交换为最大高度和最大宽度的总和。
• 然后将第一张图像绘制为完整尺寸。这可以保持不变。
• 然后您继续在与第一张图像结束位置对应的 X 处绘制第二张图像。相反，您应该将第二个图像的起始 X 坐标设置为 0，将 Y 坐标设置为第一个图像的高度。