FabricJS не отображает SVG правильно, когда SVG включает текст с пользовательским шрифтом?

Question

У меня проблема с рендерингом SVG в fabricjs, когда SVG включает текст с пользовательским шрифтом.

Как сделать так, чтобы SVG в Fabricjs отображался правильно с пользовательским шрифтом?

Вот мой код:

var canvasObject = document.getElementById("editorCanvas");

		// set canvas equal size with div
		$(canvasObject).width($("#canvasContainer").width());
		$(canvasObject).height($("#canvasContainer").height());

var canvas = new fabric.Canvas('editorCanvas', {
  backgroundColor: null,
  selectionLineWidth: 2,
  width: $("#canvasContainer").width(),
  height: $("#canvasContainer").height()
});

var imageObj = new fabric.Image();
		canvas.add(imageObj);	
imageObj.setSrc('https://futushigame.firebaseapp.com/group_test.svg', function(imageObject) {
  imageObject.set({top: 0, left: 0});
  imageObject.set('dirty', true);
  canvas.renderAll();
  setObjectCoords();
});


function setObjectCoords() {
  canvas.forEachObject(function(object) {
  object.setCoords();
  });
}

#canvasContainer {
  width: 100%;
  height: 100vh;
}

<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/2.4.3/fabric.js"></script>
  
  <style>
		 @font-face {
                font-family: 'CurlzMT';
                src: url("https://futushigame.firebaseapp.com/CurlzMT.ttf") format("ttf");
                font-weight: 'normal';
                font-style: 'normal';
            }
	</style>
  
  <div id="canvasContainer">
    <canvas id="editorCanvas"></canvas>
  </div>

Вот мои ресурсы:
1. Файл шрифта: CurlzMT
2. SVG-файл: group_test.svg

Спасибо!

Answer 1

Вам необходимо встроить шрифт в файл SVG. Содержание svg должно быть таким https://files.fm/f/qhvbe8jj