Interactive SVG maps vs MAP+AREA vs ??

Question

Layout

Hello. I decided to implement a visual convenient scheme on the site, where objects of different shapes would be highlighted during interaction.

At first I put only one SVG, in the first G there was the original picture itself, in the second G I filed the necessary areas in PATH. And everything works fine, scales as it should, etc. however, from its not very new mobile, the page and the card starts to slow down, apparently it is quite weak, honor 6c. (after all, as I understand it, SVG is light, but it loads percents) + I tried to reduce the load and put just a bitmap and only SVG with a diagram on top of it, which made the code easier, but I didn’t notice much difference.

Accordingly, the question is: did I initially choose the right technology, and you can refer to the mobile phone, or did you have to go through MAP + AREA, but it seemed to me that this was the last century, and are there other options?

Answer 1

Here you decide what suits you. I would try to use an interactive map from a third-party service if the functionality is needed. But it's not a fact that it will work faster, rather the opposite :) But often you need a "wow" effect with beautiful graphics, or interactive diagrams of very small objects, in the spirit of a shopping center or exhibition centers, then you have to draw an svg diagram.