Public
Edited
Jan 23, 2023
import {toc} from "@mbostock/toc"
toc()
Afficher les données sous forme de tableau en Observable
Inputs.table(raw)
data=raw.map(row=>{
let parseDate = d3.timeParse("%m/%d/%Y");
row.date=parseDate(row.Date)
return row
})
Inputs.table(raw)
data1= raw.map((row,i) => {
let parseDate = d3.timeParse("%m/%d/%Y");
row.date = parseDate(row.Date)
row.index =i
return row
})
Plot.line(data1,{x : "date", y:"index"}).plot()
parsed = raw.map((d,i) =>{
let parseDate = d3.timeParse("%m/%d/%Y");
let parseHour = d3.timeParse("%H:%M - %H:%M");
d["Num séance"] = +d["Num séance"];
d.date_parsed = parseDate(d.Date);
d.start_hour = d.Heure.split('-')[0];
d.end_hour = d.Heure.split('-')[1];
if(d["Groupe(s)"].length< 2)
{
d.type="Cours";
}
else{
d.type= "TD";
};
d.index = i;
return d;
}
)
Plot.line(parsed,{x:"date_parsed",y:"index"}).plot({
facet:{
data: parsed,
x:"type"
},
grid:true,
marks: [
Plot.frame(),
]
})
cours = d3.group(raw, d => d["Code Cours"])
Inputs.table(raw.map(d=>d["Code Cours"]))
Plot.dot(raw,{x:"date",y:"Code Cours",fill:"Code Cours"}).plot()
type_groups=[...d3.group(raw,d=>d["Groupe(s)"])].map(d=>d[0])
viewof checkboxes = Inputs.checkbox(type_groups,{label:"Select some" ,value: ["type_groups"]})
Plot.plot({
inset: 8,
grid: true,
color: {
legend: true,
},
marks: [
Plot.dot(parsed,{x:"date",y:"Groupe(s)",symbol:"Code Cours", stroke:"Code Cours"})
]
})
Plot.dot(raw,{x: "Date", y:"Groupe(s)",fill: 'Code Cours'}).plot()
viewof channels = Inputs.select(
d3.group(parsed,d=>d["Groupe(s)"]),
{ key: ["B1a","B1b","B2a","B2b","A1b","A2a","A2b"]})
filter1 = channels.flat()
viewof checks = Inputs.checkbox(
d3.group(filter1,d=>d["Code Cours"]),
{ key: ["22_ING_S06_MATIERE_2","22_ING_S06_MATIERE_1","22_ING_S06_MATIERE_3"]})
filter2 = checks.flat()
Plot.tickX(data, Plot.group({stroke:"count"}, {y: d => d.Heure, x: d => d.Jour, strokeWidth: 80})).plot({color: {legend: true}})
Plot.dot(filter2,{x: "Date", y:"Groupe(s)",fill: 'Code Cours'}).plot();
prototype = FileAttachment("prototype.jpeg").image()
Plot.plot({
inset: 8,
grid: true,
color: {
legend: true,
},
marks: [
Plot.barY(parsed,{x:"Groupe(s)",y:"Num séance",fill:"Code Cours"})
]
})
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.
