canvas绘制小丑

说明:

借鉴博主基于canvas绘制一个爱心(10行代码就够了) - 掘金 (juejin.cn)

代码实现

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
    <style>
        *{
            margin:0;
            padding: 0;
        }
        #canvas{
            border:1px solid #000;
        }
    </style>

</head>
<body>
    <!-- canvas画布 -->
    <canvas id="canvas" width="800" height="600"></canvas>
    <script>
        $(function () {

        let canvas = $('#canvas');
        let ctx  = canvas.get(0).getContext('2d')
        // 文字大小
        ctx.font='100px 微软雅黑'
        ctx.fillStyle = 'pink'
        //ctx.fillText('❤',300,300)
        ctx.fillText('🤡',300,300)

        })


    </script>
</body>
</html>

结果展示:

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.kler.cn/a/157596.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

【新手解答8】深入探索 C 语言:递归与循环的应用

C语言的相关问题解答 写在最前面问题&#xff1a;探索递归与循环在C语言中的应用解析现有代码分析整合循环示例代码修改注意事项结论 延伸&#xff1a;递归和循环的退出条件设置解析使用递归使用循环选择适合的方法 写在最前面 一位粉丝私信交流&#xff0c;回想起了当初的我C…

spring cloud nacos整合gateway

文章目录 gateway快速入门创建gateway服务&#xff0c;引入依赖编写启动类编写基础配置和路由规则重启测试网关路由的流程图 断言工厂过滤器工厂路由过滤器的种类请求头过滤器默认过滤器总结 全局过滤器全局过滤器作用自定义全局过滤器过滤器执行顺序 跨域问题什么是跨域问题解…

十五、机器学习进阶知识:K-Means聚类算法

文章目录 1、聚类概述2、K-Means聚类算法原理3、K-Means聚类实现3.1 基于SKlearn实现K-Means聚类3.2 自编写方式实现K-Means聚类 4、算法不足与解决思路4.1 存在的问题4.2 常见K值确定方法4.3 算法评估优化思路 1、聚类概述 聚类&#xff08;Clustering&#xff09;是指将不同…

【SQL SERVER】定时任务

oracle是定时JOB&#xff0c;sqlserver是创建作业&#xff0c;通过sqlserver代理实现 先看SQL SERVER代理得服务有没有开 选择计算机右键——>管理——>服务与应用程序——>服务——>SQL server 代理 然后把SQL server 代理&#xff08;MSSQLSERVER&#xff09;启…

【ARM Trace32(劳特巴赫) 使用介绍 12 -- Trace32 常用命令之 d.dump | data.dump 介绍】

请阅读【ARM Coresight SoC-400/SoC-600 专栏导读】 文章目录 Trace32 常用命令之 d.dump | data.dump 介绍1 字节显示 (Byte)4 字节显示&#xff08;word&#xff09;8 字节显示&#xff08;通常long&#xff09;十进制显示显示指定列数显示地址范围内的值不经过MMUnon-cache …

mfc 设置excel 单元格的列宽

CString strTL, strBR;strTL.Format(L"%s%d", GetExcelColName(cd.nCol), cd.nRow);strBR strTL;CRange rangeMerge range.get_Range(_variant_t(strTL), _variant_t(strBR));rangeMerge.put_ColumnWidth(_variant_t((long)(20))); 宽度设置函数为 &#xff1a; pu…

EM32DX-C4【C#】

1外观&#xff1a; J301 直流 24V 电源输入 CAN0 CAN0 总线接口 CAN1 CAN1 总线接口 J201 IO 接线段子 S301-1、S301-2 输出口初始电平拨码设置 S301-3~S301-6 模块 CAN ID 站号拨码开关 S301-7 模块波特率拨码设置 S301-8 终端电阻选择开关 2DI&#xff1a; 公共端是…

解决:ERROR: No matching distribution found for rarfile

解决&#xff1a;ERROR: No matching distribution found for rarfile 文章目录 解决&#xff1a;ERROR: No matching distribution found for rarfile背景报错问题报错翻译报错位置代码报错原因解决方法今天的分享就到此结束了 背景 在使用之前的代码时&#xff0c;报错&#…

传输层可靠传输的原理

目录 1.停止等待协议 2.连续ARQ协议 3.TCP报文段的首部格式 4.TCP的滑动窗口机制 &#xff08;1&#xff09;发送窗口 &#xff08;2&#xff09;接收窗口 &#xff08;3&#xff09;发送缓存 5.超时重传时间的选择 6.选择确认SACK(Selective ACK) 7.使用滑动窗口实现…

