Resolve LabelBOT for tiled images #1232

[yannik131]

Resolves Issue #1232 by taking a screenshot of the map if the image is tiled.

[yannik131]

@mzur
kleines Problem: Ich hatte aus Versehen die .onnx-Datei mit auf remote gepusht. Ist nicht so leicht, die aus der History wieder rauszukriegen (man müsste die gesamte History mit git filter-repo o. ä. umschreiben). Also würde ich alles löschen und nur die Codeänderungen wieder reinkopieren mit

cp -r resources ~/backup/resources
git reset --hard <last commit before my changes>
git push --force
cp -r ~/backup/resources resources
git add .
git commit -m "Made labelbot work for tiled images"
git push

Dann geht zwar meine History (5 commits -> 1 commit) verloren, aber das ist nicht so schlimm denke ich. Passt das so? Dann mach ich das morgen und dann kann die PR auch reviewed werden.

[mzur]

Ja das passt so, kein Problem 👍

[mzur]

btw this is our commit message style guide in case you are interested: https://chris.beams.io/git-commit

[yannik131]

@mzur I changed the PR to ready for review, but can't select a reviewer or request a review. It's ready though.

[mzur]

Please resolve the linter errors. Run it locally with npm run lint.

[yannik131]

I resolved them, but the pipeline doesn't seem to run automatically @mzur

[mzur]

This works great already! My comments are mostly about stylistic issues.

[yannik131]

I made the changes as requested @mzur, ready for review again.

[mzur]

I've merged the current master.

I noticed that there was a slight delay when the labelbotImage is generated. I suggested some optimizations below.

[mzur]

makeBlob and createImageBitmap are quite slow (600-700 ms on my machine). We don't need a blob or an ImageBitmap object, though, and can use the trimmed canvas directly (200 ms on my machine):

Suggested change

	makeBlob(event.context.canvas).then(blob => {
	resolve(createImageBitmap(blob));
	});
	resolve(trimCanvas(event.context.canvas));

makeBlob can be moved back to the screenshotButton then.

Most of the remaining 200 ms was used by trimCanvas. This can be improved with an early return (see below).

[yannik131]

I think this doesn't work because the canvas is shared between the various layers. After the tiledImageLayer had its postrender event, the next layers will write to the same canvas and annotations will be visible on it. This will result in annotations being visible in the canvas sent to labelbot (unless the labelbot code executes first, which it probably won't). Tested it briefly by displaying the canvas after the postrender event and I did see the annotations on it.
However, if the necessary code for getting the relevant section from the canvas is put directly in the postrender callback, it should work since it's synchronous. I'll try that out and get back to you.

[yannik131]

I moved the screenshot code into createLabelbotImageFromTiledImage to handle the canvas synchronously directly after the postrender event and now it works.

[mzur]

Ok! Just let me know when this is ready to review again.

[yannik131]

It's already ready. I applied all your suggestions and tested it locally. Everything seems to works fine.