How to draw lines thicker than 1px

Posted on
  • This is a JS snippet how to draw lines with lineWidthh using this function:

    function fillLine(x1, y1, x2, y2, lineWidth) {
    
        var dx, dy, d;
    
        if (!lineWidth) {
            g.drawLine(x1, y1, x2, y2);
        } else {
            lineWidth = (lineWidth - 1) / 2;
            dx = x2 - x1;
            dy = y2 - y1;
            d = Math.sqrt(dx * dx + dy * dy);
            dx = Math.round(dx * lineWidth / d, 0);
            dy = Math.round(dy * lineWidth / d, 0);
    
            g.fillPoly([x1 + dx, y1 - dy, x1 - dx, y1 + dy, x2 - dx, y2 + dy, x2 + dx, y2 - dy], true);
        }
    }
    g.clear();
    
    fillLine(20, 20, 150, 150, 10);
    

    1 Attachment

    • screenshot.png
  • nice, I might need that one day :)

  • Post a reply
    • Bold
    • Italics
    • Link
    • Image
    • List
    • Quote
    • code
    • Preview
About

How to draw lines thicker than 1px

Posted by Avatar for MaBe @MaBe

Actions