Поэтому приложение SVG вроде должно работать, но никакой реакции, а почему неизвестно. 4. Если нет полного понимания, как работает SVG никакой специализированный фреймворк JS тоже не поможет.
**Поэтому, если вы решили использовать SVG для реализации одной схемы, то овчинка выделки не стоит. **
Для успешного освоения SVG нужно несколько качеств: математическое мышление и одновременно воображение, логика и наклонности экспериментатора. И что самое главное,- значительное количество времени. Но если вы пройдете этот путь, то радость творчества перекроет все трудности в освоении SVG.

var wrapper_svg_1 = document.getElementById("wrapper_svg_1"),
left = document.getElementById("left"),
right = document.getElementById("right");

wrapper_svg_1.addEventListener("mouseenter", function() {
right.beginElement();
});

wrapper_svg_1.addEventListener("mouseout", function() {
left.beginElement();
});

* {
margin: 0;
padding: 0;
}

html,
body {
width: 100vw;
height: 100vh;
background: #272727;
font-size: 20px;
}

#wrapper {
width: 100vw;
height: 100vh;
background: transparent;

}
<div id="wrapper">