diff --git a/dist/2.0.0/mendix.ReactDDDjs.mpk b/dist/2.0.0/mendix.ReactDDDjs.mpk index 6a4ccce..28deb83 100644 Binary files a/dist/2.0.0/mendix.ReactDDDjs.mpk and b/dist/2.0.0/mendix.ReactDDDjs.mpk differ diff --git a/src/components/D3NetworkJSON.js b/src/components/D3NetworkJSON.js index 40742ad..07f8e4d 100644 --- a/src/components/D3NetworkJSON.js +++ b/src/components/D3NetworkJSON.js @@ -196,14 +196,14 @@ function Network(props) { let nodes = []; nodesdata.forEach(node => { let nodeObj = {} - nodeObj.ID = props.nodeID(node).value; - nodeObj.name = props.nodeName(node).value; + nodeObj.ID = getObject(props, 'nodeID', node).value; + nodeObj.name = getObject(props, 'nodeName', node).value; nodeObj.repulsion = getNodeRepulsion(node); nodeObj.shape = getNodeShape(node); nodeObj.width = getNodeWidth(node); nodeObj.height = getNodeHeight(node); nodeObj.style = getNodeStyle(node); - nodeObj.imgUrl =getNodeImgUrl(node); + nodeObj.imgUrl = getNodeImgUrl(node); nodes.push(nodeObj); }) return nodes; @@ -212,13 +212,13 @@ function Network(props) { function setLinksState (linksdata, nodesList){ let links = []; linksdata.forEach(link => { - if(nodesList.some(node => node.ID === props.linkSourceID(link).value) && - nodesList.some(node => node.ID === props.linkTargetID(link).value)){ - let repulsionSource = nodesList.filter(node => { return node.ID === props.linkSourceID(link).value})[0].repulsion; - let repulsionTarget = nodesList.filter(node => { return node.ID === props.linkTargetID(link).value})[0].repulsion; + if(nodesList.some(node => node.ID === props.linkSourceID.get(link).value) && + nodesList.some(node => node.ID === props.linkTargetID.get(link).value)){ + let repulsionSource = nodesList.filter(node => { return node.ID === props.linkSourceID.get(link).value})[0].repulsion; + let repulsionTarget = nodesList.filter(node => { return node.ID === props.linkTargetID.get(link).value})[0].repulsion; let linkObj = { - "source": props.linkSourceID(link).value, - "target": props.linkTargetID(link).value, + "source": props.linkSourceID.get(link).value, + "target": props.linkTargetID.get(link).value, "style": getLinkStyle(link), "biggestNode": Math.max(repulsionSource, repulsionTarget) } @@ -228,57 +228,70 @@ function Network(props) { return links; } + function getObject(object, functionName, ...args){ + return (object[functionName]?.constructor === Function) + ? object[functionName](...args) + : object[functionName].get(...args); + } + function getNodeRepulsion(node){ - if (props.nodeRepulsion && props.nodeRepulsion(node).displayValue){ - return props.nodeRepulsion(node).displayValue; + let obj; + if (props.nodeRepulsion && (obj = getObject(props, 'nodeRepulsion', node)) && obj.displayValue){ + return obj.displayValue; }else{ return 5; } } function getNodeShape(node){ - if (props.nodeShape && props.nodeShape(node).displayValue){ - return props.nodeShape(node).displayValue; + let obj; + if (props.nodeShape && (obj = getObject(props, 'nodeShape', node)) && obj.displayValue){ + return obj.displayValue; }else{ return 'rect'; } } function getNodeWidth(node){ - if (props.nodeWidth && props.nodeWidth(node).displayValue && props.nodeWidth(node).displayValue != ''){ - return props.nodeWidth(node).displayValue; + let obj; + if (props.nodeWidth && (obj = getObject(props, 'nodeWidth', node)) && obj.displayValue && obj.displayValue != '' && obj.displayValue != 0){ + return obj.displayValue; }else{ return '10'; } } function getNodeHeight(node){ - if (props.nodeHeight && props.nodeHeight(node).displayValue && props.nodeHeight(node).displayValue != ''){ - return props.nodeHeight(node).displayValue; + let obj; + if (props.nodeHeight && (obj = getObject(props, 'nodeHeight', node)) && obj.displayValue && obj.displayValue != '' && obj.displayValue != 0){ + return obj.displayValue; }else{ return '10'; } } function getNodeStyle(node){ - if (props.nodeStyle && props.nodeStyle(node).displayValue ){ - return props.nodeStyle(node).displayValue; + let obj; + if (props.nodeStyle && (obj = getObject(props, 'nodeStyle', node)) && obj.displayValue ){ + return obj.displayValue; }else{ return ''; } } function getNodeImgUrl(node){ - if (props.nodeImgUrl && props.nodeImgUrl(node).displayValue ){ - return props.nodeImgUrl(node).displayValue; + let obj; + if (props.nodeImgUrl && (obj = getObject(props, 'nodeImgUrl', node)) && obj.displayValue ){ + return obj.displayValue; }else{ return ''; } } function getLinkStyle(link){ - if (props.linkStyle && props.linkStyle(link).value && props.linkStyle(link).value != ''){ - return props.linkStyle(link).value + let obj; + if (props.linkStyle && (obj = getObject(props, 'linkStyle', link)) && obj.value && obj.value != ''){ + return obj.value }else{ return "stroke:gray;stroke-width:2"; } diff --git a/tests/testProject/widgets/mendix.ReactDDDjs.mpk b/tests/testProject/widgets/mendix.ReactDDDjs.mpk index 6a4ccce..28deb83 100644 Binary files a/tests/testProject/widgets/mendix.ReactDDDjs.mpk and b/tests/testProject/widgets/mendix.ReactDDDjs.mpk differ