Open coredesign1234 opened 3 months ago
使用如下代码操作时,如果浏览器切换为移动端兼容模式,或者放到移动端时候,点击一个节点,前一个选中的节点的高亮不会取消
/* eslint-disable no-undef */ import React, { useContext, useEffect } from 'react'; import Graphin, { Utils, GraphinContext, IG6GraphEvent } from '@antv/graphin'; import IconLoader from '@antv/graphin-icons' import { INode, NodeConfig } from '@antv/g6' const icons = Graphin.registerFontFamily(IconLoader) const SampleBehavior = () => { const { graph, apis } = useContext(GraphinContext); useEffect(() => { // 初始化聚焦到`node-1` const handleTouchDown = (evt: IG6GraphEvent) => { const node = evt.item as INode; const model = node.getModel() as NodeConfig; apis.focusNodeById(model.id); } // 每次点击聚焦到点击节点上 graph.on('node:touchstart', handleTouchDown); return () => { graph.off('node:touchstart', handleTouchDown); }; }, []); return null; } const App = () => { const [state, setState] = React.useState({ selected: [], data: Utils.mock(20).circle().graphin(), }); const { data } = state; data.nodes.forEach(node => node.style = { keyshape: { size: 60 }, icon: { type: 'image', value: `http://i0.sinaimg.cn/edu/2012/0614/U3834P42DT20120614140120.jpg`, size: [40, 60], // clip: { // r: 20, // }, }, label: { value: '裁剪 icon', offset: [0, 20] }, }) const basicLayout = { type: 'graphin-force', animation: false, preset: { type: 'concentric', // 力导的前置布局 }, preventOverlap: true, nodeSize: 40, } return ( <div className="App"> <Graphin fitView data={data} layout={{ ...basicLayout, leafCluster: true, // 是否需要叶子节点聚类 nodeClusterBy: 'cluster', // 节点聚类的映射字段 clusterNodeStrength: 20, // 节点聚类作用力系数 }} > <SampleBehavior /> </Graphin> </div> ); }; export default App;
https://codesandbox.io/p/sandbox/gifted-panka-3gmkkq
NAN
前一个的高亮能够取消
No response
Describe the bug
使用如下代码操作时,如果浏览器切换为移动端兼容模式,或者放到移动端时候,点击一个节点,前一个选中的节点的高亮不会取消
Your Example Website or App
https://codesandbox.io/p/sandbox/gifted-panka-3gmkkq
NAN
Steps to Reproduce the Bug or Issue
Expected behavior
前一个的高亮能够取消
Screenshots or Videos
No response
Platform
Additional context
No response