Drawing With JavaScript

Question:
It seems to me that you should be able to draw images in JavaScript by positioning single-pixel GIF images according to a given algorithm. First, how would you generate a single-pixel GIF file? Second, can you place such an image at a location with plus-or-minus one-pixel accuracy?

Answer:
You certainly can “draw” with JavaScript by creating HTML on the fly and manipulating the display of single-pixel GIF images via their HEIGHT and WIDTH attributes. Placing images with pixel accuracy, although difficult, is doable using tables and/or Cascading Style Sheets (CSS). The real question, though, is whether or not you really need to do this. The most you should expect from such a technique is Etch-A-Sketch type of drawings and anything beyond a few simple lines gets very complicated in a hurry. Creating the images on the fly on your Web server will not only prove much easier, it will also be compatible with all browsers.

Share the Post:
Share on facebook
Share on twitter
Share on linkedin

Overview

Recent Articles: