场景
使用 v-charts 做数据可视化，需要给图表添加标题。
解决方法
v-charts本身并没有提供显示标题的配置，顾需要引入 echarts 的 title 。
实现
引入title
1
|
import "echarts/lib/component/title";
|
添加标题配置
1
2
3
4
5
6
7
|
this.chartTitle = {
text: "平台用户与创客数量对比图",
textStyle: {
fontWeight: 600,
color: "white"
}
};
|
使用
1
|
<ve-bar :title="chartTitle" />
|
完整实现
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
|
<template>
<ve-bar ... :title="chartTitle" />
</template>
<script>
import "echarts/lib/component/title";
export default {
data() {
this.chartTitle = {
text: "平台用户与创客数量对比图",
textStyle: {
fontWeight: 600,
color: "white"
}
};
}
};
</script>
|
echarts配置手册
参考文章