Generador de código QR personalizable en Vanilla JavaScript-qrjs2

Vista prévia

Descripción

qrjs2 es una versión modificada del QR. js que le permite generar códigos QR personalizables usando SVG, PNG e incluso Elemento de tabla HTML.

Instalación

# NPM
$ npm install qrjs2

# Bower
$ bower install qrjs2

Funcionamiento

Inserte el archivo principal de JavaScript qrjs2. js en el documento y ya está listo para ir.

<script src="qrjs2.js"></script>

Genere un código QR basado en SVG dentro de su elemento div.

var svgElement = document.createElement("div"),
u = "https://wikicss.com",
s = QRCode.generateSVG(u, {


//options here

});
svgElement.appendChild(s);
document.body.appendChild(svgElement);

Genere un código QR SVG con los URI de datos y el respaldo de PNG.

if (document.implementation.hasFeature("http://www.w3.org/2000/svg","1.1")) {

var dataUriSvgImage = document.createElement("img"),

u = "https://github.com",

s = QRCode.generateSVG(u, {



// options here


});

var XMLS = new XMLSerializer();

s = XMLS.serializeToString(s);

s = "data:image/svg+xml;base64," + window.btoa(unescape(encodeURIComponent(s)));

dataUriSvgImage.src = s;

document.body.appendChild(dataUriSvgImage);
}
var dataUriPngImage = document.createElement("img"),
u = "https://github.com",
s = QRCode.generatePNG(u, {


// options here

});
dataUriPngImage.src = s;
document.body.appendChild(dataUriPngImage);

Genere un código QR basado en tablas HTML.

var htmlTable = document.createElement("div"),
u = "https://wikicss.com",
s = QRCode.generateHTML(u, {


// options here

});
htmlTable.appendChild(s);
document.body.appendChild(htmlTable);

Todas las opciones predeterminadas para personalizar los códigos QR.

// 'L', 'M', 'Q' and 'H'
ecclevel: "M",

// fill color
fillcolor: "#FFFFFF",

// text color
textcolor: "#373737",

// margin size
margin: 4,

// module size
modulesize: 8

Registro de cambios

v0.1.7 (12/29/2018)

• Se ha reorginizado el árbol de archivos de la biblioteca

v0.1.6 (10/23/2017)

• Se eliminó la mención de CSS, porque no hay uno para esta biblioteca