-- name: title
+- name: dateWindow
tags:
- - chart
- - labels
- - display
+ - interactivity
+ - axes
+ type: Array of two Dates or numbers
default: null
+ desc: Initially zoom in on a section of the graph. Is of the form [earliest, latest],
+ where earliest/latest are milliseconds since epoch. If the data for the x-axis
+ is numeric, the values in dateWindow must also be numbers. By default, the
+ full range of the input is shown.
examples:
- - border
- - demo
- - noise
- - styled-chart-labels
- - multi-scale
- - range-selector
- - temperature-sf-ny
- type: String
- desc: Text to display above the chart. You can supply any HTML for this value,
- not just text. If you wish to style it using CSS, use the 'dygraph-label'
- or 'dygraph-title' classes.
+ - dateWindow
+ - drawing
+ - is-zoomed-ignore-programmatic-zoom
+ - link-interaction
+ - synchronize
+ - zoom
-- name: xlabel
+- name: panEdgeFraction
tags:
- - x-axis
- - labels
- - display
+ - graph
+ - interactivity
+ - axes
+ - pan
+ type: Float
default: null
+ desc: A value representing the farthest a graph may be panned, in percent of the
+ display. For example, a value of 0.1 means that the graph can only be panned
+ 10% pased the edges of the displayed values. null means no bounds.
examples:
- - border
- - demo
- - styled-chart-labels
- - multi-scale
- type: String
- desc: Text to display below the chart's x-axis. You can supply any HTML for this
- value, not just text. If you wish to style it using CSS, use the 'dygraph-label'
- or 'dygraph-xlabel' classes.
+ - zoom
-- name: ylabel
+- name: visibility
tags:
- - y-axis
- - labels
+ - graph
+ - lines
+ - data
- display
- default: null
+ type: Array of booleans
+ default: true
+ desc: Which series should initially be visible? Once the Dygraph has been constructed,
+ you can access and modify the visibility of each series using the visibility
+ and setVisibility methods.
examples:
- - border
- - demo
- - two-axes
- - noise
- - styled-chart-labels
- - multi-scale
- - range-selector
- - temperature-sf-ny
- - two-axes-vr
- type: String
- desc: Text to display to the left of the chart's y-axis. You can supply any HTML
- for this value, not just text. If you wish to style it using CSS, use the
- 'dygraph-label' or 'dygraph-ylabel' classes. The text will be rotated 90 degrees
- by default, so CSS rules may behave in unintuitive ways. No additional space
- is set aside for a y-axis label. If you need more space, increase the width
- of the y-axis tick labels using the yAxisLabelWidth option. If you need a
- wider div for the y-axis label, either style it that way with CSS (but remember
- that it's rotated, so width is controlled by the 'height' property) or set
- the yLabelWidth option.
+ - color-visibility
+ - no-visibility
+ - visibility
-- name: y2label
+- name: stackedGraph
tags:
- - y-axis
- - labels
+ - graph
+ - lines
+ - data
- display
- default: null
+ type: Boolean
+ default: false
+ desc: If set, stack series on top of one another rather than drawing them independently.
examples:
+ - stacked
+
+- name: fillGraph
+ tags:
+ - graph
+ - lines
+ - data
+ - display
+ type: Boolean
+ default: false
+ desc: Should the area underneath the graph be filled? This option is not compatible
+ with error bars.
+ examples:
+ - fillGraph
- two-axes
- - two-axes-vr
- type: String
- desc: Text to display to the right of the chart's secondary y-axis. This label
- is only displayed if a secondary y-axis is present. See this test for an example
- of how to do this. The comments for the 'ylabel' option generally apply here
- as well. This label gets a 'dygraph-y2label' instead of a 'dygraph-ylabel'
- class.
+ - steps
-- name: titleHeight
+- name: strokeWidth
tags:
- - chart
- - labels
+ - line
+ - lines
+ - data
- display
- default: 18
+ type: Integer
+ default: 1
+ desc: The width of the lines connecting data points. This can be used to increase
+ the contrast or some graphs.
examples:
+ - linear-regression-addseries
+ - drawing
+ - grid_dot
+ - layout-options
+ - linear-regression-fractions
+ - linear-regression
+ - per-series
+ - unboxed-spark
- styled-chart-labels
- type: Integer
- desc: Height of the chart title, in pixels. This also controls the default font
- size of the title. If you style the title on your own, this controls how much
- space is set aside above the chart for the title's div.
-- name: xLabelHeight
- default: 18
+- name: strokePattern
tags:
- - x-axis
- - labels
+ - line
+ - lines
+ - data
- display
- type: Integer
- desc: Height of the x-axis label, in pixels. This also controls the default font
- size of the x-axis label. If you style the label on your own, this controls
- how much space is set aside below the chart for the x-axis label's div.
+ type: Array
+ default: null
+ desc: A custom pattern array where the even index is a draw and odd is a space
+ in pixels. If null then it draws a solid line. The array should have a even
+ length as any odd lengthed array could be expressed as a smaller even length
+ array.
+ examples:
+ - per-series
-- name: yLabelWidth
- default: 18
+- name: stepPlot
tags:
- - y-axis
- - labels
+ - graph
+ - lines
+ - data
- display
- type: Integer
- desc: Width of the div which contains the y-axis label. Since the y-axis label
- appears rotated 90 degrees, this actually affects the height of its div.
+ type: Boolean
+ default: false
+ desc: When set, display the graph as a step plot instead of a line plot.
+ examples:
+ - avoidMinZero
+ - steps
+ - y-axis-formatter
- name: connectSeparatedPoints
tags:
- lines
- data
- display
- default: false
- examples:
- - connect-separated
- - independent-series
type: Boolean
+ default: false
desc: Usually, when Dygraphs encounters a missing value in a data series, it interprets
this as a gap and draws it as such. If, instead, the missing values represents
an x-value for which only a different series has data, then you'll want to
connect the dots by setting this to true. To explicitly include a gap with
this option set, use a value of NaN.
+ examples:
+ - connect-separated
+ - independent-series
- name: drawPoints
tags:
- lines
- data
- display
+ - points
+ type: Boolean
default: false
+ desc: Draw a small dot at each point, in addition to a line going through the
+ point. This makes the individual data points easier to see, but can increase
+ visual clutter in the chart.
examples:
- linear-regression-addseries
- draw-points
- linear-regression-fractions
- linear-regression
- per-series
- type: Boolean
- desc: Draw a small dot at each point, in addition to a line going through the
- point. This makes the individual data points easier to see, but can increase
- visual clutter in the chart.
-
-- name: fillGraph
- tags:
- - graph
- - lines
- - data
- - display
- default: false
- examples:
- - fillGraph
- - two-axes
- - steps
- type: Boolean
- desc: Should the area underneath the graph be filled? This option is not compatible
- with error bars.
- name: pointSize
tags:
- lines
- data
- display
- default: 1
- examples:
- - per-series
+ - points
type: Integer
+ default: 1
desc: The size of the dot to draw on each point in pixels (see drawPoints). A
dot is always drawn when a point is "isolated", i.e. there is a missing point
on either side of it. This also controls the size of those dots.
-
-- name: stackedGraph
- tags:
- - graph
- - lines
- - data
- - display
- default: false
examples:
- - stacked
- type: Boolean
- desc: If set, stack series on top of one another rather than drawing them independently.
+ - per-series
-- name: stepPlot
+- name: rightGap
tags:
- graph
- - lines
- - data
- display
- default: false
- examples:
- - avoidMinZero
- - steps
- - y-axis-formatter
- type: Boolean
- desc: When set, display the graph as a step plot instead of a line plot.
-
-- name: strokePattern
- tags:
- - line
- lines
- data
- - display
- default: null
- examples:
- - per-series
- type: Array
- desc: A custom pattern array where the even index is a draw and odd is a space
- in pixels. If null then it draws a solid line. The array should have a even
- length as any odd lengthed array could be expressed as a smaller even length
- array.
+ - points
+ type: Integer
+ default: 5
+ desc: Number of pixels to leave blank at the right edge of the Dygraph. This makes
+ it easier to highlight the right-most data point.
-- name: strokeWidth
+- name: colors
tags:
- line
- - lines
+ - color
- data
- display
- default: 1
+ type: Array
+ default: null
+ desc: List of colors for the data series. These can be of the form "#AABBCC" or
+ "rgb(255,100,200)" or "yellow", etc. If not specified, equally-spaced points
+ around a color wheel are used.
examples:
- - linear-regression-addseries
- - drawing
- - grid_dot
- - layout-options
- - linear-regression-fractions
- - linear-regression
- - per-series
- - unboxed-spark
- - styled-chart-labels
- type: Integer
- desc: The width of the lines connecting data points. This can be used to increase
- the contrast or some graphs.
+ - century-scale
+ - color-visibility
+ - demo
+ - reverse-y-axis
+ - color-cycle
- name: colorSaturation
- default: 1.0
tags:
- line
- color
- data
- display
type: Float (0.0 - 1.0)
+ default: 1.0
desc: If colors is not specified, saturation of the automatically-generated data
series colors.
- name: colorValue
- default: 1.0
tags:
- line
- color
- data
- display
type: Float (0.0 - 1.0)
+ default: 0.5
desc: If colors is not specified, value of the data series colors, as in hue/saturation/value.
(0.0-1.0, default 0.5)
-- name: colors
+- name: animatedZooms
tags:
- - line
- - color
- - data
- - display
+ - interactivity
+ - zoom
+ type: Boolean
+ default: false
+ desc: Set this option to animate the transition between zoom windows. Applies
+ to programmatic and interactive zooms. Note that if you also set a drawCallback,
+ it will be called several times on each zoom. If you set a zoomCallback, it
+ will only be called after the animation is complete.
+ examples:
+ - highlighted-region
+ - link-interaction
+
+- name: highlightCircleSize
+ tags:
+ - graph
+ - interactivity
+ type: Integer
+ default: 3
+ desc: The size in pixels of the dot drawn over highlighted points.
+ examples:
+ - dygraph-many-points-benchmark
+ - grid_dot
+ - per-series
+ - unboxed-spark
+
+- name: interactionModel
+ ignore: true
+ tags:
+ - interactivity
+ type: Object
default: null
+ desc: 'TODO(konigsberg): document this'
examples:
- - century-scale
- - color-visibility
- - demo
- - reverse-y-axis
- - color-cycle
- type: Array
- desc: List of colors for the data series. These can be of the form "#AABBCC" or
- "rgb(255,100,200)" or "yellow", etc. If not specified, equally-spaced points
- around a color wheel are used.
+ - drawing
+ - interaction
-- name: avoidMinZero
+- name: isZoomedIgnoreProgrammaticZoom
tags:
- - y-axis
- - axes
+ - interactivity
+ - zoom
+ type: Boolean
default: false
+ desc: When this option is passed to updateOptions() along with either the dateWindow
+ or valueRange options, the zoom flags are not changed to reflect a zoomed
+ state. This is primarily useful for when the display area of a chart is changed
+ programmatically and also where manual zooming is allowed and use is made
+ of the isZoomed method to determine this.
examples:
- - avoidMinZero
- type: Boolean
- desc: "When set, the heuristic that fixes the Y axis at zero for a data set with\
- \ the minimum Y value of zero is disabled. \nThis is particularly useful for\
- \ data sets that contain many zero values, especially for step plots which\
- \ may otherwise have lines not visible running along the bottom axis."
+ - is-zoomed-ignore-programmatic-zoom
-- name: axis
+- name: labels
tags:
- - axes
+ - legend
+ - labels
+ - display
+ type: Array
default: null
+ desc: A name for each data series, including the independent (X) series. For CSV
+ files and DataTable objections, this is determined by context. For raw data,
+ this must be specified. If it is not, default values are supplied and a warning
+ is logged. By default, labels roughly follow ["X", "Y1", "Y2", ...]*
examples:
+ - linear-regression-addseries
+ - connect-separated
+ - drawing
+ - dygraph
+ - dygraph-many-points-benchmark
+ - dynamic-update
+ - highlighted-region
+ - independent-series
+ - isolated-points
+ - label-div
+ - link-interaction
+ - linear-regression
+ - negative
+ - missing-data
+ - native-format
- two-axes
+ - perf
+ - small-range-zero
- steps
+ - y-axis-formatter
+ - annotation-native
+ - multi-scale
- two-axes-vr
- value-axis-formatters
- type: String or Object
- desc: Set to either an object ({}) filled with options for this axis or to the
- name of an existing data series with its own axis to re-use that axis. See
- tests for usage.
-- name: axisLabelColor
- default: black
+- name: xlabel
tags:
- - axes
- - color
+ - x-axis
- labels
+ - display
+ - axes
type: String
- desc: Color for x- and y-axis labels. This is a CSS color string.
+ default: null
+ desc: Text to display below the chart's x-axis. You can supply any HTML for this
+ value, not just text. If you wish to style it using CSS, use the 'dygraph-label'
+ or 'dygraph-xlabel' classes.
+ examples:
+ - border
+ - demo
+ - styled-chart-labels
+ - multi-scale
-- name: axisLabelFontSize
- default: 14
+- name: ylabel
tags:
+ - y-axis
+ - labels
+ - display
- axes
+ type: String
+ default: null
+ desc: Text to display to the left of the chart's y-axis. You can supply any HTML
+ for this value, not just text. If you wish to style it using CSS, use the
+ 'dygraph-label' or 'dygraph-ylabel' classes. The text will be rotated 90 degrees
+ by default, so CSS rules may behave in unintuitive ways. No additional space
+ is set aside for a y-axis label. If you need more space, increase the width
+ of the y-axis tick labels using the yAxisLabelWidth option. If you need a
+ wider div for the y-axis label, either style it that way with CSS (but remember
+ that it's rotated, so width is controlled by the 'height' property) or set
+ the yLabelWidth option.
+ examples:
+ - border
+ - demo
+ - two-axes
+ - noise
+ - styled-chart-labels
+ - multi-scale
+ - range-selector
+ - temperature-sf-ny
+ - two-axes-vr
+
+- name: y2label
+ tags:
+ - y-axis
- labels
- type: Integer
- desc: Size of the font (in pixels) to use in the axis labels, both x- and y-axis.
+ - display
+ type: String
+ default: null
+ desc: Text to display to the right of the chart's secondary y-axis. This label
+ is only displayed if a secondary y-axis is present. See this test for an example
+ of how to do this. The comments for the 'ylabel' option generally apply here
+ as well. This label gets a 'dygraph-y2label' instead of a 'dygraph-ylabel'
+ class.
+ examples:
+ - two-axes
+ - two-axes-vr
-- name: axisLabelFormatter
+- name: legend
tags:
- - axes
+ - legend
- labels
+ - display
+ type: String
+ default: onmouseover
+ desc: When to display the legend. By default, it only appears when a user mouses
+ over the chart. Set it to "always" to always display a legend of some sort.
+ examples:
+ - demo
+ - noise
+ - per-series
+ - styled-chart-labels
+ - multi-scale
+ - range-selector
+ - temperature-sf-ny
+
+- name: labelsSeparateLines
+ tags:
+ - legend
+ - labels
+ - display
+ type: Boolean
+ default: false
+ desc: Put <br/> between lines in the label string. Often used in conjunction with
+ labelsDiv.
+ examples:
+ - century-scale
+ - customLabel
+ - demo
+ - reverse-y-axis
+
+- name: labelsShowZeroValues
+ tags:
+ - legend
+ - labels
+ - display
+ type: Boolean
+ default: true
+ desc: Show zero value labels in the labelsDiv.
+ examples:
+ - label-div
+
+- name: hideOverlayOnMouseOut
+ tags:
+ - interactivity
+ - labels
+ - legend
+ - display
+ type: Boolean
+ default: true
+ desc: Whether to hide the legend when the mouse leaves the chart area.
+ examples:
+ - gviz-selection
+
+- name: showLabelsOnHighlight
+ tags:
+ - legend
+ - interactivity
+ - labels
+ - display
+ type: Boolean
+ default: true
+ desc: Whether to show the legend upon mouseover.
+ examples:
+ - callback
+
+- name: labelsDiv
+ ignore: true
+ tags:
+ - legend
+ - labels
+ - display
+ type: DOM element or string
default: null