search

foliojs / pdfkit

A JavaScript PDF generation library for Node and the browser
http://pdfkit.org/
MIT License
9.69k stars 1.14k forks source link

Quadratic curve inaccuracy #550

Open alafr opened 7 years ago

alafr commented 7 years ago

There is a problem with the quadratic Bezier curves... The code below (copy-paste in browser demo) draws the same path twice, the second time in the reverse direction. The two paths should overlap perfectly and there should not be any visible red in the document. However, the image below shows it's not the case : there is a significant gap between the two paths.

var doc = new PDFDocument();
var stream = doc.pipe(blobStream());

doc.rect(60,60,480,480).stroke('grey')
   .path('M60,540 Q60,60 540,60')
   .stroke('red')
   .path('M540,60 Q60,60 60,540')
   .stroke('green');

doc.end();
stream.on('finish', function() {
  iframe.src = stream.toBlobURL('application/pdf');
});

image

Edit: the expected curve is the dashed, I added it as an image drawn with the html canvas

alafr commented 7 years ago

I think that the problem is in the quadraticCurveTo function. According to the PDF reference the z operator draws a kind of non-quadratic bezier curve, but I couldn't find the correct operator...