d3.js 使用按钮更新条形图工具提示答案

【问题标题】：d3.js Update Bar Chart Tooltip with Buttonsd3.js 使用按钮更新条形图工具提示
【发布时间】：2016-05-16 02:02:53
【问题描述】：

我正在尝试使用按钮制作四个条形图来分类我想要显示的一个。正如您在我的code 中看到的那样，总的来说一切都很好。但是，现在我尝试在 [此处][2] 添加工具提示，并意识到每个图表的数据都不会更新。有谁知道我该怎么做？我想在 var tip 上实现 if-else 语句来选择正确的按钮：

var tip = d3.tip()
          .attr('class', 'd3-tip')
          .offset([-10, 0])
          .html(function(d) {                                                                            

          if(d3.select("#propertyCategory"))
                       return "No: <strong>" + d.propertyName + "</strong> foram registrados <strong>" + d.vacant + "</strong>";
                                              })

但是，它不起作用，老实说，我不明白在这种情况下如何正确实现选择，我在 d3.js 中有点菜鸟，所以我不知道可以做什么解决这个问题。

【问题讨论】：

标签： javascript d3.js charts tooltip bar-chart

【解决方案1】：

也许你可以有一个变量

  var selected = "ano2009";//set it to default value

现在，当年份更改时，更改所选变量。

像这样：

d3.select("#vacant")
    .on("click", function() {
        selected = "vacant";
        //Update scale domain

像这样：

   d3.select("#totalUnits")
        .on("click", function() {
           selected = "totalUnits";

...等等

现在在提示功能中你可以这样做：

var tip = d3.tip()
                                                  .attr('class', 'd3-tip')
                                                  .offset([-10, 0])
                                                  .html(function(d) {

 //note d[selected] will select the clicked year data.                                                  
  return "No: <strong>" + d.propertyName + "</strong> foram registrados <strong>" + d[selected] + "</strong>";
                                                  })

工作代码here

【讨论】：