Canvg 3.0与Angular项目的集成

在我目前开发的应用程序中，我使用canvg库在页面中进行一些画布渲染，到目前为止，我使用canvg 2.0库以以下方式实现这一点：

import Canvg from 'canvg/dist/browser/canvg.min.js';

// convert SVG into a XML string
xml = new XMLSerializer().serializeToString(obj);
// Removing the name space as IE throws an error
xml = xml.replace(/xmlns=\"http:\/\/www\.w3\.org\/2000\/svg\"/, '');
// draw the SVG onto a canvas
Canvg(canvas, xml);

几天前发布了Canvg版本3，它将所有内容都更改为Typescript，并且Canvg.min.js不再存在，我无法找到将npm安装的Canvg库集成到Angular 8项目中的方法，因此我可以像以前一样使用它，没有为“Canvg”函数导入任何模块的建议，文档对于如何将其与Angular集成也没有帮助

---

有人遇到过这个问题并且知道如何解决吗？

如果他们迁移到TypeScript，实际上会更容易。他们在中提供了一些文档

下面是一个让您开始学习的示例：

import { Component, ViewChild, AfterViewInit, OnDestroy } from "@angular/core";
import Canvg from "canvg";

@Component({
  selector: "my-app",
  templateUrl: "./app.component.html",
  styleUrls: ["./app.component.css"]
})
export class AppComponent implements AfterViewInit, OnDestroy {
  @ViewChild("canvas", { static: false }) canvas;
  context: CanvasRenderingContext2D;
  renderedCanvas;

  async ngAfterViewInit() {
    this.context = this.canvas.nativeElement.getContext("2d");
    this.renderedCanvas = await Canvg.from(
      this.context,
      '<svg width="600" height="600"><text x="50" y="50">Hello World!</text></svg>'
    );
    this.renderedCanvas.start();
  }

  ngOnDestroy() {
    this.renderedCanvas && this.renderedCanvas.stop();
  }
}

从“@angular/core”导入{Component，ViewChild，AfterViewInit，OnDestroy}；
从“Canvg”导入Canvg；
@组成部分({
选择器：“我的应用程序”，
templateUrl:“./app.component.html”，
样式URL:[“/app.component.css”]
})
导出类AppComponent实现AfterViewInit、OnDestroy{
@ViewChild（“canvas”，{static:false}）canvas；
上下文：CanvasRenderingContext2D；
渲染画布；
异步ngAfterViewInit（）{
this.context=this.canvas.nativeElement.getContext（“2d”）；
this.renderedCanvas=wait Canvg.from(
在这种情况下，
“你好，世界！”
);
this.renderedCanvas.start（）；
}
恩贡德斯特罗（）{
this.renderedCanvas&&this.renderedCanvas.stop（）；
}
}

以下是模板：

<canvas #canvas></canvas>

---

这是给你裁判的答案

---

调用

npm install canvg--save

后，您可以使用

import*作为canvg从“canvg”导入canvg。我很困惑为什么在导入时Canvg不再工作了，因为一些奇怪的typescript错误（也是Canvg而不是Canvg.from（））。谢谢：）