Question

我已经尝试了一段时间，但是我只显示了一个空的div，我不知道为什么。

         var elementsStr = "[";
         for(var i = 0;i < elements.length; i++) {
             var toConCat = "{data:{id:\"node-" + i + "\"}},";
             elementsStr = elementsStr.concat(toConCat);
             if(isEven(i) && i != 0) {
                 console.log(i);
                 toConCat = "{data: {id:\"edge-" + i/2 + "\",source:\"node-" + i-1 + "\",target:\"node-" + i + "\"}},";
                 elementsStr = elementsStr.concat(toConCat);
             }

         }
         var toConCat = "{data:{id:\"edge-" + (elements.length/2) + "\",source:\"node-" + (elements.length-2) + "\",target:\"node-" + (elements.length-1) + "\"}}";
         elementsStr = elementsStr.concat(toConCat);
         elementsStr = elementsStr.concat("]");
         console.log(elementsStr);
        responseDiv.innerHTML = "";
         var cy = cytoscape({
             container: responseDiv,

             style: [
                {
                    selector: 'node',
                    style: {
                        'background-color': '#666',
                        'label': 'data(id)'
                    }   
                },
                {
                    selector: 'edge',
                    style: {
                        'width': 3,
                        'line-color': '#ccc',
                        'target-arrow-color': '#ccc',
                        'target-arrow-shape': 'triangle'
                    }
                }
            ],
            layout: {
                name: 'grid',
                rows: 1
            }

         });
        var eles = cy.add(elementsStr);
        console.log(eles);
     }
 };

elementsStr是

[{data：{id：“ node-0”}}，{data：{id：“ node-1”}}，{data：{id：“ edge-1”，source：“ node-0 “，target：” node-1“}}]

最后，但什么也没显示，我在做什么错了？

Answer 1

这种方法非常复杂，只需坚持使用cy.add()上的文档，并尝试将元素构建为不像字符串一样，而是像json文件那样，还可以对id使用单引号：

-> Game<W>

在您的html文件中，只需添加具有正确ID的div，之后不要触摸它，我真的不知道您为什么添加.innerHtml =“”，那不是必须的：）

cytoscape.js如何在div中显示节点？

1 个答案: