]> git.ipfire.org Git - thirdparty/Chart.js.git/commitdiff
Rename steppedLine to stepped (#7127)
authorJukka Kurkela <jukka.kurkela@gmail.com>
Wed, 19 Feb 2020 23:13:40 +0000 (01:13 +0200)
committerGitHub <noreply@github.com>
Wed, 19 Feb 2020 23:13:40 +0000 (18:13 -0500)
Rename steppedLine to stepped

12 files changed:
docs/charts/line.md
docs/configuration/elements.md
docs/general/performance.md
docs/getting-started/v3-migration.md
samples/charts/line/stepped.html
src/controllers/controller.line.js
src/elements/element.line.js
test/fixtures/element.line/stepped/after.js
test/fixtures/element.line/stepped/before.js
test/fixtures/element.line/stepped/default.js
test/fixtures/element.line/stepped/middle.js
test/fixtures/plugin.filler/fill-line-dataset-stepped.json

index 12b8838c642ae14c07f5a2804f9f303315f68652..75c53f01a122efd35d4b3ec6b6a9c659900a0e94 100644 (file)
@@ -78,7 +78,7 @@ The line chart allows a number of properties to be specified for each dataset. T
 | [`pointStyle`](#point-styling) | <code>string&#124;Image</code> | Yes | Yes | `'circle'`
 | [`showLine`](#line-styling) | `boolean` | - | - | `undefined`
 | [`spanGaps`](#line-styling) | <code>boolean&#124;number</code> | - | - | `undefined`
-| [`steppedLine`](#stepped-line) | <code>boolean&#124;string</code> | - | - | `false`
+| [`stepped`](#stepped) | <code>boolean&#124;string</code> | - | - | `false`
 | [`xAxisID`](#general) | `string` | - | - | first x axis
 | [`yAxisID`](#general) | `string` | - | - | first y axis
 
@@ -152,9 +152,9 @@ The `'monotone'` algorithm is more suited to `y = f(x)` datasets : it preserves
 
 If left untouched (`undefined`), the global `options.elements.line.cubicInterpolationMode` property is used.
 
-### Stepped Line
+### Stepped
 
-The following values are supported for `steppedLine`.
+The following values are supported for `stepped`.
 
 * `false`: No Step Interpolation (default)
 * `true`: Step-before Interpolation (eq. `'before'`)
@@ -162,7 +162,7 @@ The following values are supported for `steppedLine`.
 * `'after'`: Step-after Interpolation
 * `'middle'`: Step-middle Interpolation
 
-If the `steppedLine` value is set to anything other than false, `lineTension` will be ignored.
+If the `stepped` value is set to anything other than false, `lineTension` will be ignored.
 
 ## Configuration Options
 
index 8f0c0e7d814f84c0c9c2cb0c7e48cdc172d2430f..ff59e45f4067d67bafaf956dd2f49abff8c46c38 100644 (file)
@@ -11,6 +11,7 @@ Chart.defaults.elements.rectangle.borderWidth = 2;
 ```
 
 ## Point Configuration
+
 Point elements are used to represent the points in a line, radar or bubble chart.
 
 Global point options: `Chart.defaults.elements.point`.
@@ -30,6 +31,7 @@ Global point options: `Chart.defaults.elements.point`.
 ### Point Styles
 
 The following values are supported:
+
 - `'circle'`
 - `'cross'`
 - `'crossRot'`
@@ -44,6 +46,7 @@ The following values are supported:
 If the value is an image, that image is drawn on the canvas using [drawImage](https://developer.mozilla.org/en/docs/Web/API/CanvasRenderingContext2D/drawImage).
 
 ## Line Configuration
+
 Line elements are used to represent the line in a line chart.
 
 Global line options: `Chart.defaults.elements.line`.
@@ -64,6 +67,7 @@ Global line options: `Chart.defaults.elements.line`.
 | `stepped` | `boolean` | `false` | `true` to show the line as a stepped line (`tension` will be ignored).
 
 ## Rectangle Configuration
+
 Rectangle elements are used to represent the bars in a bar chart.
 
 Global rectangle options: `Chart.defaults.elements.rectangle`.
@@ -76,6 +80,7 @@ Global rectangle options: `Chart.defaults.elements.rectangle`.
 | `borderSkipped` | `string` | `'bottom'` | Skipped (excluded) border: `'bottom'`, `'left'`, `'top'` or `'right'`.
 
 ## Arc Configuration
+
 Arcs are used in the polar area, doughnut and pie charts.
 
 Global arc options: `Chart.defaults.elements.arc`.
index 5a43c6ac0d7b03fa722ba1805ce3462928bb41f3..0827bd09fa76fea7feff6472ad44c0a978a38f2b 100644 (file)
@@ -93,7 +93,7 @@ new Chart(ctx, {
 
 ### Automatic data decimation during draw
 
-Line element will automatically decimate data, when the following conditions are met: `tension` is `0`, `steppedLine` is `false` (default) and `borderDash` is `[]` (default).`
+Line element will automatically decimate data, when the following conditions are met: `tension` is `0`, `stepped` is `false` (default) and `borderDash` is `[]` (default).`
 This improves rendering speed by skipping drawing of invisible line segments.
 
 ```javascript
@@ -105,7 +105,7 @@ new Chart(ctx, {
             line: {
                 tension: 0, // disables bezier curves
                 fill: false,
-                steppedLine: false,
+                stepped: false,
                 borderDash: []
             }
         }
index 2a598d9fdb1203b72384bbaa8191e7ae1d7fec44..e6dd7ef424e0f8a813351eae7a2fd4965f050f0a 100644 (file)
@@ -72,6 +72,7 @@ Chart.js 3.0 introduces a number of breaking changes. Chart.js 2.0 was released
 * `scales.[x/y]Axes.time.format` was renamed to `scales[id].time.parser`
 * `scales.[x/y]Axes.time.max` was renamed to `scales[id].max`
 * `scales.[x/y]Axes.time.min` was renamed to `scales[id].min`
+* The dataset option `steppedLine` was removed. Use `stepped`
 * The dataset option `tension` was removed. Use `lineTension`
 * To override the platform class used in a chart instance, pass `platform: PlatformClass` in the config object. Note that the class should be passed, not an instance of the class.
 
index eec88eec3a44bfd2c6db3d837e4d2651b7b403bb..e6e27a159268ddd259c78ab3758df17926ffb22b 100644 (file)
@@ -36,8 +36,8 @@
                                data: {
                                        labels: ['Day 1', 'Day 2', 'Day 3', 'Day 4', 'Day 5', 'Day 6'],
                                        datasets: [{
-                                               label: 'steppedLine: ' + details.steppedLine,
-                                               steppedLine: details.steppedLine,
+                                               label: 'stepped: ' + details.stepped,
+                                               stepped: details.stepped,
                                                data: data,
                                                borderColor: details.color,
                                                fill: false,
                                randomScalingFactor()
                        ];
 
-                       var steppedLineSettings = [{
-                               steppedLine: false,
+                       var steppedSettings = [{
+                               stepped: false,
                                label: 'No Step Interpolation',
                                color: window.chartColors.red
                        }, {
-                               steppedLine: true,
+                               stepped: true,
                                label: 'Step Before Interpolation',
                                color: window.chartColors.green
                        }, {
-                               steppedLine: 'before',
+                               stepped: 'before',
                                label: 'Step Before Interpolation',
                                color: window.chartColors.green
                        }, {
-                               steppedLine: 'after',
+                               stepped: 'after',
                                label: 'Step After Interpolation',
                                color: window.chartColors.purple
                        }, {
-                               steppedLine: 'middle',
+                               stepped: 'middle',
                                label: 'Step Middle Interpolation',
                                color: window.chartColors.blue
                        }];
 
-                       steppedLineSettings.forEach(function(details) {
+                       steppedSettings.forEach(function(details) {
                                var div = document.createElement('div');
                                div.classList.add('chart-container');
 
index bd49f924e7de0cea61602455ef2e58c0b276a2e7..dc8ceadbad710865d97a39867c588b1c46b39f2c 100644 (file)
@@ -106,7 +106,7 @@ class LineController extends DatasetController {
                // This option gives lines the ability to span gaps
                values.spanGaps = valueOrDefault(config.spanGaps, options.spanGaps);
                values.tension = valueOrDefault(config.lineTension, lineOptions.tension);
-               values.steppedLine = resolve([config.steppedLine, lineOptions.stepped]);
+               values.stepped = resolve([config.stepped, lineOptions.stepped]);
 
                return values;
        }
index a5913cf3878ea4fb3a62026bb6a5e1f462628979..7836b3fa112bfac96b0ef4c947a253cf4e3aa420 100644 (file)
@@ -40,7 +40,7 @@ function lineTo(ctx, previous, target) {
 }
 
 function getLineMethod(options) {
-       if (options.steppedLine) {
+       if (options.stepped) {
                return _steppedLineTo;
        }
 
@@ -84,7 +84,7 @@ function pathSegment(ctx, line, segment, params) {
                        ctx.moveTo(point.x, point.y);
                        move = false;
                } else {
-                       lineMethod(ctx, prev, point, reverse, options.steppedLine);
+                       lineMethod(ctx, prev, point, reverse, options.stepped);
                }
 
                prev = point;
@@ -92,7 +92,7 @@ function pathSegment(ctx, line, segment, params) {
 
        if (loop) {
                point = points[(start + (reverse ? ilen : 0)) % count];
-               lineMethod(ctx, prev, point, reverse, options.steppedLine);
+               lineMethod(ctx, prev, point, reverse, options.stepped);
        }
 
        return !!loop;
@@ -177,7 +177,7 @@ function fastPathSegment(ctx, line, segment, params) {
 function _getSegmentMethod(line) {
        const opts = line.options;
        const borderDash = opts.borderDash && opts.borderDash.length;
-       const useFastPath = !line._loop && !opts.tension && !opts.steppedLine && !borderDash;
+       const useFastPath = !line._loop && !opts.tension && !opts.stepped && !borderDash;
        return useFastPath ? fastPathSegment : pathSegment;
 }
 
@@ -185,7 +185,7 @@ function _getSegmentMethod(line) {
  * @private
  */
 function _getInterpolationMethod(options) {
-       if (options.steppedLine) {
+       if (options.stepped) {
                return _steppedInterpolation;
        }
 
@@ -219,7 +219,7 @@ class Line extends Element {
                        return;
                }
                const options = me.options;
-               if (options.tension && !options.steppedLine) {
+               if (options.tension && !options.stepped) {
                        const loop = options.spanGaps ? me._loop : me._fullLoop;
                        _updateBezierControlPoints(me._points, options, chartArea, loop);
                }
@@ -289,7 +289,7 @@ class Line extends Element {
                                continue;
                        }
                        const t = Math.abs((value - p1[property]) / (p2[property] - p1[property]));
-                       const interpolated = _interpolate(p1, p2, t, options.steppedLine);
+                       const interpolated = _interpolate(p1, p2, t, options.stepped);
                        interpolated[property] = point[property];
                        result.push(interpolated);
                }
index b6fb116400fb043f95b314f3b09bf140895c411c..5bf19f80d0a6752d901df9662f4579c9027ef1cb 100644 (file)
@@ -8,7 +8,7 @@ module.exports = {
                                        borderColor: 'red',
                                        fill: false,
                                        lineTension: 0,
-                                       steppedLine: 'after'
+                                       stepped: 'after'
                                }
                        ]
                },
index 96066358cbd9cf0248681e59d9bf8b6641458352..f12f6a2466f8b5f9e50f05189f0f844ade7fecc9 100644 (file)
@@ -8,7 +8,7 @@ module.exports = {
                                        borderColor: 'red',
                                        fill: false,
                                        lineTension: 0,
-                                       steppedLine: 'before'
+                                       stepped: 'before'
                                }
                        ]
                },
index 67f4089654d6bf5cc5c587c2f76b5f4cde095bec..b2bfd3a5368b89f7441401a17596a640815014ec 100644 (file)
@@ -8,7 +8,7 @@ module.exports = {
                                        borderColor: 'red',
                                        fill: false,
                                        lineTension: 0,
-                                       steppedLine: true
+                                       stepped: true
                                }
                        ]
                },
index a039a27aeaa9a043520f0c3a9aee8ac9561e000e..bdcda092c9c7f770c35647000abd2b0abe0daeb4 100644 (file)
@@ -8,7 +8,7 @@ module.exports = {
                                        borderColor: 'red',
                                        fill: false,
                                        lineTension: 0,
-                                       steppedLine: 'middle'
+                                       stepped: 'middle'
                                }
                        ]
                },
index c6a681539e0558b22fef295477cb70e073dd8aad..9449046730530384c7d7c3e6557ddd8403f3d0e0 100644 (file)
@@ -5,27 +5,27 @@
             "labels": ["0", "1", "2", "3", "4", "5", "6", "7", "8"],
             "datasets": [{
                 "backgroundColor": "rgba(255, 0, 0, 0.25)",
-                "steppedLine": true,
+                "stepped": true,
                 "data": [null, null, 0, -1, 0, 1, 0, -1, 0],
                 "fill": 1
             }, {
                 "backgroundColor": "rgba(0, 255, 0, 0.25)",
-                "steppedLine": "after",
+                "stepped": "after",
                 "data": [1, 0, null, 1, 0, null, -1, 0, 1],
                 "fill": "+1"
             }, {
                 "backgroundColor": "rgba(0, 0, 255, 0.25)",
-                "steppedLine": "before",
+                "stepped": "before",
                 "data": [0, 2, 0, -2, 0, 2, 0],
                 "fill": 3
             }, {
                 "backgroundColor": "rgba(255, 0, 255, 0.25)",
-                "steppedLine": "middle",
+                "stepped": "middle",
                 "data": [2, 0, -2, 0, 2, 0, -2, 0, 2],
                 "fill": "-2"
             }, {
                 "backgroundColor": "rgba(255, 255, 0, 0.25)",
-                "steppedLine": false,
+                "stepped": false,
                 "data": [3, 1, -1, -3, -1, 1, 3, 1, -1],
                 "fill": "-1"
             }]