JSARtoolkit: Realidad Aumentada para la Web

6 de enero de 2011 · Tutoriales · 29684 Visitas ·

JSARtoolkit es la nueva librería que nos da la posibilidad de desarrollar Realidad Aumentada con JavaScript y proyectarla mediante un archivo de Flash (swf).

Yusuke Kawasaki, el creador, presentó  JSARtoolkit en el 2009 y desde la fecha no ha realizado ninguna actualización. Es por eso que la librería aún está en fase alpha, ¡pero no es impedimento para nosotros! Podemos intentar realizar algunos experimentos en el foro de la comunidad. Necesitamos muchas ideas y unos cuantos desarrolladores con ganas de estropear, arreglar y complementar códigos.

(Postdata: Perdonen la resolución de mi cámara)

Luego de la publicación de este post crearé un hilo de conversación en el foro para los interesados en realizar experimentos con JavaScript. Para que tengan una idea de lo complicado que es el asunto (relativamente fácil) les dejo los códigos que trabajé para visualizar las letras:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
<script type="text/javascript" src="../js/swfobject.js"></script>
<script type="text/javascript" src="../js/jsar.js"></script>
<script type="text/javascript"><!--
 
    var jsar;
    var MARKER_CODE  = [ '../code/hiro.pat', '../code/emiliusvgs.pat', ];
    var MARKER_TITLE = [ 'Aumentality', "Emiliusvgs" ];
 
    function ondetected ( result ) {
        jsar.clearHTML();
        if ( ! result.detected ) return;
 
        var base = jsar.getHTML();
        for( var i=0; i<result.markers.length; i++ ) {
            var marker = result.markers[i];
 
 
            var div = document.createElement( 'div' );
            div.style.fontFamily = 'Verdana';
            div.style.position   = 'absolute';
 
            div.style.color = "green";
 
            var minx = marker.getLeft();
            var miny = marker.getTop();
            var maxy = marker.getBottom();
            var size = Math.floor( (maxy - miny) / 6 );
            div.style.left     = (minx+size*1)+'px';
            div.style.top      = (miny+size*1)+'px';
            div.style.fontSize = (size*1)+'px';
 
 
            var title = MARKER_TITLE[marker.codeid];
            var txt = document.createTextNode( title );
            div.appendChild( txt );
            base.appendChild( div );
        }
    }
 
    function init () {
        jsar = new JSAR( 'jsar_here' );
        jsar.drawMarkerRect = false;
        jsar.onDetected = ondetected;
        jsar.onLost     = ondetected;
        jsar.captureX   = 320;
        jsar.captureY   = 240;
        jsar.displayX   = 640;
        jsar.displayY   = 480;
        jsar.init();
        jsar.setMarker( MARKER_CODE );
    }
 
    window.onload = init;
--></script>





Comentarios

21 Comentarios para “JSARtoolkit: Realidad Aumentada para la Web”


  1. Diego Arcila dice:

    Excelente!!!.

    Con esta nueva libreria podemos hacer cosas muy interesantes. espero que su creador pueda sacar adelante esta libreria y nosotros como comunidad poder darle fuerza y desarrollar nuevas cosas.

  2. Francisco dice:

    WOW Genial, esperaré ancioso el hilo en el foro, aprovecho de ver si me puedes dar una mano con un problemita que me genera al subirlo a la web http://foro.aumentality.com/topic/no-se-logra-ver-en-servidor he ahí full el problema.
    Saludos!

  3. Edison dice:

    Amigo donde puedo hacer los archivos .patt que necesito por que el .pat no lo reconoce ayudame con eso por favor

  4. que interesante software, vamos a trabajarlo haber que tal es.

  5. Francisco dice:

    Hola tengo una pregunta, como descargo la libreria con el SVN tortoise si me pide username y password?

    Gracias

  6. ivanchoff dice:

    hola como descargo la libreria para empezar a testear!!!!

  7. othan dice:

    si buenas

    soy nuevo en el tema de la realidad aumentada pero tengo muy buenas bases de js el ejemplo lo entiendo un poco pero que tengo una gran duda como lo compilo, lo que alcanzo a entender es que se debe ejecutar cuando se habra la ventana pero cual ventana.

    agradeceria si alguien me echa una manito o/u en donde puedo leer mas del tema.

    gracias

  8. tyler dice:

    hola amigos..y en ésta libreria se pueden visualizar modelos 3d e imagenes 2d también??
    alguien ya lo ha hecho?

  9. Miguel dice:

    Hola, necesito de su amable colaboración para encontrar mas información sobre esta librería, agradecería todas las fuentes que pudieras compartir.

  10. Mr_web dice:

    Excelente Articulo!,
    estoy trabajando en un proyecto Universitario, la idea es manejar RA sobre dispositivos moviles con java (J2ME), queremos una aplicacion abierta y adaptable a distintas plataformas de Dispositivos Moviles, estoy apenas iniciando en el tema, aun no se como logro insertar etiquetas como las muestras en el video o como las maneja layar sobre el video, que libreria podria utilizar, con NiArtoolkit logro esto? que sugerencias puedes darme? …..agradezco tus comentarios…=)

  11. jaime villamarin dice:

    Hola, se que eres un duro en RA y necesito hacer un ejemplo para la u, requiero que con una marca se me levante un video, pero ojala desde una pagina web, o sino pues desde el builar o un pc normal.

    agradezco tus comentarios

  12. regio189 dice:

    hola, excelente presentacion hiciste, tengo el siguiente proyecto de una pagina web de turismo pero quiero aplicarle realidad aumentada pero tengo las siguientes dudas ya que aqui no tengo a quien preguntarle y que me de una respuesta apropiada, 1.- se puede aplicar realidad aumentada a objetos en movimiento? 2.- a que distancia maxima se puede detectar un objeto fijo o en movimiento para usar la realidad aumentada? 3.- que aplicacion crees conveniente que deba usar para el detectar objetos e incluso personas a distancia?, espero tus comentarios ya sea por este medio o enviame un mail por favor, es importante y te lo agradezco mucho

    • ZoiX dice:

      1. No te entiendo muy bien :/ ¿Como por ejemplo a un animal?
      2. Depende de tu cámara web :P
      3. Bueno, en ese caso, ya que mencionas a personas, entonces recomiendo Kinect y AS3NUI.

      Saludos.

  13. Diego dice:

    Hola, me gustaría saber como visualizar modelos 3d con el código jsartoolkit.
    me seria de mucha ayuda, su colaboración..

    saludos.

  14. javier dice:

    buenos dias colega me interesa hacerte unas preguntas sobre el tema de realidad aumentada por skype si me puedes ayudar te lo agradeceria demasiado


Deja tu Comentario