Sync

Task/Bitmap/JavaScript/bitmap.js

@@ -0,0 +1,28 @@
+// Set up the canvas
+var canvas = document.createElement("canvas"),
+    ctx = canvas.getContext("2d"),
+    width = 400, height = 400;
+
+ctx.canvas.width = width;
+ctx.canvas.height = height;
+
+// Optionaly add it to the current page
+document.body.appendChild(canvas);
+
+// Draw an image
+var img = document.createElement("img");
+img.onload = function(){
+    // Draw the element into the top-left of the canvas
+    ctx.drawImage(img, 0, 0);
+};
+img.src = "//placehold.it/400x400";
+
+// Fill the canvas with a solid blue color
+ctx.fillStyle = "blue";
+ctx.fillRect(0, 0, width, height);
+
+// Place a black pixel in the middle
+// Note that a pixel is a 1 by 1 rectangle
+// This is the fastest method as of 2012 benchmarks
+ctx.fillStyle = "black";
+ctx.fillRect(width / 2, height / 2, 1, 1);