标签：叠加 ack for width lines var element none fonts
var drawFunnelChart=function(chartId,titleText, dataArr,nameArr,gapArr,minValue){
var option = {
title: {
text: titleText,
subtext: ‘‘
},
tooltip: {
trigger: ‘item‘,
formatter: "{a} <br/>{b} : {c}"
},
legend: {
data: nameArr
},
calculable: true,
color: [‘#3C8DBC‘,‘#B1D1E4‘],
series: [
{
name:‘漏斗图‘, //多个对象叠加，生成一个图标多个label
type:‘funnel‘,
left: ‘20%‘,
top: 60,
//x2: 80,
bottom: 60,
width: ‘60%‘,
min: minValue,
/* max: maxValue,*/
minSize: ‘20%‘,
maxSize: "100%",
sort: ‘none‘,
//funnelAlign:‘center‘,
gap: 2,
label: {
normal: {
show: true,
position: ‘center‘,
formatter: function(data){
return data.value
},
rich: {
a: {
color: ‘#999‘,
lineHeight: 18,
align: ‘center‘
},
hr: {
borderColor: ‘#aaa‘,
width: ‘100%‘,
borderWidth: 0.5,
height: 0
},
b: {
color: ‘#000‘,
fontSize: 12,
lineHeight: 33
},
per: {
color: ‘#000‘,
/*backgroundColor: ‘#fff‘,*/
padding: [2, 4],
borderRadius: 2
}
}
},
emphasis: {
textStyle: {
fontSize: 12
}
}
},
labelLine: {
normal: {
length: 10,
lineStyle: {
width: 1,
type: ‘solid‘
}
}
},
itemStyle: {
normal: {
borderColor: ‘#fff‘,
borderWidth: 1
}
},
data: dataArr
},
{
name:‘漏斗图‘,
type:‘funnel‘,
left: ‘20%‘,
top: 60,
//x2: 80,
bottom: 60,
width: ‘60%‘,
// height: {totalHeight} - y - y2,
min: minValue,
/* max: maxValue,*/
minSize: "20%",
maxSize: "100%",
sort: ‘none‘, //不排序，按照给定数据的顺序
//funnelAlign:‘center‘,
gap: 2,
label: {
normal: {
show: true,
position: ‘left‘,
formatter: function(data){ //多个对象叠加，生成一个图标多个label
//if(data.dataIndex <= gapArr.length-1){
return ‘{per|转化率：‘ + gapArr[data.dataIndex] + ‘}‘;
//}
},
rich: {
per: {
color: ‘#000‘,/*‘#3CABE7‘,*/
backgroundColor: ‘#fff‘,
padding: [2, 4],
borderRadius: 2
}
}
},
emphasis: {
textStyle: {
fontSize: 12
}
}
},
labelLine: {
normal: {
length: 10,
lineStyle: {
width: 1,
type: ‘solid‘
}
}
},
itemStyle: {
normal: {
borderColor: ‘#fff‘,
borderWidth: 1
}
},
data: dataArr
},
{
name:‘漏斗图‘,
type:‘funnel‘,
left: ‘20%‘,
top: 60,
//x2: 80,
bottom: 60,
width: ‘60%‘,
// height: {totalHeight} - y - y2,
min: minValue,
/*max: maxValue,*/
minSize: "20%",
maxSize: "100%",
sort: ‘none‘,
//funnelAlign:‘center‘,
gap: 2,
label: {
normal: {
show: true,
position: ‘right‘,
formatter: function(data){//多个对象叠加，生成一个图标多个label
return ‘{b|‘ + data.name + ‘}‘
},
rich: {
b: {
color: ‘#000‘,
fontSize: 12,
lineHeight: 33
},
}
},
emphasis: {
textStyle: {
fontSize: 12
}
}
},
labelLine: {
normal: {
length: 10,
lineStyle: {
width: 1,
type: ‘solid‘
}
}
},
itemStyle: {
normal: {
borderColor: ‘#fff‘,
borderWidth: 1
}
},
data: dataArr
},
]
};
var myChart=echarts.init(document.getElementById(chartId));
myChart.setOption(option);
window.addEventListener(‘resize‘,myChart.resize)
};标签：叠加 ack for width lines var element none fonts
原文地址：https://www.cnblogs.com/KellyChen/p/9520967.html
