mirror of
https://github.com/MrUnknownDE/VRCX.git
synced 2026-04-10 18:33:51 +02:00
replace echartsInstance ref with a direct variable assignment
This commit is contained in:
@@ -174,7 +174,7 @@
|
||||
getActivityData
|
||||
} = useInstanceActivityData();
|
||||
|
||||
const echartsInstance = ref(null);
|
||||
let echartsInstance = null;
|
||||
const resizeObserver = ref(null);
|
||||
const { handleIntersectionObserver } = useIntersectionObserver();
|
||||
const isLoading = ref(true);
|
||||
@@ -204,9 +204,9 @@
|
||||
watch(
|
||||
() => isDarkMode.value,
|
||||
() => {
|
||||
if (echartsInstance.value) {
|
||||
echartsInstance.value.dispose();
|
||||
echartsInstance.value = null;
|
||||
if (echartsInstance) {
|
||||
echartsInstance.dispose();
|
||||
echartsInstance = null;
|
||||
initEcharts();
|
||||
}
|
||||
}
|
||||
@@ -215,7 +215,7 @@
|
||||
watch(
|
||||
() => dtHour12.value,
|
||||
() => {
|
||||
if (echartsInstance.value) {
|
||||
if (echartsInstance) {
|
||||
initEcharts();
|
||||
}
|
||||
}
|
||||
@@ -223,7 +223,7 @@
|
||||
|
||||
// onActivated(() => {
|
||||
// // first time also call activated
|
||||
// if (echartsInstance.value) {
|
||||
// if (echartsInstance) {
|
||||
// reloadData();
|
||||
// }
|
||||
// });
|
||||
@@ -276,17 +276,17 @@
|
||||
|
||||
await nextTick();
|
||||
|
||||
if (echartsInstance.value && activityData.value.length) {
|
||||
if (echartsInstance && activityData.value.length) {
|
||||
const chartsHeight = activityData.value.length * (barWidth.value + 10) + 200;
|
||||
echartsInstance.value.resize({
|
||||
echartsInstance.resize({
|
||||
height: chartsHeight,
|
||||
animation: {
|
||||
duration: 300
|
||||
}
|
||||
});
|
||||
echartsInstance.value.setOption(getNewOption(), { notMerge: true });
|
||||
} else if (echartsInstance.value) {
|
||||
echartsInstance.value.clear();
|
||||
echartsInstance.setOption(getNewOption(), { notMerge: true });
|
||||
} else if (echartsInstance) {
|
||||
echartsInstance.clear();
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Error in reloadData:', error);
|
||||
@@ -349,12 +349,12 @@
|
||||
const chartDom = activityChartRef.value;
|
||||
|
||||
const afterInit = () => {
|
||||
if (!echartsInstance.value) {
|
||||
if (!echartsInstance) {
|
||||
console.error('ECharts instance not initialized');
|
||||
return;
|
||||
}
|
||||
|
||||
echartsInstance.value.resize({
|
||||
echartsInstance.resize({
|
||||
height: chartsHeight,
|
||||
animation: {
|
||||
duration: 300
|
||||
@@ -363,26 +363,26 @@
|
||||
|
||||
const handleClickYAxisLabel = handleYAxisLabelClick;
|
||||
|
||||
echartsInstance.value.off('click');
|
||||
echartsInstance.off('click');
|
||||
|
||||
if (activityData.value.length && worldNameArray.value.length) {
|
||||
const options = getNewOption();
|
||||
echartsInstance.value.clear();
|
||||
echartsInstance.value.setOption(options, { notMerge: true });
|
||||
echartsInstance.value.on('click', 'yAxis', handleClickYAxisLabel);
|
||||
echartsInstance.clear();
|
||||
echartsInstance.setOption(options, { notMerge: true });
|
||||
echartsInstance.on('click', 'yAxis', handleClickYAxisLabel);
|
||||
} else {
|
||||
echartsInstance.value.clear();
|
||||
echartsInstance.clear();
|
||||
}
|
||||
isLoading.value = false;
|
||||
};
|
||||
|
||||
const initEchartsInstance = () => {
|
||||
echartsInstance.value = echarts.init(chartDom, `${isDarkMode.value ? 'dark' : null}`, {
|
||||
echartsInstance = echarts.init(chartDom, `${isDarkMode.value ? 'dark' : null}`, {
|
||||
height: chartsHeight
|
||||
});
|
||||
// resizeObserver.value = new ResizeObserver((entries) => {
|
||||
// for (const entry of entries) {
|
||||
// echartsInstance.value.resize({
|
||||
// echartsInstance.resize({
|
||||
// width: entry.contentRect.width,
|
||||
// animation: {
|
||||
// duration: 300
|
||||
@@ -393,7 +393,7 @@
|
||||
// resizeObserver.value.observe(chartDom);
|
||||
};
|
||||
|
||||
if (!echartsInstance.value) {
|
||||
if (!echartsInstance) {
|
||||
initEchartsInstance();
|
||||
}
|
||||
afterInit();
|
||||
@@ -541,9 +541,9 @@
|
||||
function handleSettingsChange() {
|
||||
handleChangeSettings(activityDetailChartRef);
|
||||
|
||||
if (echartsInstance.value) {
|
||||
if (echartsInstance) {
|
||||
const newOptions = getNewOption();
|
||||
echartsInstance.value.setOption({
|
||||
echartsInstance.setOption({
|
||||
yAxis: newOptions.yAxis
|
||||
});
|
||||
}
|
||||
|
||||
@@ -44,7 +44,7 @@
|
||||
const activityDetailChartRef = ref(null);
|
||||
|
||||
const isLoading = ref(true);
|
||||
const echartsInstance = ref(null);
|
||||
let echartsInstance = null;
|
||||
const usersFirstActivity = ref(null);
|
||||
const resizeObserver = ref(null);
|
||||
|
||||
@@ -59,9 +59,9 @@
|
||||
watch(
|
||||
() => isDarkMode.value,
|
||||
() => {
|
||||
if (echartsInstance.value) {
|
||||
echartsInstance.value.dispose();
|
||||
echartsInstance.value = null;
|
||||
if (echartsInstance) {
|
||||
echartsInstance.dispose();
|
||||
echartsInstance = null;
|
||||
initEcharts();
|
||||
}
|
||||
}
|
||||
@@ -70,7 +70,7 @@
|
||||
watch(
|
||||
() => dtHour12.value,
|
||||
() => {
|
||||
if (echartsInstance.value) {
|
||||
if (echartsInstance) {
|
||||
initEcharts();
|
||||
}
|
||||
}
|
||||
@@ -103,12 +103,12 @@
|
||||
|
||||
function initResizeObserver() {
|
||||
resizeObserver.value = new ResizeObserver((entries) => {
|
||||
if (!echartsInstance.value) {
|
||||
if (!echartsInstance) {
|
||||
return;
|
||||
}
|
||||
for (const entry of entries) {
|
||||
try {
|
||||
echartsInstance.value.resize({
|
||||
echartsInstance.resize({
|
||||
width: entry.contentRect.width,
|
||||
animation: {
|
||||
duration: 300
|
||||
@@ -131,29 +131,29 @@
|
||||
const chartDom = activityDetailChartRef.value;
|
||||
|
||||
const afterInit = () => {
|
||||
if (!echartsInstance.value) {
|
||||
if (!echartsInstance) {
|
||||
console.error('ECharts instance not initialized');
|
||||
isLoading.value = false;
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
echartsInstance.value.resize({
|
||||
echartsInstance.resize({
|
||||
height: chartsHeight,
|
||||
animation: {
|
||||
duration: 300
|
||||
}
|
||||
});
|
||||
|
||||
echartsInstance.value.off('click');
|
||||
echartsInstance.off('click');
|
||||
|
||||
const options = getNewOption();
|
||||
if (options && options.series && options.series.length > 0) {
|
||||
echartsInstance.value.clear();
|
||||
echartsInstance.value.setOption(options, { notMerge: true });
|
||||
echartsInstance.value.on('click', 'yAxis', handleClickYAxisLabel);
|
||||
echartsInstance.clear();
|
||||
echartsInstance.setOption(options, { notMerge: true });
|
||||
echartsInstance.on('click', 'yAxis', handleClickYAxisLabel);
|
||||
} else {
|
||||
echartsInstance.value.clear();
|
||||
echartsInstance.clear();
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Error in afterInit:', error);
|
||||
@@ -163,8 +163,8 @@
|
||||
};
|
||||
|
||||
const initEchartsInstance = () => {
|
||||
if (!echartsInstance.value) {
|
||||
echartsInstance.value = echarts.init(chartDom, `${isDarkMode.value ? 'dark' : null}`, {
|
||||
if (!echartsInstance) {
|
||||
echartsInstance = echarts.init(chartDom, `${isDarkMode.value ? 'dark' : null}`, {
|
||||
height: chartsHeight,
|
||||
useDirtyRect: props.activityDetailData.length > 80
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user