一、饼图的常见配置(type="pie")

label配置(属于series中的配置,label配置项是一个对象)

series:[ label:{ position:"outside 或者 inside" //如果设置了normal这个则无效, formatter: function (params: any) { //return想要显示的label }, rotate:-90度到90度 //旋转 color //设置颜色 normal配合formatter改变坐标样式 normal:{ formatter:function(params) { return ( "{white|"' + params.name + "} \n {hr|}\n{yellow|"+params.value+"} \n{blue|"+"%}" } ,rich //rich为配置项 } ]

一、图例(legend)

图例可以设置为横向和纵向orient:('horizontal'或者'vertical'),像top、left、right、bottom、width、height等见名知意了，如果要设置图例的文字颜色、宽度高度、背景颜色等，需要通过ItemStyle属性去设置。 legend: { trigger: 'item', orient: 'vertical', top: '20px', left: '0px', textStyle: { color: '#fff', borderColor:"green", borderWidth:"10", shadowColor: 'rgba(0, 0, 0, 0.5)', shadowBlur: 10, }, }, 修改了图例的样式，丑是因为博主随便改的。

一、提示(tooltip)

如图所示，白色的小的弹窗，trigger属性有两种模式（'item'或者'axis'），axis一般用于柱状图、折线图。默认是鼠标经过就可以显示tip，也可以通过alwaysShowContent: false,在通过triggerOn: 'mousemove|click'来设置触发的时机，transitionDuration用来设置动画过渡的时间、position设置tips的位置，backgroundColor和其他的borderColor、borderWidth设置tip的框框的样式，formatter是一个函数，接收一个params，params是传递过来的数据，可通过设置formatter改变tooltips显示的内容。 tooltip: { //axis一般用折线图 柱状图 trigger: 'item', //通过这两个属性 设置单击才能显示tooltips alwaysShowContent: false , triggerOn: 'click' , //过渡动画 transitionDuration:1, //图例的位置 position:["25%","25%"], //背景颜色 backgroundColor:"red", //边框 borderColor: 'green', //自定义图例显示 formatter: function (params) { return params.name + ': ' + params.value + '辆'; }, },

如上图所示，已经改变了tips的位置、提示文字、背景颜色、边框颜色等。