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/07/01 02:31:00 UTC
[GitHub] [echarts] Little-Star-Star opened a new issue #15269: When setOption, whole series will rerender. How Can I only render changed series?
Little-Star-Star opened a new issue #15269:
URL: https://github.com/apache/echarts/issues/15269
### Version
5.1.1
### Steps to reproduce
setOption
### What is expected?
Only render one changed series, and else series have no change.
### What is actually happening?
Every series will change, when I setOption.
Just because of it, my lines series effect appear the situation of frame loss.
---
please help me. Haaa! Some description in code.
``` js
import { isMiniScreen } from "@/utils/util";
let miniScreen = isMiniScreen();
import { numToW } from "@/utils/util";
let baseMapOptions = {
boundingCoords: [
[-180, 90],
[180, -90],
],
aspectScale: 0.75,
zoom: 5,
center: miniScreen ? [115.114129, 38.550339] : [120.114129, 37.550339],
};
export default {
backgroundColor: "#0f1432ff",
tooltip: {},
geo: [
{
id: "worldchina",
map: "worldchina",
roam: true,
...baseMapOptions,
itemStyle: {
areaColor: "#1b2653ff",
borderColor: "#44568f",
borderWidth: 1,
},
label: {
color: "#00d5ff",
},
emphasis: {
label: {
show: true,
color: "#00d5ff",
},
itemStyle: {
areaColor: "#1b2653ff",
},
},
regions: [],
tooltip: {},
z: 2,
},
],
visualMap: [
{
type: "piecewise",
show: false,
min: 10000,
max: 25000000, //25123172
seriesIndex: 4,
pieces: [
{ lt: 10 * 10000 },
{ gte: 10 * 10000, lt: 200 * 10000 },
{ gte: 200 * 10000, lt: 1000 * 10000 },
{ gte: 1000 * 10000, lt: 2500 * 10000 },
{ gte: 2500 * 10000 },
],
inRange: {
color: ["#00f", "#0f0", "#ff0", "#f00"],
},
outRange: {
color: ["#00f"],
},
},
{
type: "piecewise",
show: false,
min: 10000,
max: 25000000,
realtime: false,
seriesIndex: 1,
pieces: [
{ lt: 1000 },
{ gte: 1000, lt: 5000 },
{ gte: 5000, lt: 10000 },
{ gte: 5000, lt: 10000 },
{ gte: 10000, lt: 20000 },
{ gte: 20000, lt: 30000 },
{ gte: 30000, lt: 50000 },
{ gte: 50000, lt: 100000 },
{ gte: 100000 },
],
inRange: {
color: [
"#6666ff",
"#0f0",
"#0f0",
"#ff0",
"#ff0",
"#ff0",
"#FF00FF",
"#f00",
],
},
outRange: {
color: ["#6666ff"],
},
},
{
type: "continuous",
show: false,
top: "top",
min: 0,
max: 1,
seriesIndex: 0,
realtime: false,
inRange: {
color: [
"rgb(0,150,255)",
"rgb(0,125,255)",
"rgb(0,100,255)",
"rgb(0,75,255)",
"rgb(0,50,255)",
"rgb(0,25,255)",
"rgb(0,0,255)",
"rgb(0,0,255)",
"rgb(0,0,255)",
"rgb(0,0,255)",
"rgb(0,0,255)",
"rgb(0,0,255)",
"rgb(0,0,255)",
"rgb(255,0,255)",
"rgb(255,25,255)",
"rgb(255,50,255)",
"rgb(255,255,255)",
],
},
},
],
series: [
{
/********** bug： 30000 lnglat dot rerender, if I set 'map-bg' series data equal [], lines effect is good. *********/
id: "map-bg",
type: "heatmap",
coordinateSystem: "geo",
data: [],
pointSize: 1,
blurSize: 1,
silent: true,
progressive: 1000,
animation: false,
},
{
id: "city-active-car",
type: "heatmap",
coordinateSystem: "geo",
data: [],
pointSize: 5,
blurSize: 5,
silent: true,
zlevel: 6,
z: 6,
},
{
id: "active-car-line",
type: "lines",
coordinateSystem: "geo",
polyline: true,
data: [],
// silent: true,
lineStyle: {
opacity: 0.8,
width: 3,
label: {
show: true,
},
},
tooltip: {
show: true,
borderWidth: 0,
formatter: (params) => {
return "test";
},
},
emphasis: {
focus: "self",
lineStyle: {
opacity: 1,
width: 4,
},
},
animation: false,
zlevel: 10,
},
/********** bug： lines effect is bad. lines series have 10 line, and per line have 500 lnglat dot.
* When starting render lines will appear frame loss, and during 10s, it run good. *********/
{
id: "active-car-line-effect",
type: "lines",
coordinateSystem: "geo",
polyline: true,
data: [],
lineStyle: {
width: 0,
},
effect: {
constantSpeed: 15,
show: true,
trailLength: 0.5,
symbolSize: 8,
},
silent: true,
animation: false,
zlevel: 11,
},
{
id: "hot-area",
type: "heatmap",
coordinateSystem: "geo",
data: [],
pointSize: miniScreen ? 15 : 20,
blurSize: miniScreen ? 25 : 30,
zlevel: 4,
silent: true,
},
{
id: "china-boundary",
type: "lines",
coordinateSystem: "geo",
polyline: true,
data: [],
lineStyle: {
width: 3,
opacity: 1,
curveness: 1,
},
silent: true,
animation: false,
// zlevel: 1,
},
],
};
```
<!-- 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.
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] [echarts] echarts-bot[bot] commented on issue #15269: When setOption, whole series will rerender. How Can I only render changed series?
Posted by GitBox <gi...@apache.org>.
echarts-bot[bot] commented on issue #15269:
URL: https://github.com/apache/echarts/issues/15269#issuecomment-871864241
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 it contains **a minimum reproducible demo** and necessary **images** to illustrate. Otherwise, our committers will ask you to do so.
*A minimum reproducible demo* should contain as little data and components as possible but can still illustrate your problem. This is the best way for us to reproduce it and solve the problem faster.
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.
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] [echarts] Ovilia commented on issue #15269: When setOption, whole series will rerender. How Can I only render changed series?
Posted by GitBox <gi...@apache.org>.
Ovilia commented on issue #15269:
URL: https://github.com/apache/echarts/issues/15269#issuecomment-872764074
Usually when we render with Canvas, the basic process is to clear all the canvas and repaint all the elements. So this is what you get when calling setOption. If you wish to render part of the content out of performance consideration, you may set the series that you wish to re-render only with a different `zlevel` so that it will be displayed in another Canvas and only that Canvas will re-render when this series changes.
In most cases, you don't have to do this, unless you have performance issues.
--
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] [echarts] Little-Star-Star commented on issue #15269: When setOption, whole series will rerender. How Can I only render changed series?
Posted by GitBox <gi...@apache.org>.
Little-Star-Star commented on issue #15269:
URL: https://github.com/apache/echarts/issues/15269#issuecomment-871888579
You can observe the number of "[Violation] 'requestAnimationFrame' handler took <N>ms" in the console panel, you can justify a right progressive value.
--
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] [echarts] jahnli edited a comment on issue #15269: When setOption, whole series will rerender. How Can I only render changed series?
Posted by GitBox <gi...@apache.org>.
jahnli edited a comment on issue #15269:
URL: https://github.com/apache/echarts/issues/15269#issuecomment-1008896894
我想异步动态设置数据，setOption整个设置和只设置setOption（xAxis，series） 有具体的区别吗 ？ 例如 性能等
1、myChart.setOption({
title: {
text: '异步数据加载示例'
},
tooltip: {},
legend: {},
xAxis: {
data: data.categories
},
yAxis: {},
series: [
{
name: '销量',
type: 'bar',
data: data.values
}
]
});
2、
myChart.setOption({
xAxis: {
data: data.categories
},
series: [
{
// 根据名字对应到相应的系列
name: '销量',
data: data.data
}
]
});
--
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] [echarts] jahnli commented on issue #15269: When setOption, whole series will rerender. How Can I only render changed series?
Posted by GitBox <gi...@apache.org>.
jahnli commented on issue #15269:
URL: https://github.com/apache/echarts/issues/15269#issuecomment-1008896894
@Ovilia When asynchronous data is set dynamically, does it make a difference if setOption sets other static data again? Example: Performance
Dynamically updating data ，Is there a difference between the two approaches?
1、myChart.setOption({
title: {
text: '异步数据加载示例'
},
tooltip: {},
legend: {},
xAxis: {
data: data.categories
},
yAxis: {},
series: [
{
name: '销量',
type: 'bar',
data: data.values
}
]
});
2、
myChart.setOption({
xAxis: {
data: data.categories
},
series: [
{
// 根据名字对应到相应的系列
name: '销量',
data: data.data
}
]
});
--
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] [echarts] Little-Star-Star commented on issue #15269: When setOption, whole series will rerender. How Can I only render changed series?
Posted by GitBox <gi...@apache.org>.
Little-Star-Star commented on issue #15269:
URL: https://github.com/apache/echarts/issues/15269#issuecomment-871887222
I use a rude method to resolve this problem.
I find that rendering can reduce frame loss by justifying progressive and progressiveThreshold.
--
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