636 lines
14 KiB
HTML
636 lines
14 KiB
HTML
|
<!DOCTYPE html>
|
|||
|
|
<html>
|
|||
|
|
|
|||
|
|
<head>
|
|||
|
|
<meta charset="utf-8" />
|
|||
|
|
<title></title>
|
|||
|
|
</head>
|
|||
|
|
<link rel="stylesheet" href="jquery/jquery-1.8.3.js" media="all">
|
|||
|
|
<script src="js/echarts.js" type="text/javascript" charset="utf-8"></script>
|
|||
|
|
<script src="js/layui-v2.5.4/layui/layui.all.js"></script>
|
|||
|
|
<link rel="stylesheet" href="js/layui-v2.5.6/layui/css/layui.css" media="all">
|
|||
|
|
<script>
|
|||
|
|
function tijian() {
|
|||
|
|
layer.open({
|
|||
|
|
type: 2,
|
|||
|
|
area: ['74%', '90%'],
|
|||
|
|
title: "查看详情",
|
|||
|
|
maxmin: true,
|
|||
|
|
content: 'img/2.jpg',
|
|||
|
|
tn: ['关闭'],
|
|||
|
|
yes: function(index) {
|
|||
|
|
layer.close(index);
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function jiance() {
|
|||
|
|
layer.open({
|
|||
|
|
type: 2,
|
|||
|
|
area: ['74%', '90%'],
|
|||
|
|
title: "查看详情",
|
|||
|
|
maxmin: true,
|
|||
|
|
content: 'img/3.jpg',
|
|||
|
|
tn: ['关闭'],
|
|||
|
|
yes: function(index) {
|
|||
|
|
layer.close(index);
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function pingjia() {
|
|||
|
|
layer.open({
|
|||
|
|
type: 2,
|
|||
|
|
area: ['74%', '90%'],
|
|||
|
|
title: "查看详情",
|
|||
|
|
maxmin: true,
|
|||
|
|
content: 'img/1.jpg',
|
|||
|
|
tn: ['关闭'],
|
|||
|
|
yes: function(index) {
|
|||
|
|
layer.close(index);
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style type="text/css">
|
|||
|
|
.jgtb_box {
|
|||
|
|
background: #f5f5f5;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.jgtb_top_box {
|
|||
|
|
width: 90%;
|
|||
|
|
height: 80px;
|
|||
|
|
margin: 0 auto;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.clearBox::after {
|
|||
|
|
content: '';
|
|||
|
|
clear: both;
|
|||
|
|
display: block;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.jgtb_top_one {
|
|||
|
|
float: left;
|
|||
|
|
width: 15%;
|
|||
|
|
height: 80px;
|
|||
|
|
background: #80d4f6;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.anniu {
|
|||
|
|
width: 20%;
|
|||
|
|
background: #fff;
|
|||
|
|
height: 100%;
|
|||
|
|
float: right;
|
|||
|
|
box-shadow: 0px 0px 5px 0px #666;
|
|||
|
|
position: relative;
|
|||
|
|
text-align: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.anniu a {
|
|||
|
|
position: absolute;
|
|||
|
|
font-size: 28px;
|
|||
|
|
text-align: center;
|
|||
|
|
width: 100%;
|
|||
|
|
display: block;
|
|||
|
|
color: #7fd3f5;
|
|||
|
|
cursor: pointer;
|
|||
|
|
font-weight: bolder;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.nian {
|
|||
|
|
display: block;
|
|||
|
|
text-align: center;
|
|||
|
|
line-height: 80px;
|
|||
|
|
font-weight: bolder;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.jgtb_top_tow {
|
|||
|
|
width: 25%;
|
|||
|
|
float: left;
|
|||
|
|
background: #ffffff;
|
|||
|
|
box-shadow: 0px 0px 5px 0px #666;
|
|||
|
|
margin-left: 20px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.jgtb_top_tow_top {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 30px;
|
|||
|
|
background: #7fd3f5;
|
|||
|
|
text-align: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.jgtb_top_tow_top a {
|
|||
|
|
color: #fff;
|
|||
|
|
line-height: 30px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.jgtb_top_tow_bottom {
|
|||
|
|
height: 50px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.jgtb_tow_bottom_left {
|
|||
|
|
float: left;
|
|||
|
|
width: 60%;
|
|||
|
|
text-align: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.topP_a {
|
|||
|
|
color: #7fd3f5;
|
|||
|
|
font-size: 28px;
|
|||
|
|
line-height: 44px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.top_span {
|
|||
|
|
color: #7fd3f5;
|
|||
|
|
margin-left: 5px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.jgtb_tow_bottom_right {
|
|||
|
|
line-height: 50px;
|
|||
|
|
text-align: center;
|
|||
|
|
color: #bfbfbf;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.content {
|
|||
|
|
width: 90%;
|
|||
|
|
background: #ffffff;
|
|||
|
|
margin: 0 auto;
|
|||
|
|
margin-top: 20px !important;
|
|||
|
|
padding-bottom: 10px;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
padding-left: 20px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.content_left {
|
|||
|
|
width: 35%;
|
|||
|
|
float: left;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.content_left_top {
|
|||
|
|
padding: 20px 10px;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
border-bottom: 1px solid #6666;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.a_title {
|
|||
|
|
font-size: 18px;
|
|||
|
|
margin-right: 5px;
|
|||
|
|
text-align: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.a_a {}
|
|||
|
|
|
|||
|
|
.content_left_bottom {}
|
|||
|
|
|
|||
|
|
.rows_bo {
|
|||
|
|
padding-left: 5px;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
display: block;
|
|||
|
|
height: 40px;
|
|||
|
|
width: 100%;
|
|||
|
|
line-height: 40px;
|
|||
|
|
border-bottom: 1px solid #6666;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.content_right {
|
|||
|
|
width: 60%;
|
|||
|
|
float: right;
|
|||
|
|
padding-top: 10px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.rows_bo span {
|
|||
|
|
float: right;
|
|||
|
|
margin-right: 10px;
|
|||
|
|
background: #826d95;
|
|||
|
|
height: 20px;
|
|||
|
|
line-height: 20px;
|
|||
|
|
margin-top: 6px;
|
|||
|
|
padding: 3px;
|
|||
|
|
border-radius: 5px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.back_color2 {
|
|||
|
|
background: #2bc2e7 !important;
|
|||
|
|
border-radius: 5px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.back_color3 {
|
|||
|
|
background: #fb6a4e !important;
|
|||
|
|
border-radius: 5px;
|
|||
|
|
}
|
|||
|
|
</style>
|
|||
|
|
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<body>
|
|||
|
|
<div class="jgtb_box" style="padding-bottom: 10px;box-sizing: border-box;">
|
|||
|
|
<div class="jgtb_top_box clearBox">
|
|||
|
|
<div class="jgtb_top_one clearBox">
|
|||
|
|
<a class="nian" style="font-size: 20px;color: #FFF;display: block;width: 80%;
|
|||
|
|
float: left;">2019</a>
|
|||
|
|
<div class="anniu">
|
|||
|
|
<a style="display: block;transform: rotate(-270deg);top: 0px;">
|
|||
|
|
<</a> <a style="display: block;transform: rotate(90deg);bottom: 0px;">>
|
|||
|
|
</a>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="jgtb_top_tow">
|
|||
|
|
<div class="jgtb_top_tow_top" style="background: #30a9de;">
|
|||
|
|
<a>体检机构</a>
|
|||
|
|
</div>
|
|||
|
|
<div class="jgtb_top_tow_bottom">
|
|||
|
|
<div class="jgtb_tow_bottom_left clearBox">
|
|||
|
|
<a class="topP_a" style="color: #30a9de;">20</a><span style="color: #30a9de;" class="top_span">家</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="jgtb_tow_bottom_right">
|
|||
|
|
<a>已填报信息</a>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="jgtb_top_tow">
|
|||
|
|
<div class="jgtb_top_tow_top" style="background: #47b8e0;">
|
|||
|
|
<a>检测机构</a>
|
|||
|
|
</div>
|
|||
|
|
<div class="jgtb_top_tow_bottom">
|
|||
|
|
<div class="jgtb_tow_bottom_left clearBox">
|
|||
|
|
<a class="topP_a" style="color: #47b8e0;">16</a><span style="color: #47b8e0;" class="top_span">家</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="jgtb_tow_bottom_right">
|
|||
|
|
<a>已填报信息</a>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="jgtb_top_tow">
|
|||
|
|
<div class="jgtb_top_tow_top" style="background:#8ec0e4;">
|
|||
|
|
<a>评价机构</a>
|
|||
|
|
</div>
|
|||
|
|
<div class="jgtb_top_tow_bottom">
|
|||
|
|
<div class="jgtb_tow_bottom_left clearBox">
|
|||
|
|
<a class="topP_a" style="color: #8ec0e4;">11</a><span style="color: #8ec0e4;" class="top_span">家</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="jgtb_tow_bottom_right">
|
|||
|
|
<a>已填报信息</a>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="clearBox"></div>
|
|||
|
|
<div class="content clearBox">
|
|||
|
|
<div class="content_left">
|
|||
|
|
<div class="content_left_top">
|
|||
|
|
<a class="a_title">本年度体检机构填报信息</a><a class="a_a" href="#" onclick="tijian()">详情>></a>
|
|||
|
|
</div>
|
|||
|
|
<div class="content_left_bottom">
|
|||
|
|
<div class="rows_bo clearBox">
|
|||
|
|
<a>受检单位</a> <span class="back_color">805</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="rows_bo clearBox">
|
|||
|
|
<a>实检人数</a> <span class="back_color2">17620</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="rows_bo clearBox">
|
|||
|
|
<a>异常人数</a> <span class="back_color3">3231</span>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="content_right">
|
|||
|
|
<div id="main" style="width: 1000px;height:200px;background: #30a9de;"></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="content clearBox">
|
|||
|
|
<div class="content_left">
|
|||
|
|
<div class="content_left_top">
|
|||
|
|
<a class="a_title">本年度检测机构填报信息</a><a class="a_a" href="#" onclick="jiance()">详情>></a>
|
|||
|
|
</div>
|
|||
|
|
<div class="content_left_bottom">
|
|||
|
|
<div class="rows_bo clearBox">
|
|||
|
|
<a>受检单位</a> <span class="back_color">232</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="rows_bo clearBox">
|
|||
|
|
<a>检测点位</a> <span class="back_color2">4504</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="rows_bo clearBox">
|
|||
|
|
<a>不合格点位</a> <span class="back_color3">347</span>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="content_right">
|
|||
|
|
<div id="main2" style="width: 1000px;height:200px;background: #47b8e0;"></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="content clearBox">
|
|||
|
|
<div class="content_left">
|
|||
|
|
<div class="content_left_top">
|
|||
|
|
<a class="a_title">本年度评价机构填报信息</a><a class="a_a" href="#" style="color: ;" onclick="pingjia()">详情>></a>
|
|||
|
|
</div>
|
|||
|
|
<div class="content_left_bottom">
|
|||
|
|
<div class="rows_bo clearBox">
|
|||
|
|
<a>受检单位</a> <span class="back_color">547</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="rows_bo clearBox">
|
|||
|
|
<a>检测点位</a> <span class="back_color2">474</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="rows_bo clearBox">
|
|||
|
|
<a>不合格点位</a> <span class="back_color3">2548</span>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="content_right">
|
|||
|
|
<div id="main3" style="width: 1000px;height:200px;background: #8ec0e4;"></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<script type="text/javascript">
|
|||
|
|
// 基于准备好的dom，初始化echarts实例
|
|||
|
|
var myChart = echarts.init(document.getElementById('main'))
|
|||
|
|
var myChart2 = echarts.init(document.getElementById('main2'))
|
|||
|
|
var myChart3 = echarts.init(document.getElementById('main3'))
|
|||
|
|
// 指定图表的配置项和数据
|
|||
|
|
option = {
|
|||
|
|
title: {},
|
|||
|
|
color: ['#FFF', '#FFFF00', '#C23531'],
|
|||
|
|
tooltip: {
|
|||
|
|
trigger: 'axis'
|
|||
|
|
},
|
|||
|
|
legend: {
|
|||
|
|
data: ['受检单位', '检查人数', '异常人数'],
|
|||
|
|
textStyle: {
|
|||
|
|
color: '#FFF'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
grid: {
|
|||
|
|
left: '3%',
|
|||
|
|
right: '4%',
|
|||
|
|
bottom: '3%',
|
|||
|
|
containLabel: true
|
|||
|
|
},
|
|||
|
|
toolbox: {
|
|||
|
|
feature: {
|
|||
|
|
saveAsImage: {}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
xAxis: {
|
|||
|
|
type: 'category',
|
|||
|
|
boundaryGap: false,
|
|||
|
|
data: [
|
|||
|
|
'2019年1月',
|
|||
|
|
'2019年2月',
|
|||
|
|
'2019年3月',
|
|||
|
|
'2019年4月',
|
|||
|
|
'2019年5月',
|
|||
|
|
'2019年6月'
|
|||
|
|
],
|
|||
|
|
axisLine: {
|
|||
|
|
//这是y轴文字颜色
|
|||
|
|
lineStyle: {
|
|||
|
|
color: '#FFF'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
splitLine: {
|
|||
|
|
show: true,
|
|||
|
|
lineStyle: {
|
|||
|
|
color: '#6666'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
axisTick: {
|
|||
|
|
alignWithLabel: true
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
yAxis: {
|
|||
|
|
type: 'value',
|
|||
|
|
axisLine: {
|
|||
|
|
//这是y轴文字颜色
|
|||
|
|
lineStyle: {
|
|||
|
|
color: '#FFF'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
splitLine: {
|
|||
|
|
show: true,
|
|||
|
|
lineStyle: {
|
|||
|
|
color: '#6666'
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
series: [{
|
|||
|
|
name: '受检单位',
|
|||
|
|
type: 'line',
|
|||
|
|
//stack: '总量',
|
|||
|
|
data: [0, 500, 600, 100, 200, 600, 0]
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
{
|
|||
|
|
name: '检查人数',
|
|||
|
|
type: 'line',
|
|||
|
|
//stack: '总量',
|
|||
|
|
data: [0, 900, 500, 180, 2200, 2600, 1000]
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
name: '异常人数',
|
|||
|
|
type: 'line',
|
|||
|
|
//stack: '总量',
|
|||
|
|
data: [100, 110, 25, 18, 12, 16, 20]
|
|||
|
|
}
|
|||
|
|
]
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
option2 = {
|
|||
|
|
title: {},
|
|||
|
|
tooltip: {
|
|||
|
|
trigger: 'axis'
|
|||
|
|
},
|
|||
|
|
color: ['#FFF', '#FFFF00', '#C23531'],
|
|||
|
|
legend: {
|
|||
|
|
data: ['受检单位', '检查人数', '异常人数'],
|
|||
|
|
textStyle: {
|
|||
|
|
color: '#FFF'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
grid: {
|
|||
|
|
left: '3%',
|
|||
|
|
right: '4%',
|
|||
|
|
bottom: '3%',
|
|||
|
|
containLabel: true
|
|||
|
|
},
|
|||
|
|
toolbox: {
|
|||
|
|
feature: {
|
|||
|
|
saveAsImage: {}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
xAxis: {
|
|||
|
|
type: 'category',
|
|||
|
|
boundaryGap: false,
|
|||
|
|
data: [
|
|||
|
|
'2019年1月',
|
|||
|
|
'2019年2月',
|
|||
|
|
'2019年3月',
|
|||
|
|
'2019年4月',
|
|||
|
|
'2019年5月',
|
|||
|
|
'2019年6月'
|
|||
|
|
],
|
|||
|
|
axisLine: {
|
|||
|
|
//这是y轴文字颜色
|
|||
|
|
lineStyle: {
|
|||
|
|
color: '#FFF'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
splitLine: {
|
|||
|
|
show: true,
|
|||
|
|
lineStyle: {
|
|||
|
|
color: '#6666'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
axisTick: {
|
|||
|
|
alignWithLabel: true
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
yAxis: {
|
|||
|
|
type: 'value',
|
|||
|
|
axisLine: {
|
|||
|
|
//这是y轴文字颜色
|
|||
|
|
lineStyle: {
|
|||
|
|
color: '#FFF'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
splitLine: {
|
|||
|
|
show: true,
|
|||
|
|
lineStyle: {
|
|||
|
|
color: '#6666'
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
series: [{
|
|||
|
|
name: '受检单位',
|
|||
|
|
type: 'line',
|
|||
|
|
//stack: '总量',
|
|||
|
|
data: [180, 500, 600, 100, 200, 600, 0]
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
{
|
|||
|
|
name: '检查人数',
|
|||
|
|
type: 'line',
|
|||
|
|
//stack: '总量',
|
|||
|
|
data: [200, 900, 500, 1280, 260, 1800, 1650]
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
name: '异常人数',
|
|||
|
|
type: 'line',
|
|||
|
|
// stack: '总量',
|
|||
|
|
data: [100, 110, 25, 18, 12, 16, 20]
|
|||
|
|
}
|
|||
|
|
]
|
|||
|
|
}
|
|||
|
|
option3 = {
|
|||
|
|
title: {},
|
|||
|
|
tooltip: {
|
|||
|
|
trigger: 'axis'
|
|||
|
|
},
|
|||
|
|
color: ['#FFFFFF', '#00FF33', '#FFFF00', '#FF0000'],
|
|||
|
|
legend: {
|
|||
|
|
data: [
|
|||
|
|
'受检单位或项目',
|
|||
|
|
'合格单位或项目',
|
|||
|
|
'基本合格单位或项目',
|
|||
|
|
'不合格单位或项目'
|
|||
|
|
],
|
|||
|
|
textStyle: {
|
|||
|
|
color: '#FFF'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
grid: {
|
|||
|
|
left: '3%',
|
|||
|
|
right: '4%',
|
|||
|
|
bottom: '3%',
|
|||
|
|
containLabel: true
|
|||
|
|
},
|
|||
|
|
toolbox: {
|
|||
|
|
feature: {
|
|||
|
|
saveAsImage: {}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
xAxis: {
|
|||
|
|
type: 'category',
|
|||
|
|
boundaryGap: false,
|
|||
|
|
data: [
|
|||
|
|
'2019年1月',
|
|||
|
|
'2019年2月',
|
|||
|
|
'2019年3月',
|
|||
|
|
'2019年4月',
|
|||
|
|
'2019年5月',
|
|||
|
|
'2019年6月'
|
|||
|
|
],
|
|||
|
|
axisLine: {
|
|||
|
|
//这是y轴文字颜色
|
|||
|
|
lineStyle: {
|
|||
|
|
color: '#FFF'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
splitLine: {
|
|||
|
|
show: true,
|
|||
|
|
lineStyle: {
|
|||
|
|
color: '#6666'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
axisTick: {
|
|||
|
|
alignWithLabel: true
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
yAxis: {
|
|||
|
|
type: 'value',
|
|||
|
|
axisLine: {
|
|||
|
|
//这是y轴文字颜色
|
|||
|
|
lineStyle: {
|
|||
|
|
color: '#FFF'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
splitLine: {
|
|||
|
|
show: true,
|
|||
|
|
lineStyle: {
|
|||
|
|
color: '#6666'
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
series: [{
|
|||
|
|
name: '受检单位或项目',
|
|||
|
|
type: 'line',
|
|||
|
|
//stack: '总量',
|
|||
|
|
data: [0, 1500, 1600, 1000, 2222, 6000, 3000]
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
{
|
|||
|
|
name: '合格单位或项目',
|
|||
|
|
type: 'line',
|
|||
|
|
//stack: '总量',
|
|||
|
|
data: [0, 1200, 1000, 880, 1111, 2100, 2500]
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
name: '基本合格单位或项目',
|
|||
|
|
type: 'line',
|
|||
|
|
//stack: '总量',不合格单位或项目
|
|||
|
|
data: [0, 200, 550, 100, 556, 16, 200]
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
name: '不合格单位或项目',
|
|||
|
|
type: 'line',
|
|||
|
|
//stack: '总量',
|
|||
|
|
data: [0, 100, 50, 20, 555, 2100, 300]
|
|||
|
|
}
|
|||
|
|
]
|
|||
|
|
}
|
|||
|
|
// 使用刚指定的配置项和数据显示图表。
|
|||
|
|
myChart.setOption(option)
|
|||
|
|
myChart2.setOption(option2)
|
|||
|
|
myChart3.setOption(option3)
|
|||
|
|
</script>
|
|||
|
|
</body>
|
|||
|
|
|
|||
|
|
</html>
|