1

将 Konva 与 VueJS 一起使用时，如何将背景图像添加到我的舞台或图层？我试过fillPatternImage在config图层和舞台上都应用，但没有效果。在文档中找不到任何关于此的内容，除了可能在其中一个图层中添加一个大矩形并填充它。任何想法如何做到这一点？

这是一些我在单个形状上使用它的代码。我可以在图层/组/舞台级别做类似的事情来设置背景吗？

<v-stage
  ref="stage"
  :config="configKonva"
>
  <v-layer v-if="image" ref="layer">
    <v-regular-polygon
      v-for="item in list"
      :key="item.id"
      :config="{
        x: item.x,
        y: item.y,
        sides: 6,
        rotation: item.rotation,
        id: item.id,
        numPoints: 5,
        radius: 30,
        outerRadius: 50,
        opacity: 0.8,
        fillPatternImage: image,
        fillPatternRepeat: 'no-repeat',
        fillPatternOffset: {
...
4

1 回答 1

6

stage，layer并且group没有fillPatternImage财产。只有形状具有该属性：https ://konvajs.org/api/Konva.Shape.html#fillPatternImage

这就是为什么建议添加背景矩形形状。

此外，您可以将带有 CSS 的背景图像添加到舞台容器中（但如果您尝试使用 Konva 方法导出画布内容，则此类背景不会导出到图像中）

看看这里的一些演示：https ://konvajs.org/docs/sandbox/Canvas_Background.html

于 2020-03-24T17:23:55.640 回答