Options - lindell/JsBarcode GitHub Wiki
All Options:
Option | Default value | Type |
---|---|---|
format |
"auto" (CODE128) |
String |
width |
2 |
Number |
height |
100 |
Number |
displayValue |
true |
Boolean |
text |
undefined |
String |
fontOptions |
"" |
String |
font |
"monospace" |
String |
textAlign |
"center" |
String |
textPosition |
"bottom" |
String |
textMargin |
2 |
Number |
fontSize |
20 |
Number |
background |
"#ffffff" |
String (CSS color) |
lineColor |
"#000000" |
String (CSS color) |
margin |
10 |
Number |
marginTop |
undefined |
Number |
marginBottom |
undefined |
Number |
marginLeft |
undefined |
Number |
marginRight |
undefined |
Number |
flat |
false |
Boolean |
valid |
function(valid){} |
Function |
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:
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:
Height
default: 100
The height of the barcode.
Examples:
JsBarcode("#barcode", "Tall barcode", {
height: 150
});
JsBarcode("#barcode", "Short barcode", {
height: 25
});
Result:
Text
default: undefined
Overide the text that is diplayed
Examples:
JsBarcode("#barcode", "Hello", {
text: "Hi!"
});
Result:
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:
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:
Text Align
default: "center"
Set the horizontal alignment of the text. Can be left / center / right.
Examples:
JsBarcode("#barcode", "Left text", {
textAlign: "left"
});
Result:
Text Position
default: "bottom"
Set the vertical position of the text. Can be bottom / top.
Examples:
JsBarcode("#barcode", "Top text", {
textPosition: "top"
});
Result:
Text Margin
default: 2
Set the space between the barcode and the text.
Examples:
JsBarcode("#barcode", "Text margin", {
textMargin: 25
});
Result:
Font Size
default: 20
Set the size of the text.
Examples:
JsBarcode("#barcode", "Bigger text", {
fontSize: 40
});
Result:
Background
default: "#ffffff"
Set the background of the barcode.
Examples:
JsBarcode("#barcode", "Blue background", {
background: "#ccffff"
});
Result:
Line Color
default: "#000000"
Set the color of the bars and the text.
Examples:
JsBarcode("#barcode", "Red lines", {
lineColor: "#990000"
});
Result:
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:
Flat
default: false
Only for EAN8/EAN13
Examples:
JsBarcode("#barcode", "29012343", {
format: "EAN8",
flat: false
});
JsBarcode("#barcode", "29012343", {
format: "EAN8",
flat: true
});