<!DOCTYPE?html>
<html?lang="en">
<head>
<meta?charset="UTF-8">
<meta?http-equiv="X-UA-Compatible"?content="IE=edge">
<meta?name="viewport"?content="width=device-width,?initial-scale=1.0">
<title>createMood</title>
</head>
<body>
<canvas?id="canvas"?style="border:1px?solid?#ddd;"></canvas>
<script>
window.onload?=?function(){
var?canvas?=?document.getElementById("canvas");
canvas.width?=?800;
canvas.height?=?800;
var?context?=?canvas.getContext("2d");
//以400?400?為圓心，300為半徑，逆時針繪制半弧，月亮的外圓
context.arc(400,400,300,0.5*Math.PI,1.5*Math.PI,true);
context.moveTo(400,100);
//以1200?400?為圓心?畫內弧
context.arcTo(1200,400,400,700,(400?-?100)*dis(400,100,1200,400)/(1200?-?400));
context.stroke();
}
function?dis(x1,y1,x2,y2){
return?Math.sqrt(x1-x2)*(x1-x2)+(y1-y2)*(y1-y2);
}
</script>
</body>
</html>
2022-10-25
dis 方法中的 Math.sqrt 錯了
function dis (x1, y1, x2, y2) {
? ? ? return Math.sqrt((x1 - x2) * (x1 - x2) + (y1 - y2) * (y1 - y2));
? ? }
少了個括號把參數包住