v-charts 爬坑一 v-charts如何对图表的样式属性进行设置

昨天在使用v-charts时，设置不同项的区域颜色时，遇到困难，网上查了一些资料大部分都是引入e-charts，再进行设置。由于是公司项目，不能再引入echarts。还好在github中找到了作者的方案。这是链接https://github.com/ElemeFE/v-charts/issues/468#issuecomment-410660972https://github.com/ElemeFE/v-charts/issues/468#issuecomment-410660972

对图表样式属性的设置可以按照使用场景选择下面适合的方案：
a. 在组件上直接定义属性 demo，这种方式会覆盖 v-charts 内部生成的 options 对应的属性
b. 使用 afterConfig 属性 demo，在 afterConfig 中可以获取到 v-charts 内部生成的 options，可以按照需求修改原有的，或者增加新的属性，之后返回即可
c. 使用 extend 属性 demo，extend 是一个功能较全面的属性，接受下面三种赋值的形式:

1. 对象形式会将对象与 options 中对应属性进行合并

this.chartExtend = {
  series: {
    show: true
  }
}

1. 函数形式会将函数的返回值传递给对应的属性

this.chartExtend = {
  series (optionsSeries) {
    optionsSeries[0].show = true
    return optionsSeries
  }
}

1. 路径形式会创建对应路径的值

this.chartExtend = {
  'series.0.axisLabel.rotate': 45,
  'tooltip.trigger': 'axis'
}