2012-07-10 70 views
6

Tengo un gráfico de líneas simple creado por highcharts.js. Tengo muchas marcas en el eje x (30), por lo tanto, configuro escalonar para tratar las marcas superpuestas entre sí horizontalmente. Sin embargo, la fila inferior de etiquetas de tilde del eje x se está cortando al final del gráfico.¿Cómo se aumenta la altura del área de etiquetas del eje x en un gráfico highchart.js?

No importa qué tan alto haga el gráfico, la fila inferior de las etiquetas de marcas del eje x se corta. ¿Cómo puedo aumentar la altura de esta área para arreglar esto? ¿O hay algún otro método?

month_chart = new Highcharts.Chart({ 
chart: { 
    borderRadius: 0, 
    height: chart_height, 
    marginRight: 30, 
    marginBottom: 25, 
    renderTo: 'leads-by-month', 
    type: 'line', 
}, 
title: { 
    text: 'Past 30 Days', 
}, 
xAxis: { 
    categories: [<?php print $bymonth_categories; ?>], 
    labels: { 
     staggerLines: 2, 
    }, 
}, 
yAxis: { 
    title: { 
     text: 'Leads', 
     style: {color: '#3d3e41', } 
    }, 
    plotLines: [{ 
     value: 0, 
     width: 1, 
     color: '#808080' 
    }], 
    min: 0, 
}, 
plotOptions: { 
    line: { 
     color: '#578df1', 
     dataLabels: { 
      enabled: true, 
      color: '#3d3e41', 
     }, 
     enableMouseTracking: false 
    } 
}, 
legend: { 
    layout: 'vertical', 
    align: 'right', 
    verticalAlign: 'top', 
    x: -100, 
    y: 74, 
    floating: true, 
    borderWidth: 1, 
    backgroundColor: '#FFFFFF', 
    shadow: true 
}, 
series: [{ 
    name: '<?php print $organization['name']; ?>', 
    data: [<?php print $bymonth_data; ?>] 
}] 
     }); 

Respuesta

10

Simplemente aumente la opción marginBottom. El valor predeterminado es 70, que debería ser suficiente para 2 filas de etiquetas de tilde, lo ha configurado en 25, que no lo es.

+0

Oh hombre, estoy con muerte cerebral. ¡Gracias! – Justin

+0

Los márgenes predeterminados son un dolor de cabeza. – SpaceBeers

Cuestiones relacionadas