Use Echarts in Vue projects

Install Echarts dependencies

npm install echarts -S
Copy the code

Create a chart

In the main. In js

Prototype.$Echarts = Echarts.$Echarts = EchartsCopy the code

In the index. In vue

<template> <div id="myChart" :style="{width: '500px', height: '500px'}"></div> </template> <script> export default { data () { return { } }, mounted(){ this.drawLine(); }, methods: $echarts.init(document.getelementById ('myChart')) {// initialize Echarts instance let myChart = this.$echarts.init(document.getelementById ('myChart') Mychart.setoption ({title: {text: 'simply use Echarts in Vue'}, Tooltip: {}, xAxis: {data: [" shirt "and" sweater ", "snow spins unlined upper garment", "pants", "high heels", "socks"]}, yAxis: {}, series: [{name: 'sales' type:' bar 'data: [5, 20, 36, 10, 10, 20]}]}) } } } </script>Copy the code

Complete the image above: