UNPKG

dygraphs

Version:

dygraphs is a fast, flexible open source JavaScript charting library.

dygraphs.com

danvk/dygraphs

475 lines • 133 kB
<html><head><meta http-equiv="content-type" content="text/html; charset=utf-8"> <style>
	.KEYW {color: #933;}
	.COMM {color: #bbb; font-style: italic;}
	.NUMB {color: #393;}
	.STRN {color: #393;}
	.REGX {color: #339;}
	.line {border-right: 1px dotted #666; color: #666; font-style: normal;}
	</style></head><body><pre><span class='line'>  1</span> <span class="STRN">'use strict'</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>  2</span> 
<span class='line'>  3</span> </span><span class="COMM">/**
<span class='line'>  4</span>  * @license
<span class='line'>  5</span>  * Copyright 2011 Dan Vanderkam (danvdk@gmail.com)
<span class='line'>  6</span>  * MIT-licenced: https://opensource.org/license/MIT
<span class='line'>  7</span>  */</span><span class="WHIT">
<span class='line'>  8</span> 
<span class='line'>  9</span> </span><span class="COMM">/**
<span class='line'> 10</span>  * @fileoverview Description of this file.
<span class='line'> 11</span>  * @author danvk@google.com (Dan Vanderkam)
<span class='line'> 12</span>  */</span><span class="WHIT">
<span class='line'> 13</span> 
<span class='line'> 14</span> </span><span class="COMM">/*
<span class='line'> 15</span>  * A ticker is a function with the following interface:
<span class='line'> 16</span>  *
<span class='line'> 17</span>  * function(a, b, pixels, options_view, dygraph, forced_values);
<span class='line'> 18</span>  * -> [ { v: tick1_v, label: tick1_label[, label_v: label_v1] },
<span class='line'> 19</span>  *      { v: tick2_v, label: tick2_label[, label_v: label_v2] },
<span class='line'> 20</span>  *      ...
<span class='line'> 21</span>  *    ]
<span class='line'> 22</span>  *
<span class='line'> 23</span>  * The returned value is called a "tick list".
<span class='line'> 24</span>  *
<span class='line'> 25</span>  * Arguments
<span class='line'> 26</span>  * ---------
<span class='line'> 27</span>  *
<span class='line'> 28</span>  * [a, b] is the range of the axis for which ticks are being generated. For a
<span class='line'> 29</span>  * numeric axis, these will simply be numbers. For a date axis, these will be
<span class='line'> 30</span>  * millis since epoch (convertable to Date objects using "new Date(a)" and "new
<span class='line'> 31</span>  * Date(b)").
<span class='line'> 32</span>  *
<span class='line'> 33</span>  * opts provides access to chart- and axis-specific options. It can be used to
<span class='line'> 34</span>  * access number/date formatting code/options, check for a log scale, etc.
<span class='line'> 35</span>  *
<span class='line'> 36</span>  * pixels is the length of the axis in pixels. opts('pixelsPerLabel') is the
<span class='line'> 37</span>  * minimum amount of space to be allotted to each label. For instance, if
<span class='line'> 38</span>  * pixels=400 and opts('pixelsPerLabel')=40 then the ticker should return
<span class='line'> 39</span>  * between zero and ten (400/40) ticks.
<span class='line'> 40</span>  *
<span class='line'> 41</span>  * dygraph is the Dygraph object for which an axis is being constructed.
<span class='line'> 42</span>  *
<span class='line'> 43</span>  * forced_values is used for secondary y-axes. The tick positions are typically
<span class='line'> 44</span>  * set by the primary y-axis, so the secondary y-axis has no choice in where to
<span class='line'> 45</span>  * put these. It simply has to generate labels for these data values.
<span class='line'> 46</span>  *
<span class='line'> 47</span>  * Tick lists
<span class='line'> 48</span>  * ----------
<span class='line'> 49</span>  * Typically a tick will have both a grid/tick line and a label at one end of
<span class='line'> 50</span>  * that line (at the bottom for an x-axis, at left or right for the y-axis).
<span class='line'> 51</span>  *
<span class='line'> 52</span>  * A tick may be missing one of these two components:
<span class='line'> 53</span>  * - If "label_v" is specified instead of "v", then there will be no tick or
<span class='line'> 54</span>  *   gridline, just a label.
<span class='line'> 55</span>  * - Similarly, if "label" is not specified, then there will be a gridline
<span class='line'> 56</span>  *   without a label.
<span class='line'> 57</span>  *
<span class='line'> 58</span>  * This flexibility is useful in a few situations:
<span class='line'> 59</span>  * - For log scales, some of the tick lines may be too close to all have labels.
<span class='line'> 60</span>  * - For date scales where years are being displayed, it is desirable to display
<span class='line'> 61</span>  *   tick marks at the beginnings of years but labels (e.g. "2006") in the
<span class='line'> 62</span>  *   middle of the years.
<span class='line'> 63</span>  */</span><span class="WHIT">
<span class='line'> 64</span> 
<span class='line'> 65</span> </span><span class="COMM">/*jshint sub:true */</span><span class="WHIT">
<span class='line'> 66</span> </span><span class="COMM">/*global Dygraph:false */</span><span class="WHIT">
<span class='line'> 67</span> 
<span class='line'> 68</span> </span><span class="NAME">import</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NAME">as</span><span class="WHIT"> </span><span class="NAME">utils</span><span class="WHIT"> </span><span class="NAME">from</span><span class="WHIT"> </span><span class="STRN">'./dygraph-utils'</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 69</span> 
<span class='line'> 70</span> </span><span class="COMM">/** @typedef {Array.&lt;{v:number, label:string, label_v:(string|undefined)}>} */</span><span class="WHIT">
<span class='line'> 71</span> </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">TickList</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">undefined</span><span class="PUNC">;</span><span class="WHIT">  </span><span class="COMM">// the ' = undefined' keeps jshint happy.</span><span class="WHIT">
<span class='line'> 72</span> 
<span class='line'> 73</span> </span><span class="COMM">/** @typedef {function(
<span class='line'> 74</span>  *    number,
<span class='line'> 75</span>  *    number,
<span class='line'> 76</span>  *    number,
<span class='line'> 77</span>  *    function(string):*,
<span class='line'> 78</span>  *    Dygraph=,
<span class='line'> 79</span>  *    Array.&lt;number>=
<span class='line'> 80</span>  *  ): TickList}
<span class='line'> 81</span>  */</span><span class="WHIT">
<span class='line'> 82</span> </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">Ticker</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">undefined</span><span class="PUNC">;</span><span class="WHIT">  </span><span class="COMM">// the ' = undefined' keeps jshint happy.</span><span class="WHIT">
<span class='line'> 83</span> 
<span class='line'> 84</span> </span><span class="COMM">/** @type {Ticker} */</span><span class="WHIT">
<span class='line'> 85</span> </span><span class="NAME">export</span><span class="WHIT"> </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">numericLinearTicks</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">function</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">a</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">b</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">pixels</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">opts</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">dygraph</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">vals</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 86</span> </span><span class="WHIT">  </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">nonLogscaleOpts</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">function</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">opt</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 87</span> </span><span class="WHIT">    </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">opt</span><span class="WHIT"> </span><span class="PUNC">===</span><span class="WHIT"> </span><span class="STRN">'logscale'</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="KEYW">false</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 88</span> </span><span class="WHIT">    </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="NAME">opts</span><span class="PUNC">(</span><span class="NAME">opt</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 89</span> </span><span class="WHIT">  </span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 90</span> </span><span class="WHIT">  </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="NAME">numericTicks</span><span class="PUNC">(</span><span class="NAME">a</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">b</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">pixels</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">nonLogscaleOpts</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">dygraph</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">vals</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 91</span> </span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 92</span> 
<span class='line'> 93</span> </span><span class="COMM">/** @type {Ticker} */</span><span class="WHIT">
<span class='line'> 94</span> </span><span class="NAME">export</span><span class="WHIT"> </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">numericTicks</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">function</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">a</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">b</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">pixels</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">opts</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">dygraph</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">vals</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 95</span> </span><span class="WHIT">  </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">pixels_per_tick</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="COMM">/** @type{number} */</span><span class="PUNC">(</span><span class="NAME">opts</span><span class="PUNC">(</span><span class="STRN">'pixelsPerLabel'</span><span class="PUNC">)</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 96</span> </span><span class="WHIT">  </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">ticks</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">[</span><span class="PUNC">]</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 97</span> </span><span class="WHIT">  </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">i</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">j</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">tickV</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">nTicks</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'> 98</span> </span><span class="WHIT">  </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">vals</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'> 99</span> </span><span class="WHIT">    </span><span class="KEYW">for</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">i</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NUMB">0</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="NAME">i</span><span class="WHIT"> </span><span class="PUNC">&lt;</span><span class="WHIT"> </span><span class="NAME">vals.length</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="NAME">i</span><span class="PUNC">++</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>100</span> </span><span class="WHIT">      </span><span class="NAME">ticks.push</span><span class="PUNC">(</span><span class="PUNC">{</span><span class="NAME">v</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">vals</span><span class="PUNC">[</span><span class="NAME">i</span><span class="PUNC">]</span><span class="PUNC">}</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>101</span> </span><span class="WHIT">    </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>102</span> </span><span class="WHIT">  </span><span class="PUNC">}</span><span class="WHIT"> </span><span class="KEYW">else</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>103</span> </span><span class="WHIT">    </span><span class="COMM">// TODO(danvk): factor this log-scale block out into a separate function.</span><span class="WHIT">
<span class='line'>104</span> </span><span class="WHIT">    </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">opts</span><span class="PUNC">(</span><span class="STRN">"logscale"</span><span class="PUNC">)</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>105</span> </span><span class="WHIT">      </span><span class="NAME">nTicks</span><span class="WHIT">  </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">Math.floor</span><span class="PUNC">(</span><span class="NAME">pixels</span><span class="WHIT"> </span><span class="PUNC">/</span><span class="WHIT"> </span><span class="NAME">pixels_per_tick</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>106</span> </span><span class="WHIT">      </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">minIdx</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">utils.binarySearch</span><span class="PUNC">(</span><span class="NAME">a</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">PREFERRED_LOG_TICK_VALUES</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NUMB">1</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>107</span> </span><span class="WHIT">      </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">maxIdx</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">utils.binarySearch</span><span class="PUNC">(</span><span class="NAME">b</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">PREFERRED_LOG_TICK_VALUES</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="PUNC">-</span><span class="NUMB">1</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>108</span> </span><span class="WHIT">      </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">minIdx</span><span class="WHIT"> </span><span class="PUNC">==</span><span class="WHIT"> </span><span class="PUNC">-</span><span class="NUMB">1</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>109</span> </span><span class="WHIT">        </span><span class="NAME">minIdx</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NUMB">0</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>110</span> </span><span class="WHIT">      </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>111</span> </span><span class="WHIT">      </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">maxIdx</span><span class="WHIT"> </span><span class="PUNC">==</span><span class="WHIT"> </span><span class="PUNC">-</span><span class="NUMB">1</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>112</span> </span><span class="WHIT">        </span><span class="NAME">maxIdx</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">PREFERRED_LOG_TICK_VALUES.length</span><span class="WHIT"> </span><span class="PUNC">-</span><span class="WHIT"> </span><span class="NUMB">1</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>113</span> </span><span class="WHIT">      </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>114</span> </span><span class="WHIT">      </span><span class="COMM">// Count the number of tick values would appear, if we can get at least</span><span class="WHIT">
<span class='line'>115</span> </span><span class="WHIT">      </span><span class="COMM">// nTicks / 4 accept them.</span><span class="WHIT">
<span class='line'>116</span> </span><span class="WHIT">      </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">lastDisplayed</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">null</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>117</span> </span><span class="WHIT">      </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">maxIdx</span><span class="WHIT"> </span><span class="PUNC">-</span><span class="WHIT"> </span><span class="NAME">minIdx</span><span class="WHIT"> </span><span class="PUNC">>=</span><span class="WHIT"> </span><span class="NAME">nTicks</span><span class="WHIT"> </span><span class="PUNC">/</span><span class="WHIT"> </span><span class="NUMB">4</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>118</span> </span><span class="WHIT">        </span><span class="KEYW">for</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">idx</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">maxIdx</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="NAME">idx</span><span class="WHIT"> </span><span class="PUNC">>=</span><span class="WHIT"> </span><span class="NAME">minIdx</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="NAME">idx</span><span class="PUNC">--</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>119</span> </span><span class="WHIT">          </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">tickValue</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">PREFERRED_LOG_TICK_VALUES</span><span class="PUNC">[</span><span class="NAME">idx</span><span class="PUNC">]</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>120</span> </span><span class="WHIT">          </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">pixel_coord</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">Math.log</span><span class="PUNC">(</span><span class="NAME">tickValue</span><span class="WHIT"> </span><span class="PUNC">/</span><span class="WHIT"> </span><span class="NAME">a</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">/</span><span class="WHIT"> </span><span class="NAME">Math.log</span><span class="PUNC">(</span><span class="NAME">b</span><span class="WHIT"> </span><span class="PUNC">/</span><span class="WHIT"> </span><span class="NAME">a</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NAME">pixels</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>121</span> </span><span class="WHIT">          </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">tick</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT"> </span><span class="NAME">v</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">tickValue</span><span class="WHIT"> </span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>122</span> </span><span class="WHIT">          </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">lastDisplayed</span><span class="WHIT"> </span><span class="PUNC">===</span><span class="WHIT"> </span><span class="KEYW">null</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>123</span> </span><span class="WHIT">            </span><span class="NAME">lastDisplayed</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>124</span> </span><span class="WHIT">              </span><span class="NAME">tickValue</span><span class="WHIT"> </span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">tickValue</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>125</span> </span><span class="WHIT">              </span><span class="NAME">pixel_coord</span><span class="WHIT"> </span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">pixel_coord</span><span class="WHIT">
<span class='line'>126</span> </span><span class="WHIT">            </span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>127</span> </span><span class="WHIT">          </span><span class="PUNC">}</span><span class="WHIT"> </span><span class="KEYW">else</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>128</span> </span><span class="WHIT">            </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">Math.abs</span><span class="PUNC">(</span><span class="NAME">pixel_coord</span><span class="WHIT"> </span><span class="PUNC">-</span><span class="WHIT"> </span><span class="NAME">lastDisplayed.pixel_coord</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">>=</span><span class="WHIT"> </span><span class="NAME">pixels_per_tick</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>129</span> </span><span class="WHIT">              </span><span class="NAME">lastDisplayed</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>130</span> </span><span class="WHIT">                </span><span class="NAME">tickValue</span><span class="WHIT"> </span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">tickValue</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>131</span> </span><span class="WHIT">                </span><span class="NAME">pixel_coord</span><span class="WHIT"> </span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">pixel_coord</span><span class="WHIT">
<span class='line'>132</span> </span><span class="WHIT">              </span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>133</span> </span><span class="WHIT">            </span><span class="PUNC">}</span><span class="WHIT"> </span><span class="KEYW">else</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>134</span> </span><span class="WHIT">              </span><span class="NAME">tick.label</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="STRN">""</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>135</span> </span><span class="WHIT">            </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>136</span> </span><span class="WHIT">          </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>137</span> </span><span class="WHIT">          </span><span class="NAME">ticks.push</span><span class="PUNC">(</span><span class="NAME">tick</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>138</span> </span><span class="WHIT">        </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>139</span> </span><span class="WHIT">        </span><span class="COMM">// Since we went in backwards order.</span><span class="WHIT">
<span class='line'>140</span> </span><span class="WHIT">        </span><span class="NAME">ticks.reverse</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>141</span> </span><span class="WHIT">      </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>142</span> </span><span class="WHIT">    </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>143</span> 
<span class='line'>144</span> </span><span class="WHIT">    </span><span class="COMM">// ticks.length won't be 0 if the log scale function finds values to insert.</span><span class="WHIT">
<span class='line'>145</span> </span><span class="WHIT">    </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">ticks.length</span><span class="WHIT"> </span><span class="PUNC">===</span><span class="WHIT"> </span><span class="NUMB">0</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>146</span> </span><span class="WHIT">      </span><span class="COMM">// Basic idea:</span><span class="WHIT">
<span class='line'>147</span> </span><span class="WHIT">      </span><span class="COMM">// Try labels every 1, 2, 5, 10, 20, 50, 100, etc.</span><span class="WHIT">
<span class='line'>148</span> </span><span class="WHIT">      </span><span class="COMM">// Calculate the resulting tick spacing (i.e. this.height_ / nTicks).</span><span class="WHIT">
<span class='line'>149</span> </span><span class="WHIT">      </span><span class="COMM">// The first spacing greater than pixelsPerYLabel is what we use.</span><span class="WHIT">
<span class='line'>150</span> </span><span class="WHIT">      </span><span class="COMM">// TODO(danvk): version that works on a log scale.</span><span class="WHIT">
<span class='line'>151</span> </span><span class="WHIT">      </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">kmg2</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">opts</span><span class="PUNC">(</span><span class="STRN">"labelsKMG2"</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>152</span> </span><span class="WHIT">      </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">mults</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">base</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>153</span> </span><span class="WHIT">      </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">kmg2</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>154</span> </span><span class="WHIT">        </span><span class="NAME">mults</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">[</span><span class="NUMB">1</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NUMB">2</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NUMB">4</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NUMB">8</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NUMB">16</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NUMB">32</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NUMB">64</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NUMB">128</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NUMB">256</span><span class="PUNC">]</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>155</span> </span><span class="WHIT">        </span><span class="NAME">base</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NUMB">16</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>156</span> </span><span class="WHIT">      </span><span class="PUNC">}</span><span class="WHIT"> </span><span class="KEYW">else</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>157</span> </span><span class="WHIT">        </span><span class="NAME">mults</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">[</span><span class="NUMB">1</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NUMB">2</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NUMB">5</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NUMB">10</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NUMB">20</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NUMB">50</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NUMB">100</span><span class="PUNC">]</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>158</span> </span><span class="WHIT">        </span><span class="NAME">base</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NUMB">10</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>159</span> </span><span class="WHIT">      </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>160</span> 
<span class='line'>161</span> </span><span class="WHIT">      </span><span class="COMM">// Get the maximum number of permitted ticks based on the</span><span class="WHIT">
<span class='line'>162</span> </span><span class="WHIT">      </span><span class="COMM">// graph's pixel size and pixels_per_tick setting.</span><span class="WHIT">
<span class='line'>163</span> </span><span class="WHIT">      </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">max_ticks</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">Math.ceil</span><span class="PUNC">(</span><span class="NAME">pixels</span><span class="WHIT"> </span><span class="PUNC">/</span><span class="WHIT"> </span><span class="NAME">pixels_per_tick</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>164</span> 
<span class='line'>165</span> </span><span class="WHIT">      </span><span class="COMM">// Now calculate the data unit equivalent of this tick spacing.</span><span class="WHIT">
<span class='line'>166</span> </span><span class="WHIT">      </span><span class="COMM">// Use abs() since graphs may have a reversed Y axis.</span><span class="WHIT">
<span class='line'>167</span> </span><span class="WHIT">      </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">units_per_tick</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">Math.abs</span><span class="PUNC">(</span><span class="NAME">b</span><span class="WHIT"> </span><span class="PUNC">-</span><span class="WHIT"> </span><span class="NAME">a</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">/</span><span class="WHIT"> </span><span class="NAME">max_ticks</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>168</span> 
<span class='line'>169</span> </span><span class="WHIT">      </span><span class="COMM">// Based on this, get a starting scale which is the largest</span><span class="WHIT">
<span class='line'>170</span> </span><span class="WHIT">      </span><span class="COMM">// integer power of the chosen base (10 or 16) that still remains</span><span class="WHIT">
<span class='line'>171</span> </span><span class="WHIT">      </span><span class="COMM">// below the requested pixels_per_tick spacing.</span><span class="WHIT">
<span class='line'>172</span> </span><span class="WHIT">      </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">base_power</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">Math.floor</span><span class="PUNC">(</span><span class="NAME">Math.log</span><span class="PUNC">(</span><span class="NAME">units_per_tick</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">/</span><span class="WHIT"> </span><span class="NAME">Math.log</span><span class="PUNC">(</span><span class="NAME">base</span><span class="PUNC">)</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>173</span> </span><span class="WHIT">      </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">base_scale</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">Math.pow</span><span class="PUNC">(</span><span class="NAME">base</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">base_power</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>174</span> 
<span class='line'>175</span> </span><span class="WHIT">      </span><span class="COMM">// Now try multiples of the starting scale until we find one</span><span class="WHIT">
<span class='line'>176</span> </span><span class="WHIT">      </span><span class="COMM">// that results in tick marks spaced sufficiently far apart.</span><span class="WHIT">
<span class='line'>177</span> </span><span class="WHIT">      </span><span class="COMM">// The "mults" array should cover the range 1 .. base^2 to</span><span class="WHIT">
<span class='line'>178</span> </span><span class="WHIT">      </span><span class="COMM">// adjust for rounding and edge effects.</span><span class="WHIT">
<span class='line'>179</span> </span><span class="WHIT">      </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">scale</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">low_val</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">high_val</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>180</span> </span><span class="WHIT">      </span><span class="KEYW">for</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">j</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NUMB">0</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="NAME">j</span><span class="WHIT"> </span><span class="PUNC">&lt;</span><span class="WHIT"> </span><span class="NAME">mults.length</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="NAME">j</span><span class="PUNC">++</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>181</span> </span><span class="WHIT">        </span><span class="NAME">scale</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">base_scale</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NAME">mults</span><span class="PUNC">[</span><span class="NAME">j</span><span class="PUNC">]</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>182</span> </span><span class="WHIT">        </span><span class="NAME">low_val</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">Math.floor</span><span class="PUNC">(</span><span class="NAME">a</span><span class="WHIT"> </span><span class="PUNC">/</span><span class="WHIT"> </span><span class="NAME">scale</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NAME">scale</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>183</span> </span><span class="WHIT">        </span><span class="NAME">high_val</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">Math.ceil</span><span class="PUNC">(</span><span class="NAME">b</span><span class="WHIT"> </span><span class="PUNC">/</span><span class="WHIT"> </span><span class="NAME">scale</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NAME">scale</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>184</span> </span><span class="WHIT">        </span><span class="NAME">nTicks</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">Math.abs</span><span class="PUNC">(</span><span class="NAME">high_val</span><span class="WHIT"> </span><span class="PUNC">-</span><span class="WHIT"> </span><span class="NAME">low_val</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">/</span><span class="WHIT"> </span><span class="NAME">scale</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>185</span> </span><span class="WHIT">        </span><span class="NAME">spacing</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">pixels</span><span class="WHIT"> </span><span class="PUNC">/</span><span class="WHIT"> </span><span class="NAME">nTicks</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>186</span> </span><span class="WHIT">        </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">spacing</span><span class="WHIT"> </span><span class="PUNC">></span><span class="WHIT"> </span><span class="NAME">pixels_per_tick</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="KEYW">break</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>187</span> </span><span class="WHIT">      </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>188</span> 
<span class='line'>189</span> </span><span class="WHIT">      </span><span class="COMM">// Construct the set of ticks.</span><span class="WHIT">
<span class='line'>190</span> </span><span class="WHIT">      </span><span class="COMM">// Allow reverse y-axis if it's explicitly requested.</span><span class="WHIT">
<span class='line'>191</span> </span><span class="WHIT">      </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">low_val</span><span class="WHIT"> </span><span class="PUNC">></span><span class="WHIT"> </span><span class="NAME">high_val</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="NAME">scale</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">-</span><span class="NUMB">1</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>192</span> </span><span class="WHIT">      </span><span class="KEYW">for</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">i</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NUMB">0</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="NAME">i</span><span class="WHIT"> </span><span class="PUNC">&lt;=</span><span class="WHIT"> </span><span class="NAME">nTicks</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="NAME">i</span><span class="PUNC">++</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>193</span> </span><span class="WHIT">        </span><span class="NAME">tickV</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">low_val</span><span class="WHIT"> </span><span class="PUNC">+</span><span class="WHIT"> </span><span class="NAME">i</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NAME">scale</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>194</span> </span><span class="WHIT">        </span><span class="NAME">ticks.push</span><span class="PUNC">(</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">v</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">tickV</span><span class="PUNC">}</span><span class="WHIT"> </span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>195</span> </span><span class="WHIT">      </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>196</span> </span><span class="WHIT">    </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>197</span> </span><span class="WHIT">  </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>198</span> 
<span class='line'>199</span> </span><span class="WHIT">  </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">formatter</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="COMM">/**@type{AxisLabelFormatter}*/</span><span class="PUNC">(</span><span class="NAME">opts</span><span class="PUNC">(</span><span class="STRN">'axisLabelFormatter'</span><span class="PUNC">)</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>200</span> 
<span class='line'>201</span> </span><span class="WHIT">  </span><span class="COMM">// Add labels to the ticks.</span><span class="WHIT">
<span class='line'>202</span> </span><span class="WHIT">  </span><span class="KEYW">for</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">i</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NUMB">0</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="NAME">i</span><span class="WHIT"> </span><span class="PUNC">&lt;</span><span class="WHIT"> </span><span class="NAME">ticks.length</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="NAME">i</span><span class="PUNC">++</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>203</span> </span><span class="WHIT">    </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">ticks</span><span class="PUNC">[</span><span class="NAME">i</span><span class="PUNC">]</span><span class="PUNC">.</span><span class="NAME">label</span><span class="WHIT"> </span><span class="PUNC">!==</span><span class="WHIT"> </span><span class="NAME">undefined</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="KEYW">continue</span><span class="PUNC">;</span><span class="WHIT">  </span><span class="COMM">// Use current label.</span><span class="WHIT">
<span class='line'>204</span> </span><span class="WHIT">    </span><span class="COMM">// TODO(danvk): set granularity to something appropriate here.</span><span class="WHIT">
<span class='line'>205</span> </span><span class="WHIT">    </span><span class="NAME">ticks</span><span class="PUNC">[</span><span class="NAME">i</span><span class="PUNC">]</span><span class="PUNC">.</span><span class="NAME">label</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">formatter.call</span><span class="PUNC">(</span><span class="NAME">dygraph</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">ticks</span><span class="PUNC">[</span><span class="NAME">i</span><span class="PUNC">]</span><span class="PUNC">.</span><span class="NAME">v</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NUMB">0</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">opts</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">dygraph</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>206</span> </span><span class="WHIT">  </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>207</span> 
<span class='line'>208</span> </span><span class="WHIT">  </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="NAME">ticks</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>209</span> </span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>210</span> 
<span class='line'>211</span> </span><span class="COMM">/** @type {Ticker} */</span><span class="WHIT">
<span class='line'>212</span> </span><span class="NAME">export</span><span class="WHIT"> </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">integerTicks</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">function</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">a</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">b</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">pixels</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">opts</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">dygraph</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">vals</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>213</span> </span><span class="WHIT">    </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">allTicks</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">numericTicks</span><span class="PUNC">(</span><span class="NAME">a</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">b</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">pixels</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">opts</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">dygraph</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">vals</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>214</span> </span><span class="WHIT">    </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="NAME">allTicks.filter</span><span class="PUNC">(</span><span class="KEYW">function</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">tick</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>215</span> </span><span class="WHIT">      </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="NAME">tick.v</span><span class="WHIT"> </span><span class="PUNC">%</span><span class="WHIT"> </span><span class="NUMB">1</span><span class="WHIT"> </span><span class="PUNC">===</span><span class="WHIT"> </span><span class="NUMB">0</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>216</span> </span><span class="WHIT">    </span><span class="PUNC">}</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>217</span> </span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>218</span> 
<span class='line'>219</span> </span><span class="COMM">/** @type {Ticker} */</span><span class="WHIT">
<span class='line'>220</span> </span><span class="NAME">export</span><span class="WHIT"> </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">dateTicker</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">function</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">a</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">b</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">pixels</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">opts</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">dygraph</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">vals</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>221</span> </span><span class="WHIT">  </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">chosen</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">pickDateTickGranularity</span><span class="PUNC">(</span><span class="NAME">a</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">b</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">pixels</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">opts</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>222</span> 
<span class='line'>223</span> </span><span class="WHIT">  </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">chosen</span><span class="WHIT"> </span><span class="PUNC">>=</span><span class="WHIT"> </span><span class="NUMB">0</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>224</span> </span><span class="WHIT">    </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="NAME">getDateAxis</span><span class="PUNC">(</span><span class="NAME">a</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">b</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">chosen</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">opts</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">dygraph</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>225</span> </span><span class="WHIT">  </span><span class="PUNC">}</span><span class="WHIT"> </span><span class="KEYW">else</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>226</span> </span><span class="WHIT">    </span><span class="COMM">// this can happen if self.width_ is zero.</span><span class="WHIT">
<span class='line'>227</span> </span><span class="WHIT">    </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="PUNC">[</span><span class="PUNC">]</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>228</span> </span><span class="WHIT">  </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>229</span> </span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>230</span> 
<span class='line'>231</span> </span><span class="COMM">// Time granularity enumeration</span><span class="WHIT">
<span class='line'>232</span> </span><span class="NAME">export</span><span class="WHIT"> </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">Granularity</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>233</span> </span><span class="WHIT">  </span><span class="NAME">MILLISECONDLY</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">0</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>234</span> </span><span class="WHIT">  </span><span class="NAME">TWO_MILLISECONDLY</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">1</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>235</span> </span><span class="WHIT">  </span><span class="NAME">FIVE_MILLISECONDLY</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">2</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>236</span> </span><span class="WHIT">  </span><span class="NAME">TEN_MILLISECONDLY</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">3</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>237</span> </span><span class="WHIT">  </span><span class="NAME">FIFTY_MILLISECONDLY</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">4</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>238</span> </span><span class="WHIT">  </span><span class="NAME">HUNDRED_MILLISECONDLY</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">5</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>239</span> </span><span class="WHIT">  </span><span class="NAME">FIVE_HUNDRED_MILLISECONDLY</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">6</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>240</span> </span><span class="WHIT">  </span><span class="NAME">SECONDLY</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">7</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>241</span> </span><span class="WHIT">  </span><span class="NAME">TWO_SECONDLY</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">8</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>242</span> </span><span class="WHIT">  </span><span class="NAME">FIVE_SECONDLY</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">9</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>243</span> </span><span class="WHIT">  </span><span class="NAME">TEN_SECONDLY</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">10</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>244</span> </span><span class="WHIT">  </span><span class="NAME">THIRTY_SECONDLY</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">11</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>245</span> </span><span class="WHIT">  </span><span class="NAME">MINUTELY</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">12</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>246</span> </span><span class="WHIT">  </span><span class="NAME">TWO_MINUTELY</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">13</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>247</span> </span><span class="WHIT">  </span><span class="NAME">FIVE_MINUTELY</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">14</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>248</span> </span><span class="WHIT">  </span><span class="NAME">TEN_MINUTELY</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">15</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>249</span> </span><span class="WHIT">  </span><span class="NAME">THIRTY_MINUTELY</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">16</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>250</span> </span><span class="WHIT">  </span><span class="NAME">HOURLY</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">17</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>251</span> </span><span class="WHIT">  </span><span class="NAME">TWO_HOURLY</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">18</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>252</span> </span><span class="WHIT">  </span><span class="NAME">SIX_HOURLY</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">19</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>253</span> </span><span class="WHIT">  </span><span class="NAME">DAILY</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">20</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>254</span> </span><span class="WHIT">  </span><span class="NAME">TWO_DAILY</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">21</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>255</span> </span><span class="WHIT">  </span><span class="NAME">WEEKLY</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">22</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>256</span> </span><span class="WHIT">  </span><span class="NAME">MONTHLY</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">23</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>257</span> </span><span class="WHIT">  </span><span class="NAME">QUARTERLY</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">24</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>258</span> </span><span class="WHIT">  </span><span class="NAME">BIANNUAL</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">25</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>259</span> </span><span class="WHIT">  </span><span class="NAME">ANNUAL</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">26</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>260</span> </span><span class="WHIT">  </span><span class="NAME">DECADAL</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">27</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>261</span> </span><span class="WHIT">  </span><span class="NAME">CENTENNIAL</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">28</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>262</span> </span><span class="WHIT">  </span><span class="NAME">NUM_GRANULARITIES</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">29</span><span class="WHIT">
<span class='line'>263</span> </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>264</span> 
<span class='line'>265</span> </span><span class="COMM">// Date components enumeration (in the order of the arguments in Date)</span><span class="WHIT">
<span class='line'>266</span> </span><span class="COMM">// TODO: make this an @enum</span><span class="WHIT">
<span class='line'>267</span> </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">DateField</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>268</span> </span><span class="WHIT">  </span><span class="NAME">DATEFIELD_Y</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">0</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>269</span> </span><span class="WHIT">  </span><span class="NAME">DATEFIELD_M</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">1</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>270</span> </span><span class="WHIT">  </span><span class="NAME">DATEFIELD_D</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">2</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>271</span> </span><span class="WHIT">  </span><span class="NAME">DATEFIELD_HH</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">3</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>272</span> </span><span class="WHIT">  </span><span class="NAME">DATEFIELD_MM</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">4</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>273</span> </span><span class="WHIT">  </span><span class="NAME">DATEFIELD_SS</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">5</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>274</span> </span><span class="WHIT">  </span><span class="NAME">DATEFIELD_MS</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">6</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>275</span> </span><span class="WHIT">  </span><span class="NAME">NUM_DATEFIELDS</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">7</span><span class="WHIT">
<span class='line'>276</span> </span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>277</span> 
<span class='line'>278</span> </span><span class="COMM">/**
<span class='line'>279</span>  * The value of datefield will start at an even multiple of "step", i.e.
<span class='line'>280</span>  *   if datefield=SS and step=5 then the first tick will be on a multiple of 5s.
<span class='line'>281</span>  *
<span class='line'>282</span>  * For granularities &lt;= HOURLY, ticks are generated every `spacing` ms.
<span class='line'>283</span>  *
<span class='line'>284</span>  * At coarser granularities, ticks are generated by incrementing `datefield` by
<span class='line'>285</span>  *   `step`. In this case, the `spacing` value is only used to estimate the
<span class='line'>286</span>  *   number of ticks. It should roughly correspond to the spacing between
<span class='line'>287</span>  *   adjacent ticks.
<span class='line'>288</span>  *
<span class='line'>289</span>  * @type {Array.&lt;{datefield:number, step:number, spacing:number}>}
<span class='line'>290</span>  */</span><span class="WHIT">
<span class='line'>291</span> </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">TICK_PLACEMENT</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">[</span><span class="PUNC">]</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>292</span> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">Granularity.MILLISECONDLY</span><span class="PUNC">]</span><span class="WHIT">               </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">datefield</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_MS</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">step</span><span class="PUNC">:</span><span class="WHIT">   </span><span class="NUMB">1</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">1</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>293</span> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">Granularity.TWO_MILLISECONDLY</span><span class="PUNC">]</span><span class="WHIT">           </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">datefield</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_MS</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">step</span><span class="PUNC">:</span><span class="WHIT">   </span><span class="NUMB">2</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">2</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>294</span> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">Granularity.FIVE_MILLISECONDLY</span><span class="PUNC">]</span><span class="WHIT">          </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">datefield</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_MS</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">step</span><span class="PUNC">:</span><span class="WHIT">   </span><span class="NUMB">5</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">5</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>295</span> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">Granularity.TEN_MILLISECONDLY</span><span class="PUNC">]</span><span class="WHIT">           </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">datefield</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_MS</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">step</span><span class="PUNC">:</span><span class="WHIT">  </span><span class="NUMB">10</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">10</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>296</span> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">Granularity.FIFTY_MILLISECONDLY</span><span class="PUNC">]</span><span class="WHIT">         </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">datefield</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_MS</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">step</span><span class="PUNC">:</span><span class="WHIT">  </span><span class="NUMB">50</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">50</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>297</span> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">Granularity.HUNDRED_MILLISECONDLY</span><span class="PUNC">]</span><span class="WHIT">       </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">datefield</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_MS</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">step</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">100</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">100</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>298</span> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">Granularity.FIVE_HUNDRED_MILLISECONDLY</span><span class="PUNC">]</span><span class="WHIT">  </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">datefield</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_MS</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">step</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">500</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">500</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>299</span> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">Granularity.SECONDLY</span><span class="PUNC">]</span><span class="WHIT">        </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">datefield</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_SS</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">step</span><span class="PUNC">:</span><span class="WHIT">   </span><span class="NUMB">1</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">1000</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">1</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>300</span> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">Granularity.TWO_SECONDLY</span><span class="PUNC">]</span><span class="WHIT">    </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">datefield</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_SS</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">step</span><span class="PUNC">:</span><span class="WHIT">   </span><span class="NUMB">2</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">1000</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">2</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>301</span> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">Granularity.FIVE_SECONDLY</span><span class="PUNC">]</span><span class="WHIT">   </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">datefield</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_SS</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">step</span><span class="PUNC">:</span><span class="WHIT">   </span><span class="NUMB">5</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">1000</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">5</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>302</span> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">Granularity.TEN_SECONDLY</span><span class="PUNC">]</span><span class="WHIT">    </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">datefield</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_SS</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">step</span><span class="PUNC">:</span><span class="WHIT">  </span><span class="NUMB">10</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">1000</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">10</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>303</span> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">Granularity.THIRTY_SECONDLY</span><span class="PUNC">]</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">datefield</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_SS</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">step</span><span class="PUNC">:</span><span class="WHIT">  </span><span class="NUMB">30</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">1000</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">30</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>304</span> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">Granularity.MINUTELY</span><span class="PUNC">]</span><span class="WHIT">        </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">datefield</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_MM</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">step</span><span class="PUNC">:</span><span class="WHIT">   </span><span class="NUMB">1</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">1000</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">60</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>305</span> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">Granularity.TWO_MINUTELY</span><span class="PUNC">]</span><span class="WHIT">    </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">datefield</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_MM</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">step</span><span class="PUNC">:</span><span class="WHIT">   </span><span class="NUMB">2</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">1000</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">60</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">2</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>306</span> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">Granularity.FIVE_MINUTELY</span><span class="PUNC">]</span><span class="WHIT">   </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">datefield</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_MM</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">step</span><span class="PUNC">:</span><span class="WHIT">   </span><span class="NUMB">5</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">1000</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">60</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">5</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>307</span> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">Granularity.TEN_MINUTELY</span><span class="PUNC">]</span><span class="WHIT">    </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">datefield</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_MM</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">step</span><span class="PUNC">:</span><span class="WHIT">  </span><span class="NUMB">10</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">1000</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">60</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">10</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>308</span> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">Granularity.THIRTY_MINUTELY</span><span class="PUNC">]</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">datefield</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_MM</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">step</span><span class="PUNC">:</span><span class="WHIT">  </span><span class="NUMB">30</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">1000</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">60</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">30</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>309</span> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">Granularity.HOURLY</span><span class="PUNC">]</span><span class="WHIT">          </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">datefield</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_HH</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">step</span><span class="PUNC">:</span><span class="WHIT">   </span><span class="NUMB">1</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">1000</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">3600</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>310</span> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">Granularity.TWO_HOURLY</span><span class="PUNC">]</span><span class="WHIT">      </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">datefield</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_HH</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">step</span><span class="PUNC">:</span><span class="WHIT">   </span><span class="NUMB">2</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">1000</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">3600</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">2</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>311</span> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">Granularity.SIX_HOURLY</span><span class="PUNC">]</span><span class="WHIT">      </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">datefield</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_HH</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">step</span><span class="PUNC">:</span><span class="WHIT">   </span><span class="NUMB">6</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">1000</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">3600</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">6</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>312</span> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">Granularity.DAILY</span><span class="PUNC">]</span><span class="WHIT">           </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">datefield</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_D</span><span class="PUNC">,</span><span class="WHIT">  </span><span class="NAME">step</span><span class="PUNC">:</span><span class="WHIT">   </span><span class="NUMB">1</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">1000</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">86400</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>313</span> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">Granularity.TWO_DAILY</span><span class="PUNC">]</span><span class="WHIT">       </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">datefield</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_D</span><span class="PUNC">,</span><span class="WHIT">  </span><span class="NAME">step</span><span class="PUNC">:</span><span class="WHIT">   </span><span class="NUMB">2</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">1000</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">86400</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">2</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>314</span> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">Granularity.WEEKLY</span><span class="PUNC">]</span><span class="WHIT">          </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">datefield</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_D</span><span class="PUNC">,</span><span class="WHIT">  </span><span class="NAME">step</span><span class="PUNC">:</span><span class="WHIT">   </span><span class="NUMB">7</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">1000</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">604800</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>315</span> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">Granularity.MONTHLY</span><span class="PUNC">]</span><span class="WHIT">         </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">datefield</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_M</span><span class="PUNC">,</span><span class="WHIT">  </span><span class="NAME">step</span><span class="PUNC">:</span><span class="WHIT">   </span><span class="NUMB">1</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">1000</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">7200</span><span class="WHIT">  </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">365.2425</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="COMM">// 1e3 * 60 * 60 * 24 * 365.2425 / 12</span><span class="WHIT">
<span class='line'>316</span> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">Granularity.QUARTERLY</span><span class="PUNC">]</span><span class="WHIT">       </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">datefield</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_M</span><span class="PUNC">,</span><span class="WHIT">  </span><span class="NAME">step</span><span class="PUNC">:</span><span class="WHIT">   </span><span class="NUMB">3</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">1000</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">21600</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">365.2425</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="COMM">// 1e3 * 60 * 60 * 24 * 365.2425 / 4</span><span class="WHIT">
<span class='line'>317</span> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">Granularity.BIANNUAL</span><span class="PUNC">]</span><span class="WHIT">        </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">datefield</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_M</span><span class="PUNC">,</span><span class="WHIT">  </span><span class="NAME">step</span><span class="PUNC">:</span><span class="WHIT">   </span><span class="NUMB">6</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">1000</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">43200</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">365.2425</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="COMM">// 1e3 * 60 * 60 * 24 * 365.2425 / 2</span><span class="WHIT">
<span class='line'>318</span> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">Granularity.ANNUAL</span><span class="PUNC">]</span><span class="WHIT">          </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">datefield</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_Y</span><span class="PUNC">,</span><span class="WHIT">  </span><span class="NAME">step</span><span class="PUNC">:</span><span class="WHIT">   </span><span class="NUMB">1</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">1000</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">86400</span><span class="WHIT">   </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">365.2425</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="COMM">// 1e3 * 60 * 60 * 24 * 365.2425 * 1</span><span class="WHIT">
<span class='line'>319</span> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">Granularity.DECADAL</span><span class="PUNC">]</span><span class="WHIT">         </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">datefield</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_Y</span><span class="PUNC">,</span><span class="WHIT">  </span><span class="NAME">step</span><span class="PUNC">:</span><span class="WHIT">  </span><span class="NUMB">10</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">1000</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">864000</span><span class="WHIT">  </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">365.2425</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="COMM">// 1e3 * 60 * 60 * 24 * 365.2425 * 10</span><span class="WHIT">
<span class='line'>320</span> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">Granularity.CENTENNIAL</span><span class="PUNC">]</span><span class="WHIT">      </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="NAME">datefield</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_Y</span><span class="PUNC">,</span><span class="WHIT">  </span><span class="NAME">step</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">100</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">1000</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">8640000</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NUMB">365.2425</span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="COMM">// 1e3 * 60 * 60 * 24 * 365.2425 * 100</span><span class="WHIT">
<span class='line'>321</span> 
<span class='line'>322</span> </span><span class="COMM">/**
<span class='line'>323</span>  * This is a list of human-friendly values at which to show tick marks on a log
<span class='line'>324</span>  * scale. It is k * 10^n, where k=1..9 and n=-39..+39, so:
<span class='line'>325</span>  * ..., 1, 2, 3, 4, 5, ..., 9, 10, 20, 30, ..., 90, 100, 200, 300, ...
<span class='line'>326</span>  * NOTE: this assumes that utils.LOG_SCALE = 10.
<span class='line'>327</span>  * @type {Array.&lt;number>}
<span class='line'>328</span>  */</span><span class="WHIT">
<span class='line'>329</span> </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">PREFERRED_LOG_TICK_VALUES</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="KEYW">function</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>330</span> </span><span class="WHIT">  </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">vals</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">[</span><span class="PUNC">]</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>331</span> </span><span class="WHIT">  </span><span class="KEYW">for</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">power</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">-</span><span class="NUMB">39</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="NAME">power</span><span class="WHIT"> </span><span class="PUNC">&lt;=</span><span class="WHIT"> </span><span class="NUMB">39</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="NAME">power</span><span class="PUNC">++</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>332</span> </span><span class="WHIT">    </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">range</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">Math.pow</span><span class="PUNC">(</span><span class="NUMB">10</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">power</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>333</span> </span><span class="WHIT">    </span><span class="KEYW">for</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">mult</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NUMB">1</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="NAME">mult</span><span class="WHIT"> </span><span class="PUNC">&lt;=</span><span class="WHIT"> </span><span class="NUMB">9</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="NAME">mult</span><span class="PUNC">++</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>334</span> </span><span class="WHIT">      </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">val</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">range</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="NAME">mult</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>335</span> </span><span class="WHIT">      </span><span class="NAME">vals.push</span><span class="PUNC">(</span><span class="NAME">val</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>336</span> </span><span class="WHIT">    </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>337</span> </span><span class="WHIT">  </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>338</span> </span><span class="WHIT">  </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="NAME">vals</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>339</span> </span><span class="PUNC">}</span><span class="PUNC">)</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>340</span> 
<span class='line'>341</span> </span><span class="COMM">/**
<span class='line'>342</span>  * Determine the correct granularity of ticks on a date axis.
<span class='line'>343</span>  *
<span class='line'>344</span>  * @param {number} a Left edge of the chart (ms)
<span class='line'>345</span>  * @param {number} b Right edge of the chart (ms)
<span class='line'>346</span>  * @param {number} pixels Size of the chart in the relevant dimension (width).
<span class='line'>347</span>  * @param {function(string):*} opts Function mapping from option name -&gt; value.
<span class='line'>348</span>  * @return {number} The appropriate axis granularity for this chart. See the
<span class='line'>349</span>  *     enumeration of possible values in dygraph-tickers.js.
<span class='line'>350</span>  */</span><span class="WHIT">
<span class='line'>351</span> </span><span class="NAME">export</span><span class="WHIT"> </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">pickDateTickGranularity</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">function</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">a</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">b</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">pixels</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">opts</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>352</span> </span><span class="WHIT">  </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">pixels_per_tick</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="COMM">/** @type{number} */</span><span class="PUNC">(</span><span class="NAME">opts</span><span class="PUNC">(</span><span class="STRN">'pixelsPerLabel'</span><span class="PUNC">)</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>353</span> </span><span class="WHIT">  </span><span class="KEYW">for</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">i</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NUMB">0</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="NAME">i</span><span class="WHIT"> </span><span class="PUNC">&lt;</span><span class="WHIT"> </span><span class="NAME">Granularity.NUM_GRANULARITIES</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="NAME">i</span><span class="PUNC">++</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>354</span> </span><span class="WHIT">    </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">num_ticks</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">numDateTicks</span><span class="PUNC">(</span><span class="NAME">a</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">b</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">i</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>355</span> </span><span class="WHIT">    </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">pixels</span><span class="WHIT"> </span><span class="PUNC">/</span><span class="WHIT"> </span><span class="NAME">num_ticks</span><span class="WHIT"> </span><span class="PUNC">>=</span><span class="WHIT"> </span><span class="NAME">pixels_per_tick</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>356</span> </span><span class="WHIT">      </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="NAME">i</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>357</span> </span><span class="WHIT">    </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>358</span> </span><span class="WHIT">  </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>359</span> </span><span class="WHIT">  </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="PUNC">-</span><span class="NUMB">1</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>360</span> </span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>361</span> 
<span class='line'>362</span> </span><span class="COMM">/**
<span class='line'>363</span>  * Compute the number of ticks on a date axis for a given granularity.
<span class='line'>364</span>  * @param {number} start_time
<span class='line'>365</span>  * @param {number} end_time
<span class='line'>366</span>  * @param {number} granularity (one of the granularities enumerated above)
<span class='line'>367</span>  * @return {number} (Approximate) number of ticks that would result.
<span class='line'>368</span>  */</span><span class="WHIT">
<span class='line'>369</span> </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">numDateTicks</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">function</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">start_time</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">end_time</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">granularity</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>370</span> </span><span class="WHIT">  </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">granularity</span><span class="PUNC">]</span><span class="PUNC">.</span><span class="NAME">spacing</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>371</span> </span><span class="WHIT">  </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="NAME">Math.round</span><span class="PUNC">(</span><span class="NUMB">1.0</span><span class="WHIT"> </span><span class="PUNC">*</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">end_time</span><span class="WHIT"> </span><span class="PUNC">-</span><span class="WHIT"> </span><span class="NAME">start_time</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">/</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>372</span> </span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>373</span> 
<span class='line'>374</span> </span><span class="COMM">/**
<span class='line'>375</span>  * Compute the positions and labels of ticks on a date axis for a given granularity.
<span class='line'>376</span>  * @param {number} start_time
<span class='line'>377</span>  * @param {number} end_time
<span class='line'>378</span>  * @param {number} granularity (one of the granularities enumerated above)
<span class='line'>379</span>  * @param {function(string):*} opts Function mapping from option name -&gt; value.
<span class='line'>380</span>  * @param {Dygraph=} dg
<span class='line'>381</span>  * @return {!TickList}
<span class='line'>382</span>  */</span><span class="WHIT">
<span class='line'>383</span> </span><span class="NAME">export</span><span class="WHIT"> </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">getDateAxis</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">function</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">start_time</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">end_time</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">granularity</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">opts</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">dg</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>384</span> </span><span class="WHIT">  </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">formatter</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="COMM">/** @type{AxisLabelFormatter} */</span><span class="PUNC">(</span><span class="WHIT">
<span class='line'>385</span> </span><span class="WHIT">      </span><span class="NAME">opts</span><span class="PUNC">(</span><span class="STRN">"axisLabelFormatter"</span><span class="PUNC">)</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>386</span> </span><span class="WHIT">  </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">utc</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">opts</span><span class="PUNC">(</span><span class="STRN">"labelsUTC"</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>387</span> </span><span class="WHIT">  </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">accessors</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">utc</span><span class="WHIT"> </span><span class="PUNC">?</span><span class="WHIT"> </span><span class="NAME">utils.DateAccessorsUTC</span><span class="WHIT"> </span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">utils.DateAccessorsLocal</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>388</span> 
<span class='line'>389</span> </span><span class="WHIT">  </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">datefield</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">granularity</span><span class="PUNC">]</span><span class="PUNC">.</span><span class="NAME">datefield</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>390</span> </span><span class="WHIT">  </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">step</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">granularity</span><span class="PUNC">]</span><span class="PUNC">.</span><span class="NAME">step</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>391</span> </span><span class="WHIT">  </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">TICK_PLACEMENT</span><span class="PUNC">[</span><span class="NAME">granularity</span><span class="PUNC">]</span><span class="PUNC">.</span><span class="NAME">spacing</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>392</span> 
<span class='line'>393</span> </span><span class="WHIT">  </span><span class="COMM">// Choose a nice tick position before the initial instant.</span><span class="WHIT">
<span class='line'>394</span> </span><span class="WHIT">  </span><span class="COMM">// Currently, this code deals properly with the existent daily granularities:</span><span class="WHIT">
<span class='line'>395</span> </span><span class="WHIT">  </span><span class="COMM">// DAILY (with step of 1) and WEEKLY (with step of 7 but specially handled).</span><span class="WHIT">
<span class='line'>396</span> </span><span class="WHIT">  </span><span class="COMM">// Other daily granularities (say TWO_DAILY) should also be handled specially</span><span class="WHIT">
<span class='line'>397</span> </span><span class="WHIT">  </span><span class="COMM">// by setting the start_date_offset to 0.</span><span class="WHIT">
<span class='line'>398</span> </span><span class="WHIT">  </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">start_date</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">new</span><span class="WHIT"> </span><span class="NAME">Date</span><span class="PUNC">(</span><span class="NAME">start_time</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>399</span> </span><span class="WHIT">  </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">date_array</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">[</span><span class="PUNC">]</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>400</span> </span><span class="WHIT">  </span><span class="NAME">date_array</span><span class="PUNC">[</span><span class="NAME">DateField.DATEFIELD_Y</span><span class="PUNC">]</span><span class="WHIT">  </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">accessors.getFullYear</span><span class="PUNC">(</span><span class="NAME">start_date</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>401</span> </span><span class="WHIT">  </span><span class="NAME">date_array</span><span class="PUNC">[</span><span class="NAME">DateField.DATEFIELD_M</span><span class="PUNC">]</span><span class="WHIT">  </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">accessors.getMonth</span><span class="PUNC">(</span><span class="NAME">start_date</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>402</span> </span><span class="WHIT">  </span><span class="NAME">date_array</span><span class="PUNC">[</span><span class="NAME">DateField.DATEFIELD_D</span><span class="PUNC">]</span><span class="WHIT">  </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">accessors.getDate</span><span class="PUNC">(</span><span class="NAME">start_date</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>403</span> </span><span class="WHIT">  </span><span class="NAME">date_array</span><span class="PUNC">[</span><span class="NAME">DateField.DATEFIELD_HH</span><span class="PUNC">]</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">accessors.getHours</span><span class="PUNC">(</span><span class="NAME">start_date</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>404</span> </span><span class="WHIT">  </span><span class="NAME">date_array</span><span class="PUNC">[</span><span class="NAME">DateField.DATEFIELD_MM</span><span class="PUNC">]</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">accessors.getMinutes</span><span class="PUNC">(</span><span class="NAME">start_date</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>405</span> </span><span class="WHIT">  </span><span class="NAME">date_array</span><span class="PUNC">[</span><span class="NAME">DateField.DATEFIELD_SS</span><span class="PUNC">]</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">accessors.getSeconds</span><span class="PUNC">(</span><span class="NAME">start_date</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>406</span> </span><span class="WHIT">  </span><span class="NAME">date_array</span><span class="PUNC">[</span><span class="NAME">DateField.DATEFIELD_MS</span><span class="PUNC">]</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">accessors.getMilliseconds</span><span class="PUNC">(</span><span class="NAME">start_date</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>407</span> 
<span class='line'>408</span> </span><span class="WHIT">  </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">start_date_offset</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">date_array</span><span class="PUNC">[</span><span class="NAME">datefield</span><span class="PUNC">]</span><span class="WHIT"> </span><span class="PUNC">%</span><span class="WHIT"> </span><span class="NAME">step</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>409</span> </span><span class="WHIT">  </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">granularity</span><span class="WHIT"> </span><span class="PUNC">==</span><span class="WHIT"> </span><span class="NAME">Granularity.WEEKLY</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>410</span> </span><span class="WHIT">    </span><span class="COMM">// This will put the ticks on Sundays.</span><span class="WHIT">
<span class='line'>411</span> </span><span class="WHIT">    </span><span class="NAME">start_date_offset</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">accessors.getDay</span><span class="PUNC">(</span><span class="NAME">start_date</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>412</span> </span><span class="WHIT">  </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>413</span> 
<span class='line'>414</span> </span><span class="WHIT">  </span><span class="NAME">date_array</span><span class="PUNC">[</span><span class="NAME">datefield</span><span class="PUNC">]</span><span class="WHIT"> </span><span class="PUNC">-</span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">start_date_offset</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>415</span> </span><span class="WHIT">  </span><span class="KEYW">for</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">df</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">datefield</span><span class="WHIT"> </span><span class="PUNC">+</span><span class="WHIT"> </span><span class="NUMB">1</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="NAME">df</span><span class="WHIT"> </span><span class="PUNC">&lt;</span><span class="WHIT"> </span><span class="NAME">DateField.NUM_DATEFIELDS</span><span class="PUNC">;</span><span class="WHIT"> </span><span class="NAME">df</span><span class="PUNC">++</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>416</span> </span><span class="WHIT">    </span><span class="COMM">// The minimum value is 1 for the day of month, and 0 for all other fields.</span><span class="WHIT">
<span class='line'>417</span> </span><span class="WHIT">    </span><span class="NAME">date_array</span><span class="PUNC">[</span><span class="NAME">df</span><span class="PUNC">]</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">df</span><span class="WHIT"> </span><span class="PUNC">===</span><span class="WHIT"> </span><span class="NAME">DateField.DATEFIELD_D</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">?</span><span class="WHIT"> </span><span class="NUMB">1</span><span class="WHIT"> </span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NUMB">0</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>418</span> </span><span class="WHIT">  </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>419</span> 
<span class='line'>420</span> </span><span class="WHIT">  </span><span class="COMM">// Generate the ticks.</span><span class="WHIT">
<span class='line'>421</span> </span><span class="WHIT">  </span><span class="COMM">// For granularities not coarser than HOURLY we use the fact that:</span><span class="WHIT">
<span class='line'>422</span> </span><span class="WHIT">  </span><span class="COMM">//   the number of milliseconds between ticks is constant</span><span class="WHIT">
<span class='line'>423</span> </span><span class="WHIT">  </span><span class="COMM">//   and equal to the defined spacing.</span><span class="WHIT">
<span class='line'>424</span> </span><span class="WHIT">  </span><span class="COMM">// Otherwise we rely on the 'roll over' property of the Date functions:</span><span class="WHIT">
<span class='line'>425</span> </span><span class="WHIT">  </span><span class="COMM">//   when some date field is set to a value outside of its logical range,</span><span class="WHIT">
<span class='line'>426</span> </span><span class="WHIT">  </span><span class="COMM">//   the excess 'rolls over' the next (more significant) field.</span><span class="WHIT">
<span class='line'>427</span> </span><span class="WHIT">  </span><span class="COMM">// However, when using local time with DST transitions,</span><span class="WHIT">
<span class='line'>428</span> </span><span class="WHIT">  </span><span class="COMM">// there are dates that do not represent any time value at all</span><span class="WHIT">
<span class='line'>429</span> </span><span class="WHIT">  </span><span class="COMM">// (those in the hour skipped at the 'spring forward'),</span><span class="WHIT">
<span class='line'>430</span> </span><span class="WHIT">  </span><span class="COMM">// and the JavaScript engines usually return an equivalent value.</span><span class="WHIT">
<span class='line'>431</span> </span><span class="WHIT">  </span><span class="COMM">// Hence we have to check that the date is properly increased at each step,</span><span class="WHIT">
<span class='line'>432</span> </span><span class="WHIT">  </span><span class="COMM">// returning a date at a nice tick position.</span><span class="WHIT">
<span class='line'>433</span> </span><span class="WHIT">  </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">ticks</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="PUNC">[</span><span class="PUNC">]</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>434</span> </span><span class="WHIT">  </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">tick_date</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">accessors.makeDate.apply</span><span class="PUNC">(</span><span class="KEYW">null</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">date_array</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>435</span> </span><span class="WHIT">  </span><span class="KEYW">var</span><span class="WHIT"> </span><span class="NAME">tick_time</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">tick_date.getTime</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>436</span> </span><span class="WHIT">  </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">granularity</span><span class="WHIT"> </span><span class="PUNC">&lt;=</span><span class="WHIT"> </span><span class="NAME">Granularity.HOURLY</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>437</span> </span><span class="WHIT">    </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">tick_time</span><span class="WHIT"> </span><span class="PUNC">&lt;</span><span class="WHIT"> </span><span class="NAME">start_time</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>438</span> </span><span class="WHIT">      </span><span class="NAME">tick_time</span><span class="WHIT"> </span><span class="PUNC">+</span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>439</span> </span><span class="WHIT">      </span><span class="NAME">tick_date</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">new</span><span class="WHIT"> </span><span class="NAME">Date</span><span class="PUNC">(</span><span class="NAME">tick_time</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>440</span> </span><span class="WHIT">    </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>441</span> </span><span class="WHIT">    </span><span class="KEYW">while</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">tick_time</span><span class="WHIT"> </span><span class="PUNC">&lt;=</span><span class="WHIT"> </span><span class="NAME">end_time</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>442</span> </span><span class="WHIT">      </span><span class="NAME">ticks.push</span><span class="PUNC">(</span><span class="PUNC">{</span><span class="WHIT"> </span><span class="NAME">v</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">tick_time</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>443</span> </span><span class="WHIT">                   </span><span class="NAME">label</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">formatter.call</span><span class="PUNC">(</span><span class="NAME">dg</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">tick_date</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">granularity</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">opts</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">dg</span><span class="PUNC">)</span><span class="WHIT">
<span class='line'>444</span> </span><span class="WHIT">                 </span><span class="PUNC">}</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>445</span> </span><span class="WHIT">      </span><span class="NAME">tick_time</span><span class="WHIT"> </span><span class="PUNC">+</span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">spacing</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>446</span> </span><span class="WHIT">      </span><span class="NAME">tick_date</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="KEYW">new</span><span class="WHIT"> </span><span class="NAME">Date</span><span class="PUNC">(</span><span class="NAME">tick_time</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>447</span> </span><span class="WHIT">    </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>448</span> </span><span class="WHIT">  </span><span class="PUNC">}</span><span class="WHIT"> </span><span class="KEYW">else</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>449</span> </span><span class="WHIT">    </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">tick_time</span><span class="WHIT"> </span><span class="PUNC">&lt;</span><span class="WHIT"> </span><span class="NAME">start_time</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>450</span> </span><span class="WHIT">      </span><span class="NAME">date_array</span><span class="PUNC">[</span><span class="NAME">datefield</span><span class="PUNC">]</span><span class="WHIT"> </span><span class="PUNC">+</span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">step</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>451</span> </span><span class="WHIT">      </span><span class="NAME">tick_date</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">accessors.makeDate.apply</span><span class="PUNC">(</span><span class="KEYW">null</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">date_array</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>452</span> </span><span class="WHIT">      </span><span class="NAME">tick_time</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">tick_date.getTime</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>453</span> </span><span class="WHIT">    </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>454</span> </span><span class="WHIT">    </span><span class="KEYW">while</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">tick_time</span><span class="WHIT"> </span><span class="PUNC">&lt;=</span><span class="WHIT"> </span><span class="NAME">end_time</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>455</span> </span><span class="WHIT">      </span><span class="KEYW">if</span><span class="WHIT"> </span><span class="PUNC">(</span><span class="NAME">granularity</span><span class="WHIT"> </span><span class="PUNC">>=</span><span class="WHIT"> </span><span class="NAME">Granularity.DAILY</span><span class="WHIT"> </span><span class="PUNC">||</span><span class="WHIT">
<span class='line'>456</span> </span><span class="WHIT">          </span><span class="NAME">accessors.getHours</span><span class="PUNC">(</span><span class="NAME">tick_date</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">%</span><span class="WHIT"> </span><span class="NAME">step</span><span class="WHIT"> </span><span class="PUNC">===</span><span class="WHIT"> </span><span class="NUMB">0</span><span class="PUNC">)</span><span class="WHIT"> </span><span class="PUNC">{</span><span class="WHIT">
<span class='line'>457</span> </span><span class="WHIT">        </span><span class="NAME">ticks.push</span><span class="PUNC">(</span><span class="PUNC">{</span><span class="WHIT"> </span><span class="NAME">v</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">tick_time</span><span class="PUNC">,</span><span class="WHIT">
<span class='line'>458</span> </span><span class="WHIT">                     </span><span class="NAME">label</span><span class="PUNC">:</span><span class="WHIT"> </span><span class="NAME">formatter.call</span><span class="PUNC">(</span><span class="NAME">dg</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">tick_date</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">granularity</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">opts</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">dg</span><span class="PUNC">)</span><span class="WHIT">
<span class='line'>459</span> </span><span class="WHIT">                   </span><span class="PUNC">}</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>460</span> </span><span class="WHIT">      </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>461</span> </span><span class="WHIT">      </span><span class="NAME">date_array</span><span class="PUNC">[</span><span class="NAME">datefield</span><span class="PUNC">]</span><span class="WHIT"> </span><span class="PUNC">+</span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">step</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>462</span> </span><span class="WHIT">      </span><span class="NAME">tick_date</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">accessors.makeDate.apply</span><span class="PUNC">(</span><span class="KEYW">null</span><span class="PUNC">,</span><span class="WHIT"> </span><span class="NAME">date_array</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>463</span> </span><span class="WHIT">      </span><span class="NAME">tick_time</span><span class="WHIT"> </span><span class="PUNC">=</span><span class="WHIT"> </span><span class="NAME">tick_date.getTime</span><span class="PUNC">(</span><span class="PUNC">)</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>464</span> </span><span class="WHIT">    </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>465</span> </span><span class="WHIT">  </span><span class="PUNC">}</span><span class="WHIT">
<span class='line'>466</span> </span><span class="WHIT">  </span><span class="KEYW">return</span><span class="WHIT"> </span><span class="NAME">ticks</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>467</span> </span><span class="PUNC">}</span><span class="PUNC">;</span><span class="WHIT">
<span class='line'>468</span> </span></pre></body></html>