Jsanca - Blog

Entradas

Mostrando las entradas de junio, 2013

Canvas - Dibujando poligonos con Javascript (Herencia y pseudo polimorfismo)

En el ejemplo anterior definimos de una manera muy basica varios poligonos, bueno decidi buscar la manera de pintarlos en un lienzo (canvas) y aqui el resultado (ojo necesitas un browser que soporte HTML 5) Lo primero el HTML <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Figure Example</title> </head> <body> <canvas id="myCanvas" width="300" height="300" style="border: solid 1px black"></canvas> <script type="text/javascript" src="figure.js"></script> </body> </html> Note q al javascript le hemos dado el nombre de figure.js Seguidamente el codigo con el canvas, es bastante sencillo para mas detalles busque la documentacion de cada metodo. /** * User: jsanca * Date: 6/12/13 * Time: 11:10 PM */ // Define

Figuras, poligonos, herencia y polimorfismo en Javascript

Actualmente estoy ayudandole alguien muy especial con el aprendizaje de Javascript y OOP. Para tal objetivo le he asignado varios problemas que debe resolver con Herencia y ese pseudo poliformismo que tiene Javascript, pues nada me he inventado la primera parte de lo que seria la definicion de figuras con Javascript tales como un Cuadrado, Triangulo, Circulo, etc; por ahora el pintado solo muestra en la consola el area y algunos datos mas de la figura, pero la idea seria usar canvas en la segunda parte para imprimir las figuras y en el tercera parte algun mecanismo para obtener la informacion de las figuras del usuarios, pues nada aqui el codigo: /** * User: jsanca * Date: 6/12/13 * Time: 11:10 PM */ // Defines a point function Point (x, y) { this.x = x; this.y = y; } // Point // Basic definition of a Figure, just a point in nowhere. function Figure (point, name) { this.point = point; this.name = name; this.render = function () { console.log(&