You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by GitBox <gi...@apache.org> on 2021/02/04 06:12:10 UTC
[GitHub] [echarts] akeagle opened a new issue #14208: echarts5.0.1 和vue2.6 版本在使用新特性动态：动态柱状图，label会始终是0
akeagle opened a new issue #14208:
URL: https://github.com/apache/echarts/issues/14208
### Version
5.0.1
### Steps to reproduce
同时选上valueAnimation 和 realtimeSort 就会导致此bug。
### What is expected?
解决此bug。
### What is actually happening?
label能正常动态变化。
<!-- This issue is generated by echarts-issue-helper. DO NOT REMOVE -->
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] pissang commented on issue #14208: echarts5.0.1 和vue2.6 版本在使用新特性动态：动态柱状图，label会始终是0
Posted by GitBox <gi...@apache.org>.
pissang commented on issue #14208:
URL: https://github.com/apache/echarts/issues/14208#issuecomment-773760858
@akeagle 我写了个 import 的例子
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] pissang edited a comment on issue #14208: echarts5.0.1 和vue2.6 版本在使用新特性动态：动态柱状图，label会始终是0
Posted by GitBox <gi...@apache.org>.
pissang edited a comment on issue #14208:
URL: https://github.com/apache/echarts/issues/14208#issuecomment-773760858
@akeagle 我写了个 import 的例子
https://codesandbox.io/s/dark-frog-28xz8?file=/src/index.js
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] akeagle commented on issue #14208: echarts5.0.1 和vue2.6 版本在使用新特性动态：动态柱状图，label会始终是0
Posted by GitBox <gi...@apache.org>.
akeagle commented on issue #14208:
URL: https://github.com/apache/echarts/issues/14208#issuecomment-773747963
我刚才又重新做了测试，和vue没有关系，但凡是通过`import * as echarts from 'echarts';`引入的，通过webpack构建后都会出现如上问题，但通过script直接导入的则没有这个问题。
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] akeagle closed issue #14208: echarts5.0.1 和vue2.6 版本在使用新特性动态：动态柱状图，label会始终是0
Posted by GitBox <gi...@apache.org>.
akeagle closed issue #14208:
URL: https://github.com/apache/echarts/issues/14208
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] pissang edited a comment on issue #14208: echarts5.0.1 和vue2.6 版本在使用新特性动态：动态柱状图，label会始终是0
Posted by GitBox <gi...@apache.org>.
pissang edited a comment on issue #14208:
URL: https://github.com/apache/echarts/issues/14208#issuecomment-773760858
@akeagle 我写了个 import 的例子
https://codesandbox.io/s/dark-frog-28xz8?file=/src/index.js
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] akeagle commented on issue #14208: echarts5.0.1 和vue2.6 版本在使用新特性动态：动态柱状图，label会始终是0
Posted by GitBox <gi...@apache.org>.
akeagle commented on issue #14208:
URL: https://github.com/apache/echarts/issues/14208#issuecomment-773750238
> @akeagle https://codesandbox.io/dashboard 发我下你的例子？
代码我没改变，还是上面的代码，区别只是一个import，一个script引入的echarts。
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] akeagle commented on issue #14208: echarts5.0.1 和vue2.6 版本在使用新特性动态：动态柱状图，label会始终是0
Posted by GitBox <gi...@apache.org>.
akeagle commented on issue #14208:
URL: https://github.com/apache/echarts/issues/14208#issuecomment-773722382
`<template>
<div id="id" style="width: 100%; height: 500px"></div>
</template>
<script>
import * as echarts from 'echarts';
export default {
name: 'test',
mounted() {
const res = [
{ name: '土采置存她', num: 79 },
{ name: '位件内月前', num: 827 },
{ name: '得三率别重', num: 99 },
{ name: '样名广斯', num: 356 },
{ name: '前象确', num: 359 },
];
this.options = {
xAxis: {
type: 'value',
},
yAxis: {
type: 'category',
max: 3,
animationDuration: 300,
animationDurationUpdate: 300,
inverse: true,
data: res.map(i => {
return i.name;
}),
},
series: [
{
name: 'xxxxx',
type: 'bar',
realtimeSort: true,
label: {
show: true,
position: 'right',
valueAnimation: true,
},
showBackground: true,
data: res.map(i => {
return i.num;
}),
},
],
animationDuration: 3000,
animationDurationUpdate: 3000,
};
this.initChart();
},
methods: {
initChart() {
this.$nextTick(e => {
this.chart = echarts.init(document.getElementById('id'));
this.chart.setOption(this.options);
});
},
},
};
</script>
`
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] akeagle edited a comment on issue #14208: echarts5.0.1 和vue2.6 版本在使用新特性动态：动态柱状图，label会始终是0
Posted by GitBox <gi...@apache.org>.
akeagle edited a comment on issue #14208:
URL: https://github.com/apache/echarts/issues/14208#issuecomment-773722382
```js
<template>
<div id="id" style="width: 100%; height: 500px"></div>
</template>
<script>
import * as echarts from 'echarts';
export default {
name: 'test',
mounted() {
const res = [
{ name: '土采置存她', num: 79 },
{ name: '位件内月前', num: 827 },
{ name: '得三率别重', num: 99 },
{ name: '样名广斯', num: 356 },
{ name: '前象确', num: 359 },
];
this.options = {
xAxis: {
type: 'value',
},
yAxis: {
type: 'category',
max: 3,
animationDuration: 300,
animationDurationUpdate: 300,
inverse: true,
data: res.map(i => {
return i.name;
}),
},
series: [
{
name: 'xxxxx',
type: 'bar',
realtimeSort: true,
label: {
show: true,
position: 'right',
valueAnimation: true,
},
showBackground: true,
data: res.map(i => {
return i.num;
}),
},
],
animationDuration: 3000,
animationDurationUpdate: 3000,
};
this.initChart();
},
methods: {
initChart() {
this.$nextTick(e => {
this.chart = echarts.init(document.getElementById('id'));
this.chart.setOption(this.options);
});
},
},
};
</script>
```
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] akeagle commented on issue #14208: echarts5.0.1 和vue2.6 版本在使用新特性动态：动态柱状图，label会始终是0
Posted by GitBox <gi...@apache.org>.
akeagle commented on issue #14208:
URL: https://github.com/apache/echarts/issues/14208#issuecomment-773748388
> 动态柱状图主要是针对数据更新时的动画，可能在初始化的时候也应用会有问题。我们在下个版本修复一下，先可以这样调整一下：
>
> ```js
> const res = [
> { name: '土采置存她', num: 0 },
> { name: '位件内月前', num: 0 },
> { name: '得三率别重', num: 0 },
> { name: '样名广斯', num: 0 },
> { name: '前象确', num: 0 },
> ];
>
> option = {
> xAxis: {
> type: 'value',
> },
> yAxis: {
> type: 'category',
> max: 3,
> animationDuration: 300,
> animationDurationUpdate: 300,
> inverse: true,
> data: res.map(i => {
> return i.name;
> }),
> },
> series: [
> {
> name: 'xxxxx',
> type: 'bar',
> realtimeSort: true,
> label: {
> show: true,
> position: 'right',
> valueAnimation: true,
> },
> // showBackground: true,
> data: res.map(i => {
> return i.num;
> }),
> },
> ],
> animationEasingUpdate: 'linear',
> animationDuration: 0,
> animationDurationUpdate: 3000,
> };
>
> setTimeout(function () {
> myChart.setOption({
> series: [{
> data: [79, 827, 99, 356, 359]
> }]
> });
> });
> ```
另外补充一句：您给的方案并没有解决问题。
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] akeagle closed issue #14208: echarts5.0.1 和vue2.6 版本在使用新特性动态：动态柱状图，label会始终是0
Posted by GitBox <gi...@apache.org>.
akeagle closed issue #14208:
URL: https://github.com/apache/echarts/issues/14208
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] pissang commented on issue #14208: echarts5.0.1 和vue2.6 版本在使用新特性动态：动态柱状图，label会始终是0
Posted by GitBox <gi...@apache.org>.
pissang commented on issue #14208:
URL: https://github.com/apache/echarts/issues/14208#issuecomment-773734745
动态柱状图主要是针对数据更新时的动画，可能在初始化的时候也应用会有问题。我们在下个版本修复一下，先可以这样调整一下：
```js
const res = [
{ name: '土采置存她', num: 0 },
{ name: '位件内月前', num: 0 },
{ name: '得三率别重', num: 0 },
{ name: '样名广斯', num: 0 },
{ name: '前象确', num: 0 },
];
option = {
xAxis: {
type: 'value',
},
yAxis: {
type: 'category',
max: 3,
animationDuration: 300,
animationDurationUpdate: 300,
inverse: true,
data: res.map(i => {
return i.name;
}),
},
series: [
{
name: 'xxxxx',
type: 'bar',
realtimeSort: true,
label: {
show: true,
position: 'right',
valueAnimation: true,
},
// showBackground: true,
data: res.map(i => {
return i.num;
}),
},
],
animationEasingUpdate: 'linear',
animationDuration: 0,
animationDurationUpdate: 3000,
};
setTimeout(function () {
myChart.setOption({
series: [{
data: [79, 827, 99, 356, 359]
}]
});
});
```
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] akeagle commented on issue #14208: echarts5.0.1 和vue2.6 版本在使用新特性动态：动态柱状图，label会始终是0
Posted by GitBox <gi...@apache.org>.
akeagle commented on issue #14208:
URL: https://github.com/apache/echarts/issues/14208#issuecomment-773815364
> @akeagle 我写了个 import 的例子
> https://codesandbox.io/s/dark-frog-28xz8?file=/src/index.js
具体原因我也不清楚，但您可以本地构建一下，我本地构建后的确实是存在上述问题的。ps:话说国内真是各种不方便，在线代码编辑的工具一个比一个卡，完全用不起的样子。
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] akeagle commented on issue #14208: echarts5.0.1 和vue2.6 版本在使用新特性动态：动态柱状图，label会始终是0
Posted by GitBox <gi...@apache.org>.
akeagle commented on issue #14208:
URL: https://github.com/apache/echarts/issues/14208#issuecomment-773722971
和官网上的示例几乎一致，单独使用valueAnimation或者realtimeSort是有效的，但一起使用就会导致label始终为0的bug。
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] echarts-bot[bot] commented on issue #14208: echarts5.0.1 和vue2.6 版本在使用新特性动态：动态柱状图，label会始终是0
Posted by GitBox <gi...@apache.org>.
echarts-bot[bot] commented on issue #14208:
URL: https://github.com/apache/echarts/issues/14208#issuecomment-773058427
Hi! We've received your issue and please be patient to get responded. 🎉
The average response time is expected to be within one day for weekdays.
In the meanwhile, please make sure that **you have posted enough image to demo your request**. You may also check out the [API](http://echarts.apache.org/api.html) and [chart option](http://echarts.apache.org/option.html) to get the answer.
If you don't get helped for a long time (over a week) or have an urgent question to ask, you may also send an email to dev@echarts.apache.org. Please attach the issue link if it's a technical question.
If you are interested in the project, you may also subscribe our [mailing list](https://echarts.apache.org/en/maillist.html).
Have a nice day! 🍵
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] pissang commented on issue #14208: echarts5.0.1 和vue2.6 版本在使用新特性动态：动态柱状图，label会始终是0
Posted by GitBox <gi...@apache.org>.
pissang commented on issue #14208:
URL: https://github.com/apache/echarts/issues/14208#issuecomment-773734745
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] akeagle commented on issue #14208: echarts5.0.1 和vue2.6 版本在使用新特性动态：动态柱状图，label会始终是0
Posted by GitBox <gi...@apache.org>.
akeagle commented on issue #14208:
URL: https://github.com/apache/echarts/issues/14208#issuecomment-773722382
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] akeagle edited a comment on issue #14208: echarts5.0.1 和vue2.6 版本在使用新特性动态：动态柱状图，label会始终是0
Posted by GitBox <gi...@apache.org>.
akeagle edited a comment on issue #14208:
URL: https://github.com/apache/echarts/issues/14208#issuecomment-773722382
```js
<template>
<div id="id" style="width: 100%; height: 500px"></div>
</template>
<script>
import * as echarts from 'echarts';
export default {
name: 'test',
mounted() {
const res = [
{ name: '土采置存她', num: 79 },
{ name: '位件内月前', num: 827 },
{ name: '得三率别重', num: 99 },
{ name: '样名广斯', num: 356 },
{ name: '前象确', num: 359 },
];
this.options = {
xAxis: {
type: 'value',
},
yAxis: {
type: 'category',
max: 3,
animationDuration: 300,
animationDurationUpdate: 300,
inverse: true,
data: res.map(i => {
return i.name;
}),
},
series: [
{
name: 'xxxxx',
type: 'bar',
realtimeSort: true,
label: {
show: true,
position: 'right',
valueAnimation: true,
},
showBackground: true,
data: res.map(i => {
return i.num;
}),
},
],
animationDuration: 3000,
animationDurationUpdate: 3000,
};
this.initChart();
},
methods: {
initChart() {
this.$nextTick(e => {
this.chart = echarts.init(document.getElementById('id'));
this.chart.setOption(this.options);
});
},
},
};
</script>
```
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] akeagle commented on issue #14208: echarts5.0.1 和vue2.6 版本在使用新特性动态：动态柱状图，label会始终是0
Posted by GitBox <gi...@apache.org>.
akeagle commented on issue #14208:
URL: https://github.com/apache/echarts/issues/14208#issuecomment-773749759
` version "4.44.2"
resolved "https://registry.yarnpkg.com/webpack/-/webpack-4.44.2.tgz#6bfe2b0af055c8b2d1e90ed2cd9363f841266b72"
integrity sha512-6KJVGlCxYdISyurpQ0IPTklv+DULv05rs2hseIXer6D7KrUicRDLFb4IUM1S6LUAKypPM/nSiVSuv8jHu1m3/Q==`
这是我测试用的webpack版本，目前不确定问题出在webpack这里还是echarts这里。
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] pissang commented on issue #14208: echarts5.0.1 和vue2.6 版本在使用新特性动态：动态柱状图，label会始终是0
Posted by GitBox <gi...@apache.org>.
pissang commented on issue #14208:
URL: https://github.com/apache/echarts/issues/14208#issuecomment-773748791
@akeagle https://codesandbox.io/dashboard 发我下你的例子？
----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org