Unicorns by investor Try 5

<!DOCTYPE html>

<head>
    <meta charset="utf-8">
    <script src="jquery-3.2.1.min.js"></script>
    <style>
        body {
            margin: 0;
            position: fixed;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
        }

.axis .domain {
            display: none;
        }
    </style>
</head>

<body>
    <select id="menu">
  <option value="all">All sectors</option>
  <option value="Aerospace and Defense">Aerospace and Defense</option>
  <option value="Biopharmaceuticals">Biopharmaceuticals</option>
  <option value="Business Support Services">Business Support Services</option>
  <option value="Construction and Civil Engineering">Construction and Civil Engineering</option>
  <option value="Consumer Information Services">Consumer Information Services</option>
  <option value="Electronics and Computer Hardware">Electronics and Computer Hardware</option>
  <option value="Financial Institutions and Services">Financial Institutions and Services</option>
  <option value="Healthcare Services">Healthcare Services</option>
  <option value="Machinery and Industrial Goods">Machinery and Industrial Goods</option>
  <option value="Media and Content">Media and Content</option>
  <option value="Medical Devices and Equipment">Medical Devices and Equipment</option>
  <option value="Medical Software and Information Services">Medical Software and Information Services</option>
  <option value="Personal Goods">Personal Goods</option>
  <option value="Renewable Energy">Renewable Energy</option>
  <option value="Retailers">Retailers</option>
  <option value="Software">Software</option>
  <option value="Travel and Leisure">Travel and Leisure</option>
  <option value="Vehicles and Parts">Vehicles and Parts</option>
  <option value="Wholesale Trade and Shipping">Wholesale Trade and Shipping</option>
 </select>

var keys = ['Aerospace and Defense', 'Biopharmaceuticals', 'Business Support Services', 'Construction and Civil Engineering', 'Consumer Information Services', 'Electronics and Computer Hardware', 'Financial Institutions and Services', 'Healthcare Services', 'Machinery and Industrial Goods', 'Media and Content', 'Medical Devices and Equipment', 'Medical Software and Information Services', 'Personal Goods', 'Renewable Energy', 'Retailers', 'Software', 'Travel and Leisure', 'Vehicles and Parts', 'Wholesale Trade and Shipping'];

d3.csv("unicorns.csv", function(error, data) {
            if (error) return error;

// Nest the data
            unicornsNested = d3.nest()
                .key(function(d) {
                    return d.investorWriteInName
                })
                .key(function(d) {
                    return d.industrySegment
                })
                .entries(data);
            /*
                        var stack = d3.stack()
                            .keys(['Aerospace and Defense', 'Biopharmaceuticals', 'Business Support Services', 'Construction and Civil Engineering', 'Consumer Information Services', 'Electronics and Computer Hardware', 'Financial Institutions and Services', 'Healthcare Services', 'Machinery and Industrial Goods', 'Media and Content', 'Medical Devices and Equipment', 'Medical Software and Information Services', 'Personal Goods', 'Renewable Energy', 'Retailers', 'Software', 'Travel and Leisure', 'Vehicles and Parts', 'Wholesale Trade and Shipping'])
                            .value(function(investorWriteInName, key) {
                                var industrySegment = investorWriteInName.values.find(function(industrySegment) {
                                    return industrySegment.key === key
                                });
                                if (!industrySegment) return 0;
                                return industrySegment.values.length;
                            });
                        var series = stack(unicornsNested);
                        */

var svg = d3.select('svg')
                .attr('width', 960).attr('height', 500);

return array;
            }

update(getSectorData(d3.select("#menu").property("value")));

function update(series) {
                var sectors = svg.selectAll('g')
                    .data(series, function(industrySegment) {
                        return industrySegment
                    });
              
                // Stack the data
                var stack 
              
                // Set scales
                var xScale = d3.scaleBand()
                    .domain(data.map(function(d) {
                      	
                        return d.key;
                    }))
                    .rangeRound([0, width])
                    .paddingInner(0.05)
                    .align(0.1);

var yScale = d3.scaleLinear()
                    .domain([0, 30])
                    .rangeRound([height, 0]);

var colorScale = d3.scaleOrdinal()
                    .domain(keys)
                    .range(["#e6194b", "#3cb44b", "#ffe119", "#0082c8", "#f58231", "#911eb4", "#46f0f0", "#f032e6", "#d2f53c", "#d2f53c", "#fabebe", "#008080", "#e6beff", "#aa6e28", "#fffac8", "#800000", "#aaffc3", "#808000", "#ffd8b1", "#808080", "#FFFFFF", "#000000"]);

// exit
                sectors.exit().remove();

// enter + update
                sectors = sectors.enter().append('g')
                    .classed('sector', true)
                    .merge(sectors);

sectors.attr('fill', function(d) {
                    return colorScale(d.key)
                });

// draw rect
                var investor = sectors.selectAll('rect')
                  .data(function(d) {
                    return d.values;
                })
                ;
              investor.enter()
                    .append("rect")
                  .classed('sector rect', true)
                  .attr('x', function(d) {
                      //console.log(d);
                      return xScale(d.key);
                })
                  .attr('y', function(d) {
                      //console.log(d.length);
                      //return yScale(d.length);
                })
                    .attr('width', xScale.bandwidth())
                    .attr('height', function(d) {
                          //  console.log(d); 
                })
                ;
                
              
/*                sectors.append('rect')
                    .classed('sector rect', true)
                    .attr('x', function(d) {
                        return xScale(d.key)
                    })
                    .attr('y', function(d) {
                      return yScale(d.values.length)
                    })
                    .attr('width', xScale.bandwidth())
                    .attr('height', function(d) {
                        // return yScale(d[0]) - yScale(d[1])
                    });
            investor.select('rect')
                    .attr('x', function(d) {
                        return xScale(d.data.key)
                    })
                    .attr('y', function(investor) {
                        return yScale(investor[1])
                    })
                    .attr('width', xScale.bandwidth())
                    .attr('height', function(d) {
                        return yScale(d[0]) - yScale(d[1])
                    });
                    */
            };

// listener
            d3.select("#menu")
                .on("change", function(d) {
                    update(getSectorData(this.value));
                });

/*
              investor.append('text')
                .text(function(d) { return d.data.key})
                .attr('x', function(investor, i) { return i * 25 })
                .attr('y', function(investor) { return 500 - investor[1] * 100})
                .attr('font-size', '12px'); 
                
         // Sort the bars so they show up tallest to shortest
        //  data.sort(function(a, b) { return b.total - a.total; });
                 */
        });
    </script>
</body>

https://d3js.org/d3.v4.min.js