Multiple hotspots to an image

[dpomazanov]

Using the answer to discussion #665 (https://codesandbox.io/s/r3f-sky-dome-wbrfs), is there a way to add multiple hotspots to the same image? Simply adding another hotspot to store does not seem to work if a hotspot already exists with the same url. Meaning adding this: { name: 'TEST', color: 'lightblue', position: [-3, 1, -5], url: '/Photosphere1.jpg', link: 0 } line to the store does not seem to work!

[drcmda]

It's just a demo, you can build this out into whatever you're you need. Most certainly you can implement more annotations.

[sungryeol-bigpi]

it won't work like that. it seems the demo reactively shows only one background & hotspot at a time, which has corresponding number on .link property.

I've added another hotspot as requested. you'll see the structure of state has been changed in order to display what's mentioned above. it's not about r3f, you may need to understand how the react works first.
https://codesandbox.io/s/sky-dome-with-annotations-forked-c5gmn?file=/src/index.js