mirror of
https://github.com/LCPQ/QUESTDB_website.git
synced 2024-12-25 13:53:48 +01:00
333 lines
11 KiB
HTML
333 lines
11 KiB
HTML
---
|
|
title: "Multiple dataset"
|
|
date: 2019-09-27 16:41
|
|
draft: false
|
|
---
|
|
<link rel="stylesheet" type="text/css" href="/css/modal.css" />
|
|
<script src="/js/data.js" type="text/javascript"></script>
|
|
<script src="/js/loadAllData.js" type="text/javascript"></script>
|
|
<script src="/js/getFullDataPath.js" type="text/javascript"></script>
|
|
<script src="/js/getTextFromFile.js" type="text/javascript"></script>
|
|
<script src="/js/trueTypeOf.js" type="text/javascript"></script>
|
|
<script src="/js/uniq.js"></script>
|
|
<script src="/js/processingIndicator.js"></script>
|
|
<script src="/js/noNan.js"></script>
|
|
<script src="/js/websiteFile.js"></script>
|
|
<script src="https://cdn.rawgit.com/larsgw/citation.js/archive/citation.js/citation-0.4.0-9.js"
|
|
type="text/javascript"></script>
|
|
<script src="https://unpkg.com/simple-statistics@7.0.2/dist/simple-statistics.min.js"></script>
|
|
<script>
|
|
window.onload= async ()=>{
|
|
window.Cite = require('citation-js');
|
|
$('#form_dat input[type=radio]').on('change', async function(event) {
|
|
processingIndicator.isActive=true
|
|
document.getElementById("Geom_th").hidden=true
|
|
document.getElementById("GSGeom_th").hidden=true
|
|
document.getElementById("ESGeom_th").hidden=true
|
|
var result = $(this).val();
|
|
var proms=[];
|
|
switch (result) {
|
|
case "abs":
|
|
proms=getAbsFilesName().map((f) => AbsDataFile.loadAsync(f));
|
|
document.getElementById("Geom_th").hidden=false
|
|
break;
|
|
case "fluo":
|
|
proms=getFluoFilesName().map((f) => FluoDataFile.loadAsync(f));
|
|
document.getElementById("Geom_th").hidden=false
|
|
break;
|
|
case "zpe":
|
|
proms=getZPEFilesName().map((f) => ZPEDataFile.loadAsync(f));
|
|
document.getElementById("GSGeom_th").hidden=false
|
|
document.getElementById("ESGeom_th").hidden=false
|
|
break;
|
|
}
|
|
window.dats=await Promise.all(proms)
|
|
processingIndicator.isActive=false
|
|
reloadFileSelector()
|
|
await reloadSelect()
|
|
})
|
|
}
|
|
function reloadFileSelector(){
|
|
const fsel=document.getElementById("customFiles_input")
|
|
fsel.value=""
|
|
fsel.disabled=false
|
|
}
|
|
|
|
async function reloadSelect(){
|
|
processingIndicator.isActive=true
|
|
radioval=$('#form_dat > input[name=datatype]:checked').val();
|
|
for(file of Array.from(document.getElementById("customFiles_input").files))
|
|
{
|
|
switch (radioval) {
|
|
case "abs":
|
|
var dat=await AbsDataFile.loadAsync(file)
|
|
window.dats.push(dat)
|
|
break;
|
|
|
|
case "fluo":
|
|
dat=await FluoDataFile.loadAsync(file)
|
|
window.dats.push(dat)
|
|
break;
|
|
case "ZPE":
|
|
dat=await ZPEDataFile.loadAsync(file)
|
|
window.dats.push(dat)
|
|
break;
|
|
}
|
|
}
|
|
$('#form_dat > select').each(function(){
|
|
$(this).find('option[value!=""]').remove()
|
|
const vals=uniq(window.dats.map((d)=>{return d[$(this).attr("name")]}))
|
|
for (const val of vals){
|
|
op=document.createElement("option")
|
|
op.value=JSON.stringify(val)
|
|
op.innerText=val.toString()
|
|
$(this).append(op)
|
|
}
|
|
})
|
|
$('#form_dat > input[type="submit"').prop('disabled', false);
|
|
processingIndicator.isActive=false
|
|
await reloadContent()
|
|
}
|
|
async function reloadStat(){
|
|
processingIndicator.isActive=true
|
|
var stb=document.getElementById("stat_table_b");
|
|
document.getElementById("graph_div").inerrHTML=""
|
|
stb.innerHTML=''
|
|
const sel_ref=document.getElementById("sel_ref")
|
|
const refstr=((sel_ref.selectedIndex>=0) ? sel_ref.options[sel_ref.selectedIndex].value : null)
|
|
var sdatdic=new Map()
|
|
for (const d of window.filt) {
|
|
const key=JSON.stringify([d.code,d.method,d.DOI])
|
|
if(!(sdatdic.has(key)))
|
|
{
|
|
sdatdic.set(key,new Map())
|
|
}
|
|
for(const exc of d.excitations){
|
|
const key2=JSON.stringify([d.molecule,exc.initial,exc.final])
|
|
const keydic=sdatdic.get(key)
|
|
if(!(keydic.has(key2))){
|
|
keydic.set(key2,[])
|
|
}
|
|
keydic.get(key2).push(exc.value)
|
|
}
|
|
}
|
|
var sdic= new Map()
|
|
for(const [key,sdat] of sdatdic){
|
|
for(const [key2,exval] of sdat){
|
|
if(!(sdic.has(key))){
|
|
sdic.set(key,[])
|
|
}
|
|
sdic.get(key).push(exval-((sdatdic.has(refstr)) ? sdatdic.get(refstr).get(key2) : NaN))
|
|
}
|
|
}
|
|
var graphdat=[]
|
|
for(const[keystr,vals] of sdic){
|
|
row=document.createElement("tr")
|
|
key=JSON.parse(keystr)
|
|
key.shift()
|
|
Reflect.setPrototypeOf(key[0], method.prototype)
|
|
Reflect.setPrototypeOf(key[1], doi.prototype)
|
|
for(const el of key){
|
|
var td=document.createElement("td")
|
|
if(trueTypeOf(el)=="doi"){
|
|
var publipromise=window.Cite.async(el.string)
|
|
var lnkdoi=document.createElement("a")
|
|
lnkdoi.href=el.url
|
|
lnkdoi.target="_blank"
|
|
publi=await publipromise
|
|
lnkdoi.innerHTML=publi.format('citation', {
|
|
format: 'html',
|
|
lang: 'en-US'
|
|
})
|
|
td.appendChild(lnkdoi)
|
|
}
|
|
else{
|
|
td.innerText=el
|
|
}
|
|
row.appendChild(td)
|
|
}
|
|
const noNanVals=vals.filter((v)=>!Number.isNaN(v))
|
|
const avals=noNanVals.map(v=>Math.abs(v))
|
|
for(const val of [ss.min(noNanVals),ss.max(noNanVals),ss.mean(noNanVals),ss.mean(avals),ss.median(noNanVals),ss.median(avals),ss.rootMeanSquare(noNanVals),ss.variance(noNanVals),ss.standardDeviation(noNanVals)]){
|
|
var td=document.createElement("td")
|
|
td.innerText=noNanPrecision(val,3)
|
|
row.appendChild(td)
|
|
}
|
|
stb.appendChild(row)
|
|
var box = {
|
|
x: noNanVals,
|
|
amean: ss.mean(avals).toFixed(3),
|
|
name: key[0].toString() + " MAD : " + ss.mean(avals).toPrecision(4),
|
|
type: 'box',
|
|
boxmean: 'sd'
|
|
};
|
|
graphdat.push(box)
|
|
}
|
|
var layout = {
|
|
paper_bgcolor: 'rgba(0,0,0,0)',
|
|
plot_bgcolor: 'rgba(0,0,0,0)',
|
|
gap: 0,
|
|
legend: {
|
|
traceorder: 'reversed',
|
|
},
|
|
bgcolor:'#E2E2E2',
|
|
bordercolor:'#FFFFFF',
|
|
borderwidth: 2,
|
|
// autosize: false,
|
|
width: 850,
|
|
height: 500,
|
|
margin: {
|
|
l: 0,
|
|
r: 10,
|
|
b: 15,
|
|
t: 20,
|
|
pad: 0,
|
|
},
|
|
}
|
|
Plotly.newPlot('graph_div', graphdat, layout);
|
|
processingIndicator.isActive=false
|
|
}
|
|
async function reloadContent(){
|
|
processingIndicator.isActive=true
|
|
const LatexInline=['\\(','\\)']
|
|
window.filt=window.dats
|
|
$('#form_dat > select').each(function(){
|
|
const prop=$(this).attr("name")
|
|
const values=$(this).val()
|
|
window.filt=window.filt.filter((d)=>{
|
|
if(typeof values=="undefined" || values==null){
|
|
return false
|
|
}
|
|
return values.includes(JSON.stringify(d[prop]))
|
|
})
|
|
})
|
|
var dtb=document.getElementById("dat_table_b");
|
|
dtb.innerHTML=''
|
|
sel_ref=document.getElementById("sel_ref")
|
|
for (const d of window.filt) {
|
|
var row=document.createElement("tr")
|
|
var rowd=[]
|
|
const els=[d.molecule,d.comment,d.code,d.method,d.DOI]
|
|
var op=document.createElement("option")
|
|
var opObjVal=els.slice(2)
|
|
op.value=JSON.stringify(opObjVal)
|
|
op.innerText=opObjVal.join(" ")
|
|
sel_ref.appendChild(op)
|
|
var tableels=els.slice()
|
|
if(d instanceof oneStateDataFileBase){
|
|
tableels.splice(3,0,d.geometry)
|
|
}
|
|
else if(d instanceof twoStateDataFileBase){
|
|
tableels.splice(3,0,[d.GS,d.ES])
|
|
}
|
|
for(const el of tableels){
|
|
td=document.createElement("td")
|
|
if(trueTypeOf(el)=="doi"){
|
|
var publipromise=window.Cite.async(el.string)
|
|
var lnkdoi=document.createElement("a")
|
|
lnkdoi.href=el.url
|
|
lnkdoi.target="_blank"
|
|
publi=await publipromise
|
|
lnkdoi.innerHTML=publi.format('citation', {
|
|
format: 'html',
|
|
lang: 'en-US'
|
|
})
|
|
td.appendChild(lnkdoi)
|
|
}
|
|
else{
|
|
td.innerText=el
|
|
}
|
|
row.appendChild(td)
|
|
}
|
|
var lnkfile=document.createElement("a")
|
|
lnkfile.target="_blank"
|
|
lnkfile.innerText="Go to file"
|
|
lnkfile.href=await d.sourceFile.getViewerURL()
|
|
row.appendChild(lnkfile)
|
|
dtb.appendChild(row)
|
|
}
|
|
processingIndicator.isActive=true
|
|
await reloadStat()
|
|
}
|
|
</script>
|
|
{{< getDataFilesName >}}
|
|
<p>
|
|
In this page you can compare multiple dataset and have somme statistics to evaluate method or basis accuracy.
|
|
For this follow this steps
|
|
<ol>
|
|
<li>Select a value type (Absorbtion, fluorescence or \(\Delta \text{ZPE}\))</li>
|
|
<li>You can add custom files if you want</li>
|
|
<li>Choose each parameters (of course you can select multiples values for each)</li>
|
|
<ul>
|
|
<li>Molecule</li>
|
|
<li>Method</li>
|
|
<li>Paper</li>
|
|
</ul>
|
|
<li>Select a reference from already selected data (by default the first is already selected)</li>
|
|
<li>Now you can see the list of selected data and some statistics about these data</li>
|
|
</ol>
|
|
</p>
|
|
<form id="form_dat" action="javascript:reloadContent()" method="post">
|
|
<legend>Data type</legend>
|
|
<input type="radio" id="abs" value="abs" name="datatype">
|
|
<label for="abs">Absorption</label>
|
|
<input type="radio" id="fluo" value="fluo" name="datatype">
|
|
<label for="fluo">Fluorescence</label>
|
|
<input type="radio" id="zpe" value="zpe" name="datatype">
|
|
<label for="zpe">\(\Delta \text{ZPE}\)</label>
|
|
<br/>
|
|
<label for="customFiles">Add custom data file</label>
|
|
<input type="file" multiple onchange="reloadSelect()" id="customFiles_input" disabled=true></input>
|
|
<br/>
|
|
<label for="mol_select">Molecule</label>
|
|
<select multiple id="mol_select" name="molecule"></select>
|
|
<label for="method_select">Method</label>
|
|
<select multiple id="method_select" name="method"></select>
|
|
<label for="DOI_select">Paper</label>
|
|
<select multiple id="DOI_select" name="DOI"></select>
|
|
<input type="submit" disabled=true value="Calculate"></input>
|
|
</form>
|
|
<form id="form_ref">
|
|
<label for="sel_ref">Reference</label>
|
|
<select id="sel_ref" onchange="reloadStat()">
|
|
</select>
|
|
</form>
|
|
<br/>
|
|
<div id="data_div">
|
|
<table id="dat_table">
|
|
<thead>
|
|
<th>Molecule</th>
|
|
<th>Comment</th>
|
|
<th>Code</th>
|
|
<th id="Geom_th" hidden=true>Geometry</th>
|
|
<th id="GSGeom_th" hidden=true>Ground state geometry</th>
|
|
<th id="ESGeom_th" hidden=true>Excited state geometry</th>
|
|
<th>Method</th>
|
|
<th>Paper</th>
|
|
<th>File</th>
|
|
</thead>
|
|
<tbody id="dat_table_b">
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<div id="stat_div">
|
|
<table id="stat_table">
|
|
<thead>
|
|
<th>Method</th>
|
|
<th>Paper</th>
|
|
<th>Min</th>
|
|
<th>Max</th>
|
|
<th>Mean</th>
|
|
<th>Absolute Mean</th>
|
|
<th>Median</th>
|
|
<th>Absolute Median</th>
|
|
<th>RMS</th>
|
|
<th>Variance</th>
|
|
<th>Standard deviation</th>
|
|
</thead>
|
|
<tbody id="stat_table_b">
|
|
</tbody>
|
|
<div id="graph_div"></div>
|
|
</table>
|
|
</div>
|
|
{{< waitModal >}} |