Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

d3.js using d3.scale.sqrt()

Tags:

d3.js

What does the d3.scale.sqrt() scale do? As per the documentation it is similar to d3.scale.pow().exponent(.5), so the returned scale is equivalent to the sqrt function for numbers; for example:

sqrt(0.25) returns 0.5.

so when we apply a domain similar to this:

d3.scale.sqrt().domain([1, 100]).range([10, 39])

does it signify it takes the value between 1-100 and return the sqrt function which ranges between 10-39? Could anybody clarify and provide more details on how this scale works?

like image 726
krishna_v Avatar asked Dec 01 '22 17:12

krishna_v


1 Answers

The way scales work in D3 is that they map input values (defined by .domain()) to output values (defined by .range()). So

 d3.scale.sqrt().domain([1, 100]).range([10, 39])

maps values from 1 to 100 to the 10 to 39 range. That is, 1 corresponds to 10 and 100 to 39. This has nothing to do with the transformation the scale applies, which only affects the distribution of values within the range. For the sqrt function, the growth is sub-linear, which means that more of the input values will fall into the latter part of the output range.

like image 59
Lars Kotthoff Avatar answered Dec 06 '22 04:12

Lars Kotthoff