Skip to content
GitLab
Explore
Sign in
Primary navigation
Search or go to…
Project
R
Robot
Manage
Activity
Members
Labels
Plan
Issues
Issue boards
Milestones
Wiki
Requirements
Code
Merge requests
Repository
Branches
Commits
Tags
Repository graph
Compare revisions
Snippets
Locked files
Build
Pipelines
Jobs
Pipeline schedules
Test cases
Artifacts
Deploy
Releases
Package registry
Model registry
Operate
Environments
Terraform modules
Monitor
Incidents
Analyze
Value stream analytics
Contributor analytics
CI/CD analytics
Repository analytics
Code review analytics
Issue analytics
Insights
Model experiments
Help
Help
Support
GitLab documentation
Compare GitLab plans
GitLab community forum
Contribute to GitLab
Provide feedback
Keyboard shortcuts
?
Snippets
Groups
Projects
Show more breadcrumbs
peltorr
Robot
Commits
ebef693c
Commit
ebef693c
authored
Jan 10, 2022
by
peltorr
Browse files
Options
Downloads
Patches
Plain Diff
Upload New File
parent
f84e64d6
Branches
Branches containing commit
No related tags found
No related merge requests found
Changes
1
Show whitespace changes
Inline
Side-by-side
Showing
1 changed file
robot.js
+382
-0
382 additions, 0 deletions
robot.js
with
382 additions
and
0 deletions
robot.js
0 → 100644
+
382
−
0
View file @
ebef693c
/**
** Robot de la Practica 3. Pelayo Torres Alonso
**/
var
scene
,
camera
,
renderer
,
controles
,
grupo
,
grupoCabeza
,
grupoBrazoI
,
grupoBrazoD
,
grupoRuedas
,
luzLente
,
brazoI
,
brazoD
,
targetLente
;
var
keyCode
;
var
bloqueo
=
false
;
//Direccion, velocidad del robot, grados de giro
var
controls
=
{};
var
vel
=
1
;
//Variables de la camara
var
dx
=
0
;
var
dy
=
0
;
var
dz
=
0
;
//Partes del robot
var
cabeza
,
cuello
,
cuerpo
,
eje
,
ruedaI
,
ruedaD
,
cam
,
lente
;
function
init
()
{
// default setup
scene
=
new
THREE
.
Scene
();
camera
=
new
THREE
.
PerspectiveCamera
(
45
,
window
.
innerWidth
/
window
.
innerHeight
,
0.1
,
1000
);
renderer
=
new
THREE
.
WebGLRenderer
();
renderer
.
setClearColor
(
new
THREE
.
Color
(
0x505050
));
renderer
.
setSize
(
window
.
innerWidth
,
window
.
innerHeight
);
renderer
.
shadowMap
.
enabled
=
true
;
// create the ground plane
var
planeGeometry
=
new
THREE
.
PlaneGeometry
(
700
,
700
,
1
,
1
);
var
planeMaterial
=
new
THREE
.
MeshToonMaterial
({
color
:
0xffffff
});
var
plane
=
new
THREE
.
Mesh
(
planeGeometry
,
planeMaterial
);
plane
.
receiveShadow
=
true
;
// rotate and position the plane
plane
.
rotation
.
x
=
-
0.5
*
Math
.
PI
;
plane
.
position
.
x
=
15
;
plane
.
position
.
y
=
0
;
plane
.
position
.
z
=
0
;
// add the plane to the scene
scene
.
add
(
plane
);
//Cuerpo del robot
var
geometry
=
new
THREE
.
CylinderGeometry
(
4
,
4
,
5
,
32
);
var
material
=
new
THREE
.
MeshPhongMaterial
(
{
map
:
THREE
.
ImageUtils
.
loadTexture
(
"
Texturas/tornillos.jpg
"
)}
);
cuerpo
=
new
THREE
.
Mesh
(
geometry
,
material
);
cuerpo
.
castShadow
=
true
;
cuerpo
.
position
.
set
(
0
,
5
,
0
);
//Cuello del robot
var
geometry
=
new
THREE
.
CylinderGeometry
(
1
,
1
,
1
,
32
);
var
material
=
new
THREE
.
MeshPhongMaterial
(
{
map
:
THREE
.
ImageUtils
.
loadTexture
(
"
Texturas/cables.jpg
"
)}
);
cuello
=
new
THREE
.
Mesh
(
geometry
,
material
);
cuello
.
castShadow
=
true
;
cuello
.
position
.
set
(
0
,
8
,
0
);
//Cabeza del robot
var
geometry
=
new
THREE
.
BoxGeometry
(
4
,
4
,
4
);
var
material
=
new
THREE
.
MeshPhongMaterial
(
{
map
:
THREE
.
ImageUtils
.
loadTexture
(
"
Texturas/tornillos.jpg
"
)}
);
cabeza
=
new
THREE
.
Mesh
(
geometry
,
material
);
cabeza
.
castShadow
=
true
;
cabeza
.
position
.
set
(
0
,
10
,
0
);
//Camara del robot
var
geometry
=
new
THREE
.
CylinderGeometry
(
0.5
,
1
,
0.5
,
32
);
var
material
=
new
THREE
.
MeshPhongMaterial
(
{
map
:
THREE
.
ImageUtils
.
loadTexture
(
"
Texturas/camara.jpg
"
)}
);
cam
=
new
THREE
.
Mesh
(
geometry
,
material
);
cam
.
castShadow
=
true
;
cam
.
position
.
set
(
-
2.3
,
10
,
0
);
cam
.
rotation
.
z
=
Math
.
PI
/
2
;
//Lente del robot
var
geometry
=
new
THREE
.
SphereGeometry
(
0.4
,
32
,
0.5
);
var
material
=
new
THREE
.
MeshPhongMaterial
(
{
map
:
THREE
.
ImageUtils
.
loadTexture
(
"
Texturas/lente.jpg
"
)}
);
lente
=
new
THREE
.
Mesh
(
geometry
,
material
);
lente
.
castShadow
=
true
;
lente
.
position
.
set
(
-
2.4
,
9.99
,
0
);
lente
.
rotation
.
z
=
Math
.
PI
/
2
;
//Ruedas del robot
//EJE
var
geometry
=
new
THREE
.
CylinderGeometry
(
0.5
,
0.5
,
11
,
32
);
var
material
=
new
THREE
.
MeshPhongMaterial
(
{
map
:
THREE
.
ImageUtils
.
loadTexture
(
"
Texturas/metal.jpg
"
)}
);
eje
=
new
THREE
.
Mesh
(
geometry
,
material
);
eje
.
castShadow
=
true
;
eje
.
position
.
set
(
0
,
3
,
0
);
eje
.
rotation
.
x
=
Math
.
PI
/
2
;
//Rueda izq
var
geometry
=
new
THREE
.
CylinderGeometry
(
2
,
2
,
1
,
32
);
var
material
=
new
THREE
.
MeshLambertMaterial
(
{
map
:
THREE
.
ImageUtils
.
loadTexture
(
"
Texturas/rueda.jpg
"
)}
);
ruedaI
=
new
THREE
.
Mesh
(
geometry
,
material
);
ruedaI
.
castShadow
=
true
;
ruedaI
.
position
.
set
(
0
,
3
,
-
4.9
);
ruedaI
.
rotation
.
x
=
Math
.
PI
/
2
;
//Rueda dcha
var
geometry
=
new
THREE
.
CylinderGeometry
(
2
,
2
,
1
,
32
);
var
material
=
new
THREE
.
MeshLambertMaterial
(
{
map
:
THREE
.
ImageUtils
.
loadTexture
(
"
Texturas/rueda.jpg
"
)}
);
ruedaD
=
new
THREE
.
Mesh
(
geometry
,
material
);
ruedaD
.
castShadow
=
true
;
ruedaD
.
position
.
set
(
0
,
3
,
4.9
);
ruedaD
.
rotation
.
x
=
Math
.
PI
/
2
;
//Brazo izq
var
geometry
=
new
THREE
.
BoxGeometry
(
0.5
,
4
,
0.5
);
var
material
=
new
THREE
.
MeshPhongMaterial
(
{
map
:
THREE
.
ImageUtils
.
loadTexture
(
"
Texturas/metal.jpg
"
)}
);
brazoI
=
new
THREE
.
Mesh
(
geometry
,
material
);
brazoI
.
castShadow
=
true
;
brazoI
.
position
.
set
(
-
4
,
6.5
,
4
);
brazoI
.
rotation
.
x
=
Math
.
PI
/
2
;
brazoI
.
rotation
.
z
=
Math
.
PI
/
4
;
//Brazo dcha
var
geometry
=
new
THREE
.
BoxGeometry
(
0.5
,
4
,
0.5
);
var
material
=
new
THREE
.
MeshPhongMaterial
(
{
map
:
THREE
.
ImageUtils
.
loadTexture
(
"
Texturas/metal.jpg
"
)
}
);
brazoD
=
new
THREE
.
Mesh
(
geometry
,
material
);
brazoD
.
castShadow
=
true
;
brazoD
.
position
.
set
(
-
4
,
6.5
,
-
4
);
brazoD
.
rotation
.
x
=
Math
.
PI
/
2
;
brazoD
.
rotation
.
z
=-
Math
.
PI
/
4
;
//Mano
var
geometry
=
new
THREE
.
ConeGeometry
(
1
,
4
,
16
);
var
material
=
new
THREE
.
MeshPhongMaterial
(
{
map
:
THREE
.
ImageUtils
.
loadTexture
(
"
Texturas/taladro1.jpg
"
)}
);
mano
=
new
THREE
.
Mesh
(
geometry
,
material
);
mano
.
castShadow
=
true
;
mano
.
position
.
set
(
-
6.5
,
6.5
,
-
6.5
);
mano
.
rotation
.
x
=-
Math
.
PI
/
2
;
mano
.
rotation
.
z
=
Math
.
PI
/
4
;
//Linterna
var
geometry
=
new
THREE
.
CylinderGeometry
(
1
,
1.5
,
2
,
8
,
1
,
false
,
0
,
2
*
Math
.
PI
);
var
material
=
new
THREE
.
MeshPhongMaterial
(
{
map
:
THREE
.
ImageUtils
.
loadTexture
(
"
Texturas/camara.jpg
"
)}
);
linterna
=
new
THREE
.
Mesh
(
geometry
,
material
);
linterna
.
castShadow
=
true
;
linterna
.
position
.
set
(
-
6
,
6.5
,
6
);
linterna
.
rotation
.
x
=-
Math
.
PI
/
2
;
linterna
.
rotation
.
z
=-
Math
.
PI
/
4
;
//Objetivo de la lente
targetLente
=
new
THREE
.
Object3D
();
targetLente
.
position
.
set
(
-
30
,
0
,
30
);
scene
.
add
(
targetLente
);
//Agrupamos las partes del robot
grupoCabeza
=
new
THREE
.
Group
();
grupoCabeza
.
add
(
cabeza
);
grupoCabeza
.
add
(
cuello
);
grupoCabeza
.
add
(
cam
);
grupoCabeza
.
add
(
lente
);
grupoCabeza
.
add
(
targetLente
);
grupoBrazoI
=
new
THREE
.
Group
();
grupoBrazoI
.
add
(
brazoI
);
grupoBrazoI
.
add
(
linterna
);
grupoBrazoI
.
add
(
targetLente
);
grupoBrazoD
=
new
THREE
.
Group
();
grupoBrazoD
.
add
(
brazoD
);
grupoBrazoD
.
add
(
mano
);
grupoRuedas
=
new
THREE
.
Group
();
grupoRuedas
.
add
(
ruedaD
);
grupoRuedas
.
add
(
ruedaI
);
grupoRuedas
.
add
(
eje
);
grupo
=
new
THREE
.
Group
();
grupo
.
add
(
cuerpo
);
grupo
.
add
(
grupoCabeza
);
grupo
.
add
(
grupoRuedas
);
grupo
.
add
(
grupoBrazoI
);
grupo
.
add
(
grupoBrazoD
);
grupo
.
position
.
y
=-
1
;
grupo
.
rotation
.
y
=
Math
.
PI
/
2
;
grupo
.
castShadow
=
true
;
scene
.
add
(
grupo
);
// position and point the camera to the center of the scene
camera
.
position
.
set
(
0
,
lente
.
position
.
y
,
lente
.
position
.
z
-
30
);
camera
.
lookAt
(
new
THREE
.
Vector3
(
grupo
.
position
.
x
,
grupo
.
position
.
y
+
11
,
grupo
.
position
.
z
));
controles
=
new
THREE
.
OrbitControls
(
camera
,
renderer
.
domElement
);
//Ajustamos los controles
controles
.
target
=
new
THREE
.
Vector3
(
grupo
.
position
.
x
,
grupo
.
position
.
y
+
11
,
grupo
.
position
.
z
);
controles
.
enablePan
=
false
;
controles
.
maxDistance
=
50
;
controles
.
minDistance
=
10
;
controles
.
maxPolarAngle
=
100
*
Math
.
PI
/
180
;
controles
.
update
();
// add subtle ambient lighting
var
ambienLight
=
new
THREE
.
AmbientLight
(
0x858585
);
scene
.
add
(
ambienLight
);
// Focos de luz
var
spotLightW
=
new
THREE
.
SpotLight
(
0xffffff
);
spotLightW
.
position
.
set
(
0
,
50
,
0
);
spotLightW
.
castShadow
=
true
;
spotLightW
.
penumbra
=
0.2
;
const
targetObject1
=
new
THREE
.
Object3D
();
targetObject1
.
position
.
set
(
0
,
0
,
0
);
scene
.
add
(
targetObject1
);
spotLightW
.
target
=
targetObject1
;
scene
.
add
(
spotLightW
);
var
spotLightB
=
new
THREE
.
SpotLight
(
0x0000ff
);
spotLightB
.
position
.
set
(
200
,
50
,
0
);
spotLightB
.
castShadow
=
true
;
spotLightB
.
penumbra
=
0.2
;
const
targetObject2
=
new
THREE
.
Object3D
();
targetObject2
.
position
.
set
(
200
,
0
,
0
);
scene
.
add
(
targetObject2
);
spotLightB
.
target
=
targetObject2
;
scene
.
add
(
spotLightB
);
var
spotLightG
=
new
THREE
.
SpotLight
(
0x00ff00
);
spotLightG
.
position
.
set
(
-
200
,
50
,
0
);
spotLightG
.
castShadow
=
true
;
spotLightG
.
penumbra
=
0.2
;
const
targetObject3
=
new
THREE
.
Object3D
();
targetObject3
.
position
.
set
(
-
200
,
0
,
0
);
scene
.
add
(
targetObject3
);
spotLightG
.
target
=
targetObject3
;
scene
.
add
(
spotLightG
);
var
spotLightP
=
new
THREE
.
SpotLight
(
0xff00ff
);
spotLightP
.
position
.
set
(
0
,
50
,
200
);
spotLightP
.
castShadow
=
true
;
spotLightP
.
penumbra
=
0.2
;
const
targetObject4
=
new
THREE
.
Object3D
();
targetObject4
.
position
.
set
(
0
,
0
,
200
);
scene
.
add
(
targetObject4
);
spotLightP
.
target
=
targetObject4
;
scene
.
add
(
spotLightP
);
var
spotLightA
=
new
THREE
.
SpotLight
(
0xffee00
);
spotLightA
.
position
.
set
(
0
,
50
,
-
200
);
spotLightA
.
castShadow
=
true
;
spotLightA
.
penumbra
=
0.2
;
const
targetObject5
=
new
THREE
.
Object3D
();
targetObject5
.
position
.
set
(
0
,
0
,
-
200
);
scene
.
add
(
targetObject5
);
spotLightA
.
target
=
targetObject5
;
scene
.
add
(
spotLightA
);
luzLente
=
new
THREE
.
SpotLight
(
0xff0000
);
luzLente
.
position
.
set
(
-
7
,
6.5
,
7
);
luzLente
.
distance
=
50
;
luzLente
.
castShadow
=
true
;
luzLente
.
penumbra
=
0.2
;
luzLente
.
target
=
targetLente
;
scene
.
add
(
luzLente
);
grupoBrazoI
.
add
(
luzLente
);
// add the output of the renderer to the html element
document
.
getElementById
(
"
contenedor
"
).
appendChild
(
renderer
.
domElement
);
// call the render function
//var step = 0;
step
=
0
;
renderScene
();
}
function
renderScene
()
{
// render using requestAnimationFrame
requestAnimationFrame
(
renderScene
);
controles
.
update
();
control
();
renderer
.
render
(
scene
,
camera
);
}
document
.
addEventListener
(
"
keydown
"
,
({
keyCode
})
=>
{
if
(
keyCode
==
67
){
if
(
bloqueo
){
bloqueo
=!
bloqueo
;
controles
.
enablePan
=
false
;
controles
.
maxDistance
=
50
;
controles
.
minDistance
=
10
;
controles
.
maxPolarAngle
=
100
*
Math
.
PI
/
180
;
}
else
{
bloqueo
=!
bloqueo
;
controles
.
enablePan
=
true
;
controles
.
maxDistance
=
Infinity
;
controles
.
minDistance
=
0
;
controles
.
maxPolarAngle
=
Math
.
PI
;
}
}
else
{
if
(
!
bloqueo
){
controls
[
keyCode
]
=
true
}
}
});
document
.
addEventListener
(
'
keyup
'
,
({
keyCode
})
=>
{
controls
[
keyCode
]
=
false
});
function
control
()
{
// Controls:Engine
if
(
controls
[
87
]){
// w
grupo
.
position
.
x
-=
Math
.
cos
(
grupo
.
rotation
.
y
)
*
vel
;
grupo
.
position
.
z
-=
-
Math
.
sin
(
grupo
.
rotation
.
y
)
*
vel
;
ruedaI
.
rotation
.
y
+=
Math
.
PI
/
90
;
ruedaD
.
rotation
.
y
+=
Math
.
PI
/
90
;
controles
.
target
=
new
THREE
.
Vector3
(
grupo
.
position
.
x
,
grupo
.
position
.
y
+
11
,
grupo
.
position
.
z
)
;
}
if
(
controls
[
83
]){
// s
grupo
.
position
.
x
+=
Math
.
cos
(
grupo
.
rotation
.
y
)
*
vel
;
grupo
.
position
.
z
+=
-
Math
.
sin
(
grupo
.
rotation
.
y
)
*
vel
;
ruedaI
.
rotation
.
y
-=
Math
.
PI
/
90
;
ruedaD
.
rotation
.
y
-=
Math
.
PI
/
90
;
controles
.
target
=
new
THREE
.
Vector3
(
grupo
.
position
.
x
-
5
,
grupo
.
position
.
y
+
11
,
grupo
.
position
.
z
)
;
}
if
(
controls
[
65
]){
// a
grupo
.
rotation
.
y
+=
Math
.
PI
/
90
;
ruedaI
.
rotation
.
y
+=
Math
.
PI
/
90
;
ruedaD
.
rotation
.
y
-=
Math
.
PI
/
90
;
}
if
(
controls
[
68
]){
// d
grupo
.
rotation
.
y
-=
Math
.
PI
/
90
;
ruedaD
.
rotation
.
y
+=
Math
.
PI
/
90
;
ruedaI
.
rotation
.
y
-=
Math
.
PI
/
90
;
}
//Movimiento cabeza
if
(
controls
[
81
]){
// q
grupoCabeza
.
rotation
.
y
+=
Math
.
PI
/
90
;
}
if
(
controls
[
69
]){
// e
grupoCabeza
.
rotation
.
y
-=
Math
.
PI
/
90
;
}
//Movimiento brazo Izquierdo
if
(
controls
[
84
]){
// t
grupoBrazoI
.
rotation
.
y
+=
Math
.
PI
/
90
;
}
if
(
controls
[
89
]){
// y
grupoBrazoI
.
rotation
.
y
-=
Math
.
PI
/
90
;
}
//Movimiento brazo Derecho
if
(
controls
[
71
]){
// g
grupoBrazoD
.
rotation
.
y
+=
Math
.
PI
/
90
;
}
if
(
controls
[
72
]){
// h
grupoBrazoD
.
rotation
.
y
-=
Math
.
PI
/
90
;
}
}
This diff is collapsed.
Click to expand it.
Preview
0%
Loading
Try again
or
attach a new file
.
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Save comment
Cancel
Please
register
or
sign in
to comment