Incorporar SVG em Xul

Question

Eu quero incorporar SVG em Xul. Eu tentei usar o este tutorial que requer a coleta do código SVG no aplicativo Xul e funciona, mas isso não está limpo. Quero manter os arquivos SVG e XUL separados; mais, gostaria de usar um arquivo CSS separado para a parte SVG, algum exemplo de como podemos fazer isso?

Answer 1

Você pode usar o Xul-Overlays:

1) Declare a sobreposição no topo do seu arquivo XUL:

<?xul-overlay href="africa.svg"?>

2) Defina um elemento SVG de contêiner vazio dentro do arquivo XUL e atribua o mesmo ID a ele quanto ao elemento SVG principal no arquivo incluído.

<box>
  <svg:svg id="mapa" />
</box>

3) Lembre -se de usar um espaço de nome separado para a parte SVG (consulte SVG: SVG acima) e declare -o.

<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
    xmlns:svg="http://www.w3.org/2000/svg">

4) Faça do seu arquivo SVG uma sobreposição, colocando uma declaração de sobreposição ao redor (receio que você precise fazer isso).

<overlay xmlns="http://www.w3.org/2000/svg">
 <svg id="mapa">
  ...
</overlay>

Sobre os arquivos CSS separados: basta criar dois deles e incluí -los onde quiser - mesmo na sobreposição do SVG.

Você pode querer olhar para dentro de um exemplo de funcionamento - um pequeno teste de geografia que eu criei anos atrás e atualizei ontem para fazê -lo funcionar novamente nos Firefoxes atuais:

http://open-projects.net/~nico/countryquiz/

Basta olhar para os arquivos de origem!