Permalink
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
98 lines (88 sloc) 2.55 KB
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0, shrink-to-fit=no">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<title>Embedding.js websocket data example</title>
<script type="text/javascript" src="js/embedding.js"></script>
<style>
/* Ensures that the canvas fills the entire window, and that there are no scrollbars */
body {
width: 100%;
height: 100%;
background-color: #000;
color: #fff;
margin: 0px;
padding: 0;
overflow: hidden;
}
</style>
</head>
<body>
<script>
const { scene, camera, manager, effect, cameraControls } = EMBED.initScene();
var dataset, embedding;
var THREE = EMBED.THREE;
var N = 1;
var c = 0;
var light = new THREE.HemisphereLight( 0xffffbb, 0x080820, 1 );
scene.add( light );
dataset = new EMBED.WebSocketDataset(
// see https://blockchain.info/api/api_websocket
"wss://ws.blockchain.info/inv",
{
init: (s) => s.send('{"op":"unconfirmed_sub"}'),
onmessage: function(m) {
let sum_in = m.x.inputs.map((x) => x.prev_out.value).reduce((a,b) => a+b, 0);
let sum_out = m.x.out.map((x) => x.value).reduce((a,b) => a+b, 0);
return {
_id: m.x.hash,
vin_sz: m.x.vin_sz,
vout_sz: m.x.vout_sz,
size: m.x.size,
time: m.x.time,
description: m.x.hash
}
}
}
);
embedding = new EMBED.PathEmbedding(scene, dataset,
[[-10, 1, 0],
[-6, 0, 2],
[-4, -1, -5],
[0, -1, -8],
[4, -1, -5],
[6, 0, 2 ],
[10, 1, 0]],
{
meshType: 'ellipsoid',
sizeX: (d) => d.get("size") / 500,
sizeY: (d) => d.get("vin_sz") / 5,
sizeZ: (d) => d.get("vout_sz") / 5,
description: (d) => d.get("description"),
pathTime: 5000
});
EMBED.register(embedding);
let status = new EMBED.ConsoleEmbedding( scene, null, {
width: 4.0, position: {z: -10}, font: "Bold 24px Arial" } );
// These input callbacks need to be cleaned up
EMBED.input.on('rayover', function(mesh) {
if (mesh) {
status.setText(mesh.userData.description);
mesh.children[0].material.color.setHex(0xffffff)
}
});
EMBED.input.on('rayout', function(mesh) {
if (mesh) {
status.setText('');
mesh.children[0].material.color.setHex(0xff00ff)
}
});
EMBED.register(status);
EMBED.startAnimation();
</script>
</body>
</html>