echarts通用配置

通用配置：指的是任何一种类型的图表都可以使用的配置。

1.通用配置title

（1）文字样式：textStyle

（2）标题边框：borderWidth、borderColor、borderRadius

（3）标题位置：left、top、right、bottom

title: {
　　text: '期末语文考试成绩',
　　// 标题文字
　　textStyle: {
　　　　color: 'red',
　　　　fontStyle: 'normal'
　　},
　　// 标题边框
　　borderWidth: 5,
　　borderRadius: 5,
　　borderColor: 'black',
　　// 标题位置
　　left: 50,
　　top: 10
},

2.通用配置tooltip

　　tooltip：提示框组件，用于配置鼠标滑过或点击图标时的显示框。

　　触发类型：tigger（item、axios）

　　触发时机：triggerOn（mouseover、click）

　　格式化：formatter（字符串模板、回调函数）

tooltip: {
　　// 鼠标移到柱状图上显示具体信息
　　// trigger: 'item',// 只能在柱的内部显示
　　trigger: 'axis', // 在柱的轴上都可以显示

　　// 点击的时候出现柱状图的具体信息
　　triggerOn: "click",

　　// 决定提示框的内容
　　// formatter:'{b}的成绩是{c}'
　　formatter: function (arg) { // arg包含了具体柱状图的信息
　　　　return arg[0].name + "的分数是" + arg[0].data
　　}
},

3.通用配置toolbox

　　toolbox：Echarts提供的工具栏。

        内置有导出图片、数据视图、动态类型切换、数据区域缩放、重置五个工具

toolbox: {
　　feature: {
　　　　saveAsImage: {}, // 导出图片按钮
　　　　dataView: {}, // 数据视图按钮
　　　　restore: {}, // 重置按钮
　　　　dataZoom: {}, // 区域缩放按钮
　　　　magicType: {
　　　　　　type: ['bar', 'line'] // 动态图表类型的切换
　　　　}
}

4.通用配置legend

　　legend：图例，用于筛选系列，需要和series配合使用

　　legend中的data是一个数组

　　legend中的data的值需要和series数组中某组数据的name值一致

//legend要和series的name保持一致
legend: {
　　data: ['语文', '数学']
},
series: [{
　　name: '语文',
　　type: 'bar',
　　data: yDataArr1
}, {
　　name: '数学',
　　type: 'bar',
　　data: yDataArr2
}]