You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by ov...@apache.org on 2021/08/25 03:02:19 UTC
[echarts] branch fix-line-animation created (now cffa380)
This is an automated email from the ASF dual-hosted git repository.
ovilia pushed a change to branch fix-line-animation
in repository https://gitbox.apache.org/repos/asf/echarts.git.
at cffa380 fix(line): fix line chart animation #15581
This branch includes the following new commits:
new cffa380 fix(line): fix line chart animation #15581
The 1 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails. The revisions
listed as "add" were already present in the repository and have only
been added to this reference.
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[echarts] 01/01: fix(line): fix line chart animation #15581
Posted by ov...@apache.org.
This is an automated email from the ASF dual-hosted git repository.
ovilia pushed a commit to branch fix-line-animation
in repository https://gitbox.apache.org/repos/asf/echarts.git
commit cffa3806a4392259a62fdb915d5b91bc71695377
Author: Ovilia <zw...@gmail.com>
AuthorDate: Wed Aug 25 11:01:20 2021 +0800
fix(line): fix line chart animation #15581
---
src/chart/line/LineView.ts | 15 ++++++++++++---
test/line-animation.html | 38 ++++++++++++++++++++++++++++++++++++++
2 files changed, 50 insertions(+), 3 deletions(-)
diff --git a/src/chart/line/LineView.ts b/src/chart/line/LineView.ts
index 9cabed1..6103b32 100644
--- a/src/chart/line/LineView.ts
+++ b/src/chart/line/LineView.ts
@@ -691,9 +691,18 @@ class LineView extends ChartView {
}
// Update clipPath
- lineGroup.setClipPath(
- createLineClipPath(this, coordSys, false, seriesModel)
- );
+ const oldClipPath = lineGroup.getClipPath();
+ if (oldClipPath) {
+ const newClipPath = createLineClipPath(this, coordSys, false, seriesModel);
+ graphic.initProps(oldClipPath, {
+ shape: newClipPath.shape
+ }, seriesModel);
+ }
+ else {
+ lineGroup.setClipPath(
+ createLineClipPath(this, coordSys, true, seriesModel)
+ );
+ }
// Always update, or it is wrong in the case turning on legend
// because points are not changed
diff --git a/test/line-animation.html b/test/line-animation.html
index 011fd69..853e3b8 100644
--- a/test/line-animation.html
+++ b/test/line-animation.html
@@ -49,6 +49,8 @@ under the License.
}
</style>
+ <div class="chart" id="main3"></div>
+
<button onclick="change()">CHANGE</button>
<div class="chart" id="main2"></div>
@@ -400,6 +402,42 @@ under the License.
</script>
+ <script>
+
+ require([
+ 'echarts'
+ ], function (echarts) {
+ var chart = echarts.init(document.getElementById('main3'), null, {
+ renderer: 'svg'
+ });
+ option = {
+ xAxis: {
+ type: 'category',
+ boundaryGap: false,
+ data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
+ },
+ yAxis: {
+ type: 'value'
+ },
+ series: [{
+ data: [820, 932, 901, 934, 1290, 1330, 1320],
+ type: 'line',
+ areaStyle: {}
+ }],
+ animationDuration: 5000,
+ animationDurationUpdate: 5000
+ };
+
+ chart.setOption(option);
+
+ setTimeout(function() {
+ chart.setOption(option);
+ }, 1000);
+
+ });
+
+ </script>
+
</body>
</html>
\ No newline at end of file
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org