context.isPointInPath(x, y) 和想象中的不一样啊？-PHP Chinese Network Q&A

Community Learn Tools Library Leisure

English

context.isPointInPath(x, y) 和想象中的不一样啊？

高洛峰 2016-10-26 13:39:11

831

<!DOCTYPE html>
<html>
<head>

    <meta charset="UTF-8">
    <title>Canvas: Point In Path</title>

</head><body>

   <canvas id="canvas"></canvas>
   <script>
   var canvas = document.getElementById('canvas');
   var context = canvas.getContext('2d');

   canvas.width = 600;
   canvas.height = 400;

   context.fillStyle = "#efefef";
   context.fillRect(0, 0, canvas.width, canvas.height);

   context.beginPath();
   context.strokeStyle = "blue";
   context.lineWidth = 3;
   context.moveTo(30, 30);
   context.lineTo(300, 300);
   context.stroke();
   context.closePath();

   console.log(context.isPointInPath(30, 30)); // true
   console.log(context.isPointInPath(100, 100)); // false
   console.log(context.isPointInPath(300, 300)); // true
   </script>

</body></html>

(100, 100)为什么判断不在path上，奇怪啊，是哪里遗漏了什么吗？