当前位置:网站首页>[echart] resize lodash 实现窗口缩放时图表自适应
[echart] resize lodash 实现窗口缩放时图表自适应
2022-07-05 15:49:00 【533_】
<template>
<div ref="chart" class="chart" />
</template>
import echarts from 'echarts';
import {
debounce } from 'lodash';
echarts里面的resize() + 节流
data() {
return {
chart:null
};
},
mounted() {
this.init();
// lodash.debounce 防抖
this.resizeHandler = debounce(() => {
if (this.chart) {
this.chart.resize();
}
}, 100);
// 监听resize
window.addEventListener('resize', this.resizeHandler);
},
beforeDestroy() {
window.removeEventListener('resize', this.resizeHandler);
},
methods: {
init() {
this.chart = echarts.init(this.$refs.chart);
const option = {
......
};
this.chart.setOption(option);
},
},
边栏推荐
- 视觉体验全面升级,豪威集团与英特尔Evo 3.0共同加速PC产业变革
- 18.[stm32] read the ROM of DS18B20 temperature sensor and realize multi-point temperature measurement
- Cartoon: what is MapReduce?
- yarn 常用命令
- 五种常见的咨询公司谈判策略以及如何维护自己的利益
- Use of RLOCK lock
- Reduce the cost by 40%! Container practice of redis multi tenant cluster
- Using graylog alarm function to realize the regular work reminder of nail group robots
- 阿掌的怀念
- Cartoon: what is distributed transaction?
猜你喜欢
Batch update in the project
Research and practice of super-resolution technology in the field of real-time audio and video
Research and development efficiency measurement index composition and efficiency measurement methodology
The visual experience has been comprehensively upgraded, and Howell group and Intel Evo 3.0 have jointly accelerated the reform of the PC industry
开发中Boolean类型使用遇到的坑
Flet教程之 12 Stack 重叠组建图文混合 基础入门(教程含源码)
通过的英特尔Evo 3.0整机认证到底有多难?忆联科技告诉你
17. [stm32] use only three wires to drive LCD1602 LCD
单商户 V4.4,初心未变,实力依旧!
《21天精通TypeScript-3》-安装搭建TypeScript开发环境.md
随机推荐
sql中查询最近一条记录
记一次'非常诡异'的云安全组规则问题排查过程
yarn 常用命令
漫画:什么是分布式事务?
The new version of effect editor is online! 3D rendering, labeling, and animation, this time an editor is enough
Mongodb getting started Tutorial Part 04 mongodb client
Cartoon: what is service fusing?
Li Kou today's question -729 My schedule I
Research and practice of super-resolution technology in the field of real-time audio and video
Why should we learn mathematical modeling?
Using graylog alarm function to realize the regular work reminder of nail group robots
[Netease Yunxin] research and practice of super-resolution technology in the field of real-time audio and video
[vulnerability warning] cve-2022-26134 conflict Remote Code Execution Vulnerability POC verification and repair process
研发效能度量指标构成及效能度量方法论
Cs231n notes (top) - applicable to 0 Foundation
Convert obj set to entity set
移动办公时如何使用frp内网穿透+teamviewer方式快速连入家中内网主机
Seaborn draws 11 histograms
The visual experience has been comprehensively upgraded, and Howell group and Intel Evo 3.0 have jointly accelerated the reform of the PC industry
英特尔第13代Raptor Lake处理器信息曝光:更多核心 更大缓存