Question

我在d3.js中有一个下拉菜单，我想从所选选项中获取索引。这是一个有50多家航空公司的名单，现在我有这个：

  function choixCompagnie(){
    let compagnieChoisie = d3.select(this).property('value')
  }

只要下拉列表发生变化，此功能就会激活，如下所示：

d3.select("#selectCompagnie") .on("change",choixCompagnie)

property('value')意味着，例如，如果我点击我的下拉菜单的第一行，即Aer Lingus，我的compagnieChoisie变量将获得值Aer Lingus而不是{{ 1}}。

我需要它，因为我需要按公司访问某些属性公司，而我的对象是一个数组。因此，在我的数据库中，我需要访问类似0的属性，而不是像data[index].randomProperty那样，因为公司名称已经是属性。

我不知道这是否有意义，如果我使用了错误的条款我很抱歉，我对编码很新。

感谢您的帮助！

编辑：这是一个工作示例http://blockbuilder.org/ArnaudStephanUNIL/a18332a561579eb929091faaff91fb6f，其中下拉列表获取值而不是索引

Answer 1

您应该像这样访问您的数据：

function choixCompagnie(){
    let compagnieChoisie = d3.select(this).property('value')
    console.log(data.find(d => d.compagnie === compagnieChoisie).accidents);
}

Answer 2

我找到了一种从下拉菜单中获取索引的更好，更简单的方法：

<select id="selectOptions"></select>

初始化下拉菜单后，您只需执行此操作：

var options = ["option1","option2"];

options.forEach(function(d,i){
    d3.select("#selectOptions")
      .append("option")
      .attr("value",i)
      .text(d);
  })

如何从d3的下拉菜单中获取所选索引

2 个答案: