axisX as datetime

• August 23, 2018 at 3:34 pm #22366
  
  nkfNovalume

  I’m trying to do a linegraph with multiple lines and an axisX in the form of datetime

  this has been coded in php with refrence to
  https://canvasjs.com/php-charts/line-chart/
  https://canvasjs.com/php-charts/chart-with-multiple-axes/

  I’m getting the data from a DB but have been able to replicate the problem. (see link for zipped file)
  https://drive.google.com/file/d/1B1cAGwRkZ8qvsJKFEyVF9hJa2nKCNlIm/view?usp=sharing

  The issue im having is that it only takes the axisX from one line even though the two types of data starts and ends in roughly the same time
  i know i am able to add another axisX but i also want to be able to add +7 different lines with different datetime data.

  is there any way to merge the axisX so it will put the dots from the data relative to their respected position on the axisX datetime or anything else that would make my graph not look like the replicated problem

  August 24, 2018 at 11:09 am #22370
  
  Priyanka M S

  @nkfNovalume,

  Labels are displayed on the axis at every interval. The interval is calculated automatically if it is not specified and the labels are displayed accordingly to make the labels look less clumsy and more readable, due to which few labels will be skipped.

  However, by setting appropriate interval and intervalType in axisX according to your dataPoints, you can get all the labels displayed with less readability!

  __
  Priyanka M S
  Team CanvasJS

  August 24, 2018 at 12:02 pm #22372
  
  nkfNovalume

  Changing the interval type isn’t working. the issue is that im having troubble getting the chart to accept a date property for the x-axis. the chart can take a date property from javascript Date(YYYY, MM, DD, HH, ii, SS) however it can’t take anything from php other than a number. it therefor puts my php dates on x-axis dates that arent correct because its trying to put them as if they were numbers (taking their position on the chart using their position in the array as the number) and therefor if i have two arrays with different length but they both start and end on same dates, it will make the shorter array apear shorter on the graph i.e. end it sooner than supposed.

  i can’t see any other fix for this than trying to obtain the data in javascript somehow and enter it there as javascript Date.

  • This reply was modified 6 years, 3 months ago by nkfNovalume.
  • This reply was modified 6 years, 3 months ago by nkfNovalume.
  August 24, 2018 at 2:40 pm #22380
  
  Priyanka M S

  @nkfNovalume,

  Converting PHP date to javascript timestamp and then passing those values to dataPoints along with setting xValueType to dateTime at dataSeries level should work fine in your case.

  __
  Priyanka M S
  Team CanvasJS

  August 24, 2018 at 4:27 pm #22381
  
  nkfNovalume

  This fixed my issue, thank you.

  i passed a string to time earlier in my php using
  $time = strtotime($row['Timestamp']);

  sending that directly to the graph in an array with the key “x” and ofc the value “y” and setting the data’s xValueType to dateTime has fixed the problem
  i now get the graph how it want it and can give it the data i feel like :)

  • This reply was modified 6 years, 3 months ago by nkfNovalume.