https://github.com/component/pipe

Canvas pipe connection between two points
https://github.com/component/pipe

Last synced: 13 days ago
JSON representation

Canvas pipe connection between two points

• Host: GitHub
• URL: https://github.com/component/pipe
• Owner: component
• Created: 2013-04-30T02:55:11.000Z (over 11 years ago)
• Default Branch: master
• Last Pushed: 2013-04-30T02:55:23.000Z (over 11 years ago)
• Last Synced: 2024-05-08T17:06:45.292Z (8 months ago)
• Language: JavaScript
• Size: 102 KB
• Stars: 6
• Watchers: 7
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: Readme.md
  • Changelog: History.md

Awesome Lists containing this project

README

        

# pipe

  Canvas "pipe" between two points.

## Installation

    $ component install component/pipe

## Example

```html

  var raf = require('raf');

  var pipe = require('pipe');

  var canvas = document.querySelector('canvas');

  var ctx = canvas.getContext('2d');

  var a = { x: 500, y: 300 };

  var b = { x: 500, y: 500 };

  var g = 0;

  var x;

  var y;

  canvas.onmousemove = function(e){

    x = e.offsetX;

    y = e.offsetY;

  };

  function draw(){

    ctx.strokeStyle = '#ddd';

    canvas.width = canvas.width;

    b.x = x;

    b.y = y;

    pipe(ctx, a, b);

  }

  function animate() {

    raf(animate);

    draw();

  }

  animate();

```

## License

  MIT