mirror of
https://github.com/LCPQ/QUESTDB_website.git
synced 2024-12-25 13:53:48 +01:00
348 lines
11 KiB
HTML
348 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" />
|
|
<link rel="stylesheet" type="text/css" href="/css/form.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="/js/DOICache.js"></script>
|
|
<script src="https://unpkg.com/simple-statistics@7.0.2/dist/simple-statistics.min.js"></script>
|
|
<script>
|
|
window.onload = async () => {
|
|
window.doiCache = new DOICache()
|
|
$('#form_dat > fieldset > input[type=radio]').on('change', async function (event) {
|
|
processingIndicator.isActive = true
|
|
$("#Geom_th,#GSGeom_th,#ESGeom_th").each(function () {
|
|
$(this).attr("hidden", true)
|
|
})
|
|
var result = $(this).val();
|
|
var proms = [];
|
|
switch (result) {
|
|
case "abs":
|
|
proms = getAbsFilesName().map((f) => AbsDataFile.loadAsync(f));
|
|
$("#Geom_th").attr("hidden", false)
|
|
break;
|
|
case "fluo":
|
|
proms = getFluoFilesName().map((f) => FluoDataFile.loadAsync(f));
|
|
$("#Geom_th").attr("hidden", false)
|
|
break;
|
|
case "zpe":
|
|
proms = getZPEFilesName().map((f) => ZPEDataFile.loadAsync(f));
|
|
$("#GSGeom_th,#ESGeom_th").each(function () {
|
|
$(this).attr("hidden", false)
|
|
})
|
|
break;
|
|
}
|
|
window.dats = await Promise.all(proms)
|
|
processingIndicator.isActive = false
|
|
reloadFileSelector()
|
|
await reloadSelect()
|
|
})
|
|
}
|
|
function reloadFileSelector() {
|
|
$("#customFiles_input").attr("value", "").attr("disabled", false)
|
|
}
|
|
|
|
async function reloadSelect() {
|
|
processingIndicator.isActive = true
|
|
radioval = $('#form_dat > fieldset > input[name=datatype]:checked').val();
|
|
const files = $("#customFiles_input")[0].files
|
|
for (file of [...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 > fieldset > div > select,#sel_ref').each(function () {
|
|
$(this).find('option[value!=""]').remove()
|
|
})
|
|
$('#form_dat > fieldset > div > select').each(function () {
|
|
const vals = uniq(window.dats.map((d) => { return d[$(this).attr("name")] }))
|
|
for (const val of vals) {
|
|
$("<option/>", {
|
|
value: JSON.stringify(val)
|
|
}).text(val.toString()).appendTo($(this))
|
|
}
|
|
})
|
|
$('#form_dat > input[type="submit"').prop('disabled', false);
|
|
processingIndicator.isActive = false
|
|
await reloadContent()
|
|
}
|
|
async function reloadStat() {
|
|
processingIndicator.isActive = true
|
|
var stb = $("#stat_table > tbody")
|
|
$("#graph_div").empty()
|
|
$(stb).empty()
|
|
var refstr = $("#sel_ref option:selected").val()
|
|
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))
|
|
}
|
|
}
|
|
sdic.delete(refstr)
|
|
var graphdat = []
|
|
for (const [keystr, vals] of sdic) {
|
|
row = $("<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 = $("<td/>", {
|
|
style: "white-space: nowrap;"
|
|
})
|
|
if (trueTypeOf(el) == DOI.name) {
|
|
var publi = doiCache.get(el.string)
|
|
$("<a/>", {
|
|
href: el.url,
|
|
target: "_blank"
|
|
}).html(publi.format('citation', {
|
|
format: 'html',
|
|
lang: 'en-US'
|
|
})).appendTo(td)
|
|
}
|
|
else {
|
|
$(td).text(el)
|
|
}
|
|
$(row).append(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)]) {
|
|
$("<td/>").text(noNanPrecision(val, 3)).appendTo(row)
|
|
}
|
|
$(stb).append(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',
|
|
},
|
|
xaxis: {
|
|
title: {
|
|
text: 'Energy (eV)',
|
|
}
|
|
},
|
|
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() {
|
|
doiCache.clear()
|
|
processingIndicator.isActive = true
|
|
const LatexInline = ['\\(', '\\)']
|
|
window.filt = window.dats
|
|
$('#form_dat > fieldset > div > 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 = $("#dat_table > tbody");
|
|
dtb.empty()
|
|
sel_ref = $("#sel_ref")
|
|
await doiCache.addRange(window.filt.map((x)=>x.DOI.string))
|
|
for (const d of window.filt) {
|
|
var row = $("<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)
|
|
$("<option/>", {
|
|
value: JSON.stringify(opObjVal)
|
|
}).text(d.method).appendTo(sel_ref)
|
|
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])
|
|
}
|
|
tdtemp=$("<td/>", {
|
|
style: "white-space: nowrap;"
|
|
})
|
|
for (const el of tableels) {
|
|
td=$(tdtemp).clone()
|
|
if (trueTypeOf(el) == DOI.name) {
|
|
var publi = doiCache.get(el.string)
|
|
$("<a/>", {
|
|
href: el.url,
|
|
target: "_blank",
|
|
}).html(publi.format('citation', {
|
|
format: 'html',
|
|
lang: 'en-US'
|
|
})).appendTo(td)
|
|
}
|
|
else {
|
|
$(td).text(el)
|
|
}
|
|
$(row).append(td)
|
|
}
|
|
$(tdtemp).clone().append($("<a/>", {
|
|
target: "_blank",
|
|
href: await d.sourceFile.getViewerURL()
|
|
}).text("Go to file")).appendTo(row)
|
|
$(dtb).append(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 (Absorption, 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>Publication</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">
|
|
<fieldset>
|
|
<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>
|
|
</fieldset>
|
|
<fieldset>
|
|
<div>
|
|
<label for="customFiles_input">Add custom data file</label>
|
|
<input type="file" multiple onchange="reloadSelect()" id="customFiles_input" disabled=true></input>
|
|
</div>
|
|
</fieldset>
|
|
<fieldset class="table">
|
|
<div>
|
|
<label for="mol_select">Molecule</label>
|
|
<select multiple id="mol_select" name="molecule"></select>
|
|
</div>
|
|
<div>
|
|
<label for="method_select">Method</label>
|
|
<select multiple id="method_select" name="method"></select>
|
|
</div>
|
|
<div>
|
|
<label for="DOI_select">Publication</label>
|
|
<select multiple id="DOI_select" name="DOI"></select>
|
|
</div>
|
|
</fieldset>
|
|
<input type="submit" disabled=true value="Load"></input>
|
|
</form>
|
|
<form id="form_ref">
|
|
<label for="sel_ref">Reference</label>
|
|
<select id="sel_ref" onchange="reloadStat()"></select>
|
|
</form>
|
|
<section>
|
|
<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>Publication</th>
|
|
<th>File</th>
|
|
</thead>
|
|
<tbody>
|
|
</tbody>
|
|
</table>
|
|
</section>
|
|
<section>
|
|
<table id="stat_table">
|
|
<thead>
|
|
<th>Method</th>
|
|
<th>Publication</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>
|
|
</tbody>
|
|
<div id="graph_div"></div>
|
|
</table>
|
|
</section>
|
|
{{< waitModal >}} |