components.nf-svg-rect Class
A rectangle that plots using domain values from the graph. Uses an SVGPathElement to plot the rectangle, to allow for rectangles with "negative" heights.
Item Index
Properties
Methods
_trackedDataChanged
()
private
Observes changes to tracked data and sends the didTrack action.
_updateGraphSelected
()
private
Makes calls to the parent nf-graph to update it's
selected property. Observes changes to selected and also
fires on didInsertElement.
click
()
Click event handler. Toggles selected if selectable.
init
()
Initalization method that gets the nf-graph parent
and assigns it to graph
NOTE: all object that mixin and have init, must call super.init()
Properties
d
String
The SVG path data for the rectangle
didTrack
String
The action to send on didTrack.
Default: null
height
Number
The height as a domain value. If the yScale is ordinal,
this value is the indice offset to which to draw the rectangle.
For example, if the height is 3 then draw the rectangle
to two ordinals passed whatever y is set to.
Default: 0
hoverData
Object an object with the following values:
- point: an x, y pair for the exact px coordinates inside the graph-content
- graphX: domain x value at mouse position
- graphY: domain y value at mouse position
- x: nearest x data value
- y: nearest y data value
- data: nearest raw data
- renderX: domain x value to render a tracking dot at (stacked areas are offset)
- renderY: domain x value to render a tracking dot at (stacked areas are offset)
- mouseX: mouse x position in pixels
- mouseY: mouse y position in pixels
The value of the data that is being tracked by the component, ONLY if the graph-content is currently being hovered.
Default: null
isSelected
Unknown
deprecated
Alias of selected
scaleOffsetX
Number
The offset, in pixels, for the x scale
Default: 0
scaleOffsetY
Number
The offset, in pixels, for the y scale
Default: 0
scaleZoomX
Number
The zoom multiplier for the x scale
Default: 1
scaleZoomY
Number
The zoom multiplier for the y scale
Default: 1
selectable
Boolean
Gets or sets whether or not the graphic is "selectable". Meaning can be "selected" on the nf-graph via some action (usually click). The component will then show up in the nf-graph parent's selected property.
Default: false
selected
Boolean
Gets or sets whether or not the graphic is selected.
Default: false
showTrackingDot
Boolean
Gets or sets whether the tracking dot should be shown at all.
Default: true
trackedData
Object an object with the following values:
- point: an x, y pair for the exact px coordinates inside the graph-content
- graphX: domain x value at mouse position
- graphY: domain y value at mouse position
- x: nearest x data value
- y: nearest y data value
- data: nearest raw data
- renderX: domain x value to render a tracking dot at (stacked areas are offset)
- renderY: domain x value to render a tracking dot at (stacked areas are offset)
- mouseX: mouse x position in pixels
- mouseY: mouse y position in pixels
The value of the data that is being tracked by the component.
Default: null
trackingDotRadius
Number
The radius of the tracking dot in pixels
Default: 2.5
trackingMode
String
Gets or sets the tracking mode of the component.
Possible values are:
- 'none': no tracking behavior
- 'hover': only track while mouse hover
- 'snap-last': track while mouse hover, but snap to the last data element when not hovering
- 'snap-first': track while mouse hover, but snap to the first data element when not hovering
- 'selected-hover': The same as
'hover'tracking mode, but only when the compononent is selected - 'selected-snap-last': The same as
'snap-last'tracking mode, but only when the compononent is selected - 'selected-snap-first': The same as
'snap-first'tracking mode, but only when the compononent is selected
Default: 'none'
width
Number
The width as a domain value. If xScale is ordinal,
then this value is the indice offset to which to draw the
rectangle. In other words, if it's 2, then draw the rectangle
to two ordinals past whatever x is set to.
Default: 0
x
Unknown
The domain x value to place the rect at.
Default: null
x0
Number
The x value of the top right corner of the rectangle
x1
Number
The x value of the bottom right corner of the rectangle.
xScale
d3.scale
The x scale used by this component
y
Unknown
The domain y value to place the rect at.
Default: null
y0
Number
The y value of the top right corner of the rectangle.
y1
Number
The y value of the bottom right corner of the rectangle
yScale
d3.scale
The y scale used by this component