dataviz, R obsessed, learning D3 with #100daysofD3
Twitter: @W_R_Chase
Published
Edited
Apr 3, 2019
1 star
{
let x = 2;
let y = 10;
let z = -1;
return `x + y * z = ${x + y * z}
The square root of y is ${Math.sqrt(y)}`;
//return Math.sqrt(y);
}
viewof point_x = html`<input type=number>`
viewof point_y = html`<input type=number>`
"atan2 = " + Math.atan2(point_x, point_y)
vec.length
{
let vec = [1, 2, 3, 4, 5];
let text = "";
for(let i = 0; i < vec.length; i++) {
text += vec[i] + " squared is: " + vec[i]*vec[i] + "\n";
}
return text;
}
d3.min([0, 1, 5, -1])
d3.max([10, 56.2, 0, -90.1])
d3.extent([10, 40, 90]) //returns an array
{
//let's try creating some fake data from within a loop
let dat = [];
for (let i = 0; i <= 10; i++) {
dat.push(i * i);
}
return(dat);
}
{
//now there's another method I read about I wanna try
let init = 0
let dat = Array(11).
fill().
map(() => init++);
return(dat);
}
{
//probably not a good idea to modify data in-place, but I'm a maverick, so let's do it
let dat = [1, 2, 3, 4, 5]
//foreach loop
dat.forEach(function(d, i) {
dat[i] = d + 2
});
return(dat);
}
{
//after reading a little, seems like the better way to do this is make a new var and use map()
let dat = [1, 2, 3, 4, 5]
let new_dat = dat.map(d => d + 2) //note to self x => x+1 is anonymous funct notation in js
return(new_dat)
}
{
//let's pick a random mood about js for me
//rerun this cell to generate a new sentence
const opinion = ["love", "hate"]
const feeling = [
{"type": "love", "feeling": "excited"},
{"type": "love", "feeling": "happy"},
{"type": "love", "feeling": "powerful"},
{"type": "hate", "feeling": "frustrated"},
{"type": "hate", "feeling": "bored"},
{"type": "hate", "feeling": "annoyed"}
]
function get_rand_int (min, max) {
min = Math.ceil(min);
max = Math.floor(max);
return Math.floor(Math.random() * (max - min + 1)) + min;
}
function choose_feeling (op, feelings) {
if (op === "love") {
return(feeling.filter(obj => {return obj.type === "love"}))[get_rand_int(0, 2)].feeling
} else {
return(feeling.filter(obj => {return obj.type === "hate"}))[get_rand_int(0, 2)].feeling
}
}
function gen_sentence (opinion, feeling) {
const op = opinion[get_rand_int(0, 1)]
const feel = choose_feeling(op, feeling)
return("I " + op + " Javascript! It makes me feel " + feel + "!")
}
return(gen_sentence(opinion, feeling))
}
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.
