<html>
<head>
<meta charset='UTF-8' />
<title>LOVE</title>
</head>
<body>
<canvas id="pad" width='800' height='300'>Your browser does not support the canvas element.</canvas>
<script type="text/javascript">
var $id = function (n) {
return document.getElementById(n) || n;
}
window.addEventListener("load", draw, false);
var con = $id("pad").getContext('2d');
con.fillStyle = '#f00'
con.translate(300, 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();
}
</script>
</body>
</html>