Как добавить стандартные шрифты Google для текстового элемента D3.js SVG

Question

Как добавить шрифты Google к текстовому элементу d3, например:

   g.append('text')
      .attr('x', width / 2)
      .attr('y', height / 3)
      .text('roboto')
      .style("font-family", "roboto")
      .style("font-size", "80px")
      .attr("fill", "grey");

Это отдельный вопрос, приведенный ниже, который фокусируется на пользовательском типе лица

Использование шрифтов Google с d3.js и SVG

Answer 1

Прямое решение:

Используйте элемент ссылки, как показано ниже, в заголовке вашего макета

 <link href='https://fonts.googleapis.com/css?family=Inconsolata:700' rel='stylesheet' type='text/css'>

Это импортирует нужный шрифт, а затем внутри вашего элемента SVG добавитьсемейство шрифтов:

 svg.append('text')
      .text('Inconsolata')
      .style("font-family", "Inconsolata")