Estoy tratando de rotar la etiqueta del eje x para mi gráfico de barras, ya que si los nombres son demasiado largos, las etiquetas se superponen entre sí. ¿Cómo lo giro a 65 grados para que se vea así ?
Estoy usando dc/d3.js con Angular y aquí está mi código:
let xAxis = data.key; let newData: any = []; for (let i = 0; i < xAxis.length; i++) { newData.push({ 'name': xAxis[i], 'count': data.values[i] }) } let ndx = crossfilter(newData); let nameDimension = ndx.dimension(function (d: any) { return d.name; }); let countDimension: any = ndx.dimension(function (d: any) { return +d.count; }); let countGroup = nameDimension.group().reduceSum(function (p: any) { return +p.count; }); barChart .width(525) .height(450) .transitionDuration(1000) // Animation delay .margins({ top: 30, right: 50, bottom: 25, left: 40 }) .dimension(nameDimension) .group(countGroup) .x(d3.scaleOrdinal().domain(xAxis)) .xUnits(dc.units.ordinal) .y(d3.scaleLinear().domain([0, countDimension.top(1)[0].count * 1.1])) // Dynamic scale is 10% larger than max range .elasticY(false) .renderHorizontalGridLines(true) .colorAccessor(function (d: any, i: any) { return d3.schemePaired[i]; }) .ordinalColors(d3.schemePaired) .renderLabel(true) .label(function (p: any) { return py; }); dc.renderAll(group);