d3 не удается получить доступ к данным по выбранному элементу в выпадающем меню

Question

Я пытаюсь использовать раскрывающееся меню для доступа к определенному столбцу csv.

Мой HTML-код здесь:

<select id="myList" > 
    <option value="firstCol">One</option> 
    <option value="secondCol">Two</option> 
    <option value="thirdCol">Three</option> 
    <option value="fourthCol">Four</option> 
</select> 

ниже в мой сценарий, я прочитал в моем формате CSV, а затем вызвать функцию createList здесь:

function createList(){ 
    var current = document.getElementById("myList"); 
    var strUser = current.options[current.selectedIndex].value; 

    data2.forEach(function(d2){ 
     console.log(d2.firstCol); <- prints each value in the correct column 
     console.log(strUser); <- prints the correct selected item 
     console.log(d2.strUser); <- prints undefined 
    }); 
} 

Если я распечатать d2.firstCol, это дает мне правильный ответ. Если я выбрал firstCol и распечатал strUser, он печатает «firstCol». Почему тогда d2.strUser возвращает undefined?

Answer 1

Вы получаете ошибку, потому что у вас нет столбца с именем «strUser». В этом случае необходимо использовать оператор «индексации»:

d2[strUser];