labelAutoFit: Boolean

Setting labelAutoFit to true automatically wraps and/or rotates and/or reduces font size of label when they are too long and overlaps, finds the best-fit and automatically manages label overlapping

Default: true
Example: true, false 
var  chart =  new  CanvasJS.Chart("container",
{
 .
 .
 axisX:{
     labelAutoFit: true  // change to false
 },
 .
});
chart.render();
Try Editing The Code

  Also See:    

If you have any questions, please feel free to ask in our forums.Ask Question

3 Comments

  1. Cesar says:

    How can i align multiple label values to left in axisX if label lenght is diferent in each one

    window.onload = function () {
    var chart = new CanvasJS.Chart(“chartContainer”, {
    title: {
    text: “Automatic wrapping of labels”
    },
    axisX: {
    labelAutoFit: true, //false by default.
    interval:1
    },
    data: [
    {
    type: “bar”,
    dataPoints: [
    { x: 0, y: 71 , label: “asdasdasd asda ad asd asd asd asd asd asd”},
    { x: 1, y: 55, label: “asd asd asd asd asda sda sd asd ” },
    { x: 2, y: 50, label: “asda sda dasddasda ” },
    { x: 3, y: 65, label: ” asd asda asda sdasdasdasdasd asda s” },
    { x: 4, y: 95, label: “asd asdasdas” },
    { x: 5, y: 68, label: “asd asd asddd a asdasdasd ” }
    ]
    }
    ]
    });
    chart.render();
    }

  2. Pingback: CanvasJS Charts 1.8.1 Beta 1 Released - CanvasJS

  3. Pingback: CanvasJS Chart 1.8.1 goes GA - CanvasJS

If you have any questions, please feel free to ask in our forums. Ask Question