2

我的网络应用程序使用 mxClient.js。我的 SVG 对象是使用其 API 创建的,其形式如下:

mxGraph.prototype.insertVertex = function(parent,
                                          id,
                                          value,
                                          x,
                                          y,
                                          width,
                                          height,
                                          style,
                                          relative);

但是,当我在 ID 参数中使用字符串初始化我的对象时,当我在 Chrome 上检查元素时它不会出现。这个问题有什么明显的解决方法吗?

到目前为止,我尝试使用 jQuery 和 Javascript 调用 svg,但无济于事。

我的代码库:

function main(container)
        {
            if (!mxClient.isBrowserSupported())
            {
                mxUtils.error('Browser is not supported!', 200, false);
            }
            else
            {
                mxEvent.disableContextMenu(container);

            var graph = new mxGraph(container);

            new mxRubberband(graph);

            var parent = graph.getDefaultParent();

            graph.getModel().beginUpdate();
            try
            {

                var v1 = graph.insertVertex(parent, "_IWID_1021", 'asdf', 31, 240, 100, 30),
                    v2 = graph.insertVertex(parent, "_IWID_2349", 'Oasdf', 160, 320, 100, 30),
                    v3 = graph.insertVertex(parent, "_IWID_3452", 'asdf', 160, 160, 100, 30),
                    v4 = graph.insertVertex(parent, "_IWID_4561", 'asdfasdf', 320, 320, 100, 30),
                    v5 = graph.insertVertex(parent, "_IWID_5670", 'asdff', 320, 160, 100, 30),
                    v6 = graph.insertVertex(parent, "_IWID_6780", 'qwerqwer', 448, 240, 100, 30),
                    v7 = graph.insertVertex(parent, "_IWID_3456", 'zxcvxzcv', 597, 240, 100, 30),
                    v8 = graph.insertVertex(parent, "_IWID_3498", 'asdfasdf', 714.6, 240, 100, 30),
                    v9 = graph.insertVertex(parent, "_IWID_1643", 'asdfasdf', 822, 240, 100, 30),
                    v10 = graph.insertVertex(parent, "_IWID_5731", 'asdfasdf', 993, 240, 100, 30),
                    v11 = graph.insertVertex(parent, "_IWID_0942", 'asdfasdf', 1113, 240, 100, 30),
                    v12 = graph.insertVertex(parent, "_IWID_2875", 'asdfasdf', 1221, 240, 100, 30),
                    v13 = graph.insertVertex(parent, "_IWID_9397", 'asdfasdfasd', 1333, 240, 100, 30),
                    v14 = graph.insertVertex(parent, "_IWID_111", 'asdfasdf', 1486, 240, 100, 30);

                var c1 = graph.insertEdge(parent, null, '', v1, v2),
                    c2 = graph.insertEdge(parent, null, '', v1, v3),
                    c3 = graph.insertEdge(parent, null, '', v2, v4),
                    c4 = graph.insertEdge(parent, null, '', v3, v5),
                    c5 = graph.insertEdge(parent, null, '', v4, v6),
                    c6 = graph.insertEdge(parent, null, '', v5, v6),
                    c7 = graph.insertEdge(parent, null, '', v6, v7),
                    c8 = graph.insertEdge(parent, null, '', v7, v8),
                    c9 = graph.insertEdge(parent, null, '', v8, v9),
                    c10 = graph.insertEdge(parent, null, '', v9, v10),
                    c11 = graph.insertEdge(parent, null, '', v10, v11),
                    c12 = graph.insertEdge(parent, null, '', v11, v12),
                    c13 = graph.insertEdge(parent, null, '', v12, v13),
                    c14 = graph.insertEdge(parent, null, '', v13, v14);
            }
            finally
            {
                graph.getModel().endUpdate();
            }
        }
    };
4

1 回答 1

2

你看到的是正确的。

几个星期以来,我一直在努力解决这个问题。

生成的 SVG 中没有一个包含我可以看到的任何合理的基于 HTML 的 ID 属性,这意味着没有生成的 ID 可以执行 jQuery 或任何其他操作。

我们最终做的是保留我们创建的顶点数组,然后我们可以稍后再参考它们。

在我们的例子中,我们想要更改单元格对象中的图像,因此我们在数组中保留了一个引用,并在 MxGraph 中收到点击事件时将其匹配,然后使用它们的 API 更改图像。

我不知道这是否有任何帮助,但是...

正如我刚刚在另一个类似问题中指出的那样,在您的 MxGraph 事件处理程序中,如果您执行以下操作

var mouseEvent = event.getProperty('event');
var selectedCell = event.getProperty('cell');

其中 event 作为参数传递给事件处理程序。

然后,您可以使用单击的元素的 HTML

selectedCell.currentTarget.innerHTML

一旦你有了内部 HTML,理论上你就可以使用常规的 JS/HTML 代码来添加 ID 的属性或任何你需要的东西。

但是,如果您之后的所有内容都是一个 ID,那么您在使用“insertVertex”创建单元格时提供的 ID 在 selectedCell 对象中作为字符串可用。

于 2016-02-04T16:49:52.723 回答