Home Forums Chart Support Date Format

Date Format

Viewing 11 posts - 1 through 11 (of 11 total)
  • #20923

    Hi, I have extracted data from database into this format:

    array(4) { [0]=> array(2) { [“label”]=> string(7) “2018-05” [“y”]=> float(26350) } [1]=> array(2) { [“label”]=> string(7) “2018-06” [“y”]=> float(500) } [2]=> array(2) { [“label”]=> string(7) “2018-07” [“y”]=> float(0) } [3]=> array(2) { [“label”]=> string(7) “2018-09” [“y”]=> float(300) } }

    When I build the chart, I noticed the month “2018-08” is missing because there’s no data from database.

    I wish make the X-axis to show the month properly. Can I know how to edit my script so the month can display properly? I have seen this tutorial but have not figure out the solution yet. https://canvasjs.com/docs/charts/methods/canvasjs/format-date/

    Please advise. Thanks.

    #20931

    @liyen,

    If the month “2018-05” is occupying some space on chart, you can use scaleBreaks to remove the occupied space.

    If this doesn’t solve your requirement, can you kindly create and share JSFiddle with sample data so that we can understand your requirement better and help you out.

    __
    Priyanka M S
    Team CanvasJS

    #20939

    Hi Priyanka,

    I extracted the data from database using this tutorial:

    Chart Data from Database

    The data looks like below:

    dataPoints: [
    { x: 2018-05, y: 71 },
    { x: 2018-06, y: 55 },
    { x: 2018-07, y: 50 },
    { x: 2018-09, y: 65 },
    ]

    Any way to show no data for 2018-08?

    p/s: I’m not sure how to put it on jsfiddle

    #20950

    @liyen,

    Can you please share a static HTML page over onedrive or Google drive, so that we can take a look at the chart options you are using, understand your scenario better and help you out?

    __
    Priyanka M S
    Team CanvasJS

    #20958

    Hi Priyanka,

    Thanks for your reply :)

    I have uploaded a simplified html file here:
    https://goo.gl/s5ZdfT

    There’s no data for July from the database, but I wish to show it on the chart…

    #20963

    @liyen,

    Using x-value instead of label for dataPoints will display the axis labels for July even if there is no value in database for July month. Please take a look at this JSFiddle.

    Chart with axisx labels for month with no data

    __
    Priyanka M S
    Team CanvasJS

    #20966

    Hi Priyanka,

    May I know how to put the new Date() into the array?

    array_push($dataPoints, array(“x”=> $row->x, “y”=> $row->y));

    I tried the below, it is not working:

    array_push($dataPoints, array(“x”=> “new Date(\””.$row->x.”\”)”, “y”=> $row->y));

    Thanks.

    #20968

    @liyen,

    To display the chart containing datetime value in PHP, you need to first convert datetime string to PHP timestamp using strtotime(). Later convert PHP timestamp value to javascript timestamp and assign that value to dataPoint x-value along with setting xValueType to ‘dateTime’. Please take a look below code snippet for the same.

    array_push($dataPoints, array("x"=> strtotime($row->x) * 1000, "y"=> $row->y));

    __
    Priyanka M S
    Team CanvasJS

    #20986

    Hi Priyanka,

    Thanks for your sharing, I’m able to get it display properly now :)

    #24367

    Hi Priyanka,

    After using your function : array_push($dataPoints, array(“x”=> strtotime($row->x) * 1000, “y”=> $row->y));
    Now I get thoses numbers on my x-axis how do i change back to date format ?

    #24368

    @babyschoco,

    Setting xValueType to ‘dateTime’ should work fine in your case, as you are passing timestamp as x-value. If this doesn’t solve your issue, kindly create a sample project and share it with us via Google-Drive or Onedrive so that we can look into the code, understand it better and help you out?


    Vishwas R
    Team CanvasJS

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

You must be logged in to reply to this topic.