X-Git-Url: https://adrianiainlam.tk/git/?a=blobdiff_plain;ds=sidebyside;f=dygraph-options-reference.js;h=3fdd4eaf3cce59d2a9838e8f05e73518995b49e4;hb=41273327c7eb2aaa777194f48516e69784aef7f1;hp=7f16cf273c558f8af11531b95377a561a6ec6a25;hpb=b5bdd85b1a969707aa52a0253712fdab7f2108ce;p=dygraphs.git diff --git a/dygraph-options-reference.js b/dygraph-options-reference.js index 7f16cf2..3fdd4ea 100644 --- a/dygraph-options-reference.js +++ b/dygraph-options-reference.js @@ -35,13 +35,34 @@ Dygraph.OPTIONS_REFERENCE = // "default": "null", "labels": ["Legend"], "type": "{}", - "description": "Additional styles to apply to the currently-highlighted points div. For example, { 'font-weight': 'bold' } will make the labels bold." + "description": "Additional styles to apply to the currently-highlighted points div. For example, { 'fontWeight': 'bold' } will make the labels bold. In general, it is better to use CSS to style the .dygraph-legend class than to use this property." }, "drawPoints": { "default": "false", "labels": ["Data Line display"], "type": "boolean", - "description": "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." + "description": "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. The small dot can be replaced with a custom rendering by supplying a drawPointCallback." + }, + "drawGapPoints": { + "default": "false", + "labels": ["Data Line display"], + "type": "boolean", + "description": "Draw points at the edges of gaps in the data. This improves visibility of small data segments or other data irregularities." + }, + "drawPointCallback": { + "default": "null", + "labels": ["Data Line display"], + "type": "function(g, seriesName, canvasContext, cx, cy, color, pointSize)", + "parameters": [ + [ "g" , "the reference graph" ], + [ "seriesName" , "the name of the series" ], + [ "canvasContext" , "the canvas to draw on" ], + [ "cx" , "center x coordinate" ], + [ "cy" , "center y coordinate" ], + [ "color" , "series color" ], + [ "pointSize" , "the radius of the image." ] + ], + "description": "Draw a custom item when drawPoints is enabled. Default is a small dot matching the series color. This method should constrain drawing to within pointSize pixels from (cx, cy). Also see drawHighlightPointCallback" }, "height": { "default": "320", @@ -87,15 +108,43 @@ Dygraph.OPTIONS_REFERENCE = // "highlightCallback": { "default": "null", "labels": ["Callbacks"], - "type": "function(event, x, points, row)", + "type": "function(event, x, points, row, seriesName)", "description": "When set, this callback gets called every time a new point is highlighted.", "parameters": [ ["event", "the JavaScript mousemove event"], ["x", "the x-coordinate of the highlighted points"], ["points", "an array of highlighted points: [ {name: 'series', yval: y-value}, … ]"], - ["row", "???"] + ["row", "integer index of the highlighted row in the data table, starting from 0"], + ["seriesName", "name of the highlighted series, only present if highlightSeriesOpts is set."] ] }, + "drawHighlightPointCallback": { + "default": "null", + "labels": ["Data Line display"], + "type": "function(g, seriesName, canvasContext, cx, cy, color, pointSize)", + "parameters": [ + [ "g" , "the reference graph" ], + [ "seriesName" , "the name of the series" ], + [ "canvasContext" , "the canvas to draw on" ], + [ "cx" , "center x coordinate" ], + [ "cy" , "center y coordinate" ], + [ "color" , "series color" ], + [ "pointSize" , "the radius of the image." ] + ], + "description": "Draw a custom item when a point is highlighted. Default is a small dot matching the series color. This method should constrain drawing to within pointSize pixels from (cx, cy) Also see drawPointCallback" + }, + "highlightSeriesOpts": { + "default": "null", + "labels": ["Interactive Elements"], + "type": "Object", + "description": "When set, the options from this object are applied to the timeseries closest to the mouse pointer for interactive highlighting. See also 'highlightCallback'. Example: highlightSeriesOpts: { strokeWidth: 3 }." + }, + "highlightSeriesBackgroundAlpha": { + "default": "0.5", + "labels": ["Interactive Elements"], + "type": "float", + "description": "Fade the background while highlighting series. 1=fully visible background (disable fading), 0=hiddden background (show highlighted series only)." + }, "includeZero": { "default": "false", "labels": ["Axis display"], @@ -312,7 +361,7 @@ Dygraph.OPTIONS_REFERENCE = // "strokeWidth": { "default": "1.0", "labels": ["Data Line display"], - "type": "integer", + "type": "float", "example": "0.5, 2.0", "description": "The width of the lines connecting data points. This can be used to increase the contrast or some graphs." }, @@ -321,7 +370,21 @@ Dygraph.OPTIONS_REFERENCE = // "labels": ["Data Line display"], "type": "array", "example": "[10, 2, 5, 2]", - "description": "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." + "description": "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. This is used to create dashed lines." + }, + "strokeBorderWidth": { + "default": "null", + "labels": ["Data Line display"], + "type": "float", + "example": "1.0", + "description": "Draw a border around graph lines to make crossing lines more easily distinguishable. Useful for graphs with many lines." + }, + "strokeBorderColor": { + "default": "white", + "labels": ["Data Line display"], + "type": "string", + "example": "red, #ccffdd", + "description": "Color for the line border used if strokeBorderWidth is set." }, "wilsonInterval": { "default": "true",