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