Incubator-echarts: 使用最新版本的echarts在vue环境下报错

Created on 27 Dec 2017  ·  6Comments  ·  Source: apache/incubator-echarts

One-line summary [问题简述]

在vue中使用最新的echarts.在使用setOption的时候报"TypeError: Cannot read property 'get' of undefined"

Version & Environment [版本及环境]

  • ECharts version [ECharts 版本]:v3.8.4

代码

export default {
  props: {
    mheight: {
      type: String,
      default: '300px'
    },
    mwidth: {
      type: String,
      default: '100%'
    },
    moption: Object
  },
  data () {
    return {
      style: {
        height: '',
        width: '',
        // background: 'lightskyblue',
        minWidth: '200px',
        margin: '2px 4px'
      },
      e: null,
      option: {
        title: {
          text: 'title'
        },
        // legend: {

        // },
        // tooltip: {

        // },
        series: [
          {
            type: 'line',
            name: '',
            data: []
          }
        ]
      }
    }
  },
  mounted: function () {
    this.$nextTick(() => {
      this.style.height = this.mheight
      this.style.width = this.mwidth

      let temp = echarts.init(this.$refs.echarts, 'macarons')
      temp.setOption(this.option)
    })
  }
}

Most helpful comment

问题已解决。line类型需要指定x轴和y轴。不然会报这个错

All 6 comments

能具体点描述错误的复现环境和错误信息么?

就是用vue-cli创建的一个工程vue init webpack testa

错误信息
image

如果用这种写法this.e.setOption({title: {text: 'hello'}})就不会报错,但是不会看到title.

请问新版本引入需要做什么修改吗.我有另一个项目,用了老版本不会出现这种问题

完整的 option 是?是不是有组件没引入

有引入的,使用import echarts from 'echarts'
option

      option: {
        title: {
          text: 'title'
        },
        // legend: {

        // },
        // tooltip: {

        // },
        series: [
          {
            type: 'line',
            name: '',
            data: []
          }
        ]
      }

老版本option缺的话,也不是报get错误的,会提示比如series缺少type之类的啊

问题已解决。line类型需要指定x轴和y轴。不然会报这个错

问题已解决。line类型需要指定x轴和y轴。不然会报这个错

series: [
{
// lineStyle: { color: "rgb(0, 157, )" },
xAxisIndex: 0,
yAxisIndex: 0,
name: "sig1_name",
smooth: true,
type: "line",
data: sig2_list
}
] 我的有指定也是报这样的错

Was this page helpful?
0 / 5 - 0 ratings

Related issues

jarben picture jarben  ·  3Comments

hanhui picture hanhui  ·  3Comments

antorman picture antorman  ·  3Comments

Cyycl picture Cyycl  ·  3Comments

kirazxyun picture kirazxyun  ·  3Comments