同款爱心Python代码版来了

同款爱心就是一个动态的♥型效果,主要 Python 代码实现如下:

def __init__(self, generate_frame=20):
# 原始爱心坐标集合
self._points = set()  
# 边缘扩散效果点坐标集合
self._edge_diffusion_points = set()  
# 中心扩散效果点坐标集合
self._center_diffusion_points = set()  
# 每帧动态点坐标
self.all_points = {}  
self.build(2000)
self.random_halo = 1000
self.generate_frame = generate_frame
for frame in range(generate_frame):self.calc(frame)def build(self, number):
for _ in range(number):t = random.uniform(0, 2 * pi)x, y = heart(t)self._points.add((x, y))
# 爱心内扩散
for _x, _y in list(self._points):for _ in range(3):x, y = scatter_inside(_x, _y, 0.05)self._edge_diffusion_points.add((x, y))
# 爱心内再次扩散
point_list = list(self._points)
for _ in range(4000):x, y = random.choice(point_list)x, y = scatter_inside(x, y, 0.17)self._center_diffusion_points.add((x, y))@staticmethodstaticmethod
def calc_position(x, y, ratio):
force = 1 / (((x - X) ** 2 +(y - Y) ** 2) ** 0.520)
dx = ratio * force * (x - X) + random.randint(-1, 1)
dy = ratio * force * (y - Y) + random.randint(-1, 1)
return x - dx, y - dydef calc(self, generate_frame):
ratio = 10 * curve(generate_frame / 10 * pi)
halo_radius = int(4 + 6 * (1 + curve(generate_frame / 10 * pi)))
halo_number = int(3000 + 4000 * abs(curve(generate_frame / 10 * pi) ** 2))
all_points = []
# 光环
heart_halo_point = set()
for _ in range(halo_number):t = random.uniform(0, 2 * pi)x, y = heart(t, shrink_ratio=11.6)x, y = shrink(x, y, halo_radius)if (x, y) not in heart_halo_point:heart_halo_point.add((x, y))x += random.randint(-14, 14)y += random.randint(-14, 14)size = random.choice((1, 2, 2))all_points.append((x, y, size))
# 轮廓
for x, y in self._points:x, y = self.calc_position(x, y, ratio)size = random.randint(1, 3)all_points.append((x, y, size))
# 内容
for x, y in self._edge_diffusion_points:x, y = self.calc_position(x, y, ratio)size = random.randint(1, 2)all_points.append((x, y, size))
self.all_points[generate_frame] = all_points
for x, y in self._center_diffusion_points:x, y = self.calc_position(x, y, ratio)size = random.randint(1, 2)all_points.append((x, y, size))
self.all_points[generate_frame] = all_points

实现效果如下:

在这里插入图片描述

