當前位置：首頁 > 编程资源 > 编程问答 >内容正文

编程问答

canvas绘制三角形

發布時間：2024/4/17 编程问答 37 豆豆

生活随笔收集整理的這篇文章主要介紹了 canvas绘制三角形小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

效果圖

html結構

????

<!DOCTYPE html>

<html>

<head>

<title>canvas2</title>

</head>

<body>

當前瀏覽器不支持canvas,請更換瀏覽器后再試

</canvas>

</body>

</html>

js腳本

?? ?<script>

window.onload = function(){

var canvas = document.getElementById('canvas');

canvas.width = 800;

canvas.height = 800;

var context = canvas.getContext('2d');

context.beginPath();

context.moveTo(100,100);

context.lineTo(700,700);

context.lineTo(100,700);

context.lineTo(100,100);

context.closePath();

context.lineWidth = 10;

context.strokeStyle = "#058";

context.stroke();

}

</script>

轉載于:https://blog.51cto.com/suyanzhu/1892680

以上是生活随笔為你收集整理的canvas绘制三角形的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。