|
@@ -2,46 +2,17 @@
|
|
|
<!--结果对比 -->
|
|
|
<div class="result_left">
|
|
|
<h1>我是Left组件</h1>
|
|
|
- <div id="myEcharts" class="bie" style="width: 400px; height: 400px;"></div>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
|
|
|
import { onMounted, ref } from 'vue';
|
|
|
-import * as echarts from 'echarts';
|
|
|
-const echartInit = () =>{
|
|
|
- console.log(111122222);
|
|
|
- var myChart = echarts.init(document.getElementById('myEcharts'));
|
|
|
- // 指定图表的配置项和数据
|
|
|
- var option = {
|
|
|
- title: {
|
|
|
- text: 'ECharts 入门示例'
|
|
|
- },
|
|
|
- tooltip: {},
|
|
|
- legend: {
|
|
|
- data:['销量']
|
|
|
- },
|
|
|
- xAxis: {
|
|
|
- data: ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]
|
|
|
- },
|
|
|
- yAxis: {},
|
|
|
- series: [{
|
|
|
- name: '销量',
|
|
|
- type: 'bar',
|
|
|
- data: [5, 20, 36, 10, 10, 20]
|
|
|
- }]
|
|
|
- };
|
|
|
- // 使用刚指定的配置项和数据显示图表。
|
|
|
- myChart.setOption(option);
|
|
|
- window.onresize = () => {
|
|
|
- myChart.resize()
|
|
|
- }
|
|
|
|
|
|
- }
|
|
|
+
|
|
|
|
|
|
onMounted(() => {
|
|
|
- // echartInit();
|
|
|
+
|
|
|
});
|
|
|
</script>
|
|
|
<style scoped>
|