//var baseUrl = 'http://cgsu81beft.51xd.pub';
var baseUrl = "http://39.101.167.152:8088/shekecaiji";
var testUrl = "http://192.168.3.104:8000/jobslink-api/jkworksreport"
console.log(document.cookie)
// 获取cookie
function getCookie(cookieName) {
var cookies = document.cookie.split("; ");
for (var i = 0; i < cookies.length; i++) {
var cookie = cookies[i].split("=");
if (cookie[0] === cookieName) {
return cookie[1];
}
}
return "";
}
var allData = {"citys":[
{"name":"德阳","value":[104.398651, 31.127991,2],"symbolSize":10,"itemStyle":{"normal":{"color":"#F58158"}}},
{"name":"北京","value":[116.418757, 39.917544,2],"symbolSize":4,"itemStyle":{"normal":{"color":"#F58158"}}},
{"name":"上海","value":[121.490317, 31.222771,2],"symbolSize":4,"itemStyle":{"normal":{"color":"#F58158"}}},
{"name":"广州","value":[113.280637, 23.125178,2],"symbolSize":4,"itemStyle":{"normal":{"color":"#F58158"}}},
{"name":"南京","value":[118.767413, 32.041544,2],"symbolSize":4,"itemStyle":{"normal":{"color":"#F58158"}}},
{"name":"厦门","value":[118.11022, 24.490474,2],"symbolSize":4,"itemStyle":{"normal":{"color":"#F58158"}}},
{"name":"昆明","value":[102.712251, 25.040609,2],"symbolSize":4,"itemStyle":{"normal":{"color":"#F58158"}}},
],
"moveLines":[
{"fromName":"德阳","toName":"北京","coords":[[104.398651, 31.127991],[116.418757, 39.917544]]},
{"fromName":"德阳","toName":"上海","coords":[[104.398651, 31.127991],[121.490317, 31.222771]]},
{"fromName":"德阳","toName":"广州","coords":[[104.398651, 31.127991],[113.280637, 23.125178]]},
{"fromName":"德阳","toName":"南京","coords":[[104.398651, 31.127991],[118.767413, 32.041544]]},
{"fromName":"德阳","toName":"厦门","coords":[[104.398651, 31.127991],[118.11022, 24.490474]]},
{"fromName":"德阳","toName":"昆明","coords":[[104.398651, 31.127991],[102.712251, 25.040609]]},
]};
var token = getCookie("jobslink-access-token");
// $.ajaxSetup({
// headers: {
// 'Content-Type': 'application/json', // 指定请求体为JSON格式
// 'Jobslink-Auth': `bearer ${token}`
// }
// });
//测试方法
function getMapData1() {
$.ajax({
type: "GET",
url: testUrl + "/getMapData1",
headers: {
'Content-Type': 'application/json', // 指定请求体为JSON格式
'Jobslink-Auth': `bearer ${token}`
},
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 getMapData2() {
$.ajax({
type: "GET",
headers: {
'Content-Type': 'application/json', // 指定请求体为JSON格式
'Jobslink-Auth': `bearer ${token}`
},
url: testUrl + "/getMapData2",
async: false,
success: function (res) {
console.log(res)
},
});
}
function getMapData3() {
$.ajax({
type: "GET",
headers: {
'Content-Type': 'application/json', // 指定请求体为JSON格式
'Jobslink-Auth': `bearer ${token}`
},
url: testUrl + "/getMapData3",
async: false,
success: function (res) {
},
});
}
function testData4() {
$.ajax({
type: "GET",
headers: {
'Content-Type': 'application/json', // 指定请求体为JSON格式
'Jobslink-Auth': `bearer ${token}`
},
url: testUrl + "/getData1",
data: { date: '2023-12', province: '四川省' },
async: true,
success: function (res) {
},
});
}
function getIndustryData() {
console.log('6666666666666')
$.ajax({
type: "GET",
headers: {
'Content-Type': 'application/json', // 指定请求体为JSON格式
'Jobslink-Auth': `bearer ${token}`
},
url: testUrl + "/getData2",
data: { date: '2023-12', province: '四川省' },
async: true,
success: function (res) {
console.log('6666666666666')
// data1 岗位数, // data2 求职人数
console.log(res.data)
var name = res.data.name;
if(name && name.length > 0) {
for(var i = 0; i < name.length; i++) {
console.log(name[i])
}
}
},
});
}
function testData6() {
$.ajax({
type: "GET",
headers: {
'Content-Type': 'application/json', // 指定请求体为JSON格式
'Jobslink-Auth': `bearer ${token}`
},
url: testUrl + "/getData3",
data: { date: '2023-12', province: '四川省' },
async: true,
success: function (res) {
},
});
}
function testData7() {
$.ajax({
type: "GET",
headers: {
'Content-Type': 'application/json', // 指定请求体为JSON格式
'Jobslink-Auth': `bearer ${token}`
},
url: testUrl + "/getData4",
data: { date: '2023-12', province: '四川省' },
async: true,
success: function (res) {
},
});
}
function testData8() {
$.ajax({
type: "GET",
headers: {
'Content-Type': 'application/json', // 指定请求体为JSON格式
'Jobslink-Auth': `bearer ${token}`
},
url: testUrl + "/getData5",
data: { date: '2023-12', province: '四川省' },
async: true,
success: function (res) {
},
});
}
function testData9() {
$.ajax({
type: "GET",
headers: {
'Content-Type': 'application/json', // 指定请求体为JSON格式
'Jobslink-Auth': `bearer ${token}`
},
url: testUrl + "/getData6",
data: { date: '2023-12', province: '四川省' },
async: true,
success: function (res) {
},
});
}
function testData10() {
$.ajax({
type: "GET",
headers: {
'Content-Type': 'application/json', // 指定请求体为JSON格式
'Jobslink-Auth': `bearer ${token}`
},
url: testUrl + "/getData7",
data: { date: '2023-12', province: '四川省' },
async: true,
success: function (res) {
},
});
}
function testData11() {
$.ajax({
type: "GET",
headers: {
'Content-Type': 'application/json', // 指定请求体为JSON格式
'Jobslink-Auth': `bearer ${token}`
},
url: testUrl + "/getData8",
data: { date: '2023-12', province: '四川省' },
async: true,
success: function (res) {
},
});
}
//头部数据--------------------------------------
//获取当前时间
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(
'
' +
(i + 1) +
'' +
n +
"" +
data.data1[i] +
"" +
data.data2[i] +
""
);
});
}
//分单位
function getData5() {
$.ajax({
type: "GET",
url: testUrl + "/getData5",
headers: {
'Content-Type': 'application/json', // 指定请求体为JSON格式
'Jobslink-Auth': `bearer ${token}`
},
async: true,
data: { date: '2023-12', province: '四川省' },
success: function (res) {
//console.log(res);
if (res.code == "200") {
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" },
]),
},
},
// 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,
// },
],
};
console.log(option);
myChart.setOption(option);
window.addEventListener("resize", function () {
myChart.resize();
});
}
},
});
}
//分产业
function getData7() {
$.ajax({
type: "GET",
url: testUrl + "/getData7",
headers: {
'Content-Type': 'application/json', // 指定请求体为JSON格式
'Jobslink-Auth': `bearer ${token}`
},
async: true,
data: { date: '2023-12', province: '四川省' },
success: function (res) {
//console.log(res);
if (res.code == "200") {
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: arr,
},
],
};
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 =
"detail.html?shengFen=" +
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 +
"
需求人数:" +
params.value +
"
求职人数:" +
params.data.value1
);
} else {
return "暂无数据";
}
},
},
visualMap: {
show: false,
min: 1,
max: 300000,
inRange: { color: ["#063b9e", "#299af0", "#cae2fd"].reverse() },
textStyle: { color: "#fff" },
},
geo: {
show:true, // 是否显示
map: 'china', // 地图类型。world世界地图,china中国地图
// center:[115.97, 29.71], //当前视角的中心点,用经纬度表示
label: {
normal:{ //普通状态下的标签文本样式。(省份名称)
show: false, //是否在普通状态下显示标签。
textStyle: { // 文字设置
color: '#fff'
},
},
emphasis: { // 是否在高亮状态下显示标签。(省份名称)
show: true,
textStyle: { // 文字设置
color: '#fff'
},
}
},
roam: true, // 是否开启鼠标缩放和平移漫游。默认不开启。如果只想要开启缩放或者平移,可以设置成 'scale' 或者 'move'。设置成 true 为都开启
itemStyle: { // 地图板块区域的多边形 图形样式
normal: { // 默认板块信息
areaColor: '#58B3CC',
borderColor: '#404a59'
},
emphasis: { // 高亮版板块信息
areaColor: '#51D7FF'
}
}
},
series: [{
name: '地点',
type: 'effectScatter', // 特效散点图
coordinateSystem: 'geo', // 'cartesian2d'使用二维的直角坐标系。'geo'使用地理坐标系
zlevel: 2, // 所有图形的 zlevel 值。
rippleEffect: { //涟漪特效相关配置。
brushType: 'stroke', //波纹的绘制方式,可选 'stroke' 和 'fill'。
period:4, // 动画的时间。
scale:2.5, // 动画中波纹的最大缩放比例。
},
label: {
normal: {
show: false, //是否显示标签。
position: "inside", //标签的位置。// 绝对的像素值[10, 10],// 相对的百分比['50%', '50%'].'top','left','right','bottom','inside','insideLeft','insideRight','insideTop','insideBottom','insideTopLeft','insideBottomLeft','insideTopRight','insideBottomRight'
offset: [30, 40], //是否对文字进行偏移。默认不偏移。例如:[30, 40] 表示文字在横向上偏移 30,纵向上偏移 40。
formatter: '{b}: {c}', //标签内容格式器。模板变量有 {a}、{b}、{c},分别表示系列名,数据名,数据值。
},
emphasis: {
show: true,
position: 'right',
formatter: '{b}'
}
},
symbolSize: 2, // 标记的大小,可以设置成诸如 10 这样单一的数字,也可以用数组分开表示宽和高,例如 [20, 10] 表示标记宽为20,高为10。
showEffectOn: 'render', // 配置何时显示特效。可选:'render' 绘制完成后显示特效。'emphasis' 高亮(hover)的时候显示特效。
itemStyle: { // 图形样式,normal 是图形在默认状态下的样式;emphasis 是图形在高亮状态下的样式,比如在鼠标悬浮或者图例联动高亮时。
normal: {
color: '#46bee9'
}
},
data: allData.citys
}, {
name: '线路',
type: 'lines',
coordinateSystem: 'geo', // 'cartesian2d'使用二维的直角坐标系。'geo'使用地理坐标系
zlevel: 2,
large: true, // 是否开启大规模散点图的优化,在数据图形特别多的时候(>=5k)可以开启。开启后配合 largeThreshold 在数据量大于指定阈值的时候对绘制进行优化。缺点:优化后不能自定义设置单个数据项的样式。
effect: {
show: true,
constantSpeed: 30, // 点移动的速度
symbol: 'arrow', // 图形 'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow'
symbolSize: 3, // 标记的大小,可以设置成诸如 10 这样单一的数字,也可以用数组分开表示宽和高,例如 [20, 10] 表示标记宽为20,高为10。
trailLength: 0, // 线的宽度
},
lineStyle: { // 线的颜色、宽度,样式设置
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
offset: 0, color: '#58B3CC'
}, {
offset: 1, color: '#F58158'
}], false),
width: 3, // 线的宽度
opacity: 0.5, // 线的透明度
curveness: 0.1 // 线的完全程度
}
},
data: allData.moveLines
}]
};
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: testUrl + "/getData6",
headers: {
'Content-Type': 'application/json', // 指定请求体为JSON格式
'Jobslink-Auth': `bearer ${token}`
},
async: true,
data: { date: '2023-12', province: '四川省' },
success: function (res) {
//console.log(res);
if (res.code == "200") {
// 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: res.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" },
]),
},
},
// 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: qz,
// },
],
};
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/" + "deyang.js", function () {
var option = {
tooltip: {
trigger: "item",
formatter: function (params) {
if (params.name != "") {
return (
params.name +
"
需求人数:" +
params.value +
"
求职人数:" +
params.data.value1
);
} else {
return "暂无数据";
}
},
},
animation: false,
visualMap: {
show: false,
min: 1,
max: 2000000,
inRange: {
color: ["#d94e5d", "#eac736", "#50a3ba"].reverse(),
},
textStyle: { color: "#fff" },
},
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,
data: [
{name:'旌阳区', value:1099, value1: 2011},
{name:'罗江区', value:199, value1: 211},
{name:'中江县', value:699, value1: 811},
{name:'广汉市', value:321, value1: 999},
{name:'什邡市', value:6788, value1: 2567},
{name:'绵竹市', value:342, value1: 678}
]
},
],
};
myChart.setOption(option);
//地图点击事件
myChart.on("click", function (params) {
console.log(params);
console.log(params.name);
window.location.href = "detail.html?shengFen=" + escape(params.name) +
"&abbreviation=" + params.name + "&shortName=" + escape(params.name);
//点击事件
// 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: testUrl + "/getData4",
headers: {
'Content-Type': 'application/json', // 指定请求体为JSON格式
'Jobslink-Auth': `bearer ${token}`
},
async: true,
data: { date: '2023-12', province: '四川省' },
success: function (res) {
console.log(res);
if (res.code == "200") {
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,
rotate: 340,
textStyle: { color: "#3FC79B", fontSize: "10" },
},
},
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: testUrl + "/getData3",
headers: {
'Content-Type': 'application/json', // 指定请求体为JSON格式
'Jobslink-Auth': `bearer ${token}`
},
async: true,
data: { date: '2023-12', province: '四川省' },
success: function (res) {
console.log(res);
if (res.code == "200") {
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: res.data.name,
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: res.data.data1,
},
],
};
myChart.setOption(option);
window.addEventListener("resize", function () {
myChart.resize();
});
}
},
});
}
$(function () {
getMapData1();
getMapData2(); // 分行业
getMapData3();
testData4();
getIndustryData();
testData6();
testData7();
testData8();
testData9();
testData10();
testData11();
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);
}
}