Как работает метод text() в D3.js?

Пользователь

от guillermo , в категории: JavaScript , 2 месяца назад

Как работает метод text() в D3.js?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

1 ответ

Пользователь

от vladimir , 2 месяца назад

@guillermo 

Метод text() в D3.js используется для установки или получения текстового содержимого выбранных элементов. Он возвращает текстовое содержимое первого элемента в выборке, если метод вызывается без аргументов, и устанавливает текстовое содержимое всех выбранных элементов, если ему передается аргумент.


Например, чтобы установить текстовое содержимое элемента с идентификатором myElementId равным "Привет, мир!", можно использовать следующий код:

1
2
d3.select("#myElementId")
  .text("Привет, мир!");


Чтобы получить текстовое содержимое этого же элемента, можно вызвать метод text() без аргументов:

1
var textContent = d3.select("#myElementId").text();


В этом случае переменная textContent будет содержать строку "Привет, мир!".


Метод text() также может принимать функцию в качестве аргумента. В этом случае функция должна возвращать новый текст для каждого элемента в выборке. Например, чтобы установить текстовое содержимое каждого элемента в выборке равным его порядковому номеру в выборке, можно использовать следующий код:

1
2
d3.selectAll("p")
  .text(function(d, i) { return i; });


В этом коде функция, переданная в метод text(), принимает два аргумента: d - это данные, связанные с текущим элементом, и i - это его порядковый номер в выборке. Функция возвращает порядковый номер, который затем устанавливается в качестве текстового содержимого каждого элемента в выборке.