Platform
Resources
Pricing
Sign in
Get started
Visualization for Transparency Foundation (Fundació ViT)
Visualization can transform the reach of open data and revolutionize transparency and accountability.
Workspace
Fork
Public
2022-23 MVTEC Data Visualization Programming module
By
antonbardera
Edited
Feb 14, 2023
2
Insert cell
Insert cell
Insert cell
x
=
6
;
Insert cell
Insert cell
y
=
x
+
2
;
Insert cell
Insert cell
Insert cell
z
=
x
+
y
;
Insert cell
Insert cell
p
=
"Hello "
;
Insert cell
q
=
"world!"
Insert cell
p
+
q
Insert cell
Insert cell
square
=
function
(
value
)
{
let
sq
=
value
*
value
;
return
sq
;
}
Insert cell
x2
=
square
(
x
)
;
Insert cell
Insert cell
Insert cell
function
sum
(
value1
,
value2
)
{
return
value1
+
value2
;
}
Insert cell
a
=
sum
(
x
,
y
)
;
Insert cell
Insert cell
htmlcreator
=
function
(
word
)
{
return
"Hello "
+
word
+
"!"
;
}
Insert cell
htmlcreator
(
"world"
)
;
Insert cell
htmlcreator
(
"students"
)
;
Insert cell
html
`<h2>Hello!</h2>`
Insert cell
Insert cell
square2
=
x
=>
x
*
x
;
Insert cell
x22
=
square2
(
x
)
;
Insert cell
mult
=
(
a
,
b
)
=>
a
*
b
;
Insert cell
ab
=
mult
(
x
,
y
)
;
Insert cell
sqaure3
=
(
x
)
=>
{
console
.
log
(
"Help!!!"
)
;
console
.
log
(
x
)
;
return
x
*
x
}
;
Insert cell
xx
=
sqaure3
(
3
)
;
Insert cell
Insert cell
Insert cell
person1
=
(
{
name
:
"Mary"
,
surname
:
"Acharya"
,
age
:
30
,
height
:
61
}
)
Insert cell
Insert cell
person1
.
name
Insert cell
person1
[
"name"
]
Insert cell
Insert cell
person2
=
(
{
name
:
"Bilal"
,
surname
:
"Uwir"
,
age
:
28
,
height
:
76
,
fullname
:
function
(
)
{
return
this
.
name
+
' '
+
this
.
surname
;
}
}
)
Insert cell
person2
.
fullname
(
)
Insert cell
Insert cell
ar
=
[
'a'
,
'bd'
,
'c'
,
'j'
]
;
Insert cell
ar
.
length
Insert cell
ar
[
2
]
Insert cell
ar
[
1
]
Insert cell
Insert cell
weather
=
await
FileAttachment
(
"GironaWeatherData.csv"
)
.
csv
(
)
;
Insert cell
Insert cell
Insert cell
Insert cell
desiredData
=
weather
.
map
(
d
=>
{
var
newd
=
{
date
:
new
Date
(
d
[
"Date time"
]
)
,
maxTemp
:
+
d
[
"Maximum Temperature"
]
,
minTemp
:
+
d
[
"Minimum Temperature"
]
,
condition
:
d
[
"Conditions"
]
,
//d.Conditions
precipitation
:
+
d
[
"Precipitation"
]
}
return
newd
;
}
)
;
Insert cell
Insert cell
newar
=
ar
.
map
(
d
=>
d
+
d
)
;
Insert cell
Insert cell
selectedData
=
desiredData
.
filter
(
d
=>
{
var
startDate
=
new
Date
(
"09/01/2020"
)
;
var
endDate
=
new
Date
(
"09/30/2020"
)
;
return
d
.
date
>=
startDate
&&
d
.
date
<=
endDate
;
}
)
;
Insert cell
selectedData2
=
desiredData
.
filter
(
d
=>
d
.
maxTemp
>
30
)
;
Insert cell
Insert cell
sortedData
=
selectedData
.
sort
(
(
a
,
b
)
=>
b
.
maxTemp
-
a
.
maxTemp
)
;
Insert cell
Insert cell
totalPrecipitation
=
desiredData
.
reduce
(
(
accum
,
d
)
=>
accum
+
d
.
precipitation
,
0
)
;
Insert cell
Insert cell
totalar
=
ar
.
reduce
(
(
str
,
d
)
=>
str
+
d
+
" "
,
""
)
;
Insert cell
Purpose-built for displays of data
Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
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
x
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
y
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
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
z
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
p
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
q
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
square
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
x2
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
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
sum
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
a
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
htmlcreator
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
square2
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
x22
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
mult
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
ab
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
sqaure3
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
xx
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
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
person1
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
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
person2
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
ar
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
Edit
Add comment
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
weather
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
image6
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
desiredData
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
newar
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
selectedData
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML
selectedData2
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
sortedData
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
totalPrecipitation
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
totalar
Add comment
Copy import
Select
Duplicate
Copy link
Embed
Delete
JavaScript
Markdown
HTML