Question

我已经在Vue.js测试应用程序中使用Vue-Konva对Konva进行了实验。我得到它描绘对象描述没问题。但是，我似乎无法理解如何将我在舞台上的内容保存到图像中或使用＆＃34; toDataURL＆＃34;功能。我得到的只是＆＃34; toDataURL＆＃34;不是一个功能。我确定这只是如何构建执行它的问题。

这是我的模板：

<v-stage ref="stage" :config="configKonvaStage">
  <v-layer ref="layer">
    <v-Line :config="configTopSide"></v-Line>
    <v-Line :config="configRightSide"></v-Line>
    <v-Line :config="configBottomSide"></v-Line>
    <v-Line :config="configLeftSide"></v-Line>
    <v-Rect :config="configRect"></v-Rect>
  </v-layer>
</v-stage>

我的配置数据如下：

configKonvaStage: {
      x: 0,
      y: 0,
      width: 400,
      height: 400,
    }

就像我说这一切都很好。但是，我无法弄清楚如何启动＆＃34; toDataURL＆＃34;或者＆＃34; toImage＆＃34; Konva的功能。

我尝试了以下内容：

$KonvaImg = this.$refs.stage.getStage().toImage({...})

和 $$ KonvaImg = this。$ refs.stage.getStage（）。toDataURL（{...}）

我得到的错误是：

*konva.js?c4b2:1094 Konva warning: Unable to get data URL. Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported*

我是否需要创建Canvas元素并为其分配Konva阶段？这似乎会破坏使用Konva的一些好处。舞台也相当于画布？

如何利用vue-konva或只是konva在Vue.js中使用Konva [toDataURL]或[toImage]

0 个答案: