Question

我有一个类似

的json字符串

$ json =＆＃39; {＆＃34; objects＆＃34;：[{＆＃34; type＆＃34;：＆＃34; i-text＆＃34;，＆＃34; originX＆＃34; ：＆＃34;左＆＃34;＆＃34; originY＆＃34;：＆＃34;顶部＆＃34;＆＃34;左＆＃34;：67.1，＆＃34;顶部＆＃34;：279.68，＆＃34;宽度＆＃34;：99.85＆＃34;高度＆＃34;：32.77＆＃34;填充＆＃34;：＆＃34;＃f1e3e5＆＃34;＆＃34;中风＆＃34 ;:空，＆＃34; strokeWidth＆＃34;：1，＆＃34; strokeDashArray＆＃34;：空，＆＃34; strokeLineCap＆＃34;：＆＃34;对接＆＃34;＆＃34; strokeLineJoin＆＃34; ：＆＃34;斜切＆＃34;＆＃34; strokeMiterLimit＆＃34;：10，＆＃34;将scaleX＆＃34;：1，＆＃34;的scaleY＆＃34;：1，＆＃34;角＆＃34 ;：0，＆＃34; flipX＆＃34;：假，＆＃34; flipY＆＃34;：假，＆＃34;不透明度＆＃34;：1，＆＃34;阴影＆＃34;：空，＆＃ 34;可见＆＃34;：真，＆＃34; clipTo＆＃34;：空，＆＃34;的backgroundColor＆＃34;：＆＃34;＆＃34;＆＃34; fillRule＆＃34;：＆＃34 ;非零＆＃34;＆＃34; globalCompositeOperation＆＃34;：＆＃34;源极 - 在＆＃34;＆＃34; transformMatrix＆＃34;：空，＆＃34;文本＆＃34;：＆＃34;我的文字＆＃34;，＆＃34; fontSize＆＃34;：25，＆＃34; fontWeight＆＃34;：＆＃34;普通＆＃34;，＆＃34; fontFamily＆＃34;：＆＃34; otf＆＃ 34;，＆＃34; fontStyle＆＃34;：＆＃34;＆＃34;＆＃34; lineHeight是＆＃34;：1.16，＆＃34; textDecoration＆＃34;：＆＃34;＆＃34;＆＃34; textAlign设置＆＃34;：＆＃34;左＆＃34;＆＃34; TEXTBACKGROUNDCOLOR＆＃34;：＆＃34;＆＃34;＆＃34;样式＆＃ 34;：{}}]，＆＃34;背景＆＃34;：＆＃34;＃FFF＆＃34;＆＃34;和backgroundImage＆＃34; {＆＃34;类型＆＃34;：＆＃34;图像＆＃34;＆＃34; originX＆＃34;：＆＃34;左＆＃34;＆＃34; originY＆＃34;：＆＃34;顶部＆＃34;＆＃34;左＆＃34 ;: 0，＆＃34;顶部＆＃34;：0，＆＃34;宽度＆＃34;：230，＆＃34;高度＆＃34;：473.17＆＃34;填充＆＃34;：＆＃34; RGB（ 0,0,0）＆＃34;＆＃34;中风＆＃34;：空，＆＃34; strokeWidth＆＃34;：1，＆＃34; strokeDashArray＆＃34;：空，＆＃34; strokeLineCap＆＃ 34;：＆＃34;对接＆＃34;＆＃34; strokeLineJoin＆＃34;：＆＃34;斜切＆＃34;＆＃34; strokeMiterLimit＆＃34;：10，＆＃34;将scaleX＆＃34 ;: 1，＆＃34;的scaleY＆＃34;：1，＆＃34;角＆＃34;：0，＆＃34; flipX＆＃34;：假，＆＃34; flipY＆＃34;：假，＆＃34;不透明度＆＃34;：1，＆＃34;阴影＆＃34;：空，＆＃34;可见＆＃34;：真，＆＃34; clipTo＆＃34;：空，＆＃34;的backgroundColor＆＃34;：＆＃34;＆＃34;＆＃34; fillRule＆＃34;：＆＃34;非零＆＃34;＆＃34; globalCompositeOperation＆＃34;：＆＃34;源极 - 在＆＃34;＆＃34; transformMatrix＆＃34;：空，＆＃34; SRC＆＃34;：＆＃34; http://localhost/ohmyfabriq/resources/templates/bg/20160216082540-bg.png＆＃34;＆＃34;过滤器＆＃34;：[]，＆＃34; crossOrigin＆＃34; ：＆＃34;＆＃34 ;, ＆＃34; ALIGNX＆＃34;：＆＃34;无＆＃34;＆＃34; alignY＆＃34;：＆＃34;无＆＃34;＆＃34; meetOrSlice＆＃34;：＆＃34;满足＆＃34;}}＆＃39 ;;

这是画布数据，我想将其保存为php中的图像。这可能吗？任何人都可以帮助我吗？

Answer 1

是肯定的。我们可以

您可以使用json-decode http://php.net/manual/en/function.json-decode.php

$image = json_decode($json)

然后分析该数组对象以获取图像链接和属性

Answer 2

是的！您可以使用Imagick驱动程序（服务器端，即使用PHP）将json转换为jpeg / png。

创建一个文件命名为test.html
{ “ width”：“ 2790”， “身高”：“ 4560”， “ json_data”：{ “对象”：[{ “ type”：“ image”， “ originX”：“左”， “ originY”：“ top”， “ left”：“ 5”， “ top”：“ 105”， “ width”：“ 260”， “ height”：“ 260”， “ scaleX”：“ 1”， “ scaleY”：“ 1”， “ angle”：“ 0”， “ opacity”：“ 1”， “ src”：“ http://example/fab/map.png” }，{ “ type”：“ image”， “ originX”：“左”， “ originY”：“ top”， “ left”：“ 5”， “ top”：“ 229.5”， “ width”：“ 260”， “ height”：“ 11”， “ scaleX”：“ 1”， “ scaleY”：“ 1”， “ angle”：“ 0”， “ opacity”：“ 1”， “ src”：“ http://example/fab/outlined.co_logo.png” }，{ “ type”：“ image”， “ originX”：“左”， “ originY”：“ top”， “ left”：“ 51.07”， “ top”：“ 135.58”， “ width”：“ 260”， “ height”：“ 11”， “ scaleX”：“ 1”， “ scaleY”：“ 1”， “ angle”：“ 47.41”， “ opacity”：“ 1”， “ src”：“ http://example/fab/outlined.png” }，{ “ type”：“ image”， “ originX”：“左”， “ originY”：“ top”， “ left”：“ 139.71”， “ top”：“ 104.97”， “ width”：“ 260”， “ height”：“ 11”， “ scaleX”：“ 1”， “ scaleY”：“ 1”， “ angle”：“ 89.65”， “ opacity”：“ 1”， “ src”：“ http://example/fab/permission.png” }，{ “ type”：“ image”， “ originX”：“左”， “ originY”：“ top”， “ left”：“ 230.78”， “ top”：“ 146.93”， “ width”：“ 260”， “ height”：“ 11”， “ scaleX”：“ 1”， “ scaleY”：“ 1”， “ angle”：“ 134.98”， “ src”：“ http://example/fab/rocket.png” }，{ “ type”：“ image”， “ originX”：“左”， “ originY”：“ top”， “ left”：“ 265.01”， “ top”：“ 240.19”， “ width”：“ 260”， “ height”：“ 11”， “ scaleX”：“ 1”， “ scaleY”：“ 1”， “ angle”：“ 179.86”， “ opacity”：“ 1”， “ src”：“ http://example/fab/speed.png” }]， “ background”：“＃FF00FF” }}

//服务器端代码

     <?php

    error_reporting(E_ALL | E_STRICT);

    try {
        $id = $_GET['id']; // Design ID

        define('DS', DIRECTORY_SEPARATOR);

        $jsonDir   = dirname(__FILE__) . DS . 'media' . DS . 'designs';
        $printData = json_decode(file_get_contents('test.html'));
    }
    catch (Exception $e) {
        echo $e->getMessage();
    }
try {
    $print      = new Imagick();
    // $print->setResolution(200, 200);
    $background = (empty($printData->json_data->background)) ? 'transparent' : $printData->json_data->background;

    $print->newImage($printData->width, $printData->height, new ImagickPixel($background));

    $print->setImageFormat('png32');
    $print->setImageUnits(imagick::RESOLUTION_PIXELSPERCENTIMETER);
}
catch (Exception $e) {
    echo $e->getMessage();
}

// Re-Scaling each Image/Text for Larger Canvas/Image 
foreach ($printData->json_data->objects as $i => $object) {

    if ($object->type == 'image') {
        addImage($object, $print, $printData);
    } else {
        addText($object, $print, $printData);
    }
}

try {
    // Saving High Quality Image in (300 dpi)
    $fileDir = 'canvadata';
    $saved   = $print->writeimage($fileDir . '/test.png');
    header('Content-type: image/png');
    echo $print;
}
catch (Exception $e) {
    echo $e->getMessage();
}

function addImage($object, $print, $printData)
{

    try {
        $widthScale  = ($printData->width / 270);
        $heightScale = ($printData->height / 470);
        $fileDir     = 'canvadata/';
        $src         = new Imagick($fileDir . basename($object->src));

        $size = $src->getImageGeometry();

        $resizeWidth  = ($object->width * $object->scaleX) * $widthScale;
        $resizeHeight = ($object->height * $object->scaleY) * $heightScale;
        $src->resizeImage($resizeWidth, $resizeHeight, Imagick::FILTER_LANCZOS, 1);
        $sizeAfterResize = $src->getImageGeometry();

        $src->rotateImage(new ImagickPixel('none'), $object->angle);
        $sizeAfterRotate = $src->getImageGeometry();


        if (!$object->angle) {
            $left = $object->left * $widthScale;
            $top  = $object->top * $heightScale;
        } else {

            switch ($object->angle) {
                case $object->angle > 315:
                    $left = ($object->left * $widthScale);
                    $top  = ($object->top * $heightScale);
                    break;
                case $object->angle > 270:
                    $left = ($object->left * $widthScale);
                    $top  = ($object->top * $heightScale);

                    break;
                case $object->angle > 225:
                    $left = ($object->left * $widthScale);
                    $top  = ($object->top * $heightScale);
                    break;
                case $object->angle > 180:
                    $left = ($object->left * $widthScale);
                    $top  = ($object->top * $heightScale);
                    break;
                case $object->angle > 135:
                    $left = ($object->left * $widthScale);
                    $top  = ($object->top * $heightScale);
                    break;
                case $object->angle > 90:
                    $left = ($object->left * $heightScale) - ($sizeAfterRotate['width'] / 2);
                    $top  = ($object->top * $heightScale) - ($sizeAfterRotate['width'] / 2);
                    break;
                case $object->angle > 45:
                    $left = ($object->left * $widthScale) - $size['height'] * $widthScale;
                    $top  = ($object->top * $heightScale) - $size['height'] * $heightScale;
                    break;

                default:
                    $left = $object->left * $widthScale;
                    $top  = $object->top * $heightScale;

                    break;
            }
        }

        $print->compositeImage($src, Imagick::COMPOSITE_DEFAULT, $left, $top);
    }
    catch (Exception $e) {
        echo $e->getMessage();
    }
}

我们可以将json字符串转换为php

2 个答案: