diff --git a/src/helpers/helpers.segment.js b/src/helpers/helpers.segment.js index 13063f019d3..215c73207ba 100644 --- a/src/helpers/helpers.segment.js +++ b/src/helpers/helpers.segment.js @@ -244,14 +244,15 @@ export function _computeSegments(line, segmentOptions) { const loop = !!line._loop; const {start, end} = findStartAndEnd(points, count, loop, spanGaps); + const baseStyle = readStyle(line.options); if (spanGaps === true) { - return splitByStyles([{start, end, loop}], points, segmentOptions); + return splitByStyles([{start, end, loop}], points, baseStyle, segmentOptions); } const max = end < start ? end + count : end; const completeLoop = !!line._fullLoop && start === 0 && end === count - 1; - return splitByStyles(solidSegments(points, start, max, completeLoop), points, segmentOptions); + return splitByStyles(solidSegments(points, start, max, completeLoop), points, baseStyle, segmentOptions); } /** @@ -260,11 +261,11 @@ export function _computeSegments(line, segmentOptions) { * @param {object} [segmentOptions] * @return {Segment[]} */ -function splitByStyles(segments, points, segmentOptions) { +function splitByStyles(segments, points, baseStyle, segmentOptions) { if (!segmentOptions || !segmentOptions.setContext || !points) { return segments; } - return doSplitByStyles(segments, points, segmentOptions); + return doSplitByStyles(segments, points, baseStyle, segmentOptions); } /** @@ -273,14 +274,15 @@ function splitByStyles(segments, points, segmentOptions) { * @param {object} [segmentOptions] * @return {Segment[]} */ -function doSplitByStyles(segments, points, segmentOptions) { +function doSplitByStyles(segments, points, baseStyle, segmentOptions) { const count = points.length; const result = []; let start = segments[0].start; let i = start; for (const segment of segments) { - let prevStyle, style; + let prevStyle = baseStyle; let prev = points[start % count]; + let style; for (i = start + 1; i <= segment.end; i++) { const pt = points[i % count]; style = readStyle(segmentOptions.setContext({type: 'segment', p0: prev, p1: pt})); diff --git a/test/fixtures/controller.line/segments/single.js b/test/fixtures/controller.line/segments/single.js new file mode 100644 index 00000000000..c825dd9ca6b --- /dev/null +++ b/test/fixtures/controller.line/segments/single.js @@ -0,0 +1,27 @@ +module.exports = { + config: { + type: 'line', + data: { + labels: ['a', 'b', 'c', 'd', 'e', 'f'], + datasets: [{ + data: [1, 2, 3, 3, 2, 1], + borderColor: 'black', + segment: { + borderColor: 'red', + } + }] + }, + options: { + scales: { + x: {display: false}, + y: {display: false} + } + } + }, + options: { + canvas: { + width: 256, + height: 256 + } + } +}; diff --git a/test/fixtures/controller.line/segments/single.png b/test/fixtures/controller.line/segments/single.png new file mode 100644 index 00000000000..e9c80ea2d27 Binary files /dev/null and b/test/fixtures/controller.line/segments/single.png differ