So, I try (always guided by Soctt Muray's book) to bind, into SVG, the data consisting in arrays of arrays.
For information: array (or list) is a chunk of data consisting of two or moreelements, for example: [10, 100].
Let's say, your have 10 bags of beans and 100 beans in each.
It can be the list (array) of arrays, like this [[10, 100], [20, 300], [85, 5]].
It is important that the first and following numbers correspond to the same type of data (in our case, first is an amount of bags and second, the beans in each bag).
So, this graph is a visual translation of the relation between just little bit more complexe data: amounts of bags will define the location on x axis and that, of beans in each bag, the location on y axis.
The size of circles, as we doubt, is defined by some (complicated) relation between both amounts.
Now, we need a 'scale' function.