Install the Echarts directive

npm install echarts --save
Copy the code

Template writes the div tag

<div> <div id="myChart" :style="{width: '100%', height: 0; '300px' }"></div> </div> <template>Copy the code

Using Echarts under Vue3 Setup

<script setup> import * as echarts from "echarts"; OnMounted () => {setTimeout(() => {line(); setTimeout() => {line(); }, 1000); }); const line = () => { let myChart = echarts.init(document.getElementById("myChart")); myChart.setOption({ xAxis: { type: "category", data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"], }, yAxis: { type: "value", }, series: [ { data: [150, 230, 224, 218, 135, 147, 260], type: "line", }, ], }); Window.onresize = function () {// myChart.resize(); }; }; </script>Copy the code