JSPDF不将SVG作为DOM元素
我在React Js中使用JSPDF。我在A< svg>中挂上一些内容和图纸。当我想渲染PDF时,SVG中的所有内容都不会呈现。是否有任何解决方案可以解决此问题或将SVG导出到PDF?我希望PDF内的文本也可以选择,我不想仅仅将SVG转换为图片并将其丢弃到PDF中,这不是解决方案。以下是我不起作用的代码
import React from 'react'
import jsPDF from 'jspdf'
const About = () => {
const downloadPDF = () => {
let doc = new jsPDF("p","pt","a4")
doc.html(document.querySelector("#graph"), {
callback: function(pdf){
pdf.save("doc.pdf");
}
})
}
return (
<div id = "graph">
Some text // {/*This is rendered */}
<h1>some title</h1> {/*This is rendered */}
<svg width="500" height="500"> {/*This is not rendered */}
<circle cx="50" cy="80" r={radius} stroke="rgb(0,125,225)" stroke-width="2" fill="red"/>
</svg>
</div>
)
}
export default About
I am using jsPDF in React js. I am crating some content and drawings inside a <svg>. When I want to render the pdf, everything inside the SVG is not rendered. Is there any solution to solve this or another one to export the SVG to pdf? I want the text inside the pdf to be selectable as well, I don't want just to transform the SVG into a picture and drop it into a pdf, that is not a solution. Below is my code that is not working
import React from 'react'
import jsPDF from 'jspdf'
const About = () => {
const downloadPDF = () => {
let doc = new jsPDF("p","pt","a4")
doc.html(document.querySelector("#graph"), {
callback: function(pdf){
pdf.save("doc.pdf");
}
})
}
return (
<div id = "graph">
Some text // {/*This is rendered */}
<h1>some title</h1> {/*This is rendered */}
<svg width="500" height="500"> {/*This is not rendered */}
<circle cx="50" cy="80" r={radius} stroke="rgb(0,125,225)" stroke-width="2" fill="red"/>
</svg>
</div>
)
}
export default About
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论