-
Notifications
You must be signed in to change notification settings - Fork 25
/
Copy pathexample.html
81 lines (70 loc) · 2.02 KB
/
example.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
<!DOCTYPE html>
<html>
<head>
<title>Example for munkres-js</title>
<script src="munkres.js" type="text/javascript"></script>
<script type="text/javascript">/*<![CDATA[*/
var N = 5;
document.addEventListener('DOMContentLoaded', function() {
// set up table
var table = document.getElementById('example-table');
for (var i = 0; i < N; ++i) {
var tr = document.createElement('tr');
for (var j = 0; j < N; ++j) {
var td = document.createElement('td');
td.setAttribute('id', 'tab-' + i + '-' + j);
var input = document.createElement('input');
input.setAttribute('type', 'text');
input.addEventListener('change', update);
td.appendChild(input);
tr.appendChild(td);
}
table.appendChild(tr);
}
update();
});
function update() {
var matrix = [];
for (var i = 0; i < N; ++i) {
matrix[i] = [];
for (var j = 0; j < N; ++j)
matrix[i][j] = parseInt(document.getElementById('tab-' + i + '-' + j).children[0].value) || 0;
}
var m = new Munkres();
var indices = m.compute(matrix);
var totalCost = 0;
for (var i = 0; i < N; ++i)
for (var j = 0; j < N; ++j)
document.getElementById('tab-' + i + '-' + j).className = '';
for (var k = 0; k < indices.length; ++k) {
var i = indices[k][0], j = indices[k][1];
totalCost += matrix[i][j];
document.getElementById('tab-' + i + '-' + j).className = 'active';
}
document.getElementById('total-cost').value = totalCost;
document.getElementById('indices').value = indices.map(function (ind) {
return [ '[', ind.join(','), ']' ].join('');
}).join(', ');
}
/*]]>*/</script>
<style>/*<![CDATA[*/
.active {
background-color: #e77;
}
#indices {
min-width:15em;
}
/*]]>*/</style>
</head>
<body>
<h1>Example usage of <code>munkres-js</code></h1>
<table id="example-table">
</table>
<p>
Total Cost: <input disabled id="total-cost" />
</p>
<p>
Indices: <input disabled id="indices" />
</p>
</body>
</html>