Привет Я пытаюсь преобразовать приложение cytoscape-web 1 в приложение cytoscape-web 2.Как добавить больше узлов в цитоскоп cytoscpae
У меня есть тривиальный пример использования фиксированного набора элементов, созданных как элемент: часть начального вызова в cytoscape web. Затем я хочу добавить больше элементов в существующий граф. Я попытался использовать add и load.
добавить делает ничего, не провал, но и никаких изменений в существующий графа
нагрузка получает и ошибка:
[19:29:52.005] json is undefined @ http://127.0.0.1:8020/LifeScience/jquery.cytoscapeweb.all.js:1918
код довольно тривиально воспроизвести
<!DOCTYPE html>
<html>
<head>
<title>Test Cyto</title>
<style>
* {
margin: 0;
padding: 0;
font-family: Helvetica, Arial, Verdana, sans-serif;
}
html, body {
height: 100%;
width: 100%;
padding: 0;
margin: 0;
}
body {
line-height: 1.5;
color: #000000;
font-size: 14px;
}
/* The Cytoscape Web container must have its dimensions set. */
#cy {
width: 100%;
height: 50%;
}
#note {
width: 100%;
height: 25%;
background-color: #f0f0f0;
overflow: auto;
}
p {
padding: 0 0.5em;
margin: 0;
}
p:first-child {
padding-top: 0.5em;
}
</style>
</head>
<body>
<p id="demo">
Test Demo
</p>
<button id="runQ2">
Do display
</button>
<div>
<p>
Graph Image
</p>
</div>
<div id="cy" style="width:1200px;height:500px;">
</div>
<div id="note">
</div>
</body>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js">
</script>
<script type="text/javascript" src="jquery.cytoscapeweb.all.js">
</script>
<script type="text/javascript">
$(document).ready(function() {
$("button#runQ2").click(function() {
draw_graph();
});
});
function draw_graph() {
$("#cy").cytoscapeweb({
elements : {
nodes : [{
data : {
id : "a"
}
}, {
data : {
id : "b"
}
}, {
data : {
id : "c"
}
}],
edges : [{
data : {
id : "ab",
source : "a",
target : "b"
}
}, {
data : {
id : "bc",
source : "b",
target : "c"
}
}, {
data : {
id : "ca",
source : "c",
target : "a"
}
}, {
data : {
id : "ac",
source : "a",
target : "c"
}
}]
},
ready : function(cth) {
//cth.add({ group: "nodes", data: { id: "n0" } });
cth.load([{
data : {
id : "n1"
},
group : "nodes"
}, {
data : {
id : "n2"
},
group : "nodes"
}, {
data : {
id : "e1",
source : "n1",
target : "n2"
},
group : "edges"
}]);
alert("in ready function" + graphArray);
}
})
}
</script>
</html>
Would действительно ценят любые мнения о том, что я делаю неправильно, или, возможно, мой пример исправлен.
Благодаря Большая Оценил
Так что я должен специально добавить позицию для каждого элемента для операции cy.load, иначе я получу ошибку? – user1438710
Да для узлов с 'cy.add()', в противном случае, где бы размещались узлы? Для 'cy.load()', макет может использоваться для предоставления позиций узлов. – maxkfranz