Javascript d3.js-使用单选按钮更改工具提示的值

我正在为乌克兰绘制一张热图，其中包括一些经济指标

        d3.selectAll('.radio').on('change', function(){

            if (document.getElementById('none').checked) {

                            areas.transition().duration(250)
                                 .attr('fill','steelblue');}

            else if (document.getElementById('agr').checked) {

                            areas.transition().duration(250)
                                 .attr('fill', function(d){return colorScaleagr(d.properties.agricindx)});}
.... and so on.

根据选中的单选按钮，将使用不同的色阶进行可视化 不同的值/指标

        d3.selectAll('.radio').on('change', function(){

            if (document.getElementById('none').checked) {

                            areas.transition().duration(250)
                                 .attr('fill','steelblue');}

            else if (document.getElementById('agr').checked) {

                            areas.transition().duration(250)
                                 .attr('fill', function(d){return colorScaleagr(d.properties.agricindx)});}
.... and so on.

现在，工具提示（div）只显示悬停区域的名称。我还想显示区域的值，对应于此时选择的指示器。工具提示的内容（名称）在path/map元素的事件处理程序中确定

var areas = group.append('path')
                    .attr('d',path)
                    .attr('class', function(d) { return "subunit" + d.id; })
                    .attr('fill','steelblue')
                    .attr('stroke', 'white')
                    .attr('stroke-width', '1px')
                    .attr('opacity','0.8')
                                                       // Hover & Tooltip
                    .on("mouseover", function(d) {
                        d3.select(this).transition().duration(200).style("opacity", 1);
                        div.transition().duration(300).style("opacity", 1)                          
                        div.html(d.properties.name )
                           .style("left", (d3.mouse(this)[0] + 330)  + "px")
                           .style("top", (d3.mouse(this)[1] + 15)  + "px");
                        })

                    .on("mousemove", function(d) {                                                  
                        div.html(d.properties.name)
                           .style("left", (d3.mouse(this)[0] + 350) + "px")
                           .style("top", (d3.mouse(this)[1] + 25)  + "px");

                        })  

                    .on("mouseout", function(d) {
                        d3.select(this).transition().duration(200).style("opacity", 0.8);                           
                        div.transition().duration(300).style("opacity", 0)                          
                        });

所以我现在的问题是：我如何考虑单选按钮的状态， whithin路径元素（区域），因为单个实体（区域）的数据

---

储存在那里。如果我试图在无线电对接选择中操纵工具提示，则数据对我不可用。我希望我能让自己明白：）。谢谢你的帮助

我想我明白你想做什么，所以我想尝试一下：

将数据格式化为具有键/值对的对象，如下所示：“无”：10，“agr”：4，等等

将来自不同单选按钮的钥匙存储为全局变量，并在单选更改功能中更新

在mouseover函数上创建工具提示时，通过调用d[key]，即d['agr']，打印正确的值

---

希望有帮助

你能把你的密码放在类似的东西里吗？我从你的链接中看不到任何东西，很难说到底出了什么问题。好吧，这不完全是解决方案，但给了我正确的想法。我只是将所有数据放入一个数组中，几个子数组包含单个指示符的值。因为每个实体都有一个id，所以我可以使用相应的id引用数组。