案例根據兩點,計算出兩點之間的夾角,然後利用css3 旋轉的角度,畫出斜線
計算兩點之間位移
根據長的一條邊,乙個畫素乙個畫素的拆分為點,然後乙個乙個拼湊
0]// 獲得人物中心和滑鼠座標連線,與y軸正半軸之間的夾角
function
getangle
(x1, y1, x2, y2)
if(x2 > x1 && y2 < y1)
if(x2 === x1 && y1 > y2)
if(x2 < x1 && y2 < y1)
if(x2 < x1 && y2 === y1)
if(x2 < x1 && y2 > y1)
if(x2 === x1 && y2 > y1)
if(x2 > x1 && y2 > y1)
return angle;
}// 第乙個點的座標
let firstpoint =
// 第二個點的座標
let secondpoint =
// 計算出兩個點之間的距離
let line = math.
sqrt
(math.
pow(
(firstpoint.xpoint - secondpoint.xpoint),2
)+ math.
pow(
(firstpoint.ypoint - secondpoint.ypoint),2
))// 設定乙個div 寬度為 兩點之間的距離,並且以 transform-origin: 0 50% 為圓心旋轉,角度已經算出來
let linehtmlstr =
`$px;top:
$px;left:
$px;transform:rotate(
$deg);transform-origin: 0 50%;">`;
// 新增到body 後面
建立連線button
>
class
="point"
style
="top
:342px;
left
:513px
">
div>
class
="point"
style
="top
:450px;
left
:468px
">
div>
style
="position
:absolute;
border-top
: 1px solid red;
width
:117px;
top:342px;
left
:513px;
transform
:rotate
(112.61986494804043deg)
;transform-origin
: 0 50%;
" >
div>
body
>
>
document.
getelementbyid
("mybtn").
onclick
=function
(e);
function
createline()
; firstpoint.xpoint = event.pagex;
firstpoint.ypoint = event.pagey;
}else
; secondpoint.xpoint = event.pagex;
secondpoint.ypoint = event.pagey;}if
(firstpoint !==
null
&& secondpoint !==
null
)px;top:
$px;left:
$px;transform:rotate(
$deg);transform-origin: 0 50%;">`;
let bodydiv = document.
getelementsbytagname
("body")[
0];// 新增到body 後面
bodydiv.innerhtml = bodydiv.innerhtml + linehtmlstr;
document.
removeeventlistener
("click"
, createpoints);}
}// 計算連線
function
calcline
(firstpoint, secondpoint)
// 計算角度
// 獲得人物中心和滑鼠座標連線,與y軸正半軸之間的夾角
function
getangle
(x1, y1, x2, y2)
if(x2 > x1 && y2 < y1)
if(x2 === x1 && y1 > y2)
if(x2 < x1 && y2 < y1)
if(x2 < x1 && y2 === y1)
if(x2 < x1 && y2 > y1)
if(x2 === x1 && y2 > y1)
if(x2 > x1 && y2 > y1)
return angle;
}// 解決第一次繫結的時候執行方法
// settimeout(function() , 0);
}script
>
html
>
確定兩點之間的點
egret.point.interpolate 確定兩個指定點之間的點。引數 f 確定新的內插點相對於引數 pt1 和 pt2 指定的兩個端點所處的位置。引數 f 的值越接近 1.0,則內插點就越接近第乙個點 引數 pt1 引數 f 的值越接近 0,則內插點就越接近第二個點 引數 pt2 param...
計算兩點之間的距離
檔名稱 test.cpp 完成日期 2013年10月17日 版本號 v1.0 輸入描述 輸入兩個橫縱座標 問題描述 輸入兩個橫縱座標,求兩點之間的距離 程式輸出 兩點之間的距離 問題分析 通過輸入兩個橫縱座標,求兩點之間的距離 演算法設計 略 include includeusing namespa...
2025 兩點之間的距離
time limit 3 second memory limit 2 mb 輸入平面上兩點的座標,通過呼叫乙個計算兩點間距離的函式求出兩者的距離 兩行,第一行為某一點的座標x y,中間用空格隔開,第二行為另一點的座標x y,中間用空格隔開。一行,兩點間的距離,保留兩位小數 8.5 12.5 1 01...