echarts在默认隐藏的div中不显示的问题

xiaohai 2020-10-27 10:41:28 共4027人围观 标签： js 
简介这两天一直遇到一个问题，就是Echarts如果放在一个默认隐藏的div元素中，后面再显示这个div，但是图标不出来，找了很多博客，原来是高度没有设置。

问题：希望在点击一个按钮后显示图表，所以需要先将图表进行隐藏，但是点击显示后，图表却不显示，找了很多原因，有些说需要调用resize函数，但是没有任何作用。最终的原因是因为ECharts没有获取到div的高宽而导致初始化失败。所以只需要把div的高度设置好即可。

如：

    <!--折线图-->
    <Drawer title="图表"
            :closable="false"
            v-model="examLineEchart"
            width="840">
      <chart-line style="height: 300px;width:840px;"
                  :value="examEchartData"
                  ref="examLineEchartRef" />
    </Drawer>

image.png

相同类型文章

热门标签

每日一句

    伟大的科学者在实验室里的生活，是对物体和对周围一切的执着地斗争。

    ——居里夫人

今日排行

  • VSCode插件 - 快速生成表格并格式化

    快速生成表格

  • 网页扫描二维码库：Html5-Qrcode

    网页扫描二维码库：Html5-Qrcode，官网地址：https://scanapp.org/html5-qrcode-docs/

  • yarn、npm配置阿里云国内镜像（新镜像）

    nodejs中使用npm和yarn，使用最新阿里云镜像 aliyun mirror，网上很多还是文章用的是下面这个地址~~yarn config set registry https://registry.npm.taobao.org~~

  • 《康熙王朝》经典对白

    《康熙王朝》是一部非常优秀的电视连续剧，陈道明演的康熙是我觉得最有帝王气魄，让人意犹未尽，本文主要记录一小段非常经典的对白。

  • HI博客上线啦！

    HI博客上线啦！这一刻不知道等待了多少年，做为以为技术开发人员，没有自己的博客怎么能行呢！最近利用换工作的空余的时间，为自己搭建了该博客，也在自己人生中很重要的日子上线了该博客。也希望该博客能将自己在工作中比较好的技术整理成文章和一些其他比较好文章转载过来，为需要用到相关技术的同行提供有用的帮助。还希望以后大家能指出相关文章中出现的错误，让看到相关博文的人受益，别被我的个人错误而误导他人。

点击排行

友情链接