js求弧度

⑴ js自帶有幾種方法

js的方法可是有一些，想具體了解，可以去下載一本js手冊

a
abs 返回數字的絕對值
acos 返回數的反餘弦值
anchor 在對象中的指定文本兩端放置一個有 NAME 屬性 HTML 錨點
apply 應用某一對象的一個方法，用另一個對象替換當前對象
asin 返回數字的反正弦值
atan 返回數字的反正切值
atan2 返回由 X 軸到 ( y , x ) 點的角度（以弧度為單位）
atEnd 返回一個 Boolean 值，指明枚舉運算元是否位於集合的末尾
b
big 把 HTML <BIG> 標記放置在 String 對象中的文本兩端
blink 把 HTML <BLINK> 標記放置在 String 對象中的文本兩端
bold 把 HTML <B> 標記放置在 String 對象中的文本兩端
c
call 調用一個對象的一個方法，以另一個對象替換當前對象
ceil 返回大於等於其數字參數的最小整數
charAt 返回指定索引位置處的字元
charCodeAt 返回一個整數，代表指定位置上字元的 Unicode 編碼
compile 把正則表達式編譯為內部格式，從而執行得更快
concat 返回一個新數組，這個新數組是由兩個或更多數組組合而成的
concat（String） 返回字元串值，該值包含了兩個或更多個提供的字元串的連接
cos 返回數的餘弦值
d
decodeURI 返回一個已編碼的統一資源標識符 (URI) 的非編碼形式
decodeURIComponent 返回統一資源標識符 (URI) 的一個已編碼組件的非編碼形式
dimensions 返回 VBArray 的維數
e
encodeURI 將文本字元串編碼為一個有效的統一資源標識符 (URI)
encodeURIComponent 將文本字元串編碼為一個統一資源標識符 (URI) 的一個有效組件
escape 對 String 對象編碼以便它們能在所有計算機上可讀
eval 檢查 JScript 代碼並執行
exec 用正則表達式模式在字元串中運行查找，並返回包含該查找結果的一個數組
exp 返回 e（自然對數的底）的冪
f
fixed 把HTML<TT>標記放置在 String 對象中的文本兩端
floor 返回小於等於其數值參數的最大整數
fontcolor 把帶有 COLOR 屬性的一個 HTML <FONT> 標記放置在 String 對象中的文本兩端
fontsize 把一個帶有 SIZE 屬性的 HTML <FONT> 標記放置在 String 對象中的文本的兩端
fromCharCode 從一些 Unicode 字元值中返回一個字元串
g
getDate 返回 Date 對象中用本地時間表示的一個月中的日期值
getDay 返回 Date 對象中用本地時間表示的一周中的日期值
getFullYear 返回 Date 對象中用本地時間表示的年份值
getHours 返回 Date 對象中用本地時間表示的小時值
getItem 返回指定位置的項
getMilliseconds 返回 Date 對象中用本地時間表示的毫秒值
getMinutes 返回 Date 對象中用本地時間表示的分鍾值
getMonth 返回 Date 對象中用本地時間表示的月份值
getSeconds 返回 Date 對象中用本地時間表示的秒鍾值
getTime 返回 Date 對象中的時間值
getTimezoneOffset 返回用分鍾表示的主計算機上的時間和全球標准時間 (UTC)之間的差別
getUTCDate 返回 Date 對象中用全球標准時間 (UTC)表示的日期
getUTCDay 返回 Date 對象中用全球標准時間 (UTC)表示的一周中的日期值
getUTCFullYear 返回 Date 對象中用全球標准時間 (UTC)表示的年份值
getUTCHours 返回 Date 對象中用全球標准時間 (UTC)表示的小時值
getUTCMilliseconds 返回 Date 對象中用全球標准時間 (UTC)表示的毫秒值
getUTCMinutes 返回 Date 對象中用全球標准時間 (UTC)表示的分鍾值
getUTCMonth 返回 Date 對象中用全球標准時間 (UTC)表示的月份值
getUTCSeconds 返回 Date 對象中用全球標准時間 (UTC)表示的秒鍾值
getVarDate 返回 Date 對象中的 VT_DATE 值
getYear 返回 Date 對象中的年份值
i
indexOf 返回 String 對象內第一次出現子字元串的字元位置
isFinite 返回一個 Boolean 值,指明所提供的數字是否是有限的
isNaN 返回一個 Boolean 值，指明提供的值是否是保留值 NaN （不是數字）
italics 把 HTML <I> 標記放置在 String 對象中的文本兩端
item 返回集合中的當前項
j
join 返回字元串值，其中包含了連接到一起的數組的所有元素，元素由指定的分隔符分隔開
l
lastIndexOf 返回 String 對象中子字元串最後出現的位置
lbound 返回在 VBArray 的指定維中所使用的最小索引值
link 把一個有 HREF 屬性的 HTML 錨點放置在 String 對象中的文本兩端
localeCompare 返回一個值，指出在當前的區域設置中兩個字元串是否相同
log 返回數字的自然對數
match 使用正則表達式模式對字元串執行查找，並將包含查找的結果作為數組返回
max 返回給出的零個或多個數值表達式中較大者
min 返回給出的零個或多個數值表達式中較小者
moveFirst 重新將集合中的當前項設置為第一項
moveNext 將集合中的當前項移動到下一項
p
parse 解析一個包含日期的字元串，並返回該日期與 1970 年 1 月 1 日午夜之間所間隔的毫秒數
parseFloat 返回由字元串轉換得到的浮點數
parseInt 返回由字元串轉換得到的整數
pop 移除數組中的最後一個元素並返回該元素
push 將新元素添加到一個數組中，並返回數組的新長度值
r
random 返回介於 0 和 1 之間的偽隨機數
replace 返回根據正則表達式進行文字替換後的字元串 的拷貝
reverse 返回一個元素順序被反轉的 Array 對象
round 返回與給出的數值表達式最接近的整數
s
search 返回與正則表達式查找內容匹配的第一個子字元串的位置
setDate 設置 Date 對象中用本地時間表示的數字日期
setFullYear 設置 Date 對象中用本地時間表示的年份值
setHours 設置 Date 對象中用本地時間表示的小時值
setMilliseconds 設置 Date 對象中用本地時間表示的毫秒值
setMinutes 設置 Date 對象中用 本地時間表示的分鍾值
setMonth 設置 Date 對象中用 本地時間表示的月份值
setSeconds 設置 Date 對象中用 本地時間表示的秒鍾值
setTime 設置 Date 對象的日期和時間值
setUTCDate 設置 Date 對象中用全球標准時間 (UTC)表示的數值日期
setUTCFullYear 設置 Date 對象中用全球標准時間 (UTC)表示的年份值
setUTCHours 設置 Date 對象中用全球標准時間 (UTC)表示的小時值
setUTCMilliseconds 設置 Date 對象中用全球標准時間 (UTC)表示的毫秒值
setUTCMinutes 設置 Date 對象中用全球標准時間 (UTC)表示的分鍾值
setUTCMonth 設置 Date 對象中用 全球標准時間 (UTC)表示的月份值
setUTCSeconds 設置 Date 對象中用全球標准時間 (UTC)表示的秒值
setYear 設置 Date 對象中的年份值
shift 移除數組中的第一個元素並返回該元素
sin 返回數字的正弦值
slice (Array) 返回一個數組的一段
slice (String) 返回字元串的片段
small 將 HTML 的<SMALL> 標識添加到 String 對象中的文本兩端
sort 返回一個元素已經進行了排序的 Array 對象
splice 從一個數組中移除一個或多個元素，如果必要，在所移除元素的位置上插入新元素，返回所移除的元素
split 將一個字元串分割為子字元串，然後將結果作為字元串數組返回
sqrt 返回數字的平方根
strike 將 HTML 的<STRIKE> 標識放置到 String 對象中的文本兩端
sub 將 HTML 的 <SUB> 標識放置到 String 對象中的文本兩端
substr 返回一個從指定位置開始的指定長度的子字元串
substring 返回位於 String 對象中指定位置的子字元串
sup 將 HTML 的<sup> 標識放置到 String 對象中的文本兩端
t
tan 返回數字的正切值
test 返回一個 Boolean 值，它指出在被查找的字元串中是否存在模式
toArray 返回一個由 VBArray 轉換而來的標准 JScript 數組
toDateString 以字元串值的形式返回一個日期
toExponential 返回一個字元串，其中包含一個以指數記數法表示的數字
toFixed 返回一個字元串，代表一個以定點表示法表示的數字
toGMTString 返回一個日期，該日期用格林威治標准時間 (GMT) 表示並已被轉換為字元串
toLocaleDateString 以字元串的形式返回與宿主環境的當前區域設置相對應的日期
toLocaleLowerCase 返回一個字元串，其中所有的字母字元都被轉換為小寫，同時考慮到宿主環境的當前區域設置
toLocaleString 返回一個日期，該日期使用當前區域設置並已被轉換為字元串
toLocaleTimeString 以字元串的形式返回與宿主環境的當前區域設置相對應的時間
toLocaleUpperCase 返回一個字元串，其中所有的字母字元都被轉換為大寫，同時適應宿主環境的當前區域設置
toLowerCase 返回一個字元串，該字元串中的字母被轉換為小寫字母
toPrecision 返回一個字元串，其中包含一個以指數記數法或定點記數法表示的，具有指定數字位數的數字
toString 返回對象的字元串表示
toTimeString 以字元串形式返回時間
toUpperCase 返回一個字元串，該字元串中的所有字母都被轉化為大寫字母
toUTCString 返回一個已被轉換為字元串的，用全球標准時間 (UTC)表示的日期
ubound 返回在 VBArray 的指定維中所使用的最大索引值
unescape 解碼用 escape 方法進行了編碼的 String 對象
unshift 將指定的元素插入數組開始位置並返回該數組
UTC 返回全球標准時間 (UTC) (或 GMT) 的 1970 年 1 月 1 日到所指定日期之間所間隔的毫秒數
valueOf 返回指定對象的原始值

