个人中心
gpt4 book ai didi

javascript - HTML Canvas 不显示我的矩形

转载 作者：行者123 更新时间：2023-12-03 11:41:16 25 4
gpt4 key购买 nike 

 <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">


<script>
 window.onload = function(){

    var canvas = document.getElementById("map"),
        c = canvas.getContext("2d");

    c.fillStyle = "black";
    c.fillRect(0, 0, canvas.width, canvas.height);

    c.fillStyle = "red";
    c.fillRect = (20, 30, 50, 250);

    c.fillSyle = "white";
    c.fillRect = (50,50,25,25);
};
</script>

</head>

<body>
    <canvas id="map" width="800" height="400">
        <img src="images/sad dinosaur.jpg" />
        You will need an updated browser to view this page!
    </canvas>
</body>
</html>

我只是对 Canvas 进行了一些修改，试图了解它是如何工作的。但是，我正在观看的教程视频显示了 c.fillRect 和 c.fillStyle 的编码，其格式与我在代码中显示的格式完全相同，但我的屏幕仅显示第一组指令中的黑色矩形。

最佳答案

fillRect 的语法为 c.fillRect(...)，而不是 c.fillRect = (...) 。将最近两次通话与第一次通话进行比较。

此外，您最后的 fillStyle 被错误地输入为 fillSyle。

window.onload = function () {

    var canvas = document.getElementById("map"),
        c = canvas.getContext("2d");

    c.fillStyle = "black";
    c.fillRect(0, 0, canvas.width, canvas.height);

    c.fillStyle = "red";
    c.fillRect(20, 30, 50, 250);

    c.fillStyle = "white";
    c.fillRect(50, 50, 25, 25);
};

WORKING EXAMPLE

关于javascript - HTML Canvas 不显示我的矩形，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/26261611/

25 4 0
文章推荐： javascript - 使用 AJAX/jQuery 动态更改页面内容并设置哈希值
文章推荐： scala - 由with产生的集合类型
文章推荐： r - 使用 ggplot2 组合 Boxplot 和 Histogram
文章推荐： javascript - 对我的 Node js 应用程序的所有传入请求进行解码
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com