百度echart resize的坑

需求：根据数据量的大小，动态调整echart柱形图的宽度。

实现构想：根据数据的size调整div的大小，然后调用echart对象的resize方法重置柱状图的宽度：

                // 图的大小动态自动调整let compactWidth = data.size*32;let width = compactWidth < 1860 ? 1860 : compactWidth;this.chartStyle.width = width + "px";vueVisit.visitChart.resize();

碰到的问题：柱状图并没有动态的改变了宽度，而是下次再调整一次才生效。

原因分析：应该是echart渲染或者读取div的宽度什么的延迟了。。。

解决方法：延时100毫秒再调用echart对象的resize方法：

                // 图的大小动态自动调整let compactWidth = data.size*32;let width = compactWidth < 1860 ? 1860 : compactWidth;this.chartStyle.width = width + "px";setTimeout(function(){vueVisit.visitChart.resize();}, 100); //需要一个延迟，resize()才能生效

百度echart resize的坑相关推荐

镇江SEO外包：如何识别百度免费收录的坑？
对于在镇江做SEO而言,我们通常情况下,由于人力资源与时间精力有限,我们通常选择镇江SEO外包,将自己的业务,交给镇江SEO机构,代理完成. 但在实际交流与沟通的过程中,镇江SEO外包的相关团队经常会 ...
2021-08-21-智能/百度小程序踩坑
智能小程序/百度小程序踩坑-客服功能 1.智能小程序接入客服服务非常简单,但是我第一次搞客服功能认为就跟h5一样直接引入第三方的服务,然后使用调用js文件就可以了,但是,在小程序中只能使用官方提供的客 ...
一个很奇怪的 OpenCV出错：resize的坑
简介: 在cv2.resize中会存在很多"坑".但对象的数据格式不是"float"造成出错,给出的提示非常具有迷惑性.注意这一点会使得后面的编程更加的愉快. ...
百度地图sdk踩坑之旅
1.写在前面项目中需要加上路线规划,导航,添加覆盖物,因为我最开始项目中定位我使用的是百度定位,所以为了省事,接着使用百度地图sdk实现这些.这两天踩了很多百度地图的坑,记下来.因为一些原因,后面会 ...
百度echart柱图、折线图、饼图、Map类型等类似视图的动态加载数据
这几天接触的一个项目需要使用到百度的echart,所以简单查找并实验了几款比较简单且适用性较广的例子,做了几个简单的Demo,一来是对echart有所了解,二来也是记录一下,方便以后进一步的优化. 首 ...
百度上线APP签名坑
一不小心不知道keystore文件放哪了~ So,就踏上了更改签名的坑,在此记录一下有用的东西一.查看上线签名二.查看keystore签名命令 : keytool -list -v -keyst ...
android 接百度SDK遇到的坑（百度地图BD09经纬度转高德地图GCJ02经纬度）
百度转高德==> /*** 百度坐标系 (BD-09) 与火星坐标系 (GCJ-02)的转换* 即百度转谷歌.高德** @param latLng* @returns*/public s ...
虚拟机Linux上网ping百度跳过的坑，亲测有效
生成网卡ifconfig ens34 192.168.254.195重启后失效(与桥接的物理机网段相同即可) 首先查询网卡mac地址00:50:56:20:79:c8 bash-4.2# ip add ...
百度Echart 地图
使用百度地图做一个全国地图数据分析的功能,如下图代码 <%@ Page Language="C#" AutoEventWireup="true" Cod ...
vue3 使用百度地图，踩坑日历
vue中使用百度地图,之前使用的是vue-baidu-map组件,在vue2中引入完全能正常使用,但是引入到vue3项目中,BMap is not defined频繁报错.. 官方地址:Vue Bai ...

百度echart resize的坑

百度echart resize的坑相关推荐

最新文章

热门文章