PHP tcpdf и UI5 Chart SVG не рендерится должным образом - PullRequest
0 голосов
/ 08 февраля 2019

Мы недавно обновили библиотеку tcpdf и у нас возникли проблемы с вставкой SVGImage в PDF.

SVG действителен и правильно отображается в SVG Online Viewer.Однако, когда tcpdf вставляет это изображение в PDF, появляется серый оттенок.Легенда диаграммы также закрыта красной рамкой.

Буду признателен, если кто-нибудь сможет помочь.

Вот мой SVG.

<svg xmlns="http://www.w3.org/2000/svg" class="v-m-root" style="left: 0px; top: 0px; direction: ltr; cursor: default; position: absolute; box-sizing: border-box;" width="1486.23" height="400"><rect class="v-eventLayer" x="0" y="0" fill-opacity="0" width="1486.23" height="400"/><g class="v-backgroundutil"><rect class="v-background-body viz-plot-background v-morphable-background" id="background-rect-4aba4d64-0297-4cc0-8ffe-8d7bb7f0cd16" x="0" y="0" width="1486.23" height="400" style="fill:transparent"/></g><defs/><g class="v-m-title" transform="translate(24, 24)"><rect class="v-bound" width="1438.23" height="17" fill="transparent"/><text class="v-title viz-title-label" text-rendering="geometricPrecision" font-family=", Arial, Helvetica, sans-serif" font-size="16px" font-weight="bold" fill="#333333" font-style="normal" text-anchor="middle" x="719.115" y="8.5" dominant-baseline="central">SAP Availability</text></g><g class="v-m-legends" transform="translate(1341.23, 49)"><g class="v-m-legend" transform="translate(0,0)"><rect class="v-bound" width="121" height="36" fill="transparent"/><g class="v-content" transform="translate(0,0)"><g class="v-groups v-label viz-legend-valueLabel" transform="translate(0,0)" font-family=", Arial, Helvetica, sans-serif" font-size="12px" font-weight="normal" fill="#000000" font-style="normal"><g class="v-legend-content"><rect class="v-indicatedRect v-legend-item v-hovershadow" visibility="hidden" width="131" x="-5" y="-3" height="18"/><g class="v-row ID_0" transform="translate(0,0)"><path class="" fill="#748cb2" stroke-width="0" stroke="transparent" opacity="1" stroke-opacity="undefined" d="M0,-6L-3,-6Q-6,-6 -6,-3L-6,3Q-6,6 -3,6L3,6Q6,6 6,3L6,-3Q6,-6 3,-6Z" transform="translate(6,6)"/><text x="18" y="12">sapprod_PRD_00</text><rect class="v-eventRect v-legend-item ID_1" height="18" fill="rgba(255, 255, 255, 0)" transform="translate(0,-3)" width="121"/></g><g class="v-row ID_1" transform="translate(0,18)"><path class="" fill="#9cc677" stroke-width="0" stroke="transparent" opacity="1" stroke-opacity="undefined" d="M0,-6L-3,-6Q-6,-6 -6,-3L-6,3Q-6,6 -3,6L3,6Q6,6 6,3L6,-3Q6,-6 3,-6Z" transform="translate(6,6)"/><text x="18" y="12">sapprod_PRD_01</text><rect class="v-eventRect v-legend-item ID_1" height="18" fill="rgba(255, 255, 255, 0)" transform="translate(0,-3)" width="121"/></g></g></g></g></g></g><g class="v-m-main" transform="translate(24, 49)"><rect class="v-bound" width="1309.23" height="327" visibility="hidden"/><g class="v-m-background" transform="translate(66.3,7.199999999999999)"><rect class="v-background-body viz-plot-background v-morphable-background" id="background-rect-51d7335a-562d-486d-aa26-b604dc5fe235" x="0" y="0" width="1242.93" height="255.60000000000002" style="fill:transparent"/><line class="v-background-border viz-plot-background-border" x1="0" y1="0" x2="0" y2="255.60000000000002" shape-rendering="crispEdges" stroke="#d8d8d8" stroke-width="1"/><line class="v-background-border viz-plot-background-border" x1="1242.93" y1="0" x2="1242.93" y2="255.60000000000002" shape-rendering="crispEdges" stroke="#d8d8d8" stroke-width="1"/><line class="v-background-border viz-plot-background-border" x1="0" y1="0" x2="1242.93" y2="0" shape-rendering="crispEdges" stroke="#d8d8d8" stroke-width="1"/><line class="v-background-border viz-plot-background-border" x1="0" y1="255.60000000000002" x2="1242.93" y2="255.60000000000002" shape-rendering="crispEdges" stroke="#d8d8d8" stroke-width="1"/></g><g class="v-m-xAxis" transform="translate(66.3,262.8)"><rect class="v-bound" width="1243.93" height="64.2" fill="transparent"/><g class="viz-axis v-axis"><g class="viz-axis-body v-body"><path class="v-categoryaxisline" d="M0 5L0 0L1242.9299999999998 0L1242.9299999999998 5" fill="none" stroke="#000000" stroke-width="1" shape-rendering="crispEdges"/><line class="v-categoryaxisline" x1="95.61" x2="95.61" y1="0" y2="5" stroke="#000000" stroke-width="1" shape-rendering="crispEdges"/><line class="v-categoryaxisline" x1="191.22" x2="191.22" y1="0" y2="5" stroke="#000000" stroke-width="1" shape-rendering="crispEdges"/><line class="v-categoryaxisline" x1="286.83" x2="286.83" y1="0" y2="5" stroke="#000000" stroke-width="1" shape-rendering="crispEdges"/><line class="v-categoryaxisline" x1="382.44" x2="382.44" y1="0" y2="5" stroke="#000000" stroke-width="1" shape-rendering="crispEdges"/><line class="v-categoryaxisline" x1="478.05" x2="478.05" y1="0" y2="5" stroke="#000000" stroke-width="1" shape-rendering="crispEdges"/><line class="v-categoryaxisline" x1="573.66" x2="573.66" y1="0" y2="5" stroke="#000000" stroke-width="1" shape-rendering="crispEdges"/><line class="v-categoryaxisline" x1="669.27" x2="669.27" y1="0" y2="5" stroke="#000000" stroke-width="1" shape-rendering="crispEdges"/><line class="v-categoryaxisline" x1="764.88" x2="764.88" y1="0" y2="5" stroke="#000000" stroke-width="1" shape-rendering="crispEdges"/><line class="v-categoryaxisline" x1="860.49" x2="860.49" y1="0" y2="5" stroke="#000000" stroke-width="1" shape-rendering="crispEdges"/><line class="v-categoryaxisline" x1="956.1" x2="956.1" y1="0" y2="5" stroke="#000000" stroke-width="1" shape-rendering="crispEdges"/><line class="v-categoryaxisline" x1="1051.71" x2="1051.71" y1="0" y2="5" stroke="#000000" stroke-width="1" shape-rendering="crispEdges"/><line class="v-categoryaxisline" x1="1147.32" x2="1147.32" y1="0" y2="5" stroke="#000000" stroke-width="1" shape-rendering="crispEdges"/><rect x="0" y="1" width="95.61" height="35.4" opacity="0" class="v-labelarea v-axis-item"/><g fill="#333333" class="v-label viz-axis-label v-morphable-label" font-size="12px" font-weight="normal" font-family=", Arial, Helvetica, sans-serif"><text pointer-events="none" x="47.805" y="18.2" dominant-baseline="middle" text-anchor="middle">05/2015</text></g><rect x="95.61" y="1" width="95.61" height="35.4" opacity="0" class="v-labelarea v-axis-item"/><g fill="#333333" class="v-label viz-axis-label v-morphable-label" font-size="12px" font-weight="normal" font-family=", Arial, Helvetica, sans-serif"><text pointer-events="none" x="143.415" y="18.2" dominant-baseline="middle" text-anchor="middle">06/2015</text></g><rect x="191.22" y="1" width="95.60999999999999" height="35.4" opacity="0" class="v-labelarea v-axis-item"/><g fill="#333333" class="v-label viz-axis-label v-morphable-label" font-size="12px" font-weight="normal" font-family=", Arial, Helvetica, sans-serif"><text pointer-events="none" x="239.02499999999998" y="18.2" dominant-baseline="middle" text-anchor="middle">07/2015</text></g><rect x="286.83" y="1" width="95.61000000000001" height="35.4" opacity="0" class="v-labelarea v-axis-item"/><g fill="#333333" class="v-label viz-axis-label v-morphable-label" font-size="12px" font-weight="normal" font-family=", Arial, Helvetica, sans-serif"><text pointer-events="none" x="334.635" y="18.2" dominant-baseline="middle" text-anchor="middle">08/2015</text></g><rect x="382.44" y="1" width="95.61000000000001" height="35.4" opacity="0" class="v-labelarea v-axis-item"/><g fill="#333333" class="v-label viz-axis-label v-morphable-label" font-size="12px" font-weight="normal" font-family=", Arial, Helvetica, sans-serif"><text pointer-events="none" x="430.245" y="18.2" dominant-baseline="middle" text-anchor="middle">09/2015</text></g><rect x="478.05" y="1" width="95.60999999999996" height="35.4" opacity="0" class="v-labelarea v-axis-item"/><g fill="#333333" class="v-label viz-axis-label v-morphable-label" font-size="12px" font-weight="normal" font-family=", Arial, Helvetica, sans-serif"><text pointer-events="none" x="525.855" y="18.2" dominant-baseline="middle" text-anchor="middle">10/2015</text></g><rect x="573.66" y="1" width="95.61000000000001" height="35.4" opacity="0" class="v-labelarea v-axis-item"/><g fill="#333333" class="v-label viz-axis-label v-morphable-label" font-size="12px" font-weight="normal" font-family=", Arial, Helvetica, sans-serif"><text pointer-events="none" x="621.4649999999999" y="18.2" dominant-baseline="middle" text-anchor="middle">11/2015</text></g><rect x="669.27" y="1" width="95.61000000000001" height="35.4" opacity="0" class="v-labelarea v-axis-item"/><g fill="#333333" class="v-label viz-axis-label v-morphable-label" font-size="12px" font-weight="normal" font-family=", Arial, Helvetica, sans-serif"><text pointer-events="none" x="717.075" y="18.2" dominant-baseline="middle" text-anchor="middle">12/2015</text></g><rect x="764.88" y="1" width="95.61000000000001" height="35.4" opacity="0" class="v-labelarea v-axis-item"/><g fill="#333333" class="v-label viz-axis-label v-morphable-label" font-size="12px" font-weight="normal" font-family=", Arial, Helvetica, sans-serif"><text pointer-events="none" x="812.685" y="18.2" dominant-baseline="middle" text-anchor="middle">01/2016</text></g><rect x="860.49" y="1" width="95.61000000000001" height="35.4" opacity="0" class="v-labelarea v-axis-item"/><g fill="#333333" class="v-label viz-axis-label v-morphable-label" font-size="12px" font-weight="normal" font-family=", Arial, Helvetica, sans-serif"><text pointer-events="none" x="908.2950000000001" y="18.2" dominant-baseline="middle" text-anchor="middle">02/2016</text></g><rect x="956.1" y="1" width="95.61000000000001" height="35.4" opacity="0" class="v-labelarea v-axis-item"/><g fill="#333333" class="v-label viz-axis-label v-morphable-label" font-size="12px" font-weight="normal" font-family=", Arial, Helvetica, sans-serif"><text pointer-events="none" x="1003.905" y="18.2" dominant-baseline="middle" text-anchor="middle">03/2016</text></g><rect x="1051.71" y="1" width="95.6099999999999" height="35.4" opacity="0" class="v-labelarea v-axis-item"/><g fill="#333333" class="v-label viz-axis-label v-morphable-label" font-size="12px" font-weight="normal" font-family=", Arial, Helvetica, sans-serif"><text pointer-events="none" x="1099.5149999999999" y="18.2" dominant-baseline="middle" text-anchor="middle">04/2016</text></g><rect x="1147.32" y="1" width="95.6099999999999" height="35.4" opacity="0" class="v-labelarea v-axis-item"/><g fill="#333333" class="v-label viz-axis-label v-morphable-label" font-size="12px" font-weight="normal" font-family=", Arial, Helvetica, sans-serif"><text pointer-events="none" x="1195.125" y="18.2" dominant-baseline="middle" text-anchor="middle">05/2016</text></g></g><g class="viz-axis-title v-title" text-anchor="middle" fill="#000000" font-size="14px" font-weight="bold" font-family=", Arial, Helvetica, sans-serif" text-rendering="geometricPrecision"><text x="621.9649999999999" y="47.4" dominant-baseline="hanging"><tspan class="v-title" dominant-baseline="hanging">Month</tspan></text></g></g></g><g class="v-m-yAxis" transform="translate(0,7.199999999999999)"><rect class="v-bound" width="66.3" height="256.60000001" fill="transparent"/><g class="viz-axis v-axis"><g class="viz-axis-body v-body" transform="translate(27.8, 0)"><line class="v-valueaxisline" x1="33" x2="38" y1="0" y2="0" stroke="#000000" stroke-width="1" shape-rendering="crispEdges"/><g fill="#333333" class="v-label viz-axis-label v-morphable-label" font-size="12px" font-weight="normal" font-family=", Arial, Helvetica, sans-serif"><text x="27" y="0" dominant-baseline="middle" text-anchor="end">100</text></g><line class="v-valueaxisline" x1="33" x2="38" y1="51.120000000000005" y2="51.120000000000005" stroke="#000000" stroke-width="1" shape-rendering="crispEdges"/><line class="v-gridline" y1="51.120000000000005" y2="51.120000000000005" x1="38" x2="1280.93" stroke="#d8d8d8" stroke-width="1" shape-rendering="crispEdges"/><g fill="#333333" class="v-label viz-axis-label v-morphable-label" font-size="12px" font-weight="normal" font-family=", Arial, Helvetica, sans-serif"><text x="27" y="51.120000000000005" dominant-baseline="middle" text-anchor="end">80</text></g><line class="v-valueaxisline" x1="33" x2="38" y1="102.24000000000001" y2="102.24000000000001" stroke="#000000" stroke-width="1" shape-rendering="crispEdges"/><line class="v-gridline" y1="102.24000000000001" y2="102.24000000000001" x1="38" x2="1280.93" stroke="#d8d8d8" stroke-width="1" shape-rendering="crispEdges"/><g fill="#333333" class="v-label viz-axis-label v-morphable-label" font-size="12px" font-weight="normal" font-family=", Arial, Helvetica, sans-serif"><text x="27" y="102.24000000000001" dominant-baseline="middle" text-anchor="end">60</text></g><line class="v-valueaxisline" x1="33" x2="38" y1="153.36" y2="153.36" stroke="#000000" stroke-width="1" shape-rendering="crispEdges"/><line class="v-gridline" y1="153.36" y2="153.36" x1="38" x2="1280.93" stroke="#d8d8d8" stroke-width="1" shape-rendering="crispEdges"/><g fill="#333333" class="v-label viz-axis-label v-morphable-label" font-size="12px" font-weight="normal" font-family=", Arial, Helvetica, sans-serif"><text x="27" y="153.36" dominant-baseline="middle" text-anchor="end">40</text></g><line class="v-valueaxisline" x1="33" x2="38" y1="204.48000000000002" y2="204.48000000000002" stroke="#000000" stroke-width="1" shape-rendering="crispEdges"/><line class="v-gridline" y1="204.48000000000002" y2="204.48000000000002" x1="38" x2="1280.93" stroke="#d8d8d8" stroke-width="1" shape-rendering="crispEdges"/><g fill="#333333" class="v-label viz-axis-label v-morphable-label" font-size="12px" font-weight="normal" font-family=", Arial, Helvetica, sans-serif"><text x="27" y="204.48000000000002" dominant-baseline="middle" text-anchor="end">20</text></g><line class="v-valueaxisline" x1="33" x2="38" y1="255.60000000000002" y2="255.60000000000002" stroke="#000000" stroke-width="1" shape-rendering="crispEdges"/><g fill="#333333" class="v-label viz-axis-label v-morphable-label" font-size="12px" font-weight="normal" font-family=", Arial, Helvetica, sans-serif"><text x="27" y="255.60000000000002" dominant-baseline="middle" text-anchor="end">0</text></g><path class="v-valueaxisline" d="M38 255.60000000000002L38 255.60000000000002L38 0L38 0" fill="none" stroke="#000000" stroke-width="1" shape-rendering="crispEdges"/></g><g class="viz-axis-title v-title" text-anchor="middle" fill="#000000" font-size="14px" font-weight="bold" font-family=", Arial, Helvetica, sans-serif" text-rendering="geometricPrecision"><text transform="rotate( -90 16.8 128.3 )" x="16.8" y="128.3" dominant-baseline="auto"><tspan class="v-title" dominant-baseline="auto">% Availability</tspan></text></g></g></g><g class="v-m-plot" transform="translate(66.3,7.199999999999999)"><rect class="v-bound" width="1242.93" height="255.60000000000002" fill="transparent"/><defs><clipPath id="clipPlot_2463"><rect width="1242.93" height="255.60000000000002"/></clipPath></defs><defs/><g class="v-datashapesgroup" fill="none" clip-path="url(#clipPlot_2463)"><g class="v-column"><g class="v-datashape" transform="translate(15.2976,0)"><rect class="v-datapoint v-morphable-datapoint" fill="#748cb2" shape-rendering="crispEdges" fill-opacity="1" stroke="none" width="30.5952" height="255.60000000000002" y="0" x="0"/></g><g class="v-datashape" transform="translate(49.71719999999999,0)"><rect class="v-datapoint v-morphable-datapoint" fill="#9cc677" shape-rendering="crispEdges" fill-opacity="1" stroke="none" width="30.5952" height="255.60000000000002" y="0" x="0"/></g></g><g class="v-column"><g class="v-datashape" transform="translate(110.9076,0)"><rect class="v-datapoint v-morphable-datapoint" fill="#748cb2" shape-rendering="crispEdges" fill-opacity="1" stroke="none" width="30.5952" height="255.60000000000002" y="0" x="0"/></g><g class="v-datashape" transform="translate(145.32719999999998,0)"><rect class="v-datapoint v-morphable-datapoint" fill="#9cc677" shape-rendering="crispEdges" fill-opacity="1" stroke="none" width="30.5952" height="255.60000000000002" y="0" x="0"/></g></g><g class="v-column"><g class="v-datashape" transform="translate(206.5176,0)"><rect class="v-datapoint v-morphable-datapoint" fill="#748cb2" shape-rendering="crispEdges" fill-opacity="1" stroke="none" width="30.5952" height="255.60000000000002" y="0" x="0"/></g><g class="v-datashape" transform="translate(240.9372,0)"><rect class="v-datapoint v-morphable-datapoint" fill="#9cc677" shape-rendering="crispEdges" fill-opacity="1" stroke="none" width="30.5952" height="255.60000000000002" y="0" x="0"/></g></g><g class="v-column"><g class="v-datashape" transform="translate(302.1276,0)"><rect class="v-datapoint v-morphable-datapoint" fill="#748cb2" shape-rendering="crispEdges" fill-opacity="1" stroke="none" width="30.5952" height="255.60000000000002" y="0" x="0"/></g><g class="v-datashape" transform="translate(336.5472,0)"><rect class="v-datapoint v-morphable-datapoint" fill="#9cc677" shape-rendering="crispEdges" fill-opacity="1" stroke="none" width="30.5952" height="255.60000000000002" y="0" x="0"/></g></g><g class="v-column"><g class="v-datashape" transform="translate(397.7376,0)"><rect class="v-datapoint v-morphable-datapoint" fill="#748cb2" shape-rendering="crispEdges" fill-opacity="1" stroke="none" width="30.5952" height="255.60000000000002" y="0" x="0"/></g><g class="v-datashape" transform="translate(432.1572,0)"><rect class="v-datapoint v-morphable-datapoint" fill="#9cc677" shape-rendering="crispEdges" fill-opacity="1" stroke="none" width="30.5952" height="255.60000000000002" y="0" x="0"/></g></g><g class="v-column"><g class="v-datashape" transform="translate(493.3476,0)"><rect class="v-datapoint v-morphable-datapoint" fill="#748cb2" shape-rendering="crispEdges" fill-opacity="1" stroke="none" width="30.5952" height="255.60000000000002" y="0" x="0"/></g><g class="v-datashape" transform="translate(527.7672,0)"><rect class="v-datapoint v-morphable-datapoint" fill="#9cc677" shape-rendering="crispEdges" fill-opacity="1" stroke="none" width="30.5952" height="255.60000000000002" y="0" x="0"/></g></g><g class="v-column"><g class="v-datashape" transform="translate(588.9576,0)"><rect class="v-datapoint v-morphable-datapoint" fill="#748cb2" shape-rendering="crispEdges" fill-opacity="1" stroke="none" width="30.5952" height="255.60000000000002" y="0" x="0"/></g><g class="v-datashape" transform="translate(623.3771999999999,0)"><rect class="v-datapoint v-morphable-datapoint" fill="#9cc677" shape-rendering="crispEdges" fill-opacity="1" stroke="none" width="30.5952" height="255.60000000000002" y="0" x="0"/></g></g><g class="v-column"><g class="v-datashape" transform="translate(684.5676,0)"><rect class="v-datapoint v-morphable-datapoint" fill="#748cb2" shape-rendering="crispEdges" fill-opacity="1" stroke="none" width="30.5952" height="255.60000000000002" y="0" x="0"/></g><g class="v-datashape" transform="translate(718.9871999999999,0)"><rect class="v-datapoint v-morphable-datapoint" fill="#9cc677" shape-rendering="crispEdges" fill-opacity="1" stroke="none" width="30.5952" height="255.60000000000002" y="0" x="0"/></g></g><g class="v-column"><g class="v-datashape" transform="translate(780.1776,0)"><rect class="v-datapoint v-morphable-datapoint" fill="#748cb2" shape-rendering="crispEdges" fill-opacity="1" stroke="none" width="30.5952" height="255.60000000000002" y="0" x="0"/></g><g class="v-datashape" transform="translate(814.5971999999999,0)"><rect class="v-datapoint v-morphable-datapoint" fill="#9cc677" shape-rendering="crispEdges" fill-opacity="1" stroke="none" width="30.5952" height="255.60000000000002" y="0" x="0"/></g></g><g class="v-column"><g class="v-datashape" transform="translate(875.7876,0)"><rect class="v-datapoint v-morphable-datapoint" fill="#748cb2" shape-rendering="crispEdges" fill-opacity="1" stroke="none" width="30.5952" height="255.60000000000002" y="0" x="0"/></g><g class="v-datashape" transform="translate(910.2072,0)"><rect class="v-datapoint v-morphable-datapoint" fill="#9cc677" shape-rendering="crispEdges" fill-opacity="1" stroke="none" width="30.5952" height="255.60000000000002" y="0" x="0"/></g></g><g class="v-column"><g class="v-datashape" transform="translate(971.3976,0)"><rect class="v-datapoint v-morphable-datapoint" fill="#748cb2" shape-rendering="crispEdges" fill-opacity="1" stroke="none" width="30.5952" height="255.60000000000002" y="0" x="0"/></g><g class="v-datashape" transform="translate(1005.8172,0)"><rect class="v-datapoint v-morphable-datapoint" fill="#9cc677" shape-rendering="crispEdges" fill-opacity="1" stroke="none" width="30.5952" height="255.60000000000002" y="0" x="0"/></g></g><g class="v-column"><g class="v-datashape" transform="translate(1067.0076000000001,0)"><rect class="v-datapoint v-morphable-datapoint" fill="#748cb2" shape-rendering="crispEdges" fill-opacity="1" stroke="none" width="30.5952" height="255.60000000000002" y="0" x="0"/></g><g class="v-datashape" transform="translate(1101.4272,0)"><rect class="v-datapoint v-morphable-datapoint" fill="#9cc677" shape-rendering="crispEdges" fill-opacity="1" stroke="none" width="30.5952" height="255.60000000000002" y="0" x="0"/></g></g><g class="v-column"><g class="v-datashape" transform="translate(1162.6176,0)"><rect class="v-datapoint v-morphable-datapoint" fill="#748cb2" shape-rendering="crispEdges" fill-opacity="1" stroke="none" width="30.5952" height="255.60000000000002" y="0" x="0"/></g><g class="v-datashape" transform="translate(1197.0372,0)"><rect class="v-datapoint v-morphable-datapoint" fill="#9cc677" shape-rendering="crispEdges" fill-opacity="1" stroke="none" width="30.5952" height="255.60000000000002" y="0" x="0"/></g></g></g></g></g></svg>

Вот как выглядит изображение в PDF

SVG

На нем не должно быть ни серого фона, ни красной рамкивокруг легенды.

Спасибо

Мартин

...