Class links.Graph
Defined in: graph.js.
Constructor Attributes | Constructor Name and Description |
---|---|
links.Graph(container)
|
Method Attributes | Method Name and Description |
---|---|
<static> |
links.Graph.addEventListener(element, action, listener, useCapture)
Add and event listener.
|
draw(data, options)
Main drawing logic.
|
|
Retrieve the current value range (range on the vertical axis)
|
|
Retrieve the current visible range in the Graph.
|
|
<static> |
links.Graph.isOutside(event, parent)
Check if an event took place outside a specified parent element.
|
onmousemove(event)
|
|
onmouseup(event)
|
|
onmouseupoutside(event)
|
|
ontouchend(event)
|
|
ontouchmove(event)
|
|
<static> |
links.Graph.preventDefault(event)
Cancels the event if it is cancelable, without stopping further propagation of the event.
|
<static> |
links.Graph.px(x)
Append suffix "px" to provided value x
|
redraw()
Redraw the Graph.
|
|
<static> |
links.Graph.removeEventListener(element, action, listener, useCapture)
Remove an event listener from an element
|
setAutoScale(enable)
Enable or disable autoscaling
|
|
setScale(scale, step)
Set a custom scale.
|
|
setSize(width, height)
Set a new size for the graph
|
|
setValueRange(start, end, redrawNow)
Set vertical value range
|
|
Adjust the vertical range to auto fit the contents
|
|
setVisibleChartRange(start, end, redrawNow)
Set a new value for the visible range int the Graph.
|
|
Adjust the visible chart range to fit the contents.
|
|
Adjust the visible range such that the current time is located in the center
of the graph
|
|
<static> |
links.Graph.stopPropagation(event)
Stop event propagation
|
timeToScreen(time)
Convert a datetime (Date object) into a position on the screen
Before this method can be used, the method calcConversionFactor must be
executed once.
|
|
trigger(event, params)
fire an event
|
|
Class Detail
links.Graph(container)
- Parameters:
- {Element} container
- The DOM element in which the Graph will be created. Normally a div element.
Method Detail
<static>
links.Graph.addEventListener(element, action, listener, useCapture)
Add and event listener. Works for all browsers
- Parameters:
- {Element} element
- An html element
- {string} action
- The action, for example "click", without the prefix "on"
- {function} listener
- The callback function to be executed
- {boolean} useCapture
draw(data, options)
Main drawing logic. This is the function that needs to be called
in the html page, to draw the Graph.
A data table with the events must be provided, and an options table.
Available options:
- width Width for the Graph in pixels or percentage.
- height Height for the Graph in pixels or percentage.
- start A Date object with the start date of the visible range
- end A Date object with the end date of the visible range
TODO: describe all options
All options are optional.
- Parameters:
- {google.visualization.DataTable | Array} data
- The data containing the events for the Graph. Object DataTable is defined in google.visualization.DataTable.
- {Object} options
- A name/value map containing settings for the Graph.
getValueRange()
Retrieve the current value range (range on the vertical axis)
{Object}
getVisibleChartRange()
Retrieve the current visible range in the Graph.
- Returns:
- {Object} An object with start and end properties
<static>
{boolean}
links.Graph.isOutside(event, parent)
Check if an event took place outside a specified parent element.
- Parameters:
- {Event} event
- A javascript (mouse) event object
- {Element} parent
- The DOM element to check if event was inside it
- Returns:
- {boolean}
onmousemove(event)
- Parameters:
- event
onmouseup(event)
- Parameters:
- event
onmouseupoutside(event)
- Parameters:
- event
ontouchend(event)
- Parameters:
- event
ontouchmove(event)
- Parameters:
- event
<static>
links.Graph.preventDefault(event)
Cancels the event if it is cancelable, without stopping further propagation of the event.
- Parameters:
- event
<static>
{string}
links.Graph.px(x)
Append suffix "px" to provided value x
- Parameters:
- {int} x
- An integer value
- Returns:
- {string} the string value of x, followed by the suffix "px"
redraw()
Redraw the Graph. This needs to be executed after the start and/or
end time are changed, or when data is added or removed dynamically.
<static>
links.Graph.removeEventListener(element, action, listener, useCapture)
Remove an event listener from an element
- Parameters:
- {Element} element
- An html dom element
- {string} action
- The name of the event, for example "mousedown"
- {function} listener
- The listener function
- {boolean} useCapture
screenToY()
setAutoScale(enable)
Enable or disable autoscaling
- Parameters:
- {boolean} enable
- If true or not defined, autoscaling is enabled. If false, autoscaling is disabled.
setScale(scale, step)
Set a custom scale. Autoscaling will be disabled.
For example setScale(SCALE.MINUTES, 5) will result
in minor steps of 5 minutes, and major steps of an hour.
- Parameters:
- {links.Graph.StepDate.SCALE} scale
- A scale. Choose from SCALE.MILLISECOND, SCALE.SECOND, SCALE.MINUTE, SCALE.HOUR, SCALE.DAY, SCALE.MONTH, SCALE.YEAR.
- {int} step
- A step size, by default 1. Choose for example 1, 2, 5, or 10.
setSize(width, height)
Set a new size for the graph
- Parameters:
- {string} width
- Width in pixels or percentage (for example "800px" or "50%")
- {string} height
- Height in pixels or percentage (for example "400px" or "30%")
setValueRange(start, end, redrawNow)
Set vertical value range
- Parameters:
- {Number} start
- Start of the range. If undefined, start will be set to match the minimum data value
- {Number} end
- End of the range. If undefined, end will be set to match the maximum data value
- {Boolean} redrawNow
- Optional. If true (default) the graph is redrawn after the range has been changed
setValueRangeAuto()
Adjust the vertical range to auto fit the contents
setVisibleChartRange(start, end, redrawNow)
Set a new value for the visible range int the Graph.
Set start to null to include everything from the earliest date to end.
Set end to null to include everything from start to the last date.
Example usage:
myGraph.setVisibleChartRange(new Date("2010-08-22"),
new Date("2010-09-13"));
- Parameters:
- {Date} start
- The start date for the graph
- {Date} end
- The end date for the graph
- {Boolean} redrawNow
- Optional. If true (default), the graph is automatically redrawn after the range is changed
setVisibleChartRangeAuto()
Adjust the visible chart range to fit the contents.
setVisibleChartRangeNow()
Adjust the visible range such that the current time is located in the center
of the graph
<static>
links.Graph.stopPropagation(event)
Stop event propagation
- Parameters:
- event
{int}
timeToScreen(time)
Convert a datetime (Date object) into a position on the screen
Before this method can be used, the method calcConversionFactor must be
executed once.
- Parameters:
- {Date} time
- A date
- Returns:
- {int} x The position on the screen in pixels which corresponds with the given date.
trigger(event, params)
fire an event
- Parameters:
- {String} event
- The name of an event, for example "rangechange" or "edit"
- {Object} params
- Optional parameters
yToScreen()