VUE中关于echart表的一系列问题以及解决方法

1、具体问题是这样：

两个表的宽度明显有问题，内容显示不全，解决办法：不要用百分比，用px固定死。

2、折线图有时候内容显示不全，解决办法：

将width设小一点。

2、多折线图有时数据明明是一样的，但数据点就是不会重合，解决办法：

将stack删掉（name自己定）。

4、饼状图图和标注的距离

可以通过来控制（y也是同理）。

5、从后端获取数据并生成图表，解决方法：

将获取数据的操作写在生成图表的方法里面，像这样

框里面折叠起来的内容就是从后端获取数据，并根据图表需要对获取到的数据进行处理。

我之前在方法外面单独写了一个getData（）方法用来获取和处理数据，将处理好的数据放到图表的方法中发现无法生成图表，但随便写了一个假数据放到图表的方法中又可以生成图表，说明图表方法本身没有问题。

6、现在有一个需求，点击不同阶段的按钮，图表上生成的图也随之变化，问题是阶段按钮的个数和名称都无法确定，也就是说前端不可以写死，只能从后端获取，像这样

 由于除了数据，图表没有任何变化，所以我的做法是根据点击按钮获取不同阶段的数据，但只写一个图表方法，只改变图表的数据，和第五条一样，获取数据的操作要写在图表方法里面，再在按钮上绑定获取图表的方法，像这样

 ，最好加一条clear（）语句

 

7、v-charts柱状图X轴因数据太多，导致X轴字段显示不全。

解决办法：将X轴字段显示改成斜体或者垂直显示。

v-charts X轴垂直显示代码如下：

v-charts X轴倾斜显示代码如下：

 

此方法转载于v-charts柱状图X轴因数据太多，导致X轴字段显示不全。解决办法：将X轴字段显示改成斜体或者垂直显示。_大波萝波的博客-CSDN博客