FUNDAMENTOS DE ROBÓTICA. Maestro: Ing. Marco Antonio López Paredes REPORTE DE PROGRAMA: ANALIZAR LOS OBSTACULOS DE ROBOTS EN UN TABLERO

Tamaño: px

Comenzar la demostración a partir de la página:

Download "FUNDAMENTOS DE ROBÓTICA. Maestro: Ing. Marco Antonio López Paredes REPORTE DE PROGRAMA: ANALIZAR LOS OBSTACULOS DE ROBOTS EN UN TABLERO"

Germán Acosta Ríos
hace 6 años
Vistas:

1 S UNIVERSIDAD AUTÓNOMA DEL ESTADO DE MÉXICO Centro Universitario UAEM Atlacomulco FUNDAMENTOS DE ROBÓTICA Maestro: Ing. Marco Antonio López Paredes REPORTE DE PROGRAMA: ANALIZAR LOS OBSTACULOS DE ROBOTS EN UN TABLERO INTEGRANTES DE EQUIPO: David González Segundo Nayeli González Quintana Alfredo Marcelo Hipólito Fecha: Marzo 2015 GRUPO: ICO16 GRADO: Octavo Semestre

2 Descripción El siguiente programa consiste en un tablero de 8x8 en el cual se le van a insertar 3 objetos que serán los robots y 6 objetos que serán los obstáculos. El recorrido se realiza de la siguiente manera R Cuando el robot encuentre un obstáculo se agregara un 0 al recorrido, de lo contrario de agregará un 1, el obstáculo puede ser otro robot, el obstáculo generado por el usuario o si esta fuera de rango del tablero. Pseudocódigo Inicio: var robot:array var recorrido: string var recorrido_robot: array procedimiento creartablero: desde i = 0 hasta longitud tablero hacer desde j = 0 hasta longitud tablero.fila hacer var celda i, j procedimiento obstáculo_robot: caso robot: agregarobot(objeto); caso obstáculo: agregaobstaculo(objeto); función agregarobot(objeto) robot.push(objeto)

3 función agregaobstaculo(objeto) obstáculos.push(objeto) procedimiento iniciarrecorrido(robot) var x = robot.posicion_x var y = robot.posicion_y si obstáculo entonces recorrido = recorrido + 1 sino recorrido = recorrido + 0 recorrido_robot.push(recorrido) procedimiento mostrar_recorrido(robot) escribe robot_recorrido[robot_elegido] Código fuente Interfaz gráfica con html y css HTML <!DOCTYPE html> <html> <head> <title>posiciones de robots</title> <link rel="stylesheet" type="text/css" href="css/estilos.css"/> <script type="text/javascript" src="js/funciones.js"></script> </head> <body> <hr> <br> <center> <span class="titulo">posiciones ROBOTS</span>

4 <br> <div id="tablero" class="tablero"></div><br> <select id="tipo"> <option value="obstaculo">obstaculo</option> <option value="robot">robot</option> </select><br><br> Robot a Analizar Recorrido <select id="nrobot"> <option>1</option> <option>2</option> <option>3</option> </select><br> <button onclick="mostrar()">analizar</button><br><br> <div id="res"></div> </center> </body> </html> CSS body background-color: #A9F5F2;.cuadro margin: 0px; padding: 0px;.cuadro > li display: table-cell; font-family:arial; width: 50px; height: 50px; border-style: solid; border-width: 1px;.tablero top:90px; width: 415px; background-color: #FBF5EF; border:solid; max-height: 415px;.titulo color: red; font-size: 30px; font-family: georgia; position: relative; /*left: 200px;*/

5 .obstaculo background-color: blue; color: white; /*font-size: 35px;*/.robot background-color: red; Funciones con javascript //comprueba que la pagina este cargada window.onload = function() alert("listo"); creartablero(); ; //inicia un arreglo de objetos var posiciones = robots:array(), obstaculos:array(), recorridos:array(); //crea una celda al tablero como objeto, con un evento click y como identificador la posicion de la matriz del tablero function crearcelda(x, y) this.li = document.createelement('li'); this.li.id = x+''+y; this.x = x; this.y = y; this.setposicion = function(i,j) this.li.innerhtml = 'x'; ; this.getposicion = function() return this.li.innerhtml; ; this.li.addeventlistener('click', function() var tmp = document.getelementbyid(x+''+y); obstaculo_robot(tmp); //muestrarecorrido(); );

6 //crea un tablero en forma de una matriz cuadrada, la cual contendrá un objeto tipo celda function creartablero() this.tb = document.getelementbyid('tablero'); for(var i=0; i<8; i++) var ul = document.createelement('ul'); ul.setattribute('class','cuadro'); for(var j=0; j<8; j++) var li = new crearcelda(i, j); li.setposicion(i, j); ul.appendchild(li.li); this.tb.appendchild(ul); //aqui se elige si el objeto a introducir es robot u obstaculo function obstaculo_robot(obj) var index=document.getelementbyid('tipo').options.selectedindex; var tipo = document.getelementbyid('tipo').options[index].text; switch (tipo) case 'OBSTACULO': obj.classname='obstaculo'; obj.innerhtml='o'; agregaobstaculo(obj); break; case 'ROBOT': obj.classname='robot'; agregarobot(obj); obj.innerhtml='r'+posiciones.robots.length; for(var i =0; i<8; i++) for(var j =0; j<8; j++) var fila = obj.getattribute('id'); var x = parseint(fila.substring(0,1)); var y = parseint(fila.substring(1)); break; default: break;

7 //agrega un nuevo robot creado al arreglo function agregarobot(o) posiciones.robots.push(o); //agrega los obstaculos a un aggreglo function agregaobstaculo(o) posiciones.obstaculos.push(o); //muestra el recorrido de un robot function mostrar() var index=document.getelementbyid('nrobot').options.selectedindex; var robot = document.getelementbyid('nrobot').options[index].text; var nrobot = (parseint(robot))-1; var fila = posiciones.robots[nrobot].getattribute('id'); var x = parseint(fila.substring(0,1)); var y = parseint(fila.substring(1)); var r = ""; var rb = document.getelementbyid((x-1)+''+y); rb = document.getelementbyid((x-1)+''+(y+1)); rb = document.getelementbyid(x+''+(y+1)); rb = document.getelementbyid((x+1)+''+(y+1));

8 rb = document.getelementbyid((x+1)+''+y); rb = document.getelementbyid((x+1)+''+(y-1)); rb = document.getelementbyid(x+''+(y-1)); rb = document.getelementbyid((x-1)+''+(y-1)); var res = document.getelementbyid('res'); posiciones.recorridos[nrobot] = r; res.innerhtml = r+"<br>\ntodos los Robots creados: <br>"+posiciones.recorridos;

9 Pantallas de salida

Documentos relacionados

Introducción a CSS. Aplicaciones Web (2016/17) Jesús Arias Fisteus. Aplicaciones Web (2016/17) Introducción a CSS 1

Introducción a CSS. Aplicaciones Web (2016/17) Jesús Arias Fisteus. Aplicaciones Web (2016/17) Introducción a CSS 1 Introducción a CSS Jesús Arias Fisteus Aplicaciones Web (2016/17) Aplicaciones Web (2016/17) Introducción a CSS 1 Parte I Introducción a CSS Aplicaciones Web (2016/17) Introducción a CSS 2 Hola Mundo!