Public
Edited
Feb 17, 2023
Insert cell
Insert cell
Insert cell
Insert cell
dates=P.py`dates = ${pd}.date_range("20130101", periods=6)
list(dates.strftime('%Y-%m-%d'))`
Insert cell
d3.range(6).map(d=>d3.utcDay.offset(new Date('2013-01-01'),d))
Insert cell
df2=P.py`df2 = pd.DataFrame(
{
"A": [1,3,2,4],
"B": pd.Timestamp("20130102"),
"C": pd.Series(1, index=list(range(4)), dtype="float32"),
"D": np.array([3] * 4, dtype="int32"),
"E": pd.Categorical(["test", "train", "test", "train"]),
"F": "foo",
}
)
df2`
Insert cell
df2_d3={
let source={
"A":[1,3,2,4],
"B":d3.range(4).map(d=>new Date("2013-1-2")),
"C":d3.range(4).map(d=>1),
"D":d3.range(4).map(d=>3),
"E":["test", "train", "test", "train"],
"F":new Array(4).fill('foo'),
}

let columns=Object.keys(source)
let data=d3.range(4).map((d,i)=>{
return columns.reduce((r,col)=>(r[col]=source[col][i], r),{})
})
return data
}
Insert cell
Insert cell
Insert cell
df2.head(2).toString()
Insert cell
Inputs.table(df2_d3.slice(0,2))
Insert cell
Insert cell
df2.index.toString()
//df2_d3.map(d=>d.index_col) or Object.keys(df2_d3)
Insert cell
Insert cell
df2.columns.toString()
Insert cell
Object.keys(df2_d3[0])
Insert cell
Insert cell
df2.to_numpy().toString()
Insert cell
Array.from(df2_d3,d=>Object.values(d))
Insert cell
Insert cell
Insert cell
df2.T.toString()
Insert cell
Insert cell
Insert cell
{// version 1
function transpose(data){
let columns=Object.keys(data[0])
let dataT=columns.reduce((r,col,i)=>{
let n=d3.range(data.length)
let row=n.reduce((r2,d,i)=>{
console.log(d,col,data[d][col])
//Object.assign(r2,{d:df2_d3[d][col]})
r2[d]=data[d][col]
return r2
},{})
row['key']=col
r.push(row)
return r
},[])
return dataT
}

return transpose(df2_d3)
}
Insert cell
Insert cell
Insert cell
{
const df_sort=await P.py`df_sort=df2.sort_values(by=['A','E'])
df_sort`
return df_sort.toString()
}

Insert cell
Type JavaScript, then Shift-Enter. Ctrl-space for more options. Arrow ↑/↓ to switch modes.

Insert cell
d3.sort(d3.sort(df2_d3,(a,b)=>d3.ascending(a.E,b.E)),(a,b)=>d3.ascending(a.A,b.A)
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
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.
Learn more