population v GDP

<!DOCTYPE html>
<head>
  <meta charset="utf-8">
  <title>SVG intro</title>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js"></script>
 
  <style>
    circle {
      fill-opacity:0.5;
      stroke-opacity:0.5;
    }
   
  </style>
	
</head>

<body>
  
  
  <script>
   
    var outerWidth = 300;
    var outerHeight = 250;
    var circleRadius = 5;
    var xColumn = "gdp";
    var yColumn = "population";
    var rColumn = "population";
    var rMin = 2; rMax = 10;
    var r = 2;
    
    var svg = d3. select("body").append("svg")
    	.attr("width", outerWidth)
    	.attr("height", outerHeight);
    
    
    var xScale = d3.scale.log().range([0,outerWidth]);
    var yScale = d3.scale.log().range([outerHeight,0]);
    var rScale = d3.scale.linear().range([rMin,rMax]);

https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js