將HTML變量傳遞給單獨的javascript文件

-1

我在我的html文件中有一個名爲「sentiments」的字典（由python類發送）。以下：將HTML變量傳遞給單獨的javascript文件

{% if sentiments %} 
    <p>{{sentiments}}</p> 
{% else %} 
    <p>none</p> 
{%endif%}

打印：

('very positive', 34) 
('positive', 64) 
('neutral', 44) 
('negative', 11) 
('very negative', 27)

所以我知道這是工作的罰款。在一個單獨的JavaScript文件，我有一個硬編碼值的莫里斯柱狀圖如下：

Morris.Bar({ 
    element: 'bar-chart', 
    data: [ 
     { x: 'V. Pos', y: 10}, 
     { x: 'Pos', y: 20}, 
     { x: 'Neutral', y: 30}, 
     { x: 'Neg', y: 20}, 
     { x: 'V.Neg', y: 10}, 
    ], 

    xkey: 'x', 
    ykeys: ['y'], 
    labels: ['# Tweets'], 
    barColors: function (row, series, type) { 
     console.log("--> "+row.label, series, type); 
     if(row.label == "V. Pos") return "#3300FF"; 
     else if(row.label == "Pos") return "#6600FF"; 
     else if(row.label == "Neutral") return "#9900FF"; 
     else if(row.label == "Neg") return "#FF3333"; 
     else return "#ff0000"; 
    } 
});

我打電話這個腳本如下：

<div class="bar"; style="float:left; width:50%;"> 
    <div id="bar-chart"></div> 
    <script src="../static/barchart.js"></script> 
</div>

我想通過我的字典「情緒「，並使用其中的值填充圖表，而不是現在的硬編碼值。任何幫助將非常感激。我使用Flask連接我的Python和HTML。

來源

2017-04-04 Aine

您可以通過執行轉錄變量JS：

<body> 
 
    <script> 
 
    var myData = JSON.parse('{{sentiments_str | safe}}') 
 
    </script> 
 
</body>

渲染頁面時，確保在sentiments通過使用json.dumps，如：

return render_template('page.html', sentiments_str=json.dumps(sentiments))

來源

2017-04-04 15:50:21

燦你請解釋downvote？ –

感謝您的回答。我嘗試這樣做，現在這行： VAR sentiments_dict = {{sentiments_str}} 是給我的錯誤：「表達式語句不是轉讓或叫」 – Aine

我做了一些改變，嘗試這些。 –

將HTML變量傳遞給單獨的javascript文件

回答

相關問題