目录
二、JavaScript：用 HTML5 Canvas 绘制跃动的爱心
爱心，作为浪漫和美好的象征，一直以来都是编程世界中有趣的图形挑战。本文将带您走进多种常见的编程语言，探索如何用代码绘制出美丽的爱心图案。其中，既有静态的精美图案，也有跃动的动态效果。让我们一起感受编程与艺术的完美融合。
一、Python：用 Matplotlib 绘制静态爱心
Matplotlib 是 Python 中强大的绘图库，我们可以利用数学公式，在平面上绘制出精致的爱心。
代码示例：
import numpy as np
import matplotlib.pyplot as plt
# 参数 t 取值范围
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=(6, 6))
plt.plot(x, y, color='red')
plt.fill_between(x, y, color='red')
plt.axis('equal')
plt.axis('off')
plt.show()
效果展示：
运行上述代码，您将看到一个红色填充的爱心图案，完美呈现在坐标系中。
二、JavaScript：用 HTML5 Canvas 绘制跃动的爱心
利用 HTML5 Canvas，我们可以在网页上绘制并呈现动态的爱心效果，为网页增添一份浪漫。
代码示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>爱心动画</title>
<style>
canvas {
background-color: #fff;
display: block;
margin: 0 auto;
}
</style>
</head>
<body>
<canvas id="canvas" width="600" height="500"></canvas>
<script>
const canvas = document.getElementById('canvas');
const ctx = canvas.getContext('2d');
function drawHeart(scale) {
ctx.clearRect(0, 0, canvas.width, canvas.height);
ctx.beginPath();
for (let i = 0; i <= Math.PI * 2; i += 0.01) {
let x = 16 * Math.pow(Math.sin(i), 3);
let y = 13 * Math.cos(i) - 5 * Math.cos(2 * i) - 2 * Math.cos(3 * i) - Math.cos(4 * i);
ctx.lineTo(300 + x * scale, 250 - y * scale);
}
ctx.fillStyle = 'red';
ctx.fill();
}
let scale = 10;
let delta = 0.1;
function animate() {
if (scale > 12 || scale < 8) delta = -delta;
scale += delta;
drawHeart(scale);
requestAnimationFrame(animate);
}
animate();
</script>
</body>
</html>
效果展示：
将上述代码保存为 .html 文件并在浏览器中打开，您将看到一个尺寸不断变化的红色爱心，仿佛在心跳般跃动。
三、Java：用 Swing 绘制静态爱心
Java 的 Swing 库提供了强大的图形界面支持，我们可以利用它在应用程序窗口中绘制爱心。
代码示例：
import javax.swing.*;
import java.awt.*;
public class HeartShape extends JPanel {
@Override
protected void paintComponent(Graphics g) {
super.paintComponent(g);
Graphics2D g2 = (Graphics2D) g;
int width = getWidth();
int height = getHeight();
g2.setColor(Color.RED);
g2.translate(width / 2, height / 2);
for (double t = 0; t <= 2 * Math.PI; t += 0.01) {
double x = 16 * Math.pow(Math.sin(t), 3);
double y = 13 * Math.cos(t) - 5 * Math.cos(2 * t)
- 2 * Math.cos(3 * t) - Math.cos(4 * t);
g2.fillOval((int) x, (int) -y, 2, 2);
}
}
public static void main(String[] args) {
JFrame frame = new JFrame("爱心图案");
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.add(new HeartShape());
frame.setSize(600, 600);
frame.setVisible(true);
}
}
效果展示：
编译并运行该程序，您将看到一个窗口中绘制着精美的红色爱心，呈现出细腻的视觉效果。
四、C 语言：在控制台打印静态爱心
即使是在控制台中，我们也能用简单的字符拼出爱心的形状，充分体现编程的魅力。
代码示例：
#include <stdio.h>
int main() {
float x, y;
for (y = 1.5f; y > -1.5f; y -= 0.1f) {
for (x = -1.5f; x < 1.5f; x += 0.05f) {
float a = x * x + y * y - 1;
if (a * a * a - x * x * y * y * y <= 0.0f)
printf("*");
else
printf(" ");
}
printf("\n");
}
return 0;
}
效果展示：
运行程序，控制台会输出由星号 * 组成的爱心形状，简单却别有一番风味。
五、C++：使用 SFML 库绘制动态爱心
SFML（Simple and Fast Multimedia Library）是一个简洁高效的多媒体库，用于创建图形界面、处理音频等。我们可以用它来绘制动态的爱心图案。
代码示例：
#include <SFML/Graphics.hpp>
#include <vector>
#include <cmath>
int main() {
sf::RenderWindow window(sf::VideoMode(600, 500), "爱心动画");
sf::ConvexShape heart;
heart.setFillColor(sf::Color::Red);
std::vector<sf::Vector2f> points;
for (double t = 0; t <= 2 * M_PI; t += 0.01) {
double x = 16 * pow(sin(t), 3);
double y = 13 * cos(t) - 5 * cos(2 * t)
- 2 * cos(3 * t) - cos(4 * t);
points.emplace_back(300 + x * 10, 250 - y * 10);
}
heart.setPointCount(points.size());
for (size_t i = 0; i < points.size(); ++i) {
heart.setPoint(i, points[i]);
}
float scale = 1.0f;
float delta = 0.005f;
while (window.isOpen()) {
sf::Event event;
while (window.pollEvent(event)) {
if (event.type == sf::Event::Closed)
window.close();
}
if (scale > 1.2f || scale < 0.8f) delta = -delta;
scale += delta;
heart.setScale(scale, scale);
heart.setPosition(300 - 300 * (scale - 1), 250 - 250 * (scale - 1));
window.clear(sf::Color::White);
window.draw(heart);
window.display();
}
return 0;
}
效果展示：
编译并运行代码，您将看到一个窗口中红色的爱心不断地缩放，呈现出动态的效果。
注意：需要先安装 SFML 库才能编译运行此代码。
六、JavaScript：在控制台打印动态爱心
利用 JavaScript，我们还能在浏览器的控制台中打印出动态变化的爱心图案，别具一格。
代码示例：
let frames = 0;
function animateHeart() {
let output = '';
for (let y = 15; y > -15; y -= 1) {
for (let x = -30; x < 30; x += 1) {
let a = x / 15;
let b = y / 15;
let equation = a * a + b * b - 1;
if (equation * equation * equation - a * a * b * b * b <= 0.0) {
output += '*';
} else {
output += ' ';
}
}
output += '\n';
}
console.clear();
console.log(output);
frames++;
if (frames < 20) {
setTimeout(animateHeart, 200);
}
}
animateHeart();
效果展示：
在浏览器的开发者工具中运行上述代码，控制台会不断刷新，显示出动态变化的爱心形状。
| 编程语言 | 图形类型 | 使用库/技术 | 动态/静态 | 代码示例功能 |
|---|---|---|---|---|
| Python | 平面图形 | Matplotlib | 静态 | 使用数学公式绘制红色填充的爱心 |
| JavaScript (Canvas) | 网页图形 | HTML5 Canvas | 动态 | 实现心跳效果的爱心 |
| Java | 图形界面 | Swing | 静态 | 在应用程序窗口中绘制精致的红色爱心 |
| C | 控制台字符图形 | 控制台输出 | 静态 | 在控制台打印由星号组成的爱心 |
| C++ | 图形界面 | SFML | 动态 | 使用 SFML 库绘制并缩放的动态爱心 |
| JavaScript (控制台) | 控制台字符图形 | 浏览器控制台 | 动态 | 控制台中显示动态变化的爱心形状 |
代码创作的特点和说明
- Python：简洁的代码结构，借助 Matplotlib 轻松绘制出高质量的静态图形。适合快速生成图像。
- JavaScript (Canvas)：利用 Canvas 实现网页上的动态效果，非常适合交互性强的应用场景。
- Java (Swing)：Java GUI 支持绘制复杂的图形，并能在桌面应用程序中展示静态爱心。
- C：通过简单的控制台输出，实现字符画效果，最基本的图形展示手段，展现编程的朴素魅力。
- C++ (SFML)：结合 SFML 库的强大图形支持，能绘制复杂且动态的图形效果，适合游戏开发或图形展示。
- JavaScript (控制台)：以独特的方式在控制台中呈现动态字符图形，趣味性十足，适合展示编程的灵活性。
结语
通过以上的示例，我们可以看到，编程语言不仅是解决问题的工具，更是创造艺术的媒介。不同的语言有着各自的特色，但它们都能用数学和逻辑之美，绘制出浪漫的爱心图案。希望本文能激发您对编程艺术的兴趣，鼓励您探索更多有趣的代码创作。
提示：以上代码均可直接复制运行，若遇到问题，请确保已正确安装相关的编译环境和库。例如，C++ 的示例需要先安装 SFML 库。
扫一扫
4513
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
