| | |
| | | top: '10%', |
| | | containLabel: true |
| | | }, |
| | | // animation: false, // 取消动画 |
| | | xAxis: { |
| | | show: false |
| | | }, |
| | |
| | | color: function(value, index) { |
| | | return value === '0' ? 'transparent' : '#fff' |
| | | }, |
| | | fontSize: 18, |
| | | fontSize: 20, |
| | | // formatter: function(value, index) { |
| | | // return [ |
| | | // '{lg|' + (index + 1) + '、 }' + '{title|' + value + '} ' |
| | |
| | | show: true, |
| | | position: 'right', |
| | | formatter: '{c}', |
| | | fontSize: 14, |
| | | fontSize: 20, |
| | | color: '#fff' |
| | | // formatter: '{c}%', |
| | | } |
| | |
| | | borderColor: '#fff' |
| | | } |
| | | }, |
| | | xAxis: [{ |
| | | type: 'category', |
| | | boundaryGap: true, |
| | | axisLabel: { |
| | | interval: 0, |
| | | formatter: '{value}', |
| | | fontSize: 14, |
| | | margin: 20, |
| | | textStyle: { |
| | | color: colorX |
| | | } |
| | | }, |
| | | axisLine: { |
| | | lineStyle: { |
| | | color: '#032c58' |
| | | } |
| | | }, |
| | | splitLine: { |
| | | show: false, |
| | | lineStyle: { |
| | | color: '#032c58' |
| | | } |
| | | }, |
| | | axisTick: { |
| | | show: false |
| | | }, |
| | | data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'] |
| | | }], |
| | | xAxis: [ |
| | | { |
| | | type: 'category', |
| | | boundaryGap: true, |
| | | axisLabel: { |
| | | interval: 0, |
| | | formatter: '{value}', |
| | | fontSize: 18, |
| | | margin: 20, |
| | | textStyle: { |
| | | color: colorX |
| | | } |
| | | }, |
| | | axisLine: { |
| | | lineStyle: { |
| | | color: '#032c58' |
| | | } |
| | | }, |
| | | splitLine: { |
| | | show: false, |
| | | lineStyle: { |
| | | color: '#032c58' |
| | | } |
| | | }, |
| | | axisTick: { |
| | | show: false |
| | | }, |
| | | data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'] |
| | | }], |
| | | yAxis: [ |
| | | { |
| | | // max: 800, |
| | |
| | | type: 'value', |
| | | axisLabel: { |
| | | textStyle: { |
| | | fontSize: 14, |
| | | fontSize: 18, |
| | | color: colorY |
| | | } |
| | | }, |
| | |
| | | show: true, |
| | | position: 'top', |
| | | textStyle: { |
| | | color: '#fff' |
| | | color: '#fff', |
| | | fontSize: 16 |
| | | } |
| | | }, |
| | | itemStyle: { |
| | |
| | | title: { |
| | | width: 50, |
| | | align: 'right', |
| | | fontSize: 18 |
| | | fontSize: 20 |
| | | } |
| | | } |
| | | } |
| | |
| | | align: 'left', |
| | | verticalAlign: 'center', |
| | | lineHeight: 40, |
| | | fontSize: 18, |
| | | fontSize: 20, |
| | | formatter: function(value, index) { |
| | | return data[index].value + '' |
| | | } |
| | |
| | | textStyle: { |
| | | rich: { |
| | | name: { |
| | | fontSize: 18, |
| | | fontSize: 22, |
| | | fontWeight: 'normal', |
| | | color: '#fff', |
| | | padding: [10, 0] |
| | | }, |
| | | val: { |
| | | fontSize: 32, |
| | | fontSize: 22, |
| | | fontWeight: 'bold', |
| | | color: '#fff' |
| | | } |
| | |
| | | padding: [0, -50, 25, -50], |
| | | rich: { |
| | | icon: { |
| | | fontSize: 16, |
| | | fontSize: 18, |
| | | color: 'red' |
| | | }, |
| | | name: { |
| | | fontSize: 16, |
| | | fontSize: 18, |
| | | padding: [0, 10, 0, 4], |
| | | color: '#fff' |
| | | }, |
| | |
| | | } |
| | | return option |
| | | } |
| | | |
| | | // 车间生产 生产信息 生产进度 进度条 |
| | | export function progress(param1, param2) { |
| | | // param1 报工数量 |
| | | // param2 任务数量 |
| | | |
| | | // 拿到数据之后需要计算出相对长度 param2的相对长度为100 |
| | | let relativeValue = ''// 相对值 绿色背景 |
| | | |
| | | relativeValue = (param1 / param2) * 100 |
| | | // 百分比数值的位置 |
| | | var position = 'right' |
| | | // if (param1 >= 50) { |
| | | // position = 'inside'; |
| | | // } else if (param1 < 50) { |
| | | // position = 'right'; |
| | | // } |
| | | |
| | | var option = { |
| | | // animation: false, // 取消动画 |
| | | // animationDuration: 5000, |
| | | grid: { |
| | | top: 'center', |
| | | left: '0%', |
| | | right: '0%', |
| | | // height: '%', |
| | | // containLabel: false |
| | | containLabel: true |
| | | |
| | | }, |
| | | xAxis: { |
| | | type: 'value', |
| | | axisLabel: { |
| | | show: false |
| | | }, |
| | | max: 100, |
| | | axisTick: { |
| | | show: false |
| | | }, |
| | | axisLine: { |
| | | show: false |
| | | }, |
| | | splitLine: { |
| | | show: false |
| | | } |
| | | }, |
| | | yAxis: [{ |
| | | type: 'category', |
| | | data: [], |
| | | axisLabel: { |
| | | show: false |
| | | }, |
| | | axisTick: { |
| | | show: false |
| | | }, |
| | | axisLine: { |
| | | show: false |
| | | }, |
| | | splitLine: { |
| | | show: false |
| | | }, |
| | | z: 10 |
| | | }, { |
| | | type: 'category', |
| | | axisLabel: { |
| | | show: false |
| | | }, |
| | | axisTick: { |
| | | show: false |
| | | }, |
| | | axisLine: { |
| | | show: false |
| | | }, |
| | | splitLine: { |
| | | show: false |
| | | }, |
| | | data: [] |
| | | }], |
| | | series: [{ |
| | | name: '', |
| | | type: 'bar', |
| | | barWidth: '100%', |
| | | // barMaxWidth: '100%', |
| | | label: { |
| | | normal: { |
| | | show: true, |
| | | // position: ['24', '38%'], |
| | | position: (param1.toString() + param2.toString()).length <= 6 ? ['24', '38%'] : 'insideLeft', |
| | | // formatter: '{c} %', |
| | | formatter: param1 + '/' + param2, |
| | | textStyle: { |
| | | color: '#FFFFFF', |
| | | fontWeight: 'bold', |
| | | fontFamily: 'Microsoft YaHei', |
| | | fontSize: 18 |
| | | } |
| | | } |
| | | }, |
| | | itemStyle: { |
| | | normal: { |
| | | barBorderRadius: 5, |
| | | shadowBlur: 10, |
| | | shadowColor: '#111', |
| | | color: '#2FD04F' |
| | | } |
| | | }, |
| | | // data: [param1], |
| | | data: [relativeValue], |
| | | z: 10 |
| | | }, { |
| | | type: 'bar', |
| | | barWidth: '100%', |
| | | yAxisIndex: 1, |
| | | silent: true, |
| | | // barMaxWidth: '100%', |
| | | itemStyle: { |
| | | normal: { |
| | | barBorderRadius: 5, |
| | | color: '#42475B' |
| | | } |
| | | }, |
| | | // data: [param2] |
| | | data: [100] |
| | | }] |
| | | } |
| | | |
| | | return option |
| | | } |