高亮头像

src/views/LinkPrediction/components/communityNode.vue

@@ -35,6 +35,7 @@ const initChart = () => {
     nodesNum: item.nodesNum,
     neighbors: item.neighbors,
     category: item.isIncludePredictNodes ? 1 : 0,
+
     selfIncludeImplicitRelationship:
       item.neighbors.map((nei) => nei.id).includes(item.id) && //若该社团的id在该社团邻居中可以找到，说明自己这个社团中有互动隐关系
       item.neighbors.find((nei) => nei.id == item.id).isHidden

src/views/LinkPrediction/components/detailNode.vue

@@ -65,7 +65,7 @@ import {
   nextTick,
   defineProps
 } from "vue"
-import { TansTimestamp } from "@/utils/transform"
+import { TansTimestamp, getAvatarUrl } from "@/utils/transform"
 import nodeHoverImg from "@/assets/images/nodeHover.png"
 import * as echarts from "echarts"
 import { storeToRefs } from "pinia"
@@ -297,6 +297,8 @@ const initChart = async () => {
   nodes = props.interactionStore.communityDetailNodeList.map((item) => ({
     id: item.userId,
     name: item.userName,
+    defaultAvatar: getAvatarUrl(item.defaultAvatar),
+    activeAvatar: getAvatarUrl(item.activeAvatar),
     symbolSize: 40,
     postNum: item.postNum,
     fancy: item.fans
@@ -453,6 +455,8 @@ const initChart = async () => {
         animationDurationUpdate: 3500, // 节点移动更平滑
         data: chartsData.value.nodes.map((node) => ({
           ...node,
+          symbol: node.defaultAvatar ? `image://${node.defaultAvatar}` : "circle",
+          symbolSize: node.defaultAvatar ? 140 : 40,
           itemStyle: {
             color: new echarts.graphic.RadialGradient(0.98, 0.38, 0.9, [
               { offset: 1, color: "#1a3860" }, // 最左侧
@@ -490,23 +494,37 @@ const initChart = async () => {
 
 const highLightUserNodes = (userIds) => {
   if (!userIds) return
-  chart.dispatchAction({
+  // 只让高亮节点显示 activeAvatar，其他节点恢复默认头像或圆形
-    type: "downplay",
+  chartsData.value.nodes.forEach((node) => {
-    seriesIndex: 0
+    if (userIds.includes(node.id) && node.activeAvatar) {
-  })
+      node.symbol = `image://${node.activeAvatar}`
+      node.symbolSize = 140
+    } else {
+      node.symbol = "circle"
+      node.symbolSize = 40
+      node.itemStyle = {
+        color: new echarts.graphic.RadialGradient(0.98, 0.38, 0.9, [
+          { offset: 1, color: "#1a3860" }, // 最左侧
+          { offset: 0.5, color: "#38546b" }, // 中间
+          { offset: 0, color: "#5fb3b3" } // 最右侧
+        ]),
 
-  setTimeout(() => {
+        opacity: 1,
-    //等待所有节点添加完毕后再查找
+        borderColor: "#46C6AD",
-    userIds.forEach((id) => {
+        borderWidth: 1,
-      const index = chartsData.value.nodes.findIndex((node) => node.id === id)
+        shadowBlur: 4,
-      if (index != -1) {
+        borderType: "dashed",
-        chart.dispatchAction({
+        shadowColor: "rgba(19, 27, 114, 0.25)"
-          type: "highlight",
+      }
-          dataIndex: index
-        })
     }
   })
-  }, 1000)
+  chart.setOption({
+    series: [
+      {
+        data: chartsData.value.nodes
+      }
+    ]
+  })
 }
 
 onMounted(() => {