zoukankan      html  css  js  c++  java
  • 在vue的移动端项目中使用vue-echarts

    1、看官网,按照官网的步骤来

    2、关于移动端的自适应问题

         用到的是echarts中的resize()方法,具体步骤如下

        由与vue-echarts中用到的是v-chart标签,所以使用方法与echarts中的使用又有点儿不同

        

    // 结构
    <div style="height:300px;100%;padding-top:40px;"> <!-- <v-chart :options="polar" /> --> <!-- 折线图 --> <v-chart ref="mypolar" :options="line" id="myLine" /> <!-- 柱状图 --> <!-- <v-chart :options="bar" /> --> </div>

      

    // 在methods中 
    resizeChart() {
          if (this.$refs.myline) {
            this.$refs.myline.resize()
            console.log('1111')
          }
          if (this.$refs.mypolar) {
            this.$refs.mypolar.resize()
            console.log('222')
          }
        }
    

      

    // 在mounted中调用
    mounted() {
        window.addEventListener('resize', this.resizeChart)
        // this.drawLine()
      }

    3、待补充其他的

  • 相关阅读:
    Dockerfile
    走进Docker
    liunx 设置定时任务
    《程序员自我修养》读书笔记
    Ubuntu换源
    liunx安装python2.7.12
    预习非数值数据的编码方式
    预习原码补码
    第三章预习
    预习非数值数据的编码方式
  • 原文地址:https://www.cnblogs.com/Roxxane/p/13512755.html
Copyright © 2011-2022 走看看