D3 Examples - d3 | ratio bar chart

xxxxxxxxxx
 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <style>
        html, body { height: 100%; }
        body { 
            font-family: Consolas, monaco, monospace; 
            background: #dddddd;
            width: 900px;
            margin: 0 auto;
        }
        section {
            padding-top: 30vh;
        }
        h3 {
            margin: 0;
            color: #fe9f97;
        }
    </style>
</head>
<body>
    <section class="stats">
        <h3>Ratio1 : Ratio2</h3>
        <svg width="900" height="100">
            <g id="vis"></g>
        </svg>
    </section>
    
​
<script src="https://d3js.org/d3.v4.min.js"></script>
<!-- d3 code -->
<script src=".script-compiled.js" charset="utf-8"></script>
<!-- render code -->
<script>
    // render an update
    render([57, 43])
    d3.interval(function() {
        let v1 = Math.floor(d3.randomUniform(5, 100)())
        let v2 = 100 - v1
        return render([v1, v2]);
    }, 2000);
</script>
​
</body>
</html>
​
​
​
    