forked from chartjs/Chart.js
/
element.line.js
112 lines (94 loc) · 2.96 KB
/
element.line.js
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
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
'use strict';
var defaults = require('../core/core.defaults');
var Element = require('../core/core.element');
var helpers = require('../helpers/index');
var valueOrDefault = helpers.valueOrDefault;
var defaultColor = defaults.global.defaultColor;
defaults._set('global', {
elements: {
line: {
tension: 0.4,
backgroundColor: defaultColor,
borderWidth: 3,
borderColor: defaultColor,
borderCapStyle: 'butt',
borderDash: [],
borderDashOffset: 0.0,
borderJoinStyle: 'miter',
capBezierPoints: true,
fill: true, // do we fill in the area between the line and its base axis
}
}
});
module.exports = Element.extend({
_type: 'line',
draw: function() {
var me = this;
var vm = me._view;
var ctx = me._chart.ctx;
var spanGaps = vm.spanGaps;
var points = me._children.slice(); // clone array
var globalDefaults = defaults.global;
var globalOptionLineElements = globalDefaults.elements.line;
var lastDrawnIndex = -1;
var closePath = me._loop;
var index, previous, currentVM;
if (!points.length) {
return;
}
if (me._loop) {
for (index = 0; index < points.length; ++index) {
previous = helpers.previousItem(points, index);
// If the line has an open path, shift the point array
if (!points[index]._view.skip && previous._view.skip) {
points = points.slice(index).concat(points.slice(0, index));
closePath = spanGaps;
break;
}
}
// If the line has a close path, add the first point again
if (closePath) {
points.push(points[0]);
}
}
ctx.save();
// Stroke Line Options
ctx.lineCap = vm.borderCapStyle || globalOptionLineElements.borderCapStyle;
// IE 9 and 10 do not support line dash
if (ctx.setLineDash) {
ctx.setLineDash(vm.borderDash || globalOptionLineElements.borderDash);
}
ctx.lineDashOffset = valueOrDefault(vm.borderDashOffset, globalOptionLineElements.borderDashOffset);
ctx.lineJoin = vm.borderJoinStyle || globalOptionLineElements.borderJoinStyle;
ctx.lineWidth = valueOrDefault(vm.borderWidth, globalOptionLineElements.borderWidth);
ctx.strokeStyle = vm.borderColor || globalDefaults.defaultColor;
// Stroke Line
ctx.beginPath();
lastDrawnIndex = -1;
// First point moves to it's starting position no matter what
currentVM = points[0]._view;
if (!currentVM.skip) {
ctx.moveTo(currentVM.x, currentVM.y);
lastDrawnIndex = 0;
}
for (index = 1; index < points.length; ++index) {
currentVM = points[index]._view;
previous = lastDrawnIndex === -1 ? helpers.previousItem(points, index) : points[lastDrawnIndex];
if (!currentVM.skip) {
if ((lastDrawnIndex !== (index - 1) && !spanGaps) || lastDrawnIndex === -1) {
// There was a gap and this is the first point after the gap
ctx.moveTo(currentVM.x, currentVM.y);
} else {
// Line to next point
helpers.canvas.lineTo(ctx, previous._view, currentVM);
}
lastDrawnIndex = index;
}
}
if (closePath) {
ctx.closePath();
}
ctx.stroke();
ctx.restore();
}
});