是否有可能在r2d3中使用导入的字体？

我用R中的r2d3库绘制d3图，并尝试更改字体。不幸的是，最后呈现的总是Arial。有什么行之有效的方法可以让它发挥作用吗

我在连接到js文件的css文件中尝试过：

@import url('https://fonts.googleapis.com/css?family=Fira+Sans:400,600');
text {
    font-family: "Fira Sans", sans-serif;
    fill: #371ea3;
    color: #371ea3;
}

添加！重要的事情没有帮助

---

字体系列正确地更改为“Fira Sans”，但在计算部分，我可以看到呈现的字体是Arial。

您可以将css文件用于：

r2d3(data, script = "script.js", css = "styles.css")

如文件中所述。我把你的css放在一个文件中，没有svg中的文本问题

因此，我在以下方面取得了成功（根据文档改编）：

图r：

library(r2d3)
data <- c(0.3, 0.6, 0.8, 0.95, 0.40, 0.20)
r2d3(data, script = "chart.js", css="styles.css")

library(r2d3)
data <- c(0.3, 0.6, 0.8, 0.95, 0.40, 0.20)
r2d3(data, script = "chart.js", css="styles.css")

和chart.js：

var barHeight = Math.floor(height / data.length);
svg.selectAll('rect')
  .data(data)
  .enter().append('rect')
    .attr('width', function(d) { return d * width; })
    .attr('height', barHeight)
    .attr('y', function(d, i) { return i * barHeight; })
    .attr('fill', 'steelblue');

svg.selectAll('text')
  .data(data)
  .enter()
  .append('text')
  .attr('x',20)
  .attr('y', function(d,i) { return i * barHeight + 30})
  .text(function(d){ return d; })

给予：

---

我还成功地简化了css文件，仅指定字体：

@import url('https://fonts.googleapis.com/css?family=Fira+Sans:400,600');

然后使用

selection.style/attr

设置文本样式：

 selection.attr('font-family', "FontFamilyName"); // or:
 selection.style('font-family', "FontFamiliyName");

下面是该方法的样子（再次改编文档中的内容）

图r：

library(r2d3)
data <- c(0.3, 0.6, 0.8, 0.95, 0.40, 0.20)
r2d3(data, script = "chart.js", css="styles.css")

library(r2d3)
data <- c(0.3, 0.6, 0.8, 0.95, 0.40, 0.20)
r2d3(data, script = "chart.js", css="styles.css")

和chart.js（基于api文档的基本介绍示例）：

屈服（在默认字体和Fira SAN之间交替使用以形成对比）：

---

我刚才做了完全相同的事情，我的情节如下：@Featen，嗯，我再次尝试了第二个选项，从答案中复制代码，在另一个系统上运行RStudio（v1.0.136（2016）），仍然适用于我。看来我没主意了，很抱歉我帮不上什么忙。

var barHeight = Math.floor(height / data.length);
svg.selectAll('rect')
  .data(data)
  .enter().append('rect')
    .attr('width', function(d) { return d * width; })
    .attr('height', barHeight)
    .attr('y', function(d, i) { return i * barHeight; })
    .attr('fill', 'steelblue');

svg.selectAll('text')
  .data(data)
  .enter()
  .append('text')
  .attr('x',20)
  .attr('y', function(d,i) { return i * barHeight + 10})
  .text(function(d){ return d; })
  .style('font-family',function(d,i) {
      if(i%2 == 1) return 'Fira Sans'; else return ''; // for contrast.
   });