var StartTime = $("#StartTime").val();
var EndTime = $("#EndTime").val();
var CharX = [];
var SportCheckCount = [];
var SpanTimeSum = [];
var Target = [];
var Max = 0;
var DonehundredMax = 0;
$.ajax({
url: '../FrockSpotCheckEcharReportForms/GetCharDatalist',
data: { StartTime: StartTime, EndTime: EndTime },
datatype: 'json',
type: 'post',
success: function (res)
{
var Charlist = res.Charlist;
for (var i = 0; i < Charlist.length; i++)
{
Target.push(Charlist[i].TargetValue);
CharX.push(Charlist[i].charID + "日");
//if (Charlist[i].SportCheckCount =0)
//{
// SportCheckCount.push(0)
// SpanTimeSum.push(0);
//}
SportCheckCount.push(parseInt(Charlist[i].SportCheckCount / 3));
SpanTimeSum.push((Charlist[i].SportCheckCount / (3 * Charlist[i].SpanTimeSum)).toFixed(2));
if (parseInt(Charlist[i].SportCheckCount / 3) > Max) {
Max = parseInt(Charlist[i].SportCheckCount / 3);
}
if ((Charlist[i].SportCheckCount / (3 * Charlist[i].SpanTimeSum)).toFixed(2) > DonehundredMax) {
DonehundredMax = (Charlist[i].SportCheckCount / (3 * Charlist[i].SpanTimeSum)).toFixed(2);
}
}
var option = {
title: [
{
text: '工装点检数及单小时完成率', //大标题
//subtext: '本月数据', //类似于副标题
x: 'center' //标题位置 居中
}
],
grid: {
top: '20%',
left: '0%',
right: '2%',
bottom: '0px',
containLabel: true
},
tooltip: {
trigger: 'axis',
//axisPointer: {
// type: 'cross',
// crossStyle: {
// color: '#999'
// }
//}
},
legend: {
data: [
{ name: '工装数量', icon: 'circle' },
{ name: '单小时完成率' },
{ name: '单小时完成率目标值' },
],
top: 50,
//textStyle: {
// color: '#ffffff',
// fontSize: 11
//},
//y: 'bottom',
//x: 'center',
y: 'top',
x: 'center'
},
backgroundColor: {
type: 'linear',
x: 0,
y: 0,
x2: 0,
y2: 1,
colorStops: [{
offset: 0, color: 'rgba(70, 131, 254, 0)' // 0% 处的颜色
}, {
offset: 1, color: 'rgba(70, 131, 254, 0.5)' // 100% 处的颜色
}],
global: false // 缺省为 false
},
toolbox: {
show: true,
feature: {
dataView: { show: true, readOnly: false },
magicType: { show: true, type: ['line', 'bar'] },
restore: { show: true },
saveAsImage: { show: true }
}
},
xAxis: [
{
type: 'category',
data: CharX,
//bounderyGap: false,
//axisLabel: {
// interval: 0,//横轴信息全部显示
// textStyle: {
// color: '#fff'
// },
// fontSize: 11,
// // rotate:45,//度角倾斜显示
// //formatter: function (value) {
// // return value.length > 5 ? value.substring(0, 5) + '...' : value;
// //}
//}
}
],
yAxis: [
{
type: 'value',
name: '工装数量',
min: 0,
max: Max + 50,
interval: 50,
axisLabel: {
formatter: '{value} '
}
},
{
type: 'value',
name: '单小时完成率',
min: 0,
max: parseInt(DonehundredMax) + 2,
interval: 1,
axisLabel:
{
formatter: '{value} '
}
}
],
series: [
{
yAxisIndex: 0,
//barWidth: '30%',
name: '工装数量',
type: 'bar',
data: SportCheckCount,
itemStyle: {
normal: {
label: {
show: true,
position: 'top',
textStyle: {
color: 'black',
fontSize: 16
}
},
lineStyle: {
color: '#5184F2',
},
color: '#5184F2',
},
},
},
{
//symbol: 'circle',
symbolSize: 8, //折线点的大小
yAxisIndex: 1,
name: '单小时完成率',
type: 'line',
data: SpanTimeSum,
itemStyle: {
normal: {
label: {
show: true,
position: 'bottom',
textStyle: {
color: '#E09C19',
fontSize: 16
}
},
lineStyle: {
color: '#E09C19'
},
color: '#FF991E',
}
}
}
,
{
symbolSize: 0, //折线点的大小
yAxisIndex: 1,
name: '单小时完成率目标值',
type: 'line',
data: Target,
itemStyle: {
normal: {
//label: {
// show: true,
// position: 'bottom',
// textStyle: {
// color: '#',
// fontSize: 16
// }
//},
lineStyle: {
color: 'blue'
},
color: 'blue',
}
}
}
],
};
// 基于准备好的dom,初始化echarts实例
var myChart = echarts.init(document.getElementById('SportCheck'));
myChart.setOption(option);
}
})
echar 多级Y轴
最新推荐文章于 2024-06-05 09:34:51 发布