Accepted answer

I found the solution. I had to make two changes. In function d3data, I was updating the same array again and again, so the data was not getting updated correctly and before calling d3(), I had to remove existing graph.

function d3Data(){
    data_sorted = data.sort(function(x,y){
            return d3.ascending(+x.rank, +y.rank);
        });  // update array and put it in another variable
    var size = document.getElementById("range").value;
    data_sliced = data_sorted.slice(0,size);'.chart').html("");  //this to remove existing graph


Each an every time depend upon the data SVG is newly created. So you have to remove the SVG Before Creation

    //"Your Id Name or Your Class Name").select("svg").remove();

In Your Code, I changed follow as'.chart').select("svg").remove();
var svg ='.chart')

Related Query

More Query from same tag