Я пытаюсь изменить график силового макета здесь http://bl.ocks.org/mbostock/4062045, добавляя текст внутри кругов, но текст не отображается. Я добавил этот блок кода к исходному коду на сайте.
node.append("text")
.style("text-anchor", "middle")
.text(function(d) { return d.name; });
У меня нет вашего кода целиком, но я думаю, что вы добавляете текст В круги, а поскольку круги маленькие, вы не видите текста.
Теперь ваши узлы в настоящее время являются кругами (я просто полагаю). Если вам нужны и круги, и текст для каждого узла, ваши узлы должны быть элементами svg g (g означает «группа»), и каждому такому элементу g вы назначаете круг и текст. Подробнее об этом вы можете узнать здесь (там же есть код )
РЕДАКТИРОВАТЬ: Как только вы увидите метки, вам захочется расположить их удобным образом по отношению к узлам. Вот почти официальная рекомендация по расположению меток к узлам графа:
Для вертикального выравнивания используйте атрибут «dy»:
by default, the baseline of the text is at the origin (bottom-aligned)
a dy of .35em centers the text vertically
a dy of .72em places the topline of the text at the origin (top-aligned)
Использовать em единиц удобно, потому что они автоматически масштабируются в зависимости от размера шрифта. Если вы не укажете единицы измерения, по умолчанию будут использоваться пиксели.
Для горизонтального выравнивания используйте атрибут text-anchor:
the default is "start" (left-aligned for left-to-right languages)
"middle"
"end"
<g>) элементы в качестве узлов, а затем добавил круг и текстовые элементы отдельно в group вместо того, чтобы делать сами круги узлами, как в примере, с которым вы работали.
- person AmeliaBR; 13.01.2014
text{text-anchor:middle; alignment-baseline:middle;}, чтобы центрировать его по точке ). Но что касается браузера, круг и текст должны быть родственными элементами, а не вложенными друг в друга.
- person AmeliaBR; 13.01.2014
