Can't put logo on the qrcode when using merge or mergeString png image

[9khaledSayed]

trafficstars

Hello t still not working it generate an random charcters like that:- $qrCode = QrCode::gradient(28, 181, 224, 0, 8, 81, 'horizontal') ->format('png')->merge(asset('beta-logos/small-logo.png'), .3, true) ->style('dot', 0.9) ->size(95) ->eyeColor(0, 28, 181, 224, 0, 8, 81) ->eyeColor(1, 28, 181, 224, 0, 8, 81) ->eyeColor(2, 28, 181, 224, 0, 8, 81) ->generate(route('generate_pdf', $invoice->id)); and the path of my photo is this https://beta-plus.jevara.fun/public/beta-logos/small-logo.png

[9khaledSayed]

same issue if i use public_path instead of asset() method

[simonhamp]

This happens because you're using format('png') - by default this library outputs an SVG, which is just a string of XML that the browser can render natively.

But a PNG is a binary format and so you'll need an <img /> tag to render it.

But the browser can't render the binary data directly as the encoding could break your HTML, so the safest way to load the binary directly into the page is a base64-encoded string:

- $qrCode = QrCode::gradient(28, 181, 224, 0, 8, 81, 'horizontal')
+ $qrCode = base64_encode(QrCode::gradient(28, 181, 224, 0, 8, 81, 'horizontal')
    ->format('png')
    ->merge(asset('beta-logos/small-logo.png'), .3, true)
    ->style('dot', 0.9)
    ->size(95)
    ->eyeColor(0, 28, 181, 224, 0, 8, 81)
    ->eyeColor(1, 28, 181, 224, 0, 8, 81)
    ->eyeColor(2, 28, 181, 224, 0, 8, 81)
-    ->generate(route('generate_pdf', $invoice->id));
+    ->generate(route('generate_pdf', $invoice->id)));

Then you can render the image tag using an inline data flag like this

<img src="data:image/png;base64,{{ $qrCode }}" />