1

I'm here referring to this reproducible example

http://bl.ocks.org/jensgrubert/7789216

but applied to the following dataset (csv)

"Q1","Q2","Q3","Q4"
0.43,30,0.42,0.3
19,2,15,14
41,46,28,100
8,1,0.45,0.05
0.71,0.68,5,0.4
21,14,7,23
0.63,0.11,0.47,0.22
10,15,0.87,0.4
16,16,18,14
0.01,0.72,0.31,0.28

Given that I want to have numbers with decimals I have been changing the original code to what follows:

var v1 = Math.round(x.Q1*100)/100,
    v2 = Math.round(x.Q2*100)/100,
    v3 = Math.round(x.Q3*100)/100,
    v4 = Math.round(x.Q4*100)/100;

And given that I want to change the y-axis into a logarithm scale I've been changing the original code to what follows:

// the y-axis
var y = d3.scale.log()
 .domain([0.001, 100])
 .range([height + margin.top, 0 + margin.top]);

var yAxis = d3.svg.axis()
    .scale(y)
    .orient("left")
    .tickValues([0.001, 0.01, 0.1, 1, 10, 100])

Now my problem is that the box and wiskers seem not to be correctly aligned with the y scale: see for example the wrong placement of 1st quartile, median, 3rd quartile and so on...; Is that probably due to the log transformation of data? Do I need to transform the data itself as well before plotting them? And eventually how to properly do all that?

I've also a second (apparently minor) issue: how to rotate the labels of the x-axis (QI, Q2, Q3, Q4)?

thank you

maxbre
  • 161
  • 9
  • You should be able to select your xAxis tick texts and apply a transform like so: `d3.selectAll('.x.axis text').attr('transform', 'rotate(-90)')`. https://stackoverflow.com/questions/11252753/rotate-x-axis-text-in-d3 – ksav Sep 27 '18 at 10:25
  • thanks, it works somehow.... but it's rotating somewhere (?) also the x-axis title, as an unwanted consequence.... – maxbre Sep 27 '18 at 13:06

1 Answers1

0

As for your minor issue in rotating the x-axis labels (QI, Q2, Q3, Q4) try this:

d3.selectAll('.x.axis .tick text')
    .attr('transform', 'rotate(-90)')
    .attr('text-anchor', 'end')
    .attr('dx', '-1em')
    .attr('dy', '-0.5em')
ksav
  • 20,015
  • 6
  • 46
  • 66