计算机科学有两类根本问题。一类是理论：算法，数据结构，复杂度，机器学习，模式识别，等等等。一类是系统：操作系统，网络系统，分布式系统，存储系统，游戏引擎等等。 理论走的是深度，是在追问在给定的计算能力约束下如何把一个问题解决得更快更好。而系统走的是广度，是在追问对于一个现实的需求如何在众多的技术中设计出最多快好省的技术组合。
说了这么多，就是强调编写程序离不开算法。下面就介绍一下如何绘制心形图形的算法，效果如下图：
源代码代码如下：
<!DOCTYPE HTML>
<html>
<head>
<title>HTML5心形图形的画法</title>
</head>
<body>
<div id="xttblog" style="width: 50px; height: 50px; margin: 500px 0 0 500px; position: relative;"></div>
</body>
<script>
var angle = 0;
function getHeartPoint() {//心形曲线
var t = angle / Math.PI;
var xttblog = document.createElement("div");
if(t>6.5)
return;
angle+=0.01;
var y = 18.5 * (16 * Math.pow(Math.sin(t), 3));
var x = - 20 * (13 * Math.cos(t) - 5 * Math.cos(2 * t) - 2 * Math.cos(3 * t) - Math.cos(4 * t));
xttblog.style.width = "1px";
xttblog.style.height = "1px";
xttblog.style.backgroundColor = "red";
xttblog.style.position = "absolute";
xttblog.style.top = x + "px";
xttblog.style.left = y + "px";
document.getElementById("xttblog").appendChild(xttblog);
setTimeout(getHeartPoint, 1);
}
getHeartPoint();
// 原文地址:http://www.xttblog.com/?p=275
</script>
</html>
： » HTML5心形图形的画法
原创文章，作者：kirin，如若转载，请注明出处：https://blog.ytso.com/251122.html