Вы находитесь на странице: 1из 6

rocessingJS

Figuras

rect(x, y, w, h)
(Se abre en una ventana nueva)

ellipse(x, y, w, h)


triangle(x1, y1, x2, y2, x3, y3)


line(x1, y1, x2, y2)


point(x, y)


arc(x, y, w, h, start, stop)


bezier(x1, y1, cx1, cy1, cx2, cy2, x2, y2)


quad(x1, y1, x2, y2, x3, y3, x4, y4)


image(image, x, y, width*, height*)

Ve
también: ellipseMode, rectMode, imageMode, strokeCap, bezierPoint, be
zierTangent, curve, curvePoint, curveTangent, curveTightness

Figuras complejas

beginShape() / endShape() / vertex()


curveVertex()


bezierVertex()

Ve también: strokeJoin, curveTightness

Colores
 background(r, g, b)Establece el color del fondo
 fill(r, g, b)Establece el color de relleno para las
figuras
 noFill()Desactiva el relleno para las figuras
 stroke(r, g, b)Establece el color del contorno de las
figuras
 strokeWeight(thickness)Cambia el grosor de las líneas y
de los contornos
 noStroke()Desactiva los contornos de las figuras
 color(r, g, b)Almacena un color en una variable
 blendColor(c1, c2, MODE)Mezcla dos colores
 lerpColor(c1, c2, amount)Encuentra el color entre dos
colores
Ve
también: colorMode, red, green, blue, alpha, hue, saturation, brightne
ss

Texto
 text(text, x, y)Escribe algo de texto
 textFont(font, size*)Cambia la fuente del texto
 textSize(size)Cambia el tamaño del texto
Ve
también: textWidth, textAscent, textDescent, textLeading, textAlign

Transforma
 rotate(angle)Rota las figuras por un ángulo
 scale(amount)Escala las figuras en ambas dimensiones
 translate(x, y)Traslada las figuras por un
desplazamiento
Ve también: pushMatrix/popMatrix, resetMatrix, printMatrix

Entorno
 width / heightEl
tamaño del lienzo
 draw = function(){ }Llamada repetidamente durante la
ejecución de un programa
 playSound(sound)Reproduce uno de los sonidos
permitidos
Ve
también: Program.assertEqual, Program.restart, frameRate(fps), frameC
ount, loop, noLoop

Ratón
 mouseX, mouseYCoordenadas actuales del ratón
 pmouseX, pmouseYCoordenadas pasadas del ratón
 mouseButtonCuál botón está presionado
 mouseIsPressedSi el ratón está siendo presionado
 mouseClicked = function(){ }Se llama cuando se hace clic
con el ratón
 mousePressed = function(){ }Se llama cuando se presiona
el ratón
 mouseReleased = function(){ }Se llama cuando se suelta
el ratón
 mouseMoved = function(){ }Se llama cuando se mueve el
ratón
 mouseDragged = function(){ }Se llama cuando se arrastra
el ratón
 mouseOver = function(){ }Se llama cuando se mueve el
ratón sobre el lienzo
 mouseOut = function(){ }Se llama cuando se mueve el
ratón fuera del lienzo

Teclado
 keyNúmero que representa cuál tecla está
presionada
 keyCodeRepresenta cuando se pulsa una tecla
especial
 keyIsPressedVerdadero si una tecla está siendo
presionada, falso si no
 keyPressed = function(){ }Se llama cuando se presiona
un tecla
 keyReleased = function(){ }Se llama cuando se suelta
una tecla
 keyTyped = function(){ }Se llama cuando se aprieta una
tecla

Matemáticas
 random(low, high)Genera un número aleatorio
 dist(x1, y1, x2, y2)Calcula la distancia entre dos
puntos
 constrain(value, min, max)Restringe el valor entre min y
máx
 min(num1, num2)Regresa el mínimo de dos números
 max(num1, num2)Regresa el máximo de dos números
 abs(num)Toma el valor absoluto de un número
 log(num)Toma el logaritmo de un número
 pow(num, exponent)Eleva un número a un exponente
 sq(num)Eleva un número al cuadrado
 sqrt(num)Saca la raíz cuadrada de un número
 round(num)Regresa el entero más cercano
 ceil(num)Regresa el entero más cercano de mayor o
igual valor
 floor(num)Regresa el entero más cercano de menor o
igual valor
 PVector(x, y)Un objeto que describe un vector de dos
dimensiones
Ve
también: mag, exp, map, norm, lerp, noise, noiseDetail, Random.nextGau
ssian

Trigonometría
 cos(degrees)Toma
el coseno de un ángulo
 sin(degrees)Toma el seno de un ángulo
 tan(degrees)Toma la tangente de un ángulo
Ve también: acos, asin, atan, atan2, radians, degrees, angleMode

Fecha y hora
 day() / month() / year()Fecha actual
 hour() / / second()Hora actual
minute()
 millis()Milisegundos transcurridos desde que inició
el programa

Depurar
 debug(arg1, arg2, ...)Imprime a la consola de
desarrollador de tu explorador
 println(data)Imprime una nueva línea a la consola del
lienzo
 print(data)Imprime a la consola del lienzo

JavaScript
 var drawWinston = function(){ }Define una nueva función
 var array = [0, 1, 2, 3, 4]Hace un arreglo de 5
números
 if (x < 20){ }Solo ejecuta el código si cierta
condición es verdadera
 for (var i = 0; i < 8; i++){ }Repite el código un número
determinado de veces
 while (x < 250){ }Solo ejecuta el código mientras
cierta condición sea verdadera

Nuestra documentación no cubre las muchas formas de


usar JavaScript. Aprende más en:

 Mozilla Developer Network: Guía de JavaScript


 Tutorial JavaScript W3Schools
Basado en: la referencia de ProcessingJS. Bajo la
licencia: Licencia CC BY-NC-SA 2.0.
 Preguntas
 Sugerencias y agradecimientos
Los mejores Recientes
Publicar una sugerencia o un agradecimiento.

¿Sabes inglés? Haz clic aquí para ver más


discusiones en el sitio en inglés de Khan Academy.
 Todo el código es propiedad de su respectivo
autor y está disponible bajo la siguiente
licencia: Licencia MIT
 Todo lo que no sea código (como escritos,
dibujos, imágenes, etc.) también son propiedad del
su respectivo autor y está disponible bajo la
siguiente licencia: Licencia de reconocimiento de
Creative Commons
 Para obtener más información por favor
ve: Términos del servicio