score:0

If you're wanting to animate the divs like bar graphs, here is a makeshift solution:

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <style>
        div {
            width: 0%;
            min-height: 10px;
        }
    </style>
</head>
<body>
<div id="one"></div>
<div id="two"></div>

<button onClick="update()">update</button>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/5.7.0/d3.min.js"></script>
<script>
var arr1=d3.range(0,1000), arr2=d3.range(0,10000),
one=d3.select("#one"), two=d3.select("#two");

var duration=5000; // 5 seconds

function update() {
    one.style("transition", "width " + (duration/1000) + "s")
        .style("background", "blue")
        .style("width", (arr1.pop()/9) + "px");
    two.style("transition", "width " + (duration/1000) + "s")
        .style("background", "blue")
        .style("width", (arr2.pop()/9) + "px");
}

// TBD:
// Synchronously Update "one" and "two" continously with the individual values of 
// arr1 and arr2 respectively for a total duration of "duration"
// 
// Obviously "two" should be updated faster than "one" during the duration
</script>
</body>
</html>