|
|
@@ -374,7 +374,7 @@ let app = new Vue({
|
|
|
markLine: {
|
|
|
data: [
|
|
|
{
|
|
|
- name: '固定参考线',
|
|
|
+ name: '管理人员数占总人数的合理比值线',
|
|
|
yAxis: 15,
|
|
|
lineStyle: {
|
|
|
color: '#fff',
|
|
|
@@ -616,23 +616,26 @@ let app = new Vue({
|
|
|
{
|
|
|
name: '总部员额数核定上限',
|
|
|
type: 'line',
|
|
|
- barWidth: 15,
|
|
|
+ yAxisIndex: 1, //使用的 y 轴的 index，在单个图表实例中存在多个 y轴的时候有用
|
|
|
+ smooth: true, //平滑曲线显示
|
|
|
+ showAllSymbol: true, //显示所有图形。
|
|
|
+ symbol: 'circle', //标记的图形为实心圆
|
|
|
+ symbolSize: 8, //标记的大小
|
|
|
+ smooth: false,
|
|
|
itemStyle: {
|
|
|
- normal: {
|
|
|
- color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
|
|
- {
|
|
|
- offset: 0,
|
|
|
- color: '#fbe138',
|
|
|
- },
|
|
|
- {
|
|
|
- offset: 1,
|
|
|
- color: '#082550',
|
|
|
- },
|
|
|
- ]),
|
|
|
- },
|
|
|
+ //折线拐点标志的样式
|
|
|
+ color: '#fbe138',
|
|
|
+ borderColor: '#fbe138',
|
|
|
+ width: 2,
|
|
|
+ shadowColor: '#fbe138',
|
|
|
+ shadowBlur: 4,
|
|
|
+ },
|
|
|
+ lineStyle: {
|
|
|
+ color: '#fbe138',
|
|
|
+ width: 2,
|
|
|
},
|
|
|
data: dataL6[1],
|
|
|
- },
|
|
|
+ }
|
|
|
],
|
|
|
}
|
|
|
option.title.text = '各省属企业总部员额数'
|
|
|
@@ -656,50 +659,54 @@ let app = new Vue({
|
|
|
{
|
|
|
name: '人数变化',
|
|
|
type: 'line',
|
|
|
- barWidth: 15,
|
|
|
+ smooth: true, //平滑曲线显示
|
|
|
+ showAllSymbol: true, //显示所有图形。
|
|
|
+ symbol: 'circle', //标记的图形为实心圆
|
|
|
+ symbolSize: 8, //标记的大小
|
|
|
+ smooth: false,
|
|
|
itemStyle: {
|
|
|
- normal: {
|
|
|
- color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
|
|
- {
|
|
|
- offset: 0,
|
|
|
- color: '#43ede3',
|
|
|
- },
|
|
|
- {
|
|
|
- offset: 1,
|
|
|
- color: '#43ede3',
|
|
|
- },
|
|
|
- ]),
|
|
|
- },
|
|
|
+ //折线拐点标志的样式
|
|
|
+ color: '#43ede3',
|
|
|
+ borderColor: '#43ede3',
|
|
|
+ width: 2,
|
|
|
+ shadowColor: '#43ede3',
|
|
|
+ shadowBlur: 4,
|
|
|
+ },
|
|
|
+ lineStyle: {
|
|
|
+ color: '#43ede3',
|
|
|
+ width: 2,
|
|
|
},
|
|
|
data: dataL7[0],
|
|
|
},
|
|
|
{
|
|
|
- name: '全员劳动生产率',
|
|
|
+ name: '劳动生产率同比变化',
|
|
|
type: 'line',
|
|
|
- barWidth: 15,
|
|
|
- yAxisIndex: 1, //使用的 y 轴的 index，在单个图表实例中存在多个 y轴的时候有用
|
|
|
+ yAxisIndex: 1,
|
|
|
+ smooth: true, //平滑曲线显示
|
|
|
+ showAllSymbol: true, //显示所有图形。
|
|
|
+ symbol: 'circle', //标记的图形为实心圆
|
|
|
+ symbolSize: 8, //标记的大小
|
|
|
+ smooth: false,
|
|
|
itemStyle: {
|
|
|
- normal: {
|
|
|
- color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
|
|
- {
|
|
|
- offset: 0,
|
|
|
- color: '#b889ea',
|
|
|
- },
|
|
|
- {
|
|
|
- offset: 1,
|
|
|
- color: '#b889ea',
|
|
|
- },
|
|
|
- ]),
|
|
|
- },
|
|
|
+ //折线拐点标志的样式
|
|
|
+ color: '#b889ea',
|
|
|
+ borderColor: '#b889ea',
|
|
|
+ width: 2,
|
|
|
+ shadowColor: '#b889ea',
|
|
|
+ shadowBlur: 4,
|
|
|
+ },
|
|
|
+ lineStyle: {
|
|
|
+ color: '#b889ea',
|
|
|
+ width: 2,
|
|
|
},
|
|
|
data: dataL7[1],
|
|
|
},
|
|
|
],
|
|
|
}
|
|
|
option.title.text = '人数变化和全员劳动生产率变化分析'
|
|
|
- option.legend.data = ['人数变化', '全员劳动生产率']
|
|
|
+ option.legend.data = ['人数变化', '劳动生产率同比变化']
|
|
|
option.legend.show = true
|
|
|
- // option.yAxis[0].axisLabel.formatter = '{value} %',
|
|
|
+ option.yAxis[0].axisLabel.formatter = '{value} %',
|
|
|
option.yAxis.push({
|
|
|
type: 'value',
|
|
|
axisLine: {
|
|
|
@@ -716,6 +723,7 @@ let app = new Vue({
|
|
|
},
|
|
|
},
|
|
|
})
|
|
|
+
|
|
|
myChart.setOption(option)
|
|
|
},
|
|
|
initChartL8 () {
|
|
|
@@ -724,51 +732,55 @@ let app = new Vue({
|
|
|
..._.cloneDeep(this.commonOption),
|
|
|
series: [
|
|
|
{
|
|
|
- name: '当前人工成本利润率',
|
|
|
+ name: '人数变化',
|
|
|
type: 'line',
|
|
|
- barWidth: 15,
|
|
|
+ smooth: true, //平滑曲线显示
|
|
|
+ showAllSymbol: true, //显示所有图形。
|
|
|
+ symbol: 'circle', //标记的图形为实心圆
|
|
|
+ symbolSize: 8, //标记的大小
|
|
|
+ smooth: false,
|
|
|
itemStyle: {
|
|
|
- normal: {
|
|
|
- color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
|
|
- {
|
|
|
- offset: 0,
|
|
|
- color: '#5e7ae9',
|
|
|
- },
|
|
|
- {
|
|
|
- offset: 1,
|
|
|
- color: '#5e7ae9',
|
|
|
- },
|
|
|
- ]),
|
|
|
- },
|
|
|
+ //折线拐点标志的样式
|
|
|
+ color: '#43ede3',
|
|
|
+ borderColor: '#43ede3',
|
|
|
+ width: 2,
|
|
|
+ shadowColor: '#43ede3',
|
|
|
+ shadowBlur: 4,
|
|
|
+ },
|
|
|
+ lineStyle: {
|
|
|
+ color: '#43ede3',
|
|
|
+ width: 2,
|
|
|
},
|
|
|
data: dataL8[0],
|
|
|
},
|
|
|
{
|
|
|
name: '人工成本利润率同比变化',
|
|
|
type: 'line',
|
|
|
+ smooth: true, //平滑曲线显示
|
|
|
+ showAllSymbol: true, //显示所有图形。
|
|
|
+ symbol: 'circle', //标记的图形为实心圆
|
|
|
+ symbolSize: 8, //标记的大小
|
|
|
+ smooth: false,
|
|
|
itemStyle: {
|
|
|
- normal: {
|
|
|
- color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
|
|
- {
|
|
|
- offset: 0,
|
|
|
- color: '#b889ea',
|
|
|
- },
|
|
|
- {
|
|
|
- offset: 1,
|
|
|
- color: '#b889ea',
|
|
|
- },
|
|
|
- ]),
|
|
|
- },
|
|
|
+ //折线拐点标志的样式
|
|
|
+ color: '#b889ea',
|
|
|
+ borderColor: '#b889ea',
|
|
|
+ width: 2,
|
|
|
+ shadowColor: '#b889ea',
|
|
|
+ shadowBlur: 4,
|
|
|
+ },
|
|
|
+ lineStyle: {
|
|
|
+ color: '#b889ea',
|
|
|
+ width: 2,
|
|
|
},
|
|
|
data: dataL8[1],
|
|
|
},
|
|
|
],
|
|
|
}
|
|
|
option.title.text = '人数变化和人工成本利润率变化分析'
|
|
|
- option.legend.data = ['人数变化','人工成本利润率']
|
|
|
+ option.legend.data = ['人数变化','人工成本利润率同比变化']
|
|
|
option.legend.show = true
|
|
|
option.yAxis[0].axisLabel.formatter = '{value} %',
|
|
|
- console.log(option)
|
|
|
myChart.setOption(option)
|
|
|
},
|
|
|
// 中间图表---------------------------------------------开始
|
|
|
@@ -779,7 +791,7 @@ let app = new Vue({
|
|
|
|
|
|
series: [
|
|
|
{
|
|
|
- name: '全员劳动生产率',
|
|
|
+ name: '全员劳动生产率（万/人）',
|
|
|
type: 'bar',
|
|
|
barWidth: 12,
|
|
|
smooth: true, //平滑曲线显示
|
|
|
@@ -789,22 +801,34 @@ let app = new Vue({
|
|
|
smooth: false,
|
|
|
itemStyle: {
|
|
|
//折线拐点标志的样式
|
|
|
- color: '#B889EA',
|
|
|
- borderColor: '#B889EA',
|
|
|
+ color: '#69c0ff',
|
|
|
+ borderColor: '#69c0ff',
|
|
|
width: 2,
|
|
|
- shadowColor: '#B889EA',
|
|
|
+ shadowColor: '#69c0ff',
|
|
|
shadowBlur: 4,
|
|
|
},
|
|
|
lineStyle: {
|
|
|
- color: '#B889EA',
|
|
|
+ color: '#69c0ff',
|
|
|
width: 2,
|
|
|
},
|
|
|
// data: [60, 50, 80, 80, 90, 55, 40, 60, 50, 80, 90, 55, 40, 60, 50, 90, 55, 40],
|
|
|
data: c1[0],
|
|
|
+
|
|
|
+
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '全员劳动生产率同比',
|
|
|
+ yAxisIndex: 1,
|
|
|
+ type: 'line',
|
|
|
+ itemStyle: {
|
|
|
+ normal: {
|
|
|
+ color: '#B889EA',
|
|
|
+ },
|
|
|
+ },
|
|
|
markLine: {
|
|
|
data: [
|
|
|
{
|
|
|
- name: '省属企业平均水平（万/人）',
|
|
|
+ name: '省属企业平均水平',
|
|
|
yAxis: 50.13,
|
|
|
lineStyle: {
|
|
|
color: '#fff',
|
|
|
@@ -812,19 +836,35 @@ let app = new Vue({
|
|
|
label: {
|
|
|
formatter: '{b}',
|
|
|
position: 'middle',
|
|
|
+ fontSize: 16,
|
|
|
color: '#fff',
|
|
|
},
|
|
|
},
|
|
|
{
|
|
|
- name: '央企平均水平（万/人）',
|
|
|
+ name: '',
|
|
|
+ yAxis: 0,
|
|
|
+ lineStyle: {
|
|
|
+ color: '#fff',
|
|
|
+ },
|
|
|
+ label: {
|
|
|
+ formatter: '{b}',
|
|
|
+ position: 'end',
|
|
|
+ fontSize: 16,
|
|
|
+ color: '#fff',
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '央企平均水平',
|
|
|
yAxis: 69.4,
|
|
|
lineStyle: {
|
|
|
+ type: 'dashed',
|
|
|
color: '#fff',
|
|
|
},
|
|
|
label: {
|
|
|
formatter: '{b}',
|
|
|
- position: 'middle',
|
|
|
+ position: 'end',
|
|
|
color: '#fff',
|
|
|
+ fontSize: 16,
|
|
|
},
|
|
|
},
|
|
|
],
|
|
|
@@ -832,34 +872,15 @@ let app = new Vue({
|
|
|
distance: [20, 8],
|
|
|
},
|
|
|
},
|
|
|
-
|
|
|
- },
|
|
|
- {
|
|
|
- name: '全员劳动生产率同比',
|
|
|
- yAxisIndex: 1, //使用的 y 轴的 index，在单个图表实例中存在多个 y轴的时候有用
|
|
|
- type: 'line',
|
|
|
- itemStyle: {
|
|
|
- normal: {
|
|
|
- color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
|
|
- {
|
|
|
- offset: 0,
|
|
|
- color: '#69c0ff',
|
|
|
- },
|
|
|
- {
|
|
|
- offset: 1,
|
|
|
- color: '#082550',
|
|
|
- },
|
|
|
- ]),
|
|
|
- },
|
|
|
- },
|
|
|
// data: [50, 40, 60, 20, 45, 30, 60, 100, 45, 40, 50, 20, 60, 80, 45, 70, 50, 40],
|
|
|
data: c1[1],
|
|
|
},
|
|
|
],
|
|
|
}
|
|
|
- option.title.text = '全员劳动生产率'
|
|
|
- option.legend.data = ['全员劳动生产率同比', '全员劳动生产率']
|
|
|
+ option.title.text = '当前各省属企业全员劳动生产率'
|
|
|
+ option.legend.data = ['全员劳动生产率同比', '全员劳动生产率（万/人）']
|
|
|
option.legend.show = true
|
|
|
+ option.grid.right = '15%'
|
|
|
option.yAxis.push({
|
|
|
type: 'value',
|
|
|
axisLine: {
|
|
|
@@ -904,12 +925,13 @@ let app = new Vue({
|
|
|
color: '#B889EA',
|
|
|
width: 2,
|
|
|
},
|
|
|
+
|
|
|
// data: [60, 50, 80, 80, 90, 55, 40, 60, 50, 80, 90, 55, 40, 60, 50, 90, 55, 40],
|
|
|
data: c2[0],
|
|
|
markLine: {
|
|
|
data: [
|
|
|
{
|
|
|
- name: '省属企业平均水平（万/人）',
|
|
|
+ name: '省属企业平均水平',
|
|
|
yAxis: 67.09,
|
|
|
lineStyle: {
|
|
|
color: '#fff',
|
|
|
@@ -921,7 +943,7 @@ let app = new Vue({
|
|
|
},
|
|
|
},
|
|
|
{
|
|
|
- name: '央企平均水平（万/人）',
|
|
|
+ name: '央企平均水平',
|
|
|
yAxis: 81,
|
|
|
lineStyle: {
|
|
|
color: '#fff',
|
|
|
@@ -956,7 +978,17 @@ let app = new Vue({
|
|
|
]),
|
|
|
},
|
|
|
},
|
|
|
- // data: [50, 40, 60, 20, 45, 30, 60, 100, 45, 40, 50, 20, 60, 80, 45, 70, 50, 40],
|
|
|
+ itemStyle: {
|
|
|
+ color: params => {
|
|
|
+ if( params.value < 0 && c2[0][params.dataIndex] < 0) {
|
|
|
+ return 'red'
|
|
|
+ } else if(c2[0][params.dataIndex] < 0) {
|
|
|
+ return 'yellow'
|
|
|
+ } else {
|
|
|
+ return '#69c0ff'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
data: c2[1]
|
|
|
},
|
|
|
],
|
|
|
@@ -965,6 +997,7 @@ let app = new Vue({
|
|
|
option.legend.data = ['人工成本利润同比', '人工成本利润率']
|
|
|
option.legend.show = true
|
|
|
option.grid.right = '15%'
|
|
|
+ option.yAxis[0].axisLabel.formatter = '{value} %',
|
|
|
option.yAxis.push({
|
|
|
splitLine: {
|
|
|
show: false,
|
|
|
@@ -980,6 +1013,15 @@ let app = new Vue({
|
|
|
let myChart = echarts.init(this.$refs['echartR1'])
|
|
|
let commonOptions = this.commonOption
|
|
|
commonOptions.yAxis[0].splitNumber = 2
|
|
|
+ let dataTemp = []
|
|
|
+ let dataTemp2 = []
|
|
|
+ dataR1[0].forEach(item => {
|
|
|
+ dataTemp.push(item+1);
|
|
|
+ });
|
|
|
+ dataR1[1].forEach(item => {
|
|
|
+ dataTemp2.push(item+1);
|
|
|
+ });
|
|
|
+
|
|
|
let option = {
|
|
|
..._.cloneDeep(commonOptions),
|
|
|
series: [
|
|
|
@@ -1001,7 +1043,7 @@ let app = new Vue({
|
|
|
]),
|
|
|
},
|
|
|
},
|
|
|
- data: dataR1[0],
|
|
|
+ data: dataTemp,
|
|
|
},
|
|
|
{
|
|
|
name: '招聘需求公告累计招聘人次',
|
|
|
@@ -1021,7 +1063,7 @@ let app = new Vue({
|
|
|
]),
|
|
|
},
|
|
|
},
|
|
|
- data: dataR1[1],
|
|
|
+ data: dataTemp2,
|
|
|
},
|
|
|
|
|
|
],
|
|
|
@@ -1029,6 +1071,10 @@ let app = new Vue({
|
|
|
option.title.text = '当前各省属企业招聘需求公示人次'
|
|
|
option.legend.data = ['招聘需求公告次数', '招聘需求公告累计招聘人次']
|
|
|
option.legend.show = true
|
|
|
+ option.tooltip.formatter = function(value){
|
|
|
+ return value[0].axisValue+':'+ (value[0].value -1)+'<br>'+
|
|
|
+ value[1].axisValue+':'+ (value[1].value-1)
|
|
|
+ }
|
|
|
option.yAxis[0] = {
|
|
|
type: 'log',
|
|
|
min: 1,
|
|
|
@@ -1175,7 +1221,7 @@ let app = new Vue({
|
|
|
},
|
|
|
],
|
|
|
}
|
|
|
- option.title.text = '各省属企业年利润与"当年"招聘人数'
|
|
|
+ option.title.text = '各省属企业年利润与当年累计招聘人数'
|
|
|
option.legend.data = ['2022年利润(万）', '2022年累计招聘数']
|
|
|
option.legend.show = true
|
|
|
option.yAxis[0] = {
|
