vue中用echarts写条形图

最新推荐文章于 2024-06-17 23:34:16 发布

一名爱记录的程序媛

最新推荐文章于 2024-06-17 23:34:16 发布

阅读量1.2k

点赞数

分类专栏：笔记文章标签：大数据 echarts

本文链接：https://blog.csdn.net/qq_62449212/article/details/125719891

版权

vue中用echarts实现条形图

实现效果图如下：

实现代码如下所示：

<template>
    <div id="main1" style="width: 32.9%;height:400px;"></div>
</template>
<script>
    import * as echarts from 'echarts';
    export default {
        data(){
            return{
                sexData: [
                    {
                        type: 'bar',
                        data: [48000, 49000, 47000, 40000, 27000, 44000]
                    }
                ],
            }
        },
        mounted() {
            this.ageChart();
        },
        methods:{
            ageChart() {
            var myChart = echarts.init(document.getElementById('main1'));
            var option = {
                title: {
                    text: '年龄分布'