Нет DIV, созданных D3 для ввода данных() с несколькими значениями

Обратите внимание, что дело не в , как получить бар. К счастью, у меня это покрыто. Это скорее почему бы не вопрос. Когда реальность не соответствует ожиданию, обычно есть урок, который нужно изучить. Кроме того, на основе чрезвычайно полезных комментариев, я понял, что диагностика была неправильной, поэтому я обновил вопрос.Нет DIV, созданных D3 для ввода данных() с несколькими значениями

Я только что начал экспериментировать с D3. Следуя примерам, я получаю несколько хороших графиков. Затем я проверил это (просто для накопления знаний о менее привычном подходе с чисто академической целью).

var graphs = d3.select("#graph").selectAll("div"); 
graphs.data([1, 2, 3, 4]).enter() 
    .append("div").text(function(d){ return d; });

Число DIVs не изменяется. Это меня смущает, потому что я ожидаю приращение на 4 (если я создаю DIV для каждого такого элемента). Когда код fiddle, он работает. Тем не менее, я застрял в том, как справиться с проблемой.

Я проверил, что d3.select ("# Граф") действительно содержит ровно один элемент.
Я запустил сценарий с консоли, чтобы избежать проблем с загрузкой.

Моя страница представляет собой частичный вид, созданный Razor. Все остальные скрипты, кроме jQuery, которые я должен сохранить, так как они вызываются при загрузке страницы, удаляются.

... 
<div id="#graph" ...></div> 
... 
@section style{ @Styles.Render("~/Page.css") } 
@section script{ 
    @Scripts.Render("~/Page.js") 
    @Scripts.Render("~/Scripts/d3.min.js") 
}

источник

2016-01-23 Konrad Viltersten

@ Кирилл Там вы идете! Это был случай неправильной диагностики с моей стороны (из-за отсутствия компетентности и избытка путаницы в отношении D3). Не стесняйтесь смотреть. –

«Я проверил, что d3.select (« # graph ») содержит ровно один элемент». Вы утверждаете, что возвращает массив одного элемента или что единственный член этого массива содержит полезный элемент dom? Если я набираю d3.select ("# withisjfsdopafwdgdfgdfgkl"), я получаю результат возврата массива [1], это просто, что элемент dom в этом массиве является нулевым – mgraham

Поскольку скрипка в порядке, я хочу увидеть разметку страницы. В частности, порядок загрузки скриптов. И после @mgramham, что произойдет, если вы удалите или переименуете DIV с id 'graph'? –

Я вижу три вещи в вашем коде. Прежде всего, использование селектора d3.("#graph") относится к <div id="graph" />. У вас есть острый знак в id HTML. Вот почему вы не видите, сколько элементов увеличивается - они создаются в другой компонент. Используйте это вместо этого.

<div id="graph" ...>

Дополнительная информация о порядке ваших сценариев. Ваша разметка неверна, потому что вы читаете в Page.js до d3.min.js. Если вы не получаете ошибок из-за отсутствия d3 в onload вашей страницы (который я предполагаю в первом), то у вас есть несколько ссылок на него. Это лишний раз, потому что у вас есть глобальное покрытие. Или вы можете переключить порядок скриптов, подобных этому, и пропустить глобальный.

@section script{ 
    @Scripts.Render("~/Scripts/d3.min.js") 
    @Scripts.Render("~/Page.js") 
}

Последнее, что касается ваших разделов. Я предполагаю, что их вызывают из макета и что это только частичное представление. Если да, следите за порядком рендеринга. Вызов обработки разделов в частичных представлениях на разных этапах макета может создать проблемы.

источник

2016-01-23 16:44:55

Хорошая ловушка, что 'id =" # graph "', вероятно, проблема. – Mark

@Mark Это ** один из проблем. Но, как вы сами видели, сценарии не были загружены в правильном порядке (хотя легко думать, что они есть). –

Нет DIV, созданных D3 для ввода данных() с несколькими значениями

ответ

Смежные вопросы