canvas绘制矩形

最新推荐文章于 2024-03-27 21:00:16 发布

mb_wusuoweiju

最新推荐文章于 2024-03-27 21:00:16 发布

阅读量776

点赞数

文章标签： canvas canvas绘制矩形矩形画板

本文链接：https://blog.csdn.net/mb_wusuoweiju/article/details/80862431

版权

这篇博客分享了作者创建的一个使用鼠标事件在canvas上绘制矩形的demo。通过60行代码，作者实现了这一功能，并期待得到更多改进意见。

摘要由CSDN通过智能技术生成

今天自主性地写了一个鼠标事件控制canvas绘制矩形的demo. 感觉通过自己的思路写的demo是蛮好的, 虽然只是60行来代码. 得到了朋友的简单夸奖, 我也很开心, 这个demo肯定是有不足之处的. 望大家多多指教.

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="小白学习中" content="小白">
    <title>不为什么,只是我喜欢</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            list-style: none;
        }

        html, body {
            width: 100%;
            height: 100%;
        }

        /*canvas {
            width: 100%;
            height: 100%;
        }*/
    </style>
</head>
<body>

<canvas width="1000" height="500"></canvas>
<script>


    let myCanvas = document.querySelector('canvas');
    let isPoint = true;
    let arr = [];
    let temp = [];

    function paint(ctx, startX, startY, x, y) {
        // ctx = ctx || docu

最低0.47元/天解锁文章

mb_wusuoweiju

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
canvas绘制矩形

今天自主性地写了一个鼠标事件控制canvas绘制矩形的demo. 感觉通过自己的思路写的demo是蛮好的, 虽然只是60行来代码. 得到了朋友的简单夸奖, 我也很开心, 这个demo肯定是有不足之处的. 望大家多多指教.&lt;!DOCTYPE html&gt;&lt;html&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;m...
复制链接

扫一扫