curve-through-point.js 445 B

123456789101112131415161718192021
  1. var stage = new mtm.Stage('c'),
  2. x0 = 100, y0 = 200,
  3. x1 = 0, y1 = 0,
  4. x2 = 300, y2 = 200;
  5. stage.canvas.addEventListener("mousemove", function(e) {
  6. var mx = e.offsetX || e.clientX,
  7. my = e.offsetY || e.clientY,
  8. ctx = stage.ctx;
  9. x1 = mx * 2 - (x0 + x2) / 2;
  10. y1 = my * 2 - (y0 + y2) / 2;
  11. stage.clear();
  12. ctx.beginPath();
  13. ctx.moveTo(x0, y0);
  14. ctx.quadraticCurveTo(x1, y1, x2, y2);
  15. ctx.stroke();
  16. }, false);