tweak: graph bigger + better colors
This commit is contained in:
parent
17e78904ea
commit
7c2870b56f
|
@ -92,6 +92,10 @@ export function Graph({
|
||||||
data: {
|
data: {
|
||||||
id: cutOffLongNames(element.name),
|
id: cutOffLongNames(element.name),
|
||||||
color: colors[i] || "darkgreen",
|
color: colors[i] || "darkgreen",
|
||||||
|
labelColor:
|
||||||
|
isListOrdered && i >= listOfElementsForGraph.length - 2
|
||||||
|
? "black"
|
||||||
|
: "white",
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
});
|
});
|
||||||
|
@ -112,7 +116,7 @@ export function Graph({
|
||||||
{
|
{
|
||||||
selector: "node",
|
selector: "node",
|
||||||
style: {
|
style: {
|
||||||
padding: "25px",
|
padding: "30px",
|
||||||
shape: "round-rectangle",
|
shape: "round-rectangle",
|
||||||
content: "data(id)",
|
content: "data(id)",
|
||||||
"background-color": "data(color)",
|
"background-color": "data(color)",
|
||||||
|
@ -126,8 +130,8 @@ export function Graph({
|
||||||
selector: "node[id]",
|
selector: "node[id]",
|
||||||
style: {
|
style: {
|
||||||
label: "data(id)",
|
label: "data(id)",
|
||||||
"font-size": "11",
|
"font-size": "13",
|
||||||
color: "white",
|
color: "data(labelColor)",
|
||||||
"text-halign": "center",
|
"text-halign": "center",
|
||||||
"text-valign": "center",
|
"text-valign": "center",
|
||||||
"z-index": 1,
|
"z-index": 1,
|
||||||
|
@ -196,7 +200,7 @@ export function Graph({
|
||||||
useEffect(async () => {
|
useEffect(async () => {
|
||||||
await callEffect({ listOfElements, links, isListOrdered, mergeSortOrder });
|
await callEffect({ listOfElements, links, isListOrdered, mergeSortOrder });
|
||||||
// console.log(JSON.stringify(config, null, 10));
|
// console.log(JSON.stringify(config, null, 10));
|
||||||
}, [listOfElements, links]);
|
}, [listOfElements, links, isListOrdered]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
|
|
Loading…
Reference in New Issue
Block a user