--- 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" /> <link rel="stylesheet" type="text/css" href="/css/table.css" /> <link rel="stylesheet" type="text/css" href="/css/emoji.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="/js/getPublis.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="/js/nestedCheckbox.js"></script> <script src="/js/selectSelectAll.js"></script> <script src="https://unpkg.com/simple-statistics@7.0.2/dist/simple-statistics.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/bowser@2.5.3/es5.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/js-yaml/3.13.1/js-yaml.min.js"></script> <script src="/js/numberUtils.js"></script> <script> function adjustSticky() { const height = $("nav").height() $("thead.sticky > tr > th ").css("top", height) } window.onload = async () => { window.browser = bowser.getParser(window.navigator.userAgent); $("input[type='checkbox']:checked").trigger("change") adjustSticky(); $(window).resize(adjustSticky) const LatexInline = ['\\(', '\\)'] var slist = $("#SelectList") getAllSelect().each(function () { $("<li/>").text($('label[for="' + $(this).attr('id') + '"]').text()).appendTo(slist) }) $('[data-needbrowser],[data-neednotbrowser]').each(function () { function test(key, value) { switch (key) { case "Engine": return value.some((v) => browser.isEngine(v)) break; case "Browser": return value.some((v) => browser.isBrowser(v)) case "Platform": return value.some((v) => browser.isPlatform(v)) case "OS": return value.some((v) => browser.isOS(v)) default: return true break; } } const needdata = $(this).data("needbrowser") const neednotdata = $(this).data("neednotbrowser") const need = ((needdata == null) ? true : Object.entries(needdata).every(kv => test(kv[0], kv[1]))) const neednot = ((neednotdata == null) ? true : Object.entries(neednotdata).some(kv => !test(kv[0], kv[1]))) if (need && neednot) { $(this).show() } else { $(this).hide() } }) var cbextl = $("#cb_exTypeList") var extl = $("#exTypeList") var vertkindtl = $("#exVertKindList") for (const [name, value] of VertExcitationKinds.All) { $("<li/>").text(name).appendTo(vertkindtl) } for (const [name, value] of excitationTypes.All) { var txt=value.description.string if (value.description.isLaTeX) { txt=LatexInline[0]+txt+LatexInline[1] } $("<li/>").text(txt).appendTo(extl) var cbli = $("<li/>") $("<input/>", { type: "checkbox", id: "cb_" + name, name: name, value: Number(value) }).change(nestedCheckbox_change).appendTo(cbli); $('<label />', { 'for': 'cb_' + name, text: txt }).appendTo(cbli); cbextl.append(cbli); } await MathJax.typesetPromise(); delete (cbextl) delete (extl) delete (vertkindtl) window.doiCache = new DOICache() await loadFiles() } async function loadFiles() { processingIndicator.isActive = true var chks = [] proms = [] proms.push(getAbsFilesName().map((f) => VertDataFile.loadAsync(f, VertExcitationKinds.Absorbtion))); proms.push(getFluoFilesName().map((f) => VertDataFile.loadAsync(f, VertExcitationKinds.Fluorescence))) window.defaultDats = [] for (const subproms of proms) { const sub = await Promise.all(subproms) for (const doi of uniq(sub.map(d => d.DOI.string))) { const subdoi = sub.filter(d => d.DOI.string === doi) for (mol of uniq(subdoi.map(d => d.molecule))) { const submol = subdoi.filter(d => d.molecule === mol) const TBE = submol.find((d) => d.method.isTBE) if (TBE !== undefined) { for (dat of submol.filter((d) => d !== TBE)) { dat.CopyExcitationsTypeFrom(TBE) } } } } window.defaultDats = window.defaultDats.concat(sub) } processingIndicator.isActive = false reloadCustomFiles() } async function reloadCustomFiles() { window.dats = window.defaultDats; const kinds = new Map([["file_abs", VertExcitationKinds.Absorbtion], ["file_fluo", VertExcitationKinds.Fluorescence]]) for (const el of $('#form_dat > fieldset > div > input[type="file"')) { if (kinds.has(el.name)) { for (const f of el.files) { const dat = await VertDataFile.loadAsync(f, kinds.get(this.name)) window.dats.push(dat) } } } reloadSelect("DOI") } async function clearSelect(BeforeName = null) { var selects = ((BeforeName == null) ? getAllSelect() : getAllSelectAfter(BeforeName, true)) selects.add($('#sel_ref')) selects.each(function () { $(this).empty() }) } function getAllSelect() { return $('#form_dat > fieldset > div > select') } function getAllSelectAfter(Name, include = false) { const selects = getAllSelect() var index = selects.index($(`[name="${Name}"]`)) if (!include) { index++ } return selects.slice(index) } function getAllSelectBefore(Name, include = false) { const selects = getAllSelect() var index = selects.index($(`[name="${Name}"]`)) if (include) { index++ } return selects.slice(0, index) } async function reloadNextSelect(e) { const afters = getAllSelectAfter(e.target.name) const isLast = afters.length == 0 if (!isLast) { await reloadSelect(afters.prop("name")) } const fillArray = ["molecule"] if (fillArray.includes(afters.prop("name"))) { selectSelectAll(afters.first()) } var submit = $(e.target.form).find(':submit') submit.prop("disabled", !isLast) } async function reloadSelect(name) { clearSelect(name) var selects = getAllSelectBefore(name, true) var currentselect = selects.last() selects = selects.slice(0, selects.length - 1) const vals = uniq(window.dats.filter(d => { return Array.from(selects).every((el) => { return $(el).val().includes(getSelectValue(d, el.name)) }) }).map((d) => getSelectValue(d, name))) const sets = await (async ()=>{ if(name === "DOI"){ const publis=await getPublis() const sets=publis.sets return sets } else{ return undefined } })() for (const val of vals) { if (val !== null) { $("<option/>", { value: val }).text((name === "DOI" && sets.has(val)) ? sets.get(val) : val.toString()).appendTo(currentselect) } } } function getSelectValue(data, name) { switch (name) { case "method": return data.method.name break; case "basis": return data.method.basis case "DOI": return data.DOI.string default: return data[name] break; } } 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.filtData) { const key = JSON.stringify([d.method, d.DOI.string]) 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, exc.cVertExcitationKind]) const keydic = sdatdic.get(key) if ((!exc.isUnsafe || window.filterParams[0]) && ((exc.type & window.filterParams[1]) !== 0) && ((exc.VertExcitationKind & window.filterParams[2]) !== 0)) { if (!(keydic.has(key2))) { keydic.set(key2,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) Reflect.setPrototypeOf(key[0], method.prototype) //Reflect.setPrototypeOf(key[1], DOI.prototype) th = $("<th/>", { scope: "column" }) const [meth, doi] = key th.clone().text(meth.toString("\n").split('-').join('\u2011')).appendTo(row) var thdoi = th.clone() var publi = doiCache.get(doi, true) const publis = await getPublis() const sets=publis.sets if (sets.has(doi)) { var str = sets.get(doi) $(thdoi).append(str + " ") } $("<a/>", { href: new DOI(doi).url, target: "_blank" }).html(publi.format('citation', { format: 'html', lang: 'en-US' })).appendTo(thdoi) $(row).append(thdoi) const noNanVals = (vals.every((v) => Number.isNaN(v))) ? vals : (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(noNanFixed(val, 2)).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() { window.filterParams = [$("#cb_unsafe").prop("checked"), Array.from(Array.from($("#cb_exTypeList>li>input[type=checkbox]:checked")).map(el => parseInt(el.value))).reduce((pv, cv) => pv + cv, 0), Array.from(Array.from($("#cb_exVertKindList>li>input[type=checkbox]:checked")).map(el => parseInt(el.value))).reduce((pv, cv) => pv + cv, 0)] doiCache.clear() processingIndicator.isActive = true const LatexInline = ['\\(', '\\)'] window.filtData = window.dats $('#form_dat > fieldset > div > select').each(function () { const prop = $(this).attr("name") const values = $(this).val() window.filtData = window.filtData.filter((d) => { if (typeof values == "undefined" || values == null) { return false } return values.includes(getSelectValue(d, prop)) delete (val) }) }) await window.doiCache.addRange(window.filtData.map((d) => d.DOI.string)) $(sel_ref).empty() for (const el of uniq(window.filtData.map(d => [d.method, d.DOI.string]))) { op = $("<option/>", { value: JSON.stringify(el) }).text(el[0]) if (el[0].name.includes("TBE")) { $(sel_ref).prepend(op) } else { $(sel_ref).append(op) } } $(sel_ref).prop("selectedIndex", 0); var data = $("#data") $(data).empty(); if (window.filtData.length > 0) { const sets = (await getPublis()).sets for (const doi of doiCache.keys()) { paperdata = window.filtData.filter((d) => { return d.DOI.string == doi }) var methods = uniq(paperdata.map(d => d.method)) const sortedMethods = methods.sort((a, b) => { if (a.isTBE && !b.isTBE) { return -1 } else if (a.isTBE && b.isTBE) { if (a.basis!=="CBS" && b.basis==="CBS") { return -1 } else { return 1 } } else if (!a.isTBE && b.isTBE) { return 1 } else { return 0 } }) var div = $('<div/>').appendTo(data) $("<h1/>").text(sets.get(doi)).appendTo(div) var table = $("<table/>").addClass("datatable").appendTo(div) var head = $("<tr/>") $("<thead/>").addClass("sticky").append(head).appendTo(table) var tbody = $("<tbody/>").appendTo(table) var th = $("<th/>", { scope: "column" }) head.append(["Molecule", "Transition"].map(x => th.clone().text(x))) head.append(sortedMethods.map(x => th.clone().text(x.toString("\n").split('-').join('\u2011')))) adjustSticky(); datadic = new Map() for (const dat of paperdata) { const key1 = dat.molecule; if (!datadic.has(key1)) { datadic.set(key1, new Map()) } const key3 = JSON.stringify(dat.method) for (const ex of dat.excitations) { Reflect.setPrototypeOf(ex.type, excitationType.prototype) if (((window.filterParams[1] & ex.type) !== 0) && ((window.filterParams[2] & ex.VertExcitationKind) !== 0)) { const key2 = JSON.stringify([ex.initial, ex.final, ex.type, ex.VertExcitationKind]) if (!datadic.get(key1).has(key2)) { datadic.get(key1).set(key2, new Map()) } datadic.get(key1).get(key2).set(key3, [ex.value, ex.isUnsafe]) } } } for (const [molecule, moldat] of datadic.entries()) { var printmol = true; for (const [jsonex, exdat] of moldat.entries()) { const ex = JSON.parse(jsonex) Reflect.setPrototypeOf(ex[0], state.prototype) Reflect.setPrototypeOf(ex[1], state.prototype) Reflect.setPrototypeOf(ex[2], excitationType.prototype) Reflect.setPrototypeOf(ex[3], VertExcitationKind.prototype) var tr = $("<tr/>") if (printmol) { $("<th/>", { scope: "row", rowspan: moldat.size }).text(molecule).appendTo(tr) printmol = false } var Vertkindtext = "" if (ex[3].Value == VertExcitationKinds.Fluorescence.Value) { Vertkindtext = String.raw`[\mathrm{F}]` } $("<th/>", { scope: "rowgroup" }).text(String.raw`${LatexInline[0]}${ex[0].toLaTeX()} \rightarrow ${ex[1].toLaTeX()} ${Vertkindtext}(${ex[2].description.string}) ${LatexInline[1]}`).appendTo(tr) var entries = Array.from(exdat.entries()) for (const method of sortedMethods) { td = $("<td/>").addClass("NumberCell") kv = entries.find(x => { return JSON.stringify(method) == x[0] }) if (kv !== undefined) { const [val, unsafe] = kv[1] if (unsafe) { td.append($("<span/>", { title: "unsafe value", role: "img", "aria-label": "Warning" }).addClass("emoji").text('⚠')) } if (unsafe && !$("#cb_unsafe").is(':checked')) { td.append($("<s/>").append(val.toString())) } else { td.append(val.toString()) } } tr.append(td) } tbody.append(tr) } } } await MathJax.typesetPromise() } await reloadStat() } async function submitdat() { window.onbeforeunload = () => { return ''; } await reloadContent(); } </script> {{< getDataFilesName >}} <noscript> <p style="background-color: red; color: white; font-size: 20; font-weight: bold;"> <span role="img" aria-label="Warning" class="emoji">⚠</span> <span>This website work only if JavaScript is enable. You must enable JavaScript. <a href="https://www.enable-javascript.com/" target="_blank">How to enable JavaScript ?</a></span> </p> </noscript> <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>Add custom files</li> <ul> <li>Absorption</li> <li>Fluorescence</li> </ul> <li>Choose each parameter (of course you can select multiples values for each) you can use the the <buttongit disabled>Select all</button> button to select all items <span hidden data-needbrowser='{"Engine":["WebKit","Blink"],"Platform":["desktop"]}'>or use the <kbd data-needbrowser='{"OS":["MacOS"]}'>⌘</kbd><kbd data-neednotbrowser='{"OS":["MacOS"]}'>Ctrl</kbd>+<kbd>A</kbd> shortcut key</span></li> <ul id="SelectList"></ul> <li>Choose filters:</li> <ul> <li>Choose what kind of vertical excitations you want</li> <ul id="exVertKindList"></ul> <li>Choose other excitation parameters you want</li> <ul id="exTypeList"></ul> <li>Choose if you want to include unsafe values in statistics</li> </ul> <li>Select a reference from <strong>already selected data</strong> (by default first is selected -it's the <abbr title="Theoretical best estimate">TBE</abbr> if present- 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:submitdat()" method="post"> <fieldset> <legend>Import custom files</legend> <div> <label for="absFiles_input">Add custom absorption data files</label> <input type="file" multiple onchange="reloadCustomFiles()" id="absFiles_input" name="file_abs"></input> </div> <div> <label for="fluoFiles_input">Add custom fluorescence data files</label> <input type="file" multiple onchange="reloadCustomFiles()" id="fluoFiles_input" name="file_fluo"></input> </div> </fieldset> <fieldset class="table"> <div style="display: inline-block;"> <label for="DOI_select">Sets</label> <button class="SelectAll" type="button" onclick="selectSelectAll_click(event)">Select all</button> <select multiple id="DOI_select" name="DOI" onchange="reloadNextSelect(event)"></select> </div> <div style="display:inline-block"> <label for="mol_select">Molecules</label> <button class="SelectAll" type="button" onclick="selectSelectAll_click(event)">Select all</button> <select multiple id="mol_select" name="molecule" onchange="reloadNextSelect(event)"></select> </div> <br /> <div style="display: inline-block;"> <label for="method_select">Methods</label> <button class="SelectAll" type="button" onclick="selectSelectAll_click(event)">Select all</button> <select multiple id="method_select" name="method" onchange="reloadNextSelect(event)"></select> </div> <div style="display: inline-block;"> <label for="basis_select">Basis sets</label> <button class="SelectAll" type="button" onclick="selectSelectAll_click(event)">Select all</button> <select multiple id="basis_select" name="basis" onchange="reloadNextSelect(event)"></select> </div> </fieldset> <fieldset> <legend>Vertical excitation kind</legend> <ul class="nestedCbList" style="padding-left: 0em;"> <li> <input type="checkbox" checked onchange="nestedCheckbox_change(event)" id="cb_fileType_All"></input> <label for="cb_fileType_All"> All</label> </li> <ul class="nestedCbList" id="cb_exVertKindList"> <li> <input type="checkbox" onchange="nestedCheckbox_change(event)" id="cb_abs" value="1" name="datatype"> <label for="cb_abs">Absorption</label> </li> <li> <input type="checkbox" onchange="nestedCheckbox_change(event)" id="cb_fluo" value="2" name="datatype"> <label for="fluo">Fluorescence</label> </ul> </li> </fieldset> <fieldset id="excitationFilter"> <legend>Filters</legend> <ul class="nestedCbList" style="padding-left: 0em;"> <li> <input type="checkbox" onchange="nestedCheckbox_change(event)" id="cb_exType_All"></input> <label for="cb_exType_All"> All</label> </li> <ul id="cb_exTypeList" class="nestedCbList"> </ul> <li id="li_cb_unsafe"> <input type="checkbox" id="cb_unsafe" name="unsafe"> <label for="cb_unsafe">Unsafe</label> </li> </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 id="data"> </section> <section> <table id="stat_table" class="datatable"> <thead class="sticky"> <th scope="col">Method</th> <th scope="col">Set</th> <th scope="col">Min</th> <th scope="col">Max</th> <th scope="col">MSE</th> <th scope="col">MAE</th> <th scope="col">Median</th> <th scope="col">Absolute Median</th> <th scope="col">RMS</th> <th scope="col">Variance</th> <th scope="col">Standard deviation</th> </thead> <tbody> </tbody> <div id="graph_div"></div> </table> </section> {{< waitModal >}}