Django - как предоставить Javascript информацию о таблице для создания сетевого Графа?

У меня есть модель, которая хранит статистику сети, включая узлы. Я хочу отобразить эту статистику в HTML. Вот моя таблица

interfaceModel

Interface   IPaddress       Hostname
AE1         1.1.1.1              A
AE1         2.2.2.2              B
AE2         3.3.3.3              C
AE2         4.4.4.4              D
AE3         5.5.5.5              E
AE3         6.6.6.6              F

Я использую highcahrts Network Graph для построения сетевого графика https://www.highcharts.com/blog/tutorials/network-graph/

Вот код, который отображает следующий демонстрационный график

    <style>
    #container {
        background: #1f1f1f;
        min-width: 320px;
        max-width: 500px;
        margin: 0 auto;
        height: 500px;
      } 
</style>  
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/networkgraph.js"></script>
<div id="container"></div>
<script>

Highcharts.chart('container', {
    chart: {
      type: 'networkgraph',
      marginTop: 80
    },
    title: {
      text: 'Network graph'
    },
    plotOptions: {
      networkgraph: {
        keys: ['from', 'to'],
      }
    },
    series: [{
      marker: {
        radius: 30
      },
      dataLabels: {
        enabled: true,
        linkFormat: '',
        allowOverlap: true
      },
      data: [
        ['Node 1', 'Node 2'],
        ['Node 1', 'Node 3'],
        ['Node 1', 'Node 4'],
        ['Node 4', 'Node 5'],
        ['Node 2', 'Node 5']
      ]
    }]
  });

</script>

Как я могу заменить данные в массиве данных JS, зацикливаясь от имени хоста моей базы данных Interfacedatabase? Это прямое одиночное прямое соединение без межсоединений A>B>C>D>E>F

данные должны выглядеть примерно следующим образом

      data: [
            [A, B],
            [B, C],
            [C, D],
            [D, E],
            [E, F]
}

@register.filter
def next(some_list, current_index):
    """
    Returns the next element of the list using the current index if it exists.
    Otherwise returns an empty string.
    """
    try:
        return some_list[int(current_index) + 1]  # access the next element
    except:
        return ''

data: [
{% for d in interfaceModel %}
 {% if not forloop.last %}
  {% with next_d=interfaceModel|next:forloop.counter %}
   ['{{ d.hostname }}' ,'{{next_d.hostname}}'],
  {% endwith %}
 {% endif %}
{% endfor %}
]

    var first = 0;
    var second = 1;
    firstlist = [];
    secondlist = [];
    {% for x in lspinterfacesfilter %}
    var a = "{{x.lspinterfacehostnamedb}}";
    firstlist.push(a);
    {% endfor %}
    const res = [];
    for (let i = 0; i < firstlist.length; i += 2) {
        const chunk = firstlist.slice(i, i + 2);
        res.push(chunk);
    }
    res.reverse();