Modify Svg Path On Hover

I would like to change a svg path coordinates on hover, can I do that without using D3js ? The SVG is a sort of graph I made on sketchapp, here's the code :

The begin attribute is the event you want to activate the animation on and the to is what the path will end up as.

fill="freeze" ensures that if you keep the mouse over the shape it stays in the animated position.

This is a complete standalone example that I tested in Firefox.

<svgxmlns="http://www.w3.org/2000/svg"class="light-graph"viewBox="0 0 1440 269"><gid="ANALYTICS"stroke="none"stroke-width="1"fill="none"fill-rule="evenodd"><gtransform="translate(0.000000, -331.000000)"id="header"fill="#3797D1"opacity="0.323868937"><g><gid="bg-graph"><pathd="M1123.39844,467.39269 L869.398438,569.515104 L720,331.388951 L559.398438,369.409092 L379.398437,587.524641 L123.398438,427.439835 L0,600 L1440,600 L1123.39844,467.39269 Z"><animatebegin="mouseover"attributeName="d"to="M1123.39844,467.39269 L869.398438,69.515104 L720,331.388951 L559.398438,369.409092 L379.398437,587.524641 L123.398438,427.439835 L0,600 L1440,600 L1123.39844,467.39269 Z"dur="0.3s"fill="freeze" /><animatebegin="mouseout"attributeName="d"to="M1123.39844,467.39269 L869.398438,569.515104 L720,331.388951 L559.398438,369.409092 L379.398437,587.524641 L123.398438,427.439835 L0,600 L1440,600 L1123.39844,467.39269 Z"dur="0.3s"fill="freeze" /></path></g></g></g></g></svg>