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

时间:2019-05-22 19:43:32

标签: javascript html

与上一个问题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脚本的任何建议?

1 个答案:

答案 0 :(得分:1)