JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://d3js.org/d3.v3.js"></script>
<svg id="svg"width="500" height="500">
    <ellipse cx="25" cy="25" rx="15" ry="10" fill="red" />
    <ellipse cx="235" cy="215" rx="15" ry="10" fill="red" />
    <ellipse cx="125" cy="125" rx="125" ry="10" fill="red" />
    <ellipse cx="425" cy="425" rx="125" ry="10" fill="red" />
    <rect id="bar" x="10" y="0" width="10" height="500"></rect>
</svg>

JavaScript

d3.select('#svg').on('mousemove', function() {
    var xpos = d3.event.pageX;
    d3.select('#bar').attr('x', xpos);
});