1853 lines
52 KiB
JavaScript
1853 lines
52 KiB
JavaScript
//var baseUrl = 'http://cgsu81beft.51xd.pub';
|
|
var baseUrl = "http://39.101.167.152:8088/shekecaiji";
|
|
var href = window.location.href.split("=");
|
|
var shengFen = unescape(href[1].split("&")[0]);
|
|
var pyName = href[2].split("&")[0];
|
|
var shortName = unescape(href[3]).split("&")[0];
|
|
$("#name").text(shengFen + "劳动力需求大数据平台");
|
|
$("#center_map_name").text(shengFen + "劳动力需求热力图")
|
|
|
|
//头部数据--------------------------------------
|
|
//获取当前时间
|
|
var formattedDateTime;
|
|
var showOtherFlag = false;
|
|
function getDate() {
|
|
$.ajax({
|
|
type: "GET",
|
|
url: baseUrl + "/dataNew/getDate",
|
|
async: false,
|
|
success: function (res) {
|
|
console.log(res);
|
|
formattedDateTime = res.data;
|
|
var text = res.data.split("-")[1];
|
|
if (Number(text) >= 10) {
|
|
$("#btn1").text(text + "月分析");
|
|
} else {
|
|
$("#btn1").text(text.substring(1, 2) + "月分析");
|
|
}
|
|
},
|
|
});
|
|
}
|
|
function showOther(obj) {
|
|
if (!showOtherFlag) {
|
|
$(".echart10").hide();
|
|
$(".echart12").hide();
|
|
showOtherFlag = true;
|
|
} else {
|
|
$(".echart10").show();
|
|
$(".echart12").show();
|
|
showOtherFlag = false;
|
|
}
|
|
}
|
|
//切换toggle
|
|
function toggleView(obj) {
|
|
$(obj).siblings().removeClass("active");
|
|
$(obj).addClass("active");
|
|
var viewId = $(obj).attr("viewId");
|
|
if (viewId == "1") {
|
|
$(".mainbox1").show();
|
|
$(".mainbox2").hide();
|
|
getData8();
|
|
getData5();
|
|
getData6();
|
|
getData1();
|
|
getData2();
|
|
getData7();
|
|
getData4();
|
|
getData10();
|
|
getData12();
|
|
} else if (viewId == "2") {
|
|
$(".mainbox1").hide();
|
|
$(".mainbox2").show();
|
|
get_echart_trend1();
|
|
get_echart_trend2();
|
|
get_echart_trend3();
|
|
get_echart_trend4();
|
|
get_echart_trend5();
|
|
get_echart_trend6();
|
|
get_echart_trend7();
|
|
}
|
|
}
|
|
//左侧数据--------------------------------------
|
|
//分行业
|
|
function getData8() {
|
|
$.ajax({
|
|
type: "GET",
|
|
url: baseUrl + "/dataNew/getData8",
|
|
async: true,
|
|
data: { date: formattedDateTime },
|
|
success: function (res) {
|
|
//console.log(res);
|
|
if (res.code == "0") {
|
|
var data = res.data;
|
|
if (data.name.length > 0) {
|
|
quanGuo(data);
|
|
$(".myscroll").myScroll({
|
|
//jQuery文字无缝滚动
|
|
speed: 40, //数值越大，速度越慢
|
|
rowHeight: 26, //li的高度
|
|
});
|
|
}
|
|
}
|
|
},
|
|
});
|
|
}
|
|
function quanGuo(data) {
|
|
$("#ulBox").empty();
|
|
$(data.name).each(function (i, n) {
|
|
$("#ulBox").append(
|
|
'<li><span><span class="radius">' +
|
|
(i + 1) +
|
|
'</span></span><span class="shengFen">' +
|
|
n +
|
|
"</span><span>" +
|
|
data.data1[i] +
|
|
"</span><span>" +
|
|
data.data2[i] +
|
|
"</span></li>"
|
|
);
|
|
});
|
|
}
|
|
//分单位
|
|
function getData5() {
|
|
$.ajax({
|
|
type: "GET",
|
|
url: baseUrl + "/dataNew/getData5",
|
|
async: true,
|
|
data: { date: formattedDateTime },
|
|
success: function (res) {
|
|
//console.log(res);
|
|
if (res.code == "0") {
|
|
var myChart = echarts.init(document.getElementById("echart5"));
|
|
var option = {
|
|
title: {
|
|
// text: "分单位性质招聘需求",
|
|
subtext: "",
|
|
left: "center",
|
|
textStyle: { fontSize: 13, color: "#fff", fontWeight: 400 },
|
|
},
|
|
legend: {
|
|
left: "right",
|
|
textStyle: { color: "#fff", fontSize: 10 },
|
|
show: false,
|
|
},
|
|
tooltip: { trigger: "axis", axisPointer: { type: "shadow" } },
|
|
grid: {
|
|
left: "0",
|
|
top: "20%",
|
|
right: "5",
|
|
bottom: "5",
|
|
containLabel: true,
|
|
},
|
|
xAxis: {
|
|
nameLocation: "end",
|
|
nameGap: 7,
|
|
type: "category",
|
|
data: res.data.name,
|
|
axisLine: {
|
|
show: true,
|
|
lineStyle: {
|
|
color: "#3FC79B",
|
|
width: 1,
|
|
type: "solid",
|
|
},
|
|
},
|
|
axisTick: { show: false },
|
|
axisLabel: {
|
|
interval: 0,
|
|
rotate: 0,
|
|
textStyle: { color: "#3FC79B", fontSize: "12" },
|
|
},
|
|
},
|
|
yAxis: {
|
|
type: "value",
|
|
// name: "万人/万个",
|
|
nameGap: 0,
|
|
nameTextStyle: {
|
|
color: "#fff",
|
|
fontSize: 10,
|
|
lineHeight: 30,
|
|
height: 30,
|
|
padding: 6,
|
|
},
|
|
position: "top",
|
|
axisLabel: {
|
|
show: true,
|
|
textStyle: { color: "#3FC79B", fontSize: "12" },
|
|
},
|
|
axisTick: { show: false },
|
|
axisLine: {
|
|
show: false,
|
|
lineStyle: {
|
|
color: "#3FC79B",
|
|
width: 1,
|
|
type: "solid",
|
|
},
|
|
},
|
|
splitLine: { lineStyle: { color: "rgba(63, 199, 155, .5)" } },
|
|
},
|
|
series: [
|
|
{
|
|
type: "bar",
|
|
name: "需求人数",
|
|
barWidth: "15%",
|
|
itemStyle: {
|
|
normal: {
|
|
opacity: 1,
|
|
barBorderRadius: [10, 10, 0, 0],
|
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
|
{ offset: 0, color: "#F28505" },
|
|
{ offset: 1, color: "#F6DC3C" },
|
|
]),
|
|
},
|
|
},
|
|
data: res.data.data1,
|
|
},
|
|
],
|
|
};
|
|
console.log(option);
|
|
myChart.setOption(option);
|
|
window.addEventListener("resize", function () {
|
|
myChart.resize();
|
|
});
|
|
}
|
|
},
|
|
});
|
|
}
|
|
//分产业
|
|
function getData7() {
|
|
$.ajax({
|
|
type: "GET",
|
|
url: baseUrl + "/dataNew/getData7",
|
|
async: true,
|
|
data: { date: formattedDateTime },
|
|
success: function (res) {
|
|
//console.log(res);
|
|
if (res.code == "0") {
|
|
var arr = [];
|
|
for (var i = 0; i < res.data.name.length; i++) {
|
|
var obj = {};
|
|
obj.name = res.data.name[i];
|
|
obj.value = res.data.data1[i];
|
|
arr.push(obj);
|
|
}
|
|
var myChart = echarts.init(document.getElementById("echart7"));
|
|
var option = {
|
|
legend: {
|
|
top: "bottom",
|
|
show: false,
|
|
},
|
|
toolbox: {
|
|
show: false,
|
|
feature: {
|
|
mark: { show: true },
|
|
dataView: { show: true, readOnly: false },
|
|
restore: { show: true },
|
|
saveAsImage: { show: true },
|
|
},
|
|
},
|
|
series: [
|
|
{
|
|
name: "Nightingale Chart",
|
|
type: "pie",
|
|
radius: ["20%", "60%"],
|
|
center: ["50%", "50%"],
|
|
roseType: "area",
|
|
itemStyle: {
|
|
borderRadius: 8,
|
|
},
|
|
data: [
|
|
{ value: 40, name: "rose 1" },
|
|
{ value: 38, name: "rose 2" },
|
|
{ value: 32, name: "rose 3" },
|
|
{ value: 30, name: "rose 4" },
|
|
{ value: 28, name: "rose 5" },
|
|
{ value: 26, name: "rose 6" },
|
|
{ value: 22, name: "rose 7" },
|
|
{ value: 18, name: "rose 8" },
|
|
],
|
|
},
|
|
],
|
|
};
|
|
myChart.setOption(option);
|
|
window.addEventListener("resize", function () {
|
|
myChart.resize();
|
|
});
|
|
}
|
|
},
|
|
});
|
|
}
|
|
//获取岗位数gvs和招聘人数zprs
|
|
function getData1() {
|
|
$.ajax({
|
|
type: "GET",
|
|
url: baseUrl + "/dataNew/getData1",
|
|
async: true,
|
|
data: { date: formattedDateTime },
|
|
success: function (res) {
|
|
//console.log(res);
|
|
if ((res.code = "0")) {
|
|
var xq = res.data.xq;
|
|
var qz = res.data.qz;
|
|
$(".xuqiu").text("总岗位数：" + xq + "万个");
|
|
$(".qiuzhi").text("求职总人数：" + qz + "万人");
|
|
}
|
|
},
|
|
});
|
|
}
|
|
//获取省辖市集合
|
|
function getCityListByProvinceCode(zhName, pyName, name) {
|
|
console.log(zhName, pyName, name);
|
|
window.location.href =
|
|
"area.html?longnName=" +
|
|
escape(zhName) +
|
|
"&abbreviation=" +
|
|
pyName +
|
|
"&shortName=" +
|
|
escape(name);
|
|
}
|
|
//获取地图数据
|
|
function getData2() {
|
|
$.ajax({
|
|
type: "GET",
|
|
url: baseUrl + "/dataNew/getData2",
|
|
async: true,
|
|
data: { date: formattedDateTime },
|
|
success: function (res) {
|
|
//console.log(res);
|
|
if (res.code == "0") {
|
|
var province = res.data;
|
|
if (province.length > 0) {
|
|
//渲染地图
|
|
var myChart = echarts.init(document.getElementById("echart2"));
|
|
var option = {
|
|
animation: false,
|
|
//鼠标浮动显示框
|
|
tooltip: {
|
|
trigger: "item",
|
|
formatter: function (params) {
|
|
if (params.name != "") {
|
|
return (
|
|
params.name +
|
|
"<br/>需求人数：" +
|
|
params.value +
|
|
"<br/>求职人数：" +
|
|
params.data.value1
|
|
);
|
|
} else {
|
|
return "暂无数据";
|
|
}
|
|
},
|
|
},
|
|
visualMap: {
|
|
show: false,
|
|
min: 1,
|
|
max: 300000,
|
|
inRange: { color: ["#063b9e", "#299af0", "#cae2fd"].reverse() },
|
|
textStyle: { color: "#fff" },
|
|
},
|
|
geo: {},
|
|
series: [
|
|
{
|
|
name: "china",
|
|
type: "map",
|
|
aspectScale: 0.75,
|
|
zoom: 1.5,
|
|
mapType: "china",
|
|
roam: true,
|
|
label: {
|
|
normal: {
|
|
show: true,
|
|
textStyle: { color: "#fff", fontSize: "9" },
|
|
},
|
|
emphasis: { show: true, textStyle: { color: "#800080" } },
|
|
},
|
|
itemStyle: {
|
|
normal: {
|
|
color: "#ffeb7b",
|
|
areaColor: "#4c60ff",
|
|
borderColor: "#1935e1",
|
|
},
|
|
},
|
|
data: province,
|
|
},
|
|
],
|
|
};
|
|
myChart.setOption(option);
|
|
//地图点击事件
|
|
var cityArr = [
|
|
[
|
|
"上海市",
|
|
"河北省",
|
|
"山西省",
|
|
"内蒙古自治区",
|
|
"辽宁省",
|
|
"吉林省",
|
|
"黑龙江省",
|
|
"江苏省",
|
|
"浙江省",
|
|
"安徽省",
|
|
"福建省",
|
|
"江西省",
|
|
"山东省",
|
|
"河南省",
|
|
"湖北省",
|
|
"湖南省",
|
|
"广东省",
|
|
"广西壮族自治区",
|
|
"海南省",
|
|
"四川省",
|
|
"贵州省",
|
|
"云南省",
|
|
"西藏自治区",
|
|
"陕西省",
|
|
"甘肃省",
|
|
"青海省",
|
|
"宁夏回族自治区",
|
|
"新疆维吾尔自治区",
|
|
"北京市",
|
|
"天津市",
|
|
"重庆市",
|
|
"香港特别行政区",
|
|
"澳门特别行政区",
|
|
"台湾省",
|
|
],
|
|
[
|
|
"shanghai",
|
|
"hebei",
|
|
"shanxi",
|
|
"neimenggu",
|
|
"liaoning",
|
|
"jilin",
|
|
"heilongjiang",
|
|
"jiangsu",
|
|
"zhejiang",
|
|
"anhui",
|
|
"fujian",
|
|
"jiangxi",
|
|
"shandong",
|
|
"henan",
|
|
"hubei",
|
|
"hunan",
|
|
"guangdong",
|
|
"guangxi",
|
|
"hainan",
|
|
"sichuan",
|
|
"guizhou",
|
|
"yunnan",
|
|
"xizang",
|
|
"shanxi1",
|
|
"gansu",
|
|
"qinghai",
|
|
"ningxia",
|
|
"xinjiang",
|
|
"beijing",
|
|
"tianjin",
|
|
"chongqing",
|
|
"xianggang",
|
|
"aomen",
|
|
"taiwan",
|
|
],
|
|
];
|
|
myChart.on("click", function (params) {
|
|
//点击事件
|
|
if (params.name != "") {
|
|
var cityName = params.data.fullName;
|
|
var name = params.name;
|
|
for (var i = 0, len = cityArr[0].length; i < len; i++) {
|
|
// 查找是否有对应城市有则加载城市
|
|
if (cityName == cityArr[0][i]) {
|
|
getCityListByProvinceCode(cityArr[0][i], cityArr[1][i], name); // 获取得城市拼音
|
|
return;
|
|
}
|
|
}
|
|
} else {
|
|
showDialog("暂无数据，无法查看");
|
|
}
|
|
//没有找到对应城市的话，那么返回到全国地图
|
|
option.series[0].mapType = "china";
|
|
myChart.setOption(option);
|
|
});
|
|
window.addEventListener("resize", function () {
|
|
myChart.resize();
|
|
});
|
|
}
|
|
}
|
|
},
|
|
});
|
|
}
|
|
//分岗位招聘需求
|
|
function getData4() {
|
|
$.ajax({
|
|
type: "GET",
|
|
url: baseUrl + "/dataNew/getData4",
|
|
async: true,
|
|
data: { date: formattedDateTime },
|
|
success: function (res) {
|
|
//console.log(res);
|
|
if (res.code == "0") {
|
|
var name = [];
|
|
var xq = [];
|
|
var qz = [];
|
|
for (var i = 0; i < res.data.length; i++) {
|
|
name.push(res.data[i].name);
|
|
xq.push(res.data[i].xq);
|
|
qz.push(res.data[i].qz);
|
|
}
|
|
var myChart = echarts.init(document.getElementById("echart4"));
|
|
var option = {
|
|
title: {
|
|
// text: "分岗位招聘需求",
|
|
subtext: "",
|
|
left: "center",
|
|
textStyle: { fontSize: 13, color: "#fff", fontWeight: 400 },
|
|
},
|
|
legend: {
|
|
left: "right",
|
|
textStyle: { color: "#fff", fontSize: 10 },
|
|
show: false,
|
|
},
|
|
tooltip: { trigger: "axis", axisPointer: { type: "shadow" } },
|
|
grid: {
|
|
left: "0",
|
|
top: "20%",
|
|
right: "0",
|
|
bottom: "5",
|
|
containLabel: true,
|
|
},
|
|
xAxis: {
|
|
nameLocation: "end",
|
|
nameGap: 7,
|
|
type: "category",
|
|
data: name,
|
|
axisLine: {
|
|
show: true,
|
|
lineStyle: {
|
|
color: "rgba(63, 199, 155, 1)",
|
|
width: 1,
|
|
type: "solid",
|
|
},
|
|
},
|
|
axisTick: { show: false },
|
|
axisLabel: {
|
|
interval: 0,
|
|
rotate: 0,
|
|
textStyle: { color: "rgba(63, 199, 155, 1)", fontSize: "12" },
|
|
},
|
|
},
|
|
yAxis: {
|
|
type: "value",
|
|
// name: "万人/万个",
|
|
nameGap: 0,
|
|
nameTextStyle: { color: "#fff", fontSize: 10, padding: 6 },
|
|
position: "top",
|
|
axisLabel: {
|
|
show: true,
|
|
textStyle: { color: "rgba(63, 199, 155, 1)", fontSize: "12" },
|
|
},
|
|
axisTick: { show: false },
|
|
axisLine: {
|
|
show: false,
|
|
lineStyle: {
|
|
color: "rgba(255,255,255,.9)",
|
|
width: 1,
|
|
type: "solid",
|
|
},
|
|
},
|
|
splitLine: { lineStyle: { color: "rgba(63, 199, 155, .5)" } },
|
|
},
|
|
series: [
|
|
{
|
|
type: "bar",
|
|
name: "需求人数",
|
|
barWidth: "15%",
|
|
itemStyle: {
|
|
normal: {
|
|
opacity: 1,
|
|
barBorderRadius: [10, 10, 0, 0],
|
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
|
{ offset: 0, color: "#2F69FC " },
|
|
{ offset: 1, color: "#51D7FF" },
|
|
]),
|
|
},
|
|
},
|
|
data: xq,
|
|
},
|
|
],
|
|
};
|
|
myChart.setOption(option);
|
|
window.addEventListener("resize", function () {
|
|
myChart.resize();
|
|
});
|
|
}
|
|
},
|
|
});
|
|
}
|
|
//工资水平
|
|
function getData12() {
|
|
$.ajax({
|
|
type: "GET",
|
|
url: baseUrl + "/dataNew/getData12",
|
|
async: true,
|
|
data: { date: formattedDateTime },
|
|
success: function (res) {
|
|
//console.log(res);
|
|
if (res.code == "0") {
|
|
var myChart = echarts.init(document.getElementById("echart12"));
|
|
var option = {
|
|
title: {
|
|
text: "不同薪酬区间的岗位需求",
|
|
subtext: "",
|
|
left: "center",
|
|
textStyle: { fontSize: 13, color: "#fff", fontWeight: 400 },
|
|
},
|
|
legend: { left: "left", textStyle: { color: "#fff", fontSize: 10 } },
|
|
tooltip: { trigger: "axis", axisPointer: { type: "shadow" } },
|
|
grid: {
|
|
left: "0",
|
|
top: "20%",
|
|
right: "5",
|
|
bottom: "5",
|
|
containLabel: true,
|
|
},
|
|
xAxis: {
|
|
nameLocation: "end",
|
|
nameGap: 7,
|
|
type: "category",
|
|
data: res.data.name,
|
|
axisLine: {
|
|
show: true,
|
|
lineStyle: {
|
|
color: "rgba(255,255,255,.9)",
|
|
width: 1,
|
|
type: "solid",
|
|
},
|
|
},
|
|
axisTick: { show: false },
|
|
axisLabel: {
|
|
interval: 0,
|
|
rotate: 275,
|
|
textStyle: { color: "rgba(255,255,255,.6)", fontSize: "9" },
|
|
},
|
|
},
|
|
yAxis: {
|
|
type: "value",
|
|
name: "万人/万个",
|
|
nameGap: 0,
|
|
nameTextStyle: { color: "#fff", fontSize: 10, padding: 6 },
|
|
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: "需求人数",
|
|
barWidth: "15%",
|
|
itemStyle: {
|
|
normal: { opacity: 1, barBorderRadius: 0, color: "#dd76aa" },
|
|
},
|
|
label: {
|
|
show: true,
|
|
position: "top",
|
|
distance: 5,
|
|
fontSize: "8",
|
|
},
|
|
data: res.data.data1,
|
|
},
|
|
{
|
|
type: "bar",
|
|
name: "求职人数",
|
|
barWidth: "15%",
|
|
itemStyle: {
|
|
normal: { opacity: 1, barBorderRadius: 0, color: "#36c3fd" },
|
|
},
|
|
label: {
|
|
show: true,
|
|
position: "top",
|
|
distance: 5,
|
|
fontSize: "8",
|
|
},
|
|
data: res.data.data2,
|
|
},
|
|
],
|
|
};
|
|
myChart.setOption(option);
|
|
window.addEventListener("resize", function () {
|
|
myChart.resize();
|
|
});
|
|
}
|
|
},
|
|
});
|
|
}
|
|
//获取地图数据
|
|
function getData20() {
|
|
$.ajax({
|
|
type: "GET",
|
|
url: baseUrl + "/dataNew/getData2",
|
|
async: false,
|
|
data: { date: formattedDateTime, shengfen: "四川省" },
|
|
success: function (res) {
|
|
console.log(res);
|
|
if (res.code == "0") {
|
|
var city = res.data;
|
|
if (city.length > 0) {
|
|
var myChart = echarts.init(document.getElementById("echart20"));
|
|
$.getScript("js/province/js/" + "sichuan.js", function () {
|
|
var option = {
|
|
tooltip: {
|
|
trigger: "item",
|
|
formatter: function (params) {
|
|
if (params.name != "") {
|
|
return (
|
|
params.name +
|
|
"<br/>需求人数：" +
|
|
params.value +
|
|
"<br/>求职人数：" +
|
|
params.data.value1
|
|
);
|
|
} else {
|
|
return "暂无数据";
|
|
}
|
|
},
|
|
},
|
|
animation: false,
|
|
visualMap: {
|
|
show: false,
|
|
min: 1,
|
|
max: 2000000,
|
|
inRange: {
|
|
color: ["#d94e5d", "#eac736", "#50a3ba"].reverse(),
|
|
},
|
|
textStyle: { color: "#fff" },
|
|
},
|
|
//geo: {map: shortName, type: 'map', roam: false},
|
|
geo: {},
|
|
series: [
|
|
{
|
|
name: "四川",
|
|
type: "map",
|
|
mapType: "四川",
|
|
aspectScale: 0.75,
|
|
zoom: 1.3,
|
|
roam: true,
|
|
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) {
|
|
//点击事件
|
|
if (params.name != "") {
|
|
var name = params.name;
|
|
getCityListByProvinceCode(name); // 获取得城市拼音
|
|
return;
|
|
} else {
|
|
showDialog("暂无数据，无法查看");
|
|
}
|
|
//没有找到对应城市的话，那么返回到全国地图
|
|
option.series[0].mapType = "china";
|
|
myChart.setOption(option);
|
|
});
|
|
window.addEventListener("resize", function () {
|
|
myChart.resize();
|
|
});
|
|
});
|
|
// }
|
|
}
|
|
}
|
|
},
|
|
});
|
|
}
|
|
//学历
|
|
function getData10() {
|
|
$.ajax({
|
|
type: "GET",
|
|
url: baseUrl + "/dataNew/getData10",
|
|
async: true,
|
|
data: { date: formattedDateTime },
|
|
success: function (res) {
|
|
//console.log(res);
|
|
if (res.code == "0") {
|
|
var myChart = echarts.init(document.getElementById("echart10"));
|
|
var option = {
|
|
title: {
|
|
text: "分学历求职人数",
|
|
subtext: "",
|
|
left: "center",
|
|
textStyle: { fontSize: 13, color: "#fff", fontWeight: 400 },
|
|
},
|
|
legend: { left: "left", textStyle: { color: "#fff", fontSize: 10 } },
|
|
tooltip: { trigger: "axis", axisPointer: { type: "shadow" } },
|
|
grid: {
|
|
left: "0",
|
|
top: "20%",
|
|
right: "5",
|
|
bottom: "5",
|
|
containLabel: true,
|
|
},
|
|
xAxis: {
|
|
nameLocation: "end",
|
|
nameGap: 7,
|
|
type: "category",
|
|
data: res.data.name,
|
|
axisLine: {
|
|
show: true,
|
|
lineStyle: {
|
|
color: "rgba(255,255,255,.9)",
|
|
width: 1,
|
|
type: "solid",
|
|
},
|
|
},
|
|
axisTick: { show: false },
|
|
axisLabel: {
|
|
interval: 0,
|
|
rotate: 275,
|
|
textStyle: { color: "rgba(255,255,255,.6)", fontSize: "9" },
|
|
},
|
|
},
|
|
yAxis: {
|
|
type: "value",
|
|
name: "万人/万个",
|
|
nameGap: 0,
|
|
nameTextStyle: { color: "#fff", fontSize: 10, padding: 6 },
|
|
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: "需求人数",
|
|
barWidth: "15%",
|
|
itemStyle: {
|
|
normal: { opacity: 1, barBorderRadius: 0, color: "#dd76aa" },
|
|
},
|
|
label: {
|
|
show: true,
|
|
position: "top",
|
|
distance: 5,
|
|
fontSize: "8",
|
|
},
|
|
data: res.data.data1,
|
|
},
|
|
{
|
|
type: "bar",
|
|
name: "求职人数",
|
|
barWidth: "15%",
|
|
itemStyle: {
|
|
normal: { opacity: 1, barBorderRadius: 0, color: "#36c3fd" },
|
|
},
|
|
label: {
|
|
show: true,
|
|
position: "top",
|
|
distance: 5,
|
|
fontSize: "8",
|
|
},
|
|
data: res.data.data2,
|
|
},
|
|
],
|
|
};
|
|
myChart.setOption(option);
|
|
window.addEventListener("resize", function () {
|
|
myChart.resize();
|
|
});
|
|
}
|
|
},
|
|
});
|
|
}
|
|
//年龄
|
|
function getData11() {
|
|
$.ajax({
|
|
type: "GET",
|
|
url: baseUrl + "/dataNew/getData11",
|
|
async: true,
|
|
data: { date: formattedDateTime },
|
|
success: function (res) {
|
|
console.log(res);
|
|
if (res.code == "0") {
|
|
var myChart = echarts.init(document.getElementById("echart11"));
|
|
var option = {
|
|
title: {
|
|
text: "分年龄招聘需求",
|
|
subtext: "",
|
|
left: "center",
|
|
textStyle: { fontSize: 13, color: "#fff", fontWeight: 400 },
|
|
},
|
|
legend: { left: "left", textStyle: { color: "#fff", fontSize: 10 } },
|
|
tooltip: { trigger: "axis", axisPointer: { type: "shadow" } },
|
|
grid: {
|
|
left: "0",
|
|
top: "20%",
|
|
right: "5",
|
|
bottom: "5",
|
|
containLabel: true,
|
|
},
|
|
xAxis: {
|
|
nameLocation: "end",
|
|
nameGap: 7,
|
|
type: "category",
|
|
data: res.data.name,
|
|
axisLine: {
|
|
show: true,
|
|
lineStyle: {
|
|
color: "rgba(255,255,255,.9)",
|
|
width: 1,
|
|
type: "solid",
|
|
},
|
|
},
|
|
axisTick: { show: false },
|
|
axisLabel: {
|
|
interval: 0,
|
|
rotate: 275,
|
|
textStyle: { color: "rgba(255,255,255,.6)", fontSize: "9" },
|
|
},
|
|
},
|
|
yAxis: {
|
|
type: "value",
|
|
name: "万人/万个",
|
|
nameGap: 0,
|
|
nameTextStyle: { color: "#fff", fontSize: 10, padding: 6 },
|
|
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: "需求人数",
|
|
barWidth: "15%",
|
|
itemStyle: {
|
|
normal: { opacity: 1, barBorderRadius: 0, color: "#dd76aa" },
|
|
},
|
|
label: {
|
|
show: true,
|
|
position: "top",
|
|
distance: 5,
|
|
fontSize: "8",
|
|
},
|
|
data: res.data.data1,
|
|
},
|
|
{
|
|
type: "bar",
|
|
name: "求职人数",
|
|
barWidth: "15%",
|
|
itemStyle: {
|
|
normal: { opacity: 1, barBorderRadius: 0, color: "#36c3fd" },
|
|
},
|
|
label: {
|
|
show: true,
|
|
position: "top",
|
|
distance: 5,
|
|
fontSize: "8",
|
|
},
|
|
data: res.data.data2,
|
|
},
|
|
],
|
|
};
|
|
myChart.setOption(option);
|
|
window.addEventListener("resize", function () {
|
|
myChart.resize();
|
|
});
|
|
}
|
|
},
|
|
});
|
|
}
|
|
//分企业规模
|
|
function getData6() {
|
|
$.ajax({
|
|
type: "GET",
|
|
url: baseUrl + "/dataNew/getData6",
|
|
async: true,
|
|
data: { date: formattedDateTime },
|
|
success: function (res) {
|
|
console.log(res);
|
|
if (res.code == "0") {
|
|
var myChart = echarts.init(document.getElementById("echart6"));
|
|
var option = {
|
|
title: {
|
|
// text: "分企业规模招聘需求",
|
|
subtext: "",
|
|
left: "center",
|
|
textStyle: { fontSize: 13, color: "#fff", fontWeight: 400 },
|
|
},
|
|
legend: {
|
|
left: "right",
|
|
textStyle: { color: "#fff", fontSize: 10 },
|
|
show: false,
|
|
},
|
|
tooltip: { trigger: "axis", axisPointer: { type: "shadow" } },
|
|
grid: {
|
|
left: "0",
|
|
top: "20%",
|
|
right: "5",
|
|
bottom: "5",
|
|
containLabel: true,
|
|
},
|
|
xAxis: {
|
|
nameLocation: "end",
|
|
nameGap: 7,
|
|
type: "category",
|
|
data: res.data.name,
|
|
axisLine: {
|
|
show: true,
|
|
lineStyle: {
|
|
color: "#3FC79B",
|
|
width: 1,
|
|
type: "solid",
|
|
},
|
|
},
|
|
axisTick: { show: false },
|
|
axisLabel: {
|
|
interval: 0,
|
|
textStyle: { color: "#3FC79B", fontSize: "12" },
|
|
},
|
|
},
|
|
yAxis: {
|
|
type: "value",
|
|
nameGap: 0,
|
|
nameTextStyle: { color: "#fff", fontSize: 10, padding: 6 },
|
|
position: "top",
|
|
axisLabel: {
|
|
show: true,
|
|
textStyle: { color: "#3FC79B", fontSize: "12" },
|
|
},
|
|
axisTick: { show: false },
|
|
axisLine: {
|
|
show: true,
|
|
lineStyle: {
|
|
color: "#3FC79B",
|
|
width: 1,
|
|
type: "solid",
|
|
},
|
|
},
|
|
splitLine: { lineStyle: { color: "rgba(63, 199, 155, .5)" } },
|
|
},
|
|
series: [
|
|
{
|
|
type: "bar",
|
|
name: "需求人数",
|
|
barWidth: "15%",
|
|
itemStyle: {
|
|
normal: {
|
|
opacity: 1,
|
|
barBorderRadius: [10, 10, 0, 0],
|
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
|
{ offset: 0, color: "#8005F2" },
|
|
{ offset: 1, color: "#2D3CFF" },
|
|
]),
|
|
},
|
|
},
|
|
data: res.data.data1,
|
|
},
|
|
],
|
|
};
|
|
myChart.setOption(option);
|
|
window.addEventListener("resize", function () {
|
|
myChart.resize();
|
|
});
|
|
}
|
|
},
|
|
});
|
|
}
|
|
function getData18() {
|
|
$.ajax({
|
|
type: "GET",
|
|
url: baseUrl + "/dataNew/getData6",
|
|
async: true,
|
|
data: { date: formattedDateTime },
|
|
success: function (res) {
|
|
console.log(res);
|
|
if (res.code == "0") {
|
|
var myChart = echarts.init(document.getElementById("echart8"));
|
|
var option = {
|
|
tooltip: {
|
|
trigger: "axis",
|
|
axisPointer: {
|
|
type: "shadow",
|
|
},
|
|
},
|
|
legend: { show: false },
|
|
grid: {
|
|
left: "3%",
|
|
right: "4%",
|
|
bottom: "3%",
|
|
containLabel: true,
|
|
},
|
|
xAxis: {
|
|
type: "value",
|
|
boundaryGap: [0, 0.01],
|
|
axisLabel: {
|
|
interval: 0,
|
|
textStyle: { color: "#3FC79B", fontSize: "12" },
|
|
},
|
|
axisLine: {
|
|
show: true,
|
|
lineStyle: {
|
|
color: "#3FC79B",
|
|
width: 1,
|
|
type: "dashed",
|
|
},
|
|
},
|
|
splitLine: {
|
|
lineStyle: { color: "rgba(63, 199, 155, .5)", type: "dashed" },
|
|
},
|
|
},
|
|
yAxis: {
|
|
type: "category",
|
|
axisTick: { show: false },
|
|
data: ["15K以上", "10K-15K", "8K-10K", "5K-8K", "3K-5K", "3K以下"],
|
|
axisLabel: {
|
|
show: true,
|
|
textStyle: { color: "#0072FF", fontSize: "12" },
|
|
},
|
|
axisLine: {
|
|
show: true,
|
|
lineStyle: {
|
|
color: "#3FC79B",
|
|
width: 1,
|
|
type: "dashed",
|
|
},
|
|
},
|
|
},
|
|
series: [
|
|
{
|
|
name: "2011",
|
|
type: "bar",
|
|
barWidth: "35%",
|
|
itemStyle: {
|
|
normal: {
|
|
opacity: 1,
|
|
barBorderRadius: [0, 10, 10, 0],
|
|
color: new echarts.graphic.LinearGradient(1, 0, 0, 0, [
|
|
{ offset: 0, color: "#E54839" },
|
|
{ offset: 1, color: "#FAC56A" },
|
|
]),
|
|
},
|
|
},
|
|
data: [0, 20, 40, 60, 80, 100],
|
|
},
|
|
],
|
|
};
|
|
myChart.setOption(option);
|
|
window.addEventListener("resize", function () {
|
|
myChart.resize();
|
|
});
|
|
}
|
|
},
|
|
});
|
|
}
|
|
$(function () {
|
|
getDate();
|
|
getData1();
|
|
getData2();
|
|
getData20();
|
|
getData4();
|
|
getData5();
|
|
getData6();
|
|
getData7();
|
|
getData8();
|
|
// getData9();
|
|
getData10();
|
|
getData11();
|
|
getData12();
|
|
getData18();
|
|
});
|
|
|
|
//历史数据
|
|
function get_echart_trend1() {
|
|
var fenlei = "行业";
|
|
$.ajax({
|
|
type: "GET",
|
|
url: baseUrl + "/dataNew/getData13",
|
|
data: { fenlei: fenlei },
|
|
success: function (res) {
|
|
//console.log(res);
|
|
if (res.code == "0") {
|
|
var arr = [];
|
|
for (var i = 0; i < res.data.keys.length; i++) {
|
|
var obj = {};
|
|
obj.data = res.data["qzlist" + i];
|
|
obj.type = "line";
|
|
obj.name = res.data.keys[i];
|
|
arr.push(obj);
|
|
}
|
|
for (var j = 0; j < res.data.keys.length; j++) {
|
|
var obj = {};
|
|
obj.data = res.data["xqlist" + j];
|
|
obj.type = "line";
|
|
obj.name = res.data.keys[j];
|
|
arr.push(obj);
|
|
}
|
|
var myChart = echarts.init(document.getElementById("echart_trend1"));
|
|
var option = {
|
|
tooltip: {
|
|
trigger: "axis",
|
|
axisPointer: { type: "shadow" },
|
|
position: [10, 0],
|
|
},
|
|
grid: {
|
|
left: "0",
|
|
top: "5%",
|
|
right: "5",
|
|
bottom: "0",
|
|
containLabel: true,
|
|
},
|
|
xAxis: {
|
|
nameLocation: "end",
|
|
nameGap: 7,
|
|
type: "category",
|
|
data: res.data.name,
|
|
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: arr,
|
|
};
|
|
myChart.setOption(option);
|
|
window.addEventListener("resize", function () {
|
|
myChart.resize();
|
|
});
|
|
}
|
|
},
|
|
});
|
|
}
|
|
function get_echart_trend2() {
|
|
var fenlei = "企业规模";
|
|
$.ajax({
|
|
type: "GET",
|
|
url: baseUrl + "/dataNew/getData13",
|
|
data: { fenlei: fenlei },
|
|
success: function (res) {
|
|
//console.log(res);
|
|
if (res.code == "0") {
|
|
var arr = [];
|
|
for (var i = 0; i < res.data.keys.length; i++) {
|
|
var obj = {};
|
|
obj.data = res.data["qzlist" + i];
|
|
obj.type = "line";
|
|
obj.name = res.data.keys[i];
|
|
arr.push(obj);
|
|
}
|
|
for (var j = 0; j < res.data.keys.length; j++) {
|
|
var obj = {};
|
|
obj.data = res.data["xqlist" + j];
|
|
obj.type = "line";
|
|
obj.name = res.data.keys[j];
|
|
arr.push(obj);
|
|
}
|
|
var myChart = echarts.init(document.getElementById("echart_trend2"));
|
|
var option = {
|
|
tooltip: {
|
|
trigger: "axis",
|
|
axisPointer: { type: "shadow" },
|
|
position: [10, 0],
|
|
},
|
|
grid: {
|
|
left: "0",
|
|
top: "5%",
|
|
right: "5",
|
|
bottom: "0",
|
|
containLabel: true,
|
|
},
|
|
xAxis: {
|
|
nameLocation: "end",
|
|
nameGap: 7,
|
|
type: "category",
|
|
data: res.data.name,
|
|
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: arr,
|
|
};
|
|
myChart.setOption(option);
|
|
window.addEventListener("resize", function () {
|
|
myChart.resize();
|
|
});
|
|
}
|
|
},
|
|
});
|
|
}
|
|
function get_echart_trend3() {
|
|
var fenlei = "工资水平";
|
|
$.ajax({
|
|
type: "GET",
|
|
url: baseUrl + "/dataNew/getData13",
|
|
data: { fenlei: fenlei },
|
|
success: function (res) {
|
|
console.log(res);
|
|
if (res.code == "0") {
|
|
var arr = [];
|
|
for (var i = 0; i < res.data.keys.length; i++) {
|
|
var obj = {};
|
|
obj.data = res.data["qzlist" + i];
|
|
obj.type = "line";
|
|
obj.name = res.data.keys[i];
|
|
arr.push(obj);
|
|
}
|
|
for (var j = 0; j < res.data.keys.length; j++) {
|
|
var obj = {};
|
|
obj.data = res.data["xqlist" + j];
|
|
obj.type = "line";
|
|
obj.name = res.data.keys[j];
|
|
arr.push(obj);
|
|
}
|
|
var myChart = echarts.init(document.getElementById("echart_trend3"));
|
|
var option = {
|
|
tooltip: { trigger: "axis", axisPointer: { type: "shadow" } },
|
|
grid: {
|
|
left: "0",
|
|
top: "5%",
|
|
right: "5",
|
|
bottom: "0",
|
|
containLabel: true,
|
|
},
|
|
xAxis: {
|
|
nameLocation: "end",
|
|
nameGap: 7,
|
|
type: "category",
|
|
data: res.data.name,
|
|
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: arr,
|
|
};
|
|
myChart.setOption(option);
|
|
window.addEventListener("resize", function () {
|
|
myChart.resize();
|
|
});
|
|
}
|
|
},
|
|
});
|
|
}
|
|
function get_echart_trend4() {
|
|
var fenlei = "产业";
|
|
$.ajax({
|
|
type: "GET",
|
|
url: baseUrl + "/dataNew/getData13",
|
|
data: { fenlei: fenlei },
|
|
success: function (res) {
|
|
console.log(res);
|
|
if (res.code == "0") {
|
|
var arr = [];
|
|
for (var i = 0; i < res.data.keys.length; i++) {
|
|
var obj = {};
|
|
obj.data = res.data["qzlist" + i];
|
|
obj.type = "bar";
|
|
obj.name = res.data.keys[i];
|
|
arr.push(obj);
|
|
}
|
|
for (var j = 0; j < res.data.keys.length; j++) {
|
|
var obj = {};
|
|
obj.data = res.data["xqlist" + j];
|
|
obj.type = "bar";
|
|
obj.name = res.data.keys[j];
|
|
arr.push(obj);
|
|
}
|
|
var myChart = echarts.init(document.getElementById("echart_trend4"));
|
|
var option = {
|
|
tooltip: {
|
|
trigger: "axis",
|
|
axisPointer: { type: "shadow" },
|
|
position: [10, 0],
|
|
},
|
|
grid: {
|
|
left: "0",
|
|
top: "5%",
|
|
right: "5",
|
|
bottom: "0",
|
|
containLabel: true,
|
|
},
|
|
xAxis: {
|
|
nameLocation: "end",
|
|
nameGap: 7,
|
|
type: "category",
|
|
data: res.data.name,
|
|
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: arr,
|
|
};
|
|
myChart.setOption(option);
|
|
window.addEventListener("resize", function () {
|
|
myChart.resize();
|
|
});
|
|
}
|
|
},
|
|
});
|
|
}
|
|
function get_echart_trend5() {
|
|
var fenlei = "企业规模";
|
|
$.ajax({
|
|
type: "GET",
|
|
url: baseUrl + "/dataNew/getData13",
|
|
data: { fenlei: fenlei },
|
|
success: function (res) {
|
|
console.log(res);
|
|
if (res.code == "0") {
|
|
var arr = [];
|
|
for (var i = 0; i < res.data.keys.length; i++) {
|
|
var obj = {};
|
|
obj.data = res.data["qzlist" + i];
|
|
obj.type = "bar";
|
|
obj.name = res.data.keys[i];
|
|
arr.push(obj);
|
|
}
|
|
for (var j = 0; j < res.data.keys.length; j++) {
|
|
var obj = {};
|
|
obj.data = res.data["xqlist" + j];
|
|
obj.type = "bar";
|
|
obj.name = res.data.keys[j];
|
|
arr.push(obj);
|
|
}
|
|
var myChart = echarts.init(document.getElementById("echart_trend5"));
|
|
var option = {
|
|
tooltip: {
|
|
trigger: "axis",
|
|
axisPointer: { type: "shadow" },
|
|
position: [10, 0],
|
|
},
|
|
grid: {
|
|
left: "0",
|
|
top: "5%",
|
|
right: "5",
|
|
bottom: "0",
|
|
containLabel: true,
|
|
},
|
|
xAxis: {
|
|
nameLocation: "end",
|
|
nameGap: 7,
|
|
type: "category",
|
|
data: res.data.name,
|
|
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: arr,
|
|
};
|
|
myChart.setOption(option);
|
|
window.addEventListener("resize", function () {
|
|
myChart.resize();
|
|
});
|
|
}
|
|
},
|
|
});
|
|
}
|
|
function get_echart_trend6() {
|
|
var fenlei = "学历";
|
|
$.ajax({
|
|
type: "GET",
|
|
url: baseUrl + "/dataNew/getData13",
|
|
data: { fenlei: fenlei },
|
|
success: function (res) {
|
|
console.log(res);
|
|
if (res.code == "0") {
|
|
var arr = [];
|
|
for (var i = 0; i < res.data.keys.length; i++) {
|
|
var obj = {};
|
|
obj.data = res.data["qzlist" + i];
|
|
obj.type = "bar";
|
|
obj.name = res.data.keys[i];
|
|
arr.push(obj);
|
|
}
|
|
for (var j = 0; j < res.data.keys.length; j++) {
|
|
var obj = {};
|
|
obj.data = res.data["xqlist" + j];
|
|
obj.type = "bar";
|
|
obj.name = res.data.keys[j];
|
|
arr.push(obj);
|
|
}
|
|
var myChart = echarts.init(document.getElementById("echart_trend6"));
|
|
var option = {
|
|
tooltip: {
|
|
trigger: "axis",
|
|
axisPointer: { type: "shadow" },
|
|
position: [10, 0],
|
|
},
|
|
grid: {
|
|
left: "0",
|
|
top: "5%",
|
|
right: "5",
|
|
bottom: "0",
|
|
containLabel: true,
|
|
},
|
|
xAxis: {
|
|
nameLocation: "end",
|
|
nameGap: 7,
|
|
type: "category",
|
|
data: res.data.name,
|
|
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: arr,
|
|
};
|
|
myChart.setOption(option);
|
|
window.addEventListener("resize", function () {
|
|
myChart.resize();
|
|
});
|
|
}
|
|
},
|
|
});
|
|
}
|
|
function get_echart_trend7() {
|
|
var fenlei = "岗位类型";
|
|
$.ajax({
|
|
type: "GET",
|
|
url: baseUrl + "/dataNew/getData13",
|
|
data: { fenlei: fenlei },
|
|
success: function (res) {
|
|
console.log(res);
|
|
if (res.code == "0") {
|
|
var arr = [];
|
|
for (var i = 0; i < res.data.keys.length; i++) {
|
|
var obj = {};
|
|
obj.data = res.data["qzlist" + i];
|
|
obj.type = "bar";
|
|
obj.name = res.data.keys[i];
|
|
arr.push(obj);
|
|
}
|
|
for (var j = 0; j < res.data.keys.length; j++) {
|
|
var obj = {};
|
|
obj.data = res.data["xqlist" + j];
|
|
obj.type = "bar";
|
|
obj.name = res.data.keys[j];
|
|
arr.push(obj);
|
|
}
|
|
var myChart = echarts.init(document.getElementById("echart_trend7"));
|
|
var option = {
|
|
tooltip: { trigger: "axis", axisPointer: { type: "shadow" } },
|
|
grid: {
|
|
left: "0",
|
|
top: "5%",
|
|
right: "5",
|
|
bottom: "0",
|
|
containLabel: true,
|
|
},
|
|
xAxis: {
|
|
nameLocation: "end",
|
|
nameGap: 7,
|
|
type: "category",
|
|
data: res.data.name,
|
|
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: arr,
|
|
};
|
|
myChart.setOption(option);
|
|
window.addEventListener("resize", function () {
|
|
myChart.resize();
|
|
});
|
|
}
|
|
},
|
|
});
|
|
}
|
|
//提示框
|
|
function showDialog(content) {
|
|
var layer = document.createElement("div");
|
|
layer.id = "layer";
|
|
var style = {
|
|
background: "rgba(0,0,0,0.3)",
|
|
position: "absolute",
|
|
zIndex: 10,
|
|
width: "160px",
|
|
height: "40px",
|
|
lineHeight: "40px",
|
|
left: "50%",
|
|
top: "50%",
|
|
marginLeft: "-100px",
|
|
marginTop: "80px",
|
|
//padding: "4px 10px",
|
|
color: "#fff",
|
|
};
|
|
for (var i in style) {
|
|
layer.style[i] = style[i];
|
|
}
|
|
if (document.getElementById("layer") == null) {
|
|
document.body.appendChild(layer);
|
|
layer.innerHTML = content;
|
|
layer.style.textAlign = "center";
|
|
layer.style.lineHeight = "40px";
|
|
setTimeout("document.body.removeChild(layer)", 3000);
|
|
}
|
|
}
|