const setRemUnit = () => { const docEl = document.documentElement; // IPhone6下750像素来设计,实际像素375px,1re
顺晟科技
2021-08-19 09:39:08
114
关于展示仪表盘设置起始与结束数值并设置显示数字个数中有三个字段设置,分钟为最小值,max为更大值,splitNumber为显示几个数值,用法为下。
实例一
选项={ 0
系列: [{ 0
:型'仪表,
起始角度: 180,
endAngle: 0,
min: 0,
max: 240,
splitNumber: 12,
itemStyle: {
color: '#58D9F9 ',
shadowColor: 'rgba(0,138,255,0.45)',
暗影模糊: 10,
shadowOffsetX: 2,
阴影偏移量: 2
},
进步: {
show: true,
roundCap: true,
宽度: 18
},
指针: {
图标: '路径://m 2090。36389,615.30999 L2090.36389,615.30999 C2091.48372,615.30999 2092.40383,616。194028 2092 .444859,617 .31956096
长度: '75% ',
宽度: 16,
偏移量输入: [0,' 5%']
},
axisLine: {
roundCap: true,
线型: {
宽度: 18
}
},
axisTick: {
splitNumber: 2,
线型: {
宽度: 2,
color: '#999 '
}
},
splitLine: {
长度: 12,
线型: {
宽度: 3,
color: '#999 '
}
},
axisLabel: {
距离: 30,
color: '#999 ',
fontSize: 20
},
title: {
show: false
},
详细信息: {
backgroundColor: '#fff ',
borderColor: '#999 ',
borderWidth: 2,
宽度: '60% ',
线高: 40,
高度: 40,
borderRadius: 8,
偏移量输入: [0,' 35%'],
值动画:为真,
formatter:函数(值){ 0
返回“{ value |”值。to fixed(0)" } { unit | km/h } ";
},
rich: {
value: {
fontSize: 50,
fontWeight: '更粗,
color: '#777 '
},
unit: {
fontSize: 20,
color: '#999 ',
padd :[0,0,-20,10]
}
}
},
数据: [{ 0
值: 100
}]
}]
};
以上代码为设置了更大和最小值为0到240:显示12个数值
效果:
实例2:
选项={ 0
系列: [{ 0
:型'仪表,
起始角度: 180,
endAngle: 0,
min: 0,
max: 240,
splitNumber: 6,
itemStyle: {
color: '#58D9F9 ',
shadowColor: 'rgba(0,138,255,0.45)',
暗影模糊: 10,
shadowOffsetX: 2,
阴影偏移量: 2
},
进步: {
show: true,
roundCap: true,
宽度: 18
},
指针: {
图标: '路径://m 2090。36389,615.30999 L2090.36389,615.30999 C2091.48372,615.30999 2092.40383,616。194028 2092 .444859,617 .31956096
长度: '75% ',
宽度: 16,
偏移量输入: [0,' 5%']
},
axisLine: {
roundCap: true,
线型: {
宽度: 18
}
},
axisTick: {
splitNumber: 2,
线型: {
宽度: 2,
color: '#999 '
}
},
splitLine: {
长度: 12,
线型: {
宽度: 3,
color: '#999 '
}
},
axisLabel: {
距离: 30,
color: '#999 ',
fontSize: 20
},
title: {
show: false
},
详细信息: {
backgroundColor: '#fff ',
borderColor: '#999 ',
borderWidth: 2,
宽度: '60% ',
线高: 40,
高度: 40,
borderRadius: 8,
偏移量输入: [0,' 35%'],
值动画:为真,
formatter:函数(值){ 0
返回“{ value |”值。to fixed(0)" } { unit | km/h } ";
},
rich: {
value: {
fontSize: 50,
fontWeight: '更粗,
color: '#777 '
},
unit: {
fontSize: 20,
color: '#999 ',
padd :[0,0,-20,10]
}
}
},
数据: [{ 0
值: 100
}]
}]
};
以上代码还是2至240的数值,但是只显示6个数值
效果:
注意:设置6会显示七个,因为0的起点不算在内。
23
2022-09
23
2022-09
13
2022-09
03
2022-09
03
2022-09
03
2022-09