满屏爱心代码(修改名字版本)<!DOCTYPE html>
<!-- saved from url=(0051)https://httishere.gitee.io/notion/v4/love-name.html -->
<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title> Love you </title><style type="text/css">body {margin: 0;overflow: hidden;background: #000;}canvas {position: absolute;width: 100%;height: 100%;}#pinkboard {animation: anim 1.5s ease-in-out infinite;-webkit-animation: anim 1.5s ease-in-out infinite;-o-animation: anim 1.5s ease-in-out infinite;-moz-animation: anim 1.5s ease-in-out infinite;}@keyframes anim {0% {transform: scale(0.8);}25% {transform: scale(0.7);}50% {transform: scale(1);}75% {transform: scale(0.7);}100% {transform: scale(0.8);}}@-webkit-keyframes anim {0% {-webkit-transform: scale(0.8);}25% {-webkit-transform: scale(0.7);}50% {-webkit-transform: scale(1);}75% {-webkit-transform: scale(0.7);}100% {-webkit-transform: scale(0.8);}}@-o-keyframes anim {0% {-o-transform: scale(0.8);}25% {-o-transform: scale(0.7);}50% {-o-transform: scale(1);}75% {-o-transform: scale(0.7);}100% {-o-transform: scale(0.8);}}@-moz-keyframes anim {0% {-moz-transform: scale(0.8);}25% {-moz-transform: scale(0.7);}50% {-moz-transform: scale(1);}75% {-moz-transform: scale(0.7);}100% {-moz-transform: scale(0.8);}}#name {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);margin-top: -20px;font-size: 46px;color: #ea80b0;}
</style><script src="./ Love you _files/monitors.3.6.36.cn.js.下载" async="" crossorigin="anonymous"></script><script src="./ Love you _files/sentry.3.6.36.cn.js.下载" async="" crossorigin="anonymous"></script></head><body><canvas id="pinkboard" width="1707" height="868"></canvas><canvas id="canvas" width="1707" height="868"></canvas><script type="text/javascript">const colors = ["#eec996","#8fb7d3","#b7d4c6","#c3bedd","#f1d5e4","#cae1d3","#f3c89d","#d0b0c3","#819d53","#c99294","#cec884","#ff8e70","#e0a111","#fffdf6","#cbd7ac","#e8c6c0","#dc9898","#ecc8ba",]; //用来设置的颜色var canvas = document.getElementById("canvas");var ctx = canvas.getContext("2d");let count = 1;var ww = window.innerWidth;var wh = window.innerHeight;var hearts = [];function init() {requestAnimationFrame(render);canvas.width = ww;canvas.height = wh;for (var i = 0; i < 100; i++) {hearts.push(new Heart());}}function Heart() {this.x = Math.random() * ww;this.y = Math.random() * wh;this.opacity = Math.random() * 0.5 + 0.5;this.vel = {x: (Math.random() - 0.5) * 4,y: (Math.random() - 0.5) * 4,};this.targetScale = Math.random() * 0.15 + 0.02;this.scale = this.targetScale * Math.random();}Heart.prototype.update = function (i) {this.x += this.vel.x;this.y += this.vel.y;this.scale += (this.targetScale - this.scale) * 0.01;if (this.x - this.width > ww || this.x + this.width < 0) {this.scale = 0;this.x = Math.random() * ww;}if (this.y - this.height > wh || this.y + this.height < 0) {this.scale = 0;this.y = Math.random() * wh;}this.width = 473.8;this.height = 408.6;};Heart.prototype.draw = function (i) {ctx.globalAlpha = this.opacity;ctx.font = `${180 * this.scale}px "微软雅黑"`;// ctx.font="20px";ctx.fillStyle = colors[i % 18];ctx.fillText("kawsar",this.x - this.width * 0.5,this.y - this.height * 0.5,this.width,this.height);// ctx.drawImage(//   heartImage,//   this.x - this.width * 0.5,//   this.y - this.height * 0.5,//   this.width,//   this.heig

修改满屏文字操作步骤

将上方的代码全部复制

在电脑新建一个txt文件,命名love.txt

打开txt文件,黏贴代码

将双引号的文件给成你想要展示的文字,保存

将txt文件后缀改成 .hmtl

 在这里插入图片描述

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

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

SpringIoC基于注解配置

目录 一、Bean注解标记和扫描 (IoC) 二、组件&#xff08;Bean&#xff09;作用域和周期方法注解 三、Bean属性赋值&#xff1a;引用类型自动装配 (DI) 四、Bean属性赋值&#xff1a;基本类型属性赋值 (DI) 一、Bean注解标记和扫描 (IoC) 一、注解方式介绍 1.注解介绍 和…

行业追踪,2023-08-24

自动复盘 2023-08-24 凡所有相&#xff0c;皆是虚妄。若见诸相非相&#xff0c;即见如来。 k 线图是最好的老师&#xff0c;每天持续发布板块的rps排名&#xff0c;追踪板块&#xff0c;板块来开仓&#xff0c;板块去清仓&#xff0c;丢弃自以为是的想法&#xff0c;板块去留让…

VIT Swin Transformer

VIT&#xff1a;https://blog.csdn.net/qq_37541097/article/details/118242600 Swin Transform&#xff1a;https://blog.csdn.net/qq_37541097/article/details/121119988 一、VIT 模型由三个模块组成&#xff1a; Linear Projection of Flattened Patches(Embedding层) Tran…

AR室内导航技术之技术说明与效果展示

随着科技的飞速发展&#xff0c;我们周围的环境正在经历着一场数字化的革命。其中&#xff0c;AR室内导航技术以其独特的魅力&#xff0c;为我们打开了一扇通往全新数字化世界的大门。本文将为您详细介绍这一技术的实现原理、工具应用以及成品展示&#xff0c;带您领略AR室内导…

供应链 | 大数据报童模型:基于机器学习的实践见解

论文解读&#xff1a;李欣 马玺渊 作者&#xff1a;Gah-Yi Ban, Cynthia Rudin 引用&#xff1a;Ban, Gah-Yi and Cynthia Rudin. The big data newsvendor: Practical insights from machine learning. Operations Research 67.1 (2019): 90-108. 文章链接&#xff1a;https…

【项目】瑞吉外卖 - 项目开发Day1:开发环境搭建

目录 1、搭建Maven项目 step1&#xff1a;右键New新建一个Module step2&#xff1a;导入SpringBoot配置文件application.yml&#xff0c;设置pom.xml文件中的依赖 &#xff08;1&#xff09;pom.xml代码 &#xff08;2&#xff09;application.yml代码 step3&#xff1…

VK0192是标准LCD显示面板/液晶显示屏驱动芯片(IC)-24SEG×8COM

产品品牌&#xff1a;永嘉微电/VINKA 产品型号&#xff1a;VK0192 封装形式&#xff1a;LQFP44 概述 VK0192是一个点阵式存储映射的LCD驱动器&#xff0c;可支持最大192点&#xff08;24SEGx8COM&#xff09; 的LCD屏。单片机可通过3/4线串行接口配置显示参数和发送显示数据…

如何远程管理服务器详解

文章目录 前言一、远程管理类型二、远程桌面三、telnet 命令行远程四、查看本地开放端口 前言 很多公司是有自己的机房的&#xff0c;机房里面会有若干个服务器为员工和用户提供服务。大家可以想想&#xff1a;假设这家公司有上百台服务器&#xff0c;我们作为网络工程师&…

A 题国际旅游网络的大数据分析-详细解析与代码答案(2023 年全国高校数据统计与调查分析挑战赛

请你们进行数据统计与调查分析&#xff0c;使用附件中的数据&#xff0c;回答下列问题&#xff1a; ⚫ 问题 1: 请进行分类汇总统计&#xff0c;计算不同国家 1995 年至 2020 年累计旅游总人数&#xff0c;从哪个国家旅游出发的人数最多&#xff0c;哪个国家旅游到达的人数最多…

MyBatis分页插件PageHelper的使用及特殊字符的处理

目录 一、PageHelper简介 1.什么是分页 2.PageHelper是什么 3.使用PageHelper的优点 二、PageHelper插件的使用 原生limit查询 1. 导入pom依赖 2. Mybatis.cfg.xml 配置拦截器 3. 使用PageHelper进行分页 三、特殊字符的处理 1.SQL注入&#xff1a; 2.XML转义&#…

vue(element ui安装)

目录 一&#xff0c;element ui安装二&#xff0c;main.js三&#xff0c;使用element ui最后 一&#xff0c;element ui安装 先在盘服中找到你创建的node的位置 如有不懂根据可以看看上一章安装node 然后在终端找到 进入这个位置之后就可以安装了 输入npm i element-ui -S这个…

诚迈科技子公司智达诚远与Unity中国达成合作,打造智能座舱新时代

2023 年 8 月 23 日&#xff0c;全球领先的实时 3D 引擎 Unity 在华合资公司 Unity 中国举办发布会&#xff0c;正式对外发布 Unity 引擎中国版——团结引擎&#xff0c;并带来专为次世代汽车智能座舱打造的团结引擎车机版。发布会上&#xff0c;诚迈科技副总裁、诚迈科技子公司…