Home forums Using CanvasJS Can I set custom text labels for both X and Y?

This topic contains 1 reply, has 2 voices, and was last updated by  Sanjoy 6 months ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #19389

    srmagill
    Member

    I have tried numerous combinations of things that I have seen on the site but so far am not able to assign a text e.label per e.value so that a specific string will be displayed on the X axis when I am also using a specific string per static value. I just want an easy way to display the current state of several test passes y will be the names of the test passes and x will be the different states they could be in. I plan to make the name and details of the test passes passed in to be live updateable but I am stuck on this seemingly simple detail first.

    below is the last thing that I tried which just displays nothing at all when I try to run it

    var xLabels = [“Canary”, “I-WIP”, “WSD”, “E-WIP”, “Live”];
    //xLabels[0] = 5
    var chart = new CanvasJS.Chart(“chartContainer”, {
    // axisX: {
    // interval: 10,
    // labelFormatter: function (e) {
    // var xCats = xLabels[e.value / 5];
    // return xCats;
    // }
    // },

    animationEnabled: true,
    theme: “dark1”, // “light1”, “light2”, “dark1”, “dark2”
    title: {
    text: “PLE WU Flighting Stats”
    },
    axisY: {
    title: “Flighting Rings”,
    suffix: “%”,
    includeZero: false
    },
    axisX: {
    title: “Flighting Trains”,
    valueFormatString: xLabels
    },
    data: [{
    type: “bar”,
    dataPoints: [
    { y: 10, label: “Train1”, x: 5, label: “Canary”,
    { y: 20, label: “Train2”, x: 10, label: “I-WIP”,
    { y: 30, label: “Train3”, x: 15, label: “E-WIP”,
    { y: 40, label: “Train4”, x: 20, label: “WSD-Servicing”,
    { y: 50, label: “Train5”, x: 25, label: “Live”,

    ]
    }]
    });
    chart.render();

    #19404

    Sanjoy
    Participant

    @srmagill

    You can show labels in axisX using label property whereas you can show labels in axisY with the help of labelFormatter method. Please take a look at this jsFiddle for the same.

    —–
    Sanjoy Debnath
    Team CanvasJS

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.