circle svg radius calc

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.js"></script>

JavaScript

// setup sizes

	var width = window.innerWidth,
	height = 1000,
	radius = 190;

		// append svg

		var svg = d3.select('body').append('svg')
		.attr('width',width)
		.attr('height',height);

		// append big circle

		var orbitPath = svg.append('circle')
		.attr('r' , radius)
		.attr('cx', 200)
		.attr('cy', 200)
		.attr('fill', 'none')
		.attr('stroke', '#40b4df')
		.attr('stroke-width', '2');

		// append little circle

		var planet = svg.append('circle')
		.attr('r', 1)
		.attr('cx' , 10)
		.attr('cy' , 10)
    .attr("fill", 'red');

		// add mousemove event

		svg
		.on('click',function(e){

			// get x and y mouse coords

			x = d3.event.x,
			y = d3.event.y;
      
      console.log(x+','+y);


			var distanceX = 4000,
			distanceY = 4000,
			newX,
			newY;

	var dx = x - 200,
    dy = y - 200,
    dist = Math.sqrt(dx*dx + dy*dy),
    newX = 200 + dx * radius / dist,
    newY = 200 + dy * radius / dist;

				// once the for loop has completed, the small circles coords and updated

				planet.attr('cx',newX)
				.attr('cy',newY);


			});