gioser-web: fix graph widget — rect nodes, edge weight, CSS anim, layout

- Switch from circles to horizontal rounded rectangles with text inside
- Text size 12px body + 8px sublabel (camino), no overlaps
- Edge stroke-width proportional to semantic weight
- Fix 'Layout was forced' warning
- Reduce CSS page-ambience animations: only opacity (no transform)
  to fix 'breathing background' visual glitch
- Layout: more separation (k*1.6), 80 iterations
This commit is contained in:
Sergio
2026-05-23 15:12:48 +00:00
parent 8235391add
commit 529287f01d
7 changed files with 237 additions and 245 deletions
+6 -6
View File
@@ -8,13 +8,13 @@ export type InitInput = RequestInfo | URL | Response | BufferSource | WebAssembl
export interface InitOutput {
readonly memory: WebAssembly.Memory;
readonly boot: () => void;
readonly __wasm_bindgen_func_elem_218: (a: number, b: number, c: number) => void;
readonly __wasm_bindgen_func_elem_1398: (a: number, b: number, c: number, d: number) => void;
readonly __wasm_bindgen_func_elem_217: (a: number, b: number, c: number) => void;
readonly __wasm_bindgen_func_elem_1396: (a: number, b: number, c: number, d: number) => void;
readonly __wasm_bindgen_func_elem_216: (a: number, b: number, c: number) => void;
readonly __wasm_bindgen_func_elem_216_3: (a: number, b: number, c: number) => void;
readonly __wasm_bindgen_func_elem_493: (a: number, b: number, c: number) => void;
readonly __wasm_bindgen_func_elem_592: (a: number, b: number, c: number) => void;
readonly __wasm_bindgen_func_elem_287: (a: number, b: number, c: number) => void;
readonly __wasm_bindgen_func_elem_217_3: (a: number, b: number, c: number) => void;
readonly __wasm_bindgen_func_elem_494: (a: number, b: number, c: number) => void;
readonly __wasm_bindgen_func_elem_593: (a: number, b: number, c: number) => void;
readonly __wasm_bindgen_func_elem_289: (a: number, b: number, c: number) => void;
readonly __wasm_bindgen_func_elem_288: (a: number, b: number) => void;
readonly __wbindgen_export: (a: number, b: number) => number;
readonly __wbindgen_export2: (a: number, b: number, c: number, d: number) => number;
+33 -23
View File
@@ -297,10 +297,10 @@ function __wbg_get_imports() {
const ret = result;
return ret;
},
__wbg_instanceof_SvgCircleElement_b8f3b45ab1053e3e: function(arg0) {
__wbg_instanceof_SvgElement_46537942d3e1376d: function(arg0) {
let result;
try {
result = getObject(arg0) instanceof SVGCircleElement;
result = getObject(arg0) instanceof SVGElement;
} catch (_) {
result = false;
}
@@ -317,6 +317,16 @@ function __wbg_get_imports() {
const ret = result;
return ret;
},
__wbg_instanceof_SvgRectElement_f5a06e74af743100: function(arg0) {
let result;
try {
result = getObject(arg0) instanceof SVGRectElement;
} catch (_) {
result = false;
}
const ret = result;
return ret;
},
__wbg_instanceof_SvgTextElement_06345cd3cc71c951: function(arg0) {
let result;
try {
@@ -551,37 +561,37 @@ function __wbg_get_imports() {
},
__wbindgen_cast_0000000000000001: function(arg0, arg1) {
// Cast intrinsic for `Closure(Closure { owned: true, function: Function { arguments: [Externref], shim_idx: 176, ret: Result(Unit), inner_ret: Some(Result(Unit)) }, mutable: true }) -> Externref`.
const ret = makeMutClosure(arg0, arg1, __wasm_bindgen_func_elem_1396);
const ret = makeMutClosure(arg0, arg1, __wasm_bindgen_func_elem_1398);
return addHeapObject(ret);
},
__wbindgen_cast_0000000000000002: function(arg0, arg1) {
// Cast intrinsic for `Closure(Closure { owned: true, function: Function { arguments: [F64], shim_idx: 2, ret: Unit, inner_ret: Some(Unit) }, mutable: true }) -> Externref`.
const ret = makeMutClosure(arg0, arg1, __wasm_bindgen_func_elem_217);
const ret = makeMutClosure(arg0, arg1, __wasm_bindgen_func_elem_218);
return addHeapObject(ret);
},
__wbindgen_cast_0000000000000003: function(arg0, arg1) {
// Cast intrinsic for `Closure(Closure { owned: true, function: Function { arguments: [NamedExternref("Event")], shim_idx: 6, ret: Unit, inner_ret: Some(Unit) }, mutable: true }) -> Externref`.
const ret = makeMutClosure(arg0, arg1, __wasm_bindgen_func_elem_216);
const ret = makeMutClosure(arg0, arg1, __wasm_bindgen_func_elem_217);
return addHeapObject(ret);
},
__wbindgen_cast_0000000000000004: function(arg0, arg1) {
// Cast intrinsic for `Closure(Closure { owned: true, function: Function { arguments: [NamedExternref("KeyboardEvent")], shim_idx: 6, ret: Unit, inner_ret: Some(Unit) }, mutable: true }) -> Externref`.
const ret = makeMutClosure(arg0, arg1, __wasm_bindgen_func_elem_216_3);
const ret = makeMutClosure(arg0, arg1, __wasm_bindgen_func_elem_217_3);
return addHeapObject(ret);
},
__wbindgen_cast_0000000000000005: function(arg0, arg1) {
// Cast intrinsic for `Closure(Closure { owned: true, function: Function { arguments: [NamedExternref("MouseEvent")], shim_idx: 137, ret: Unit, inner_ret: Some(Unit) }, mutable: true }) -> Externref`.
const ret = makeMutClosure(arg0, arg1, __wasm_bindgen_func_elem_493);
const ret = makeMutClosure(arg0, arg1, __wasm_bindgen_func_elem_494);
return addHeapObject(ret);
},
__wbindgen_cast_0000000000000006: function(arg0, arg1) {
// Cast intrinsic for `Closure(Closure { owned: true, function: Function { arguments: [NamedExternref("MouseEvent")], shim_idx: 170, ret: Unit, inner_ret: Some(Unit) }, mutable: true }) -> Externref`.
const ret = makeMutClosure(arg0, arg1, __wasm_bindgen_func_elem_592);
const ret = makeMutClosure(arg0, arg1, __wasm_bindgen_func_elem_593);
return addHeapObject(ret);
},
__wbindgen_cast_0000000000000007: function(arg0, arg1) {
// Cast intrinsic for `Closure(Closure { owned: true, function: Function { arguments: [NamedExternref("PointerEvent")], shim_idx: 67, ret: Unit, inner_ret: Some(Unit) }, mutable: true }) -> Externref`.
const ret = makeMutClosure(arg0, arg1, __wasm_bindgen_func_elem_287);
const ret = makeMutClosure(arg0, arg1, __wasm_bindgen_func_elem_289);
return addHeapObject(ret);
},
__wbindgen_cast_0000000000000008: function(arg0, arg1) {
@@ -617,30 +627,30 @@ function __wasm_bindgen_func_elem_288(arg0, arg1) {
wasm.__wasm_bindgen_func_elem_288(arg0, arg1);
}
function __wasm_bindgen_func_elem_216(arg0, arg1, arg2) {
wasm.__wasm_bindgen_func_elem_216(arg0, arg1, addHeapObject(arg2));
function __wasm_bindgen_func_elem_217(arg0, arg1, arg2) {
wasm.__wasm_bindgen_func_elem_217(arg0, arg1, addHeapObject(arg2));
}
function __wasm_bindgen_func_elem_216_3(arg0, arg1, arg2) {
wasm.__wasm_bindgen_func_elem_216_3(arg0, arg1, addHeapObject(arg2));
function __wasm_bindgen_func_elem_217_3(arg0, arg1, arg2) {
wasm.__wasm_bindgen_func_elem_217_3(arg0, arg1, addHeapObject(arg2));
}
function __wasm_bindgen_func_elem_493(arg0, arg1, arg2) {
wasm.__wasm_bindgen_func_elem_493(arg0, arg1, addHeapObject(arg2));
function __wasm_bindgen_func_elem_494(arg0, arg1, arg2) {
wasm.__wasm_bindgen_func_elem_494(arg0, arg1, addHeapObject(arg2));
}
function __wasm_bindgen_func_elem_592(arg0, arg1, arg2) {
wasm.__wasm_bindgen_func_elem_592(arg0, arg1, addHeapObject(arg2));
function __wasm_bindgen_func_elem_593(arg0, arg1, arg2) {
wasm.__wasm_bindgen_func_elem_593(arg0, arg1, addHeapObject(arg2));
}
function __wasm_bindgen_func_elem_287(arg0, arg1, arg2) {
wasm.__wasm_bindgen_func_elem_287(arg0, arg1, addHeapObject(arg2));
function __wasm_bindgen_func_elem_289(arg0, arg1, arg2) {
wasm.__wasm_bindgen_func_elem_289(arg0, arg1, addHeapObject(arg2));
}
function __wasm_bindgen_func_elem_1396(arg0, arg1, arg2) {
function __wasm_bindgen_func_elem_1398(arg0, arg1, arg2) {
try {
const retptr = wasm.__wbindgen_add_to_stack_pointer(-16);
wasm.__wasm_bindgen_func_elem_1396(retptr, arg0, arg1, addHeapObject(arg2));
wasm.__wasm_bindgen_func_elem_1398(retptr, arg0, arg1, addHeapObject(arg2));
var r0 = getDataViewMemory0().getInt32(retptr + 4 * 0, true);
var r1 = getDataViewMemory0().getInt32(retptr + 4 * 1, true);
if (r1) {
@@ -651,8 +661,8 @@ function __wasm_bindgen_func_elem_1396(arg0, arg1, arg2) {
}
}
function __wasm_bindgen_func_elem_217(arg0, arg1, arg2) {
wasm.__wasm_bindgen_func_elem_217(arg0, arg1, arg2);
function __wasm_bindgen_func_elem_218(arg0, arg1, arg2) {
wasm.__wasm_bindgen_func_elem_218(arg0, arg1, arg2);
}
function addHeapObject(obj) {
Binary file not shown.
+6 -6
View File
@@ -2,13 +2,13 @@
/* eslint-disable */
export const memory: WebAssembly.Memory;
export const boot: () => void;
export const __wasm_bindgen_func_elem_218: (a: number, b: number, c: number) => void;
export const __wasm_bindgen_func_elem_1398: (a: number, b: number, c: number, d: number) => void;
export const __wasm_bindgen_func_elem_217: (a: number, b: number, c: number) => void;
export const __wasm_bindgen_func_elem_1396: (a: number, b: number, c: number, d: number) => void;
export const __wasm_bindgen_func_elem_216: (a: number, b: number, c: number) => void;
export const __wasm_bindgen_func_elem_216_3: (a: number, b: number, c: number) => void;
export const __wasm_bindgen_func_elem_493: (a: number, b: number, c: number) => void;
export const __wasm_bindgen_func_elem_592: (a: number, b: number, c: number) => void;
export const __wasm_bindgen_func_elem_287: (a: number, b: number, c: number) => void;
export const __wasm_bindgen_func_elem_217_3: (a: number, b: number, c: number) => void;
export const __wasm_bindgen_func_elem_494: (a: number, b: number, c: number) => void;
export const __wasm_bindgen_func_elem_593: (a: number, b: number, c: number) => void;
export const __wasm_bindgen_func_elem_289: (a: number, b: number, c: number) => void;
export const __wasm_bindgen_func_elem_288: (a: number, b: number) => void;
export const __wbindgen_export: (a: number, b: number) => number;
export const __wbindgen_export2: (a: number, b: number, c: number, d: number) => number;
+13 -10
View File
@@ -237,21 +237,21 @@ body.deck-active-tierra .deck { --deck-glow: rgba(212, 152, 115, 0.24); }
radial-gradient(circle at 18% 22%, rgba(208, 219, 255, 0.20), transparent 38%),
radial-gradient(circle at 78% 68%, rgba(208, 219, 255, 0.14), transparent 40%),
radial-gradient(circle at 45% 90%, rgba(180, 200, 255, 0.10), transparent 45%);
animation: aire-drift 28s ease-in-out infinite alternate;
animation: aire-drift 45s ease-in-out infinite alternate;
}
.deck-page[data-element="fuego"] .page-ambience {
background:
radial-gradient(circle at 50% 100%, rgba(245, 144, 86, 0.35), transparent 55%),
radial-gradient(circle at 25% 80%, rgba(255, 90, 40, 0.18), transparent 35%),
radial-gradient(circle at 80% 85%, rgba(255, 140, 60, 0.18), transparent 35%);
animation: fuego-flicker 5s ease-in-out infinite;
animation: fuego-flicker 12s ease-in-out infinite;
}
.deck-page[data-element="agua"] .page-ambience {
background:
radial-gradient(ellipse at 50% 95%, rgba(60, 160, 230, 0.30), transparent 60%),
radial-gradient(ellipse at 20% 70%, rgba(108, 208, 243, 0.15), transparent 50%),
radial-gradient(ellipse at 80% 75%, rgba(108, 208, 243, 0.12), transparent 50%);
animation: agua-tide 14s ease-in-out infinite alternate;
animation: agua-tide 30s ease-in-out infinite alternate;
}
.deck-page[data-element="tierra"] .page-ambience {
background:
@@ -259,18 +259,21 @@ body.deck-active-tierra .deck { --deck-glow: rgba(212, 152, 115, 0.24); }
radial-gradient(ellipse at 22% 88%, rgba(180, 130, 80, 0.20), transparent 45%),
radial-gradient(ellipse at 78% 88%, rgba(150, 100, 60, 0.22), transparent 45%);
}
/* Animaciones sutiles — solo opacidad, sin desplazamiento visible.
El movimiento (transform) del fondo causaba un "respiro" molesto
al abrir el deck. */
@keyframes aire-drift {
from { transform: translate(-4%, -1%); }
to { transform: translate(4%, 2%); }
from { opacity: 0.60; }
to { opacity: 0.90; }
}
@keyframes fuego-flicker {
0%, 100% { opacity: 0.85; transform: scaleY(1.00); }
35% { opacity: 1.00; transform: scaleY(1.04); }
60% { opacity: 0.92; transform: scaleY(0.98); }
0%, 100% { opacity: 0.65; }
35% { opacity: 0.90; }
60% { opacity: 0.75; }
}
@keyframes agua-tide {
from { transform: translateY(0); }
to { transform: translateY(-3%); }
from { opacity: 0.55; }
to { opacity: 0.85; }
}
/* Head + controls */