duanhao/SocialNetworks_duan
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改groupChart

Browse Source
This commit is contained in:
duanhao 2025-08-05 15:20:20 +08:00
parent c22cee492e
commit e5a7e59437
4 changed files with 57 additions and 190 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

213
src/store/groupEvolution/index.js
View File

@ -642,19 +642,8 @@ export const useGroupMemberStore = defineStore("groupMember", {
yAxisRange: { min: 0, max: 1, interval: 0.2 },
seriesList: [
{
name: "",
type: "line",
lineStyle: {
color: "#2AB8FD",
width: 1 // 设置线条宽度为3像素
},
itemStyle: {
color: "#0A1A2F",
borderColor: "#2AB8FD",
borderWidth: 1
},
symbol: "circle",
symbolSize: 10, // 圆点大小
name: "分裂演化",
themeColor: "#2AB8FD",
data: [0.9237, 0.14507, 0, 0, 0]
}
]
@ -668,20 +657,8 @@ export const useGroupMemberStore = defineStore("groupMember", {
yAxisRange: { min: 0, max: 25, interval: 5 },
seriesList: [
{
name: "",
type: "line",
lineStyle: {
color: "#01D7DA",
width: 1 // 设置线条宽度为3像素
},
itemStyle: {
color: "#0A1A2F",
borderColor: "#01D7DA",
borderWidth: 1
},
symbol: "circle",
symbolSize: 10, // 圆点大小
borderWidth: 1, // 边框宽度
name: "合并演化",
themeColor: "#02D7DA",
data: [9.8011, 21.3123, 10.4338, 14.1912, 10.1523]
}
]
@ -695,20 +672,8 @@ export const useGroupMemberStore = defineStore("groupMember", {
yAxisRange: { min: 0, max: 2, interval: 0.5 },
seriesList: [
{
name: "",
type: "line",
lineStyle: {
color: "#FFDA09",
width: 1 // 设置线条宽度为3像素
},
itemStyle: {
color: "#0A1A2F",
borderColor: "#FFDA09",
borderWidth: 1
},
symbol: "circle",
symbolSize: 10, // 圆点大小
borderWidth: 1, // 边框宽度
name: "收缩演化",
themeColor: "#FFDA09",
data: [1.9057, 1.5123, 1.0338, 0.5912, 0.1523]
}
]
@ -722,20 +687,8 @@ export const useGroupMemberStore = defineStore("groupMember", {
yAxisRange: { min: 0, max: 20, interval: 5 },
seriesList: [
{
name: "",
type: "line",
lineStyle: {
color: "#EB57B0",
width: 1 // 设置线条宽度为3像素
},
itemStyle: {
color: "#0A1A2F",
borderColor: "#EB57B0",
borderWidth: 1
},
symbol: "circle",
symbolSize: 10, // 圆点大小
borderWidth: 1, // 边框宽度
name: "扩展演化",
themeColor: "#EB57B0",
data: [15.1119, 6.5123, 10.6338, 9.5912, 4.1523]
}
]
@ -751,19 +704,8 @@ export const useGroupMemberStore = defineStore("groupMember", {
yAxisRange: { min: 0, max: 1, interval: 0.2 },
seriesList: [
{
name: "",
type: "line",
lineStyle: {
color: "#2AB8FD",
width: 1 // 设置线条宽度为3像素
},
itemStyle: {
color: "#0A1A2F",
borderColor: "#2AB8FD",
borderWidth: 1
},
symbol: "circle",
symbolSize: 10, // 圆点大小
name: "分裂演化",
themeColor: "#2AB8FD",
data: [0.9237, 0.14507, 0, 0, 0]
}
]
@ -777,20 +719,8 @@ export const useGroupMemberStore = defineStore("groupMember", {
yAxisRange: { min: 0, max: 25, interval: 5 },
seriesList: [
{
name: "",
type: "line",
lineStyle: {
color: "#01D7DA",
width: 1 // 设置线条宽度为3像素
},
itemStyle: {
color: "#0A1A2F",
borderColor: "#01D7DA",
borderWidth: 1
},
symbol: "circle",
symbolSize: 10, // 圆点大小
borderWidth: 1, // 边框宽度
name: "合并演化",
themeColor: "#02D7DA",
data: [9.8011, 21.3123, 10.4338, 14.1912, 10.1523]
}
]
@ -804,20 +734,8 @@ export const useGroupMemberStore = defineStore("groupMember", {
yAxisRange: { min: 0, max: 2, interval: 0.5 },
seriesList: [
{
name: "",
type: "line",
lineStyle: {
color: "#FFDA09",
width: 1 // 设置线条宽度为3像素
},
itemStyle: {
color: "#0A1A2F",
borderColor: "#FFDA09",
borderWidth: 1
},
symbol: "circle",
symbolSize: 10, // 圆点大小
borderWidth: 1, // 边框宽度
name: "收缩演化",
themeColor: "#FFDA09",
data: [1.9057, 1.5123, 1.0338, 0.5912, 0.1523]
}
]
@ -831,20 +749,8 @@ export const useGroupMemberStore = defineStore("groupMember", {
yAxisRange: { min: 0, max: 20, interval: 5 },
seriesList: [
{
name: "",
type: "line",
lineStyle: {
color: "#EB57B0",
width: 1 // 设置线条宽度为3像素
},
itemStyle: {
color: "#0A1A2F",
borderColor: "#EB57B0",
borderWidth: 1
},
symbol: "circle",
symbolSize: 10, // 圆点大小
borderWidth: 1, // 边框宽度
name: "扩展演化",
themeColor: "#EB57B0",
data: [15.1119, 6.5123, 10.6338, 9.5912, 4.1523]
}
]
@ -860,19 +766,8 @@ export const useGroupMemberStore = defineStore("groupMember", {
yAxisRange: { min: 0, max: 1, interval: 0.2 },
seriesList: [
{
name: "",
type: "line",
lineStyle: {
color: "#2AB8FD",
width: 1 // 设置线条宽度为3像素
},
itemStyle: {
color: "#0A1A2F",
borderColor: "#2AB8FD",
borderWidth: 1
},
symbol: "circle",
symbolSize: 10, // 圆点大小
name: "分裂演化",
themeColor: "#2AB8FD",
data: [0.9237, 0.14507, 0, 0, 0]
}
]
@ -886,20 +781,8 @@ export const useGroupMemberStore = defineStore("groupMember", {
yAxisRange: { min: 0, max: 25, interval: 5 },
seriesList: [
{
name: "",
type: "line",
lineStyle: {
color: "#01D7DA",
width: 1 // 设置线条宽度为3像素
},
itemStyle: {
color: "#0A1A2F",
borderColor: "#01D7DA",
borderWidth: 1
},
symbol: "circle",
symbolSize: 10, // 圆点大小
borderWidth: 1, // 边框宽度
name: "合并演化",
themeColor: "#02D7DA",
data: [9.8011, 21.3123, 10.4338, 14.1912, 10.1523]
}
]
@ -913,20 +796,8 @@ export const useGroupMemberStore = defineStore("groupMember", {
yAxisRange: { min: 0, max: 2, interval: 0.5 },
seriesList: [
{
name: "",
type: "line",
lineStyle: {
color: "#FFDA09",
width: 1 // 设置线条宽度为3像素
},
itemStyle: {
color: "#0A1A2F",
borderColor: "#FFDA09",
borderWidth: 1
},
symbol: "circle",
symbolSize: 10, // 圆点大小
borderWidth: 1, // 边框宽度
name: "收缩演化",
themeColor: "#FFDA09",
data: [1.9057, 1.5123, 1.0338, 0.5912, 0.1523]
}
]
@ -940,20 +811,8 @@ export const useGroupMemberStore = defineStore("groupMember", {
yAxisRange: { min: 0, max: 20, interval: 5 },
seriesList: [
{
name: "",
type: "line",
lineStyle: {
color: "#EB57B0",
width: 1 // 设置线条宽度为3像素
},
itemStyle: {
color: "#0A1A2F",
borderColor: "#EB57B0",
borderWidth: 1
},
symbol: "circle",
symbolSize: 10, // 圆点大小
borderWidth: 1, // 边框宽度
name: "扩展演化",
themeColor: "#EB57B0",
data: [15.1119, 6.5123, 10.6338, 9.5912, 4.1523]
}
]
@ -1244,35 +1103,17 @@ export const useAnomalousGroup = defineStore("anomalousGroup", {
seriesList: [
{
name: "社团组一",
type: "bar",
itemStyle: {
color: "#2AB8FD",
borderColor: "#2AB8FD",
borderWidth: 1,
borderRadius: [4, 4, 0, 0] // 顶部圆角
},
themeColor: "#2AB8FD",
data: [0, 5, 4, 3, 0, 5, 0]
},
{
name: "社团组二",
type: "bar",
itemStyle: {
color: "#02D7DA",
borderColor: "#02D7DA",
borderWidth: 1,
borderRadius: [4, 4, 0, 0] // 顶部圆角
},
themeColor: "#02D7DA",
data: [3, 0, 1, 0, 3, 5, 0]
},
{
name: "社团组三",
type: "bar",
itemStyle: {
color: "#FFDA09",
borderColor: "#FFDA09",
borderWidth: 1,
borderRadius: [4, 4, 0, 0] // 顶部圆角
},
themeColor: "#FFDA09",
data: [5, 0, 4, 0, 3, 0, 0]
}
]

8
src/views/GroupEvolution/abnormalGroup/index.vue
View File

@ -7,11 +7,12 @@
<div class="left-container">
<div class="userPanel"></div>
<div class="userChart">
<!-- <GroupChart
<GroupChart
:title="userChartTitleImg"
:moduleName="moduleName"
:isAbnormal="true"
:chartData="anomalousGroupStore.chartData"
></GroupChart> -->
></GroupChart>
</div>
</div>
<div class="middle-container">
@ -56,10 +57,11 @@
<script setup>
import { ref } from "vue";
// import userChartTitleImg from "@/assets/images/abnormalGroup/abnormal-group-hudo-time-chart.png"
import userChartTitleImg from "@/assets/images/abnormalGroup/abnormal-group-hudo-time-chart.png"
import { Icon } from "@iconify/vue";
import WordsCloud from "../component/wordsCloud.vue"
import GroupPost from "../component/groupPost.vue"
import GroupChart from "../component/groupChart.vue"
// import AnomalousContentInfo from "./components/anomalousContentInfo.vue"
import { useAnomalousGroup } from "@/store/groupEvolution/index";

24
src/views/GroupEvolution/component/groupChart.vue
View File

@ -37,6 +37,10 @@ const props = defineProps({
moduleName: {
type: String,
default: ""
},
isAbnormal: {
type: Boolean,
default: false
}
})
@ -146,6 +150,13 @@ const initChart = () => {
扩展指数: "#EB57B0"
}
}
if(props.moduleName == "异常行为分析"){
color = {
社团组一: "#2AB8FD",
社团组二: "#02D7DA",
社团组三: "#FFDA09",
}
}
const listHtml = params
.map(
(item) => `
@ -235,7 +246,8 @@ const initChart = () => {
}
}
},
series: props.chartData.seriesList.map((series) => ({
// 判断是否为异常群体模块：isAbnormal默认为false===>正常模块:异常群体模块
series: !props.isAbnormal ? props.chartData.seriesList.map((series) => ({
...series,
type: "line",
itemStyle: {
@ -251,6 +263,16 @@ const initChart = () => {
width: 1
}
}))
: props.chartData.seriesList.map((series) => ({
...series,
type: "bar",
itemStyle: {
color: series.themeColor,
borderColor: series.themeColor, // 使用线条颜色作为边框色
borderWidth: 1,
borderRadius: [8,8,0,0]
}
}))
}
chartInstance.setOption(option)
}

2
src/views/GroupEvolution/groupMember/components/groupAnalysis.vue
View File

@ -19,6 +19,7 @@
v-for="item in curSelectedTabData"
:key="item.id"
:chartName="item.name"
:moduleName="moduleName"
:chartData="item.chart"
></GroupChart>
</div>
@ -32,6 +33,7 @@ import GroupChart from "../../component/groupChart.vue";
const curSelectedTab = ref("头部自媒体");
const curSelectedTabData = ref(null);
const tabs = ["头部自媒体", "官方媒体", "普通自媒体"];
const moduleName = "群体成员演化分析"
const props = defineProps({
title: {
type: String,