Search
Using DateTime Values

The DateTimeSeries class implements the necessary functionality that allows using DateTime values as chart data. Let's create a list with DateTime values:


JavaScript  Copy Code

var years = new Collections.List();
   var dt = new Date(new Date().getFullYear() - 10, 11, 32);
   for (;;) {
      if (dt.getFullYear() > new Date().getFullYear())
          break;
      years.add(new Date(dt.setFullYear(dt.getFullYear() + 1)));
  }

We'll need some numeric data:

 
JavaScript  Copy Code

var income = new Collections.List([13.2, 15.6, 17.8, 39, 20, 29, 79, 101, 120, 122]);

Now we can create the DateTime series. The constructor takes as parameters a list of numbers, a list of DateTime values and the start and end DateTime of the series:

 
JavaScript  Copy Code

var series = new Charting.DateTimeSeries(years, income, years.item(0), years.item(years.count() - 1));

   

The minValue and maxValue properties specify the numbers which correspond to the minDate and maxDate properties in the series:
 
JavaScript  Copy Code

series.minValue = 0;
series.maxValue = 1;


There are many ways to format a DateTime value and the dateTimeFormat property lets you specify one. In our case we want custom DateTime formatting and we set:

JavaScript  Copy Code

series.dateTimeFormat = Charting.DateTimeFormat.CustomDateTime;
series.customDateTimeFormat = '{"year":"numeric"}';

Finally we add the newly created series:

JavaScript  Copy Code

chart.series.add(series);

Here is the chart with some styling: