vue+echarts模板

模板内这样写

<template>
    <div :id="id" :style="{width: width, height: height}">
    </div>
</template>
<script>
export default {
    data() {
        return {

        }
    },
    props:{
        chartData:{
            type:Object,
            default:()=>{
                return {
                    time:['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
                value1:[150, 230, 224, 218, 135, 147, 260],
                value2:[350, 330, 324, 318, 335, 347, 360],
                name1:"",
                name2:""
                }
            }
        },
        id:{
            type:String,
            default:()=>{
                return new Date().getTime().toString()
            }
        },
        width:{
            type:String,
            default:"700px"
        },
        title:{
            type:String,
            default:"图表曲线"
        },
        height:{
            type:String,
            default:"300px"
        }

    },
    mounted() {
        this.chartinit()
    },
    methods: {
        chartinit(){
            let myChart = this.$echarts.init(document.getElementById(this.id))
            var option;

            option = {
                tooltip: {
                    trigger: 'axis'
                },
                title: {
                    text: this.title,
                    left:"6%"
                },
                xAxis: {
                    type: 'category',
                    data: this.chartData.time
                },
                color:["rgb(99,149,249)","rgb(98,218,171)"],
                yAxis: {
                    type: 'value'
                },
                series: [
                {
                    name:this.chartData.name1,
                    data: this.chartData.value1,
                    type: 'line'
                },
                {
                    name:this.chartData.name2,
                    data: this.chartData.value2,
                    type: 'line'
                }
                ]
            };
            option && myChart.setOption(option);
        }
    }
}
</script>

模板外这样写