将SVG XML转换为PNG问题

时间:2019-05-21 18:53:18

标签: php svg png imagick mamp-pro

我正在尝试使用php将SVG XML数据转换为png Blob用于Web应用程序。

我正在使用MAMP PRO。而php版本7.0.33

我在Mamp Pro中启用了Imagick的选项

   $image = new \Imagick();
   $image->readImageBlob($svgData);
   $image->setImageFormat('png');
   $imageData = base64_encode($image->getImageBlob());

我正在使用的示例SVG是一张图表,我将其包括在下面

  <svg style="overflow: hidden; position: relative;" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1362" version="1.1" height="346">
    <text transform="matrix(1,0,0,1,0,0)" style="text-anchor: end; font: normal normal normal 12px/normal 10px &quot;Arial&quot;;" x="35.84375" y="311" text-anchor="end" font="10px &quot;Arial&quot;" stroke="none" fill="#888" font-size="12px" font-family="sans-serif" font-weight="normal">
        <tspan dy="4.361538461538462">0</tspan>
    </text>
    <path transform="matrix(1,0,0,1,0,0)" fill="none" stroke="#cfcfcf" d="M48.34375,311.5H1337" stroke-width="0.5"></path>
    <text transform="matrix(1,0,0,1,0,0)" style="text-anchor: end; font: normal normal normal 12px/normal 10px &quot;Arial&quot;;" x="35.84375" y="239.5" text-anchor="end" font="10px &quot;Arial&quot;" stroke="none" fill="#888" font-size="12px" font-family="sans-serif" font-weight="normal">
        <tspan dy="4.361538461538462">7.5</tspan>
    </text>
    <path transform="matrix(1,0,0,1,0,0)" fill="none" stroke="#cfcfcf" d="M48.34375,239.5H1337" stroke-width="0.5"></path>
    <text transform="matrix(1,0,0,1,0,0)" style="text-anchor: end; font: normal normal normal 12px/normal 10px &quot;Arial&quot;;" x="35.84375" y="168" text-anchor="end" font="10px &quot;Arial&quot;" stroke="none" fill="#888" font-size="12px" font-family="sans-serif" font-weight="normal">
        <tspan dy="4.361538461538462">15</tspan>
    </text>
    <path transform="matrix(1,0,0,1,0,0)" fill="none" stroke="#cfcfcf" d="M48.34375,168.5H1337" stroke-width="0.5"></path>
    <text transform="matrix(1,0,0,1,0,0)" style="text-anchor: end; font: normal normal normal 12px/normal 10px &quot;Arial&quot;;" x="35.84375" y="96.5" text-anchor="end" font="10px &quot;Arial&quot;" stroke="none" fill="#888" font-size="12px" font-family="sans-serif" font-weight="normal">
        <tspan dy="4.361538461538462">22.5</tspan>
    </text>
    <path transform="matrix(1,0,0,1,0,0)" fill="none" stroke="#cfcfcf" d="M48.34375,96.5H1337" stroke-width="0.5"></path>
    <text transform="matrix(1,0,0,1,0,0)" style="text-anchor: end; font: normal normal normal 12px/normal 10px &quot;Arial&quot;;" x="35.84375" y="25" text-anchor="end" font="10px &quot;Arial&quot;" stroke="none" fill="#888" font-size="12px" font-family="sans-serif" font-weight="normal">
        <tspan dy="4.361538461538462">30</tspan>
    </text>
    <path transform="matrix(1,0,0,1,0,0)" fill="none" stroke="#cfcfcf" d="M48.34375,25.5H1337" stroke-width="0.5"></path>
    <text transform="matrix(1,0,0,1,0,7)" style="text-anchor: middle; font: normal normal normal 12px/normal 10px &quot;Arial&quot;;" x="1302.1714527027027" y="323.5" text-anchor="middle" font="10px &quot;Arial&quot;" stroke="none" fill="#888" font-size="12px" font-family="sans-serif" font-weight="normal">
        <tspan dy="4.361538461538462">2019-05-16</tspan>
    </text>
    <text transform="matrix(1,0,0,1,0,7)" style="text-anchor: middle; font: normal normal normal 12px/normal 10px &quot;Arial&quot;;" x="1197.6858108108108" y="323.5" text-anchor="middle" font="10px &quot;Arial&quot;" stroke="none" fill="#888" font-size="12px" font-family="sans-serif" font-weight="normal">
        <tspan dy="4.361538461538462">2019-05-13</tspan>
    </text>
    <text transform="matrix(1,0,0,1,0,7)" style="text-anchor: middle; font: normal normal normal 12px/normal 10px &quot;Arial&quot;;" x="1093.200168918919" y="323.5" text-anchor="middle" font="10px &quot;Arial&quot;" stroke="none" fill="#888" font-size="12px" font-family="sans-serif" font-weight="normal">
        <tspan dy="4.361538461538462">2019-05-10</tspan>
    </text>
    <text transform="matrix(1,0,0,1,0,7)" style="text-anchor: middle; font: normal normal normal 12px/normal 10px &quot;Arial&quot;;" x="988.714527027027" y="323.5" text-anchor="middle" font="10px &quot;Arial&quot;" stroke="none" fill="#888" font-size="12px" font-family="sans-serif" font-weight="normal">
        <tspan dy="4.361538461538462">2019-05-07</tspan>
    </text>
    <text transform="matrix(1,0,0,1,0,7)" style="text-anchor: middle; font: normal normal normal 12px/normal 10px &quot;Arial&quot;;" x="884.2288851351351" y="323.5" text-anchor="middle" font="10px &quot;Arial&quot;" stroke="none" fill="#888" font-size="12px" font-family="sans-serif" font-weight="normal">
        <tspan dy="4.361538461538462">2019-05-04</tspan>
    </text>
    <text transform="matrix(1,0,0,1,0,7)" style="text-anchor: middle; font: normal normal normal 12px/normal 10px &quot;Arial&quot;;" x="779.7432432432432" y="323.5" text-anchor="middle" font="10px &quot;Arial&quot;" stroke="none" fill="#888" font-size="12px" font-family="sans-serif" font-weight="normal">
        <tspan dy="4.361538461538462">2019-05-01</tspan>
    </text>
    <text transform="matrix(1,0,0,1,0,7)" style="text-anchor: middle; font: normal normal normal 12px/normal 10px &quot;Arial&quot;;" x="675.2576013513514" y="323.5" text-anchor="middle" font="10px &quot;Arial&quot;" stroke="none" fill="#888" font-size="12px" font-family="sans-serif" font-weight="normal">
        <tspan dy="4.361538461538462">2019-04-28</tspan>
    </text>
    <text transform="matrix(1,0,0,1,0,7)" style="text-anchor: middle; font: normal normal normal 12px/normal 10px &quot;Arial&quot;;" x="570.7719594594595" y="323.5" text-anchor="middle" font="10px &quot;Arial&quot;" stroke="none" fill="#888" font-size="12px" font-family="sans-serif" font-weight="normal">
        <tspan dy="4.361538461538462">2019-04-25</tspan>
    </text>
    <text transform="matrix(1,0,0,1,0,7)" style="text-anchor: middle; font: normal normal normal 12px/normal 10px &quot;Arial&quot;;" x="466.28631756756755" y="323.5" text-anchor="middle" font="10px &quot;Arial&quot;" stroke="none" fill="#888" font-size="12px" font-family="sans-serif" font-weight="normal">
        <tspan dy="4.361538461538462">2019-04-22</tspan>
    </text>
    <text transform="matrix(1,0,0,1,0,7)" style="text-anchor: middle; font: normal normal normal 12px/normal 10px &quot;Arial&quot;;" x="361.8006756756757" y="323.5" text-anchor="middle" font="10px &quot;Arial&quot;" stroke="none" fill="#888" font-size="12px" font-family="sans-serif" font-weight="normal">
        <tspan dy="4.361538461538462">2019-04-19</tspan>
    </text>
    <text transform="matrix(1,0,0,1,0,7)" style="text-anchor: middle; font: normal normal normal 12px/normal 10px &quot;Arial&quot;;" x="257.31503378378375" y="323.5" text-anchor="middle" font="10px &quot;Arial&quot;" stroke="none" fill="#888" font-size="12px" font-family="sans-serif" font-weight="normal">
        <tspan dy="4.361538461538462">2019-04-16</tspan>
    </text>
    <text transform="matrix(1,0,0,1,0,7)" style="text-anchor: middle; font: normal normal normal 12px/normal 10px &quot;Arial&quot;;" x="152.82939189189187" y="323.5" text-anchor="middle" font="10px &quot;Arial&quot;" stroke="none" fill="#888" font-size="12px" font-family="sans-serif" font-weight="normal">
        <tspan dy="4.361538461538462">2019-04-13</tspan>
    </text>
    <text transform="matrix(1,0,0,1,0,7)" style="text-anchor: middle; font: normal normal normal 12px/normal 10px &quot;Arial&quot;;" x="48.34375" y="323.5" text-anchor="middle" font="10px &quot;Arial&quot;" stroke="none" fill="#888" font-size="12px" font-family="sans-serif" font-weight="normal">
        <tspan dy="4.361538461538462">2019-04-10</tspan>
    </text>
    <path transform="matrix(1,0,0,1,0,0)" fill="#d68d8d" stroke="none" d="M48.34375,139.4C57.05088682432432,110.8,74.46516047297297,10.700000000000003,83.17229729729729,25C91.87943412162161,39.300000000000004,109.29370777027027,225.2,118.0008445945946,253.8C126.70798141891892,282.4,144.12225506756755,253.8,152.82939189189187,253.8C440.1649070945946,253.8,1014.8359375,253.8,1302.1714527027027,253.8C1310.878589527027,253.8,1328.2928631756756,253.8,1337,253.8L1337,311L48.34375,311Z" fill-opacity="1"></path>
    <path transform="matrix(1,0,0,1,0,0)" fill="none" stroke="#d54848" d="M48.34375,139.4C57.05088682432432,110.8,74.46516047297297,10.700000000000003,83.17229729729729,25C91.87943412162161,39.300000000000004,109.29370777027027,225.2,118.0008445945946,253.8C126.70798141891892,282.4,144.12225506756755,253.8,152.82939189189187,253.8C440.1649070945946,253.8,1014.8359375,253.8,1302.1714527027027,253.8C1310.878589527027,253.8,1328.2928631756756,253.8,1337,253.8" stroke-width="4"></path>
    <circle transform="matrix(1,0,0,1,0,0)" cx="48.34375" cy="139.4" r="6" fill="#d54848" stroke="#ffffff" stroke-width="1"></circle>
    <circle transform="matrix(1,0,0,1,0,0)" cx="83.17229729729729" cy="25" r="6" fill="#d54848" stroke="#ffffff" stroke-width="1"></circle>
    <circle transform="matrix(1,0,0,1,0,0)" cx="118.0008445945946" cy="253.8" r="6" fill="#d54848" stroke="#ffffff" stroke-width="1"></circle>
    <circle transform="matrix(1,0,0,1,0,0)" cx="152.82939189189187" cy="253.8" r="6" fill="#d54848" stroke="#ffffff" stroke-width="1"></circle>
    <circle transform="matrix(1,0,0,1,0,0)" cx="1302.1714527027027" cy="253.8" r="6" fill="#d54848" stroke="#ffffff" stroke-width="1"></circle>
    <circle transform="matrix(1,0,0,1,0,0)" cx="1337" cy="253.8" r="6" fill="#d54848" stroke="#ffffff" stroke-width="1"></circle>
    <path transform="matrix(1,0,0,1,0,0)" fill="#b4d0d6" stroke="none" d="M48.34375,177.53333333333333C57.05088682432432,139.4,74.46516047297297,15.466666666666667,83.17229729729729,25C91.87943412162161,34.53333333333334,109.29370777027027,225.2,118.0008445945946,253.8C126.70798141891892,282.4,144.12225506756755,253.8,152.82939189189187,253.8C440.1649070945946,253.8,1014.8359375,253.8,1302.1714527027027,253.8C1310.878589527027,253.8,1328.2928631756756,253.8,1337,253.8L1337,311L48.34375,311Z" fill-opacity="1"></path>
    <path transform="matrix(1,0,0,1,0,0)" fill="none" stroke="#77b7c5" d="M48.34375,177.53333333333333C57.05088682432432,139.4,74.46516047297297,15.466666666666667,83.17229729729729,25C91.87943412162161,34.53333333333334,109.29370777027027,225.2,118.0008445945946,253.8C126.70798141891892,282.4,144.12225506756755,253.8,152.82939189189187,253.8C440.1649070945946,253.8,1014.8359375,253.8,1302.1714527027027,253.8C1310.878589527027,253.8,1328.2928631756756,253.8,1337,253.8" stroke-width="4"></path>
    <circle transform="matrix(1,0,0,1,0,0)" cx="48.34375" cy="177.53333333333333" r="6" fill="#77b7c5" stroke="#ffffff" stroke-width="1"></circle>
    <circle transform="matrix(1,0,0,1,0,0)" cx="83.17229729729729" cy="25" r="6" fill="#77b7c5" stroke="#ffffff" stroke-width="1"></circle>
    <circle transform="matrix(1,0,0,1,0,0)" cx="118.0008445945946" cy="253.8" r="6" fill="#77b7c5" stroke="#ffffff" stroke-width="1"></circle>
    <circle transform="matrix(1,0,0,1,0,0)" cx="152.82939189189187" cy="253.8" r="6" fill="#77b7c5" stroke="#ffffff" stroke-width="1"></circle>
    <circle transform="matrix(1,0,0,1,0,0)" cx="1302.1714527027027" cy="253.8" r="6" fill="#77b7c5" stroke="#ffffff" stroke-width="1"></circle>
    <circle transform="matrix(1,0,0,1,0,0)" cx="1337" cy="253.8" r="6" fill="#77b7c5" stroke="#ffffff" stroke-width="1"></circle>
    <path transform="matrix(1,0,0,1,0,0)" fill="#99c97d" stroke="none" d="M48.34375,291.93333333333334C57.05088682432432,296.7,74.46516047297297,308.6166666666667,83.17229729729729,311C91.87943412162161,311,109.29370777027027,311,118.0008445945946,311C126.70798141891892,311,144.12225506756755,311,152.82939189189187,311C440.1649070945946,311,1014.8359375,311,1302.1714527027027,311C1310.878589527027,311,1328.2928631756756,311,1337,311L1337,311L48.34375,311Z" fill-opacity="1"></path>
    <path transform="matrix(1,0,0,1,0,0)" fill="none" stroke="#71c73e" d="M48.34375,291.93333333333334C57.05088682432432,296.7,74.46516047297297,308.6166666666667,83.17229729729729,311C91.87943412162161,311,109.29370777027027,311,118.0008445945946,311C126.70798141891892,311,144.12225506756755,311,152.82939189189187,311C440.1649070945946,311,1014.8359375,311,1302.1714527027027,311C1310.878589527027,311,1328.2928631756756,311,1337,311" stroke-width="4"></path>
    <circle transform="matrix(1,0,0,1,0,0)" cx="48.34375" cy="291.93333333333334" r="6" fill="#71c73e" stroke="#ffffff" stroke-width="1"></circle>
    <circle transform="matrix(1,0,0,1,0,0)" cx="83.17229729729729" cy="311" r="6" fill="#71c73e" stroke="#ffffff" stroke-width="1"></circle>
    <circle transform="matrix(1,0,0,1,0,0)" cx="118.0008445945946" cy="311" r="6" fill="#71c73e" stroke="#ffffff" stroke-width="1"></circle>
    <circle transform="matrix(1,0,0,1,0,0)" cx="152.82939189189187" cy="311" r="6" fill="#71c73e" stroke="#ffffff" stroke-width="1"></circle>
    <circle transform="matrix(1,0,0,1,0,0)" cx="1302.1714527027027" cy="311" r="6" fill="#71c73e" stroke="#ffffff" stroke-width="1"></circle>
    <circle transform="matrix(1,0,0,1,0,0)" cx="1337" cy="311" r="6" fill="#71c73e" stroke="#ffffff" stroke-width="1"></circle>
</svg>

但是渲染斑点时我得到了空白图像

0 个答案:

没有答案