Поместите текст внутри круга. d3.js

Question

Поместите текст внутри круга. d3.js

1

Я пытаюсь изменить код, и в тех модификациях, которые я сделал, я не смог разместить текст в середине круга. Я пробовал много вещей, и я видел несколько примеров, но это не работает для меня. Как мне это сделать? Я знаю, что это должно быть сделано в этой части, и я добавляю текстовый тег, но он не работает.

bubbles.enter().append('circle')
.classed('bubble', true)
.attr('r', 0)
.attr('fill', function (d) {  return  fillColor(d.group); })
.attr('stroke', function (d) { return d3.rgb(fillColor(d.group)).darker(); 
 })
.attr('stroke-width', 2)
.on('mouseover', function(){})
.on('mouseout', function(){});

http://plnkr.co/edit/2BCVxQ5n07Rd9GYIOz1c?p=preview

yavg 05 июнь 2017, в 18:41

Источник

Теги:

javascript

d3.js

1 ответ

Ещё вопросы

Gerardo Furtado · Accepted Answer · 2017-06-05T22-06-00.000Z

Создайте еще один выбор для текстов:

var bubblesText = svg.selectAll('.bubbleText')
    .data(nodes, function(d) {
        return d.id;
    });

bubblesText.enter().append('text')
    .attr("text-anchor", "middle")
    .classed('bubble', true)
    .text(function(d) {
        return d.name
    })

И перемещайте их внутри функции тика.

Вот обновленный плункер: http://plnkr.co/edit/UgDjqNhzbvukTWU6J9Oy?p=preview

PS: Это очень общий ответ, просто показывая вам, как отображать тексты. В этом ответе не рассматриваются детали, такие как размер или переходы, которые выходят за рамки вопроса и что вам придется реализовать себя.

Отлично, у меня вопрос, для чего именно используется эта линия? И еще одна вещь, которую я хочу знать, это как разместить текст определенного размера для маленьких кружков. (Было бы здорово подсчитать, что они не превышают размер круга и, таким образом, определить соответствующий размер ..) Manyisimas спасибо. вы латынь?
Как я уже говорил вам в моем посте scriptum, это разные проблемы, и будет лучше, если вы отправите другой вопрос относительно размера текста. Что касается линии, вы не сказали мне, о какой линии вы говорите (и если вы имели в виду «латино», да, я).
Я забыл сказать вам, по какой линии, я говорю по-испански, в следующем случае мы могли бы понимать друг друга на нашем родном языке? Я не очень хорошо разбираюсь в английском языке .. bubblesText = svg.selectAll ('. BubbleText') .data (node, function (d) {return d.id;});
Я только что скопировал ваши круги, это то, что мы называем «обновлением». StackOverflow доступен только на английском языке, поэтому он так и есть на английском языке: es.stackoverflow.com