UI Linear View Elements

Classes

Projection

class that calculates a pixel width based off of elapsed time

Block

React class that renders a block with a set position and width, one of the main visual elements of the ghant chart

LinearView

React class that renders the main veiw of the ghant chart Props:

MomentBackground

react class that renders header cells

MomentHeader

Params

Row

react class to render a ghant chart row

Projection

class that calculates a pixel width based off of elapsed time

Kind: global class

new Projection(pixelValue, startValue, stopValue)

Param	Type	Description
pixelValue	number	the base unit of time for one pixel
startValue	number	start of the block
stopValue	number	end of the block

Block

React class that renders a block with a set position and width, one of the main visual elements of the ghant chart

Kind: global class
Properties

Name	Type	Description
x1	number	starting x value of the element
x2	number	ending x value of the element
onRollover	function	rollover functionality
onClick	function	onClick functionality
data	any	added to the rollover and click function callbacks
className	string	class to be applied to the element
style	object	css properties to be applied to the element
children	node	children to be rendered in the element

LinearView

React class that renders the main veiw of the ghant chart Props:

Kind: global class
Properties

Name	Type	Description
rowClass	function \	string	return className for rowData
blockClass	function \	string	return className for block
rowAccess	function	return array of rows from data
onClick	function	callback when a block is clicked
onClick	function	callback when a block is clicked
startAccess	function	returns start value from a block
stopAccess	function	returns stop value from a block
hScroll	component	custom horizontal scrollbar component
vScroll	component	custom vertical scrollbar component
blockStylizer	function	function( item, project, startValue stopValue, x1, x2 ) and returns { className, style, children } options for the block. Good for dynamic styling
setScrollTop	function	function to be used to set the scrollTop value of the element

MomentBackground

react class that renders header cells

Kind: global class
Properties

Name	Type	Description
projection	projection	the projection used to create the header
unit	string	the unit used to calculate the group. 'day', 'month', etc
format	string	if present, moment.format( format ) will be used to create the label
dynamicClass	function	if present, this function will be invoked with dynamicClass( moment, width, left, right ) and should return a className to add to the cell.
className	string	the className to apply to the background
cellClassName	string	the className to apply to each cell

MomentHeader

Params

Kind: global class
Properties

Name	Type	Description
projection	projection	the projection used to create the header
unit	string	the unit used to calculate the group. 'day', 'month', etc
format	string	if present, moment.format( format ) will be used to create the label
value	string \	function	if this is a function, it will be invoked with value( moment, width, left, right ) and the function should return a string	component for the label. If value is a string, momentvalue will be invoked (ie 'date' will return the day of the month)
className	string	the className for the label
clip	boolean	if true, the positions of the header cell will be clipped to the projection time. This is useful for left or right aligning labels like month
className	string	the className to apply to the header
cellClassName	string	the className to apply to each cell

Row

react class to render a ghant chart row

Kind: global class
Properties

Name	Type	Description
onRollover	function	rollover functionality
onClick	function	onClick functionality
rowData	any	added to the rollover and click function callbacks
className	string	class to be applied to the element
style	object	css properties to be applied to the element
blockAccess	function	accessor to get block data from row data
startAccess	function	accessor to get the start time from the data
stopAccess	function	accessor to get the stop time from the data
blockStylizer	function	calculates the style for the block
blockClass	string	class to be applied to the blocks
projection	Projection	instance of the projection class