javascript - 使用 javascript 的三角函数

Question

我正在尝试使用 javascript 绘制 cos 曲线。我希望在网页上看到一条漂亮的 cos 曲线。像这样...

我加了 200 以将曲线向下移动，这样我就可以看到整个事情了。我乘以 100，因为 html 中没有小数位。如果你看一下jsfiddle，那是一团糟

http://jsfiddle.net/RN7WN/8/

$(function(){    
    for (i=0; i<500; i++){ 
        var el = $('<div class="dot"></div>'); 
        var y = Math.cos(i*100) * 100 + 200;
        var x = i ;
        el.css({ 'left' : x+'px' , 'top':y+ 'px'});
        $('#main').after(el);  
    } 
});​

Answer 1

三角函数使用弧度，而不是度数。要在度数和弧度之间进行转换，请使用公式

radians = Math.PI / 180 * degrees

这是小提琴的更新版本，显示了一些可识别的东西。

Answer 2

http://jsfiddle.net/zerkms/RN7WN/13/

$(function(){    
    for (i=0; i< 2 * Math.PI; i+=0.01){
        //alert('aa');   
        var el = $('<div class="dot"></div>'); 
        var x = Math.cos(i) * 100 + 100;
        var y = i * 100 + 50;
        el.css({ 'left' : x+'px' , 'top':y+ 'px'});
        $('#main').after(el); 
        //$('#main').after('<p>'+ l +'</p>');
    } 
});​

Answer 3

正如我之前在评论中解释的那样，您需要通过乘以从度数转换为弧度数Math.PI / 180。

例如：

$(function(){    
  for (i=0; i<400; i++){
    var el = $('<div class="dot"></div>'); 
    var x = Math.sin(i * (Math.PI/180)) * 100;
    var y = i + 200;
    el.css({ 'left' : x+'px' , 'top':y+ 'px'});
    $('#main').after(el); 
  } 
});​

这是一个演示更改的jsfiddle。