Vue使用百度图表Echarts无法创建图表,求助!

这是代码:

new Vue({
    el: '#report',
    created() {
        this.getChartOptionsData()
    },
    mounted() {
        this.initCharts()
    },
    data() {
        return {
            statusChartOptions: {
                title : {
                    text: '文件状态统计(饼图)',
                    x:'center'
                },
                tooltip : {
                    trigger: 'item',
                    formatter: "{a} <br/>{b} : {c} ({d}%)"
                },
                legend: {
                    orient: 'vertical',
                    left: 'left',
                    data: []
                },
                toolbox: {
                    feature: {
                        saveAsImage: {}
                    }
                },
                series : [
                    {
                        name: '访问来源',
                        type: 'pie',
                        radius : '55%',
                        center: ['50%', '60%'],
                        data:[],
                        itemStyle: {
                            emphasis: {
                                shadowBlur: 10,
                                shadowOffsetX: 0,
                                shadowColor: 'rgba(0, 0, 0, 0.5)'
                            }
                        }
                    }
                ]
            },
        }
    },
    methods: {
        initCharts() {
            let statusPieChart = echarts.init(this.$refs.stPie);
            statusPieChart.setOption(this.statusChartOptions);
        },
        getChartOptionsData() {
            this.$http.post('/File/getChartOptionsData').then(response => {
                this.statusChartOptions.legend.data = response.data.statusChart.status
                this.statusChartOptions.series = response.data.statusChart.data
            })
        }
    }
});

这是生成的图表,没有表- -!,但是获取的数据都是正常的,不知为何。

clipboard.png

阅读 2.3k
2 个回答

tatusChartOptions.series.data = response.data.statusChart.data
少了个data吧?

新手上路,请多包涵

echarts的使用,需要在dom上指定宽高,不知道你的dom上指定了宽高没有。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题