Merge branch 'master' of http://172.16.20.1:3000/duanhao/SocialNetworks_duan
This commit is contained in:
commit
057abc4c51
|
|
@ -174,16 +174,6 @@ const initChart = async() => {
|
|||
// 添加鼠标悬浮事件监听
|
||||
chartInstance.on('mouseover', function(params) {
|
||||
if (!params.data) return;
|
||||
/* const isBridgeNode = params.data.category === 0;
|
||||
|
||||
if (isBridgeNode) {
|
||||
// 如果是桥梁节点
|
||||
const nodeId = params.data.originalId;
|
||||
// 无论当前是否有激活节点,都设置为当前节点
|
||||
activeNodeId.value = nodeId;
|
||||
updateNodeImage(nodeId, true);
|
||||
} */
|
||||
|
||||
if (params.dataType === 'node') {
|
||||
// 仅节点时触发相邻高亮
|
||||
chartInstance.dispatchAction({
|
||||
|
|
@ -192,7 +182,7 @@ const initChart = async() => {
|
|||
dataIndex: params.dataIndex
|
||||
});
|
||||
|
||||
// 你已有的桥梁节点头像切换逻辑
|
||||
// 已有的桥梁节点头像切换逻辑
|
||||
const isBridgeNode = params.data.category === 0;
|
||||
if (isBridgeNode) {
|
||||
const nodeId = params.data.originalId;
|
||||
|
|
@ -203,7 +193,6 @@ const initChart = async() => {
|
|||
// 悬浮在边上:不高亮
|
||||
chartInstance.dispatchAction({ type: 'unfocusNodeAdjacency', seriesIndex: SERIES_INDEX });
|
||||
chartInstance.dispatchAction({ type: 'downplay', seriesIndex: SERIES_INDEX });
|
||||
// 也可以顺手关掉 tooltip(你 formatter 已经返回空字符串,其实也行)
|
||||
}
|
||||
|
||||
});
|
||||
|
|
@ -211,15 +200,6 @@ const initChart = async() => {
|
|||
// 添加鼠标离开事件监听
|
||||
chartInstance.on('mouseout', function(params) {
|
||||
if (!params.data) return;
|
||||
/* const isBridgeNode = params.data.category === 0;
|
||||
if (isBridgeNode) {
|
||||
// 如果是桥梁节点
|
||||
const nodeId = params.data.originalId;
|
||||
if (activeNodeId.value === nodeId) {
|
||||
activeNodeId.value = null;
|
||||
updateNodeImage(nodeId, false);
|
||||
}
|
||||
} */
|
||||
if (params.dataType === 'node') {
|
||||
// 仅节点移出时取消相邻高亮
|
||||
chartInstance.dispatchAction({
|
||||
|
|
|
|||
|
|
@ -51,6 +51,24 @@ const initChart = async () => {
|
|||
// 初始化图表
|
||||
chart = echarts.init(document.getElementById("container"))
|
||||
|
||||
const SERIES_INDEX = 0;
|
||||
// 添加鼠标悬浮事件监听
|
||||
chart.on('mouseover', function(params) {
|
||||
if (!params.data) return;
|
||||
if (params.dataType === 'node') {
|
||||
// 仅节点时触发相邻高亮
|
||||
chart.dispatchAction({
|
||||
type: 'focusNodeAdjacency',
|
||||
seriesIndex: SERIES_INDEX,
|
||||
dataIndex: params.dataIndex
|
||||
});
|
||||
} else if (params.dataType === 'edge') {
|
||||
// 悬浮在边上:不高亮
|
||||
chart.dispatchAction({ type: 'unfocusNodeAdjacency', seriesIndex: SERIES_INDEX });
|
||||
chart.dispatchAction({ type: 'downplay', seriesIndex: SERIES_INDEX });
|
||||
}
|
||||
});
|
||||
|
||||
//处理data
|
||||
//统计每一个锚点在某些社团,这个社团包含锚点的个数(key: 社团id, value: 这个社团含有几个锚点)
|
||||
//统计每个社团包含的锚点id列表
|
||||
|
|
@ -267,12 +285,18 @@ const initChart = async () => {
|
|||
width: 1
|
||||
},
|
||||
emphasis: {
|
||||
// 高亮配置
|
||||
focus: "adjacency", // 高亮相邻节点
|
||||
lineStyle: {
|
||||
// 高亮时线条样式
|
||||
width: 5 // 线条宽度(10)
|
||||
}
|
||||
focus: 'adjacency', // 有了这个,才会触发“其他元素进入 blur 状态”
|
||||
blurScope: 'series', // 只在本系列里变暗
|
||||
scale: false, // 不要把节点放大,避免跳动
|
||||
lineStyle: { opacity: 1 },
|
||||
itemStyle: { opacity: 1 },
|
||||
label: { opacity: 1 }
|
||||
},
|
||||
blur: {
|
||||
// 非相邻元素进入“模糊/暗”状态时的样式(相当于“隐藏”)
|
||||
lineStyle: { opacity: 0.05 },
|
||||
itemStyle: { opacity: 0.1 },
|
||||
label: { opacity: 0 }
|
||||
}
|
||||
}
|
||||
]
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user