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

图片描述

<!DOCTYPE html>
<html lang="en">
<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上,奇怪啊,是哪里遗漏了什么吗?

阅读 3.6k
1 个回答

没有遗漏,浏览器的问题,Chrome上有问题Safari上没事

clipboard.png

clipboard.png

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题