1
resposta

Abrir Svg pelo JavaScript

Tenho um arquivo SVG com um código imenso, mas quero abrir esse arquivo em uma div no html, porém não como img, pois não consigo manipular (quero fazer com que na página, o usuário possa alterar as cores do desenho ). Uma solução seria colar o código svg direto no html, porem fica feio, com mais de 500 linhas. Tem como no javascript, eu possa inserir esse código na div do html? Teria que ser de forma que inserisse todo código svg de uma vez. Tentei pelo InnerHTML, porém ao colar o cogio, ao quebrar a linha, não identifica o resto como texto. Tem alguma maneira de inserir o código apenas lendo o aquivo?

1 resposta

Fala Ludgero, beleza?

Porque tu não usa a tag img e importa o SVG?

Daí na tag tu coloca um ID e usa ele pra manipular a cor da imagem.

HTML:

<img src="arquivo.svg" id="arq" /> 

Javascript:

let arq = document.querySelector("#arq"); 

arq.style.color = "codigo_da_cor_selecionada_pelo_cliente"; 

Essa é a única forma que vejo de omitir o código do arquivo .svg