Draw Cylinder - Node.js HTML

Node.js examples for HTML:Canvas

  1. HOME
  2. Node.js
  3. HTML
  4. Canvas

Description

Draw Cylinder

Demo Code


    if (CanvasRenderingContext2D.prototype.drawCylinder === undefined) {
        CanvasRenderingContext2D.prototype.drawCylinder = function drawCylinder(x, y, w, h) {

            var i, xPos, yPos, pi = Math.PI, twoPi = 2 * pi;
            this.beginPath();/*from   ww  w. ja v  a2 s .c  o  m*/
            for (i = 0; i < twoPi; i += 0.001) {
                xPos = (x + w / 2) - (w / 2 * Math.cos(i));
                yPos = (y + h / 8) + (h / 8 * Math.sin(i));

                if (i === 0) {
                    this.moveTo(xPos, yPos);
                } else {
                    this.lineTo(xPos, yPos);
                }
            }
            this.moveTo(x, y + h / 8);
            this.lineTo(x, y + h - h / 8);

            for (i = 0; i < pi; i += 0.001) {
                xPos = (x + w / 2) - (w / 2 * Math.cos(i));
                yPos = (y + h - h / 8) + (h / 8 * Math.sin(i));

                if (i === 0) {
                    this.moveTo(xPos, yPos);
                } else {
                    this.lineTo(xPos, yPos);
                }
            }
            this.moveTo(x + w, y + h / 8);
            this.lineTo(x + w, y + h - h / 8);
        }
    }
}());

Related Tutorials