Dc.js - horizontal bar chart / chat line or d3.svg rotation?
Is there a way to create a horizontal bar chart (or change the chat in a row)?
A row chart does almost what I want, however I want the y-axis to be a continuous variable and it seems that the row table defines the y-axis in terms of discrete / ordinal variables.
I was also thinking about svg rotation with d3. (Rotating the entire div worked, however the brush effect doesn't rotate either).
I thought:
dc.renderAll();
d3.select("body").select("#barChart3").select("svg").attr("transform", function(d) { return "rotate(90)"});
however, this erased the entire diagram rather than rotated it.
Any suggestions?
Update:
I have some success with rotating the svg (brush works), however the graph gets cut off and I can't figure out why ...
source to share
The two diagrams are completely different codebases and have different functions. The Y-axis of a row chart does not even use a scale, so you are absolutely correct that it cannot be made continuous as it is.
It is the ultimate goal to bring them together, but for now, I think rotation is your best bet.
As for the clipping problem you are having, look for the clip attribute in the generated SVG. It will also need to be rotated, but you can remove it for a quick fix.
source to share