定位如何在 cloudinary 中的叠加图像上工作?
How does positioning work on overlay image in cloudinary?
据我了解,第一张图yellow_tulip
画在左上角的(0, 0)
上。第二张图片 brown_sheep
从 (220, 140)
绘制,这是 yellow_tulip
的右下角,因为 (0, 0)
从 canvas 的左上角开始。
根据我的理解,一切都有意义,直到第三张图片开始。horses
也从 (220, 140)
开始,但它怎么从第二张图片的中心开始? brown_sheep
?我真的很困惑。
应用叠加更改时图像的尺寸会发生变化,因此在应用 x 和 y 坐标时应考虑到这一点。
坐标是从图像的中心计算的,但由于第一张图像中 canvas 的大小是 220 x 140,将棕色绵羊叠加层的坐标设置为 220 x 140 会使图像的大小加倍canvas 到 440 x 280。
意味着下面的 URL 现在是 440 x 280 https://res.cloudinary.com/demo/image/upload/w_220,h_140,c_fill/l_brown_sheep,w_220,h_140,c_fill,x_220,y_140/l_horses,w_220,h_140,c_fill/yellow_tulip.jpg
现在要将马覆盖在棕色绵羊上,您需要重新计算以下尺寸 - https://res.cloudinary.com/demo/image/upload/w_220,h_140,c_fill/l_brown_sheep,w_220,h_140,c_fill,x_220,y_140/l_horses,w_220,h_140,c_fill,x_110,y_70/yellow_tulip.jpg
据我了解,第一张图yellow_tulip
画在左上角的(0, 0)
上。第二张图片 brown_sheep
从 (220, 140)
绘制,这是 yellow_tulip
的右下角,因为 (0, 0)
从 canvas 的左上角开始。
根据我的理解,一切都有意义,直到第三张图片开始。horses
也从 (220, 140)
开始,但它怎么从第二张图片的中心开始? brown_sheep
?我真的很困惑。
应用叠加更改时图像的尺寸会发生变化,因此在应用 x 和 y 坐标时应考虑到这一点。
坐标是从图像的中心计算的,但由于第一张图像中 canvas 的大小是 220 x 140,将棕色绵羊叠加层的坐标设置为 220 x 140 会使图像的大小加倍canvas 到 440 x 280。
意味着下面的 URL 现在是 440 x 280 https://res.cloudinary.com/demo/image/upload/w_220,h_140,c_fill/l_brown_sheep,w_220,h_140,c_fill,x_220,y_140/l_horses,w_220,h_140,c_fill/yellow_tulip.jpg
现在要将马覆盖在棕色绵羊上,您需要重新计算以下尺寸 - https://res.cloudinary.com/demo/image/upload/w_220,h_140,c_fill/l_brown_sheep,w_220,h_140,c_fill,x_220,y_140/l_horses,w_220,h_140,c_fill,x_110,y_70/yellow_tulip.jpg