Home forums Using CanvasJS Need 24 hour time slot along x-axis

This topic contains 1 reply, has 2 voices, and was last updated by  Shashi Ranjan 4 months, 3 weeks ago.

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

    Hi,
    I am plotting a graph to check the daily delay timings of the machine. Half part is complete. But on the x -axis i want to show the time hours in 24 hour format. Unable to show that:

    THis is the options array
    var options = {
    animationEnabled: true,
    theme: “light2”,
    title:{
    text: “Parboiling Data”
    },
    axisY2:{
    lineThickness: 0
    },
    toolTip:{
    shared: true,
    reversed: true
    },
    legend:{
    verticalAlign: “top”,
    horizontalAlign: “center”
    },
    data: [
    {
    type: “stackedBar”,
    showInLegend: true,
    name: “Vafai”,
    axisYType: “secondary”,
    color: “#FFFF00″,
    dataPoints: [
    { y: 5, label:”2018-01-04”},
    { y: 12, label: “2018-01-05”}
    ]

    },
    {
    type: “stackedBar”,
    showInLegend: true,
    name: “Pani”,
    axisYType: “secondary”,
    color: “#92D050”,
    dataPoints: [
    { y: .5, label: “2018-01-04”},
    { y: 3, label: “2018-01-05” }
    ]
    },
    {
    type: “stackedBar”,
    showInLegend: true,
    name: “Load”,
    axisYType: “secondary”,
    color: “#00B0F0”,
    dataPoints: [
    { y: 3, label: “2018-01-04” },
    { y: 6, label: “2018-01-05” }
    ]
    }

    ]
    };

    Please help me to solve this

    #23929

    @gurpreet2501,

    In the above mentioned code snippet, you’re using label to display date and time value. Instead, you need to assign the Date Object to X values and set the valueFormatString: "HH:mm". Please refer this documentation page for information on valueFormatString. Also, please take a look at this jsfiddle.

    __
    Shashi Ranjan
    Team CanvasJS

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

You must be logged in to reply to this topic.