2021-07-08

echarts图表进入页面图形莫名缩小,改变屏幕大小后才自适应解决方法

页面加载成功后再进行初始化。具体代码如下:
function initWorkConuntCharts() {
var option1 = {
title: {
text: ‘一次校验合格率得分’,
left: ‘left’,
top: ‘5%’,
left: ‘5%’,
textStyle: {
fontSize: 22,
color: ‘white’,
}
},
tooltip: {},
legend: {
show: true,
top: ‘10%’,
left: “85%”,
icon: ‘roundRect’,
itemGap: 15,
orient: ‘vertical’,
textStyle: {
color: ‘white’
}
},
label: {
show: true,
},
color: ["#ed8884", “#60cda0”],
radar: {
name: {
formatter: ‘{value}’,
textStyle: {
color: ‘#fff’,
backgroundColor: ‘rgb(17,26,80)’,
borderRadius: 3,
padding: [3, 5]
}
},
nameGap: 15,
splitNumber: 5,
indicator: [{
name: ‘K4102’,
max: 7.5
}, {
name: ‘K4103’,
max: 7.5
}, {
name: ‘K4104’,
max: 7.5
}, {
name: ‘K4105’,
max: 7.5
}, {
name: ‘K4106’,
max: 7.5
}, {
name: ‘K4108’,
max: 7.5
}, {
name: ‘K4110’,
max: 7.5
}, {
name: ‘K4201’,
max: 7.5
}, {
name: ‘K4203’,
max: 5
}, {
name: ‘K4204’,
max: 7.5
}],
splitArea: {
show: true,
areaStyle: {
color: “rgb(17,26,80)”
}
},
splitLine: {
show: true,
lineStyle: {
width: 1,
color: ‘#286fbb’
}
}
},
series: [{
type: ‘radar’,
data: [{
value: [a1[“42A”], a1[“43A”], a1[“44A”], a1[“45A”], a1[“46A”], a1[“48A”], a1[“4AA”], a1[“4A1”], a1[“4B1”], a1[“4D1”]],
name: ‘A班’,
symbol: ‘circle’
}, {
value: [b1[“42B”], b1[“43B”], b1[“44B”], b1[“45B”], b1[“46B”], b1[“48B”], b1[“4AB”], b1[“4A2”], b1[“4B2”], b1[“4D2”]],
name: ‘B班’
}]
}]
};
var myChart1 = echarts.init(document.getElementById(“industryBar”));
myChart1.setOption(option1);
//屏幕自适应
$(window).on(‘resize’, function () {
myChart1.resize()
})
}
$(document).ready(function () {
initWorkConuntCharts();
})

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值