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

xiaohai 2020-10-27 10:41:28 共4530人围观 标签： 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

相同类型文章

热门标签

每日一句

    没有医保和寿险的，天黑后不要见义勇为。

    ——周立波

今日排行

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

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

  • PHPStrom、PyCharm清理Git密码

    在使用jetbrains的工具PHPStrom和PyCharm的Git功能，有时候记住了密码，但是当遇到需要切换提交用户的时候我们可以将记住的信息清理掉，这里做一个备注。

  • Mongodb根据日期字符串分组查询和Golang中的使用

    在Golang编程中，经常会用到MongoDB数据库进行查询，但是当日期是一个字符串的时候，如何根据日期进行分组查询呢？本文将记录如何分组查询统计。

  • Centos中用Chrome将网页导出为PDF

    Centos中用Chrome将网页导出为PDF，chrome --headless --print-to-pdf https://developer.chrome.com/

  • 图片视频下载利器：you-get

    you-get是一个基于Python的开源命令行工具，主要用于下载来自多个视频网站的视频、音频和图片资源。它支持YouTube、Bilibili、Vimeo等平台，可通过简单命令快速获取下载链接并支持自定义保存路径和格式。 ‌

点击排行

友情链接