Блог

Главная - Вопросы по программированию - Возможно ли (и как) загрузить строку SVG в фазере 3 вместо того, чтобы загружать ее с пути/URL?

Возможно ли (и как) загрузить строку SVG в фазере 3 вместо того, чтобы загружать ее с пути/URL?

#javascript #svg #phaser-framework

Вопрос:

В моем коде есть несколько 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)
}

Есть ли способ достичь этого (и как)?

Комментарии:

1. сможете ли вы воспользоваться этой библиотекой? github.com/Rich-Harris/svg-parser

2. developer.mozilla.org/en-US/docs/Web/API/DOMParser

3. Ни то, ни другое не решает моего вопроса, поскольку я говорю о конкретном случае использования фреймворка Phaser 3 — phaser.io/phaser3 но спасибо 🙂

Ответ №1:

На вопрос был дан ответ на форуме 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)
}
Метки: ,