28 lines
785 B
HTML
28 lines
785 B
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>MuJoCo maze visualizer</title>
|
|
</head>
|
|
<body>
|
|
<script>
|
|
var web_socket = new WebSocket('ws://127.0.0.1:{{port}}/ws');
|
|
web_socket.binaryType = "arraybuffer";
|
|
web_socket.onmessage = function(event) {
|
|
var canvas = document.getElementById('canvas');
|
|
var ctx = canvas.getContext('2d');
|
|
var blob = new Blob([event.data], {type:'image/png'});
|
|
var url = URL.createObjectURL(blob);
|
|
var image = new Image();
|
|
image.onload = function() {
|
|
ctx.drawImage(image, 0, 0);
|
|
}
|
|
console.log(url);
|
|
image.src = url;
|
|
}
|
|
</script>
|
|
<div>
|
|
<canvas id="canvas" width="600" height="480"></canvas>
|
|
</div>
|
|
</body>
|
|
</html>
|