javascript - Flask，python字典到highcharts JS图

Question

我有一个 flask 网络应用程序。在此应用程序中，我调用“bar.htm”

返回 render_template('bar.htm', mapping=mapping)

其中映射是一个字典，如:

mapping = {'jack': 4098, 'sape': 4139}

现在我想在 Highcharts 条形图中使用这本词典。带有示例数据的条形图如下所示: http://jsfiddle.net/gh/get/jquery/1.9.1/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/column-rotated-labels/

(链接到代码以防止大问题)

如何在这个 JS 文件中实现我自己的字典？ Highcharts 的数据部分是这样的:

系列:[{
名称:'人口'，
data: [<- 这是变量映射应该来的地方
['上海', 23.7],
['拉各斯', 16.1],
['Instanbul', 14.2],
['卡拉奇', 14.0],
['孟买', 12.5],
['莫斯科', 12.1]
]

Answer 1

在您的 Python View 中:

mapping = [
    ['Shanghai', 23.7],
    ['Lagos', 16.1],
    ['Instanbul', 14.2],
    ['Karachi', 14.0],
    ['Mumbai', 12.5],
    ['Moscow', 12.1],
    ['Sao Paulo', 11.8],
    ['Beijing', 11.7],
    ['Guangzhou', 11.1],
    ['Delhi', 11.1],
    ['Shenzhen', 10.5],
    ['Seoul', 10.4],
    ['Jakarta', 10.0],
    ['Kinshasa', 9.3],
    ['Tianjin', 9.3],
    ['Tokyo', 9.0],
    ['Cairo', 8.9],
    ['Dhaka', 8.9],
    ['Mexico City', 8.9],
    ['Lima', 8.9]
]
return render_template('page.html', mapping=mapping)

和 HTML:

...
series: [{
    name: 'Population',
    data: {{ mapping|safe }},
    dataLabels: {
        ...

将 mapping 定义为列表的列表，然后使用 safe 过滤器将其传递给模板。