title: How to subset a dataset using d3.js according to change in dropdown
body: <p>I have a data set <a href="https://gist.githubusercontent.com/heenaI/cbbc5c5f49994f174376/raw/82cd19eff7db367193cf8ce00144a40ea8d140ac/data.json" rel="nofollow">Can be viewed here</a> and a dropdown menu with country names (key attribute in the dataset). Now if I select one country from the drop down menu how can I subset the dataset upon the change to present only values of the selected country. The code that I have right now only outputs [object Object]</p>
  
  <p><a href="http://jsfiddle.net/j9w1wa9j/7/" rel="nofollow"><strong>fiddle here</strong></a></p>
  
  <p>code:</p>
  
  <pre><code>function checkIt(data) {
  
      var countriesByName = d3.nest()
          .key(function (d) {
          return d.Country_Names;
      })
          .entries(data);
  // creating dropdown    
      var data = JSON.stringify(countriesByName)
      var data = JSON.parse(data);
      var dropDown = d3.select("#dropdown_container")
                     .append("select")
                     .attr("class", "selection")
                      .attr("name", "country-list");
  
      var options = dropDown.selectAll("option")
                    .data(data)
                    .enter()
                    .append("option");
           options.text(function (d) { return d.key; })
         .attr("value", function (d) { return d.key; });
  
  // detecting change in drop down
  var changePie = function() {
      //get the data value and index from the event
      var selectedValue = d3.event.target.value;
      var selectedIndex = d3.event.target.selectedIndex;
  
      //alert("You selected the option at index " + selectedIndex + ", with value attribute "+ selectedValue);
  
      var selectedDOMElement =
          d3.event.target.children[selectedIndex];
      var selection = d3.select(selectedDOMElement);
  
  // subsetting data    
  var uniqueData = d3.nest()
      .key(function(selection) { return selection.key; })
      .entries(data)
      .map(function(entry) { return entry.values[0]; });
  
  //Output selected country with all its values
      console.log ("your selection is" + uniqueData)
  
      //making Pie 
  function makePie() {
  return ("you have made a Pie for" + " " + selection.text())
  };
      alert(makePie());
  };   
  
  d3.select("#dropdown_container").on("change", changePie);           
  };
  
  
  
  d3.json("https://gist.githubusercontent.com/heenaI/cbbc5c5f49994f174376/raw/82cd19eff7db367193cf8ce00144a40ea8d140ac/data.json", checkIt);
  </code></pre>