SVG文本getComputedTextLength对于阿拉伯字体而言太短

我试图在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,但这并不能解决所有情况。如果我不尝试使用特定的阿拉伯字体,这将非常有效。

emily198688 回答:SVG文本getComputedTextLength对于阿拉伯字体而言太短

我知道发生了什么事。图表代码在加载阿拉伯字体之前会调用getComputedTextLength(),并为较窄的后备字体计算宽度。然后加载字体,文本元素突然变大很多,但我的JS代码无法运行。

本文链接:https://www.f2er.com/3168130.html

大家都在问