绘制笛卡尔心形曲线

绘制笛卡尔心形曲线

心形线，是一个圆上的固定一点在它绕着与其相切且半径相同的另外一个圆周滚动时所形成的轨迹，因其形状像心形而得名。心脏线亦为蚶线的一种。在曼德博集合正中间的图形便是一个心脏线。

先使用html定义一个标签

js绘制canvas图形

绘制饱圆心型

var $id = function(n) {

return document.getElementById(n) || n;

}window.addEventListener("load", draw, false);

var con = $id("pad").getContext('2d');

con.fillStyle = '#e21f27'

con.translate(200, 100);

function draw() {

var r = 0,a = 100,start = 0,end = 0;con.rotate(Math.PI);

for (var q = 0; q < 500; q++) {

start += Math.PI * 2 / 500;

end = start + Math.PI * 2 / 500;

r = a * (1 - Math.sin(start)); //心形极坐标表示法

con.arc(0, 0, r, start, end, false);

}

con.fill();

}

var $id = function(n) {

return document.getElementById(n) || n;

}

window.addEventListener("load", draw, false);

var con = $id("pad").getContext('2d');

con.fillStyle = '#e21f27'

con.translate(100, 100);

function draw() {

var r = 0,a = 20,

start = 0,end = 0;

con.rotate(Math.PI);

for (var q = 0; q < 1000; q++) {

start += Math.PI * 2 / 1000;

end = start + Math.PI * 2 / 1000;

r = a * Math.sqrt(225 / (17 - 16 * Math.sin(start) * Math.sqrt(Math.cos(start) * Math.cos(start))))

con.arc(0, 0, r, start, end, false);

}

con.fill();

}