Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
ZhangJianFrontEnd
Overview
Overview
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
vue-project
ZhangJian
ZhangJianFrontEnd
Commits
4503614c
Commit
4503614c
authored
Aug 11, 2021
by
wangr
Browse files
Options
Browse Files
Download
Plain Diff
Merge remote-tracking branch 'origin/20210819' into wangrui
parents
75c9ec2f
9c42ba65
Hide whitespace changes
Inline
Side-by-side
Showing
2 changed files
with
52 additions
and
52 deletions
+52
-52
LineBar.vue
src/components/echarts/LineBar.vue
+43
-23
Right.vue
src/pages/index/Right.vue
+9
-29
No files found.
src/components/echarts/LineBar.vue
View file @
4503614c
...
...
@@ -60,30 +60,50 @@ export default {
/**
* @method getSeriesData 图表数据
*/
getSeriesData
(
data
)
{
const
defSeriesOpts
=
{
name
:
'back'
,
type
:
'bar'
,
barWidth
:
'4px'
,
itemStyle
:
{
borderRadius
:
[
0
,
0
,
0
,
0
],
normal
:
{
color
:
'#233549'
}
getSeriesData
()
{
const
defSeriesOpts
=
[
{
name
:
'back'
,
type
:
'bar'
,
barWidth
:
'4px'
,
itemStyle
:
{
borderRadius
:
[
0
,
0
,
0
,
0
],
normal
:
{
color
:
'#233549'
}
},
barGap
:
'-100%'
,
data
:
[]
},
barGap
:
'-100%'
,
data
:
[]
}
let
result
=
[
defSeriesOpts
]
const
{
seriesData
=
[]
}
=
this
.
option
console
.
log
(
this
.
option
)
if
(
seriesData
.
length
)
{
const
temp
=
[]
seriesData
.
forEach
(
item
=>
{
temp
.
push
(
this
.
deepMerge
({},
defSeriesOpts
,
item
))
})
result
=
temp
}
{
name
:
'show'
,
type
:
'bar'
,
barWidth
:
'4px'
,
itemStyle
:
{
borderRadius
:
[
0
,
0
,
0
,
0
],
normal
:
{
color
:
new
this
.
echarts
.
graphic
.
LinearGradient
(
0
,
0
,
1
,
0
,
[{
offset
:
0
,
color
:
'rgba(59, 150, 235, 0.1)'
},
{
offset
:
1
,
color
:
'#3b96eb'
}],
false
)
}
},
markPoint
:
{
symbol
:
'image://data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAYAAAA71pVKAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyVpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQ4IDc5LjE2NDAzNiwgMjAxOS8wOC8xMy0wMTowNjo1NyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDIxLjAgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6ODdEN0ZCRTVBMUJBMTFFQkE2NTJGMjkxNkVGRjdGMjkiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6ODdEN0ZCRTZBMUJBMTFFQkE2NTJGMjkxNkVGRjdGMjkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo4N0Q3RkJFM0ExQkExMUVCQTY1MkYyOTE2RUZGN0YyOSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo4N0Q3RkJFNEExQkExMUVCQTY1MkYyOTE2RUZGN0YyOSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PvpJkncAAAI7SURBVHjafFNLaxNRFD73zjOZpE2ampa2agwtiCAuBBdxJQpq0bUrl+JjIYqb4i9w4aa7gksRXboTBC2KQl24kEILvghinybmMU1m7mTu3J6TTmAo1tnMvfd83znf+e657MILBQd8LLH+J0jfT7hV2iwZWjTHgF1G9hiythSoVz3JHy1Ux6vJRDxJvFPemLU09UmC/veXSF971zp0nP60p3OKJxWxWDa7UdosO7r6WAtTt790cmumBgXOwI4U+IGE+imnOTmqewudkFWeVMd/koKBbGZzeBiA8XzVz7XzNlTSOsxoHLIyArcbwjc8Xz6TCZ/ZPJxD/M0kmXMNLlYD565jwMkRG85hghNYfUhIcJs+TKFW9rvnfCibrfm43YjIbCIDGkos1nuWHLJghojFNEzjGtoCitQkJlmr+faPaas1Rvj1HZD9ylKRCaw2YoaTiptZqkjEYWtPVlNAVmOQLWAccX/28LHbGFChYm8P2/5Z6hENamNFaIl+ZcC9iwR3yvYqiFsk/OCeFUnY8M3Hpax4kzOCpw3fXIkr9nvGJCvDehBmuJitdszzhE8aFi3Wcl+vGo37R9LufIellrYDa0lIziwtUhOWGHWUd32rq98jHOGTE6bqHgSvt/MvT+d3vh91vAfHTHEJryqHbTS7vej9ase68rmRWSbcYMpYYrbJBK2QAjNtQArDFpI1JEuMiG4PvJgoB2R93/BLBPgEousIQmBkzrrbJ0QxRh30MAbBKDblv69qV4ABAOvFCo1MtxZ0AAAAAElFTkSuQmCC'
,
symbolSize
:
[
10
,
10
],
data
:
[]
},
data
:
[],
z
:
3
}
]
const
result
=
[{},
{}]
result
[
0
]
=
this
.
deepMerge
({},
defSeriesOpts
[
0
],
this
.
option
.
seriesData
[
0
])
result
[
1
]
=
this
.
deepMerge
({},
defSeriesOpts
[
1
],
this
.
option
.
seriesData
[
1
])
console
.
log
(
result
[
0
],
result
[
1
])
return
result
},
...
...
src/pages/index/Right.vue
View file @
4503614c
...
...
@@ -45,7 +45,7 @@
<div
class=
"activity-two"
>
<div
class=
"left"
>
<div
class=
"act-left"
>
<count-roll
:count=
"4166"
/><span>
次
</span>
<count-roll
:count=
activeSum
/><span>
次
</span>
</div>
<p
class=
"act-num"
>
活动开展次数
</p>
</div>
...
...
@@ -172,7 +172,6 @@ export default {
swiperSlide
,
LineBar
,
CountRoll
// PopupFrame
},
props
:
{
rightData
:
{
...
...
@@ -229,6 +228,7 @@ export default {
topicShow
:
true
,
// 活动开展
activeConfig
:
{},
activeSum
:
''
,
activeList
:
[
{
name
:
'*****活动'
,
value
:
192
},
{
name
:
'组织活动'
,
value
:
1103
},
...
...
@@ -586,7 +586,10 @@ export default {
getActive
(
data
)
{
let
yData
=
data
.
map
(
v
=>
v
.
name
).
reverse
()
// y轴左侧的数据
let
y2Data
=
data
.
map
(
v
=>
v
.
value
).
reverse
()
// y轴右侧的数据
let
max
=
4166
// x轴的最大值
console
.
log
(
y2Data
)
let
max
=
y2Data
[
0
]
+
y2Data
[
1
]
+
y2Data
[
2
]
this
.
activeSum
=
max
// let max = 4166 // x轴的最大值
let
maxData
=
new
Array
(
data
.
length
).
fill
(
max
)
// x轴的最大值
let
pointData
=
data
.
reverse
().
map
((
v
,
i
)
=>
{
return
{
...
...
@@ -619,29 +622,6 @@ export default {
},
seriesData
:
[
{
name
:
'show'
,
type
:
'bar'
,
barWidth
:
'4px'
,
itemStyle
:
{
borderRadius
:
[
0
,
0
,
0
,
0
],
normal
:
{
color
:
new
this
.
echarts
.
graphic
.
LinearGradient
(
0
,
0
,
1
,
0
,
[{
offset
:
0
,
color
:
'rgba(59, 150, 235, 1)'
},
{
offset
:
1
,
color
:
'#3b96eb'
}],
false
)
}
},
markPoint
:
{
symbol
:
'image://data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPCAYAAAA71pVKAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyVpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQ4IDc5LjE2NDAzNiwgMjAxOS8wOC8xMy0wMTowNjo1NyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDIxLjAgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6ODdEN0ZCRTVBMUJBMTFFQkE2NTJGMjkxNkVGRjdGMjkiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6ODdEN0ZCRTZBMUJBMTFFQkE2NTJGMjkxNkVGRjdGMjkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo4N0Q3RkJFM0ExQkExMUVCQTY1MkYyOTE2RUZGN0YyOSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo4N0Q3RkJFNEExQkExMUVCQTY1MkYyOTE2RUZGN0YyOSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PvpJkncAAAI7SURBVHjafFNLaxNRFD73zjOZpE2ampa2agwtiCAuBBdxJQpq0bUrl+JjIYqb4i9w4aa7gksRXboTBC2KQl24kEILvghinybmMU1m7mTu3J6TTmAo1tnMvfd83znf+e657MILBQd8LLH+J0jfT7hV2iwZWjTHgF1G9hiythSoVz3JHy1Ux6vJRDxJvFPemLU09UmC/veXSF971zp0nP60p3OKJxWxWDa7UdosO7r6WAtTt790cmumBgXOwI4U+IGE+imnOTmqewudkFWeVMd/koKBbGZzeBiA8XzVz7XzNlTSOsxoHLIyArcbwjc8Xz6TCZ/ZPJxD/M0kmXMNLlYD565jwMkRG85hghNYfUhIcJs+TKFW9rvnfCibrfm43YjIbCIDGkos1nuWHLJghojFNEzjGtoCitQkJlmr+faPaas1Rvj1HZD9ylKRCaw2YoaTiptZqkjEYWtPVlNAVmOQLWAccX/28LHbGFChYm8P2/5Z6hENamNFaIl+ZcC9iwR3yvYqiFsk/OCeFUnY8M3Hpax4kzOCpw3fXIkr9nvGJCvDehBmuJitdszzhE8aFi3Wcl+vGo37R9LufIellrYDa0lIziwtUhOWGHWUd32rq98jHOGTE6bqHgSvt/MvT+d3vh91vAfHTHEJryqHbTS7vej9ase68rmRWSbcYMpYYrbJBK2QAjNtQArDFpI1JEuMiG4PvJgoB2R93/BLBPgEousIQmBkzrrbJ0QxRh30MAbBKDblv69qV4ABAOvFCo1MtxZ0AAAAAElFTkSuQmCC'
,
symbolSize
:
[
10
,
10
],
data
:
[]
},
data
:
[
50
]
},
{
name
:
'back'
,
barWidth
:
'5px'
,
data
:
maxData
...
...
@@ -651,13 +631,13 @@ export default {
barWidth
:
'5px'
,
itemStyle
:
{
borderRadius
:
[
0
,
0
,
0
,
0
],
color
:
'rgba(64, 169, 248,
.05
)'
color
:
'rgba(64, 169, 248,
0.3
)'
},
markPoint
:
{
symbolOffset
:
[
0
,
0.5
],
data
:
pointData
// x轴的数值
data
:
pointData
},
data
:
[
10
,
10
,
10
,
10
]
data
:
y2Data
}
]
}
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment