SOURCE

(function circle(){
	var box = document.getElementById("elem");
  var style = document.defaultView.getComputedStyle(box,null);
  var height = parseInt(style["height"]);
  var width = parseInt(style["width"]);
  var x = width/2;
  var y = height/2;
  var r = Math.min(x,y);
  var circ = document.getElementById("circ");
  circ.setAttribute("r",r);
  circ.setAttribute("cx",x);
  circ.setAttribute("cy",y);
})()

<div id="elem">
  <svg width="100%" height="100%">
  <circle id="circ" width="10" height="10" r="10" fill="red"/>
  </svg>
</div>

#elem{
  width:600px;
  height:400px;
  border:1px solid #000;
}