index.html
<!DOCTYPE html>
<head>
<meta charset="utf-8">
</head>
<style>
.viz-biPartite-subBar{
shape-rendering:crispEdges;
}
.viz-biPartite-mainBar{
fill-opacity: 0;
stroke-width: 0.5px;
stroke: rgb(0, 0, 0);
stroke-opacity: 0;
}
</style>
<body>
<svg width="960" height="700">
<g transform="translate(250,50)"></g>
</svg>
<script src="https://d3js.org/d3.v4.min.js"></script>
<script src="//vizjs.org/viz.v1.3.0.min.js"></script>
<script>
var bP = viz.biPartite()
.data(randomData())
d3.select("g").call(bP);
setInterval(update, 3000)
function update(){
d3.select("g").call(bP.data(randomData()))
}
function randomData(){
return d3.range(15).map(function(d){
return [
"ABCDEFGHIJ".charAt(Math.floor(10*Math.random()))
,"abcdefghij".charAt(Math.floor(10*Math.random()))
,100*Math.random()
]
})
}
d3.select(self.frameElement).style("height", "700px");
</script>