elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado: (TUTORIAL) Aprende a emular Sentinel Dongle By Yapis


+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web (Moderador: #!drvy)
| | |-+  javascript/canvas|| hacer un triangulo y darle la medida de los catetos
0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] Ir Abajo Respuesta Imprimir
Autor Tema: javascript/canvas|| hacer un triangulo y darle la medida de los catetos  (Leído 3,314 veces)
humberto ml

Desconectado Desconectado

Mensajes: 1


Ver Perfil
javascript/canvas|| hacer un triangulo y darle la medida de los catetos
« en: 21 Junio 2016, 22:11 pm »

hola necesito ayuda en este codigo lo que pasa es que quiero que se pueda hacer el triangulo pero hay un error si pones 50 y 0 se hace un triangulo y no debe ser asi debe ser una linea y no se  como resolver eso bn GRACIAS.
<html>
<head>
<title>Script para triángulos</title>
</head>

<body>
<form name="calc">
<input type="text" name="n1" value="50">
<input type="text" name="n2">
<input type="button" value="calcular"  onclick="calcular()">
<canvas id='canvas1' width="600" height="250" style= "border: 1px solid #CCF" >Tu navegador no soporta htmal5</canvas>
</form>
<script type= "text/javascript">
function calcular(){
var n1 =document.calc.n1.value;
var n2 =document.calc.n2.value;
var c=document.getElementById ('canvas1');
var r= c.getContext ('2d');
r.beginPath();
r.moveTo(n2,10);
r.lineTo(10,10);
r.lineTo(10,n1);
r.closePath();
r.stroke();
}
</script>
</body>
</html>


En línea

WHK
Moderador Global
***
Desconectado Desconectado

Mensajes: 6.589


Sin conocimiento no hay espíritu


Ver Perfil WWW
Re: javascript/canvas|| hacer un triangulo y darle la medida de los catetos
« Respuesta #1 en: 24 Junio 2016, 17:38 pm »

Hola, eso lo puedes hacer solo con css: https://css-tricks.com/examples/ShapesOfCSS/

Código:
#triangle-up { 
width: 0;
height: 0;
border-left: 50px solid transparent;
border-right: 50px solid transparent;
border-bottom: 100px solid red;
}

Acá hay un generador de triangulos: http://apps.eky.hk/css-triangle-generator/

Acá la explicación: http://codepen.io/chriscoyier/pen/lotjh


En línea

Páginas: [1] Ir Arriba Respuesta Imprimir 

Ir a:  

Mensajes similares
Asunto Iniciado por Respuestas Vistas Último mensaje
Ayuda con bugs en PONG (html5<canvas> + javascript)
Desarrollo Web
pony012 0 2,477 Último mensaje 7 Julio 2010, 06:41 am
por pony012
[Dudas] javascript y Canvas
Desarrollo Web
Valkyr 1 2,370 Último mensaje 9 Marzo 2012, 19:38 pm
por Valkyr
javascript canvas precarga de imagenes
Desarrollo Web
patilanz 0 1,659 Último mensaje 8 Abril 2014, 23:35 pm
por patilanz
Sacar datos de un canvas con javascript
Desarrollo Web
Ori-chan 3 2,750 Último mensaje 24 Mayo 2014, 15:17 pm
por Ori-chan
Ayuda con javascript - Sprite canvas
Desarrollo Web
SrTrp 2 2,903 Último mensaje 3 Julio 2017, 23:35 pm
por SrTrp
WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines