#c# #jquery #json #cytoscape.js
#c# #jquery #json #cytoscape.js
Вопрос:
Я разрабатываю график cytoscape на C # asp.net и у меня очень странная проблема. Я использую приведенные ниже данные JSON:
[
{
"data": {
"id": "15",
"name": "Low rainfall",
"href": "/Test?id1=15",
"colour": "#ff9933",
"shape": "ellipse"
}
},
{
"data": {
"id": "16",
"name": "Climate change",
"href": "/Test?id1=16",
"colour": "#ff9933",
"shape": "ellipse"
}
},
{
"data": {
"id": "17",
"name": "Drought",
"href": "/Test?id1==17",
"colour": "#ff9933",
"shape": "ellipse"
}
},
{
"data": {
"id": "18",
"name": "human deaths",
"href": "/Test?id1=18",
"colour": "#ff9933",
"shape": "ellipse"
}
},
{
"data": {
"id": "19",
"name": "Global warming",
"href": "/Test?id1=19",
"colour": "#ff9933",
"shape": "ellipse"
}
},
{
"data": {
"source": "19",
"target": "16",
"label": "2"
}
},
{
"data": {
"source": "16",
"target": "17",
"label": "14"
}
},
{
"data": {
"source": "15",
"target": "16",
"label": "2"
}
},
{
"data": {
"source": "16",
"target": "15",
"label": "2"
}
},
{
"data": {
"source": "15",
"target": "17",
"label": "2"
}
},
{
"data": {
"source": "18",
"target": "17",
"label": "31"
}
}
]
Это приводит к следующей ошибке:
Uncaught (in promise) TypeError: l is undefined
q https://localhost:44391/js/cytoscape.min.js:32
j https://localhost:44391/js/cytoscape.min.js:32
run https://localhost:44391/js/cytoscape.min.js:32
a https://localhost:44391/js/cytoscape.min.js:32
a https://localhost:44391/js/cytoscape.min.js:32
promise callback*$a/< https://localhost:44391/js/cytoscape.min.js:32
$a https://localhost:44391/js/cytoscape.min.js:32
hl https://localhost:44391/js/cytoscape.min.js:32
<anonymous> https://localhost:44391/graph:135
EventListener.handleEvent* https://localhost:44391/graph:133
cytoscape.min.js:32:66425
q https://localhost:44391/js/cytoscape.min.js:32
j https://localhost:44391/js/cytoscape.min.js:32
comparefn self-hosted:203
InsertionSort self-hosted:4426
MergeSort self-hosted:4478
sort self-hosted:191
run https://localhost:44391/js/cytoscape.min.js:32
a https://localhost:44391/js/cytoscape.min.js:32
a https://localhost:44391/js/cytoscape.min.js:32
(Async: promise callback)
a https://localhost:44391/js/cytoscape.min.js:32
$a https://localhost:44391/js/cytoscape.min.js:32
hl https://localhost:44391/js/cytoscape.min.js:32
<anonymous> https://localhost:44391/graph:135
(Async: EventListener.handleEvent)
<anonymous> https://localhost:44391/graph:133
строка 133 на графике равна:
window.addEventListener('DOMContentLoaded', function(){
строка 135 является:
var cy = cytoscape({
container: document.getElementById('cy'), // line 136
Если я удалю строку
{
"data": {
"source": "15",
"target": "17",
"label": "2"
}
}
Все работает нормально.
Это может быть как-то связано с тем фактом, что 15 переходит в 16, а 16 переходит в 17, поэтому 15 не может перейти в 17 ?! Хотя я пробовал аналогичную схему в более ранних тестированиях без проблем. Я использую cytoscape.min.js и cytoscape-cxtmenu.js , а приложение представляет собой веб-сайт. Для макета, который я использую, breadthfirst а корень равен # 15; если я изменю корень на 16, он по-прежнему выдает ошибки, но с меньшим количеством ссылок:
Uncaught (in promise) TypeError: l is undefined
q https://localhost:44391/js/cytoscape.min.js:32
j https://localhost:44391/js/cytoscape.min.js:32
run https://localhost:44391/js/cytoscape.min.js:32
a https://localhost:44391/js/cytoscape.min.js:32
a https://localhost:44391/js/cytoscape.min.js:32
Все очень странно.
Комментарии:
1. Я только что импортировал данные в старую настройку html, поэтому я могу возиться с числами и обнаружил, что если я задаю корни как # 17 или # 18, это работает, но не если я задаю корни как # 15, # 16 или # 19. Значит, это похоже на проблему с корнями?
2. Я решил эту проблему, используя макет cola. — cytoscape.org/cytoscape.js-cola Я не мог разобраться в правилах для widthfirst
3. Я думаю, что макет в ширину лучше всего подходит для деревьев и форрестов, а не для обычных графиков. У вас есть узлы с циклическими отношениями, так что, возможно, в этом проблема? Однако Cola кажется хорошим компромиссом.
4. Я думаю, вы правы @StephanT — хотя мой график является иерархическим, он определенно не является деревом, поскольку у него может быть много «корней». Забавно, что «случайный» макет тоже довольно хорош — хотя иногда и слишком случайный 🙂 Теперь у меня есть
layout: { name: 'cola', nodeDimensionsIncludeLabels: true, randomize: true, padding: 5 }, который работает довольно хорошо. Пользователи могут повторно рандомизировать макет cola.5. @StephanT. — Спасибо — все еще привыкаю к особенностям правил разметки Stackoverflow 😉 Я вижу, что упоминание имени тоже не сработало.