.on('mouseover', (data, i) => tooltip(data, i));
console.log(y01z[datapoint[2]].indexOf(datapoint)+1)
function(){return tooltip.style("top", (event.pageY-20)+"px").style("left",(event.pageX+40)+"px");}
index == layoutData.selectedIndex ? "black":"none"


  
  elementWidths = seriesButtons.selectAll("g").nodes().map(d => d.getBBox().width);
  seriesButtons.selectAll("g")
  	.data(positionButtons(elementWidths, 30, "right", width-seriesPosX))
  	.join("g")
  		.attr("transform", d => `translate(${d[0]},${d[1]})`);
 
 
 
 
  const testButton = svg.append("g")
  	.attr("transform", "translate(400,15)");
  
  testButton.selectAll("g")
  	.data([["blabla", "black"], ["trala", "red"]])
  	.call(test);
    
    
    
    
  elementWidths = layoutButtons.selectAll("g").nodes().map(d => d.getBBox().width);
  layoutData.positions = positionButtons(elementWidths, 30, "left", 300);
  layoutButtons.selectAll("g")
  	.data(layoutData.positions)
  	.join("g")
  		.on("click", (event, data) => setRadio(data, layoutButtons, layoutData))
  		.attr("transform", d => `translate(${d[0]},${d[1]})`);
      
      


  		.on("mouseover", (data, i) => setTooltipContent(data, i))
      .on("mousemove", function(){return tooltip.style("top", (event.pageY-20)+"px").style("left",(event.pageX+40)+"px");})
      .on("mouseout", function(){return tooltip.style("visibility", "hidden");});
      
      

rect.join("g")
  .attr("fill", (d,i) => state[i][1])
.selectAll("rect")
.data(d => d)
.join("rect").transition().duration(1000)
  .attr("y", d => y(d[1]))
  .attr("height", d => y(d[0]) - y(d[1]))
  .attr("x", (d, i) => x(i))
  .attr("width", x.bandwidth());
  
  
  
.attr("x", (d, i) => x(i))
.attr("y", height - margin.bottom)
.attr("width", x.bandwidth())
.attr("height", 0)