ECharts 是一个使用 JavaScript 实现的开源可视化库，涵盖各行业图表，满足各种需求。

之前一直都知道echarts的存在，偶尔也会在修改一些前端代码的时候修改一些他们已含的echarts控件！

不过说实话，确实从来没有去认真的研究了解过echarts可视化！

大家都知道，我应该属于后端语言的开发者，不过这两天现老板交给了我一个前端开发的任务，就是为公司的系统项目制作一个数据大屏！

所谓数据大屏，数据可视化监控大屏幕，可以打破数据隔离，通过数据采集、清洗、分析到直观实时的数据可视化，即时呈现隐藏在瞬息万变且庞杂数据背后的业务洞察。通过交互式实时数据可视化大屏来实时监测企业数据，洞悉运营增长，助力智能高效决策。

数据可视化的本质是视觉对话,数据可视化将数据分析技术与图形技术结合,清晰有效地将分析结果信息进行解读和传达。

做数据大屏，离不了echarts的使用！

如果第一次使用echarts，感觉一脸懵然，如果是官方提供的现有的直接拿来用，貌似还好点，但是如果需要做些改动，可怎么下手？

今天，河洛伊哥就跟大家分享一些经验！

要使用echarts，就不得不先了解echarts的网站！

https://echarts.apache.org/zh/option.html#title 这个就是echarts的官方文档！

当然，runoob也提供了一部分教程！

https://www.runoob.com/echarts/echarts-tutorial.html

这里简单的分享几个点！

1.legend的开关和颜色修改

legend: {

       show: true,  //true为显示  false为不显示

       orient: 'vertical',

       top: 'bottom',

       left: 'right',

       data: ['地点', '线路'],

       textStyle: {

          fontSize:18, //字体大小

           color: '#fff'  //字体颜色

       }

    }

2.x轴或y轴文本字体颜色改变

yAxis: {

       type: "category",

       inverse: true,

       axisLine: {show: false},

       axisTick: {show: false},

       axisLabel: {

           fontSize: 12,

           color: "#b0c2f9"

       }

    }

Echarts属性trigger:axis、axisPointer效果展示 https://blog.csdn.net/qiudechao1/article/details/97394096