【html设置字体大小】vue实战开发019:Echarts修改各种标签的字体大小

Echarts是在Vue中设计图表的强大插件，是用纯Javascript创建的图表库，提供多种图表样式。Echarts使您能够快速完成数据可视化任务，这些图标是非常高和专业的图标。

为了找到合适的模板，通常我们会在Echarts实例中找到一些合适的图标然后在线修改下参数看看是否能满足项目需求，如果合适的话我们就可以把这个实例下载下来再自行修改模板以符合自己的需求，我在设计原型的时候需要用到些图表来展示，所以这里我只需要修改下图表样式即可，接下来需要修改下图标中的字体大小。

标题字体大小修改：

在option中的title下添加textStyle对象，在样式中写入 fontSize即可，x:'left', //靠左显示 ，如果你想居中显示，把left改成center即可

textStyle:{ fontSize:32, //字体大小 },

坐标字体大小修改 ：

在option中找到xAxis和yAxis对象，在对象中分别添加axisLabel对象，并在对象中添加textStyle对象，在样式中写入 fontSize即可

axisLabel:{ textStyle:{ fontSize:25 } }

标签字体大小修改 ：

修改series中的label字体大小，在label添加normal对象，接着在添加textStyle对象，在样式中写入 fontSize即可。

图例字体大小修改：

在option中找到legend对象，在对象中添加textStyle对象，在样式中写入 fontSize即可。orient: 'vertical',调整图例为垂直样式，通过top、left、right、bottom等属性控制图例位置即可。

legend: { bottom: 10, left: 'center', data: ['西凉', '益州','兖州','荆州','幽州'], textStyle:{ fontSize:28, } },

饼状图数据标签字体大小修改：

在option中的series中，数据一般存放在data中，一般以键值对的形式展示， 如{value:535, name: 'LH-B3-1F'},现在我们要修改的是数据中显示的name，在itemStyle新增normal对象，在label中添加textStyle对象，在样式中写入 fontSize即可。