codeout/inet-henge

POP optional variable

Closed this issue · 6 comments

Hi,

Is it possible to add "meta" with "pop" option instead of using POP parsing from node name? Currently when adding WAN circuits with "Clouds" and ISP names it makes it look very messy.

Thank you.

Hi,

Have you tried internal groups without POP parsing? It will generate something like this.

Thanks for getting back so quick, do I need to pass anything special to "Diagram" function? Doesn't seem to work :(

do I need to pass anything special to "Diagram" function?

No, you don't. If you can send me your .js and .json, I'll try in my environment.

JS file is unmodified version of yours. Topology file:

{ "nodes": [ { "name": "core01-drt-lon", "icon": "https://cdn2.iconfinder.com/data/icons/networking-icons-1/128/networking_icons-01.png", "meta": { "loopback": "100.64.1.203", "group": "LON" } }, { "name": "spine01-drt-lon", "icon": "https://cdn2.iconfinder.com/data/icons/networking-icons-1/128/networking_icons-01.png", "meta": { "loopback": "10.2.255.11", "group": "LON" } }, { "name": "core01-drt-red", "icon": "https://cdn2.iconfinder.com/data/icons/networking-icons-1/128/networking_icons-01.png", "meta": { "loopback": "100.64.1.205", "group": "RED" } }, { "name": "core02-drt-lon", "icon": "https://cdn2.iconfinder.com/data/icons/networking-icons-1/128/networking_icons-01.png", "meta": { "loopback": "100.64.1.202", "group": "LON" } }, { "name": "per01-drt-lon", "icon": "https://cdn2.iconfinder.com/data/icons/networking-icons-1/128/networking_icons-01.png", "meta": { "loopback": "100.64.1.228", "group": "LON" } }, { "name": "ibr01-drt-lon", "icon": "https://cdn2.iconfinder.com/data/icons/networking-icons-1/128/networking_icons-01.png", "meta": { "loopback": "100.64.1.229", "group": "LON" } }, { "name": "core01-nd4-nrt", "icon": "https://cdn2.iconfinder.com/data/icons/networking-icons-1/128/networking_icons-01.png", "meta": { "loopback": "100.64.1.207", "group": "NRT" } }, { "name": "core02-drt-red", "icon": "https://cdn2.iconfinder.com/data/icons/networking-icons-1/128/networking_icons-01.png", "meta": { "loopback": "100.64.1.204", "group": "RED" } }, { "name": "spine01-drt-red", "icon": "https://cdn2.iconfinder.com/data/icons/networking-icons-1/128/networking_icons-01.png", "meta": { "loopback": "10.1.255.11", "group": "RED" } }, { "name": "core02-nd4-nrt", "icon": "https://cdn2.iconfinder.com/data/icons/networking-icons-1/128/networking_icons-01.png", "meta": { "loopback": "100.64.1.206", "group": "NRT" } }, { "name": "ibr01-drt-red", "icon": "https://cdn2.iconfinder.com/data/icons/networking-icons-1/128/networking_icons-01.png", "meta": { "loopback": "100.64.1.239", "group": "RED" } }, { "name": "per01-drt-red", "icon": "https://cdn2.iconfinder.com/data/icons/networking-icons-1/128/networking_icons-01.png", "meta": { "loopback": "100.64.1.238", "group": "RED" } }, { "name": "spine01-nd4-nrt", "icon": "https://cdn2.iconfinder.com/data/icons/networking-icons-1/128/networking_icons-01.png", "meta": { "loopback": "10.3.255.11", "group": "NRT" } }, { "name": "ibr01-nd4-nrt", "icon": "https://cdn2.iconfinder.com/data/icons/networking-icons-1/128/networking_icons-01.png", "meta": { "loopback": "100.64.1.219", "group": "NRT" } }, { "name": "per01-nd4-nrt", "icon": "https://cdn2.iconfinder.com/data/icons/networking-icons-1/128/networking_icons-01.png", "meta": { "loopback": "100.64.1.218", "group": "NRT" } }, { "name": "edge01-drt-lon", "icon": "https://cdn2.iconfinder.com/data/icons/networking-icons-1/128/networking_icons-01.png", "meta": { "loopback": null, "group": "LON" } }, { "name": "colo01-drt-lon", "icon": "https://cdn2.iconfinder.com/data/icons/networking-icons-1/128/networking_icons-01.png", "meta": { "loopback": null, "group": "LON" } }, { "name": "edge01-nd4-nrt", "icon": "https://cdn2.iconfinder.com/data/icons/networking-icons-1/128/networking_icons-01.png", "meta": { "loopback": null, "group": "NRT" } }, { "name": "colo01-nd4-nrt", "icon": "https://cdn2.iconfinder.com/data/icons/networking-icons-1/128/networking_icons-01.png", "meta": { "loopback": null, "group": "NRT" } }, { "name": "edge01-drt-red", "icon": "https://cdn2.iconfinder.com/data/icons/networking-icons-1/128/networking_icons-01.png", "meta": { "loopback": null, "group": "RED" } }, { "name": "colo02-drt-red", "icon": "https://cdn2.iconfinder.com/data/icons/networking-icons-1/128/networking_icons-01.png", "meta": { "loopback": null, "group": "RED" } }, { "name": "colo01-drt-red", "icon": "https://cdn2.iconfinder.com/data/icons/networking-icons-1/128/networking_icons-01.png", "meta": { "loopback": null, "group": "RED" } }, { "name": "br01-leaf-nd4-nrt", "icon": "https://cdn2.iconfinder.com/data/icons/networking-icons-1/128/networking_icons-01.png", "meta": { "loopback": null, "group": "NRT" } }, { "name": "br01-leaf-drt-red", "icon": "https://cdn2.iconfinder.com/data/icons/networking-icons-1/128/networking_icons-01.png", "meta": { "loopback": null, "group": "RED" } }, ], "links": [ { "source": "core01-drt-lon", "target": "spine01-drt-lon" }, { "source": "core01-drt-lon", "target": "core01-drt-red" }, { "source": "core01-drt-lon", "target": "core02-drt-lon" }, { "source": "core01-drt-lon", "target": "per01-drt-lon" }, { "source": "core01-drt-lon", "target": "ibr01-drt-lon" }, { "source": "core02-drt-lon", "target": "spine01-drt-lon" }, { "source": "core02-drt-lon", "target": "core01-nd4-nrt" }, { "source": "core02-drt-lon", "target": "per01-drt-lon" }, { "source": "core02-drt-lon", "target": "ibr01-drt-lon" }, { "source": "core02-drt-red", "target": "spine01-drt-red" }, { "source": "core02-drt-red", "target": "core01-drt-red" }, { "source": "core02-drt-red", "target": "core02-nd4-nrt" }, { "source": "core02-drt-red", "target": "ibr01-drt-red" }, { "source": "core02-drt-red", "target": "per01-drt-red" }, { "source": "core01-drt-red", "target": "spine01-drt-red" }, { "source": "core01-drt-red", "target": "core01-nd4-nrt" }, { "source": "core01-drt-red", "target": "ibr01-drt-red" }, { "source": "core01-drt-red", "target": "per01-drt-red" }, { "source": "core01-nd4-nrt", "target": "spine01-nd4-nrt" }, { "source": "core01-nd4-nrt", "target": "core02-nd4-nrt" }, { "source": "core01-nd4-nrt", "target": "ibr01-nd4-nrt" }, { "source": "core01-nd4-nrt", "target": "per01-nd4-nrt" }, { "source": "core02-nd4-nrt", "target": "spine01-nd4-nrt" }, { "source": "core02-nd4-nrt", "target": "ibr01-nd4-nrt" }, { "source": "core02-nd4-nrt", "target": "per01-nd4-nrt" }, { "source": "edge01-drt-lon", "target": "colo01-drt-lon" }, { "source": "edge01-drt-lon", "target": "edge01-drt-lon" }, { "source": "edge01-drt-lon", "target": "per01-drt-lon" }, { "source": "edge01-drt-lon", "target": "spine01-drt-lon" }, { "source": "edge01-nd4-nrt", "target": "per01-nd4-nrt" }, { "source": "edge01-nd4-nrt", "target": "edge01-nd4-nrt" }, { "source": "edge01-nd4-nrt", "target": "spine01-nd4-nrt" }, { "source": "edge01-nd4-nrt", "target": "colo01-nd4-nrt" }, { "source": "edge01-drt-red", "target": "colo02-drt-red" }, { "source": "edge01-drt-red", "target": "edge01-drt-red" }, { "source": "edge01-drt-red", "target": "per01-drt-red" }, { "source": "edge01-drt-red", "target": "spine01-drt-red" }, { "source": "edge01-drt-red", "target": "colo01-drt-red" }, { "source": "spine01-drt-lon", "target": "spine01-drt-lon" }, { "source": "spine01-drt-lon", "target": "edge01-drt-lon" }, { "source": "spine01-drt-lon", "target": "core01-drt-lon" }, { "source": "spine01-drt-lon", "target": "core02-drt-lon" }, { "source": "spine01-nd4-nrt", "target": "spine01-nd4-nrt" }, { "source": "spine01-nd4-nrt", "target": "edge01-nd4-nrt" }, { "source": "spine01-nd4-nrt", "target": "br01-leaf-nd4-nrt" }, { "source": "spine01-nd4-nrt", "target": "core01-nd4-nrt" }, { "source": "spine01-nd4-nrt", "target": "core02-nd4-nrt" }, { "source": "spine01-drt-red", "target": "br01-leaf-drt-red" }, { "source": "spine01-drt-red", "target": "spine01-drt-red" }, { "source": "spine01-drt-red", "target": "edge01-drt-red" }, { "source": "spine01-drt-red", "target": "core01-drt-red" }, { "source": "spine01-drt-red", "target": "core02-drt-red" }, { "source": "br01-leaf-drt-red", "target": "br01-leaf-drt-red" }, { "source": "br01-leaf-drt-red", "target": "spine01-drt-red" }, { "source": "br01-leaf-drt-red", "target": "ibr01-drt-red" }, { "source": "br01-leaf-drt-red", "target": "per01-drt-red" }, { "source": "br01-leaf-nd4-nrt", "target": "br01-leaf-nd4-nrt" }, { "source": "br01-leaf-nd4-nrt", "target": "ibr01-nd4-nrt" }, { "source": "br01-leaf-nd4-nrt", "target": "per01-nd4-nrt" }, { "source": "br01-leaf-nd4-nrt", "target": "spine01-nd4-nrt" }, ] }

You just need to put group out of meta.

  "nodes": [
    {
      "name": "core01-drt-lon",
      "icon": "https://cdn2.iconfinder.com/data/icons/networking-icons-1/128/networking_icons-01.png",
      "group": "LON",
      "meta": {
        "loopback": "100.64.1.203"
      }
    },

image

sorry my bad, need new glasses :D