就业情况
var worksdatas = [{
category:'Java方向',
weekdata:[120, 132, 101, 134, 90, 230, 210]
},{
category:'WEB前端',
weekdata:[340, 352, 201, 154, 190, 330, 410]
},{
category:'UI设计',
weekdata:[510, 132, 301, 334, 390, 330, 320]
},{
category:'网络安全',
weekdata:[620, 932, 901, 934, 1290, 1330, 1320]
}]
// 就业情况
function workReportFun() {
// 获取报表区域dom
var reportDom = document.getElementById('businessReport');
// 初始化报表
var workReport = echarts.init(reportDom);
// 准备报表选项option
var color = ['orange','blue','red','#448d0b'];
let datas = worksdatas.map((item,index)=>{
var currentData = {
name:item.category,
type:'line',
symbol:'emptyCircle',
symbolSize:8,
lineStyle:{
color:color[index]
},
smooth:true,
data:item.weekdata
}
return currentData;
})
console.log(datas);
var option = {
xAxis:{
type:'category',
boundaryGap:false,
axisLabel:{
color:'#fff'
},
data:['周一','周二','周三','周四','周五','周六','周日']
},
yAxis:{
type:'value',
axisLabel:{
color:'#fff'
},
splitLine:{
show:true,
lineStyle:{
color:'rgba(255,255,255,0.1)',
type:'dashed'
}
}
},
grid:{
left:'10%',
right:'5%',
top:'5%',
bottom:'12%'
},
tooltip:{
show:true,
type:'axis'
},
//数据列表
series:datas
}
// option写入报表workReport
workReport.setOption(option);
}
校区人数
// 校区人数 20202021
function studentNumber(){
const mychart = echarts.init(document.querySelector("#studentRport"));
option = {
color: ['#3398DB'],
// 设置提示框信息。
tooltip: {
trigger: 'axis',
axisPointer: { // 坐标轴指示器,坐标轴触发有效
type: 'shadow' // 默认为直线,可选为:'line' | 'shadow'
}
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
top:'3%',
containLabel: true
},
xAxis: [
{
type: 'category',
data: ['成都', '重庆', '上海', '西安', '武汉', '北京', '深圳'],
axisTick: {
// 居中对齐显示
alignWithLabel: true
},
axisLabel: {
color: "#fff",
fontSize: 14
}
}
],
yAxis: [
{
type: 'value',
// y 轴的文本颜色和字体大小
axisLabel: {
color: "#fff",
fontSize: 14
},
// y轴的分割线颜色
splitLine: {
lineStyle: {
color: "rgba(255,255,255,0.1)"
}
}
}
],
series: [
{
name: '直接访问',
type: 'bar',
barWidth: '40%',
data: [560, 450, 450, 600, 800, 700, 670]
}
]
};
mychart.setOption(option);
}
年龄分布
// 年龄分布
function ageDistribution(){
var ageRadio = document.getElementById('ageRadio');
var myAgeChart = echarts.init(ageRadio);
var option = {
tooltip:{
type:'item',
formatter:'{b}:{c}({d}%)'
},
series:[{
type:'pie',
data:[
{ value: 7700, name: '上海' },
{ value: 6000, name: '北京' },
{ value: 5900, name: '深圳' },
{ value: 4400, name: '广州' },
{ value: 3000, name: '杭州' },
{ value: 2700, name: '成都' },
{ value: 2100, name: '武汉' }
]
}]
}
myAgeChart.setOption(option);
}
环形图
function pcReport(){
var dPAN = document.getElementById('dPAN')
var panReport = echarts.init(dPAN)
var option = {
title:{
text:'d盘',
textStyle:{
color:"#fff",
fontSize:20
}
},
color:['#ff6600','#ccc'],
series: [
{
name: 'Access From',
// silent:true, //取消了silent
//使用emphasis
emphasis:{
disable:false,
scale:false,//不缩放
scaleSize:0,//为了防止失效直接设置为0
},
type: 'pie',
radius: ['60%', '70%'],
label: {
show: false,
position: 'center'
},
data: [
{ value: 1048, name: 'Search Engine' },
{ value: 735, name: 'Direct' },
]
}
]
};
panReport.setOption(option)
}