You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by "RafaelCENG (via GitHub)" <gi...@apache.org> on 2023/10/19 13:16:32 UTC
[I] [Bug] Resizing creates re-render (flickering) [echarts]
RafaelCENG opened a new issue, #19224:
URL: https://github.com/apache/echarts/issues/19224
### Version
^5.4.2
### Link to Minimal Reproduction
https://echarts.apache.org/examples/zh/editor.html?c=pie-rich-text
### Steps to Reproduce
```
const chartRef = useRef<any>(null);
// CHART RELATED
const RoadBikeRef = useRef<any>(null);
useEffect(() => {
const ROAD_BIKE_OPTIONS = {
title: {
show: chartSeries.length === 0,
textStyle: {
color: "#F7F3F0",
fontSize: 20,
},
text: "No data available",
left: "center",
top: "20%",
},
grid: {
right: "2%",
// y2: 300,
height: E_HEIGHT * 0.35,
},
tooltip: {
show: chartSeries.length !== 0,
trigger: "axis",
textStyle: {
color: "#F7F3F0",
},
backgroundColor: "rgba(61, 52, 62, 0.9)",
valueFormatter: function (val) {
return `${val} %`;
},
confine: true,
},
legend: {
data: chartSeries.map((series) => series.name),
icon: "circle",
inactiveColor: "#64605D",
textStyle: {
color: "#F7F3F0",
},
orient: "vertical",
bottom: 0,
left: 0,
// top: "bottom",
// top: -20,
//Paei to legend apo kato. Iparxi overlap provlima (na to kitakso)
},
xAxis: {
type: "category",
data:
currentPeriod === "4 Weeks"
? Object.keys(week_buckets).reduce((arr, key) => {
return arr.concat(key, "", "", "", "", "", "");
}, [])
: categories,
axisLabel: {
interval: 0,
},
axisTick: {
alignWithLabel: true,
},
},
yAxis: {
type: "value",
min: 0,
axisLabel: {
formatter: (val) => Math.ceil(val) + "%",
},
},
series: chartSeries.map((series) => ({
name: series.name,
type: "line",
smooth: true,
data: series.data,
symbol: "circle",
lineStyle: {
type: series.name.includes("Not") ? "dashed" : "solid",
},
})),
};
let chart: any;
if (RoadBikeRef.current) {
chart = echarts.init(RoadBikeRef.current, "light", {
renderer: "svg",
width: E_WIDTH * 0.9,
height: customHeight,
});
chart.setOption(ROAD_BIKE_OPTIONS);
chartRef.current = chart;
}
return () => chart?.dispose();
}, [chartSeries]);
const TTBikeRef = useRef<any>(null);
{.....}
useEffect(() => {
chartRef.current.resize({
width: E_WIDTH * 0.9,
height: customHeight,
animation:
bikePositions.length > 0
? {
duration: 1500,
easing: "linear",
}
: "",
});
}, [customHeight]);
```
### Current Behavior
So, I've got two references here: one for road_bike and another for tt, each representing different data sets. On top of that, I've got this extra reference called chart, which I'm using to manage the chart's height, making sure I can display the legend vertically.
Now, every time I hit that upper button, my data changes thanks to chartSeries. Not only that, but I also create a brand new chart and adjust its size to make sure the legend loo
https://github.com/apache/echarts/assets/45431116/8bb7ab62-841f-4705-ad90-bceb64b00c94
ks just right vertically.
### Expected Behavior
Shouldn't flicker.
### Environment
```markdown
- Framework: React Native
```
### Any additional comments?
Also Im using [react-native-echarts](https://github.com/wuba/react-native-echarts) which is a wrapper of echarts.
The minimal reproduction is not a valid link. Not sure I can re-create the problem in sandbox. Need expo and can't really do it. Thanks in Advance.
--
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.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
Re: [I] [Bug] Resizing creates re-render (flickering) [echarts]
Posted by "github-actions[bot] (via GitHub)" <gi...@apache.org>.
github-actions[bot] commented on issue #19224:
URL: https://github.com/apache/echarts/issues/19224#issuecomment-3418818373
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
Re: [I] [Bug] Resizing creates re-render (flickering) [echarts]
Posted by "github-actions[bot] (via GitHub)" <gi...@apache.org>.
github-actions[bot] commented on issue #19224:
URL: https://github.com/apache/echarts/issues/19224#issuecomment-3448923340
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
Re: [I] [Bug] Resizing creates re-render (flickering) [echarts]
Posted by "github-actions[bot] (via GitHub)" <gi...@apache.org>.
github-actions[bot] closed issue #19224: [Bug] Resizing creates re-render (flickering)
URL: https://github.com/apache/echarts/issues/19224
--
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