是否可以以及如何在 Phaser 3 中加载 SVG 字符串而不是从路径/url 加载它?

问题描述

我的代码中有几个 SVG,我想将它们与 Phaser(专门用于粒子)一起使用,而无需将它们保存到单独的 SVG 文件中。

const svgString = `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M24 10h-10v-10h-4v10h-10v4h10v10h4v-10h10z"/></svg>`;

function preload()
{
    // Usual way
    this.load.svg('plus','assets/svg/plus.svg');

    // What I would like to do
    this.load.svg('plus',svgString)
}

有没有办法实现这一目标(以及如何实现)?

解决方法

问题已在 Phaser 3 论坛上得到解答 - https://phaser.discourse.group/t/is-it-possible-and-how-to-load-svg-string-in-phaser-3-instead-of-loading-it-from-path-url/9668

const svgString = `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M24 10h-10v-10h-4v10h-10v4h10v10h4v-10h10z"/></svg>`;

function preload()
{
    const blob = new Blob([svgString],{ type: 'image/svg+xml' });
    const url = URL.createObjectURL(blob);

    this.load.svg('plus',url)
}