设计Cytoscape.js图 - 编程之家

如何解决设计Cytoscape.js图

我正在重建一个从头开始使用Cytoscape的旧应用。以前的开发人员已经实现了一些代码，因此我正在使用他所做的Cytoscape配置。我正在建立一个可以被每个节点具有的数据过滤的网络，并为边缘显示不同的颜色和不同的宽度。当我添加了为节点着色和设置边缘宽度的功能时，由于我已选择了一个节点，因此尝试过滤图形时开始出现错误Cannot assign to read only property 'label' of object '#<Object>'，而当我无法读取属性'isHeadless'为null时，一条边被选中。我什至每次过滤图表时都试图取消选择，但这没有帮助。这就是我所说的Cytoscape：

<CytoscapeComponent
        elements={colorizednodes(filterednodes,pathname,threshold,coloring,tissue,fcBounds).concat(weightEdges(filteredEdges,filterednodes))}
        style={{ width: '100%',height: '600px' }}
        cy={(cy) => { cyRef = cy }}
        minZoom={0.5}
        maxZoom={3}
        stylesheet={[
          {
            selector: 'node',style: {
              content: 'data(label)','text-valign': 'center','text-outline-width': 1.5,'text-outline-color': 'black','font-size': '10',color: '#fff','border-width': '2px','border-style': 'solid','border-color': 'black','background-color': 'data(realColor)',}
          },{
            selector: 'node[?shape]',style: {
              shape: 'diamond',width: '3.5em',height: '3.5em'
            }
          },{
            selector: 'edge',style: {
              opacity: 0.666,width: 'mapData(tissueNum,44,0.5,2)','line-color': 'black'
            }
          },{
            selector: ':selected',style: {
              'overlay-color': '#ffff33','overlay-padding': 2.5,'overlay-opacity': 0.3
            }
          }
        ]}
      />

colorizednodes：

const colorizednodes = (filterednodes,fcBounds) => {
  let db = 'GTExV8'
  if (pathname.includes('HPA/')) {
    db = 'HPA'
  } else if (pathname.includes('HPA_')) {
    db = 'HPA_Proteins'
  }
  return filterednodes.map((node) => ({
    data: {
      ...node.data,label: node.data.label,realColor: setColor(node,db,fcBounds),shape: decideShape(node,pathname)
    }
  }))

weightEdges：

const weightEdges = (filteredEdges,filterednodes) => filteredEdges.map((edge) => ({ 
  data: {
    ...edge.data,tissueNum: Object.values(filterednodes.find((node) => edge.data.source === node.data.id).data.attr.expressions).filter((exp) => exp.expression >= threshold).length || 0 //Todo: Somehow this makes bug,maybe something returns as null??
  }
}))

非常感谢您的帮助！我现在很笨了。

编辑：刚刚发现在生产中不会发生此错误。我第一次部署该应用程序后一切正常，但我仍然不喜欢幕后出现问题。