SVG文本getComputedTextLength对于阿拉伯字体来说太短

Question

我正在尝试为Web应用程序在SVG中为阿拉伯文本添加特定字体。字体看起来不错，但是getComputedTextLength（）返回的结果“太短”，即文本占用的空间比渲染时要多。尝试换行等时，这会导致问题。

有人知道解决方法或解决方案吗？我尝试了几种不同的字体，并在Chrome和Firefox中获得了相同的结果。

https://fonts.google.com/specimen/Cairo

<link href="https://fonts.googleapis.com/css?family=Cairo&display=swap&subset=arabic" rel="stylesheet">

https://www.google.com/get/noto/#kufi-arab

@font-face {
  font-family: 'NotoKufiArabic';
  src: url('../font/NotoKufiArabic-Regular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

示例d3代码给出的结果太短：

    legend.append("text")
        .text(function (d) { return d.data.label)})
        .each(function(d) { d.legendWidth = this.getComputedTextLength() + 24 });

24只是一些填充。 legendWidth太小。我尝试应用例如1.4，但这并不能解决所有情况。如果我不尝试使用特定的阿拉伯字体，这将非常有效。

Answer 1