🚀 go-pugleaf

Bueno ya encontre algo ^_^.

Es un poco cochinete la solucion porque hay que tirar de javascript 
desde html y en el fichero SVG hay que meterle un peque�o script. Osea 
que no vale para cualquier fichero SVG encuentres por la red, porque 
primero tienes que destriparlo para meterle el script.

No se si se podra encontrar un metodo generico que valga para cualquier 
SVG sin destriparlo. Pero bueno este puede ser util para gente que tenga 
acceso a los SVG para meterles mano.

Bueno aqui teneis la informacion: 
http://digg.com/design/Scaling_SVG_Graphics


Pues eso un parche que funciona (en firefox he probado de momento). Y 
aplicarlo (teniendo acceso al codigo fuente de los ficheros SVG...porque 
sino estas vendido) es facil, se me ocurren miles de formas para 
aplicarlo por ejemplo que la imagen ocupe toda la anchura del navegador 
y cuando se redimensione se encoja (bueno mas o menos eso era mi 
objetivo inicial :P y creo que lo cumple).

Y como nose si se pueden anexar ficheros en la lista, pego un peque�o 
ejemplo de prueba:

------------------------HTML-----------------------------------------
<html>
	<head><title>svg scaling with javascript</title>
	<script type="text/javascript">
		var W3CDOM = (document.createElement && document.getElementsByTagName);
		window.onload 	= init;
		function init(evt) {
			SVGscale(0.5);
		}
		function SVGscale(scale) {
			window.SVGsetDimension(500*scale,500*scale);
			window.SVGsetScale(scale,scale);	
			        if (!W3CDOM) return;
			var box 	= document.getElementById('svgid');
			box.width  	= 500*scale;
			box.height 	= 500*scale;
		}
	</script>
</head>
<body bgcolor="#ffddff">
   <object id="svgid" data="prueba.svg" type="image/svg+xml" 
wmode="transparent" style="overflow: hidden;">
     <param name="src" value="prueba.svg" wmode="transparent" 
type="image/svg+xml">
   </object>
Choose here:
	<a href="#" onclick="SVGscale(0.1);">xsmall</a> or
	<a href="#" onclick="SVGscale(0.25);">small</a> or
	<a href="#" onclick="SVGscale(0.5);">medium</a> or
	<a href="#" onclick="SVGscale(1);">1:1</a> or
	<a href="#" onclick="SVGscale(1.5);">large</a> or ...
<h3>description</h3>
	<a href="http://www.w3.org/TR/SVG/">here more about SVG</a>:
this doc was my only source for this demonstration. especially the part
about scripting is very interesting. this example shows how to rescale
a svg more or less dynamically. there are also methods for scaling
(rotation, transformation) svg dynamically and as an animation. this
doc does the following:
<ol>
	<li>SVG doc is loaded embedded in the HTML, where an init function in 
the SVG file's ECMA-script-part ...</li>
	<li>...
registers functions in the top.* space. therefore, a script in this
HTML file can call those HTML2svg functions which execute something in
the SVG graphic. therefore you have to open the SVG file in a 
texteditor</li>
	<li>the init function of the HTML file resizes the svg to its initial 
dimension</li>
</ol>

<h3>relevant code</h3>
<ul>
<li><h4>SVG, in and right after the header ...</h4></li>
<pre>onload="RunScript(evt)"
...
...
&lt;script type="text/ecmascript"&gt;
&lt;![CDATA[
var g_element;
var SVGDoc;
var SVGRoot;
function RunScript(LoadEvent) {
	top.SVGsetDimension	= setDimension;
	top.SVGsetScale		= setScale;
	SVGDoc			= LoadEvent.target.ownerDocument;
	g_element		= SVGDoc.getElementById("layer1");
}

function setDimension(w,h) {
	SVGDoc.documentElement.setAttribute("width", w);
	SVGDoc.documentElement.setAttribute("height", h);
}

function setScale(sw, sh) {
	g_element.setAttribute("transform", "scale(" + sw + " " + sh +")");
}
]]&gt;
&lt;/script&gt;
</pre>
<li><h4>HTML</h4></li>
<pre>&lt;script type="text/javascript"&gt;
var W3CDOM = (document.createElement &amp;&amp; 
document.getElementsByTagName);
window.onload 	= init;
function init(evt) {
	SVGscale(0.5);
}
function SVGscale(scale) {
	window.SVGsetDimension(640*scale,480*scale);
	window.SVGsetScale(scale,scale);	
         if (!W3CDOM) return;
	var box 	= document.getElementById('svgid');
	box.width  	= 640*scale;
	box.height 	= 480*scale;
}
&lt;/script&gt;
</pre>
</ul>
</body>
---------------------------------------------------------------------


-------------------PRUEBA.SVG----------------------------------------
var SVGDoc;
var SVGRoot;
//var HTMLSVG;
function RunScript(LoadEvent) {
	top.SVGsetDimension	= setDimension;
	top.SVGsetScale		= setScale;
	SVGDoc			= LoadEvent.target.ownerDocument;
	//HTMLSVG			= top.document.getElementById("svgid");
	g_element		= SVGDoc.getElementById("layer1");
}

function setDimension(w,h) {
	SVGDoc.documentElement.setAttribute("width", w);
	SVGDoc.documentElement.setAttribute("height", h);
}

function setScale(sw, sh) {
	g_element.setAttribute("transform", "scale(" + sw + " " + sh +")");
}
]]>
    </script>
   <defs
      id="defs4" />
   <g
      id="layer1"
      transform="translate(0,0)"><!--Importante el Inkscape tiene un bug 
(uhmm hay que reportar) y mueve la capa aleatoriamente//-->
     <rect
        width="50"
        height="500"
        x="0"
        y="0"
 
style="fill:blue;fill-rule:evenodd;stroke:black;stroke-width:0.65028489px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
        id="rect1876" />
     <rect
        width="500"
        height="50"
        x="0"
        y="450"
 
style="fill:blue;fill-rule:evenodd;stroke:black;stroke-width:0.65028489px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
        id="rect1876" />
     <rect
        width="500"
        height="50"
        x="0"
        y="0"
 
style="fill:red;fill-rule:evenodd;stroke:black;stroke-width:0.65028489px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
        id="rect1876" />
     <rect
        width="50"
        height="500"
        x="450"
        y="0"
 
style="fill:red;fill-rule:evenodd;stroke:black;stroke-width:0.65028489px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1"
        id="rect1876" />
   </g>
</svg>
---------------------------------------------------------------------

P.D. Ahora el chiste para mejorar el negocio seria encontrar uno 
generico para no tener que toquetear un SVG y redimensionar cualquier 
SVG que enlaces. Pero este es de momento es util, es sin duda.