echarts的resize修改,谐波在线监测点重新布局
This commit is contained in:
@@ -15,6 +15,8 @@ const chartRef = ref<HTMLDivElement>()
|
||||
const props = defineProps(['options'])
|
||||
let chart: echarts.ECharts | any = null
|
||||
const resizeHandler = () => {
|
||||
// 不在视野中的时候不进行resize
|
||||
if(chartRef.value!.offsetHeight == 0) return
|
||||
chart.getZr().painter.getViewportRoot().style.display = 'none'
|
||||
requestAnimationFrame(() => {
|
||||
chart.resize()
|
||||
@@ -197,13 +199,25 @@ const handlerXAxis = () => {
|
||||
}
|
||||
}
|
||||
}
|
||||
let throttle: ReturnType<typeof setTimeout>
|
||||
// 动态计算table高度
|
||||
const resizeObserver = new ResizeObserver(entries => {
|
||||
for (const entry of entries) {
|
||||
if (throttle) {
|
||||
clearTimeout(throttle)
|
||||
}
|
||||
throttle = setTimeout(() => {
|
||||
resizeHandler()
|
||||
}, 100)
|
||||
}
|
||||
})
|
||||
onMounted(() => {
|
||||
initChart()
|
||||
window.addEventListener('resize', resizeHandler)
|
||||
resizeObserver.observe(chartRef.value!)
|
||||
})
|
||||
defineExpose({ initChart })
|
||||
onBeforeUnmount(() => {
|
||||
window.removeEventListener('resize', resizeHandler)
|
||||
resizeObserver.unobserve(chartRef.value!)
|
||||
chart?.dispose()
|
||||
})
|
||||
watch(
|
||||
|
||||
Reference in New Issue
Block a user