UNPKG

dygraphs

Version:

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

922 lines (553 loc) 19.4 kB
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <meta name="generator" content="JsDoc Toolkit" /> <title>JsDoc Reference - _global_</title> <style type="text/css"> /* default.css */ body { font: 12px "Lucida Grande", Tahoma, Arial, Helvetica, sans-serif; width: 800px; } .header { clear: both; background-color: #ccc; padding: 8px; } h1 { font-size: 150%; font-weight: bold; padding: 0; margin: 1em 0 0 .3em; } hr { border: none 0; border-top: 1px solid #7F8FB1; height: 1px; } pre.code { display: block; padding: 8px; border: 1px dashed #ccc; } #index { margin-top: 24px; float: left; width: 160px; position: absolute; left: 8px; background-color: #F3F3F3; padding: 8px; } #content { margin-left: 190px; width: 600px; } .classList { list-style-type: none; padding: 0; margin: 0 0 0 8px; font-family: arial, sans-serif; font-size: 1em; overflow: auto; } .classList li { padding: 0; margin: 0 0 8px 0; } .summaryTable { width: 100%; } h1.classTitle { font-size:170%; line-height:130%; } h2 { font-size: 110%; } caption, div.sectionTitle { background-color: #7F8FB1; color: #fff; font-size:130%; text-align: left; padding: 2px 6px 2px 6px; border: 1px #7F8FB1 solid; } div.sectionTitle { margin-bottom: 8px; } .summaryTable thead { display: none; } .summaryTable td { vertical-align: top; padding: 4px; border-bottom: 1px #7F8FB1 solid; border-right: 1px #7F8FB1 solid; } /*col#summaryAttributes {}*/ .summaryTable td.attributes { border-left: 1px #7F8FB1 solid; width: 140px; text-align: right; } td.attributes, .fixedFont { line-height: 15px; color: #002EBE; font-family: "Courier New",Courier,monospace; font-size: 13px; } .summaryTable td.nameDescription { text-align: left; font-size: 13px; line-height: 15px; } .summaryTable td.nameDescription, .description { line-height: 15px; padding: 4px; padding-left: 4px; } .summaryTable { margin-bottom: 8px; } ul.inheritsList { list-style: square; margin-left: 20px; padding-left: 0; } .detailList { margin-left: 20px; line-height: 15px; } .detailList dt { margin-left: 20px; } .detailList .heading { font-weight: bold; padding-bottom: 6px; margin-left: 0; } .light, td.attributes, .light a:link, .light a:visited { color: #777; font-style: italic; } .fineprint { text-align: right; font-size: 10px; } </style> </head> <body> <!-- ============================== header ================================= --> <!-- begin static/header.html --> <div id="header"> </div> <!-- end static/header.html --> <!-- ============================== classes index ============================ --> <div id="index"> <!-- begin publish.classesIndex --> <div align="center"><a href="../index.html">Class Index</a> | <a href="../files.html">File Index</a></div> <hr /> <h2>Classes</h2> <ul class="classList"> <li><i><a href="../symbols/_global_.html">_global_</a></i></li> <li><a href="../symbols/Dygraph.html">Dygraph</a></li> <li><a href="../symbols/DygraphCanvasRenderer.html">DygraphCanvasRenderer</a></li> <li><a href="../symbols/DygraphInteraction.html">DygraphInteraction</a></li> <li><a href="../symbols/DygraphLayout.html">DygraphLayout</a></li> <li><a href="../symbols/DygraphOptions.html">DygraphOptions</a></li> <li><a href="../symbols/grid.html">grid</a></li> <li><a href="../symbols/GVizChart.html">GVizChart</a></li> <li><a href="../symbols/GVizDataTable.html">GVizDataTable</a></li> </ul> <hr /> <!-- end publish.classesIndex --> </div> <div id="content"> <!-- ============================== class title ============================ --> <h1 class="classTitle"> Built-In Namespace _global_ </h1> <!-- ============================== class summary ========================== --> <p class="description"> </p> <!-- ============================== constructor summary ==================== --> <!-- ============================== properties summary ===================== --> <table class="summaryTable" cellspacing="0" summary="A summary of the fields documented in the class _global_."> <caption>Field Summary</caption> <thead> <tr> <th scope="col">Field Attributes</th> <th scope="col">Field Name and Description</th> </tr> </thead> <tbody> <tr> <td class="attributes">&nbsp;</td> <td class="nameDescription"> <div class="fixedFont"> <b><a href="../symbols/_global_.html#AxisLabelFormatter">AxisLabelFormatter</a></b> </div> <div class="description"></div> </td> </tr> <tr> <td class="attributes">&nbsp;</td> <td class="nameDescription"> <div class="fixedFont"> <b><a href="../symbols/_global_.html#DRAG_EDGE_MARGIN">DRAG_EDGE_MARGIN</a></b> </div> <div class="description">You can drag this many pixels past the edge of the chart and still have it be considered a zoom.</div> </td> </tr> <tr> <td class="attributes">&nbsp;</td> <td class="nameDescription"> <div class="fixedFont"> <b><a href="../symbols/_global_.html#DygraphDataArray">DygraphDataArray</a></b> </div> <div class="description"></div> </td> </tr> <tr> <td class="attributes">&nbsp;</td> <td class="nameDescription"> <div class="fixedFont"> <b><a href="../symbols/_global_.html#DygraphInteractionContext">DygraphInteractionContext</a></b> </div> <div class="description"></div> </td> </tr> <tr> <td class="attributes">&nbsp;</td> <td class="nameDescription"> <div class="fixedFont"> <b><a href="../symbols/_global_.html#OPTIONS_REFERENCE">OPTIONS_REFERENCE</a></b> </div> <div class="description"></div> </td> </tr> <tr> <td class="attributes">&nbsp;</td> <td class="nameDescription"> <div class="fixedFont"> <b><a href="../symbols/_global_.html#PREFERRED_LOG_TICK_VALUES">PREFERRED_LOG_TICK_VALUES</a></b> </div> <div class="description">This is a list of human-friendly values at which to show tick marks on a log scale.</div> </td> </tr> <tr> <td class="attributes">&nbsp;</td> <td class="nameDescription"> <div class="fixedFont"> <b><a href="../symbols/_global_.html#TICK_PLACEMENT">TICK_PLACEMENT</a></b> </div> <div class="description">The value of datefield will start at an even multiple of "step", i.e.</div> </td> </tr> <tr> <td class="attributes">&nbsp;</td> <td class="nameDescription"> <div class="fixedFont"> <b><a href="../symbols/_global_.html#Ticker">Ticker</a></b> </div> <div class="description"></div> </td> </tr> <tr> <td class="attributes">&nbsp;</td> <td class="nameDescription"> <div class="fixedFont"> <b><a href="../symbols/_global_.html#TickList">TickList</a></b> </div> <div class="description"></div> </td> </tr> <tr> <td class="attributes">&nbsp;</td> <td class="nameDescription"> <div class="fixedFont"> <b><a href="../symbols/_global_.html#ValueFormatter">ValueFormatter</a></b> </div> <div class="description"></div> </td> </tr> </tbody> </table> <!-- ============================== methods summary ======================== --> <table class="summaryTable" cellspacing="0" summary="A summary of the methods documented in the class _global_."> <caption>Method Summary</caption> <thead> <tr> <th scope="col">Method Attributes</th> <th scope="col">Method Name and Description</th> </tr> </thead> <tbody> <tr> <td class="attributes">&nbsp;</td> <td class="nameDescription"> <div class="fixedFont"><b><a href="../symbols/_global_.html#annotations">annotations</a></b>() </div> <div class="description">Current bits of jankiness: - Uses dygraph.layout_ to get the parsed annotations.</div> </td> </tr> <tr> <td class="attributes">&nbsp;</td> <td class="nameDescription"> <div class="fixedFont"><b><a href="../symbols/_global_.html#axes">axes</a></b>() </div> <div class="description">Draws the axes.</div> </td> </tr> <tr> <td class="attributes">&nbsp;</td> <td class="nameDescription"> <div class="fixedFont"><b><a href="../symbols/_global_.html#chart_labels">chart_labels</a></b>() </div> <div class="description"></div> </td> </tr> <tr> <td class="attributes">&nbsp;</td> <td class="nameDescription"> <div class="fixedFont"><b><a href="../symbols/_global_.html#distanceFromChart">distanceFromChart</a></b>(event, g) </div> <div class="description">Returns the number of pixels by which the event happens from the nearest edge of the chart.</div> </td> </tr> <tr> <td class="attributes">&nbsp;</td> <td class="nameDescription"> <div class="fixedFont"><b><a href="../symbols/_global_.html#numDateTicks">numDateTicks</a></b>(start_time, end_time, granularity) </div> <div class="description">Compute the number of ticks on a date axis for a given granularity.</div> </td> </tr> </tbody> </table> <!-- ============================== events summary ======================== --> <!-- ============================== constructor details ==================== --> <!-- ============================== field details ========================== --> <div class="sectionTitle"> Field Detail </div> <a name="AxisLabelFormatter"> </a> <div class="fixedFont"> <b>AxisLabelFormatter</b> </div> <div class="description"> <br /> <i>Defined in: </i> <a href="../symbols/src/src_dygraph-internal.externs.js.html">dygraph-internal.externs.js</a>. </div> <hr /> <a name="DRAG_EDGE_MARGIN"> </a> <div class="fixedFont"> <b>DRAG_EDGE_MARGIN</b> </div> <div class="description"> You can drag this many pixels past the edge of the chart and still have it be considered a zoom. This makes it easier to zoom to the exact edge of the chart, a fairly common operation. <br /> <i>Defined in: </i> <a href="../symbols/src/src_dygraph-interaction-model.js.html">dygraph-interaction-model.js</a>. </div> <hr /> <a name="DygraphDataArray"> </a> <div class="fixedFont"> <b>DygraphDataArray</b> </div> <div class="description"> <br /> <i>Defined in: </i> <a href="../symbols/src/src_dygraph-internal.externs.js.html">dygraph-internal.externs.js</a>. </div> <hr /> <a name="DygraphInteractionContext"> </a> <div class="fixedFont"> <b>DygraphInteractionContext</b> </div> <div class="description"> <br /> <i>Defined in: </i> <a href="../symbols/src/src_dygraph-types.js.html">dygraph-types.js</a>. </div> <hr /> <a name="OPTIONS_REFERENCE"> </a> <div class="fixedFont"> <b>OPTIONS_REFERENCE</b> </div> <div class="description"> <br /> <i>Defined in: </i> <a href="../symbols/src/src_dygraph-options-reference.js.html">dygraph-options-reference.js</a>. </div> <hr /> <a name="PREFERRED_LOG_TICK_VALUES"> </a> <div class="fixedFont"> <b>PREFERRED_LOG_TICK_VALUES</b> </div> <div class="description"> This is a list of human-friendly values at which to show tick marks on a log scale. It is k * 10^n, where k=1..9 and n=-39..+39, so: ..., 1, 2, 3, 4, 5, ..., 9, 10, 20, 30, ..., 90, 100, 200, 300, ... NOTE: this assumes that utils.LOG_SCALE = 10. <br /> <i>Defined in: </i> <a href="../symbols/src/src_dygraph-tickers.js.html">dygraph-tickers.js</a>. </div> <hr /> <a name="TICK_PLACEMENT"> </a> <div class="fixedFont"> <b>TICK_PLACEMENT</b> </div> <div class="description"> The value of datefield will start at an even multiple of "step", i.e. if datefield=SS and step=5 then the first tick will be on a multiple of 5s. For granularities <= HOURLY, ticks are generated every `spacing` ms. At coarser granularities, ticks are generated by incrementing `datefield` by `step`. In this case, the `spacing` value is only used to estimate the number of ticks. It should roughly correspond to the spacing between adjacent ticks. <br /> <i>Defined in: </i> <a href="../symbols/src/src_dygraph-tickers.js.html">dygraph-tickers.js</a>. </div> <hr /> <a name="Ticker"> </a> <div class="fixedFont"> <b>Ticker</b> </div> <div class="description"> <br /> <i>Defined in: </i> <a href="../symbols/src/src_dygraph-tickers.js.html">dygraph-tickers.js</a>. </div> <hr /> <a name="TickList"> </a> <div class="fixedFont"> <b>TickList</b> </div> <div class="description"> <br /> <i>Defined in: </i> <a href="../symbols/src/src_dygraph-tickers.js.html">dygraph-tickers.js</a>. </div> <hr /> <a name="ValueFormatter"> </a> <div class="fixedFont"> <b>ValueFormatter</b> </div> <div class="description"> <br /> <i>Defined in: </i> <a href="../symbols/src/src_dygraph-internal.externs.js.html">dygraph-internal.externs.js</a>. </div> <!-- ============================== method details ========================= --> <div class="sectionTitle"> Method Detail </div> <a name="annotations"> </a> <div class="fixedFont"> <b>annotations</b>() </div> <div class="description"> Current bits of jankiness: - Uses dygraph.layout_ to get the parsed annotations. - Uses dygraph.plotter_.area It would be nice if the plugin didn't require so much special support inside the core dygraphs classes, but annotations involve quite a bit of parsing and layout. TODO(danvk): cache DOM elements. <br /> <i>Defined in: </i> <a href="../symbols/src/src_plugins_annotations.js.html">annotations.js</a>. </div> <hr /> <a name="axes"> </a> <div class="fixedFont"> <b>axes</b>() </div> <div class="description"> Draws the axes. This includes the labels on the x- and y-axes, as well as the tick marks on the axes. It does _not_ draw the grid lines which span the entire chart. <br /> <i>Defined in: </i> <a href="../symbols/src/src_plugins_axes.js.html">axes.js</a>. </div> <hr /> <a name="chart_labels"> </a> <div class="fixedFont"> <b>chart_labels</b>() </div> <div class="description"> <br /> <i>Defined in: </i> <a href="../symbols/src/src_plugins_chart-labels.js.html">chart-labels.js</a>. </div> <hr /> <a name="distanceFromChart"> </a> <div class="fixedFont"> <b>distanceFromChart</b>(event, g) </div> <div class="description"> Returns the number of pixels by which the event happens from the nearest edge of the chart. For events in the interior of the chart, this returns zero. <br /> <i>Defined in: </i> <a href="../symbols/src/src_dygraph-interaction-model.js.html">dygraph-interaction-model.js</a>. </div> <dl class="detailList"> <dt class="heading">Parameters:</dt> <dt> <b>event</b> </dt> <dd></dd> <dt> <b>g</b> </dt> <dd></dd> </dl> <hr /> <a name="numDateTicks"> </a> <div class="fixedFont"> <span class="light">{number}</span> <b>numDateTicks</b>(start_time, end_time, granularity) </div> <div class="description"> Compute the number of ticks on a date axis for a given granularity. <br /> <i>Defined in: </i> <a href="../symbols/src/src_dygraph-tickers.js.html">dygraph-tickers.js</a>. </div> <dl class="detailList"> <dt class="heading">Parameters:</dt> <dt> <span class="light fixedFont">{number}</span> <b>start_time</b> </dt> <dd></dd> <dt> <span class="light fixedFont">{number}</span> <b>end_time</b> </dt> <dd></dd> <dt> <span class="light fixedFont">{number}</span> <b>granularity</b> </dt> <dd>(one of the granularities enumerated above)</dd> </dl> <dl class="detailList"> <dt class="heading">Returns:</dt> <dd><span class="light fixedFont">{number}</span> (Approximate) number of ticks that would result.</dd> </dl> <!-- ============================== event details ========================= --> <hr /> </div> <!-- ============================== footer ================================= --> <div class="fineprint" style="clear:both"> Documentation generated by <a href="http://code.google.com/p/jsdoc-toolkit/" target="_blank">JsDoc Toolkit</a> 2.4.0 for dygraph 2.2.1 </div> </body> </html>