fix: 修复导出svg字体不生效

packages/core/ServersPlugin.ts

@@ -11,6 +11,8 @@ import { fabric } from 'fabric';
 import Editor from './Editor';
 type IEditor = Editor;
 import { SelectEvent, SelectMode } from './eventType';
+import { off } from 'process';
+import { forIn } from 'lodash-es';
 
 function transformText(objects: any) {
  if (!objects) return;
@@ -227,8 +229,11 @@ class ServersPlugin {
 
  saveSvg() {
  this.editor.hooksEntity.hookSaveBefore.callAsync('', () => {
- const option = this._getSaveSvgOption();
- const dataUrl = this.canvas.toSVG(option);
+ const { fontOption, svgOption } = this._getSaveSvgOption();
+ fabric.fontPaths = {
+ ...fontOption,
+ };
+ const dataUrl = this.canvas.toSVG(svgOption);
  const fileStr = `data:image/svg+xml;charset=utf-8,${encodeURIComponent(dataUrl)}`;
  this.editor.hooksEntity.hookSaveAfter.callAsync(fileStr, () => {
  downFile(fileStr, 'svg');
@@ -263,15 +268,33 @@ class ServersPlugin {
 
  _getSaveSvgOption() {
  const workspace = this.canvas.getObjects().find((item) => item.id === 'workspace');
+ let fontFamilyArry = this.canvas
+ .getObjects()
+ .filter((item) => item.type == 'textbox')
+ .map((item) => item.fontFamily);
+ fontFamilyArry = Array.from(new Set(fontFamilyArry));
+
+ const fontList = this.editor.getPlugin('FontPlugin').cacheList;
+
+ const fontEntry = {};
+ for (const font of fontFamilyArry) {
+ const item = fontList.find((item) => item.name === font);
+ fontEntry[font] = item.file;
+ }
+
+ console.log('_getSaveSvgOption', fontEntry);
  const { left, top, width, height } = workspace as fabric.Object;
  return {
- width,
- height,
- viewBox: {
- x: left,
- y: top,
+ fontOption: fontEntry,
+ svgOption: {
  width,
  height,
+ viewBox: {
+ x: left,
+ y: top,
+ width,
+ height,
+ },
  },
  };
  }
@@ -280,6 +303,7 @@ class ServersPlugin {
  const workspace = this.canvas
  .getObjects()
  .find((item: fabric.Object) => item.id === 'workspace');
+ console.log('getObjects', this.canvas.getObjects());
  const { left, top, width, height } = workspace as fabric.Object;
  const option = {
  name: 'New Image',