From: stockiNail Date: Sat, 1 Oct 2022 18:26:45 +0000 (+0200) Subject: Use the correct area to clip for dataset drawing when stacked scales are used (... X-Git-Tag: v4.0.0~11 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=c51d697d7f9df8dff3f785beece4753e1b87cb97;p=thirdparty%2FChart.js.git Use the correct area to clip for dataset drawing when stacked scales are used (#10691) * Use the correct area to clip when stacked scales are used * adds test cases * fix CI issue * apply review * Update .size-limit.cjs Co-authored-by: Jacco van den Berg Co-authored-by: Jacco van den Berg --- diff --git a/.size-limit.cjs b/.size-limit.cjs index 175477082..f4606e0b7 100644 --- a/.size-limit.cjs +++ b/.size-limit.cjs @@ -7,7 +7,7 @@ function modifyWebpackConfig(config) { module.exports = [ { path: 'dist/chart.js', - limit: '77.2 KB', + limit: '77.5 KB', webpack: false, running: false }, diff --git a/src/core/core.controller.js b/src/core/core.controller.js index 396193a17..9991263b7 100644 --- a/src/core/core.controller.js +++ b/src/core/core.controller.js @@ -101,6 +101,18 @@ function determineLastEvent(e, lastEvent, inChartArea, isClick) { return e; } +function getDatasetArea(meta) { + const {xScale, yScale} = meta; + if (xScale && yScale) { + return { + left: xScale.left, + right: xScale.right, + top: yScale.top, + bottom: yScale.bottom + }; + } +} + class Chart { static defaults = defaults; @@ -784,7 +796,7 @@ class Chart { const ctx = this.ctx; const clip = meta._clip; const useClip = !clip.disabled; - const area = this.chartArea; + const area = getDatasetArea(meta) || this.chartArea; const args = { meta, index: meta.index, diff --git a/test/fixtures/core.layouts/stacked-boxes-max-index.js b/test/fixtures/core.layouts/stacked-boxes-max-index.js new file mode 100644 index 000000000..60fd5f45a --- /dev/null +++ b/test/fixtures/core.layouts/stacked-boxes-max-index.js @@ -0,0 +1,109 @@ +module.exports = { + config: { + type: 'line', + data: { + datasets: [ + {data: [{x: 5, y: 1}, {x: 10, y: 2}, {x: 5, y: 3}], borderColor: 'red'}, + {data: [{x: 5, y: 1}, {x: 10, y: 2}, {x: 5, y: 3}], yAxisID: 'y1', xAxisID: 'x1', borderColor: 'green'}, + {data: [{x: 5, y: 1}, {x: 10, y: 2}, {x: 5, y: 3}], yAxisID: 'y2', xAxisID: 'x2', borderColor: 'blue'}, + ], + labels: ['tick1', 'tick2', 'tick3'] + }, + options: { + plugins: false, + scales: { + x: { + type: 'linear', + position: 'bottom', + stack: '1', + offset: true, + bounds: 'data', + border: { + color: 'red' + }, + ticks: { + autoSkip: false, + maxRotation: 0, + count: 3 + }, + max: 7 + }, + x1: { + type: 'linear', + position: 'bottom', + stack: '1', + offset: true, + bounds: 'data', + border: { + color: 'green' + }, + ticks: { + autoSkip: false, + maxRotation: 0, + count: 3 + }, + max: 7 + }, + x2: { + type: 'linear', + position: 'bottom', + stack: '1', + offset: true, + bounds: 'data', + border: { + color: 'blue' + }, + ticks: { + autoSkip: false, + maxRotation: 0, + count: 3 + }, + max: 7 + }, + y: { + type: 'linear', + position: 'left', + stack: '1', + offset: true, + border: { + color: 'red' + }, + ticks: { + precision: 0 + } + }, + y1: { + type: 'linear', + position: 'left', + stack: '1', + offset: true, + border: { + color: 'green' + }, + ticks: { + precision: 0 + } + }, + y2: { + type: 'linear', + position: 'left', + stack: '1', + offset: true, + border: { + color: 'blue', + }, + ticks: { + precision: 0 + } + } + } + } + }, + options: { + spriteText: true, + canvas: { + height: 384, + width: 384 + } + } +}; diff --git a/test/fixtures/core.layouts/stacked-boxes-max-index.png b/test/fixtures/core.layouts/stacked-boxes-max-index.png new file mode 100644 index 000000000..60c829a47 Binary files /dev/null and b/test/fixtures/core.layouts/stacked-boxes-max-index.png differ diff --git a/test/fixtures/core.layouts/stacked-boxes-max.js b/test/fixtures/core.layouts/stacked-boxes-max.js new file mode 100644 index 000000000..43fd9d3b3 --- /dev/null +++ b/test/fixtures/core.layouts/stacked-boxes-max.js @@ -0,0 +1,109 @@ +module.exports = { + config: { + type: 'line', + data: { + datasets: [ + {data: [{x: 1, y: 5}, {x: 2, y: 10}, {x: 3, y: 5}], borderColor: 'red'}, + {data: [{x: 1, y: 5}, {x: 2, y: 10}, {x: 3, y: 5}], yAxisID: 'y1', xAxisID: 'x1', borderColor: 'green'}, + {data: [{x: 1, y: 5}, {x: 2, y: 10}, {x: 3, y: 5}], yAxisID: 'y2', xAxisID: 'x2', borderColor: 'blue'}, + ], + labels: ['tick1', 'tick2', 'tick3'] + }, + options: { + plugins: false, + scales: { + x: { + type: 'linear', + position: 'bottom', + stack: '1', + offset: true, + bounds: 'data', + border: { + color: 'red' + }, + ticks: { + autoSkip: false, + maxRotation: 0, + count: 3 + } + }, + x1: { + type: 'linear', + position: 'bottom', + stack: '1', + offset: true, + bounds: 'data', + border: { + color: 'green' + }, + ticks: { + autoSkip: false, + maxRotation: 0, + count: 3 + } + }, + x2: { + type: 'linear', + position: 'bottom', + stack: '1', + offset: true, + bounds: 'data', + border: { + color: 'blue' + }, + ticks: { + autoSkip: false, + maxRotation: 0, + count: 3 + } + }, + y: { + type: 'linear', + position: 'left', + stack: '1', + offset: true, + border: { + color: 'red' + }, + ticks: { + precision: 0 + }, + max: 7 + }, + y1: { + type: 'linear', + position: 'left', + stack: '1', + offset: true, + border: { + color: 'green' + }, + ticks: { + precision: 0 + }, + max: 7 + }, + y2: { + type: 'linear', + position: 'left', + stack: '1', + offset: true, + border: { + color: 'blue', + }, + ticks: { + precision: 0 + }, + max: 7 + } + } + } + }, + options: { + spriteText: true, + canvas: { + height: 384, + width: 384 + } + } +}; diff --git a/test/fixtures/core.layouts/stacked-boxes-max.png b/test/fixtures/core.layouts/stacked-boxes-max.png new file mode 100644 index 000000000..b136ab01c Binary files /dev/null and b/test/fixtures/core.layouts/stacked-boxes-max.png differ