3 of 9 barcodes using HTML5 canvas

3 of 9 bar codes are the easiest bar codes to create. Here, I’ll show you how to create ad-hoc 3 of 9 bar codes using javascript and html5 canvas. You can have bar codes on your web page! Does anyone remember the CueCat ?

Example:

3 of 9 bar codes consist of a set of 43 characters. This implementation doesn’t accommodate checksums and is Code 39 rather than “Full Code 39” and so doesn’t support lowercase letters.

Each character in a code 39 bar code is represented by 9 elements each of which can be a bar or space. The first and last characters of a bar code must be the asterisk character, and each character in a bar code (except the last) is followed by a terminating narrow space element.

This code creates a bar code of a specified character string as an HTML5 canvas element and inserts it into a specified DIV element.

Here’s how to use it:

    <script src="http://www.jlion.com/js/barcode/barcode39.js" asp-append-version="true"></script>

    <div>
    Example: <div id="example_barcode"></div>
    </div>

    <script type="text/javascript">
    AddBarCode('example_barcode', 'example');
    </script>