Skip to content

Options

Jump to bottom Edit New page
Johan Lindell edited this page Apr 24, 2016 · 24 revisions

Width (default: 2)

The width option is the width of a single bar.

Examples:
JsBarcode("#barcode", "Smallest width", {
  width: 1
});

JsBarcode("#barcode", "Wider barcode", {
  width: 3
});
Result:

Smallest width Wider barcode

Height (default: 100)

The height of the barcode.

Examples:
JsBarcode("#barcode", "Wider barcode", {
  height: 150
});

JsBarcode("#barcode", "Smallest width", {
  height: 25
});
Result:

Tall barcode Short barcode

Format (default: "auto" (CODE128))

Select which barcode type to use. Please check the wikipage of the different barcode types for more information.

Examples:
JsBarcode("#barcode", "123456789012", {
  format: "EAN13"
});

JsBarcode("#barcode", "123456789012", {
  format: "CODE39"
});
Result:

EAN13 CODE39

Font Options (default: "")

With fontOptions you can add bold or italic text to the barcode.

Examples:
JsBarcode("#barcode", "Bold text", {
  fontOptions: "bold"
});

JsBarcode("#barcode", "Italic text", {
  fontOptions: "italic"
});

JsBarcode("#barcode", "Both options", {
  fontOptions: "bold italic"
});
Result:

Bold text Italic text Both options

Font (default: "monospace")

Define the font used for the text in the generated barcode. This can be any default font or a font defined by a @font-face rule.

Examples:
JsBarcode("#barcode", "Fantasy font", {
  font: "fantasy"
});
Result:

Fantasy font

Text Align (default: "center")

Set the horizontal alignment of the text. Can be left / center / right.

Examples:
JsBarcode("#barcode", "Left text", {
  textAlign: "left"
});
Result:

Left text

Text Position (default: "bottom")

Set the vertical position of the text. Can be bottom / top.

Examples:
JsBarcode("#barcode", "Top text", {
  textPosition: "top"
});
Result:

Top text

Text Margin (default: 2)

Set the space between the barcode and the text.

Examples:
JsBarcode("#barcode", "Text margin", {
  textMargin: 25
});
Result:

Text margin

Font Size (default: 20)

Set the size of the text.

Examples:
JsBarcode("#barcode", "Bigger text", {
  fontSize: 40
});
Result:

Bigger text

Background (default: "#ffffff")

Set the background of the barcode.

Examples:
JsBarcode("#barcode", "Blue background", {
  background: "#ccffff"
});
Result:

Blue background

Line Color (default: "#000000")

Set the color of the bars and the text.

Examples:
JsBarcode("#barcode", "Red lines", {
  lineColor: "#990000"
});
Result:

Red lines

Margins (default: 10)

Set the space margin around the barcode. If nothing else is set, all side will inherit the margins property but can be replaced if you want to set them separably.

Examples:
JsBarcode("#barcode", "Bigger margins", {
  margin: 30,
  background: "#dddddd"
});

JsBarcode("#barcode", "Left/Top margin", {
  marginLeft: 30,
  marginTop: 50,
  background: "#dddddd"
});
Result:

Bigger margins Left/Top margin

Clone this wiki locally