- 授权协议: MIT
- 开发语言: JavaScript HTML/CSS
- 操作系统: 跨平台
- 软件首页: http://maurizzzio.github.io/greuler/
软件介绍
greuler 是图形理论可视化工具，基于 D3 和 WebCola。greuler 允许使用一个简单的 API 创建和操作图形。
使用
引入资源：
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.js"></script> <script src="http://marvl.infotech.monash.edu/webcola/cola.v3.min.js"></script>
安装：
bower install greuler
插入到项目中：
<script src="bower_components/greuler/dist/greuler.js"></script>
简单示例
欧拉轨迹
'use strict';
window.d3.json('scripts/examples/data/eulerian-graph.json', function (error, data) {
var instance = greuler({
target: '#eulerian-trail',
width: 600,
height: 600,
animationTime: 500,
data: data
}).update();
window.examples['eulerian-trail'] = function () {
var greuler = window.greuler;
var player = new greuler.player.Generator(instance);
player.run(function *algorithm(instance) {
var stack = [];
var trail = [];
function eulerianTrail(u) {
stack.push(u);
var edges = instance.graph.getIncidentEdges({ id: u });
for (var i = 0; i < edges.length; i += 1) {
var e = edges[i];
var next = e.target.id === u ? e.source.id : e.target.id;
if (e.used) { continue; }
e.used = true;
eulerianTrail(next);
}
trail.push(stack.pop());
}
eulerianTrail(0);
// node traversal is given by trail
for (var i = 0; i < trail.length; i += 1) {
yield function () {
instance.selector.traverseAllEdgesBetween(
{ source: trail[i], target: trail[i + 1] }
);
};
}
});
};
});广度优先搜索：
'use strict';
(function () {
var greuler = window.greuler;
var instance = greuler({
target: '#bfs',
width: 600,
height: 600,
animationTime: 500,
data: greuler.Graph.random({ connected: true })
}).update();
window.examples.bfs = function () {
var player = new greuler.player.Generator(instance);
player.run(function *algorithm(instance) {
function *bfs(source) {
// queue
var distance = [];
var q = [];
var parent = [];
function highlight(id, visit) {
return function () {
var node = instance.graph.getNode({ id: id });
node.topRightLabel = distance[id];
instance.selector.highlightNode({ id: id });
if (visit) {
instance.selector.getNode({ id: id })
.transition()
.attr('fill', 'black');
}
instance.update({skipLayout: true});
};
}
distance[source] = 0;
q.push(source);
while (q.length) {
var top = q.shift();
var adjacent = instance.graph.getAdjacentNodes({ id: top });
yield highlight(top, true);
for (var i = 0; i < adjacent.length; i += 1) {
var next = adjacent[i].id;
if (next === parent[top]) { continue; }
if (typeof distance[next] === 'undefined') {
distance[next] = distance[top] + 1;
parent[next] = top;
q.push(next);
yield function () {
instance.selector.traverseAllEdgesBetween(
{ source: top, target: next }
);
};
yield highlight(next);
} else {
yield function () {
instance.selector.traverseAllEdgesBetween(
{ source: top, target: next },
{ keepStroke: false }
)
.transition()
.attr('opacity', 0.3);
};
}
}
}
}
yield *bfs(0);
});
};
})();
