d3 Bubble Chart mixing v3 and v5 on scale

Question

I am struggling with a mix of d3 v3 and v5 versions when trying to render a bubble map. Can someone assist this struggling D3.JS newbie with this relatively simple code on codepen? There is no error messages in teh console area so I am stuck...

enter code here

https://codepen.io/tbellmer/pen/NWPExJV

Answer 1

In d3 documentation you can find that .domain and .range methods take array as argument. So, change

var countScale = d3.scaleLinear()
  .domain(1, 13)
  .range(3,15);

to

var countScale = d3.scaleLinear()
  .domain([1, 13])
  .range([3,15]);