javascript - 将用户选择的值从下拉菜单传递到 d3.csv

Question

与上一个问题有点相似enter link description here ，但对于 d3。

基本上，我有一个下拉菜单，用户可以选择他们想要查看的年份。当用户选择年份时，我想将该数据传递给 d3.csv 命令以选择相关的 csv 文件。

html代码如下:

<form>                                  <!-- drop down to select year for data -->
        <label>Select year to see each team's scoring:</label>
        <select id="year">
            <option value="Rugby - 2014">2014 - 2015</option>
            <option value="Rugby - 2015">2015 - 2016</option>
            <option value="Rugby - 2016">2016 - 2017</option>
            <option value="Rugby - 2017">2017 - 2018</option>
            <option value="Rugby - 2018">2018 - 2019</option>           
            <option value="Rugby - Total">2014 - 2019</option>          
        </select>
    <form>

我已经尝试了几次迭代，这就是我现在所做的:

<script type="text/javascript"> 

    d3.csv(document.getElementById('year').value & ".csv").then(function(data){ <!-- import CSV file
        data.forEach(function(d) {                                      
            For = +d.For                                                <!-- set 'For' name to d.For and convert to number -->
            Against = +d.Against                                        <!-- set 'Against' name to d.Against and convert to number -->
            Teams = d.Teams                                             <!-- set 'teams' name to d.teams -->
        })})
</script>

编辑:我收到的错误是TypeError: d3.csv(...).then is not a function

关于如何从下拉列表中获取所选值到 d3.csv 脚本中，有什么建议吗？

Answer 1

d3.csv(document.getElementById('year').value & ".csv", function(error,data) {
 ...
});

https://github.com/d3/d3-fetch/blob/v1.1.2/README.md#csv