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

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

  • Golang使用Alpine基础镜像问题

    Golang如果直接使用Alpine基础镜像进行打包，在运行的时候会出现如下问题：standard_init_linux.go:211: exec user process caused "no such file or directory"

  • OpenCV-Python读取、显示和保存图片

    OpenCV-Python读取、显示和保存图片，主要介绍如下函数的使用：imread、imshow、imwrite。读取图片使用imread函数，注意：opencv读取图片，默认颜色通道是BGR，而不是RGB。使用imshow函数即可，第一个参数表示窗口名称，第二个参数就是要显示的图像。保存图片使用imwrite函数， 第一个参数为要保存的路径和名称，第二个参数为图片，最后一个参数为可选项。

  • Shell脚本打包Go、Vue和上传至Docker仓库记录

    有时候为了打包需要敲很多命令，实在比较麻烦，所以这里记录了如何通过shell脚本将这些命令全部集中起来，后面可以直接执行该脚本就把需要的所有命令跑完。

  • OpenCV-Python图像金字塔：拉普拉斯金字塔

    OpenCV-Python图像金字塔：拉普拉斯金字塔

点击排行

友情链接