Конвертировать SVG в PNG на основе пути изображения - PullRequest
0 голосов
/ 15 апреля 2019

Можно ли преобразовать изображение SVG в формат PNG в угловом проекте?

Я нашел эту библиотеку save-svg-as-png , но для нее требуется идентификаторSVG холст.В то время как в моем коде я отображаю изображение SVG с тегом img:

<img src="path/to/mysvg/mysvg.svg">

Есть ли способ получить доступ к встроенному svg, который находится внутри изображения, или к другой библиотеке, где это возможнопредоставить URL-адрес изображения SVG вместо идентификатора холста?

PS: я нашел несколько библиотек, таких как svg2png и convert-svg-to-png , которыепринимает путь svg в качестве параметра, но они оба зависят от nodejs.

1 Ответ

0 голосов
/ 15 апреля 2019

Работа с angular-svg-icon спасла день.

В моем HTML я отобразил свое изображение svg следующим образом:

<svg-icon #mySVGImg src="path/to/mysvg/mysvg.svg" [svgStyle]="{ 'width.px':140, 'height.px':140 }"></svg-icon>

и в своей машинописи я вызвал метод saveSvgAsPng следующим образом:

import { Component, OnInit, ViewChild, ElementRef } from '@angular/core';
import * as svg from 'save-svg-as-png';
// Other imports

@Component({
  //....
})
export class MyTSPage implements OnInit {

    @ViewChild("mySVGImg", { read: ElementRef }) mySVGImg: ElementRef;

    myConvertMethod() {
        svg.saveSvgAsPng(this.mySVGImg.nativeElement.querySelector("svg"), "pngtest.png");
    }
}

При вызове myConvertMethod метод сохранил новый png-файл с именем pngtest.png

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...