You're right, fillPoly gets the rounding totally wrong. Try this:
g.drawPoly = function(p) {
g.moveTo(p[p.length-2],p[p.length-1]);
for (var i=0;i<p.length;i+=2)
g.lineTo(p[i],p[i+1]);
};
function getSquare(r,x,y) {
var poly = [];
for (var i=0;i<4;i++) {
var a = r + (i+0.5)*Math.PI*2/4;
poly.push(
x + 20*Math.sin(a),
y + 20*Math.cos(a)
);
}
return poly;
}
g.clear();
var r = 0.02;
g.fillPoly(getSquare(r,32,32));
g.drawPoly(getSquare(r,96,32));
g.flip();
That should be pretty easily fixable, and I bet it would improve the font rendering a lot.
By adding some rounding (+128) as you suggested matters can be improved a great deal. There's still a little more magic required though - in that little test I can get 3 edges of the square rendering right, but not all - so I'd definitely appreciate some input :)
Also - thanks! This code has been around since 2014ish and nobody noticed fillPoly actually had rendering errors :)
Espruino is a JavaScript interpreter for low-power Microcontrollers. This site is both a support community for Espruino and a place to share what you are working on.
You're right,
fillPoly
gets the rounding totally wrong. Try this:That should be pretty easily fixable, and I bet it would improve the font rendering a lot.
Edit: this is what's at fault: https://github.com/espruino/Espruino/blob/master/libs/graphics/graphics.c#L352
By adding some rounding (+128) as you suggested matters can be improved a great deal. There's still a little more magic required though - in that little test I can get 3 edges of the square rendering right, but not all - so I'd definitely appreciate some input :)
Also - thanks! This code has been around since 2014ish and nobody noticed
fillPoly
actually had rendering errors :)