爱心代码

62 阅读2分钟

有心爱的女生了吗,冬天要谈一场甜甜的恋爱吗

HTML

<!DOCTYPE html>
<html> 
    <body style="background: #000;">
    <canvas id="heart" width="400" height="400"></canvas> 
<script>
    const ctx = document.getElementById("heart").getContext("2d"); 
    ctx.fillStyle = "#ff4444"; // 爱心颜色
    

    // 用参数方程生成爱心路径 
  ctx.beginPath(); 
  for (let t = 0; t < 2 * Math.PI; t += 0.01) {
      let x = 16 * Math.pow(Math.sin(t), 3); 
      let y = 13 * Math.cos(t) - 5 * Math.cos(2 * t) - 2 * Math.cos(3 * t) - Math.cos(4 * t); // 缩放并移动到画布中心
      let drawX = 200 + x * 8; 
      let drawY = 200 - y * 8;
      t === 0 ? ctx.moveTo(drawX, drawY) : ctx.lineTo(drawX, drawY);
   }
   ctx.fill(); // 填充爱心 
   </script> 
   </body>
   </html>

Python

一、Python 文字爱心(极简版)

直接用字符打印爱心,适合入门学习:

print("  ♥♥♥♥♥♥  ")
print("♥♥♥♥♥♥♥♥♥♥")
print("♥♥♥♥♥♥♥♥♥♥")
print("  ♥♥♥♥♥♥  ")
print("    ♥♥♥♥  ")
print("      ♥♥  ")
print("        ♥")

二、Python 数学公式爱心(动态绘制)

用笛卡尔心形方程绘制,带渐变效果(需安装 matplotlib):

import numpy as np
import matplotlib.pyplot as plt

# 生成角度数据
t = np.linspace(0, 2 * np.pi, 1000)
# 笛卡尔心形方程
x = 16 * np.sin(t)**3
y = 13 * np.cos(t) - 5 * np.cos(2*t) - 2 * np.cos(3*t) - np.cos(4*t)

# 设置画布
plt.figure(figsize=(8, 8))
plt.plot(x, y, color='#ff4466', linewidth=3)
plt.fill(x, y, color='#ffcccc', alpha=0.7)  # 填充颜色
plt.axis('equal')
plt.axis('off')  # 隐藏坐标轴
plt.title('爱心 ❤️', fontsize=20, color='#d63384')
plt.show()

三、JavaScript 粒子爱心(炫酷版)

基于 Canvas 的粒子汇聚成爱心效果:

<!DOCTYPE html>
<html>
<head>
    <title>粒子爱心</title>
    <style> canvas { background: #000; display: block; margin: 0 auto; } </style>
</head>
<body>
    <canvas id="heartCanvas"></canvas>
    <script>
        const canvas = document.getElementById('heartCanvas');
        const ctx = canvas.getContext('2d');
        canvas.width = 800;
        canvas.height = 600;

        // 粒子类
        class Particle {
            constructor() {
                this.x = Math.random() * canvas.width;
                this.y = Math.random() * canvas.height;
                this.size = Math.random() * 2 + 1;
                this.speedX = Math.random() * 0.4 - 0.2;
                this.speedY = Math.random() * 0.4 - 0.2;
            }

            // 计算到心形的距离
            getDistanceToHeart() {
                const x = this.x - canvas.width / 2;
                const y = this.y - canvas.height / 2 + 50;
                // 心形方程:(x² + y² - 1)³ - x²y³ = 0
                return Math.pow(x*x + y*y - 1, 3) - Math.pow(x, 2) * Math.pow(y, 3);
            }

            update() {
                const distance = this.getDistanceToHeart();
                // 粒子被心形吸引
                if (distance > 0) {
                    const angle = Math.atan2(this.y - (canvas.height/2 - 50), this.x - canvas.width/2);
                    this.x -= Math.cos(angle) * 0.5;
                    this.y -= Math.sin(angle) * 0.5;
                }
                // 边界反弹
                if (this.x < 0 || this.x > canvas.width) this.speedX *= -1;
                if (this.y < 0 || this.y > canvas.height) this.speedY *= -1;
                this.x += this.speedX;
                this.y += this.speedY;
            }

            draw() {
                ctx.fillStyle = '#ff4466';
                ctx.beginPath();
                ctx.arc(this.x, this.y, this.size, 0, Math.PI * 2);
                ctx.fill();
            }
        }

        // 创建粒子数组
        const particles = Array.from({ length: 2000 }, () => new Particle());

        // 动画循环
        function animate() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);
            particles.forEach(p => {
                p.update();
                p.draw();
            });
            requestAnimationFrame(animate);
        }

        animate();
    </script>
</body>
</html>

浏览器打开后,会看到黑色背景下红色粒子逐渐汇聚成爱心,极具视觉效果。

四、Python Turtle 绘制爱心(交互式)

适合初学者的海龟绘图,实时绘制爱心过程:

import turtle

# 设置画笔
t = turtle.Turtle()
t.speed(0)  # 最快速度
t.color('#ff4466', '#ffcccc')  # 线条色+填充色
t.begin_fill()

# 绘制爱心(基于圆弧)
t.left(140)
t.forward(180)
t.circle(-90, 200)
t.setheading(60)
t.circle(-90, 200)
t.forward(180)

t.end_fill()
t.hideturtle()
turtle.done()

运行后会弹出窗口,画笔自动绘制爱心并填充颜色。

选择你喜欢的语言和效果直接运行即可,如需修改颜色、大小或动画速度,可调整代码中的参数(如颜色值、粒子数量、动画时长等)。