inex
/
index.community
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

faster edges

This commit is contained in:
Tao Bror Bojlén 2019-07-19 16:49:20 +03:00
parent 898d0ff268
commit 1050e07072
No known key found for this signature in database
GPG Key ID: C6EC7AAB905F9E6F
1 changed files with 6 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
frontend/src/components/Cytoscape.tsx
View File

@ -4,7 +4,7 @@ import ReactDOM from "react-dom";
import styled from "styled-components";
import { DEFAULT_NODE_COLOR, SELECTED_NODE_COLOR } from "../constants";
const FullDiv = styled.div`
const EntireWindowDiv = styled.div`
position: absolute;
top: 50px;
bottom: 0;
@ -38,7 +38,6 @@ class Cytoscape extends React.Component<ICytoscapeProps> {
...n,
data: {
...n.data,
fontSize: Math.min(Math.max(n.data.size * 10, 6), 50),
size: Math.min(Math.max(n.data.size * 20, 1), 100)
}
}))
@ -50,6 +49,7 @@ class Cytoscape extends React.Component<ICytoscapeProps> {
},
maxZoom: 2,
minZoom: 0.03,
motionBlur: true,
selectionType: "single"
});
@ -70,14 +70,15 @@ class Cytoscape extends React.Component<ICytoscapeProps> {
})
.selector("edge")
.style({
"curve-style": "haystack", // fast edges
"line-color": DEFAULT_NODE_COLOR,
width: "data(weight)"
})
.selector("node[label]")
.style({
color: "black",
"font-size": "data(fontSize)",
"min-zoomed-font-size": 20,
"font-size": "mapData(size, 1, 100, 6, 50)",
"min-zoomed-font-size": 16,
"text-background-color": DEFAULT_NODE_COLOR,
"text-background-opacity": 0.5,
"text-background-padding": "5px"
@ -102,7 +103,7 @@ class Cytoscape extends React.Component<ICytoscapeProps> {
}
public render() {
return <FullDiv />;
return <EntireWindowDiv />;
}
}