⑵ JS中canvas畫布繪制中如何實現縮放，位移，旋轉

cxt.scale(2,2);
縮放的是整個畫布，縮放後，繼續繪制的圖形會被放大或縮小。

ctx.translate(x,y) 方法重新映射畫布上的 (0,0) 位置
x： 添加到水平坐標（x）上的值
y： 添加到垂直坐標（y）上的值
發生位移後，相當於把畫布的0,0坐標 更換到新的x,y的位置，所有繪制的新元素都被影響。
位移畫布一般配合縮放和旋轉等。

context.rotate(angle); 方法旋轉當前的繪圖
注意參數是弧度（PI）
如需將角度轉換為弧度，請使用 degrees*Math.PI/180 公式進行計算。

⑶ 求大神js代碼 知道A點的坐標，繞著O(原點)旋轉任意角度求出旋轉後的B坐標。

這是數學題襲啊....

Rotate=function(Source,Angle)//Angle為正時逆時針轉動,單位為弧度
{
	varA,R;
	A=Math.atan2(Source.Y,Source.X)//atan2自帶坐標系識別,注意X,Y的順序
	A+=Angle//旋轉
	R=Math.sqrt(Source.X*Source.X+Source.Y*Source.Y)//半徑
	return{
		X:Math.cos(A)*R,
		Y:Math.sin(A)*R
	}
}
Rotate({X:0,Y:4},-Math.PI/4)

