From 0871d7a6559219c802eb34189fb0ca28a042e4fe Mon Sep 17 00:00:00 2001
From: user <1137490146@qq.com>
Date: Thu, 7 Jul 2022 18:22:44 +0800
Subject: [PATCH] 仓库数据可视化管理
---
css/index12.css | 17 +++++++++++++++++
img/warehouse.png | Bin 0 -> 2414770 bytes
warehouse.html | 1197 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
3 files changed, 1214 insertions(+), 0 deletions(-)
create mode 100644 img/warehouse.png
create mode 100644 warehouse.html
diff --git a/css/index12.css b/css/index12.css
index 62b4c9a..1d41d66 100644
--- a/css/index12.css
+++ b/css/index12.css
@@ -1,3 +1,14 @@
+.body{
+ background-size: 100% 100%;
+}
+.title{
+ font-color: #FFFFF0;
+ font-size: 26px
+}.title1{
+ font-color:#FFFFF0;
+ font-size: 20px
+ }
+
.dataAll{
width: 100%;
height: 28%;
@@ -49,6 +60,12 @@
.maginS01{
/*margin-top:11% !important;*/
}
+.new{
+ width: 250%;
+ height: 40%;
+ box-sizing: border-box;
+ border:0px
+}
.dataAllBorder01{
width: 100%;
height: 100%;
diff --git a/img/warehouse.png b/img/warehouse.png
new file mode 100644
index 0000000..8105ce7
Binary files /dev/null and b/img/warehouse.png differ
diff --git a/warehouse.html b/warehouse.html
new file mode 100644
index 0000000..dc7ba4e
--- /dev/null
+++ b/warehouse.html
@@ -0,0 +1,1197 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <link href="css/BigData.css" rel="stylesheet" type="text/css" />
+ <link href="css/index.css" rel="stylesheet" type="text/css" />
+ <link href="css/index12.css" rel="stylesheet" type="text/css" />
+ <script src="js/jquery.js"></script>
+ <link href="js/bstable/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
+ <link href="js/bstable/css/bootstrap-table.css" rel="stylesheet" type="text/css" />
+ <link href="css/Security_operation.css" rel="stylesheet" type="text/css" />
+ <link rel="stylesheet" href="js/artDialog/skins/default.css" type="text/css"/>
+ <script src="js/laydate.js"></script>
+ <script src="js/Home_page.js"></script>
+ <meta charset="UTF-8">
+ <title>大数据管理平台</title>
+
+</head>
+<body class="body" background="img/warehouse.png" style="position: relative;height: 1100px;width: 100%;background-attachment: fixed;">
+<!--<iframe src="https://www.thingjs.com/pp/eb1ef62559ddf908beadaddd" style="margin: 0;padding: 0" height="1100px" width="100%" ></iframe>-->
+<div class="title" style="position: absolute;top:50px;left: 120px;color:#F0F0F0">仓库数据可视化管理
+
+</div>
+<div class="title1" style="position: absolute;top:75px;left: 80px;color:#F0F0F0">Visual management of warehouse data
+</div>
+<div class="data_left01" style="position: absolute;top:130px;left: 10px">
+ <div class="new">
+ <p class="data_chart" id="Package"></p>
+ </div>
+ <div class="dataAll" style="display: none">
+ <div class="dataAllBorder01">
+ <div class="dataAllBorder02">
+ <div class="data_tit1">本月航班量</div>
+ <div class="data_chart" id="buyTime"></div>
+ </div>
+ </div>
+ </div>
+<!-- <div class="dataAll" style="display: none">-->
+<!-- <div class="dataAllBorder01">-->
+<!-- <div class="dataAllBorder02">-->
+<!-- <div class="data_tit1">今日航班单量</div>-->
+<!-- <p class="data_chart" id="Package01"></p>-->
+<!-- </div>-->
+<!-- </div>-->
+<!-- </div>-->
+ <div class="dataAll" style="display: none">
+ <div class="dataAllBorder01">
+ <div class="dataAllBorder02">
+ <div class="data_tit1">本月航司单量</div>
+ <p class="data_chart" id="rode01"></p>
+ </div>
+ </div>
+ </div>
+</div>
+<div class="data_left01" style="position: absolute;top:70px;right: 370px">
+ <div class="dataAllBorder02" id="cage_cl" style="float: right;width: 120%;height: 30%">
+ <div class="analysis">今日货物信息：</div>
+ <ul class="data_show_box">
+ <li class="data_cage">0</li>
+ <li class="data_cage">1</li>
+ <li class="data_cage" style="background-image: none;">,</li>
+ <li class="data_cage">3</li>
+ <li class="data_cage">3</li>
+ <li class="data_cage">2</li>
+ </ul>
+ <div class="depart_number_box">
+ <ul class="depart_number_cage">
+ <li class="depart_name">北货站：</li>
+ <li class="depart_number">3,238</li>
+ </ul>
+ <ul class="depart_number_cage">
+ <li class="depart_name">西货站：</li>
+ <li class="depart_number">1,630</li>
+ </ul>
+ <ul class="depart_number_cage" style="margin-bottom: 0px;">
+ <li class="depart_name">老货站：</li>
+ <li class="depart_number">4,251</li>
+ </ul>
+ <ul class="depart_number_cage" style="margin-bottom: 0px;">
+ <li class="depart_name">军投：</li>
+ <li class="depart_number">24</li>
+ </ul>
+ </div>
+ </div>
+</div>
+<div class="data_left01" style="position: absolute;top:70px;right: 10px" align="center">
+ <div class="dataAll" style="float: right;width: 80%;height: 30%">
+ <div class="dataAllBorder01">
+ <div class="dataAllBorder02">
+ <div class="data_tit1">今日货物信息</div>
+ <p class="data_chart" id="Package01"></p>
+ </div>
+ </div>
+ </div>
+ <div class="dataAll" style="float: right;width: 80%;height: 45%" >
+ <div class="dataAllBorder01">
+ <div class="dataAllBorder02">
+ <div class="data_tit1">本周货物信息</div>
+ <p class="data_chart" id="actionBook"></p>
+ </div>
+ </div>
+ </div>
+<!-- <div class="dataAll" style="float: right;display: none">-->
+<!-- <div class="dataAllBorder01">-->
+<!-- <div class="dataAllBorder02">-->
+<!-- <div class="data_tit1">本年申报量</div>-->
+<!-- <p class="data_chart" id="bookBmonth"></p>-->
+<!-- </div>-->
+<!-- </div>-->
+<!-- </div>-->
+<!-- <div class="dataAll maginS" style="float: right;display: none">-->
+<!-- <div class="dataAllBorder01">-->
+<!-- <div class="dataAllBorder02">-->
+<!-- <div class="data_tit1">申报类型分析</div>-->
+<!-- <p class="data_chart" id="seaAbook01"></p>-->
+<!-- </div>-->
+<!-- </div>-->
+<!-- </div>-->
+</div>
+<div class="data_left02" style="position: absolute;top:825px;left:0px">
+ <div class="dataAll maginS" style="float: left;width: 20%;height: 20%">
+ <div class="dataAllBorder01">
+ <div class="dataAllBorder02">
+ <div class="data_tit1">在库总货量（进港）</div>
+ <p class="data_chart" id="bookAret"></p>
+ </div>
+ </div>
+ </div>
+ <div class="dataAll" style="float: left;width: 20%;height: 20%">
+ <div class="dataAllBorder01">
+ <div class="dataAllBorder02">
+ <div class="data_tit1">理货信息</div>
+ <p class="data_chart" id="whearAbook"></p>
+ </div>
+ </div>
+ </div>
+ <div class="dataAll02" style="float: left;width: 20%;height: 20%">
+ <div class="dataAllBorder01">
+ <div class="dataAllBorder02">
+ <div class="data_tit1">货物状态</div>
+ <p class="data_chart" id="rodeAbook"></p>
+ </div>
+ </div>
+ </div>
+
+ <div class="dataAll" style="float: left;width: 19%;height: 20%">
+ <div class="dataAllBorder01">
+ <div class="dataAllBorder02">
+ <div class="data_tit1">在库总货量（出港）</div>
+ <p class="data_chart" id="bookBmonth"></p>
+ </div>
+ </div>
+ </div>
+ <div class="dataAll maginS" style="float: left;width: 20%;height: 20%">
+ <div class="dataAllBorder01">
+ <div class="dataAllBorder02">
+ <div class="data_tit1">货物状态</div>
+ <p class="data_chart" id="seaAbook01"></p>
+ </div>
+ </div>
+ </div>
+</div>
+
+<script src="js/echarts-all.js"></script>
+<script>
+ function EventClick(){
+ $(".check_increase").removeClass("check_increase_act");
+ $("#over_hide1").show().siblings().hide();
+ $(".check_decrease").show();
+ $("#cage_cl").hide();
+ $("#map_title_innerbox").hide();
+ $("#cage_cl1").show();
+// $("#over_hide").show();
+ $("#map_title_innerbox1").show();
+ $(".addition_check_in").hide();
+ $("#car_check_in").hide();
+ BootstrapTable();
+ }
+ function cancel(e){
+ $(".check_increase").removeClass("check_increase_act");
+ $("#over_hide").show().siblings().hide();
+ $(".check_decrease").show();
+ $("#cage_cl").show();
+ $("#cage_cl1").hide();
+// $("#cage_cl").show();
+// $("#over_hide1").show();
+// $("#map_title_innerbox").show();
+ BootstrapTable();
+ }
+ $(function(){
+ var myChart = echarts.init($("#Package")[0]);
+ var labelTop = {
+ normal : {
+ label : {
+ show : true,
+ position : 'center',
+ formatter : '{b}',
+ textStyle: {
+ baseline : 'bottom'
+ }
+ },
+ labelLine : {
+ show : false
+ }
+ }
+ };
+ var labelFromatter = {
+ normal : {
+ label : {
+ formatter : function (params){
+ return 10000 - params.value
+ },
+ textStyle: {
+ baseline : 'top'
+ }
+ }
+ },
+ }
+ var labelBottom = {
+ normal : {
+ color: '#ccc',
+ label : {
+ show : true,
+ position : 'center'
+ },
+ labelLine : {
+ show : false
+ }
+ },
+ emphasis: {
+ color: 'rgba(0,0,0,0)'
+ }
+ };
+ var radius = [40, 55];
+ option = {
+ legend: {
+ x : 'center',
+ y : 'center',
+ data:[
+ ],
+ },
+ title : {
+ text: '',
+ x: 'center'
+ },
+ toolbox: {
+ show : false,
+ feature : {
+ dataView : {show: true, readOnly: false},
+ magicType : {
+ show: true,
+ type: ['pie', 'funnel'],
+ option: {
+ funnel: {
+ width: '20%',
+ height: '30%',
+ itemStyle : {
+ normal : {
+ label : {
+ formatter : function (params){
+ return 'other\n' + params.value + '%\n'
+ },
+ textStyle: {
+ baseline : 'middle'
+ }
+ }
+ },
+ }
+ }
+ }
+ },
+ restore : {show: true},
+ saveAsImage : {show: true}
+ }
+ },
+ series : [
+ {
+ type : 'pie',
+ center : ['10%', '30%'],
+ radius : radius,
+ x: '0%', // for funnel
+ itemStyle : labelFromatter,
+ data : [
+ {name:'other', value:46, itemStyle : labelBottom},
+ {name:'在库总货量', value:54,itemStyle : labelTop}
+ ]
+ },
+ {
+ type : 'pie',
+ center : ['30%', '30%'],
+ radius : radius,
+ x:'20%', // for funnel
+ itemStyle : labelFromatter,
+ data : [
+ {name:'other', value:56, itemStyle : labelBottom},
+ {name:'已理货', value:44,itemStyle : labelTop}
+ ]
+ },
+ {
+ type : 'pie',
+ center : ['50%', '30%'],
+ radius : radius,
+ x:'40%', // for funnel
+ itemStyle : labelFromatter,
+ data : [
+ {name:'other', value:65, itemStyle : labelBottom},
+ {name:'未理货', value:35,itemStyle : labelTop}
+ ]
+ },
+ {
+ type : 'pie',
+ center : ['70%', '30%'],
+ radius : radius,
+ x:'60%', // for funnel
+ itemStyle : labelFromatter,
+ data : [
+ {name:'other', value:70, itemStyle : labelBottom},
+ {name:'已放行', value:30,itemStyle : labelTop}
+ ]
+ },
+ {
+ type : 'pie',
+ center : ['90%', '30%'],
+ radius : radius,
+ x:'80%', // for funnel
+ itemStyle : labelFromatter,
+ data : [
+ {name:'other', value:73, itemStyle : labelBottom},
+ {name:'待提货', value:27,itemStyle : labelTop}
+ ]
+ },
+ ]
+ };
+
+
+ myChart.setOption(option);
+ });
+
+
+
+
+ $(function(){
+ var myChart = echarts.init($("#buyTime")[0]);
+ var option = {
+ tooltip: { //提示框，鼠标悬浮交互时的信息提示
+ show: true,
+ trigger: 'axis'
+ },
+ grid: {
+ x: 46,
+ y:30,
+ x2:30,
+ y2:40,
+ borderWidth: 0
+ },
+ legend: {
+ data: [],
+ orient: 'vertical',
+ textStyle: { fontWeight: 'bold', color: '#a4a7ab' }
+ },
+
+ calculable: false,
+ xAxis: [
+ {
+ type: 'category',
+ boundaryGap: false,
+ data: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12','13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24'],
+ splitLine: {
+ show: false
+ },
+ axisLabel: {
+ show: true,
+ textStyle: {
+ color: '#a4a7ab',
+ align: 'center'
+ }
+ }
+ }
+
+ ],
+ yAxis: [
+ {
+ type: 'value',
+ splitLine: {
+ show: false
+ },
+ axisLabel: {
+ show: true,
+ textStyle: {
+ color: '#a4a7ab',
+ align: 'right'
+ }
+ }
+ }
+ ],
+ series: [
+ {
+ name: '',
+ type: 'line',
+ stack: '24小时购买时间',
+ data: [120, 132, 101, 146, 199, 230, 210, 230, 240, 256, 278, 300,120, 132, 101, 146, 199, 230, 210, 230, 240, 256, 278, 300],
+ itemStyle: {
+ normal: {
+ color: '#02bcbc'
+ }
+ }
+ }
+ ]
+ };
+
+ myChart.setOption(option);
+ });
+ $(function(){
+ var myChart = echarts.init($("#Package01")[0]);
+ option = {
+ legend: {
+ orient : 'vertical',
+ x : 'left',
+ data:['西货站','老货站','军投'],
+ textStyle:{
+ color:"#e9ebee"
+
+ }
+ },
+ tooltip : {
+ trigger: 'axis'
+ },
+ toolbox: {
+ show : true,
+ feature : {
+ mark : {show: true},
+ dataView : {show: true, readOnly: false},
+ magicType : {
+ show: true,
+ type: ['pie', 'funnel'],
+ option: {
+ funnel: {
+ x: '25%',
+ width: '50%',
+ funnelAlign: 'left',
+ max: 1548
+ }
+ }
+ },
+ restore : {show: true},
+ saveAsImage : {show: true}
+ }
+ },
+ calculable : true,
+ series : [
+ {
+ name:'航班',
+ type:'pie',
+ radius : '55%',
+ tooltip : {
+ trigger: 'item',
+ formatter: '{a} <br/>{b} : {c} ({d}%)'
+ },
+ center: ['50%', '60%'],
+ data:[
+ {
+ value:335,
+ name:'西货站',
+ itemStyle: {
+ normal: {
+ color:"#1afffd"
+ }
+ }},
+ {
+ value:310,
+ name:'老货站',
+ itemStyle: {
+ normal: {
+ color:"#2e7cff"
+ }
+ }},
+ {
+ value:234,
+ name:'北货站',
+ itemStyle: {
+ normal: {
+ color:"#ffcb89"
+ }
+ }}
+ ]
+ }
+ ]
+ };
+
+
+ myChart.setOption(option);
+ });
+ $(function(){
+ var myChart = echarts.init($("#rode01")[0]);
+ option = {
+ tooltip : {
+ trigger: 'axis'
+ },
+ legend: {
+ orient : 'vertical',
+ x : 'left',
+ data:['CV','RU','CX','KA','5Y','5X','ET','CF'], textStyle:{
+ color:"#e9ebee"
+
+ }
+ },
+ calculable : false,
+ series : [
+
+ {
+ name:'航司',
+ type:'pie',
+ tooltip : {
+ trigger: 'item',
+ formatter: '{a} <br/>{b} : {c} ({d}%)'
+ },
+ radius : '60%',
+ center: ['50%', '60%'],
+ roseType : 'area',
+ x: '50%', // for funnel
+ max: 40, // for funnel
+ sort : 'ascending', // for funnel
+ data:[
+ {value:10, name:'CF',
+ itemStyle: {
+ normal: {
+ color:"#45c0ff"
+ }
+ }},
+ {value:5, name:'ET',
+ itemStyle: {
+ normal: {
+ color:"#e15828"
+ }
+ }},
+ {value:15, name:'5X',
+ itemStyle: {
+ normal: {
+ color:"#ff81cb"
+ }
+ }},
+ {value:25, name:'5Y',
+ itemStyle: {
+ normal: {
+ color:"#2e7cff"
+ }
+ }},
+ {value:20, name:'KA',
+ itemStyle: {
+ normal: {
+ color:"#feb602"
+ }
+ }},
+ {value:35, name:'CX',
+ itemStyle: {
+ normal: {
+ color:"#ff7d0a"
+ }
+ }},
+ {value:30, name:'RU',
+ itemStyle: {
+ normal: {
+ color:"#1afffd"
+ }
+ }},
+ {value:40, name:'CV',
+ itemStyle: {
+ normal: {
+ color:"#2e7cff"
+ }
+ }}
+ ]
+ }
+ ]
+ };
+
+
+ myChart.setOption(option);
+ });
+ $(function(){
+ var myChart = echarts.init($("#bookAret")[0]);
+ option = {
+
+ tooltip : {
+ trigger: 'axis'
+ },
+ grid: {
+ x: 46,
+ y:30,
+ x2:30,
+ y2:40,
+ borderWidth: 0
+ },
+ legend: {
+ data:['总量','异常'],
+ textStyle:{
+ color:"#e9ebee"
+
+ }
+ },
+
+ calculable : false,
+ xAxis : [
+ {
+ type : 'category',
+ data : ['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月'],
+ axisLabel: {
+ show: true,
+ textStyle: {
+ color: '#a4a7ab',
+ align: 'center'
+ },
+ splitLine: {
+ show: false
+ },
+ }
+ }
+
+ ],
+ yAxis : [
+ {
+ type : 'value',
+ axisLabel: {
+ show: true,
+ textStyle: {
+ color: '#a4a7ab',
+ align: 'right'
+ }
+ },
+ splitLine: {
+ show: false
+ },
+ }
+ ],
+ series : [
+ {
+ name:'申报异常',
+ type:'bar',
+ data:[100, 80, 136, 150, 120, 56, 200, 162, 105, 63, 169, 236],
+ markPoint : {
+ data : [
+ {type : 'max', name: '最大值'},
+ {type : 'min', name: '最小值'}
+ ]
+ },
+ markLine : {
+ data : [
+ {type : 'average', name: '平均值'}
+ ]
+ }
+ },
+ {
+ name:'申报正常',
+ type:'bar',
+ data:[983, 820, 1236, 930, 1600, 1032, 890, 1300, 1921, 984, 1960, 2630],
+ markPoint : {
+ data : [
+ {name : '月最高', value : 2630, xAxis: 12, yAxis: 2630, symbolSize:18},
+ {name : '月最低', value : 820, xAxis: 2, yAxis: 830}
+ ]
+ },
+ markLine : {
+ data : [
+ {type : 'average', name : '平均值'}
+ ]
+ }
+ }
+ ]
+ };
+
+
+ myChart.setOption(option);
+ });
+ $(function(){
+ var myChart = echarts.init($("#rodeAbook")[0]);
+ option = {
+ tooltip : {
+ trigger: 'axis'
+ },
+ grid: {
+ x: 46,
+ y:30,
+ x2:30,
+ y2:20,
+ borderWidth: 0
+ },
+
+ calculable : false,
+ legend: {
+ data:['已放行','待提货','已提离'],
+ textStyle:{
+ color:"#e9ebee"
+
+ }
+ },
+ xAxis : [
+ {
+ type : 'category',
+ data : ['周一','周二','周三','周四','周五','周六','周日'],
+ splitLine: {
+ show: false
+ },
+ axisLabel: {
+ show: true,
+ textStyle: {
+ color: '#a4a7ab',
+ align: 'center'
+ }
+ }
+
+ }
+ ],
+ yAxis : [
+ {
+ type : 'value',
+ name : '舱单量',
+ axisLabel : {
+ formatter: '{value} ',
+ textStyle: {
+ color: '#a4a7ab',
+ align: 'right'
+ }
+ },
+ splitLine: {
+ show: false
+ },
+ },
+ {
+ type : 'value',
+ name : '航班',
+ axisLabel : {
+ formatter: '{value} ',
+ textStyle: {
+ color: '#a4a7ab',
+ align: 'right'
+ }
+ },
+ splitLine: {
+ show: false
+ },
+ },
+
+ ],
+ series : [
+
+ {
+ name:'进港',
+ type:'bar',
+ stack: '单量',
+ data:[120, 132, 101, 134, 90, 230, 210],
+ itemStyle: {
+ normal: {
+ color:"#ffcb89"
+ }
+ }
+ },
+ {
+ name:'出港',
+ type:'bar',
+ stack: '单量',
+ data:[220, 232, 301, 234, 190, 330, 210],
+ itemStyle: {
+ normal: {
+ color:"#005ea1"
+ }
+ }
+ },
+
+ {
+ name:'航班',
+ type:'line',
+ yAxisIndex: 1,
+ data:[20, 12, 10, 14, 20, 30, 10],
+ itemStyle: {
+ normal: {
+ color:"#0ad5ff"
+ }
+ }
+ }
+ ]
+ };
+
+ myChart.setOption(option);
+ });
+ $(function(){
+ var myChart = echarts.init($("#bookBmonth")[0]);
+ var option = {
+ tooltip: { //提示框，鼠标悬浮交互时的信息提示
+ show: true,
+ trigger: 'axis'
+ },
+ grid: {
+ x: 46,
+ y:30,
+ x2:30,
+ y2:40,
+ borderWidth: 0
+ },
+ legend: {
+ data: [],
+ orient: 'vertical',
+ textStyle: { fontWeight: 'bold', color: '#a4a7ab' }
+ },
+
+ calculable: false,
+ xAxis: [
+ {
+ type: 'category',
+ boundaryGap: false,
+ data : ['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月'],
+ splitLine: {
+ show: false
+ },
+ axisLabel: {
+ show: true,
+ textStyle: {
+ color: '#a4a7ab',
+ align: 'center'
+ }
+ }
+ }
+
+ ],
+ yAxis: [
+ {
+ type: 'value',
+ splitLine: {
+ show: false
+ },
+ axisLabel: {
+ show: true,
+ textStyle: {
+ color: '#a4a7ab',
+ align: 'right'
+ }
+ }
+ }
+ ],
+ series: [
+ {
+ name: '',
+ type: 'line',
+ stack: '申报正常',
+ data:[983, 820, 1236, 930, 1600, 1032, 890, 1300, 1921, 984, 1960, 2630],
+ itemStyle: {
+ normal: {
+ color: '#02bcbc'
+ }
+ }
+ }
+ ]
+ };
+
+ myChart.setOption(option);
+ });
+ $(function(){
+ var myChart = echarts.init($("#seaAbook01")[0]);
+ option = {
+
+ tooltip : {
+ trigger: 'axis'
+ },
+ legend: {
+ orient : 'vertical',
+ x : 'left',
+ data:['已组板','未组板','已放行','未放行','已驶离'], textStyle:{
+ color:"#e9ebee"
+
+ }
+ },
+
+ calculable : false,
+ series : [
+
+ {
+ name:'舱单申报总量',
+ type:'pie',
+ radius : '70%',
+ center: ['50%', '60%'],
+ tooltip : {
+ trigger: 'item',
+ formatter: '{a} <br/>{b} : {c} ({d}%)'
+ },
+ splitLine:{show: true},
+ roseType : 'area',
+ x: '50%', // for funnel
+ max: 40, // for funnel
+ sort : 'ascending', // for funnel
+ data:[
+ {value:2560, name:'已组板',
+ itemStyle: {
+ normal: {
+ color:"#2e7cff"
+ }
+ }},
+ {value:3690, name:'未组板',
+ itemStyle: {
+ normal: {
+ color:"#ffcb89"
+ }
+ }},
+ {value:5690, name:'已放行',
+ itemStyle: {
+ normal: {
+ color:"#005ea1"
+ }
+ }},
+ {value:6312, name:'未放行',
+ itemStyle: {
+ normal: {
+ color:"#0ad5ff"
+ }
+ }},
+ {value:6312, name:'已驶离',
+ itemStyle: {
+ normal: {
+ color:"#0ad5ff"
+ }
+ }}
+ ]
+ }
+ ]
+ };
+
+
+ myChart.setOption(option);
+ });
+ $(function(){
+ var myChart = echarts.init($("#actionBook")[0]);
+ option = {
+ tooltip : {
+ trigger: 'axis'
+ },
+ grid: {
+ x: 46,
+ y:30,
+ x2:30,
+ y2:20,
+ borderWidth: 0
+ },
+
+ calculable : false,
+ legend: {
+ data:['老货站','西货站','军投','北货站'],
+ textStyle:{
+ color:"#e9ebee"
+
+ }
+ },
+ xAxis : [
+ {
+ type : 'category',
+ splitLine : {show : false},
+ data : ['周一','周二','周三','周四','周五','周六','周日'],
+ axisLabel: {
+ show: true,
+ textStyle: {
+ color: '#fff',
+ align: 'center'
+ }
+ }
+ }
+ ],
+ yAxis : [
+ {
+ type : 'value',
+ position: 'right',
+ splitLine : {show : false},
+ axisLabel: {
+ show: true,
+ textStyle: {
+ color: '#fff',
+ align: 'center'
+ }
+ }
+ }
+ ],
+ series : [
+ {
+ name:'老货站',
+ type:'bar',
+ data:[320, 332, 301, 334, 390, 330, 320],
+ itemStyle: {
+ normal: {
+ color:"#2e7cff"
+ }
+ }
+ },
+ {
+ name:'西货站',
+ type:'bar',
+ tooltip : {trigger: 'item'},
+ stack: '广告',
+ data:[120, 132, 101, 134, 90, 230, 210],
+ itemStyle: {
+ normal: {
+ color:"#feb602"
+ }
+ }
+ },
+ {
+ name:'军投',
+ type:'bar',
+ tooltip : {trigger: 'item'},
+ stack: '广告',
+ data:[220, 182, 191, 234, 290, 330, 310],
+ itemStyle: {
+ normal: {
+ color:"#ffcb89"
+ }
+ }
+ },
+ {
+ name:'北货站',
+ type:'bar',
+ tooltip : {trigger: 'item'},
+ stack: '广告',
+ data:[150, 232, 201, 154, 190, 330, 410],
+ itemStyle: {
+ normal: {
+ color:"#005ea1"
+ }
+ }
+ },
+
+ {
+ name:'申报总单量',
+ type:'line',
+ data:[862, 1018, 964, 1026, 1679, 1600, 1570],
+ itemStyle: {
+ normal: {
+ color:"#0ad5ff"
+ }
+ }
+ },
+
+ {
+ name:'货物细分',
+ type:'pie',
+ tooltip : {
+ trigger: 'item',
+ formatter: '{a} <br/>{b} : {c} ({d}%)'
+ },
+ center: [100,80],
+ radius : [0, 30],
+ itemStyle : {
+ normal : {
+ labelLine : {
+ length : 20
+ }
+ }
+ },
+ data:[
+ {value:1048, name:'普货',
+ itemStyle: {
+ normal: {
+ color:"#1afffd"
+ }
+ }},
+ {value:251, name:'电子',
+ itemStyle: {
+ normal: {
+ color:"#2e7cff"
+ }
+ }},
+ {value:147, name:'医疗',
+ itemStyle: {
+ normal: {
+ color:"#ffcb89"
+ }
+ }},
+ {value:102, name:'数码',
+ itemStyle: {
+ normal: {
+ color:"#005ea1"
+ }
+ }}
+ ]
+ }
+ ]
+ };
+
+
+ myChart.setOption(option);
+ });
+ $(function(){
+ var myChart = echarts.init($("#whearAbook")[0]);
+ option = {
+ tooltip : {
+ trigger: 'axis'
+ },
+ grid: {
+ x: 46,
+ y:30,
+ x2:30,
+ y2:20,
+ borderWidth: 0
+ },
+
+ calculable : false,
+ legend: {
+ data:['已理货','未理货','异常'],
+ textStyle:{
+ color:"#e9ebee"
+
+ }
+ },
+ xAxis : [
+ {
+ type : 'category',
+ data : ['1月','2月','3月','4月','5月','6月','7月','8月','9月','10月','11月','12月'],
+ splitLine: {
+ show: false
+ },
+ axisLabel: {
+ show: true,
+ textStyle: {
+ color: '#a4a7ab',
+ align: 'center'
+ }
+ }
+
+ }
+ ],
+ yAxis : [
+ {
+ type : 'value',
+
+ name : '调拨转运量',
+ axisLabel : {
+ formatter: '{value} ',
+ textStyle: {
+ color: '#a4a7ab',
+ align: 'right'
+ }
+ },
+ splitLine: {
+ show: false
+ },
+ },
+ {
+ type : 'value',
+ name : '舱单申报量',
+ axisLabel : {
+ formatter: '{value} 件',
+ textStyle: {
+ color: '#a4a7ab',
+ align: 'right'
+ }
+ },
+ splitLine: {
+ show: false
+ },
+ },
+
+ ],
+ series : [
+
+ {
+ name:'调拨',
+ type:'bar',
+ data:[20, 49, 70, 232, 256, 767, 1356, 1622, 36, 200, 64, 33],
+ itemStyle: {
+ normal: {
+ color:"#0ad5ff"
+ }
+ }
+ },
+ {
+ name:'国际转运',
+ type:'bar',
+ data:[26, 59, 90, 264, 287, 707, 1756, 1822, 487, 188, 60, 23],
+ itemStyle: {
+ normal: {
+ color:"#005ea1"
+ }
+ }
+ },
+ {
+ name:'进口申报量',
+ type:'line',
+ yAxisIndex: 1,
+ data:[200, 220, 330, 450, 630, 1020, 2030, 2340, 2300, 1650, 12000, 6200],
+ itemStyle: {
+ normal: {
+ color:"#1afffd"
+ }
+ }
+ }
+ ]
+ };
+
+ myChart.setOption(option);
+ });
+</script>
+
+</body>
+</html>
--
libgit2 0.24.0