Я сделал эту диаграмму с viz.js.Как сделать диаграмму с диаграммой направленности в D3.js?
Код Dot очень прост:
<script type="text/vnd.graphviz" id="myDiagram">
digraph G {
graph [
fontname = "Arial",
fontsize = 18,
label = "Digest Email Flow Chart",
size = "4,4" ];
node [
shape = ellipse,
sides = 4,
distortion = "0.0",
orientation = "0.0",
skew = "0.0",
bgcolor = lightgray,
style = filled,
fontname = "Arial" ];
"Email Notification" [shape=ellipse, shape = "Mrecord" label="Digest Email\n(scheduled)"];
"Sentiment Analysis" [shape=ellipse, shape = "Mrecord" label="Sentiment Analysis\n(triggered)"];
"Google News" [shape=ellipse, shape = "Mrecord" label="Google News\n(scheduled)"];
"Dilbert Daily Comics" [shape=ellipse, shape = "Mrecord" label="Dilbert Daily Comics\n(scheduled)"];
"Time Series Chart" [shape=ellipse, shape = "Mrecord" label="Time Series Chart\n(triggered)"];
"Twitter Stream" [shape=ellipse, shape = "Mrecord" label="Twitter Stream\n(scheduled)"];
"Email Notification" -> "Time Series Chart" [dir = "back"];
"Email Notification" -> "Dilbert Daily Comics" [dir = "back"];
"Time Series Chart" -> "Twitter Stream" [dir = "back"];
"Sentiment Analysis" -> "Google News" [dir = "back"];
"Email Notification" -> "Sentiment Analysis" [dir = "back"];
}
</script>
Но библиотека viz.js 2,3 MB! Это слишком велико.
Можно ли сделать то же самое с чем-то вроде направленного по силе графа в D3.js?
Сила направлена раскладка не то, что вам нужно в этом случае - вы ищете что-то вычисляет, что расположение статически. Ничто из этого не сделает для вас из коробки в D3. –
Благодарим вас за советы. Я решил пойти на jsPlumb. API хорошо документирован, и это хороший бонус, что вы можете использовать предопределенные DIV с фиксированной позицией для узлов. – user1707810