亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

SVG-Pfad skalieren und mit mPDF konvertieren
P粉287726308
P粉287726308 2023-08-16 17:57:54
0
1
871
<p>Hallo, ich habe Probleme mit SVG. </p> <p>Zuerst füge ich die SVG-Datei in HTML ein. Mit dem Eingabetyp ?Radio“ kann der Benutzer diese SVG-Datei skalieren (indem er ein Breitenstilattribut mit einem Prozentwert hinzufügt). Aber wenn ich es an mpdf (SVGs in JSON) sende, funktioniert es nicht. </p> <p>Dann versuche ich, die Gr??e der PDF-Datei zu berechnen, aber ich kann die Ansichtsbox/Gr??e dieser SVG-Datei nicht anpassen. </p> <p>Also das SVG, das ich bekomme, ist wie folgt: </p> <pre class="brush:html;toolbar:false;"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3. org/1999/xlink" id="svg-number" width="686.280029296875px" height="540.8900146484375px" viewBox="62.619998931884766 245 686.280029296875 540.8900146484375 " Stil ="Breite: 28 %; H?he: automatisch;">< path fill="#ffffff" id="path-svg-number" d="M277.95 252.69L277.95 785.89L171.02 785.89L171.02 347.17L62.62 271.73L277.95 252.69ZM748 .90.703.86L7 48,90 785.89L384.89 785.89L384.89 715.94L557.37 531.01Q594.73 488.16 610.47 458.68Q626.22 429.20 626.22 403.93L626 .22. 403.93Q6 26,22 370,24 608,09 348,82Q589,97 327,39 556,64 327,39L556,64 327,39Q519 ,65 327,39 500,43 352,48Q481,20 377,56 481,20 419,31L481,20 419,31L377,20 419,31L376,46 417,11Q374,63 344,97 423,89 294,98 Q473,14 245,00 6,64 245,00L556,64 245,00Q639,04 245,00 686,10 287,84Q733,15 330,69 733,15 402,10L733,15 402.10Q733.15 450.44 706.60 491.27Q680.05 532.10 618.90 598.39L618.90 598.39L524.05 702.03L524.78 703.86L748 .90 703.86Z" ></path></svg> </pre> <p>Ich m?chte es als PDF rendern, aber mit anderen Abmessungen. </p> <pre class="brush:js;toolbar:false;">function getPrintSize(container) { let renderSize = getElementSize(container); let scale = getScale(); //Gibt einen ganzzahligen Wert zurück, z. B. 33 zurückkehren { width: (renderSize.width * 100) / scale, //Zum Beispiel (159 * 100) / 24.127 = 659.013 height: (renderSize.height * 100) / scale //Zum Beispiel (125 * 100) / 24.127 = 518.092 } } </pre> <p>Dann sollte das neue SVG 659,013 Pixel x 518,092 Pixel gro? sein, aber ich kann die neuen korrekten Abmessungen nicht festlegen (mPdf unterstützt style="width: ..." nicht). Theoretisch wird dieses Tag teilweise unterstützt. aber in der Praxis wird es nicht unterstützt). </p> <p>In mPDF versuche ich es so darzustellen: </p> <pre class="brush:php;toolbar:false;">... $template .= '<td align="center" style="width: 1890px; height: 913px; Vertical-align: middle">'.$data->number.'</td>'; ... </pre> <p>Hat jemand eine Idee, wie man dieses SVG nach Pfad skalieren kann? </p>
P粉287726308
P粉287726308

Antworte allen(1)
P粉536909186

根據(jù)我的經(jīng)驗,像mPdf或DOmPDF這樣的pdf生成器往往難以處理相對的、基于百分比的值。

只要你的縮放計算按預(yù)期工作,你可以直接更改svg的寬度和高度屬性:

let svg = document.getElementById('svg-number')
scaleSVG(svg, 0.05);

function scaleSVG(svg, scale=1){
  let width = svg.width.baseVal.value;
  let height = svg.height.baseVal.value;
  
  /**
  * alternative
  let width = parseFloat(svg.getAttribute('width'));
  let height = parseFloat(svg.getAttribute('height'));
  */
  
  svg.setAttribute('width', width*scale)
  svg.setAttribute('height', height*scale)
}
svg{
  border: 1px solid red;
}
<svg xmlns="http://www.w3.org/2000/svg" id="svg-number" width="686.280029296875px" height="540.8900146484375px" viewBox="62.619998931884766 245 686.280029296875 540.8900146484375" >
  <path id="path-svg-number" d="m277.9 252.7 0 533.2-106.9 0 0-438.7-108.4 0 0-75.5 215.3-19zm471 451.2 0 82-364 0 0-70 172.5-184.9q37.3-42.8 53.1-72.3 15.7-29.5 15.7-54.8l0 0q0-33.7-18.1-55.1-18.1-21.4-51.5-21.4l0 0q-37 0-56.2 25.1-19.2 25.1-19.2 66.8l0 0-104 0-.7-2.2q-1.9-72.1 47.4-122.1 49.2-50 132.7-50l0 0q82.4 0 129.5 42.8 47 42.9 47 114.3l0 0q0 48.3-26.5 89.2-26.6 40.8-87.7 107.1l0 0-94.9 103.6.8 1.9 224.1 0z" />
</svg>

為了獲得可計算的值,你可以使用以下兩種方法之一:

let width = svg.width.baseVal.value;

或者

let width = parseFloat(svg.getAttribute('width'));

第一種方法默認(rèn)返回一個數(shù)字,并將百分比值轉(zhuǎn)換為絕對值(基于svg用戶單位)。

后者將剝離所有單位并返回純數(shù)字值。

Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage