v-charts细节调整之实战

近期平台接入了报表功能，因为前端平台使用的是vue，于是乎这块选择引入v-charts。期间因数据的种类各不相同，这篇文章针对这些细节处理做一个整理。

v-charts

在使用 echarts 生成图表时，经常需要做繁琐的数据类型转化、修改复杂的配置项，v-charts 的出现正是为了解决这个痛点。v-charts的使用也非常的方便，大家可以阅读官方的文档。
指路文档：https://v-charts.js.org/#/

实战

1、坐标轴数据倾斜

因为有些数据长度过长，且数据过多，无法显示完全。加入下面这个配置，可以使你的数据显示时倾斜45°。

<ve-line :data="cpuData" :extend="cpuExtend"></ve-line>
<script>
  export default {
   
   
     data() {
   
   
       return{
   
   
         cpuExtend: {
   
    'xAxis.0.axisLabel.rotate': 45}
       }
     }
  }
</script>

2、坐标轴数据倾斜导致两边数据部分缺失