added event listener on near-field replot event

guiapp/package-lock.json

@@ -13,7 +13,7 @@
         "cubic-spline-ts": "^3.0.8",
         "file-saver": "^2.0.5",
         "js-yaml": "^4.1.0",
-        "lodash": "^4.17.21",
+        "lodash.clonedeep": "^4.5.0",
         "mathjs": "^9.5.0",
         "plotly.js-dist-min": "^2.6.2",
         "quasar": "^2.3.3",
@@ -8924,7 +8924,8 @@
     "node_modules/lodash": {
       "version": "4.17.21",
       "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
-      "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
+      "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
+      "dev": true
     },
     "node_modules/lodash._reinterpolate": {
       "version": "3.0.0",
@@ -8932,6 +8933,11 @@
       "integrity": "sha1-DM8tiRZq8Ds2Y8eWU4t1rG4RTZ0=",
       "dev": true
     },
+    "node_modules/lodash.clonedeep": {
+      "version": "4.5.0",
+      "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz",
+      "integrity": "sha1-4j8/nE+Pvd6HJSnBBxhXoIblzO8="
+    },
     "node_modules/lodash.debounce": {
       "version": "4.0.8",
       "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",
@@ -21240,7 +21246,8 @@
     "lodash": {
       "version": "4.17.21",
       "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
-      "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
+      "integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==",
+      "dev": true
     },
     "lodash._reinterpolate": {
       "version": "3.0.0",
@@ -21248,6 +21255,11 @@
       "integrity": "sha1-DM8tiRZq8Ds2Y8eWU4t1rG4RTZ0=",
       "dev": true
     },
+    "lodash.clonedeep": {
+      "version": "4.5.0",
+      "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz",
+      "integrity": "sha1-4j8/nE+Pvd6HJSnBBxhXoIblzO8="
+    },
     "lodash.debounce": {
       "version": "4.0.8",
       "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz",

guiapp/package.json

@@ -15,7 +15,7 @@
     "cubic-spline-ts": "^3.0.8",
     "file-saver": "^2.0.5",
     "js-yaml": "^4.1.0",
-    "lodash": "^4.17.21",
+    "lodash.clonedeep": "^4.5.0",
     "mathjs": "^9.5.0",
     "plotly.js-dist-min": "^2.6.2",
     "quasar": "^2.3.3",

guiapp/src/components/nearfield/GetWlFromPlot.vue

@@ -28,7 +28,7 @@
     <ReactiveChart
       :chart="chartContent"
       :window-height-share="0.4"
-      @plotCreated="mangeID($event)"
+      @plotCreated="manageID($event)"
     />
   </div>
 </template>
@@ -92,7 +92,7 @@ export default defineComponent({
       ];
       return content;
     });
-    function mangeID(chartID: string) {
+    function manageID(chartID: string) {
       const myPlot = document.getElementById(chartID) as PlotlyHTMLElement;
       myPlot.on('plotly_click', function (data) {
         for (let i = 0; i < data.points.length; i++) {
@@ -108,7 +108,7 @@ export default defineComponent({
       chartContent,
       flexRowTitleStyle,
       isShowingHelpForInputWithUnits,
-      mangeID,
+      manageID,
     };
   },
 });

guiapp/src/components/nearfield/PlotNearField.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <ReactiveChart :chart="nearFieldPlot" />
+    <ReactiveChart :chart="nearFieldPlot" @plotCreated="manageID($event)" />
   </div>
 </template>
 
@@ -14,15 +14,15 @@ import {
   computed,
   watch,
 } from 'vue';
-// import { flexRowTitleStyle } from 'components/config'
 import {
   toUnits,
   getMaxFromHeatmap,
   getMinFromHeatmap,
   limitMap,
+  fromUnits,
 } from 'components/utils';
 import { plotlyChart } from 'src/store/plot-runtime/state';
-import { PlotData, DataTitle } from 'plotly.js-dist-min';
+import { PlotData, DataTitle, PlotlyHTMLElement } from 'plotly.js-dist-min';
 import { nearFieldPlane } from 'src/store/simulation-setup/state';
 
 export default defineComponent({
@@ -192,9 +192,38 @@ export default defineComponent({
         nearFieldPlot.layout.xaxis.title = xaxisTitle.value;
     });
 
+    function manageID(chartID: string) {
+      const myPlot = document.getElementById(chartID) as PlotlyHTMLElement;
+      myPlot.on('plotly_relayout', function (data) {
+        if (
+          data['xaxis.range[0]'] &&
+          data['xaxis.range[1]'] &&
+          data['yaxis.range[0]'] &&
+          data['yaxis.range[1]']
+        ) {
+          $store.commit('guiRuntime/setNearFieldZoom', {
+            fromX: fromUnits(units.value, data['xaxis.range[0]']),
+            toX: fromUnits(units.value, data['xaxis.range[1]']),
+            fromY: fromUnits(units.value, data['yaxis.range[0]']),
+            toY: fromUnits(units.value, data['yaxis.range[1]']),
+          });
+        } else {
+          $store.commit('guiRuntime/setNearFieldZoom', {
+            fromX: 0,
+            toX: 0,
+            fromY: 0,
+            toY: 0,
+          });
+        }
+        console.log(data['xaxis.range[0]']);
+        console.log($store.state.guiRuntime.nearFieldZoom);
+      });
+    }
+
     return {
       nearFieldPlot,
       totalR,
+      manageID,
     };
   },
 });

guiapp/src/components/nearfield/SaveSimulationNearField.vue

@@ -6,6 +6,9 @@
     @click="saveSpectrumSimulation"
     >Save</q-btn
   >
+  <q-checkbox v-model="isSaveWithPythonScript" size="sm"
+    >Include *.py plotting script</q-checkbox
+  >
 </template>
 
 <script lang="ts">
@@ -17,10 +20,7 @@ import {
   // nextTick
 } from 'vue';
 import { useStore } from 'src/store';
-// import {getModeName, range, rangeInt} from 'components/utils'
-// import {cloneDeep} from 'lodash'
 import { saveAs } from 'file-saver';
-// import {nearFieldPlane} from 'src/store/simulation-setup/state';
 
 export default defineComponent({
   name: 'SaveSimulationNearField',
@@ -28,6 +28,11 @@ export default defineComponent({
   setup() {
     const $store = useStore();
 
+    const isSaveWithPythonScript = computed({
+      get: () => $store.state.guiRuntime.isSaveWithPythonScript,
+      set: (val) => $store.commit('guiRuntime/setIsSaveWithPythonScript', val),
+    });
+
     const coordX = computed(() => $store.state.plotRuntime.nearFieldCoordX);
     const coordY = computed(() => $store.state.plotRuntime.nearFieldCoordY);
     const data = computed(() => $store.state.plotRuntime.nearFieldEabs);
@@ -53,14 +58,15 @@ export default defineComponent({
     const lengthUnits = computed(() => $store.state.guiRuntime.units);
     return {
       data,
+      isSaveWithPythonScript,
       saveSpectrumSimulation() {
         if (!data.value) return;
-        const fileHeader =
+        const pythonScript =
           '# You can open and plot this file using Python\n' +
           '# (without manually removing this header, it will be skipped), see example below.\n' +
           'import numpy as np\n' +
           'from matplotlib import pyplot as plt\n' +
-          "data = np.genfromtxt('scattnlay-near-field.txt', skip_header=32, names=True, delimiter=', ')\n" +
+          "data = np.genfromtxt('scattnlay-near-field.txt', names=True, delimiter=', ')\n" +
           'x = data[data.dtype.names[0]] # x-axis has units\n' +
           'y = data[data.dtype.names[1]] # x-axis has units\n' +
           'x_size = len(np.unique(x))\n' +
@@ -111,10 +117,16 @@ export default defineComponent({
         }
 
         const scattnlayNearField = new Blob(
-          [fileHeader + columnNames + body],
+          [columnNames + body],
           { type: 'text/plain;charset=utf-8', endings: 'native' } //TODO test if newline is correctly written in Windows, MacOS
         );
         saveAs(scattnlayNearField, 'scattnlay-near-field.txt');
+
+        const scattnlayNearFieldScript = new Blob(
+          [pythonScript],
+          { type: 'text/plain;charset=utf-8', endings: 'native' } //TODO test if newline is correctly written in Windows, MacOS
+        );
+        saveAs(scattnlayNearFieldScript, 'scattnlay-near-field-plot.py');
       },
     };
   },

guiapp/src/store/gui-runtime/mutations.ts

@@ -1,6 +1,7 @@
 import { MutationTree } from 'vuex';
 import { guiRuntimeStateInterface as grsi } from './state';
 import { material } from 'src/store/simulation-setup/state';
+import { cloneDeep } from 'lodash';
 
 function compare(a: material, b: material) {
   if (a.name == 'link') return -1;
@@ -14,6 +15,9 @@ function compare(a: material, b: material) {
 }
 
 const mutation: MutationTree<grsi> = {
+  setIsSaveWithPythonScript(state: grsi, val: boolean) {
+    state.isSaveWithPythonScript = val;
+  },
   setIsShowingHelpForInputWithUnits(state: grsi, val: boolean) {
     state.isShowingHelpForInputWithUnits = val;
   },
@@ -27,6 +31,13 @@ const mutation: MutationTree<grsi> = {
     state.isSourceSameUnits = val;
   },
 
+  setNearFieldZoom(
+    state: grsi,
+    val: { fromX: number; toX: number; fromY: number; toY: number }
+  ) {
+    state.nearFieldZoom = cloneDeep(val);
+  },
+
   setSafeWL(state: grsi, val: { safeFromWL: number; safeToWL: number }) {
     state.safeFromWL = val.safeFromWL;
     state.safeToWL = val.safeToWL;

guiapp/src/store/gui-runtime/state.ts

@@ -10,6 +10,8 @@ export interface guiRuntimeStateInterface {
   activatedMaterials: material[];
   safeFromWL: number;
   safeToWL: number;
+  isSaveWithPythonScript: boolean;
+  nearFieldZoom: { fromX: number; toX: number; fromY: number; toY: number };
 }
 
 function state(): guiRuntimeStateInterface {
@@ -20,6 +22,8 @@ function state(): guiRuntimeStateInterface {
     isSourceSameUnits: true,
     safeFromWL: 0,
     safeToWL: 1e300,
+    isSaveWithPythonScript: true,
+    nearFieldZoom: { fromX: 0, toX: 1, fromY: 0, toY: 1 },
     activatedMaterials: [
       // 'PEC',
       {