Question

我正在尝试使用void sizeAnn(RectangleAnnotation ra, Size sz) { ChartArea CA = chart1.ChartAreas[0]; SizeF pixelPercent = Pixels2Percent(CA, sz.Width, sz.Height); ra.Width = pixelPercent.Width; ra.Height = pixelPercent.Height; }，一切都很好，但我的文字有些问题。

如果我正在尝试加载文字，则不会加载某些属性，例如workflow，loadSVGfromURL等。文本已加载，但使用默认属性：黑色font-family和Times new roman fill。

这是我的代码：

color

Answer 1

问题是缺少Fabricjs中的TSPAN支持。

svg看起来像这样：

<text x="32" y="40" class="cls-1"><tspan class="cls-2">riev</tspan></text>
  <text x="158" y="211" class="cls-1"><tspan class="cls-3">0999989878</tspan></text>
  <text x="96" y="120" class="cls-1"><tspan class="cls-2">Platon</tspan></text>

信息类=“cls-2”和class =“cls-3”未被解析，因为tspan被丢弃。

您可以像这样修改svg：

<text x="32" y="40" class="cls-1 cls-2"><tspan >riev</tspan></text>
  <text x="158" y="211" class="cls-1 cls-3"><tspan >0999989878</tspan></text>
  <text x="96" y="120" class="cls-1 cls-2"><tspan >Platon</tspan></text>

解析它。

Answer 2

我添加了这个 var svg = doc;
for（var i = 0; i＆lt; svg.childNodes.length; i ++）{

      if (svg.childNodes[i].tagName == "text") {
          for (var j = 0; j < svg.childNodes[i].childNodes.length; j++) {
              if (svg.childNodes[i].childNodes[j].tagName == "tspan") {
                  for (var k = 0; k < svg.childNodes[i].childNodes[j].classList.length; k++)
                  {
                      var tmpClassName = svg.childNodes[i].childNodes[j].classList[k];
                      svg.childNodes[i].classList.add(tmpClassName);
                  }



              }
          }
      }
  }

中的

fabric.parseSVGDocument

将我的tspan样式添加到文本样式

的功能

Fabric js从url缺失属性加载svg

2 个答案: