Creating newline in nvd3.js graph x-axis labels

Question

so I've been trying to find a way to create new lines in the x-axis labels of my nvd3 graph but nothing seems to work so far. I have referred to these two questions: Newline in labels in d3 charts and nvd3 chart axis label but didn't find a sufficient answer because these are both relating to d3.js graphs. They both have answers relating to using tspan to create the new-line but doesn't seem to work for me no matter how much I play around with it. This is what I have now but it doesn't seem to be correct at all...any help would be appreciated!

nv.addGraph(function () {
var chart = nv.models.multiBarChart().stacked(false).showControls(false);

chart.x(function (d) { return d.x; });
chart.y(function (d) { return d.y; });

chart.yAxis
	.axisLabel('Jobs')
//Too many bars and not enough room? Try staggering labels.
chart.staggerLabels(true); 
chart.margin().left = 70;
//chart.showValues(true);

var tech_data = technicianReport();

console.log(tech_data[1] + " " + tech_data[2])

$("#date_range").text(tech_data[1] + " - " + tech_data[2]);
$("#tech_title").text("Technician-Advisor Actions");

d3.select('#tech_chart svg')
	.datum(tech_data[0])
	.transition().duration(500).call(chart);

var insertLinebreaks = function (d) {
	var el = d3.select(this).text();
	var words = d.description.split('\n');
	el.text('');

	for (var i = 0; i < words.length; i++) {
		var tspan = el.append('tspan').text(words[i]);
		if (i > 0)
			tspan.attr('x', 0).attr('dy', '15');
	}
};

svg = d3.select("tech_chart svg");
svg.selectAll('g.x.axis g text').each(insertLinebreaks);

nv.utils.windowResize(function () { chart.update() });
return chart;
});

Answer 1

Use .wrapLabels parameter from the latest nvd3 source (1.8.1-dev) The parameter wraps long x axis labels. Compare the two screenshots

So you'll come up with

chart.wrapLabels(true);