You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
836 lines
19 KiB
836 lines
19 KiB
//计划完成表的当前所选
|
|
var indexnum = 0;
|
|
var color=['#F35331','#2499F8','#3DF098','#33B734'];
|
|
var fontColor='#FFF';
|
|
|
|
//定义进度条组件和属性
|
|
var y_gauge1 =null;
|
|
var y_gauge2 =null;
|
|
var y_gauge3 =null;
|
|
var y_gauge4 =null;
|
|
var m_gauge1 =null;
|
|
var m_gauge2 =null;
|
|
var m_gauge3 =null;
|
|
var m_gauge4 =null;
|
|
var d_gauge1 =null;
|
|
var d_gauge2 =null;
|
|
var d_gauge3 =null;
|
|
var d_gauge4 =null;
|
|
var option_Progress =null;
|
|
|
|
//定义仪表盘组件和属性
|
|
var gauge1 =null;
|
|
var gauge2 =null;
|
|
var gauge3 =null;
|
|
var gauge4 =null;
|
|
var gauge5 =null;
|
|
var option_gauge =null;
|
|
|
|
//生产质量堆积图组件和属性
|
|
var quality_chart = null;
|
|
var quality_option=null;
|
|
|
|
//生产计划折线图组件和属性
|
|
var plan_chart = null;
|
|
var plan_option=null;
|
|
|
|
//环形图的风格定义
|
|
var dataStyle = {
|
|
normal: {
|
|
label: {show:false},
|
|
labelLine: {show:false}
|
|
}
|
|
};
|
|
var placeHolderStyle = {
|
|
normal : {
|
|
color: 'rgba(0,0,0,0.1)',
|
|
label: {show:false},
|
|
labelLine: {show:false}
|
|
},
|
|
emphasis : {
|
|
color: 'rgba(0,0,0,0)'
|
|
}
|
|
};
|
|
|
|
//最大订单号
|
|
var lastOrderNumber=1;
|
|
|
|
$(document).ready(function ()
|
|
{
|
|
//环形进度条设置对象
|
|
option_Progress={
|
|
title : {
|
|
text: '目前进度',
|
|
subtext: '50%',
|
|
x: 'center',
|
|
y: 90,
|
|
itemGap: 10,
|
|
textStyle : {
|
|
color : '#B7E1FF',
|
|
fontWeight: 'normal',
|
|
fontFamily : '微软雅黑',
|
|
fontSize : 24
|
|
},
|
|
subtextStyle:{
|
|
color: '#B7E1FF',
|
|
fontWeight: 'bolder',
|
|
fontSize:24,
|
|
fontFamily : '微软雅黑'
|
|
}
|
|
},
|
|
series : [{
|
|
type : 'pie',
|
|
center : ['50%', '50%'],
|
|
radius : [75,90],
|
|
x: '0%',
|
|
tooltip:{show:false},
|
|
data : [{
|
|
name:'达成率',
|
|
value:79,
|
|
itemStyle:{color :'rgba(0,153,255,0.8)'},
|
|
hoverAnimation: false,
|
|
label : {
|
|
show : false,
|
|
position : 'center',
|
|
textStyle: {
|
|
fontFamily:'微软雅黑',
|
|
fontWeight: 'bolder',
|
|
color:'#B7E1FF',
|
|
fontSize:24
|
|
}
|
|
},
|
|
labelLine : {
|
|
show : false
|
|
}
|
|
},
|
|
{
|
|
name:'79%',
|
|
value:21,
|
|
itemStyle:{color: 'rgba(0,153,255,0.1)'},
|
|
hoverAnimation: false,
|
|
label : {
|
|
show : false,
|
|
position : 'center',
|
|
padding:20,
|
|
textStyle: {
|
|
fontFamily:'微软雅黑',
|
|
fontSize: 24,
|
|
color:'#B7E1FF'
|
|
}
|
|
},
|
|
labelLine : {
|
|
show : false
|
|
}
|
|
}]
|
|
},
|
|
{
|
|
type : 'pie',
|
|
center : ['50%', '50%'],
|
|
radius : [95,100],
|
|
x: '0%',
|
|
hoverAnimation: false,
|
|
data : [{
|
|
value:100,
|
|
itemStyle:{color :'rgba(0,153,255,0.3)'},
|
|
label : {show : false},
|
|
labelLine : {show : false}
|
|
}]
|
|
},
|
|
{
|
|
type : 'pie',
|
|
center : ['50%', '50%'],
|
|
radius : [69,70],
|
|
x: '0%',
|
|
hoverAnimation: false,
|
|
data : [{
|
|
value:100,
|
|
itemStyle:{color :'rgba(0,153,255,0.3)'},
|
|
label : {show : false},
|
|
labelLine : {show : false}
|
|
}]
|
|
}]
|
|
};
|
|
|
|
//年仪表盘
|
|
y_gauge1 = echarts.init(document.getElementById('y_gauge1'));
|
|
y_gauge2 = echarts.init(document.getElementById('y_gauge2'));
|
|
y_gauge3 = echarts.init(document.getElementById('y_gauge3'));
|
|
y_gauge4 = echarts.init(document.getElementById('y_gauge4'));
|
|
|
|
//月仪表盘
|
|
m_gauge1 = echarts.init(document.getElementById('m_gauge1'));
|
|
m_gauge2 = echarts.init(document.getElementById('m_gauge2'));
|
|
m_gauge3 = echarts.init(document.getElementById('m_gauge3'));
|
|
m_gauge4 = echarts.init(document.getElementById('m_gauge4'));
|
|
|
|
//日仪表盘
|
|
d_gauge1 = echarts.init(document.getElementById('d_gauge1'));
|
|
d_gauge2 = echarts.init(document.getElementById('d_gauge2'));
|
|
d_gauge3 = echarts.init(document.getElementById('d_gauge3'));
|
|
d_gauge4 = echarts.init(document.getElementById('d_gauge4'));
|
|
|
|
//监控仪表盘
|
|
option_gauge = {
|
|
title: {
|
|
text: '', //标题文本内容
|
|
},
|
|
toolbox: { //可视化的工具箱
|
|
show: false,
|
|
},
|
|
tooltip: { //弹窗组件
|
|
formatter: "{a} <br/>{b} : {c}%"
|
|
},
|
|
series: [{
|
|
type: 'gauge',
|
|
axisLine: {// 坐标轴线
|
|
lineStyle: { // 属性lineStyle控制线条样式
|
|
color: [
|
|
[0.2, color[0]],
|
|
[0.8, color[1]],
|
|
[1, color[2]]
|
|
],
|
|
width: 18
|
|
}
|
|
},
|
|
splitLine: { // 分隔线
|
|
show:true,
|
|
length: 18,
|
|
lineStyle: {
|
|
color: '#28292D',
|
|
width: 1
|
|
}
|
|
},
|
|
axisTick : { //刻度线样式（及短线样式）
|
|
show:false,
|
|
lineStyle: {
|
|
color: 'auto',
|
|
width: 1
|
|
},
|
|
length : 20
|
|
},
|
|
axisLabel : {
|
|
color:'#FFF',
|
|
fontSize:14,
|
|
fontFamily:'Verdana, Geneva, sans-serif'
|
|
},
|
|
title: {
|
|
textStyle: { // 其余属性默认使用全局文本样式，详见TEXTSTYLE
|
|
fontWeight: 'bolder',
|
|
fontSize: 20,
|
|
color: '#FFF'
|
|
},
|
|
offsetCenter: [0, '30%']
|
|
},
|
|
pointer: {
|
|
width: 5,
|
|
color: '#F00',
|
|
shadowColor: '#FF0',
|
|
shadowBlur: 10
|
|
},
|
|
detail: {
|
|
show:false,
|
|
formatter:'{value}%',
|
|
textStyle:
|
|
{
|
|
fontFamily:'Arial',
|
|
color: '#000',
|
|
fontSize:'32px'
|
|
},
|
|
offsetCenter: [0, '90%']
|
|
},
|
|
data: [{value: 45, name: '水'}]
|
|
}]
|
|
};
|
|
|
|
gauge1 = echarts.init(document.getElementById('gauge1'));
|
|
gauge2 = echarts.init(document.getElementById('gauge2'));
|
|
gauge3 = echarts.init(document.getElementById('gauge3'));
|
|
gauge4 = echarts.init(document.getElementById('gauge4'));
|
|
gauge5 = echarts.init(document.getElementById('gauge5'));
|
|
option_gauge.series[0].axisLine.lineStyle.color=[[0.2, color[0]],[0.8, color[1]],[1, color[2]]];
|
|
option_gauge.series[0].data[0].value = (Math.random() * 100).toFixed(2) - 0;
|
|
option_gauge.series[0].data[0].name ="水";
|
|
$('#vg1').html(option_gauge.series[0].data[0].value);
|
|
gauge1.setOption(option_gauge);
|
|
option_gauge.series[0].data[0].value = (Math.random() * 100).toFixed(2) - 0;
|
|
option_gauge.series[0].data[0].name ="电";
|
|
$('#vg2').html(option_gauge.series[0].data[0].value);
|
|
gauge2.setOption(option_gauge);
|
|
option_gauge.series[0].data[0].value = (Math.random() * 100).toFixed(2) - 0;
|
|
option_gauge.series[0].data[0].name ="天然气";
|
|
$('#vg3').html(option_gauge.series[0].data[0].value);
|
|
gauge3.setOption(option_gauge);
|
|
option_gauge.series[0].data[0].value = (Math.random() * 100).toFixed(2) - 0;
|
|
option_gauge.series[0].data[0].name ="压缩空气";
|
|
$('#vg4').html(option_gauge.series[0].data[0].value);
|
|
gauge4.setOption(option_gauge);
|
|
option_gauge.series[0].data[0].value = (Math.random() * 100).toFixed(2) - 0;
|
|
option_gauge.series[0].data[0].name ="蒸汽";
|
|
$('#vg5').html(option_gauge.series[0].data[0].value);
|
|
gauge5.setOption(option_gauge);
|
|
|
|
//生产质量堆积图
|
|
quality_chart = echarts.init(document.getElementById('quality'));
|
|
quality_option={
|
|
title: {
|
|
show:false,
|
|
text: 'AUDIT',
|
|
left: 'center',
|
|
textStyle: {
|
|
color: '#F00',
|
|
fontSize:32
|
|
}
|
|
},
|
|
xAxis: {
|
|
data: ['1月10日','2月10日','3月10日','4月10日','5月10日','6月10日'],
|
|
axisLabel: {
|
|
textStyle: {
|
|
color: '#B7E1FF',
|
|
fontSize:24
|
|
}
|
|
},
|
|
axisLine:{
|
|
lineStyle:{
|
|
color:'#09F'
|
|
}
|
|
},
|
|
axisTick:{
|
|
lineStyle:{
|
|
color:'#09F'
|
|
}
|
|
}
|
|
},
|
|
yAxis: {
|
|
inverse: false,
|
|
splitArea: {show: false},
|
|
axisLine: {show: false},
|
|
axisTick: {show: false},
|
|
axisLabel: {
|
|
textStyle: {
|
|
color: '#B7E1FF',
|
|
fontSize:24,
|
|
fontFamily:'Arial',
|
|
}
|
|
},
|
|
splitLine :{
|
|
lineStyle:{
|
|
color:'#09F'
|
|
}
|
|
}
|
|
},
|
|
grid: {
|
|
left: 100
|
|
},
|
|
tooltip: {
|
|
trigger: 'item',
|
|
textStyle: {
|
|
color: '#B7E1FF',
|
|
fontSize:24
|
|
}
|
|
},
|
|
legend:{
|
|
show:false,
|
|
top: 'bottom',
|
|
textStyle: {
|
|
color: '#F00',
|
|
fontSize:24,
|
|
fontFamily:'微软雅黑'
|
|
},
|
|
data:['AUDIT分数1','AUDIT分数']
|
|
},
|
|
series: [
|
|
{
|
|
name: 'AUDIT分数1',
|
|
type: 'bar',
|
|
stack: 'one',
|
|
itemStyle:
|
|
{
|
|
normal: {color: color[1]}
|
|
},
|
|
barWidth : 60,
|
|
data:[2200,2900,3680,2200,2900,3680]
|
|
},
|
|
{
|
|
name: 'AUDIT分数',
|
|
type: 'bar',
|
|
stack: 'one',
|
|
itemStyle: {
|
|
normal: {
|
|
color: '#F90',
|
|
label: {
|
|
show: true,
|
|
position: 'insideTop',
|
|
textStyle: {
|
|
color: '#000',
|
|
fontSize:24
|
|
}
|
|
}
|
|
}
|
|
},
|
|
barWidth : 50,
|
|
data: [1800,1100,320,1800,1100,320]
|
|
}
|
|
]
|
|
};
|
|
quality_chart.setOption(quality_option);
|
|
|
|
//生产计划折线图
|
|
var plan_data1=[];
|
|
var plan_data2=[];
|
|
var plan_xAxis=[];
|
|
for (var i = 1; i <= 7; i++) {
|
|
plan_xAxis.push("3月"+i+"日");
|
|
plan_data1.push(Math.round(Math.random() * 100));
|
|
plan_data2.push(Math.round(Math.random() * 100));
|
|
}
|
|
plan_chart = echarts.init(document.getElementById('plan'));
|
|
plan_option={
|
|
xAxis: {
|
|
data:plan_xAxis,
|
|
axisLabel: {
|
|
textStyle: {
|
|
color: '#B7E1FF',
|
|
fontSize:24
|
|
}
|
|
},
|
|
axisLine:{
|
|
lineStyle:{
|
|
color:'#09F'
|
|
}
|
|
},
|
|
axisTick:{
|
|
lineStyle:{
|
|
color:'#09F'
|
|
}
|
|
}
|
|
},
|
|
yAxis: {
|
|
inverse: false,
|
|
splitArea: {show: false},
|
|
axisLine: {show: false},
|
|
axisTick: {show: false},
|
|
axisLabel: {
|
|
textStyle: {
|
|
color: '#B7E1FF',
|
|
fontSize:24,
|
|
fontFamily:'Arial',
|
|
}
|
|
},
|
|
splitLine :{
|
|
lineStyle:{
|
|
color:'#09F'
|
|
}
|
|
}
|
|
},
|
|
tooltip: {
|
|
trigger: 'axis',
|
|
textStyle: {
|
|
color: '#FFF',
|
|
fontSize:24
|
|
}
|
|
},
|
|
grid: {
|
|
left: 100
|
|
},
|
|
legend:{
|
|
show:false,
|
|
top: 'bottom',
|
|
textStyle: {
|
|
color: '#F00',
|
|
fontSize:24
|
|
},
|
|
data:['计划完成数','实际完成数']
|
|
},
|
|
series: [
|
|
{
|
|
name: '计划完成数',
|
|
type: 'bar',
|
|
itemStyle:
|
|
{
|
|
normal: {color: color[1]},
|
|
emphasis: {color: color[2]}
|
|
},
|
|
barWidth : 40,
|
|
data:plan_data1
|
|
},
|
|
{
|
|
name: '实际完成数',
|
|
type: 'line',
|
|
itemStyle: {
|
|
normal: {
|
|
color: '#F90',
|
|
label: {
|
|
show: true,
|
|
position: 'top',
|
|
textStyle: {
|
|
color: '#CCC',
|
|
fontSize:24
|
|
}
|
|
},
|
|
lineStyle:{
|
|
color:'#F90',
|
|
width:4
|
|
}
|
|
},
|
|
emphasis: {
|
|
color: '#FF0'
|
|
}
|
|
},
|
|
symbolSize: 24,
|
|
data: plan_data2
|
|
}
|
|
]
|
|
};
|
|
plan_chart.setOption(plan_option);
|
|
|
|
//轮番显示tips
|
|
function clock(){
|
|
showToolTip_highlight(plan_chart);
|
|
}
|
|
setInterval(clock, 5000);
|
|
|
|
//地图开始
|
|
var map_chart = echarts.init(document.getElementById('map'));
|
|
|
|
var CCData = [
|
|
[{name:'长春'}, {name:'上海',value:95}],
|
|
[{name:'长春'}, {name:'广州',value:90}],
|
|
[{name:'长春'}, {name:'大连',value:80}],
|
|
[{name:'长春'}, {name:'南宁',value:70}],
|
|
[{name:'长春'}, {name:'南昌',value:60}],
|
|
[{name:'长春'}, {name:'拉萨',value:50}],
|
|
[{name:'长春'}, {name:'长春',value:40}],
|
|
[{name:'长春'}, {name:'包头',value:30}],
|
|
[{name:'长春'}, {name:'重庆',value:20}],
|
|
[{name:'长春'}, {name:'北京',value:10}]
|
|
];
|
|
|
|
var series = [];
|
|
[['长春', CCData]].forEach(function (item, i) {
|
|
series.push({
|
|
name: '一汽汽车销售',
|
|
type: 'lines',
|
|
zlevel: 1,
|
|
effect: {
|
|
show: true,
|
|
period: 6,
|
|
trailLength: 0.7,
|
|
color: '#FF0',
|
|
symbolSize: 3
|
|
},
|
|
lineStyle: {
|
|
normal: {
|
|
color: '#000',
|
|
width: 0,
|
|
curveness: 0.2
|
|
}
|
|
},
|
|
data: convertData(item[1])
|
|
},
|
|
{
|
|
name: '一汽汽车销售',
|
|
type: 'lines',
|
|
zlevel: 2,
|
|
symbol: ['none', 'arrow'],
|
|
symbolSize: 10,
|
|
lineStyle: {
|
|
normal: {
|
|
color: '#FF0',
|
|
width: 1,
|
|
opacity: 0.6,
|
|
curveness: 0.2
|
|
}
|
|
},
|
|
data: convertData(item[1])
|
|
},
|
|
{
|
|
name: '一汽汽车销售',
|
|
type: 'effectScatter',
|
|
coordinateSystem: 'geo',
|
|
zlevel: 2,
|
|
rippleEffect: {
|
|
brushType: 'stroke'
|
|
},
|
|
label: {
|
|
normal: {
|
|
show: true,
|
|
position: 'right',
|
|
formatter: '{b}'
|
|
}
|
|
},
|
|
symbolSize: function (val) {
|
|
return 15;
|
|
},
|
|
itemStyle: {
|
|
normal: {
|
|
color: '#FFF',
|
|
label: {
|
|
show: true,
|
|
position: 'top',
|
|
textStyle: {
|
|
color: '#FFF',
|
|
fontSize:24
|
|
}
|
|
}
|
|
}
|
|
},
|
|
data: item[1].map(function (dataItem) {
|
|
return {
|
|
name: dataItem[1].name,
|
|
value: geoCoordMap[dataItem[1].name].concat([dataItem[1].value])
|
|
};
|
|
})
|
|
});
|
|
});
|
|
|
|
map_option = {
|
|
backgroundColor: '',
|
|
title : {
|
|
show:false,
|
|
text: '一汽汽车销售地域分布示意图',
|
|
subtext: '截至2018年05月04日',
|
|
left: 'center',
|
|
top:10,
|
|
textStyle : {
|
|
color: '#09F',
|
|
fontSize:32
|
|
},
|
|
subtextStyle:{
|
|
color: '#09F',
|
|
fontSize:24
|
|
}
|
|
},
|
|
tooltip : {
|
|
trigger: 'item'
|
|
},
|
|
legend: {
|
|
show:false,
|
|
orient: 'vertical',
|
|
top: 'bottom',
|
|
left: 'right',
|
|
data:['一汽汽车销售'],
|
|
textStyle: {
|
|
color: '#000'
|
|
},
|
|
selectedMode: 'single'
|
|
},
|
|
geo: {
|
|
map: 'china',
|
|
label: {
|
|
emphasis: {
|
|
show: false
|
|
}
|
|
},
|
|
roam: true,
|
|
itemStyle: {
|
|
normal: {
|
|
areaColor: '#09F',
|
|
borderColor: '#09F',
|
|
opacity:0.5
|
|
},
|
|
emphasis: {
|
|
areaColor: '#09F',
|
|
borderColor: '#09F',
|
|
opacity:0.8
|
|
}
|
|
}
|
|
},
|
|
series: series
|
|
};
|
|
|
|
map_chart.setOption(map_option, true);
|
|
|
|
resresh();
|
|
|
|
//开始定时刷新
|
|
setInterval(resresh, 5*1000);
|
|
});
|
|
|
|
var convertData = function (data) {
|
|
var res = [];
|
|
for (var i = 0; i < data.length; i++) {
|
|
var dataItem = data[i];
|
|
var fromCoord = geoCoordMap[dataItem[0].name];
|
|
var toCoord = geoCoordMap[dataItem[1].name];
|
|
if (fromCoord && toCoord) {
|
|
res.push({
|
|
fromName: dataItem[0].name,
|
|
toName: dataItem[1].name,
|
|
coords: [fromCoord, toCoord]
|
|
});
|
|
}
|
|
}
|
|
return res;
|
|
};
|
|
|
|
function showToolTip_highlight(mychart)
|
|
{
|
|
var echartObj = mychart;
|
|
|
|
// 高亮当前图形
|
|
var highlight =setInterval(function()
|
|
{
|
|
echartObj.dispatchAction({
|
|
type: 'highlight',
|
|
seriesIndex: 0,
|
|
dataIndex: indexnum
|
|
});
|
|
|
|
echartObj.dispatchAction({
|
|
type: 'showTip',
|
|
seriesIndex: 0,
|
|
dataIndex: indexnum
|
|
});
|
|
clearInterval(highlight);
|
|
indexnum = indexnum + 1;
|
|
if(indexnum>=7) indexnum=0;
|
|
},1000);
|
|
}
|
|
|
|
//定时刷新数据
|
|
function resresh()
|
|
{
|
|
var myDate = new Date();
|
|
|
|
// $('#refresh').html("<img src=\"images/wait.gif\" align=\"absmiddle\"><span>数据刷新中...</span>");
|
|
|
|
//年月日刷新
|
|
$('#currentYear').html(myDate.getFullYear()+"年");
|
|
$('#currentMonth').html(insertZero(myDate.getMonth()+1)+"月");
|
|
$('#currentDay').html(insertZero(myDate.getDate())+"日");
|
|
$('#currentDate').html(myDate.getFullYear()+"/"+insertZero(myDate.getMonth()+1)+"/"+insertZero(myDate.getDate()));
|
|
|
|
option_gauge.series[0].axisLabel.show=true;
|
|
option_gauge.series[0].axisLine.lineStyle.color=[[0.2, color[0]],[0.8, color[1]],[1, color[2]]]
|
|
|
|
var maxg=Math.round(Math.random()*500)+400;
|
|
var n1=Math.round(Math.random()*(maxg-100))+100;
|
|
var n2=Math.round(Math.random()*(n1-50))+50;
|
|
var n3=(n2/maxg*100).toFixed(2);
|
|
|
|
//年进度条
|
|
option_Progress.title.text ="计划生产";
|
|
option_Progress.series[0].data[0].value = maxg;
|
|
option_Progress.title.subtext =maxg+"台";
|
|
option_Progress.series[0].data[1].value =0;
|
|
y_gauge1.setOption(option_Progress);
|
|
|
|
option_Progress.title.text ="已接订单";
|
|
option_Progress.series[0].data[0].value = n1;
|
|
option_Progress.title.subtext =n1+"台";
|
|
option_Progress.series[0].data[1].value =(maxg-n1);
|
|
y_gauge2.setOption(option_Progress);
|
|
|
|
option_Progress.title.text ="已经完成";
|
|
option_Progress.series[0].data[0].value = n2;
|
|
option_Progress.title.subtext =n2+"台";
|
|
option_Progress.series[0].data[1].value =(maxg-n2);
|
|
y_gauge3.setOption(option_Progress);
|
|
|
|
option_Progress.title.text ="计划完成率";
|
|
option_Progress.series[0].data[0].value = n3;
|
|
option_Progress.title.subtext =n3+"%";
|
|
option_Progress.series[0].data[1].value =(100-n3);
|
|
y_gauge4.setOption(option_Progress);
|
|
|
|
//月进度条
|
|
maxg=Math.round(Math.random()*maxg)+1;
|
|
n1=Math.round(Math.random()*maxg)+1;
|
|
n2=Math.round(Math.random()*n1);
|
|
n3=(n2/maxg*100).toFixed(2);
|
|
|
|
option_Progress.title.text ="计划生产";
|
|
option_Progress.series[0].data[0].value = maxg;
|
|
option_Progress.title.subtext =maxg+"台";
|
|
option_Progress.series[0].data[1].value =0;
|
|
m_gauge1.setOption(option_Progress);
|
|
|
|
option_Progress.title.text ="已接订单";
|
|
option_Progress.series[0].data[0].value = n1;
|
|
option_Progress.title.subtext =n1+"台";
|
|
option_Progress.series[0].data[1].value =(maxg-n1);
|
|
m_gauge2.setOption(option_Progress);
|
|
|
|
option_Progress.title.text ="已经完成";
|
|
option_Progress.series[0].data[0].value = n2;
|
|
option_Progress.title.subtext =n2+"台";
|
|
option_Progress.series[0].data[1].value =(maxg-n2);
|
|
m_gauge3.setOption(option_Progress);
|
|
|
|
option_Progress.title.text ="计划完成率";
|
|
option_Progress.series[0].data[0].value = n3;
|
|
option_Progress.title.subtext =n3+"%";
|
|
option_Progress.series[0].data[1].value =(100-n3);
|
|
m_gauge4.setOption(option_Progress);
|
|
|
|
//日进度条
|
|
maxg=Math.round(Math.random()*maxg)+1;
|
|
n1=Math.round(Math.random()*maxg)+1;
|
|
n2=Math.round(Math.random()*n1);
|
|
n3=(n2/maxg*100).toFixed(2);
|
|
|
|
option_Progress.title.text ="计划生产";
|
|
option_Progress.series[0].data[0].value = maxg;
|
|
option_Progress.title.subtext =maxg+"台";
|
|
option_Progress.series[0].data[1].value =0;
|
|
d_gauge1.setOption(option_Progress);
|
|
|
|
option_Progress.title.text ="已接订单";
|
|
option_Progress.series[0].data[0].value = n1;
|
|
option_Progress.title.subtext =n1+"台";
|
|
option_Progress.series[0].data[1].value =(maxg-n1);
|
|
d_gauge2.setOption(option_Progress);
|
|
|
|
option_Progress.title.text ="已经完成";
|
|
option_Progress.series[0].data[0].value = n2;
|
|
option_Progress.title.subtext =n2+"台";
|
|
option_Progress.series[0].data[1].value =(maxg-n2);
|
|
d_gauge3.setOption(option_Progress);
|
|
|
|
option_Progress.title.text ="计划完成率";
|
|
option_Progress.series[0].data[0].value = n3;
|
|
option_Progress.title.subtext =n3+"%";
|
|
option_Progress.series[0].data[1].value =(100-n3);
|
|
d_gauge4.setOption(option_Progress);
|
|
|
|
//仪表盘刷新
|
|
option_gauge.series[0].axisLine.lineStyle.color=[[0.2, color[0]],[0.8, color[1]],[1, color[0]]];
|
|
|
|
option_gauge.series[0].data[0].value = (Math.random() * 100).toFixed(2) - 0;
|
|
option_gauge.series[0].data[0].name ="水";
|
|
$('#vg1').html(option_gauge.series[0].data[0].value);
|
|
gauge1.setOption(option_gauge);
|
|
option_gauge.series[0].data[0].value = (Math.random() * 100).toFixed(2) - 0;
|
|
option_gauge.series[0].data[0].name ="电";
|
|
$('#vg2').html(option_gauge.series[0].data[0].value);
|
|
gauge2.setOption(option_gauge);
|
|
option_gauge.series[0].data[0].value = (Math.random() * 100).toFixed(2) - 0;
|
|
option_gauge.series[0].data[0].name ="天然气";
|
|
$('#vg3').html(option_gauge.series[0].data[0].value);
|
|
gauge3.setOption(option_gauge);
|
|
option_gauge.series[0].data[0].value = (Math.random() * 100).toFixed(2) - 0;
|
|
option_gauge.series[0].data[0].name ="压缩空气";
|
|
$('#vg4').html(option_gauge.series[0].data[0].value);
|
|
gauge4.setOption(option_gauge);
|
|
option_gauge.series[0].data[0].value = (Math.random() * 100).toFixed(2) - 0;
|
|
option_gauge.series[0].data[0].name ="蒸汽";
|
|
$('#vg5').html(option_gauge.series[0].data[0].value);
|
|
gauge5.setOption(option_gauge);
|
|
|
|
//显示最后更新时间
|
|
$('#refresh').html("<span id=\"refreshTime\">最后刷新时间："+myDate.toLocaleDateString()+" "+myDate.toLocaleTimeString()+"</span>");
|
|
}
|
|
|
|
//生成订单号
|
|
function getOrderNumber(n)
|
|
{
|
|
var no="000000"+n.toString();
|
|
return no.substring(no.length-6);
|
|
}
|
|
|
|
//前面补0
|
|
function insertZero(n)
|
|
{
|
|
var no="000000"+n.toString();
|
|
return no.substring(no.length-2);
|
|
}
|