Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to add axis labels for row chart using dc.js or d3.js

For Bar Chart and Stacked Chart, we can use .xAxisLabel("X Axis Label") and .yAxisLabel("Y Axis Label") functions to add labels for respective axis. But, Is there any way to add axis labels for Row Chart?

like image 879
Bhatu Pawar Avatar asked Jan 14 '14 13:01

Bhatu Pawar


1 Answers

Try something like this:

dc.renderAll();

function AddXAxis(chartToUpdate, displayText)
{
    chartToUpdate.svg()
                .append("text")
                .attr("class", "x-axis-label")
                .attr("text-anchor", "middle")
                .attr("x", chartToUpdate.width()/2)
                .attr("y", chartToUpdate.height()-3.5)
                .text(displayText);
}
AddXAxis(chart1, "This is the x-axis!");

Here is a jsfiddle example: http://jsfiddle.net/djmartin_umich/x5qb9/

I hope this helps! -DJ

like image 147
DJ Martin Avatar answered Sep 18 '22 11:09

DJ Martin