标签:Echart color 背景 item 柱状图 series 100 data 255
。
。
这种连续的背景板需要自己写背景series
echart只提供斑马线背景板 areaStyle
重点:
1.需要写两个y轴
2.需要多写一个series 并把data处设为[100,100,100,100,...]
3.需要为每个series都写上yAxisIndex或者xAxisIndex看需求是横向柱状图还是纵向柱状图
双Y轴:
yAxis: [ { type: 'category', data: yAxisData.map((item, index) => ({ value: item, textStyle: { width: 115, color: 'rgba(255, 255, 255, 0)', backgroundColor: { image: item === '移动' ? yidong : item === '联通' ? liantong : dianxin, }, }, })), //y轴边线 axisLine: { lineStyle: { width: 3, color: '#4A70C2', }, }, axisLabel: { margin: 35, height: 150, textStyle: { fontSize: 32, // color: 'red', }, }, position: 'left', }, { data: yAxisData, axisLine: { show: false, }, axisLabel: { show: false, }, axisTick: { show: false, }, position: 'left', }, ],
背景series:
{ name: '', type: 'bar', barWidth: 160, yAxisIndex: 1, // yAxisIndex: 0, data: [100, 100, 100], itemStyle: { normal: { color: 'rgba(56,128,255,0.14)', borderColor: 'rgba(56,145,255,0.20)', borderWidth: 4, }, }, }
标签:Echart,color,背景,item,柱状图,series,100,data,255 来源: https://www.cnblogs.com/Simoon/p/16533137.html
本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享; 2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关; 3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关; 4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除; 5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。