Platform
Solutions
Resources
Pricing
Sign in
Sign up
Claudio Esperança
Computer Graphics & Visualization @ufrj.br
Workspace
Fork
Published
Computer Graphics
By
Claudio Esperança
Edited
Aug 18, 2020
1 fork
2 stars
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
terrain
=
{
let
geometry
=
terrainGeometry
(
field
,
1
,
1
,
1
)
;
let
material
=
new
THREE
.
MeshPhongMaterial
(
{
color
:
0xffffff
,
side
:
THREE
.
DoubleSide
,
/*flatShading:true*/
}
)
;
return
new
THREE
.
Mesh
(
geometry
,
material
)
;
}
Insert cell
Insert cell
field
=
fractalField
(
detail
,
coarseness
)
Insert cell
scene
=
{
const
scene
=
new
THREE
.
Scene
(
)
;
scene
.
background
=
new
THREE
.
Color
(
0xccccff
)
;
scene
.
add
(
lights
)
;
scene
.
add
(
terrain
)
;
return
scene
;
}
Insert cell
height
=
width
*
9
/
16
Insert cell
camera
=
{
const
fov
=
30
;
const
aspect
=
width
/
height
;
const
near
=
1
;
const
far
=
1000
;
const
camera
=
new
THREE
.
PerspectiveCamera
(
fov
,
aspect
,
near
,
far
)
;
camera
.
position
.
set
(
0
,
0
,
-
2
)
camera
.
lookAt
(
new
THREE
.
Vector3
(
0
,
0
,
0
)
)
;
return
camera
;
}
Insert cell
lights
=
{
var
group
=
new
THREE
.
Group
(
)
;
var
spotLight
=
new
THREE
.
SpotLight
(
0xffffff
)
;
spotLight
.
position
.
set
(
0
,
200
,
100
)
;
group
.
add
(
spotLight
)
return
group
}
Insert cell
Insert cell
import
{
slider
}
from
'@jashkenas/inputs'
Insert cell
Insert cell
One platform
to build and deploy the best data apps
Experiment and prototype by building visualizations in live JavaScript notebooks. Collaborate with your team and decide which concepts to build out.
Use Observable Framework to build data apps locally. Use data loaders to build in any language or library, including Python, SQL, and R.
Seamlessly deploy to Observable. Test before you ship, use automatic deploy-on-commit, and ensure your projects are always up-to-date.
Try it for free
Learn more
Fork
View
Export
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
detail
Edit
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
coarseness
Edit
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
terrainGeometry
Edit
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
terrain
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
fractalField
Edit
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
field
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
scene
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
height
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
camera
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
lights
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
THREE
Edit
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML