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/10/21 02:13:49 UTC
[echarts] branch fix-bar-race created (now 316820a)
This is an automated email from the ASF dual-hosted git repository.
ovilia pushed a change to branch fix-bar-race
in repository https://gitbox.apache.org/repos/asf/echarts.git.
at 316820a fix(bar-race): label value animation duration after sorting
This branch includes the following new commits:
new 316820a fix(bar-race): label value animation duration after sorting
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(bar-race): label value animation duration
after sorting
Posted by ov...@apache.org.
This is an automated email from the ASF dual-hosted git repository.
ovilia pushed a commit to branch fix-bar-race
in repository https://gitbox.apache.org/repos/asf/echarts.git
commit 316820ae033738b55533587b0a414e0d814c83bf
Author: Ovilia <zw...@gmail.com>
AuthorDate: Wed Oct 20 18:51:32 2021 +0800
fix(bar-race): label value animation duration after sorting
---
src/chart/bar/BarView.ts | 6 ++++-
src/label/labelStyle.ts | 9 +++++--
test/bar-race.html | 53 +++++++++++++++++++++++++++++++++++++-
test/runTest/actions/__meta__.json | 1 +
4 files changed, 65 insertions(+), 4 deletions(-)
diff --git a/src/chart/bar/BarView.ts b/src/chart/bar/BarView.ts
index dce754a..f0c5458 100644
--- a/src/chart/bar/BarView.ts
+++ b/src/chart/bar/BarView.ts
@@ -30,7 +30,7 @@ import {
} from '../../util/graphic';
import { getECData } from '../../util/innerStore';
import { enableHoverEmphasis, setStatesStylesFromModel } from '../../util/states';
-import { setLabelStyle, getLabelStatesModels, setLabelValueAnimation } from '../../label/labelStyle';
+import { setLabelStyle, getLabelStatesModels, setLabelValueAnimation, labelInner } from '../../label/labelStyle';
import {throttle} from '../../util/throttle';
import {createClipPath} from '../helper/createClipPathFromCoordSys';
import Sausage from '../../util/shape/sausage';
@@ -555,6 +555,10 @@ class BarView extends ChartView {
const sortInfo = this._dataSort(data, baseAxis, orderMapping);
if (this._isOrderDifferentInView(sortInfo, baseAxis)) {
+ data.eachItemGraphicEl(function (el: Path) {
+ const labelInnerStore = labelInner(el.getTextContent());
+ labelInnerStore.prevValue = labelInnerStore.value;
+ });
this._removeOnRenderedListener(api);
api.dispatchAction({
type: 'changeAxisOrder',
diff --git a/src/label/labelStyle.ts b/src/label/labelStyle.ts
index eb601ed..d86d71e 100644
--- a/src/label/labelStyle.ts
+++ b/src/label/labelStyle.ts
@@ -691,9 +691,11 @@ export function animateLabelValue(
labelFetcher: SetLabelStyleOpt<number>['labelFetcher']
) {
const labelInnerStore = labelInner(textEl);
- if (!labelInnerStore.valueAnimation) {
+ if (!labelInnerStore.valueAnimation || labelInnerStore.prevValue === labelInnerStore.value) {
+ // Value not changed, no new label animation
return;
}
+
const defaultInterpolatedText = labelInnerStore.defaultInterpolatedText;
// Consider the case that being animating, do not use the `obj.value`,
// Otherwise it will jump to the `obj.value` when this new animation started.
@@ -725,5 +727,8 @@ export function animateLabelValue(
(labelInnerStore.prevValue == null
? initProps
: updateProps
- )(textEl, {}, animatableModel, dataIndex, null, during);
+ )(textEl, {
+ // value is used to prevent animation from being aborted
+ value: targetValue
+ }, animatableModel, dataIndex, null, during);
}
diff --git a/test/bar-race.html b/test/bar-race.html
index 3a50764..e4441e6 100644
--- a/test/bar-race.html
+++ b/test/bar-race.html
@@ -340,6 +340,57 @@ under the License.
});
}
);
- </script>
+ </script>
+
+ <script>
+ require(['echarts'],
+ function (echarts) {
+ var data = [4000, 3000];
+ var option = {
+ xAxis: {
+ },
+ yAxis: {
+ type: 'category',
+ data: ['a', 'b'],
+ inverse: true,
+ animationDuration: 300,
+ animationDurationUpdate: 300
+ },
+ series: [{
+ realtimeSort: true,
+ type: 'bar',
+ data: data,
+ label: {
+ show: true,
+ position: 'right',
+ valueAnimation: true
+ },
+ animationDuration: 0,
+ animationDurationUpdate: 5000,
+ animationEasing: 'linear',
+ animationEasingUpdate: 'linear'
+ }]
+ };
+
+ var chart = testHelper.create(echarts, 'main4', {
+ title: [
+ ],
+ option: option,
+ buttons: [{
+ text: 'next',
+ onclick: function () {
+ data[0] += 300;
+ data[1] += 1500;
+ chart.setOption({
+ series: {
+ data: data
+ }
+ });
+ }
+ }]
+ });
+ }
+ );
+ </script>
</body>
</html>
diff --git a/test/runTest/actions/__meta__.json b/test/runTest/actions/__meta__.json
index 37aea6b..014027c 100644
--- a/test/runTest/actions/__meta__.json
+++ b/test/runTest/actions/__meta__.json
@@ -26,6 +26,7 @@
"bar-polar-multi-series-radial": 1,
"bar-polar-null-data-radial": 1,
"bar-polar-stack": 1,
+ "bar-race": 1,
"bar-race2": 2,
"bar-stack": 3,
"bar-start": 1,
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org