#javascript #d3.js
Вопрос:
Проблема в том, что я пытаюсь построить круговую диаграмму, я добавляю данные enter , добавляю g элемент для каждого элемента данных, затем добавляю обработчик щелчка, после добавления обработчика щелчка больше ничего не выполняется.
const pie = g.selectAll("path")
.data(pie(chartData))
.enter()
.append("g") // <--- this works fine, elements are appended
.on("click", (d, i) => onSliceClick(i)) // <--- click handler appears to be added fine
.append("path") // <--- this and nothing beneath it are executed
Имея очень трудное время отладки, поскольку проблема не появляется локально, сейчас очень сложно заметить какую-либо разницу. Я надеюсь, что кто-то с большим опытом работы с D3.js можно было бы объяснить некоторые более общие сценарии, в которых цепной метод может быть недоступен и ошибки не возникают.
Я занимался отладкой в Chrome, и когда я размещаю точки останова поперек строки, все они запускаются, но точка останова после .on("click", ... обработчика никогда не выполняется.
На приведенном выше изображении точка останова в ln 84215 никогда не достигается, однако все точки останова в строке выше выполняются.
Комментарии:
1. Является ли пропущенное
"точным или опечаткой в вопросе:"click, ...?2. @AndrewReid, к сожалению, нет, код был на моем рабочем компьютере, и я допустил ошибку, набрав его. Синтаксис в порядке, обновили пример
3. Ах, не думал, что это было так, вызвало бы ошибки, не думаю, что вы можете создать функционирующий минимальный пример, воспроизводящий проблему?
4. Ваш вопрос не соответствует действительности: в своем фрагменте кода вы утверждаете, что последний
.append()никогда не выполнялся, однако на вашем изображении проблемная точка останова в строке 84215 относится к коду в обработчике щелчка, что совершенно другое. Не могли бы вы уточнить?