Public
Edited
May 31
import {uniqueValid} from '@uwdata/data-utilities'
import { render } from '@vega/vega-lite-api-v5'
file_FP = FileAttachment("FP.csv")
dataframe=d3.csvParse(await file_FP.text())
types = uniqueValid(dataframe, d => d.formula)
all_types = types.concat(["all"])
dataframe.keys()
///single scatter plot
function plot_0(channel, title) {
return {
mark: { type: 'circle' },
data: { values: dataframe },
params: [
{ name: 'click', select: { type: 'point', on: 'mouseover' } },
],
encoding: {
x: { field: channel.x, type: 'Q', axis: {title: null} },
y: { field: channel.y, type: 'Q', axis: {title: null} },
color: {
condition: { param: 'click', field: 'formula', type: 'O' },
value: 'grey'
},
opacity: {
condition: { param: 'click', value: 0.8 },
value: 0.1
},
tooltip:[
{field: 'formula', type: 'N', title: "Chemical Formula"},
{field: 'A_GHz', type: 'Q', title: 'Rotational constant A (GHz)'},
{field: 'B_GHz', type: 'Q', title: 'Rotational constant B (GHz)'},
{field: 'C_GHz', type: 'Q', title: 'Rotational constant C (GHz)'},
{field: 'mu_Debye', type: 'Q', title: 'Dipole moment (Debye)'},
{field: 'alpha_Bohr_pow_3', type: 'Q', title: 'Isotropic polarizability (Bohr^3)'},
{field: 'homo_Hartree', type: 'Q', title: 'Energy of Highest occupied molecular orbital (HOMO) (Hartree)'},
{field: 'lumo_Hartree', type: 'Q', title: 'Energy of Lowest occupied molecular orbital (LUMO) (Hartree)'},
{field: 'gap_Hartree', type: 'Q', title: 'Gap, difference between LUMO and HOMO (Hartree)'},
//{field: 'r2_Bohr_pow_2', type: 'Q', title: 'Electronic spatial extent (Bohr^2)'},
//{field: 'zpve_Hartree', type: 'Q', title: 'Zero point vibrational energy (Hartree)'},
//{field: 'U0_Hartree', type: 'Q', title: 'Internal energy at 0 K (Hartree)'},
//{field: 'U_Hartree', type: 'Q', title: 'Internal energy at 298.15 K (Hartree)'},
//{field: 'H_Hartree', type: 'Q', title: 'Enthalpy at 298.15 K (Hartree)'},
//{field: 'G_Hartree', type: 'Q', title: 'Free energy at 298.15 K (Hartree)'},
{field: 'Cv_cal_per_mol_per_K', type: 'Q', title: 'Heat capacity at 298.15 K (cal/(mol·K))'}
]
},
title,
width: 300,
height: 225
};
}
render({
hconcat: [
plot_0({x: "PCA_0", y:"PCA_1"}, 'PCA'),
]
})
PCA_test = render({
data: {values: dataframe},
transform: [
{
// This filter will show all points when 'all' is selected,
// or only points matching the selected type value
filter: "datum.formula == typeSelector || typeSelector == 'all'"
}
],
params: [
{ name: 'mouseOver', select: { type: 'point', on: 'mouseover' } },
{
name: 'typeSelector',
value: 'all', // default value
bind: {
input: 'select',
options: all_types, // include 'all' as an option
name: 'Formula: ' // set the menu label text
}
},
{ name: 'sel', select: { type: 'interval' }, bind: 'scales' }
],
mark: {type: 'point'},
encoding:{
x: { field: "PCA_0", type: 'Q', axis: {title: null} },
y: { field: "PCA_1", type: 'Q', axis: {title: null} },
color: {
condition: {
test: "datum.formula == typeSelector || typeSelector == 'all'",
field: 'Cv_cal_per_mol_per_K',
type: 'Q',
scale: {scheme: "redblue"},
title: 'Heat Capacity (cal/(mol·K))'
}
},
opacity: {
condition: { param: 'mouseOver', value: 0.8 },
value: 0.1
},
tooltip: [
{field: 'formula', type: 'N', title: "Chemical Formula"},
{field: 'A_GHz', type: 'Q', title: 'Rotational constant A (GHz)'},
{field: 'B_GHz', type: 'Q', title: 'Rotational constant B (GHz)'},
{field: 'C_GHz', type: 'Q', title: 'Rotational constant C (GHz)'},
{field: 'mu_Debye', type: 'Q', title: 'Dipole moment (Debye)'},
{field: 'alpha_Bohr_pow_3', type: 'Q', title: 'Isotropic polarizability (Bohr^3)'},
{field: 'homo_Hartree', type: 'Q', title: 'Energy of Highest occupied molecular orbital (HOMO) (Hartree)'},
{field: 'lumo_Hartree', type: 'Q', title: 'Energy of Lowest occupied molecular orbital (LUMO) (Hartree)'},
{field: 'gap_Hartree', type: 'Q', title: 'Gap, difference between LUMO and HOMO (Hartree)'},
{field: 'Cv_cal_per_mol_per_K', type: 'Q', title: 'Heat capacity at 298.15 K (cal/(mol·K))'}
]
},
title: "PCA"
})
tSNE_test = render({
data: {values: dataframe},
transform: [
{
// This filter will show all points when 'all' is selected,
// or only points matching the selected type value
filter: "datum.formula == typeSelector || typeSelector == 'all'"
}
],
params: [
{ name: 'mouseOver', select: { type: 'point', on: 'mouseover' } },
{
name: 'typeSelector',
value: 'all', // default value
bind: {
input: 'select',
options: all_types, // include 'all' as an option
name: 'Formula: ' // set the menu label text
}
},
{ name: 'sel', select: { type: 'interval' }, bind: 'scales' }
],
mark: {type: 'point'},
encoding:{
x: { field: "t-SNE_0", type: 'Q', axis: {title: null} },
y: { field: "t-SNE_1", type: 'Q', axis: {title: null} },
color: {
condition: {
test: "datum.formula == typeSelector || typeSelector == 'all'",
field: 'Cv_cal_per_mol_per_K',
type: 'Q',
scale: {scheme: "redblue"},
title: 'Heat Capacity (cal/(mol·K))'
}
},
opacity: {
condition: { param: 'mouseOver', value: 0.8 },
value: 0.1
},
tooltip: [
{field: 'formula', type: 'N', title: "Chemical Formula"},
{field: 'A_GHz', type: 'Q', title: 'Rotational constant A (GHz)'},
{field: 'B_GHz', type: 'Q', title: 'Rotational constant B (GHz)'},
{field: 'C_GHz', type: 'Q', title: 'Rotational constant C (GHz)'},
{field: 'mu_Debye', type: 'Q', title: 'Dipole moment (Debye)'},
{field: 'alpha_Bohr_pow_3', type: 'Q', title: 'Isotropic polarizability (Bohr^3)'},
{field: 'homo_Hartree', type: 'Q', title: 'Energy of Highest occupied molecular orbital (HOMO) (Hartree)'},
{field: 'lumo_Hartree', type: 'Q', title: 'Energy of Lowest occupied molecular orbital (LUMO) (Hartree)'},
{field: 'gap_Hartree', type: 'Q', title: 'Gap, difference between LUMO and HOMO (Hartree)'},
{field: 'Cv_cal_per_mol_per_K', type: 'Q', title: 'Heat capacity at 298.15 K (cal/(mol·K))'}
]
},
title: "t-SNE (perplexity=30.0)"
})
UMAP_test = render({
data: {values: dataframe},
transform: [
{
// This filter will show all points when 'all' is selected,
// or only points matching the selected type value
filter: "datum.formula == typeSelector || typeSelector == 'all'"
}
],
params: [
{ name: 'mouseOver', select: { type: 'point', on: 'mouseover' } },
{
name: 'typeSelector',
value: 'all', // default value
bind: {
input: 'select',
options: all_types, // include 'all' as an option
name: 'Formula: ' // set the menu label text
}
},
{ name: 'sel', select: { type: 'interval' }, bind: 'scales' }
],
mark: {type: 'point'},
encoding:{
x: { field: "UMAP_0", type: 'Q', axis: {title: null} },
y: { field: "UMAP_1", type: 'Q', axis: {title: null} },
color: {
condition: {
test: "datum.formula == typeSelector || typeSelector == 'all'",
field: 'Cv_cal_per_mol_per_K',
type: 'Q',
scale: {scheme: "redblue"},
title: 'Heat Capacity (cal/(mol·K))'
}
},
opacity: {
condition: { param: 'mouseOver', value: 0.8 },
value: 0.1
},
tooltip: [
{field: 'formula', type: 'N', title: "Chemical Formula"},
{field: 'A_GHz', type: 'Q', title: 'Rotational constant A (GHz)'},
{field: 'B_GHz', type: 'Q', title: 'Rotational constant B (GHz)'},
{field: 'C_GHz', type: 'Q', title: 'Rotational constant C (GHz)'},
{field: 'mu_Debye', type: 'Q', title: 'Dipole moment (Debye)'},
{field: 'alpha_Bohr_pow_3', type: 'Q', title: 'Isotropic polarizability (Bohr^3)'},
{field: 'homo_Hartree', type: 'Q', title: 'Energy of Highest occupied molecular orbital (HOMO) (Hartree)'},
{field: 'lumo_Hartree', type: 'Q', title: 'Energy of Lowest occupied molecular orbital (LUMO) (Hartree)'},
{field: 'gap_Hartree', type: 'Q', title: 'Gap, difference between LUMO and HOMO (Hartree)'},
{field: 'Cv_cal_per_mol_per_K', type: 'Q', title: 'Heat capacity at 298.15 K (cal/(mol·K))'}
]
},
title: "UMAP"
})
{
const umap1 = {
mark: "circle",
data: { values: dataframe }, // or however you're referencing your data
encoding: {
x: { field: "UMAP_0", type: "quantitative", axis: {title: null} },
y: { field: "UMAP_1", type: "quantitative", axis: {title: null} }
}
};
const pca1 = {
mark: "circle",
data: { values: dataframe },
encoding: {
x: { field: "PCA_0", type: "quantitative", axis: {title: null} },
y: { field: "PCA_1", type: "quantitative", axis: {title: null} }
}
};
return render({
hconcat: [umap1, pca1]
});
}
///vconcat, brushing and linking
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.
