🚀 go-pugleaf

No lo s� seguro, pero quiz� con css???

ravenheart escribi�:
> No lo s� seguro, pero quiz� con css???
Bueno no es mi fuerte los css, pero he andado probando y buscando por 
internet a ver si era la soluci�n, pero nada he conseguido los mismos 
resultados que toqueteando los tags <object> o <embed> a mano, es decir 
barras de desplazamiento pero el dicho fichero.svg no se ha encogido, ni 
se ha agrandado.

No obstante gracias :) , por lo menos me diste otro camino que no se me 
hab�a ocurrido para atacar el problema.

Es curiosa la situaci�n, porque un cacho flash si se redimensiona pero 
el svg que deber�a ser tambi�n posible, no se consigue....pues como no 
lo remedie los del W3C mal vamos xD.

Por cierto, �no creo que tenga nada que ver que el fichero de prueba es 
un svg generado con inkscape (nada un cacho rect�ngulo y un par de 
c�rculos), aunque guardado eso si como "svg plano" o est�ndar?


�Existe alguna forma de dirigirse a la W3C para plantearle la duda? Es 
por recurrir ya a las altas esferas, les he visto que tienen una lista 
de correo para cada secci�n...no se supongo que deber�a probar por ah�.

Gracias y ad�os.

El Tue, 03 Oct 2006 03:50:11 +0200, MD <mdcid@yahoo.es> escribi�:
>Buenas.
>	<img src="fichero.png" width="50%" height="50%" />

Eso muestra una imagen que tenga el 50% del ancho de p�gina (o espacio
libre contenedor) y el 50% de alto de p�gina (o espacio libre
contenedor). Creo que si quieres que sea el 50% del tama�o original
vas por mal camino.

>Hacer esto en plan:
>	<object type="image/svg+xml" data="fichero.svg" width="50%" height="50%" />
>Lleva irremisiblemente a tener un bonito cuadro enmarcado en barras de 
>desplazamiento, pero nada de una imagen.svg encogida al 50%.

�Has mirado a ver si dicho objeto tiene propiedades que puedan ser
modificadas? Como los object que encapsulan objetos de Java.. Quiz�
ser�a un buen comienzo.

>�Alguien sabe como realizar esta tarea? Los motivos es para poner en mi 
>blog personal y cutrecillo ;) un par de im�genes en svg en el men� y tal.

Entonces usa png :) no cuesta nada convertirlo con gimp o imagemagick
y tambi�n te guardar� transparencias de 8 bits si no lo guardas como
imagen paletizada.

>Gracias y adi�s.

Hasta pronto y suerte.

-- 
�scar Javier Garc�a Baudet
LinaresDigital
http://redstar.linaresdigital.com/

Como te dice Oscar Garc�a por ah� abajo, los % se refieren al tama�o de 
la p�gina (o de la capa en la que est�s). Has probado a poner el tam�o 
directamente en pixeles??
> Bueno no es mi fuerte los css, pero he andado probando y buscando por 
> internet a ver si era la soluci�n, pero nada he conseguido los mismos 
> resultados que toqueteando los tags <object> o <embed> a mano, es decir 
> barras de desplazamiento pero el dicho fichero.svg no se ha encogido, ni 
> se ha agrandado.
> 
> No obstante gracias :) , por lo menos me diste otro camino que no se me 
> hab�a ocurrido para atacar el problema.
> 
> Es curiosa la situaci�n, porque un cacho flash si se redimensiona pero 
> el svg que deber�a ser tambi�n posible, no se consigue....pues como no 
> lo remedie los del W3C mal vamos xD.
> 
> Por cierto, �no creo que tenga nada que ver que el fichero de prueba es 
> un svg generado con inkscape (nada un cacho rect�ngulo y un par de 
> c�rculos), aunque guardado eso si como "svg plano" o est�ndar?
> 
> 
> �Existe alguna forma de dirigirse a la W3C para plantearle la duda? Es 
> por recurrir ya a las altas esferas, les he visto que tienen una lista 
> de correo para cada secci�n...no se supongo que deber�a probar por ah�.
> 
> Gracias y ad�os.

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.

Ultimamente est� muy de moda esto del CSS y, si bien el HTML original 
era una solemne guarrer�a por eso de mezclar los datos con los estilos, 
cuando me he metido a hacer algo en CSS lo he encontrado absolutamente 
anti-intuitivo; hay que dar mil vueltas para hacer cualquier tonter�a 
simpl�sima - v�ase, para centrar una capa de menor anchura dentro de 
otra, creo que el m�todo est�ndar (al menos, seg�n he visto, la �nica 
manera de que funcione en todos los navegadores) es hacer algo como:
#capa_centrada
{
	left = 50%;
	left-margin = -mitad_del_tam_de_la_capa_en_pixeles;
}
que es una chapuza, entre otras cosas porque hay que conocer previamente 
el tama�o (puede ser un problema si hay varias imagenes y quieres hacer 
algo que funcione con todas), y, �que es eso de un margen negativo? �y 
eso de que una capa, a base de margin, pueda dibujar mas all� de su 
limite izquierdo/derecho?

En definitiva, que estoy harto de escuchar alabanzas y a mi me parece 
una gran mierda.
�Soy el �nico que piensa as�?

El Thu, 05 Oct 2006 23:14:22 +0100, ravenheart
<ravenheart.j@gmail.com> escribi�:
>simpl�sima - v�ase, para centrar una capa de menor anchura dentro de 
>otra, creo que el m�todo est�ndar (al menos, seg�n he visto, la �nica 
>manera de que funcione en todos los navegadores) es hacer algo como:
>#capa_centrada
>{
>	left = 50%;
>	left-margin = -mitad_del_tam_de_la_capa_en_pixeles;
>}
>que es una chapuza, entre otras cosas porque hay que conocer previamente 
>el tama�o (puede ser un problema si hay varias imagenes y quieres hacer 
>algo que funcione con todas), y, �que es eso de un margen negativo? �y 
>eso de que una capa, a base de margin, pueda dibujar mas all� de su 
>limite izquierdo/derecho?

Hombre, me parece una cochinada de CSS :)

<div id="Layer1"
style="background-color:red; position:absolute; left:154px; top:65px;
width:828px; height:472px; text-align: center;"><div id="Layer2"
style="background-color:blue; position:relative; width:262px;
height:189px; z-index:2"></div>

Como puedes ver, con un simple "text-align: center;" centrar�s el
contenido de una capa, incluida otra capa que introduzcas en su
interior.

>En definitiva, que estoy harto de escuchar alabanzas y a mi me parece 
>una gran mierda.
>�Soy el �nico que piensa as�?

Hombre, si lo usas para maquetar capas... yo no uso capas, evito
usarlas. Las uso para lo justo y necesario (men�s, bocadillos y poco
m�s).

Yo uso la potencia de CSS para definir el formato del contenido del
documento y no su disposici�n.

Un saludo.

-- 
�scar Javier Garc�a Baudet
LinaresDigital
http://redstar.linaresdigital.com/

El Thu, 05 Oct 2006 23:14:22 +0100, ravenheart
<ravenheart.j@gmail.com> escribi�:
>#capa_centrada
>{
>	left = 50%;
>	left-margin = -mitad_del_tam_de_la_capa_en_pixeles;
>}

P.D.: Este grupo se dedica a la programaci�n (en concreto bajo linux).
Tu consulta es sobre dise�o, as� que el grupo que mejor se ajusta a
tus necesidades, y donde te podr�n discutir mejor sobre el tema ser�:
es.comp.infosistemas.www.paginas-web

Un saludo.

-- 
�scar Javier Garc�a Baudet
LinaresDigital
http://redstar.linaresdigital.com/

> Hombre, me parece una cochinada de CSS :)
> 
> <div id="Layer1"
> style="background-color:red; position:absolute; left:154px; top:65px;
> width:828px; height:472px; text-align: center;"><div id="Layer2"
> style="background-color:blue; position:relative; width:262px;
> height:189px; z-index:2"></div>
Creo recordar que esto no funciona en explorer. Pero bueno, ser� cosa de 
la implementaci�n as� que supongo que no cuenta. Probar� a ver.

 > P.D.: Este grupo se dedica a la programaci�n (en concreto bajo linux).
 > Tu consulta es sobre dise�o, as� que el grupo que mejor se ajusta a
 > tus necesidades, y donde te podr�n discutir mejor sobre el tema ser�:
 > es.comp.infosistemas.www.paginas-web

Ya, si tampoco es que tenga demasiado inter�s, pero como ha salido el 
tema del HTML/CSS he aprovechado, que hace tiempo que me ronda la mente 
la cuesti�n "�Es el CSS una mierda o soy yo que no me entra?"

En fin,

saludos.

Entre otras cosas, ravenheart tuvo a bien escribir:

> Creo recordar que esto no funciona en explorer.

Pues culpa del Explorer, no del CSS (aunque dar posiciones absolutas en
p�xeles no suele ser muy buena idea).

> [...] hace tiempo que me ronda la mente
> la cuesti�n "�Es el CSS una mierda o soy yo que no me entra?"

Lo normal es que sea una mierda el soporte CSS que tengan los navegadores,
no el CSS en s�. O sea, que si un c�digo deber�a funcionar seg�n la
especificaci�n CSS y no lo hace, la culpa es del navegador, �no?

-- 
     Ignacio __ Fern�ndez Galv�n
            / /\
Linux user / /  \  PGP Pub Key
#289967   / / /\ \  0x01A95F99
         / / /\ \ \
   http://djelibeibi.unex.es
       /________\ \ \
jellby \___________\/ yahoo.com

> Lo normal es que sea una mierda el soporte CSS que tengan los navegadores,
> no el CSS en s�. O sea, que si un c�digo deber�a funcionar seg�n la
> especificaci�n CSS y no lo hace, la culpa es del navegador, �no?

S�, desde luego. Quiz� el problema est� en que no me he estudiado 
bastante el est�ndar :-p