v-charts

最新推荐文章于 2024-03-20 09:49:06 发布

qq_45505241

最新推荐文章于 2024-03-20 09:49:06 发布

阅读量269

点赞数

分类专栏： v-charts

本文链接：https://blog.csdn.net/qq_45505241/article/details/108026885

版权

v-charts 专栏收录该内容

0 篇文章 0 订阅

订阅专栏

// 先引入
import VeRing from 'v-charts/lib/ring.common'
import VeGauge from 'v-charts/lib/gauge.common'
import VeHistogram from 'v-charts/lib/histogram.common'
// 注册
components: {
            VeRing, VeGauge, VeHistogram
        },
// 静态页面
<ve-histogram :data="chartData1" v-loading="loading1" :settings="chartSettings1" />
// data里的配置数据；注意配置项的位置（官方文档是写在return外边的，最好写在return里面，这样是响应式的）
data() {
this.chartSettings1 = {
                showLine: ['同比增长率'], // 用折现图展示的数据
                axisSite: { right: ['同比增长率'] }, //显示右侧的y轴
                yAxisType: ['normal', 'percent'], //左侧的y轴用正常的数据显示，右侧的y轴用百分比的样式显示
            }
return{
chartData1: {
                    columns: ['日期', '2019', '2020', '同比增长率'],
                    rows: [
                    {日期:'2020-08',2019:'100',2020:'150',同比增长率:'0.5'}
                    ]
                },
}
}