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 2020/01/11 17:56:50 UTC
[GitHub] [incubator-echarts] justynabukiel opened a new issue #12023: Lags
when using timeline with many (> 100) items with SVG rendering
justynabukiel opened a new issue #12023: Lags when using timeline with many (> 100) items with SVG rendering
URL: https://github.com/apache/incubator-echarts/issues/12023
### What problem does this feature solve?
When **renderer** is set to **svg** and there are many items in timeline, changing current timeline index lags. There's a visible delay, propably because of many symbols (<path> elements) are rendered in DOM.
My usecase is a chart displaying values per weeks. One timeline item is a week and I have few hundereds of weeks. However there are weeks in which I don't have any data and I don't want to display them on timeline. Currentlu there's no possibility not to display them. The only walkaround that I've found is to set opacity = 0 for those items. But that doesn't solve the performance issue, because those items are still rendered in DOM as <path> elements, which causes lagging.
### What does the proposed API look like?
In options:
timeline: {
data: [
{
symbol: null
}
]
}
This setting could omit rendering symbol on timeline in function _renderAxisTick() in timeline component.
<!-- This issue is generated by echarts-issue-helper. DO NOT REMOVE -->
<!-- This issue is in English. 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
With regards,
Apache Git Services
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [incubator-echarts] alex2wong commented on issue #12023: Lags when
using timeline with many (> 100) items with SVG rendering
Posted by GitBox <gi...@apache.org>.
alex2wong commented on issue #12023: Lags when using timeline with many (> 100) items with SVG rendering
URL: https://github.com/apache/incubator-echarts/issues/12023#issuecomment-575208302
@justynabukiel After reading some of the doc here https://echarts.apache.org/en/option.html#timeline.itemStyle.opacity
and https://echarts.apache.org/en/option.html#timeline.data
I believe when set timeline.itemStyle.opacity = 0 would not trigger render of this specific item, since doc said: `and the component will not be drawn when set to 0.`
btw, I suppose the performance bottleneck is SVG render, what about if you try Canvas renderer to see if there still exists lags.
And you can try set timeline.symbol = 'none' or timeline.symbolSize = 0, too. I guess symbol = 'none' would not render in DOM for sure ~
----------------------------------------------------------------
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
With regards,
Apache Git Services
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [incubator-echarts] Ovilia commented on issue #12023: Lags when
using timeline with many (> 100) items with SVG rendering
Posted by GitBox <gi...@apache.org>.
Ovilia commented on issue #12023: Lags when using timeline with many (> 100) items with SVG rendering
URL: https://github.com/apache/incubator-echarts/issues/12023#issuecomment-579199554
@alex2wong I'm not sure what you mean by *placeholder*.
I think one way to fix this is to not add the element to the container if it's none. This is not an SVG problem because Canvas should also not render it.
----------------------------------------------------------------
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
With regards,
Apache Git Services
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] github-actions[bot] closed issue #12023: Lags when using timeline with many (> 100) items with SVG rendering
Posted by GitBox <gi...@apache.org>.
github-actions[bot] closed issue #12023:
URL: https://github.com/apache/echarts/issues/12023
--
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.
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
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] [incubator-echarts] Ovilia commented on issue #12023: Lags when
using timeline with many (> 100) items with SVG rendering
Posted by GitBox <gi...@apache.org>.
Ovilia commented on issue #12023: Lags when using timeline with many (> 100) items with SVG rendering
URL: https://github.com/apache/incubator-echarts/issues/12023#issuecomment-574529027
I think this makes sense. Marked as a new feature.
----------------------------------------------------------------
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
With regards,
Apache Git Services
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [incubator-echarts] alex2wong commented on issue #12023: Lags when
using timeline with many (> 100) items with SVG rendering
Posted by GitBox <gi...@apache.org>.
alex2wong commented on issue #12023: Lags when using timeline with many (> 100) items with SVG rendering
URL: https://github.com/apache/incubator-echarts/issues/12023#issuecomment-576316328
Sure，I've checked in demo code. The path elements for SVG are in DOM tree indeed, which introduce some performance issue. I am not sure how much performance we can promote by not render path for 'none' symbol or symbol with 0 opacity.
Maybe there are some reason we keep the paths as placeholder? @Ovilia
----------------------------------------------------------------
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
With regards,
Apache Git Services
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [incubator-echarts] justynabukiel commented on issue #12023: Lags
when using timeline with many (> 100) items with SVG rendering
Posted by GitBox <gi...@apache.org>.
justynabukiel commented on issue #12023: Lags when using timeline with many (> 100) items with SVG rendering
URL: https://github.com/apache/incubator-echarts/issues/12023#issuecomment-575315261
> I believe when set timeline.itemStyle.opacity = 0 would not trigger render of this specific item, since doc said: `and the component will not be drawn when set to 0.`
When opacity = 0, 'path' element is still being rendered, I've checked it.
> btw, I suppose the performance bottleneck is SVG render, what about if you try Canvas renderer to see if there still exists lags.
You are right, the problem is in SVG. I was using Canvas at first and it worked well, but I've decided to change it to SVG, because it's more sharp and looks better. I've also bumped into some flickering issues with Canvas (not relevant here).
> And you can try set timeline.symbol = 'none' or timeline.symbolSize = 0, too. I guess symbol = 'none' would not render in DOM for sure ~
I've tried it and checked it once again now. Both these settings, even combined result in creating 'path' element in DOM - just not visible.
----------------------------------------------------------------
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
With regards,
Apache Git Services
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [incubator-echarts] echarts-bot[bot] commented on issue #12023:
Lags when using timeline with many (> 100) items with SVG rendering
Posted by GitBox <gi...@apache.org>.
echarts-bot[bot] commented on issue #12023: Lags when using timeline with many (> 100) items with SVG rendering
URL: https://github.com/apache/incubator-echarts/issues/12023#issuecomment-573339148
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 questions.
If you are interested in the project, you may also subscribe our [mail 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
With regards,
Apache Git Services
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [incubator-echarts] justynabukiel commented on issue #12023: Lags
when using timeline with many (> 100) items with SVG rendering
Posted by GitBox <gi...@apache.org>.
justynabukiel commented on issue #12023: Lags when using timeline with many (> 100) items with SVG rendering
URL: https://github.com/apache/incubator-echarts/issues/12023#issuecomment-573671555
First of all, thanks for answering my ticket.
I have data (to be specific: user's statistics) from several years grouped by different time ranges: by years, months and weeks. Each time I change grouping parameter, I redraw the chart.
For years and months it works well, because there are not so many items on the timeline. Here's an exmaple of grouping by years.
But when I switch into grouping by weeks, I have 52 * numbers_of_years items. And this case causes performance issue. On the timeline below the "empty" weeks have symbol with opacity = 0, only those with any data are visible. But, as I've mentioned previously, all items are rendered in DOM, even if they are not visible.
----------------------------------------------------------------
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
With regards,
Apache Git Services
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] github-actions[bot] commented on issue #12023: Lags when using timeline with many (> 100) items with SVG rendering
Posted by GitBox <gi...@apache.org>.
github-actions[bot] commented on issue #12023:
URL: https://github.com/apache/echarts/issues/12023#issuecomment-1030347679
This issue has been automatically closed because it did not have recent activity. If this remains to be a problem with the latest version of Apache ECharts, please open a new issue and link this to it. Thanks!
--
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.
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
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] [incubator-echarts] Ovilia commented on issue #12023: Lags when
using timeline with many (> 100) items with SVG rendering
Posted by GitBox <gi...@apache.org>.
Ovilia commented on issue #12023: Lags when using timeline with many (> 100) items with SVG rendering
URL: https://github.com/apache/incubator-echarts/issues/12023#issuecomment-573616636
@justynabukiel What are you using timeline for? Because it's not supposed to have many data items.
----------------------------------------------------------------
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
With regards,
Apache Git Services
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [incubator-echarts] Ovilia commented on issue #12023: Lags when
using timeline with many (> 100) items with SVG rendering
Posted by GitBox <gi...@apache.org>.
Ovilia commented on issue #12023: Lags when using timeline with many (> 100) items with SVG rendering
URL: https://github.com/apache/incubator-echarts/issues/12023#issuecomment-575477397
I think the doc probably means it's not visible rather than not rendered technically.
----------------------------------------------------------------
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
With regards,
Apache Git Services
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org
[GitHub] [echarts] github-actions[bot] commented on issue #12023: Lags when using timeline with many (> 100) items with SVG rendering
Posted by GitBox <gi...@apache.org>.
github-actions[bot] commented on issue #12023:
URL: https://github.com/apache/echarts/issues/12023#issuecomment-1023637057
This issue has been automatically marked as stale because it did not have recent activity. It will be closed in 7 days if no further activity occurs. If you wish not to mark it as stale, please leave a comment in this issue.
--
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.
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
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