1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
|
# Real-time stacked area chart implementation.
class Epoch.Time.Area extends Epoch.Time.Stack
constructor: (@options={}) ->
@options.type ?= 'time.area'
super(@options)
@draw()
# Sets the appropriate styles to the graphics context given a particular layer.
# @param [Object] layer Layer for which to set the styles.
setStyles: (layer) ->
if layer? && layer.className?
styles = @getStyles "g.#{layer.className.replace(/\s/g,'.')} path.area"
else
styles = @getStyles "g path.area"
@ctx.fillStyle = styles.fill
if styles.stroke?
@ctx.strokeStyle = styles.stroke
if styles['stroke-width']?
@ctx.lineWidth = styles['stroke-width'].replace('px', '')
# Draws areas for the chart
_drawAreas: (delta=0) ->
[y, w, layers] = [@y(), @w(), @getVisibleLayers()]
for i in [layers.length-1..0]
continue unless (layer = layers[i])
@setStyles layer
@ctx.beginPath()
[j, k, trans] = [@options.windowSize, layer.values.length, @inTransition()]
firstX = null
while (--j >= -2) and (--k >= 0)
entry = layer.values[k]
args = [(j+1)*w+delta, y(entry.y + entry.y0)]
args[0] += w if trans
if i == @options.windowSize - 1
@ctx.moveTo.apply @ctx, args
else
@ctx.lineTo.apply @ctx, args
if trans
borderX = (j+3)*w+delta
else
borderX = (j+2)*w+delta
@ctx.lineTo(borderX, @innerHeight())
@ctx.lineTo(@width*@pixelRatio+w+delta, @innerHeight())
@ctx.closePath()
@ctx.fill()
# Draws strokes for the chart
_drawStrokes: (delta=0) ->
[y, w, layers] = [@y(), @w(), @getVisibleLayers()]
for i in [layers.length-1..0]
continue unless (layer = layers[i])
@setStyles layer
@ctx.beginPath()
[i, k, trans] = [@options.windowSize, layer.values.length, @inTransition()]
firstX = null
while (--i >= -2) and (--k >= 0)
entry = layer.values[k]
args = [(i+1)*w+delta, y(entry.y + entry.y0)]
args[0] += w if trans
if i == @options.windowSize - 1
@ctx.moveTo.apply @ctx, args
else
@ctx.lineTo.apply @ctx, args
@ctx.stroke()
# Draws the area chart.
draw: (delta=0) ->
@clear()
@_drawAreas(delta)
@_drawStrokes(delta)
super()
|
