バーコードのフォーマットはいくつかあります。単純なものもあれば、非常に複雑なものもあります。アプリケーションに適合する場合、最も使いやすいのは 3 of 9 バーコードです。圧縮されておらず、バーコード内の文字と 1 対 1 の関係があります。これには、数値のみと、アルファを含む拡張セットの 2 つのバリエーションがあります。この形式を使用できるという前提で先に進みます。(サンプルコードから、それがあなたが使用しているように見えます)最も簡単な実装のために、数値のみに固執してください。そうすれば、11 文字 (0 から 9 とアスタリスク) だけが必要になります。既存の 3 of 9 フォントの定義を見てください。(非商用の場合は、FREE3OF9 というフォントを検索してください。それをアプリのベースとして使用できます...)
次に、退屈な部分です。前もってより多くの作業を行う必要がありますが、ほとんどすべてのブラウザーで表示されます。オンラインで見つからない場合は、文字ごとに GIF (または BMP または PNG) 画像を作成します。(行内の次の文字から離すために、文字の右側に適切な空白を含めることを忘れないでください!) 必要なのは 1 ピクセルの高さだけです。バーコードを表示するときが来たら、文字を のように並べて並べます<IMG>
。3 of 9 では、バーコード内の文字の両端をアスタリスク (FREE3OF9 フォントのアスタリスク) で囲むかラップする必要があります。<IMG>
の高さを、印刷物に合わせて十分な高さに設定します。
この方法では、クライアントにフォントをインストールする必要はありませんが、ほとんどのバーコード デコーダーは結果のグラフィックを読み取ることができます。
例 ( *574656*
) は次のようになります。

(正確にはそうではありません。複数のインラインの単一のグラフィックスの構成ではなく、ソリッドなグラフィックスですが、アイデアは得られます)
個々の数値グラフィックは次のようになります: (ただし、これらはまだ「クリーンアップ」されていません)
*

0

1

2

3

4

5

6

7

8
9
コードの変更は次のようになります。
<html>
<head>
<title>Barcode Font Test</title>
</head>
<body>
<img src="3o9cb_ast.png" alt="*"/>
<img src="3o9cb_5.png" alt="5"/>
<img src="3o9cb_7.png" alt="7"/>
<img src="3o9cb_4.png" alt="4"/>
<img src="3o9cb_6.png" alt="6"/>
<img src="3o9cb_5.png" alt="5"/>
<img src="3o9cb_6.png" alt="6"/>
<img src="3o9cb_ast.png" alt="*"/>
</body>
</html>
SearchFreeFonts.comをリソースとして使用して、9 つのバーコード文字のうち 3 つがどのようにフォーマットされたかの記憶をリフレッシュしました。これらのグラフィックは、最初はそのサイトからのものです。