How to set specific y-axis label points in dygraphs?

Question

Dygraphs ordinarily automatically picks Y- (and X-) axis labeling points based on the size of your axes, the size of the labels, etc. In some cases, it picks labeling points

Answer 1

You can do this by writing your own y-axis ticker function: http://dygraphs.com/options.html#ticker

This is pretty advanced customization, so be wary and read the documentation in dygraph-tickers.js. Here's some rough code:

<script type="text/javascript">
  g = new Dygraph(div, data, {
    axes: {
      y: {
        ticker: function(min, max, pixels, opts, dygraph, vals) {
          return [{v:0, label:"0"}, {v:5, label:"5"}, {v:10, label:"10"}];
        }
      }
    }
  });
</script>

One downside of this approach is that these are the only y-axis tick marks you'll ever get, even if the user pans/zooms on the y-axis. Depending on your application, that may or may not be OK.

Answer 2

If you just want to add a label to those that are auto-generated

g = new Dygraph(div, data, {
    axes: {
      y: {
        ticker: function(min, max, pixels, opts, dygraph, vals) {
          var your_value = 7.5;

          //Get auto-generated tickers (numericTicks is the default ticker generator)
          var tickers = Dygraph.numericTicks(min, max, pixels, opts, dygraph, vals);
          tickers.push({v: your_value, label: 'Custom Label'}); //Insert your label

          return tickers;
        }
      }
    }
  });