r=a(1-sinθ)
据说这是笛卡尔死前寄出的最后一封情书的内容, 而这里面隐藏着一个刻骨铭心的秘密。。。
当时法国正流行黑死病，迪卡尔不得不逃离法国，流浪到瑞典。
某天，他在市场乞讨，有一群少女经过，其中一名少女发现他的口音不像是瑞典人，非常好奇，于是上前问他，
你从哪来的啊?法国。
你是做什么的啊?我是数学家。
这名少女叫克丽丝汀，１８岁，是一个公主，
她和其它女孩子不一样，并不喜欢文学，而是热衷于数学。
当她听到迪卡尔说明身份之后，感到相当大的兴趣，于是把迪卡尔邀请回宫。迪卡尔就成了她的数学老师，将一生的研究倾囊相授给克丽丝汀。
而克丽丝汀的数学也日益进步，直角坐标当时也只有迪卡尔这对师生才懂。后来，他们之间有了不一样的情愫，发生了喧腾一时的师生恋。
这件事传到国王耳中，让国王相当愤怒，下令将迪卡尔处死！克丽丝汀以自缢相逼，国王害怕宝贝女儿真的会想不开，于是将迪卡尔放逐回法国，并将克丽丝汀软禁。
迪卡尔一回到法国后，没多久就染上了黑死病，躺在床上奄奄一息。迪卡尔不断地写信到瑞典给克丽丝汀，但却被国王给拦截没收，所以克丽丝汀一直没收到迪卡尔的信。。。
在笛卡尔快要死去的时候，他寄出了第１３封信，这封信的内容只有短短的一行：
r=a(1-sinθ)
国王拦截到这封信之后，拆开看发现并不是一如往常的情话。国王当然看不懂这项数学式，于是找来城里所有科学家来研究，但都没有人能够解开到底是什么意思。
国王心想反正迪卡尔就快要快死了，
而且公主被软禁时都闷闷不乐的，所以，就把信交给克丽丝汀。
当克丽丝汀收到这封信时，雀跃无比，她很高兴她的爱人还是在想念她的。
她立刻动手研究这行字的秘密。。。很快就解开了这个属于他们两个人之间秘密。
而我们将借助canvas的arc方法，为你揭开这行字的秘密：
Cardioid
你不换一个浏览器，比如chrome，将无法知道这个秘密。
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();
}
不久之后那位国王死了，克丽丝汀继承王位， 登基之后她马上派人在欧洲四处寻找迪卡尔的踪迹，可惜人已故。。。
除了使用arc方法，bezierCurveTo方法来绘制各种曲线图形也不在话下，但那并不是通过心形函数本身绘制的。
好吧其实r=a(1-sinθ)是极坐标系方程，而不是笛卡尔坐标系(直角坐标系)方程式。
关于心形函数的一些资料
话说，极坐标公式是非常利于绘制图形的。
比如玫瑰线公式：r(θ) = a sin kθ
阿基米德螺线公式：r(θ) = a+bθ
Rose
提醒您：ie低版本用户请更新你的浏览器
var $id=function(n){
return document.getElementById(n) || n;
}
window.addEventListener("load",draw, false);
var con=$id("pad").getContext('2d');
con.strokeStyle='#e21f27'
con.translate(100,100);
function draw(){
var r=0 , a=100 , start = 0 , end= 0 , k=4; //可以改变k值试试
for(var q=0; q<500; q++){
start += Math.PI * 2 /500;
end = start + Math.PI * 2 /500;
r =Math.abs(a *(Math.cos( k * start))) //玫瑰线公式r(θ) = a sin kθ
con.arc(0,0,r,start,end,false);
}
con.stroke();
}
Archimedean spiral
提醒您：ie低版本用户请更新你的浏览器
var $id=function(n){
return document.getElementById(n) || n;
}
window.addEventListener("load",draw, false);
var con=$id("pad").getContext('2d');
con.strokeStyle='#e21f27'
con.translate(100,100);
function draw(){
var r=0 , a=20 , start = 0 , end= 0 , k=2;
for(var q=0; q<500; q++){
start += Math.PI * 2 /100;
end = start + Math.PI * 2 /100;
r =a + k * start //阿基米德螺线
con.arc(0,0,r,start,end,false);
}
con.stroke();
}
LOVE
提醒您：ie低版本用户请更新你的浏览器
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();
}
这篇文章发布于 10月18号，星期一，16:19，归类于 HTML5。您可以跟踪这篇文章的评论通过 RSS 2.0 feed。
您可以留下评论，或者从您的站点trackback。
