fuxiaochun 2023-08-21 22:42:00 +08:00
commit 8bf6756bb0
2 changed files with 27 additions and 32 deletions

View File

@ -26,7 +26,7 @@
}" }"
:pagination="true" :pagination="true"
:modules="modules" :modules="modules"
class="h-full" class="h-full cu-swiper"
> >
<swiper-slide <swiper-slide
v-for="(item, i) in trendsList" v-for="(item, i) in trendsList"
@ -151,4 +151,11 @@ onMounted(() => {
color: white; color: white;
} }
} }
.cu-swiper{
.swiper-slide-prev,.swiper-slide-next{
//
pointer-events: none;
}
}
</style> </style>

View File

@ -120,6 +120,7 @@ onMounted(() => {
const setOption = (options) => { const setOption = (options) => {
if (chartDom) { if (chartDom) {
chartDom.clear()
chartDom.setOption(options) chartDom.setOption(options)
} }
} }
@ -135,14 +136,14 @@ const initChart = () => {
const lineChart = (data) => { const lineChart = (data) => {
const { chart_data, chart_options, title } = data const { chart_data, chart_options, title } = data
const xAxis = chart_data.xAxis.list const xAxis = chart_data.xAxis.list
const series = chart_data.data.map((e) => { const series = chart_data.data.filter((item) => item.list.some((value) => value !== null)).map((e) => {
return { return {
name: e.name, name: e.name,
type: chart_options.type, type: chart_options.type,
color: '#3662FE', color: chart_options.color,
smooth: true, smooth: true,
areaStyle: { areaStyle: {
normal: { normal: {
@ -154,11 +155,11 @@ const lineChart = (data) => {
[ [
{ {
offset: 0, offset: 0,
color: 'rgba(54, 98, 254, 0.3)', color: hexToRgba(chart_options.color ?? '#ffffff','0.3'),
}, },
{ {
offset: 0.8, offset: 0.8,
color: 'rgba(54, 98, 254, 0)', color: hexToRgba(chart_options.color ?? '#ffffff','0'),
}, },
], ],
false false
@ -243,35 +244,13 @@ const barChart = (data) => {
const xAxis = chart_data.xAxis.list const xAxis = chart_data.xAxis.list
const series = chart_data.data.map((e) => { const series = chart_data.data.filter((item) => item.list.some((value) => value !== null)).map((e) => {
return { return {
name: e.name, name: e.name,
type: chart_options.type, type: chart_options.type,
color: '#3662FE', color: chart_options.color,
smooth: true, smooth: true,
areaStyle: {
normal: {
color: new echarts.graphic.LinearGradient(
0,
0,
0,
1,
[
{
offset: 0,
color: 'rgba(54, 98, 254, 0.3)',
},
{
offset: 0.8,
color: 'rgba(54, 98, 254, 0)',
},
],
false
),
shadowColor: 'rgba(54, 98, 254, 0.1)',
shadowBlur: 10,
},
},
symbol: 'circle', symbol: 'circle',
symbolSize: 5, symbolSize: 5,
data: e.list, data: e.list,
@ -301,7 +280,7 @@ const barChart = (data) => {
}, },
xAxis: { xAxis: {
type: 'category', type: 'category',
boundaryGap: false, // boundaryGap: false,
data: xAxis, data: xAxis,
axisLabel: { axisLabel: {
color: 'rgba(255, 255, 255, .4)', color: 'rgba(255, 255, 255, .4)',
@ -342,4 +321,13 @@ const barChart = (data) => {
series: series, series: series,
}) })
} }
function hexToRgba(hexColor,opacity) {
const hex = hexColor.replace('#', '')
const r = parseInt(hex.substring(0, 2), 16)
const g = parseInt(hex.substring(2, 4), 16)
const b = parseInt(hex.substring(4, 6), 16)
return `rgba(${r}, ${g}, ${b}, ${opacity})`
}
</script> </script>