Vinoth Kumar Vinoth Kumar - 1 month ago 8
CSS Question

How to change the legends from vertical view to horizontal view?

I want to change the legends in vertical view into horizontal view.

voicecalldata
.width(400)
.height(190)
.x(d3.scale.ordinal())
.xUnits(dc.units.ordinal)
.brushOn(true)
.dimension(voicecalldataDimension)
.group(Incoming1,"Incoming")
.group(Outgoing1,"Outgoing")
.legend(dc.legend().x(5).y(165).itemHeight(8).gap(3))


Here, voicecalldata is my
compositechart
name.

enter image description here

The above legend must be changed to this below format.
enter image description here

Someone please help me out.

Answer

Use

.legend(dc.legend().horizontal(true).x(5).y(165).itemHeight(8).gap(3))

Read more at:

http://dc-js.github.io/dc.js/docs/html/dc.legend.html#horizontal__anchor