SVGをPDFに変換するためにjavascript pdfkit bowerパッケージを使用しました。 すべてうまく動作しますが、シャドウ効果はレンダリングされません。pdfkitを使って影効果をレンダリングすることは可能ですか?
<filter id="SVGID_32" y="-22%" height="144%" x="-21%" width="142%" >
<feGaussianBlur in="SourceAlpha" stdDeviation="1"></feGaussianBlur>
<feOffset dx="-2" dy="0" result="oBlur" ></feOffset>
<feFlood flood-color="rgba(0,0,0,1)"/>
<feComposite in2="oBlur" operator="in" />
<feMerge>
<feMergeNode></feMergeNode>
<feMergeNode in="SourceGraphic"></feMergeNode>
</feMerge>
</filter>
<g transform="translate(588.56 1434.18) scale(1.06 1.06)" style="filter: url(#SVGID_32);">
<text xml:space="preserve" font-family="us101" font-size="93.33333333333334" font-style="italic" font-weight="400" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(236,236,236); fill-rule: nonzero; opacity: 1; white-space: pre;" >
<tspan x="-378.71" y="29.32" >AAAAA</tspan>
</text>
</g>
(fabricjsからレンダリング)
SVGコードは、PDFファイルを生成するときに影をレンダリングした経験を持っている人はいますか? コメントありがとうございました。
UPDATE:
javascriptのコード:
doc = new PDFDocument({
layout: 'landscape',
size: [docHeight, docWidth]
});
setTimeout(function() {
var fd = new FormData();
var div = document.createElement('div');
div.innerHTML = '<svg ' + canvas.fabric.toSVG().split('<svg ')[1];
var element = div.firstChild;
SVGtoPDF(doc, element, 0, 0, { useCSS: true });
stream = doc.pipe(blobStream());
stream.on('finish', function() {
var blob = stream.toBlob('application/pdf');
fd.append("pdfimage", blob);
$.ajax({
...
});
});
doc.end();