Graphviz:グラフ全体の属性の指定
Graphvizには、
属性があり、その値を変えることで、
見た目を変えることができる。
ここではグラフ全体の属性を変更する。
d3.jsd3.select("#graph").graphviz()
.fade(false)
.renderDot(
d3.js`
digraph G{
graph [label = "Graph表示テスト", fontsize = 18,fontcolor = red];
graph [bgcolor = "#99FFCC", rankdir = LR];
A -> B;
}
`
graphというキーワードで、中に属性を与えていく
labelはグラフの名前を指定
fontsizeはフォントのサイズを指定
fontcolorはフォントの色を指定
bgcolorは背景色をつける
rankdir を「LR」に
指定すると、グラフを左から右に出力する
vizScript.js const graph = `
digraph G{
graph [label = "Graph表示テスト", fontsize = 18,fontcolor = red];
graph [bgcolor = "#99FFCC", rankdir = LR];
A -> B;
}
`;
const viz = new Viz();
viz.renderSVGElement(graph)
.then(function(element) {
const editor = document.getElementById('editor');
editor.appendChild(element);
});

(実行ボタン)