You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
63 lines
1.5 KiB
63 lines
1.5 KiB
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>D3</title>
|
|
|
|
<script type='text/javascript' src='vendor/d3/d3.min.js'></script>
|
|
<style type='text/css'>
|
|
html, body {
|
|
margin:0;
|
|
}
|
|
|
|
.quicksort-random {
|
|
display:block;
|
|
height:60px;
|
|
margin:0 auto;
|
|
width:1198px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<script type='text/javascript' src='js/visualizer.js'></script>
|
|
<script type='text/javascript' src='js/sorter.js'></script>
|
|
|
|
<script type='text/javascript'>
|
|
var data = [];
|
|
|
|
// TODO namespace this
|
|
(function populate() {
|
|
var len = 10;
|
|
var r, g, b;
|
|
for (var i = 0; i < len; i++) {
|
|
data.push({
|
|
x: 0,
|
|
y: 20,
|
|
|
|
w: 10,
|
|
h: 50,
|
|
|
|
val: Math.floor(i * 255 / len),
|
|
|
|
fill: `rgb(0, 0, ${Math.floor(i * 255 / len)})`,
|
|
fade: 'rgb(220, 220, 220)',
|
|
});
|
|
};
|
|
}());
|
|
|
|
var S = new Sorter();
|
|
S.shuffle(data);
|
|
|
|
var V = new Visualizer();
|
|
V.init(data);
|
|
V.addMarker('quicksort-left-marker');
|
|
V.moveMarker('quicksort-left-marker', 2);
|
|
|
|
var temp = Object.create(data);
|
|
S.quicksort(temp, 0, data.length - 1);
|
|
temp = null;
|
|
|
|
// setTimeout(V.followInstruction.bind(V, S.instructions, 0), 500);
|
|
</script>
|
|
</body>
|
|
</html>
|
|
|