Edge Label Example not Working

[canerkoroglu]

Hello, i've integrated grpah into my app successfully but i can't show edge labels correctly. Even basic code which is shared at below don't show the edge label. Where did i make mistake?

`
<v-network-graph
:nodes="nodes"
:edges="edges"
:layouts="layouts"
:configs="configs"

<template #edge-label="{ edge, ...slotProps }">
  <v-edge-label :text="edge.label" align="center" vertical-align="above" v-bind="slotProps" />
</template>

<style scoped> .graph { width: 90%; margin: auto; height: 70vh; border: 1px dashed #999; border-radius: 10px; } </style> <script> import { defineConfigs } from "v-network-graph"; import * as vNG from "v-network-graph"; const nodes = { node1: { name: "Node 1" }, node2: { name: "Node 2" }, node3: { name: "Node 3" }, node4: { name: "Node 4" }, }; const edges = { edge1: { source: "node1", target: "node2", label: "1 Gbps" }, edge2: { source: "node2", target: "node3", label: "100 Mbps" }, edge3: { source: "node2", target: "node4", label: "100 Mbps" }, }; const configs = defineConfigs({ node: { label: { visible: false, }, }, }); const layouts = { nodes: { node1: { x: 0, y: 80 }, node2: { x: 200, y: 80 }, node3: { x: 360, y: 0 }, node4: { x: 360, y: 160 }, }, }; export default { name: "PageGraph.vue", components: { "v-network-graph": vNG.VNetworkGraph, }, data: () => ({ configs: configs, nodes: nodes, edges: edges, layouts: layouts }), } </script>`

after rendered config and area attributes couldnt populated automatically.

<v-edge-label data-v-05befdc2="" class="" text="ETH" edgeId="edge0" scale="1" config="[object Object]" area="[object Object]" align="center" test="1234" vertical-align="above"></v-edge-label>

[canerkoroglu]

I've found the problem,

forgot to define v-edge-label component in main vue export:

components: { "app-header": AppHeader, "app-footer": AppFooter, "app-theme-settings": AppThemeSettings, "v-network-graph": vNG.VNetworkGraph, "v-edge-label": vNG.VEdgeLabel },