AbobosSoftware / cordova-plugin-brother-label-printer

Cordova and Capacitor plugin for Bother Label Printers
MIT License
10 stars 16 forks source link

Brother Label Printer - QL-820NWB Text Blurry #66

Closed Jack-Drake closed 1 month ago

Jack-Drake commented 1 month ago

Thank you for all your previous help. I have ran into an issue where the text is coming out blurry. The code I am currently using is the following show below: ` const canvas = document.createElement('canvas'); canvas.width = "100"; canvas.height = "100"; const ctx = canvas.getContext('2d'); ctx.font = '5px Arial'; ctx.fillStyle = "black"; ctx.fillText('John Doe', 5, 15); ctx.fillText('#4460', 5, 20); ctx.fillText('(1/3)', 5, 25);

ctx.font = '7px Arial'; ctx.fillStyle = "black"; ctx.fillText('Taro Milk Tea', (canvas.width / 2) - 50, (canvas.height / 2) - 15); ctx.fillText('- Regular Ice', (canvas.width / 2) - 50, (canvas.height / 2)); ctx.fillText('- Low Sugar', (canvas.width / 2) - 50, (canvas.height / 2) + 15); ctx.fillText('- Extra Boba', (canvas.width / 2) - 50, (canvas.height / 2) + 30);

// Add white background behind elements ctx.globalCompositeOperation = 'destination-over' ctx.fillStyle = "white"; ctx.fillRect(0, 0, canvas.width, canvas.height);

//get the bitmap and encode it const dataUrl = canvas.toDataURL(); var bitmap_beginning_index = dataUrl.lastIndexOf(","); var bitmap_encoded = dataUrl.substring(bitmap_beginning_index + 1);

//send to print window.plugin.brotherPrinter.printViaSDK(bitmap_encoded, (status) => { console.log("printed: ", JSON.stringify(status)); }); `

The issue is that I began with a larger size and then started lowering the size but noticed that the resolution began to also decrease until it is basically unreadable. Any help is appreciated. Thank you,

arcadius commented 1 month ago

Hello @Jack-Drake This question has nothing to do with the brother label printer. This is like a stack overflow question. You need to isolate your issue by removing the printer from the equation. Any issue you are seeing will happen if you save the output as png file or pdf file. So, formulate your question without the label printer in the equation and as on stackoverflow please. thanks.

Jack-Drake commented 1 month ago

Do you have any sample code for canvas? or image? I really need a sample to go off of. It does not make sense the way the printer functions and the way the sdk accepts bitmaps does not add up. What is the dpi of the printer? How can I make the image higher quality? What about the fact that the printer scales the image and doesn't go off of the image instead 10x the size and wastes paper?