k.ladutenko
/
scatt


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180
							<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Scattnlay web</title>
  <link rel="stylesheet" type="text/css" href="nmie.css">
  <script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
</head>
<body onload=runMie()>
WL from <input type="number" id="fromWL" step="any" value="300.0">
to <input type="number" id="toWL" step="any" value="1000">
step <input type="number" id="stepWL" step="any" value="0.1"><br>
R: <input type="number" id="R" step="any" value="100">
Re(n): <input type="number" id="reN" step="any" value="4">
Im(n): <input type="number" id="imN" step="any" value="0.01"><br>
<button id="Evaluate" onclick=runMie() autofocus>Run Mie!</button> <span id="time"></span>
<div id="Selector"></div>
<div id="PlotQsca" style="height:70%;">
<!--     style="width:840px;height:580px;"-->
</div>
  <script src="nmie.js"></script>
  <script>
    const total_mode_n = 4;
    var mode_n, mode_types;
    var WLs, layout, trace1, trace2;
    var Qsca, Qabs, Qsca_n, Qabs_n;
    const range = (start, stop, step = 1) =>
            Array(Math.ceil((stop - start) / step)).fill(start).map((x, y) => x + y * step);
    if (!Array.prototype.last){
      Array.prototype.last = function(){
        return this[this.length - 1];
      };
    };
    // Module.addOnPostRun(() => {
    //   test.onclick =runMie()});
    function runMie() {
        const nmie = new Module.nmie()
        var t0 = performance.now();
        var fromWL = parseFloat(document.getElementById("fromWL").value);
        var toWL = parseFloat(document.getElementById("toWL").value);
        var stepWL = parseFloat(document.getElementById("stepWL").value);
        var R = parseFloat(document.getElementById("R").value);
        var reN = parseFloat(document.getElementById("reN").value);
        var imN = parseFloat(document.getElementById("imN").value);
        Qsca = [], Qabs = [];
        Qsca_n = [[],[]], Qabs_n = [[],[]];
        nmie.ClearTarget();
        nmie.AddTargetLayerReIm(R, reN, imN)
        WLs = range(fromWL,toWL,stepWL)
        mode_n = range(1,total_mode_n+1)
        mode_types = range(0,2)
        mode_types.forEach(function(mode_type) {
          mode_n.forEach(function (n) {
            Qsca_n[mode_type].push([]);
            Qabs_n[mode_type].push([]);
          });
        });
        WLs.forEach(function(WL) {
          // console.log(WL)
          nmie.SetModeNmaxAndType(-1, -1);
          nmie.SetWavelength(WL);
          nmie.RunMieCalculation();
          Qsca.push(nmie.GetQsca());
          Qabs.push(nmie.GetQabs());
          mode_types.forEach(function(mode_type) {
            mode_n.forEach(function (n) {
              nmie.SetModeNmaxAndType(n,mode_type);
              nmie.RunMieCalculation();
              Qsca_n[mode_type][n-1].push(nmie.GetQsca());
              Qabs_n[mode_type][n-1].push(nmie.GetQabs());
            });
          });
        });
        // console.log('Qsca_n = ', Qsca_n);
        trace1 = {
          x: WLs,
          y: Qsca,
          type: 'scatter',
          name: 'Qsca'
        };

        trace2 = {
          x: WLs,
          y: Qabs,
          type: 'scatter',
          name: 'Qabs'
        };

        var data = [trace1, trace2];
        layout = {
          title: {
            text:'Mie calculation',
            // font: {
            //   family: 'Courier New, monospace',
            //   size: 24
            // },
            xref: 'paper',
            x: 0.05,
          },
          xaxis: {
            title: {
              text: 'Wavelength',
              // font: {
              //   family: 'Courier New, monospace',
              //   size: 18,
              //   color: '#7f7f7f'
              // }
            },
          },
          yaxis: {
            title: {
              text: 'Q',
              // font: {
              //   family: 'Courier New, monospace',
              //   size: 18,
              //   color: '#7f7f7f'
              // }
            }
          },
          margin: {
            l: 35,
            r: 25,
            b: 35,
            t: 25,
            pad: 4
          }
        };
        Plotly.newPlot('PlotQsca', data, layout, {showSendToCloud: true, displaylogo: false});
        var t1 = performance.now();
        document.getElementById("time").innerHTML = "It took " + ((t1 - t0)/1000).toFixed(2) + " s.";

        mode_names = ['E','H'];
        var tmp1 = " ";
        mode_types.forEach(function(mode_type) {
          tmp1 += mode_names[mode_type]+" -> ";
          mode_n.forEach(function (n) {
            tmp1 += n.toString()+
                    "<input type=\"checkbox\" id=\""+mode_names[mode_type]+n.toString()
                    +"\" unchecked onclick=\"replot();\">  ";
          });
          tmp1 += "<br>";
        });
        tmp1 +="Qabs <input type=\"checkbox\" id=\"Qabs\" checked onclick=\"replot();\">  ";
        document.getElementById("Selector").innerHTML = tmp1;


      };

    function replot() {
      var checkBoxQabs = document.getElementById("Qabs");
      var data = [trace1];
      if (checkBoxQabs.checked == true) data.push(trace2);
      mode_types.forEach(function(mode_type) {
        mode_n.forEach(function (n) {
          var checkBox = document.getElementById(mode_names[mode_type]+n.toString());
          if (checkBox.checked == false) return;
          var trace_sca = {
            x: WLs,
            y: Qsca_n[mode_type][n-1],
            type: 'scatter',
            name: 'Qsca '+mode_names[mode_type]+n.toString()
          };
          data.push(trace_sca)
          if (checkBoxQabs.checked == false) return;
          var trace_abs = {
            x: WLs,
            y: Qabs_n[mode_type][n-1],
            type: 'scatter',
            name: 'Qabs '+mode_names[mode_type]+n.toString()
          };
          data.push(trace_abs)
        });
      });
      Plotly.react('PlotQsca', data, layout, {showSendToCloud: true, displaylogo: false});
    }
  </script>
</body>
</html>