sdz/cmanager
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

成都劳动力大屏集成

Browse Source
This commit is contained in:
zxy
2024-02-05 10:16:53 +08:00
parent ca50d9cab0
commit d06101daec
97 changed files with 17341 additions and 197 deletions
Download Patch File Download Diff File Expand all files Collapse all files

530
public/chengdu/js/area1.js Normal file
View File

@@ -0,0 +1,530 @@
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('<li><span><span class="radius">' + (i + 1) + '</span></span><span class="shengFen">' + n.shengFen + '</span><span>' + n.recuitNum + '</span></li>');
});
}
//单位性质横向柱状图
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 + '<br/>专业人数：' + 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 + '<br/>专业人数：' + 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 + '<br/>需求人数：' + 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();
});
}