How to create interactive images in web applications? [closed]

Have any of you had any experience creating interactive images? I need to create a wiring diagram that is interactive. You could zoom in, drag, and click on specific elements in the image, which might open the model or highlight elements on that image and more.

this is my end-goal:
https://service.tesla.com/docs/ModelY/ElectricalReference/prog-202/interactive/html/index.html?page=2&

Here is another example just in case:
https://liveleya.com/floor-plans/#/map

What tools are required to do that? Is it just an exported SVG image? Is there any material on how to do them?