【网络安全技术】密钥管理

一、分级密钥概念 典型的密钥分级分为三级&#xff0c;三级密钥就是一次会话的session key&#xff0c;用来加密通信&#xff0c;所以通常使用对称密钥。 二级密钥就是分发三级密钥的密钥&#xff0c;用来加密三级密钥来分发三级密钥。 一级密钥就是分发二级密钥的密钥&…

llama.cpp部署(windows)

一、下载源码和模型 下载源码和模型 # 下载源码 git clone https://github.com/ggerganov/llama.cpp.git# 下载llama-7b模型 git clone https://www.modelscope.cn/skyline2006/llama-7b.git查看cmake版本&#xff1a; D:\pyworkspace\llama_cpp\llama.cpp\build>cmake --…

Notepad++ 安装TextFx插件失败

据说TextFx插件是Notepad常用插件之一&#xff1b;有很多格式化代码的功能&#xff1b;下面安装一下&#xff1b; 插件管理里面看一下&#xff0c;没有这个TextFx&#xff1b; 根据资料&#xff0c;先安装NppExec&#xff1b; 然后下一个5.9老版本的Notepad&#xff0c;如下图…

双目光波导AR眼镜_AR智能眼镜主板PCB定制开发

AR眼镜方案的未来发展潜力非常巨大。随着技术的进步&#xff0c;AR眼镜的光学模块将变得更小巧&#xff0c;像素密度也会增加&#xff0c;实现更高分辨率的画面&#xff0c;甚至能够达到1080P、2K和4K级别的清晰度&#xff0c;从而提升用户的视觉体验。 AR智能眼镜的硬件方面&a…

探讨Unity中的动画融合技术(BlendTree)

动画在游戏和虚拟现实应用中扮演着关键的角色&#xff0c;而动画融合技术则是使角色动作更加流畅和逼真的核心。在Unity引擎中&#xff0c;我们可以使用动画混合树&#xff08;Blend Trees&#xff09;来实现这一目标。本篇技术博客将深入讨论动画融合技术的实现原理、在Unity中…

<Linux>(极简关键、省时省力)《Linux操作系统原理分析之linux存储管理(5)》(21)

《Linux操作系统原理分析之linux存储管理&#xff08;5&#xff09;》&#xff08;21&#xff09; 6 Linux存储管理6.6 Linux 物理空间管理6.6.1 Linux 物理内存空间6.6.2 物理页面的管理6.6.3 空闲页面管理——buddy 算法 6.7 内存的分配与释放6.7.1 物理内存分配的数据结构 6…

C++数据结构:B树

目录 一. 常见的搜索结构 二. B树的概念 三. B树节点的插入和遍历 3.1 插入B树节点 3.2 B树遍历 四. B树和B*树 4.1 B树 4.2 B*树 五. B树索引原理 5.1 索引概述 5.2 MyISAM 5.3 InnoDB 六. 总结 一. 常见的搜索结构 表示1为在实际软件开发项目中&#xff0c;常用…

分享几个电视颜色测试图形卡

介绍 本文分享几个常见的电视颜色测试图形卡和一段matlab程序&#xff0c;完成JPG转FPGA烧写文件&#xff0c;便于把彩色图片预装载到FPGA内。 电视颜色测试图形卡 一种专业检测电视显示效果的工具。它通常由一张卡片和一些色块组成&#xff0c;可以根据标准色彩空间和颜色渐…

JVM类加载全过程

Java虚拟机类加载的全过程&#xff0c;即加载&#xff0c;验证&#xff0c;准备&#xff0c;解析&#xff0c;初始化 一、加载 加载 是 类加载过程中的一个阶段&#xff0c; 有以下三部分组成 1&#xff09;通过一个类的全限定名来获取定义此类的二进制流 2&#xff09;将这…

2023-2024-1-高级语言程序设计-第2次月考函数题

6-1-1 调用函数求分段函数 编写函数fun计算下列分段函数的值&#xff1a; 。 函数接口定义&#xff1a; float fun(float x); 其中 x 是用户传入的参数。 函数须返回分段函数的计算结果。 裁判测试程序样例&#xff1a; #include <stdio.h> #include <math.h> …

【C语言】预处理详解

大家好&#xff0c;我是苏貝&#xff0c;本篇博客带大家再次优化上一篇的通讯录&#xff0c;实现将录入的数据在程序退出后存储到文件中&#xff0c;在下一次程序开始时打开文件获取数据&#xff0c;如果你觉得我写的还不错的话&#xff0c;可以给我一个赞&#x1f44d;吗&…
最新文章