https://www.csdn.net/tags/NtzacgzsNDYyMDYtYmxvZwO0O0OO0O0O.html
//定义y轴最大值、最小值
var yAxisMax = 1;
var yAxisMin = 1;
//定义图表组件
var option = {
tooltip: {
trigger: 'axis'
},
grid: { //坐标
left: '3%',
right: '4%',
bottom: '10%',
containLabel: true
},
legend: { //图例
data:['net目标','net','拜访次数','拜访次数目标'],
y:'bottom' //显示位置
},
xAxis: [
{
type: 'category',
//data: ['2018Q1','2018Q2','2018Q3','2018Q4'],
data: [],
axisPointer: {
type: 'shadow'
},
axisLine: {
show: true,
lineStyle: {
color: '#ccc'
}
},
axisTick: {
alignWithLabel: true
}
}
],
yAxis: [
{
type: 'value',
name: '规模(亿)',
max: function(value) {
yAxisMax = value.max;
return (value.max * 1.2).toFixed(0);
},
min: function(value) {
if(value.min < 0){
yAxisMin = value.min;
return (value.min * 1.2).toFixed(0);
}else {
yAxisMin = 0;
return 0;
}
},
axisLine: {
show: true,
lineStyle: {
color: '#ccc'
}
}
},
{
type: 'value',
name: '拜访次数',
max: function(value) {
return (value.max * 1.2).toFixed(0);
},
min: function(value) { //y轴左右两边0刻度对齐 比例一致
return ((value.max * yAxisMin)/yAxisMax * 1.2).toFixed(0);
},
axisLine: {
show: true,
lineStyle: {
color: '#ccc'
}
}
}
],
color:['#cc5616', '#FF8C00', '#FFA500', '#FA8072'],
series: [
{
name:'net目标',
type:'bar',
barWidth: '35%',
label: { //图表上显示数据
normal: {
show: true,
position: 'inside'
}
},
data:[]
},
{
name:'net',
type:'bar',
barWidth: '35%',
label: { //图表上显示数据
normal: {
show: true,
position: 'inside'
}
},
data:[]
},
{
name:'拜访次数',
type:'line',
yAxisIndex: 1, //使用双y轴的右边轴
barWidth: '35%',
label: { //图表上显示数据
normal: {
show: true,
position: 'top'
}
},
data:[]
},
{
name:'拜访次数目标',
type:'line',
yAxisIndex: 1, //使用双y轴的右边轴
barWidth: '35%',
label: { //图表上显示数据
normal: {
show: true,
position: 'top'
}
},
data:[]
}
]
};