var baseUrl = 'http://visual.yilianweisubao.com/visual'; var href = window.location.href.split('='); console.log(href) var shengFen = unescape(href[1].split('&')[0]); var pyName = href[2].split('&')[0]; var shortName = unescape(href[3]).split('&')[0]; var mark = href[4].split('&')[0]; $('#name').text(shengFen + '互联网数据分析及大数据平台展示'); console.log(shengFen, pyName, shortName,mark); //头部数据-------------------------------------- //获取当前时间 var t = null; t = setTimeout(getTime, 1000);//开始运行 function getTime() { clearTimeout(t);//清除定时器 dt = new Date(); var y = dt.getFullYear(); var mt = dt.getMonth() + 1; var day = dt.getDate(); var h = dt.getHours();//获取时 var m = dt.getMinutes();//获取分 var s = dt.getSeconds();//获取秒 document.getElementById("showTime").innerHTML = y + "年" + mt + "月" + day + "-" + h + "时" + m + "分" + s + "秒"; t = setTimeout(getTime, 1000); //设定定时器,循环运行 } $(function () { getTime();//调用函数(获取当前时间) }); //左侧数据-------------------------------------- //首页获取全国各省的岗位数和招聘人数 function getQuanGuo() { $.ajax({ type: 'GET', url: baseUrl + '/temporary-visual/getQuanGuo', success: function (res) { console.log(res); var res = {"code":1,"msg":"成功","data":{"quanGuo":[{"gangwei":957746,"recuitNum":7043361,"shengFen":"管理岗位"},{"gangwei":1143,"recuitNum":14462,"shengFen":"技术岗位"},{"gangwei":241221,"recuitNum":2697933,"shengFen":"生产岗位"},{"gangwei":166810,"recuitNum":2181865,"shengFen":"销售岗位"},{"gangwei":523825,"recuitNum":5484672,"shengFen":"服务岗位"},{"gangwei":124028,"recuitNum":1364994,"shengFen":"其他"}]}}; if (res.code == '1') { var data = res.data.quanGuo; if (data.length > 0) { quanGuo(data); $('.myscroll').myScroll({//jQuery文字无缝滚动 speed: 40, //数值越大,速度越慢 rowHeight: 26 //li的高度 }); } } } }); } function quanGuo(data) { $("#ulBox").empty(); $(data).each(function (i, n) { $("#ulBox").append('
  • ' + (i + 1) + '' + n.shengFen + '' + n.recuitNum + '
  • '); }); } //单位性质横向柱状图 function getEcharts1() { var gwmc = ['机关/事业','国有企业','私营企业','外商及港、澳、台商投资企业','其他']; var myChart = echarts.init(document.getElementById('echart1')); var option = { tooltip: {trigger: 'axis', axisPointer: {type: 'shadow'}}, grid: {left: '0', top: '22%', right: '5', bottom: '0', containLabel: true}, legend: {top: '0', right: '60', textStyle: {color: '#fff',fontSize:10}, data: [ '职位需求数']}, xAxis: {nameLocation: 'end', nameGap: 7, type: 'category', data: gwmc, axisLine: {show: true, lineStyle: {color: "rgba(255,255,255,.9)", width: 1, type: "solid"}}, axisTick: {show: false}, axisLabel: {interval: 0, rotate: 0, textStyle: {color: "rgba(255,255,255,.6)", fontSize: '10'}}}, yAxis: {type: 'value', name: '职位需求数', nameGap: 0, nameTextStyle: {color: '#fff', fontSize: 10}, position: 'top', axisLabel: {show: true, textStyle: {color: "rgba(255,255,255,.6)", fontSize: '10'}}, axisTick: {show: false}, axisLine: {show: true, lineStyle: {color: "rgba(255,255,255,.9)", width: 1, type: "solid"}}, splitLine: {lineStyle: {color: "rgba(255,255,255,.1)"}}}, series: [ {type: 'bar', name: '职位需求数', yAxisIndex: '0', data: [29461,32060,32115,34858,35547], barWidth: '15%', itemStyle: {normal: {opacity: 1, barBorderRadius: 5}}, label: {show: true, position: 'right', distance: 5, fontSize: '8'}} ] }; myChart.setOption(option); window.addEventListener("resize", function () { myChart.resize(); }); } //企业规模横向柱状图 function getEcharts2() { var gwmc = ['100人以下','101人-500人','501人-1000人','1000人以上']; var myChart = echarts.init(document.getElementById('echart2')); var option = { tooltip: {trigger: 'axis', axisPointer: {type: 'shadow'}}, grid: {left: '0', top: '22%', right: '5', bottom: '0', containLabel: true}, legend: {top: '0', right: '60', textStyle: {color: '#fff',fontSize:10}, data: [ '职位需求数']}, xAxis: {nameLocation: 'end', nameGap: 7, type: 'category', data: gwmc, axisLine: {show: true, lineStyle: {color: "rgba(255,255,255,.9)", width: 1, type: "solid"}}, axisTick: {show: false}, axisLabel: {interval: 0, rotate: 0, textStyle: {color: "rgba(255,255,255,.6)", fontSize: '10'}}}, yAxis: {type: 'value', name: '职位需求数', nameGap: 0, nameTextStyle: {color: '#fff', fontSize: 10}, position: 'top', axisLabel: {show: true, textStyle: {color: "rgba(255,255,255,.6)", fontSize: '10'}}, axisTick: {show: false}, axisLine: {show: true, lineStyle: {color: "rgba(255,255,255,.9)", width: 1, type: "solid"}}, splitLine: {lineStyle: {color: "rgba(255,255,255,.1)"}}}, series: [ {type: 'bar', name: '职位需求数', yAxisIndex: '0', data: [29461,32060,32115,34858,35547], barWidth: '15%', itemStyle: {normal: {opacity: 1, barBorderRadius: 5}}, label: {show: true, position: 'right', distance: 5, fontSize: '8'}} ] }; myChart.setOption(option); window.addEventListener("resize", function () { myChart.resize(); }); } //中间数据-------------------------------------- //获取某省专业人数,招聘人数 function getSheng() { $.ajax({ type: 'GET', url: baseUrl + '/temporary-visual/getShengInfo', data: {shengFen: shengFen}, success: function (res) { console.log(res); if (res.code == '1') { var quanGuoZong = res.data.quanGuoZong; if (quanGuoZong.gangwei != '0') { $('.gwmc').text(quanGuoZong.gangwei); $('.zprs').text(quanGuoZong.recuitNum); } else { $('.gwmc').text('0'); $('.zprs').text('0'); } } } }); } //获取省辖市集合 function getCityListByProvinceName() { $.ajax({ type: 'GET', url: baseUrl + '/visual/common-province/getCityListByProvinceName', data: {provinceNane: shengFen}, success: function (res) { //console.log(res); if (res.code == '1') { var city = res.data.cityList; if (city.length > 0) { var myChart = echarts.init(document.getElementById('map_1')); if(shengFen.indexOf('山西') > -1){ $.getScript('js/province/js/shanxi.js', function () { var option = { tooltip: { trigger: 'item', formatter: function (params) { if (params.name != '') { return params.name + '
    专业人数:' + params.value; } else { return '暂无数据'; } } }, animation: false, visualMap: { show: true, min: 1, max: 2000000, inRange: {color: ['#d94e5d', '#eac736', '#50a3ba'].reverse()}, textStyle: {color: '#fff'} }, geo: { map: shortName, type: 'map', roam: false }, series: [{ // 地图块的相关信息 name: shortName, type: 'map', mapType: shortName, aspectScale: 0.75, zoom: 1, roam: false, label: { normal: { show: true,//显示省份标签 textStyle: {color: "#fff", fontSize: '9'}//省份标签字体颜色 }, emphasis: {//对应的鼠标悬浮效果 show: true, textStyle: {color: "#800080"} } }, itemStyle: { normal: { color: '#ffeb7b', areaColor: '#4c60ff', borderColor: '#1935e1' } }, data: city }] }; myChart.setOption(option); //地图点击事件 myChart.on('click', function (params) {//点击事件 window.location.href = 'post.html?longnName=' + escape(params.name); }); window.addEventListener("resize", function () { myChart.resize(); }); }); }else if(shengFen.indexOf('陕西') > -1){ $.getScript('js/province/js/shanxi1.js', function () { var option = { tooltip: { trigger: 'item', formatter: function (params) { if (params.name != '') { return params.name + '
    专业人数:' + params.value; } else { return '暂无数据'; } } }, animation: false, visualMap: { show: true, min: 1, max: 2000000, inRange: {color: ['#d94e5d', '#eac736', '#50a3ba'].reverse()}, textStyle: {color: '#fff'} }, geo: { map: shortName, type: 'map', roam: false, //label: { // show: true, // fontSize: '9' //}, //itemStyle: { // normal: { // areaColor: '#45c8ff', // borderColor: '#fff', // color: '#fff' // }, // emphasis: { // areaColor: '#00aeee', // color: '#fff' // } //} }, series: [{ // 地图块的相关信息 name: shortName, type: 'map', mapType: shortName, aspectScale: 0.75, zoom: 1, roam: false, label: { normal: { show: true,//显示省份标签 textStyle: {color: "#fff", fontSize: '9'}//省份标签字体颜色 }, emphasis: {//对应的鼠标悬浮效果 show: true, textStyle: {color: "#800080"} } }, itemStyle: { normal: { color: '#ffeb7b', areaColor: '#4c60ff', borderColor: '#1935e1' } }, data: city }] }; myChart.setOption(option); //地图点击事件 myChart.on('click', function (params) {//点击事件 window.location.href = 'post.html?longnName=' + escape(params.name); }); window.addEventListener("resize", function () { myChart.resize(); }); }); }else{ $.getScript('js/province/js/' + pyName + '.js', function () { var option = { tooltip: { trigger: 'item', formatter: function (params) { if (params.name != '') { return params.name + '
    需求人数:' + params.value; } else { return '暂无数据'; } } }, animation: false, visualMap: { show: true, min: 1, max: 2000000, inRange: {color: ['#d94e5d', '#eac736', '#50a3ba'].reverse()}, textStyle: {color: '#fff'} }, geo: { map: shortName, type: 'map', roam: false }, series: [{ // 地图块的相关信息 name: shortName, type: 'map', mapType: shortName, aspectScale: 0.75, zoom: 1, roam: false, label: { normal: { show: true,//显示省份标签 textStyle: {color: "#fff", fontSize: '9'}//省份标签字体颜色 }, emphasis: {//对应的鼠标悬浮效果 show: true, textStyle: {color: "#800080"} } }, itemStyle: { normal: { color: '#ffeb7b', areaColor: '#4c60ff', borderColor: '#1935e1' } }, data: city }] }; myChart.setOption(option); //地图点击事件 myChart.on('click', function (params) {//点击事件 window.location.href = 'post.html?longnName=' + escape(params.name); }); window.addEventListener("resize", function () { myChart.resize(); }); }); } }else{ } } } }); } function getCityListByProvinceCode(zhName, pyName, name) { console.log(zhName, pyName,name); //window.location.href = 'post.html?longnName=' + escape(zhName) + '&abbreviation=' + pyName + '&shortName=' + escape(name)+'&mark=0'; //window.location.href = 'area1.html?longnName=%u5E7F%u4E1C%u7701&abbreviation=guangdong&shortName=%u5E7F%u4E1C&mark=0;' } $(function () { getCityListByProvinceName();//获取省辖市集合 getSheng(); getQuanGuo();//首页获取全国各省的岗位数和招聘人数 getEcharts1(); getEcharts2(); getEcharts3(); getEcharts4(); getEcharts5(); getEcharts6(); getEcharts7(); getEcharts8(); }); //右侧数据-------------------------------------- //性别饼图 function getEcharts3(){ var myChart = echarts.init(document.getElementById('echart3')); var option = { title: { left: 'center'}, tooltip: {trigger: 'item'}, legend: {orient: 'vertical', left: 'left', textStyle: {color: '#fff',fontSize:10}}, series: [ { name: 'Access From', type: 'pie', color:['#45C2E0','#C1EBDD','#FFC851','#5A5476','#1869A0','#FF9393'], radius: '50%', data: [ { value: 1048, name: '男' }, { value: 735, name: '女' } ], emphasis: { itemStyle: { shadowBlur: 10, shadowOffsetX: 0, shadowColor: 'rgba(0, 0, 0, 0.5)' } } } ] }; myChart.setOption(option); window.addEventListener("resize", function () { myChart.resize(); }); } //学历水平柱状图 function getEcharts4(){ var gwmc = ['初中及以下','高中','中专/中技','大专','本科','研究生']; var myChart = echarts.init(document.getElementById('echart4')); var option = { tooltip: {trigger: 'axis', axisPointer: {type: 'shadow'}}, grid: {left: '0', top: '22%', right: '5', bottom: '0', containLabel: true}, legend: {top: '0', right: '60', textStyle: {color: '#fff',fontSize:10}, data: [ '求职人数']}, xAxis: {nameLocation: 'end', nameGap: 7, type: 'category', data: gwmc, axisLine: {show: true, lineStyle: {color: "rgba(255,255,255,.9)", width: 1, type: "solid"}}, axisTick: {show: false}, axisLabel: {interval: 0, rotate: 0, textStyle: {color: "rgba(255,255,255,.6)", fontSize: '10'}}}, yAxis: {type: 'value', name: '求职人数', nameGap: 0, nameTextStyle: {color: '#fff', fontSize: 10}, position: 'top', axisLabel: {show: true, textStyle: {color: "rgba(255,255,255,.6)", fontSize: '10'}}, axisTick: {show: false}, axisLine: {show: true, lineStyle: {color: "rgba(255,255,255,.9)", width: 1, type: "solid"}}, splitLine: {lineStyle: {color: "rgba(255,255,255,.1)"}}}, series: [ {type: 'bar', name: '求职人数', yAxisIndex: '0', data: [29461,32060,32115,34858,35547,23452], barWidth: '15%', itemStyle: {normal: {opacity: 1, barBorderRadius: 5}}, label: {show: true, position: 'right', distance: 5, fontSize: '8'}} ] }; myChart.setOption(option); window.addEventListener("resize", function () { myChart.resize(); }); } //年龄横向柱状图 function getEcharts5(){ var gwmc = ['16-24岁','25-34岁','35-44岁','45-55岁','56-60岁','60岁以上']; var myChart = echarts.init(document.getElementById('echart5')); var option = { tooltip: {trigger: 'axis', axisPointer: {type: 'shadow'}}, grid: {left: '0', top: '22%', right: '5', bottom: '0', containLabel: true}, legend: {top: '0', right: '60', textStyle: {color: '#fff',fontSize:10}, data: [ '求职人数']}, xAxis: {nameLocation: 'end', nameGap: 7, type: 'category', data: gwmc, axisLine: {show: true, lineStyle: {color: "rgba(255,255,255,.9)", width: 1, type: "solid"}}, axisTick: {show: false}, axisLabel: {interval: 0, rotate: 0, textStyle: {color: "rgba(255,255,255,.6)", fontSize: '10'}}}, yAxis: {type: 'value', name: '求职人数', nameGap: 0, nameTextStyle: {color: '#fff', fontSize: 10}, position: 'top', axisLabel: {show: true, textStyle: {color: "rgba(255,255,255,.6)", fontSize: '10'}}, axisTick: {show: false}, axisLine: {show: true, lineStyle: {color: "rgba(255,255,255,.9)", width: 1, type: "solid"}}, splitLine: {lineStyle: {color: "rgba(255,255,255,.1)"}}}, series: [ {type: 'bar', name: '求职人数', yAxisIndex: '0', data: [29461,32060,32115,34858,35547,23452], barWidth: '15%', itemStyle: {normal: {opacity: 1, barBorderRadius: 5}}, label: {show: true, position: 'right', distance: 5, fontSize: '8'}} ] }; myChart.setOption(option); window.addEventListener("resize", function () { myChart.resize(); }); } //下边数据 //产业饼状图 function getEcharts6(){ var myChart = echarts.init(document.getElementById('echart6')); var option = { title: { left: 'center'}, tooltip: {trigger: 'item'}, legend: {orient: 'vertical', left: 'left',textStyle: {color: '#fff',fontSize:10}}, series: [ { name: 'Access From', type: 'pie', color:['#45C2E0','#C1EBDD','#FFC851','#5A5476','#1869A0','#FF9393'], radius: '50%', data: [ { value: 1048, name: '第一产业'}, { value: 735, name: '第二产业' }, { value: 580, name: '第三产业' }, ], emphasis: { itemStyle: { shadowBlur: 10, shadowOffsetX: 0, shadowColor: 'rgba(0, 0, 0, 0.5)' } } } ] }; myChart.setOption(option); window.addEventListener("resize", function () { myChart.resize(); }); } //行业柱状图 function getEcharts7(){ var gwmc = ['采矿业','电力、燃气及水的生产和供应业','公共管理与社会组织','建筑业','交通运输、仓储和邮政业','教育','金融业','科学研究和技术服务业','农、林、牧、渔业','批发和零售业','水利、环境和公共设施管理业','卫生、社会保障和社会福利业','文化、体育和娱乐业','信息传输、软件和信息技术服务业','制造业','住宿和餐饮业','租赁和商务服务业','其他']; var myChart = echarts.init(document.getElementById('echart7')); var option = { tooltip: {trigger: 'axis', axisPointer: {type: 'shadow'}}, grid: {left: '0', top: '22%', right: '5', bottom: '0', containLabel: true}, legend: {top: '0', right: '60', textStyle: {color: '#fff',fontSize:10}, data: [ '需求职位数']}, xAxis: {nameLocation: 'end', nameGap: 7, type: 'category', data: gwmc, axisLine: {show: true, lineStyle: {color: "rgba(255,255,255,.9)", width: 1, type: "solid"}}, axisTick: {show: false}, axisLabel: {interval: 0, rotate: 45, textStyle: {color: "rgba(255,255,255,.6)", fontSize: '10'}}}, yAxis: {type: 'value', name: '需求职位数', nameGap: 0, nameTextStyle: {color: '#fff', fontSize: 10}, position: 'top', axisLabel: {show: true, textStyle: {color: "rgba(255,255,255,.6)", fontSize: '10'}}, axisTick: {show: false}, axisLine: {show: true, lineStyle: {color: "rgba(255,255,255,.9)", width: 1, type: "solid"}}, splitLine: {lineStyle: {color: "rgba(255,255,255,.1)"}}}, series: [ {type: 'bar', name: '需求职位数', yAxisIndex: '0', data: [29461,32060,32115,34858,35547,23452,29461,32060,32115,34858,35547,23452,29461,32060,32115,34858,35547,23452], barWidth: '15%', itemStyle: {normal: {opacity: 1, barBorderRadius: 5}}, label: {show: true, position: 'right', distance: 5, fontSize: '8'}} ] }; myChart.setOption(option); window.addEventListener("resize", function () { myChart.resize(); }); } //雷达图 function getEcharts8(){ var myChart = echarts.init(document.getElementById('echart8')); var option = { //title: {text: 'Basic Radar Chart'}, legend: {data: ['Allocated Budget', 'Actual Spending'],textStyle: {color: '#fff',fontSize:10}}, radar: { // shape: 'circle', indicator: [ { name: '5000元(含)以下', max: 6500 }, { name: '5000-8000元(含)', max: 16000 }, { name: '8000-10000元(含)', max: 30000 }, { name: '10000-15000元(含)', max: 38000 }, { name: '15000-20000元(含)', max: 52000 }, { name: '20000-25000元(含)', max: 25000 }, { name: '25000元-30000元(含)', max: 28000 }, { name: '30000元以上', max: 35000 } ] }, series: [ { name: '工资水平', type: 'radar', data: [ { value: [4200, 3000, 20000, 35000, 50000, 18000,20000,23456], name: '工资水平' }, //{ // value: [5000, 14000, 28000, 26000, 42000, 21000], // name: 'Actual Spending' //} ] } ] }; myChart.setOption(option); window.addEventListener("resize", function () { myChart.resize(); }); }