FlexChart monthly axis labels

FlexChart monthly axis labels

Posted by: terryfoster on 14 September 2017, 11:14 am EST

• 

  terryfoster

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 11:14 am EST

  How can I specify that the x-axis should always show monthly unit labels (nothing smaller, but maybe bigger)? I know about the ‘Axis.majorUnit’ property, but it only seems to accept a number (days for a time-based axis) and I want the labels to always be for the first day of the month.

  Terry

• 

  ashishjindal

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 11:14 am EST

  Hello Terry,

  If you want to change the text of axis labels to the first day of month then you mayuse the itemFormatter of axis like this:
  
  [js]
  
  $scope.$watch(‘ctx.chart’, function () {
  
  if ($scope.ctx.chart) {
  
  var chart = $scope.ctx.chart;
  
  chart.axisX.itemFormatter = function (engine, label) {
  
  var labelDate = new Date(label.text);
  
  label.text = new Date(labelDate.getFullYear(), labelDate.getMonth(), 1).toLocaleDateString();
  
  return label;
  
  }
  
  }
  
  $scope.$apply();
  
  });
  
  [/js]

  Regards

• 

  terryfoster

  • Post Options:
  • Link
    Copy

  Posted 14 September 2017, 11:14 am EST

  This doesn’t really give me what I want (unless I’m misunderstanding something). Per our customer requirements, we need to show the date axis labels for every month, rotated 90 degrees, and in the format “MMM 'yy”. I can pull off the rotation and formatting easily enough with the ‘format’ and ‘label-angle’ directives. But you’ll notice in the Chart1 image attached, there is still plenty of room to show the labels for each month, but the chart only displays every three months. If I set the ‘major-unit’ directive to 30.4375 (average days per month), I get labels as shown in the Chart2 image attached. You can see that this causes some duplicate and skipped labels because of the inconsistent days for each month. Is there a way for us to satisfy this customer requirement of showing every month correctly?

  Thanks,
  
  Terry
  
  

  

• 

  pkim

  • Post Options:
  • Link
    Copy

  Posted 16 September 2019, 8:59 am EST

  Hi Ashish,

  I am also looking for a way to implement monthly axis labels and found this older thread asking for the same functionality.

  Currently I can set the major unit to 28 days (or less than 31) which will cause duplicates, or set it to 31 days which will technically (but infrequently) cause skips. I’m wondering is there no support for monthly axis labels yet?

  Best,
  
  Paul