This SVG not rendering to pdf with SVG-to_PDFKit in pdfmake

[federicosan]

Hi! I have this SVG generated by MathJax, it renders ok on chrome. pdfMake can't make it into pdf's, I have created an issue on the pdfMake repository and they told me to come to you for help.

Here is the definition and content for pdfMake as an example,

var dd = {
	content:[ { text:
     [{ svg:
          '<svg xmlns:xlink="http://www.w3.org/1999/xlink" width="12.894ex" height="2.509ex" style="vertical-align: -0.671ex;" viewBox="0 -791.3 5551.6 1080.4" role="img" focusable="false" xmlns="http://www.w3.org/2000/svg" aria-labelledby="MathJax-SVG-1-Title"><title id="MathJax-SVG-1-Title">alpha = 0.05</title><defs aria-hidden="true"><path stroke-width="1" id="E1-MJMATHI-61" d="M33 157Q33 258 109 349T280 441Q331 441 370 392Q386 422 416 422Q429 422 439 414T449 394Q449 381 412 234T374 68Q374 43 381 35T402 26Q411 27 422 35Q443 55 463 131Q469 151 473 152Q475 153 483 153H487Q506 153 506 144Q506 138 501 117T481 63T449 13Q436 0 417 -8Q409 -10 393 -10Q359 -10 336 5T306 36L300 51Q299 52 296 50Q294 48 292 46Q233 -10 172 -10Q117 -10 75 30T33 157ZM351 328Q351 334 346 350T323 385T277 405Q242 405 210 374T160 293Q131 214 119 129Q119 126 119 118T118 106Q118 61 136 44T179 26Q217 26 254 59T298 110Q300 114 325 217T351 328Z"></path><path stroke-width="1" id="E1-MJMATHI-6C" d="M117 59Q117 26 142 26Q179 26 205 131Q211 151 215 152Q217 153 225 153H229Q238 153 241 153T246 151T248 144Q247 138 245 128T234 90T214 43T183 6T137 -11Q101 -11 70 11T38 85Q38 97 39 102L104 360Q167 615 167 623Q167 626 166 628T162 632T157 634T149 635T141 636T132 637T122 637Q112 637 109 637T101 638T95 641T94 647Q94 649 96 661Q101 680 107 682T179 688Q194 689 213 690T243 693T254 694Q266 694 266 686Q266 675 193 386T118 83Q118 81 118 75T117 65V59Z"></path><path stroke-width="1" id="E1-MJMATHI-70" d="M23 287Q24 290 25 295T30 317T40 348T55 381T75 411T101 433T134 442Q209 442 230 378L240 387Q302 442 358 442Q423 442 460 395T497 281Q497 173 421 82T249 -10Q227 -10 210 -4Q199 1 187 11T168 28L161 36Q160 35 139 -51T118 -138Q118 -144 126 -145T163 -148H188Q194 -155 194 -157T191 -175Q188 -187 185 -190T172 -194Q170 -194 161 -194T127 -193T65 -192Q-5 -192 -24 -194H-32Q-39 -187 -39 -183Q-37 -156 -26 -148H-6Q28 -147 33 -136Q36 -130 94 103T155 350Q156 355 156 364Q156 405 131 405Q109 405 94 377T71 316T59 280Q57 278 43 278H29Q23 284 23 287ZM178 102Q200 26 252 26Q282 26 310 49T356 107Q374 141 392 215T411 325V331Q411 405 350 405Q339 405 328 402T306 393T286 380T269 365T254 350T243 336T235 326L232 322Q232 321 229 308T218 264T204 212Q178 106 178 102Z"></path><path stroke-width="1" id="E1-MJMATHI-68" d="M137 683Q138 683 209 688T282 694Q294 694 294 685Q294 674 258 534Q220 386 220 383Q220 381 227 388Q288 442 357 442Q411 442 444 415T478 336Q478 285 440 178T402 50Q403 36 407 31T422 26Q450 26 474 56T513 138Q516 149 519 151T535 153Q555 153 555 145Q555 144 551 130Q535 71 500 33Q466 -10 419 -10H414Q367 -10 346 17T325 74Q325 90 361 192T398 345Q398 404 354 404H349Q266 404 205 306L198 293L164 158Q132 28 127 16Q114 -11 83 -11Q69 -11 59 -2T48 16Q48 30 121 320L195 616Q195 629 188 632T149 637H128Q122 643 122 645T124 664Q129 683 137 683Z"></path><path stroke-width="1" id="E1-MJMAIN-3D" d="M56 347Q56 360 70 367H707Q722 359 722 347Q722 336 708 328L390 327H72Q56 332 56 347ZM56 153Q56 168 72 173H708Q722 163 722 153Q722 140 707 133H70Q56 140 56 153Z"></path><path stroke-width="1" id="E1-MJMAIN-30" d="M96 585Q152 666 249 666Q297 666 345 640T423 548Q460 465 460 320Q460 165 417 83Q397 41 362 16T301 -15T250 -22Q224 -22 198 -16T137 16T82 83Q39 165 39 320Q39 494 96 585ZM321 597Q291 629 250 629Q208 629 178 597Q153 571 145 525T137 333Q137 175 145 125T181 46Q209 16 250 16Q290 16 318 46Q347 76 354 130T362 333Q362 478 354 524T321 597Z"></path><path stroke-width="1" id="E1-MJMAIN-2E" d="M78 60Q78 84 95 102T138 120Q162 120 180 104T199 61Q199 36 182 18T139 0T96 17T78 60Z"></path><path stroke-width="1" id="E1-MJMAIN-35" d="M164 157Q164 133 148 117T109 101H102Q148 22 224 22Q294 22 326 82Q345 115 345 210Q345 313 318 349Q292 382 260 382H254Q176 382 136 314Q132 307 129 306T114 304Q97 304 95 310Q93 314 93 485V614Q93 664 98 664Q100 666 102 666Q103 666 123 658T178 642T253 634Q324 634 389 662Q397 666 402 666Q410 666 410 648V635Q328 538 205 538Q174 538 149 544L139 546V374Q158 388 169 396T205 412T256 420Q337 420 393 355T449 201Q449 109 385 44T229 -22Q148 -22 99 32T50 154Q50 178 61 192T84 210T107 214Q132 214 148 197T164 157Z"></path></defs><g stroke="currentColor" fill="currentColor" stroke-width="0" transform="matrix(1 0 0 -1 0 0)" aria-hidden="true"> <use xlink:href="#E1-MJMATHI-61" x="0" y="0"></use> <use xlink:href="#E1-MJMATHI-6C" x="529" y="0"></use> <use xlink:href="#E1-MJMATHI-70" x="828" y="0"></use> <use xlink:href="#E1-MJMATHI-68" x="1331" y="0"></use> <use xlink:href="#E1-MJMATHI-61" x="1908" y="0"></use> <use xlink:href="#E1-MJMAIN-3D" x="2715" y="0"></use><g transform="translate(3771,0)"> <use xlink:href="#E1-MJMAIN-30"></use> <use xlink:href="#E1-MJMAIN-2E" x="500" y="0"></use> <use xlink:href="#E1-MJMAIN-30" x="779" y="0"></use> <use xlink:href="#E1-MJMAIN-35" x="1279" y="0"></use></g></g></svg>',
         },
        ],
    margin: [ 0, 5, 0, 10 ],
    style: [ 'html-p' ] } ]
	
} 

Could you help me figure out why this is not rendering to pdf?

Thank you

[zahrafali]

I'm facing the same issue, my SVG is generated from Wiris MathType

[federicosan]

@zahrafali are you using pdfmake too? pdfmake uses SVG-to-PDFKit, but it seems that the problem is not SVG-to-PDFKit after all, check my examples on https://github.com/bpampuch/pdfmake/issues/1893 I managed to get formulas rendering on the second example. SVG needs to be striped from unnecesary blank spaces end-line symbols. You can use a function like this one const editedMath = sometext => sometext.replace(/(\r\n|\n|\r)/gm, "");

[zahrafali]

@zahrafali are you using pdfmake too? pdfmake uses SVG-to-PDFKit, but it seems that the problem is not SVG-to-PDFKit after all, check my examples on bpampuch/pdfmake#1893 I managed to get formulas rendering on the second example. SVG needs to be striped from unnecesary blank spaces end-line symbols. You can use a function like this one const editedMath = sometext => sometext.replace(/(\r\n|\n|\r)/gm, "");

@federicosan Yes, I am using pdfmake. I tried rendering your svg in SVG-to-PDFKit and it did render it, but when I try out my SVG, it doesnt render it. So I thought the issue is with SVG-to-PDFKit.

[federicosan]

@zahrafali check the issue I made in pdfmake, my issue is that and SVG inside a text object won't render, it will render if it is not inside a text object. Maybe something to do with how pdfmake is parsing text objects, not sure.

[gookinsoftware]

I had some issues with using "currentColor" and had to add a color='#000' into my

[elinake]

I have same problem, issue is the xlink:href that pdfkit can't handle even with xmlns:xlink marking.