| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142 | <!DOCTYPE html><html lang="en" class="section"><head>    <meta charset="UTF-8">    <title>Mie calculator</title>    <meta name='viewport' content='width=device-width, initial-scale=1'>    <link rel='stylesheet' href='buefy.min.css'>    <link rel='stylesheet' href='materialdesignicons.min.css'>    <link rel='stylesheet' href='all.css'><!--    <link rel='stylesheet' href='https://unpkg.com/buefy/dist/buefy.min.css'>--><!--    <link rel='stylesheet' href='https://cdn.materialdesignicons.com/2.0.46/css/materialdesignicons.min.css'>--><!--    <link rel='stylesheet' href='https://use.fontawesome.com/releases/v5.0.6/css/all.css'>--></head><body><!-- partial:index.partial.html --><div id="app" class="container">    <section style="padding: 1rem">    <button class="button is-primary is-medium"            @click="isShowInfo = true">        Show info    </button>    <b-modal :active.sync="isShowInfo">        <div class="message" style="padding: 2rem">            <span style="text-decoration: underline;text-emphasis: before;font-weight: bold;">Usage:</span>            <br><br>            Feel free to use provided software, however, use it at your own risk. We made our best effort to verify            it is correct, however, we do not provide any warranty.            <br><br>            If it was usefull for your project, please, cite in your related paper the following reference:            <br><br>            <article style="margin-left: 1rem">                <div style="font-style: italic; padding-bottom: 0.5rem">"Mie calculation of electromagnetic near-field                    for a multilayered sphere"</div>                Konstantin Ladutenko, Umapada Pal, Antonio Rivera, Ovidio Peña-Rodríguez<br>                <span style="font-weight: bold">Comp. Phys. Comm., vol. 214, pp. 225–230, 2017</span>            </article>        </div>    </b-modal>    </section>    <section>        <div class="field is-horizontal">            <div class="field-label is-normal">                <label class="label">Units</label>            </div>            <div class="field-body">                <b-select v-model="units">                    <option units="nm">nm</option>                    <option units="mkm">mkm</option>                    <option units="mm">mm</option>                    <option units="cm">cm</option>                    <option units="m">m</option>                    <option units="km">km</option>                </b-select>            </div>        </div>        <div class="field is-horizontal">            <div class="field-label is-normal">                <label class="label">Wavelength</label>            </div>            <div class="field-body">                <div class="field is-grouped is-grouped-multiline">                    <input-with-units title="from" v-bind:units="units"                                      v-bind:value="simulationSetup.fromWL"                                      @newdata="simulationSetup.fromWL=$event"></input-with-units>                    <input-with-units title="to" v-bind:units="units"                                      v-bind:value="simulationSetup.toWL"                                      @newdata="simulationSetup.toWL=$event"></input-with-units>                    <input-with-units title="step" v-bind:units="units"                                      v-bind:value="simulationSetup.stepWL"                                      @newdata="simulationSetup.stepWL=$event"></input-with-units>                </div>            </div>        </div>        <div class="field is-horizontal">            <div class="field-label is-normal">                <label class="label">Spherical particle</label>            </div>            <div class="field-body">                <div class="field is-grouped is-grouped-multiline">                    <input-with-units title="R" v-bind:units="units"                                      v-bind:value="simulationSetup.R"                                      @newdata="simulationSetup.R=$event"></input-with-units>                    <input-with-units title="Re(n)" units=""                                      v-bind:value="simulationSetup.reN"                                      @newdata="simulationSetup.reN=$event"></input-with-units>                    <input-with-units title="Im(n)" units=""                                      v-bind:value="simulationSetup.imN"                                      @newdata="simulationSetup.imN=$event"></input-with-units>                </div>            </div>        </div>        <div  class="field is-horizontal">            <div class="field-label is-normal">                <label class="label">Modes to plot</label>            </div>            <div class="field-body">                <b-input v-model="simulationSetup.total_mode_n" type='number' min=1 style="width:7rem"></b-input>            </div>        </div>        <div>From {{simulationSetup.fromWL}} to {{simulationSetup.toWL}} {{ units }}            <br>        Changes:{{ changes }}        </div>        <div class="chart-container">            <reactive-chart :chart="chart"></reactive-chart>        </div>    </section></div><!--<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>--><script src="plotly-latest.min.js"></script><!--<script src='https://cdnjs.cloudflare.com/ajax/libs/plotly.js/1.39.1/plotly.js'></script>--><script src='vue.min.js'></script><script src='buefy.min.js'></script><!--<script src='https://unpkg.com/vue/dist/vue.min.js'></script>--><!--<script src='https://unpkg.com/buefy/dist/buefy.min.js'></script>--><!--<script src='https://unpkg.com/axios/dist/axios.min.js'></script>--><!--<script src='https://cdn.jsdelivr.net/npm/lodash@4.17.4/lodash.min.js'></script>--><!--<script src='https://unpkg.com/cleave.js/dist/cleave.min.js'></script>--><!--<script src='https://cdn.jsdelivr.net/npm/sortablejs@1.6.1/Sortable.min.js'></script>--><!--<script src='https://cdn.jsdelivr.net/npm/vee-validate@2.1.0-beta.9/dist/vee-validate.min.js'></script>--><script  src="./tested-components.js"></script><!--<script src="nmie.js"></script>--><script>    'use strict';    // var myExports = require('./nmie.js');    //    // console.log(Object.keys(myExports));    // const nmie = new Module.nmie();</script><script  src="script.js"></script><link rel="stylesheet" type="text/css" href="local.css"></body></html>
 |