Soy un nuevo desarrollador de reacción, aquí estoy usando 'react-d3-graph' para obtener mis nodos y enlaces, en este momento usando 'info' estoy obteniendo con éxito 3 nodos y dos enlaces, esos enlaces se conectan a los nodos. por ejemplo, el enlace con 'objetivo: 1' está conectado al nodo 'id: 1' y el enlace con 'objetivo: 2' está conectado al nodo 'id: 2' (los enlaces y nodos pueden ser muchos más que esto). Mi pregunta es, ¿hay alguna manera de filtrar esto? Si el usuario hace clic en un botón, entonces desde redux obtengo el objeto 'testThis', ese objeto muestra el 'identificador' de los botones en los que se hizo clic actualmente y ese identificador puede estar en esos 'nodos' con el nombre de 'book_id', cómo filtrarlo, de modo que si los 'nodos' contienen 'book_id', cuyo valor es el mismo que el valor del 'identificador', encuéntrelo y selecciónelo. En este caso, debe seleccionar el nodo que tiene book_id y su enlace con él (enlace con el objetivo 2) para que el usuario solo pueda ver dos nodos y un enlace, ¿es esto posible? entonces Graph obtendría esto: después de hacer clic en el botón:
{ links: [ { id: 1, source: 0, target: 2, color: 'green', }, ], nodes: [ { id: 0, name: 'Camera', x: 210, y: 0, }, { book_id: 'gDUy', id: 2, name: 'livingRoom', x: 400, y: 210, }, ], };antes de hacer clic en el botón:
import { Graph } from 'react-d3-graph'; const testThis ={ identifier: "gDUy", } const info = { links: [ { id: 0, source: 0, target: 1, color: 'green', }, { id: 1, source: 0, target: 2, color: 'green', }, ], nodes: [ { id: 0, name: 'Camera', x: 210, y: 0, }, { id: 1, name: 'Kitchen', x: 0, y: 210, }, { book_id: 'gDUy', id: 2, name: 'livingRoom', x: 400, y: 210, }, ], }; <Graph data={info} />El inglés no es mi lengua materna, por lo que podría haber errores.
const testThis = { identifier: "gDUy", } const info = { links: [{ id: 0, source: 0, target: 1, color: 'green', }, { id: 1, source: 0, target: 2, color: 'green', }, ], nodes: [{ id: 0, name: 'Camera', x: 210, y: 0, }, { id: 1, name: 'Kitchen', x: 0, y: 210, }, { book_id: 'gDUy', id: 2, name: 'livingRoom', x: 400, y: 210, }, ], }; function filterGraph() { let nodes = info.nodes.filter(x => x.book_id == testThis.identifier); let links = info.links.filter(x => nodes.map(y => y.id).includes(x.target)); let sourceNodes = info.nodes.filter(x => links.map(y => y.source).includes(x.id)); let allNodes = nodes.concat(sourceNodes); console.log({links:links,nodes:allNodes}); } filterGraph();