Javascript 使用charts.js在画布旁边显示base64图像

我使用的是charts.js，它可以添加一个包含画布base64图像的属性，如下所示：

animation: {
    onComplete: function(animation){
        document.querySelector('#myChart').setAttribute('href', this.toBase64Image());
    }
},

这是完整的小提琴作品：

当您检查画布时，可以看到包含图像的href属性，这样就可以了。但是我需要在画布下面显示图像。所以，是的，屏幕上将有两个图表，画布版本和图像版本

---

无论如何，我找不到这个问题的答案，文档也没有提供任何线索。

您需要添加

的
属性。您需要添加
的
属性。onComplete
在JSFIDLE至少被调用两次。您可以定义一个
未定义的变量，在
完成时检查变量是否定义为防止
被附加到
文档中两次，如果变量未定义，则创建
元素，使用
.insertAdjacentHTML（）
链接到
ctx
，第一个参数为
“afterend”
和
元素的第二个参数
.outerHTML


onComplete
在JSFIDLE上至少被调用两次。您可以定义一个
未定义的变量，在
完成时检查变量是否定义为防止
被附加到
文档中两次，如果变量未定义，则创建
元素，使用
.insertAdjacentHTML（）
链接到
ctx
，第一个参数为
“afterend”
和
元素的第二个参数
.outerHTML


你救了我一天：）你救了我一天：）
var img;

animation: {
  onComplete: function(animation) {
    if (!img) {
      ctx.setAttribute('href', this.toBase64Image());
      img = new Image;
      img.src = ctx.getAttribute('href');
      ctx.insertAdjacentHTML("afterend", img.outerHTML)
    }
  }
}