components.nf-y-diff Class
Draws a box underneath (or over) the y axis to between the given a and b
domain values. Component content is used to template a label in that box.
Tips
- Should be outside of
nf-graph-content. - Should be "above"
nf-y-axisin the markup. - As a convenience,
<text>elements will automatically be positioned based on y-axis orientation due to default styling.
Item Index
Methods
_trackedDataChanged
()
private
Observes changes to tracked data and sends the didTrack action.
adjustWidth
()
Schedules a call to doAdjustWidth on afterRender
didInsertElement
()
Sets up the d3 related elements when component is inserted into the DOM
doAdjustWidth
()
Updates to d3 managed DOM elments that do not require transitioning, because they're width-related.
doTransition
()
Performs the transition (animation) of the elements.
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()
transition
()
Schedules a transition once at afterRender.
Properties
a
Number
The starting domain value of the difference measurement. The subrahend of the difference calculation.
Default: null
b
Number
The ending domain value of the difference measurement. The minuend of the difference calculation.
Default: null
contentPadding
Number
The amount of padding, in pixels, between the edge of the difference "box" and the content container
Default: 5
contentTransform
String
private
The SVG transformation used to position the content container.
contentX
Number
The x pixel coordinate of the content container.
didTrack
String
The action to send on didTrack.
Default: null
diff
Number
The calculated difference between a and b.
duration
Number
The duration of the transition, in milliseconds, as the difference slides vertically
Default: 400
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
isOrientRight
Boolean
Returns true if the graph's y-axis component is configured to orient right.
isPositive
Boolean
Returns true if diff is a positive number
parentController
Ember.Controller
private
The view controller for the view this component is present in
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
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'
transform
String
private
The SVG transformation of the component.
width
Number
The width of the difference box
xScale
d3.scale
The x scale used by this component
yA
Number
The y pixel value of a.
yB
Number
The y pixel value of b.
yCenter
Number
The calculated vertical center of the difference box, in pixels.
yScale
d3.scale
The y scale used by this component