How to use 'javascript drawrect' in JavaScript

Every line of 'javascript drawrect' code snippets is scanned for vulnerabilities by our powerful machine learning engine that combs millions of open source libraries, ensuring your JavaScript code is secure.

All examples are scanned by Snyk Code

By copying the Snyk Code Snippets you agree to
452function drawRect() {
453 var g = createGraphics();
454 var shape = g.getGraphicsData();
455
456 g.drawRect(0, 0, 100, 100);
457 eq(shape.styles.length, 0, "path commands don't write style data");
458 eq(shape.commands[0], PathCommand.LineTo, "1. lineTo command is stored");
459 eq(shape.coordinates[0], 100 * 20, "x is stored correctly");
460 eq(shape.coordinates[1], 0 * 20, "y is stored correctly");
461 eq(shape.commands[0], PathCommand.LineTo, "2. lineTo command is stored");
462 eq(shape.coordinates[2], 100 * 20, "x is stored correctly");
463 eq(shape.coordinates[3], 100 * 20, "y is stored correctly");
464 eq(shape.commands[0], PathCommand.LineTo, "3. lineTo command is stored");
465 eq(shape.coordinates[4], 0 * 20, "x is stored correctly");
466 eq(shape.coordinates[5], 100 * 20, "y is stored correctly");
467 eq(shape.commands[0], PathCommand.LineTo, "4. lineTo command is stored");
468 eq(shape.coordinates[6], 0 * 20, "x is stored correctly");
469 eq(shape.coordinates[7], 0 * 20, "y is stored correctly");
470 eq(shape.commandsPosition, 4, "instructions didn't write more data than expected");
471 eq(shape.coordinatesPosition, 8, "instructions didn't write more data than expected");
472
473 g.drawRect(200, 200, 100, 100);
474 eq(shape.commands[4], PathCommand.MoveTo, "moveTo command is stored if rect doesn't " +
475 "start at previous cursor coordinates");
476 eq(shape.coordinates[8], 200 * 20, "x is stored correctly");
477 eq(shape.coordinates[9], 200 * 20, "y is stored correctly");
478 eq(shape.commandsPosition, 9, "instructions didn't write more data than expected");
479 eq(shape.coordinatesPosition, 18, "instructions didn't write more data than expected");
480}
267function drawRect(x, y, width, height) {
268 this.commandQueue.push(new Command(function (x, y, width, height) {
269 var rendererContext = this.renderContext;
270 this.canvasContext.beginPath();
271 this.canvasContext.rect(rendererContext._transformTx + x, rendererContext._transformTy + y, width, height);
272 this.canvasContext.closePath();
273 }, this, [x, y, width, height]));
274 this._fill();
275}

Related snippets