mirror of
https://github.com/morrisjs/morris.js.git
synced 2024-11-14 07:41:11 +01:00
feature:sticky hover
This commit is contained in:
parent
a738317adb
commit
af0473fef1
1 changed files with 36 additions and 12 deletions
|
@ -129,25 +129,25 @@ class Morris.Bar extends Morris.Grid
|
||||||
|
|
||||||
# hit test - returns the index of the row at the given x-coordinate
|
# hit test - returns the index of the row at the given x-coordinate
|
||||||
#
|
#
|
||||||
hitTest: (x) ->
|
hitTest: (x, y) ->
|
||||||
return null if @data.length == 0
|
return null if @data?.length is 0 or x <= @left or x > @left + @width
|
||||||
x = Math.max(Math.min(x, @right), @left)
|
x = Math.max(Math.min(x, @right - @options.padding), @left + @options.padding)
|
||||||
Math.min(@data.length - 1,
|
Math.min(@data.length - 1, Math.floor((x - @left) / (@width / @data.length)))
|
||||||
Math.floor((x - @left) / (@width / @data.length)))
|
|
||||||
|
|
||||||
# click on grid event handler
|
# click on grid event handler
|
||||||
#
|
#
|
||||||
# @private
|
# @private
|
||||||
onGridClick: (x, y) =>
|
onGridClick: (x, y) =>
|
||||||
index = @hitTest(x)
|
if (index = @hitTest(x, y))?
|
||||||
@fire 'click', index, @options.data[index], x, y
|
@fire 'click', index, @options.data[index], x, y
|
||||||
|
|
||||||
# hover movement event handler
|
# hover movement event handler
|
||||||
#
|
#
|
||||||
# @private
|
# @private
|
||||||
onHoverMove: (x, y) =>
|
onHoverMove: (x, y) =>
|
||||||
index = @hitTest(x)
|
if (index = @hitTest(x, y))?
|
||||||
@hover.update(@hoverContentForRow(index)...)
|
console.log('index=',index)
|
||||||
|
@hover.update(@hoverContentForRow(index, x, y)...)
|
||||||
|
|
||||||
# hover out event handler
|
# hover out event handler
|
||||||
#
|
#
|
||||||
|
@ -159,7 +159,8 @@ class Morris.Bar extends Morris.Grid
|
||||||
# hover content for a point
|
# hover content for a point
|
||||||
#
|
#
|
||||||
# @private
|
# @private
|
||||||
hoverContentForRow: (index) ->
|
hoverContentForRow: (index, eventX, eventY) ->
|
||||||
|
res = []
|
||||||
row = @data[index]
|
row = @data[index]
|
||||||
content = "<div class='morris-hover-row-label'>#{row.label}</div>"
|
content = "<div class='morris-hover-row-label'>#{row.label}</div>"
|
||||||
for y, j in row.y
|
for y, j in row.y
|
||||||
|
@ -171,8 +172,31 @@ class Morris.Bar extends Morris.Grid
|
||||||
"""
|
"""
|
||||||
if typeof @options.hoverCallback is 'function'
|
if typeof @options.hoverCallback is 'function'
|
||||||
content = @options.hoverCallback(index, @options, content)
|
content = @options.hoverCallback(index, @options, content)
|
||||||
x = @left + (index + 0.5) * @width / @data.length
|
res.push content
|
||||||
[content, x]
|
switch @options.stickyHover
|
||||||
|
when 'pointer'
|
||||||
|
res.push [eventX + 30, eventY + 60]...
|
||||||
|
when 'bar'
|
||||||
|
# TODO: remove addressing @data directyl
|
||||||
|
padding = @width / @data.length * (1 - @options.barSizeRatio) / 2
|
||||||
|
left = @left + index * @width / @data.length
|
||||||
|
right = left + @width / @data.length
|
||||||
|
top = @data[index]._y[0]
|
||||||
|
bottom = @bottom
|
||||||
|
res.push [@normalize(eventX, left + padding, right - padding),@normalize(eventY, top, bottom)]...
|
||||||
|
when 'corner'
|
||||||
|
res.push [@right, 0]...
|
||||||
|
else
|
||||||
|
x = @left + (index + 0.5) * @width / @data.length
|
||||||
|
res.push x
|
||||||
|
res
|
||||||
|
|
||||||
|
normalize: (value, min, max) ->
|
||||||
|
res = if min < value < max
|
||||||
|
value
|
||||||
|
else
|
||||||
|
if value > max then max else min
|
||||||
|
res
|
||||||
|
|
||||||
drawXAxisLabel: (xPos, yPos, text) ->
|
drawXAxisLabel: (xPos, yPos, text) ->
|
||||||
label = @raphael.text(xPos, yPos, text)
|
label = @raphael.text(xPos, yPos, text)
|
||||||
|
|
Loading…
Reference in a new issue