Round image?

[Dror-Bar]

Looking at the props for imageSettings, there is no way to give it border radius?
Does that mean I have to use a round png image?

also, what does excavate do exactly?

[zpao]

Images aren't round. You can use transparency in your PNG to make it look round. In that case you would not want to excavate.

The default behavior of image embeds is to simply overlay on top of the rendered QR Code. This leaves partial modules visible, which might not be what you want (and may interfere with scanners' ability to read the QR Code). excavate changes the approach used, and will find any of those partially covered modules and replace them with the provided background color. You can see the behavior if you look at the demo (https://zpao.github.io/qrcode.react/). For cases of transparency as you may be thinking about, this might be pretty awkward since we use the rectangular image dimensions to do that excavation.

Having borderRadius as an option could be an interesting solution to this. If you're interested in adding support, I'd be on board. The logic in

qrcode.react/src/index.js

Lines 146 to 160 in 64ab1ce

	// We could just do this in generatePath, except that we want to support
	// non-Path2D canvas, so we need to keep it an explicit step.
	function excavateModules(modules: Modules, excavation: Excavation): Modules {
	return modules.slice().map((row, y) => {
	if (y < excavation.y || y >= excavation.y + excavation.h) {
	return row;
	}
	return row.map((cell, x) => {
	if (x < excavation.x || x >= excavation.x + excavation.w) {
	return cell;
	}
	return false;
	});
	});
	}

(and elsewhere) gets much more complicated because we'll need real math.