This is an automated email from the ASF dual-hosted git repository.
ovilia pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/echarts.git
The following commit(s) were added to refs/heads/master by this push:
new a57202d8e fix(clip): add extra clip to prevent unexpected clip on
certain scenario. close #19051
new fa231d37f Merge pull request #19056 from RexSkz/fix-19051
a57202d8e is described below
commit a57202d8e504cca20ba184477c6fae90e915c02a
Author: Rex Zeng <r...@rexskz.info>
AuthorDate: Fri Sep 15 15:11:26 2023 +0800
fix(clip): add extra clip to prevent unexpected clip on certain scenario.
close #19051
---
src/chart/helper/createClipPathFromCoordSys.ts | 10 ++-
test/clip-line-cap.html | 93 ++++++++++++++++++++++++++
2 files changed, 100 insertions(+), 3 deletions(-)
diff --git a/src/chart/helper/createClipPathFromCoordSys.ts
b/src/chart/helper/createClipPathFromCoordSys.ts
index 7bc83d7de..74ec7f8e9 100644
--- a/src/chart/helper/createClipPathFromCoordSys.ts
+++ b/src/chart/helper/createClipPathFromCoordSys.ts
@@ -51,8 +51,12 @@ function createGridClipPath(
height += lineWidth;
// fix: https://github.com/apache/incubator-echarts/issues/11369
- x = Math.floor(x);
- width = Math.round(width);
+ width = Math.ceil(width);
+ if (x !== Math.floor(x)) {
+ x = Math.floor(x);
+ // if no extra 1px on `width`, it will still be clipped since `x` is
floored
+ width++;
+ }
const clipPath = new graphic.Rect({
shape: {
@@ -165,4 +169,4 @@ export {
createGridClipPath,
createPolarClipPath,
createClipPath
-};
\ No newline at end of file
+};
diff --git a/test/clip-line-cap.html b/test/clip-line-cap.html
new file mode 100644
index 000000000..c444e3af5
--- /dev/null
+++ b/test/clip-line-cap.html
@@ -0,0 +1,93 @@
+<!DOCTYPE html>
+<!--
+Licensed to the Apache Software Foundation (ASF) under one
+or more contributor license agreements. See the NOTICE file
+distributed with this work for additional information
+regarding copyright ownership. The ASF licenses this file
+to you under the Apache License, Version 2.0 (the
+"License"); you may not use this file except in compliance
+with the License. You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing,
+software distributed under the License is distributed on an
+"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+KIND, either express or implied. See the License for the
+specific language governing permissions and limitations
+under the License.
+-->
+
+
+<html>
+ <head>
+ <meta charset="utf-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
+ <script src="lib/simpleRequire.js"></script>
+ <script src="lib/config.js"></script>
+ <script src="lib/jquery.min.js"></script>
+ <script src="lib/facePrint.js"></script>
+ <script src="lib/testHelper.js"></script>
+ <!-- <script src="ut/lib/canteen.js"></script> -->
+ <link rel="stylesheet" href="lib/reset.css" />
+ </head>
+ <body>
+ <style>
+ </style>
+
+
+
+ <div id="main0"></div>
+
+
+
+
+
+
+ <script>
+ require([
+ 'echarts',
+ ], function (echarts) {
+ var option;
+
+ option = {
+ grid: {
+ width: 503,
+ height: 400,
+ },
+ xAxis: {
+ type: 'category',
+ data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
+ boundaryGap: false,
+ },
+ yAxis: {
+ type: 'value'
+ },
+ series: [
+ {
+ data: [150, 230, 224, 218, 135, 147, 152],
+ type: 'line',
+ showSymbol: false,
+ lineStyle: {
+ width: 4,
+ cap: 'round',
+ },
+ },
+ ],
+ };
+
+ var chart = testHelper.create(echarts, 'main0', {
+ title: [
+ 'Should Not Clip The Rightmost Cap of The Line'
+ ],
+ option: option
+ // height: 300,
+ // buttons: [{text: 'btn-txt', onclick: function () {}}],
+ // recordCanvas: true,
+ });
+ });
+ </script>
+
+
+ </body>
+</html>
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscr...@echarts.apache.org
For additional commands, e-mail: commits-h...@echarts.apache.org
