**My non tracking QR Code Maker runs well! However, the PNG images download at 96 DPI. How can they download at 300 DPI? Below is some JS.
const qrDataInput = document.getElementById('qrData');
const foregroundColorInput = document.getElementById('foregroundColor');
const backgroundColorInput = document.getElementById('backgroundColor');
const CoverInputImage = document.getElementById('CoverInputImage');
const CoverPreview = document.getElementById('CoverPreview');
const generateBtn = document.getElementById('generateBtn');
const downloadBtn = document.getElementById('downloadBtn');
const qrCanvas = document.getElementById('qrCanvas');
let CoverImage = null;
// Live Preview of Cover Image
CoverInputImage.addEventListener('change', (event) => {
const file = event.target.files[0];
if (file) {
const reader = new FileReader();
reader.onload = () => {
logoImage = new Image();
logoImage.src = reader.result;
CoverPreview.src = reader.result;
};
reader.readAsDataURL(file);
}
});
// Generate QR Code with Live Color Preview
const generateQRCode = () => {
const qrData = qrDataInput.value || 'Sample QR Code. Please Type https://YourSite.com, Or Whatever.';
const foregroundColor = foregroundColorInput.value;
const backgroundColor = backgroundColorInput.value;
QRCode.toCanvas(qrCanvas, qrData, {
width: 250,
margin: 1,
color: {
dark: foregroundColor, // Foreground Color
light: backgroundColor, // Background Color
},
errorCorrectionLevel: 'H',
}, (error) => {
if (error) {
console.error('ERROR Generating QR Code:', error);
} else {
// Add Cover Image / Logo - logoImage Is The SAME As CoverImage.
if (logoImage) {
const ctx = qrCanvas.getContext('2d');
// 0.333
const logoSize = qrCanvas.width * 0.350; /* Logo Size Is 0.350 (35%) of QR Code Size (250px By 250px).
100px By 100px Is Close To The Size To Use For The Cover Images. */
const x = (qrCanvas.width - logoSize) / 2;
const y = (qrCanvas.height - logoSize) / 2;
logoImage.onload = () => {
ctx.drawImage(logoImage, x, y, logoSize, logoSize);
};
if (logoImage.complete) {
ctx.drawImage(logoImage, x, y, logoSize, logoSize);
}
}
downloadBtn.style.display = 'block';
}
});
};
// Update QR Code on Color Change
foregroundColorInput.addEventListener('input', generateQRCode);
backgroundColorInput.addEventListener('input', generateQRCode);
// Generate QR Code Button
generateBtn.addEventListener('click', generateQRCode);
// Download QR Code
downloadBtn.addEventListener('click', () => {
const link = document.createElement('a');
link.download = 'ROYAL-QR-Code-Maker.png';
link.href = qrCanvas.toDataURL('image/png');
link.click();
});`**