@melonproject/orderbook-visualisation
Version:
Simple order book (or depth of market) visualisation with d3
46 lines (37 loc) • 591 B
HTML
<head>
<meta charset="utf-8">
<style>
.bar.bid {
fill: rgba(40, 193, 44, 0.3);
}
.bar.ask {
fill: rgba(255, 0, 0, 0.4);
}
.bar:hover {
fill: #337ab7;
}
.axis--x path {
display: none;
}
.axis--y path {
display: none;
}
svg, html, body {
width: 100%;
height: 100%;
}
</style>
<script src="https://d3js.org/d3.v4.min.js"></script>
</head>
<body>
<svg></svg>
<script src="./script.js"></script>
<script>
const svg = d3.select('svg');
d3.json('data.json', (error, unsortedData) => {
if (error) throw error;
draw(unsortedData, svg);
});
</script>
</body>