注意,由於牽扯浮點運算,所以你如果調用

Rotate({X:0,Y:4},Math.PI/2)

返回可能會是{X:-4,Y:4.898425415289509e-16}

Y很小但不等於0

當然如果用矩陣變換也是可以寫的..

⑷ js中的Math.sin()等一系列的函數的參數是什麼按什麼規律計算

js的Math.sin()等三角函數的參數，是以弧度表示的角。

給定角度，需要換算成弧度才可以參與內計算。兩者之間的關容系是：

弧度=角度數*Math.PI/180

因此，求45度角的sin()為：

Math.sin(45*Math.PI/180);

如果說規律：就是按照以弧度表示的三角函數的規律進行計算。

⑸ js Canvas實現的日歷時鍾案例有哪些

一、.獲取上下文對象
var cxt = document.getElementById(『元素名』).getContect(『2d』);
IE8或更早的瀏覽器不支持元素。

二、 drawClock() – 實現畫時鍾
1. clearRect() 清空給定矩形內的指定像素。
context.clearRect(x,y,width,height);

屬性 | 值
-----|------------
x,y | 要清除的矩形左上角點的(x,y)坐標
width,height| 要清除的矩形寬度和高度，單位為像素12345

2.new Date() — 得到系統時間

var sec = now.getSeconds(); var min = now.getMinutes(); var hour = now.getHours(); 123

3.畫時鍾的形狀

cxt.beginPath(); cxt.lineWidth = 10; cxt.strokeStyle = "blue"; cxt.arc(550, 310, 300, 0, 360, false); cxt.closePath(); cxt.stroke(); 123456

• beginPath()的作用是canvas的繪制方法，都會以上一次beginPath之後的所有路徑為基礎進行繪制。

• closepath()是關閉路徑，而不是結束路徑，它會試圖從當前路徑的終點連一條路徑到七、起點，讓整個路徑閉合起來。

• cxt.lineWidth() ： 畫筆的寬度

• cxt.strokeStyle() : 設置或返回用於筆觸的顏色、漸變或模式。

• 屬性值：color 指示繪圖筆觸顏色的 CSS 顏色值。默認值是 #000000。

• gradient 用於填充繪圖的漸變對象（線性或放射性）

