javascript - Cytoscape.js 标签点击/单击上的节点/边缘标签编辑器

标签 javascript jquery html cytoscape.js

有没有可以提供节点/边标签编辑功能的库?我已经搜索遍了 npm 和 github,但没有找到任何有用的东西。接近我需要的库是“zngduong/cytoscape.js-edit-content”,但它无法正常工作。我实现了上下文菜单,我创建的选项之一是编辑元素的标签。我在元素位置上生成输入标记时遇到问题。下面是我当前使用 this 的代码图书馆。

cy.cxtmenu({ selector: 'node, edge', commands: [ { content: '<span class="glyphicon glyphicon-pencil"></span>', select: function(ele) { var $input = '<input type="text" value="'+ ele.data('name') +'" size="20" style="z-index: 10000;"/>'; $('div#cy').append($input); } }, { content: '<span class="glyphicon glyphicon-remove"></span>', select: function(ele){ } }, { content: '<span class="glyphicon glyphicon-trash"></span>', select: function(ele){ ele.remove(); } } ] });

最佳答案

(1) 您无法将任何内容附加到 Cytoscape div。

(2) 您应该将标签文本存储在元素的 data 中.

(3) 您应该使用 stylesheetmap标签的数据字段(例如 label: data(label))。

(4) 通过(3)和(4),设置node.data('label', newLabel)更改标签文本。如何为此设计 UI 由您决定。例如,您可以在 qtip 中显示文本框。 .

关于javascript - Cytoscape.js 标签点击/单击上的节点/边缘标签编辑器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42737609/

相关文章:

html - 无法在 ASP.NET 中选中服务器控件复选框?

html - 在 flex 容器中,将子级 1 放置在顶部,将 2 和 3 堆叠在底部

jquery - 在响应式设计中用于宽布局的 Bootstrap 网格

javascript - 我希望我的 php 表单在同一页面但不同的选项卡上提交数据和重定向

jquery - 仅为一组匹配项中的第一个 div 添加属性

html - 在 Bootstrap 中将带有图像和 float 文本的框居中

javascript - React 不会在 Electron 应用程序中呈现

javascript - 数据角色 ="page"打不开,为什么? (使用 PHP 和 JQuery 自动生成链接)

javascript - 在使用 jQuery 提交表单之前更改输入值

javascript - JQuery 验证插件 - 无法验证类