'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(); // 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(); } });