首先安装
npm install echarts --save
代码:
<template>
<div id="chart" style="width:100%;height:400px;" ></div>
</template>
<script lang="ts">
import { defineComponent, ref } from "vue";
import * as echarts from 'echarts';
import { onBeforeMount, onMounted, onBeforeUpdate, onUpdated, onBeforeUnmount, onUnmounted, onActivated, onDeactivated, onErrorCaptured } from 'vue'
export default defineComponent({
setup() {
onActivated(() => {
// initialize the echarts instance
var myChart = echarts.init(document.getElementById('chart'));
// Draw the chart
myChart.setOption({
title: {
text: '用户增长图'
},
tooltip: {},
xAxis: {
data: ['shirt', 'cardigan', 'chiffon', 'pants', 'heels', 'socks']
},
yAxis: {},
series: [
{
name: 'sales',
type: 'bar',
data: [5, 20, 36, 10, 10, 20]
}
]
});
})
},
});
</script>
网友回复
js如何在浏览器中将一段音频生成带频谱和自定义图片的有声视频?
ai大模型微调为啥说被Agentic 上下文工程(ACE)技术替代了?
如何把ESP+继电器将自家的插座改造成手机远程开关控制?
安卓手机如何虚拟运行windows10及linux操作系统?
python如何利用ai自动在千牛监听和回复用户消息促成用户下单购买?
ai如何自动监听和回复咸鱼的消息?
如何解决three的三维场景CSS3DObject中iframe穿透一切问题呢?
有没有哪个ai人工智能动态生成鲜活带表情肢体动作逼真数字人与人类交流视频聊天?
threejs如何将iframe与video作为立方体模型一面的材质可点击交互?
UEFI与Legacy启动有啥不同?