Web Component for generating QR Codes, using (a fork of) qr.js lib.
Maintained by Eduard Castellano.
-
NPM and Browserify (polyfill and the component):
Install:
npm install webcomponents.js npm install webcomponent-qr-code
Import:
require('node_modules/webcomponents.js/webcomponents'); require('node_modules/webcomponent-qr-code/src/qr-code');
-
Bower (polyfill, qr.js and the component):
Install:
bower install webcomponentsjs bower install webcomponent-qr-code
Import:
<script src="bower_components/webcomponentsjs/webcomponents.min.js"></script> <script src="bower_components/qrjs/qr.js"></script> <script src="bower_components/webcomponent-qr-code/src/qr-code.js"></script>
You can also import the component with HTML Imports, but you still need to import the polyfill and the qr.js lib separately:
<link rel="import" href="bower_components/webcomponent-qr-code/src/qr-code.html">
-
Start using it!
<qr-code data="hello world!"></qr-code>
Attribute | Options | Default | Description |
---|---|---|---|
data |
string | null |
The information encoded by the QR code. |
format |
png , html , svg |
png |
Format of the QR code rendered inside the component. |
modulesize |
int | 5 |
Size of the modules in pixels. |
margin |
int | 4 |
Margin of the QR code in modules. |
- Fork it!
- Create your feature branch:
git checkout -b my-new-feature
- Commit your changes:
git commit -m 'Add some feature'
- Push to the branch:
git push origin my-new-feature
- Submit a pull request :D
- v0.1.7 April 11, 2015
- Support for SVG
- v0.1.6 April 10, 2015
- Default attributes
- qr.js removed and used as a dependency
- Available in NPM
- v0.1.1 March 31, 2015
- Framework-agnostic webcomponent (no use of Polymer)
- Available in Bower
- v0.0.1 September 18, 2013
- Started project using boilerplate-element