首页 > 编程语言 >微信小程序使用echarts动态设置宽高

微信小程序使用echarts动态设置宽高

时间:2023-08-01 11:13:03浏览次数:30  
标签:微信 chart 宽高 getWindowInfo echarts resize

微信小程序中动态设置了echarts的高度,但是canvas变形,并没有重新resize

原因

chart获取不到父组件的宽高,小程序里获取宽高用的是 wx.createSelectorQuery() ,echarts里resize的时候,并没有调用这个API,肯定无法重置宽高。

解决

if (chart) {
  const getWindowInfo = uni.getWindowInfo();
  chart.clear();
  chart.setOption(option);
  chart.resize({
    width: getWindowInfo.screenWidth,
    height: pieEchartsHeight,
  });
}

注意

chart.resize必须传入宽高,宽 and 高!!!

标签:微信,chart,宽高,getWindowInfo,echarts,resize
From: https://www.cnblogs.com/ZerlinM/p/17595935.html

相关文章

  • vue循环生成echarts图表
    1.效果图2.引入echartsnpminstallecharts--save3.main.js全局引入4.页面data数据是从后台接口中返回的,需要通过watch监听来获取created方法中获取到的数据。用mounted由于是异步调用,是获取不到created中的数据的。4.后台数据我这里是根据实际业务场景返回的map......
  • 微信开发机器人
    请求URL:http://域名地址/addChatRoomMember请求方式:POST请求头Headers:Content-Type:application/jsonAuthorization:login接口返回参数:参数名必选类型说明wId是string登录实例标识chatRoomId是String群userList是String群成员微信id,多个已","分割返回数据:参数名类型说明codestring1......
  • 微信 H5 页面兼容性——复制到剪贴板
    在开发微信H5页面时,时常会遇到难以解决的兼容性问题,现收集问题和解决方案,以备后用。在PC浏览器和手机移动端浏览器中,WebAPI提供了两种方式:1.1.Document.execCommand()方法Document.execCommand()是操作剪贴板的传统方法,各种浏览器都支持。它支持复制、剪切和粘贴这三......
  • webpack项目本地dev环境正常,部署至微信字体或图片报cors
    由于webpack设置了高于xxx大小的文件不打包,又与小程序平台的域名不一致导致的问题。修改limit,将其调大,以base64方式直接嵌在页面中(字体文件也适用)......
  • echarts 自定义提示框
    consttooltip=(params,echartsBarData)=>{constresult=params.map((item,index)=>{conststr=item.name.substring(0,1);if(echartsBarData[index].drugNameCosList){constdata=echartsBarData[index].drugNameCosList.filter(......
  • 微信开发之自动添加好友的技术实现
    E云 是一套完整的的第三方服务平台,包含微信API服务、企微API服务、SCRM系统定制、企微系统定制、服务类软件定制等模块,本文档主要讲述个微API服务相关,以下简称API,它能处理用户微信中的各种事件,提供了开发者与个微对接的能力,技术上来讲是一款基于微信提供的个人开放性API,使用简单,......
  • 最大最小宽高
    最大最小宽高最大宽度:max-width,最大高度:max-height最小宽度:min-width,最小高度:min-height当一个元素的尺寸会自动变化时,设置最大最小宽高,可以让它不至于变得过小或过大。在实际开发中,我们通常为PC端的页面设置一个最小宽度,通常此宽度为设计稿的宽度html{min-width:1226......
  • uniapp之微信小程序打包上线
    前言本文旨在打通uniapp上线微信小程序之任督二脉,其实之前在uniapp专题学习中已经打包过一次。这一次算是复习,复习的同时也以博客的方式记录一下。......
  • 垃圾慧分类微信小程序_基于图像识别、语音识别的垃圾分类小程序
    垃圾分类小程序了解垃圾分类2019年7月1日起上海就要开始正式执行《上海市生活垃圾管理条例》,真的。。。不是开开玩笑随便执行如果依旧混合投放垃圾,拒不整改个人最高可罚款200元企业单位最高罚款5万元。所以魔都的朋友都开始努力复习垃圾分类干的东西不一定就是干垃圾湿的不一定就是......
  • 微信小程序相关
    1、框架选型原生微信小程序写法uniapp-clivue写法uniapp-hBuildXxue写法上述三个选项一般使用下方两个;毕竟在不修改代码写法的基础上,很易上手2、UI选型uView-移动端多端开发mintUI-饿了么团队mui-停止维护了vant-有赞前端团队目前在实际业务开发中使用过的只有uview和......