Problems adding interactivity in d3.js Maps [dropdown menu]

Question

I want to produce maps as an output for quantitative analysis. I Have multiple variables to add to my map, and, I dont want to have n-output, in this case, n-maps. You can have a look of the simplified dataframe (colomns are years, but it could also be a set of different variables) : Simple data frame

It seems to me d3.js was a good idea, because it can display 1 map with a dropdown menu, and the user can select the variable.

I have produced a map with d3.js before, and I use it as template. I have made it quiet basic and simple (really small dataset, etc), you can found it here in this repo GitHub : https://github.com/Mathiaslauber/Without_interactivity

Here is the Github repo with my first try of implementing interactivity https://github.com/Mathiaslauber/Interactivity_first_try Or if you prefer, I have just made a FiddleJS to make things easier : Fiddle JS Interacivity first try

It was part of a bigger project, you can have a look if you want. GithubPages

So far, I have made deseperates modifications that remain unsucessful, because examples are usually very diffrent in many aspects, so hardly reproductible for me. I'm quiet new AND bad with function implemantation in JavaScript. The two following links are examples that did not seem that complicated and inspired me :

[A] http://tietyk.github.io/D3/Prototype/part9-9.html

[B] http://bl.ocks.org/rgdonohue/6a30b731230f6e242a54

I have interesting bunch of codes at lines 196-226 below, also in the js file. Problem is I'm missing clues to make it work.

First one used come from source [A] and it's based on an hover effect. Second, from source [B] and used button Both refered to json properties, and I use Csv. The overall format and function implementation is different.

I could spend like a month trying to figure this out myself. So if you have any hints, It would help me a lot : Things i should check, that are missing in my code, etc.

 // 2 bunch of codes that were used in order to add interactivity     

    /*        
       color();
               
       d3.selectAll("input").on("change", function() {
           attribute = this.id;
           color();
       });

       function color(){
           
           d3.selectAll('circle')
               .transition()
               .attr( "fill", function(d){
                   return (mycolor.domain())}  
                           )
       }
       
       */
    /*  
        var timeline = d3.selectAll(".time-series")
        .on("mouseover", function(d, i) {
          year = i;
          svg.selectAll("path")
            .attr("class", quantify);
          d3.selectAll(".time-series")
            .attr("class", "time-series");
          this.className = "time-series active";
        });
    */