Вставка ключа / значений словаря Python в списки JavaScript с помощью Jinja / Flask - PullRequest
0 голосов
/ 13 мая 2019

Я использую ChartJ для отображения некоторых данных, моя диаграмма определяется следующим образом:

var myChart = new Chart(ctx1, {
       type: 'pie',
       data: {
           labels: ['label1', 'label2', 'label3', 'label4'],
           datasets: [{
               label: 'Chart 1',
               data: [12, 19, 100, 5],
               backgroundColor: [
                   'rgba(255, 99, 132, 1)',
                   'rgba(54, 162, 235, 1)',
                   'rgba(255, 206, 86, 1)',
                   'rgba(75, 192, 192, 1)',
               ],
               borderColor: [
                   'rgba(255, 99, 132, 1)',
                   'rgba(54, 162, 235, 1)',
                   'rgba(255, 206, 86, 1)',
                   'rgba(75, 192, 192, 1)',
               ],
               borderWidth: 1
           }]
       },
       options: {
       }
   });

Переменная label Я хотел бы заполнить ключами из словаря Python

chart_data = {'A':10, 'B':5, 'C':7, 'D':15}

и переменная data, заполненная значениями словаря, поэтому в моем javascript получится:

           labels: ['A', 'B', 'C', 'D'],
           datasets: [{
               label: 'Chart 1',
               data: [10, 5, 7, 15],

Я просто не уверен, как перебрать словарь с помощью Jinjaтолько возвращать ключи и только возвращать значения в список JavaScript.

Могу ли я использовать цикл Jinja for / для итерации внутри списка javascript?Кажется, он не работает

some_js_var = [{% for x in y %} {{ x }} {% endfor %}]

1 Ответ

0 голосов
/ 13 мая 2019

Я назначил свой словарь Python переменной JS следующим образом:

var data_from_python = {{ python_dict|tojson }}

Затем просто назначьте ключи переменной в виде списка:

labels: Object.keys(data_from_python),

и те же значенияв данных

data: Object.values(data_from_python)

В итоге я получаю

labels: ['A', 'B', 'C', 'D']
data: [10, 5, 7, 15]
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...