调整样式

This commit is contained in:
liuwu 2024-03-05 10:35:52 +08:00
parent 4169a7e4ab
commit 34b1630def
1 changed files with 59 additions and 51 deletions

View File

@ -44,22 +44,22 @@
</div>
<div class="main_center">
<div class="main_center_item">
<div class="data1" onclick="openTab(5,'季度考核指标')">
<span style="font-weight:900;font-size: 18px" >季度考核情况</span>
<div class="data1" style="top:6%" onclick="openTab(5,'季度考核指标')">
<span style="font-weight:900;font-size: 18px;" >季度考核情况</span>
<p class="all_num">达标分0分</p>
<p class="curr_num">当前分数0分</p>
</div>
<div class="data2" onclick="openTab(5,'党风廉政建设')">
<div class="data2" style="top:6%" onclick="openTab(5,'党风廉政建设')">
<span style="font-weight:900;font-size: 18px" >党风廉政建设</span>
<p class="all_num">达标分0分</p>
<p class="curr_num">当前分数0分</p>
</div>
<div class="data3" onclick="openTab(5,'党务及意识形态')">
<div class="data3" style="top:2%" onclick="openTab(5,'党务及意识形态')">
<span style="font-weight:900;font-size: 18px" >党务及意识形态</span>
<p class="all_num">达标分0分</p>
<p class="curr_num">当前分数0分</p>
</div>
<div class="data4" onclick="openTab(5,'日常考核指标')">
<div class="data4" style="top:24%" onclick="openTab(5,'日常考核指标')">
<span style="font-weight:900;font-size: 18px" >日常考核情况</span>
<p class="all_num">达标分0分</p>
<p class="curr_num">当前分数0分</p>
@ -212,10 +212,10 @@
formatter: '{b}:{c}分'
},
grid: {
top: "15%",
left: '5%',
right: '5%',
bottom: '5%',
top: "5%",
left: '1%',
right: '1%',
bottom: '15%',
containLabel: true
},
xAxis: {
@ -226,8 +226,7 @@
}
},
yAxis: {
type: 'value',
name: '',
show:false
},
series: [
{
@ -284,6 +283,7 @@
orient: 'vertical',
top: 'center',
left: '0',
top:'-20',
textStyle: {
color: "#ffffff"
},
@ -350,19 +350,18 @@
},
},
grid: {
top: "15%",
left: '5%',
right: '5%',
bottom: '5%',
top: "8%",
left: '1%',
right: '1%',
bottom: '1%',
containLabel: true
},
xAxis: [
yAxis: [
{
type: 'category',
data: xData,
axisLabel:{
interval:0,
rotate:15,
color:'#FFFFFF'
},
axisPointer: {
@ -370,18 +369,19 @@
}
}
],
yAxis: {
type: 'value',
name: '',
axisLabel:{
color:'#fff'
},
label: {
show: true,
position: 'top',
color: '#FFFFFF',
formatter: '{c}分'
},
xAxis: {
show:false
// type: 'value',
// name: '',
// axisLabel:{
// color:'#fff'
// },
// label: {
// show: true,
// position: 'top',
// color: '#FFFFFF',
// formatter: '{c}分'
// },
},
series: [
{
@ -402,7 +402,7 @@
data: sData1,
label: {
show: true,
position: 'top',
position: 'right',
color: '#FFFFFF',
formatter: '{c}分'
},
@ -425,7 +425,7 @@
data: sData2,
label: {
show: true,
position: 'top',
position: 'right',
color: '#FFFFFF',
formatter: '{c}分'
},
@ -463,9 +463,9 @@
},
grid: {
top: "0%",
left: '0%',
right: '10%',
bottom: '5%',
left: '1%',
right: '5%',
bottom: '1%',
containLabel: true
},
xAxis: {
@ -483,12 +483,19 @@
name: '',
type: 'bar',
data: _sData,
showBackground: true,
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{offset: 0, color: '#0096FF'},
{offset: 1, color: '#66F4FF'}
])
},
// itemStyle: {
// color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
// {offset: 0, color: '#0096FF'},
// {offset: 1, color: '#66F4FF'}
// ])
// },
label: {
show: true,
formatter: '{c}分',
@ -528,39 +535,40 @@
tooltip: {
trigger: 'axis',
},
xAxis: {
yAxis: {
type: 'category',
boundaryGap: false,
data: _xData,
axisLabel:{
interval:0,
rotate:15,
// rotate:15,
color:'#FFFFFF'
},
},
yAxis: {
type: 'value',
axisLabel:{
color:'#fff'
}
xAxis: {
show:false
},
grid: {
top: "15%",
left: '5%',
top: "5%",
left: '1%',
right: '5%',
bottom: '5%',
bottom: '1%',
containLabel: true
},
series: [
{
data: _sData,
type: 'line',
areaStyle: {
color:'#02abe0'
type: 'bar',
showBackground: true,
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{offset: 0, color: '#0096FF'},
{offset: 1, color: '#66F4FF'}
])
},
label: {
show: true,
position: 'top',
position: 'right',
color: '#FFFFFF',
formatter: '{c}分'
},
@ -628,13 +636,13 @@
grd.addColorStop(0, "#e08d03");
grd.addColorStop(1, "#2e6a5c");
ctx.strokeStyle = grd;
ctx.moveTo(w / 5 * 2, h / 2 )
ctx.quadraticCurveTo(w / 3 * 1.2, h / 4 * 1.4, w / 3 * 1.4, h / 5);
ctx.moveTo(w / 5 * 2, h)
ctx.quadraticCurveTo(w / 3 * 1.2, h / 3 * 1.4, w / 3 * 1.4, h / 3);
ctx.stroke();
// 绘制第三条曲线上的圆光效果
ctx.beginPath()
ctx.moveTo(w / 3 * 1.4, h / 5)
ctx.arc(w / 3 * 1.4, h / 5, 5, 0, Math.PI * 2)
ctx.arc(w / 3 * 1.4, h / 3, 5, 0, Math.PI * 2)
ctx.fill()
ctx.restore()
ctx.save()