管理端后台返回的图片有两张如何显示一张

可以考虑将这两张图片合并成一张图片后再进行显示。可以使用Python中的Pillow库来实现图片合并。以下是一个简单的示例代码：

from PIL import Image

# 打开两张图片
img1 = Image.open('image1.jpg')
img2 = Image.open('image2.jpg')

# 获取两张图片的尺寸
width1, height1 = img1.size
width2, height2 = img2.size

# 创建一张新的图片，大小为两张图片的宽度之和和高度中的最大值
new_img = Image.new('RGB', (width1 + width2, max(height1, height2)))

# 将第一张图片复制到新图片的左边
new_img.paste(img1, (0, 0))

# 将第二张图片复制到新图片的右边
new_img.paste(img2, (width1, 0))

# 显示新图片
new_img.show()

在上面的代码中，我们首先打开了两张图片，并获取了它们的尺寸。然后，我们创建了一张新的图片，大小为两张图片的宽度之和和高度中的最大值。接着，我们将第一张图片复制到新图片的左边，将第二张图片复制到新图片的右边。最后，我们显示了新图片。你可以将上面的代码放到你的程序中，根据实际需求进行修改。

相关问题

管理端后台接口返回的图片有两张如何再页面只显示一张

如果你使用的是前端框架（如Vue.js、React等），可以在接收到后端返回的两张图片后，只渲染其中一张图片的HTML元素，另外一张图片可以不渲染。

以下是一个使用Vue.js框架的示例代码：

<template>
  <div>
    <img :src="imageSrc" alt="Image">
  </div>
</template>

<script>
export default {
  data() {
    return {
      imageSrc: '' // 图片地址
    }
  },
  methods: {
    // 获取图片
    getImage() {
      // 发送请求获取图片
      // 假设返回的图片地址为image1.jpg和image2.jpg
      axios.get('/api/getImage')
        .then(res => {
          // 只渲染第一张图片
          this.imageSrc = res.data[0].src
        })
        .catch(err => {
          console.log(err)
        })
    }
  }
}
</script>

在上面的代码中，我们定义了一个`<img>`元素来显示图片。在`getImage()`方法中，我们发送请求获取图片，假设返回的图片地址为`image1.jpg`和`image2.jpg`。在获取到图片后，我们只渲染了第一张图片，将其赋值给`imageSrc`变量，第二张图片则不显示。

你可以将上面的代码根据实际需求进行修改，例如如何处理请求失败等情况。

后台返回一张水印图片一张正常图片 前端怎么把水印图片覆盖在正常图片上 js代码实现

可以使用HTML5的canvas将两张图片合并成一张带水印的图片。以下是实现代码：

// 创建一个canvas元素
var canvas = document.createElement("canvas");

// 设置canvas的宽度和高度
canvas.width = normalImg.width;
canvas.height = normalImg.height;

// 获取canvas的绘图上下文
var ctx = canvas.getContext("2d");

// 在canvas上绘制正常图片
ctx.drawImage(normalImg, 0, 0);

// 在canvas上绘制水印图片
ctx.drawImage(watermarkImg, 0, 0);

// 获取合成后的图片
var mergedImg = canvas.toDataURL("image/png");

// 将合成后的图片显示在页面上
document.getElementById("mergedImg").src = mergedImg;

其中，normalImg和watermarkImg分别是正常图片和水印图片的Image对象，"mergedImg"是显示合成后的图片的img元素的id。