Echarts可视化教程

  1. 网站首页
  2. 百度ECharts
  3. ECharts实例
  4. ECharts入门
  5. 地图大全
  6. ECharts官网

Vue统计图表的如何添加图例说明

<template>
  <div>
    <bar-chart :data="data" :options="options"></bar-chart>
  </div>
</template>
 
<script>
import { Bar } from 'vue-chartjs'
 
export default {
  components: {
    BarChart: Bar
  },
  data() {
    return {
      data: {
        labels: ['January', 'February', 'March', 'April', 'May'],
        datasets: [{
          label: 'Sales',
          backgroundColor: '#f87979',
          data: [120, 191, 13, 35, 42]
        }]
      },
      options: {
        legend: {
          display: true,
          position: 'top'
        },
        scales: {
          yAxes: [{
            ticks: {
              beginAtZero: true
            }
          }]
        }
      }
    }
  }
}
</script>
点击展开全文

相关文章

  1. Vue统计图表三维立体3D和旋转效果的优化
  2. PHP如何结合Vue处理大数据集的统计图表
  3. 如何在Vue的框架下快速搭建统计图表?
  4. 如何用Vue实现文本数据的统计图表
  5. 如何使用Vue实现统计图的实时更新