使用重心坐標（barycentric coordinates）或者通過面積比例的方法來確定點是否在三角形內。不過，對于簡單的應用，一種常見的方法是使用隨機點并檢查它們是否在三角形內部。如果不在，就重新生成，直到得到足夠數量的在三角形內的點。
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Random Points in Triangle</title>
</head>
<body><canvas id="myCanvas" width="500" height="500" style="border:1px solid #000000;"></canvas><script>// 獲取Canvas元素和繪圖上下文var canvas = document.getElementById('myCanvas');var ctx = canvas.getContext('2d');// 定義三角形的三個頂點var vertex1 = { x: 50, y: 400 };var vertex2 = { x: 450, y: 50 };var vertex3 = { x: 50, y: 50 };// 檢查點是否在三角形內部（使用面積法）function isPointInTriangle(px, py, v1, v2, v3) {var b1 = (py - v3.y) * (v2.x - v3.x) - (px - v3.x) * (v2.y - v3.y);var b2 = (py - v1.y) * (v3.x - v1.x) - (px - v1.x) * (v3.y - v1.y);var b3 = (py - v2.y) * (v1.x - v2.x) - (px - v2.x) * (v1.y - v2.y);return (b1 > 0 || b2 > 0 || b3 > 0) && (b1 < 0 || b2 < 0 || b3 < 0);}// 生成三角形內部的隨機點function getRandomPointInTriangle(v1, v2, v3) {var r1, r2, s, t;// 生成兩個0到1之間的隨機數do {r1 = Math.random();r2 = Math.random();// 計算重心坐標s = r1;t = 1 - r1 - r2 * Math.sqrt(r1); // 確保t在0到1之間// 如果s+t+r2>1，則點在三角形外部，重新生成} while (s + t > 1);// 根據重心坐標計算點的位置var px = v1.x + s * (v2.x - v1.x) + t * (v3.x - v1.x);var py = v1.y + s * (v2.y - v1.y) + t * (v3.y - v1.y);return { x: px, y: py };}// 繪制三角形function drawTriangle(v1, v2, v3) {ctx.beginPath();ctx.moveTo(v1.x, v1.y);ctx.lineTo(v2.x, v2.y);ctx.lineTo(v3.x, v3.y);ctx.closePath();ctx.strokeStyle = 'black';ctx.lineWidth = 1;ctx.stroke();}// 繪制指定數量的隨機點function drawRandomPointsInTriangle(numPoints, v1, v2, v3) {ctx.fillStyle = 'red'; // 設置點的顏色for (var i = 0; i < numPoints; i++) {var point = getRandomPointInTriangle(v1, v2, v3);// 確保點在三角形內部（理論上getRandomPointInTriangle已經保證了這一點，但這里可以作為一個額外的檢查）if (isPointInTriangle(point.x, point.y, v1, v2, v3)) {ctx.beginPath();ctx.arc(point.x, point.y, 2, 0, Math.PI * 2, true); // 繪制一個小圓作為點ctx.fill();} else {// 如果出于某種原因點不在三角形內（理論上不應該發生），則重新生成該點i--; // 減少計數器，因為這次循環沒有成功生成一個有效點}}}// 調用函數繪制三角形和隨機點drawTriangle(vertex1, vertex2, vertex3); // 先繪制三角形drawRandomPointsInTriangle(10, vertex1, vertex2, vertex3); // 再繪制隨機點</script>
</body>
</html>
