Fix topology width

This commit is contained in:
JUDIT GRESKOVITS 2017-04-06 21:44:54 +01:00
parent 968a6914f5
commit 7d61d11e39
1 changed files with 14 additions and 8 deletions

View File

@ -14,11 +14,6 @@ const StyledSvg = styled.svg`
height: 1400px; height: 1400px;
`; `;
const svgSize = {
width: 2400,
height: 1400
};
let dragInfo = { let dragInfo = {
dragging: false, dragging: false,
nodeId: null, nodeId: null,
@ -33,6 +28,7 @@ class TopologyGraph extends React.Component {
return acc; return acc;
}, []); }, []);
const svgSize = this.getSvgSize();
const simulationData = createSimulation( const simulationData = createSimulation(
services, services,
svgSize//, svgSize//,
@ -106,9 +102,18 @@ class TopologyGraph extends React.Component {
}*/ }*/
getSvgSize() { getSvgSize() {
return document.getElementById('topology-svg') ? if(document.getElementById('topology-svg')) {
document.getElementById('topology-svg').getBoundingClientRect() : return (
svgSize; document.getElementById('topology-svg').getBoundingClientRect()
);
}
const windowWidth = window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;
return {
width: windowWidth - 2*24,
height: 1400
};
} }
constrain(x, y, children=false) { constrain(x, y, children=false) {
@ -153,6 +158,7 @@ class TopologyGraph extends React.Component {
nodes.reduce((acc, simNode, index) => nodes.reduce((acc, simNode, index) =>
simNode.id === nodeId ? simNode : acc, {}); simNode.id === nodeId ? simNode : acc, {});
const svgSize = this.getSvgSize();
const nodesData = services.map((service, index) => { const nodesData = services.map((service, index) => {
const sNode = service.id === 'consul' ? { const sNode = service.id === 'consul' ? {
x: svgSize.width - Constants.nodeSize.width, x: svgSize.width - Constants.nodeSize.width,