Most of the code is fine, the only thing missing is just a single quotation mark:
html`<img
// ...
src='${selectedImagePath}'
>`
Why? Because your image path contains spaces:
{
"paths": "img/Acer platanoides - spisslønn - Ak, Follo, Ås - mai 2014.JPG"
}
When the full image path is not enclosed in quotation marks, it looks like this:
html`<img
// ...
src=img/Acer platanoides - spisslønn - Ak, Follo, Ås - mai 2014.JPG
>`
When this HTML string is rendered as a DOM, you will find that all characters after the first space in the src
are not included in the src
attribute, but are instead parsed as custom attributes:
<img
// ...
src="img/Acer" platanoides="" -="" spisslønn="" ak,="" follo,="" Ås="" mai="" 2014.jpg="" alt="Selected image">
So you just need add a single quotation.