Giter Club home page Giter Club logo

jsbarcode's Introduction

Demo

Barcode Generator

Introduction

JsBarcode is a simple way to create different types of 1d barcodes.
The plugin uses Html5Canvas to generate draw the barcodes

This is the list of supported barcodes:

  • CODE128 (B or C)
  • EAN (13)
  • UPC-A
  • CODE39
  • ITF (Interleaved 2 of 5)
  • ITF14
  • Pharmacode

Bower

As well as downloading the files and including them regularly, you can use Bower to install and manage the library

bower install jsbarcode --save

Setup

  • Include the JsBarcode plugin in the document.
<script src="JsBarcode.js"></script>
  • Include the CODE128.js if you want to generate a CODE 128 barcode.
<script src="CODE128.js"></script>

OR you can include the comined script with everything you need.

<script src="JsBarcode.all.min.js"></script>

Use

####There are two ways of using the library: With jQuery:

$(object).JsBarcode(string,options);

Or pure JavaScript:

JsBarcode(object, string, options);

####The parameters:

  • string is the sring to be encoded to the barcode
  • options is additional options put i an object (look below)

####The default options:

{
	width:	2,
	height:	100,
	quite: 10,
	format:	"CODE128",
	displayValue: false,
	font:"monospace",
	textAlign:"center",
	fontSize: 12,
	backgroundColor:"",
	lineColor:"#000"
}

Examples

####First we need an image (or a canvas - it works both ways!)

<img id="barcode">

or

<canvas id="barcode"></canvas>

This code:

$("#barcode").JsBarcode("Hi!");

Will generate this image:

Result

This code:

$("#barcode").JsBarcode("Javascript is fun!",{width:1,height:25});

Will generate this image:

Result

This code:

$("#barcode").JsBarcode("9780199532179",{format:"EAN",displayValue:true,fontSize:20});

Will generate this image:

Result

This code:

setInterval(function(){
	var date = new Date();
	$("#barcode").JsBarcode(date.getHours()+":"+date.getMinutes()+":"+date.getSeconds());
},1000);

Will create a barcode clock:

Click here to see it

Minify the latest code

Use the closure compiler with this input

// ==ClosureCompiler==
// @output_file_name JsBarcode.all.min.js
// @code_url https://raw.github.com/lindell/JsBarcode/master/CODE128.js
// @code_url https://raw.github.com/lindell/JsBarcode/master/CODE39.js
// @code_url https://raw.github.com/lindell/JsBarcode/master/EAN_UPC.js
// @code_url https://raw.github.com/lindell/JsBarcode/master/ITF.js
// @code_url https://raw.github.com/lindell/JsBarcode/master/ITF14.js
// @code_url https://raw.github.com/lindell/JsBarcode/master/pharmacode.js
// @code_url https://raw.github.com/lindell/JsBarcode/master/JsBarcode.js
// ==/ClosureCompiler==

jsbarcode's People

Contributors

bcho avatar kafo85 avatar karrirasinmaki avatar lindell avatar lucascs avatar n1ck avatar schaumiii avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.