second tree for test data

src/components/ConfusionMatrix/index.jsx

@@ -53,8 +53,9 @@ function ConfusionMatrix({ tree, onChange, data, allClasses, categoryAttr, disab
     console.log('use effect confusion matrix');
     let CM = buildArray(allClasses.length);
 
-    if (!disabled && tree !== null) {
+    if (!disabled && tree !== null && data !== null) {
       let prediction, clazz;
+      //console.log(data);
       for (let index = 0; index < data.length; index++) {
         //for (let index = 100; index < 102; index++) {
         prediction = predict(tree, data[index]);

src/components/Node/Joint.jsx

@@ -44,7 +44,7 @@ function Joint({ children, attr2, predicateName, pivot, weight, requestFoldToLea
               <Box>
                 <b>{predicateName}</b>
               </Box>
-              <Box>{weight ? weight?.toFixed(3) + ' * ' : ''}</Box>
+              <Box>{weight ? parseFloat(weight).toFixed(3) + ' * ' : ''}</Box>
               <Box>{pivot}</Box>
             </Stack>
           </Button>

src/components/Node/ModalPopup.jsx

@@ -33,7 +33,7 @@ function ModalPopup({ attr2, predicateName, pivot, weight, isOpen, nodeSet, onOp
       <ModalOverlay />
       <ModalContent>
         <ModalHeader>
-          {attr2} <b>{predicateName}</b> {weight ? weight?.toFixed(3) + ' * ' : ''} {pivot}
+          {attr2} <b>{predicateName}</b> {weight ? parseFloat(weight).toFixed(3) + ' * ' : ''} {pivot}
         </ModalHeader>
         <ModalCloseButton />
         <ModalBody>

src/components/Node/index.jsx

@@ -134,7 +134,7 @@ const Node = props => {
     <div className={`node ${highlighted ? 'highlight' : ''}`} onClick={onNodeClicked}>
       <Box d="flex" flexDirection="column" p="1" paddingLeft={3}>
         <Box d="flex" flexDirection="row">
-          <DataViewer node={node} side={side} hide={hide} onChange={handleHide} />
+          {/* <DataViewer node={node} side={side} hide={hide} onChange={handleHide} /> */}
         </Box>
         <div style={{ display: hide ? 'none' : 'block' }}>
           {category ? (

src/components/Tree.jsx

@@ -22,6 +22,7 @@ import { executeAlgorithm } from '../utils/algorithm-executor';
 import TestSetFileReader from './TestSetFileReader';
 import ConfusionMatrix from './ConfusionMatrix';
 import { getSizeTree } from '../utils/size-checker';
+import { testTree } from '../services/playground3';
 
 /**
  * @typedef {import('../utils/decision-tree.js').DecisionTreeBuilder} DecisionTreeBuilder
@@ -45,14 +46,16 @@ const Tree = ({ options }) => {
   const [accuracyTraining, setAccuracyTraining] = useState(0);
   const [accuracyTest, setAccuracyTest] = useState(0);
   const [root, setRoot] = useState(null);
+  const [secondRoot, setSecondRoot] = useState(null);
   const [sizeTree, setSizeTree] = useState({ joints: 0, leafs: 0 });
-  const [testSet, setTestSet] = useState([]);
+  const [testSet, setTestSet] = useState(null);
   const [showTestTree, setShowTestTree] = useState(false);
   const { isLoading, setIsLoading } = useLoadingContext();
 
   useEffect(() => {
     setRoot(null);
     setIsLoading(true);
+    setTestSet(null);
     let terminated = false;
     executeAlgorithm(options)
       .then(value => {
@@ -60,6 +63,7 @@ const Tree = ({ options }) => {
           return;
         }
         setRoot(value);
+        updateTestTree(value);
       })
       .catch(e => console.error(e))
       .finally(() => {
@@ -82,13 +86,33 @@ const Tree = ({ options }) => {
     //setAccuracy(Math.random() * 10);
   }, [root]);
 
-  const requestChildChange = newRoot => setRoot(newRoot);
+  const requestChildChange = newRoot => {
+    setRoot(newRoot);
+    updateTestTree(newRoot);
+  };
 
   function handleGetTestSet({ data }) {
     setTestSet(data);
   }
+
+  function updateTestTree(newRoot) {
+    console.log(options.categoryAttr);
+    let tmpRoot = JSON.parse(JSON.stringify(newRoot));
+    if (testSet == null) {
+      testTree(tmpRoot, options.trainingSet, options.categoryAttr);
+      console.log(tmpRoot);
+      setSecondRoot(tmpRoot);
+    } else {
+      testTree(tmpRoot, testSet, options.categoryAttr);
+      console.log(tmpRoot);
+      setSecondRoot(tmpRoot);
+    }
+  }
+
   function handleShowTestTree(e) {
+    console.log(e);
     setShowTestTree(e.target.checked);
+    //updateTestTree(root);
   }
 
   return (
@@ -193,7 +217,7 @@ const Tree = ({ options }) => {
               <FormLabel htmlFor="show-tree" mb="0">
                 Show test tree
               </FormLabel>
-              <Switch id="show-tree-switch" onChange={handleShowTestTree} />
+              <Switch id="show-tree-switch" onChange={e => handleShowTestTree(e)} />
             </FormControl>
           </Box>
         </Stack>
@@ -211,7 +235,16 @@ const Tree = ({ options }) => {
             </Box>
             <Box width="100%" d={showTestTree ? '' : 'none'}>
               Test tree
-              <Node node={root} onChange={() => {}} requestChildChange={requestChildChange} side={true} />
+              {showTestTree ? (
+                <Node
+                  node={secondRoot}
+                  onChange={() => {}}
+                  //requestChildChange={requestChildChange}
+                  side={true}
+                />
+              ) : (
+                <div></div>
+              )}
             </Box>
           </Box>
         )}

src/services/playground3.js

@@ -0,0 +1,62 @@
+export function testTree(tree, newData, categoryAttr) {
+  let predicate;
+  console.log(categoryAttr);
+  if (tree.category) {
+    tree.trainingSet2 = newData;
+    let _positiveCounter = 0,
+      _quality = 0;
+    for (let element of newData) {
+      if (element[categoryAttr] === tree.category) _positiveCounter++;
+    }
+    let _negativeCounter = newData.length - _positiveCounter;
+    _quality = _positiveCounter / newData.length;
+    _quality = _quality * 100;
+
+    tree.quality = _quality.toFixed(2);
+    tree.matchedCount = _positiveCounter;
+    tree.notMatchedCount = _negativeCounter;
+    return;
+  } else {
+    tree.nodeSet = newData;
+
+    predicate = predicates[tree.predicateName];
+
+    let matchedData = [],
+      notMatchedData = [];
+
+    newData.forEach(x => {
+      let match;
+      if (tree.predicateName === '==' || tree.predicateName === '>=') {
+        match = predicate(x[tree.attr2], tree.pivot);
+        console.log('c45', match);
+      } else if (tree.weight) {
+        match = predicate(x[tree.attr2], x[tree.pivot], tree.weight);
+        console.log('tspw', match);
+      } else {
+        match = predicate(x[tree.attr2], x[tree.pivot]);
+        console.log('tsp', match);
+      }
+
+      match ? matchedData.push(x) : notMatchedData.push(x);
+    });
+
+    testTree(tree.match, matchedData, categoryAttr);
+    testTree(tree.notMatch, notMatchedData, categoryAttr);
+  }
+}
+
+var predicates = {
+  '==': function (a, b) {
+    return a === b;
+  },
+  '>=': function (a, b) {
+    return a >= b;
+  },
+  '<': function (a, b) {
+    return a < b;
+  },
+  w: function (a, b, w) {
+    //console.log(a < w * b, a, w * b);
+    return a < w * b;
+  },
+};