Added lossGraph to features.json

features.json

@@ -1,4 +1,5 @@
 {
   "title": "Learning tool",
-  "knnModel": true
-}
+  "knnModel": true,
+  "lossGraph": true
+}

src/__viteBuildVariants__/ml-machine-simple/features.json

@@ -1,4 +1,5 @@
 {
   "title": "ML-Machine",
-  "knnModel": false
-}
+  "knnModel": false,
+  "lossGraph": false
+}

src/__viteBuildVariants__/ml-machine/features.json

@@ -1,4 +1,5 @@
 {
   "title": "ML-Machine",
-  "knnModel": true
-}
+  "knnModel": true,
+  "lossGraph": true
+}

src/__viteBuildVariants__/unbranded/features.json

@@ -1,4 +1,5 @@
 {
   "title": "Learning tool",
-  "knnModel": true
-}
+  "knnModel": true,
+  "lossGraph": true
+}

src/components/graphs/LossGraph.svelte

@@ -21,7 +21,7 @@
 
   import { onMount } from 'svelte';
   import { Readable } from 'svelte/store';
-  import { LossTrainingIteration } from './LossGraphUtil';
+  import { LossTrainingIteration } from '../../script/mlmodels/LayersModelTrainer';
 
   export let loss: Readable<LossTrainingIteration[]>;
   export let maxX: number | undefined = undefined;

src/pages/training/NeuralNetworkTrainingPageView.svelte

@@ -12,6 +12,7 @@
   import StandardButton from '../../components/buttons/StandardButton.svelte';
   import ModelRegistry from '../../script/domain/ModelRegistry';
   import Logger from '../../script/utils/Logger';
+  import { Feature, hasFeature } from '../../script/FeatureToggles';
 
   const classifier = stores.getClassifier();
   const model = classifier.getModel();
@@ -37,7 +38,7 @@
     <StandardButton onClick={trainModelClickHandler}
       >{$t(trainButtonSimpleLabel)}</StandardButton>
   {/if}
-  {#if $loss.length > 0}
+  {#if $loss.length > 0 && hasFeature(Feature.LOSS_GRAPH)}
     <LossGraph {loss} maxX={StaticConfiguration.layersModelTrainingSettings.noOfEpochs} />
   {/if}
 </div>

src/pages/training/TrainModelButton.svelte

@@ -12,12 +12,12 @@
   import StandardButton from '../../components/buttons/StandardButton.svelte';
   import { Writable } from 'svelte/store';
 
-  import { LossTrainingIteration } from '../../components/graphs/LossGraphUtil';
   import { highlightedAxis } from '../../script/stores/uiStore';
   import { stores } from '../../script/stores/Stores';
   import { options, trainModel } from './TrainModelButton';
   import Axes from '../../script/domain/Axes';
   import ModelRegistry, { ModelInfo } from '../../script/domain/ModelRegistry';
+  import { LossTrainingIteration } from '../../script/mlmodels/LayersModelTrainer';
 
   export let onTrainingIteration: (iteration: LossTrainingIteration) => void;
   export let onClick: () => void;

src/pages/training/TrainModelButton.ts

@@ -13,8 +13,7 @@ import { stores } from '../../script/stores/Stores';
 import StaticConfiguration from '../../StaticConfiguration';
 import KNNNonNormalizedModelTrainer from '../../script/mlmodels/KNNNonNormalizedModelTrainer';
 import { extractAxisFromTrainingData } from '../../script/utils/graphUtils';
-import LayersModelTrainer from '../../script/mlmodels/LayersModelTrainer';
-import { LossTrainingIteration } from '../../components/graphs/LossGraphUtil';
+import LayersModelTrainer, { LossTrainingIteration } from '../../script/mlmodels/LayersModelTrainer';
 import { FilterType } from '../../script/domain/FilterTypes';
 import Filters from '../../script/domain/Filters';
 import ModelRegistry, { ModelInfo } from '../../script/domain/ModelRegistry';

src/pages/training/TrainingPage.ts

@@ -4,7 +4,6 @@
  * SPDX-License-Identifier: MIT
  */
 import { get, writable } from 'svelte/store';
-import { LossTrainingIteration } from '../../components/graphs/LossGraphUtil';
 import { highlightedAxis, selectedModel } from '../../script/stores/uiStore';
 import Axes from '../../script/domain/Axes';
 import KNNNonNormalizedModelTrainer from '../../script/mlmodels/KNNNonNormalizedModelTrainer';
@@ -14,7 +13,7 @@ import { stores } from '../../script/stores/Stores';
 import CookieManager from '../../script/CookieManager';
 import { appInsights } from '../../appInsights';
 import ModelRegistry, { ModelInfo } from '../../script/domain/ModelRegistry';
-import LayersModelTrainer from '../../script/mlmodels/LayersModelTrainer';
+import LayersModelTrainer, { LossTrainingIteration } from '../../script/mlmodels/LayersModelTrainer';
 
 export const loss = writable<LossTrainingIteration[]>([]);
 

src/script/FeatureToggles.ts

@@ -10,6 +10,7 @@ import Logger from './utils/Logger';
 export enum Feature {
   KNN_MODEL = 'knnModel',
   TITLE = 'title',
+  LOSS_GRAPH = 'lossGraph',
 }
 
 export const hasFeature = (feature: Feature): boolean => {

src/script/mlmodels/LayersModelTrainer.ts

@@ -3,7 +3,6 @@
  *
  * SPDX-License-Identifier: MIT
  */
-import { LossTrainingIteration } from '../../components/graphs/LossGraphUtil';
 import ModelTrainer, { TrainingData } from '../domain/ModelTrainer';
 import LayersMLModel from './LayersMLModel';
 import * as tf from '@tensorflow/tfjs';
@@ -15,11 +14,16 @@ export type LayersModelTrainingSettings = {
   batchSize: number;
 };
 
+export type LossTrainingIteration = {
+  loss: number;
+  epoch: number;
+};
+
 class LayersModelTrainer implements ModelTrainer<LayersMLModel> {
   constructor(
     private settings: LayersModelTrainingSettings,
     private onFitIteration: (h: LossTrainingIteration) => void,
-  ) {}
+  ) { }
   public async trainModel(trainingData: TrainingData): Promise<LayersMLModel> {
     // Fetch data
     const features: Array<number[]> = [];

src/script/utils/graphUtils.ts

@@ -123,3 +123,8 @@ export const distanceBetween = (point1: Point3D, point2: Point3D): number => {
 
   return Math.sqrt(squaredDistance);
 };
+
+export type LossTrainingIteration = {
+  loss: number;
+  epoch: number;
+};