based on Circle Dragging IV but without any dragging :)
xxxxxxxxxx
<html lang="en">
<head>
<meta charset="utf-8">
<!-- https://www.basscss.com/ -->
<link href="//npmcdn.com/basscss@8.0.2/css/basscss.min.css" rel="stylesheet">
<style>
body {
font-family: Consolas, monaco, monospace;
background: #130C0E;
color: #FDBB30;
}
path {
pointer-events: all;
fill: none;
stroke: #666;
stroke-opacity: 0.2;
}
.g:hover { opacity: 0.4;}
span { letter-spacing: 4px; }
</style>
</head>
<body>
<header class="fixed top-0 left-0 m2">
<p>red circle x: <span class="x-value"></span> : y: <span class="y-value"></span></p>
</header>
<svg width="960" height="500"></svg>
<script src="//d3js.org/d3.v4.min.js" charset="utf-8"></script>
<!-- d3 code -->
<script src=".script-compiled.js" charset="utf-8"></script>
</body>
</html>
https://d3js.org/d3.v4.min.js