Drawing a Rotated Rectangle

后端 未结 6 799
情歌与酒
情歌与酒 2020-12-06 17:43

I realize this might be more of a math problem.

To draw the lines for my rectangles I need to solve for their corners. I have a rectangle center at (x,y) With a def

6条回答
  •  夕颜
    夕颜 (楼主)
    2020-12-06 18:06

    use this....I got succeded...

     ctx.moveTo(defaults.x1, defaults.y1);
    
        // Rotation formula
        var x2 = (defaults.x1) + defaults.lineWidth * Math.cos(defaults.rotation * (Math.PI / 180));
        var y2 = (defaults.y1) + defaults.lineWidth * Math.sin(defaults.rotation * (Math.PI / 180));
    
        ctx.lineTo(x2, y2);
    
        x2 = (x2) + defaults.lineHeight * Math.cos((defaults.rotation + 90) * (Math.PI / 180));
        y2 = (y2) + defaults.lineHeight * Math.sin((defaults.rotation + 90) * (Math.PI / 180));
        ctx.lineTo(x2, y2);
    
        x2 = (x2) + defaults.lineWidth * Math.cos((defaults.rotation + 180) * (Math.PI / 180));
        y2 = (y2) + defaults.lineWidth * Math.sin((defaults.rotation + 180) * (Math.PI / 180));
        ctx.lineTo(x2, y2);
    
        x2 = (x2) + defaults.lineHeight * Math.cos((defaults.rotation + 270) * (Math.PI / 180));
        y2 = (y2) + defaults.lineHeight * Math.sin((defaults.rotation + 270) * (Math.PI / 180));
    

提交回复
热议问题