根据边缘数据和目标数据选择边缘

作者: 谦逊的毛巾
发布时间: 2024-05-07 07:12:50 (7天前)
转自：

4 条回复

0#
回复此人
夏花 | 2019-08-31 10-32

<div class =“post-text”itemprop =“text”> <P> 如果选择器不够，那么您可以（1）建议一个新功能来增强边缘 <code> -> </code> 选择器，甚至可能为它制作PR或（2）在style属性上使用函数。 </p> <P> 例如。对于（2）： </p> <pre> <code> { selector: 'edge', style: { display: edgeIsDisplayed } } </code> </pre> <P> 功能可以是任何东西，比如 <code> edgeIsDisplayed(edge) => edge.data('foo') === 'bar' && edge.target().hasClass('baz') </code> </p> <P> 看到 <a href="http://js.cytoscape.org/#style/mappers" rel="nofollow noreferrer"> http://js.cytoscape.org/#style/mappers </A> </p> </DIV>

编辑
1#
回复此人
生如夏花 | 2019-08-31 10-32

<div class =“post-text”itemprop =“text”> <P> 您可以提供过滤方法的功能： </p> <pre> <code> cy.edges().filter(function(ele) { return ele.data('type') == 'blocker' && ele.target().data('status') == 'complete'; }) </code> </pre> </DIV>

编辑
2#
回复此人
部落用户 | 2019-08-31 10-32

<div class =“post-text”itemprop =“text”> <P> 没有选择器可以提供帮助。 </p> <HR /> <P> 但是，可以避免在数据更改时手动更新两个元素。 </p> <P> 每次匹配元素的数据更改时，都会调用样式表值函数。在这些功能中，每次更新节点的数据时都可以更新传入边缘的数据，从而使两者的数据自动保持同步。 </p> <pre> <code> var push_status = function(node) { node.incomers('edge').forEach( edge => edge.data('target_status', node.data('status')) ); node.outgoers('edge').forEach( edge => edge.data('source_status', node.data('status')) ); }; cytoscape({ ... style: [ ... { selector: 'node', style: { label: node => { push_status(node); return node.data('id'); }, }, }, { selector: 'edge[type="blocker"][target_status="complete"]', style: { display: 'none', }, }, ... ], ... }) </code> </pre> <P> 这有资格作为黑客攻击，但它完美无缺。更新节点的数据会更新边缘的数据，从而导致应用或不应用样式。 </p> <HR /> <P> 警惕创建无限循环！特别是，修改节点父节点的数据将触发节点样式的计算。通过更换可以避免这个问题 </p> <pre> <code> ele.data('key', val) </code> </pre> <P> 同 </p> <pre> <code> // Making changes to a element's data triggers a style recalculation. // This avoids needlessly triggering the style recalculation. var set_data = function(node, key, new_val) { let old_val = node.data(key); if (new_val != old_val) node.data(key, new_val); }; set_data(ele, 'key', val) </code> </pre> </DIV>

编辑

登录后才能参与评论