mirror/iTree
1
0
Fork 0
mirror of https://github.com/hsokolowski/iTree.git synced 2026-04-21 05:46:54 -04:00
Code Issues Packages Projects Releases Wiki Activity

prepare for modal and separate files for algorithm

Browse Source
This commit is contained in:
Hubert Sokołowski
2021-02-26 00:36:38 +01:00
parent d0cea13ddf
commit de36b86c47
10 changed files with 90 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
.prettierrc
View File

@@ -1,6 +1,6 @@
{
"arrowParens": "avoid",
"printWidth": 120,
"printWidth": 110,
"bracketSpacing": true,
"endOfLine": "lf",
"trailingComma": "es5",

7
src/components/Node/Configurator.jsx Normal file
View File

@@ -0,0 +1,7 @@
import React, { useState } from 'react';
function Configurator() {
return <div>Configurator</div>;
}
export default Configurator;

19
src/components/Node/Joint.jsx
View File

@@ -12,17 +12,29 @@ import {
useDisclosure,
} from '@chakra-ui/react';
import React, { useState } from 'react';
import Configurator from './Configurator';
function Joint({ children, attr2, predicateName, pivot, match, notMatch, onChange }) {
const { isOpen, onOpen, onClose } = useDisclosure();
const [size, setSize] = useState('lg');
const handleOpenModalClick = () => {
buildNewNode();
onOpen();
};
const buildNewNode = () => {
onChange();
};
return (
<Box>
<Badge borderRadius="full" px="2" py="1" colorScheme="teal" onClick={handleOpenModalClick}>
<Badge
borderRadius="full"
px="2"
py="1"
colorScheme="teal"
onClick={handleOpenModalClick}
className={'badge'}
>
{attr2} <b>{predicateName}</b> {pivot}
</Badge>
<Modal onClose={onClose} size={size} isOpen={isOpen}>
@@ -32,7 +44,10 @@ function Joint({ children, attr2, predicateName, pivot, match, notMatch, onChang
{attr2} <b>{predicateName}</b> {pivot}
</ModalHeader>
<ModalCloseButton />
<ModalBody>Text ( kolejny komponent z konfiguratorem)</ModalBody>
<ModalBody>
Text ( kolejny komponent z konfiguratorem)
<Configurator />
</ModalBody>
<ModalFooter>
<Button onClick={onClose}>Close</Button>
</ModalFooter>

38
src/components/Node/ModalPopup.jsx Normal file
View File

@@ -0,0 +1,38 @@
import React, { useState } from 'react';
import {
Badge,
Box,
Button,
Modal,
ModalBody,
ModalCloseButton,
ModalContent,
ModalFooter,
ModalHeader,
ModalOverlay,
useDisclosure,
} from '@chakra-ui/react';
function ModalPopup({ attr2, predicateName, pivot }) {
const { isOpen, onOpen, onClose } = useDisclosure();
const handleOpenModalClick = () => {
onOpen();
};
<Modal onClose={onClose} size={'lg'} isOpen={isOpen}>
<ModalOverlay />
<ModalContent>
<ModalHeader>
{attr2} <b>{predicateName}</b> {pivot}
</ModalHeader>
<ModalCloseButton />
<ModalBody>Text ( kolejny komponent z konfiguratorem)</ModalBody>
<ModalFooter>
<Button onClick={onClose}>Close</Button>
</ModalFooter>
</ModalContent>
</Modal>;
}
export default ModalPopup;

32
src/components/Node/index.jsx
View File

@@ -5,24 +5,14 @@ import Joint from './Joint';
import Leaf from './Leaf';
const Node = props => {
console.log(props.node);
//console.log(props.node);
const [highlighted, setHighlighted] = useState(false);
const [node, setNode] = useState(props.node || {});
useEffect(() => setNode(props.node || {}), [props.node, setNode]);
const {
category,
quality,
matchedCount,
notMatchedCount,
match,
notMatch,
attr2,
predicateName,
pivot,
} = node;
const { category, quality, matchedCount, notMatchedCount, match, notMatch, attr2, predicateName, pivot } = node;
const onNodeClicked = e => {
console.log(e);
//console.log(e);
e.stopPropagation();
console.log('Node clicked', node);
//const changed = addComment(node);
@@ -34,9 +24,12 @@ const Node = props => {
const onChange = useMemo(() => {
return node => {
const index = match.findIndex(c => c.id === node.id);
match.splice(index, 1, node);
props.node.match = [...match];
console.log(node);
// const index = match.findIndex(c => c.id === node.id);
// console.log(index);
// console.log(match);
// match.splice(index, 1, node);
// props.node.match = [...match];
};
}, [match, props.node]);
@@ -47,12 +40,7 @@ const Node = props => {
return (
<div className={`node ${highlighted ? 'highlight' : ''}`} onClick={onNodeClicked}>
{category ? (
<Leaf
category={category}
matchedCount={matchedCount}
notMatchedCount={notMatchedCount}
quality={quality}
/>
<Leaf category={category} matchedCount={matchedCount} notMatchedCount={notMatchedCount} quality={quality} />
) : (
<Joint
attr2={attr2}

23
src/css/main.scss
View File

@@ -9,23 +9,9 @@ $gradient-right: linear-gradient(90deg, #d8dbe2ff, #a9bcd0ff, #58a4b0ff, #373f51
$gradient-bottom: linear-gradient(180deg, #d8dbe2ff, #a9bcd0ff, #58a4b0ff, #373f51ff, #1b1b1eff);
$gradient-left: linear-gradient(270deg, #d8dbe2ff, #a9bcd0ff, #58a4b0ff, #373f51ff, #1b1b1eff);
$gradient-top-right: linear-gradient(45deg, #d8dbe2ff, #a9bcd0ff, #58a4b0ff, #373f51ff, #1b1b1eff);
$gradient-bottom-right: linear-gradient(
135deg,
#d8dbe2ff,
#a9bcd0ff,
#58a4b0ff,
#373f51ff,
#1b1b1eff
);
$gradient-bottom-right: linear-gradient(135deg, #d8dbe2ff, #a9bcd0ff, #58a4b0ff, #373f51ff, #1b1b1eff);
$gradient-top-left: linear-gradient(225deg, #d8dbe2ff, #a9bcd0ff, #58a4b0ff, #373f51ff, #1b1b1eff);
$gradient-bottom-left: linear-gradient(
315deg,
#d8dbe2ff,
#a9bcd0ff,
#58a4b0ff,
#373f51ff,
#1b1b1eff
);
$gradient-bottom-left: linear-gradient(315deg, #d8dbe2ff, #a9bcd0ff, #58a4b0ff, #373f51ff, #1b1b1eff);
$gradient-radial: radial-gradient(#d8dbe2ff, #a9bcd0ff, #58a4b0ff, #373f51ff, #1b1b1eff);
.center-horizontal {
@@ -64,3 +50,8 @@ $gradient-radial: radial-gradient(#d8dbe2ff, #a9bcd0ff, #58a4b0ff, #373f51ff, #1
text-align: left;
//background-color: green;
}
.badge {
&:hover {
cursor: pointer;
}
}

0
src/utils/algorithms/c45-tree.js Normal file
View File

0
src/utils/algorithms/tsp-tree.js Normal file
View File

0
src/utils/algorithms/tsp-weight-tree.js Normal file
View File

48
src/utils/decision-tree.js
View File

@@ -17,32 +17,15 @@
* @param {boolean} isChanged
*/
//TSP
export function buildDecisionTree(
_builder,
isChanged = false,
changedAttribute1 = null,
changedAttribute2 = null
) {
export function buildDecisionTree(_builder, isChanged = false, changedAttribute1 = null, changedAttribute2 = null) {
//debugger;
const builder = { ..._builder };
const {
trainingSet,
minItemsCount,
categoryAttr,
entropyThrehold,
maxTreeDepth,
ignoredAttributes,
} = builder;
const { trainingSet, minItemsCount, categoryAttr, entropyThrehold, maxTreeDepth, ignoredAttributes } = builder;
//console.log("########## NOWY WEZEL ########", trainingSet.length);
/** @type {string | number} */
var _quality = 0;
if (maxTreeDepth === 0 || trainingSet.length <= minItemsCount) {
//console.log(
// "LISC BO MAX TREE DEPTH",
// maxTreeDepth,
// "LISC ILOSC",
// trainingSet.length
//);
console.log('LISC BO MAX TREE DEPTH', maxTreeDepth, 'LISC ILOSC', trainingSet.length);
//gger;
let _category = mostFrequentValue(trainingSet, categoryAttr);
let _positiveCounter = 0;
@@ -80,20 +63,14 @@ export function buildDecisionTree(
var directrion = '<';
var leftList = [],
rightList = [],
classMatrix = [
new Array(builder.allClasses.length).fill(0),
new Array(builder.allClasses.length).fill(0),
],
classMatrix = [new Array(builder.allClasses.length).fill(0), new Array(builder.allClasses.length).fill(0)],
match = [],
notMatch = [];
if (isChanged) {
right = left = 0;
leftList = [];
rightList = [];
classMatrix = [
new Array(builder.allClasses.length).fill(0),
new Array(builder.allClasses.length).fill(0),
];
classMatrix = [new Array(builder.allClasses.length).fill(0), new Array(builder.allClasses.length).fill(0)];
for (let index = 0; index < trainingSet.length; index++) {
const element = trainingSet[index];
@@ -122,8 +99,7 @@ export function buildDecisionTree(
}
//console.log("Rank Lewy",rankL,"Rank Prawy",rankR);
var currentDif =
(right / trainingSet.length) * (1 - rankR) + (left / trainingSet.length) * (1 - rankL);
var currentDif = (right / trainingSet.length) * (1 - rankR) + (left / trainingSet.length) * (1 - rankL);
if (currentDif < maxDif) {
//console.log("------Zapisanie maxDif-------");
//console.log(attr1,attr2);
@@ -146,10 +122,7 @@ export function buildDecisionTree(
right = left = 0;
leftList = [];
rightList = [];
classMatrix = [
new Array(builder.allClasses.length).fill(0),
new Array(builder.allClasses.length).fill(0),
];
classMatrix = [new Array(builder.allClasses.length).fill(0), new Array(builder.allClasses.length).fill(0)];
for (let index = 0; index < trainingSet.length; index++) {
const element = trainingSet[index];
@@ -178,8 +151,7 @@ export function buildDecisionTree(
}
//console.log("Rank Lewy",rankL,"Rank Prawy",rankR);
var currentDif =
(right / trainingSet.length) * (1 - rankR) + (left / trainingSet.length) * (1 - rankL);
var currentDif = (right / trainingSet.length) * (1 - rankR) + (left / trainingSet.length) * (1 - rankL);
if (currentDif < maxDif) {
//console.log("------Zapisanie maxDif-------");
//console.log(attr1,attr2);
@@ -202,7 +174,7 @@ export function buildDecisionTree(
//console.log(attribute1, attribute2);
//console.log("L/R ", match.length + ":" + notMatch.length);
//console.log(podzial);
//console.log("MaxDifference:", maxDif);
console.log('MaxDifference:', maxDif);
if (!maxDif) {
//console.log("LISC BO MAX DIF ZERO", trainingSet.length);
let _category = mostFrequentValue(trainingSet, categoryAttr);
@@ -227,7 +199,7 @@ export function buildDecisionTree(
// sprawdzic
// wssytskies stringi do ignored
if (match.length === 0 || notMatch.length === 0) {
//console.log("LISC BO JEDNA ZE STRON MA 0");
console.log('LISC BO JEDNA ZE STRON MA 0');
let _category = mostFrequentValue(trainingSet, categoryAttr);
let _positiveCounter = 0;
//console.log(_category);