Python dictionary in a JavaScript function (inside HTML)

Hey!

So I have a Python function (Django project) and it sends a dictionary into a JavaScript function inside HTML file. In JavaScript script (...) I should print key and it's value. I tried this:

<script type="text/javascript">
      google.charts.load('current', {'packages':['table']});
      google.charts.setOnLoadCallback(drawTable);
      var test = "";

      const key1 = Object.keys(test)[0];
      top1 = test[key1];

      document.getElementById("demo").innerHTML =key1
      function drawTable() {
        var data = new google.visualization.DataTable();
        data.addColumn('string', 'Name');
        data.addColumn('number', 'Messages Amount');

        data.addRows([
          [key1,  {v: top1, f:top1}],

          ['Alice', {v: 12500, f: '$12,500'}], // I have to make it like this, but just with my keys and values
          ['Bob',   {v: 7000,  f: '$7,000'}]
        ]);

        var table = new google.visualization.Table(document.getElementById('table_div'));

        table.draw(data, {showRowNumber: true, width: '100%', height: '100%'});
      }
    </script>

When I print top1 on a page it returns a char from test dictionary. I don't understand why js think that's a string, not a list. Maybe I should convert it somehow?