Question

我开发了一个函数来使用拖动点扭曲PNG标识（使用此函数：http://codepen.io/fta/pen/ifnqH）。标识本身是带有拖动点的div内的图像。

稍后可以使用Imagick模块使用PHP + Image Magick将此标识生成为图像。标识可以是圆形，窄形或任何形状，但图像总是以1：1的比例（例如：800x800）填充透明度。

现在问题：

我总是希望标识的比例为1：1，关于拖动区域的宽度或宽度（我不希望标识本身被拉伸）。虽然，图像本身可能会扭曲。

顶部的图片说明了它现在是如何工作的，底部的图像是如何让它工作的

http://i.stack.imgur.com/Ev0H8.jpg

最重要的是，这应该适用于使用Image Magick + PHP生成的图像。如果可以使用拖动点使其在客户端工作......这是一个奖励。

我知道如何使用$image->trimImage(0);

获取标识的实际大小

我应该能够以额外的透明度（x或y轴）填充图像的边缘以补偿拉伸，但这只是到目前为止我来了。

这是我的PHP函数，用于拉伸或缩放标识

public function generate($file, $watermark, $offset = array()) {

        $file = rtrim(DIR_IMAGE . str_replace(array('../', '..\\', '..'), '', $file));
        $watermark = rtrim(DIR_IMAGE . str_replace(array('../', '..\\', '..'), '', $watermark));
        $width = (int)$this->config->get('config_image_popup_width');
        $height = (int)$this->config->get('config_image_popup_height');

        if (is_file($file) && is_file($watermark)) {

            $top = (int)$offset['top'];
            $left = (int)$offset['left'];
            $opacity = (float)$offset['opacity'];
            $new_width = (int)$offset['width'];
            $new_height = (int)$offset['height'];

            $topleft_y = (float)$offset['transform_topleft_y'];
            $topleft_x = (float)$offset['transform_topleft_x'];
            $topright_y = (float)$offset['transform_topright_y'];
            $topright_x = (float)$offset['transform_topright_x'];
            $bottomleft_y = (float)$offset['transform_bottomleft_y'];
            $bottomleft_x = (float)$offset['transform_bottomleft_x'];
            $bottomright_y = (float)$offset['transform_bottomright_y'];
            $bottomright_x = (float)$offset['transform_bottomright_x'];

            $image = new ImageMagick($file);
            $watermark = new ImageMagick($watermark);

            // Resize the product image
            $image->resize($width, $height);

            // Perspective has not changed, scale only
            if ($topleft_y == 0 && $topleft_x == 0 && $topright_y == 0 && $bottomleft_x == 0 && $topright_x == $bottomleft_y && $bottomleft_y == $bottomright_y && $bottomright_y == $bottomright_x) {
                $watermark->scale($new_width, $new_height);
            } else {
                $watermark->perspective($offset);
            }

            $watermark->opacity($opacity);
            $image->composite($watermark->get(), $left, $top);
            return $image->base64output(100);

        }

想象力扭曲保持透视

0 个答案: