8 meneos

Planea por Marte con Javascript y solo 256 Bytes  imagen

El potencial de Javascript y <canvas /> se pone de manifiesto en esta demostración de tan solo 256 bytes en el que mediante el uso de data:image nos permite simular que planeamos sobre la superficie de Marte. Via: www.anieto2k.com/2008/10/18/planea-por-marte-con-javascript-y-solo-256

negativos: 2   usuarios: 7   anónimos: 1  
compartir:  twitter  facebook  tuenti  
  1. #1   No me acaba de convencer la categoria en la que lo puse, si alguien cree que estaría mejor en otra, que lo cambie.
    8  votos: 0   link
    el 20-10-2008 18:22 UTC por Pakipalla Pakipalla
  2. #2   ¿Eso es el potencial de javascript? Menuda basura.
    Yo te enseñare el potencial de Javascript:
    blog.nihilogic.dk/

    Juegos:
    wolfsestein + flickr
    www.nihilogic.dk/labs/wolfenflickr/
    o el de toda la vida
    www.nihilogic.dk/labs/wolf/

    Ajedrez
    www.nihilogic.dk/labs/chess/

    etc...
    18  votos: 3   link
    el 20-10-2008 18:29 UTC por acimut acimut
  3. #3   Hombre... supongo que lo del potencial es porque ésa demo es una escueta y única linea de código:

    ""S=Math.sin;with(R.getContext('2d'))for(fillRect(0,0,300,150,drawImage(R,9,2,282,148,0,3,300,150),fillStyle='rgba(99,0,42,.01)'),a+=x=88;x--;fillRect(x*4,75+S(a+x/27+S(x/9)*S(a*2-x/15))*20,4,3))fillStyle='#c60'",a=9)""
    8  votos: 0   link
    el 20-10-2008 18:37 UTC por Pakipalla Pakipalla
  4. #4   No se donde ves tu Marte?¿
    9  votos: 0   link
    el 20-10-2008 18:38 UTC por --40740-- --40740--
  5. #5   #0 erronea

    No hace uso de data:image, hace uso del objeto CANVAS (que raro, es la segunda vez que hago un comentario diciendo lo mismo: meneame.net/story/crea-arma-partir-de-tu-nombre#comment-23 )

    PD: además, se puede mejorar www.abrahamjoffe.com.au/ben/canvascape/
    10  votos: 0   link
    el 20-10-2008 19:23 UTC por --29006-- --29006--
  6. #6   #5 De la misma notícia:

    Jose me avisa de que no usa Data:URL sinó que usa data:image mediante el uso de toDataURL() de canvas. Además nos muestra una versión desarrollada por él mismo del simulador marciano un poco menos ofuscado que el ejemplo anterior.

    Por cierto meneame.net/notame/bull3t/69641

    Si no la envié en su momento es porque me pareció irrelevante.
    28  votos: 1   link
    el 20-10-2008 19:25 UTC por --761-- --761--
  7. #7   #6 me da igual lo que ponga en la noticia, lo que veo en el HTML es: <canvas id=R>

    Además, el método toDataURL (del objeto canvas) sirve para obtener un link como el que tú dices. Este código no lo usa por ningún lado.

    Lo que más se le acerca a lo que tú dices es que presiones con el botón derecho sobre la imagen y le des a "Ver imagen".

    PD: toDataURL no está soportado por IE ni Safari
    10  votos: 0   link
    el 20-10-2008 19:28 UTC por --29006-- --29006--
  8. #8   #7 ¿Para ti, el tag <BODY> no es HTML? Porque el código javascript que genera ésa imagen es ahi donde está... de hecho, lo he puesto en #3
    8  votos: 0   link
    el 20-10-2008 20:55 UTC por Pakipalla Pakipalla
  9. #9   #5 claro que se podrá mejorar, pero no compares una sola y única linea de javascript con las 650 que ocupa la libreria (canvas.js de Google) usada por el de tu ejemplo... son ganas de buscarle los tres pies al gato.
    8  votos: 0   link
    el 20-10-2008 21:04 UTC por Pakipalla Pakipalla
  10. #10   #8, WTF?

    Vamos a ver, este código javascript no usa data/image para nada. Lo que pasa es que cuando haces click derecho en la imagen con firefox y pulsas sobre "ver imagen", firefox te crea un link del tipo data/image.

    Después, tampoco usa el método toDataURL(). Este método, si buscas en google, verás que devuelve un data/image como el de antes. De nuevo, te repito que este código no usa para NADA este método.

    Te voy a explicar un poco el tema:

    Este código tiene un objeto HTML llamado canvas (definido en el estandar HTML 5) el cual es soportado por Safari, Firefox, Opera y Chrome entre otros.

    En cambio, no está soportado por Internet Explorer. Existe un hack desarrollado por un programador que más tarde se puso a trabajar en google (y google se hizo propietario de ese hack) para que Internet Explorer convierta los objetos canvas en gráficos vectoriales SVG (los cuales son compatibles con Internet Explorer, pero tienen menor potencia). Es ese excanvas.js que has nombrado antes (por lo tanto, no lo tengas en cuenta ;) ).

    También he de decirte que cualquier código javascript puedes escribirlo en una mísera línea (tal y como han hecho en tu código). Por cierto, lo que hace impresionante un código no es su mayor o menor número de líneas, sino la tecnología que hay por debajo.
    10  votos: 0   link
    el 20-10-2008 21:26 UTC por --29006-- --29006--
  11. #11   #10 : pero si todo eso no te lo discuto... en realidad, lo que me pareció interesante fue el poder crear ése efecto con tan poco código (256 bytes, una linea de 216 caractéres), nada más.
    Y si, ya sé que cualquier código Javascript lo puedes poner en una sola linea, pero ¿será siempre "mísera" y ocupará menos de 1 KB como éste?

    Lo que es erróneo puede que séa la entradilla (C&P de aNieto2k), pero no veo porque haya que descartar la noticia solo por éso.
    8  votos: 0   link
    el 21-10-2008 02:19 UTC por Pakipalla Pakipalla
comentarios cerrados

menéame