Я использую диаграмму d3 Визуализация исходного кода CodeFlower , чтобы создать диаграмму
, и я также добавляю текст каждого узла с имитацией кода узла, подобного этому
this.text
.enter()
.append("svg:text")
.attr("class", "nodetext")
.classed("directory", d => (d._children || d.children ? 1 : 0))
.text(d => "There is a long long long words")
.attr("name", d => 'd.name')
.attr("dy", d => -16)
.attr("dx", d => 0)
.attr("text-anchor", "middle")
.call(this.force.drag);
но теперь из-за слишком длинного текста для отображения.Мне просто нужно около 10 символов в строке.
, поэтому я добавляю некоторые после текстового кода
this.text
.enter()
.append("svg:text")
.attr("class", "nodetext")
.classed("directory", d => (d._children || d.children ? 1 : 0))
.attr("name", d => 'd.name')
.attr("dy", d => -16)
.attr("dx", d => 0)
.attr("text-anchor", "middle")
.call(this.force.drag)
.append("tspan")
.text(d => "There is a long long logn words")
.attr("dx", 0)
.attr("dy", 14)
.attr("fill", "#000");
, но диаграмма с не появляется в корзине
but the info is not appear">
, когда я проверяю девайс хрома.есть информация в
Итак ... Какова причина, по которой информация не отображается на графике ???
Я просто нажимаю минимум на codepen Диаграмма D3, обтекание текстом не появляется .