• pattern 用於創建 pattern 筆觸的 pattern 對象

• stroke ()繪制已定義的路徑

• arc() 方法創建弧/曲線（用於創建圓或部分圓）。如需通過 arc() 來創建圓，請把起始角設置為 0，結束角設置為 2*Math.PI。
  context.arc(x,y,r,sAngle,eAngle,counterclockwise);

參數

描述

x 圓的中心的 x 坐標。

y 圓的中心的 y 坐標。

r 圓的半徑。

sAngle 起始角，以弧度計。（弧的圓形的三點鍾位置是 0 度）。

eAngle 結束角，以弧度計。

counterclockwise 可選。規定應該逆時針還是順時針繪圖。False = 順時針，true = 逆時針。

4）drawScale — 自定義函數畫刻度

• function drawScale(size, width, color, value, startx, starty, endx, endy){


• for(var i = 0; i < size; i++){


• drawPointer(width, color, value, i, startx, starty, endx, endy);


• } } 12345



5. 畫時鍾刻度依託點

• function drawPointer(width, color, value, angle, startx, starty, endx, endy){


• cxt.save(); //先保存當前畫布


• cxt.lineWidth = width; //設置畫筆的寬度


• cxt.strokeStyle = color; //設置畫筆的顏色


• cxt.translate(550, 310); //重置異次元空間的原點坐標


• cxt.rotate(value * angle * Math.PI / 180); //設置旋轉的角度，參數是弧度


• cxt.beginPath();


• cxt.moveTo(startx, starty);


• cxt.lineTo(endx, endy);


• cxt.closePath(); //先閉合路徑，再畫線


• cxt.stroke(); //開始畫線


• cxt.restore(); //將旋轉後的線段返回給畫布 } 12345678910111213



• translate() 方法重新映射畫布上的 (0,0) 位置。

• -

JS代碼如下：

• //獲取上下文文檔對象 var clock = document.getElementById('clock');


• var cxt = clock.getContext('2d');



• //畫指針 function drawPointer(width, color, value, angle, startx, starty, endx, endy){


• cxt.save(); //先保存當前畫布


• cxt.lineWidth = width; //設置畫筆的寬度


• cxt.strokeStyle = color; //設置畫筆的顏色


• cxt.translate(550, 310); //重置異次元空間的原點坐標


• cxt.rotate(value * angle * Math.PI / 180); //設置旋轉的角度，參數是弧度


• cxt.beginPath();


• cxt.moveTo(startx, starty);


• cxt.lineTo(endx, endy);


• cxt.closePath(); //先閉合路徑，再畫線


• cxt.stroke(); //開始畫線


• cxt.restore(); //將旋轉後的線段返回給畫布 }



• //畫刻度 function drawScale(size, width, color, value, startx, starty, endx, endy){


• for(var i = 0; i < size; i++){


• drawPointer(width, color, value, i, startx, starty, endx, endy);


• }


• }



• //為表盤的中心填充顏色 function drawFill(){


• cxt.save();


• cxt.beginPath();


• cxt.arc(550, 310, 7, 0, 360, false);


• cxt.closePath();


• cxt.fillStyle = "red";


• cxt.fill();


• cxt.restore();


• }



• //畫時鍾 function drawClock(){


• cxt.clearRect(0, 0, 1350, 620); //清空整個畫布



• var now = new Date(); //獲取系統時間，取出時,分,秒


• var sec = now.getSeconds();


• var min = now.getMinutes();


• var hour = now.getHours();


• min += sec / 60;


• hour += min / 60;


• if(hour > 12) hour -= 12;



• cxt.beginPath();


• cxt.lineWidth = 10;


• cxt.strokeStyle = "blue";


• cxt.arc(550, 310, 300, 0, 360, false);


• cxt.closePath();


• cxt.stroke();



• drawScale(12, 7, "pink", 30, 0, -280, 0, -260); //畫時刻度


• drawScale(60, 5, "pink", 6, 0, -280, 0, -270); //畫分刻度


• drawPointer(7, "purple", hour, 30, 0, 12, 0, -210); //畫時針


• drawPointer(5, "yellow", min, 6, 0, 15, 0, -240); //畫分針


• drawPointer(4, "red", sec, 6, 0, 17, 0, -250); //畫秒針



• //細化秒針,為秒針加箭頭


• drawPointer(3, "red", sec, 6, -7, -235, 0, -255);


• drawPointer(3, "red", sec, 6, 7, -235, 0, -255);


• drawFill();


• }



• drawClock();


• setInterval(drawClock, 1000); //setInterval()方法中表示每隔1000ms，就執行drawClock一次