1

I want to show all months , in a plot, created with dygraphs and JavaScript. Now, the plot show only: Apr 2012, Jul 2012, Oct 2012

My values:

X,Y,Z
    2012/01/10,0,3
    2012/02/10,2,6
    2012/03/10,4,8
    2012/04/10,6,9
    2012/05/10,8,9
    2012/06/10,10,8
    2012/07/10,12,6
    2012/08/10,14,3
    2012/09/10,23,7
    2012/10/10,18,8
    2012/11/10,17,4
    2012/12/18,14,7

The code is here: Edit fiddle

Wang Liang
  • 4,244
  • 6
  • 22
  • 45
tuxman
  • 81
  • 1
  • 1
  • 5

1 Answers1

0

dygraphs tries to choose a set of x-axis labels appropriate for the range of your data and the width of the chart. If you don't like its choice, you can override it with a custom ticker.

In your case, to force monthly ticks, you might do this (full fiddle):

new Dygraph(div, data, {
  axes: {
    x: {
      ticker: function(min, max, pixels, opts) {
        return Dygraph.getDateAxis(min, max, Dygraph.Granularity.MONTHLY, opts, this);
      }
    }
  }
});

Be aware, though, that this might produce results that look bad. For your sample data and the default chart width, monthly ticks produce too many labels and they overlap one another:

Chart with crowded x-axis labels

danvk
  • 15,863
  • 5
  • 72
  • 116
  • your example doesn't include January. Is there a way to include it? – Zoti Apr 17 '20 at 09:17
  • 1
    dygraphs places month ticks on the first of the month. The chart's minimum x value is Jan 10th, so the January label would be off the left edge. If you expand the range (via `dateWindow`) then you'll get a January tick. – danvk Apr 17 '20 at 17:40
  • so dateWindow expects a unix time stamp for january 1st 2012? for example, dateWindow: [1325376000, 'auto]? – Zoti Apr 18 '20 at 11:06